修改充电订单样式

jsowell-ui/src/views/order/order/index.vue

@@ -1,82 +1,57 @@
 <template>
     <div class="app-container">
-        <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch"
-                 label-width="168px"
-                 @submit.native.prevent>
+        <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="168px"
+            @submit.native.prevent>
             <el-form-item label="所属运营商" prop="merchantId" label-width="120">
-                <el-select v-model="queryParams.merchantId" filterable clearable placeholder="请选择运营商" @change="changeSelectMerchant(queryParams.merchantId)">
-                    <el-option
-                        v-for="item in merchantList"
-                        :key="item.merchantName"
-                        :label="item.merchantName"
-                        :value="item.id"
-                    />
+                <el-select v-model="queryParams.merchantId" filterable clearable placeholder="请选择运营商"
+                    @change="changeSelectMerchant(queryParams.merchantId)">
+                    <el-option v-for="item in merchantList" :key="item.merchantName" :label="item.merchantName"
+                        :value="item.id" />
                 </el-select>
             </el-form-item>
             <el-form-item label="站点" prop="stationId">
-                <el-select v-model="queryParams.stationId" placeholder="请选择站点" clearable filterable
-                           style="width: 140px">
-                    <el-option
-                        v-for="(station, index) in stationList"
-                        :key="index"
-                        :label="station.stationName"
-                        :value="station.id"
-                    />
+                <el-select v-model="queryParams.stationId" placeholder="请选择站点" clearable filterable style="width: 140px">
+                    <el-option v-for="(station, index) in stationList" :key="index" :label="station.stationName"
+                        :value="station.id" />
                 </el-select>
             </el-form-item>
 
             <el-form-item label="订单编号" prop="orderCode">
                 <el-input v-model="queryParams.orderCode" placeholder="请输入订单编号" clearable
-                          @keyup.enter.native="handleQuery"/>
+                    @keyup.enter.native="handleQuery" />
             </el-form-item>
 
             <el-form-item label="订单状态" prop="orderStatus">
-                <el-select v-model="queryParams.orderStatus" placeholder="请选择订单状态" clearable
-                           style="width: 140px">
+                <el-select v-model="queryParams.orderStatus" placeholder="请选择订单状态" clearable style="width: 140px">
                     <el-option v-for="item1 in dict.type.order_status" :key="item1.value" :label="item1.label"
-                               :value="item1.value"/>
+                        :value="item1.value" />
                 </el-select>
             </el-form-item>
 
             <el-form-item label="手机号码" prop="mobileNumber">
                 <el-input v-model="queryParams.mobileNumber" placeholder="请输入手机号码" clearable
-                          @keyup.enter.native="handleQuery"/>
+                    @keyup.enter.native="handleQuery" />
             </el-form-item>
             <div v-if="buttonBoolean">
-                <el-form-item label="交易流水号" prop="transactionCode">
+                <el-form-item label="交易流水号" prop="transactionCode" label-width="120">
                     <el-input v-model="queryParams.transactionCode" placeholder="请输入交易流水号" clearable
-                              @keyup.enter.native="handleQuery"/>
+                        @keyup.enter.native="handleQuery" />
                 </el-form-item>
-
                 <el-form-item label="创建时间">
                     <el-date-picker v-model="createTimeRange" style="width: 240px" value-format="yyyy-MM-dd HH:mm:ss"
-                                    :default-time="['00:00:00', '23:59:59']" type="daterange" range-separator="-"
-                                    start-placeholder="开始日期"
-                                    end-placeholder="结束日期" :clearable="true"></el-date-picker>
+                        :default-time="['00:00:00', '23:59:59']" type="daterange" range-separator="-"
+                        start-placeholder="开始日期" end-placeholder="结束日期" :clearable="true"></el-date-picker>
                 </el-form-item>
-                <!-- <el-form-item label="结算时间">
-                  <el-date-picker
-                    v-model="settleTimeRange"
-                    style="width: 240px"
-                    value-format="yyyy-MM-dd HH:mm:ss"
-                    :default-time="['00:00:00', '23:59:59']"
-                    type="daterange"
-                    range-separator="-"
-                    start-placeholder="开始日期"
-                    end-placeholder="结束日期"
-                    :clearable="true"
-                  ></el-date-picker>
-                </el-form-item> -->
             </div>
             <el-button @click="showOrHide()" style="
