ADD: 模块激活流程
This commit is contained in:
贾同学
@@ -1,96 +1,21 @@
|
||||
<template>
|
||||
<!-- style=" height: calc(100vh - 120px) !important;" -->
|
||||
<div class="homeView">
|
||||
<model v-if="!authStore.showMenuFlag"></model>
|
||||
<dashboard v-if="authStore.showMenuFlag"></dashboard>
|
||||
</div>
|
||||
|
||||
<!-- <div class="main">
|
||||
<div class="main_container">
|
||||
<div class="mode" v-for="(item, index) in modeList" :key="index">
|
||||
<div class="mode_top">
|
||||
<div class="mode_name">
|
||||
<p>
|
||||
{{ item.name }}
|
||||
</p>
|
||||
</div>
|
||||
<div class="test_button">
|
||||
<el-button
|
||||
size="small"
|
||||
dictType="primary"
|
||||
@click="handelOpen(item.isActive)"
|
||||
>进入检测</el-button
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mode_img">
|
||||
<img :src="item.img" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="homeView">
|
||||
<model v-if="!authStore.showMenuFlag"></model>
|
||||
<dashboard v-if="authStore.showMenuFlag"></dashboard>
|
||||
</div>
|
||||
</div> -->
|
||||
</template>
|
||||
<script lang="ts" setup>
|
||||
import { useRouter } from "vue-router";
|
||||
import { ElMessage } from "element-plus";
|
||||
import { useAuthStore } from "@/stores/modules/auth";
|
||||
import { useAuthStore } from '@/stores/modules/auth'
|
||||
|
||||
import model from "./tabs/model.vue";
|
||||
import dashboard from "./tabs/dashboard.vue";
|
||||
import { onMounted, ref } from "vue";
|
||||
// defineOptions({
|
||||
// name: 'home'
|
||||
// })
|
||||
const authStore = useAuthStore();
|
||||
import model from './tabs/model.vue'
|
||||
import dashboard from './tabs/dashboard.vue'
|
||||
|
||||
const activeIndex = ref("1-1");
|
||||
const router = useRouter();
|
||||
const modeList = [
|
||||
{
|
||||
name: "模拟式模式",
|
||||
code:"模拟式",
|
||||
img: new URL('/src/assets/images/dashboard/1.svg', import.meta.url).href,
|
||||
isActive: true,
|
||||
},
|
||||
{
|
||||
name: "数字式模式",
|
||||
code:"数字式",
|
||||
subName: "启用数字检测计划",
|
||||
img: new URL('/src/assets/images/dashboard/2.svg', import.meta.url).href,
|
||||
isActive: false,
|
||||
},
|
||||
{
|
||||
name: "比对式模式",
|
||||
code:"比对式",
|
||||
subName: "启用比对式检测计划",
|
||||
img: new URL('/src/assets/images/dashboard/3.svg', import.meta.url).href,
|
||||
isActive: false,
|
||||
},
|
||||
];
|
||||
const handelOpen = async (isActive: any) => {
|
||||
await authStore.setShowMenu();
|
||||
return;
|
||||
// if (isActive) {
|
||||
// router.push({ path: "/static" });
|
||||
// } else {
|
||||
// ElMessage({
|
||||
// message: "当前模式未配置",
|
||||
// type: "warning",
|
||||
// });
|
||||
// }
|
||||
};
|
||||
const handleSelect = (key: string, keyPath: string[]) => {
|
||||
//console.log(key, keyPath);
|
||||
};
|
||||
onMounted(() => {
|
||||
//console.log(111);
|
||||
|
||||
});
|
||||
const authStore = useAuthStore()
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.homeView{
|
||||
width: 100%;
|
||||
// height: calc(100vh - 120px);
|
||||
height: 100%;
|
||||
.homeView {
|
||||
width: 100%;
|
||||
// height: calc(100vh - 120px);
|
||||
height: 100%;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -1,288 +1,264 @@
|
||||
<!-- 模式切换页面 -->
|
||||
<template>
|
||||
<div class="main_container box">
|
||||
<!-- :style="{
|
||||
height: authStore?.showMenuFlag
|
||||
? 'calc(100vh - 165px)'
|
||||
: 'calc(100vh - 125px)',
|
||||
}" -->
|
||||
<div class="main_container box">
|
||||
<el-carousel :interval="5000" type="card" style="width: 60%; margin-left: 20%; height: 70%">
|
||||
<el-carousel-item
|
||||
class="mode"
|
||||
:class="{ modeBG: index != 0 }"
|
||||
v-for="(item, index) in modeList"
|
||||
:key="index"
|
||||
>
|
||||
<div class="mode_top">
|
||||
<div class="mode_name">
|
||||
{{ item.name }}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<el-carousel :interval="5000" type="card" style="width: 60%;margin-left: 20%;height: 70%;">
|
||||
<el-carousel-item class="mode" :class="{ modeBG: index != 0 }" v-for="(item, index) in modeList" :key="index">
|
||||
|
||||
<div class="mode_top">
|
||||
<div class="mode_name">
|
||||
{{ item.name }}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mode_img">
|
||||
<img :src="item.img" />
|
||||
</div>
|
||||
<div class="test_button">
|
||||
<el-button size="large" type="primary" @click="handelOpen(item)"
|
||||
:disabled="item.isActive == false">进入检测</el-button>
|
||||
</div>
|
||||
</el-carousel-item>
|
||||
</el-carousel>
|
||||
|
||||
|
||||
|
||||
<!-- <div class="mode" :class="{ modeBG: index != 0 }" v-for="(item, index) in modeList" :key="index">
|
||||
<div class="mode_top">
|
||||
<div class="mode_name">
|
||||
<p>
|
||||
{{ item.name }}
|
||||
</p>
|
||||
</div>
|
||||
<div class="test_button">
|
||||
<el-button size="small" type="primary" @click="handelOpen(item)"
|
||||
:disabled="item.isActive == false">进入检测</el-button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mode_img">
|
||||
<img :src="item.img" />
|
||||
</div>
|
||||
</div> -->
|
||||
</div>
|
||||
<div class="mode_img">
|
||||
<img :src="item.img" />
|
||||
</div>
|
||||
<div class="test_button">
|
||||
<el-button size="large" type="primary" @click="handelOpen(item)" :disabled="!item.activated">
|
||||
进入检测
|
||||
</el-button>
|
||||
</div>
|
||||
</el-carousel-item>
|
||||
</el-carousel>
|
||||
</div>
|
||||
</template>
|
||||
<script lang="ts" setup>
|
||||
import { useRouter } from "vue-router";
|
||||
import { ElMessage } from "element-plus";
|
||||
import { useAuthStore } from "@/stores/modules/auth";
|
||||
import { useModeStore, useAppSceneStore } from "@/stores/modules/mode"; // 引入模式 store
|
||||
import { ref } from "vue";
|
||||
import {getCurrentScene} from "@/api/user/login";
|
||||
import { useAuthStore } from '@/stores/modules/auth'
|
||||
import { useAppSceneStore, useModeStore } from '@/stores/modules/mode' // 引入模式 store
|
||||
import { getCurrentScene } from '@/api/user/login'
|
||||
|
||||
const authStore = useAuthStore()
|
||||
const modeStore = useModeStore() // 使用模式 store
|
||||
const AppSceneStore = useAppSceneStore()
|
||||
const activateInfo = authStore.activateInfo
|
||||
const isActivateOpen = import.meta.env.VITE_ACTIVATE_OPEN
|
||||
|
||||
const authStore = useAuthStore();
|
||||
const modeStore = useModeStore(); // 使用模式 store
|
||||
const AppSceneStore = useAppSceneStore();
|
||||
const activeIndex = ref("1-1");
|
||||
const router = useRouter();
|
||||
const modeList = [
|
||||
{
|
||||
name: "模拟式模块",
|
||||
code: "模拟式",
|
||||
subName: "未启用模拟式检测计划",
|
||||
img: new URL('/src/assets/images/dashboard/1.svg', import.meta.url).href,
|
||||
isActive: true,
|
||||
},
|
||||
{
|
||||
name: "数字式模块",
|
||||
code: "数字式",
|
||||
subName: "启用数字检测计划",
|
||||
img: new URL('/src/assets/images/dashboard/2.svg', import.meta.url).href,
|
||||
isActive: true,
|
||||
},
|
||||
{
|
||||
name: "比对式模块",
|
||||
code: "比对式",
|
||||
subName: "启用比对式检测计划",
|
||||
img: new URL('/src/assets/images/dashboard/3.svg', import.meta.url).href,
|
||||
isActive: true,
|
||||
},
|
||||
];
|
||||
{
|
||||
name: '模拟式模块',
|
||||
code: '模拟式',
|
||||
subName: '未启用模拟式检测计划',
|
||||
img: new URL('/src/assets/images/dashboard/1.svg', import.meta.url).href,
|
||||
activated:
|
||||
isActivateOpen === 'true'
|
||||
? activateInfo.simulate.apply === 1 && activateInfo.simulate.permanently === 1
|
||||
: true
|
||||
},
|
||||
{
|
||||
name: '数字式模块',
|
||||
code: '数字式',
|
||||
subName: '启用数字检测计划',
|
||||
img: new URL('/src/assets/images/dashboard/2.svg', import.meta.url).href,
|
||||
activated:
|
||||
isActivateOpen === 'true'
|
||||
? activateInfo.digital.apply === 1 && activateInfo.digital.permanently === 1
|
||||
: true
|
||||
},
|
||||
{
|
||||
name: '比对式模块',
|
||||
code: '比对式',
|
||||
subName: '启用比对式检测计划',
|
||||
img: new URL('/src/assets/images/dashboard/3.svg', import.meta.url).href,
|
||||
activated:
|
||||
isActivateOpen === 'true'
|
||||
? activateInfo.contrast.apply === 1 && activateInfo.contrast.permanently === 1
|
||||
: true
|
||||
}
|
||||
]
|
||||
const handelOpen = async (item: any) => {
|
||||
modeStore.setCurrentMode(item.code); // 将模式code存入 store
|
||||
const {data:scene} = await getCurrentScene(); // 获取当前场景
|
||||
// AppSceneStore.setCurrentMode(scene+'');//0：省级平台，1：设备出厂，2：研发自测
|
||||
AppSceneStore.setCurrentMode(scene+'');//0：省级平台，1：设备出厂，2：研发自测
|
||||
await authStore.setShowMenu();
|
||||
await authStore.getAuthMenuList();
|
||||
return;
|
||||
// if (isActive) {
|
||||
// router.push({ path: "/static" });
|
||||
// } else {
|
||||
// ElMessage({
|
||||
// message: "当前模式未配置",
|
||||
// type: "warning",
|
||||
// });
|
||||
// }
|
||||
};
|
||||
if (!item.activated) {
|
||||
ElMessage.warning(`${item.name}未激活`)
|
||||
return
|
||||
}
|
||||
modeStore.setCurrentMode(item.code) // 将模式code存入 store
|
||||
const { data: scene } = await getCurrentScene() // 获取当前场景
|
||||
AppSceneStore.setCurrentMode(scene + '') //0：省级平台，1：设备出厂，2：研发自测
|
||||
await authStore.setShowMenu()
|
||||
await authStore.getAuthMenuList()
|
||||
return
|
||||
}
|
||||
const handleSelect = (key: string, keyPath: string[]) => {
|
||||
console.log(key, keyPath);
|
||||
};
|
||||
console.log(key, keyPath)
|
||||
}
|
||||
onMounted(() => {
|
||||
console.log();
|
||||
});
|
||||
console.log()
|
||||
})
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.box {
|
||||
background: #ededed;
|
||||
// background-image: url("/src/assets/images/dashboard/DT.jpg");
|
||||
// /* 背景图垂直、水平均居中 */
|
||||
// // background-position: center center;
|
||||
// /* 背景图不平铺 */
|
||||
// background-repeat: no-repeat;
|
||||
// /* 当内容高度大于图片高度时，背景图像的位置相对于viewport固定 */
|
||||
// background-attachment: fixed;
|
||||
// /* 让背景图基于容器大小伸缩 */
|
||||
// background-size: cover;
|
||||
|
||||
|
||||
background: #ededed;
|
||||
// background-image: url("/src/assets/images/dashboard/DT.jpg");
|
||||
// /* 背景图垂直、水平均居中 */
|
||||
// // background-position: center center;
|
||||
// /* 背景图不平铺 */
|
||||
// background-repeat: no-repeat;
|
||||
// /* 当内容高度大于图片高度时，背景图像的位置相对于viewport固定 */
|
||||
// background-attachment: fixed;
|
||||
// /* 让背景图基于容器大小伸缩 */
|
||||
// background-size: cover;
|
||||
}
|
||||
|
||||
.main_container {
|
||||
width: 100%;
|
||||
// height: calc(100vh - 165px);
|
||||
height: 100%;
|
||||
// overflow-y: auto;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
flex-wrap: wrap;
|
||||
align-items: center;
|
||||
|
||||
width: 100%;
|
||||
// height: calc(100vh - 165px);
|
||||
height: 100%;
|
||||
// overflow-y: auto;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
flex-wrap: wrap;
|
||||
align-items: center;
|
||||
.mode {
|
||||
height: 99.5% !important;
|
||||
border: 1px solid #eee;
|
||||
border-radius: 6px;
|
||||
background: linear-gradient(
|
||||
180deg,
|
||||
rgba(0, 153, 255, 1) 0%,
|
||||
rgba(0, 153, 255, 1) 0%,
|
||||
rgba(0, 102, 255, 1) 65%,
|
||||
rgba(0, 51, 255, 1) 100%,
|
||||
rgba(0, 51, 255, 1) 100%
|
||||
);
|
||||
|
||||
.mode {
|
||||
position: absolute;
|
||||
|
||||
height: 99.5% !important;
|
||||
border: 1px solid #eee;
|
||||
border-radius: 6px;
|
||||
background: linear-gradient(180deg,
|
||||
rgba(0, 153, 255, 1) 0%,
|
||||
rgba(0, 153, 255, 1) 0%,
|
||||
rgba(0, 102, 255, 1) 65%,
|
||||
rgba(0, 51, 255, 1) 100%,
|
||||
rgba(0, 51, 255, 1) 100%);
|
||||
// padding: 40px 0;
|
||||
.mode_top {
|
||||
width: 100%;
|
||||
height: 40px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
background: #008aff;
|
||||
border-radius: 6px 6px 0 0;
|
||||
|
||||
position: absolute;
|
||||
.mode_name {
|
||||
width: 100%;
|
||||
height: 40px;
|
||||
font-family: '微软雅黑 Bold', '微软雅黑', '微软雅黑', sans-serif;
|
||||
font-weight: 700;
|
||||
font-style: normal;
|
||||
font-size: 20px;
|
||||
color: #ffffff;
|
||||
text-align: center;
|
||||
line-height: 40px;
|
||||
padding-left: 10px;
|
||||
// margin-top: 20px;
|
||||
|
||||
.mode_subName {
|
||||
font-family: '微软雅黑', sans-serif;
|
||||
font-weight: 400;
|
||||
font-style: normal;
|
||||
font-size: 12px;
|
||||
color: #ffffff;
|
||||
line-height: 40px;
|
||||
text-align: center;
|
||||
padding: 5px 0 0 10px;
|
||||
// margin-top: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
// padding: 40px 0;
|
||||
.mode_top {
|
||||
width: 100%;
|
||||
height: 40px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
background: #008aff;
|
||||
border-radius: 6px 6px 0 0;
|
||||
.test_button {
|
||||
display: flex;
|
||||
text-align: center;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-end;
|
||||
padding-right: 5px;
|
||||
}
|
||||
}
|
||||
|
||||
.mode_name {
|
||||
width: 100%;
|
||||
height: 40px;
|
||||
font-family: "微软雅黑 Bold", "微软雅黑", "微软雅黑", sans-serif;
|
||||
font-weight: 700;
|
||||
.mode_img {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
// padding: 30px 0 50px;
|
||||
margin-top: 100px;
|
||||
// margin-bottom: 100px;
|
||||
|
||||
img:nth-child(1) {
|
||||
width: 60%;
|
||||
height: auto;
|
||||
display: block;
|
||||
}
|
||||
|
||||
img:nth-child(2) {
|
||||
width: 70%;
|
||||
height: auto;
|
||||
display: block;
|
||||
}
|
||||
|
||||
img:nth-child(3) {
|
||||
width: 60%;
|
||||
height: auto;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
.mode_test {
|
||||
width: 100%;
|
||||
height: 40px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
margin-bottom: 20px;
|
||||
|
||||
.test_button:hover {
|
||||
background: rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.test_button {
|
||||
position: absolute;
|
||||
bottom: 30px;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
border-radius: 5px;
|
||||
font-family: '微软雅黑', sans-serif;
|
||||
font-weight: 400;
|
||||
font-style: normal;
|
||||
font-size: 20px;
|
||||
color: #ffffff;
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
line-height: 40px;
|
||||
padding-left: 10px;
|
||||
// margin-top: 20px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.mode_subName {
|
||||
font-family: "微软雅黑", sans-serif;
|
||||
font-weight: 400;
|
||||
font-style: normal;
|
||||
font-size: 12px;
|
||||
color: #ffffff;
|
||||
line-height: 40px;
|
||||
text-align: center;
|
||||
padding: 5px 0 0 10px;
|
||||
// margin-top: 10px;
|
||||
.mode:nth-child(3n + 3) {
|
||||
background: linear-gradient(
|
||||
180deg,
|
||||
rgba(0, 153, 255, 1) 0%,
|
||||
rgba(0, 153, 255, 1) 0%,
|
||||
rgba(0, 102, 255, 1) 39%,
|
||||
rgba(102, 51, 204, 1) 100%,
|
||||
rgba(102, 51, 204, 1) 100%
|
||||
);
|
||||
}
|
||||
|
||||
.mode_off {
|
||||
.mode_name,
|
||||
.mode_subName,
|
||||
.test_button {
|
||||
color: #fff !important;
|
||||
}
|
||||
}
|
||||
|
||||
.test_button {
|
||||
display: flex;
|
||||
text-align: center;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-end;
|
||||
padding-right: 5px;
|
||||
}
|
||||
.test_button:hover {
|
||||
// background: rgba(0, 0, 0, 0.2) !important;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
.mode_img {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
// padding: 30px 0 50px;
|
||||
margin-top: 100px;
|
||||
// margin-bottom: 100px;
|
||||
|
||||
img:nth-child(1) {
|
||||
width: 60%;
|
||||
height: auto;
|
||||
display: block;
|
||||
}
|
||||
|
||||
img:nth-child(2) {
|
||||
width: 70%;
|
||||
height: auto;
|
||||
display: block;
|
||||
}
|
||||
|
||||
img:nth-child(3) {
|
||||
width: 60%;
|
||||
height: auto;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
.mode_test {
|
||||
width: 100%;
|
||||
height: 40px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
margin-bottom: 20px;
|
||||
|
||||
|
||||
.test_button:hover {
|
||||
background: rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.test_button {
|
||||
position: absolute;
|
||||
bottom: 30px;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
border-radius: 5px;
|
||||
font-family: "微软雅黑", sans-serif;
|
||||
font-weight: 400;
|
||||
font-style: normal;
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
line-height: 40px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
|
||||
.mode:nth-child(3n + 3) {
|
||||
background: linear-gradient(180deg,
|
||||
rgba(0, 153, 255, 1) 0%,
|
||||
rgba(0, 153, 255, 1) 0%,
|
||||
rgba(0, 102, 255, 1) 39%,
|
||||
rgba(102, 51, 204, 1) 100%,
|
||||
rgba(102, 51, 204, 1) 100%);
|
||||
|
||||
}
|
||||
|
||||
.mode_off {
|
||||
|
||||
.mode_name,
|
||||
.mode_subName,
|
||||
.test_button {
|
||||
color: #fff !important;
|
||||
|
||||
}
|
||||
|
||||
.test_button:hover {
|
||||
// background: rgba(0, 0, 0, 0.2) !important;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
:deep(.el-sub-menu__title) {
|
||||
border-bottom: 0 !important;
|
||||
outline: none !important;
|
||||
border-bottom: 0 !important;
|
||||
outline: none !important;
|
||||
}
|
||||
|
||||
// .modeBG {
|
||||
@@ -297,13 +273,12 @@ onMounted(() => {
|
||||
// ;
|
||||
// }
|
||||
|
||||
|
||||
// }
|
||||
:deep(.el-carousel__container) {
|
||||
height: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
:deep(.el-carousel__item) {
|
||||
position: relative;
|
||||
position: relative;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -96,12 +96,20 @@ const login = (formEl: FormInstance | undefined) => {
|
||||
username: forge.util.encode64(loginForm.username),
|
||||
password: encryptPassword(loginForm.password)
|
||||
})
|
||||
ElNotification({
|
||||
title: getTimeState(),
|
||||
message: '登录成功',
|
||||
type: 'success',
|
||||
duration: 3000
|
||||
})
|
||||
userStore.setAccessToken(data.accessToken)
|
||||
userStore.setRefreshToken(data.refreshToken)
|
||||
userStore.setUserInfo(data.userInfo)
|
||||
if (loginForm.checked) {
|
||||
userStore.setExp(Date.now() + 1000 * 60 * 60 * 24 * 30)
|
||||
}
|
||||
// 设置激活信息
|
||||
await authStore.setActivateInfo()
|
||||
const response = await getDictList()
|
||||
const dictData = response.data as unknown as Dict[]
|
||||
await dictStore.initDictData(dictData)
|
||||
@@ -109,19 +117,12 @@ const login = (formEl: FormInstance | undefined) => {
|
||||
await initDynamicRouter()
|
||||
|
||||
// 3.清空 tabs、keepAlive 数据
|
||||
tabsStore.setTabs([])
|
||||
keepAliveStore.setKeepAliveName([])
|
||||
|
||||
// 4.跳转到首页
|
||||
router.push(HOME_URL)
|
||||
// 5.登录默认不显示菜单和导航栏
|
||||
authStore.resetAuthStore()
|
||||
ElNotification({
|
||||
title: getTimeState(),
|
||||
message: '登录成功',
|
||||
type: 'success',
|
||||
duration: 3000
|
||||
})
|
||||
await tabsStore.setTabs([])
|
||||
await keepAliveStore.setKeepAliveName([])
|
||||
// 登录默认不显示菜单和导航栏
|
||||
await authStore.resetAuthStore()
|
||||
// 跳转到首页
|
||||
await router.push(HOME_URL)
|
||||
} finally {
|
||||
loading.value = false
|
||||
}
|
||||
|
||||
@@ -1,55 +1,281 @@
|
||||
|
||||
<template>
|
||||
<el-dialog v-model="dialogVisible" title="程序激活" v-bind="dialogSmall">
|
||||
<el-form :model="formContent">
|
||||
<el-form-item label="程序版本号" prop="id" :label-width="100">
|
||||
<el-input v-model='formContent.id' disabled/>
|
||||
</el-form-item>
|
||||
<el-form-item label="模拟式模块" prop="type" :label-width="100">
|
||||
<el-checkbox v-model="formContent.type" label="已激活"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="数字式模块" prop="type" :label-width="100">
|
||||
<el-checkbox v-model="formContent.type" label="未激活"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="比对式模块" prop="type" :label-width="100">
|
||||
<el-checkbox v-model="formContent.type" label="未激活"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="序列号" prop="code" :label-width="100">
|
||||
<el-input v-model='formContent.code' placeholder="请输入序列号" :rows="2" type="textarea"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="注册码" prop="licenseKey" :label-width="100">
|
||||
<el-input v-model='formContent.licenseKey' placeholder="请输入注册码" :rows="2" type="textarea"/>
|
||||
</el-form-item>
|
||||
<el-dialog
|
||||
v-model="dialogVisible"
|
||||
title="程序激活"
|
||||
width="450px"
|
||||
draggable
|
||||
:close-on-click-modal="false"
|
||||
:before-close="beforeClose"
|
||||
:destroy-on-close="true"
|
||||
>
|
||||
<el-form :label-width="100" label-position="left">
|
||||
<el-form-item label="程序版本号">
|
||||
<el-text style="margin-left: 82%">{{ 'v' + versionNumber }}</el-text>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<template #footer>
|
||||
<span class="dialog-footer">
|
||||
<el-button @click="dialogVisible = false">取消</el-button>
|
||||
<el-button type="primary" @click="dialogVisible = false">激活</el-button>
|
||||
</span>
|
||||
</template>
|
||||
<el-descriptions
|
||||
class="mode-descriptions"
|
||||
v-if="!hadActivationCode"
|
||||
title="模块激活状态"
|
||||
size="small"
|
||||
></el-descriptions>
|
||||
<el-form
|
||||
ref="applicationFormRef"
|
||||
v-if="!hadActivationCode"
|
||||
:model="applicationForm"
|
||||
label-position="left"
|
||||
:label-width="100"
|
||||
>
|
||||
<el-form-item
|
||||
class="mode-item"
|
||||
v-if="activateInfo.simulate.apply !== 1 || activateInfo.simulate.permanently !== 1"
|
||||
label="模拟式模块"
|
||||
prop="simulate.apply"
|
||||
>
|
||||
<el-tag disable-transitions type="danger">未激活</el-tag>
|
||||
<el-checkbox
|
||||
:false-value="0"
|
||||
:true-value="1"
|
||||
class="apply-checkbox"
|
||||
v-model="applicationForm.simulate.apply"
|
||||
label="激活"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item
|
||||
class="mode-item"
|
||||
v-if="activateInfo.simulate.apply === 1 && activateInfo.simulate.permanently === 1"
|
||||
label="模拟式模块"
|
||||
>
|
||||
<el-tag class="activated-tag" disable-transitions type="success">已激活</el-tag>
|
||||
</el-form-item>
|
||||
<el-form-item
|
||||
class="mode-item"
|
||||
v-if="activateInfo.digital.apply !== 1 || activateInfo.digital.permanently !== 1"
|
||||
label="数字式模块"
|
||||
prop="digital.apply"
|
||||
>
|
||||
<el-tag disable-transitions type="danger">未激活</el-tag>
|
||||
<el-checkbox
|
||||
:false-value="0"
|
||||
:true-value="1"
|
||||
class="apply-checkbox"
|
||||
v-model="applicationForm.digital.apply"
|
||||
label="激活"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item
|
||||
class="mode-item"
|
||||
v-if="activateInfo.digital.apply === 1 && activateInfo.digital.permanently === 1"
|
||||
label="数字式模块"
|
||||
>
|
||||
<el-tag class="activated-tag" disable-transitions type="success">已激活</el-tag>
|
||||
</el-form-item>
|
||||
<el-form-item
|
||||
class="mode-item"
|
||||
v-if="activateInfo.contrast.apply !== 1 || activateInfo.contrast.permanently !== 1"
|
||||
label="比对式模块"
|
||||
prop="contrast.apply"
|
||||
>
|
||||
<el-tag disable-transitions type="danger">未激活</el-tag>
|
||||
<el-checkbox
|
||||
:false-value="0"
|
||||
:true-value="1"
|
||||
class="apply-checkbox"
|
||||
v-model="applicationForm.contrast.apply"
|
||||
label="激活"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item
|
||||
class="mode-item"
|
||||
v-if="activateInfo.contrast.apply === 1 && activateInfo.contrast.permanently === 1"
|
||||
label="比对式模块"
|
||||
>
|
||||
<el-tag class="activated-tag" disable-transitions type="success">已激活</el-tag>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<el-row v-if="applicationCode">
|
||||
<el-descriptions class="mode-descriptions" title="设备申请码" size="small"></el-descriptions>
|
||||
<el-tooltip placement="top-end" effect="light">
|
||||
<el-input
|
||||
v-model="applicationCode"
|
||||
:rows="5"
|
||||
type="textarea"
|
||||
readonly
|
||||
resize="none"
|
||||
class="code-display"
|
||||
/>
|
||||
<template #content>
|
||||
<el-button size="small" @click="copyCode" icon="DocumentCopy">复制</el-button>
|
||||
</template>
|
||||
</el-tooltip>
|
||||
</el-row>
|
||||
<el-row v-if="applicationCode || hadActivationCode">
|
||||
<el-descriptions class="mode-descriptions" title="设备激活码" size="small"></el-descriptions>
|
||||
<el-input
|
||||
placeholder="请输入设备激活码"
|
||||
v-model="activationCode"
|
||||
:rows="5"
|
||||
resize="none"
|
||||
type="textarea"
|
||||
class="code-input"
|
||||
/>
|
||||
</el-row>
|
||||
<template #footer v-if="!activatedAll">
|
||||
<div v-if="!applicationCode && !hadActivationCode">
|
||||
<el-button @click="cancel">取消</el-button>
|
||||
<el-button type="primary" @click="getApplicationCode">获取申请码</el-button>
|
||||
<el-button type="primary" @click="hadActivationCode = true">已有激活码</el-button>
|
||||
</div>
|
||||
<div v-if="applicationCode || hadActivationCode">
|
||||
<el-button @click="cancel">取消</el-button>
|
||||
<el-button :disabled="!activationCode" type="primary" @click="submitActivation">激活</el-button>
|
||||
</div>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { type VersionRegister } from "@/api/system/versionRegister/interface";
|
||||
import { ref } from "vue";
|
||||
import { dialogSmall } from '@/utils/elementBind'
|
||||
const formContent = ref<VersionRegister.ResSys_Reg_Res>({
|
||||
id: '', //版本注册表Id
|
||||
type: '', //版本类型（模拟式、数字式、比对式）
|
||||
code: '', //注册码
|
||||
licenseKey: '', //密钥
|
||||
expireDate: '', //到期时间
|
||||
waveRecord: 0,
|
||||
realTime: 20,
|
||||
statistics: 5,
|
||||
flicker: 1,
|
||||
state: 1, //状态
|
||||
})
|
||||
const dialogVisible = ref(false);
|
||||
const openDialog = () => {
|
||||
dialogVisible.value = true;
|
||||
};
|
||||
|
||||
defineExpose({ openDialog });
|
||||
</script>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref } from 'vue'
|
||||
import { version } from '../../../../package.json'
|
||||
import type { Activate } from '@/api/activate/interface'
|
||||
import { generateApplicationCode, verifyActivationCode } from '@/api/activate'
|
||||
import { useAuthStore } from '@/stores/modules/auth'
|
||||
|
||||
const authStore = useAuthStore()
|
||||
const activateInfo = authStore.activateInfo
|
||||
const versionNumber = ref(version)
|
||||
const applicationForm = reactive<Activate.ApplicationCodePlaintext>({
|
||||
simulate: { apply: 0 },
|
||||
digital: { apply: 0 },
|
||||
contrast: { apply: 0 }
|
||||
})
|
||||
const activatedAll = computed(() => {
|
||||
return (
|
||||
activateInfo.simulate.apply === 1 &&
|
||||
activateInfo.simulate.permanently === 1 &&
|
||||
activateInfo.digital.apply === 1 &&
|
||||
activateInfo.digital.permanently === 1 &&
|
||||
activateInfo.contrast.apply === 1 &&
|
||||
activateInfo.contrast.permanently === 1
|
||||
)
|
||||
})
|
||||
const applicationFormRef = ref()
|
||||
const hadActivationCode = ref(false)
|
||||
const applicationCode = ref('')
|
||||
const activationCode = ref('')
|
||||
const dialogVisible = ref(false)
|
||||
// 获取申请码
|
||||
const getApplicationCode = async () => {
|
||||
if (
|
||||
applicationForm.simulate.apply == 0 &&
|
||||
applicationForm.digital.apply == 0 &&
|
||||
applicationForm.contrast.apply == 0
|
||||
) {
|
||||
ElMessage.warning('请选择需要激活的模块')
|
||||
return
|
||||
}
|
||||
if (activateInfo.simulate.apply === 1) {
|
||||
applicationForm.simulate.apply = 1
|
||||
}
|
||||
if (activateInfo.digital.apply === 1) {
|
||||
applicationForm.digital.apply = 1
|
||||
}
|
||||
if (activateInfo.contrast.apply === 1) {
|
||||
applicationForm.contrast.apply = 1
|
||||
}
|
||||
|
||||
const res = await generateApplicationCode(applicationForm)
|
||||
if (res.code == 'A0000') {
|
||||
applicationCode.value = res.data as string
|
||||
}
|
||||
}
|
||||
// 复制申请码
|
||||
const copyCode = async () => {
|
||||
try {
|
||||
await navigator.clipboard.writeText(applicationCode.value)
|
||||
ElMessage.success('已复制到剪贴板')
|
||||
} catch {
|
||||
ElMessage.error('复制失败，请手动选择内容')
|
||||
}
|
||||
}
|
||||
const openDialog = () => {
|
||||
hadActivationCode.value = false
|
||||
activationCode.value = ''
|
||||
applicationCode.value = ''
|
||||
applicationForm.simulate.apply = 0
|
||||
applicationForm.digital.apply = 0
|
||||
applicationForm.contrast.apply = 0
|
||||
dialogVisible.value = true
|
||||
}
|
||||
const beforeClose = (done: Function) => {
|
||||
applicationFormRef.value.resetFields()
|
||||
done()
|
||||
}
|
||||
const cancel = () => {
|
||||
applicationFormRef.value.resetFields()
|
||||
dialogVisible.value = false
|
||||
}
|
||||
const submitActivation = async () => {
|
||||
const res = await verifyActivationCode(activationCode.value)
|
||||
if (res.code == 'A0000') {
|
||||
ElMessage.success('激活成功')
|
||||
await authStore.setActivateInfo()
|
||||
window.location.reload()
|
||||
} else {
|
||||
ElMessage.error(res.message)
|
||||
}
|
||||
}
|
||||
defineExpose({ openDialog })
|
||||
</script>
|
||||
<style scoped>
|
||||
.apply-checkbox {
|
||||
margin-left: 62%;
|
||||
}
|
||||
.activated-tag {
|
||||
margin-left: 80%;
|
||||
}
|
||||
.code-display,
|
||||
.code-input {
|
||||
font-family: consolas;
|
||||
}
|
||||
:deep(.el-tag) {
|
||||
user-select: none;
|
||||
-moz-user-select: none;
|
||||
-webkit-user-select: none;
|
||||
-ms-user-select: none;
|
||||
}
|
||||
:deep(.el-divider__text) {
|
||||
user-select: none;
|
||||
-moz-user-select: none;
|
||||
-webkit-user-select: none;
|
||||
-ms-user-select: none;
|
||||
}
|
||||
.mode-descriptions {
|
||||
user-select: none;
|
||||
-moz-user-select: none;
|
||||
-webkit-user-select: none;
|
||||
-ms-user-select: none;
|
||||
margin-top: 15px;
|
||||
}
|
||||
:deep(.el-form-item) {
|
||||
border: 1px solid #e5e7eb;
|
||||
border-radius: 4px;
|
||||
padding: 0 10px !important;
|
||||
margin-bottom: 10px !important;
|
||||
margin-right: 0 !important;
|
||||
user-select: none;
|
||||
-moz-user-select: none;
|
||||
-webkit-user-select: none;
|
||||
-ms-user-select: none;
|
||||
}
|
||||
:deep(.el-divider--horizontal) {
|
||||
margin: 10px 0 !important;
|
||||
margin-top: 20px !important;
|
||||
}
|
||||
.mode-item {
|
||||
transition: background-color 0.2s ease;
|
||||
}
|
||||
.mode-item:hover {
|
||||
background-color: #f9fafb;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user