diff --git a/04.系统编码/Frontend/public/images/line.png b/04.系统编码/Frontend/public/images/line.png new file mode 100644 index 0000000..260bd4b Binary files /dev/null and b/04.系统编码/Frontend/public/images/line.png differ diff --git a/04.系统编码/Frontend/public/images/menu-bg.png b/04.系统编码/Frontend/public/images/menu-bg.png new file mode 100644 index 0000000..74fe617 Binary files /dev/null and b/04.系统编码/Frontend/public/images/menu-bg.png differ diff --git a/04.系统编码/Frontend/public/images/nav-bg1.png b/04.系统编码/Frontend/public/images/nav-bg1.png deleted file mode 100644 index eda2462..0000000 Binary files a/04.系统编码/Frontend/public/images/nav-bg1.png and /dev/null differ diff --git a/04.系统编码/Frontend/src/components/Login.vue b/04.系统编码/Frontend/src/components/Login.vue index f096a88..8ce9fa5 100644 --- a/04.系统编码/Frontend/src/components/Login.vue +++ b/04.系统编码/Frontend/src/components/Login.vue @@ -12,7 +12,7 @@ - + diff --git a/04.系统编码/Frontend/src/components/MicrowaveRadiation.vue b/04.系统编码/Frontend/src/components/MicrowaveRadiation.vue index d2f4111..907a54b 100644 --- a/04.系统编码/Frontend/src/components/MicrowaveRadiation.vue +++ b/04.系统编码/Frontend/src/components/MicrowaveRadiation.vue @@ -1,12 +1,51 @@ diff --git a/04.系统编码/Frontend/src/components/MicrowaveRadiation/BPInversion.vue b/04.系统编码/Frontend/src/components/MicrowaveRadiation/BPInversion.vue new file mode 100644 index 0000000..e69de29 diff --git a/04.系统编码/Frontend/src/components/MicrowaveRadiation/ConvectiveIndex.vue b/04.系统编码/Frontend/src/components/MicrowaveRadiation/ConvectiveIndex.vue new file mode 100644 index 0000000..e69de29 diff --git a/04.系统编码/Frontend/src/components/MicrowaveRadiation/Index.vue b/04.系统编码/Frontend/src/components/MicrowaveRadiation/Index.vue new file mode 100644 index 0000000..9edf23a --- /dev/null +++ b/04.系统编码/Frontend/src/components/MicrowaveRadiation/Index.vue @@ -0,0 +1,36 @@ + + + + diff --git a/04.系统编码/Frontend/src/components/MicrowaveRadiation/TLogP.vue b/04.系统编码/Frontend/src/components/MicrowaveRadiation/TLogP.vue new file mode 100644 index 0000000..e69de29 diff --git a/04.系统编码/Frontend/src/components/MicrowaveRadiation/Tabs.vue b/04.系统编码/Frontend/src/components/MicrowaveRadiation/Tabs.vue new file mode 100644 index 0000000..423d255 --- /dev/null +++ b/04.系统编码/Frontend/src/components/MicrowaveRadiation/Tabs.vue @@ -0,0 +1,24 @@ + + + + + diff --git a/04.系统编码/Frontend/src/components/MicrowaveRadiation/VerticalProfile.vue b/04.系统编码/Frontend/src/components/MicrowaveRadiation/VerticalProfile.vue new file mode 100644 index 0000000..e69de29 diff --git a/04.系统编码/Frontend/src/index.less b/04.系统编码/Frontend/src/index.less index 0da28bc..8c01073 100644 --- a/04.系统编码/Frontend/src/index.less +++ b/04.系统编码/Frontend/src/index.less @@ -5,6 +5,12 @@ a { display: block; + color: #222222; + text-decoration: none; +} + +ul, li { + list-style: none; } body { @@ -19,3 +25,101 @@ body { color: #222222; font-size: 16px; } + +.tabs { + width: 100%; + height: 60px; + display: flex; + align-items: center; + justify-content: center; + color: #ffffff; + font-size: 22px; + background-color: rgba(21, 81, 136, 0.46); + + .tab-item { + margin: 0 100px; + position: relative; + cursor: pointer; + color: #ffffff; + + &::after { + content: ''; + width: 100%; + height: 4px; + display: block; + position: absolute; + left: 0; + bottom: -10px; + // background: linear-gradient(to right, #ffffff 0%,#eeffff 10%, #99fdff 30%, #27fbff 50%, #99fdff 70%, #eeffff 90%,#ffffff 100%); + } + + &.active { + color: #23FBFF; + + &::after { + background: url("/images/line.png") no-repeat center/cover; + } + } + } +} + +.main { + width: 100%; + height: calc(~"100vh - 144px"); + display: flex; + + .panel { + height: calc(~"100% - 20px"); + background-color: #ffffff; + border-radius: 10px; + } + + .menu { + width: 250px; + padding: 20px; + height: calc(~"100% - 60px"); + border-radius: 0 10px 10px 0; + + .tip { + height: 32px; + padding-left: 12px; + line-height: 32px; + color: #ffffff; + font-size: 18px; + font-weight: bold; + background: url("/images/menu-bg.png") no-repeat center/cover; + } + + .menu-item { + .el-row { + margin-top: 20px; + .el-col { + span { + width: 100%; + height: 30px; + padding: 0; + display: block; + line-height: 28px; + text-align: center; + margin: 0 0 10px 0; + font-size: 16px; + color: #666666; + border-radius: 5px; + cursor: pointer; + border: 1px solid #ECF4FF; + background-color: #ECF4FF; + + &.active { + border-color: #498DF0; + } + } + } + } + } + } + + .container { + width: calc(~"100% - 290px"); + margin-left: 20px; + } +} \ No newline at end of file diff --git a/04.系统编码/Frontend/src/router/index.ts b/04.系统编码/Frontend/src/router/index.ts index efb2cba..354cd6d 100644 --- a/04.系统编码/Frontend/src/router/index.ts +++ b/04.系统编码/Frontend/src/router/index.ts @@ -1,8 +1,18 @@ import {createRouter, createWebHashHistory} from 'vue-router'; const routes: any = [ - { path: '/', redirect: '/Login'}, - + { path: '/', redirect: '/MicrowaveRadiation'}, + // { + // path: '/MicrowaveRadiation', + // component: () => import('../components/MicrowaveRadiation/Index.vue'), + // children: [ + // { path: '/MicrowaveRadiation', redirect: '/MicrowaveRadiation/VerticalProfile' }, + // { path: 'VerticalProfile', component: () => import('./../components/MicrowaveRadiation/VerticalProfile.vue') }, + // { path: 'ConvectiveIndex', component: () => import('./../components/MicrowaveRadiation/ConvectiveIndex.vue') }, + // { path: 'TLogP', component: () => import('./../components/MicrowaveRadiation/TLogP.vue') }, + // { path: 'BPInversion', component: () => import('./../components/MicrowaveRadiation/BPInversion.vue') } + // ] + // }, { path: '/MicrowaveRadiation', component: () => import('../components/MicrowaveRadiation.vue') }, { path: '/RamanLidar', component: () => import('../components/RamanLidar.vue') }, { path: '/SynergyEvaluation', component: () => import('../components/SynergyEvaluation.vue') },