| | |
| | | <div> |
| | | <el-form label-position="top" label-width="90px"> |
| | | <el-form-item label="⚙ 选择审批组或审批架构" prop="text" class="user-type"> |
| | | <el-select @change="selected(this,'group')" value-key="id" style="width: 80%;" size="small" v-model="nodeProps.approvalGroup" placeholder="请选择审批组"> |
| | | <el-option v-for="approvals in approvalGroups" :label="approvals.name" :value="approvals" :key="approvals.id"></el-option> |
| | | <el-select @change="selected(this,'group')" value-key="id" style="width: 80%;" size="small" |
| | | v-model="nodeProps.approvalGroup" placeholder="请选择审批组"> |
| | | <el-option v-for="approvals in approvalGroups" :label="approvals.name" :value="approvals" |
| | | :key="approvals.id"></el-option> |
| | | </el-select> |
| | | </el-form-item> |
| | | |
| | | <el-form-item label="⚙ 选择审批组或审批架构" prop="text" class="user-type"> |
| | | <el-select @change="selected(this,'staff')" value-key="id" style="width: 80%;" size="small" v-model="nodeProps.staffGroup" placeholder="请选择审批架构"> |
| | | <el-option v-for="staffApprovals in staffGroups" :label="staffApprovals.name" :value="staffApprovals" :key="staffApprovals.id"></el-option> |
| | | <el-select @change="selected(this,'staff')" value-key="id" style="width: 80%;" size="small" |
| | | v-model="nodeProps.staffGroup" placeholder="请选择审批架构"> |
| | | <el-option v-for="staff in staffGroups" :label="staff.name" :value="staff" |
| | | :key="staff.id"></el-option> |
| | | </el-select> |
| | | </el-form-item> |
| | | <el-divider></el-divider> |
| | | <el-form-item label="参数名"> |
| | | <el-input style="width: 80%;" placeholder="参数名" v-model="nodeProps.params" size="small" clearable /> |
| | | </el-form-item> |
| | | |
| | | <el-divider></el-divider> |
| | | <el-form-item label="触发事件"> |
| | | <div> |
| | | <el-button type="primary" size="mini" icon="el-icon-plus" style="margin: 0 15px 15px 0" round @click="addConditionGroup"> |
| | | <el-button type="primary" size="mini" icon="el-icon-plus" style="margin: 0 15px 15px 0" round |
| | | @click="addConditionGroup"> |
| | | 添加审批触发事件 |
| | | </el-button> |
| | | </div> |
| | | |
| | | <div style="width: 100%" v-for="(group, index) in selectedNode.props.groups" :key="index + '_g'" class="group"> |
| | | <div class="group-header"> |
| | | <span class="group-name">触发事件{{index+1}}</span> |
| | | <i class="el-icon-delete" @click="delGroup(index)"></i> |
| | | |
| | | </div> |
| | | <el-row :gutter="10" > |
| | | <el-col :span="12"><el-select @change="selected(this)" size="small" v-model="group.action" placeholder="请选择审批组"> |
| | | <el-option v-for="actionItem in actions" :label="actionItem.label" :value="actionItem" :key="actionItem.value"></el-option> |
| | | <el-col :span="12"> |
| | | <el-select @change="selected(this)" size="small" v-model="group.action" placeholder="请选择审批组"> |
| | | <el-option v-for="actionItem in actions" :label="actionItem.label" :value="actionItem" |
| | | :key="actionItem.value"></el-option> |
| | | </el-select> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | |
| | | <el-col :span="20"> |
| | | <el-input placeholder="java方法" v-model="group.method" size="small" clearable></el-input> |
| | | </el-col> |
| | | |
| | | |
| | | </el-row> |
| | | </div> |
| | | |
| | | </el-form-item> |
| | | <el-form-item label="🙅 如果办理被驳回 👇"> |
| | | <el-radio-group @input="setValue" v-model="nodeProps.refuse.type"> |
| | |
| | | </el-radio-group> |
| | | <div v-if="nodeProps.refuse.type === 'TO_NODE'"> |
| | | <span>指定节点:</span> |
| | | <el-select style="margin-left: 10px; width: 150px;" placeholder="选择跳转节点" size="small" v-model="nodeProps.refuse.target"> |
| | | <el-select style="margin-left: 10px; width: 150px;" placeholder="选择跳转节点" size="small" |
| | | v-model="nodeProps.refuse.target"> |
| | | <el-option v-for="(node, i) in nodeOptions" :key="i" :label="node.name" :value="node.id"></el-option> |
| | | </el-select> |
| | | </div> |
| | | |
| | | </el-form-item> |
| | | </el-form> |
| | | <org-picker :title="pickerTitle" multiple :type="orgPickerType" ref="orgPicker" :selected="orgPickerSelected" |
| | | @ok="selected"/> |
| | | </div> |
| | | </template> |
| | | |
| | | <script> |
| | | import OrgPicker from "@/components/common/OrgPicker"; |
| | | import {getDict, getEntitySet} from "@/api/design"; |
| | | |
| | | |
| | | export default { |
| | | name: "ApprovalNodeConfig", |
| | | components: {OrgPicker}, |
| | | props: { |
| | | config: { |
| | | type: Object, |
| | |
| | | return { |
| | | showOrgSelect: false, |
| | | orgPickerSelected: [], |
| | | orgPickerType: 'user', |
| | | groupNames: ['1', '2', '3', '4', '6', 'F', 'G', 'H', 'I', 'J'], |
| | | approvalGroups:[ |
| | | // {"value":'first',"label":'地区经理审批'}, |
| | | // {"value":'secound',"label":'大区经理审批'}, |
| | | // {"value":'third',"label":'商务经理审批'}, |
| | | // {"value":'four',"label":'财务经理审批'}, |
| | | // {"value":'five',"label":'总经理审批'}, |
| | | ], |
| | | staffGroups:[], |
| | | actions:[ |
| | |
| | | return this.$store.state.selectedNode |
| | | }, |
| | | nodeProps() { |
| | | |
| | | // this.$store.state.selectedNode.props.staffGroup=this.$store.state.selectedNode.props.assignedUser[0] |
| | | // //this.$store.state.selectedNode.props.staffGroup.code="SalesDirector" |
| | | // //this.$store.state.selectedNode.props.staffGroup.id="position_sales_1" |
| | | // console.log("this.$store.state.selectedNode.props",this.$store.state.selectedNode.props) |
| | | return this.$store.state.selectedNode.props |
| | | }, |
| | | select() { |
| | | console.log("this.config--select",this.config) |
| | | return this.config.assignedUser |
| | | }, |
| | | |
| | | pickerTitle() { |
| | | switch (this.orgPickerType) { |
| | | case 'user': |
| | | return '请选择人员'; |
| | | case 'role': |
| | | return '请选择系统角色'; |
| | | default: |
| | | return null; |
| | | } |
| | | }, |
| | | |
| | | }, |
| | | mounted() { |
| | | this.getApprovalGroup(); |
| | | this.getStaffGroup(); |
| | | console.log("this.$store.state.selectedNode.props.staffGroup",this.$store.state.selectedNode.props.staffGroup) |
| | | }, |
| | | methods: { |
| | | getApprovalGroup(){ |
| | | let template = {"dataname": "sys_state_board","attachMeta":true} |
| | | getEntitySet(template).then(rsp => { |
| | | console.log("getEntitySet", rsp.data.data) |
| | | this.approvalGroups = rsp.data.data.entityset |
| | | |
| | | console.log("this.approvalGroups", this.approvalGroups) |
| | | }).catch(err => this.$message.error('获取审批流程异常')) |
| | | }, |
| | | getStaffGroup(){ |
| | | let template = {"code":"position_sales"} |
| | | getDict(template).then(rsp => { |
| | | console.log("getDict", rsp.data.data.dictionary) |
| | | this.staffGroups=this.$Utils.decode(rsp.data.data.dictionary.items) |
| | | this.staffGroups.forEach(item=>item.name=item.value); |
| | | this.staffGroups.forEach(item=>item.id=item.code); |
| | | console.log("getDict", this.staffGroups) |
| | | this.staffGroups.forEach(item => { |
| | | item.name = item.value |
| | | item.id = item.code |
| | | }); |
| | | // this.staffGroups.forEach(item => ); |
| | | }).catch(err => this.$message.error('获取审批流程异常')) |
| | | }, |
| | | //如果切换选箱不是指定节点 那就把之前选择的指定节点信息 给清除掉 避免提交上去 |
| | | setValue(){ |
| | | if(this.nodeProps.refuse.type!=='TO_NODE'){ |
| | | this.nodeProps.refuse.target=''; |
| | | |
| | | } |
| | | }, |
| | | delGroup(index) { |
| | | this.selectedNode.props.groups.splice(index, 1) |
| | | }, |
| | | addConditionGroup() { |
| | | console.log("this.config",this.config) |
| | | this.config.groups.push({ |
| | | // cids:[], |
| | | // groupType: "OR", |
| | | //conditions:[] |
| | | }) |
| | | }, |
| | | selected(select,type) { |
| | | console.log("输出选中select",this.nodeProps) |
| | | this.nodeProps.assignedUser=[] |
| | | |
| | | if(type==='group'){ |
| | | this.nodeProps.staffGroup={} |
| | | this.nodeProps.assignedUser.push({ |
| | |
| | | } |
| | | ) |
| | | } |
| | | console.log("assignedUser",this.config) |
| | | this.orgPickerSelected.length = 0 |
| | | |
| | | }, |
| | | removeOrgItem(index) { |
| | | this.select.splice(index, 1) |
| | |
| | | <style lang="less" scoped> |
| | | .el-row { |
| | | margin-bottom: 20px; |
| | | |
| | | &:last-child { |
| | | margin-bottom: 0; |
| | | } |
| | | } |
| | | |
| | | .el-col { |
| | | border-radius: 4px; |
| | | } |
| | | |
| | | .user-type { |
| | | /deep/ .el-radio { |
| | | width: 110px; |