src/App.vue

@@ -41,7 +41,7 @@ export default {
 }
 </script>
 
-<style scoped>
+<style>
 @import "./assets/index.css";
 #app {
   font-family: Avenir, Helvetica, Arial, sans-serif;
@@ -62,7 +62,7 @@ export default {
   width: 100%;
   height: 8.6%;
   display: flex;
-  justify-content: space-evenly;
+  jjustify-content: space-evenly;
   .topLeft{
     width: 11%;
     height: 55%;

src/assets/font/font.less

@@ -1,4 +0,0 @@
-@font-face {
-    font-family: maleGod;
-    src: url(./maleGod.otf);
-}

src/main.js

@@ -1,7 +1,7 @@
 import Vue from 'vue'
 import App from './App.vue'
 import router from './router'
-import '../src/assets/font/font.less'
+
 import ElementUI from 'element-ui'
 import 'element-ui/lib/theme-chalk/index.css'
 Vue.use(ElementUI)

src/view/index.vue

@@ -5,32 +5,19 @@
             <!-- 营业临厅时长 -->
             <div class="business-hall">
                 <div class="title">
-                    <!-- 45.4% -->
-                    <p class="p1">营业厅时长</p>
 
                 </div>
-                <!-- 两个小版块 -->
-                <div class="hall-box">
-                    <div class="item">
-                        <p class="font">平均办理时长</p>
-                        <p class="hall-time" style="color:#2e81a2">49分钟33秒</p>
-                    </div>
-                    <div class="item">
-                        <p class="font">平均等待时长</p>
-                        <p class="hall-time" style="color:#9c9060">05分钟33秒</p>
-                    </div>
-                </div>
             </div>
             <!-- 客流量 -->
             <div class="passenger-flow">
                 <div class="title">
-                    <p>客流量</p>
+
                 </div>
-            </div>
+            </div >
             <!-- 厅内统计 -->
             <div class='hall-statistics'>
                 <div class="title">
-                    <p>厅内统计</p>
+
                 </div>
             </div>
         </div>
@@ -39,19 +26,19 @@
             <!-- 缴费情况 -->
             <div class="payment">
                 <div class="title">
-                    <p>缴费情况</p>
+
                 </div>
             </div>
             <!-- 业务受理 -->
             <div class="business-acceptance">
                 <div class="title">
-                    <p>业务受理</p>
+
                 </div>
             </div>
             <!-- 服务情况 -->
             <div class="service">
                 <div class="title">
-                    <p>服务情况</p>
+
                 </div>
             </div>
         </div>
@@ -60,106 +47,72 @@
 
 <script>
 export default {
-    name: 'index',
-    data() {
-        return {
+name:'index',
+data(){
+    return{
         
-        }
-    },
-    mounted() {
-
-    },
-    methods: {
     }
+},
+mounted(){
+
+},
+methods:{
+}
 }
 </script>
 
-<style lang="less" scoped>
-.content {
+<style>
+.content{
     width: 100%;
-    height: 100%;
-    position: relative;
+     height: 100%;
+     position: relative;
 }
-
-.left-content,
-.right-content {
+.left-content,.right-content{
     position: absolute;
     width: 20.6%;
     top: 0;
     height: 100%;
     /* background-color: aqua; */
 }
-
 /* 内容板块背景 */
-.left-content>div,
-.right-content>div {
+.left-content>div,.right-content>div{
     background-image: url(../assets/images/border.png);
     background-size: 100% 100%;
     margin-bottom: 5px;
     padding: 13px;
     box-sizing: border-box;
-    .hall-box{
-        width: 100%;
-        height: 18.6%;
-        display: flex;
-        justify-content: space-between;
-    }
-    .hall-box .item{
-        width: 45%;
-        height: 100%;
-        // background-color: aqua;
-        background-image: url(../assets/images/hall-box.png);
-        .font{
-            font-size: 12px;
-            color: #a5a5af;
-        }
-        .hall-time{
-            font-family: 'maleGod';
-            font-size: 21px;
-        }
-    }
 }
-
 /* 标题的样式 */
-.left-content>div>.title,
-.right-content>div>.title {
+.left-content>div>.title,.right-content>div>.title{
     width: 100%;
     background-image: url(../assets/images/border-title.png);
     height: 30px;
     background-size: 100% 100%;
-    margin-bottom: 10px;
-}
     
-.left-content .business-hall {
+}
+.left-content .business-hall{
     height: 38.2%;
     
 }
-
-.left-content .passenger-flow {
+.left-content .passenger-flow{
     height: 39.7%;
 }
-
-.left-content .hall-statistics {
+.left-content .hall-statistics{
     height: 20.4%;
 }
-
-.right-content .payment {
+.right-content .payment{
     height: 38.3%;
 }
-
-.right-content .business-acceptance {
+.right-content .business-acceptance{
     height: 30%;
 }
-
-.right-content .service {
+.right-content .service{
     height: 30%;
 }
-
-.right-content {
+.right-content{
     right: 0;
 }
-
-.left-content {
+.left-content{
     left: 0;
 }
 </style>