<template>
|
<el-dialog v-dialogDrag
|
:close-on-click-modal="false"
|
:destroy-on-close="true"
|
:visible.sync="visible"
|
:width="width"
|
append-to-body="true"
|
class="avue-dialog"
|
style="margin-top: -10% !important;"
|
title="启动流程"
|
top="0"
|
@close="dialogClose">
|
|
<el-form :model="saveParam" :rules="rules" class="demo-form-inline" label-position="left" label-width="auto">
|
<el-form-item label="流程模板">
|
<el-input v-model="saveParam.modelName" disabled placeholder="流程模板"></el-input>
|
</el-form-item>
|
<el-form-item label="流程名称" prop="processName">
|
<el-input v-model="saveParam.processName" placeholder="流程名称">
|
</el-input>
|
</el-form-item>
|
<el-form-item label="流程描述">
|
<el-input v-model="saveParam.processDesc" :rows="4" placeholder="流程描述" type="textarea">
|
</el-input>
|
</el-form-item>
|
</el-form>
|
|
<el-divider></el-divider>
|
<!-- <div class="btns-icon">-->
|
<!-- <el-button circle icon="el-icon-star-off" @click="handleCollect"></el-button>-->
|
<!-- </div>-->
|
<el-form :model="collectParam" class="demo-form-inline" label-position="left" label-width="auto">
|
<el-form-item v-for="(item, index) in initFrom" :key="index" :label="`节点${index + 1}`">
|
<el-select style="width: 100%;" filterable v-model="collectParam.flowTaskUsers[index]['userId']"
|
:placeholder="item.value" @change="handleSelect($event, index)">
|
<el-option :label="key.name" :value="key.name" v-for="(key, keyi) in item.processNodes"
|
:key="keyi"></el-option>
|
</el-select>
|
</el-form-item>
|
</el-form>
|
<div slot="footer" class="dialog-footer">
|
<el-button @click="handleCancel">取 消</el-button>
|
<el-button type="primary" @click="handleConfirm">确 定</el-button>
|
</div>
|
|
</el-dialog>
|
</template>
|
|
<script>
|
import {validatenull} from "@/util/validate";
|
import {getTemplateByType, getAllProcessNode} from "@/api/base/startWork/index"
|
|
export default {
|
name: "startWorkFlow",
|
props: {
|
paramVOS: {
|
type: Object,
|
default: {}
|
},
|
sourceData: {
|
//所属区域的上一区域选中数据
|
type: Object,
|
default: {}
|
},
|
dataStore: {
|
//弹窗时按钮所属区域选中数据
|
type: Array,
|
default: []
|
},
|
},
|
data() {
|
return {
|
visible: false,
|
saveParam: {}, // 对象包含 {modelName流程模板(由接口返回当前流程模板) , processName流程名称（为当前用户+'启动流程'+当前分类） , processDesc流程描述 }
|
initFrom: [], // 当前流程节点循环数组
|
collectParam: {}, // 流程节点下拉框双向绑定属性
|
typeName: [], // 流程节点option循环选项
|
rules: {
|
processName: [
|
{required: true, message: '流程名称不能为空', trigger: 'blur'},
|
{min: 3, max: 50, message: '长度在 3 到 50 个字符', trigger: 'blur'}
|
]
|
}
|
}
|
},
|
watch: {
|
users: {
|
handler(val) {
|
this.collectParam.flowTaskUsers = val
|
},
|
deep: true,
|
immediate: true
|
},
|
parameter: {
|
handler(newval, oldval) {
|
this.saveParam = Object.assign({processName: '', processDesc: '',}, newval);
|
},
|
deep: true,
|
immediate: true
|
}
|
},
|
computed: {
|
fullscreen() {
|
if (this.paramVOS.width || this.paramVOS.height) {
|
return false;
|
} else if (this.paramVOS.form) {
|
return false;
|
}
|
return true;
|
},
|
width() {
|
if (!validatenull(this.paramVOS.width)) {
|
if (this.paramVOS.width.includes("px") || this.paramVOS.width.includes("%")) {
|
return this.paramVOS.width;
|
} else {
|
return this.paramVOS.width + "px";
|
}
|
} else {
|
return "40%";
|
}
|
},
|
},
|
created() {
|
this.modelNameChange();
|
this.getWorkByType();
|
},
|
mounted() {
|
},
|
methods: {
|
// 获取流程模板信息
|
getWorkByType() {
|
let params = {
|
type: '文档审签流程',
|
filterTemplate: ""
|
}
|
getTemplateByType(params).then(res => {
|
const data = res.data.data;
|
data.forEach(item => {
|
this.getProcessNode(item);
|
})
|
this.initFrom = data;
|
}).catch(error => {
|
console.log(error);
|
})
|
},
|
|
// 请求流程节点
|
getProcessNode(item) {
|
let params = {
|
processOid: item.attributes.oid,
|
maxSecret: -1
|
}
|
getAllProcessNode(params).then(res => {
|
const nodes = res.data.data;
|
item.processNodes = nodes;
|
}).catch(error => {
|
console.log(error);
|
})
|
},
|
|
// 关闭弹窗
|
dialogClose() {
|
this.visible = false;
|
},
|
|
handleSelect() {
|
|
},
|
|
handleCollect() {
|
|
},
|
|
handleCancel() {
|
this.dialogClose();
|
},
|
|
handleConfirm() {
|
console.log(this.initFrom);
|
},
|
|
// 流程名称初始化绑定
|
modelNameChange() {
|
var userInfo = JSON.parse(localStorage.getItem('saber-userInfo'));
|
|
if (this.paramVOS && this.paramVOS.modelName) {
|
this.saveParam.modelName = this.paramVOS.modelName;
|
} else if (userInfo.content && userInfo.content.userName) {
|
this.saveParam.modelName = userInfo.content.userName + '启动流程';
|
} else {
|
this.saveParam.modelName = '';
|
}
|
}
|
}
|
}
|
</script>
|
|
<style lang="scss" scoped>
|
|
</style>
|
