From 749e8b25314323fe2197a1b3af97224ef70c7e4e Mon Sep 17 00:00:00 2001
From: liukangdong <898885815@qq.com>
Date: 星期二, 03 九月 2024 09:03:47 +0800
Subject: [PATCH] 大屏
---
screen/src/assets/images/ic_yongqi@2x.png | 0
screen/src/assets/images/bg_main_app.png | 0
screen/src/assets/images/img_city@2x.png | 0
screen/src/assets/images/ic_yongdian@2x.png | 0
screen/src/views/HomeView.vue | 2
screen/src/assets/images/ic_dianliang_b@2x.png | 0
screen/src/assets/images/city_bottom@2x.png | 0
screen/src/assets/images/ic_up.png | 0
screen/src/assets/images/ic_title@2x.png | 0
screen/src/assets/images/ic_dianliang@2x.png | 0
screen/src/router/index.js | 6
screen/src/assets/images/ic_up.webp | 0
screen/src/assets/images/maintitle@2x.png | 0
screen/src/assets/images/title@2x.png | 0
screen/src/assets/images/ic_down.png | 0
screen/src/assets/images/ic_down.webp | 0
screen/src/assets/images/ic_co2@2x.png | 0
screen/src/assets/images/ic_yongshui@2x.png | 0
screen/src/views/EnergyConsum.vue | 552 ++++++++++++++++++++++++++++++++++++++++++++++++++
screen/src/assets/images/bg_data@2x.png | 0
screen/src/views/LogisticsControl.vue | 67 ++++++
21 files changed, 626 insertions(+), 1 deletions(-)
diff --git a/screen/src/assets/images/bg_data@2x.png b/screen/src/assets/images/bg_data@2x.png
new file mode 100644
index 0000000..4689bae
--- /dev/null
+++ b/screen/src/assets/images/bg_data@2x.png
Binary files differ
diff --git a/screen/src/assets/images/bg_main_app.png b/screen/src/assets/images/bg_main_app.png
new file mode 100644
index 0000000..6b6b563
--- /dev/null
+++ b/screen/src/assets/images/bg_main_app.png
Binary files differ
diff --git a/screen/src/assets/images/city_bottom@2x.png b/screen/src/assets/images/city_bottom@2x.png
new file mode 100644
index 0000000..0e138e9
--- /dev/null
+++ b/screen/src/assets/images/city_bottom@2x.png
Binary files differ
diff --git a/screen/src/assets/images/ic_co2@2x.png b/screen/src/assets/images/ic_co2@2x.png
new file mode 100644
index 0000000..ed61913
--- /dev/null
+++ b/screen/src/assets/images/ic_co2@2x.png
Binary files differ
diff --git a/screen/src/assets/images/ic_dianliang@2x.png b/screen/src/assets/images/ic_dianliang@2x.png
new file mode 100644
index 0000000..d777570
--- /dev/null
+++ b/screen/src/assets/images/ic_dianliang@2x.png
Binary files differ
diff --git a/screen/src/assets/images/ic_dianliang_b@2x.png b/screen/src/assets/images/ic_dianliang_b@2x.png
new file mode 100644
index 0000000..d967c80
--- /dev/null
+++ b/screen/src/assets/images/ic_dianliang_b@2x.png
Binary files differ
diff --git a/screen/src/assets/images/ic_down.png b/screen/src/assets/images/ic_down.png
new file mode 100644
index 0000000..7279498
--- /dev/null
+++ b/screen/src/assets/images/ic_down.png
Binary files differ
diff --git a/screen/src/assets/images/ic_down.webp b/screen/src/assets/images/ic_down.webp
new file mode 100644
index 0000000..81a779e
--- /dev/null
+++ b/screen/src/assets/images/ic_down.webp
Binary files differ
diff --git a/screen/src/assets/images/ic_title@2x.png b/screen/src/assets/images/ic_title@2x.png
new file mode 100644
index 0000000..195beb0
--- /dev/null
+++ b/screen/src/assets/images/ic_title@2x.png
Binary files differ
diff --git a/screen/src/assets/images/ic_up.png b/screen/src/assets/images/ic_up.png
new file mode 100644
index 0000000..f5d2e4e
--- /dev/null
+++ b/screen/src/assets/images/ic_up.png
Binary files differ
diff --git a/screen/src/assets/images/ic_up.webp b/screen/src/assets/images/ic_up.webp
new file mode 100644
index 0000000..1759f33
--- /dev/null
+++ b/screen/src/assets/images/ic_up.webp
Binary files differ
diff --git a/screen/src/assets/images/ic_yongdian@2x.png b/screen/src/assets/images/ic_yongdian@2x.png
new file mode 100644
index 0000000..eb96486
--- /dev/null
+++ b/screen/src/assets/images/ic_yongdian@2x.png
Binary files differ
diff --git a/screen/src/assets/images/ic_yongqi@2x.png b/screen/src/assets/images/ic_yongqi@2x.png
new file mode 100644
index 0000000..103f26e
--- /dev/null
+++ b/screen/src/assets/images/ic_yongqi@2x.png
Binary files differ
diff --git a/screen/src/assets/images/ic_yongshui@2x.png b/screen/src/assets/images/ic_yongshui@2x.png
new file mode 100644
index 0000000..9eafe1d
--- /dev/null
+++ b/screen/src/assets/images/ic_yongshui@2x.png
Binary files differ
diff --git a/screen/src/assets/images/img_city@2x.png b/screen/src/assets/images/img_city@2x.png
new file mode 100644
index 0000000..74ff638
--- /dev/null
+++ b/screen/src/assets/images/img_city@2x.png
Binary files differ
diff --git a/screen/src/assets/images/maintitle@2x.png b/screen/src/assets/images/maintitle@2x.png
new file mode 100644
index 0000000..b2d6205
--- /dev/null
+++ b/screen/src/assets/images/maintitle@2x.png
Binary files differ
diff --git a/screen/src/assets/images/title@2x.png b/screen/src/assets/images/title@2x.png
new file mode 100644
index 0000000..e97a602
--- /dev/null
+++ b/screen/src/assets/images/title@2x.png
Binary files differ
diff --git a/screen/src/router/index.js b/screen/src/router/index.js
index 2d19a63..7838111 100644
--- a/screen/src/router/index.js
+++ b/screen/src/router/index.js
@@ -1,5 +1,6 @@
import { createRouter, createWebHashHistory } from 'vue-router'
import HomeView from '../views/HomeView.vue'
+import EnergyConsum from '../views/EnergyConsum.vue'
const router = createRouter({
history: createWebHashHistory(import.meta.env.BASE_URL),
@@ -9,6 +10,11 @@
name: 'home',
component: HomeView
},
+ {
+ path: '/EnergyConsum',
+ name: 'EnergyConsum',
+ component: () => import('../views/EnergyConsum.vue')
+ },
]
})
diff --git a/screen/src/views/EnergyConsum.vue b/screen/src/views/EnergyConsum.vue
new file mode 100644
index 0000000..6df09dd
--- /dev/null
+++ b/screen/src/views/EnergyConsum.vue
@@ -0,0 +1,552 @@
+<template>
+ <div class="main_app">
+ <img src="@/assets/images/bg_main_app.png" class="main_bg" alt="" />
+ <div class="main_header">
+ <img
+ src="@/assets/images/maintitle@2x.png"
+ class="main_header_bg"
+ alt=""
+ />
+ <div class="title">瀹夋嘲鏅烘収鐗╂祦鍥尯-缁胯壊浣庣⒊杩愯惀</div>
+ <div class="time">
+ <span class="date">{{ date }}</span>
+ <span class="week">{{ week }}</span>
+ <span class="time">{{ time }}</span>
+ </div>
+ </div>
+ <div class="main_content">
+ <div class="left_box">
+ <div class="left_box_one">
+ <div class="com_header">
+ <div class="title">
+ <img src="@/assets/images/ic_title@2x.png" class="icon" alt="" />
+ <div>瀹炴椂涓夌浉鐢垫祦/鐢靛帇</div>
+ </div>
+ <img src="@/assets/images/title@2x.png" class="bg" alt="" />
+ </div>
+ <div class="content">
+ <div class="item">
+ <div class="lab">A鐩哥數娴�(A)</div>
+ <div class="val">60</div>
+ </div>
+ <div class="item">
+ <div class="lab">B鐩哥數娴�(A)</div>
+ <div class="val">60</div>
+ </div>
+ <div class="item">
+ <div class="lab">C鐩哥數娴�(A)</div>
+ <div class="val">60</div>
+ </div>
+ <div class="item">
+ <div class="lab">鏈夊姛鍔熺巼(KW)</div>
+ <div class="val">60</div>
+ </div>
+ <div class="item">
+ <div class="lab">鍔熺巼鍥犳暟</div>
+ <div class="val">60</div>
+ </div>
+ <div class="item">
+ <div class="lab">鏈夊姛鐢靛害(掳)</div>
+ <div class="val">60</div>
+ </div>
+ </div>
+ </div>
+ <div class="left_box_two">
+ <div class="com_header">
+ <div class="title">
+ <img src="@/assets/images/ic_title@2x.png" class="icon" alt="" />
+ <div>瀹炴椂璐熻嵎鏇茬嚎</div>
+ </div>
+ <img src="@/assets/images/title@2x.png" class="bg" alt="" />
+ </div>
+ </div>
+ <div class="left_box_three">
+ <div class="com_header">
+ <div class="title">
+ <img src="@/assets/images/ic_title@2x.png" class="icon" alt="" />
+ <div>鏈堣兘鑰楀垎鏋�</div>
+ </div>
+ <div class="tabs">
+ <div class="tab active">鐢ㄧ數</div>
+ <div class="separate"></div>
+ <div class="tab">鐢ㄦ按</div>
+ <div class="separate"></div>
+ <div class="tab">鐢ㄦ皵</div>
+ </div>
+ <img src="@/assets/images/title@2x.png" class="bg" alt="" />
+ </div>
+ </div>
+ </div>
+ <div class="center_box">
+ <div class="center_box_one">
+ <div class="list">
+ <div class="item">
+ <div class="header">
+ <img
+ class="icon"
+ src="@/assets/images/ic_yongdian@2x.png"
+ alt=""
+ />
+ <div class="content">
+ <div class="name">涓婃湀鐢ㄧ數(kw路h)</div>
+ <div class="num">450</div>
+ </div>
+ </div>
+ <div class="static">
+ <span class="lab">鍚屾瘮</span>
+ <img class="icon" src="@/assets/images/ic_up.webp" alt="" />
+ <span class="val">11</span>
+ <span class="lab">鐜瘮</span>
+ <img class="icon" src="@/assets/images/ic_down.webp" alt="" />
+ <span class="val">11</span>
+ </div>
+ </div>
+ <div class="item">
+ <div class="header">
+ <img
+ class="icon"
+ src="@/assets/images/ic_yongshui@2x.png"
+ alt=""
+ />
+ <div class="content">
+ <div class="name">涓婃湀鐢ㄦ按(t)</div>
+ <div class="num">450</div>
+ </div>
+ </div>
+ <div class="static">
+ <span class="lab">鍚屾瘮</span>
+ <img class="icon" src="@/assets/images/ic_up.webp" alt="" />
+ <span class="val">11</span>
+ <span class="lab">鐜瘮</span>
+ <img class="icon" src="@/assets/images/ic_down.webp" alt="" />
+ <span class="val">11</span>
+ </div>
+ </div>
+ <div class="item">
+ <div class="header">
+ <img
+ class="icon"
+ src="@/assets/images/ic_yongqi@2x.png"
+ alt=""
+ />
+ <div class="content">
+ <div class="name">涓婃湀鐢ㄦ皵(t)</div>
+ <div class="num">450</div>
+ </div>
+ </div>
+ <div class="static">
+ <span class="lab">鍚屾瘮</span>
+ <img class="icon" src="@/assets/images/ic_up.webp" alt="" />
+ <span class="val">11</span>
+ <span class="lab">鐜瘮</span>
+ <img class="icon" src="@/assets/images/ic_down.webp" alt="" />
+ <span class="val">11</span>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="center_box_two">
+ <img class="bg" src="@/assets/images/img_city@2x.png" alt="" />
+ <div class="item item1">
+ <div class="num fs_linear">240<span class="unit">kw路h</span></div>
+ <div class="name">鑱斿悎宸ユ埧</div>
+ <img src="@/assets/images/bg_data@2x.png" class="bg" alt="" />
+ </div>
+ <div class="item item2">
+ <div class="num fs_linear">240<span class="unit">kw路h</span></div>
+ <div class="name">鑱斿悎宸ユ埧</div>
+ <img src="@/assets/images/bg_data@2x.png" class="bg" alt="" />
+ </div>
+ <div class="item item3">
+ <div class="num fs_linear">240<span class="unit">kw路h</span></div>
+ <div class="name">鑱斿悎宸ユ埧</div>
+ <img src="@/assets/images/bg_data@2x.png" class="bg" alt="" />
+ </div>
+ <div class="item item4">
+ <div class="num fs_linear">240<span class="unit">kw路h</span></div>
+ <div class="name">鑱斿悎宸ユ埧</div>
+ <img src="@/assets/images/bg_data@2x.png" class="bg" alt="" />
+ </div>
+ <div class="item item5">
+ <div class="num fs_linear">240<span class="unit">kw路h</span></div>
+ <div class="name">鑱斿悎宸ユ埧</div>
+ <img src="@/assets/images/bg_data@2x.png" class="bg" alt="" />
+ </div>
+ <div class="bottom_wrap">
+ <div class="bottom bottom1">
+ <div class="num fs_linear">240</div>
+ <div class="name">鏄ㄦ棩鐢ㄧ數</div>
+ <div class="unit">kw路h</div>
+ <img src="@/assets/images/ic_dianliang_b@2x.png" class="bg" alt="" />
+ </div>
+ <div class="bottom bottom2">
+ <div class="num">240</div>
+ <div class="name">浠婃棩鐢ㄧ數</div>
+ <div class="unit">kw路h</div>
+ <img src="@/assets/images/ic_dianliang@2x.png" class="bg" alt="" />
+ </div>
+ <div class="bottom bottom3">
+ <div class="num fs_linear">240</div>
+ <div class="name">鏈湀鐢ㄧ數</div>
+ <div class="unit">kw路h</div>
+ <img src="@/assets/images/ic_dianliang_b@2x.png" class="bg" alt="" />
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="right_box">
+ <div class="right_box_one"></div>
+ <div class="right_box_two"></div>
+ <div class="right_box_three"></div>
+ </div>
+ </div>
+ </div>
+</template>
+
+<script setup>
+import { ref } from 'vue'
+import dayjs from 'dayjs'
+
+const weekMap = ['鏄熸湡鏃�', '鏄熸湡涓�', '鏄熸湡浜�', '鏄熸湡涓�', '鏄熸湡鍥�', '鏄熸湡浜�', '鏄熸湡鍏�',]
+const date = ref(dayjs().format('YYYY.MM.DD'))
+const week = ref(weekMap[new Date().getDay()])
+const time = ref(dayjs().format('HH:mm:ss'))
+setInterval(() => {
+ date.value = dayjs().format('YYYY-MM-DD')
+ week.value = weekMap[new Date().getDay()]
+ time.value = dayjs().format('HH:mm:ss')
+
+}, 1000)
+
+</script>
+
+<style lang="scss" scoped>
+.main_content {
+ display: flex;
+ padding: 20px 24px 0;
+ .left_box {
+ flex: 4;
+ .left_box_one {
+ width: 100%;
+ margin-bottom: 20px;
+ .content {
+ width: 100%;
+ padding: 24px 5%;
+ display: flex;
+ flex-wrap: wrap;
+ .item {
+ width: 33.3%;
+ margin-bottom: 12px;
+ .lab {
+ font-size: 14px;
+ color: #ffffff;
+ }
+ .val {
+ font-weight: 600;
+ font-size: 20px;
+ color: #01d9fe;
+ margin-top: 4px;
+ }
+ }
+ }
+ }
+ .left_box_two {
+ margin-bottom: 20px;
+ }
+ .left_box_three {
+ }
+ }
+ .center_box {
+ flex: 9;
+ padding: 0 60px;
+ .center_box_one {
+ padding: 30px 18px;
+ margin-bottom: 18px;
+ .list {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ .item {
+ flex: 1;
+ .header {
+ display: flex;
+ margin-bottom: 14px;
+ .icon {
+ width: 70px;
+ height: 73px;
+ margin-right: 20px;
+ }
+ .content {
+ .name {
+ font-size: 16px;
+ color: #d2e0ff;
+ }
+ .num {
+ font-weight: bold;
+ font-size: 36px;
+ color: #ffffff;
+ line-height: 54px;
+ }
+ }
+ }
+ .static {
+ font-size: 12px;
+ display: flex;
+ align-items: center;
+ .lab {
+ color: #869cc9;
+ }
+ .val {
+ color: #d2e0ff;
+ margin-right: 20px;
+ }
+ .icon {
+ width: 12px;
+ height: 12px;
+ margin: 0 5px;
+ }
+ }
+ }
+ }
+ }
+ .center_box_two {
+ position: relative;
+ width: 100%;
+ height: 544px;
+ .item {
+ width: 120px;
+ height: 112px;
+ position: absolute;
+ text-align: center;
+ .num {
+ font-size: 35px;
+ line-height: 50px;
+ height: 50px;
+ font-weight: 600;
+ .unit {
+ font-size: 13px;
+ }
+ }
+ .name {
+ font-weight: 500;
+ font-size: 17px;
+ color: #ffffff;
+ }
+ .bg {
+ width: 120px;
+ height: 88px;
+ top: 24px;
+ }
+ }
+ .item1{
+ left: 50%;
+ top: 0;
+ transform: translate(-50%, 0);
+ }
+ .item2{
+ top: 112px;
+ left: 106px;
+ }
+ .item3{
+ top: 112px;
+ right: 106px;
+ }
+ .item4{
+ top: 291px;
+ left: 56px;
+ }
+ .item5{
+ top: 291px;
+ right: 56px;
+ }
+ .bottom_wrap{
+ position: absolute;
+ bottom:-110px;
+ left: 50%;
+ width: 600px;
+ height: 100px;
+ transform: translate(-50%, 0);
+ }
+ .bottom{
+ width: 140px;
+ height: 194px;
+ position: absolute;
+ text-align: center;
+ padding-top: 70px;
+ .num{
+ font-size: 24px;
+ color: #D0FFFA;
+ line-height: 33px;
+ }
+ .name{
+ font-size: 15px;
+ color: #D0FFFA;
+ line-height: 21px;
+ }
+ .unit{
+ font-size: 14px;
+ color: #D0FFFA;
+ }
+ }
+ .bottom1{
+ bottom: -0px;
+ left: 40px;
+ }
+ .bottom3{
+ bottom: -0px;
+ right: 40px;
+ }
+ .bottom2{
+ bottom: -0px;
+ left: 50%;
+ transform: translate(-50%, 0);
+ padding-top: 50px;
+ .num{
+ font-size: 36px;
+ color: #01D9FE;
+ line-height: 54px;
+ font-weight: bold;
+ }
+ }
+ }
+ }
+ .right_box {
+ flex: 4;
+ }
+}
+.com_header {
+ height: 40px;
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ padding: 0 15px 0 13px;
+ position: relative;
+ .title {
+ display: flex;
+ align-items: center;
+ font-weight: bold;
+ font-size: 16px;
+ background-image: -webkit-linear-gradient(
+ top,
+ #ffffff 0%,
+ #c8ddff 66%,
+ #85b4ff 72%,
+ #74a9ff 100%
+ );
+ -webkit-background-clip: text;
+ -webkit-text-fill-color: transparent;
+ .icon {
+ width: 16px;
+ height: 16px;
+ margin-right: 14px;
+ }
+ }
+ .tabs {
+ display: flex;
+ align-items: center;
+ .tab {
+ font-size: 14px;
+ color: #d2e0ff;
+ }
+ .separate {
+ width: 1px;
+ height: 14px;
+ background-color: #d2e0ff;
+ margin: 0 6px;
+ }
+ .active {
+ color: #0094eb;
+ }
+ }
+}
+.bg {
+ position: absolute;
+ left: 0;
+ top: 0;
+ width: 100%;
+ height: 100%;
+ object-fit: cover;
+ z-index: -1;
+}
+.fs_linear {
+ background-image: -webkit-linear-gradient(
+ top,
+ #ffffff 0%,
+ #c8ddff 70%,
+ #85b4ff 80%,
+ #74a9ff 100%
+ );
+ -webkit-background-clip: text;
+ -webkit-text-fill-color: transparent;
+}
+.main_header {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ height: 92px;
+ position: relative;
+ padding: 0px 40px 16px;
+ font-weight: 600;
+ font-size: 36px;
+ .title {
+ background-image: -webkit-linear-gradient(
+ top,
+ #ffffff 0%,
+ #c8ddff 70%,
+ #85b4ff 80%,
+ #74a9ff 100%
+ );
+ -webkit-background-clip: text;
+ -webkit-text-fill-color: transparent;
+ }
+ .time {
+ font-size: 26px;
+ font-weight: 600;
+ background-image: -webkit-linear-gradient(
+ top,
+ #ffffff 0%,
+ #c8ddff 50%,
+ #85b4ff 80%,
+ #74a9ff 100%
+ );
+ -webkit-background-clip: text;
+ -webkit-text-fill-color: transparent;
+ display: flex;
+ align-items: center;
+ .time {
+ width: 180px;
+ display: flex;
+ justify-content: flex-end;
+ padding-bottom: 10px;
+ font-size: 36px;
+ }
+ .week {
+ margin-left: 36px;
+ }
+ }
+ .main_header_bg {
+ position: absolute;
+ left: 0;
+ top: 0;
+ width: 100%;
+ height: 100%;
+ object-fit: cover;
+ z-index: -1;
+ }
+}
+.main_app {
+ width: 100%;
+ min-height: 100vh;
+ color: #ffffff;
+ position: relative;
+ .main_bg {
+ position: absolute;
+ left: 0;
+ top: 0;
+ width: 100%;
+ height: 100%;
+ object-fit: cover;
+ z-index: -1;
+ }
+}
+</style>
\ No newline at end of file
diff --git a/screen/src/views/HomeView.vue b/screen/src/views/HomeView.vue
index 98c6a63..403c86b 100644
--- a/screen/src/views/HomeView.vue
+++ b/screen/src/views/HomeView.vue
@@ -19,7 +19,7 @@
<div class="main_content">
<div class="box in_box">
<div class="title">瀹夋嘲鐗╂祦鍏ュ簱鏈堝彴</div>
- <div class="line">
+ <div class="line head">
<div class="no item">搴忓彿</div>
<div class="item">杞︾墝鍙�</div>
<div class="item">鐘舵��</div>
diff --git a/screen/src/views/LogisticsControl.vue b/screen/src/views/LogisticsControl.vue
new file mode 100644
index 0000000..b9756f2
--- /dev/null
+++ b/screen/src/views/LogisticsControl.vue
@@ -0,0 +1,67 @@
+<template>
+ <div class="main_app">
+ <div class="main_header">
+ <div class="title">瀹夋嘲鏅烘収鐗╂祦鍥尯-缁胯壊浣庣⒊杩愯惀</div>
+ <div class="time">
+ <span>{{date}}</span>
+ <span>{{week}}</span>
+ <span>{{time}}</span>
+ </div>
+ </div>
+ <div class="main_content">
+ <div class="left_box">
+ <div class="left_box_one"></div>
+ <div class="left_box_two"></div>
+ <div class="left_box_three"></div>
+ </div>
+ <div class="center_box">
+ <div class="center_box_one"></div>
+ <div class="center_box_two"></div>
+ </div>
+ <div class="right_box">
+ <div class="right_box_one"></div>
+ <div class="right_box_two"></div>
+ <div class="right_box_three"></div>
+ </div>
+ </div>
+ </div>
+</template>
+
+<script setup>
+import { ref } from 'vue'
+import dayjs from 'dayjs'
+
+const weekMap = ['鏄熸湡鏃�', '鏄熸湡涓�', '鏄熸湡浜�', '鏄熸湡涓�', '鏄熸湡鍥�', '鏄熸湡浜�', '鏄熸湡鍏�',]
+const date = ref(dayjs().format('YYYY.MM.DD'))
+const week = ref(weekMap[new Date().getDay()])
+const time = ref(dayjs().format('HH:mm:ss'))
+setInterval(() => {
+ date.value = dayjs().format('YYYY-MM-DD')
+ week.value = weekMap[new Date().getDay()]
+ time.value = dayjs().format('HH:mm:ss')
+
+},1000)
+
+</script>
+
+<style lang="scss" scoped>
+.main_app{
+ width: 100%;
+ min-height: 100vh;
+ background: #0b2539;
+ color: #FFFFFF;
+}
+.main_content{
+ display: flex;
+ .left_box{}
+ .center_box{}
+ .right_box{}
+}
+.main_header{
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ height: 71px;
+ border: 1px solid;
+}
+</style>
\ No newline at end of file
--
Gitblit v1.9.3