ClientApps/pqs-9100_client
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

ADD: 模块激活流程

Browse Source
This commit is contained in:
贾同学
2025-10-14 19:00:47 +08:00
parent 7afccb58fd
commit 55ff45f9a9
16 changed files with 976 additions and 811 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
frontend/src/api/activate/index.ts Normal file
View File

@@ -0,0 +1,14 @@
import http from '@/api'
import type { Activate } from '@/api/activate/interface'
export const generateApplicationCode = (params: Activate.ApplicationCodePlaintext) => {
return http.post(`/activate/generateApplicationCode`, params)
}
export const verifyActivationCode = (activationCode: string) => {
return http.post(`/activate/verifyActivationCode`, { activationCode })
}
export const getLicense = () => {
return http.post(`/activate/getLicense`)
}

55
frontend/src/api/activate/interface/index.ts Normal file
View File

@@ -0,0 +1,55 @@
//激活模块
export namespace Activate {
export interface ApplicationModule {
/**
* 是否申请 1是 0否
*/
apply: number;
}
export interface ActivateModule extends ApplicationModule {
/**
* 是否永久 1是 0否
*/
permanently: number;
}
export interface ApplicationCodePlaintext {
/**
* 模拟式模块
*/
simulate: ApplicationModule;
/**
* 数字式模块
*/
digital: ApplicationModule;
/**
* 比对式模块
*/
contrast: ApplicationModule;
}
export interface ActivationCodePlaintext {
/**
* 模拟式模块
*/
simulate: ActivateModule;
/**
* 数字式模块
*/
digital: ActivateModule;
/**
* 比对式模块
*/
contrast: ActivateModule;
}
}

67
frontend/src/layouts/components/Footer/index.vue
View File

