<template>
|
<div>
|
<el-dialog
|
:title="`流程启动：` + projectInfo.projectName"
|
:visible.sync="show"
|
width="950px"
|
:destroy-on-close="true"
|
:close-on-click-modal="false"
|
:before-close="handleClose">
|
<div>
|
<div style="display: flex; flex-direction: row; justify-content: center; align-items: center;font-size: 24px">
|
<div>当前流程：</div>
|
<div v-if="nowProcessId">{{selectProcessName}}</div>
|
<div v-else>未绑定流程</div>
|
</div>
|
</div>
|
<div style="margin-top: 20px">
|
<el-table
|
ref="myTable"
|
:data="processList"
|
tooltip-effect="dark"
|
style="width: 100%"
|
@selection-change="handleSelectionChange">
|
<el-table-column
|
type="selection"
|
width="55">
|
</el-table-column>
|
<el-table-column
|
prop="name"
|
label="流程名称"
|
>
|
</el-table-column>
|
<el-table-column
|
prop="category"
|
label="流程类型"
|
>
|
</el-table-column>
|
<el-table-column label="项目类型" >
|
<template slot-scope="scope">
|
<dict-tag
|
:options="dict.type.sys_project_type"
|
:value="scope.row.projectType"
|
>
|
</dict-tag>
|
</template>
|
</el-table-column>
|
<el-table-column label="资金类型" >
|
<template slot-scope="scope">
|
<dict-tag
|
:options="dict.type.sys_funding_type"
|
:value="scope.row.fundType"
|
>
|
</dict-tag>
|
</template>
|
</el-table-column>
|
<el-table-column label="投资类别" >
|
<template slot-scope="scope">
|
<dict-tag
|
:options="dict.type.sys_investment_type"
|
:value="scope.row.investType"
|
>
|
</dict-tag>
|
</template>
|
</el-table-column>
|
<el-table-column label="重点分类" >
|
<template slot-scope="scope">
|
<dict-tag
|
:options="dict.type.sys_key_categories"
|
:value="scope.row.importanceType"
|
>
|
</dict-tag>
|
</template>
|
</el-table-column>
|
</el-table>
|
</div>
|
<span slot="footer" class="dialog-footer">
|
<el-button type="danger" @click="startProcess" :disable="!this.selectProcessId">启动流程</el-button>
|
<el-button type="primary" @click="changeProcess">变更</el-button>
|
</span>
|
</el-dialog>
|
</div>
|
</template>
|
|
<script>
|
import {projectSetProcess, startProcess} from "@/api/projectProcess/projectProcess";
|
|
export default {
|
dicts: ['sys_project_type', 'sys_funding_type', 'sys_investment_type', 'sys_key_categories'],
|
name: "RunProcess",
|
props: {
|
show: {
|
required: true,
|
type: Boolean
|
},
|
projectInfo: {
|
required: true, // 项目id、名称
|
type: Object
|
},
|
processList: { // 流程列表
|
required: true,
|
type: Array
|
},
|
nowProcessId: { // 当前项目绑定的流程id
|
required: true,
|
type: String
|
}
|
},
|
watch: {
|
// 监听回显值
|
projectInfo: {
|
handler(newVal, oldVal) {
|
console.log("传入值：", newVal, this.processList)
|
this.setSelect(this.nowProcessId)
|
},
|
deep: true
|
}
|
},
|
data() {
|
return {
|
selectProcessId: '', // 组件内部选中的流程id
|
selectProcessName: '', // 组件内部选中的流程id
|
}
|
},
|
methods: {
|
setSelect(value) {
|
console.log("调用值：", value)
|
this.processList.forEach((item,index) => {
|
console.log(item.id, value, item.id === value)
|
if(item.id === value){
|
this.selectProcessName = item.name
|
this.$nextTick(() => {
|
this.$refs.myTable.toggleRowSelection(item);
|
})
|
}
|
})
|
},
|
// 实现el-table单选
|
handleSelectionChange(val) {
|
console.log(val, "选中")
|
if (val.length > 1) {
|
this.$refs.myTable.clearSelection();
|
this.$refs.myTable.toggleRowSelection(val[val.length - 1]);
|
}
|
if(val.length != 0){
|
this.selectProcessId = val[val.length - 1].id;
|
console.log("选中id：", this.selectProcessId)
|
}
|
},
|
// 启动流程
|
startProcess() {
|
startProcess(this.projectInfo.projectId, this.selectProcessId).then(res => {
|
this.$message.success(res.msg);
|
})
|
},
|
// 变更流程
|
changeProcess() {
|
if (!this.selectProcessId) {
|
this.$message.error("选则一个流程后才能变更")
|
return
|
}
|
const data = {
|
projectId: this.projectInfo.projectId,
|
flowableProcessId: this.selectProcessId
|
}
|
projectSetProcess(data).then(res => {
|
this.$message.success("变更成功")
|
this.handleClose()
|
})
|
},
|
handleClose() {
|
this.selectProcessId = ""
|
this.selectProcessName = ""
|
this.$emit("close")
|
}
|
}
|
}
|
</script>
|
|
<style scoped>
|
/deep/ .el-table__header-wrapper .el-checkbox{
|
display:none
|
}
|
</style>
|
