未使用以及恢复首页原有样式

jsowell-ui/src/views/homeIndex/homeIndex.vue

@@ -1,144 +1,132 @@
 <template>
   <div>
-    <h1>电桩</h1>
-    <hr />
-    <el-table
-      stripe
-      border
-      :data="tableData"
-      style="width: 100%">
-      <el-table-column
-        label="序号"
-        type="index"
-      >
-      </el-table-column>
-      <el-table-column
-        prop="pileSn"
-        label="编号">
-      </el-table-column>
-      <el-table-column
-        prop="stationName"
-        label="名称"
-      >
-      </el-table-column>
-      <el-table-column
-        prop="stationAddress"
-        label="电站">
-      </el-table-column>
-      <el-table-column
-        prop="type"
-        label="接口">
-      </el-table-column>
-      <el-table-column
-        prop="power"
-        label="功率">
-      </el-table-column>
-      <el-table-column
-        prop="degree"
-        label="度数">
-      </el-table-column>
-      <el-table-column
-        prop="electricityPrice"
-        label="电费">
-      </el-table-column>
-      <el-table-column
-        prop="servicePrice"
-        label="服务费">
-      </el-table-column>
-      <el-table-column
-        prop="chargingNumber"
-        label="充电次数">
-      </el-table-column>
-    </el-table>
+<!--    <h1>电桩</h1>-->
+<!--    <hr />-->
+<!--    <el-table-->
+<!--      stripe-->
+<!--      border-->
+<!--      :data="tableData"-->
+<!--      style="width: 100%">-->
+<!--      <el-table-column-->
+<!--        label="序号"-->
+<!--        type="index"-->
+<!--      >-->
+<!--      </el-table-column>-->
+<!--      <el-table-column-->
+<!--        prop="pileSn"-->
+<!--        label="编号">-->
+<!--      </el-table-column>-->
+<!--      <el-table-column-->
+<!--        prop="stationName"-->
+<!--        label="名称"-->
+<!--      >-->
+<!--      </el-table-column>-->
+<!--      <el-table-column-->
+<!--        prop="stationAddress"-->
+<!--        label="电站">-->
+<!--      </el-table-column>-->
+<!--      <el-table-column-->
+<!--        prop="type"-->
+<!--        label="接口">-->
+<!--      </el-table-column>-->
+<!--      <el-table-column-->
+<!--        prop="power"-->
+<!--        label="功率">-->
+<!--      </el-table-column>-->
+<!--      <el-table-column-->
+<!--        prop="degree"-->
+<!--        label="度数">-->
+<!--      </el-table-column>-->
+<!--      <el-table-column-->
+<!--        prop="electricityPrice"-->
+<!--        label="电费">-->
+<!--      </el-table-column>-->
+<!--      <el-table-column-->
+<!--        prop="servicePrice"-->
+<!--        label="服务费">-->
+<!--      </el-table-column>-->
+<!--      <el-table-column-->
+<!--        prop="chargingNumber"-->
+<!--        label="充电次数">-->
+<!--      </el-table-column>-->
+<!--    </el-table>-->
     <h1>概况</h1>
     <hr />
-    <el-row :gutter="24">
-      <el-col :span="4" :xs="24">
-        <div class="box">
-          <div>总充电电量</div>
-          <div class="box-text">
-            <b class="box-h1">{{ generalSituation.totalChargingDegree }}</b>
-            <i>度</i>
-            <el-image
-              style="width: 80px; height: 80px"
-              :src="require('@/assets/images/lightning.png')"
-            ></el-image>
-          </div>
-          <div class="progress"></div>
+    <div style="display: flex;justify-content: space-between">
+      <div class="box">
+        <div>总充电电量</div>
+        <div class="box-text">
+          <b class="box-h1">{{ generalSituation.totalChargingDegree }}</b>
+          <i>度</i>
+          <el-image
+            style="width: 80px; height: 80px"
+            :src="require('@/assets/images/lightning.png')"
+          ></el-image>
         </div>
