样式

ui/dasadmin/.env

@@ -3,3 +3,4 @@ VITE_PORT = 1818
 
 # open 运行 npm run dev 时自动打开浏览器
 VITE_OPEN = false
+

ui/dasadmin/src/stores/config.ts

@@ -26,7 +26,7 @@ export const useConfig = defineStore(
             // 侧边菜单激活项背景色
             menuActiveBackground: ['#ffffff', '#1d1e1f'],
             // 侧边菜单激活项文字色
-            menuActiveColor: ['#409eff', '#3375b9'],
+            menuActiveColor: ['#0064AA', '#3375b9'],
             // 侧边菜单顶栏背景色
             menuTopBarBackground: ['#fcfcfc', '#1d1e1f'],
             // 侧边菜单宽度(展开时)，单位px

ui/dasadmin/src/styles/app.scss

@@ -28,6 +28,7 @@ body,
     font-size: 14px;
     overflow: hidden;
     position: relative;
+    // --el-color-primary: #0064AA
 }
 
 // 阿里 iconfont Symbol引用css
@@ -42,9 +43,11 @@ body,
 .w100 {
     width: 100% !important;
 }
+
 .h100 {
     height: 100% !important;
 }
+
 .ba-center {
     display: flex;
     align-items: center;
@@ -54,6 +57,7 @@ body,
 .default-main {
     margin: var(--ba-main-space) var(--ba-main-space) 60px var(--ba-main-space);
 }
+
 .zoom-handle {
     position: absolute;
     width: 20px;
@@ -62,6 +66,7 @@ body,
     right: -10px;
     cursor: se-resize;
 }
+
 .block-help {
     display: block;
     width: 100%;
@@ -77,16 +82,19 @@ body,
         font-size: 14px !important;
         color: var(--el-color-white) !important;
     }
+
     .el-button.is-disabled .icon {
         color: var(--el-button-disabled-text-color) !important;
     }
 }
+
 /* 表格顶部菜单-e */
 
 /* 鼠标置入浮动效果-s */
 .suspension {
     transition: all 0.3s ease;
 }
+
 .suspension:hover {
     -webkit-transform: translateY(-4px) scale(1.02);
     -moz-transform: translateY(-4px) scale(1.02);
@@ -98,12 +106,14 @@ body,
     z-index: 999;
     border-radius: 6px;
 }
+
 /* 鼠标置入浮动效果-e */
 
 /* 表格-s */
 .ba-table-box {
     border-radius: var(--el-border-radius-round);
 }
+
 .ba-table-alert {
     background-color: var(--el-fill-color-darker) !important;
     border: 1px solid var(--ba-boder-color);
@@ -111,6 +121,7 @@ body,
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
 }
+
 /* 表格-e */
 
 /* 新增/编辑表单-s */
@@ -119,15 +130,19 @@ body,
     border-radius: var(--el-border-radius-base);
     padding-bottom: 52px;
 }
+
 .ba-operate-dialog .el-dialog__header {
     border-bottom: 1px solid var(--ba-bg-color);
+
     .el-dialog__headerbtn {
         top: 4px;
     }
 }
+
 .ba-operate-dialog .el-dialog__body {
     height: 58vh;
 }
+
 .ba-operate-dialog .el-dialog__footer {
     padding: 10px var(--el-dialog-padding-primary);
     box-shadow: var(--el-box-shadow);
@@ -136,9 +151,11 @@ body,
     bottom: 0;
     left: 0;
 }
+
 .ba-operate-form {
     padding-top: 20px;
 }
+
 /* 新增/编辑表单-e */
 
 /* 全局遮罩-s */
@@ -151,6 +168,7 @@ body,
     background-color: rgba(0, 0, 0, 0.5);
     z-index: 9999990;
 }
+
 /* 全局遮罩-e */
 
 /* 图片上传预览-s */
@@ -158,10 +176,12 @@ body,
     display: flex;
     align-items: center;
     justify-content: center;
+
     img {
         max-width: 100%;
     }
 }
+
 /* 图片上传预览-e */
 
 /* 页面切换动画-s */
@@ -172,54 +192,66 @@ body,
     will-change: transform;
     transition: all 0.3s ease;
 }
+
 // slide-right
 .slide-right-enter-from {
     opacity: 0;
     transform: translateX(-20px);
 }
+
 .slide-right-leave-to {
     opacity: 0;
     transform: translateX(20px);
 }
+
 // slide-left
 .slide-left-enter-from {
     @extend .slide-right-leave-to;
 }
+
 .slide-left-leave-to {
     @extend .slide-right-enter-from;
 }
+
 /* 页面切换动画-e */
 
 /* 布局相关-s */
 .frontend-footer-brother {
     min-height: calc(100vh - 120px);
 }
+
 .user-views {
     padding-left: 15px;
+
     .user-views-card {
         margin-bottom: 15px;
     }
 }
+
 .ba-aside-drawer {
     .el-drawer__body {
         padding: 0;
     }
 }
