From 85c3e06177642cd34a8a14278a7208c1a60e25d8 Mon Sep 17 00:00:00 2001
From: "453530270@qq.com" <aa123456>
Date: Fri, 23 Jun 2023 11:11:37 +0800
Subject: [PATCH] =?UTF-8?q?=E9=A6=96=E9=A1=B5=E8=B0=83=E6=95=B4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/assets/less/index.less |  9 +++++
 src/views/index.vue        | 72 ++++++++++++++++++++++++++++++--------
 2 files changed, 66 insertions(+), 15 deletions(-)
 create mode 100644 src/assets/less/index.less

diff --git a/src/assets/less/index.less b/src/assets/less/index.less
new file mode 100644
index 0000000..19c90c4
--- /dev/null
+++ b/src/assets/less/index.less
@@ -0,0 +1,9 @@
+.leftbox{
+    width: 33.33%;
+    float: left;
+    height: 100vh;
+
+    .keliu{
+        margin-top: 12rem;
+    }
+}
\ No newline at end of file
diff --git a/src/views/index.vue b/src/views/index.vue
index 1b3aea9..4ce8e36 100644
--- a/src/views/index.vue
+++ b/src/views/index.vue
@@ -1,37 +1,79 @@
 <template>
     <div id="index">
+        <!-- 左边 -->
+        <div class="leftbox">
+            <!-- 客流 -->
+            <div class="keliu">
+                <span class="kliu_title">客流趋势</span>
+                <div class="kliu_st">
+                    <span class="">年</span>
+                    <span class="">月</span>
+                    <span class="">日</span>
+                </div>
+                <!-- 柱状图 -->
+                <div class="tongjitu" id="homebar" style="height: 230px; width: 100%"></div>
+
+            </div>
+
+        </div>
+        <!-- 中间 -->
+        <!-- 右边 -->
 
-        总览的内容
     </div>
 </template>
 <script>
 
-export default{
+export default {
 
-    data(){
-        return{
+    data() {
+        return {
             //
         }
     },
-    mounted(){
+    mounted() {
         let cc = window.document.getElementById("dv-full-screen-container")
         // 清除其他多余的classname
         let len = cc.classList.length
-        
-        if(len>1){
-            cc.className="btgym page_bg"
-        //    cc.className ="btgym"
-        // }else{
-        //     cc.classList.add("page_bg")
+
+        if (len > 1) {
+            cc.className = "btgym page_bg"
         }
-        console.log("index vue:"+len)
-       console.log(cc.classList)
+        console.log("index vue:" + len)
+        console.log(cc.classList)
     }
 }
 </script>
 <style>
-.page_bg{
+.leftbox {
+    width: 33.33%;
+    float: left;
+    height: 100vh;
+}
+
+.leftbox .keliu{
+    background-image: url('../assets/index/left_t1_bg.png');
+    background-size: 100%;
+    background-repeat: no-repeat;
+    background-position: 0 0;
+    height: 1.2rem;
+    color: #b5b7c5;
+}
+.leftbox .keliu .kliu_title{
+    line-height: 0.88rem;
+    font-size: 0.48rem;
+    padding-left: 2.4rem;
+    display: block;
+    width: 40%;
+    float: left;
+}
+
+.leftbox .keliu .kliu_st{
+    width: 30%;
+    float: left;
+    line-height: 0.88rem;
+}
+.page_bg {
     clear: both;
-    background-image:url('../assets/index/bg.jpg') !important;
+    background-image: url('../assets/index/bg.jpg') !important;
 }
 </style>
\ No newline at end of file