From 85c54d88f139096614aea4b06f2166cae27729d7 Mon Sep 17 00:00:00 2001
From: zhangwei <1504152376@qq.com>
Date: 星期五, 22 八月 2025 10:11:19 +0800
Subject: [PATCH] 用户管理
---
src/views/home/index.vue | 400 ++++++++++++++++++++++++++++++++-------------------------
1 files changed, 224 insertions(+), 176 deletions(-)
diff --git a/src/views/home/index.vue b/src/views/home/index.vue
index 041ec08..897cbb0 100644
--- a/src/views/home/index.vue
+++ b/src/views/home/index.vue
@@ -1,23 +1,6 @@
+el
<template>
- <div class="header">
- <img width="227px" height="74px" src="@/assets/home/logo.png" alt="" />
- <img width="427px" height="74px" src="@/assets/home/Header.png" alt="" />
- <div class="other">
- <div class="item">
- <img width="21px" height="21px" src="@/assets/home/share.png" alt="" />
- <span>鍒嗕韩缃戠珯</span>
- </div>
- <div class="item">
- <img
- width="21px"
- height="21px"
- src="@/assets/home/BellFilled.png"
- alt=""
- />
- <span>鎴戠殑娑堟伅</span>
- </div>
- </div>
- </div>
+ <my-header />
<div class="banner">
<!-- <img width="100%" height="306px" src="@/assets/home/banner.png" alt="" /> -->
</div>
@@ -41,64 +24,71 @@
</div>
</div>
<div class="right">
- <el-tabs v-model="activeName" class="demo-tabs">
+ <!-- <el-tabs v-model="activeName" class="demo-tabs">
<el-tab-pane label="鎰忓悜鍏紑" name="first">
- 鎰忓悜鍏紑
- <!-- <div class="item">
- <span
- ><span style="color: #145ccd; font-weight: 600">路</span
- >銆愬洓宸濈渷鎴愰兘甯傘��2024骞寸煶鐩樿閬撲粯瀹剁鏉戠伯娌逛骇涓氬洯鍖哄強閰嶅鍩虹璁炬柦寤鸿椤圭洰纾嬪晢鍏憡</span
- >
- <span>2024-04-15 18:10</span>
- </div>
- <div class="item">
- <span
- ><span style="color: #145ccd; font-weight: 600">路</span
- >銆愬洓宸濈渷鎴愰兘甯傘�戠唺鐚胺娓稿涓績灞�閮ㄦ敼閫犻」鐩鍟嗗叕鍛�</span
- >
- <span>2024-04-15 18:10</span>
- </div>
- <div class="item">
- <span
- ><span style="color: #145ccd; font-weight: 600">路</span
- >銆愬洓宸濈渷鎴愰兘甯傘�戜腹鏅閬撴皯婀栫ぞ鍖虹孩鐧藉枩浜嬫湇鍔″満鎵�纾嬪晢鍏憡</span
- >
- <span>2024-04-15 18:10</span>
- </div>
- <div class="item">
- <span
- ><span style="color: #145ccd; font-weight: 600">路</span
- >銆愬洓宸濈渷鎴愰兘甯傘�戞垚閮戒笢閮ㄦ柊鍖轰笁宀旀箹楂樼骇涓浣撹壓涓績鍓嶄复鏃跺仠杞﹀尯鍜屾鏍￠棬涓や晶闂ㄥ崼瀹ら棿鍖哄煙榛戝寲鍙婃帓姘存彁鍗囪В闄ゅ唴娑濋」鐩鍟嗗叕鍛�</span
- >
- <span>2024-04-15 18:10</span>
- </div>
- <div class="item">
- <span
- ><span style="color: #145ccd; font-weight: 600">路</span
- >銆愬洓宸濈渷鎴愰兘甯傘�戝洓宸濈渷鎴愰兘鎴掓瘨搴峰鎵�鐥呮畫鎴掓瘨浜哄憳搴峰娲诲姩涓績缁翠慨鏀归�犻」鐩浜屾纾嬪晢鍏憡</span
- >
- <span>2024-04-15 18:10</span>
- </div>
- <div class="item">
- <span
- ><span style="color: #145ccd; font-weight: 600">路</span
- >銆愬洓宸濈渷鎴愰兘甯傘�戣�佸共閮ㄦ椿鍔ㄤ腑蹇冭淇敼閫犻」鐩鍟嗗叕鍛�</span
- >
- <span>2024-04-15 18:10</span>
- </div>
- <div class="item">
- <span
- ><span style="color: #145ccd; font-weight: 600">路</span
- >銆愬洓宸濈渷鎴愰兘甯傘�戦噾鐗涘尯鎶㈤櫓鏁戠伨宸ョ▼椤圭洰宸ョ▼闃熶紞鍌ㄥ搴擄紙鎴垮缓銆佸競鏀跨被锛夋嫑鏍囧叕鍛�</span
- >
- <span>2024-04-15 18:10</span>
- </div> -->
- </el-tab-pane>
+ 鎰忓悜鍏紑 -->
+ <div class="item">
+ <span
+ ><span style="color: #145ccd; font-weight: 600">路</span
+ >銆愬洓宸濈渷鎴愰兘甯傘��2024骞寸煶鐩樿閬撲粯瀹剁鏉戠伯娌逛骇涓氬洯鍖哄強閰嶅鍩虹璁炬柦寤鸿椤圭洰纾嬪晢鍏憡</span
+ >
+ <span>2024-04-15 18:10</span>
+ </div>
+ <div class="item">
+ <span
+ ><span style="color: #145ccd; font-weight: 600">路</span
+ >銆愬洓宸濈渷鎴愰兘甯傘�戠唺鐚胺娓稿涓績灞�閮ㄦ敼閫犻」鐩鍟嗗叕鍛�</span
+ >
+ <span>2024-04-15 18:10</span>
+ </div>
+ <div class="item">
+ <span
+ ><span style="color: #145ccd; font-weight: 600">路</span
+ >銆愬洓宸濈渷鎴愰兘甯傘�戜腹鏅閬撴皯婀栫ぞ鍖虹孩鐧藉枩浜嬫湇鍔″満鎵�纾嬪晢鍏憡</span
+ >
+ <span>2024-04-15 18:10</span>
+ </div>
+ <div class="item">
+ <span
+ ><span style="color: #145ccd; font-weight: 600">路</span
+ >銆愬洓宸濈渷鎴愰兘甯傘�戞垚閮戒笢閮ㄦ柊鍖轰笁宀旀箹楂樼骇涓浣撹壓涓績鍓嶄复鏃跺仠杞﹀尯鍜屾鏍￠棬涓や晶闂ㄥ崼瀹ら棿鍖哄煙榛戝寲鍙婃帓姘存彁鍗囪В闄ゅ唴娑濋」鐩鍟嗗叕鍛�</span
+ >
+ <span>2024-04-15 18:10</span>
+ </div>
+ <div class="item">
+ <span
+ ><span style="color: #145ccd; font-weight: 600">路</span
+ >銆愬洓宸濈渷鎴愰兘甯傘�戝洓宸濈渷鎴愰兘鎴掓瘨搴峰鎵�鐥呮畫鎴掓瘨浜哄憳搴峰娲诲姩涓績缁翠慨鏀归�犻」鐩浜屾纾嬪晢鍏憡</span
+ >
+ <span>2024-04-15 18:10</span>
+ </div>
+ <div class="item">
+ <span
+ ><span style="color: #145ccd; font-weight: 600">路</span
+ >銆愬洓宸濈渷鎴愰兘甯傘�戣�佸共閮ㄦ椿鍔ㄤ腑蹇冭淇敼閫犻」鐩鍟嗗叕鍛�</span
+ >
+ <span>2024-04-15 18:10</span>
+ </div>
+ <div class="item">
+ <span
+ ><span style="color: #145ccd; font-weight: 600">路</span
+ >銆愬洓宸濈渷鎴愰兘甯傘�戦噾鐗涘尯鎶㈤櫓鏁戠伨宸ョ▼椤圭洰宸ョ▼闃熶紞鍌ㄥ搴擄紙鎴垮缓銆佸競鏀跨被锛夋嫑鏍囧叕鍛�</span
+ >
+ <span>2024-04-15 18:10</span>
+ </div>
+ <div class="item">
+ <span
+ ><span style="color: #145ccd; font-weight: 600">路</span
+ >銆愬洓宸濈渷鎴愰兘甯傘�戦噾鐗涘尯鎶㈤櫓鏁戠伨宸ョ▼椤圭洰宸ョ▼闃熶紞鍌ㄥ搴擄紙鎴垮缓銆佸競鏀跨被锛夋嫑鏍囧叕鍛�</span
+ >
+ <span>2024-04-15 18:10</span>
+ </div>
+ <!-- </el-tab-pane>
<el-tab-pane label="宸ョ▼鎷涙爣" name="second">宸ョ▼鎷涙爣</el-tab-pane>
<el-tab-pane label="璐х墿鎷涙爣" name="third">璐х墿鎷涙爣</el-tab-pane>
<el-tab-pane label="鏈嶅姟鎷涙爣" name="fourth">鏈嶅姟鎷涙爣</el-tab-pane>
- <el-tab-pane label="缃戜笂绔炰环" name="fourth">缃戜笂绔炰环</el-tab-pane>
- </el-tabs>
+ <el-tab-pane label="缃戜笂绔炰环" name="fourth1">缃戜笂绔炰环</el-tab-pane>
+ </el-tabs> -->
</div>
</div>
<div class="daixie">
@@ -140,7 +130,7 @@
<div class="user">
<div class="all">
<div class="left">
- <div class="item item1">
+ <div v-for="item in state.roleList" :key="item.id" class="item item1">
<div class="box">
<img
width="18px"
@@ -148,65 +138,55 @@
src="@/assets/home/car1.png"
alt=""
/>
- 閲囪喘浜�
+ {{ item.name }}
</div>
<div>
- <span class="hover:cursor-pointer" @click="toRegister">娉ㄥ唽</span
- ><span class="m-2">|</span
- ><span class="hover:cursor-pointer" @click="toLogin">鐧诲綍</span>
- </div>
- </div>
- <div class="item">
- <div class="box">
- <img
- width="18px"
- height="18px"
- src="@/assets/home/car.png"
- alt=""
- />
- 浠ｇ悊鏈烘瀯
- </div>
- <div>
- <span class="hover:cursor-pointer" @click="toRegister">娉ㄥ唽</span
- ><span class="m-2">|</span
- ><span class="hover:cursor-pointer" @click="toLogin">鐧诲綍</span>
- </div>
- </div>
- <div class="item">
- <div class="box">
- <img
- width="18px"
- height="18px"
- src="@/assets/home/car.png"
- alt=""
- />渚涘簲鍟�
- </div>
- <div>
- <span class="hover:cursor-pointer" @click="toRegister">娉ㄥ唽</span
- ><span class="m-2">|</span
- ><span class="hover:cursor-pointer" @click="toLogin">鐧诲綍</span>
- </div>
- </div>
- <div class="item">
- <div class="box">
- <img
- width="18px"
- height="18px"
- src="@/assets/home/car.png"
- alt=""
- />璇勫涓撳
- </div>
- <div>
- <span class="hover:cursor-pointer" @click="toRegister">娉ㄥ唽</span
- ><span class="m-2">|</span
- ><span class="hover:cursor-pointer" @click="toLogin">鐧诲綍</span>
+ <el-link
+ v-if="state.rolesCode.indexOf(item.code) !== -1"
+ :underline="false"
+ class="hover:cursor-pointer"
+ @click="logOut"
+ >閫�鍑�</el-link
+ >
+ <el-link
+ v-else-if="!state.accessToken"
+ :underline="false"
+ class="hover:cursor-pointer"
+ @click="toRegister(item)"
+ >娉ㄥ唽</el-link
+ >
+ <el-link
+ v-else
+ :underline="false"
+ class="hover:cursor-pointer"
+ @click="toApply(item)"
+ ><span v-if="item.name !== '璇勫涓撳'">鐢宠</span></el-link
+ ><span
+ v-if="!state.accessToken || item.name !== '璇勫涓撳'"
+ class="m-2"
+ >|</span
+ >
+ <el-link
+ v-if="state.rolesCode.indexOf(item.code) !== -1"
+ :underline="false"
+ class="hover:cursor-pointer"
+ @click="toWelcome(item)"
+ >杩涘叆</el-link
+ >
+ <el-link
+ v-else
+ :underline="false"
+ class="hover:cursor-pointer"
+ :disabled="!!state.accessToken"
+ @click="toLogin(item)"
+ >鐧诲綍</el-link
+ >
</div>
</div>
</div>
<div class="right" />
</div>
</div>
-
<div class="more">
<div class="content">
<div class="item">
@@ -398,57 +378,108 @@
<my-footer />
</template>
-<script lang="ts" setup>
-import { ref } from "vue";
-import myFooter from "./component/myFooter.vue";
-let activeName = ref("first");
+<script lang="tsx" setup>
+import { onMounted, ref, computed, reactive } from "vue";
+import MyFooter from "./component/myFooter.vue";
+import MyHeader from "./component/myHeader.vue";
+import { useUserStoreHook } from "@/store/modules/user";
+import { exRole } from "@/api/register/index";
+import { storageLocal, isString, isIncludeAllChildren } from "@pureadmin/utils";
+import { initRouter, getTopMenu } from "@/router/utils";
+
+import { getToken } from "@/utils/auth";
import { useRoute, useRouter } from "vue-router";
-defineOptions({
- name: "Home"
-});
const router = useRouter();
-const toRegister = () => {
- router.push({ name: "Register" });
+import { useUserStore } from "@/store/modules/user";
+import { addDialog } from "@/components/ReDialog";
+import { applyRole } from "@/api/register/index";
+import { message } from "@/utils/message";
+import type { userType } from "@/store/types";
+import type { RoleItem } from "@/api/types";
+
+const userStore = useUserStore();
+
+// 璁块棶 state 灞炴��
+// console.log(userStore.roles,'-'); // 鐩存帴鑾峰彇鍊�
+defineOptions({
+ name: "MainPage"
+});
+let activeName = ref("first");
+/** 瑙掕壊锛堝鏋滄樀绉颁负绌哄垯鏄剧ず鐢ㄦ埛鍚嶏級 */
+const getUseRoles = () => {
+ state.userInfo = storageLocal().getItem("user-info");
+ state.userInfo?.exRoles.forEach((element: RoleItem) => {
+ state.rolesCode.push(element.code);
+ });
};
-const toLogin = () => {
+const state = reactive({
+ roleList: [],
+ rolesCode: [],
+ userInfo: {} as userType,
+ accessToken: ""
+});
+onMounted(() => {
+ // exRole().then(res => {
+ // state.roleList = res.result;
+ // });
+ state.roleList = useUserStoreHook().rolesList;
+ getUseRoles();
+ state.accessToken = getToken()?.accessToken;
+});
+
+const toRegister = item => {
+ router.push({ name: "newRegister", query: { code: item.code } });
+};
+// 閫�鍑�
+const logOut = () => {
+ useUserStoreHook().logOut();
+ state.rolesCode = [];
+ state.accessToken = "";
+};
+// 鐢宠
+const toApply = item => {
+ addDialog({
+ width: "20%",
+ title: "纭淇℃伅",
+ contentRenderer: () => <p>鏄惁鐢宠涓簕item.name}锛�</p>, // jsx 璇硶 锛堟敞鎰忓湪.vue鏂囦欢鍚敤jsx璇硶锛岄渶瑕佸湪script寮�鍚痩ang="tsx"锛�
+ closeCallBack: ({ options, args }) => {
+ if (args?.command === "cancel") {
+ // 鎮ㄧ偣鍑讳簡鍙栨秷鎸夐挳
+ } else if (args?.command === "sure") {
+ applyRole({ ruleCode: item.code }).then(res => {
+ if (res.code == 200) {
+ message("鐢宠鎴愬姛锛�", { type: "success" });
+ } else {
+ message(res?.message || "鐢宠澶辫触锛�", { type: "error" });
+ }
+ });
+ } else {
+ }
+ }
+ });
+ // router.push({ name: "RegisterNav", query: { code: item.code } });
+};
+// 鍘婚椤�
+const toWelcome = async item => {
+ // if (useUserStoreHook().nowRole.code !== item.code) {
+ // 鑾峰彇鍚庣璺敱
+ initRouter().then(() => {
+ console.log("hhhh");
+
+ useUserStoreHook().changeLogoInExRule({
+ ruleCode: item.code
+ });
+ router.push({ name: "Welcome" });
+ });
+ // }
+};
+// 鍘荤櫥褰�
+const toLogin = item => {
router.push({ name: "Login" });
};
</script>
<style lang="scss" scoped>
-.header {
- display: flex;
- align-items: center;
- justify-content: space-evenly;
- height: 80px;
- width: 100%;
- .middle {
- width: 50%;
- display: flex;
- justify-content: space-around;
- color: rgb(51, 51, 51);
- font-family: 鎬濇簮榛戜綋;
- }
- .other {
- display: flex;
- .item {
- display: flex;
- justify-content: center;
- width: 63px;
- height: 48px;
- color: rgb(51, 51, 51);
- font-family: 鎬濇簮榛戜綋;
- font-size: 12px;
- font-weight: 400;
- line-height: 20px;
- letter-spacing: 0%;
- text-align: left;
- text-transform: capitalize;
- flex-wrap: wrap;
- margin-right: 10px;
- }
- }
-}
.banner {
// left: -3.76px;
// top: 80px;
@@ -552,9 +583,12 @@
justify-content: space-between;
align-items: center;
padding: 0 30px;
- height: 25%;
+ height: 23%;
text-align: left;
color: #5f5f5f;
+ // box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
+ border-radius: 6px;
+ margin-bottom: 10px;
.box {
display: flex;
justify-content: center;
@@ -569,13 +603,13 @@
color: #ffffff;
}
}
- .left :first-child {
- border-top-left-radius: 8px;
- border-top-right-radius: 8px;
- }
- .left *:not(:first-child):not(:last-child) {
- border-bottom: #c6c6c6 1px solid;
- }
+ // .left :first-child {
+ // border-top-left-radius: 8px;
+ // border-top-right-radius: 8px;
+ // }
+ // .left *:not(:first-child):not(:last-child) {
+ // border-bottom: #c6c6c6 1px solid;
+ // }
.right {
background: #a9b3c4;
width: 75%;
@@ -721,4 +755,18 @@
border-radius: 4px;
}
}
+a {
+ font-size: 16px;
+
+ // font-weight: 600;
+ color: #fff;
+}
+a:hover,
+a:active {
+ color: #fff;
+}
+.el-link.is-disabled {
+ color: #a8abb2;
+ cursor: not-allowed;
+}
</style>
--
Gitblit v1.9.1