Procházet zdrojové kódy

导航大更新,用户bug修改

asd26269546 před 2 roky
rodič
revize
9854bfe0fb

+ 4 - 0
src/assets/styles/index.scss

@@ -211,4 +211,8 @@ aside {
   position: absolute;
   left: 0;
   top:3px;
+}
+
+.cp{
+  cursor: pointer;
 }

+ 168 - 72
src/components/headerBar/header-bar.vue

@@ -11,12 +11,21 @@
 					</div>
 				</li>
 				<div class="auto-list">
-					<li class="nav-li" v-for="(i, index) in barData" v-show="index < autoListChidrenNum - 1" :key="i.id">
-						<span>{{ index + i.name }}</span>
+					<li 
+						class="nav-li" 
+						@click="commonsBannerToRouter(i)"
+						v-for="(i, index) in commonsRouterList" 
+						v-show="index < autoListChidrenNum - 1" :key="i.id">
+						<span>{{ i.menuName }}</span>
 					</li>
-					<li class="nav-li more-box">
+					<li class="nav-li more-box" v-show="commonsRouterList.length > autoListChidrenNum - 1">
 						更多
 						<i class="iconfont icon-iconm_xialan1"></i>
+						<ul class="more-list">
+							<li v-for="(i, index) in commonsRouterList" v-show="index >= autoListChidrenNum - 1" :key="i.id">
+								<span @click="commonsBannerToRouter(i)">{{ i.menuName }}</span>
+							</li>
+						</ul>
 					</li>
 				</div>
 				<div class="header-bar-warp" v-if="isChildMenu" @click.stop="isChildMenu = false">
@@ -29,16 +38,16 @@
 									</el-icon>
 									常用功能
 								</div>
-								<div class="first-order" @click="leftBanerType = 1">
+								<div class="first-order">
 									<el-icon size="16" color="#0084FF">
 										<edit />
 									</el-icon>
 									功能菜单
 								</div>
 								<ul>
-									<li v-for="i in sidebarRoutersCopy" :key="i.name" v-show="i.type == 1">{{ i.meta.title
-									}}</li>
-
+									<li @click="openLeftBaner(i,index)" v-for="(i,index) in sidebarRoutersCopy" :key="i.name"
+										v-show="i.type == 1 && i.status == '0'">{{ i.menuName
+										}}</li>
 								</ul>
 								<!-- <div class="first-order">
 									<el-icon size="16" color="#0084FF">
@@ -47,56 +56,73 @@
 									推荐服务
 								</div> -->
 							</div>
-							<div class="menu-warp" v-if="leftBanerType == 1">
-								<div class="first-order-title">外贸ERP</div>
+							<div class="menu-warp" v-show="leftBanerType == 1">
+								<div class="first-order-title">{{ activeLeftData.menuName }}</div>
+								<!-- <ul class="second-level" v-for="i in activeLeftData.children" :key="i.menuId">
+									<li class="menu-title">
+											
+											{{ i.menuName }}
+										</li>
+									<div v-for="(j, index) in i.children" :key="index">
+										<li v-if="i.isNone" class="menu-ul" style="cursor: auto"></li>
+										
+										<li class="menu-ul" @click="routerPush(i,j)" style="cursor: pointer">
+											{{ j.menuName }}
+										</li>
+									</div>
+								</ul> -->
 								<ul class="second-level">
-									<div v-for="(i, index) in sidebarRouters" :key="index">
+									<div v-for="(i, index) in activeLeftData" :key="index">
 										<li v-if="i.isNone" class="menu-ul" style="cursor: auto"></li>
 										<li class="menu-title" v-else-if="i.isTitle">
-											<!-- <i  :class="'iconfont icon-' +  i.meta.icon" style="position: relative;top: -1px;"></i> -->
+										
 
-											{{ i.meta && !i.hidden ? i.meta.title : '' }}
+											{{ i.menuName }}
 										</li>
-										<li v-else class="menu-ul" @click="routerPush(i)" style="cursor: pointer">
-											{{ i.meta && !i.hidden ? i.meta.title : '' }}
+										<li v-else class="menu-ul" @click="commonsBannerToRouter(i)" style="cursor: pointer">
+											
+											{{ i.menuName }}
 										</li>
 									</div>
 								</ul>
 							</div>
