|
@@ -0,0 +1,410 @@
|
|
|
+<template>
|
|
|
+ <el-dialog :visible.sync="dialogDaliy" width="70vw" class="public_task report-dialog" :title="reportHome ? title : `创建${title}模版`" :close-on-click-modal="false" :destroy-on-close="true" :before-close="handleClose">
|
|
|
+ <div v-if="reportHome" class="blueStripe" />
|
|
|
+ <i v-if="!reportHome" class="el-icon-arrow-left report-return didi-hover" @click="reportReturn" />
|
|
|
+
|
|
|
+ <el-steps v-if="reportHome" :active="active" align-center finish-status="success" class="report-steps">
|
|
|
+ <el-step title="选择模版" />
|
|
|
+ <el-step title="填写报告" />
|
|
|
+ <el-step title="发送报告" />
|
|
|
+ </el-steps>
|
|
|
+
|
|
|
+ <div class="report-leftRight">
|
|
|
+ <div v-if="showOne" style="min-height: 50vh;">
|
|
|
+ <el-row type="flex" class="row-bg" justify="center">
|
|
|
+ <el-col :span="19" class="creator">模版名称</el-col>
|
|
|
+ <el-col :span="5" class="creator">创建人</el-col>
|
|
|
+ </el-row>
|
|
|
+ <el-row v-for="(item, index) in reportModel" :key="index" type="flex" class="row-bg" justify="center">
|
|
|
+ <el-col :span="19">
|
|
|
+ <el-radio v-model="fromData.radio" class="creatorList" :label="item.id" @change="selectRepot(item.id)">{{ item.moduleName }}</el-radio>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="5" class="creatorList">{{ item.creatorObject.name }}</el-col>
|
|
|
+ </el-row>
|
|
|
+
|
|
|
+ <div ref="refName" style="max-height: 260px; overflow:scroll; overflow-x: hidden">
|
|
|
+ <el-row v-for="(item, index) in selectTemplate" :key="index" type="flex" class="row-bg" justify="center" @mouseover.native="item.operation = true" @mouseleave.native="item.operation = false">
|
|
|
+ <el-col :span="19">
|
|
|
+ <el-radio v-model="fromData.radio" class="creatorList" :label="item.id" @change="selectRepot(item.id)">{{ item.moduleName }}</el-radio>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="5" class="creatorList">
|
|
|
+ {{ item.creatorObject.name }}
|
|
|
+ <span class="operation">
|
|
|
+ <i class="el-icon-edit-outline didi-hover" @click="open_new_template(item)" />
|
|
|
+ <el-popover :ref="item.id" placement="bottom" width="300" trigger="click">
|
|
|
+ <div><div class="blur-column" /> 删除模版</div>
|
|
|
+ <div class="blueStripe" />
|
|
|
+ <div class="deletreport">是否要删除模版{{ item.moduleName }}?</div>
|
|
|
+ <div style="text-align: right; margin: 0">
|
|
|
+ <el-button size="mini" type="danger" @click="settingDeleteReportModule(item)">确定</el-button>
|
|
|
+ <el-button size="mini" @click="closeDefaultPopover()">取消</el-button>
|
|
|
+ </div>
|
|
|
+ <i slot="reference" class="el-icon-delete reportModel didi-hover" />
|
|
|
+ </el-popover>
|
|
|
+ </span>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </div>
|
|
|
+ <el-row type="flex" class="row-bg" justify="center">
|
|
|
+ <el-col :span="24">
|
|
|
+ <span class="didi-hover" @click="open_new_template()"><i class="el-icon-circle-plus-outline creatorList didi-hover" /> <span style="margin-left: 8px">新建模版</span></span>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!-- new模版 -->
|
|
|
+ <newReportTemplate v-if="reportTamplate" ref="newReportTemplate" class="daily" :template-id="templateId" @getreportTemplate="getreportTemplate" @reportReturn="reportReturn" />
|
|
|
+ <!-- new模版 -->
|
|
|
+
|
|
|
+ <!-- 新建日报模版 -->
|
|
|
+ <dailyTemplate v-if="newDailyTemplate" ref="dailyTemplate" class="daily" :model-id="fromData.radio" :task-ids="daily_taskIds" @SaveNextStep="SaveNextStep" />
|
|
|
+ <!-- 新建日报模版 -->
|
|
|
+
|
|
|
+ <!-- 日报预览 -->
|
|
|
+ <dailyPreview v-if="dailyPreview" ref="dailyPreview" class="daily" :daily-id="dailyId" @handleClose="handleClose" />
|
|
|
+ <!-- 日报预览 -->
|
|
|
+ </div>
|
|
|
+ <div slot="footer" class="dialog-footer" align="center">
|
|
|
+ <!-- 新建模版 -->
|
|
|
+ <el-button v-if="reportTamplate" size="small" type="primary" @click="created_out()">保存</el-button>
|
|
|
+ <!-- 第一步 -->
|
|
|
+ <el-button v-if="showOne" size="small" type="primary" @click="NextStep()">下一步</el-button>
|
|
|
+ <!-- 第二步 -->
|
|
|
+ <el-button v-if="newDailyTemplate" size="small" type="primary" @click="reportReturn">上一步</el-button>
|
|
|
+ <el-button v-if="newDailyTemplate" size="small" type="primary" @click="getCreateData">保存, 下一步</el-button>
|
|
|
+ <!-- 第三步 -->
|
|
|
+ <el-button v-if="dailyPreview" size="small" type="primary" @click="sendReportReturn">上一步</el-button>
|
|
|
+ <el-button v-if="dailyPreview" size="small" type="primary" @click="sendReport">发送</el-button>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ </el-dialog>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+import '@/styles/PublicStyle/index.scss'
|
|
|
+import { settingQueryReportModuleList, settingDeleteReportModule, dailyReportGetV2 } from '@/api/reportTemplate'
|
|
|
+import dailyTemplate from '@/views/reportManagement/daily/dailyTemplate.vue'
|
|
|
+import newReportTemplate from '@/views/reportManagement/daily/newReportTemplate.vue'
|
|
|
+import dailyPreview from '@/views/reportManagement/daily/dailyPreview.vue'
|
|
|
+
|
|
|
+export default {
|
|
|
+ components: {
|
|
|
+ dailyTemplate,
|
|
|
+ newReportTemplate,
|
|
|
+ dailyPreview
|
|
|
+ },
|
|
|
+ props: {
|
|
|
+ title: { type: String, default: '' }
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ visible2: false,
|
|
|
+ templateStatus: false, // 模版状态
|
|
|
+ reportHome: true, // 报告主页
|
|
|
+ reportModel: [
|
|
|
+ { id: 1, moduleName: '客户端模版', creatorObject: { 'idap': '', 'name': '系统', 'deptid': '', 'deptName': '', 'empId': '', 'phoneUrl': null }},
|
|
|
+ { id: 2, moduleName: '服务端模版', creatorObject: { 'idap': '', 'name': '系统', 'deptid': '', 'deptName': '', 'empId': '', 'phoneUrl': null }}
|
|
|
+ ], // 创建的模版
|
|
|
+ templateId: '', // 模版id
|
|
|
+ modelId: '', // 下一步选择的模版id
|
|
|
+ selectTemplate: [],
|
|
|
+ fromData: {
|
|
|
+ radio: 1
|
|
|
+ },
|
|
|
+ bizJson: localStorage.getItem('bizId'),
|
|
|
+ preview: {},
|
|
|
+ newDailyTemplate: false, // 新建日报模版
|
|
|
+ reportTamplate: false, // new模版
|
|
|
+ dailyPreview: false, // 日报预览
|
|
|
+ dailyId: '', // 当前创建报告的id
|
|
|
+ updateDaily: false, // 编辑
|
|
|
+ dialogDaliy: false,
|
|
|
+ showOne: true,
|
|
|
+ showTow: false,
|
|
|
+ radio: '1',
|
|
|
+ newIndex: '',
|
|
|
+ active: 1,
|
|
|
+ daily_taskIds: [], // 选择的任务ID
|
|
|
+ num: 0,
|
|
|
+ dailys: this.$route.query.id
|
|
|
+ }
|
|
|
+ },
|
|
|
+ watch: {
|
|
|
+ title: {
|
|
|
+ handler(newV) {
|
|
|
+ newV === '测试日报' ? this.num = 3 : ''
|
|
|
+ newV === '准出报告' ? this.num = 4 : ''
|
|
|
+ newV === '提测报告' ? this.num = 1 : ''
|
|
|
+ this.getreportTemplate()
|
|
|
+ },
|
|
|
+ immediate: true
|
|
|
+ }
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ async getreportTemplate() { // 获取模版list
|
|
|
+ const res = await settingQueryReportModuleList({ bizId: this.bizJson, type: this.num })
|
|
|
+ if (res.code === 200) {
|
|
|
+ this.$nextTick(() => {
|
|
|
+ const data = res.data
|
|
|
+ this.selectTemplate = data.map(item => ({
|
|
|
+ ...item,
|
|
|
+ operation: false
|
|
|
+ }))
|
|
|
+ console.log(this.selectTemplate, 'xsaxaxsa')
|
|
|
+ })
|
|
|
+ }
|
|
|
+ },
|
|
|
+ // reportSelectTemplate() {
|
|
|
+ // this.$nextTick(() => {
|
|
|
+ // this.selectTemplate = this.selectTemplate.concat(this.reportModel)
|
|
|
+ // console.log(this.selectTemplate, 'xsaxaxsa')
|
|
|
+ // })
|
|
|
+ // },
|
|
|
+ selectRepot(e) { // 选择的模版
|
|
|
+
|
|
|
+ },
|
|
|
+ init(index, newData) {
|
|
|
+ console.log(index, newData)
|
|
|
+ this.dialogDaliy = true
|
|
|
+ var url = location.href // 获取url中"?"符后的字串
|
|
|
+ var arr = url.split('=')
|
|
|
+ switch (index) {
|
|
|
+ case 1:
|
|
|
+ this.daily_task = [Number(arr[1])]
|
|
|
+ this.showOne = true
|
|
|
+ this.showTow = false
|
|
|
+ this.active = 1
|
|
|
+ break
|
|
|
+ case 2: // 编辑
|
|
|
+ console.log(newData, '西单商场')
|
|
|
+ dailyReportGetV2(newData.id).then(res => {
|
|
|
+ if (res.code === 200) {
|
|
|
+ this.daily_taskIds = res.data.taskIds // 关联任务
|
|
|
+ this.fromData.radio = res.data // 选择的模块
|
|
|
+ }
|
|
|
+ })
|
|
|
+ this.reportHome = true // 步骤条
|
|
|
+ this.active = 2 // 步骤条状态第三步
|
|
|
+ this.showOne = false // 隐藏第一步
|
|
|
+ this.newDailyTemplate = true // 隐藏第二步
|
|
|
+ this.dailyPreview = false // 展示第三部
|
|
|
+ this.updateDaily = true // 编辑
|
|
|
+ break
|
|
|
+ case 3: // 发送报告
|
|
|
+ this.dailyId = newData.id
|
|
|
+ this.reportHome = true // 步骤条
|
|
|
+ this.active = 3 // 步骤条状态第三步
|
|
|
+ this.showOne = false // 隐藏第一步
|
|
|
+ this.newDailyTemplate = false // 隐藏第二步
|
|
|
+ this.dailyPreview = true // 展示第三部
|
|
|
+ break
|
|
|
+ case 4: // 复制
|
|
|
+ dailyReportGetV2(newData.id).then(res => {
|
|
|
+ if (res.code === 200) {
|
|
|
+ this.daily_taskIds = res.data.taskIds // 关联任务
|
|
|
+ const data = res.data
|
|
|
+ data.updateDaily = false
|
|
|
+ this.fromData.radio = data // 选择的模块
|
|
|
+ }
|
|
|
+ })
|
|
|
+ this.reportHome = true // 步骤条
|
|
|
+ this.active = 2 // 步骤条状态第三步
|
|
|
+ this.showOne = false // 隐藏第一步
|
|
|
+ this.newDailyTemplate = true // 隐藏第二步
|
|
|
+ this.dailyPreview = false // 展示第三部
|
|
|
+ this.updateDaily = false // 新建
|
|
|
+ break
|
|
|
+ case 7: // 新建
|
|
|
+ this.daily_taskIds = newData
|
|
|
+ this.fromData.radio = 1 // 选择的模版
|
|
|
+ this.reportHome = true // 步骤条
|
|
|
+ this.active = 1 // 步骤条状态第三步
|
|
|
+ this.showOne = true // 展示第一步
|
|
|
+ this.newDailyTemplate = false // 隐藏第二步
|
|
|
+ this.dailyPreview = false // 隐藏第三部
|
|
|
+ break
|
|
|
+ }
|
|
|
+ },
|
|
|
+
|
|
|
+ report_update() { // 编辑模版
|
|
|
+ this.$refs.DailyReport.getQueryData(this.num)
|
|
|
+ },
|
|
|
+
|
|
|
+ created_out() { // 新建模版
|
|
|
+ this.$refs.newReportTemplate.getCreateData(this.num)
|
|
|
+ },
|
|
|
+
|
|
|
+ reportReturn() { // 新建模版点击返回
|
|
|
+ this.fromData.radio = 1
|
|
|
+ this.reportHome = true // 步骤条
|
|
|
+ this.showOne = true // 模版选择
|
|
|
+ this.reportTamplate = false // 编辑区域
|
|
|
+ this.newDailyTemplate = false // 隐藏第二步
|
|
|
+ this.dailyPreview = false // 隐藏第三步
|
|
|
+ },
|
|
|
+
|
|
|
+ open_new_template(val) { // 点击新建模版
|
|
|
+ val ? this.templateId = val.id : this.templateId = null
|
|
|
+ this.reportTamplate = true // 编辑区域
|
|
|
+ this.reportHome = false // 步骤条
|
|
|
+ this.showOne = false // 模版选择
|
|
|
+ },
|
|
|
+
|
|
|
+ async settingDeleteReportModule(item) {
|
|
|
+ const res = await settingDeleteReportModule({ id: item.id }, item.id)
|
|
|
+ if (res.code === 200) {
|
|
|
+ this.getreportTemplate()
|
|
|
+ this.closeDefaultPopover()
|
|
|
+ this.$message({ message: '已删除’', type: 'success', duration: 1000, offset: 150 })
|
|
|
+ }
|
|
|
+ },
|
|
|
+
|
|
|
+ closeDefaultPopover() { // 模拟点击
|
|
|
+ this.$refs.refName.click()
|
|
|
+ },
|
|
|
+
|
|
|
+ getCreateData() { // 保存,下一步
|
|
|
+ this.$refs.dailyTemplate.getCreateData(this.updateDaily)
|
|
|
+ },
|
|
|
+
|
|
|
+ NextStep() { // 第一步到第二步
|
|
|
+ this.fromData.radio = 1
|
|
|
+ this.reportHome = true // 步骤条
|
|
|
+ this.active = 2 // 步骤条状态第二步
|
|
|
+ this.showOne = false // 隐藏第一步
|
|
|
+ this.newDailyTemplate = true // 展示第二步
|
|
|
+ this.dailyPreview = false // 隐藏第三步
|
|
|
+ },
|
|
|
+
|
|
|
+ SaveNextStep(ele) { // 第二步到第三部
|
|
|
+ console.log(ele, 'xsaxasxasxsaxsa')
|
|
|
+ this.dailyId = ele.id // 新建报告id
|
|
|
+ this.reportHome = true // 步骤条
|
|
|
+ this.active = 3 // 步骤条状态第三步
|
|
|
+ this.showOne = false // 隐藏第一步
|
|
|
+ this.newDailyTemplate = false // 隐藏第二步
|
|
|
+ this.dailyPreview = true // 展示第三部
|
|
|
+ },
|
|
|
+
|
|
|
+ async sendReportReturn() { // 第三步返回第二部
|
|
|
+ const res = await dailyReportGetV2(this.dailyId)
|
|
|
+ if (res.code === 200) {
|
|
|
+ this.daily_taskIds = res.data.taskIds // 关联任务
|
|
|
+ this.fromData.radio = res.data // 选择的模块
|
|
|
+ }
|
|
|
+ this.reportHome = true // 步骤条
|
|
|
+ this.active = 2 // 步骤条状态第三步
|
|
|
+ this.showOne = false // 隐藏第一步
|
|
|
+ this.newDailyTemplate = true // 隐藏第二步
|
|
|
+ this.dailyPreview = false // 展示第三部
|
|
|
+ this.updateDaily = true // 编辑
|
|
|
+ },
|
|
|
+
|
|
|
+ sendReport() { // 截图
|
|
|
+ this.$refs.dailyPreview.sendReport()
|
|
|
+ },
|
|
|
+
|
|
|
+ handleClose() {
|
|
|
+ this.dialogDaliy = false
|
|
|
+ this.$emit('getList')
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="scss" scoped>
|
|
|
+.report-leftRight {
|
|
|
+ margin: 0 13%;
|
|
|
+}
|
|
|
+
|
|
|
+.titIcon {
|
|
|
+ width: 4px;
|
|
|
+ height: 17px;
|
|
|
+ background: #409EFF;
|
|
|
+ border-radius: 1px;
|
|
|
+}
|
|
|
+
|
|
|
+.el-dialog__header {
|
|
|
+ padding: 0 !important;
|
|
|
+}
|
|
|
+
|
|
|
+.reportModel {
|
|
|
+ margin-left: 10px;
|
|
|
+}
|
|
|
+
|
|
|
+.operation {
|
|
|
+ margin-left: 30px;
|
|
|
+}
|
|
|
+
|
|
|
+.creator {
|
|
|
+ display: inline-block;
|
|
|
+ font-size:16px;
|
|
|
+ font-family:Microsoft Sans Serif;
|
|
|
+ font-weight:400;
|
|
|
+ line-height:22px;
|
|
|
+ color:rgba(51,51,51,1);
|
|
|
+ opacity:1;
|
|
|
+}
|
|
|
+
|
|
|
+.creatorList {
|
|
|
+ display: inline-block;
|
|
|
+ font-size:14px;
|
|
|
+ font-family:Microsoft Sans Serif;
|
|
|
+ font-weight:400;
|
|
|
+ line-height: 2.8;
|
|
|
+ color:rgba(51,51,51,1);
|
|
|
+ opacity:1;
|
|
|
+}
|
|
|
+
|
|
|
+.deletreport {
|
|
|
+ font-size:14px;
|
|
|
+ text-align: center;
|
|
|
+ margin: 30px 0;
|
|
|
+ font-family:MicrosoftYaHei;
|
|
|
+ color:rgba(51,59,74,1);
|
|
|
+ opacity:1;
|
|
|
+}
|
|
|
+
|
|
|
+.report-dialog {
|
|
|
+ >>>.el-dialog__header {
|
|
|
+ padding: 20px 20px 10px;
|
|
|
+ border-bottom: 1px solid rgba(238,238,238,1);
|
|
|
+ opacity:1;
|
|
|
+ }
|
|
|
+ >>>.el-dialog__footer {
|
|
|
+ padding: 15px 20px;
|
|
|
+ text-align: right;
|
|
|
+ border-top: 1px solid rgba(238,238,238,1);
|
|
|
+ opacity:1;
|
|
|
+ }
|
|
|
+}
|
|
|
+.report-return {
|
|
|
+ font-size: 18px;
|
|
|
+ position: absolute;
|
|
|
+ top: 23px;
|
|
|
+ left: 11px;
|
|
|
+}
|
|
|
+.report-steps {
|
|
|
+ margin-bottom: 20px;
|
|
|
+ font-size:16px;
|
|
|
+ font-family:PingFang SC;
|
|
|
+ font-weight:500;
|
|
|
+ line-height:22px;
|
|
|
+ color:rgba(51,51,51,1);
|
|
|
+ opacity:1;
|
|
|
+}
|
|
|
+.daily {
|
|
|
+ max-height: 460px;
|
|
|
+ overflow:scroll;
|
|
|
+ overflow-x: hidden
|
|
|
+}
|
|
|
+
|
|
|
+.blur-column {
|
|
|
+ width:4px;
|
|
|
+ height:15px;
|
|
|
+ display:inline-block;
|
|
|
+ vertical-align: middle;
|
|
|
+ background:#409EFF;
|
|
|
+ border-radius:1px;
|
|
|
+}
|
|
|
+</style>
|