清除多余代码

packages/3.0.0/AppNavConfig/components/List.vue

@@ -37,6 +37,13 @@
                 <i class="el-icon-error icon" @click="removeApp(item.id)" v-if="isRemove && item.type !== '0' && item.picked !== '1'"></i>
                 <i class="el-icon-circle-plus icon" @click="addApp(item)" v-if="isCanAdd(item)"></i>
                 <h2>{{ item.name }}</h2>
+                <div class="item-setting">
+                  <div class="item-mask"></div>
+                  <div class="item-wrapper__icon" @click.stop="editApp(item)">
+                    <i class="el-icon-setting"></i>
+                    <div>编辑</div>
+                  </div>
+                </div>
               </div>
             </div>
           </div>
@@ -93,8 +100,34 @@
             <el-form-item label="图标" prop="pictureUrl" style="width: 100%;" :rules="[{ required: true, message: '请上传图标 ', trigger: 'change' }]">
               <ai-uploader v-model="form.pictureUrl" :instance="instance" :limit="1"></ai-uploader>
             </el-form-item>
+            <el-form-item label="权限配置" v-if="form.type === '0'" prop="pictureUrl" style="width: 100%;">
+              <el-input disabled :value="girdName" size="small" placeholder="请选择地区">
+                <template slot="append">
+                  <el-button size="small" @click="isShowArea = true">选择地区</el-button>
+                </template>
+              </el-input>
+            </el-form-item>
           </div>
         </el-form>
+        <ai-dialog
+          title="选择网格"
+          :visible.sync="isShowArea"
+          :destroyOnClose="true"
+          @close="showGrid = false"
+          @onConfirm="getCheckedTree"
+          width="720px">
+          <div class="grid">
+            <el-tree
+              :data="treeList"
+              :props="treeObj.defaultProps"
+              node-key="id"
+              ref="tree"
+              show-checkbox
+              :default-checked-keys="treeObj.checkedKeys"
+              default-expand-all>
+            </el-tree>
+          </div>
+        </ai-dialog>
       </ai-dialog>
     </template>
   </ai-list>
@@ -121,6 +154,12 @@
         isEdit: false,
         isRemove: false,
         isRest: true,
+        isShowArea: false,
+        defaultProps: {
+          children: "girdList",
+          label: "girdName",
+        },
+        treeList: [],
         form: {
           type: '',
           pictureUrl: [],
@@ -144,7 +183,9 @@
           dictValue: '4'
         }],
         isShowAdd: false,
-        list: []
+        list: [],
+        defaultExpanded: [],
+        defaultChecked: []
       }
     },
 
@@ -152,6 +193,7 @@
       this.dict.load('homeConfigMenuType', 'miniConfigCheckType').then(() => {
         this.getList()
       })
+      this.getTree()
     },
 
     methods: {
@@ -169,6 +211,54 @@
         })
       },
 
+      getTree() {
+        this.instance.post(`/admin/area/queryAllArea?id=${this.user.info.areaId}`).then(res => {
+          if (res.code === 0) {
+            let parent = res.data.map(v => {
+              v.label = v.name
+              v.children = []
+
+              return v
+            }).filter(e => !e.parentid)[0]
+            this.defaultExpanded = [parent.id]
+            this.defaultChecked = [parent.id]
+            this.search.areaId = parent.id
+            this.addChild(parent, res.data)
+            this.areaTree = [parent]
+
+            this.$nextTick(() => {
+              this.$refs.tree.setCurrentKey(parent.id)
+            })
+          }
+        })
+      },
+
+      format (list) {
+        return list.map(item => {
+          if (item.girdLevel !== '2') {
+            item.disabled = true
+          }
+
+          if (item.girdList && item.girdList.length) {
+            item.girdList = this.format(item.girdList)
+          }
+
+          return item
+        })
+      },
+
+      editApp (e) {
+        console.log(e)
+        this.form = {
+          ...e,
+          pictureUrl: [{
+            url: e.pictureUrl
+          }]
+        }
+
+        this.isShowAdd = true
+      },
+
       isCanAdd (item) {
         const isHas = this.picked.map(v => v.id).indexOf(item.id) > -1
 
@@ -328,6 +418,53 @@
         position: relative;
         margin: 0 16px 16px 0;
         text-align: center;
+        cursor: pointer;
+
+        .item-setting {
+          position: absolute;
+          top: 0;
+          left: 0;
+          z-index: 0;
+          opacity: 0;
+          width: 100%;
+          height: 100%;
+          transition: all ease 0.3s;
+
+          .item-wrapper__icon {
+            position: relative;
+            z-index: 1;
+            width: 100%;
+            height: 100%;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            flex-direction: column;
+
+            div {
+              margin-top: 6px;
+              font-size: 16px;
+            }
+          }
+
+          i, div {
+            font-size: 16px;
+            color: #fff;
+          }
+
+          .item-mask {
+            position: absolute;
+            top: 0;
+            left: 0;
+            width: 100%;
+            height: 100%;
+            background: rgba(0, 0, 0, 0.6);
+          }
+
+          &:hover {
+            z-index: 1;
+            opacity: 1;
+          }
+        }
 
         img {
           width: 60px;