From c482628d3daf21dafba7e2b9eaba6e46ffda0fdb Mon Sep 17 00:00:00 2001 From: xiangpei <xiangpei@timesnew.cn> Date: 星期四, 27 二月 2025 20:11:14 +0800 Subject: [PATCH] 首页跳转bug --- src/views/projectProcess/detail/index.vue | 344 ++++++++++++++++++++++++++++++++++++++++++++++++++++---- 1 files changed, 317 insertions(+), 27 deletions(-) diff --git a/src/views/projectProcess/detail/index.vue b/src/views/projectProcess/detail/index.vue index c21ec20..545c0f1 100644 --- a/src/views/projectProcess/detail/index.vue +++ b/src/views/projectProcess/detail/index.vue @@ -6,7 +6,7 @@ <h2>椤圭洰鍚嶇О锛歿{detailData.projectName}}</h2> </div> <div class="project-info"> - <div class="project-info-item"></div> + <div class="project-info-item">娴佺▼鍚嶇О锛歿{queryParams.processName}}</div> <div class="project-info-item">椤圭洰浠g爜锛歿{detailData.projectCode}}</div> <div class="project-info-item"> <div style="color: black"> @@ -18,15 +18,15 @@ </div> <div class="search-warp"> <div @click="changeTab(1, 'all')" :class="{'item-warm': true, 'all-color': true, 'active': 1 === selectTabId}">鍏ㄩ儴浜嬮」<span v-if="detailData && detailData.statistics">锛坽{detailData.statistics.totalTaskNum}}锛�</span></div> - <div @click="changeTab(2, 'todo')" :class="{'item-warm': true, 'all-color': true, 'active': 2 === selectTabId}">浠e姙浜嬮」<span v-if="detailData && detailData.statistics">锛坽{detailData.statistics.todoTaskNum}}锛�</span></div> + <div @click="changeTab(2, 'todo')" :class="{'item-warm': true, 'all-color': true, 'active': 2 === selectTabId}">寰呭姙浜嬮」<span v-if="detailData && detailData.statistics">锛坽{detailData.statistics.todoTaskNum}}锛�</span></div> <div @click="changeTab(3, 'todo')" :class="{'item-warm': true, 'current-color': true, 'active': 3 === selectTabId}">褰撳墠鐜妭</div> <div @click="changeTab(4, 'remaining')" :class="{'item-warm': true, 'remaining-color': true, 'active': 4 === selectTabId}">鍓╀綑浜嬮」<span v-if="detailData && detailData.statistics">锛坽{detailData.statistics.remainingTaskNum}}锛�</span></div> - <div @click="changeTab(5, 'timely')" :class="{'item-warm': true, 'timely-color': true, 'active': 5 === selectTabId}">鎸夋椂瀹屾垚锛�0锛�</div> + <div @click="changeTab(5, 'timely')" :class="{'item-warm': true, 'timely-color': true, 'active': 5 === selectTabId}">鎸夋椂瀹屾垚<span v-if="detailData && detailData.statistics">锛坽{detailData.statistics.timelyFinishedTaskNum}}锛�</span></div> <div @click="changeTab(6, 'overtime')" :class="{'item-warm': true, 'overtime-color': true, 'active': 6 === selectTabId}">瓒呮椂浜嬮」锛�0锛�</div> <div @click="changeTab(7, 'willOvertime')" :class="{'item-warm': true, 'willOvertime-color': true, 'active': 7 === selectTabId}">涓存湡浜嬮」锛�0锛�</div> <div @click="changeTab(8, 'urge')" :class="{'item-warm': true, 'urge-color': true, 'active': 8 === selectTabId}">鐫e姙浜嬮」锛�0锛�</div> </div> - <div style="display: flex;justify-content: center;align-items: center;margin-top: 20px"> + <div style="display: flex;justify-content: center;align-items: center;margin-top: 20px; position: relative"> <el-form :inline="true" :model="queryParams" class="demo-form-inline"> <el-form-item label="浠诲姟鍚嶇О"> <el-input v-model="queryParams.taskName" placeholder="浠诲姟鍚嶇О"></el-input> @@ -35,6 +35,10 @@ <el-button type="primary" @click="search">鏌ヨ</el-button> </el-form-item> </el-form> + <div style="position: absolute; right: 0; top: 0"> + <el-button @click="openProcessImg" v-loading="imgLoading" type="primary">娴佺▼鍥�</el-button> + <el-button @click="openRecord" type="info" v-loading="recordLoading">娴佺▼鏃ュ織</el-button> + </div> </div> <div class="table"> <el-table @@ -48,31 +52,68 @@ > </el-table-column> <el-table-column - prop="processName" - label="娴佺▼鍚嶇О" - > - </el-table-column> - <el-table-column prop="promoterUnitName" - label="鍙戣捣鍗曚綅" + label="璐d换鍗曚綅" > </el-table-column> <el-table-column prop="promoterName" - label="鍙戣捣浜�" + label="璐d换浜哄強鑱旂郴鐢佃瘽" > </el-table-column> <el-table-column prop="handlerUnitName" label="澶勭悊鍗曚綅" + :formatter="unitFormatter" > </el-table-column> <el-table-column prop="handlerName" - label="瀹為檯澶勭悊浜�" + label="澶勭悊浜哄強鑱旂郴鐢佃瘽" + :formatter="candidateFormatter" > </el-table-column> +<!-- <el-table-column--> +<!-- prop="promoterUnitName"--> +<!-- label="鍙戣捣鍗曚綅"--> +<!-- >--> +<!-- </el-table-column>--> +<!-- <el-table-column--> +<!-- prop="promoterName"--> +<!-- label="鍙戣捣浜�"--> +<!-- >--> +<!-- </el-table-column>--> +<!-- <el-table-column--> +<!-- align="center"--> +<!-- prop="handlerType"--> +<!-- label="澶勭悊鏂圭被鍨�"--> +<!-- >--> +<!-- <template slot-scope="scope">--> +<!-- <el-tag v-if="scope.row.handlerType === 'USER'">浜哄憳璐﹀彿</el-tag>--> +<!-- <el-tag type="success" v-else-if="scope.row.handlerType === 'DEPT'">鍗曚綅</el-tag>--> +<!-- <el-tag type="info" v-else-if="scope.row.handlerType === 'ROLE'">瑙掕壊</el-tag>--> +<!-- </template>--> +<!-- </el-table-column>--> +<!-- <el-table-column--> +<!-- prop="handlerUnitName"--> +<!-- label="澶勭悊鍗曚綅"--> +<!-- :formatter="unitFormatter"--> +<!-- >--> +<!-- </el-table-column>--> +<!-- <el-table-column--> +<!-- prop="handlerName"--> +<!-- label="鍊欓�夊鐞嗕汉"--> +<!-- :formatter="candidateFormatter"--> +<!-- >--> +<!-- </el-table-column>--> +<!-- <el-table-column--> +<!-- prop="handlerName"--> +<!-- label="瀹為檯澶勭悊浜�"--> +<!-- :formatter="finalFinishedFormatter"--> +<!-- >--> +<!-- </el-table-column>--> <el-table-column + align="center" prop="taskStatus" label="浠诲姟鐘舵��" > @@ -80,10 +121,12 @@ <el-table-column fixed="right" label="鎿嶄綔" - width="100"> + align="center" + width="140"> <template slot-scope="scope"> <el-button v-if="scope.row.taskStatus !== '鏈紑濮�'" @click="goToProcessDetail(scope.row)" type="text" size="small">鏌ョ湅</el-button> <el-button v-if="showHandle(scope.row)" @click="goToDo(scope.row)" type="text" size="small">鍔炵悊</el-button> + <el-button v-if = "scope.row.taskStatus === '寰呭姙'" @click="openSupervise(scope.row)" type="text" size="small">鐫e姙</el-button> </template> </el-table-column> </el-table> @@ -100,6 +143,96 @@ </el-pagination> </div> </div> + + <el-dialog + :title="`${this.queryParams.processName}锛氭祦绋嬪浘`" + :visible.sync="processImgShow" + :fullscreen="true" + :close-on-click-modal="false" + :destroy-on-close="true" + > + <div> + <bpmn-viewer :flowData="flowData" :procInsId="queryParams.processInsId"/> + </div> + </el-dialog> + + <el-drawer + :title="`${this.queryParams.processName}锛氭祦绋嬫棩蹇梎" + :visible.sync="processRecordShow" + direction="ltr" + :modal="false" + size="800px" + > + <log-view style="padding: 10px 20px" :log-list="logList"/> + </el-drawer> + +<!-- <el-dialog--> +<!-- :title="`${this.queryParams.processName}锛氭祦杞褰昤"--> +<!-- :visible.sync="processRecordShow"--> +<!-- :fullscreen="true"--> +<!-- :close-on-click-modal="false"--> +<!-- :destroy-on-close="true"--> +<!-- >--> +<!-- <div>--> +<!-- <log-view :log-list="logList"/>--> +<!--<!– <div class="block">–>--> +<!--<!– <el-timeline>–>--> +<!--<!– <el-timeline-item–>--> +<!--<!– v-for="(item,index ) in flowRecordList"–>--> +<!--<!– :key="index"–>--> +<!--<!– :icon="setIcon(item.finishTime)"–>--> +<!--<!– :color="setColor(item.finishTime)"–>--> +<!--<!– >–>--> +<!--<!– <p style="font-weight: 700">{{item.taskName}}–>--> +<!--<!– <span v-if="item.comment && item.comment.type === '3'" style="color: red">(鎵ц浜嗛┏鍥�)</span>–>--> +<!--<!– <span v-if="item.overtime && item.overtime==='red'" style="color: red">(宸茶秴鏃�)</span>–>--> +<!--<!– <span v-if="item.overtime && item.overtime==='yellow'" style="color: orange">(鍗冲皢瓒呮椂)</span>–>--> +<!--<!– </p>–>--> +<!--<!– <el-card :body-style="{ padding: '10px' }">–>--> +<!--<!– <el-descriptions class="margin-top" :column="1" size="small" border>–>--> +<!--<!– <el-descriptions-item v-if="item.assigneeName" label-class-name="my-label">–>--> +<!--<!– <template slot="label"><i class="el-icon-user"></i>鍔炵悊浜�</template>–>--> +<!--<!– {{item.assigneeName}}–>--> +<!--<!– <el-tag type="info" size="mini">{{item.deptName}}</el-tag>–>--> +<!--<!– </el-descriptions-item>–>--> +<!--<!– <el-descriptions-item v-if="item.candidate" label-class-name="my-label">–>--> +<!--<!– <template slot="label"><i class="el-icon-user"></i>鍊欓�夊姙鐞�</template>–>--> +<!--<!– {{item.candidate}}–>--> +<!--<!– </el-descriptions-item>–>--> +<!--<!– <el-descriptions-item label-class-name="my-label">–>--> +<!--<!– <template slot="label"><i class="el-icon-date"></i>鎺ユ敹鏃堕棿</template>–>--> +<!--<!– {{item.createTime}}–>--> +<!--<!– </el-descriptions-item>–>--> +<!--<!– <el-descriptions-item v-if="item.finishTime" label-class-name="my-label">–>--> +<!--<!– <template slot="label"><i class="el-icon-date"></i>澶勭悊鏃堕棿</template>–>--> +<!--<!– {{item.finishTime}}–>--> +<!--<!– </el-descriptions-item>–>--> +<!--<!– <el-descriptions-item v-if="item.duration" label-class-name="my-label">–>--> +<!--<!– <template slot="label"><i class="el-icon-time"></i>鑰楁椂</template>–>--> +<!--<!– {{item.duration}}–>--> +<!--<!– </el-descriptions-item>–>--> +<!--<!– <el-descriptions-item v-if="item.comment" label-class-name="my-label">–>--> +<!--<!– <template slot="label"><i class="el-icon-tickets"></i>澶勭悊鎰忚</template>–>--> +<!--<!– {{item.comment.comment}}–>--> +<!--<!– </el-descriptions-item>–>--> +<!--<!– </el-descriptions>–>--> +<!--<!– </el-card>–>--> +<!--<!– </el-timeline-item>–>--> +<!--<!– </el-timeline>–>--> +<!--<!– </div>–>--> +<!-- </div>--> +<!-- </el-dialog>--> + <el-dialog :visible.sync="superviseShow" width="1000px" title="鐫e姙" append-to-body> + <el-form ref="superviseForm" :model="superviseForm" :rules="superviseRules" label-width="80px"> + <el-form-item label="鐫e姙鍐呭" prop="content"> + <el-input type="textarea" v-model="superviseForm.content"></el-input> + </el-form-item> + </el-form> + <div slot="footer" class="dialog-footer"> + <el-button @click="superviseShow = false">鍙� 娑�</el-button> + <el-button type="primary" @click="submitSupervise">纭� 瀹�</el-button> + </div> + </el-dialog> </div> </template> @@ -107,19 +240,47 @@ import { getProjectProcessDetail, getProjectProcessDetailTaskList, - getTaskIsAuditing + getTaskIsAuditing, taskSupervise } from "@/api/projectProcess/projectProcess"; +import {flowXmlAndNode} from "@/api/flowable/definition"; +import BpmnViewer from '@/components/Process/viewer'; +import LogView from "@/views/projectProcess/components/LogView"; +import {flowRecord} from "@/api/flowable/finished"; +import {editProject} from "@/api/projectEngineering/projectInfo"; +import {getProjectProcessLog} from "@/api/flowLog/flowLog"; export default { - name: "index", + name: "Detail", + components: { + BpmnViewer, + LogView + }, data() { return { + logList: [], // 娴佺▼鏃ュ織 + processRecordShow: false, // 娴佽浆璁板綍鏄剧ず + flowRecordList: [], // 娴佺▼娴佽浆鏁版嵁 + recordLoading: false, // 娴佽浆璁板綍鍔犺浇 + // 妯″瀷xml鏁版嵁 + flowData: {}, + processImgShow: false, // 娴佺▼鍥炬樉绀� + imgLoading: false, // 娴佺▼鍥惧姞杞� loading: false, + superviseShow: false, tableLoading: false, detailData: {}, taskList: [], total: 0, selectTabId: 2, + superviseForm: { + taskId: null, + projectId: null, + processInsId: null, + receiverIds: null, + receiverType: null, + superviseType: null, + content: '', + }, queryParams: { taskName: '', taskType: 'todo', @@ -127,27 +288,143 @@ currentPage: 1, projectId: null, processDefId: null, + processInsId: null, + deployId: null, + processName: '' // 娴佺▼鍚嶇О + }, + superviseRules: { + content: [{required: true, message: '鐫e姙鍐呭涓嶈兘涓虹┖', trigger: 'blur'}] } } }, mounted() { - this.queryParams.projectId = this.$route.query.projectId - this.queryParams.processDefId = this.$route.query.processDefId + console.log(this.$route.query, "鍙傛暟") + let params = JSON.parse(sessionStorage.getItem("projectProDetail")) + console.log(params, "鍙傛暟") + if (!params || ! params.projectId) { + this.queryParams.projectId = this.$route.query.projectId + this.queryParams.processDefId = this.$route.query.processDefId + this.queryParams.processInsId = this.$route.query.processInsId + this.queryParams.deployId = this.$route.query.deployId + this.queryParams.processName = this.$route.query.processName + sessionStorage.setItem("projectProDetail", JSON.stringify(this.queryParams)) + } else { + this.queryParams = params + } this.loading = true this.getProjectProcessInfo() }, methods: { + submitSupervise() { + this.$refs["superviseForm"].validate(valid => { + if (valid) { + taskSupervise(this.superviseForm).then((res) => { + this.superviseShow = false; + this.$message.success("鎿嶄綔鎴愬姛"); + }) + } + }); + }, + openSupervise(row){ + this.superviseForm.content =''; + this.superviseForm.taskId = row.taskId; + this.superviseForm.projectId = this.$route.query.projectId; + this.superviseForm.processInsId = row.taskId; + this.superviseForm.superviseType = "SUPERVISE"; + this.superviseForm.receiverType = row.handlerType; + if (row.handlerType === 'USER') { + this.superviseForm.receiverIds = row.handlerId; + } else if (row.handlerType === 'DEPT') { + this.superviseForm.receiverIds = row.handlerUnitId; + } else if (row.handlerType === 'ROLE') { + this.superviseForm.receiverIds = row.handlerUnitId; + } + this.superviseShow = true + }, + setIcon(val) { + if (val) { + return "el-icon-check"; + } else { + return "el-icon-time"; + } + }, + setColor(val) { + if (val) { + return "#2bc418"; + } else { + return "#b3bdbb"; + } + }, + openRecord() { + this.getFlowLogList(this.queryParams.processInsId); + }, + openProcessImg() { + this.imgLoading = true + flowXmlAndNode({processInsId:this.queryParams.processInsId,deployId:this.queryParams.deployId}).then(res => { + this.imgLoading = false + this.processImgShow = true + this.$nextTick(() => { + this.flowData = res.data; + }) + }) + }, + /** 娴佺▼娴佽浆璁板綍 */ + getFlowRecordList(procInsId) { + const params = {procInsId: procInsId} + this.recordLoading = true + flowRecord(params).then(res => { + this.flowRecordList = res.data.flowList; + this.recordLoading = false + this.processRecordShow = true + }) + }, + getFlowLogList(procInsId) { + const params = {processInsId: procInsId, projectId: this.queryParams.projectId} + this.recordLoading = true + getProjectProcessLog(params).then(res => { + this.logList = res.data; + this.recordLoading = false + this.processRecordShow = true + }) + }, + unitFormatter(row) { + if (row.taskStatus != '宸插畬鎴�') { + return null + } + return row.handlerUnitName.join("銆�") + }, + candidateFormatter(row) { + if (row.taskStatus != '宸插畬鎴�') { + return null + } + return row.handlerName.join("銆�") + // if (row.handlerType === 'USER') { + // return row.handlerName.join('銆�') + // } else if (row.handlerType === 'DEPT') { + // return row.handlerUnitName.join('銆�') + // } else if (row.handlerType === 'ROLE') { + // return row.handlerUnitName.join('銆�') + // } + }, + finalFinishedFormatter(row) { + // 涓嶆槸宸插畬鎴愮殑鐘舵�佹病鏈夊疄闄呭鐞嗕汉锛屽凡瀹屾垚鐨勭姸鎬佸彧鏈変竴涓汉 + if (row.taskStatus !== '宸插畬鎴�') { + return null + } else { + return row.actualHandlerUserName + } + }, showHandle(row) { - console.log(this.$store.state.user, "鐢ㄦ埛淇℃伅") - if (row.taskStatus === '寰呭姙') { + if (row.taskStatus === '寰呭姙' || row.taskStatus === '鎸傝捣') { if (row.handlerType === "USER") { - return this.$store.state.user.id === row.handlerId + console.log(row.handlerId.indexOf(this.$store.state.user.id) !== -1, "鎴戞槸涓嶆槸") + return row.handlerId.indexOf(this.$store.state.user.id) !== -1 } else if (row.handlerType === "DEPT") { console.log(this.$store.state.user.deptId, "閮ㄩ棬id", row.handlerUnitId) - return this.$store.state.user.deptId === row.handlerUnitId + return row.handlerUnitId.indexOf(this.$store.state.user.deptId) !== -1 // return this.$store.state.user.name === '甯傚彂灞曟敼闈╁' || this.$store.state.user.name === '甯備綇寤哄眬' } else if (row.handlerType === "ROLE") { - return this.$auth.hasRole(row.handlerUnitName) + return row.handlerUnitId.some(roleId => this.$store.state.user.roleIds.indexOf(roleId) !== -1) } } else { return false @@ -160,14 +437,20 @@ taskId: row.taskId } getTaskIsAuditing(params).then(res => { + console.log("row",row) this.$router.push({ path: '/flowable/task/myProcess/send/index', query: { deployId: row.deployId, procDefId: row.processDefId, + procInsId: row.processInsId, processName: row.taskName, + flowName: this.queryParams.processName, + projectName: this.detailData.projectName, taskId: row.taskId, - showAuditing: res.data + showAuditing: res.data, + projectId: this.queryParams.projectId, + goBackParams: this.queryParams } }) }) @@ -175,29 +458,37 @@ goToProcessDetail(row) { this.$router.push({ path: '/flowable/task/myProcess/detail/index', query: { + projectName: this.detailData.projectName, + flowName: this.queryParams.processName, procInsId: row.processInsId, deployId: row.deployId, - taskId: row.taskId + taskId: row.taskId, + projectId: this.queryParams.projectId, + goBackParams: this.queryParams }}) }, search() { this.queryParams.currentPage = 1; + this.tableLoading = true this.getList() }, sizeChange(pageSize) { + this.tableLoading = true this.queryParams.pageSize = pageSize; this.getList() }, pageChange(pageNum) { + this.tableLoading = true this.queryParams.currentPage = pageNum; this.getList() }, getList() { + this.tableLoading = true // 鑾峰彇浠诲姟鍒楄〃 getProjectProcessDetailTaskList(this.queryParams).then(res => { + this.tableLoading =false this.taskList = res.data this.total = res.total - this.tableLoading =false }) }, // 鏌ヨ璇︽儏 @@ -210,14 +501,13 @@ }) }, changeTab(id, event) { - this.tableLoading = true let beforeId = this.selectTabId this.selectTabId = id this.queryParams.taskType = event + this.queryParams.currentPage = 1; if (beforeId !== id) { this.getList() } - } } } -- Gitblit v1.8.0