@@ -1,24 +1,21 @@
<template>
<div class="footer flx-align-center pl10">
<el-dropdown>
<!-- <span class="el-dropdown-link">
{{ title }}
<el-icon class="el-icon--right">
<arrow-down />
</el-icon>
</span> -->
<!-- <el-button dictType="primary"> -->
<div class="change_mode">
{{ title }}
<el-icon class="el-icon--right change_mode_down"><arrow-down /></el-icon>
<el-icon class="el-icon--right change_mode_up"><arrow-up /></el-icon>
</div>
<!-- </el-button> -->
<template #dropdown>
<el-dropdown-menu>
<el-dropdown-item @click="handelOpen('模拟式')">模拟式模块</el-dropdown-item>
<el-dropdown-item @click="handelOpen('数字式')">数字式模块</el-dropdown-item>
<el-dropdown-item @click="handelOpen('比对式')">比对式模块</el-dropdown-item>
<el-dropdown-item
v-for="item in modeList"
:key="item.key"
:disabled="!item.activated"
@click="handelOpen(item.code, item.key)"
>
{{ item.name }}
</el-dropdown-item>
</el-dropdown-menu>
</template>
</el-dropdown>
@@ -31,26 +28,52 @@
import { computed } from 'vue'
import { useAuthStore } from '@/stores/modules/auth'
import { useModeStore } from '@/stores/modules/mode' // 引入模式 store
import { useRouter } from 'vue-router'
const router = useRouter()
const authStore = useAuthStore()
const modeStore = useModeStore()
const title = computed(() => {
return modeStore.currentMode === '' ? '模拟式模块' : modeStore.currentMode + '模块'
return modeStore.currentMode === '' ? '选择模块' : modeStore.currentMode + '模块'
})
const handelOpen = async (item: string) => {
const activateInfo = authStore.activateInfo
const isActivateOpen = import.meta.env.VITE_ACTIVATE_OPEN
const modeList = [
{
name: '模拟式模块',
code: '模拟式',
key: 'simulate',
activated:
isActivateOpen === 'true'
? activateInfo.simulate.apply === 1 && activateInfo.simulate.permanently === 1
: true
},
{
name: '数字式模块',
code: '数字式',
key: 'digital',
activated:
isActivateOpen === 'true'
? activateInfo.digital.apply === 1 && activateInfo.digital.permanently === 1
: true
},
{
name: '比对式模块',
code: '比对式',
key: 'contrast',
activated:
isActivateOpen === 'true'
? activateInfo.contrast.apply === 1 && activateInfo.contrast.permanently === 1
: true
}
]
const handelOpen = async (item: string, key: string) => {
if (isActivateOpen === 'true' && (activateInfo[key].apply !== 1 || activateInfo[key].permanently !== 1)) {
ElMessage.warning(`${item}模块未激活`)
return
}
await authStore.setShowMenu()
modeStore.setCurrentMode(item) // 将模式code存入 store
//if (router.currentRoute.value.path === '/home/index') {
// 强制刷新页面
window.location.reload()
//} else {
// router.push({ path: '/home/index' });
//}
}
</script>
<style scoped lang="scss">

350
frontend/src/layouts/components/Header/components/Avatar.vue
View File

@@ -1,218 +1,212 @@
<template>
<!-- <div class="userInfo">-->
<!-- <div class="icon">-->
<!-- <Avatar/>-->
<!-- </div>-->
<!-- <div class="username">-->
<!-- {{ username }}-->
<!-- </div>-->
<!-- </div>-->
<el-dropdown trigger="click">
<div class="userInfo">
<div class="icon">
<Avatar />
</div>
<div class="username">
{{ username }}
</div>
</div>
<template #dropdown>
<el-dropdown-menu>
<el-dropdown-item @click="openDialog('themeRef')">
<el-icon><Sunny /></el-icon>{{ t("header.changeTheme") }}
</el-dropdown-item>
<el-dropdown-item @click="openDialog('infoRef')">
<el-icon><User /></el-icon>{{ t("header.personalData") }}
</el-dropdown-item>
<el-dropdown-item @click="openDialog('passwordRef')">
<el-icon><Edit /></el-icon>{{ t("header.changePassword") }}
</el-dropdown-item>
<el-dropdown-item @click="changeMode">
<el-icon><Switch /></el-icon>{{ t("header.changeMode") }}
</el-dropdown-item>
<el-dropdown-item @click="openDialog('versionRegisterRef')">
<el-icon><SetUp /></el-icon>{{ t("header.versionRegister") }}
</el-dropdown-item>
<el-dropdown trigger="hover" placement="left-start" v-if="userStore.userInfo.loginName == 'root'">
<div class="custom-dropdown-trigger">
<el-icon><Tools /></el-icon>
<span>{{ t("header.changeScene") }}</span>
</div>
<template #dropdown>
<el-dropdown-menu>
<el-dropdown-item
v-for="item in dictStore.getDictData('app_scene')"
:key="item.value"
:class="{
'custom-dropdown-item': true,
active: item.value === appSceneStore.currentScene
}"
@click="changeScene(item.value?? '')"
:disabled = "item.value === appSceneStore.currentScene"
>
{{ item.name }}
</el-dropdown-item>
<!-- <div class="userInfo">-->
<!-- <div class="icon">-->
<!-- <Avatar/>-->
<!-- </div>-->
<!-- <div class="username">-->
<!-- {{ username }}-->
<!-- </div>-->
<!-- </div>-->
<el-dropdown trigger="click">
<div class="userInfo">
<div class="icon">
<Avatar />
</div>
<div class="username">
{{ username }}
</div>
</div>
<template #dropdown>
<el-dropdown-menu>
<el-dropdown-item @click="openDialog('themeRef')">
<el-icon><Sunny /></el-icon>
{{ t('header.changeTheme') }}
</el-dropdown-item>
<el-dropdown-item @click="openDialog('infoRef')">
<el-icon><User /></el-icon>
{{ t('header.personalData') }}
</el-dropdown-item>
<el-dropdown-item @click="openDialog('passwordRef')">
<el-icon><Edit /></el-icon>
{{ t('header.changePassword') }}
</el-dropdown-item>
<el-dropdown-item @click="changeMode" v-if="authStore.showMenuFlag">
<el-icon><Switch /></el-icon>
{{ t('header.changeMode') }}
</el-dropdown-item>
<el-dropdown-item @click="openDialog('versionRegisterRef')">
<el-icon><SetUp /></el-icon>
{{ t('header.versionRegister') }}
</el-dropdown-item>
<el-dropdown trigger="hover" placement="left-start" v-if="userStore.userInfo.loginName == 'root'">
<div class="custom-dropdown-trigger">
<el-icon><Tools /></el-icon>
<span>{{ t('header.changeScene') }}</span>
</div>
<template #dropdown>
<el-dropdown-menu>
<el-dropdown-item
v-for="item in dictStore.getDictData('app_scene')"
:key="item.value"
:class="{
'custom-dropdown-item': true,
active: item.value === appSceneStore.currentScene
}"
@click="changeScene(item.value ?? '')"
:disabled="item.value === appSceneStore.currentScene"
>
{{ item.name }}
</el-dropdown-item>
</el-dropdown-menu>
</template>
</el-dropdown>
</el-dropdown-menu>
</template>
</el-dropdown>
</el-dropdown-menu>
</template>
</el-dropdown>
<div class="avatar">
<img src="@/assets/icons/out_login.svg" alt="avatar" @click="logout" />
</div>
<!-- infoDialog -->
<InfoDialog ref="infoRef"></InfoDialog>
<!-- passwordDialog -->
<PasswordDialog ref="passwordRef"></PasswordDialog>
<!-- versionRegisterDialog -->
<VersionDialog ref="versionRegisterRef"></VersionDialog>
</template>
</el-dropdown>
<div class="avatar">
<img src="@/assets/icons/out_login.svg" alt="avatar" @click="logout" />
</div>
<!-- infoDialog -->
<InfoDialog ref="infoRef"></InfoDialog>
<!-- passwordDialog -->
<PasswordDialog ref="passwordRef"></PasswordDialog>
<!-- versionRegisterDialog -->
<VersionDialog ref="versionRegisterRef"></VersionDialog>
<!-- ThemeDialog -->
<ThemeDialog ref="themeRef"></ThemeDialog>
</template>
<script setup lang="ts">
import { ref } from "vue";
import { LOGIN_URL } from "@/config";
import { useRouter } from "vue-router";
import { logoutApi } from "@/api/user/login";
import { useUserStore } from "@/stores/modules/user";
import { ElMessageBox, ElMessage, CHANGE_EVENT } from "element-plus";
import InfoDialog from "./InfoDialog.vue";
import PasswordDialog from "./PasswordDialog.vue";
import ThemeDialog from "./ThemeDialog.vue";
import VersionDialog from "@/views/system/versionRegister/index.vue";
import { computed } from "vue";
import { ArrowLeft, Avatar, Delete, Document, Sunny, Switch ,Tools} from "@element-plus/icons-vue";
import AssemblySize from "./components/AssemblySize.vue";
import Language from "./components/Language.vue";
import SearchMenu from "./components/SearchMenu.vue";
import ThemeSetting from "./components/ThemeSetting.vue";
import Message from "./components/Message.vue";
import Fullscreen from "./components/Fullscreen.vue";
import { useAuthStore } from "@/stores/modules/auth";
import {useDictStore} from "@/stores/modules/dict";
import { useModeStore,useAppSceneStore } from "@/stores/modules/mode";
const userStore = useUserStore();
const dictStore = useDictStore();
const username = computed(() => userStore.userInfo.name);
import { computed, ref } from 'vue'
import { LOGIN_URL } from '@/config'
import { useRouter } from 'vue-router'
import { logoutApi } from '@/api/user/login'
import { useUserStore } from '@/stores/modules/user'
import { ElMessage, ElMessageBox } from 'element-plus'
import InfoDialog from './InfoDialog.vue'
import PasswordDialog from './PasswordDialog.vue'
import ThemeDialog from './ThemeDialog.vue'
import VersionDialog from '@/views/system/versionRegister/index.vue'
import { Avatar, Sunny, Switch, Tools } from '@element-plus/icons-vue'
import { useAuthStore } from '@/stores/modules/auth'
import { useDictStore } from '@/stores/modules/dict'
import { useAppSceneStore, useModeStore } from '@/stores/modules/mode'
import { useTheme } from '@/hooks/useTheme'
import { useI18n } from 'vue-i18n'
import { updateScene } from '@/api/system/base/index'
const router = useRouter();
const authStore = useAuthStore();
const modeStore = useModeStore();
const AppSceneStore = useAppSceneStore();
import { useTheme } from "@/hooks/useTheme";
import { useI18n } from "vue-i18n";
import {updateScene} from '@/api/system/base/index'
const userStore = useUserStore()
const dictStore = useDictStore()
const username = computed(() => userStore.userInfo.name)
const router = useRouter()
const authStore = useAuthStore()
const modeStore = useModeStore()
const AppSceneStore = useAppSceneStore()
const { changePrimary} = useTheme();
const { changePrimary } = useTheme()
// 初始化 i18n
const { t } = useI18n(); // 使用 t 方法替代 $t
const { t } = useI18n() // 使用 t 方法替代 $t
// 退出登录
const logout = () => {
ElMessageBox.confirm("您是否确认退出登录?", "温馨提示", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning",
}).then(async () => {
// 1.执行退出登录接口
await logoutApi();
// 2.清除 Token
userStore.setAccessToken("");
userStore.setRefreshToken("");
userStore.setExp(0)
userStore.setUserInfo({id: "", name: ""});
userStore.setIsRefreshToken(false)
dictStore.setDictData([]);
modeStore.setCurrentMode('');
AppSceneStore.setCurrentMode('');
// 3.重定向到登陆页
router.replace(LOGIN_URL);
ElMessage.success("退出登录成功！");
//重置菜单/导航栏权限
authStore.resetAuthStore();
});
};
ElMessageBox.confirm('您是否确认退出登录?', '温馨提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(async () => {
// 1.执行退出登录接口
await logoutApi()
// 2.清除 Token
userStore.setAccessToken('')
userStore.setRefreshToken('')
userStore.setExp(0)
userStore.setUserInfo({ id: '', name: '' })
userStore.setIsRefreshToken(false)
dictStore.setDictData([])
modeStore.setCurrentMode('')
AppSceneStore.setCurrentMode('')
// 3.重定向到登陆页
ElMessage.success('退出登录成功！')
//重置菜单/导航栏权限
await authStore.resetAuthStore()
await router.push(LOGIN_URL)
})
}
// 打开修改密码和个人信息弹窗
const infoRef = ref<InstanceType<typeof InfoDialog> | null>(null);
const passwordRef = ref<InstanceType<typeof PasswordDialog> | null>(null);
const versionRegisterRef = ref<InstanceType<typeof VersionDialog> | null>(null);
const themeRef = ref<InstanceType<typeof ThemeDialog> | null>(null);
const infoRef = ref<InstanceType<typeof InfoDialog> | null>(null)
const passwordRef = ref<InstanceType<typeof PasswordDialog> | null>(null)
const versionRegisterRef = ref<InstanceType<typeof VersionDialog> | null>(null)
const themeRef = ref<InstanceType<typeof ThemeDialog> | null>(null)
const openDialog = (ref: string) => {
if (ref == "infoRef") infoRef.value?.openDialog();
if (ref == "passwordRef") passwordRef.value?.openDialog();
if (ref == "versionRegisterRef") versionRegisterRef.value?.openDialog();
if (ref == "themeRef") themeRef.value?.openDialog();
};
if (ref == 'infoRef') infoRef.value?.openDialog()
if (ref == 'passwordRef') passwordRef.value?.openDialog()
if (ref == 'versionRegisterRef') versionRegisterRef.value?.openDialog()
if (ref == 'themeRef') themeRef.value?.openDialog()
}
const appSceneStore = useAppSceneStore();
const appSceneStore = useAppSceneStore()
const changeScene = async (value: string) => {
appSceneStore.setCurrentMode(value);
await updateScene({scene :dictStore.getDictData('app_scene').find(item => item.value == value)?.id});
// 强制刷新页面
window.location.reload();
};
appSceneStore.setCurrentMode(value)
await updateScene({ scene: dictStore.getDictData('app_scene').find(item => item.value == value)?.id })
// 强制刷新页面
window.location.reload()
}
//模式切换
const changeMode = () => {
authStore.changeModel();
};
authStore.changeModel()
}
</script>
<style scoped lang="scss">
.userInfo {
min-width: 80px;
display: flex;
justify-content: flex-start;
align-items: center;
cursor: pointer;
.icon {
width: 18px;
height: 18px;
color: #fff !important;
}
.username {
color: #fff;
font-size: 16px;
margin-left: 10px;
}
min-width: 80px;
display: flex;
justify-content: flex-start;
align-items: center;
cursor: pointer;
.icon {
width: 18px;
height: 18px;
color: #fff !important;
}
.username {
color: #fff;
font-size: 16px;
margin-left: 10px;
}
}
.avatar {
width: 40px;
height: 40px;
overflow: hidden;
display: flex;
align-items: center;
justify-content: flex-end;
cursor: pointer;
// border-radius: 50%;
img {
// width: 100%;
// height: 100%;
}
width: 40px;
height: 40px;
overflow: hidden;
display: flex;
align-items: center;
justify-content: flex-end;
cursor: pointer;
// border-radius: 50%;
img {
// width: 100%;
// height: 100%;
}
}
.custom-dropdown-trigger {
padding: 8px 15px;
cursor: pointer;
display: flex;
align-items: center;
gap: 8px;
padding: 8px 15px;
cursor: pointer;
display: flex;
align-items: center;
gap: 8px;
}
:deep(.el-dropdown-menu__item.custom-dropdown-item.active),
:deep(.el-dropdown-menu__item.custom-dropdown-item.active:hover) {
background-color: var(--el-color-primary-light-9) !important;
color: var(--el-color-primary)
background-color: var(--el-color-primary-light-9) !important;
color: var(--el-color-primary);
}
</style>

