权限修改

src/views/authorityManagement/components/authorityHome.vue

@@ -106,7 +106,7 @@
             <div class="capTitle flex">
               <div class="manageTitle">下级权限</div>
               <div class="btn-create">
-                <el-button size="small" class="btn-white">新增</el-button>
+                <el-button size="small" type="primary" @click="addAuth" class="btn-white">新增</el-button>
               </div>
             </div>
             <div class="content">
@@ -115,7 +115,7 @@
                   <el-col :span="6" v-for="(data, index) in childrenData" :key="data.AuthId">
                     <div @click.stop="childrenClick(data)" class="account-left-content-teams">
                       <div class="team">
-                        <div class="bg" :class="data.Type == 1 ? 'status1' : 'status2'"></div>
+                        <div class="bg" :class="data.Type == 1 ? 'status0' : data.Type == 2 ? 'status1' : 'status2'"></div>
                         <div class="list" :class="data.QueryTarget == 1 ? 'activeStatus' : ''">
                           <div class="flex info">
                             <div :title="data.AuthName" class="name">
@@ -128,15 +128,18 @@
                               <el-tooltip effect="dark" content="修改应用" placement="bottom">
                                 <span v-if="data.Type === 1" title="修改应用" @click="renderEdit(data)" class="cap cap-edit"></span>
                               </el-tooltip>
-                              <el-tooltip v-is="['authtree_btn_add_auth']" effect="dark" content="新增权限项" placement="bottom">
+                              <!-- <el-tooltip v-is="['authtree_btn_add_auth']" effect="dark" content="新增权限项" placement="bottom">
                                 <span v-if="data.Type === 2" title="新增权限项" @click="renderSub(data)" class="cap cap-sub"></span>
+                              </el-tooltip> -->
+                              <el-tooltip v-is="['authtree_btn_add_auth']" effect="dark" content="编辑权限项" placement="bottom">
+                                <span v-if="data.Type === 2" title="编辑权限项" @click="renderEdit(data)" class="cap cap-edit"></span>
                               </el-tooltip>
                               <el-tooltip v-is="['authtree_btn_update_auth']" effect="dark" content="编辑权限项" placement="bottom">
                                 <span v-if="data.Type > 2" title="编辑权限项" @click="renderEdit(data)" class="cap cap-edit"></span>
                               </el-tooltip>
-                              <el-tooltip v-is="['authtree_btn_add_auth']" effect="dark" content="新增权限项" placement="bottom">
+                              <!-- <el-tooltip v-is="['authtree_btn_add_auth']" effect="dark" content="新增权限项" placement="bottom">
                                 <span v-if="data.Type > 2" title="新增权限项" @click="renderSub(data)" class="cap cap-sub"></span>
-                              </el-tooltip>
+                              </el-tooltip> -->
                             </div>
                           </div>
                           <div v-if="data.Type > 0" class="flex details">
@@ -189,6 +192,57 @@
         </div>
       </div>
     </Dialog>
