update code
parent
ff2495ebeb
commit
d5f9911e17
|
@ -1,12 +1,12 @@
|
||||||
<!doctype html>
|
<!doctype html>
|
||||||
<html lang="en">
|
<html lang="en" class="dark">
|
||||||
<head>
|
<head>
|
||||||
<meta charset="UTF-8" />
|
<meta charset="UTF-8" />
|
||||||
<link rel="icon" href="favicon.ico" />
|
<link rel="icon" href="favicon.ico" />
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||||
<title>算法测试验证软件平台</title>
|
<title>算法测试验证软件平台</title>
|
||||||
<!--
|
<!--
|
||||||
<link rel="stylesheet" data-for="result" href="css/v2.css?v=20241008"/>
|
<link rel="stylesheet" data-for="result" href="css/v2.css?v=20241220"/>
|
||||||
<script>
|
<script>
|
||||||
window.isV2=true
|
window.isV2=true
|
||||||
</script>
|
</script>
|
||||||
|
|
|
@ -42,3 +42,19 @@
|
||||||
use[aria-labelledby="icon-web"] path{
|
use[aria-labelledby="icon-web"] path{
|
||||||
fill:red !important;
|
fill:red !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
html.dark #app .el-header{
|
||||||
|
background: transparent;
|
||||||
|
color: #fff;
|
||||||
|
height: 84px;
|
||||||
|
}
|
||||||
|
html.dark #app .el-aside{
|
||||||
|
background: transparent;
|
||||||
|
border-top: #000 10px solid;
|
||||||
|
}
|
||||||
|
|
||||||
|
html.dark #app .el-aside .el-menu .router-link-active .el-menu-item{
|
||||||
|
background-color: transparent;
|
||||||
|
color: #333;
|
||||||
|
border-right-color: #3894FF;
|
||||||
|
}
|
||||||
|
|
93
src/App.vue
93
src/App.vue
|
@ -77,3 +77,96 @@ const fontColor = computed(() => {
|
||||||
color: var(--el-color-primary);
|
color: var(--el-color-primary);
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
||||||
|
<style lang="scss">
|
||||||
|
html.dark {
|
||||||
|
.dashboard-container {
|
||||||
|
.top-row1 {
|
||||||
|
.top-row {
|
||||||
|
.div-title {
|
||||||
|
color: #3399ff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.div-num {
|
||||||
|
color: #aaa
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.top-row2 {
|
||||||
|
.dev-item {
|
||||||
|
.el-card {
|
||||||
|
background: #304156;
|
||||||
|
|
||||||
|
.dev-title {
|
||||||
|
svg * {
|
||||||
|
fill: #fff !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-card__body {
|
||||||
|
background: #263445;
|
||||||
|
color: #aaa;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.right-panel {
|
||||||
|
.top-row2.notice-card {
|
||||||
|
.el-card__header {
|
||||||
|
border-bottom: 1px solid #5e6572;
|
||||||
|
|
||||||
|
div {
|
||||||
|
color: #fff !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.notice-item {
|
||||||
|
.row-1 {
|
||||||
|
color: #aaa !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.row-2 {
|
||||||
|
border-bottom: 1px solid #5e6572 !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
.proc-card{
|
||||||
|
.el-card__header{
|
||||||
|
.row2-top{
|
||||||
|
div{
|
||||||
|
color:#fff !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.el-card__body{
|
||||||
|
background: transparent;
|
||||||
|
color:#aaa;
|
||||||
|
.el-badge__content--danger{
|
||||||
|
background: #6F89A6;
|
||||||
|
width: 24px;
|
||||||
|
height: 24px;
|
||||||
|
text-align: center;
|
||||||
|
line-height: 24px;
|
||||||
|
border-radius: 12px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.proc-card.server-status{
|
||||||
|
background: #263445;
|
||||||
|
.el-card__header{
|
||||||
|
.row2-top{
|
||||||
|
div{
|
||||||
|
color:#fff !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
|
@ -1,30 +1,29 @@
|
||||||
<template>
|
<template>
|
||||||
<div class="flex" style="height: 100%;align-items: center;">
|
<div class="flex nav-bar-right" style="height: 100%;align-items: center;">
|
||||||
<div style="flex-grow: 1;display: flex;align-items: center;padding-top: 3px;" >
|
<div style="flex-grow: 1;display: flex;align-items: center;padding-top: 3px;">
|
||||||
<span style="position: relative;" class="logo-small1">
|
<span style="position: relative;" class="logo-small1">
|
||||||
<img src="@/assets/logo2.png" class="logo-image" />
|
<img src="@/assets/logo2.png" class="logo-image" />
|
||||||
<span class="logo-title" style="position: absolute;font-weight: bold;font-size: 14px;color: #003F88;left: 0;bottom: -13px;white-space: nowrap;">中国航天</span>
|
<span class="logo-title"
|
||||||
|
style="position: absolute;font-weight: bold;font-size: 14px;left: 0;bottom: -13px;white-space: nowrap;">中国航天</span>
|
||||||
</span>
|
</span>
|
||||||
<span style="margin-left: 20px;margin-top: 10px;font-size: 12px;font-weight: bold;" class="logo-title2">
|
<span style="margin-left: 20px;margin-top: 10px;font-size: 12px;font-weight: bold;" class="logo-title2">
|
||||||
<div class="logo-title" style="font-weight: bold;font-size: 22px;color:#003F88"> {{ "中国航天某某某某研究院" }}</div>
|
<div class="logo-title" style="font-weight: bold;font-size: 22px;"> {{ "中国航天某某某某研究院" }}</div>
|
||||||
<div >China Aerospace XXXX Research Institute</div>
|
<div class="logo-sub-title">China Aerospace XXXX Research Institute</div>
|
||||||
</span>
|
</span>
|
||||||
<span class="logo-title" style="font-weight: bold;font-size: 28px;margin-left: auto;margin-right: auto;color:#101010">算法测试验证软件平台</span>
|
<span class="logo-title"
|
||||||
|
style="font-weight: bold;font-size: 28px;margin-left: auto;margin-right: auto;">算法测试验证软件平台</span>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
|
<el-switch v-model="isDark" inline-prompt active-icon="Moon" inactive-icon="Sunny" @change="toggleTheme" />
|
||||||
<!--全屏 -->
|
<!--全屏 -->
|
||||||
<div class="setting-item" @click="toggle">
|
<div class="setting-item" @click="toggle">
|
||||||
<svg-icon
|
<svg-icon :icon-class="isFullscreen ? 'fullscreen-exit' : 'fullscreen'" />
|
||||||
:icon-class="isFullscreen ? 'fullscreen-exit' : 'fullscreen'"
|
|
||||||
/>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- 用户头像 -->
|
<!-- 用户头像 -->
|
||||||
<el-dropdown class="setting-item" trigger="click">
|
<el-dropdown class="setting-item" trigger="click">
|
||||||
<div class="flex-center h100% p10px">
|
<div class="flex-center h100% p10px">
|
||||||
<img src="@/assets/images/avatar.png"
|
<img src="@/assets/images/avatar.png" class="rounded-full mr-10px w24px w24px" />
|
||||||
class="rounded-full mr-10px w24px w24px"
|
|
||||||
/>
|
|
||||||
<!-- :src="userStore.user.avatar + '?imageView2/1/w/80/h/80'" -->
|
<!-- :src="userStore.user.avatar + '?imageView2/1/w/80/h/80'" -->
|
||||||
<span>{{ userStore.user.username }}</span>
|
<span>{{ userStore.user.username }}</span>
|
||||||
</div>
|
</div>
|
||||||
|
@ -54,18 +53,24 @@ import md5 from 'js-md5';
|
||||||
import defaultSettings from "@/settings";
|
import defaultSettings from "@/settings";
|
||||||
import UserAPI from "@/api/myUser";
|
import UserAPI from "@/api/myUser";
|
||||||
import { DeviceEnum } from "@/enums/DeviceEnum";
|
import { DeviceEnum } from "@/enums/DeviceEnum";
|
||||||
|
import { ThemeEnum } from "@/enums/ThemeEnum";
|
||||||
const appStore = useAppStore();
|
const appStore = useAppStore();
|
||||||
const tagsViewStore = useTagsViewStore();
|
const tagsViewStore = useTagsViewStore();
|
||||||
|
// Stores
|
||||||
const userStore = useUserStore();
|
const userStore = useUserStore();
|
||||||
const settingStore = useSettingsStore();
|
const settingsStore = useSettingsStore();
|
||||||
|
|
||||||
const route = useRoute();
|
const route = useRoute();
|
||||||
const router = useRouter();
|
const router = useRouter();
|
||||||
|
|
||||||
const isMobile = computed(() => appStore.device === DeviceEnum.MOBILE);
|
const isMobile = computed(() => appStore.device === DeviceEnum.MOBILE);
|
||||||
|
const isDark = ref(settingsStore.theme === ThemeEnum.DARK);
|
||||||
const { isFullscreen, toggle } = useFullscreen();
|
const { isFullscreen, toggle } = useFullscreen();
|
||||||
|
const toggleTheme = () => {
|
||||||
|
const newTheme =
|
||||||
|
settingsStore.theme === ThemeEnum.DARK ? ThemeEnum.LIGHT : ThemeEnum.DARK;
|
||||||
|
settingsStore.changeTheme(newTheme);
|
||||||
|
};
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 注销
|
* 注销
|
||||||
|
@ -111,8 +116,13 @@ function resetPassword() {
|
||||||
}
|
}
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
<style lang="scss" scoped>
|
<style lang="scss">
|
||||||
.setting-item {
|
.nav-bar-right {
|
||||||
|
.logo-title {
|
||||||
|
color: #003F88;
|
||||||
|
}
|
||||||
|
|
||||||
|
.setting-item {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
min-width: 40px;
|
min-width: 40px;
|
||||||
height: $navbar-height;
|
height: $navbar-height;
|
||||||
|
@ -124,20 +134,39 @@ function resetPassword() {
|
||||||
&:hover {
|
&:hover {
|
||||||
background: rgb(0 0 0 / 10%);
|
background: rgb(0 0 0 / 10%);
|
||||||
}
|
}
|
||||||
}
|
|
||||||
.logo-image {
|
}
|
||||||
|
|
||||||
|
.logo-image {
|
||||||
width: 50px;
|
width: 50px;
|
||||||
//height: 68px;
|
//height: 68px;
|
||||||
}
|
}
|
||||||
.layout-top,
|
|
||||||
.layout-mix {
|
.layout-top,
|
||||||
|
.layout-mix {
|
||||||
|
|
||||||
.setting-item,
|
.setting-item,
|
||||||
.el-icon {
|
.el-icon {
|
||||||
color: var(--el-color-white);
|
color: var(--el-color-white);
|
||||||
}
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.dark .setting-item:hover {
|
.dark .setting-item:hover {
|
||||||
background: rgb(255 255 255 / 20%);
|
background: rgb(255 255 255 / 20%);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
html.dark {
|
||||||
|
.nav-bar-right {
|
||||||
|
.logo-image{
|
||||||
|
filter: saturate(500%);
|
||||||
|
}
|
||||||
|
.logo-sub-title{
|
||||||
|
color: #4F9EFA;
|
||||||
|
}
|
||||||
|
.logo-title {
|
||||||
|
color: #4F9EFA;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
|
@ -1,30 +1,30 @@
|
||||||
<template>
|
<template>
|
||||||
<div class="flex" style="height: 100%;align-items: center;">
|
<div class="flex nav-bar-right2" style="height: 100%;align-items: center;">
|
||||||
<div style="flex-grow: 1;display: flex;align-items: center;padding-top: 3px;" >
|
<div style="flex-grow: 1;display: flex;align-items: center;padding-top: 3px;">
|
||||||
<span style="position: relative;" class="logo-small1">
|
<span style="position: relative;" class="logo-small1">
|
||||||
<img src="@/assets/logo2.png" class="logo-image" />
|
<img src="@/assets/logo2.png" class="logo-image" />
|
||||||
<span class="logo-title" style="position: absolute;font-weight: bold;font-size: 14px;color: #003F88;left: 0;bottom: -13px;white-space: nowrap;">中国航天</span>
|
<span class="logo-title"
|
||||||
|
style="position: absolute;font-weight: bold;font-size: 14px;left: 0;bottom: -13px;white-space: nowrap;">中国航天</span>
|
||||||
</span>
|
</span>
|
||||||
<span style="margin-left: 20px;margin-top: 10px;font-size: 12px;font-weight: bold;" class="logo-title2">
|
<span style="margin-left: 20px;margin-top: 10px;font-size: 12px;font-weight: bold;" class="logo-title2">
|
||||||
<div class="logo-title" style="font-weight: bold;font-size: 22px;color:#003F88"> {{ "中国航天某某某某研究院" }}</div>
|
<div class="logo-title" style="font-weight: bold;font-size: 22px;"> {{ "中国航天某某某某研究院" }}</div>
|
||||||
<div >China Aerospace XXXX Research Institute</div>
|
<div class="logo-title">China Aerospace XXXX Research Institute</div>
|
||||||
</span>
|
</span>
|
||||||
<span class="logo-title" style="font-weight: bold;font-size: 28px;margin-left: auto;margin-right: auto;color:#101010">算法测试验证软件平台</span>
|
<span class="logo-title"
|
||||||
|
style="font-weight: bold;font-size: 28px;margin-left: auto;margin-right: auto;">算法测试验证软件平台</span>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
|
<el-switch v-model="isDark" inline-prompt active-icon="Moon" inactive-icon="Sunny" @change="toggleTheme" />
|
||||||
|
<!--全屏 -->
|
||||||
<!--全屏 -->
|
<!--全屏 -->
|
||||||
<div class="setting-item" @click="toggle">
|
<div class="setting-item" @click="toggle">
|
||||||
<svg-icon
|
<svg-icon :icon-class="isFullscreen ? 'fullscreen-exit' : 'fullscreen'" />
|
||||||
:icon-class="isFullscreen ? 'fullscreen-exit' : 'fullscreen'"
|
|
||||||
/>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- 用户头像 -->
|
<!-- 用户头像 -->
|
||||||
<el-dropdown class="setting-item" trigger="click">
|
<el-dropdown class="setting-item" trigger="click">
|
||||||
<div class="flex-center h100% p10px">
|
<div class="flex-center h100% p10px">
|
||||||
<img src="@/assets/images/avatar.png"
|
<img src="@/assets/images/avatar.png" class="rounded-full mr-10px w24px w24px" />
|
||||||
class="rounded-full mr-10px w24px w24px"
|
|
||||||
/>
|
|
||||||
<!-- :src="userStore.user.avatar + '?imageView2/1/w/80/h/80'" -->
|
<!-- :src="userStore.user.avatar + '?imageView2/1/w/80/h/80'" -->
|
||||||
<span>{{ userStore.user.username }}</span>
|
<span>{{ userStore.user.username }}</span>
|
||||||
</div>
|
</div>
|
||||||
|
@ -54,18 +54,24 @@ import md5 from 'js-md5';
|
||||||
import defaultSettings from "@/settings";
|
import defaultSettings from "@/settings";
|
||||||
import UserAPI from "@/api/myUser";
|
import UserAPI from "@/api/myUser";
|
||||||
import { DeviceEnum } from "@/enums/DeviceEnum";
|
import { DeviceEnum } from "@/enums/DeviceEnum";
|
||||||
|
import { ThemeEnum } from "@/enums/ThemeEnum";
|
||||||
const appStore = useAppStore();
|
const appStore = useAppStore();
|
||||||
const tagsViewStore = useTagsViewStore();
|
const tagsViewStore = useTagsViewStore();
|
||||||
|
// Stores
|
||||||
const userStore = useUserStore();
|
const userStore = useUserStore();
|
||||||
const settingStore = useSettingsStore();
|
const settingsStore = useSettingsStore();
|
||||||
|
const isDark = ref(settingsStore.theme === ThemeEnum.DARK);
|
||||||
const route = useRoute();
|
const route = useRoute();
|
||||||
const router = useRouter();
|
const router = useRouter();
|
||||||
|
|
||||||
const isMobile = computed(() => appStore.device === DeviceEnum.MOBILE);
|
const isMobile = computed(() => appStore.device === DeviceEnum.MOBILE);
|
||||||
|
|
||||||
const { isFullscreen, toggle } = useFullscreen();
|
const { isFullscreen, toggle } = useFullscreen();
|
||||||
|
const toggleTheme = () => {
|
||||||
|
const newTheme =
|
||||||
|
settingsStore.theme === ThemeEnum.DARK ? ThemeEnum.LIGHT : ThemeEnum.DARK;
|
||||||
|
settingsStore.changeTheme(newTheme);
|
||||||
|
};
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 注销
|
* 注销
|
||||||
|
@ -111,8 +117,12 @@ function resetPassword() {
|
||||||
}
|
}
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
<style lang="scss" scoped>
|
<style lang="scss">
|
||||||
.setting-item {
|
.nav-bar-right2 {
|
||||||
|
.logo-title {
|
||||||
|
color: #003F88;
|
||||||
|
}
|
||||||
|
.setting-item {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
min-width: 40px;
|
min-width: 40px;
|
||||||
height: $navbar-height;
|
height: $navbar-height;
|
||||||
|
@ -124,20 +134,38 @@ function resetPassword() {
|
||||||
&:hover {
|
&:hover {
|
||||||
background: rgb(0 0 0 / 10%);
|
background: rgb(0 0 0 / 10%);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.logo-image {
|
|
||||||
|
.logo-image {
|
||||||
width: 50px;
|
width: 50px;
|
||||||
//height: 68px;
|
//height: 68px;
|
||||||
}
|
}
|
||||||
.layout-top,
|
|
||||||
.layout-mix {
|
.layout-top,
|
||||||
|
.layout-mix {
|
||||||
|
|
||||||
.setting-item,
|
.setting-item,
|
||||||
.el-icon {
|
.el-icon {
|
||||||
color: var(--el-color-white);
|
color: var(--el-color-white);
|
||||||
}
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.dark .setting-item:hover {
|
.dark .setting-item:hover {
|
||||||
background: rgb(255 255 255 / 20%);
|
background: rgb(255 255 255 / 20%);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
html.dark {
|
||||||
|
.nav-bar-right2 {
|
||||||
|
.logo-image{
|
||||||
|
filter: saturate(500%);
|
||||||
|
}
|
||||||
|
.logo-sub-title{
|
||||||
|
color: #4F9EFA;
|
||||||
|
}
|
||||||
|
.logo-title {
|
||||||
|
color: #4F9EFA;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
|
@ -1,8 +1,8 @@
|
||||||
<template>
|
<template>
|
||||||
<el-container class="wh-full main-container">
|
<el-container class="wh-full main-container">
|
||||||
<el-header>
|
<el-header>
|
||||||
<NavbarRight2 v-if="isNav2"/>
|
<NavbarRight2 v-if="isNav2" />
|
||||||
<NavbarRight v-else/>
|
<NavbarRight v-else />
|
||||||
</el-header>
|
</el-header>
|
||||||
<el-container class="center-container">
|
<el-container class="center-container">
|
||||||
<el-aside width="200px">
|
<el-aside width="200px">
|
||||||
|
@ -24,7 +24,7 @@ const width = useWindowSize().width;
|
||||||
const WIDTH_DESKTOP = 992; // 响应式布局容器固定宽度 大屏(>=1200px) 中屏(>=992px) 小屏(>=768px)
|
const WIDTH_DESKTOP = 992; // 响应式布局容器固定宽度 大屏(>=1200px) 中屏(>=992px) 小屏(>=768px)
|
||||||
const isMobile = computed(() => appStore.device === DeviceEnum.MOBILE);
|
const isMobile = computed(() => appStore.device === DeviceEnum.MOBILE);
|
||||||
const isOpenSidebar = computed(() => appStore.sidebar.opened);
|
const isOpenSidebar = computed(() => appStore.sidebar.opened);
|
||||||
let isNav2=ref(false)
|
let isNav2 = ref(false)
|
||||||
const activeTopMenuPath = computed(() => appStore.activeTopMenuPath); // 顶部菜单激活path
|
const activeTopMenuPath = computed(() => appStore.activeTopMenuPath); // 顶部菜单激活path
|
||||||
|
|
||||||
watch(
|
watch(
|
||||||
|
@ -51,50 +51,98 @@ watchEffect(() => {
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
||||||
onMounted(()=>{
|
onMounted(() => {
|
||||||
isNav2.value=location.href.indexOf("/home/index2")>=0
|
isNav2.value = location.href.indexOf("/home/index2") >= 0
|
||||||
});
|
});
|
||||||
|
|
||||||
const route = useRoute();
|
const route = useRoute();
|
||||||
watch(route, (a,b,c) => {
|
watch(route, (a, b, c) => {
|
||||||
isNav2.value=a.path=='/home/index2';
|
isNav2.value = a.path == '/home/index2';
|
||||||
if (isMobile.value && isOpenSidebar.value) {
|
if (isMobile.value && isOpenSidebar.value) {
|
||||||
appStore.closeSideBar();
|
appStore.closeSideBar();
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
<style lang="scss">
|
<style lang="scss">
|
||||||
.main-container{
|
.main-container {
|
||||||
background-color: #F3F8FB;
|
background-color: #F3F8FB;
|
||||||
|
|
||||||
.el-menu-item {
|
.el-menu-item {
|
||||||
&.is-active{
|
&.is-active {
|
||||||
background-color: #EEF3FB;
|
background-color: #EEF3FB;
|
||||||
border-right:solid 3px var(--el-color-primary);
|
border-right: solid 3px var(--el-color-primary);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.el-header{
|
|
||||||
|
.el-header {
|
||||||
background-color: #EEF7FE;
|
background-color: #EEF7FE;
|
||||||
}
|
}
|
||||||
.center-container{
|
|
||||||
padding-top:12px;
|
.center-container {
|
||||||
.el-aside{
|
padding-top: 12px;
|
||||||
|
|
||||||
|
.el-aside {
|
||||||
background-color: #fff;
|
background-color: #fff;
|
||||||
.el-scrollbar{
|
|
||||||
padding:12px;
|
.el-scrollbar {
|
||||||
|
padding: 12px;
|
||||||
}
|
}
|
||||||
.el-menu{
|
|
||||||
border-right:none;
|
.el-menu {
|
||||||
|
border-right: none;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.el-main{
|
|
||||||
padding:0px;
|
.el-main {
|
||||||
|
padding: 0px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
html.dark {
|
||||||
|
.main-container {
|
||||||
|
background-color: #304156;
|
||||||
|
.router-link-active{
|
||||||
|
background-color: #0A0A0A;
|
||||||
|
.el-menu-item {
|
||||||
|
background-color: #0A0A0A !important;
|
||||||
|
span.ml-1{
|
||||||
|
font-weight: bold;
|
||||||
|
color: #4F9EFA;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.el-menu-item {
|
||||||
|
background-color: #304156;
|
||||||
|
&.is-active {
|
||||||
|
background-color: #0A0A0A;
|
||||||
|
span.ml-1{
|
||||||
|
font-weight: bold;
|
||||||
|
color: #4F9EFA;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.el-sub-menu.is-active{
|
||||||
|
.el-sub-menu__title{
|
||||||
|
background-color: #2B3B4F;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-header {
|
||||||
|
background-color: #304156;
|
||||||
|
}
|
||||||
|
|
||||||
|
.center-container {
|
||||||
|
.el-aside {
|
||||||
|
background-color: #304156;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
|
|
||||||
|
|
||||||
.main-container {
|
.main-container {
|
||||||
position: relative;
|
position: relative;
|
||||||
min-height: 100%;
|
min-height: 100%;
|
||||||
|
|
|
@ -10,11 +10,18 @@
|
||||||
|
|
||||||
/** 暗黑主题 */
|
/** 暗黑主题 */
|
||||||
html.dark {
|
html.dark {
|
||||||
|
--el-bg-color-overlay:#263445;
|
||||||
--menu-background: var(--el-bg-color-overlay);
|
--menu-background: var(--el-bg-color-overlay);
|
||||||
--menu-text: #fff;
|
--menu-text: #fff;
|
||||||
--menu-active-text: var(--el-menu-active-color);
|
--menu-active-text: var(--el-menu-active-color);
|
||||||
--menu-hover: rgb(0 0 0 / 20%);
|
--menu-hover: rgb(0 0 0 / 20%);
|
||||||
--sidebar-logo-background: rgb(0 0 0 / 20%);
|
--sidebar-logo-background: rgb(0 0 0 / 20%);
|
||||||
|
.el-main{
|
||||||
|
background-color: #000;
|
||||||
|
}
|
||||||
|
.lf-graph{
|
||||||
|
background: transparent;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
$menu-background: var(--menu-background); // 菜单背景色
|
$menu-background: var(--menu-background); // 菜单背景色
|
||||||
|
|
|
@ -40,7 +40,7 @@ service.interceptors.response.use(
|
||||||
const { code, data, msg } = response.data;
|
const { code, data, msg } = response.data;
|
||||||
if (code === ResultEnum.SUCCESS) {
|
if (code === ResultEnum.SUCCESS) {
|
||||||
return response;
|
return response;
|
||||||
}else if (code === ResultEnum.TOKEN_INVALID) {
|
}else if (code === ResultEnum.TOKEN_INVALID || code==50) {
|
||||||
ElMessage.warning("登录状态已过期,请重新登录");
|
ElMessage.warning("登录状态已过期,请重新登录");
|
||||||
const userStore = useUserStoreHook();
|
const userStore = useUserStoreHook();
|
||||||
userStore.resetToken().then(() => {
|
userStore.resetToken().then(() => {
|
||||||
|
@ -55,7 +55,7 @@ service.interceptors.response.use(
|
||||||
// 异常处理
|
// 异常处理
|
||||||
if (error.response.data) {
|
if (error.response.data) {
|
||||||
const { code, msg } = error.response.data;
|
const { code, msg } = error.response.data;
|
||||||
if (code === ResultEnum.TOKEN_INVALID) {
|
if (code === ResultEnum.TOKEN_INVALID || code==50) {
|
||||||
ElMessageBox.confirm("当前页面已失效,请重新登录", "提示", {
|
ElMessageBox.confirm("当前页面已失效,请重新登录", "提示", {
|
||||||
confirmButtonText: "确定",
|
confirmButtonText: "确定",
|
||||||
cancelButtonText: "取消",
|
cancelButtonText: "取消",
|
||||||
|
|
|
@ -6,10 +6,10 @@
|
||||||
<svg-icon class="icon-warn" icon-class="warn" v-if="it.type=='warn'" color="red"></svg-icon>
|
<svg-icon class="icon-warn" icon-class="warn" v-if="it.type=='warn'" color="red"></svg-icon>
|
||||||
{{ it.type=="info"?"系统信息":"告警信息" }}
|
{{ it.type=="info"?"系统信息":"告警信息" }}
|
||||||
</div>
|
</div>
|
||||||
<div style="color: #666;padding: 0px 12px;">
|
<div style="color: #666;padding: 0px 12px;" class="row-1">
|
||||||
{{ it.operation_result }}
|
{{ it.operation_result }}
|
||||||
</div>
|
</div>
|
||||||
<div style="text-align: right;color: #666;padding:0px 12px;border-bottom: solid 1px #eee;">
|
<div class="row-2" style="text-align: right;color: #666;padding:0px 12px;border-bottom: solid 1px #eee;">
|
||||||
{{ it.update_time }}
|
{{ it.update_time }}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -122,7 +122,7 @@ const loadData = () => {
|
||||||
let objs = tmps.filter(it => it.logs_operation_type == t);
|
let objs = tmps.filter(it => it.logs_operation_type == t);
|
||||||
return objs.length > 0 ? objs[0].operation_count : 0;
|
return objs.length > 0 ? objs[0].operation_count : 0;
|
||||||
}
|
}
|
||||||
info.cnt1 = findCnt("model_compile");
|
info.cnt1 =10;// findCnt("model_compile");
|
||||||
info.cnt2 = findCnt("model_infer");
|
info.cnt2 = findCnt("model_infer");
|
||||||
info.cnt3 = findCnt("model_report");
|
info.cnt3 = findCnt("model_report");
|
||||||
});
|
});
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<template>
|
<template>
|
||||||
<div class="model-flow2">
|
<div class="model-flow2" style="margin-left: 40px;">
|
||||||
<el-row class="row-1">
|
<el-row class="row-1">
|
||||||
<div class="card-item" :class="info.cnt1 > 0 ? 'is-active' : ''">
|
<div class="card-item" :class="info.cnt1 > 0 ? 'is-active' : ''">
|
||||||
<div class="title-text">编译部署</div>
|
<div class="title-text">编译部署</div>
|
||||||
|
|
|
@ -32,7 +32,7 @@
|
||||||
<el-card shadow="never" class="top-row2">
|
<el-card shadow="never" class="top-row2">
|
||||||
<template #header>
|
<template #header>
|
||||||
<div class="row2-top">
|
<div class="row2-top">
|
||||||
<div style="color:#333;font-weight: bold;font-size:15px;">设备运行状态</div>
|
<div style="font-weight: bold;font-size:15px;">设备运行状态</div>
|
||||||
<div class="div-more" v-if="false">更多</div>
|
<div class="div-more" v-if="false">更多</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
@ -122,8 +122,8 @@
|
||||||
<div style="color:#333;font-weight: bold;font-size:15px;">模型仿真评估流程</div>
|
<div style="color:#333;font-weight: bold;font-size:15px;">模型仿真评估流程</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<ModelFlow2 v-if="isV2"/>
|
<ModelFlow2 v-if="isV2" />
|
||||||
<ModelFlow v-else/>
|
<ModelFlow v-else />
|
||||||
</el-card>
|
</el-card>
|
||||||
</div>
|
</div>
|
||||||
<div style="" class="right-panel">
|
<div style="" class="right-panel">
|
||||||
|
@ -283,9 +283,11 @@ onMounted(() => {
|
||||||
&.is-small {
|
&.is-small {
|
||||||
.dev-row3 {
|
.dev-row3 {
|
||||||
padding: 0px !important;
|
padding: 0px !important;
|
||||||
&.is-v2{
|
|
||||||
|
&.is-v2 {
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
.device-state {
|
.device-state {
|
||||||
width: 80px !important;
|
width: 80px !important;
|
||||||
}
|
}
|
||||||
|
@ -510,9 +512,11 @@ onMounted(() => {
|
||||||
display: flex;
|
display: flex;
|
||||||
padding: 12px;
|
padding: 12px;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
&.is-v2{
|
|
||||||
|
&.is-v2 {
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
.device-state {
|
.device-state {
|
||||||
width: 100px;
|
width: 100px;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
|
@ -604,3 +608,96 @@ onMounted(() => {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
||||||
|
<style lang="scss">
|
||||||
|
html.dark {
|
||||||
|
.dashboard-container {
|
||||||
|
.top-row1 {
|
||||||
|
.top-row {
|
||||||
|
.div-title {
|
||||||
|
color: #3399ff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.div-num {
|
||||||
|
color: #aaa
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.top-row2 {
|
||||||
|
.dev-item {
|
||||||
|
.el-card {
|
||||||
|
background: #304156;
|
||||||
|
|
||||||
|
.dev-title {
|
||||||
|
svg * {
|
||||||
|
fill: #fff !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-card__body {
|
||||||
|
background: #263445;
|
||||||
|
color: #aaa;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.right-panel {
|
||||||
|
.top-row2.notice-card {
|
||||||
|
.el-card__header {
|
||||||
|
border-bottom: 1px solid #5e6572;
|
||||||
|
|
||||||
|
div {
|
||||||
|
color: #fff !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.notice-item {
|
||||||
|
.row-1 {
|
||||||
|
color: #aaa !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.row-2 {
|
||||||
|
border-bottom: 1px solid #5e6572 !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
.proc-card{
|
||||||
|
.el-card__header{
|
||||||
|
.row2-top{
|
||||||
|
div{
|
||||||
|
color:#fff !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.el-card__body{
|
||||||
|
background: transparent;
|
||||||
|
color:#aaa;
|
||||||
|
.el-badge__content--danger{
|
||||||
|
background: #6F89A6;
|
||||||
|
width: 24px;
|
||||||
|
height: 24px;
|
||||||
|
text-align: center;
|
||||||
|
line-height: 24px;
|
||||||
|
border-radius: 12px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.proc-card.server-status{
|
||||||
|
background: #263445;
|
||||||
|
.el-card__header{
|
||||||
|
.row2-top{
|
||||||
|
div{
|
||||||
|
color:#fff !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
|
@ -19,7 +19,7 @@
|
||||||
<el-card shadow="never" class="top-row2">
|
<el-card shadow="never" class="top-row2">
|
||||||
<template #header>
|
<template #header>
|
||||||
<div class="row2-top">
|
<div class="row2-top">
|
||||||
<div style="color:#333;font-weight: bold;font-size:15px;">设备运行状态</div>
|
<div style="font-weight: bold;font-size:15px;">设备运行状态</div>
|
||||||
<div class="div-more" v-if="false">更多</div>
|
<div class="div-more" v-if="false">更多</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
|
@ -50,7 +50,7 @@
|
||||||
</el-button>
|
</el-button>
|
||||||
|
|
||||||
<!-- 账号密码提示 -->
|
<!-- 账号密码提示 -->
|
||||||
<div class="mt-10 text-sm">
|
<div class="mt-10 text-sm" v-if="1==2">
|
||||||
<span>{{ $t("login.username") }}: admin</span>
|
<span>{{ $t("login.username") }}: admin</span>
|
||||||
<span class="ml-4"> {{ $t("login.password") }}: 12345678</span>
|
<span class="ml-4"> {{ $t("login.password") }}: 12345678</span>
|
||||||
</div>
|
</div>
|
||||||
|
|
Loading…
Reference in New Issue