92
frontend/src/routers/index.ts
View File

@@ -3,14 +3,14 @@ import { useUserStore } from '@/stores/modules/user'
import { useAuthStore } from '@/stores/modules/auth'
import { LOGIN_URL, ROUTER_WHITE_LIST } from '@/config'
import { initDynamicRouter } from '@/routers/modules/dynamicRouter'
import { staticRouter, errorRouter } from '@/routers/modules/staticRouter'
import { staticRouter } from '@/routers/modules/staticRouter'
import NProgress from '@/config/nprogress'
const mode = import.meta.env.VITE_ROUTER_MODE
const routerMode = {
hash: () => createWebHashHistory(),
history: () => createWebHistory(),
hash: () => createWebHashHistory(),
history: () => createWebHistory()
}
/**
@@ -30,76 +30,80 @@ const routerMode = {
* @param meta.isKeepAlive ==> 当前路由是否缓存
* */
const router = createRouter({
history: routerMode[mode](),
routes: [...staticRouter],
// 不区分路由大小写，非严格模式下提供了更宽松的路径匹配
strict: false,
// 页面刷新时，滚动条位置还原
scrollBehavior: () => ({ left: 0, top: 0 }),
history: routerMode[mode](),
routes: [...staticRouter],
// 不区分路由大小写，非严格模式下提供了更宽松的路径匹配
strict: false,
// 页面刷新时，滚动条位置还原
scrollBehavior: () => ({ left: 0, top: 0 })
})
/**
* @description 路由拦截 beforeEach
* */
router.beforeEach(async (to, from, next) => {
const userStore = useUserStore()
const authStore = useAuthStore()
// 1.NProgress 开始
NProgress.start()
// 2.动态设置标题
const title = import.meta.env.VITE_GLOB_APP_TITLE
document.title = to.meta.title ? `${to.meta.title} - ${title}` : title
const userStore = useUserStore()
const authStore = useAuthStore()
// 1.NProgress 开始
NProgress.start()
// 2.动态设置标题
const title = import.meta.env.VITE_GLOB_APP_TITLE
document.title = to.meta.title ? `${to.meta.title} - ${title}` : title
// 3.判断是访问登陆页，有 Token 就在当前页面，没有 Token 重置路由到登陆页
if (to.path.toLocaleLowerCase() === LOGIN_URL) {
if (userStore.accessToken) return next(from.fullPath)
resetRouter()
return next()
}
// 3.判断是访问登陆页，有 Token 就在当前页面，没有 Token 重置路由到登陆页
if (to.path.toLocaleLowerCase() === LOGIN_URL) {
if (userStore.accessToken) return next(from.fullPath)
resetRouter()
return next()
}
// 4.判断访问页面是否在路由白名单地址(静态路由)中，如果存在直接放行
if (ROUTER_WHITE_LIST.includes(to.path)) return next()
// 4.判断访问页面是否在路由白名单地址(静态路由)中，如果存在直接放行
if (ROUTER_WHITE_LIST.includes(to.path)) return next()
// 5.判断是否有 Token，没有重定向到 login 页面
if (!userStore.accessToken) return next({ path: LOGIN_URL, replace: true })
// 5.判断是否有 Token，没有重定向到 login 页面
if (!userStore.accessToken) return next({ path: LOGIN_URL, replace: true })
// 6.如果没有菜单列表，就重新请求菜单列表并添加动态路由
if (!authStore.authMenuListGet.length) {
await initDynamicRouter()
return next({ ...to, replace: true })
}
// 6.如果没有菜单列表，就重新请求菜单列表并添加动态路由
if (!authStore.authMenuListGet.length) {
await initDynamicRouter()
return next({ ...to, replace: true })
}
// 7.存储 routerName 做按钮权限筛选
authStore.setRouteName(to.name as string)
// 8.正常访问页面
next()
// 7.存储 routerName 做按钮权限筛选
await authStore.setRouteName(to.name as string)
// 8. 当前页面是否有激活信息，没有就刷新
const activateInfo = authStore.activateInfo
if (!Object.keys(activateInfo).length) {
await authStore.setActivateInfo()
}
// 9.正常访问页面
next()
})
/**
* @description 重置路由
* */
export const resetRouter = () => {
const authStore = useAuthStore()
authStore.flatMenuListGet.forEach(route => {
const { name } = route
if (name && router.hasRoute(name)) router.removeRoute(name)
})
const authStore = useAuthStore()
authStore.flatMenuListGet.forEach(route => {
const { name } = route
if (name && router.hasRoute(name)) router.removeRoute(name)
})
}
/**
* @description 路由跳转错误
* */
router.onError(error => {
NProgress.done()
//console.warn('路由错误', error.message)
NProgress.done()
//console.warn('路由错误', error.message)
})
/**
* @description 路由跳转结束
* */
router.afterEach(() => {
NProgress.done()
NProgress.done()
})
export default router

