<!--
|
* @Date: 2025-07-01 20:45:15
|
* @LastEditors: gaoshp
|
* @LastEditTime: 2025-08-27 20:48:41
|
* @FilePath: /mdmweb/src/views/flow/components/TodolistLeft.vue
|
-->
|
<template>
|
<basic-container>
|
<!--'cureProgramTask', 固化编制不能添加文件-->
|
<div class="tool" v-show="['programmingTask', 'replaceProgrammingTask','appendProgrammingTask'].includes(row.taskDefinitionKey)">
|
|
<!--无固化的情况才显示该开关-->
|
<el-switch v-if="row.variables.hasCuredProgram!=='Y'" v-model="programOnMachine" active-text="现场编制" inactive-text="工艺员编制" />
|
|
<el-button type="primary" :disabled="programOnMachine" plain @click="addApp">添加文件
|
</el-button>
|
</div>
|
<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/>解锁原因：</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="tableData" border @row-click="showContent" :row-style="{height:'20px'}" :cell-style="{padding:'0px'}" max-height="240" 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="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>
|
-->
|
<h4>程序内容</h4>
|
<div v-html="appContent" class="app-content">
|
</div>
|
<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> -->
|
</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,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: {
|
submitBtn: false,
|
emptyBtn: false,
|
menu: false,
|
column: [
|
{
|
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,
|
fileType: 'program',
|
},
|
}
|
]
|
}, //程序上传
|
tableData: [],//已选程序
|
appContent: '',//程序内容
|
appDialog: false,
|
form: {},
|
page: {
|
page: 1,
|
size: 10,
|
total: 0,
|
},
|
appData: [],
|
selectionList: [],
|
fileData: [],//已选文件
|
optionApp: {
|
menu: false,
|
gridBtn: false,
|
addBtn: false,
|
editBtn: false,
|
delBtn: false,
|
columnBtn: false,
|
refreshBtn: false,
|
searchShowBtn: false,
|
tip: false,
|
searchShow: false,
|
dialogWidth: '60%',
|
border: true,
|
index: true,
|
selection: true,
|
menuWidth: 100,
|
dialogClickModal: false,
|
column: [
|
{
|
label: '加工机床',
|
prop: 'machineCode',
|
},
|
{
|
label: '程序名称',
|
prop: 'name',
|
},
|
// {
|
// label: '工序名称',
|
// prop: 'processName',
|
// },
|
],
|
},
|
|
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(res.msg || '上传成功');
|
this.attForm.att = '';
|
this.attForm.fileType = 'program'
|
this.appDialog = false
|
return done();
|
} else {
|
console.log(res)
|
this.$message.warning(res.msg || '上传失败');
|
done()
|
}
|
},
|
getAttList() {
|
getSelectedAppList(this.row.processInstanceId).then(res => {
|
if (res.data.code !== 200) {
|
this.$message.error('获取已选程序失败');
|
return;
|
} else {
|
this.tableData = res.data.data || [];
|
}
|
// this.$emit('selection-change',this.tableData)
|
})
|
},
|
addApp() {
|
this.appDialog = true;
|
},
|
currentChange(currentPage) {
|
this.page.currentPage = currentPage;
|
},
|
sizeChange(pageSize) {
|
this.page.pageSize = pageSize;
|
},
|
selectionChange(list) {
|
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() {
|
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)
|
},
|
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) {
|
this.appContent = res.data.data
|
} else {
|
this.appContent = '程序内容加载失败'
|
}
|
})
|
},
|
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) {
|
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();
|
});
|
}
|
},
|
}
|
</script>
|
|
<style lang="scss" scoped>
|
.tool {
|
text-align: right;
|
margin-bottom: 10px;
|
}
|
|
.dialog-footer {
|
text-align: center;
|
}
|
|
.app-content {
|
background-color: #fffee1;
|
padding: 10px 30px;
|
min-height: 100px;
|
overflow: auto;
|
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;
|
}
|
}
|
</style>
|
