From a7b5e177db655a98c299d3342538e23bd4e647da Mon Sep 17 00:00:00 2001
From: zhangxiao <898441624@qq.com>
Date: 星期三, 14 八月 2024 14:35:12 +0800
Subject: [PATCH] fix: 模型管理修改

---
 src/views/authority/users/index.vue |  212 +++++++++++++++++++++++++++++++++-------------------
 1 files changed, 135 insertions(+), 77 deletions(-)

diff --git a/src/views/authority/users/index.vue b/src/views/authority/users/index.vue
index caa282b..6d76315 100644
--- a/src/views/authority/users/index.vue
+++ b/src/views/authority/users/index.vue
@@ -64,71 +64,6 @@
           </div>
         </div>
       </div>
-      <!-- <a-row>
-        <a-col :flex="2"></a-col>
-        <a-col :flex="1">
-          <a-form :model="formModel" style="margin-top: 30px">
-            <a-form-item field="name">
-              <a-input
-                v-model="formModel.name"
-                :style="{ width: '320px' }"
-                :placeholder="$t('璇疯緭鍏�')"
-              />
-            </a-form-item>
-          </a-form>
-        </a-col>
-        <a-col :flex="'200px'" style="text-align: right; margin-top: 30px">
-          <a-button type="primary" @click="search" style="margin-right: 20px">
-            <template #icon>
-              <icon-search />
-            </template>
-            {{ $t('searchTable.form.search') }}
-          </a-button>
-          <a-button @click="reset">
-            <template #icon>
-              <icon-refresh />
-            </template>
-            {{ $t('searchTable.form.reset') }}
-          </a-button>
-        </a-col>
-      </a-row> -->
-      <!-- <a-divider style="margin-top: 0" />
-      <a-row style="margin-bottom: 16px">
-        <a-col :span="12">
-          <a-space>
-            <a-button type="primary" :align="'right'" @click="operation(0)"
-              >+ 鏂板缓璐︽埛</a-button
-            >
-          </a-space>
-        </a-col>
-        <a-col
-          :span="12"
-          style="display: flex; align-items: center; justify-content: end"
-        >
-          <a-tooltip :content="$t('searchTable.actions.refresh')">
-            <div class="action-icon" @click="search">
-              <icon-refresh size="18" />
-            </div>
-          </a-tooltip>
-          <a-dropdown @select="handleSelectDensity">
-            <a-tooltip :content="$t('searchTable.actions.density')">
-              <div class="action-icon">
-                <icon-line-height size="18" />
-              </div>
-            </a-tooltip>
-            <template #content>
-              <a-doption
-                v-for="item in densityList"
-                :key="item.value"
-                :value="item.value"
-                :class="{ active: item.value === size }"
-              >
-                <span>{{ item.name }}</span>
-              </a-doption>
-            </template>
-          </a-dropdown>
-        </a-col>
-      </a-row> -->
       <a-table
         row-key="id"
         :loading="loading"
@@ -191,17 +126,14 @@
       @ok="editHandleOk"
     >
       <a-form :model="editform">
+        <a-form-item field="email" label="鐢ㄦ埛鍚�">
+          <a-input v-model="editform.email" />
+        </a-form-item>
         <a-form-item field="name" label="鏄电О">
           <a-input v-model="editform.nickName" />
         </a-form-item>
-        <a-form-item field="userName" label="鐢ㄦ埛鍚�">
-          <a-input v-model="editform.userName" />
-        </a-form-item>
         <a-form-item field="phoneNumber" label="鎵嬫満鍙�">
           <a-input v-model="editform.phoneNumber" />
-        </a-form-item>
-        <a-form-item field="email" label="閭">
-          <a-input v-model="editform.email" />
         </a-form-item>
       </a-form>
     </a-modal>
@@ -249,8 +181,9 @@
       </div>
     </a-modal>
     <a-modal
-      width="30%"
+      width="50%"
       v-model:visible="resourcevisible"
+      v-if="resourcevisible"
       title="鏉冮檺閰嶇疆"
       @cancel="handleCancel(3)"
       @ok="editResourceHandleOk"
@@ -265,7 +198,7 @@
               鑿滃崟
             </template>
             <a-tree
-              class="tree-demo"
+              class="tree-demo-box"
               v-model:checked-keys="checkedKeysMenu"
               v-model:expanded-keys="expandKdysMenu"
               :checkable="true"
@@ -279,7 +212,66 @@
               }"
               :check-strictly="checkStrictlyMenu"
             >
+              <!-- <template #extra="nodeData">
+                <div :class="{ 'custom-class': nodeData.menuType == 1 }">
+                  <span>
+                    {{ nodeData.menuName }}
+                  </span>
+                </div>
+              </template> -->
             </a-tree>