3
frontend/src/routers/modules/staticRouter.ts
View File

@@ -1,5 +1,6 @@
import { RouteRecordRaw } from 'vue-router'
import { type RouteRecordRaw } from 'vue-router'
import { HOME_URL, LOGIN_URL } from '@/config'
export const Layout = () => import('@/layouts/index.vue')
/**
* staticRouter (静态路由)

180
frontend/src/stores/modules/auth.ts
View File

@@ -1,89 +1,89 @@
import { defineStore } from "pinia";
import { AuthState } from "@/stores/interface";
import { getAuthButtonListApi, getAuthMenuListApi } from "@/api/user/login";
import {
getFlatMenuList,
getShowMenuList,
getAllBreadcrumbList,
} from "@/utils";
import { useRouter } from "vue-router";
import { AUTH_STORE_KEY } from "@/stores/constant";
import {useModeStore} from '@/stores/modules/mode'
import { defineStore } from 'pinia'
import { AuthState } from '@/stores/interface'
import { getAuthButtonListApi, getAuthMenuListApi } from '@/api/user/login'
import { getAllBreadcrumbList, getFlatMenuList, getShowMenuList } from '@/utils'
import { useRouter } from 'vue-router'
import { AUTH_STORE_KEY } from '@/stores/constant'
import { useModeStore } from '@/stores/modules/mode'
import { getLicense } from '@/api/activate'
import type { Activate } from '@/api/activate/interface'
export const useAuthStore = defineStore({
id: AUTH_STORE_KEY,
state: (): AuthState => ({
// 按钮权限列表
authButtonList: {},
// 菜单权限列表
authMenuList: [],
// 当前页面的 router name，用来做按钮权限筛选
routeName: "",
//登录不显示菜单栏和导航栏，点击进入测试的时候显示
showMenuFlag: JSON.parse(localStorage.getItem("showMenuFlag")),
router: useRouter(),
}),
getters: {
// 按钮权限列表
authButtonListGet: (state) => state.authButtonList,
// 菜单权限列表 ==> 这里的菜单没有经过任何处理
authMenuListGet: (state) => state.authMenuList,
// 菜单权限列表 ==> 左侧菜单栏渲染，需要剔除 isHide == true
showMenuListGet: (state) => getShowMenuList(state.authMenuList),
// 菜单权限列表 ==> 扁平化之后的一维数组菜单，主要用来添加动态路由
flatMenuListGet: (state) => getFlatMenuList(state.authMenuList),
// 递归处理后的所有面包屑导航列表
breadcrumbListGet: (state) => getAllBreadcrumbList(state.authMenuList),
//是否显示菜单和导航栏
showMenuFlagGet: (state) => state.showMenuFlag,
},
actions: {
// Get AuthButtonList
async getAuthButtonList() {
const { data } = await getAuthButtonListApi();
this.authButtonList = data;
id: AUTH_STORE_KEY,
state: (): AuthState => ({
// 按钮权限列表
authButtonList: {},
// 菜单权限列表
authMenuList: [],
// 当前页面的 router name，用来做按钮权限筛选
routeName: '',
//登录不显示菜单栏和导航栏，点击进入测试的时候显示
showMenuFlag: JSON.parse(localStorage.getItem('showMenuFlag') as string),
router: useRouter(),
activateInfo: {}
}),
getters: {
// 按钮权限列表
authButtonListGet: state => state.authButtonList,
// 菜单权限列表 ==> 这里的菜单没有经过任何处理
authMenuListGet: state => state.authMenuList,
// 菜单权限列表 ==> 左侧菜单栏渲染，需要剔除 isHide == true
showMenuListGet: state => getShowMenuList(state.authMenuList),
// 菜单权限列表 ==> 扁平化之后的一维数组菜单，主要用来添加动态路由
flatMenuListGet: state => getFlatMenuList(state.authMenuList),
// 递归处理后的所有面包屑导航列表
breadcrumbListGet: state => getAllBreadcrumbList(state.authMenuList),
//是否显示菜单和导航栏
showMenuFlagGet: state => state.showMenuFlag,
// 获取激活信息
activateInfoGet: state => state.activateInfo
},
// Get AuthMenuList
async getAuthMenuList() {
const modeStore = useModeStore()
const { data: menuData } = await getAuthMenuListApi();
// 根据不同模式过滤菜单
const filteredMenu = modeStore.currentMode === '比对式'
? filterMenuByExcludedNames(menuData, ['testSource', 'testScript', 'controlSource'])
: filterMenuByExcludedNames(menuData, ['standardDevice']);
this.authMenuList = filteredMenu;
},
// Set RouteName
async setRouteName(name: string) {
this.routeName = name;
},
//重置权限
async resetAuthStore() {
this.showMenuFlag = false;
localStorage.removeItem("showMenuFlag");
},
//修改判断菜单栏/导航栏显示条件
async setShowMenu() {
this.showMenuFlag = true;
localStorage.setItem("showMenuFlag", true);
},
//更改模式
async changeModel() {
this.showMenuFlag = !this.showMenuFlag;
if (this.showMenuFlag) {
localStorage.setItem("showMenuFlag", true);
} else {
localStorage.removeItem("showMenuFlag");
}
this.router.push({ path: "/home/index" });
},
},
});
actions: {
// Get AuthButtonList
async getAuthButtonList() {
const { data } = await getAuthButtonListApi()
this.authButtonList = data
},
// Get AuthMenuList
async getAuthMenuList() {
const modeStore = useModeStore()
const { data: menuData } = await getAuthMenuListApi()
// 根据不同模式过滤菜单
const filteredMenu =
modeStore.currentMode === '比对式'
? filterMenuByExcludedNames(menuData, ['testSource', 'testScript', 'controlSource'])
: filterMenuByExcludedNames(menuData, ['standardDevice'])
this.authMenuList = filteredMenu
},
// Set RouteName
async setRouteName(name: string) {
this.routeName = name
},
//重置权限
async resetAuthStore() {
this.showMenuFlag = false
localStorage.removeItem('showMenuFlag')
},
//修改判断菜单栏/导航栏显示条件
async setShowMenu() {
this.showMenuFlag = true
localStorage.setItem('showMenuFlag', 'true')
},
//更改模式
async changeModel() {
this.showMenuFlag = false
localStorage.removeItem('showMenuFlag')
this.router.push({ path: '/home/index' })
},
async setActivateInfo() {
const license_result = await getLicense()
const licenseData = license_result.data as unknown as Activate.ActivationCodePlaintext
this.activateInfo = licenseData
}
}
})
/**
* 通用菜单过滤函数
@@ -92,12 +92,12 @@ export const useAuthStore = defineStore({
* @returns 过滤后的菜单列表
*/
function filterMenuByExcludedNames(menuList: any[], excludedNames: string[]): any[] {
return menuList.filter(menu => {
// 如果当前项有 children，递归处理子项
if (menu.children && menu.children.length > 0) {
menu.children = filterMenuByExcludedNames(menu.children, excludedNames);
}
// 过滤掉在排除列表中的菜单项
return !excludedNames.includes(menu.name);
});
return menuList.filter(menu => {
// 如果当前项有 children，递归处理子项
if (menu.children && menu.children.length > 0) {
menu.children = filterMenuByExcludedNames(menu.children, excludedNames)
}
// 过滤掉在排除列表中的菜单项
return !excludedNames.includes(menu.name)
})
}

18
frontend/src/utils/ipcRenderer.js
View File

@@ -1,5 +1,10 @@
const Renderer =
(window.require && window.require('electron')) || window.electron || {}
declare global {
interface Window {
electron?: any;
}
}
const Renderer = (window.require && window.require('electron')) || window.electron || {};
/**
* ipc
@@ -21,11 +26,14 @@ const Renderer =
/**
* ipc
*/
const ipc = Renderer.ipcRenderer || undefined
const ipc = Renderer.ipcRenderer || undefined;
/**
* 是否为EE环境
*/
const isEE = ipc ? true : false
const isEE = ipc ? true : false;
export {
Renderer, ipc, isEE
};
export { Renderer, ipc, isEE }

97
frontend/src/views/home/index.vue
View File

@@ -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>

485
frontend/src/views/home/tabs/model.vue
View File

@@ -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>

27
frontend/src/views/login/components/LoginForm.vue
View File

@@ -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
}

330
frontend/src/views/system/versionRegister/index.vue
View File

@@ -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>