-      </el-col>
-      <el-col :span="4" :xs="24">
-        <div class="box">
-          <div>总充电费用</div>
-          <div class="box-text">
-            <b class="box-h1">{{ generalSituation.totalChargingAmount }}</b>
-            <i>元</i>
-            <!-- <image src="/assets/images/login-background.jpg"></image> -->
-            <el-image
-              style="width: 80px; height: 80px"
-              :src="require('@/assets/images/zongfeiyong.png')"
-            ></el-image>
-          </div>
-          <div class="progress"></div>
+        <div class="progress"></div>
+      </div>
+      <div class="box">
+        <div>总充电费用</div>
+        <div class="box-text">
+          <b class="box-h1">{{ generalSituation.totalChargingAmount }}</b>
+          <i>元</i>
+          <!-- <image src="/assets/images/login-background.jpg"></image> -->
+          <el-image
+            style="width: 80px; height: 80px"
+            :src="require('@/assets/images/zongfeiyong.png')"
+          ></el-image>
         </div>
-      </el-col>
-      <el-col :span="4" :xs="24">
-        <div class="box">
-          <div>总充电订单数</div>
-          <div class="box-text">
-            <b class="box-h1">{{ generalSituation.totalChargingQuantity }}</b>
-            <i>笔</i>
-            <el-image
-              style="width: 80px; height: 80px"
-              :src="require('@/assets/images/dingdan.png')"
-            ></el-image>
-          </div>
-          <div class="progress"></div>
+        <div class="progress"></div>
+      </div>
+      <div class="box">
+        <div>总充电订单数</div>
+        <div class="box-text">
+          <b class="box-h1">{{ generalSituation.totalChargingQuantity }}</b>
+          <i>笔</i>
+          <el-image
+            style="width: 80px; height: 80px"
+            :src="require('@/assets/images/dingdan.png')"
+          ></el-image>
         </div>
-      </el-col>
-      <el-col :span="4" :xs="24">
-        <div class="box">
-          <div>总充电设备数量</div>
-          <div class="box-text">
-            <b class="box-h1">{{ generalSituation.totalPileQuantity }}</b>
-            <i>座</i>
-            <el-image
-              style="width: 80px; height: 80px"
-              :src="require('@/assets/images/shebei.png')"
-            ></el-image>
-          </div>
-          <div class="progress"></div>
+        <div class="progress"></div>
+      </div>
+      <div class="box">
+        <div>总充电设备数量</div>
+        <div class="box-text">
+          <b class="box-h1">{{ generalSituation.totalPileQuantity }}</b>
+          <i>座</i>
+          <el-image
+            style="width: 80px; height: 80px"
+            :src="require('@/assets/images/shebei.png')"
+          ></el-image>
         </div>
-      </el-col>
-      <el-col :span="4" :xs="24" v-hasRole="['admin', 'common']">
-        <div class="box" >
-          <div>总客户余额</div>
-          <div class="box-text">
-            <b class="box-h1">{{ generalSituation.totalMemberAmount }}</b>
-            <i>元</i>
-            <el-image
-              style="width: 80px; height: 80px"
-              :src="require('@/assets/images/yue.png')"
-            ></el-image>
-          </div>
-          <div class="progress"></div></div
-        >
-      </el-col>
-      <el-col :span="4" :xs="24">
-        <div class="box">
-          <div>总服务费金额</div>
-          <div class="box-text">
-            <b class="box-h1">{{ generalSituation.totalPileQuantity }}</b>
-            <i>元</i>
-            <el-image
-              style="width: 80px; height: 80px"
-              :src="require('@/assets/images/shebei.png')"
-            ></el-image>
-          </div>
-          <div class="progress"></div>
+        <div class="progress"></div>
+      </div>
+      <div class="box"  v-hasRole="['admin', 'common']">
+        <div>总客户余额</div>
+        <div class="box-text">
+          <b class="box-h1">{{ generalSituation.totalMemberAmount }}</b>
+          <i>元</i>
+          <el-image
+            style="width: 80px; height: 80px"
+            :src="require('@/assets/images/yue.png')"
+          ></el-image>
         </div>
-      </el-col>
-    </el-row>
+        <div class="progress"></div></div
+      >
+      <div class="box">
+        <div>总服务费金额</div>
+        <div class="box-text">
+          <b class="box-h1">{{ generalSituation.totalPileQuantity }}</b>
+          <i>元</i>
+          <el-image
+            style="width: 80px; height: 80px"
+            :src="require('@/assets/images/shebei.png')"
+          ></el-image>
+        </div>
+        <div class="progress"></div>
+      </div>
+    </div>
     <h1>订单</h1>
     <hr />
     <el-button style="background-color: #1ab394; color: #ffffff"