+    <!--新增/编辑-->
+    <Dialog :flag="editDialogVisible" width="628px" :show-flag="true">
+      <div class="airportInfoDialog dialog-public-background">
+        <div class="title">{{ editDialogTitle }}</div>
+        <div class="content">
+          <el-form ref="ruleForm" :model="ruleForm" :rules="rules" label-width="110px" class="demo-ruleForm">
+            <el-form-item label="权限名称" prop="authName">
+              <el-input v-model="ruleForm.authName" size="medium" placeholder="请输入权限名称" />
+            </el-form-item>
+            <div class="flex">
+              <el-form-item label="权限类型" prop="authType">
+                <el-select size="medium" v-model="ruleForm.authType" placeholder="请选择">
+                  <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value">
+                  </el-option>
+                </el-select>
+              </el-form-item>
+              <el-form-item label="父级权限" prop="authParent">
+                <el-select size="medium" v-model="ruleForm.authParent" placeholder="请选择">
+                  <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value">
+                  </el-option>
+                </el-select>
+              </el-form-item>
+            </div>
+            <div class="flex">
+              <el-form-item label="数据来源类型" prop="authData">
+                <el-select size="medium" v-model="ruleForm.authData" placeholder="请选择">
+                  <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value">
+                  </el-option>
+                </el-select>
+              </el-form-item>
+              <el-form-item label="所属应用" prop="authApp">
+                <el-select size="medium" v-model="ruleForm.authApp" placeholder="请选择">
+                  <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value">
+                  </el-option>
+                </el-select>
+              </el-form-item>
+            </div>
+            <el-form-item label="权限标识符" prop="authPoint">
+              <el-input v-model="ruleForm.authPoint" size="medium" type="textarea" :rows="3" placeholder="请输入权限标识符" />
+            </el-form-item>
+            <el-form-item label="数据项描述" prop="authDesc">
+              <el-input v-model="ruleForm.authDesc" size="medium" type="textarea" :rows="3" placeholder="请输入数据项描述" />
+            </el-form-item>
+          </el-form>
+        </div>
+        <div class="foot center t30">
+          <el-button size="medium" type="primary" class="r25 r26" @click="submitClickHandler()">提交</el-button>
+          <el-button size="medium" class="r26" @click="resetForm('ruleForm')">取消</el-button>
+        </div>
+      </div>
+    </Dialog>
   </div>
 </template>
 
@@ -226,6 +280,26 @@ export default {
         children: "children",
         label: "AuthName",
       },
+      options: [],
+      editDialogVisible: false,
+      editDialogTitle: '新增下级权限',
+      editType: 'add',
+      ruleForm: {
+        // 协议信息表单
+        authName: "",
+        authType: "",
+        authDesc: "",
+        authPoint: "",
+        authApp: "",
+        authParent: "",
+        authData: ""
+      },
+      rules: {
+        // 协议信息表单验证
+        authName: [
+          { required: true, message: "请输入权限名称", trigger: "blur" },
+        ],
+      },
     };
   },
   created: function () {
@@ -245,6 +319,31 @@ export default {
     },
   },
   methods: {
+    // 新增
+    addAuth () {
+      this.editDialogTitle = '新增下级权限'
+      this.editDialogVisible = true
+      this.editType = 'add'
+    },
+    // 重置
+    resetForm (formName) {
+      this.$refs[formName].resetFields()
+      this.editDialogVisible = false
+    },
+    // 新增/编辑-确认
+    submitClickHandler () {
+      this.$refs["ruleForm"].validate((valid) => {
+        if (valid) {
+          if (this.editType == 'add') {
+            console.log('新增')
+          } else {
+            console.log('编辑')
+          }
+        } else {
+          return false
+        }
+      });
+    },
     //树点击
     handleNodeClick (data) {
       const dataNew = _.cloneDeep(data);
@@ -306,25 +405,28 @@ export default {
     },
     // 修改权限
     renderEdit (data) {
-      if (data.Type === 1) {
-        this.$router.push({
-          path: "/authority/appEdit",
-          query: {
-            AuthId: data.AuthId,
-            Status: data.Status,
-            UpAuthId: data.UpAuthId,
-          },
-        });
-      } else if (data.Type > 2) {
-        this.$router.push({
-          path: "/authority/editPower",
-          query: {
-            AuthId: data.AuthId,
-            Status: data.Status,
-            UpAuthId: data.UpAuthId,
-          },
-        });
-      }
+      this.editDialogVisible = true;
+      this.editDialogTitle = '编辑下级权限';
+      this.editType = 'edit';
+      // if (data.Type === 1) {
+      //   this.$router.push({
+      //     path: "/authority/appEdit",
+      //     query: {
+      //       AuthId: data.AuthId,
+      //       Status: data.Status,
+      //       UpAuthId: data.UpAuthId,
+      //     },
+      //   });
+      // } else if (data.Type > 2) {
+      //   this.$router.push({
+      //     path: "/authority/editPower",
+      //     query: {
+      //       AuthId: data.AuthId,
+      //       Status: data.Status,
+      //       UpAuthId: data.UpAuthId,
+      //     },
+      //   });
+      // }
     },
     // 权限树
     renderSub (data) {