+
 /* 布局相关-e */
 
 /* 暗黑模式公共样式-s */
 .ba-icon-dark {
     color: var(--el-text-color-primary) !important;
 }
+
 /* 暗黑模式公共样式-e */
 
 /* NProgress-s */
 #nprogress {
+
     .bar,
     .spinner {
         z-index: 999999;
     }
 }
+
 /* NProgress-e */
 
 /* 自适应-s */
@@ -228,14 +260,17 @@ body,
         display: none;
     }
 }
+
 @media screen and (max-width: 1024px) {
     .ba-operate-dialog {
         width: 96%;
     }
 }
+
 @media screen and (max-width: 991px) {
     .user-views {
         padding: 0;
     }
 }
+
 /* 自适应-e */

ui/dasadmin/src/styles/loading.scss

@@ -5,49 +5,60 @@
     z-index: 9990;
     background-color: var(--ba-bg-color);
 }
+
 .block-loading .block-loading-box {
     position: absolute;
     top: 50%;
     left: 50%;
     transform: translate(-50%, -50%);
 }
+
 .block-loading .block-loading-box-warp {
     width: 80px;
     height: 80px;
 }
+
 .block-loading .block-loading-box-warp .block-loading-box-item {
     width: 33.333333%;
     height: 33.333333%;
-    background: #409eff;
+    background: #0064AA;
     float: left;
     animation: block-loading-animation 1.2s infinite ease;
     border-radius: 1px;
 }
+
 .block-loading .block-loading-box-warp .block-loading-box-item:nth-child(7) {
     animation-delay: 0s;
 }
+
 .block-loading .block-loading-box-warp .block-loading-box-item:nth-child(4),
 .block-loading .block-loading-box-warp .block-loading-box-item:nth-child(8) {
     animation-delay: 0.1s;
 }
+
 .block-loading .block-loading-box-warp .block-loading-box-item:nth-child(1),
 .block-loading .block-loading-box-warp .block-loading-box-item:nth-child(5),
 .block-loading .block-loading-box-warp .block-loading-box-item:nth-child(9) {
     animation-delay: 0.2s;
 }
+
 .block-loading .block-loading-box-warp .block-loading-box-item:nth-child(2),
 .block-loading .block-loading-box-warp .block-loading-box-item:nth-child(6) {
     animation-delay: 0.3s;
 }
+
 .block-loading .block-loading-box-warp .block-loading-box-item:nth-child(3) {
     animation-delay: 0.4s;
 }
