style: 格式化代码
时启龙
parent
f680726a29
commit
6299a389fe
|
|
@ -1,58 +1,58 @@
|
|||
{
|
||||
"globals": {
|
||||
"EffectScope": true,
|
||||
"computed": true,
|
||||
"createApp": true,
|
||||
"customRef": true,
|
||||
"defineAsyncComponent": true,
|
||||
"defineComponent": true,
|
||||
"effectScope": true,
|
||||
"getCurrentInstance": true,
|
||||
"getCurrentScope": true,
|
||||
"h": true,
|
||||
"inject": true,
|
||||
"isProxy": true,
|
||||
"isReactive": true,
|
||||
"isReadonly": true,
|
||||
"isRef": true,
|
||||
"markRaw": true,
|
||||
"nextTick": true,
|
||||
"onActivated": true,
|
||||
"onBeforeMount": true,
|
||||
"onBeforeUnmount": true,
|
||||
"onBeforeUpdate": true,
|
||||
"onDeactivated": true,
|
||||
"onErrorCaptured": true,
|
||||
"onMounted": true,
|
||||
"onRenderTracked": true,
|
||||
"onRenderTriggered": true,
|
||||
"onScopeDispose": true,
|
||||
"onServerPrefetch": true,
|
||||
"onUnmounted": true,
|
||||
"onUpdated": true,
|
||||
"provide": true,
|
||||
"reactive": true,
|
||||
"readonly": true,
|
||||
"ref": true,
|
||||
"resolveComponent": true,
|
||||
"shallowReactive": true,
|
||||
"shallowReadonly": true,
|
||||
"shallowRef": true,
|
||||
"toRaw": true,
|
||||
"toRef": true,
|
||||
"toRefs": true,
|
||||
"triggerRef": true,
|
||||
"unref": true,
|
||||
"useAttrs": true,
|
||||
"useCssModule": true,
|
||||
"useCssVars": true,
|
||||
"useSlots": true,
|
||||
"watch": true,
|
||||
"watchEffect": true,
|
||||
"watchPostEffect": true,
|
||||
"watchSyncEffect": true,
|
||||
"ElMessageBox": true,
|
||||
"ElMessage": true,
|
||||
"ElNotification": true
|
||||
}
|
||||
}
|
||||
"globals": {
|
||||
"EffectScope": true,
|
||||
"computed": true,
|
||||
"createApp": true,
|
||||
"customRef": true,
|
||||
"defineAsyncComponent": true,
|
||||
"defineComponent": true,
|
||||
"effectScope": true,
|
||||
"getCurrentInstance": true,
|
||||
"getCurrentScope": true,
|
||||
"h": true,
|
||||
"inject": true,
|
||||
"isProxy": true,
|
||||
"isReactive": true,
|
||||
"isReadonly": true,
|
||||
"isRef": true,
|
||||
"markRaw": true,
|
||||
"nextTick": true,
|
||||
"onActivated": true,
|
||||
"onBeforeMount": true,
|
||||
"onBeforeUnmount": true,
|
||||
"onBeforeUpdate": true,
|
||||
"onDeactivated": true,
|
||||
"onErrorCaptured": true,
|
||||
"onMounted": true,
|
||||
"onRenderTracked": true,
|
||||
"onRenderTriggered": true,
|
||||
"onScopeDispose": true,
|
||||
"onServerPrefetch": true,
|
||||
"onUnmounted": true,
|
||||
"onUpdated": true,
|
||||
"provide": true,
|
||||
"reactive": true,
|
||||
"readonly": true,
|
||||
"ref": true,
|
||||
"resolveComponent": true,
|
||||
"shallowReactive": true,
|
||||
"shallowReadonly": true,
|
||||
"shallowRef": true,
|
||||
"toRaw": true,
|
||||
"toRef": true,
|
||||
"toRefs": true,
|
||||
"triggerRef": true,
|
||||
"unref": true,
|
||||
"useAttrs": true,
|
||||
"useCssModule": true,
|
||||
"useCssVars": true,
|
||||
"useSlots": true,
|
||||
"watch": true,
|
||||
"watchEffect": true,
|
||||
"watchPostEffect": true,
|
||||
"watchSyncEffect": true,
|
||||
"ElMessageBox": true,
|
||||
"ElMessage": true,
|
||||
"ElNotification": true
|
||||
}
|
||||
}
|
||||
|
|
|
|||
40
.eslintrc.js
40
.eslintrc.js
|
|
@ -1,26 +1,18 @@
|
|||
module.exports = {
|
||||
"env": {
|
||||
"browser": true,
|
||||
"es2021": true
|
||||
},
|
||||
"parser": "vue-eslint-parser",
|
||||
"extends": [
|
||||
"eslint:recommended",
|
||||
"plugin:vue/vue3-essential",
|
||||
"plugin:@typescript-eslint/recommended",
|
||||
'./.eslintrc-auto-import.json'
|
||||
],
|
||||
"parserOptions": {
|
||||
"ecmaVersion": "latest",
|
||||
"parser": "@typescript-eslint/parser",
|
||||
"sourceType": "module"
|
||||
},
|
||||
"plugins": [
|
||||
"vue",
|
||||
"@typescript-eslint"
|
||||
],
|
||||
"rules": {
|
||||
'@typescript-eslint/no-explicit-any': 0,
|
||||
'vue/multi-word-component-names': 0
|
||||
}
|
||||
env: {
|
||||
browser: true,
|
||||
es2021: true
|
||||
},
|
||||
parser: 'vue-eslint-parser',
|
||||
extends: ['eslint:recommended', 'plugin:vue/vue3-essential', 'plugin:@typescript-eslint/recommended', './.eslintrc-auto-import.json'],
|
||||
parserOptions: {
|
||||
ecmaVersion: 'latest',
|
||||
parser: '@typescript-eslint/parser',
|
||||
sourceType: 'module'
|
||||
},
|
||||
plugins: ['vue', '@typescript-eslint'],
|
||||
rules: {
|
||||
'@typescript-eslint/no-explicit-any': 0,
|
||||
'vue/multi-word-component-names': 0
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
export default {
|
||||
preprocessorOptions: {
|
||||
scss: {
|
||||
additionalData: '@use "@/css/element-var.scss" as *;$--color-primary: #1E54D5;$namesapce:czhj;',
|
||||
additionalData: '@use "@/css/element-var.scss" as *;$--color-primary: #1E54D5;$namesapce:czhj;'
|
||||
},
|
||||
less: {
|
||||
javascriptEnabled: true,
|
||||
|
|
@ -9,7 +9,7 @@ export default {
|
|||
'primary-color': '#1E54D5'
|
||||
},
|
||||
charset: false
|
||||
},
|
||||
}
|
||||
// postcss: {
|
||||
// plugins: [
|
||||
// {
|
||||
|
|
@ -25,4 +25,4 @@ export default {
|
|||
// ]
|
||||
// }
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@
|
|||
* @Date: 2022-11-10 10:46:38
|
||||
* @LastEditTime: 2022-11-10 12:10:52
|
||||
* @LastEditors: Haijun Zhang
|
||||
* @Description:
|
||||
* @Description:
|
||||
* @FilePath: \main-web-qiankun\build\plugin.ts
|
||||
*/
|
||||
import vue from '@vitejs/plugin-vue'
|
||||
|
|
@ -29,7 +29,7 @@ export default [
|
|||
ElementPlusResolver(),
|
||||
// 自动导入图标组件
|
||||
IconsResolver({
|
||||
prefix: 'Icon',
|
||||
prefix: 'Icon'
|
||||
})
|
||||
],
|
||||
eslintrc: {
|
||||
|
|
@ -37,9 +37,9 @@ export default [
|
|||
enabled: false,
|
||||
// 生成文件地址和名称
|
||||
filepath: './.eslintrc-auto-import.json',
|
||||
globalsPropValue: true,
|
||||
globalsPropValue: true
|
||||
},
|
||||
dts: path.resolve(pathSrc, 'auto-imports.d.ts'),
|
||||
dts: path.resolve(pathSrc, 'auto-imports.d.ts')
|
||||
}),
|
||||
createSvgIconsPlugin({
|
||||
// Specify the icon folder to be cached
|
||||
|
|
@ -55,23 +55,23 @@ export default [
|
|||
}),
|
||||
// 自动注册图标组件
|
||||
IconsResolver({
|
||||
prefix: 'icon',
|
||||
prefix: 'icon'
|
||||
// enabledCollections: ['ep'],
|
||||
})
|
||||
],
|
||||
dts: path.resolve(pathSrc, 'components.d.ts'),
|
||||
dts: path.resolve(pathSrc, 'components.d.ts')
|
||||
}),
|
||||
Icons({
|
||||
autoInstall: true,
|
||||
autoInstall: true
|
||||
}),
|
||||
createStyleImportPlugin({
|
||||
libs: [
|
||||
//
|
||||
//
|
||||
{
|
||||
libraryName: 'element-plus',
|
||||
esModule: true,
|
||||
resolveStyle: (name) => {
|
||||
const component = name.replace('el-', '');
|
||||
resolveStyle: name => {
|
||||
const component = name.replace('el-', '')
|
||||
return `element-plus/theme-chalk/src/${component}.scss`
|
||||
}
|
||||
}
|
||||
|
|
@ -79,6 +79,6 @@ export default [
|
|||
}),
|
||||
Unocss(),
|
||||
eslintPlugin({
|
||||
include: ['src/**/*.ts', 'src/**/*.vue', 'src/**/*.js'],
|
||||
include: ['src/**/*.ts', 'src/**/*.vue', 'src/**/*.js']
|
||||
})
|
||||
]
|
||||
]
|
||||
|
|
|
|||
|
|
@ -27,4 +27,4 @@ export default {
|
|||
secure: false
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,5 +1,4 @@
|
|||
|
||||
// eslint-disable-next-line no-undef
|
||||
module.exports = {
|
||||
extends: ['@commitlint/config-conventional']
|
||||
};
|
||||
}
|
||||
|
|
|
|||
32
index.html
32
index.html
|
|
@ -1,23 +1,22 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" />
|
||||
<!-- <meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests"> -->
|
||||
<title>混合云管理平台</title>
|
||||
<link rel="stylesheet" href="/web-common-resource/css/loading.css">
|
||||
</head>
|
||||
<link rel="stylesheet" href="/web-common-resource/css/loading.css" />
|
||||
</head>
|
||||
|
||||
<body id="cmp">
|
||||
<body id="cmp">
|
||||
<div class="loading">
|
||||
<div class="loader-inner line-scale-pulse-out-rapid">
|
||||
<div></div>
|
||||
<div></div>
|
||||
<div></div>
|
||||
<div></div>
|
||||
<div></div>
|
||||
</div>
|
||||
<div class="loader-inner line-scale-pulse-out-rapid">
|
||||
<div></div>
|
||||
<div></div>
|
||||
<div></div>
|
||||
<div></div>
|
||||
<div></div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="master-container"></div>
|
||||
<script type="module" src="/src/main.ts"></script>
|
||||
|
|
@ -26,6 +25,5 @@
|
|||
<script src="/web-common-resource/dll/dll.vendor.js" global></script>
|
||||
<script src="/web-common-resource/dll/dll.element.js" global></script>
|
||||
<script src="/web-common-resource/dll/element-ui@2.13.0/index.min.js" global></script> -->
|
||||
</body>
|
||||
|
||||
</html>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
132
package.json
132
package.json
|
|
@ -1,68 +1,68 @@
|
|||
{
|
||||
"name": "main-web",
|
||||
"version": "6.5.0",
|
||||
"private": true,
|
||||
"author": "Haijun Zhang <zhanghaijun@beyondcent.com>",
|
||||
"scripts": {
|
||||
"serve": "vite",
|
||||
"build": "vue-tsc --noEmit && vite build",
|
||||
"preview": "vite preview",
|
||||
"lint": "eslint src/**/*.{js,jsx,vue,ts,tsx} --fix",
|
||||
"precommit": "lint-staged"
|
||||
},
|
||||
"dependencies": {
|
||||
"axios": "^0.27.2",
|
||||
"clipboard": "^2.0.11",
|
||||
"cmp-socket": "1.0.0",
|
||||
"crypto-js": "^4.1.1",
|
||||
"dayjs": "^1.11.4",
|
||||
"element-plus": "^2.2.12",
|
||||
"js-cookie": "^3.0.1",
|
||||
"lodash-es": "^4.17.21",
|
||||
"nprogress": "^0.2.0",
|
||||
"path-to-regexp": "^6.2.1",
|
||||
"qiankun": "^2.7.4",
|
||||
"qs": "^6.11.0",
|
||||
"vue": "^3.2.37",
|
||||
"vue-router": "^4.1.3",
|
||||
"vuex": "^4.0.2"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@commitlint/cli": "^17.0.3",
|
||||
"@commitlint/config-conventional": "^17.0.3",
|
||||
"@iconify-json/ep": "^1.1.6",
|
||||
"@types/js-cookie": "^3.0.2",
|
||||
"@types/node": "^18.6.2",
|
||||
"@types/nprogress": "^0.2.0",
|
||||
"@typescript-eslint/eslint-plugin": "^5.32.0",
|
||||
"@typescript-eslint/parser": "^5.32.0",
|
||||
"@vitejs/plugin-vue": "^3.0.0",
|
||||
"consola": "^2.15.3",
|
||||
"eslint": "^8.21.0",
|
||||
"eslint-plugin-vue": "^9.3.0",
|
||||
"fast-glob": "^3.2.11",
|
||||
"sass": "^1.54.0",
|
||||
"typescript": "^4.6.4",
|
||||
"unocss": "^0.45.1",
|
||||
"unplugin-auto-import": "^0.10.2",
|
||||
"unplugin-icons": "^0.14.7",
|
||||
"unplugin-vue-components": "^0.21.2",
|
||||
"vite": "^3.0.0",
|
||||
"vite-plugin-eslint": "^1.7.0",
|
||||
"vite-plugin-style-import": "^2.0.0",
|
||||
"vite-plugin-svg-icons": "^2.0.1",
|
||||
"vue-tsc": "^0.38.4"
|
||||
},
|
||||
"lint-staged": {
|
||||
"src/**/*.{js,vue}": [
|
||||
"eslint --fix",
|
||||
"git add"
|
||||
]
|
||||
},
|
||||
"husky": {
|
||||
"hooks": {
|
||||
"pre-commit": "lint-staged",
|
||||
"commit-msg": "commitlint -E HUSKY_GIT_PARAMS"
|
||||
}
|
||||
"name": "main-web",
|
||||
"version": "6.5.0",
|
||||
"private": true,
|
||||
"author": "Haijun Zhang <zhanghaijun@beyondcent.com>",
|
||||
"scripts": {
|
||||
"serve": "vite",
|
||||
"build": "vue-tsc --noEmit && vite build",
|
||||
"preview": "vite preview",
|
||||
"lint": "eslint src/**/*.{js,jsx,vue,ts,tsx} --fix",
|
||||
"precommit": "lint-staged"
|
||||
},
|
||||
"dependencies": {
|
||||
"axios": "^0.27.2",
|
||||
"clipboard": "^2.0.11",
|
||||
"cmp-socket": "1.0.0",
|
||||
"crypto-js": "^4.1.1",
|
||||
"dayjs": "^1.11.4",
|
||||
"element-plus": "^2.2.12",
|
||||
"js-cookie": "^3.0.1",
|
||||
"lodash-es": "^4.17.21",
|
||||
"nprogress": "^0.2.0",
|
||||
"path-to-regexp": "^6.2.1",
|
||||
"qiankun": "^2.7.4",
|
||||
"qs": "^6.11.0",
|
||||
"vue": "^3.2.37",
|
||||
"vue-router": "^4.1.3",
|
||||
"vuex": "^4.0.2"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@commitlint/cli": "^17.0.3",
|
||||
"@commitlint/config-conventional": "^17.0.3",
|
||||
"@iconify-json/ep": "^1.1.6",
|
||||
"@types/js-cookie": "^3.0.2",
|
||||
"@types/node": "^18.6.2",
|
||||
"@types/nprogress": "^0.2.0",
|
||||
"@typescript-eslint/eslint-plugin": "^5.32.0",
|
||||
"@typescript-eslint/parser": "^5.32.0",
|
||||
"@vitejs/plugin-vue": "^3.0.0",
|
||||
"consola": "^2.15.3",
|
||||
"eslint": "^8.21.0",
|
||||
"eslint-plugin-vue": "^9.3.0",
|
||||
"fast-glob": "^3.2.11",
|
||||
"sass": "^1.54.0",
|
||||
"typescript": "^4.6.4",
|
||||
"unocss": "^0.45.1",
|
||||
"unplugin-auto-import": "^0.10.2",
|
||||
"unplugin-icons": "^0.14.7",
|
||||
"unplugin-vue-components": "^0.21.2",
|
||||
"vite": "^3.0.0",
|
||||
"vite-plugin-eslint": "^1.7.0",
|
||||
"vite-plugin-style-import": "^2.0.0",
|
||||
"vite-plugin-svg-icons": "^2.0.1",
|
||||
"vue-tsc": "^0.38.4"
|
||||
},
|
||||
"lint-staged": {
|
||||
"src/**/*.{js,vue}": [
|
||||
"eslint --fix",
|
||||
"git add"
|
||||
]
|
||||
},
|
||||
"husky": {
|
||||
"hooks": {
|
||||
"pre-commit": "lint-staged",
|
||||
"commit-msg": "commitlint -E HUSKY_GIT_PARAMS"
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
2065
pnpm-lock.yaml
2065
pnpm-lock.yaml
File diff suppressed because it is too large
Load Diff
|
|
@ -1,42 +1,43 @@
|
|||
{
|
||||
"homePath": "/scr-web/dashboard",
|
||||
"apps": [{
|
||||
"name": "cmp-web",
|
||||
"hasPlugin": true
|
||||
},
|
||||
{
|
||||
"name": "cos-web"
|
||||
},
|
||||
{
|
||||
"name": "cms-web"
|
||||
},
|
||||
{
|
||||
"name": "sms-web"
|
||||
},
|
||||
{
|
||||
"name": "cop-web"
|
||||
},
|
||||
{
|
||||
"name": "ams-web"
|
||||
},
|
||||
{
|
||||
"name": "itsm-web"
|
||||
},
|
||||
{
|
||||
"name": "aos-web"
|
||||
},
|
||||
{
|
||||
"name": "oms-web"
|
||||
},
|
||||
{
|
||||
"name": "log-web"
|
||||
},
|
||||
{
|
||||
"name": "scr-web"
|
||||
},
|
||||
{
|
||||
"name": "ros-plugin",
|
||||
"activeRule": "/cmp-web/ros-plugin"
|
||||
}
|
||||
]
|
||||
"homePath": "/scr-web/dashboard",
|
||||
"apps": [
|
||||
{
|
||||
"name": "cmp-web",
|
||||
"hasPlugin": true
|
||||
},
|
||||
{
|
||||
"name": "cos-web"
|
||||
},
|
||||
{
|
||||
"name": "cms-web"
|
||||
},
|
||||
{
|
||||
"name": "sms-web"
|
||||
},
|
||||
{
|
||||
"name": "cop-web"
|
||||
},
|
||||
{
|
||||
"name": "ams-web"
|
||||
},
|
||||
{
|
||||
"name": "itsm-web"
|
||||
},
|
||||
{
|
||||
"name": "aos-web"
|
||||
},
|
||||
{
|
||||
"name": "oms-web"
|
||||
},
|
||||
{
|
||||
"name": "log-web"
|
||||
},
|
||||
{
|
||||
"name": "scr-web"
|
||||
},
|
||||
{
|
||||
"name": "ros-plugin",
|
||||
"activeRule": "/cmp-web/ros-plugin"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
<template>
|
||||
<el-config-provider namespace="czhj" :locale="zhCn" >
|
||||
<el-config-provider namespace="czhj" :locale="zhCn">
|
||||
<router-view v-if="showMainApp"></router-view>
|
||||
<Home v-else-if="getToken()"></Home>
|
||||
</el-config-provider>
|
||||
|
|
|
|||
|
|
@ -30,6 +30,7 @@ declare module '@vue/runtime-core' {
|
|||
ElRow: typeof import('element-plus/es')['ElRow']
|
||||
ElScrollbar: typeof import('element-plus/es')['ElScrollbar']
|
||||
ElSubMenu: typeof import('element-plus/es')['ElSubMenu']
|
||||
ElSwitch: typeof import('element-plus/es')['ElSwitch']
|
||||
ElTooltip: typeof import('element-plus/es')['ElTooltip']
|
||||
Empty: typeof import('./components/empty/Empty.vue')['default']
|
||||
IconEpArrowDown: typeof import('~icons/ep/arrow-down')['default']
|
||||
|
|
|
|||
|
|
@ -12,17 +12,17 @@
|
|||
export default {
|
||||
props: {
|
||||
image: {
|
||||
type: String,
|
||||
type: String
|
||||
},
|
||||
icon: {
|
||||
type: String,
|
||||
default: 'el-icon-tickets',
|
||||
default: 'el-icon-tickets'
|
||||
},
|
||||
description: {
|
||||
type: String,
|
||||
default: '暂无数据',
|
||||
},
|
||||
},
|
||||
default: '暂无数据'
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
|
|
|
|||
|
|
@ -715,7 +715,7 @@ export default {
|
|||
|
||||
// 添加其他参数
|
||||
if (typeof params === 'object' && params) {
|
||||
Object.keys(params).forEach((k) => {
|
||||
Object.keys(params).forEach(k => {
|
||||
fmData.append(k, params[k])
|
||||
})
|
||||
}
|
||||
|
|
@ -748,7 +748,7 @@ export default {
|
|||
client.upload.addEventListener('progress', uploadProgress, false) // 监听进度
|
||||
// 设置header
|
||||
if (typeof headers === 'object' && headers) {
|
||||
Object.keys(headers).forEach((k) => {
|
||||
Object.keys(headers).forEach(k => {
|
||||
client.setRequestHeader(k, headers[k])
|
||||
})
|
||||
}
|
||||
|
|
@ -775,7 +775,7 @@ export default {
|
|||
},
|
||||
created() {
|
||||
// 绑定按键esc隐藏此插件事件
|
||||
document.addEventListener('keyup', (e) => {
|
||||
document.addEventListener('keyup', e => {
|
||||
if (this.value && (e.key === 'Escape' || e.keyCode === 27)) {
|
||||
this.off()
|
||||
}
|
||||
|
|
@ -1301,7 +1301,16 @@ export default {
|
|||
box-shadow: 0 2px 6px 0 rgba(68, 170, 119, 0.3);
|
||||
-webkit-transition: width 0.15s linear;
|
||||
transition: width 0.15s linear;
|
||||
background-image: -webkit-linear-gradient(135deg, rgba(255, 255, 255, 0.2) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.2) 50%, rgba(255, 255, 255, 0.2) 75%, transparent 75%, transparent);
|
||||
background-image: -webkit-linear-gradient(
|
||||
135deg,
|
||||
rgba(255, 255, 255, 0.2) 25%,
|
||||
transparent 25%,
|
||||
transparent 50%,
|
||||
rgba(255, 255, 255, 0.2) 50%,
|
||||
rgba(255, 255, 255, 0.2) 75%,
|
||||
transparent 75%,
|
||||
transparent
|
||||
);
|
||||
background-image: linear-gradient(-45deg, rgba(255, 255, 255, 0.2) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.2) 50%, rgba(255, 255, 255, 0.2) 75%, transparent 75%, transparent);
|
||||
background-size: 40px 40px;
|
||||
-webkit-animation: vicp_progress 0.5s linear infinite;
|
||||
|
|
|
|||
|
|
@ -14,6 +14,6 @@ export default function (data, mime) {
|
|||
}
|
||||
// canvas.toDataURL 返回的默认格式就是 image/png
|
||||
return new Blob([ia], {
|
||||
type: mime,
|
||||
type: mime
|
||||
})
|
||||
}
|
||||
|
|
|
|||
|
|
@ -10,7 +10,7 @@ export default function (e, argOpts) {
|
|||
{
|
||||
ele: e.target, // 波纹作用元素
|
||||
type: 'hit', // hit点击位置扩散center中心点扩展
|
||||
bgc: 'rgba(0, 0, 0, 0.15)', // 波纹颜色
|
||||
bgc: 'rgba(0, 0, 0, 0.15)' // 波纹颜色
|
||||
},
|
||||
argOpts
|
||||
)
|
||||
|
|
|
|||
|
|
@ -10,13 +10,13 @@ export default {
|
|||
off: '取消',
|
||||
close: '关闭',
|
||||
back: '上一步',
|
||||
save: '保存',
|
||||
save: '保存'
|
||||
},
|
||||
error: {
|
||||
onlyImg: '仅限图片格式',
|
||||
outOfSize: '单文件大小不能超过 ',
|
||||
lowestPx: '图片最低像素为（宽*高）：',
|
||||
},
|
||||
lowestPx: '图片最低像素为（宽*高）：'
|
||||
}
|
||||
},
|
||||
'zh-tw': {
|
||||
hint: '點擊，或拖動圖片至此處',
|
||||
|
|
@ -29,13 +29,13 @@ export default {
|
|||
off: '取消',
|
||||
close: '關閉',
|
||||
back: '上一步',
|
||||
save: '保存',
|
||||
save: '保存'
|
||||
},
|
||||
error: {
|
||||
onlyImg: '僅限圖片格式',
|
||||
outOfSize: '單文件大小不能超過 ',
|
||||
lowestPx: '圖片最低像素為（寬*高）：',
|
||||
},
|
||||
lowestPx: '圖片最低像素為（寬*高）：'
|
||||
}
|
||||
},
|
||||
en: {
|
||||
hint: 'Click or drag the file here to upload',
|
||||
|
|
@ -48,13 +48,13 @@ export default {
|
|||
off: 'Cancel',
|
||||
close: 'Close',
|
||||
back: 'Back',
|
||||
save: 'Save',
|
||||
save: 'Save'
|
||||
},
|
||||
error: {
|
||||
onlyImg: 'Image only',
|
||||
outOfSize: 'Image exceeds size limit: ',
|
||||
lowestPx: "Image's size is too low. Expected at least: ",
|
||||
},
|
||||
lowestPx: "Image's size is too low. Expected at least: "
|
||||
}
|
||||
},
|
||||
ro: {
|
||||
hint: 'Atinge sau trage fișierul aici',
|
||||
|
|
@ -68,14 +68,14 @@ export default {
|
|||
off: 'Anulează',
|
||||
close: 'Închide',
|
||||
back: 'Înapoi',
|
||||
save: 'Salvează',
|
||||
save: 'Salvează'
|
||||
},
|
||||
|
||||
error: {
|
||||
onlyImg: 'Doar imagini',
|
||||
outOfSize: 'Imaginea depășește limita de: ',
|
||||
loewstPx: 'Imaginea este prea mică; Minim: ',
|
||||
},
|
||||
loewstPx: 'Imaginea este prea mică; Minim: '
|
||||
}
|
||||
},
|
||||
ru: {
|
||||
hint: 'Нажмите, или перетащите файл в это окно',
|
||||
|
|
@ -88,13 +88,13 @@ export default {
|
|||
off: 'Отменить',
|
||||
close: 'Закрыть',
|
||||
back: 'Назад',
|
||||
save: 'Сохранить',
|
||||
save: 'Сохранить'
|
||||
},
|
||||
error: {
|
||||
onlyImg: 'Только изображения',
|
||||
outOfSize: 'Изображение превышает предельный размер: ',
|
||||
lowestPx: 'Минимальный размер изображения: ',
|
||||
},
|
||||
lowestPx: 'Минимальный размер изображения: '
|
||||
}
|
||||
},
|
||||
'pt-br': {
|
||||
hint: 'Clique ou arraste o arquivo aqui para carregar',
|
||||
|
|
@ -107,13 +107,13 @@ export default {
|
|||
off: 'Cancelar',
|
||||
close: 'Fechar',
|
||||
back: 'Voltar',
|
||||
save: 'Salvar',
|
||||
save: 'Salvar'
|
||||
},
|
||||
error: {
|
||||
onlyImg: 'Apenas imagens',
|
||||
outOfSize: 'A imagem excede o limite de tamanho: ',
|
||||
lowestPx: 'O tamanho da imagem é muito pequeno. Tamanho mínimo: ',
|
||||
},
|
||||
lowestPx: 'O tamanho da imagem é muito pequeno. Tamanho mínimo: '
|
||||
}
|
||||
},
|
||||
fr: {
|
||||
hint: 'Cliquez ou glissez le fichier ici.',
|
||||
|
|
@ -126,13 +126,13 @@ export default {
|
|||
off: 'Annuler',
|
||||
close: 'Fermer',
|
||||
back: 'Retour',
|
||||
save: 'Enregistrer',
|
||||
save: 'Enregistrer'
|
||||
},
|
||||
error: {
|
||||
onlyImg: 'Image uniquement',
|
||||
outOfSize: "L'image sélectionnée dépasse la taille maximum: ",
|
||||
lowestPx: "L'image sélectionnée est trop petite. Dimensions attendues: ",
|
||||
},
|
||||
lowestPx: "L'image sélectionnée est trop petite. Dimensions attendues: "
|
||||
}
|
||||
},
|
||||
nl: {
|
||||
hint: 'Klik hier of sleep een afbeelding in dit vlak',
|
||||
|
|
@ -145,13 +145,13 @@ export default {
|
|||
off: 'Annuleren',
|
||||
close: 'Sluiten',
|
||||
back: 'Terug',
|
||||
save: 'Opslaan',
|
||||
save: 'Opslaan'
|
||||
},
|
||||
error: {
|
||||
onlyImg: 'Alleen afbeeldingen',
|
||||
outOfSize: 'De afbeelding is groter dan: ',
|
||||
lowestPx: 'De afbeelding is te klein! Minimale afmetingen: ',
|
||||
},
|
||||
lowestPx: 'De afbeelding is te klein! Minimale afmetingen: '
|
||||
}
|
||||
},
|
||||
tr: {
|
||||
hint: 'Tıkla veya yüklemek istediğini buraya sürükle',
|
||||
|
|
@ -164,13 +164,13 @@ export default {
|
|||
off: 'İptal',
|
||||
close: 'Kapat',
|
||||
back: 'Geri',
|
||||
save: 'Kaydet',
|
||||
save: 'Kaydet'
|
||||
},
|
||||
error: {
|
||||
onlyImg: 'Sadece resim',
|
||||
outOfSize: 'Resim yükleme limitini aşıyor: ',
|
||||
lowestPx: 'Resmin boyutu çok küçük. En az olması gereken: ',
|
||||
},
|
||||
lowestPx: 'Resmin boyutu çok küçük. En az olması gereken: '
|
||||
}
|
||||
},
|
||||
'es-MX': {
|
||||
hint: 'Selecciona o arrastra una imagen',
|
||||
|
|
@ -183,13 +183,13 @@ export default {
|
|||
off: 'Cancelar',
|
||||
close: 'Cerrar',
|
||||
back: 'Atrás',
|
||||
save: 'Guardar',
|
||||
save: 'Guardar'
|
||||
},
|
||||
error: {
|
||||
onlyImg: 'Únicamente imágenes',
|
||||
outOfSize: 'La imagen excede el tamaño maximo:',
|
||||
lowestPx: 'La imagen es demasiado pequeña. Se espera por lo menos:',
|
||||
},
|
||||
lowestPx: 'La imagen es demasiado pequeña. Se espera por lo menos:'
|
||||
}
|
||||
},
|
||||
de: {
|
||||
hint: 'Klick hier oder zieh eine Datei hier rein zum Hochladen',
|
||||
|
|
@ -202,13 +202,13 @@ export default {
|
|||
off: 'Abbrechen',
|
||||
close: 'Schließen',
|
||||
back: 'Zurück',
|
||||
save: 'Speichern',
|
||||
save: 'Speichern'
|
||||
},
|
||||
error: {
|
||||
onlyImg: 'Nur Bilder',
|
||||
outOfSize: 'Das Bild ist zu groß: ',
|
||||
lowestPx: 'Das Bild ist zu klein. Mindestens: ',
|
||||
},
|
||||
lowestPx: 'Das Bild ist zu klein. Mindestens: '
|
||||
}
|
||||
},
|
||||
ja: {
|
||||
hint: 'クリック・ドラッグしてファイルをアップロード',
|
||||
|
|
@ -221,13 +221,13 @@ export default {
|
|||
off: 'キャンセル',
|
||||
close: '閉じる',
|
||||
back: '戻る',
|
||||
save: '保存',
|
||||
save: '保存'
|
||||
},
|
||||
error: {
|
||||
onlyImg: '画像のみ',
|
||||
outOfSize: '画像サイズが上限を超えています。上限: ',
|
||||
lowestPx: '画像が小さすぎます。最小サイズ: ',
|
||||
},
|
||||
lowestPx: '画像が小さすぎます。最小サイズ: '
|
||||
}
|
||||
},
|
||||
ua: {
|
||||
hint: 'Натисніть, або перетягніть файл в це вікно',
|
||||
|
|
@ -240,13 +240,13 @@ export default {
|
|||
off: 'Відмінити',
|
||||
close: 'Закрити',
|
||||
back: 'Назад',
|
||||
save: 'Зберегти',
|
||||
save: 'Зберегти'
|
||||
},
|
||||
error: {
|
||||
onlyImg: 'Тільки зображення',
|
||||
outOfSize: 'Зображення перевищує граничний розмір: ',
|
||||
lowestPx: 'Мінімальний розмір зображення: ',
|
||||
},
|
||||
lowestPx: 'Мінімальний розмір зображення: '
|
||||
}
|
||||
},
|
||||
it: {
|
||||
hint: 'Clicca o trascina qui il file per caricarlo',
|
||||
|
|
@ -259,13 +259,13 @@ export default {
|
|||
off: 'Annulla',
|
||||
close: 'Chiudi',
|
||||
back: 'Indietro',
|
||||
save: 'Salva',
|
||||
save: 'Salva'
|
||||
},
|
||||
error: {
|
||||
onlyImg: 'Sono accettate solo immagini',
|
||||
outOfSize: "L'immagine eccede i limiti di dimensione: ",
|
||||
lowestPx: "L'immagine è troppo piccola. Il requisito minimo è: ",
|
||||
},
|
||||
lowestPx: "L'immagine è troppo piccola. Il requisito minimo è: "
|
||||
}
|
||||
},
|
||||
ar: {
|
||||
hint: 'اضغط أو اسحب الملف هنا للتحميل',
|
||||
|
|
@ -278,13 +278,13 @@ export default {
|
|||
off: 'إلغاء',
|
||||
close: 'إغلاق',
|
||||
back: 'رجوع',
|
||||
save: 'حفظ',
|
||||
save: 'حفظ'
|
||||
},
|
||||
error: {
|
||||
onlyImg: 'صور فقط',
|
||||
outOfSize: 'تتجاوز الصوره الحجم المحدد: ',
|
||||
lowestPx: 'حجم الصورة صغير جدا. من المتوقع على الأقل: ',
|
||||
},
|
||||
lowestPx: 'حجم الصورة صغير جدا. من المتوقع على الأقل: '
|
||||
}
|
||||
},
|
||||
ug: {
|
||||
hint: 'مەزكۇر دائىرىنى چىكىپ رەسىم تاللاڭ ياكى رەسىمنى سۆرەپ ئەكىرىڭ',
|
||||
|
|
@ -297,13 +297,13 @@ export default {
|
|||
off: 'بولدى قىلىش',
|
||||
close: 'تاقاش',
|
||||
back: 'ئالدىنقى قەدەم',
|
||||
save: 'ساقلاش',
|
||||
save: 'ساقلاش'
|
||||
},
|
||||
error: {
|
||||
onlyImg: 'پەقەت رەسىم فورماتىنىلا قوللايدۇ',
|
||||
outOfSize: 'رەسىم چوڭ - كىچىكلىكى چەكتىن ئىشىپ كەتتى',
|
||||
lowestPx: 'رەسىمنىڭ ئەڭ كىچىك ئۆلچىمى :',
|
||||
},
|
||||
lowestPx: 'رەسىمنىڭ ئەڭ كىچىك ئۆلچىمى :'
|
||||
}
|
||||
},
|
||||
th: {
|
||||
hint: 'คลิ๊กหรือลากรูปมาที่นี่',
|
||||
|
|
@ -316,13 +316,13 @@ export default {
|
|||
off: 'ยกเลิก',
|
||||
close: 'ปิด',
|
||||
back: 'กลับ',
|
||||
save: 'บันทึก',
|
||||
save: 'บันทึก'
|
||||
},
|
||||
error: {
|
||||
onlyImg: 'ไฟล์ภาพเท่านั้น',
|
||||
outOfSize: 'ไฟล์ใหญ่เกินกำหนด: ',
|
||||
lowestPx: 'ไฟล์เล็กเกินไป. อย่างน้อยต้องมีขนาด: ',
|
||||
},
|
||||
lowestPx: 'ไฟล์เล็กเกินไป. อย่างน้อยต้องมีขนาด: '
|
||||
}
|
||||
},
|
||||
mm: {
|
||||
hint: 'ဖိုင်ကို ဤနေရာတွင် နှိပ်၍ (သို့) ဆွဲထည့်၍ တင်ပါ',
|
||||
|
|
@ -335,13 +335,13 @@ export default {
|
|||
off: 'မလုပ်တော့ပါ',
|
||||
close: 'ပိတ်မည်',
|
||||
back: 'နောက်သို့',
|
||||
save: 'သိမ်းမည်',
|
||||
save: 'သိမ်းမည်'
|
||||
},
|
||||
error: {
|
||||
onlyImg: 'ဓာတ်ပုံ သီးသန့်သာ',
|
||||
outOfSize: 'ဓာတ်ပုံဆိုဒ် ကြီးလွန်းသည် ။ အများဆုံး ဆိုဒ် : ',
|
||||
lowestPx: 'ဓာတ်ပုံဆိုဒ် သေးလွန်းသည်။ အနည်းဆုံး ဆိုဒ် : ',
|
||||
},
|
||||
lowestPx: 'ဓာတ်ပုံဆိုဒ် သေးလွန်းသည်။ အနည်းဆုံး ဆိုဒ် : '
|
||||
}
|
||||
},
|
||||
se: {
|
||||
hint: 'Klicka eller dra en fil hit för att ladda upp den',
|
||||
|
|
@ -354,12 +354,12 @@ export default {
|
|||
off: 'Avbryt',
|
||||
close: 'Stäng',
|
||||
back: 'Tillbaka',
|
||||
save: 'Spara',
|
||||
save: 'Spara'
|
||||
},
|
||||
error: {
|
||||
onlyImg: 'Endast bilder',
|
||||
outOfSize: 'Bilden är större än max-gränsen: ',
|
||||
lowestPx: 'Bilden är för liten. Minimum är: ',
|
||||
},
|
||||
},
|
||||
lowestPx: 'Bilden är för liten. Minimum är: '
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -3,5 +3,5 @@ export default {
|
|||
png: 'image/png',
|
||||
gif: 'image/gif',
|
||||
svg: 'image/svg+xml',
|
||||
psd: 'image/photoshop',
|
||||
psd: 'image/photoshop'
|
||||
}
|
||||
|
|
|
|||
|
|
@ -6,7 +6,7 @@ export const components: any = {
|
|||
SvgIcon
|
||||
}
|
||||
export default function registerComponent(app: any) {
|
||||
Object.keys(components).forEach((key) => {
|
||||
Object.keys(components).forEach(key => {
|
||||
app.component(key, components[key])
|
||||
})
|
||||
}
|
||||
|
|
|
|||
|
|
@ -12,15 +12,15 @@ export default defineComponent({
|
|||
props: {
|
||||
iconName: {
|
||||
type: String,
|
||||
required: true,
|
||||
},
|
||||
required: true
|
||||
}
|
||||
},
|
||||
setup(props) {
|
||||
const icon = computed(() => `#icon-${props.iconName}`)
|
||||
return {
|
||||
icon,
|
||||
icon
|
||||
}
|
||||
},
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
||||
|
|
|
|||
|
|
@ -10,7 +10,7 @@ const initialState = {
|
|||
}
|
||||
const actions: MicroAppStateActions = initGlobalState(initialState)
|
||||
|
||||
actions.onGlobalStateChange((state) => {
|
||||
actions.onGlobalStateChange(state => {
|
||||
// state: 变更后的状态; prev 变更前的状态
|
||||
// console.log('from:', state.name, 'current:', state, 'pre:', prev)
|
||||
store.commit('SET_ONMESSAGE', state.onmessage)
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@
|
|||
* @Date: 2022-11-10 10:46:38
|
||||
* @LastEditTime: 2023-09-06 15:04:22
|
||||
* @LastEditors: Haijun Zhang
|
||||
* @Description:
|
||||
* @Description:
|
||||
* @FilePath: \cmp-cored:\workspace\micro-web\main-web-qiankun\src\core\config.ts
|
||||
*/
|
||||
import mainRouter from '@/router/index'
|
||||
|
|
@ -23,15 +23,15 @@ export type IAppConfig = {
|
|||
hasPlugin?: boolean
|
||||
activeRule?: string | string[]
|
||||
}
|
||||
function getAppDeployDir(name: string){
|
||||
if(name.includes('-plugin')) return 'plugins';
|
||||
function getAppDeployDir(name: string) {
|
||||
if (name.includes('-plugin')) return 'plugins'
|
||||
return 'sub-app'
|
||||
}
|
||||
export async function getMicroApp() {
|
||||
const { protocol, hostname, port } = location
|
||||
const prefix = `${protocol}//${hostname}`
|
||||
const {
|
||||
data: { deployAddress = prefix, homePath = '/sms-web/resource_dashboard', deployPort = Number(port) || (protocol === 'https:' ? 443 : 80), apps }
|
||||
data: { deployAddress = prefix, homePath = '/sms-web/resource_dashboard', deployPort = Number(port) || (protocol === 'https:' ? 443 : 80), apps }
|
||||
}: {
|
||||
data: IDeployConfig
|
||||
} = await axios.get('/cof-web/app.json')
|
||||
|
|
@ -45,7 +45,7 @@ export async function getMicroApp() {
|
|||
entry,
|
||||
container: '#subapp-viewport',
|
||||
activeRule: (location: any) => {
|
||||
if(hasPlugin && location.pathname.includes('-plugin')) return false
|
||||
if (hasPlugin && location.pathname.includes('-plugin')) return false
|
||||
return location.pathname.startsWith(activeRule)
|
||||
},
|
||||
props: {
|
||||
|
|
@ -53,5 +53,5 @@ export async function getMicroApp() {
|
|||
mainRouter
|
||||
}
|
||||
}
|
||||
});
|
||||
})
|
||||
}
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@
|
|||
* @Date: 2022-11-10 10:46:38
|
||||
* @LastEditTime: 2022-11-17 18:37:12
|
||||
* @LastEditors: Haijun Zhang
|
||||
* @Description:
|
||||
* @Description:
|
||||
* @FilePath: \main-web-qiankun\src\core\register.ts
|
||||
*/
|
||||
import { registerMicroApps, start, addGlobalUncaughtErrorHandler } from 'qiankun'
|
||||
|
|
@ -46,13 +46,13 @@ const startApp = async () => {
|
|||
return Promise.resolve()
|
||||
}
|
||||
]
|
||||
});
|
||||
})
|
||||
// const prefetchList = apps.filter(item => item.name.includes('-web')).map(item => item.name)
|
||||
start({
|
||||
prefetch: 'all',
|
||||
prefetch: 'all'
|
||||
// excludeAssetFilter(assetUrl:string){
|
||||
// 插件的静态资源不被qiankun劫持处理
|
||||
// return assetUrl.includes('/web-common-resource/')
|
||||
// 插件的静态资源不被qiankun劫持处理
|
||||
// return assetUrl.includes('/web-common-resource/')
|
||||
// }
|
||||
})
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,22 +1,22 @@
|
|||
@keyframes swing {
|
||||
20% {
|
||||
transform: rotate3d(0, 0, 1, 15deg);
|
||||
}
|
||||
40% {
|
||||
transform: rotate3d(0, 0, 1, -10deg);
|
||||
}
|
||||
60% {
|
||||
transform: rotate3d(0, 0, 1, 5deg);
|
||||
}
|
||||
80% {
|
||||
transform: rotate3d(0, 0, 1, -5deg);
|
||||
}
|
||||
to {
|
||||
transform: rotate3d(0, 0, 1, 0deg);
|
||||
}
|
||||
20% {
|
||||
transform: rotate3d(0, 0, 1, 15deg);
|
||||
}
|
||||
40% {
|
||||
transform: rotate3d(0, 0, 1, -10deg);
|
||||
}
|
||||
60% {
|
||||
transform: rotate3d(0, 0, 1, 5deg);
|
||||
}
|
||||
80% {
|
||||
transform: rotate3d(0, 0, 1, -5deg);
|
||||
}
|
||||
to {
|
||||
transform: rotate3d(0, 0, 1, 0deg);
|
||||
}
|
||||
}
|
||||
|
||||
.animated {
|
||||
animation-duration: 0.7s;
|
||||
animation-fill-mode: both;
|
||||
}
|
||||
animation-duration: 0.7s;
|
||||
animation-fill-mode: both;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -2,4 +2,4 @@
|
|||
-------------------------- */
|
||||
|
||||
$--color-primary: '#1E54D5';
|
||||
$namesapce: 'czhj';
|
||||
$namesapce: 'czhj';
|
||||
|
|
|
|||
|
|
@ -2,357 +2,355 @@ html,
|
|||
body,
|
||||
.main-app,
|
||||
#master-container {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
font-size: 14px;
|
||||
overflow-y: hidden !important;
|
||||
font-family: Microsoft YaHei, Hiragino Sans GB;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
font-size: 14px;
|
||||
overflow-y: hidden !important;
|
||||
font-family: Microsoft YaHei, Hiragino Sans GB;
|
||||
}
|
||||
|
||||
a {
|
||||
text-decoration: none;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.iconfont {
|
||||
font-size: 13px;
|
||||
font-size: 13px;
|
||||
}
|
||||
|
||||
|
||||
/*边距共有样式*/
|
||||
|
||||
.text-center {
|
||||
text-align: center;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.pull-right {
|
||||
float: right;
|
||||
float: right;
|
||||
}
|
||||
|
||||
.pull-left {
|
||||
float: left;
|
||||
float: left;
|
||||
}
|
||||
|
||||
.p-none {
|
||||
padding: 0 !important;
|
||||
padding: 0 !important;
|
||||
}
|
||||
|
||||
.m-xxs {
|
||||
margin: 2px 4px;
|
||||
margin: 2px 4px;
|
||||
}
|
||||
|
||||
.m-xs {
|
||||
margin: 5px;
|
||||
margin: 5px;
|
||||
}
|
||||
|
||||
.m-sm {
|
||||
margin: 10px;
|
||||
margin: 10px;
|
||||
}
|
||||
|
||||
.m {
|
||||
margin: 15px;
|
||||
margin: 15px;
|
||||
}
|
||||
|
||||
.m-md {
|
||||
margin: 20px;
|
||||
margin: 20px;
|
||||
}
|
||||
|
||||
.m-lg {
|
||||
margin: 30px;
|
||||
margin: 30px;
|
||||
}
|
||||
|
||||
.m-xl {
|
||||
margin: 50px;
|
||||
margin: 50px;
|
||||
}
|
||||
|
||||
.m-n {
|
||||
margin: 0 !important;
|
||||
margin: 0 !important;
|
||||
}
|
||||
|
||||
.m-l-none {
|
||||
margin-left: 0 !important;
|
||||
margin-left: 0 !important;
|
||||
}
|
||||
|
||||
.m-l-xs {
|
||||
margin-left: 5px;
|
||||
margin-left: 5px;
|
||||
}
|
||||
|
||||
.m-l-sm {
|
||||
margin-left: 10px !important;
|
||||
margin-left: 10px !important;
|
||||
}
|
||||
|
||||
.m-l {
|
||||
margin-left: 15px;
|
||||
margin-left: 15px;
|
||||
}
|
||||
|
||||
.m-l-md {
|
||||
margin-left: 20px;
|
||||
margin-left: 20px;
|
||||
}
|
||||
|
||||
.m-l-lg {
|
||||
margin-left: 30px;
|
||||
margin-left: 30px;
|
||||
}
|
||||
|
||||
.m-l-xl {
|
||||
margin-left: 40px;
|
||||
margin-left: 40px;
|
||||
}
|
||||
|
||||
.m-l-xxl {
|
||||
margin-left: 50px;
|
||||
margin-left: 50px;
|
||||
}
|
||||
|
||||
.m-l-n-xxs {
|
||||
margin-left: -1px;
|
||||
margin-left: -1px;
|
||||
}
|
||||
|
||||
.m-l-n-xs {
|
||||
margin-left: -5px;
|
||||
margin-left: -5px;
|
||||
}
|
||||
|
||||
.m-l-n-sm {
|
||||
margin-left: -10px;
|
||||
margin-left: -10px;
|
||||
}
|
||||
|
||||
.m-l-n {
|
||||
margin-left: -15px;
|
||||
margin-left: -15px;
|
||||
}
|
||||
|
||||
.m-l-n-md {
|
||||
margin-left: -20px;
|
||||
margin-left: -20px;
|
||||
}
|
||||
|
||||
.m-l-n-lg {
|
||||
margin-left: -30px;
|
||||
margin-left: -30px;
|
||||
}
|
||||
|
||||
.m-l-n-xl {
|
||||
margin-left: -40px;
|
||||
margin-left: -40px;
|
||||
}
|
||||
|
||||
.m-l-n-xxl {
|
||||
margin-left: -50px;
|
||||
margin-left: -50px;
|
||||
}
|
||||
|
||||
.m-t-none {
|
||||
margin-top: 0 !important;
|
||||
margin-top: 0 !important;
|
||||
}
|
||||
|
||||
.m-t-xxs {
|
||||
margin-top: 1px;
|
||||
margin-top: 1px;
|
||||
}
|
||||
|
||||
.m-t-xs {
|
||||
margin-top: 5px !important;
|
||||
margin-top: 5px !important;
|
||||
}
|
||||
|
||||
.m-t-sm {
|
||||
margin-top: 10px !important;
|
||||
margin-top: 10px !important;
|
||||
}
|
||||
|
||||
.m-t {
|
||||
margin-top: 15px;
|
||||
margin-top: 15px;
|
||||
}
|
||||
|
||||
.m-t-md {
|
||||
margin-top: 20px;
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
.m-t-lg {
|
||||
margin-top: 30px;
|
||||
margin-top: 30px;
|
||||
}
|
||||
|
||||
.m-t-xl {
|
||||
margin-top: 40px;
|
||||
margin-top: 40px;
|
||||
}
|
||||
|
||||
.m-t-xxl {
|
||||
margin-top: 50px;
|
||||
margin-top: 50px;
|
||||
}
|
||||
|
||||
.m-t-n-xxs {
|
||||
margin-top: -1px;
|
||||
margin-top: -1px;
|
||||
}
|
||||
|
||||
.m-t-n-xs {
|
||||
margin-top: -5px;
|
||||
margin-top: -5px;
|
||||
}
|
||||
|
||||
.m-t-n-7 {
|
||||
margin-top: -7px;
|
||||
margin-top: -7px;
|
||||
}
|
||||
|
||||
.m-t-n-sm {
|
||||
margin-top: -10px;
|
||||
margin-top: -10px;
|
||||
}
|
||||
|
||||
.m-t-n {
|
||||
margin-top: -15px;
|
||||
margin-top: -15px;
|
||||
}
|
||||
|
||||
.m-t-n-md {
|
||||
margin-top: -20px;
|
||||
margin-top: -20px;
|
||||
}
|
||||
|
||||
.m-t-n-lg {
|
||||
margin-top: -30px;
|
||||
margin-top: -30px;
|
||||
}
|
||||
|
||||
.m-t-n-xl {
|
||||
margin-top: -40px;
|
||||
margin-top: -40px;
|
||||
}
|
||||
|
||||
.m-t-n-xxl {
|
||||
margin-top: -50px;
|
||||
margin-top: -50px;
|
||||
}
|
||||
|
||||
.m-t-n-xxxl {
|
||||
margin-top: -60px;
|
||||
margin-top: -60px;
|
||||
}
|
||||
|
||||
.m-r-none {
|
||||
margin-right: 0 !important;
|
||||
margin-right: 0 !important;
|
||||
}
|
||||
|
||||
.m-r-xxs {
|
||||
margin-right: 1px;
|
||||
margin-right: 1px;
|
||||
}
|
||||
|
||||
.m-r-xs {
|
||||
margin-right: 5px;
|
||||
margin-right: 5px;
|
||||
}
|
||||
|
||||
.m-r-sm {
|
||||
margin-right: 10px !important;
|
||||
margin-right: 10px !important;
|
||||
}
|
||||
|
||||
.m-r {
|
||||
margin-right: 15px !important;
|
||||
margin-right: 15px !important;
|
||||
}
|
||||
|
||||
.m-r-md {
|
||||
margin-right: 20px;
|
||||
margin-right: 20px;
|
||||
}
|
||||
|
||||
.m-r-lg {
|
||||
margin-right: 30px;
|
||||
margin-right: 30px;
|
||||
}
|
||||
|
||||
.m-r-xl {
|
||||
margin-right: 40px;
|
||||
margin-right: 40px;
|
||||
}
|
||||
|
||||
.m-r-xxl {
|
||||
margin-right: 50px;
|
||||
margin-right: 50px;
|
||||
}
|
||||
|
||||
.m-r-n-xxs {
|
||||
margin-right: -1px;
|
||||
margin-right: -1px;
|
||||
}
|
||||
|
||||
.m-r-n-xs {
|
||||
margin-right: -5px;
|
||||
margin-right: -5px;
|
||||
}
|
||||
|
||||
.m-r-n-sm {
|
||||
margin-right: -10px;
|
||||
margin-right: -10px;
|
||||
}
|
||||
|
||||
.m-r-n {
|
||||
margin-right: -15px;
|
||||
margin-right: -15px;
|
||||
}
|
||||
|
||||
.m-r-n-md {
|
||||
margin-right: -20px;
|
||||
margin-right: -20px;
|
||||
}
|
||||
|
||||
.m-r-n-lg {
|
||||
margin-right: -30px;
|
||||
margin-right: -30px;
|
||||
}
|
||||
|
||||
.m-r-n-xl {
|
||||
margin-right: -40px;
|
||||
margin-right: -40px;
|
||||
}
|
||||
|
||||
.m-r-n-xxl {
|
||||
margin-right: -50px;
|
||||
margin-right: -50px;
|
||||
}
|
||||
|
||||
.m-b-none {
|
||||
margin-bottom: 0 !important;
|
||||
margin-bottom: 0 !important;
|
||||
}
|
||||
|
||||
.m-b-xxs {
|
||||
margin-bottom: 1px;
|
||||
margin-bottom: 1px;
|
||||
}
|
||||
|
||||
.m-b-xs {
|
||||
margin-bottom: 5px;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
|
||||
.m-b-sm {
|
||||
margin-bottom: 10px !important;
|
||||
margin-bottom: 10px !important;
|
||||
}
|
||||
|
||||
.m-b {
|
||||
margin-bottom: 15px !important;
|
||||
margin-bottom: 15px !important;
|
||||
}
|
||||
|
||||
.m-b-md {
|
||||
margin-bottom: 20px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.m-b-lg {
|
||||
margin-bottom: 30px;
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
|
||||
.m-b-xl {
|
||||
margin-bottom: 40px;
|
||||
margin-bottom: 40px;
|
||||
}
|
||||
|
||||
.m-b-xxl {
|
||||
margin-bottom: 50px;
|
||||
margin-bottom: 50px;
|
||||
}
|
||||
|
||||
.m-b-n-xxs {
|
||||
margin-bottom: -1px;
|
||||
margin-bottom: -1px;
|
||||
}
|
||||
|
||||
.m-b-n-xs {
|
||||
margin-bottom: -5px;
|
||||
margin-bottom: -5px;
|
||||
}
|
||||
|
||||
.m-b-n-sm {
|
||||
margin-bottom: -10px;
|
||||
margin-bottom: -10px;
|
||||
}
|
||||
|
||||
.m-b-n {
|
||||
margin-bottom: -15px;
|
||||
margin-bottom: -15px;
|
||||
}
|
||||
|
||||
.m-b-n-md {
|
||||
margin-bottom: -20px;
|
||||
margin-bottom: -20px;
|
||||
}
|
||||
|
||||
.m-b-n-lg {
|
||||
margin-bottom: -30px;
|
||||
margin-bottom: -30px;
|
||||
}
|
||||
|
||||
.m-b-n-xl {
|
||||
margin-bottom: -40px;
|
||||
margin-bottom: -40px;
|
||||
}
|
||||
|
||||
.m-b-n-xxl {
|
||||
margin-bottom: -50px;
|
||||
margin-bottom: -50px;
|
||||
}
|
||||
|
||||
|
||||
/*颜色共有样式*/
|
||||
|
||||
.btn-info {
|
||||
color: #ffffff !important;
|
||||
background-color: #497edf;
|
||||
border-color: #497edf;
|
||||
color: #ffffff !important;
|
||||
background-color: #497edf;
|
||||
border-color: #497edf;
|
||||
}
|
||||
|
||||
.btn-info:hover,
|
||||
|
|
@ -360,15 +358,15 @@ a {
|
|||
.btn-info:active,
|
||||
.btn-info.active,
|
||||
.open .dropdown-toggle.btn-info {
|
||||
color: #ffffff !important;
|
||||
background-color: #2059c1;
|
||||
border-color: #2059c1;
|
||||
color: #ffffff !important;
|
||||
background-color: #2059c1;
|
||||
border-color: #2059c1;
|
||||
}
|
||||
|
||||
.btn-success {
|
||||
color: #ffffff !important;
|
||||
background-color: #27c24c;
|
||||
border-color: #27c24c;
|
||||
color: #ffffff !important;
|
||||
background-color: #27c24c;
|
||||
border-color: #27c24c;
|
||||
}
|
||||
|
||||
.btn-success:hover,
|
||||
|
|
@ -376,15 +374,15 @@ a {
|
|||
.btn-success:active,
|
||||
.btn-success.active,
|
||||
.open .dropdown-toggle.btn-success {
|
||||
color: #ffffff !important;
|
||||
background-color: #23ad44;
|
||||
border-color: #20a03f;
|
||||
color: #ffffff !important;
|
||||
background-color: #23ad44;
|
||||
border-color: #20a03f;
|
||||
}
|
||||
|
||||
.btn-danger {
|
||||
color: #ffffff !important;
|
||||
background-color: #f05050;
|
||||
border-color: #f05050;
|
||||
color: #ffffff !important;
|
||||
background-color: #f05050;
|
||||
border-color: #f05050;
|
||||
}
|
||||
|
||||
.btn-danger:hover,
|
||||
|
|
@ -392,119 +390,118 @@ a {
|
|||
.btn-danger:active,
|
||||
.btn-danger.active,
|
||||
.open .dropdown-toggle.btn-danger {
|
||||
color: #ffffff !important;
|
||||
background-color: #ee3939;
|
||||
border-color: #ed2a2a;
|
||||
color: #ffffff !important;
|
||||
background-color: #ee3939;
|
||||
border-color: #ed2a2a;
|
||||
}
|
||||
|
||||
.text-info {
|
||||
color: #00aeef !important;
|
||||
color: #00aeef !important;
|
||||
}
|
||||
|
||||
.text-success {
|
||||
color: #27c24c !important;
|
||||
color: #27c24c !important;
|
||||
}
|
||||
|
||||
.text-warning {
|
||||
color: #fad733 !important;
|
||||
color: #fad733 !important;
|
||||
}
|
||||
|
||||
.text-danger {
|
||||
color: #f05050;
|
||||
color: #f05050;
|
||||
}
|
||||
|
||||
.text-white {
|
||||
color: #FFF !important;
|
||||
color: #fff !important;
|
||||
}
|
||||
|
||||
.text-left {
|
||||
text-align: left !important;
|
||||
text-align: left !important;
|
||||
}
|
||||
|
||||
.text-center {
|
||||
text-align: center !important;
|
||||
text-align: center !important;
|
||||
}
|
||||
|
||||
.text-right {
|
||||
text-align: right !important;
|
||||
text-align: right !important;
|
||||
}
|
||||
|
||||
|
||||
/*宽度样式*/
|
||||
|
||||
.w-xxs {
|
||||
width: 60px;
|
||||
width: 60px;
|
||||
}
|
||||
|
||||
.w-xs {
|
||||
width: 90px;
|
||||
width: 90px;
|
||||
}
|
||||
|
||||
.w-110 {
|
||||
width: 110px;
|
||||
width: 110px;
|
||||
}
|
||||
|
||||
.w-ss {
|
||||
width: 120px;
|
||||
width: 120px;
|
||||
}
|
||||
|
||||
.w-sm {
|
||||
width: 150px;
|
||||
width: 150px;
|
||||
}
|
||||
|
||||
.w {
|
||||
width: 200px;
|
||||
width: 200px;
|
||||
}
|
||||
|
||||
.w-md {
|
||||
width: 240px;
|
||||
width: 240px;
|
||||
}
|
||||
|
||||
.w-lg {
|
||||
width: 280px !important;
|
||||
width: 280px !important;
|
||||
}
|
||||
|
||||
.w-xl {
|
||||
width: 320px;
|
||||
width: 320px;
|
||||
}
|
||||
|
||||
.w-xxl {
|
||||
width: 360px;
|
||||
width: 360px;
|
||||
}
|
||||
|
||||
.w-full {
|
||||
width: 100% !important;
|
||||
width: 100% !important;
|
||||
}
|
||||
|
||||
.w-auto {
|
||||
width: auto;
|
||||
width: auto;
|
||||
}
|
||||
|
||||
.upload-file-btn {
|
||||
position: relative;
|
||||
cursor: pointer;
|
||||
position: relative;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.upload-file-btn input[type=file] {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
font-size: 300px;
|
||||
opacity: 0;
|
||||
filter: alpha(opacity=0);
|
||||
cursor: pointer;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
top: 0;
|
||||
position: absolute;
|
||||
padding: 0px;
|
||||
margin: 0px;
|
||||
overflow: hidden;
|
||||
.upload-file-btn input[type='file'] {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
font-size: 300px;
|
||||
opacity: 0;
|
||||
filter: alpha(opacity=0);
|
||||
cursor: pointer;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
top: 0;
|
||||
position: absolute;
|
||||
padding: 0px;
|
||||
margin: 0px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.custom-dropdown-popper {
|
||||
margin-top: 5px !important;
|
||||
.czhj-popper__arrow {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
margin-top: 5px !important;
|
||||
.czhj-popper__arrow {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,31 +1,31 @@
|
|||
.#{$namespace}-dialog {
|
||||
.#{$namespace}-dialog--middle {
|
||||
width: 60%;
|
||||
.#{$namespace}-dialog--middle {
|
||||
width: 60%;
|
||||
}
|
||||
.#{$namespace}-dialog__header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 14px 20px;
|
||||
margin-right: 0;
|
||||
font-weight: bold;
|
||||
border-bottom: 1px solid #e0e0e0;
|
||||
.#{$namespace}-dialog__title {
|
||||
flex: 1;
|
||||
color: #010033;
|
||||
font-size: 14px;
|
||||
}
|
||||
.#{$namespace}-dialog__header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 14px 20px;
|
||||
margin-right: 0;
|
||||
font-weight: bold;
|
||||
border-bottom: 1px solid #E0E0E0;
|
||||
.#{$namespace}-dialog__title {
|
||||
flex: 1;
|
||||
color: #010033;
|
||||
font-size: 14px;
|
||||
}
|
||||
.#{$namespace}-dialog__headerbtn {
|
||||
position: static;
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
.#{$namespace}-dialog__close {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
.#{$namespace}-dialog__headerbtn {
|
||||
position: static;
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
.#{$namespace}-dialog__close {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
.#{$namespace}-dialog__footer {
|
||||
padding: 14px 20px;
|
||||
text-align: right;
|
||||
border-top: 1px solid #E0E0E0;
|
||||
}
|
||||
}
|
||||
}
|
||||
.#{$namespace}-dialog__footer {
|
||||
padding: 14px 20px;
|
||||
text-align: right;
|
||||
border-top: 1px solid #e0e0e0;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,3 +1,17 @@
|
|||
$--color-primary: #1E54D5;
|
||||
@forward 'element-plus/theme-chalk/src/mixins/config.scss'with ($namespace: 'czhj');
|
||||
@forward 'element-plus/theme-chalk/src/common/var.scss'with ( $colors: ('primary': ('base': $--color-primary), ), $menu: ('base-level-padding': 12px, 'level-padding': 12px, 'item-height': 50px, 'sub-item-height': 48px));
|
||||
$--color-primary: #1e54d5;
|
||||
@forward 'element-plus/theme-chalk/src/mixins/config.scss' with (
|
||||
$namespace: 'czhj'
|
||||
);
|
||||
@forward 'element-plus/theme-chalk/src/common/var.scss' with (
|
||||
$colors: (
|
||||
'primary': (
|
||||
'base': $--color-primary
|
||||
)
|
||||
),
|
||||
$menu: (
|
||||
'base-level-padding': 12px,
|
||||
'level-padding': 12px,
|
||||
'item-height': 50px,
|
||||
'sub-item-height': 48px
|
||||
)
|
||||
);
|
||||
|
|
|
|||
|
|
@ -1,23 +1,23 @@
|
|||
$font-size: 16px;
|
||||
$small-font-size: 14px;
|
||||
.font-big {
|
||||
font-size: $font-size;
|
||||
.el-menu-item,
|
||||
.el-submenu__title,
|
||||
ul.header-menu li,
|
||||
.el-tabs__item {
|
||||
font-size: $font-size;
|
||||
.el-menu-item,
|
||||
.el-submenu__title,
|
||||
ul.header-menu li,
|
||||
.el-tabs__item {
|
||||
font-size: $font-size;
|
||||
.iconfont {
|
||||
font-size: $font-size;
|
||||
}
|
||||
.iconfont {
|
||||
font-size: $font-size;
|
||||
}
|
||||
.el-table--mini,
|
||||
.el-table--small,
|
||||
.el-table__expand-icon,
|
||||
.app-levelbar,
|
||||
.el-button--small,
|
||||
.el-dropdown-link,
|
||||
.common-detail .detail-body .basic-info .attr {
|
||||
font-size: $font-size;
|
||||
}
|
||||
}
|
||||
}
|
||||
.el-table--mini,
|
||||
.el-table--small,
|
||||
.el-table__expand-icon,
|
||||
.app-levelbar,
|
||||
.el-button--small,
|
||||
.el-dropdown-link,
|
||||
.common-detail .detail-body .basic-info .attr {
|
||||
font-size: $font-size;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,10 +1,9 @@
|
|||
@media screen and (-ms-high-contrast:active),
|
||||
(-ms-high-contrast:none) {
|
||||
.el-table__header,
|
||||
.el-table__body {
|
||||
width: 100% !important;
|
||||
}
|
||||
/* .basic-form-item{
|
||||
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
|
||||
.el-table__header,
|
||||
.el-table__body {
|
||||
width: 100% !important;
|
||||
}
|
||||
/* .basic-form-item{
|
||||
height: 32.76px;
|
||||
} */
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -2,4 +2,4 @@
|
|||
@import './hack.scss';
|
||||
@import './font.scss';
|
||||
@import './element-plus.scss';
|
||||
@import './animate.scss';
|
||||
@import './animate.scss';
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@
|
|||
* @Date: 2022-11-07 14:14:46
|
||||
* @LastEditTime: 2022-11-07 15:09:21
|
||||
* @LastEditors: Haijun Zhang
|
||||
* @Description:
|
||||
* @Description:
|
||||
* @FilePath: \main-web\src\hooks\useRouteItem.ts
|
||||
*/
|
||||
import { unref } from 'vue'
|
||||
|
|
@ -12,17 +12,17 @@ import { useRoute } from 'vue-router'
|
|||
import { pathToRegexp } from 'path-to-regexp'
|
||||
|
||||
export default function () {
|
||||
const store = useStore();
|
||||
const store = useStore()
|
||||
const route = useRoute()
|
||||
const routeMap = computed(() => store.state.permission.routeMap)
|
||||
const routeItem = computed(() => {
|
||||
// 找到直接返回，找不到正则匹配
|
||||
const item = unref(routeMap)[route.path]
|
||||
if(item) return item;
|
||||
for(const path in unref(routeMap)){
|
||||
if (item) return item
|
||||
for (const path in unref(routeMap)) {
|
||||
const reg = pathToRegexp(path)
|
||||
if(reg.exec(route.path)){
|
||||
return unref(routeMap)[path]
|
||||
if (reg.exec(route.path)) {
|
||||
return unref(routeMap)[path]
|
||||
}
|
||||
}
|
||||
})
|
||||
|
|
|
|||
|
|
@ -2,10 +2,10 @@ import { ref } from '@vue/composition-api'
|
|||
export default function () {
|
||||
const selectionIds = ref([])
|
||||
function handleSelectionChange(selections) {
|
||||
selectionIds.value = selections.map((item) => item.id)
|
||||
selectionIds.value = selections.map(item => item.id)
|
||||
}
|
||||
return {
|
||||
selectionIds,
|
||||
handleSelectionChange,
|
||||
handleSelectionChange
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
import { ref, toRefs, reactive } from 'vue'
|
||||
import { handleSearchParam } from 'cmp-element/utils'
|
||||
import { ElMessage, ElMessageBox} from 'element-plus'
|
||||
import { ElMessage, ElMessageBox } from 'element-plus'
|
||||
|
||||
interface IRemoveService {
|
||||
(id: number): Promise<Base.IResponseData>
|
||||
|
|
@ -26,7 +26,7 @@ export function useDelete(removeService: IRemoveService, getData: { (): void },
|
|||
function handleDelete(record: any) {
|
||||
ElMessageBox.confirm(`您确定要删除【${record[deleteTipKey]}】吗?`, '提示', {
|
||||
confirmButtonClass: 'el-button--danger',
|
||||
type: 'warning',
|
||||
type: 'warning'
|
||||
})
|
||||
.then(async () => {
|
||||
const res = await removeService(record.id)
|
||||
|
|
@ -40,7 +40,7 @@ export function useDelete(removeService: IRemoveService, getData: { (): void },
|
|||
})
|
||||
}
|
||||
return {
|
||||
handleDelete,
|
||||
handleDelete
|
||||
}
|
||||
}
|
||||
export default function <T = any>(configs: IConfigs) {
|
||||
|
|
@ -52,8 +52,8 @@ export default function <T = any>(configs: IConfigs) {
|
|||
params: {
|
||||
page: 1,
|
||||
rows,
|
||||
...params,
|
||||
},
|
||||
...params
|
||||
}
|
||||
})
|
||||
if (initParams) {
|
||||
state.params.params = handleSearchParam(initParams)
|
||||
|
|
@ -81,6 +81,6 @@ export default function <T = any>(configs: IConfigs) {
|
|||
loading,
|
||||
...toRefs(state),
|
||||
getList,
|
||||
handleDelete,
|
||||
handleDelete
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -2,6 +2,6 @@
|
|||
export default {
|
||||
render: function (h) {
|
||||
return h()
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -27,7 +27,7 @@ const style = computed(() => {
|
|||
})
|
||||
const homePath = computed(() => `${store.getters.appConfigs.homePath}`)
|
||||
const router = useRouter()
|
||||
function goHome () {
|
||||
function goHome() {
|
||||
router.push(`${homePath.value}?date=${new Date().getTime()}`)
|
||||
}
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -1,13 +1,7 @@
|
|||
<template>
|
||||
<ul class="header-menu">
|
||||
<template v-for="item in menuData">
|
||||
<li
|
||||
@click="selectMenu(item, 1)"
|
||||
:key="item.id"
|
||||
:class="{ selected: item.selected }"
|
||||
:style="getStyle(item)"
|
||||
v-if="!item.hidden"
|
||||
>
|
||||
<li @click="selectMenu(item, 1)" :key="item.id" :class="{ selected: item.selected }" :style="getStyle(item)" v-if="!item.hidden">
|
||||
<svg-icon class="icon animated" :icon-name="item.meta.icon"></svg-icon>
|
||||
<span>{{ item.meta.title }}</span>
|
||||
</li>
|
||||
|
|
@ -15,47 +9,47 @@
|
|||
</ul>
|
||||
</template>
|
||||
<script>
|
||||
import useRouteItem from "@/hooks/useRouteItem";
|
||||
import { useStore } from "vuex";
|
||||
import { useRoute, useRouter } from "vue-router";
|
||||
import useRouteItem from '@/hooks/useRouteItem'
|
||||
import { useStore } from 'vuex'
|
||||
import { useRoute, useRouter } from 'vue-router'
|
||||
export default {
|
||||
props: {
|
||||
pageConfigs: Object
|
||||
},
|
||||
setup(props) {
|
||||
const store = useStore();
|
||||
const route = useRoute();
|
||||
const router = useRouter();
|
||||
const firstPath = computed(() => `/${route.path.split("/")[1]}`);
|
||||
const menuData = computed(() => store.state.permission.addRoutes);
|
||||
const { routeItem } = useRouteItem();
|
||||
const store = useStore()
|
||||
const route = useRoute()
|
||||
const router = useRouter()
|
||||
const firstPath = computed(() => `/${route.path.split('/')[1]}`)
|
||||
const menuData = computed(() => store.state.permission.addRoutes)
|
||||
const { routeItem } = useRouteItem()
|
||||
const hiddenSide = computed(() => {
|
||||
return !routeItem.value || routeItem.value.meta.hiddenSide;
|
||||
});
|
||||
return !routeItem.value || routeItem.value.meta.hiddenSide
|
||||
})
|
||||
function getStyle(item) {
|
||||
if (item.selected) {
|
||||
return {
|
||||
backgroundColor: props.pageConfigs.headerSelectColour,
|
||||
color: props.pageConfigs.headerFontSelectColour
|
||||
};
|
||||
}
|
||||
}
|
||||
}
|
||||
function getJumpRoute(data) {
|
||||
const route = data[0];
|
||||
const route = data[0]
|
||||
if (route.children && route.children.length) {
|
||||
return getJumpRoute(route.children);
|
||||
return getJumpRoute(route.children)
|
||||
}
|
||||
return route.path;
|
||||
return route.path
|
||||
}
|
||||
// 重置菜单数据 flag:是否重置菜单书局
|
||||
function resetMenu(flag) {
|
||||
unref(menuData).forEach((row) => {
|
||||
row.selected = false;
|
||||
unref(menuData).forEach(row => {
|
||||
row.selected = false
|
||||
// this.$set(row, 'selected', false)
|
||||
});
|
||||
})
|
||||
if (flag) {
|
||||
store.commit("SETTING_SIDE_MENU", []);
|
||||
store.commit("SETTING_BASE_PATH", "/");
|
||||
store.commit('SETTING_SIDE_MENU', [])
|
||||
store.commit('SETTING_BASE_PATH', '/')
|
||||
}
|
||||
}
|
||||
function selectMenu(item, flag) {
|
||||
|
|
@ -63,65 +57,62 @@ export default {
|
|||
window.open(item.meta.path)
|
||||
return
|
||||
}
|
||||
if (item.selected) return;
|
||||
resetMenu();
|
||||
const menu = menuData.value.find((cell) => cell.id === item.id);
|
||||
menu.selected = true;
|
||||
if (item.selected) return
|
||||
resetMenu()
|
||||
const menu = menuData.value.find(cell => cell.id === item.id)
|
||||
menu.selected = true
|
||||
// 处理一级菜单没有子菜单的情况
|
||||
const menus = menu.children.filter((item) => !item.hidden);
|
||||
const menus = menu.children.filter(item => !item.hidden)
|
||||
if (menus.length) {
|
||||
store.commit("SETTING_SIDE_MENU", menu.children);
|
||||
store.commit("SETTING_BASE_PATH", menu.path);
|
||||
store.commit('SETTING_SIDE_MENU', menu.children)
|
||||
store.commit('SETTING_BASE_PATH', menu.path)
|
||||
} else {
|
||||
resetMenu(true);
|
||||
resetMenu(true)
|
||||
}
|
||||
// 点击一级菜单时跳转界面，刷新界面是保持不动
|
||||
if (flag) {
|
||||
router.push({ path: getJumpRoute(menu.children) });
|
||||
router.push({ path: getJumpRoute(menu.children) })
|
||||
}
|
||||
}
|
||||
function initMenu() {
|
||||
// 没有任何菜单信息或者当前路由为隐藏侧边栏直接return
|
||||
if (!menuData.value || menuData.value.length === 1 || hiddenSide.value)
|
||||
return;
|
||||
const selectedMenu = unref(menuData).find(
|
||||
(item) => item.path === firstPath.value
|
||||
);
|
||||
if (!menuData.value || menuData.value.length === 1 || hiddenSide.value) return
|
||||
const selectedMenu = unref(menuData).find(item => item.path === firstPath.value)
|
||||
if (selectedMenu) {
|
||||
selectMenu(selectedMenu, route.name === "Home");
|
||||
selectMenu(selectedMenu, route.name === 'Home')
|
||||
} else {
|
||||
resetMenu(1);
|
||||
resetMenu(1)
|
||||
}
|
||||
}
|
||||
watch(firstPath, () => {
|
||||
// 左侧菜单刷新不用重置菜单数据
|
||||
if (route.name !== "Redirect") initMenu("firstPath");
|
||||
});
|
||||
if (route.name !== 'Redirect') initMenu('firstPath')
|
||||
})
|
||||
watch(
|
||||
menuData,
|
||||
() => {
|
||||
initMenu("menuData");
|
||||
initMenu('menuData')
|
||||
},
|
||||
{
|
||||
immediate: true
|
||||
}
|
||||
);
|
||||
watch(hiddenSide, (cur) => {
|
||||
)
|
||||
watch(hiddenSide, cur => {
|
||||
if (cur) {
|
||||
resetMenu(1);
|
||||
resetMenu(1)
|
||||
} else {
|
||||
initMenu();
|
||||
initMenu()
|
||||
}
|
||||
});
|
||||
})
|
||||
return {
|
||||
firstPath,
|
||||
menuData,
|
||||
hiddenSide,
|
||||
getStyle,
|
||||
selectMenu
|
||||
};
|
||||
}
|
||||
}
|
||||
};
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
ul.header-menu {
|
||||
|
|
|
|||
|
|
@ -12,16 +12,10 @@
|
|||
</el-dropdown-menu>
|
||||
</template>
|
||||
</el-dropdown>
|
||||
<el-dialog
|
||||
v-model="visible"
|
||||
width="900px"
|
||||
custom-class="guid-modal"
|
||||
>
|
||||
<el-dialog v-model="visible" width="900px" custom-class="guid-modal">
|
||||
<div class="guid-wrapper">
|
||||
<div class="guid-title">新手指引</div>
|
||||
<div class="guid-desc">
|
||||
当前还没有资源接入，可按照下方新手指引完成接入和系统配置，此页面关闭后可在新手指引中查找
|
||||
</div>
|
||||
<div class="guid-desc">当前还没有资源接入，可按照下方新手指引完成接入和系统配置，此页面关闭后可在新手指引中查找</div>
|
||||
<div class="guid-content">
|
||||
<div class="guid-cell">
|
||||
<div class="system-title">管理端</div>
|
||||
|
|
@ -38,10 +32,7 @@
|
|||
<div class="guid-flow-item-number">{{ 5 - key }}</div>
|
||||
<span>{{ item }}</span>
|
||||
</div>
|
||||
<div
|
||||
class="guid-flow-line left"
|
||||
v-if="key !== list2.length - 1"
|
||||
></div>
|
||||
<div class="guid-flow-line left" v-if="key !== list2.length - 1"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="special-line">
|
||||
|
|
@ -62,12 +53,7 @@
|
|||
</div>
|
||||
</div>
|
||||
<div class="guid-module">
|
||||
<div
|
||||
class="guid-module-cell"
|
||||
v-for="(item, index) in moduleList"
|
||||
:key="index"
|
||||
@click="goPage(item.path)"
|
||||
>
|
||||
<div class="guid-module-cell" v-for="(item, index) in moduleList" :key="index" @click="goPage(item.path)">
|
||||
<svg-icon :icon-name="item.icon" class="icon"></svg-icon>
|
||||
<span class="name">{{ item.name }}</span>
|
||||
<el-icon><IconEpArrowRightBold /></el-icon>
|
||||
|
|
@ -77,51 +63,51 @@
|
|||
</el-dialog>
|
||||
</template>
|
||||
<script lang="ts">
|
||||
import { ref, defineComponent } from "vue";
|
||||
import { useRouter } from "vue-router";
|
||||
import { useStore } from "vuex";
|
||||
import { handleSearchParam } from "utils/index";
|
||||
import { getTrack } from "services/manager";
|
||||
import { ref, defineComponent } from 'vue'
|
||||
import { useRouter } from 'vue-router'
|
||||
import { useStore } from 'vuex'
|
||||
import { handleSearchParam } from 'utils/index'
|
||||
import { getTrack } from 'services/manager'
|
||||
export default defineComponent({
|
||||
setup() {
|
||||
const visible = ref(false);
|
||||
const store = useStore();
|
||||
(async function () {
|
||||
const visible = ref(false)
|
||||
const store = useStore()
|
||||
;(async function () {
|
||||
const res = await getTrack({
|
||||
simple: true,
|
||||
params: handleSearchParam({
|
||||
account: store.getters.userData.account
|
||||
})
|
||||
});
|
||||
})
|
||||
if (res.data?.total === 1) {
|
||||
visible.value = true;
|
||||
visible.value = true
|
||||
}
|
||||
})();
|
||||
})()
|
||||
|
||||
const router = useRouter();
|
||||
const router = useRouter()
|
||||
function goPage(path: string) {
|
||||
visible.value = false;
|
||||
router.push(path);
|
||||
visible.value = false
|
||||
router.push(path)
|
||||
}
|
||||
return {
|
||||
list: ["资源接入", "资源池", "服务发布"],
|
||||
list2: ["创建租户", "资源配置"],
|
||||
list: ['资源接入', '资源池', '服务发布'],
|
||||
list2: ['创建租户', '资源配置'],
|
||||
visible,
|
||||
moduleList: [
|
||||
{
|
||||
icon: "svg-resource-manage",
|
||||
name: "资源纳管",
|
||||
path: "/cmp-web/base_resource/vendors"
|
||||
icon: 'svg-resource-manage',
|
||||
name: '资源纳管',
|
||||
path: '/cmp-web/base_resource/vendors'
|
||||
},
|
||||
{
|
||||
icon: "svg-service-ops",
|
||||
name: "服务运营",
|
||||
path: "/cos-web/products/service_manage"
|
||||
icon: 'svg-service-ops',
|
||||
name: '服务运营',
|
||||
path: '/cos-web/products/service_manage'
|
||||
},
|
||||
{
|
||||
icon: "svg-resource-monitor",
|
||||
name: "资源监控",
|
||||
path: "/cms-web/dashboard"
|
||||
icon: 'svg-resource-monitor',
|
||||
name: '资源监控',
|
||||
path: '/cms-web/dashboard'
|
||||
}
|
||||
// {
|
||||
// icon: "svg-ops-analysis",
|
||||
|
|
@ -130,9 +116,9 @@ export default defineComponent({
|
|||
// }
|
||||
],
|
||||
goPage
|
||||
};
|
||||
}
|
||||
}
|
||||
});
|
||||
})
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.help-wrapper {
|
||||
|
|
@ -223,7 +209,7 @@ export default defineComponent({
|
|||
position: absolute;
|
||||
right: -10px;
|
||||
top: -5px;
|
||||
content: "";
|
||||
content: '';
|
||||
opacity: 1;
|
||||
border: 6px solid transparent;
|
||||
border-left-color: #1e54d5;
|
||||
|
|
@ -274,7 +260,7 @@ export default defineComponent({
|
|||
position: absolute;
|
||||
left: -135px;
|
||||
bottom: 0;
|
||||
content: "一站式申请资源";
|
||||
content: '一站式申请资源';
|
||||
width: 800px;
|
||||
height: 800px;
|
||||
border-radius: 330px;
|
||||
|
|
@ -345,14 +331,14 @@ export default defineComponent({
|
|||
.line-cover {
|
||||
height: 91px;
|
||||
&::after {
|
||||
position: absolute;
|
||||
left: -7px;
|
||||
bottom: -6px;
|
||||
content: "";
|
||||
opacity: 1;
|
||||
border: 6px solid transparent;
|
||||
border-right-color: #1e54d5;
|
||||
}
|
||||
position: absolute;
|
||||
left: -7px;
|
||||
bottom: -6px;
|
||||
content: '';
|
||||
opacity: 1;
|
||||
border: 6px solid transparent;
|
||||
border-right-color: #1e54d5;
|
||||
}
|
||||
}
|
||||
}
|
||||
.line-cover {
|
||||
|
|
@ -376,7 +362,7 @@ export default defineComponent({
|
|||
position: absolute;
|
||||
left: -7px;
|
||||
bottom: -6px;
|
||||
content: "";
|
||||
content: '';
|
||||
opacity: 1;
|
||||
border: 6px solid transparent;
|
||||
border-right-color: #1e54d5;
|
||||
|
|
@ -387,7 +373,7 @@ export default defineComponent({
|
|||
<style lang="scss">
|
||||
.guid-modal {
|
||||
z-index: 99999;
|
||||
.czhj-dialog__header{
|
||||
.czhj-dialog__header {
|
||||
border-bottom: none !important;
|
||||
}
|
||||
.czhj-dialog__body {
|
||||
|
|
|
|||
|
|
@ -40,5 +40,4 @@
|
|||
:deep(.#{$namespace}-menu-item) {
|
||||
height: 40px;
|
||||
}
|
||||
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -49,9 +49,9 @@ export default {
|
|||
clearInterval(timer)
|
||||
})
|
||||
return {
|
||||
tipText,
|
||||
tipText
|
||||
}
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped lang="scss">
|
||||
|
|
|
|||
|
|
@ -11,66 +11,40 @@
|
|||
>
|
||||
<span class="line"></span>
|
||||
<span class="">{{ tag.title }}</span>
|
||||
<el-icon class="icon-close" v-if="!tag.meta.fix" @click.prevent.stop="closeSelectedTag(tag, index)"><icon-ep-close /></el-icon>
|
||||
<el-icon class="icon-close" v-if="!tag.meta.fix" @click.prevent.stop="closeSelectedTag(tag, index)"><icon-ep-close /></el-icon>
|
||||
<span v-if="isActive(tag)">
|
||||
<SelectRound class="left"></SelectRound>
|
||||
<SelectRound></SelectRound>
|
||||
</span>
|
||||
</span>
|
||||
</ScrollPanel>
|
||||
<ul
|
||||
v-show="visible"
|
||||
:style="{ left: left + 'px', top: top + 'px' }"
|
||||
class="contextmenu"
|
||||
>
|
||||
<ul v-show="visible" :style="{ left: left + 'px', top: top + 'px' }" class="contextmenu">
|
||||
<!-- <li @click="refreshSelectedTag(selectedTag)">刷新</li> -->
|
||||
<li
|
||||
@click="closeSelectedTag(selectedTag)"
|
||||
v-if="selectedTag.meta && !selectedTag.meta.fix"
|
||||
>
|
||||
关闭
|
||||
</li>
|
||||
<li @click="closeOthersTags" v-if="visitedViews.length !== 1">
|
||||
关闭其他
|
||||
</li>
|
||||
<li @click="closeSelectedTag(selectedTag)" v-if="selectedTag.meta && !selectedTag.meta.fix">关闭</li>
|
||||
<li @click="closeOthersTags" v-if="visitedViews.length !== 1">关闭其他</li>
|
||||
<li @click="closeAllTags(selectedTag)">关闭所有</li>
|
||||
<li @click="closeLeftTags(selectedTag)" v-if="selectIndex !== 0">
|
||||
关闭左侧
|
||||
</li>
|
||||
<li
|
||||
@click="closeRightTags(selectedTag)"
|
||||
v-if="selectIndex !== visitedViews.length - 1"
|
||||
>
|
||||
关闭右侧
|
||||
</li>
|
||||
<li @click="closeLeftTags(selectedTag)" v-if="selectIndex !== 0">关闭左侧</li>
|
||||
<li @click="closeRightTags(selectedTag)" v-if="selectIndex !== visitedViews.length - 1">关闭右侧</li>
|
||||
</ul>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
onMounted,
|
||||
reactive,
|
||||
toRefs,
|
||||
ref,
|
||||
computed,
|
||||
onUnmounted,
|
||||
watch
|
||||
} from "vue";
|
||||
import ScrollPanel from "./ScrollPanel.vue";
|
||||
import SelectRound from "./SelectRound.vue";
|
||||
import { resolvePath } from "utils/resolvePath";
|
||||
import { onMounted, reactive, toRefs, ref, computed, onUnmounted, watch } from 'vue'
|
||||
import ScrollPanel from './ScrollPanel.vue'
|
||||
import SelectRound from './SelectRound.vue'
|
||||
import { resolvePath } from 'utils/resolvePath'
|
||||
// import { nth } from "lodash-es";
|
||||
import { useStore } from "vuex";
|
||||
import { useStore } from 'vuex'
|
||||
import { useLink } from '../sidebar/useLink'
|
||||
import { useRoute, useRouter } from "vue-router";
|
||||
import { useRoute, useRouter } from 'vue-router'
|
||||
|
||||
export default {
|
||||
components: { ScrollPanel, SelectRound },
|
||||
setup() {
|
||||
const store = useStore();
|
||||
const route = useRoute();
|
||||
const router = useRouter();
|
||||
const store = useStore()
|
||||
const route = useRoute()
|
||||
const router = useRouter()
|
||||
const state = reactive({
|
||||
visible: false,
|
||||
top: 0,
|
||||
|
|
@ -78,51 +52,47 @@ export default {
|
|||
selectedTag: {},
|
||||
fixTags: [],
|
||||
selectIndex: 0
|
||||
});
|
||||
const scrollRef = ref(null);
|
||||
const visitedViews = computed(() => store.state.tagsView.visitedViews);
|
||||
})
|
||||
const scrollRef = ref(null)
|
||||
const visitedViews = computed(() => store.state.tagsView.visitedViews)
|
||||
const homePath = computed(() => store.getters.appConfigs.homePath)
|
||||
// 关闭菜单
|
||||
function closeMenu() {
|
||||
state.visible = false;
|
||||
state.visible = false
|
||||
}
|
||||
onMounted(() => {
|
||||
addFixTags();
|
||||
addTags();
|
||||
document.body.addEventListener("click", closeMenu);
|
||||
});
|
||||
addFixTags()
|
||||
addTags()
|
||||
document.body.addEventListener('click', closeMenu)
|
||||
})
|
||||
onUnmounted(() => {
|
||||
document.body.removeEventListener("click", closeMenu);
|
||||
});
|
||||
document.body.removeEventListener('click', closeMenu)
|
||||
})
|
||||
watch(
|
||||
() => route.path,
|
||||
() => {
|
||||
addTags();
|
||||
addTags()
|
||||
}
|
||||
);
|
||||
)
|
||||
// 是否为激活状态
|
||||
const isActive = (routeItem) => {
|
||||
const isActive = routeItem => {
|
||||
const {
|
||||
meta: { parentTag }
|
||||
} = route;
|
||||
let { path } = route;
|
||||
} = route
|
||||
let { path } = route
|
||||
if (parentTag) {
|
||||
path = resolvePath(path, "..");
|
||||
path = resolvePath(path, '..')
|
||||
}
|
||||
return routeItem.path === path;
|
||||
};
|
||||
return routeItem.path === path
|
||||
}
|
||||
// 是否隐藏
|
||||
const isShow = () => {
|
||||
return ![
|
||||
"/sms-web/resource_dashboard",
|
||||
"/screen/list",
|
||||
"/redirect"
|
||||
].includes(route.path);
|
||||
};
|
||||
const getFixTags = (routes) => {
|
||||
const tags = [];
|
||||
routes.forEach((item) => {
|
||||
const { meta, name, path, params, children } = item;
|
||||
return !['/sms-web/resource_dashboard', '/screen/list', '/redirect'].includes(route.path)
|
||||
}
|
||||
const getFixTags = routes => {
|
||||
const tags = []
|
||||
routes.forEach(item => {
|
||||
const { meta, name, path, params, children } = item
|
||||
if (meta && meta.fix) {
|
||||
tags.push({
|
||||
meta,
|
||||
|
|
@ -130,22 +100,22 @@ export default {
|
|||
path,
|
||||
params,
|
||||
children
|
||||
});
|
||||
})
|
||||
}
|
||||
if (children && children.length) {
|
||||
tags.push(...getFixTags(children));
|
||||
tags.push(...getFixTags(children))
|
||||
}
|
||||
});
|
||||
return tags;
|
||||
};
|
||||
const routes = computed(() => store.getters.addRoutes);
|
||||
const routeMap = computed(() => store.getters.routeMap);
|
||||
})
|
||||
return tags
|
||||
}
|
||||
const routes = computed(() => store.getters.addRoutes)
|
||||
const routeMap = computed(() => store.getters.routeMap)
|
||||
const addFixTags = () => {
|
||||
const fixTags = getFixTags(routes.value);
|
||||
fixTags.forEach((tag) => {
|
||||
store.dispatch("tagsView/addView", tag);
|
||||
});
|
||||
};
|
||||
const fixTags = getFixTags(routes.value)
|
||||
fixTags.forEach(tag => {
|
||||
store.dispatch('tagsView/addView', tag)
|
||||
})
|
||||
}
|
||||
const addTags = () => {
|
||||
// const {
|
||||
// meta: { parentTag },
|
||||
|
|
@ -153,90 +123,90 @@ export default {
|
|||
// console.log(route);
|
||||
// // parentTag 三级菜单展示父级tag
|
||||
// const currentRoute = parentTag ? nth(matched, -2) : { ...route };
|
||||
const currentRoute = routeMap.value[route.path];
|
||||
if(!currentRoute || (currentRoute && currentRoute.redirect)) return;
|
||||
const { path } = currentRoute;
|
||||
const { query = {} } = route;
|
||||
const currentRoute = routeMap.value[route.path]
|
||||
if (!currentRoute || (currentRoute && currentRoute.redirect)) return
|
||||
const { path } = currentRoute
|
||||
const { query = {} } = route
|
||||
if (path) {
|
||||
state.activeName = path;
|
||||
store.dispatch("tagsView/addView", {...currentRoute, query});
|
||||
state.activeName = path
|
||||
store.dispatch('tagsView/addView', { ...currentRoute, query })
|
||||
}
|
||||
setTimeout(() => {
|
||||
scrollRef.value && scrollRef.value.scrollToactive();
|
||||
});
|
||||
return false;
|
||||
};
|
||||
scrollRef.value && scrollRef.value.scrollToactive()
|
||||
})
|
||||
return false
|
||||
}
|
||||
// 移动下一个标签
|
||||
const toNextView = (visitedViews) => {
|
||||
const toNextView = visitedViews => {
|
||||
// 获取关闭页签的上一个坐标
|
||||
const index = state.selectIndex - 1 > 0 ? state.selectIndex - 1 : 0;
|
||||
const latestView = visitedViews[index];
|
||||
const index = state.selectIndex - 1 > 0 ? state.selectIndex - 1 : 0
|
||||
const latestView = visitedViews[index]
|
||||
if (latestView) {
|
||||
router.push(latestView.path);
|
||||
router.push(latestView.path)
|
||||
} else {
|
||||
router.push(homePath.value);
|
||||
router.push(homePath.value)
|
||||
}
|
||||
};
|
||||
}
|
||||
// 关闭标签
|
||||
const closeSelectedTag = (view, index = state.selectIndex) => {
|
||||
state.selectIndex = index;
|
||||
store.dispatch("tagsView/delView", view).then(({ visitedViews }) => {
|
||||
state.selectIndex = index
|
||||
store.dispatch('tagsView/delView', view).then(({ visitedViews }) => {
|
||||
if (isActive(view)) {
|
||||
toNextView(visitedViews);
|
||||
toNextView(visitedViews)
|
||||
}
|
||||
});
|
||||
};
|
||||
})
|
||||
}
|
||||
// 关闭其他标签
|
||||
const closeOthersTags = () => {
|
||||
if (!isActive(state.selectedTag)) router.push(state.selectedTag);
|
||||
store.dispatch("tagsView/delOthersViews", state.selectedTag);
|
||||
};
|
||||
if (!isActive(state.selectedTag)) router.push(state.selectedTag)
|
||||
store.dispatch('tagsView/delOthersViews', state.selectedTag)
|
||||
}
|
||||
// 关闭所有标签
|
||||
const closeAllTags = () => {
|
||||
store.dispatch("tagsView/delAllViews");
|
||||
};
|
||||
store.dispatch('tagsView/delAllViews')
|
||||
}
|
||||
// 关闭左侧标签
|
||||
const closeLeftTags = (view) => {
|
||||
const left = visitedViews.value.slice(0, state.selectIndex);
|
||||
scrollToCurrent(left, view);
|
||||
store.dispatch("tagsView/delLeftViews", {
|
||||
const closeLeftTags = view => {
|
||||
const left = visitedViews.value.slice(0, state.selectIndex)
|
||||
scrollToCurrent(left, view)
|
||||
store.dispatch('tagsView/delLeftViews', {
|
||||
view,
|
||||
index: state.selectIndex
|
||||
});
|
||||
};
|
||||
})
|
||||
}
|
||||
// 关闭左右标签后 当前页出来
|
||||
const scrollToCurrent = (views, view) => {
|
||||
const { path } = route;
|
||||
if (views.some((v) => v.path === path)) {
|
||||
router.push(view.path);
|
||||
const { path } = route
|
||||
if (views.some(v => v.path === path)) {
|
||||
router.push(view.path)
|
||||
}
|
||||
};
|
||||
}
|
||||
// 关闭右侧标签
|
||||
const closeRightTags = (view) => {
|
||||
const right = visitedViews.value.slice(state.selectIndex + 1);
|
||||
scrollToCurrent(right, view);
|
||||
store.dispatch("tagsView/delRightViews", {
|
||||
const closeRightTags = view => {
|
||||
const right = visitedViews.value.slice(state.selectIndex + 1)
|
||||
scrollToCurrent(right, view)
|
||||
store.dispatch('tagsView/delRightViews', {
|
||||
view,
|
||||
index: state.selectIndex
|
||||
});
|
||||
};
|
||||
})
|
||||
}
|
||||
// 打开操作菜单
|
||||
const openMenu = (tag, index, e) => {
|
||||
const menuMinWidth = 105;
|
||||
const maxLeft = window.innerWidth - menuMinWidth; // left boundary
|
||||
const left = e.clientX + 15; // 15: margin right
|
||||
const menuMinWidth = 105
|
||||
const maxLeft = window.innerWidth - menuMinWidth // left boundary
|
||||
const left = e.clientX + 15 // 15: margin right
|
||||
if (left > maxLeft) {
|
||||
state.left = maxLeft;
|
||||
state.left = maxLeft
|
||||
} else {
|
||||
state.left = left;
|
||||
state.left = left
|
||||
}
|
||||
state.top = e.clientY + 10;
|
||||
state.visible = true;
|
||||
state.selectedTag = tag;
|
||||
state.selectIndex = index;
|
||||
};
|
||||
state.top = e.clientY + 10
|
||||
state.visible = true
|
||||
state.selectedTag = tag
|
||||
state.selectIndex = index
|
||||
}
|
||||
// 界面跳转
|
||||
const goPage = useLink();
|
||||
const goPage = useLink()
|
||||
return {
|
||||
...toRefs(state),
|
||||
scrollRef,
|
||||
|
|
@ -251,9 +221,9 @@ export default {
|
|||
closeMenu,
|
||||
openMenu,
|
||||
goPage
|
||||
};
|
||||
}
|
||||
}
|
||||
};
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
|
|
|
|||
|
|
@ -10,7 +10,7 @@
|
|||
<script>
|
||||
import { computed } from 'vue'
|
||||
import BaseMenu from './sidebar/BaseMenu.vue'
|
||||
import useMenuColorConfig from "./sidebar/useMenuColorConfig";
|
||||
import useMenuColorConfig from './sidebar/useMenuColorConfig'
|
||||
|
||||
export default {
|
||||
components: { BaseMenu },
|
||||
|
|
@ -25,14 +25,14 @@ export default {
|
|||
}
|
||||
},
|
||||
setup(props) {
|
||||
const { menuColorConfig } = useMenuColorConfig();
|
||||
const { menuColorConfig } = useMenuColorConfig()
|
||||
const menuProps = computed(() => {
|
||||
return {
|
||||
limitLevel: 7,
|
||||
defaultIcon: '',
|
||||
menuData: props.menuData.children,
|
||||
inlineIndent: 20,
|
||||
...unref(menuColorConfig),
|
||||
...unref(menuColorConfig)
|
||||
}
|
||||
})
|
||||
return {
|
||||
|
|
|
|||
|
|
@ -28,142 +28,113 @@
|
|||
</el-dropdown-menu>
|
||||
</template>
|
||||
</el-dropdown>
|
||||
<el-dialog
|
||||
title="修改密码"
|
||||
:close-on-click-modal="false"
|
||||
append-to-body
|
||||
v-model="pwdDialogVisible"
|
||||
width="600px"
|
||||
v-if="pwdDialogVisible"
|
||||
>
|
||||
<el-form
|
||||
:model="pwdData"
|
||||
ref="pwdRef"
|
||||
label-width="100px"
|
||||
label-position="right"
|
||||
>
|
||||
<el-dialog title="修改密码" :close-on-click-modal="false" append-to-body v-model="pwdDialogVisible" width="600px" v-if="pwdDialogVisible">
|
||||
<el-form :model="pwdData" ref="pwdRef" label-width="100px" label-position="right">
|
||||
<el-form-item label="原密码：" prop="oldPassword" :rules="[required]">
|
||||
<el-input
|
||||
show-password
|
||||
v-model="pwdData.oldPassword"
|
||||
auto-complete="off"
|
||||
></el-input>
|
||||
<el-input show-password v-model="pwdData.oldPassword" auto-complete="off"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="新密码：" prop="newPassword" :rules="pwdRule">
|
||||
<el-input
|
||||
show-password
|
||||
v-model="pwdData.newPassword"
|
||||
auto-complete="off"
|
||||
></el-input>
|
||||
<el-input show-password v-model="pwdData.newPassword" auto-complete="off"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="确认密码：" prop="confirmPassword" :rules="pwdRule">
|
||||
<el-input
|
||||
show-password
|
||||
v-model="pwdData.confirmPassword"
|
||||
auto-complete="off"
|
||||
></el-input>
|
||||
<el-input show-password v-model="pwdData.confirmPassword" auto-complete="off"></el-input>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<template #footer>
|
||||
<el-button @click="pwdDialogVisible = false">取消</el-button>
|
||||
<el-button
|
||||
type="primary"
|
||||
@click="modifyPwdSubmit"
|
||||
:loading="loading"
|
||||
>确定</el-button
|
||||
>
|
||||
<el-button @click="pwdDialogVisible = false">取消</el-button>
|
||||
<el-button type="primary" @click="modifyPwdSubmit" :loading="loading">确定</el-button>
|
||||
</template>
|
||||
</el-dialog>
|
||||
<InfoDialog ref="infoRef" :data="userData"></InfoDialog>
|
||||
</template>
|
||||
<script>
|
||||
import crypto from "utils/crypto.js";
|
||||
import { changePassword } from "@/services/manager";
|
||||
import { logout } from "services";
|
||||
import InfoDialog from "./InfoDialog.vue";
|
||||
import { computed, defineComponent, ref } from "vue";
|
||||
import { useStore } from "vuex";
|
||||
import { required, complexPassword } from "@/validate";
|
||||
import useTokenAndLock from "./useTokenAndLock";
|
||||
import { ElMessage, ElMessageBox } from "element-plus";
|
||||
import crypto from 'utils/crypto.js'
|
||||
import { changePassword } from '@/services/manager'
|
||||
import { logout } from 'services'
|
||||
import InfoDialog from './InfoDialog.vue'
|
||||
import { computed, defineComponent, ref } from 'vue'
|
||||
import { useStore } from 'vuex'
|
||||
import { required, complexPassword } from '@/validate'
|
||||
import useTokenAndLock from './useTokenAndLock'
|
||||
import { ElMessage, ElMessageBox } from 'element-plus'
|
||||
|
||||
export default defineComponent({
|
||||
components: {
|
||||
InfoDialog
|
||||
},
|
||||
setup(props, context) {
|
||||
const store = useStore();
|
||||
const store = useStore()
|
||||
|
||||
// 密码修改
|
||||
const pwdData = ref({
|
||||
oldPassword: "",
|
||||
newPassword: "",
|
||||
confirmPassword: ""
|
||||
});
|
||||
const pwdDialogVisible = ref(false);
|
||||
oldPassword: '',
|
||||
newPassword: '',
|
||||
confirmPassword: ''
|
||||
})
|
||||
const pwdDialogVisible = ref(false)
|
||||
function openPwdDialog() {
|
||||
pwdDialogVisible.value = true;
|
||||
pwdDialogVisible.value = true
|
||||
pwdData.value = {
|
||||
oldPassword: "",
|
||||
newPassword: "",
|
||||
confirmPassword: ""
|
||||
};
|
||||
oldPassword: '',
|
||||
newPassword: '',
|
||||
confirmPassword: ''
|
||||
}
|
||||
}
|
||||
function checkPassword() {
|
||||
const { newPassword, oldPassword, confirmPassword } = pwdData.value;
|
||||
const { newPassword, oldPassword, confirmPassword } = pwdData.value
|
||||
if (newPassword === oldPassword) {
|
||||
ElMessage.error("新密码不能与原密码相同");
|
||||
return false;
|
||||
ElMessage.error('新密码不能与原密码相同')
|
||||
return false
|
||||
}
|
||||
if (confirmPassword !== newPassword) {
|
||||
ElMessage.error("确认密码与新密码不一致");
|
||||
return false;
|
||||
ElMessage.error('确认密码与新密码不一致')
|
||||
return false
|
||||
}
|
||||
|
||||
return true;
|
||||
return true
|
||||
}
|
||||
const pwdRef = ref();
|
||||
const loading = ref(false);
|
||||
const pwdRef = ref()
|
||||
const loading = ref(false)
|
||||
async function modifyPwdSubmit() {
|
||||
const { validate } = pwdRef.value || context.refs.pwdRef;
|
||||
const { validate } = pwdRef.value || context.refs.pwdRef
|
||||
validate(async () => {
|
||||
if (!checkPassword()) return;
|
||||
loading.value = true;
|
||||
if (!checkPassword()) return
|
||||
loading.value = true
|
||||
const res = await changePassword(userData.value.id, {
|
||||
password: crypto.encrypt(pwdData.value.newPassword),
|
||||
oldPassword: crypto.encrypt(pwdData.value.oldPassword)
|
||||
});
|
||||
})
|
||||
if (res.success) {
|
||||
pwdDialogVisible.value = false;
|
||||
ElMessage.success(res.message);
|
||||
store.dispatch("permission/ResetRoutes");
|
||||
pwdDialogVisible.value = false
|
||||
ElMessage.success(res.message)
|
||||
store.dispatch('permission/ResetRoutes')
|
||||
}
|
||||
loading.value = false;
|
||||
});
|
||||
loading.value = false
|
||||
})
|
||||
}
|
||||
const userData = computed(() => store.getters.userData || {});
|
||||
const userData = computed(() => store.getters.userData || {})
|
||||
const pwdRule = computed(() => {
|
||||
const rule = store.state.app.systemConfig.pwdStrength;
|
||||
if (rule === "required") return [required];
|
||||
return [required, complexPassword];
|
||||
});
|
||||
const rule = store.state.app.systemConfig.pwdStrength
|
||||
if (rule === 'required') return [required]
|
||||
return [required, complexPassword]
|
||||
})
|
||||
// 登出
|
||||
function logoutSystem() {
|
||||
ElMessageBox.confirm("您确定要退出该系统吗?", "提示", {
|
||||
type: "warning"
|
||||
ElMessageBox.confirm('您确定要退出该系统吗?', '提示', {
|
||||
type: 'warning'
|
||||
}).then(async () => {
|
||||
const res = await logout();
|
||||
const res = await logout()
|
||||
if (res.success) {
|
||||
store.dispatch("permission/ResetRoutes");
|
||||
store.dispatch('permission/ResetRoutes')
|
||||
}
|
||||
});
|
||||
})
|
||||
}
|
||||
// 个人信息
|
||||
const infoRef = ref();
|
||||
const infoRef = ref()
|
||||
function openInfoDialog() {
|
||||
infoRef.value.open();
|
||||
infoRef.value.open()
|
||||
}
|
||||
const { lockScreen } = useTokenAndLock();
|
||||
const { lockScreen } = useTokenAndLock()
|
||||
return {
|
||||
loading,
|
||||
pwdData,
|
||||
|
|
@ -178,9 +149,9 @@ export default defineComponent({
|
|||
userData,
|
||||
required,
|
||||
lockScreen
|
||||
};
|
||||
}
|
||||
}
|
||||
});
|
||||
})
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.user-content {
|
||||
|
|
@ -211,8 +182,8 @@ export default defineComponent({
|
|||
:deep(.menu-item) {
|
||||
color: #303133;
|
||||
&:hover {
|
||||
background: #F2F3F5 !important;
|
||||
color: #3570EE;
|
||||
background: #f2f3f5 !important;
|
||||
color: #3570ee;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,34 +1,21 @@
|
|||
<template>
|
||||
<el-menu
|
||||
class="custom-base-menu"
|
||||
:default-active="matchPath"
|
||||
:mode="mode"
|
||||
unique-opened
|
||||
v-bind="$attrs"
|
||||
>
|
||||
<sidebar-item
|
||||
v-for="route in sideMenuData"
|
||||
:menuItem="route"
|
||||
:key="route.path"
|
||||
:isLimitLevel="isLimitLevel"
|
||||
:base-path="basePath"
|
||||
:default-icon="defaultIcon"
|
||||
></sidebar-item>
|
||||
<el-menu class="custom-base-menu" :default-active="matchPath" :mode="mode" unique-opened v-bind="$attrs">
|
||||
<sidebar-item v-for="route in sideMenuData" :menuItem="route" :key="route.path" :isLimitLevel="isLimitLevel" :base-path="basePath" :default-icon="defaultIcon"></sidebar-item>
|
||||
</el-menu>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { computed, defineComponent, PropType } from "vue";
|
||||
import { useRoute } from "vue-router";
|
||||
import SidebarItem from "./SidebarItem.vue";
|
||||
import { trimStart } from "lodash-es";
|
||||
import { computed, defineComponent, PropType } from 'vue'
|
||||
import { useRoute } from 'vue-router'
|
||||
import SidebarItem from './SidebarItem.vue'
|
||||
import { trimStart } from 'lodash-es'
|
||||
|
||||
export default defineComponent({
|
||||
components: { SidebarItem },
|
||||
props: {
|
||||
mode: {
|
||||
type: String as PropType<"horizontal" | "vertical">,
|
||||
default: "vertical"
|
||||
type: String as PropType<'horizontal' | 'vertical'>,
|
||||
default: 'vertical'
|
||||
},
|
||||
menuData: {
|
||||
type: Array
|
||||
|
|
@ -51,46 +38,43 @@ export default defineComponent({
|
|||
},
|
||||
basePath: {
|
||||
type: String,
|
||||
default: "/"
|
||||
default: '/'
|
||||
},
|
||||
defaultIcon: {
|
||||
type: String,
|
||||
default: "svg-dot"
|
||||
default: 'svg-dot'
|
||||
}
|
||||
},
|
||||
setup(props) {
|
||||
// 对菜单数据做过滤，去掉隐藏菜单
|
||||
function filterMenuData(data: any) {
|
||||
const menu: any[] = [];
|
||||
const menu: any[] = []
|
||||
data.forEach((item: any) => {
|
||||
if (!item.hidden) {
|
||||
const cache = { ...item };
|
||||
menu.push(cache);
|
||||
if (
|
||||
item.children &&
|
||||
item.path.split("/").length - 1 < props.limitLevel
|
||||
) {
|
||||
cache.children = filterMenuData(item.children);
|
||||
const cache = { ...item }
|
||||
menu.push(cache)
|
||||
if (item.children && item.path.split('/').length - 1 < props.limitLevel) {
|
||||
cache.children = filterMenuData(item.children)
|
||||
} else {
|
||||
cache.children = null;
|
||||
cache.children = null
|
||||
}
|
||||
}
|
||||
});
|
||||
return menu.length ? menu : null;
|
||||
})
|
||||
return menu.length ? menu : null
|
||||
}
|
||||
const sideMenuData = computed(() => filterMenuData(props.menuData));
|
||||
const route = useRoute();
|
||||
const sideMenuData = computed(() => filterMenuData(props.menuData))
|
||||
const route = useRoute()
|
||||
const matchPath = computed(() => {
|
||||
return `/${trimStart(route.path, "/")
|
||||
.split("/", props.limitLevel - 1)
|
||||
.join("/")}`;
|
||||
});
|
||||
return `/${trimStart(route.path, '/')
|
||||
.split('/', props.limitLevel - 1)
|
||||
.join('/')}`
|
||||
})
|
||||
return {
|
||||
matchPath,
|
||||
sideMenuData
|
||||
};
|
||||
}
|
||||
}
|
||||
});
|
||||
})
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.custom-base-menu {
|
||||
|
|
|
|||
|
|
@ -1,18 +1,9 @@
|
|||
<template>
|
||||
<el-menu-item
|
||||
class="custom-base-menu-item"
|
||||
:index="path"
|
||||
ref="menuItemRef"
|
||||
@click="clickMenu"
|
||||
>
|
||||
<el-menu-item class="custom-base-menu-item" :index="path" ref="menuItemRef" @click="clickMenu">
|
||||
<template v-if="meta.icon || defaultIcon">
|
||||
<svg-icon
|
||||
class="custom-base-icon"
|
||||
:class="meta.icon && 'animated'"
|
||||
:icon-name="meta.icon || defaultIcon"
|
||||
></svg-icon>
|
||||
<svg-icon class="custom-base-icon" :class="meta.icon && 'animated'" :icon-name="meta.icon || defaultIcon"></svg-icon>
|
||||
</template>
|
||||
<template #title>{{meta.title}}</template>
|
||||
<template #title>{{ meta.title }}</template>
|
||||
</el-menu-item>
|
||||
</template>
|
||||
|
||||
|
|
@ -25,19 +16,19 @@ defineProps({
|
|||
},
|
||||
meta: {
|
||||
type: Object,
|
||||
default: function (){
|
||||
default: function () {
|
||||
return {}
|
||||
}
|
||||
},
|
||||
defaultIcon: {
|
||||
type: String,
|
||||
default: ""
|
||||
default: ''
|
||||
}
|
||||
});
|
||||
})
|
||||
// 界面跳转
|
||||
const goPage = useLink();
|
||||
function clickMenu({ index: path }: { index: string}) {
|
||||
goPage(path);
|
||||
const goPage = useLink()
|
||||
function clickMenu({ index: path }: { index: string }) {
|
||||
goPage(path)
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
|
|
|
|||
|
|
@ -10,8 +10,7 @@
|
|||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
</script>
|
||||
<script setup></script>
|
||||
<style lang="scss" scoped>
|
||||
.operate-icon {
|
||||
transform: rotate(-90deg);
|
||||
|
|
|
|||
|
|
@ -1,27 +1,18 @@
|
|||
<template>
|
||||
<el-aside
|
||||
class="sidebar-container"
|
||||
width="190px"
|
||||
:collapsed="isCollapsed"
|
||||
:class="isCollapsed && 'collapsed'"
|
||||
>
|
||||
<el-aside class="sidebar-container" width="190px" :collapsed="isCollapsed" :class="isCollapsed && 'collapsed'">
|
||||
<el-scrollbar class="scrollbar-wrapper">
|
||||
<BaseMenu
|
||||
v-bind="menuProps"
|
||||
class="sidebar-menu"
|
||||
@select="selectItem"
|
||||
></BaseMenu>
|
||||
<BaseMenu v-bind="menuProps" class="sidebar-menu" @select="selectItem"></BaseMenu>
|
||||
</el-scrollbar>
|
||||
<OperateBtn class="operate" @click="$emit('toggleCollapsed')"> </OperateBtn>
|
||||
</el-aside>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { computed } from "vue";
|
||||
import BaseMenu from "./BaseMenu.vue";
|
||||
import OperateBtn from "./OperateBtn.vue";
|
||||
import useMenuColorConfig from "./useMenuColorConfig";
|
||||
import useBreakPoint from "./useBreakPoint";
|
||||
import { computed } from 'vue'
|
||||
import BaseMenu from './BaseMenu.vue'
|
||||
import OperateBtn from './OperateBtn.vue'
|
||||
import useMenuColorConfig from './useMenuColorConfig'
|
||||
import useBreakPoint from './useBreakPoint'
|
||||
|
||||
export default {
|
||||
components: { BaseMenu, OperateBtn },
|
||||
|
|
@ -39,21 +30,20 @@ export default {
|
|||
},
|
||||
basePath: {
|
||||
type: String,
|
||||
default: "/"
|
||||
default: '/'
|
||||
},
|
||||
matchPath: {
|
||||
type: String,
|
||||
default: ""
|
||||
default: ''
|
||||
},
|
||||
selectItem: {
|
||||
type: Function
|
||||
}
|
||||
},
|
||||
setup(props, { emit }) {
|
||||
const { menuColorConfig } = useMenuColorConfig();
|
||||
const { menuColorConfig } = useMenuColorConfig()
|
||||
const menuProps = computed(() => {
|
||||
const { menuData, isLimitLevel, basePath, matchPath, isCollapsed } =
|
||||
props;
|
||||
const { menuData, isLimitLevel, basePath, matchPath, isCollapsed } = props
|
||||
return {
|
||||
menuData,
|
||||
isLimitLevel,
|
||||
|
|
@ -63,14 +53,14 @@ export default {
|
|||
...unref(menuColorConfig),
|
||||
mainMenu: true,
|
||||
uniqueOpened: true
|
||||
};
|
||||
});
|
||||
}
|
||||
})
|
||||
useBreakPoint('xl', emit)
|
||||
return {
|
||||
menuProps
|
||||
};
|
||||
}
|
||||
}
|
||||
};
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.sidebar-container {
|
||||
|
|
|
|||
|
|
@ -1,37 +1,14 @@
|
|||
<template>
|
||||
<template v-if="menuItem.children">
|
||||
<MenuItem
|
||||
v-if="hasOneChild(menuItem.children, menuItem)"
|
||||
:path="singleChild.path"
|
||||
:meta="singleChild.meta"
|
||||
:default-icon="defaultIcon"
|
||||
></MenuItem>
|
||||
<MenuItem v-if="hasOneChild(menuItem.children, menuItem)" :path="singleChild.path" :meta="singleChild.meta" :default-icon="defaultIcon"></MenuItem>
|
||||
<el-sub-menu v-else :index="currPath" class="custom-base-sub-menu">
|
||||
<template #title>
|
||||
<svg-icon
|
||||
v-if="menuItem.meta.icon || defaultIcon"
|
||||
class="animated custom-base-icon"
|
||||
:icon-name="menuItem.meta.icon || defaultIcon"
|
||||
></svg-icon>
|
||||
<span class="custom-base-sub-menu__title">{{
|
||||
menuItem.meta.title
|
||||
}}</span>
|
||||
<svg-icon v-if="menuItem.meta.icon || defaultIcon" class="animated custom-base-icon" :icon-name="menuItem.meta.icon || defaultIcon"></svg-icon>
|
||||
<span class="custom-base-sub-menu__title">{{ menuItem.meta.title }}</span>
|
||||
</template>
|
||||
<template v-for="child in menuItem.children">
|
||||
<sidebar-item
|
||||
v-if="!child.hidden && !isLimitLevel && child.children"
|
||||
:menuItem="child"
|
||||
:key="child.path"
|
||||
:base-path="currPath"
|
||||
:default-icon="defaultIcon"
|
||||
></sidebar-item>
|
||||
<MenuItem
|
||||
v-else-if="!child.hidden"
|
||||
:path="resolvePath(currPath, child.path)"
|
||||
:meta="child.meta"
|
||||
:key="`${child.path1}`"
|
||||
:default-icon="defaultIcon"
|
||||
></MenuItem>
|
||||
<sidebar-item v-if="!child.hidden && !isLimitLevel && child.children" :menuItem="child" :key="child.path" :base-path="currPath" :default-icon="defaultIcon"></sidebar-item>
|
||||
<MenuItem v-else-if="!child.hidden" :path="resolvePath(currPath, child.path)" :meta="child.meta" :key="`${child.path1}`" :default-icon="defaultIcon"></MenuItem>
|
||||
</template>
|
||||
</el-sub-menu>
|
||||
</template>
|
||||
|
|
@ -39,17 +16,17 @@
|
|||
</template>
|
||||
|
||||
<script>
|
||||
import { resolvePath } from "utils/resolvePath";
|
||||
import MenuItem from "./MenuItem.vue";
|
||||
import { resolvePath } from 'utils/resolvePath'
|
||||
import MenuItem from './MenuItem.vue'
|
||||
export default {
|
||||
components: {
|
||||
MenuItem
|
||||
},
|
||||
name: "SidebarItem",
|
||||
name: 'SidebarItem',
|
||||
data() {
|
||||
return {
|
||||
singleChild: {}
|
||||
};
|
||||
}
|
||||
},
|
||||
props: {
|
||||
menuItem: {
|
||||
|
|
@ -67,28 +44,28 @@ export default {
|
|||
},
|
||||
computed: {
|
||||
currPath() {
|
||||
return this.resolvePath(this.basePath, this.menuItem.path);
|
||||
return this.resolvePath(this.basePath, this.menuItem.path)
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
resolvePath(basePath, routePath) {
|
||||
return resolvePath(basePath, routePath);
|
||||
return resolvePath(basePath, routePath)
|
||||
},
|
||||
hasOneChild(children, parent) {
|
||||
if (children.length === 1 && !parent.meta.alwaysShow) {
|
||||
this.singleChild = children[0];
|
||||
return true;
|
||||
this.singleChild = children[0]
|
||||
return true
|
||||
}
|
||||
return false;
|
||||
return false
|
||||
}
|
||||
}
|
||||
};
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.custom-base-sub-menu {
|
||||
:deep(.#{$namespace}-sub-menu__title) {
|
||||
margin: 4px 0;
|
||||
margin: 4px 0;
|
||||
}
|
||||
.custom-base-icon {
|
||||
font-size: 16px !important;
|
||||
|
|
@ -99,7 +76,8 @@ export default {
|
|||
background-color: var(--custom-base-color-background-sub) !important;
|
||||
color: var(--custom-base-color-text);
|
||||
}
|
||||
&:hover, &.is-active {
|
||||
&:hover,
|
||||
&.is-active {
|
||||
:deep(.#{$namespace}-sub-menu__title) {
|
||||
.custom-base-sub-menu__title {
|
||||
color: var(--custom-base-color-text-selected);
|
||||
|
|
|
|||
|
|
@ -1,15 +1,15 @@
|
|||
.sidebar-menu {
|
||||
border: 0;
|
||||
background: inherit;
|
||||
:deep {
|
||||
.el-menu {
|
||||
background: inherit;
|
||||
}
|
||||
.el-menu-item,
|
||||
.el-menu-item i,
|
||||
.el-submenu__title,
|
||||
.el-submenu__title i {
|
||||
color: inherit;
|
||||
}
|
||||
border: 0;
|
||||
background: inherit;
|
||||
:deep {
|
||||
.el-menu {
|
||||
background: inherit;
|
||||
}
|
||||
}
|
||||
.el-menu-item,
|
||||
.el-menu-item i,
|
||||
.el-submenu__title,
|
||||
.el-submenu__title i {
|
||||
color: inherit;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -3,13 +3,13 @@ import { debounce } from 'lodash-es'
|
|||
const breakpointMap: any = {
|
||||
xl: 1200
|
||||
}
|
||||
export default function(breakpoint: string, emit: any){
|
||||
export default function (breakpoint: string, emit: any) {
|
||||
const resize = debounce(() => {
|
||||
const width = document.body.clientWidth;
|
||||
if(width <= breakpointMap[breakpoint]){
|
||||
emit("toggleCollapsed", true, 'resize');
|
||||
}else{
|
||||
emit("toggleCollapsed", false, 'resize');
|
||||
const width = document.body.clientWidth
|
||||
if (width <= breakpointMap[breakpoint]) {
|
||||
emit('toggleCollapsed', true, 'resize')
|
||||
} else {
|
||||
emit('toggleCollapsed', false, 'resize')
|
||||
}
|
||||
}, 10)
|
||||
onMounted(() => {
|
||||
|
|
@ -19,4 +19,4 @@ export default function(breakpoint: string, emit: any){
|
|||
onUnmounted(() => {
|
||||
window.removeEventListener('resize', resize)
|
||||
})
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -12,7 +12,7 @@ export function useLink(_router?: Router) {
|
|||
if (isExternalLink(url)) {
|
||||
return openWindow(url)
|
||||
}
|
||||
push({path: url, query}).catch((e) => {
|
||||
push({ path: url, query }).catch(e => {
|
||||
console.log(e)
|
||||
})
|
||||
}
|
||||
|
|
|
|||
|
|
@ -5,14 +5,14 @@ import { useStore } from 'vuex'
|
|||
export default function () {
|
||||
const store = useStore()
|
||||
const menuColorConfig: Ref<any> = computed(() => {
|
||||
const { menuBgColour, menuFontColour, menuFontSelectColour } = store.getters.pageConfig;
|
||||
const { menuBgColour, menuFontColour, menuFontSelectColour } = store.getters.pageConfig
|
||||
return {
|
||||
backgroundColor: menuBgColour,
|
||||
textColor: menuFontColour,
|
||||
activeTextColor: menuFontSelectColour,
|
||||
};
|
||||
activeTextColor: menuFontSelectColour
|
||||
}
|
||||
})
|
||||
return {
|
||||
menuColorConfig
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -29,7 +29,7 @@ export default function (props: { mainMenu: boolean }) {
|
|||
const result: string[] = []
|
||||
if (openKey.length) {
|
||||
const lastOpenKey = [...openKey].pop() as string
|
||||
openKey.forEach((item) => {
|
||||
openKey.forEach(item => {
|
||||
// 子菜单打开父菜单也需要展开 || 父菜单展开之前缓存的子菜单数据也要展开
|
||||
if (lastOpenKey.includes(item) || item.includes(lastOpenKey)) {
|
||||
result.push(item)
|
||||
|
|
@ -40,6 +40,6 @@ export default function (props: { mainMenu: boolean }) {
|
|||
}
|
||||
return {
|
||||
openKeys,
|
||||
handleOpenChange,
|
||||
handleOpenChange
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@
|
|||
// 获取菜单数组
|
||||
export function getFlatMenuPath(menus) {
|
||||
const paths = []
|
||||
menus.forEach((item) => {
|
||||
menus.forEach(item => {
|
||||
paths.push(item.path)
|
||||
if (item.children) {
|
||||
paths.push(...getFlatMenuPath(item.children))
|
||||
|
|
@ -14,7 +14,7 @@ export function getFlatMenuPath(menus) {
|
|||
}
|
||||
// /userinfo/2144/id => ['/userinfo','/useinfo/2144,'/userindo/2144/id']
|
||||
export function urlToList(url) {
|
||||
const urllist = url.split('/').filter((i) => i)
|
||||
const urllist = url.split('/').filter(i => i)
|
||||
return urllist.map((urlItem, index) => {
|
||||
return `/${urllist.slice(0, index + 1).join('/')}`
|
||||
})
|
||||
|
|
|
|||
|
|
@ -29,7 +29,7 @@ import Sidebar from './components/sidebar/Sidebar.vue'
|
|||
import ThirdMenu from './components/ThirdMenu.vue'
|
||||
import CommonHeader from './components/Header.vue'
|
||||
import SystemTip from './components/SystemTip.vue'
|
||||
import useRouteItem from "@/hooks/useRouteItem";
|
||||
import useRouteItem from '@/hooks/useRouteItem'
|
||||
|
||||
// import startApp from '@/core/register'
|
||||
export default {
|
||||
|
|
@ -67,7 +67,7 @@ export default {
|
|||
// 对三级菜单隐藏的数据做剔除
|
||||
const children = []
|
||||
items.children = items.children || []
|
||||
items.children.forEach((_) => {
|
||||
items.children.forEach(_ => {
|
||||
if (!_.hidden) children.push(_)
|
||||
})
|
||||
thirdMenuData.value = Object.assign(thirdMenu, { children: children.length ? children : null })
|
||||
|
|
@ -115,7 +115,7 @@ export default {
|
|||
const toggleCollapsed = (value, source) => {
|
||||
if (typeof value === 'boolean') {
|
||||
// 窗口改变时，发现有三级菜单直接返回
|
||||
if(source === 'resize' && thirdMenuData.value.children) return;
|
||||
if (source === 'resize' && thirdMenuData.value.children) return
|
||||
store.commit('SET_COLLAPSED', value)
|
||||
} else {
|
||||
store.commit('TOGGLE_SIDEBAR')
|
||||
|
|
@ -123,14 +123,10 @@ export default {
|
|||
}
|
||||
const addRoutes = computed(() => store.state.permission.addRoutes)
|
||||
const menuData = computed(() => store.state.app.sideMenuData)
|
||||
const { routeItem } = useRouteItem();
|
||||
const { routeItem } = useRouteItem()
|
||||
const showSidebar = computed(() => {
|
||||
return (
|
||||
routeItem.value &&
|
||||
!routeItem.value.meta.hiddenSide &&
|
||||
unref(menuData).length
|
||||
);
|
||||
});
|
||||
return routeItem.value && !routeItem.value.meta.hiddenSide && unref(menuData).length
|
||||
})
|
||||
function setTime() {
|
||||
store.commit('SET_OPERATETIME')
|
||||
}
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@
|
|||
* @Date: 2022-11-10 10:46:38
|
||||
* @LastEditTime: 2022-11-14 18:01:42
|
||||
* @LastEditors: Haijun Zhang
|
||||
* @Description:
|
||||
* @Description:
|
||||
* @FilePath: \main-web-qiankun\src\main.ts
|
||||
*/
|
||||
import { createApp } from 'vue'
|
||||
|
|
|
|||
|
|
@ -1,12 +1,12 @@
|
|||
export default {
|
||||
data() {
|
||||
return {
|
||||
selectionIds: [],
|
||||
selectionIds: []
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
handleSelectionChange(selections) {
|
||||
this.selectionIds = selections.map((item) => item.id)
|
||||
},
|
||||
},
|
||||
this.selectionIds = selections.map(item => item.id)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@ import { getToken } from 'utils/auth'
|
|||
export default {
|
||||
data() {
|
||||
return {
|
||||
webSocket: '',
|
||||
webSocket: ''
|
||||
}
|
||||
},
|
||||
created() {
|
||||
|
|
@ -14,7 +14,7 @@ export default {
|
|||
commonFun: this.messageCommonFun,
|
||||
pingMsg: 'HeartBeat',
|
||||
reConnectNum: 5,
|
||||
params: getToken(),
|
||||
params: getToken()
|
||||
})
|
||||
if (this.onmessage && typeof this.onmessage === 'function') {
|
||||
this.webSocket.onmessage = this.onmessage
|
||||
|
|
@ -25,8 +25,8 @@ export default {
|
|||
this.webSocket = null
|
||||
},
|
||||
methods: {
|
||||
messageCommonFun() {
|
||||
messageCommonFun() {
|
||||
console.log('common function')
|
||||
},
|
||||
},
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -4,13 +4,13 @@ import routes from './constant'
|
|||
function createRoute() {
|
||||
return createRouter({
|
||||
history: createWebHistory(),
|
||||
routes,
|
||||
routes
|
||||
})
|
||||
}
|
||||
const router = createRoute()
|
||||
export const asyncRouterMap = {
|
||||
Home: () => import('@/layouts/home.vue'),
|
||||
App: () => import('@/layouts/app.vue'),
|
||||
App: () => import('@/layouts/app.vue')
|
||||
}
|
||||
export function resetRouter() {
|
||||
// const newRouter = createRoute();
|
||||
|
|
|
|||
|
|
@ -21,12 +21,12 @@ export function logout() {
|
|||
}
|
||||
export function getConfig(params) {
|
||||
return request.get('/sms/v1/logo', {
|
||||
params: wrapperParams(params),
|
||||
params: wrapperParams(params)
|
||||
})
|
||||
}
|
||||
export function getDict(data) {
|
||||
return request.get('/dict/children', {
|
||||
params: wrapperParams(data),
|
||||
params: wrapperParams(data)
|
||||
})
|
||||
}
|
||||
export function getSysconf() {
|
||||
|
|
@ -48,7 +48,7 @@ export function getPortal(params) {
|
|||
}
|
||||
export function getServiceQuota(tenantId, data) {
|
||||
return request.get(`/cos/v1/tenants/${tenantId}/quotas`, {
|
||||
params: wrapperParams(data),
|
||||
params: wrapperParams(data)
|
||||
})
|
||||
}
|
||||
// 获取用户权限
|
||||
|
|
@ -66,7 +66,7 @@ export function getSystemTreeConfigs(params) {
|
|||
// 更新系统配置信息
|
||||
export function updateSystemConfigs(params) {
|
||||
return request.put('/sms/v1/system-configs', params, {
|
||||
headers: { 'Content-Type': 'multipart/form-data', BsmAjaxHeader: true, options: { noSeri: true } },
|
||||
headers: { 'Content-Type': 'multipart/form-data', BsmAjaxHeader: true, options: { noSeri: true } }
|
||||
})
|
||||
}
|
||||
// 测试连接
|
||||
|
|
|
|||
|
|
@ -7,7 +7,7 @@ const baseUrl = '/sms/v1/config'
|
|||
|
||||
export function getStatus(params) {
|
||||
return request.get(`${baseUrl}/status`, {
|
||||
params,
|
||||
params
|
||||
})
|
||||
}
|
||||
export function getSid() {
|
||||
|
|
@ -15,7 +15,7 @@ export function getSid() {
|
|||
}
|
||||
export function getServer(params) {
|
||||
return request.get(`${baseUrl}/servers`, {
|
||||
params,
|
||||
params
|
||||
})
|
||||
}
|
||||
export function getLicense() {
|
||||
|
|
|
|||
|
|
@ -9,7 +9,7 @@ import type { IUser } from '@/models/user'
|
|||
const baseUrl = '/sms/v1/users'
|
||||
export function getUser(params: Base.IListParams) {
|
||||
return request.get<Base.IListData<IUser>>(baseUrl, {
|
||||
params,
|
||||
params
|
||||
})
|
||||
}
|
||||
export function getUserDetail(id: number) {
|
||||
|
|
@ -48,7 +48,7 @@ export function getRolesByUser(id: number) {
|
|||
}
|
||||
export function getTrack(params: Base.IListParams) {
|
||||
return request.get(`${baseUrl}/track`, {
|
||||
params,
|
||||
params
|
||||
})
|
||||
}
|
||||
export function exportUser(params: Base.IListParams) {
|
||||
|
|
|
|||
|
|
@ -6,7 +6,7 @@ import request from 'utils/request'
|
|||
const baseUrl = '/sms/v1/messages'
|
||||
export function getMessage(params) {
|
||||
return request.get(baseUrl, {
|
||||
params,
|
||||
params
|
||||
})
|
||||
}
|
||||
export function getMessageStats() {
|
||||
|
|
|
|||
|
|
@ -7,7 +7,7 @@ import { wrapperParams } from 'utils/index'
|
|||
const baseUrl = '/sms/v1/users'
|
||||
export function getUser(params) {
|
||||
return request.get(baseUrl, {
|
||||
params,
|
||||
params
|
||||
})
|
||||
}
|
||||
export function getUserDetail(id) {
|
||||
|
|
@ -32,7 +32,7 @@ export function getManager(id) {
|
|||
export function operateUser(id, action, params) {
|
||||
return request.patch(`${baseUrl}/${id}`, {
|
||||
action,
|
||||
...wrapperParams(params),
|
||||
...wrapperParams(params)
|
||||
})
|
||||
}
|
||||
export function checkStatus(data) {
|
||||
|
|
@ -45,6 +45,6 @@ export function getRolesByUser(id) {
|
|||
}
|
||||
export function getTrack(params) {
|
||||
return request.get(`${baseUrl}/track`, {
|
||||
params,
|
||||
params
|
||||
})
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,11 +1,11 @@
|
|||
const getters = {
|
||||
addRoutes: (state) => state.permission.addRoutes,
|
||||
routeMap: (state) => state.permission.routeMap,
|
||||
userData: (state) => state.app.userData,
|
||||
pageConfig: (state) => state.app.pageConfig,
|
||||
systemConfig: (state) => state.app.systemConfig,
|
||||
appLoading: (state) => state.app.appLoading,
|
||||
appConfigs: (state) => state.app.appConfigs,
|
||||
hasFms: (state) => state.app.hasFms,
|
||||
addRoutes: state => state.permission.addRoutes,
|
||||
routeMap: state => state.permission.routeMap,
|
||||
userData: state => state.app.userData,
|
||||
pageConfig: state => state.app.pageConfig,
|
||||
systemConfig: state => state.app.systemConfig,
|
||||
appLoading: state => state.app.appLoading,
|
||||
appConfigs: state => state.app.appConfigs,
|
||||
hasFms: state => state.app.hasFms
|
||||
}
|
||||
export default getters
|
||||
|
|
|
|||
|
|
@ -19,7 +19,7 @@ const state = {
|
|||
appLoading: false,
|
||||
appConfigs: {
|
||||
homePath: '',
|
||||
hasCos: true,
|
||||
hasCos: true
|
||||
},
|
||||
hasFms: true
|
||||
}
|
||||
|
|
@ -67,7 +67,7 @@ const mutations = {
|
|||
},
|
||||
SETTING_PAGE_CONFIG(state, data) {
|
||||
const { browserIcon, browserTitle, menuBgColour, subMenuBgColour, menuFontColour, menuFontSelectColour, menuSelectColour } = data
|
||||
setBrowser(browserIcon, browserTitle);
|
||||
setBrowser(browserIcon, browserTitle)
|
||||
createGlobalStyle({
|
||||
'--custom-base-color-background': menuBgColour,
|
||||
'--custom-base-color-background-sub': subMenuBgColour,
|
||||
|
|
@ -80,7 +80,7 @@ const mutations = {
|
|||
SETTING_SYSTEM_CONFIG(state, data) {
|
||||
state.systemConfig = data
|
||||
},
|
||||
SET_APP_CONFIGS(state, value){
|
||||
SET_APP_CONFIGS(state, value) {
|
||||
state.appConfigs = value
|
||||
actionStore.setGlobalState({
|
||||
appConfigs: value
|
||||
|
|
|
|||
|
|
@ -11,10 +11,10 @@ import actionStore from '@/core/actions'
|
|||
import { trimStart } from 'lodash-es'
|
||||
|
||||
const resultRoutes = []
|
||||
const createSubRoute = (permissions) => {
|
||||
const createSubRoute = permissions => {
|
||||
permissions.forEach(item => {
|
||||
const { path } = item;
|
||||
router.addRoute('Home',{
|
||||
const { path } = item
|
||||
router.addRoute('Home', {
|
||||
name: trimStart(path, '/'),
|
||||
path: `${path}/:page*`,
|
||||
component: BlankView
|
||||
|
|
@ -24,16 +24,16 @@ const createSubRoute = (permissions) => {
|
|||
// 对异步路由数据进行处理生成路由表
|
||||
const handleAsyncRouter = (routes, basePath = '/') => {
|
||||
const res = []
|
||||
routes.forEach((route) => {
|
||||
routes.forEach(route => {
|
||||
const { router, component, name, redirect, icon, id, category, meta, params } = route
|
||||
// 生成meta对象
|
||||
const metaCache = {}
|
||||
JSON.parse(meta).forEach((item) => {
|
||||
JSON.parse(meta).forEach(item => {
|
||||
metaCache[item.key] = item.value
|
||||
})
|
||||
// 生成params对象
|
||||
const paramsCache = {}
|
||||
JSON.parse(params).forEach((item) => {
|
||||
JSON.parse(params).forEach(item => {
|
||||
paramsCache[item.key] = item.value
|
||||
})
|
||||
const tmp = {
|
||||
|
|
@ -58,16 +58,16 @@ const handleAsyncRouter = (routes, basePath = '/') => {
|
|||
return res
|
||||
}
|
||||
function getRouteMap(menus) {
|
||||
let routerMap = {};
|
||||
menus.forEach((menuItem) => {
|
||||
const { path, children } = menuItem;
|
||||
let routerMap = {}
|
||||
menus.forEach(menuItem => {
|
||||
const { path, children } = menuItem
|
||||
if (children) {
|
||||
routerMap = Object.assign(routerMap, getRouteMap(children));
|
||||
routerMap = Object.assign(routerMap, getRouteMap(children))
|
||||
}
|
||||
routerMap[path] = menuItem;
|
||||
});
|
||||
routerMap[path] = menuItem
|
||||
})
|
||||
|
||||
return routerMap;
|
||||
return routerMap
|
||||
}
|
||||
const state = {
|
||||
addRoutes: null,
|
||||
|
|
@ -79,14 +79,14 @@ const mutations = {
|
|||
state.addRoutes = routers
|
||||
state.routeMap = getRouteMap(routers || [])
|
||||
},
|
||||
SET_BUTTONS: (state) => {
|
||||
SET_BUTTONS: state => {
|
||||
state.buttons = JSON.parse(localStorage.getItem('buttonData'))
|
||||
}
|
||||
}
|
||||
const actions = {
|
||||
GenerateRoutes({ commit, state: { addRoutes } }) {
|
||||
return new Promise((resolve) => {
|
||||
const callback = (permissions) => {
|
||||
return new Promise(resolve => {
|
||||
const callback = permissions => {
|
||||
resultRoutes.length = 0
|
||||
actionStore.setGlobalState({
|
||||
permissions
|
||||
|
|
@ -106,7 +106,7 @@ const actions = {
|
|||
}
|
||||
}
|
||||
getUserPermissions()
|
||||
.then((data) => {
|
||||
.then(data => {
|
||||
if (data.success) {
|
||||
if (enablePermissionStorage) {
|
||||
localStorage.setItem(menuKey, JSON.stringify(data.data))
|
||||
|
|
@ -114,14 +114,14 @@ const actions = {
|
|||
callback(data.data)
|
||||
}
|
||||
})
|
||||
.catch((err) => {
|
||||
.catch(err => {
|
||||
console.log(err)
|
||||
})
|
||||
})
|
||||
},
|
||||
// 动态更新权限
|
||||
ChangeRoutes({ dispatch }) {
|
||||
return new Promise((resolve) => {
|
||||
return new Promise(resolve => {
|
||||
resetRouter()
|
||||
dispatch('GenerateRoutes').then(() => {
|
||||
resolve()
|
||||
|
|
@ -129,7 +129,7 @@ const actions = {
|
|||
})
|
||||
},
|
||||
ResetRoutes({ commit, dispatch }, redirectToLogin = true) {
|
||||
return new Promise((resolve) => {
|
||||
return new Promise(resolve => {
|
||||
resetRouter()
|
||||
commit('SET_ROUTES', null)
|
||||
if (enablePermissionStorage) {
|
||||
|
|
|
|||
|
|
@ -1,15 +1,15 @@
|
|||
const state = {
|
||||
visitedViews: [],
|
||||
cachedViews: [],
|
||||
cachedViews: []
|
||||
}
|
||||
|
||||
const mutations = {
|
||||
ADD_VISITED_VIEW: (state, view) => {
|
||||
const {
|
||||
meta: { noTag, title },
|
||||
meta: { noTag, title }
|
||||
} = view
|
||||
if (noTag || !title) return
|
||||
if (state.visitedViews.some((v) => v.path === view.path)) return
|
||||
if (state.visitedViews.some(v => v.path === view.path)) return
|
||||
state.visitedViews.push({ ...view, title })
|
||||
},
|
||||
ADD_CACHED_VIEW: (state, view) => {
|
||||
|
|
@ -33,7 +33,7 @@ const mutations = {
|
|||
},
|
||||
|
||||
DEL_OTHERS_VISITED_VIEWS: (state, view) => {
|
||||
state.visitedViews = state.visitedViews.filter((v) => v.meta.fix || v.path === view.path)
|
||||
state.visitedViews = state.visitedViews.filter(v => v.meta.fix || v.path === view.path)
|
||||
},
|
||||
DEL_OTHERS_CACHED_VIEWS: (state, view) => {
|
||||
const index = state.cachedViews.indexOf(view.name)
|
||||
|
|
@ -45,26 +45,26 @@ const mutations = {
|
|||
}
|
||||
},
|
||||
DEL_LEFT_VISITED_VIEWS: (state, index) => {
|
||||
const left = state.visitedViews.slice(0, index).filter((v) => v.meta.fix)
|
||||
const left = state.visitedViews.slice(0, index).filter(v => v.meta.fix)
|
||||
const right = state.visitedViews.slice(index)
|
||||
state.visitedViews = [...left, ...right]
|
||||
},
|
||||
DEL_RIGHT_VISITED_VIEWS: (state, index) => {
|
||||
const left = state.visitedViews.slice(0, index + 1)
|
||||
const right = state.visitedViews.slice(index + 1).filter((v) => v.meta.fix)
|
||||
const right = state.visitedViews.slice(index + 1).filter(v => v.meta.fix)
|
||||
state.visitedViews = [...left, ...right]
|
||||
},
|
||||
UPDATE_CACHE_VIEWS: (state) => {
|
||||
state.cachedViews = state.visitedViews.filter((v) => !v.meta.noCache && v.name).map((v) => v.name)
|
||||
UPDATE_CACHE_VIEWS: state => {
|
||||
state.cachedViews = state.visitedViews.filter(v => !v.meta.noCache && v.name).map(v => v.name)
|
||||
},
|
||||
DEL_ALL_VISITED_VIEWS: (state) => {
|
||||
DEL_ALL_VISITED_VIEWS: state => {
|
||||
// keep fix tags
|
||||
const fixTags = state.visitedViews.filter((tag) => tag.meta.fix)
|
||||
const fixTags = state.visitedViews.filter(tag => tag.meta.fix)
|
||||
state.visitedViews = fixTags
|
||||
},
|
||||
DEL_ALL_CACHED_VIEWS: (state) => {
|
||||
DEL_ALL_CACHED_VIEWS: state => {
|
||||
state.cachedViews = []
|
||||
},
|
||||
}
|
||||
}
|
||||
|
||||
const actions = {
|
||||
|
|
@ -73,60 +73,60 @@ const actions = {
|
|||
commit('ADD_CACHED_VIEW', view)
|
||||
},
|
||||
delView({ commit, state }, view) {
|
||||
return new Promise((resolve) => {
|
||||
return new Promise(resolve => {
|
||||
commit('DEL_VISITED_VIEW', view)
|
||||
commit('DEL_CACHED_VIEW', view)
|
||||
resolve({
|
||||
visitedViews: [...state.visitedViews],
|
||||
cachedViews: [...state.cachedViews],
|
||||
cachedViews: [...state.cachedViews]
|
||||
})
|
||||
})
|
||||
},
|
||||
delOthersViews({ commit, state }, view) {
|
||||
return new Promise((resolve) => {
|
||||
return new Promise(resolve => {
|
||||
commit('DEL_OTHERS_VISITED_VIEWS', view)
|
||||
commit('DEL_OTHERS_CACHED_VIEWS', view)
|
||||
resolve({
|
||||
visitedViews: [...state.visitedViews],
|
||||
cachedViews: [...state.cachedViews],
|
||||
cachedViews: [...state.cachedViews]
|
||||
})
|
||||
})
|
||||
},
|
||||
delLeftViews({ commit, state }, { index }) {
|
||||
return new Promise((resolve) => {
|
||||
return new Promise(resolve => {
|
||||
commit('DEL_LEFT_VISITED_VIEWS', index)
|
||||
commit('UPDATE_CACHE_VIEWS')
|
||||
resolve({
|
||||
visitedViews: [...state.visitedViews],
|
||||
cachedViews: [...state.cachedViews],
|
||||
cachedViews: [...state.cachedViews]
|
||||
})
|
||||
})
|
||||
},
|
||||
delRightViews({ commit, state }, { index }) {
|
||||
return new Promise((resolve) => {
|
||||
return new Promise(resolve => {
|
||||
commit('DEL_RIGHT_VISITED_VIEWS', index)
|
||||
commit('UPDATE_CACHE_VIEWS')
|
||||
resolve({
|
||||
visitedViews: [...state.visitedViews],
|
||||
cachedViews: [...state.cachedViews],
|
||||
cachedViews: [...state.cachedViews]
|
||||
})
|
||||
})
|
||||
},
|
||||
delAllViews({ commit, state }) {
|
||||
return new Promise((resolve) => {
|
||||
return new Promise(resolve => {
|
||||
commit('DEL_ALL_VISITED_VIEWS')
|
||||
commit('DEL_ALL_CACHED_VIEWS')
|
||||
resolve({
|
||||
visitedViews: [...state.visitedViews],
|
||||
cachedViews: [...state.cachedViews],
|
||||
cachedViews: [...state.cachedViews]
|
||||
})
|
||||
})
|
||||
},
|
||||
}
|
||||
}
|
||||
|
||||
export default {
|
||||
namespaced: true,
|
||||
state,
|
||||
mutations,
|
||||
actions,
|
||||
actions
|
||||
}
|
||||
|
|
|
|||
|
|
@ -8,20 +8,20 @@ export const setBrowser = (icon, title) => {
|
|||
document.title = title
|
||||
}
|
||||
// /system/configs/page -> [ '/system','/system/configs','/system/configs/page']
|
||||
export const urlToList = (url) => {
|
||||
const urllist = url.split('/').filter((i) => i)
|
||||
export const urlToList = url => {
|
||||
const urllist = url.split('/').filter(i => i)
|
||||
return urllist.map((urlItem, index) => `/${urllist.slice(0, index + 1).join('/')}`)
|
||||
}
|
||||
export function createGlobalStyle(cssStyle){
|
||||
export function createGlobalStyle(cssStyle) {
|
||||
const style = document.createElement('style')
|
||||
style.setAttribute('type', 'text/css')
|
||||
function generateCss() {
|
||||
let str = ''
|
||||
Object.keys(cssStyle).forEach((item) => {
|
||||
Object.keys(cssStyle).forEach(item => {
|
||||
str += `${item}:${cssStyle[item]};`
|
||||
})
|
||||
return str
|
||||
}
|
||||
style.innerHTML = `:root{${generateCss()}}`
|
||||
document.head.appendChild(style)
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -11,6 +11,6 @@ declare interface Window {
|
|||
Vue: any
|
||||
Vue2: any
|
||||
appConfigs: {
|
||||
homePath: string
|
||||
homePath: string
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -11,6 +11,6 @@ export function setToken(token: string) {
|
|||
return sessionStorage.setItem(tokenKey, token)
|
||||
}
|
||||
|
||||
export function removeToken(){
|
||||
export function removeToken() {
|
||||
return sessionStorage.removeItem(tokenKey)
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -21,7 +21,7 @@ const iv = CryptoJS.enc.Utf8.parse(decryptByBase64('QmV5b25kQ01QVjU4NyEhIQ=='))
|
|||
const options = {
|
||||
iv,
|
||||
mode: CryptoJS.mode.CBC,
|
||||
padding: CryptoJS.pad.Pkcs7,
|
||||
padding: CryptoJS.pad.Pkcs7
|
||||
}
|
||||
|
||||
// 加密方法
|
||||
|
|
@ -41,5 +41,5 @@ export default {
|
|||
encrypt,
|
||||
decrypt,
|
||||
encryptByBase64,
|
||||
decryptByBase64,
|
||||
decryptByBase64
|
||||
}
|
||||
|
|
|
|||
|
|
@ -23,21 +23,21 @@ export const copyText = (text, event, successCallback, errorCallback) => {
|
|||
})
|
||||
clipboard.onClick(event)
|
||||
}
|
||||
export const formatEqParams = (params) => ({ page: 1, rows: 9999, params: JSON.stringify([{ param: params, sign: 'EQ' }]) })
|
||||
export const formatEqParams = params => ({ page: 1, rows: 9999, params: JSON.stringify([{ param: params, sign: 'EQ' }]) })
|
||||
export const downloadFile = (url, params = {}) => {
|
||||
let str = ''
|
||||
Object.keys(params).forEach((item) => {
|
||||
Object.keys(params).forEach(item => {
|
||||
str += `&${item}=${params[item]}`
|
||||
})
|
||||
window.location.href = encodeURI(`/api${url}?token=${getToken()}${str}`)
|
||||
}
|
||||
export const getQuery = (hash) => {
|
||||
export const getQuery = hash => {
|
||||
const queryArr = hash.split('?')
|
||||
if (queryArr.length === 1) {
|
||||
return {}
|
||||
}
|
||||
const query = {}
|
||||
queryArr[1].split('&').forEach((item) => {
|
||||
queryArr[1].split('&').forEach(item => {
|
||||
const [key, value] = item.split('=')
|
||||
query[key] = value
|
||||
})
|
||||
|
|
|
|||
|
|
@ -39,14 +39,14 @@ const axiosInstance = axios.create({
|
|||
baseURL: '/api',
|
||||
headers: { 'Content-Type': 'application/json', BsmAjaxHeader: true },
|
||||
timeout: 20000,
|
||||
paramsSerializer: (params) => qs.stringify(params, { arrayFormat: 'indices' })
|
||||
paramsSerializer: params => qs.stringify(params, { arrayFormat: 'indices' })
|
||||
})
|
||||
// 请求完成回调
|
||||
const finishCallback = function () {
|
||||
NProgress.done()
|
||||
}
|
||||
// 报错处理
|
||||
const handleError = function(response) {
|
||||
const handleError = function (response) {
|
||||
if (!response) return // 容错处理
|
||||
let title = `请求错误 ${response.status}: ${response.config.url}`
|
||||
let errorText = codeMessage[response.status] || response.statusText
|
||||
|
|
@ -66,7 +66,7 @@ const handleError = function(response) {
|
|||
throw error
|
||||
}
|
||||
axiosInstance.interceptors.request.use(
|
||||
(config) => {
|
||||
config => {
|
||||
const {
|
||||
headers,
|
||||
headers: { options = {} }
|
||||
|
|
@ -83,15 +83,19 @@ axiosInstance.interceptors.request.use(
|
|||
config.options = options
|
||||
return config
|
||||
},
|
||||
(error) => Promise.reject(error)
|
||||
error => Promise.reject(error)
|
||||
)
|
||||
axiosInstance.interceptors.response.use(
|
||||
(data) => {
|
||||
data => {
|
||||
// const requestKey = getRequestIdentify(data.config);
|
||||
// removePending(requestKey);
|
||||
finishCallback()
|
||||
const { data: responseData, config: { options }, headers: { token }} = data
|
||||
if(token) setToken(token)
|
||||
const {
|
||||
data: responseData,
|
||||
config: { options },
|
||||
headers: { token }
|
||||
} = data
|
||||
if (token) setToken(token)
|
||||
if (!responseData.success) {
|
||||
switch (responseData.status) {
|
||||
case '402':
|
||||
|
|
@ -112,7 +116,7 @@ axiosInstance.interceptors.response.use(
|
|||
}
|
||||
return responseData
|
||||
},
|
||||
(error) => {
|
||||
error => {
|
||||
finishCallback()
|
||||
handleError(error.response)
|
||||
return Promise.reject(error)
|
||||
|
|
|
|||
|
|
@ -17,6 +17,6 @@ export function resolvePath(basePath, routePath) {
|
|||
if (startsWith(routePath, '/')) {
|
||||
return routePath
|
||||
}
|
||||
const res = [...basePathArr, ...routePathArr].filter((item) => item)
|
||||
const res = [...basePathArr, ...routePathArr].filter(item => item)
|
||||
return `/${res.join('/')}`
|
||||
}
|
||||
|
|
|
|||
|
|
@ -15,7 +15,7 @@ export default function uploadFile(item, callback, errorCallBack) {
|
|||
socket.send(
|
||||
JSON.stringify({
|
||||
filename: item.file.name,
|
||||
upload: 'file',
|
||||
upload: 'file'
|
||||
})
|
||||
)
|
||||
// 取消上传
|
||||
|
|
@ -23,7 +23,7 @@ export default function uploadFile(item, callback, errorCallBack) {
|
|||
item.progress = 0
|
||||
socket.send(
|
||||
JSON.stringify({
|
||||
UPLOAD_CANCEL: 'UPLOAD_CANCEL',
|
||||
UPLOAD_CANCEL: 'UPLOAD_CANCEL'
|
||||
})
|
||||
)
|
||||
item.isUploading = false
|
||||
|
|
@ -56,7 +56,7 @@ export default function uploadFile(item, callback, errorCallBack) {
|
|||
item.progress = 100
|
||||
socket.send(
|
||||
JSON.stringify({
|
||||
sendover: 'sendover',
|
||||
sendover: 'sendover'
|
||||
})
|
||||
)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,60 +1,46 @@
|
|||
<template>
|
||||
<el-dialog
|
||||
title="证书激活"
|
||||
v-model="visible"
|
||||
:close-on-click-modal="false"
|
||||
width="40%"
|
||||
>
|
||||
<el-dialog title="证书激活" v-model="visible" :close-on-click-modal="false" width="40%">
|
||||
<el-form ref="formRef" :model="addData">
|
||||
<el-form-item
|
||||
label="激活码："
|
||||
prop="licenseMask"
|
||||
:rules="[required]"
|
||||
maxlength="10240"
|
||||
>
|
||||
<el-input
|
||||
type="textarea"
|
||||
v-model="addData.licenseMask"
|
||||
:rows="15"
|
||||
></el-input>
|
||||
<el-form-item label="激活码：" prop="licenseMask" :rules="[required]" maxlength="10240">
|
||||
<el-input type="textarea" v-model="addData.licenseMask" :rows="15"></el-input>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<template #footer>
|
||||
<el-button @click="visible = false">取消</el-button>
|
||||
<el-button @click="visible = false">取消</el-button>
|
||||
<el-button type="primary" @click="ok" :loading="loading">确定</el-button>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { installCaptcha } from "services/license";
|
||||
import { required } from "@/validate";
|
||||
import { reactive, ref } from "vue";
|
||||
import { useRouter } from "vue-router";
|
||||
import { ElMessage } from "element-plus";
|
||||
import { installCaptcha } from 'services/license'
|
||||
import { required } from '@/validate'
|
||||
import { reactive, ref } from 'vue'
|
||||
import { useRouter } from 'vue-router'
|
||||
import { ElMessage } from 'element-plus'
|
||||
// 单个传 sinple 多个 multiple
|
||||
export default {
|
||||
setup() {
|
||||
const loading = ref(false);
|
||||
const formRef = ref();
|
||||
const loading = ref(false)
|
||||
const formRef = ref()
|
||||
const addData = reactive({
|
||||
licenseMask: ""
|
||||
});
|
||||
const visible = ref(false);
|
||||
licenseMask: ''
|
||||
})
|
||||
const visible = ref(false)
|
||||
function open() {
|
||||
addData.licenseMask = "";
|
||||
visible.value = true;
|
||||
addData.licenseMask = ''
|
||||
visible.value = true
|
||||
}
|
||||
const router = useRouter();
|
||||
const router = useRouter()
|
||||
async function ok() {
|
||||
formRef.value.validate(async valid => {
|
||||
if(valid) {
|
||||
loading.value = true;
|
||||
const data = await installCaptcha(addData);
|
||||
loading.value = false;
|
||||
if (valid) {
|
||||
loading.value = true
|
||||
const data = await installCaptcha(addData)
|
||||
loading.value = false
|
||||
if (data.success) {
|
||||
ElMessage.success(data.message);
|
||||
router.replace("/login");
|
||||
ElMessage.success(data.message)
|
||||
router.replace('/login')
|
||||
}
|
||||
}
|
||||
})
|
||||
|
|
@ -67,7 +53,7 @@ export default {
|
|||
addData,
|
||||
ok,
|
||||
open
|
||||
};
|
||||
}
|
||||
}
|
||||
};
|
||||
}
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -4,8 +4,8 @@
|
|||
<span class="jump-page-header-logo">博云</span>
|
||||
<span class="jump-page-header-title">一体化云管理平台</span>
|
||||
<div class="jump-page-header-right">
|
||||
<el-avatar :size="30" :src="userData.portrait"></el-avatar>
|
||||
<span class="login-user">{{userData.name}}</span>
|
||||
<el-avatar :size="30" :src="userData.portrait"></el-avatar>
|
||||
<span class="login-user">{{ userData.name }}</span>
|
||||
</div>
|
||||
</el-header>
|
||||
<el-main class="jump-page-container" :style="style">
|
||||
|
|
@ -35,46 +35,47 @@ const style = {
|
|||
}
|
||||
const store = useStore()
|
||||
// const pageConfigs = computed(() => store.getters.pageConfig)
|
||||
const userData = computed(() => store.getters.userData || {});
|
||||
const userData = computed(() => store.getters.userData || {})
|
||||
type IPlatform = {
|
||||
title: string,
|
||||
logo: string,
|
||||
title: string
|
||||
logo: string
|
||||
counts: any[]
|
||||
}
|
||||
const platformList = ref<IPlatform[]>([]);
|
||||
const platformList = ref<IPlatform[]>([])
|
||||
// 获取数据
|
||||
(async function(){
|
||||
const { data } = await axios.get('/cof-web/platform.json')
|
||||
platformList.value = data;
|
||||
})();
|
||||
;(async function () {
|
||||
const { data } = await axios.get('/cof-web/platform.json')
|
||||
platformList.value = data
|
||||
})()
|
||||
// 获取配置信息
|
||||
let paasUrl = '', hongUrl = '';
|
||||
(async function () {
|
||||
const data = await getSystemConfigs({ codes: 'passUrl,passUserName,passPwd,winhongUrl' })
|
||||
if (data.success) {
|
||||
const { passUrl, passUserName, passPwd, winhongUrl } = data.data;
|
||||
hongUrl = winhongUrl
|
||||
paasUrl = `${passUrl}/#/?userName=${passUserName}&passWord=${btoa(passPwd)}`
|
||||
}
|
||||
})();
|
||||
let paasUrl = '',
|
||||
hongUrl = ''
|
||||
;(async function () {
|
||||
const data = await getSystemConfigs({ codes: 'passUrl,passUserName,passPwd,winhongUrl' })
|
||||
if (data.success) {
|
||||
const { passUrl, passUserName, passPwd, winhongUrl } = data.data
|
||||
hongUrl = winhongUrl
|
||||
paasUrl = `${passUrl}/#/?userName=${passUserName}&passWord=${btoa(passPwd)}`
|
||||
}
|
||||
})()
|
||||
const router = useRouter()
|
||||
function goPage(logo: string) {
|
||||
switch(logo) {
|
||||
switch (logo) {
|
||||
case 'cmp':
|
||||
router.push('/sms-web/resource_dashboard');
|
||||
break;
|
||||
router.push('/sms-web/resource_dashboard')
|
||||
break
|
||||
case 'paas':
|
||||
window.open(paasUrl);
|
||||
break;
|
||||
window.open(paasUrl)
|
||||
break
|
||||
case 'winhong':
|
||||
goWinhong();
|
||||
break;
|
||||
goWinhong()
|
||||
break
|
||||
}
|
||||
}
|
||||
async function goWinhong(){
|
||||
const res = await getWinhongToken();
|
||||
if(res.success) {
|
||||
window.open(`${hongUrl}/api/user/loginBySessionId?sessionId=${res.data}`);
|
||||
async function goWinhong() {
|
||||
const res = await getWinhongToken()
|
||||
if (res.success) {
|
||||
window.open(`${hongUrl}/api/user/loginBySessionId?sessionId=${res.data}`)
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
|
@ -86,25 +87,25 @@ async function goWinhong(){
|
|||
display: flex;
|
||||
align-items: center;
|
||||
color: #fff;
|
||||
&-logo{
|
||||
&-logo {
|
||||
// height: 80%;
|
||||
font-size: 18px;
|
||||
font-weight: bold;
|
||||
letter-spacing: 2px;
|
||||
}
|
||||
&-title{
|
||||
&-title {
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
color: #FFFFFF;
|
||||
color: #ffffff;
|
||||
margin-left: 40px;
|
||||
}
|
||||
&-right{
|
||||
&-right {
|
||||
flex: 1;
|
||||
padding-right: 40px;
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
align-items: center;
|
||||
& > .login-user{
|
||||
& > .login-user {
|
||||
margin-left: 12px;
|
||||
}
|
||||
}
|
||||
|
|
@ -122,7 +123,7 @@ async function goWinhong(){
|
|||
height: 597px;
|
||||
padding: 82px 0 103px 0;
|
||||
box-sizing: border-box;
|
||||
background: url('/static/img/jump/card_bg.png') #DEEDFF;
|
||||
background: url('/static/img/jump/card_bg.png') #deedff;
|
||||
background-size: 100% 100%;
|
||||
// box-shadow: 0px 0px 4px 0px #9ac3f8;
|
||||
border-radius: 4px 4px 4px 4px;
|
||||
|
|
@ -132,7 +133,7 @@ async function goWinhong(){
|
|||
cursor: pointer;
|
||||
opacity: 0.8;
|
||||
&:hover {
|
||||
background: url('/static/img/jump/card_bg_select.png');
|
||||
background: url('/static/img/jump/card_bg_select.png');
|
||||
.platform-card-title {
|
||||
color: #0083ff;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -3,29 +3,11 @@
|
|||
<div class="lock-center">
|
||||
<img class="logo" :src="userData.portrait" />
|
||||
<p class="account">{{ userData.name }}</p>
|
||||
<el-form
|
||||
:model="loginForm"
|
||||
ref="loginFormRef"
|
||||
@keyup.enter.prevent="handleLogin"
|
||||
@submit.prevent
|
||||
>
|
||||
<el-form-item
|
||||
prop="password"
|
||||
:rules="[{ ...required, message: '请输入密码' }]"
|
||||
class="form-item-wrapper"
|
||||
>
|
||||
<el-input
|
||||
type="password"
|
||||
v-model="loginForm.password"
|
||||
placeholder="请输入密码"
|
||||
show-password
|
||||
>
|
||||
<el-form :model="loginForm" ref="loginFormRef" @keyup.enter.prevent="handleLogin" @submit.prevent>
|
||||
<el-form-item prop="password" :rules="[{ ...required, message: '请输入密码' }]" class="form-item-wrapper">
|
||||
<el-input type="password" v-model="loginForm.password" placeholder="请输入密码" show-password>
|
||||
<template #append>
|
||||
<el-button
|
||||
class="text-white login-btn"
|
||||
@click="handleLogin()"
|
||||
:loading="loading"
|
||||
>
|
||||
<el-button class="text-white login-btn" @click="handleLogin()" :loading="loading">
|
||||
<template #icon>
|
||||
<el-icon><IconEpRight /></el-icon>
|
||||
</template>
|
||||
|
|
@ -49,101 +31,93 @@
|
|||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import dayjs from "utils/day";
|
||||
import { encrypt } from "utils/crypto";
|
||||
import { useStore } from "vuex";
|
||||
import { useRouter } from "vue-router";
|
||||
import { login } from "services";
|
||||
import {
|
||||
computed,
|
||||
defineComponent,
|
||||
onMounted,
|
||||
onUnmounted,
|
||||
reactive,
|
||||
ref,
|
||||
toRefs
|
||||
} from "vue";
|
||||
import setLoginData from "./tools";
|
||||
import { required } from "@/validate";
|
||||
import dayjs from 'utils/day'
|
||||
import { encrypt } from 'utils/crypto'
|
||||
import { useStore } from 'vuex'
|
||||
import { useRouter } from 'vue-router'
|
||||
import { login } from 'services'
|
||||
import { computed, defineComponent, onMounted, onUnmounted, reactive, ref, toRefs } from 'vue'
|
||||
import setLoginData from './tools'
|
||||
import { required } from '@/validate'
|
||||
|
||||
export default defineComponent({
|
||||
setup() {
|
||||
const state = reactive({
|
||||
loginForm: {
|
||||
password: ""
|
||||
password: ''
|
||||
},
|
||||
loading: false
|
||||
});
|
||||
let timer: any = 0;
|
||||
const store = useStore();
|
||||
const userData = computed(() => store.getters.userData || {});
|
||||
})
|
||||
let timer: any = 0
|
||||
const store = useStore()
|
||||
const userData = computed(() => store.getters.userData || {})
|
||||
// 当前时间设置
|
||||
const currentTime = ref({
|
||||
time: "",
|
||||
date: ""
|
||||
});
|
||||
time: '',
|
||||
date: ''
|
||||
})
|
||||
function setTimer() {
|
||||
const getTime = () => {
|
||||
const time = dayjs();
|
||||
const time = dayjs()
|
||||
currentTime.value = {
|
||||
time: time.format("HH:mm:ss"),
|
||||
date: `${time.format("MM月DD日")}, ${time.format("dddd")}`
|
||||
};
|
||||
};
|
||||
getTime();
|
||||
time: time.format('HH:mm:ss'),
|
||||
date: `${time.format('MM月DD日')}, ${time.format('dddd')}`
|
||||
}
|
||||
}
|
||||
getTime()
|
||||
timer = setInterval(() => {
|
||||
getTime();
|
||||
}, 1000);
|
||||
getTime()
|
||||
}, 1000)
|
||||
}
|
||||
let lockData = {
|
||||
isLock: false,
|
||||
path: ""
|
||||
};
|
||||
path: ''
|
||||
}
|
||||
onMounted(() => {
|
||||
const lockDataItem = localStorage.getItem("lockData");
|
||||
if (lockDataItem) lockData = JSON.parse(lockDataItem);
|
||||
const lockDataItem = localStorage.getItem('lockData')
|
||||
if (lockDataItem) lockData = JSON.parse(lockDataItem)
|
||||
// 处理通过路由进入锁屏
|
||||
localStorage.setItem(
|
||||
"lockData",
|
||||
'lockData',
|
||||
JSON.stringify({
|
||||
...lockData,
|
||||
isLock: true
|
||||
})
|
||||
);
|
||||
setTimer();
|
||||
});
|
||||
)
|
||||
setTimer()
|
||||
})
|
||||
onUnmounted(() => {
|
||||
clearInterval(timer);
|
||||
});
|
||||
clearInterval(timer)
|
||||
})
|
||||
function switchUser() {
|
||||
store.dispatch("permission/ResetRoutes");
|
||||
store.dispatch('permission/ResetRoutes')
|
||||
}
|
||||
const loginFormRef = ref();
|
||||
const router = useRouter();
|
||||
const loginFormRef = ref()
|
||||
const router = useRouter()
|
||||
async function handleLogin() {
|
||||
const { validate } = loginFormRef.value as any;
|
||||
const { validate } = loginFormRef.value as any
|
||||
validate(async (valid: boolean) => {
|
||||
if(!valid) return;
|
||||
state.loading = true;
|
||||
if (!valid) return
|
||||
state.loading = true
|
||||
const res = await login({
|
||||
account: userData.value.account,
|
||||
password: encrypt(state.loginForm.password),
|
||||
isManager: true
|
||||
});
|
||||
})
|
||||
if (res.success) {
|
||||
setLoginData(res.data);
|
||||
router.replace(lockData.path);
|
||||
store.commit("SET_OPERATETIME");
|
||||
setLoginData(res.data)
|
||||
router.replace(lockData.path)
|
||||
store.commit('SET_OPERATETIME')
|
||||
localStorage.setItem(
|
||||
"lockData",
|
||||
'lockData',
|
||||
JSON.stringify({
|
||||
...lockData,
|
||||
isLock: false
|
||||
})
|
||||
);
|
||||
)
|
||||
}
|
||||
state.loading = false;
|
||||
});
|
||||
state.loading = false
|
||||
})
|
||||
}
|
||||
return {
|
||||
...toRefs(state),
|
||||
|
|
@ -153,9 +127,9 @@ export default defineComponent({
|
|||
required,
|
||||
switchUser,
|
||||
handleLogin
|
||||
};
|
||||
}
|
||||
}
|
||||
});
|
||||
})
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
|
|
@ -165,7 +139,7 @@ export default defineComponent({
|
|||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: url("/web-common-resource/img/lock_wrapper.jpg") #1c2b36 no-repeat;
|
||||
background: url('/web-common-resource/img/lock_wrapper.jpg') #1c2b36 no-repeat;
|
||||
background-size: 100%;
|
||||
.lock-center {
|
||||
position: absolute;
|
||||
|
|
|
|||
|
|
@ -2,9 +2,7 @@
|
|||
<div
|
||||
class="login-container"
|
||||
:style="{
|
||||
backgroundImage: `url(${
|
||||
configs.loginBg || '/web-common-resource/img/bg_login.png'
|
||||
})`
|
||||
backgroundImage: `url(${configs.loginBg || '/web-common-resource/img/bg_login.png'})`
|
||||
}"
|
||||
>
|
||||
<div class="login-logo">
|
||||
|
|
@ -15,25 +13,10 @@
|
|||
<span class="desc-title">{{ configs.promotionalTitle }}</span>
|
||||
<span class="desc-remark">{{ configs.promotionalContent }}</span>
|
||||
</div>
|
||||
<el-form
|
||||
:model="loginForm"
|
||||
ref="loginFormRef"
|
||||
label-position="left"
|
||||
label-width="0px"
|
||||
class="card-box login-form"
|
||||
@keyup.enter="handleLogin"
|
||||
>
|
||||
<el-form :model="loginForm" ref="loginFormRef" label-position="left" label-width="0px" class="card-box login-form" @keyup.enter="handleLogin">
|
||||
<div class="login-title">账号登录</div>
|
||||
<el-form-item
|
||||
class="login-form-item"
|
||||
prop="account"
|
||||
:rules="[{ ...required, message: '请输入用户名' }]"
|
||||
>
|
||||
<el-input
|
||||
v-model="loginForm.account"
|
||||
autocomplete="off"
|
||||
placeholder="登录账户"
|
||||
>
|
||||
<el-form-item class="login-form-item" prop="account" :rules="[{ ...required, message: '请输入用户名' }]">
|
||||
<el-input v-model="loginForm.account" autocomplete="off" placeholder="登录账户">
|
||||
<template #prefix>
|
||||
<el-icon>
|
||||
<icon-ep-user />
|
||||
|
|
@ -41,24 +24,9 @@
|
|||
</template>
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
<el-tooltip
|
||||
:visible="capsTooltip"
|
||||
content="大写锁定已打开"
|
||||
placement="right"
|
||||
:manual="true"
|
||||
>
|
||||
<el-form-item
|
||||
class="login-form-item"
|
||||
prop="password"
|
||||
:rules="[{ ...required, message: '请输入密码' }]"
|
||||
>
|
||||
<el-input
|
||||
show-password
|
||||
v-model="loginForm.password"
|
||||
placeholder="密码"
|
||||
@blur="capsTooltip = false"
|
||||
@keyup="checkCapslock"
|
||||
>
|
||||
<el-tooltip :visible="capsTooltip" content="大写锁定已打开" placement="right" :manual="true">
|
||||
<el-form-item class="login-form-item" prop="password" :rules="[{ ...required, message: '请输入密码' }]">
|
||||
<el-input show-password v-model="loginForm.password" placeholder="密码" @blur="capsTooltip = false" @keyup="checkCapslock">
|
||||
<template #prefix>
|
||||
<el-icon><icon-ep-lock /></el-icon>
|
||||
</template>
|
||||
|
|
@ -71,22 +39,10 @@
|
|||
<el-switch v-model="remember"></el-switch>
|
||||
<span class="m-l-xs">记住密码</span>
|
||||
</span>
|
||||
<a
|
||||
:href="`mailto:${configs.helpInformationLink}`"
|
||||
type="text"
|
||||
class="text-info help-info"
|
||||
:title="configs.helpInformationContent"
|
||||
>{{ configs.helpInformationContent }}</a
|
||||
>
|
||||
<a :href="`mailto:${configs.helpInformationLink}`" type="text" class="text-info help-info" :title="configs.helpInformationContent">{{ configs.helpInformationContent }}</a>
|
||||
</div>
|
||||
</el-form-item>
|
||||
<el-button
|
||||
class="login-btn"
|
||||
type="primary"
|
||||
:loading="loading"
|
||||
@click="handleLogin"
|
||||
>登录</el-button
|
||||
>
|
||||
<el-button class="login-btn" type="primary" :loading="loading" @click="handleLogin">登录</el-button>
|
||||
</el-form>
|
||||
</div>
|
||||
<div class="copyright-info">{{ configs.copyrightInformation }}</div>
|
||||
|
|
@ -94,88 +50,83 @@
|
|||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { decrypt, encrypt } from "utils/crypto";
|
||||
import { login } from "services";
|
||||
import { useStore } from "vuex";
|
||||
import { useRouter, useRoute } from "vue-router";
|
||||
import setLoginData from "./tools";
|
||||
import { required } from "@/validate";
|
||||
import type { FormInstance } from "element-plus";
|
||||
import { decrypt, encrypt } from 'utils/crypto'
|
||||
import { login } from 'services'
|
||||
import { useStore } from 'vuex'
|
||||
import { useRouter, useRoute } from 'vue-router'
|
||||
import setLoginData from './tools'
|
||||
import { required } from '@/validate'
|
||||
import type { FormInstance } from 'element-plus'
|
||||
|
||||
const loginForm = reactive({
|
||||
account: "",
|
||||
password: ""
|
||||
});
|
||||
const remember = ref(false);
|
||||
const loading = ref(false);
|
||||
const capsTooltip = ref(false);
|
||||
account: '',
|
||||
password: ''
|
||||
})
|
||||
const remember = ref(false)
|
||||
const loading = ref(false)
|
||||
const capsTooltip = ref(false)
|
||||
|
||||
const store = useStore();
|
||||
const configs = computed(() => store.getters.pageConfig);
|
||||
const appConfigs = computed(() => store.getters.appConfigs);
|
||||
const loginFormRef = ref<FormInstance>();
|
||||
const store = useStore()
|
||||
const configs = computed(() => store.getters.pageConfig)
|
||||
const appConfigs = computed(() => store.getters.appConfigs)
|
||||
const loginFormRef = ref<FormInstance>()
|
||||
const init = () => {
|
||||
const local = localStorage.getItem("cmcLoginData");
|
||||
const local = localStorage.getItem('cmcLoginData')
|
||||
if (local) {
|
||||
const obj = JSON.parse(local);
|
||||
loginForm.account = obj.account;
|
||||
loginForm.password = decrypt(obj.password);
|
||||
remember.value = true;
|
||||
const obj = JSON.parse(local)
|
||||
loginForm.account = obj.account
|
||||
loginForm.password = decrypt(obj.password)
|
||||
remember.value = true
|
||||
}
|
||||
};
|
||||
init();
|
||||
const router = useRouter();
|
||||
const route = useRoute();
|
||||
}
|
||||
init()
|
||||
const router = useRouter()
|
||||
const route = useRoute()
|
||||
function goLogin(data: any) {
|
||||
setLoginData(data);
|
||||
setLoginData(data)
|
||||
if (unref(remember)) {
|
||||
const obj = {
|
||||
account: loginForm.account,
|
||||
password: encrypt(loginForm.password)
|
||||
};
|
||||
localStorage.setItem("cmcLoginData", JSON.stringify(obj));
|
||||
}
|
||||
localStorage.setItem('cmcLoginData', JSON.stringify(obj))
|
||||
} else {
|
||||
localStorage.removeItem("cmcLoginData");
|
||||
localStorage.removeItem('cmcLoginData')
|
||||
}
|
||||
const { redirect } = route.query;
|
||||
const path = redirect
|
||||
? (redirect as string).split("/#")[1]
|
||||
: appConfigs.value.homePath;
|
||||
router.replace(path);
|
||||
localStorage.removeItem("lockData");
|
||||
const { redirect } = route.query
|
||||
const path = redirect ? (redirect as string).split('/#')[1] : appConfigs.value.homePath
|
||||
router.replace(path)
|
||||
localStorage.removeItem('lockData')
|
||||
}
|
||||
function handleLogin() {
|
||||
if(!loginFormRef.value) return;
|
||||
loginFormRef.value.validate(async (valid) => {
|
||||
if (!loginFormRef.value) return
|
||||
loginFormRef.value.validate(async valid => {
|
||||
if (valid) {
|
||||
loading.value = true;
|
||||
const { account, password } = loginForm;
|
||||
loading.value = true
|
||||
const { account, password } = loginForm
|
||||
const res = await login({
|
||||
account,
|
||||
password: encrypt(password),
|
||||
isManager: true
|
||||
});
|
||||
})
|
||||
if (res.success) {
|
||||
goLogin(res.data);
|
||||
goLogin(res.data)
|
||||
}
|
||||
loading.value = false;
|
||||
loading.value = false
|
||||
}
|
||||
});
|
||||
})
|
||||
}
|
||||
|
||||
function checkCapslock({ shiftKey, key }: { shiftKey: boolean, key: string}) {
|
||||
function checkCapslock({ shiftKey, key }: { shiftKey: boolean; key: string }) {
|
||||
if (key && key.length === 1) {
|
||||
if (
|
||||
(shiftKey && key >= "a" && key <= "z") ||
|
||||
(!shiftKey && key >= "A" && key <= "Z")
|
||||
) {
|
||||
capsTooltip.value = true;
|
||||
if ((shiftKey && key >= 'a' && key <= 'z') || (!shiftKey && key >= 'A' && key <= 'Z')) {
|
||||
capsTooltip.value = true
|
||||
} else {
|
||||
capsTooltip.value = false;
|
||||
capsTooltip.value = false
|
||||
}
|
||||
}
|
||||
if (key === "CapsLock" && unref(capsTooltip) === true) {
|
||||
capsTooltip.value = false;
|
||||
if (key === 'CapsLock' && unref(capsTooltip) === true) {
|
||||
capsTooltip.value = false
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
|
@ -185,7 +136,7 @@ function checkCapslock({ shiftKey, key }: { shiftKey: boolean, key: string}) {
|
|||
display: flex;
|
||||
flex-direction: column;
|
||||
height: 100vh;
|
||||
background: url("/web-common-resource/img/bg_login.png") #2d3a4b no-repeat;
|
||||
background: url('/web-common-resource/img/bg_login.png') #2d3a4b no-repeat;
|
||||
background-size: cover;
|
||||
.login-logo {
|
||||
padding: 5px 40px;
|
||||
|
|
|
|||
|
|
@ -1,28 +1,28 @@
|
|||
{
|
||||
"compilerOptions": {
|
||||
"baseUrl": ".",
|
||||
"target": "ESNext",
|
||||
"useDefineForClassFields": true,
|
||||
"module": "ESNext",
|
||||
"moduleResolution": "Node",
|
||||
"strict": true,
|
||||
"jsx": "preserve",
|
||||
"allowJs": true,
|
||||
"sourceMap": true,
|
||||
"resolveJsonModule": true,
|
||||
"isolatedModules": true,
|
||||
"esModuleInterop": true,
|
||||
"lib": ["ESNext", "DOM"],
|
||||
"skipLibCheck": true,
|
||||
"paths": {
|
||||
"@/*": ["./src/*"],
|
||||
"services/*": ["src/services/*"],
|
||||
"utils/*": ["src/utils/*"],
|
||||
"components/*": ["src/components/*"],
|
||||
"hooks/*": ["src/hooks/*"],
|
||||
"filters/*": ["src/filters/*"]
|
||||
}
|
||||
},
|
||||
"include": ["src/**/*.ts", "src/**/*.d.ts", "src/**/*.tsx", "src/**/*.vue"],
|
||||
"references": [{ "path": "./tsconfig.node.json" }]
|
||||
}
|
||||
"compilerOptions": {
|
||||
"baseUrl": ".",
|
||||
"target": "ESNext",
|
||||
"useDefineForClassFields": true,
|
||||
"module": "ESNext",
|
||||
"moduleResolution": "Node",
|
||||
"strict": true,
|
||||
"jsx": "preserve",
|
||||
"allowJs": true,
|
||||
"sourceMap": true,
|
||||
"resolveJsonModule": true,
|
||||
"isolatedModules": true,
|
||||
"esModuleInterop": true,
|
||||
"lib": ["ESNext", "DOM"],
|
||||
"skipLibCheck": true,
|
||||
"paths": {
|
||||
"@/*": ["./src/*"],
|
||||
"services/*": ["src/services/*"],
|
||||
"utils/*": ["src/utils/*"],
|
||||
"components/*": ["src/components/*"],
|
||||
"hooks/*": ["src/hooks/*"],
|
||||
"filters/*": ["src/filters/*"]
|
||||
}
|
||||
},
|
||||
"include": ["src/**/*.ts", "src/**/*.d.ts", "src/**/*.tsx", "src/**/*.vue"],
|
||||
"references": [{ "path": "./tsconfig.node.json" }]
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,9 +1,9 @@
|
|||
{
|
||||
"compilerOptions": {
|
||||
"composite": true,
|
||||
"module": "ESNext",
|
||||
"moduleResolution": "Node",
|
||||
"allowSyntheticDefaultImports": true
|
||||
},
|
||||
"include": ["vite.config.ts", "build/*.ts"]
|
||||
}
|
||||
"compilerOptions": {
|
||||
"composite": true,
|
||||
"module": "ESNext",
|
||||
"moduleResolution": "Node",
|
||||
"allowSyntheticDefaultImports": true
|
||||
},
|
||||
"include": ["vite.config.ts", "build/*.ts"]
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue