| | |
| | | <!-- |
| | | * @Date: 2025-07-01 20:45:15 |
| | | * @LastEditors: gaoshp |
| | | * @LastEditTime: 2025-08-06 20:16:01 |
| | | * @LastEditTime: 2025-08-20 21:03:19 |
| | | * @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', 固化编制不能添加文件--> |
| | | <div class="tool" v-show="['programmingTask', 'repalceProgrammingTask','appendProgrammingTask'].includes(row.taskDefinitionKey)"> |
| | | <el-button type="primary" plain @click="addApp">添加文件 |
| | | </el-button> |
| | | </div> |
| | | <el-table :data="tableData" border @row-click="showContent" max-height="200"> |
| | | <el-text type="danger" v-if="row.variables.curedLocked === 'Y'">固化程序已加锁,请谨慎使用</el-text> |
| | | <el-table :data="tableData" border @row-click="showContent" max-height="200" highlight-current-row> |
| | | <!-- <el-table-column prop="machineCode" label="加工机床"> |
| | | </el-table-column> --> |
| | | |
| | | <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 v-if="row.fileType === 'other'"> |
| | | <FolderOpened /> |
| | | </el-icon> |
| | | <img v-else src="./app.jpg" alt="" width="16" height="16"> |
| | | </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', 'repalceProgrammingTask','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> |
| | | <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-dialog title="程序选择" v-model="appDialog" width="400" v-if="appDialog"> |
| | | <avue-form :option="attOption" v-model="attForm" :upload-after="uploadAfter" class="att-box"></avue-form> |
| | | <!-- <div slot="footer" class="dialog-footer"> |
| | | <el-button @click="appDialog = false">取 消</el-button> |
| | | <el-button type="primary" @click="add">确 定</el-button> |
| | | </div> |
| | | </div> --> |
| | | </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 { getAppList, getSelectedAppList, getContent, removeAtt } 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: '', |
| | | attForm: { |
| | | att: '', |
| | | fileType: 'program' |
| | | }, //程序上传表单 |
| | | attOption: { |
| | | submitBtn: false, |
| | |
| | | menu: false, |
| | | column: [ |
| | | { |
| | | label: '添加程序', |
| | | label: '文件类型', |
| | | prop: 'fileType', |
| | | type: 'select', |
| | | span: 24, |
| | | clearable: false, |
| | | dicData: [ |
| | | { label: '程序文件', value: 'program' }, |
| | | { label: '其他文件', value: 'other' }, |
| | | ], |
| | | }, |
| | | { |
| | | 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', |
| | | }, |
| | | } |
| | | ] |
| | |
| | | this.onLoad(this.page); |
| | | }, |
| | | methods: { |
| | | 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) |
| | |
| | | done() |
| | | } |
| | | }, |
| | | getAttList () { |
| | | getAttList() { |
| | | getSelectedAppList(this.row.processInstanceId).then(res => { |
| | | if (res.data.code !== 200) { |
| | | this.$message.error('获取已选程序失败'); |
| | |
| | | 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(); |
| | | }); |
| | | } |
| | | }, |
| | | } |
| | |
| | | .dialog-footer { |
| | | text-align: center; |
| | | } |
| | | |
| | | .app-content { |
| | | background-color: #fffee1; |
| | | padding: 10px 30px; |
| | |
| | | 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> |