| | |
| | | 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> |
| | |
| | | v-else-if="!state.accessToken" |
| | | :underline="false" |
| | | class="hover:cursor-pointer" |
| | | @click="toRegister" |
| | | @click="toRegister(item)" |
| | | >注册</el-link |
| | | > |
| | | <el-link |
| | | v-else |
| | | :underline="false" |
| | | class="hover:cursor-pointer" |
| | | @click="toApply" |
| | | @click="toApply(item)" |
| | | ><span v-if="item.name !== '评审专家'">申请</span></el-link |
| | | ><span v-if="item.name !== '评审专家'" class="m-2">|</span> |
| | | ><span |
| | | v-if="!state.accessToken || item.name !== '评审专家'" |
| | | class="m-2" |
| | | >|</span |
| | | > |
| | | <el-link |
| | | v-if="state.rolesCode.indexOf(item.code) !== -1" |
| | | :underline="false" |
| | |
| | | <my-footer /> |
| | | </template> |
| | | |
| | | <script lang="ts" setup> |
| | | <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"; |
| | | const router = useRouter(); |
| | | 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(); |
| | | |
| | |
| | | /** 角色(如果昵称为空则显示用户名) */ |
| | | const getUseRoles = () => { |
| | | state.userInfo = storageLocal().getItem("user-info"); |
| | | state.userInfo?.exRoles.forEach(element => { |
| | | state.userInfo?.exRoles.forEach((element: RoleItem) => { |
| | | state.rolesCode.push(element.code); |
| | | }); |
| | | }; |
| | | const state = reactive({ |
| | | roleList: [], |
| | | rolesCode: [], |
| | | userInfo: {}, |
| | | userInfo: {} as userType, |
| | | accessToken: "" |
| | | }); |
| | | onMounted(() => { |
| | | exRole().then(res => { |
| | | state.roleList = res.result; |
| | | }); |
| | | // exRole().then(res => { |
| | | // state.roleList = res.result; |
| | | // }); |
| | | state.roleList = useUserStoreHook().rolesList; |
| | | getUseRoles(); |
| | | state.accessToken = getToken()?.accessToken; |
| | | }); |
| | | |
| | | const toRegister = () => { |
| | | router.push({ name: "Register" }); |
| | | const toRegister = item => { |
| | | router.push({ name: "newRegister", query: { code: item.code } }); |
| | | }; |
| | | // 退出 |
| | | const logOut = () => { |
| | | useUserStoreHook().logOut(); |
| | | state.rolesCode = []; |
| | | state.accessToken = ""; |
| | | }; |
| | | // 申请 |
| | | const toApply = () => {}; |
| | | // 去首页 |
| | | const toWelcome = item => { |
| | | let role = state.userInfo?.exRoles.find(ele => { |
| | | return item.code == ele.code; |
| | | const toApply = item => { |
| | | addDialog({ |
| | | width: "20%", |
| | | title: "确认信息", |
| | | contentRenderer: () => <p>是否申请为{item.name}!</p>, // jsx 语法 (注意在.vue文件启用jsx语法,需要在script开启lang="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 { |
| | | } |
| | | } |
| | | }); |
| | | console.log(role); |
| | | if (role.hasFlsh) { |
| | | return router.push({ name: "Welcome" }); |
| | | } |
| | | router.push({ name: "RegisterNav", query: { code: role.code } }); |
| | | // 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", query: 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; |