-							<div class="menu-warp" v-else-if="leftBanerType == 2">
+							<div class="menu-warp" v-show="leftBanerType == 2">
 								<div class="first-order-title">常用功能</div>
 								<div class="commons-warp">
-									<div >
-										<div class="header-button-box">
-											<span>asdasd</span>
-											<div class="right-icon">
+									<div>
+										<div class="header-button-box cp" v-for="(i,index) in commonsRouterList" :key="i.name" @click="commonsBannerToRouter(i)">
+											<span>{{ i.menuName }}</span>
+											<div class="right-icon" @click.stop="deleteCommonsRouter(i,index)">
 												<!-- <el-icon color="#46A6FF"><CirclePlus /></el-icon> -->
-												<el-icon color="#BBBBBB">
+												<el-icon color="#BBBBBB" v-show="isEidtType">
 													<Close />
 												</el-icon>
 											</div>
 										</div>
+										<div class="header-add-button-box"  v-if="!isEidtType" @click="isEidtType = true">
+											<el-icon color="#46A6FF">
+												<CirclePlus />
+											</el-icon>
+											编辑功能
+										</div>
 									</div>
 								</div>
-								<div class="first-order-title">待添加功能</div>
-								<div class="all-menu-warp">
-									<div v-for="i in sidebarRoutersCopy" :key="i.name">
-										<div class="all-menu-title"  v-for="j in i.children" :key="j.name">
+								<div class="first-order-title" v-if="isEidtType">待添加功能</div>
+								<div class="all-menu-warp" v-if="isEidtType">
+									<div v-for="(i, index) in sidebarRoutersCopy" :key="i.name"  v-show="i.type === 1">
+										<div class="all-menu-title" v-for="(j, jindex) in i.children" :key="j.name">
 											<div class="title">
-												邮箱
+												{{ j.menuName }}
+
 											</div>
 											<div class="all-menu-lists">
-												<div class="header-button-box">
-													<span>asdasd</span>
-													<div class="right-icon">
-														<el-icon color="#46A6FF">
-															<CirclePlus />
-														</el-icon>
-													</div>
-												</div>
-												<div class="header-button-box">
-													<span>asdasd</span>
-													<div class="right-icon">
+												<div class="header-button-box" v-for="(n, nindex) in j.children"
+													v-show="n.visible == '0'"
+													:key="n.name">
+													<span>{{ n.menuName }}</span>
+
+													<div class="right-icon"
+														@click="addCommonsRouter(index, jindex, nindex, n)">
 														<el-icon color="#46A6FF">
 															<CirclePlus />
 														</el-icon>
@@ -107,7 +133,10 @@
 									</div>
 
 								</div>
-								<div class="router-list"></div>
+								<div class="btn-warp" v-if="isEidtType">
+									<el-button type="" @click="isEidtType = false">取消</el-button>
+									<el-button type="primary" @click="userMenuEdit">保存</el-button>
+								</div>
 							</div>
 						</div>
 					</div>
@@ -161,44 +190,75 @@
   
 <script setup>
 import Cookies from 'js-cookie'
-import { ElMessageBox, ElNotification } from 'element-plus'
+import { ElMessageBox, ElNotification, ElMessage } from 'element-plus'
 import useUserStore from '@/store/modules/user'
-import usePermissionStore from '@/store/modules/permission'
 import '@/components/headerBar/header.scss'
 const router = useRouter()
 const userStore = useUserStore()
-const permissionStore = usePermissionStore()
 const { proxy } = getCurrentInstance()
 const sidebarRouters = ref([])
 const sidebarRoutersCopy = ref([])
-const input1 = ref('')
-const isChildMenu = ref(true)
+const isChildMenu = ref(false)
 const autoListChidrenNum = ref(0)
-const menuData = ref([])
+const isEidtType = ref(false)
 const leftBanerType = ref(2)
