fix: 用户模块修改用户和添加用户优化为弹窗 (#177)

* fix: vue用户修改和添加优化为弹窗 * fix: nest初始化菜单删除修改用户和添加用户 * fix: 检视意见修改
opentiny · Aug 21, 2024 · 54d0756 · 54d0756
1 parent a92d7fe
commit 54d0756
Show file tree

Hide file tree

Showing 10 changed files with 521 additions and 904 deletions.
diff --git a/packages/toolkits/pro/template/server/nestJs/src/menu/init/menuData.ts b/packages/toolkits/pro/template/server/nestJs/src/menu/init/menuData.ts
@@ -299,26 +299,6 @@ export const menuData = [
     path: 'allInfo',
     locale: 'menu.userManager.info',
   },
-  {
-    name: 'AllSetting',
-    order: 1,
-    parentId: null,
-    menuType: 'admin',
-    icon: '',
-    component: 'userManager/setting/index',
-    path: 'allSetting',
-    locale: 'menu.userManager.setting',
-  },
-  {
-    name: 'UserAdd',
-    order: 1,
-    parentId: null,
-    menuType: 'admin',
-    icon: '',
-    component: 'userManager/useradd/index',
-    path: 'userAdd',
-    locale: 'menu.userManager.useradd',
-  },
   {
     name: 'MenuPage',
     order: 9,

diff --git a/packages/toolkits/pro/template/server/nestJs/src/menu/menu.service.ts b/packages/toolkits/pro/template/server/nestJs/src/menu/menu.service.ts
@@ -127,10 +127,8 @@ export class MenuService {
       menu[25].parentId = menuId[24];
       menu[27].parentId = menuId[26];
       menu[29].parentId = menuId[28];
-      menu[30].parentId = menuId[28];
-      menu[31].parentId = menuId[28];
-      menu[33].parentId = menuId[32];
-      menu[34].parentId = menuId[33];
+      menu[31].parentId = menuId[30];
+      menu[32].parentId = menuId[31];
     }
     for (const item of menu) {
       await this.menu.update(item.id, { parentId: item.parentId });

diff --git a/packages/toolkits/pro/template/tinyvue/src/locale/zh-CN.ts b/packages/toolkits/pro/template/tinyvue/src/locale/zh-CN.ts
@@ -58,7 +58,7 @@ export default {
   'menu.menuPage.third': '菜单demo页',
   'menu.user': '个人中心',
   'menu.userManager': '用户管理',
-  'menu.userManager.info': '所有用户',
+  'menu.userManager.info': '查看用户',
   'menu.userManager.setting': '修改信息',
   'menu.userManager.useradd': '添加用户',
   'menu.permission': '权限管理',

diff --git a/packages/toolkits/pro/template/tinyvue/src/views/userManager/info/components/info-tab.vue b/packages/toolkits/pro/template/tinyvue/src/views/userManager/info/components/info-tab.vue
@@ -1,6 +1,14 @@
 <template>
   <div class="tiny-fullscreen-scroll">
     <div class="tiny-fullscreen-wrapper">
+      <div class="user-add-btn">
+        <tiny-button
+          v-permission="'role::add'"
+          type="primary"
+          @click="handleAddUser"
+          >{{ $t('userInfo.modal.title.add') }}
+        </tiny-button>
+      </div>
       <div class="table">
         <tiny-grid
           ref="expandGrid"
@@ -50,14 +58,17 @@
                 </li>
                 <li>
                   <span>{{ $t('userInfo.table.protocolStart') }}：</span>
-                  <span>{{ $t(`${data.row.protocolStart}`) }}</span> </li
-                ><li>
+                  <span>{{ $t(`${data.row.protocolStart}`) }}</span></li
+                >
+                <li>
                   <span>{{ $t('userInfo.table.protocolEnd') }}：</span>
-                  <span>{{ $t(`${data.row.protocolEnd}`) }}</span> </li
-                ><li>
+                  <span>{{ $t(`${data.row.protocolEnd}`) }}</span></li
+                >
+                <li>
                   <span>{{ $t('userInfo.table.address') }}：</span>
-                  <span>{{ $t(`${data.row.address}`) }}</span> </li
-                ><li>
+                  <span>{{ $t(`${data.row.address}`) }}</span></li
+                >
+                <li>
                   <span>{{ $t('userInfo.table.status') }}：</span>
                   <span v-if="data.row.status == 1">已启用</span>
                   <span v-if="data.row.status !== 1">已禁用</span>
@@ -213,6 +224,30 @@
       </div>
     </div>
   </div>
+  <div v-if="state.isUserAdd">
+    <tiny-modal
+      v-model="state.isUserAdd"
+      :lock-scroll="true"
+      mask-closable="true"
+      height="auto"
+      width="800"
+      :title="$t('userInfo.modal.title.add')"
+    >
+      <UserAdd></UserAdd>
+    </tiny-modal>
+  </div>
+  <div v-if="state.isUserUpdate">
+    <tiny-modal
+      v-model="state.isUserUpdate"
+      :lock-scroll="true"
+      mask-closable="true"
+      height="auto"
+      width="800"
+      :title="$t('userInfo.modal.title.update')"
+    >
+      <UserSetting :email="state.email"></UserSetting>
+    </tiny-modal>
+  </div>
   <div v-if="state.isPwdUpdate">
     <tiny-modal
       v-model="state.isPwdUpdate"
@@ -274,12 +309,12 @@
         </tiny-layout>
       </template>
       <template #footer>
-        <tiny-button type="primary" @click="handlePwdUpdateSubmit">{{
-          $t('menu.btn.confirm')
-        }}</tiny-button>
-        <tiny-button @click="handlePwdUpdateCancel">{{
-          $t('menu.btn.cancel')
-        }}</tiny-button>
+        <tiny-button type="primary" @click="handlePwdUpdateSubmit"
+          >{{ $t('menu.btn.confirm') }}
+        </tiny-button>
+        <tiny-button @click="handlePwdUpdateCancel"
+          >{{ $t('menu.btn.cancel') }}
+        </tiny-button>
       </template>
     </tiny-modal>
   </div>
@@ -313,6 +348,8 @@
     updatePwdUser,
   } from '@/api/user';
   import { useRouter } from 'vue-router';
+  import UserAdd from '../../useradd/index.vue';
+  import UserSetting from '../../setting/index.vue';
 
   const router = useRouter();
 
@@ -324,13 +361,19 @@
     tableData: any;
     pageData: any;
     isPwdUpdate: boolean;
+    isUserAdd: boolean;
+    isUserUpdate: boolean;
     pwdData: any;
+    email: string;
   }>({
     loading: null,
     tableData: [] as any,
     pageData: [] as any,
     isPwdUpdate: false,
+    isUserAdd: false,
+    isUserUpdate: false,
     pwdData: {} as any,
+    email: '',
   });
 
   // 变量设置
@@ -405,12 +448,8 @@
   };
 
   const handleUpdate = (email: string) => {
-    router.push({
-      name: 'AllSetting',
-      query: {
-        email,
-      },
-    });
+    state.isUserUpdate = true;
+    state.email = email;
   };
 
   const handlePwdUpdate = (email: string) => {
@@ -423,6 +462,10 @@
     state.pwdData = {} as any;
   };
 
+  const handleAddUser = () => {
+    state.isUserAdd = true;
+  };
+
   async function handlePwdUpdateSubmit() {
     let data = state.pwdData;
     let newTemp = {
@@ -458,6 +501,10 @@
 </script>
 
 <style scoped lang="less">
+  .user-add-btn {
+    padding: 10px 0 10px 10px;
+  }
+
   #contain {
     height: 100%;
     padding: 15px;

diff --git a/packages/toolkits/pro/template/tinyvue/src/views/userManager/info/locale/zh-CN.ts b/packages/toolkits/pro/template/tinyvue/src/views/userManager/info/locale/zh-CN.ts
@@ -1,5 +1,5 @@
 export default {
-  'menu.allUser.info': '所有用户',
+  'menu.allUser.info': '查看用户',
   'userInfo.table.id': 'ID',
   'userInfo.table.name': '名称',
   'userInfo.table.email': '邮箱',
@@ -28,4 +28,6 @@ export default {
   'userInfo.modal.input.confirmNewPassword': '确认新密码',
   'userInfo.modal.message.error': '确认新密码错误',
   'userInfo.modal.message.notNull': '密码不能为空',
+  'userInfo.modal.title.add': '添加用户',
+  'userInfo.modal.title.update': '更新用户',
 };
diff --git a/packages/toolkits/pro/template/tinyvue/src/views/userManager/setting/components/head.vue b/packages/toolkits/pro/template/tinyvue/src/views/userManager/setting/components/head.vue