From 1dbb5bb85691cc48a0f6f64c999e91729d4ad22d Mon Sep 17 00:00:00 2001
From: yangys <y_ys79@sina.com>
Date: 星期五, 19 九月 2025 00:17:04 +0800
Subject: [PATCH] 优化审批界面

---
 src/views/flow/components/TodolistLeft.vue |  331 +++++++++++++++++++++++++++++++++++++++++++++---------
 1 files changed, 273 insertions(+), 58 deletions(-)

diff --git a/src/views/flow/components/TodolistLeft.vue b/src/views/flow/components/TodolistLeft.vue
index 171c421..8f60b2b 100644
--- a/src/views/flow/components/TodolistLeft.vue
+++ b/src/views/flow/components/TodolistLeft.vue
@@ -1,80 +1,212 @@
 <!--
  * @Date: 2025-07-01 20:45:15
  * @LastEditors: gaoshp
- * @LastEditTime: 2025-08-06 20:16:01
+ * @LastEditTime: 2025-08-27 20:48:41
  * @FilePath: /mdmweb/src/views/flow/components/TodolistLeft.vue
 -->
 <template>
     <basic-container>
-        <div class="tool" v-show="['programmingTask','cureProgramTask'].includes(row.taskDefinitionKey)">
-            <avue-form :option="attOption"
-             v-model="attForm"
-             :upload-after="uploadAfter" class="att-box"></avue-form>
+        <!--'cureProgramTask', 鍥哄寲缂栧埗鑳芥坊鍔犳枃浠�0916-->
+        <div class="tool" v-show="['programmingTask','cureProgramTask', 'replaceProgrammingTask','appendProgrammingTask'].includes(row.taskDefinitionKey)">
+           
+            <!--鏃犲浐鍖栫殑鎯呭喌鎵嶆樉绀鸿寮�鍏�-->
+            <el-switch v-if="row.variables.hasCuredProgram!=='Y'" v-model="programOnMachine" active-text="鐜板満缂栧埗" inactive-text="宸ヨ壓缂栧埗" />
+            &nbsp;
+            <el-button type="primary" :disabled="programOnMachine" plain @click="addProgram">娣诲姞绋嬪簭
+            </el-button>
         </div>
-        <el-table :data="tableData" border @row-click="showContent" max-height="200">
-            <!-- <el-table-column prop="machineCode" label="鍔犲伐鏈哄簥">
-            </el-table-column> -->
+         <el-text type="danger" v-if="row.variables.curedLocked === 'Y'">鍥哄寲绋嬪簭宸查攣瀹氾紝璇疯皑鎱庝娇鐢ㄣ�傞攣瀹氬師鍥狅細{{ remark }}<br/></el-text>
+         <el-text type="danger" v-if="row.processDefinitionKey === 'program-unlock'">绋嬪簭宸查攣瀹氾紝閿佸畾鍘熷洜锛歿{ remark }}<br/></el-text>
+         <el-text type="primary" v-if="row.processDefinitionKey === 'program-unlock'"><br/>瑙i攣鍘熷洜锛�</el-text>
+         <el-text type="warning">{{row.variables.unlockReason}}</el-text>
+         <el-text type="danger" v-if="row.variables.hasCuredProgram==='Y' && row.variables.isProcessEditionSame=='N' && row.variables.cureProgramUseable==undefined">宸插浐鍖栫▼搴忓伐搴忕増娆′笉涓�鑷达紝娲惧伐鐗堟:{{row.variables.processEdition}},宸插浐鍖栫増娆★細{{row.variables.curedProcessEdition}}</el-text>
+         <el-text type="danger" v-if="row.variables.programOnMachine=='Y'">鐜板満缂栧埗</el-text>
+        <el-table :data="tableDataProgram" border @row-click="showContent" :row-style="{height:'20px'}" :cell-style="{padding:'0px'}" max-height="380" highlight-current-row>  
+            <el-table-column type="index" label="#" width="40" align="center" />
             <el-table-column prop="name" label="绋嬪簭鍚嶇О">
