巡查上报设置
This commit is contained in:
		| @@ -1,124 +1,140 @@ | ||||
| <template> | ||||
|   <ai-list class="AppPatrolReportSet"> | ||||
|   <ai-detail class="AppPatrolReportSet"> | ||||
|     <ai-title slot="title" title="巡查上报设置"  isShowBottomBorder> | ||||
|       <el-button size="small" type="primary" icon="iconfont iconAdd" slot="rightBtn" @click="add">添加节点</el-button> | ||||
|     </ai-title> | ||||
|     <template slot="content"> | ||||
|       <div class="item"> | ||||
|         <div class="btn"> | ||||
|           <el-button type="text">编辑</el-button> | ||||
|           <el-button type="text">删除</el-button> | ||||
|         </div> | ||||
|         <div class="index">01</div> | ||||
|         <div class="info"> | ||||
|           <div class="label">节点类型</div> | ||||
|           <div class="value">混合节点</div> | ||||
|         </div> | ||||
|         <div class="info"> | ||||
|           <div class="label">上级节点网络</div> | ||||
|           <div class="value">混合节点</div> | ||||
|         </div> | ||||
|         <div class="flex"> | ||||
|       <div class="list" v-if="list.length"> | ||||
|         <div class="item" v-for="(item, index) in list" :key="index"> | ||||
|           <div class="btn"> | ||||
|             <el-button type="text" @click="edit(index)">编辑</el-button> | ||||
|             <el-button type="text" @click="del(index)">删除</el-button> | ||||
|           </div> | ||||
|           <div class="index">{{index < 9 ? `0${index+1}` : `${index+1}`}}</div> | ||||
|           <div class="info"> | ||||
|             <div class="label">生效功能</div> | ||||
|             <div class="value"> | ||||
|               <span>添加</span> | ||||
|               <span>办理</span> | ||||
|               <span>转交</span> | ||||
|             </div> | ||||
|             <div class="label">节点类型</div> | ||||
|             <div class="value">{{item.nodeType == 0 ? '首节点' : $dict.getLabel('prfcNodeType', item.nodeType)}}</div> | ||||
|           </div> | ||||
|           <div class="info"> | ||||
|             <div class="label">生效身份</div> | ||||
|             <div class="value"> | ||||
|               <span>网格员</span> | ||||
|               <span>网格长</span> | ||||
|             <div class="label">上级节点网络</div> | ||||
|             <div class="value">{{item.girdName}}</div> | ||||
|           </div> | ||||
|           <div class="flex"> | ||||
|             <div class="info"> | ||||
|               <div class="label">生效功能</div> | ||||
|               <div class="value"> | ||||
|                 <span v-if="item.functionAdd == 1">添加</span> | ||||
|                 <span v-if="item.functionHandle == 1">办理</span> | ||||
|                 <span v-if="item.functionTransmit == 1">转交</span> | ||||
|               </div> | ||||
|             </div> | ||||
|             <div class="info"> | ||||
|               <div class="label">生效身份</div> | ||||
|               <div class="value"> | ||||
|                 <span v-if="item.roleAdmin == 1">网格员</span> | ||||
|                 <span v-if="item.roleMember == 1">网格长</span> | ||||
|               </div> | ||||
|             </div> | ||||
|           </div> | ||||
|         </div> | ||||
|         <div class="info"> | ||||
|           <div class="label">同级节点网络</div> | ||||
|           <div class="value">李凤村子网络(当前选中网格层级生效)</div> | ||||
|         </div> | ||||
|         <div class="flex"> | ||||
|           <div class="info"> | ||||
|             <div class="label">生效功能</div> | ||||
|             <div class="value"> | ||||
|               <span>添加</span> | ||||
|               <span>办理</span> | ||||
|               <span>转交</span> | ||||
|  | ||||
|           <div v-if="item.nodeType == 3"> | ||||
|             <div class="info"> | ||||
|               <div class="label">同级节点网络</div> | ||||
|               <div class="value">{{item.girdName2}}</div> | ||||
|             </div> | ||||
|           </div> | ||||
|           <div class="info"> | ||||
|             <div class="label">生效身份</div> | ||||
|             <div class="value"> | ||||
|               <span>网格员</span> | ||||
|               <span>网格长</span> | ||||
|             <div class="flex"> | ||||
|               <div class="info"> | ||||
|                 <div class="label">生效功能</div> | ||||
|                 <div class="value"> | ||||
|                   <span v-if="item.functionAdd == 1">添加</span> | ||||
|                   <span v-if="item.functionHandle == 1">办理</span> | ||||
|                   <span v-if="item.functionTransmit == 1">转交</span> | ||||
|                 </div> | ||||
|               </div> | ||||
|               <div class="info"> | ||||
|                 <div class="label">生效身份</div> | ||||
|                 <div class="value"> | ||||
|                   <span v-if="item.roleAdmin == 1">网格员</span> | ||||
|                   <span v-if="item.roleMember == 1">网格长</span> | ||||
|                 </div> | ||||
|               </div> | ||||
|               <!-- <div class="info"> | ||||
|                 <div class="label">条件约束</div> | ||||
|                 <div class="value">名称约束</div> | ||||
|               </div> --> | ||||
|             </div> | ||||
|           </div> | ||||
|           <div class="info"> | ||||
|             <div class="label">条件约束</div> | ||||
|             <div class="value">名称约束</div> | ||||
|           </div> | ||||
|         </div> | ||||
|       </div> | ||||
|       <ai-dialog :visible.sync="dialog" :title="dialogTitle" @closed="$refs.form.resetFields()" @onConfirm="onConfirm"> | ||||
|       <ai-empty v-else>暂无数据</ai-empty> | ||||
|        | ||||
|       <ai-dialog :visible.sync="dialog" :title="dialogTitle" @closed="$refs.form.resetFields()" @onConfirm="onConfirm" width="60%"> | ||||
|         <el-form ref="form" :rules="rules" size="small" :model="form" label-width="110px"> | ||||
|           <el-form-item label="节点类型" prop="name"> | ||||
|             <ai-select | ||||
|               v-model="form.eventStatus" | ||||
|           <el-form-item label="节点类型" prop="nodeType" v-if="form.nodeType === '0'"> | ||||
|             <ai-select disabled | ||||
|               v-model="form.nodeType" | ||||
|               clearable | ||||
|               placeholder="请选择..." | ||||
|               :selectList="dict.getDict('clapEventStatus')"> | ||||
|               :selectList="nodeTypeDictList"> | ||||
|             </ai-select> | ||||
|           </el-form-item> | ||||
|           <el-form-item label="选择节点网格" prop="idNumber"> | ||||
|             <ai-select | ||||
|               v-model="form.eventStatus" | ||||
|           <el-form-item label="节点类型" prop="nodeType" v-else> | ||||
|             <ai-select :disabled="getGirdList.length == 1" | ||||
|               v-model="form.nodeType" | ||||
|               clearable | ||||
|               placeholder="请选择..." | ||||
|               :selectList="dict.getDict('clapEventStatus')"> | ||||
|               :selectList="dict.getDict('prfcNodeType')" @change="changeNodeType"> | ||||
|             </ai-select> | ||||
|             <el-checkbox v-model="checked">当前选中网格层级生效</el-checkbox> | ||||
|           </el-form-item> | ||||
|           <el-form-item label="生效功能" prop="status"> | ||||
|             <el-checkbox-group v-model="checkList"> | ||||
|               <el-checkbox label="0">添加</el-checkbox> | ||||
|               <el-checkbox label="1">办理</el-checkbox> | ||||
|               <el-checkbox label="2">转交</el-checkbox> | ||||
|             </el-checkbox-group> | ||||
|           <el-form-item label="选择节点网格" prop="girdId" > | ||||
|             <ai-picker v-if="form.nodeType === '0'" | ||||
|               :ops="{label: 'girdName'}" | ||||
|               dialogTitle="选择节点网格" | ||||
|               action="/app/appgirdinfo/girdList" | ||||
|               :instance="instance" | ||||
|               @pick="onGirdChange" | ||||
|               v-model="form.girdIdList"> | ||||
|               <div class="userSelcet"> | ||||
|                 <span style="color: #606266;" v-if="form.girdIdList.length">{{ form.girdName }}</span> | ||||
|                 <span v-else>选择节点网格</span> | ||||
|                 <i class="el-icon-arrow-down"></i> | ||||
|               </div> | ||||
|             </ai-picker> | ||||
|             <el-input placeholder="节点网格" v-model="form.girdName" disabled v-else></el-input> | ||||
|             <el-checkbox v-model="sameLevelUsed" disabled>当前选中网格层级生效</el-checkbox> | ||||
|           </el-form-item> | ||||
|           <el-form-item label="生效身份" prop="status"> | ||||
|             <el-checkbox-group v-model="checkList"> | ||||
|               <el-checkbox label="0">网格员</el-checkbox> | ||||
|               <el-checkbox label="1">网格长</el-checkbox> | ||||
|             </el-checkbox-group> | ||||
|           <el-form-item label="生效功能"> | ||||
|             <el-checkbox v-model="form.functionAdd" true-label="1" false-label="0">添加</el-checkbox> | ||||
|             <el-checkbox v-model="form.functionHandle" true-label="1" false-label="0">办理</el-checkbox> | ||||
|             <el-checkbox v-model="form.functionTransmit" true-label="1" false-label="0">转交</el-checkbox> | ||||
|           </el-form-item> | ||||
|           <el-form-item label="同级节点网格" prop="idNumber"> | ||||
|             <ai-select | ||||
|               v-model="form.eventStatus" | ||||
|               clearable | ||||
|               placeholder="请选择..." | ||||
|               :selectList="dict.getDict('clapEventStatus')"> | ||||
|             </ai-select> | ||||
|             <el-checkbox v-model="checked">当前选中网格层级生效</el-checkbox> | ||||
|           </el-form-item> | ||||
|           <el-form-item label="生效功能" prop="status"> | ||||
|             <el-checkbox-group v-model="checkList"> | ||||
|               <el-checkbox label="0">添加</el-checkbox> | ||||
|               <el-checkbox label="1">办理</el-checkbox> | ||||
|               <el-checkbox label="2">转交</el-checkbox> | ||||
|             </el-checkbox-group> | ||||
|           </el-form-item> | ||||
|           <el-form-item label="生效身份" prop="status"> | ||||
|             <el-checkbox-group v-model="checkList"> | ||||
|               <el-checkbox label="0">网格员</el-checkbox> | ||||
|               <el-checkbox label="1">网格长</el-checkbox> | ||||
|             </el-checkbox-group> | ||||
|           <el-form-item label="生效身份"> | ||||
|             <el-checkbox v-model="form.roleAdmin" true-label="1" false-label="0">网格员</el-checkbox> | ||||
|             <el-checkbox v-model="form.roleMember" true-label="1" false-label="0">网格长</el-checkbox> | ||||
|           </el-form-item> | ||||
|           <div v-if="form.nodeType == 3"> | ||||
|             <el-form-item label="同级节点网格" prop="girdId2"> | ||||
|               <el-input placeholder="节点网格" v-model="form.girdName2" disabled></el-input> | ||||
|               <el-checkbox v-model="sameLevelUsed" disabled>当前选中网格层级生效</el-checkbox> | ||||
|             </el-form-item> | ||||
|             <el-form-item label="生效功能"> | ||||
|               <el-checkbox v-model="form.functionAdd2" true-label="1" false-label="0">添加</el-checkbox> | ||||
|               <el-checkbox v-model="form.functionHandle2" true-label="1" false-label="0">办理</el-checkbox> | ||||
|               <el-checkbox v-model="form.functionTransmit2" true-label="1" false-label="0">转交</el-checkbox> | ||||
|             </el-form-item> | ||||
|             <el-form-item label="生效身份"> | ||||
|               <el-checkbox v-model="form.roleAdmin2" true-label="1" false-label="0">网格员</el-checkbox> | ||||
|               <el-checkbox v-model="form.roleMember2" true-label="1" false-label="0">网格长</el-checkbox> | ||||
|             </el-form-item> | ||||
|           </div> | ||||
|         </el-form> | ||||
|       </ai-dialog> | ||||
|     </template> | ||||
|   </ai-list> | ||||
|     <template slot="footer"> | ||||
|       <el-button @click="getList">取消</el-button> | ||||
|       <el-button type="primary" @click="confirm">提交</el-button> | ||||
|     </template> | ||||
|   </ai-detail> | ||||
| </template> | ||||
|  | ||||
| <script> | ||||
| @@ -137,35 +153,157 @@ | ||||
|         dialog: false, | ||||
|         dialogTitle: '', | ||||
|         form: { | ||||
|           eventStatus: '' | ||||
|           nodeType: '', //0:首节点、1:上级、2:同级、3:混合 | ||||
|           girdIdList: [], | ||||
|           girdId: '', | ||||
|           girdCode: '', | ||||
|           girdLevel: '', | ||||
|           girdName: '', | ||||
|           functionAdd: '1', | ||||
|           functionHandle: '1', | ||||
|           functionTransmit: '1', | ||||
|           roleAdmin: '1', | ||||
|           roleMember: '1', | ||||
|           girdId2: '', | ||||
|           girdCode2: '', | ||||
|           girdLevel2: '', | ||||
|           girdName2: '', | ||||
|           functionAdd2: '1', | ||||
|           functionHandle2: '1', | ||||
|           functionTransmit2: '1', | ||||
|           roleAdmin2: '1', | ||||
|           roleMember2: '1', | ||||
|         }, | ||||
|         checked: false, | ||||
|         checkList: ['0', '1'] | ||||
|         list: [], | ||||
|         nodeTypeDictList: [{dictName: '首节点', dictValue: '0'}], | ||||
|         sameLevelUsed: true, | ||||
|         getGirdList: [], | ||||
|         editIndex: '' | ||||
|       } | ||||
|     }, | ||||
|     computed: { | ||||
|       rules() { | ||||
|         return { | ||||
|           name: [{ required: true, message: '请输入党员姓名', trigger: 'change'}], | ||||
|           idNumber: [{ required: true, message: '请选择党员', trigger: 'change'}], | ||||
|           status: [{ required: true, message: '请选择缴费状态', trigger: 'change'}], | ||||
|           ymd: [{ required: true, message: '请选择缴纳月份', trigger: 'change'}], | ||||
|           amount: [{ required: true, message: '请输入金额', trigger: 'blur'}], | ||||
|           nodeType: [{ required: true, message: '请选择节点类型', trigger: 'change'}], | ||||
|           girdId: [{ required: true, message: '请选择节点网络', trigger: 'change'}], | ||||
|           girdId2: [{ required: true, message: '请选择同级节点网格', trigger: 'change'}], | ||||
|         } | ||||
|       }, | ||||
|     }, | ||||
|     created() { | ||||
|       this.dict.load('clapEventStatus').then(() => { | ||||
|  | ||||
|       this.dict.load('prfcNodeType').then(() => { | ||||
|         this.getList() | ||||
|       }) | ||||
|     }, | ||||
|     methods: { | ||||
|       add() { | ||||
|         this.form = { | ||||
|           nodeType: '', //0:首节点、1:上级、2:同级、3:混合 | ||||
|           girdIdList: [], | ||||
|           girdId: '', | ||||
|           girdCode: '', | ||||
|           girdLevel: '', | ||||
|           girdName: '', | ||||
|           functionAdd: '1', | ||||
|           functionHandle: '1', | ||||
|           functionTransmit: '1', | ||||
|           roleAdmin: '1', | ||||
|           roleMember: '1', | ||||
|           girdId2: '', | ||||
|           girdCode2: '', | ||||
|           girdLevel2: '', | ||||
|           girdName2: '', | ||||
|           functionAdd2: '1', | ||||
|           functionHandle2: '1', | ||||
|           functionTransmit2: '1', | ||||
|           roleAdmin2: '1', | ||||
|           roleMember2: '1', | ||||
|         } | ||||
|         if(this.list.length > 0) { | ||||
|           this.getGird(this.list.length-1) | ||||
|         }else { //首节点 | ||||
|           this.form.nodeType = '0' | ||||
|         } | ||||
|         this.dialogTitle = '添加节点' | ||||
|         this.dialog = true | ||||
|         this.$refs.form.resetFields() | ||||
|       }, | ||||
|       del(index) { | ||||
|         this.$confirm('确定删除该节点?').then(() => { | ||||
|           this.list.splice(index, 1) | ||||
|         }) | ||||
|       }, | ||||
|       edit(index) { | ||||
|         this.editIndex = index | ||||
|         this.form = {...this.list[index]} | ||||
|         if(this.form.nodeType != '0') { | ||||
|           this.getGird(index) | ||||
|         }  | ||||
|         this.dialogTitle = '编辑节点' | ||||
|         this.dialog = true | ||||
|       }, | ||||
|       onConfirm() { | ||||
|  | ||||
|         this.$refs.form.validate((valid) => { | ||||
|           if (valid) { | ||||
|             if(this.dialogTitle == '添加节点') { | ||||
|               this.list.push(this.form) | ||||
|             }else { | ||||
|               this.list.splice(this.editIndex, 1, this.form) | ||||
|             } | ||||
|             this.dialog = false | ||||
|           } | ||||
|         }) | ||||
|       }, | ||||
|       getList() { | ||||
|         this.instance.post(`/app/apppatrolreportflowconfigv2/queryNew`).then(res => { | ||||
|           if (res.code == 0) { | ||||
|             this.list = res.data | ||||
|           } | ||||
|         }) | ||||
|       }, | ||||
|       onGirdChange(e) { | ||||
|         this.form.girdId = e[0].id | ||||
|         this.form.girdCode = e[0].girdCode | ||||
|         this.form.girdLevel = e[0].girdLevel | ||||
|         this.form.girdName = e[0].girdName | ||||
|       }, | ||||
|       changeNodeType(e) { //1 上下级节点取数组0;2同级节点选择数组1; 3混合节点主取数组0,同级选择数组1 | ||||
|         console.log(e) | ||||
|         var arr = [] | ||||
|         if(e == 1) { | ||||
|           arr.push(this.getGirdList[0]) | ||||
|         } | ||||
|         if(e == 2) { | ||||
|           arr.push(this.getGirdList[1]) | ||||
|         } | ||||
|         if(e == 3) { | ||||
|           arr.push(this.getGirdList[0]) | ||||
|           this.form.girdId2 = this.getGirdList[1].id | ||||
|           this.form.girdCode2 = this.getGirdList[1].girdCode | ||||
|           this.form.girdLevel2 = this.getGirdList[1].girdLevel | ||||
|           this.form.girdName2 = this.getGirdList[1].girdName | ||||
|         } | ||||
|         this.onGirdChange(arr) | ||||
|       }, | ||||
|       getGird(index) { | ||||
|         var girdCode = this.list[index].girdCode | ||||
|         this.instance.post(`app/apppatrolreportflowconfigv2/choiseGird?previousGirdCode=${girdCode}`).then(res => { | ||||
|           if (res.code == 0) { | ||||
|             this.getGirdList = res.data | ||||
|             if(res.data.length == 1 && this.dialogTitle == '添加节点') { //返回数据一条表示nodeType 1 上下级节点;混合节点主去数组0,同级选择数组1;同级节点选择数组1 | ||||
|               this.form.nodeType = '1' | ||||
|               this.onGirdChange(res.data) | ||||
|             } | ||||
|           } | ||||
|         }) | ||||
|       }, | ||||
|       confirm() { | ||||
|         this.instance.post(`/app/apppatrolreportflowconfigv2/addOrUpdate`, this.list).then(res => { | ||||
|           if (res.code == 0) { | ||||
|             this.$message.success('提交成功') | ||||
|             this.getList() | ||||
|           } | ||||
|         }) | ||||
|       } | ||||
|     } | ||||
|   } | ||||
| @@ -174,8 +312,12 @@ | ||||
| <style lang="scss" scoped> | ||||
|   .AppPatrolReportSet { | ||||
|     height: 100%; | ||||
|     .list { | ||||
|       padding: 0 16px 16px; | ||||
|       background-color: #fff; | ||||
|     } | ||||
|     .item { | ||||
|       padding: 0 0 4px 26px; | ||||
|       padding: 16px 0 4px 26px; | ||||
|       position: relative; | ||||
|       border-bottom: 1px solid #F2F2F2; | ||||
|       .info { | ||||
| @@ -202,7 +344,7 @@ | ||||
|       } | ||||
|       .index { | ||||
|         position: absolute; | ||||
|         top: 0; | ||||
|         top: 16px; | ||||
|         left: 0; | ||||
|         height: 21px; | ||||
|         font-family: DINAlternate-Bold; | ||||
| @@ -213,7 +355,7 @@ | ||||
|       .btn { | ||||
|         position: absolute; | ||||
|         right: 0; | ||||
|         top: 0; | ||||
|         top: 16px; | ||||
|       } | ||||
|       .flex { | ||||
|         display: flex; | ||||
| @@ -222,10 +364,27 @@ | ||||
|         } | ||||
|       } | ||||
|     } | ||||
|     :deep(.ai-select) { | ||||
|     :deep(.ai-select), | ||||
|     :deep(.el-input) { | ||||
|       display: inline-block; | ||||
|       width: 300px; | ||||
|       width: 50%; | ||||
|       margin-right: 16px; | ||||
|     } | ||||
|     :deep(.AiPicker) { | ||||
|       display: inline-block; | ||||
|       width: 50%; | ||||
|       margin-right: 16px; | ||||
|       border: 1px solid #d0d4dc; | ||||
|       padding-left: 16px; | ||||
|       box-sizing: border-box; | ||||
|       border-radius: 4px; | ||||
|       position: relative; | ||||
|       .el-icon-arrow-down { | ||||
|         position: absolute; | ||||
|         top: 8px; | ||||
|         right: 8px; | ||||
|       } | ||||
|     } | ||||
|      | ||||
|   } | ||||
| </style> | ||||
|   | ||||
		Reference in New Issue
	
	Block a user