+
 @keyframes block-loading-animation {
+
     0%,
     70%,
     100% {
         transform: scale3D(1, 1, 1);
     }
+
     35% {
         transform: scale3D(0, 0, 1);
     }

ui/dasadmin/src/styles/var.scss

@@ -1,27 +1,30 @@
 @use 'sass:map';
 @use 'mixins' as *;
+$colors: (
+    ) !default;
+$colors: map.deep-merge(('primary': ('base': #0064AA)),
+        $colors
+);
 
 // 后台主体窗口左右间距
 $main-space: 16px;
 $primary-light: #3f6ad8;
 
 // --ba-background
-$bg-color: () !default;
+$bg-color: (
-$bg-color: map.merge(
+    ) !default;
-    (
+$bg-color: map.merge(('': #f5f5f5,
-        '': #f5f5f5,
+            'overlay': #ffffff,
-        'overlay': #ffffff,
+        ),
-    ),
+        $bg-color
-    $bg-color
 );
 
 // --ba-border-color
-$border-color: () !default;
+$border-color: (
-$border-color: map.merge(
+    ) !default;
-    (
+$border-color: map.merge(('': #f6f6f6,
-        '': #f6f6f6,
+        ),
-    ),
+        $border-color
-    $border-color
 );
 
 :root {

ui/dasadmin/src/utils/axios.ts

@@ -161,6 +161,12 @@ function createAxios<Data = any, T = ApiPromise<Data>>(axiosConfig: AxiosRequest
                     // if (response.data.code == 302) {
                     //     router.push({ path: response.data.data.routePath ?? '', name: response.data.data.routeName ?? '' })
                     // }
+                    if (response.data.code == 400) {
+                        let routerPath = adminBaseRoute.path
+                        userInfo.removeToken()
+                        routerPath += '/login'
+                        router.push({ path: routerPath })
+                    }
                     if (response.data.code == 401) {
                         let routerPath = adminBaseRoute.path
                         userInfo.removeToken()

ui/dasadmin/src/views/backend/login.vue

@@ -1,6 +1,6 @@
 <template>
-    <div>
+    <div class="login-div">
-        <div class="switch-language">
+        <!-- <div class="switch-language">
             <el-dropdown size="large" :hide-timeout="50" placement="bottom-end" :hide-on-click="true">
                 <Icon name="fa fa-globe" color="var(--el-text-color-secondary)" size="28" />
                 <template #dropdown>
@@ -11,17 +11,17 @@
                     </el-dropdown-menu>
                 </template>
             </el-dropdown>
-        </div>
+        </div> -->
         <div @contextmenu.stop="" id="bubble" class="bubble">
             <canvas id="bubble-canvas" class="bubble-canvas"></canvas>
         </div>
         <div class="login">
             <div class="login-box">
-                <div class="head">
-                    <img src="~assets/login-header.png" alt="" />
-                </div>
                 <div class="form">
-                    <img class="profile-avatar" :src="fullUrl('/static/images/avatar.png')" alt="" />
+                    <div class="title">
+                        <div class="title1">欢迎使用润阳风电场系统</div>
+                        <div class="title2">一站式数据采集平台</div>
+                    </div>
                     <div class="content">
                         <el-form @keyup.enter="onSubmitPre()" ref="formRef" :rules="rules" size="large" :model="form">
                             <el-form-item prop="username">
@@ -204,12 +204,14 @@ const onSubmit = () => {
         })
         .finally(() => {
             state.submitLoading = false
-            load()
+            // load()
         })
 }
 </script>
 
 <style scoped lang="scss">
+.login-div {
+}
 .switch-language {
     position: fixed;
     top: 20px;
@@ -218,7 +220,9 @@ const onSubmit = () => {
 }
 .bubble {
     overflow: hidden;
-    background: url(/@/assets/bg.jpg) repeat;
+    width: 64%;
+    background: url(/@/assets/bg.png) no-repeat;
+    background-size: 100% 100%;
 }
 .form-item-icon {
     height: auto;
@@ -226,25 +230,36 @@ const onSubmit = () => {
 .login {
     position: absolute;
     top: 0;
+    right: 0;
     display: flex;
-    width: 100vw;
+    width: 36%;
-    height: 100vh;
+    height: 100%;
     align-items: center;
     justify-content: center;
     .login-box {
         overflow: hidden;
-        width: 430px;
+        width: 100%;
-        padding: 0;
+        height: 100%;
         background: var(--ba-bg-color-overlay);
-        margin-bottom: 80px;
+        display: flex;
+        align-items: center;
+        justify-content: center;
     }
-    .head {
+    .title {
-        background: #ccccff;
+        .title1 {
-        img {
+            font-size: 36px;
-            display: block;
+            color: #333333;
-            width: 430px;
+            letter-spacing: 0;
-            margin: 0 auto;
+            line-height: 36px;
-            user-select: none;
+            font-weight: 600;
+        }
+        .title2 {
+            padding-top: 20px;
+            font-size: 24px;
+            color: #666666;
+            letter-spacing: 0;
+            line-height: 24px;
+            font-weight: 400;
         }
     }
     .form {
@@ -262,26 +277,25 @@ const onSubmit = () => {
             user-select: none;
         }
         .content {
-            padding: 100px 40px 40px 40px;
+            padding: 100px 0;
         }
         .submit-button {
             width: 100%;
             letter-spacing: 2px;
             font-weight: 300;
             margin-top: 15px;
-            --el-button-bg-color: var(--el-color-primary);
+            // --el-button-bg-color: var(--el-color-primary);
         }
     }
 }
 
-@media screen and (max-width: 720px) {
+@media screen and (max-width: 1370px) {
-    .login {
+    .title {
-        display: flex;
+        .title1 {
-        align-items: center;
+            font-size: 30px !important;
-        justify-content: center;
+        }
-        .login-box {
+        .title2 {
-            width: 340px;
+            font-size: 20px !important;
-            margin-top: 0;
         }
     }
 }

ui/dasadmin/src/views/backend/routine/adminInfo.vue

@@ -240,7 +240,7 @@ const onSubmit = () => {
 .admin-info {
     background-color: var(--ba-bg-color-overlay);
     border-radius: var(--el-border-radius-base);
-    border-top: 3px solid #409eff;
+    border-top: 3px solid #0064aa;
     .avatar-uploader {
         display: flex;
         align-items: center;

ui/dasadmin/vite.config.ts

@@ -21,11 +21,14 @@ const viteConfig = ({ mode }: ConfigEnv): UserConfig => {
 
     const createProxy = (proxyList: any) => {
         const ret = {} as Record<string, ProxyOptions>
-        for (const [prefix, target] of proxyList) {
+        if (proxyList) {
-            ret[prefix] = {
+            proxyList = JSON.parse(proxyList)
-                target: target,
+            for (const [prefix, target] of proxyList) {
-                changeOrigin: true,
+                ret[prefix] = {
-                rewrite: (path) => path.replace(new RegExp(`^${prefix}`), ''),
+                    target: target,
+                    changeOrigin: true,
+                    rewrite: (path) => path.replace(new RegExp(`^${prefix}`), ''),
+                }
             }
         }
 
@@ -51,7 +54,7 @@ const viteConfig = ({ mode }: ConfigEnv): UserConfig => {
             port: parseInt(VITE_PORT),
             open: VITE_OPEN != 'false',
             proxy: {
-                ...createProxy(JSON.parse(VITE_APP_PROXY)),
+                ...createProxy(VITE_APP_PROXY),
             },
         },
         build: {