+                <template #default="{ row }">
+                    <div style="display: flex;align-items: center;">
+                        <span style="margin-right: 8px;">{{ row.name }}</span>
+                        <!--
+                        <el-icon>
+                            <el-tooltip class="box-item" effect="light" content="绋嬪簭鏂囦欢"  placement="right">
+                                <Tickets/>
+                            </el-tooltip>
+                        </el-icon>
+                        -->
+                    </div>
+                </template>
             </el-table-column>
-            <el-table-column fixed="right" label="鎿嶄綔" width="60" align="center">
-            <template #default="scope" >
-                <el-button v-show="['programmingTask','cureProgramTask'].includes(row.taskDefinitionKey)" type="text" size="small" @click.stop="del(scope.$index,scope.row)">鍒犻櫎</el-button>
-            </template>
+            <el-table-column fixed="right" label="鎿嶄綔" width="150" align="center">
+                <template #default="scope">
+                    <!--'cureProgramTask', 鍥哄寲缂栧埗锛屼笉鑳藉垹闄ゅ拰涓婁紶-->
+                    <a style="color: blue;margin-right: 4px;cursor: pointer;font-size: 12px;"
+                        v-show="['programmingTask', 'replaceProgrammingTask','appendProgrammingTask'].includes(row.taskDefinitionKey)"
+                        type="text" size="small" @click.stop="del(scope.$index, scope.row)">鍒犻櫎</a>
+                    <a style="color: blue;cursor: pointer;font-size: 12px;margin-right: 4px;" type="text" size="small"
+                        @click.stop="downloadFile(scope.$index, scope.row)">涓嬭浇</a>
+                    <a style="color: blue;cursor: pointer;font-size: 12px;" type="text" size="small"
+                        v-show="['program-cure'].includes(row.processDefinitionKey)"
+                        @click.stop="diffFile(scope.$index, scope.row)">姣斿</a>
+                </template>
             </el-table-column>
         </el-table>
-        <h4>绋嬪簭鍐呭</h4>
+        <el-divider></el-divider>
+        <div class="tool" v-show="['programmingTask','cureProgramTask', 'replaceProgrammingTask','appendProgrammingTask'].includes(row.taskDefinitionKey)">
+           
+            <el-button type="primary" :disabled="programOnMachine" plain @click="addOtherFile">娣诲姞鏂囦欢
+            </el-button>
+        </div>
+        <el-table :data="tableDataAttatch" border @row-click="showContent" :row-style="{height:'20px'}" :cell-style="{padding:'0px'}" max-height="380" highlight-current-row>  
+            <el-table-column type="index" label="#" width="40" align="center" />
+            <el-table-column prop="name" label="鏂囦欢鍚嶇О">
+                <template #default="{ row }">
+                    <div style="display: flex;align-items: center;">
+                        <span style="margin-right: 8px;">{{ row.name }}</span>
+                        <!--
+                        <el-icon>
+                            <el-tooltip class="box-item" effect="light" content="鍏朵粬鏂囦欢"  placement="right">
+                            <FolderOpened />
+                            </el-tooltip>
+                        </el-icon>
+                        -->
+                    </div>
+                </template>
+            </el-table-column>
+            <el-table-column fixed="right" label="鎿嶄綔" width="150" align="center">
+                <template #default="scope">
+                    <!--'cureProgramTask', 鍥哄寲缂栧埗锛屼笉鑳藉垹闄ゅ拰涓婁紶-->
+                    <a style="color: blue;margin-right: 4px;cursor: pointer;font-size: 12px;"
+                        v-show="['programmingTask', 'replaceProgrammingTask','appendProgrammingTask'].includes(row.taskDefinitionKey)"
+                        type="text" size="small" @click.stop="del(scope.$index, scope.row)">鍒犻櫎</a>
+                    <a style="color: blue;cursor: pointer;font-size: 12px;margin-right: 4px;" type="text" size="small"
+                        @click.stop="downloadFile(scope.$index, scope.row)">涓嬭浇</a>
+                    <a style="color: blue;cursor: pointer;font-size: 12px;" type="text" size="small"
+                        v-show="['program-cure'].includes(row.processDefinitionKey)"
+                        @click.stop="diffFile(scope.$index, scope.row)">姣斿</a>
+                </template>
+            </el-table-column>
+        </el-table>
+        <!--
+        <el-collapse>
+            <el-collapse-item :title="`鍥哄寲鏃х増鏈�: 闆剁粍浠跺彿: ${row.variables.drawingNo} 宸ュ簭鍙�: ${row.variables.processNo } 宸ュ簭鐗堟: ${ row.variables.processEdition }`" name="1">
+                <el-table :data="fileData" border @row-click="showContent" max-height="200" highlight-current-row>
+                    <el-table-column type="index" label="#" width="40" align="center" />
+                    <el-table-column prop="name" label="鏂囦欢鍚�">
+                        <template #default="{ row }">
+                            <div style="display: flex;align-items: center;">
+                                <span>{{ row.name }}</span>
+                            </div>
+                        </template>
+                    </el-table-column>
+                    <el-table-column fixed="right" label="鎿嶄綔" width="150" align="center">
+                        <template #default="scope">
+                            <a style="color: blue;cursor: pointer;font-size: 12px;margin-right: 4px;" type="text" size="small"
+                                @click.stop="downloadFile(scope.$index, scope.row)">涓嬭浇</a>
+                        </template>
+                    </el-table-column>
+                </el-table>
+            </el-collapse-item>
+        </el-collapse>
+        -->
+        <h5>绋嬪簭鍐呭</h5>
         <div v-html="appContent" class="app-content">
         </div>