+            <!-- <a-space class="space_select_all">
+              <a-button type="primary">鍏ㄩ��</a-button>
+              <a-button>鍙栨秷鍏ㄩ��</a-button>
+            </a-space>
+
+            <div class="table_box" v-if="treeDataMenu[0].children">
+              <div class="table_row1">
+                <div
+                  class="row1_list"
+                  v-for="(item, index) in treeDataMenu[0].children"
+                  :key="item.menuId"
+                >
+                  <div class="row1_clo">
+                    <a-checkbox
+                      :checked="item.menuId"
+                      @change="onCheckChange(item, $event)"
+                    >
+                      {{ item.menuName }}
+                    </a-checkbox>
+                  </div>
+                  <div v-if="item.children" class="row1_clo2">
+                    <div
+                      class="row2_clo2_1"
+                      v-for="(item2, index2) in item.children"
+                      :key="item2.menuId"
+                    >
+                      <div class="row1_clo2_1">
+                        <a-checkbox
+                          :checked="item2.menuId"
+                          @change="onCheckChange(item2, $event)"
+                        >
+                          {{ item2.menuName }}
+                        </a-checkbox>
+                      </div>
+                      <div v-if="item2.children" class="row1_clo2_2">
+                        <div
+                          v-for="(item3, index3) in item2.children"
+                          :key="item3.menuId"
+                        >
+                          <a-checkbox
+                            :checked="item3.menuId"
+                            @change="onCheckChange(item3, $event)"
+                          >
+                            {{ item3.menuName }}</a-checkbox
+                          >
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div> -->
           </a-tab-pane>
           <a-tab-pane key="2">
             <template #title>
@@ -374,7 +366,7 @@
 </template>
 
 <script lang="ts" setup>
-  import { computed, reactive, ref } from 'vue';
+  import { computed, reactive, ref, h, onMounted } from 'vue';
   import { useI18n } from 'vue-i18n';
   import useLoading from '@/hooks/loading';
   import { Pagination } from '@/types/global';
@@ -394,13 +386,14 @@
   } from '@/api/authority';
   import { Modal } from '@arco-design/web-vue';
   import Authheader from '@/views/authority/components/authheader.vue';
+  import { create } from 'lodash';
 
   let treeData = ref([]);
   let checkedKeys = ref([]);
   let expandKdys = ref([]);
   let checkStrictly = ref([]);
 
-  let treeDataMenu = ref([]);
+  let treeDataMenu = ref<any>([]);
   let checkedKeysMenu = ref([]);
   let expandKdysMenu = ref([]);
   let checkStrictlyMenu = ref([]);
@@ -445,6 +438,13 @@
   let deptvisible = ref(false);
   let resourcevisible = ref(false);
   let selectUser = ref({});
+  // const treeDataList = ref([]);
+  const checked1 = ref(false);
+
+  //琛ㄦ牸澶嶉�夋閫夋嫨
+  const onCheckChange = (checkedKeysValue: (string | number)[], e: any) => {
+    console.log('onCheckChange', checkedKeysValue, e);
+  };
 
   const onCheck = (newCheckedKeys, event) => {
     let o = { deptId: event.node.deptId, deptName: event.node.deptName };
@@ -531,7 +531,7 @@
 
   const basePagination: Pagination = {
     current: 1,
-    pageSize: 20,
+    pageSize: 15,
   };
   const pagination = reactive({
     ...basePagination,
@@ -562,7 +562,7 @@
       slotName: 'index',
     },
     {
-      title: t('鐧诲綍鍚�'),
+      title: t('鐢ㄦ埛鍚�'),
       dataIndex: 'email',
     },
     {
@@ -804,9 +804,12 @@
       treeData.value = [...res.rows];
     });
   };
+  const objArr = ref<any>([]);
   const MenuData = async (key) => {
     await ResourceList(key).then((res) => {
       treeDataMenu.value = [...res.rows];
+      // addClassToLeafNodes(treeDataMenu.value);
+      treeDataList.value = res.rows;
     });
   };
 
@@ -861,6 +864,61 @@
       }
     }
   }
+  .space_select_all {
+    display: flex;
+    justify-content: end;
+    margin-bottom: 15px;
+  }
+  .table_box {
+    display: flex;
+
+    border: 1px solid #e8e8e8;
+    border-bottom: none;
+    .row1_clo {
+      min-width: 200px;
+      display: flex;
+      padding-left: 20px;
+      border-right: 1px solid #e8e8e8;
+    }
+    .table_row1 {
+      width: 100%;
+      .row1_list {
+        display: flex;
+        min-height: 40px;
+        border-bottom: 1px solid #e8e8e8;
+        // line-height: 40px;
+      }
+    }
+    .row1_clo2 {
+      width: 100%;
+      border-top: none;
+      .row2_clo2_1 {
+        display: flex;
+        width: 100%;
+        min-height: 40px;
+        line-height: 40px;
+        border-bottom: 1px solid #e8e8e8;
+        .row1_clo2_1 {
+          border-right: 1px solid #e8e8e8;
+          min-width: 310px;
+          padding-left: 20px;
+        }
+        .row1_clo2_2 {
+          border-top: none;
+          border-right: none;
+          width: 100%;
+          display: flex;
+          flex-wrap: wrap;
+          div {
+            margin-left: 20px;
+          }
+        }
+      }
+    }
+    .row2_clo2_1:last-child {
+      border-bottom: none;
+    }
+  }
 </style>
 <style lang="less">
   .ant-table-wrapper {

--
Gitblit v1.8.0