-const barData = ref([
-	{ name: '首页1', id: 1 },
-	{ name: '首页2', id: 2 },
-	{ name: '首页3', id: 3 },
-	{ name: '首页4', id: 4 },
-	{ name: '首页5', id: 5 },
-	{ name: '首页6', id: 6 },
-	{ name: '首页7', id: 7 },
-	{ name: '首页8', id: 8 },
-	{ name: '首页9', id: 9 },
-	{ name: '首页10', id: 10 },
-	{ name: '首页11', id: 11 },
-])
+
 const userData = ref(Cookies.get('username') || '')
+const commonsRouterList = ref([])
+const activeLeftData = ref({})
+const openLeftBaner = (i,index) => {
+	leftBanerType.value = 1
+	activeLeftData.value = i
+	routerInit(i)
+}
+
+const userMenuEdit = () => {
+	proxy.post('/sysUserMenu/edit',{
+		type:1,
+		menuIdList:commonsRouterList.value.map(item=>item.menuId)
+	}).then(res=>{
+		ElMessage({
+			message: '保存成功',
+			type: 'success',
+		})
+		isEidtType.value = false
+	})
+}
+
+const deleteCommonsRouter = (i,index) => {
+	commonsRouterList.value.splice(index, 1)
+}
 
-const routerInit = () => {
+const addCommonsRouter = (index, jindex, nindex, n) => {
+	for (let i = 0; i < commonsRouterList.value.length; i++) {
+		const element = commonsRouterList.value[i];
+		if(element.menuId === n.menuId){
+			ElMessage({
+				message: '此目录已添加',
+				type: 'error',
+			})
+			return
+		}
+	}
+	if (n.hidden) {
+		ElMessage({
+			message: '此目录需要额外参数,暂不支持添加',
+			type: 'error',
+		})
+		return
+	}
+	commonsRouterList.value.push(n)
+	sidebarRoutersCopy.value[index].children[jindex].children[nindex].isCommonsBanner = true
+}
+
+const routerInit = (item) => {
 	//二维转一维
 	const arr = []
-	sidebarRoutersCopy.value = permissionStore.addRoutes
-	for (let i = 0; i < permissionStore.addRoutes.length; i++) {
-		const element = permissionStore.addRoutes[i]
+	for (let i = 0; i < item.children.length; i++) {
+		const element = item.children[i]
 		if (element.type === 1) {
 			element.isTitle = true
+			
 			arr.push(element)
 		}
 
@@ -232,8 +292,7 @@ const routerInit = () => {
 
 		}
 	}
-	console.log(sidebarRoutersCopy)
-	sidebarRouters.value = arr
+	activeLeftData.value = arr
 }
 function handleCommand(command) {
 	switch (command) {
@@ -261,12 +320,24 @@ function logout() {
 		})
 		.catch(() => { })
 }
-//拼接url跳转
-function routerPush(i) {
-	if (i.hide) return
-	router.push(i.fatherPath + '/' + i.path)
-	isChildMenu.value = false
-}
+
+//使用id计算拼接url
+const commonsBannerToRouter = (i) => {
+	sidebarRoutersCopy.value.map(item => {
+		if(item.children) {
+			item.children.map(j => {
+				if(j.children){
+					j.children.map(n => {
+						if(n.menuId === i.menuId){
+							router.push('/' + item.path + '/' + j.path + '/' + n.path) 
+							isChildMenu.value = false
+						}
+					})
+				}
+			})
+		}
+	})
+} 
 
 //获取浏览器宽度
 function getBrowserWidth() {
@@ -276,17 +347,42 @@ function getBrowserWidth() {
 //计算auto-list 能放下几个
 function calcAutoListChidren() {
 	autoListChidrenNum.value = Math.floor((getBrowserWidth() - 390) / 120)
-	console.log(autoListChidrenNum.value)
 }
 
+//一维数组转tree
+
 onMounted(() => {
-	routerInit()
+	calcAutoListChidren()
 	window.addEventListener('resize', calcAutoListChidren);
-
 	proxy.get('/getInfo').then(res => {
 		userData.value = res.user.userName
 	})
-
+	proxy.get('/system/menu/list').then(res => {
+		res.data = res.data.map(item => {
+			return {
+				...item,
+				isCommonsBanner: false,
+			}
+		})
+		sidebarRoutersCopy.value = proxy.handleTree(res.data, "menuId")
+		//循环删除 i.status != 0 || i.visible != 0 的元素
+		sidebarRoutersCopy.value.map(item => {
+			if(item.children) {
+				item.children.map(j => {
+					if(j.children){
+						j.children.map(n => {
+							if(n.status != 0 || n.visible != 0 || n.type != 1){
+								j.children.splice(j.children.indexOf(n),1)
+							}
+						})
+					}
+				})
+			}
+		})
+	})
+	proxy.post('/sysUserMenu/list',{type:1}).then(res => {
+		commonsRouterList.value = res
+	})
 })
 </script>
   

+ 64 - 4
src/components/headerBar/header.scss

@@ -88,8 +88,12 @@
 			padding: 0 40px;
 			height: 500px;
 			overflow-y: auto;
+			.btn-warp{
+				margin: 40px 0 20px;
+			}
 			.all-menu-warp{
-				overflow: hidden;
+				overflow-y: auto;
+				
 				.all-menu-title{
 					overflow: hidden;
 				}
@@ -112,6 +116,7 @@
 				padding: 0 10px;
 				box-sizing: border-box;
 				margin-right: 20px;
+				font-size: 14px;
 				margin-bottom: 10px;
 				float: left;
 				i{
@@ -121,6 +126,29 @@
 				}
 				
 			}
+			.header-add-button-box{
+				width: 140px;
+				height: 40px;
+				background: #fff;
+				border-radius: 2px 2px 2px 2px;
+				opacity: 1;
+				border: 1px dashed #DDDDDD;
+				justify-content: space-between;
+				line-height: 40px;
+				padding: 0 10px;
+				box-sizing: border-box;
+				margin-right: 20px;
+				font-size: 14px;
+				margin-bottom: 10px;
+				text-align: center;
+				float: left;
+				cursor: pointer;
+				i{
+					position: relative;
+					top: 2px;
+					cursor: pointer;
+				}
+			}
 			.commons-warp{
 				overflow: hidden;
 			}
@@ -132,13 +160,13 @@
 				font-weight: bold;
 			}
 			.second-level {
-				overflow: hidden;
 				height: 420px;
 				display: flex;
 				flex-wrap: wrap;
 				flex-direction: column;
 				flex-grow: 0;
 				flex-basis: auto;
+				float: left;
 			}
 			.menu-title {
 				font-weight: 600;
@@ -177,12 +205,44 @@
 		padding: 0;
 		margin: 0;
 		height: 50px;
-		overflow: hidden;
+		
 		.auto-list{
-			width: calc(100vw - 350px);
+			width: calc(100vw - 380px);
 			li{
 				float: left;
 			}
+			.more-box{
+				position: relative;
+				
+				.more-list{
+					width: 120px;
+					position: absolute;
+					background: #FFFFFF;
+					box-shadow: 0px 2px 20px 1px rgba(0,0,0,0.1);
+					border-radius: 2px 2px 2px 2px;
+					opacity: 1;
+					z-index: 10001111;
+					color: #666666;
+					padding-top: 10px;
+					display: none;
+					li{
+						width: 100%;
+						height: 40px;
+						line-height: 40px;
+						font-size: 14px;
+					}
+					li:hover{
+						background-color: #EFF6FF;
+						color: #0084FF;
+					}
+				}
+			}
+			
+			.more-box:hover{
+				.more-list{
+					display: block;
+				}
+			}
 		}
 		.logo {
 			color: #fff;

+ 1 - 0
src/store/modules/permission.js

@@ -46,6 +46,7 @@ const usePermissionStore = defineStore(
             const rewriteRoutes = filterAsyncRouter(rdata, false, true)
             const defaultRoutes = filterAsyncRouter(defaultData)
             const asyncRoutes = filterDynamicRoutes(dynamicRoutes)
+            console.log('sidebarRoutes', asyncRoutes)
             asyncRoutes.forEach(route => { router.addRoute(route) })
             this.setRoutes(rewriteRoutes)
             this.setSidebarRouters(constantRoutes.concat(sidebarRoutes))

+ 1 - 0
src/views/system/dept2/index.vue

@@ -386,6 +386,7 @@ const getList = async (req) => {
     sourceList.value.data = proxy.handleTree(message.data, "deptId");
     console.log(sourceList.value);
     formConfig.value[0].data = proxy.handleTree(message.data, "deptId");
+    console.log(formConfig.value[0].data)
     setTimeout(() => {
       loading.value = false;
     }, 200);

+ 2 - 2
src/views/system/menu/index.vue

@@ -271,8 +271,8 @@
                         </span>
                      </template>
                      <el-radio-group v-model="form.type">
-                        <el-radio label="1">web菜单</el-radio>
-                        <el-radio label="2">app菜单</el-radio>
+                        <el-radio :label="1">web菜单</el-radio>
+                        <el-radio :label="2">app菜单</el-radio>
                      </el-radio-group>
                   </el-form-item>
                </el-col>

+ 92 - 77
src/views/system/user2/index.vue

@@ -1,99 +1,47 @@
 <template>
   <div class="user">
     <div class="tree">
-      <treeList
-        :data="treeListData"
-        v-model="sourceList.pagination.tenantId"
-        node-key="id"
-        @change="treeChange"
-      >
+      <treeList :data="treeListData" v-model="sourceList.pagination.tenantId" node-key="id" @change="treeChange">
       </treeList>
     </div>
     <div class="content">
-      <byTable
-        :source="sourceList.data"
-        :pagination="sourceList.pagination"
-        :config="config"
-        :loading="loading"
-        highlight-current-row
-        :selectConfig="selectConfig"
-        searchKey="userName"
-        :table-events="{
+      <byTable :source="sourceList.data" :pagination="sourceList.pagination" :config="config" :loading="loading"
+        highlight-current-row :selectConfig="selectConfig" searchKey="userName" :table-events="{
           //element talbe事件都能传
           select: select,
-        }"
-        :action-list="[
-          {
-            text: '添加用户',
-            action: () => openModal('add'),
-            disabled: !sourceList.pagination.tenantId,
-          },
-        ]"
-        @get-list="getList"
-      >
+        }" :action-list="[
+  {
+    text: '添加用户',
+    action: () => openModal('add'),
+    disabled: !sourceList.pagination.tenantId,
+  },
+]" @get-list="getList">
         <template #slotName="{ item }">
           {{ item.createTime }}
         </template>
       </byTable>
     </div>
-    <el-dialog
-      :title="modalType == 'add' ? '新增' : '编辑'"
-      v-model="dialogVisible"
-      width="500"
-      v-loading="loading"
-    >
-      <byForm
-        :formConfig="formConfig"
-        :formOption="formOption"
-        v-model="formData.data"
-        :rules="rules"
-        ref="byform"
-      >
+    <el-dialog :title="modalType == 'add' ? '新增' : '编辑'" v-model="dialogVisible" width="500" v-loading="loading">
+      <byForm :formConfig="formConfig" :formOption="formOption" v-model="formData.data" :rules="rules" ref="byform">
         <template #account>
-          <el-input
-            style="width: 150px; margin-right: 10px"
-            v-model="formData.data.userName"
-            placeholder="请输入用户名"
-          ></el-input>
-          <el-input
-            style="width: 150px; margin-right: 10px"
-            v-model="formData.data.password"
-            placeholder="密码"
-          ></el-input>
-          <span style="color: #409eff; cursor: pointer" @click="newPassword"
-            >随机生成</span
-          >
+          <el-input style="width: 150px; margin-right: 10px" v-model="formData.data.userName"
+            placeholder="请输入用户名"></el-input>
+          <el-input style="width: 150px; margin-right: 10px" v-model="formData.data.password" placeholder="密码"></el-input>
+          <span style="color: #409eff; cursor: pointer" @click="newPassword">随机生成</span>
         </template>
       </byForm>
       <template #footer>
         <el-button @click="dialogVisible = false" size="large">取 消</el-button>
-        <el-button
-          type="primary"
-          @click="submitForm('byform')"
-          size="large"
-          :loading="submitLoading"
-        >
+        <el-button type="primary" @click="submitForm('byform')" size="large" :loading="submitLoading">
           确 定
         </el-button>
       </template>
     </el-dialog>
-    <el-dialog
-      title="修改密码"
-      v-model="roomDialogVisible"
-      width="500"
-      :before-close="handleClose"
-      v-loading="loading"
-    >
+    <el-dialog title="修改密码" v-model="roomDialogVisible" width="300" :before-close="handleClose" v-loading="loading">
       <template #footer>
-        <el-button @click="roomDialogVisible = false" size="large"
-          >取 消</el-button
-        >
-        <el-button
-          type="primary"
-          @click="submitTree('byform')"
-          size="large"
-          :loading="submitLoading"
-        >
+        <el-input v-model="password" type="password" placeholder="请输入新密码" show-password style="margin-bottom:20px" />
+        <el-button @click="roomDialogVisible = false" size="large">取 消</el-button>
+        <el-button type="primary" @click="submitPassword(password)" size="large" :loading="submitLoading">
           确 定
         </el-button>
       </template>
@@ -125,7 +73,10 @@ let rules = ref({
   nickName: [{ required: true, message: "姓名不能为空", trigger: "blur" }],
   userName: [{ required: true, message: "用户名不能为空", trigger: "blur" }],
 });
+const userId = ref("");
 const { proxy } = getCurrentInstance();
+const password = ref("");
+const roomDialogVisible = ref(false)
 const selectConfig = computed(() => {
   return [];
 });
@@ -182,12 +133,31 @@ const config = computed(() => {
         return [
           {
             attrs: {
+              label: "修改密码",
+              type: "primary",
+              text: true,
+            },
+            el: "button",
+            click() {
+              userId.value = row.userId;
+              roomDialogVisible.value = true
+            },
+          },
+          {
+            attrs: {
               label: "修改",
               type: "primary",
               text: true,
             },
             el: "button",
             click() {
+              if (!sourceList.value.pagination.tenantId) {
+                ElMessage({
+                  message: '请选择租户',
+                  type: 'warning',
+                });
+                return
+              }
               getDtl(row);
             },
           },
@@ -363,6 +333,8 @@ const treeChange = (e) => {
   console.log(e);
   sourceList.value.pagination.tenantId = e.id;
   getList({ tenantId: e.id });
+  getDept()
+
 };
 
 const openModal = () => {
@@ -405,13 +377,55 @@ const submitForm = () => {
       });
   });
 };
-
+const recursive = (data) => {
+  data.map((item) => {
+    item.label = item.deptName;
+    item.id = item.deptId;
+    if (item.children) {
+      recursive(item.children);
+    } else {
+      item.children = [];
+    }
+  });
+};
 const getDept = () => {
-  proxy.get("/system/user/deptTree").then((res) => {
-    formConfig.value[0].data = res.data;
+  proxy.get("/tenantDept/list", {
+    pageNum: 1,
+    tenantId: sourceList.value.pagination.tenantId,
+  }).then((message) => {
+    recursive(message.data);
+    formConfig.value[0].data = proxy.handleTree(message.data, "deptId");
+    console.log(formConfig.value[0].data)
   });
 };
 
+const submitPassword = (password1) => {
+  if (!password1) {
+    ElMessage({
+      message: "请输入新密码",
+      type: "warning",
+    });
+    return;
+  }
+  proxy
+    .post(
+      "/tenantUser/resetPwd",
+      {
+        password: password1,
+        userId: userId.value,
+      },
+      "PUT"
+    )
+    .then((res) => {
+      ElMessage({
+        message: "重置成功",
+        type: "success",
+      });
+      roomDialogVisible.value = false;
+      password.value = "";
+    });
+};
+
 const getDtl = (row) => {
   formData.data = { ...row };
   modalType.value = "edit";
@@ -420,7 +434,6 @@ const getDtl = (row) => {
 };
 getTreeList();
 getList();
-getDept();
 </script>
   
 <style lang="scss" scoped>
@@ -428,9 +441,11 @@ getDept();
   padding: 20px;
   display: flex;
   justify-content: space-between;
+
   .tree {
     width: 300px;
   }
+
   .content {
     width: calc(100% - 320px);
   }