-        <el-dialog title="绋嬪簭閫夋嫨" v-model="appDialog" width="50%" v-if="appDialog">
-            <avue-crud :option="optionApp" v-model="form" v-model:page="page" ref="crud" :data="appData"
-                @current-change="currentChange" @size-change="sizeChange"
-                @on-load="onLoad" @selection-change="selectionChange">
-                <template #search="{ }"></template>
-                <template #search-menu="{ }"></template>
-            </avue-crud>
-            <div slot="footer" class="dialog-footer">
-                <el-button @click="appDialog = false">鍙� 娑�</el-button>
-                <el-button type="primary" @click="add">纭� 瀹�</el-button>
-            </div>
+        <el-dialog title="涓婁紶绋嬪簭鏂囦欢" v-model="programDialog" width="400" v-if="programDialog">
+            <avue-form :option="programOption" v-model="attForm" :upload-after="uploadAfter" class="att-box"></avue-form>
+        </el-dialog>
+        <el-dialog title="涓婁紶鍏朵粬鏂囦欢" v-model="otherFileDialog" width="400" v-if="otherFileDialog">
+            <avue-form :option="otherFileOption" v-model="attForm" :upload-after="uploadAfter" class="att-box"></avue-form>
+        </el-dialog>
+
+        <el-dialog title="鏂囦欢姣斿" v-model="diffDialog" width="80%">
+            <code-diff :old-string="this.content1" :new-string="this.content2" output-format="side-by-side"
+                :hideStat="true" :filename="codeDiffFileName1" :newFilename="codeDiffFileName2" />
         </el-dialog>
     </basic-container>
 </template>
 
 <script>
