From 1fa6ac40e2ce16e1174cec9ca538d45eeb660fdc Mon Sep 17 00:00:00 2001 From: xiangpei <xiangpei@timesnew.cn> Date: 星期四, 05 六月 2025 18:17:56 +0800 Subject: [PATCH] 工作台 --- src/views/projectProcess/detail/index.vue | 318 +++++++++++++++++++++++++++++----------------------- 1 files changed, 179 insertions(+), 139 deletions(-) diff --git a/src/views/projectProcess/detail/index.vue b/src/views/projectProcess/detail/index.vue index bcb344a..9c8bc79 100644 --- a/src/views/projectProcess/detail/index.vue +++ b/src/views/projectProcess/detail/index.vue @@ -18,18 +18,18 @@ </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}">寰呭姙浜嬮」<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(2, 'todo')" :class="{'item-warm': true, 'todo-color': true, 'active': 2 === selectTabId}">寰呭姙浜嬮」<span v-if="detailData && detailData.statistics">锛坽{detailData.statistics.todoTaskNum}}锛�</span></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}">鎸夋椂瀹屾垚<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(3, 'wait')" :class="{'item-warm': true, 'wait-color': true, 'active': 3 === selectTabId}">瀹圭己浜嬮」<span v-if="detailData && detailData.statistics">锛坽{detailData.statistics.waitTaskNum}}锛�</span></div> + <div @click="changeTab(7, 'jump')" :class="{'item-warm': true, 'willOvertime-color': true, 'active': 7 === selectTabId}">璺宠繃浜嬮」<span v-if="detailData && detailData.statistics">锛坽{detailData.statistics.jumpTaskNum}}锛�</span></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; 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> + <el-input v-model="queryParams.taskName" clearable @clear="search" placeholder="浠诲姟鍚嶇О"></el-input> </el-form-item> <el-form-item> <el-button type="primary" @click="search">鏌ヨ</el-button> @@ -37,7 +37,7 @@ </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> + <el-button @click="openRecord" type="info" v-loading="recordLoading">娴佺▼鏃ュ織</el-button> </div> </div> <div class="table"> @@ -73,45 +73,6 @@ :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" @@ -156,61 +117,72 @@ </div> </el-dialog> - <el-dialog - :title="`${this.queryParams.processName}锛氭祦杞褰昤" + <el-drawer + :title="`${this.queryParams.processName}锛氭祦绋嬫棩蹇梎" :visible.sync="processRecordShow" - :fullscreen="true" - :close-on-click-modal="false" - :destroy-on-close="true" - > - <div> - <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> + 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"> @@ -233,16 +205,20 @@ } 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: "Detail", components: { - BpmnViewer + BpmnViewer, + LogView }, data() { return { + logList: [], // 娴佺▼鏃ュ織 processRecordShow: false, // 娴佽浆璁板綍鏄剧ず flowRecordList: [], // 娴佺▼娴佽浆鏁版嵁 recordLoading: false, // 娴佽浆璁板綍鍔犺浇 @@ -292,14 +268,37 @@ this.queryParams.processInsId = this.$route.query.processInsId this.queryParams.deployId = this.$route.query.deployId this.queryParams.processName = this.$route.query.processName + if (this.$route.query.selectTabId) { + this.selectTabId = parseInt(this.$route.query.selectTabId) + } sessionStorage.setItem("projectProDetail", JSON.stringify(this.queryParams)) } else { this.queryParams = params } this.loading = true + this.changeTab(this.selectTabId, this.transEventType(this.selectTabId)) this.getProjectProcessInfo() }, methods: { + transEventType(selectTabId) { + if (selectTabId == 1) { + return "all" + } else if (selectTabId == 2) { + return "todo" + } else if (selectTabId == 3) { + return "wait" + } else if (selectTabId == 4) { + return "remaining" + } else if (selectTabId == 5) { + return "timely" + } else if (selectTabId == 6) { + return "overtime" + } else if (selectTabId == 7) { + return "jump" + } else if (selectTabId == 8) { + return "urge" + } + }, submitSupervise() { this.$refs["superviseForm"].validate(valid => { if (valid) { @@ -314,7 +313,7 @@ this.superviseForm.content =''; this.superviseForm.taskId = row.taskId; this.superviseForm.projectId = this.$route.query.projectId; - this.superviseForm.processInsId = row.taskId; + this.superviseForm.processInsId = row.processInsId; this.superviseForm.superviseType = "SUPERVISE"; this.superviseForm.receiverType = row.handlerType; if (row.handlerType === 'USER') { @@ -341,7 +340,7 @@ } }, openRecord() { - this.getFlowRecordList(this.queryParams.processInsId); + this.getFlowLogList(this.queryParams.processInsId); }, openProcessImg() { this.imgLoading = true @@ -363,23 +362,33 @@ 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.handlerType === 'USER') { - return null; - } else if (row.handlerType === 'DEPT') { - return row.handlerUnitName.join("銆�") - } else if (row.handlerType === 'ROLE') { - return row.handlerUnitName.join('銆�') + if (row.taskStatus != '宸插畬鎴�' && row.taskStatus != '璺宠繃') { + return null } + return row.handlerUnitName.join("銆�") }, candidateFormatter(row) { - 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('銆�') + if (row.taskStatus != '宸插畬鎴�' && 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) { // 涓嶆槸宸插畬鎴愮殑鐘舵�佹病鏈夊疄闄呭鐞嗕汉锛屽凡瀹屾垚鐨勭姸鎬佸彧鏈変竴涓汉 @@ -390,14 +399,11 @@ } }, showHandle(row) { - if (row.taskStatus === '寰呭姙') { + if (row.taskStatus === '寰呭姙' || row.taskStatus === '鎸傝捣' || row.taskStatus === '瀹圭己') { if (row.handlerType === "USER") { - 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 row.handlerUnitId.indexOf(this.$store.state.user.deptId) !== -1 - // return this.$store.state.user.name === '甯傚彂灞曟敼闈╁' || this.$store.state.user.name === '甯備綇寤哄眬' + return row.handlerUnitId.indexOf(this.$store.state.user.deptId) !== -1 || row.handlerUnitId.some(id => this.$store.state.user.childDeptIds.indexOf(id) !== -1) } else if (row.handlerType === "ROLE") { return row.handlerUnitId.some(roleId => this.$store.state.user.roleIds.indexOf(roleId) !== -1) } @@ -406,13 +412,7 @@ } }, goToDo(row) { - // 鏌ヨ璇ヤ换鍔℃槸鍚﹂厤缃簡闇�瑕佸鎵� - let params = { - processDefId: row.processDefId, - taskId: row.taskId - } - getTaskIsAuditing(params).then(res => { - console.log("row",row) + if (row.taskStatus === '瀹圭己') { this.$router.push({ path: '/flowable/task/myProcess/send/index', query: { @@ -423,11 +423,38 @@ flowName: this.queryParams.processName, projectName: this.detailData.projectName, taskId: row.taskId, - showAuditing: res.data, + showAuditing: false, + projectId: this.queryParams.projectId, + isWait: true, goBackParams: this.queryParams } }) - }) + } else { + // 鏌ヨ璇ヤ换鍔℃槸鍚﹂厤缃簡闇�瑕佸鎵� + let params = { + processDefId: row.processDefId, + 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, + projectId: this.queryParams.projectId, + isWait: false, + goBackParams: this.queryParams + } + }) + }) + } }, goToProcessDetail(row) { this.$router.push({ path: '/flowable/task/myProcess/detail/index', @@ -437,6 +464,7 @@ procInsId: row.processInsId, deployId: row.deployId, taskId: row.taskId, + projectId: this.queryParams.projectId, goBackParams: this.queryParams }}) }, @@ -464,23 +492,28 @@ this.total = res.total }) }, + isProject(id) { + const numericPattern = /^\d+(\.\d+)?$/; + return numericPattern.test(id) + }, // 鏌ヨ璇︽儏 getProjectProcessInfo() { - getProjectProcessDetail(this.queryParams.projectId, this.queryParams.processDefId).then(res => { + const projectType = this.isProject(this.queryParams.projectId) ? "PROJECT" : "ENGINEERING" + const param = { + projectId: this.queryParams.projectId, + processDefId: this.queryParams.processDefId, + projectType: projectType + } + getProjectProcessDetail(param).then(res => { this.detailData = res.data - this.taskList = res.taskList - this.total = res.total this.loading = false }) }, changeTab(id, event) { - let beforeId = this.selectTabId this.selectTabId = id this.queryParams.taskType = event this.queryParams.currentPage = 1; - if (beforeId !== id) { - this.getList() - } + this.getList() } } } @@ -530,6 +563,9 @@ .all-color { background-color: rgb(180, 253, 255); } +.todo-color { + background-color: rgb(66, 174, 243); +} .current-color { background-color: rgb(127, 131, 247); @@ -540,17 +576,21 @@ color: white; } .timely-color { - background-color: rgb(204, 247, 131); + background-color: rgb(85, 248, 106); } .overtime-color { - background-color: rgb(129, 179, 55); - color: white; + background-color: #e8e866; } + +.wait-color { + background-color: orange; +} + .willOvertime-color { - background-color: rgb(255, 248, 29); + background-color: rgb(204, 247, 131); } .urge-color { - background-color: rgb(0, 0, 0); + background-color: red; color: white; } .active { -- Gitblit v1.8.0