From 91701965e95fb6a01443143777c98571de8161f6 Mon Sep 17 00:00:00 2001
From: liuye <liuye@sinoecare.com>
Date: Fri, 3 Nov 2023 15:59:19 +0800
Subject: [PATCH] =?UTF-8?q?=E5=B7=A1=E6=9F=A5=E4=B8=8A=E6=8A=A5=E8=AE=BE?=
 =?UTF-8?q?=E7=BD=AE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../AppPatrolReportSet/AppPatrolReportSet.vue | 373 +++++++++++++-----
 1 file changed, 266 insertions(+), 107 deletions(-)

diff --git a/packages/conv/AppPatrolReportSet/AppPatrolReportSet.vue b/packages/conv/AppPatrolReportSet/AppPatrolReportSet.vue
index 4d8febd4..c57664f4 100644
--- a/packages/conv/AppPatrolReportSet/AppPatrolReportSet.vue
+++ b/packages/conv/AppPatrolReportSet/AppPatrolReportSet.vue
@@ -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>