-import { getAppList,getSelectedAppList,getContent,removeAtt} from '@/api/flow/todolist';
+import { getFileData, getSelectedAppList, getContent, removeAtt,queryLockRemark } from '@/api/flow/todolist';
+import { exportBlob } from '@/api/common';
+import { getToken } from '@/utils/auth';
+import NProgress from 'nprogress';
+import { downloadXls } from '@/utils/util';
 export default {
     props: {
         row: {
             type: Object,
         }
     },
+    watch: {
+        'attForm.fileType': {
+            handler(newVal) {
+                this.attOption.column[1].data.fileType = newVal;
+            },
+            immediate: true,
+        },
+    },
     data() {
         return {
+            diffDialog: false,
+            content1: '',
+            content2: '',
+            codeDiffFileName1: '鍥炰紶鐗堟湰',
+            codeDiffFileName2: '涓嬪彂鐗堟湰',
             showContentId: '',
+            programOnMachine:false,//鏄惁鐜板満缂栧埗
             attForm: {
                 att: '',
+                fileType: 'program'
             }, //绋嬪簭涓婁紶琛ㄥ崟
-            attOption: {
+            programOption: {//绋嬪簭鏂囦欢涓婁紶
                 submitBtn: false,
                 emptyBtn: false,
                 menu: false,
                 column: [
+                    
                     {
-                        label: '娣诲姞绋嬪簭',
+                        label: '娣诲姞鏂囦欢',
                         prop: 'att',
                         type: 'upload',
                         multiple: true,
                         action: '/api/blade-mdm/flow/mgr/ncupload',
                         span: 24,
                         data: {
-                            processInstanceId: this.row.processInstanceId
+                            processInstanceId: this.row.processInstanceId,
+                            fileType: 'program',
                         },
                     }
                 ]
-            }, //绋嬪簭涓婁紶
+            }, 
+            otherFileOption: {//鍏朵粬鏂囦欢涓婁紶
+                submitBtn: false,
+                emptyBtn: false,
+                menu: false,
+                column: [
+                    
+                    {
+                        label: '娣诲姞鏂囦欢',
+                        prop: 'att',
+                        type: 'upload',
+                        multiple: true,
+                        action: '/api/blade-mdm/flow/mgr/ncupload',
+                        span: 24,
+                        data: {
+                            processInstanceId: this.row.processInstanceId,
+                            fileType: 'other',
+                        },
+                    }
+                ]
+            },
             tableData: [],//宸查�夌▼搴�
+            tableDataProgram:[], //绋嬪簭鏂囦欢锛歵ableData瀛愰泦
+            tableDataAttatch:[], //鍏朵粬鏂囦欢锛歵ableData瀛愰泦
             appContent: '',//绋嬪簭鍐呭
-            appDialog: false,
+            //appDialog: false,
+            programDialog: false, //绋嬪簭鏂囦欢涓婁紶瀵硅瘽妗唌odel
+            otherFileDialog: false, //鍏朵粬鏂囦欢涓婁紶瀵硅瘽妗唌odel
+
             form: {},
             page: {
                 page: 1,
@@ -83,6 +215,7 @@
             },
             appData: [],
             selectionList: [],
+            fileData: [],//宸查�夋枃浠�
             optionApp: {
                 menu: false,
                 gridBtn: false,
@@ -115,18 +248,70 @@
                     // },
                 ],
             },
+
+            remark:'',//閿佸畾鍘熷洜
         }
     },
     mounted() {
         this.getAttList();
+        this.getFileData();
+        this.getLockRemark();//鑾峰彇閿佸畾鍘熷洜
         this.onLoad(this.page);
+        
     },
     methods: {
+        getFileData () {
+            getFileData(this.row.processInstanceId).then(res => {
+                if (res.data.code !== 200) {
+                    this.$message.error(res.data.msg || '鑾峰彇鏂囦欢澶辫触');
+                    return;
+                } else {
+                    this.fileData = res.data.data || [];
+                }
+            })
+        },
+        getLockRemark () {
+            //鑾峰彇閿佸畾鍘熷洜
+            let nodeId = this.row.variables.nodeId;
+            if(!nodeId){
+                nodeId = this.row.variables.curedNodeId;
+            }
+            if(nodeId){
+                queryLockRemark(nodeId).then(res => {
+                    if (res.data.code == 200) {
+                        this.remark = res.data.data || '';
+                    } else {
+                        this.remark = '';
+                    }
+                });
+            }
+        },
+        diffFile(index, row) {
+            console.log(row)
+            axios({
+                url: '/blade-mdm/blade-mdm/flow/file/compare-with-try',
+                method: 'get',
+                params: { fileId: row.id },
+            }).then(
+                res => {
+                    if(res.data.success) {
+                        this.diffDialog = true;
+                        this.content1 = res.data.data.content1;
+                        this.content2 = res.data.data.content2;
+                    } else {
+                        this.$message.error(res.data.msg || '姣斿澶辫触');
+                    }
+                    
+                }
+            );
+        },
         uploadAfter(res, done, loading, column) {
             if (res.code === 200) {
                 this.getAttList();
-                this.$message.success('涓婁紶鎴愬姛');
+                this.$message.success(res.msg || '涓婁紶鎴愬姛');
                 this.attForm.att = '';
+                this.attForm.fileType = 'program'
+                this.appDialog = false
                 return done();
             } else {
                 console.log(res)
@@ -134,19 +319,37 @@
                 done()
             }
         },
-        getAttList () {
+        getAttList() {
             getSelectedAppList(this.row.processInstanceId).then(res => {
                 if (res.data.code !== 200) {
-                    this.$message.error('鑾峰彇宸查�夌▼搴忓け璐�');
+                    this.$message.error('鑾峰彇绋嬪簭鍒楄〃澶辫触');
                     return;
                 } else {
-                    this.tableData = res.data.data || [];
+                    this.tableData = res.data.data;//this.sortTable(res.data.data || []);
+
+                    this.tableDataProgram = this.sortTable(this.tableData.filter(f => f.program==true));
+                    this.tableDataAttatch = this.sortTable(this.tableData.filter(f => f.program==false));
                 }
                 // this.$emit('selection-change',this.tableData)
             })
         },
-        addApp() {
-            this.appDialog = true;
+        sortTable(data) {
+           data.sort(function(a,b){
+                if(a.program === b.program){//濡傛灉program鐩稿悓锛屾寜鐓ame鐨勯檷搴�
+                    //return a.name - b.name
+                    return a.name.localeCompare(b.name)
+                }else{
+                    return b.program - a.program
+                }
+            });
+            return data;
+        },
+        
+        addProgram() {
+            this.programDialog = true;
+        },
+        addOtherFile() {
+            this.otherFileDialog = true;
         },
         currentChange(currentPage) {
             this.page.currentPage = currentPage;
@@ -158,45 +361,55 @@
             this.selectionList = list;
         },
         onLoad(page, params = {}) {
-            const query = {}
-            getAppList(page.currentPage, page.pageSize, Object.assign(query, params)).then(res => {
-                const data = res.data.data;
-                this.page.total = data.total;
-                this.appData = data.records;
-            });
         },
-        add () {
+        add() {
             console.log('add')
             this.tableData = this.tableData.concat(this.selectionList.filter(item => {
                 return !this.tableData.some(existingItem => existingItem.id === item.id);
             }));
             this.appDialog = false;
-            this.$emit('selection-change',this.tableData)
+            this.$emit('selection-change', this.tableData)
         },
-        showContent (row, column, event) {
-            if(!row?.id) return this.appContent = '';
+        showContent(row, column, event) {
+            if (!row?.id) {
+                this.showContentId = ''
+                return this.appContent = '';
+            }
             this.showContentId = row.id
             getContent(row.id).then(res => {
-                if(res.data.code === 200) {
+                if (res.data.code === 200) {
                     this.appContent = res.data.data
                 } else {
                     this.appContent = '绋嬪簭鍐呭鍔犺浇澶辫触'
                 }
             })
         },
-        del (index,row) {
-            if(row.id === this.showContentId) {
+        del(index, row) {
+            if (row.id === this.showContentId) {
                 this.showContentId = '';
                 this.showContent(null, null, null);
             }
             removeAtt(row.id).then(res => {
-                if(res.data.code === 200) {
+                if (res.data.code === 200) {
                     this.$message.success('鍒犻櫎鎴愬姛');
                     this.getAttList();
                 } else {
                     this.$message.error('鍒犻櫎澶辫触');
                 }
             })
+        },
+        downloadFile(index, row) {
+            NProgress.start();
+            exportBlob(
+                `/blade-mdm/flow/mgr/down-flow-file?id=${row.id}`
+            ).then(res => {
+                console.log(res)
+                if (res.status !== 200) {
+                    return this.$message.error(res.msg);
+                }
+                downloadXls(res.data, `${row.name}`);
+                NProgress.done();
+            });
         }
     },
 }
@@ -204,6 +417,7 @@
 
 <style lang="scss" scoped>
 .tool {
+    margin-top:0px;
     text-align: right;
     margin-bottom: 10px;
 }
@@ -211,6 +425,7 @@
 .dialog-footer {
     text-align: center;
 }
+
 .app-content {
     background-color: #fffee1;
     padding: 10px 30px;
@@ -219,15 +434,15 @@
     max-height: 400px;
     white-space: pre-wrap;
 }
-
 </style>
 <style lang="scss">
-    .att-box {
-        .el-form-item--default {
-            margin-bottom: 0;
-        }
-        .avue-form__menu--center {
-            display: none;
-        }
+.att-box {
+    .el-form-item--default {
+        margin-bottom: 0;
     }
+
+    .avue-form__menu--center {
+        display: none;
+    }
+}
 </style>
\ No newline at end of file

--
Gitblit v1.9.3