-          border-color: white;
-          background-color: white;
-          font-size: x-small;
-          color: #50bfff;
-          padding: 1px 2px;
-          margin-left: 40%;
-          margin-top: 0px;
-          margin-bottom: 15px;
+            border-color: white;
+            background-color: white;
+            font-size: x-small;
+            color: #50bfff;
+            padding: 1px 2px;
+            margin-left: 40%;
+            margin-top: 0px;
+            margin-bottom: 15px;
         " :icon="icon">{{ showOrHideText }}
             </el-button>
         </el-form>
@@ -91,14 +66,14 @@
                 </el-button>
             </el-col>
             <el-button type="warning" plain icon="el-icon-download" size="mini" @click="handleExport"
-                       v-hasPermi="['order:order:export']">导出
+                v-hasPermi="['order:order:export']">导出
             </el-button>
             <div>
                 {{ dateDescription }}期间，总用电量{{
                     sumUsedElectricity
                 }}度，总消费金额{{ sumOrderAmount }}元，总结算金额{{
-                    sumSettleAmount
-                }}元
+    sumSettleAmount
+}}元
             </div>
             <el-popover placement="top-start" width="400" trigger="click">
                 <el-checkbox :indeterminate="isIndeterminate" v-model="checkAll" @change="handleCheckAllChange">全选
@@ -112,9 +87,9 @@
         </el-row>
         <el-skeleton style="width: 100%" :loading="loading" animated :count="3">
             <template slot="template">
-                <el-skeleton-item variant="text" style="width: 100%; height: 100%"/>
+                <el-skeleton-item variant="text" style="width: 100%; height: 100%" />
                 <div style="padding: 14px">
-                    <el-skeleton-item variant="h3" style="width: 50%"/>
+                    <el-skeleton-item variant="h3" style="width: 50%" />
                     <div style="
               display: flex;
               align-items: center;
@@ -122,15 +97,15 @@
               margin-top: 16px;
               height: 16px;
             ">
-                        <el-skeleton-item variant="text" style="margin-right: 16px"/>
-                        <el-skeleton-item variant="text" style="width: 30%"/>
+                        <el-skeleton-item variant="text" style="margin-right: 16px" />
+                        <el-skeleton-item variant="text" style="width: 30%" />
                     </div>
                 </div>
             </template>
             <template>
                 <template v-if="orderList.length !== 0">
                     <div class="cardview-box" v-for="(item, orderIndex) in orderList" :key="orderIndex"
-                         @change="handleSelectionChange">
+                        @change="handleSelectionChange">
                         <div class="cardview-static">
                             <div>
                                 <router-link :to="'/order/index/orderDetail/' + item.orderCode" class="link-type">
@@ -147,7 +122,7 @@
                         </div>
                         <div class="conter">
                             <el-descriptions class="title" :title="`${item.nickName || '---'}（${item.mobileNumber || '---'
-                }）`" :column="7">
+                                }）`" :column="7">
                                 <!-- @click.native="goMemberDetail(item)" -->
                                 <el-descriptions-item label="站点名称">
                                     <div style="color: #337ab7" @click="goStationDetail(item)">
@@ -172,7 +147,7 @@
                     </div>
 
                     <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum"
-                                :limit.sync="queryParams.pageSize" @pagination="getList"/>
+                        :limit.sync="queryParams.pageSize" @pagination="getList" />
                 </template>
                 <el-empty description="暂无数据" v-else></el-empty>
             </template>
@@ -190,13 +165,13 @@ import {
     totalData,
 } from "@/api/order/order";
 import Template from "@/views/billing/template";
-import {getStationListByMerchantId, getStationSelectList, listStation} from "@/api/pile/station";
-import {getDay} from "@/utils/common";
-import {getMerchantList} from "@/api/pile/merchant";
+import { getStationListByMerchantId, getStationSelectList, listStation } from "@/api/pile/station";
+import { getDay } from "@/utils/common";
+import { getMerchantList } from "@/api/pile/merchant";
 
 export default {
     name: "Order",
-    components: {Template},
+    components: { Template },
 
     dicts: ["order_status", "start_mode", "pay_mode", "pay_status"],
     data() {
@@ -509,7 +484,7 @@ export default {
                 });
         },
         /** 订单详情序号 */
-        rowOrderDetailIndex({row, rowIndex}) {
+        rowOrderDetailIndex({ row, rowIndex }) {
             row.index = rowIndex + 1;
         },
         /** 订单详情添加按钮操作 */