更新

Reviewed-on: #16

package.json

@@ -5,7 +5,7 @@
   "author": "Pan <panfree23@gmail.com>",
   "scripts": {
     "dev": "vue-cli-service serve",
-    "build:prod": "vue-cli-service build"
+    "build": "vue-cli-service build"
   },
   "dependencies": {
     "@amap/amap-jsapi-loader": "^1.0.1",

src/api/refineryAccount/accountDetails.js

@@ -0,0 +1,29 @@
+import request from 'utils/axios.js'
+// table
+const getByPage = params => {
+  return request.postJson('/oil-refinery/xoilRefineryAccountRecord/getByPage', params)
+}
+// 炼厂名称
+const getLikeByName = (params = {}) => {
+  return request.postJson('/oil-refinery/xoilRefineryAccountRecord/getLikeByNameOrId', params)
+}
+// 炼厂账户名称
+const getLikeRefineryAccount = (params = {}) => {
+  return request.postJson('/oil-refinery/xoilRefineryAccountRecord/getLikeRefineryAccount', params)
+}
+// 详情
+const searchInfo = query => {
+  return request.get(`/oil-user/sysCustomerInfo/searchInfo/${query}`)
+}
+// 详情
+const getById = query => {
+  return request.get(`oil-refinery/xoilRefineryAccountRecord/getById/${query}`)
+}
+
+export default {
+  getByPage,
+  getLikeByName,
+  getLikeRefineryAccount,
+  searchInfo,
+  getById
+}

src/permission.js

@@ -1,79 +1,79 @@
-import router from "./router";
+import router from './router'
-import store from "./store";
+import store from './store'
-import NProgress from "nprogress"; // progress bar
+import NProgress from 'nprogress' // progress bar
-import "nprogress/nprogress.css"; // progress bar style
+import 'nprogress/nprogress.css' // progress bar style
-import getPageTitle from "@/utils/get-page-title";
+import getPageTitle from '@/utils/get-page-title'
 
-import Layout from "@/layout";
+import Layout from '@/layout'
 
-import serve from "api/login.js";
+import serve from 'api/login.js'
 
-NProgress.configure({ showSpinner: false }); // NProgress Configuration
+NProgress.configure({ showSpinner: false }) // NProgress Configuration
 
-const whiteList = ["/login"]; // no redirect whitelist
+const whiteList = ['/login'] // no redirect whitelist
 
 router.beforeEach(async (to, from, next) => {
-  NProgress.start();
+  NProgress.start()
-  document.title = getPageTitle(to.meta.title);
+  document.title = getPageTitle(to.meta.title)
-  const hasToken = localStorage.getItem("businessToken");
+  const hasToken = localStorage.getItem('businessToken')
   if (hasToken) {
-    if (to.path === "/login") {
+    if (to.path === '/login') {
-      next({ path: "/" });
+      next({ path: '/' })
-      NProgress.done();
+      NProgress.done()
     } else {
-      const hasAuth = store.getters.auth && store.getters.auth.length;
+      const hasAuth = store.getters.auth && store.getters.auth.length
       if (hasAuth) {
-        next();
+        next()
       } else {
         try {
           // let infoRes = await serve.getUserInfo();
           // infoRes.data.authList = [1];
-          let infoRes = await serve.info();
+          let infoRes = await serve.info()
           // infoRes.data.authList = infoRes.authList;
 
-          store.dispatch("user/info", infoRes.data);
+          store.dispatch('user/info', infoRes.data)
 
-          let routerRes = await serve.getCustomerRouters();
+          let routerRes = await serve.getCustomerRouters()
-          let realRouter = filterAsyncRouter(routerRes.data);
+          let realRouter = filterAsyncRouter(routerRes.data)
-          store.dispatch("permission/generateRoutes", realRouter);
+          store.dispatch('permission/generateRoutes', realRouter)
-          router.addRoutes(realRouter);
+          router.addRoutes(realRouter)
-          next({ ...to, replace: true });
+          next({ ...to, replace: true })
         } catch (err) {
-          console.log("catch");
+          console.log('catch')
-          next("/login");
+          // next("/login");
-          NProgress.done();
+          NProgress.done()
         }
       }
     }
   } else {
     if (whiteList.includes(to.path)) {
-      next();
+      next()
     } else {
-      next("/login");
+      next('/login')
-      NProgress.done();
+      NProgress.done()
     }
   }
-});
+})
 
 router.afterEach(() => {
-  NProgress.done();
+  NProgress.done()
-});
+})
 
 function filterAsyncRouter(routers) {
-  return routers.map((route) => {
+  return routers.map(route => {
     if (route.component) {
-      if (route.component === "Layout") {
+      if (route.component === 'Layout') {
-        route.component = Layout;
+        route.component = Layout
       } else {
-        route.component = lazyLoad(route.component);
+        route.component = lazyLoad(route.component)
       }
     }
     if (route.children && route.children.length) {
-      route.children = filterAsyncRouter(route.children);
+      route.children = filterAsyncRouter(route.children)
     }
-    return route;
+    return route
-  });
+  })
 }
 function lazyLoad(path) {
-  return (resolve) => require([`@/views/${path}`], resolve);
+  return resolve => require([`@/views/${path}`], resolve)
 }

src/views/order/components/confirmSubmit.vue

@@ -64,7 +64,7 @@
             <template slot-scope="{ row }"> {{ row.floorPrice }}元 </template>
           </el-table-column>
           <el-table-column label="成本总金额">
-            <template slot-scope="{ row }"> {{ row.floorPrice * row.preQuantity | toNumberFixed }}元 </template>
+            <template slot-scope="{ row }"> {{ row.preCostAmount | toNumberFixed }}元 </template>
           </el-table-column>
         </el-table>
       </template>
@@ -126,7 +126,7 @@ export default {
       let { productId, salePrice, floorPrice } = this.controlWindows.addInfo
       if (productId) {
         serve.getRefineryProduct(productId).then(res => {
-          let data = res.data;
+          let data = res.data
           if (data.salePrice2company != salePrice || data.floorPrice != floorPrice) {
             console.log('价格发生变化了捏')
             // 新的价格
@@ -146,30 +146,62 @@ export default {
     // 策略选择
     policyPopulation() {
       let { salePrice, floorPrice, preQuantity, preAmount } = this.controlWindows.addInfo
-      // console.log(salePrice, preQuantity, preAmount)
+      if (salePrice && floorPrice && preQuantity && preAmount) {
-      if ((salePrice, preQuantity, preAmount)) {
+        let strategyArr = [
           // 原策略
-        Object.assign(this.tableData[0], { salePrice: salePrice.toFixed(2),
+          () => {
-          floorPrice: floorPrice.toFixed(2),
+            return { salePrice, floorPrice, preQuantity, preAmount, preCostAmount: floorPrice * preQuantity }
-          preQuantity: preQuantity.toFixed(2),
+          },
-          preAmount: preAmount.toFixed(2) })
           // 以提货量为准
-        Object.assign(this.tableData[1], {
+          () => {
-          salePrice: (this.newSalePrice).toFixed(2),
+            let _salePrice = this.newSalePrice
-          floorPrice: (this.newCostPrice).toFixed(2),
+            let _floorPrice = this.newCostPrice
-          preQuantity: preQuantity.toFixed(2),
+            return {
-          preAmount: (+this.newSalePrice * +preQuantity).toFixed(2)
+              salePrice: _salePrice,
-        })
+              floorPrice: _floorPrice,
+              preQuantity,
+              preAmount: _salePrice * preQuantity,
+              preCostAmount: _floorPrice * preQuantity
+            }
+          },
           // 以订单金额为准
-        Object.assign(this.tableData[2], {
+          () => {
-          salePrice: (this.newSalePrice).toFixed(2),
+            let _salePrice = this.newSalePrice
-          floorPrice: (this.newCostPrice).toFixed(2),
+            let _floorPrice = this.newCostPrice
-          preQuantity: (+preAmount / +this.newSalePrice).toFixed(2),
+            return {
-          preAmount: preAmount.toFixed(2)
+              salePrice: _salePrice,
+              floorPrice: _floorPrice,
+              preQuantity: preAmount / _salePrice,
+              preAmount,
+              preCostAmount: _floorPrice * this.fixedHandle(preAmount / _salePrice)
+            }
+          }
+        ]
+        strategyArr.forEach((item, index) => {
+          let data = item()
+          for (let key in data) {
+            data[key] = this.fixedHandle(data[key])
+          }
+          Object.assign(this.tableData[index], data)
         })
+
         this.undergoChanges = true
       }
     },
+    fixedHandle(val) {
+      val = parseFloat(val)
+      if (!isNaN(val)) {
+        let fixedLength4 = val.toFixed(4)
+        let length = fixedLength4.length
+        let fixedLength3 = fixedLength4.slice(0, length - 1)
+        fixedLength3 *= 100
+        fixedLength3 = Math.round(fixedLength3)
+        fixedLength3 /= 100
+        let fixedLength2 = fixedLength3.toFixed(2)
+        return fixedLength2
+      }
+      return 0
+    },
     submit() {
       if (this.undergoChanges) {
         let targetPolicy = this.tableData.filter(item => item.isChecked)

src/views/order/index.vue

@@ -116,6 +116,9 @@
               <el-link slot="reference" type="primary" :underline="false">订单锁定</el-link>
             </el-popconfirm>
 
+            <!-- <el-popconfirm v-if="row.orderStatus == 'ORDER_LOCKED'" title="是否确认下单？" icon-color="red" @confirm="confirmSubmit(row)">
+            </el-popconfirm> -->
+
             <el-link v-if="row.orderStatus == 'ORDER_LOCKED'" type="primary" :underline="false" @click="confirmSubmit(row)">下单确认</el-link>
 
             <el-popconfirm
@@ -395,6 +398,14 @@ export default {
     confirmSubmit(row) {
       this.controlWindows.addInfo = row
       this.controlWindows.confirmSubmit = true
+
+      // order.orderSuccess({ id: row.id }).then(res => {
+      //   if (res.code == 20000) {
+      //     this.$message.success(res.msg)
+      //     // this.closeWindow()
+      //     this.getByPage()
+      //   }
+      // })
     },
     //启用禁用
     switchTrigger(val, row) {

src/views/refineryAccount/accountDetails/components/generalDetails.vue

@@ -0,0 +1,295 @@
+<template>
+  <div class="generalDetails_body pft14">
+    <div class="generalDetails_header" v-if="isHeader">
+      <slot name="generalDetails_header">
+        {{ title }}
+      </slot>
+    </div>
+    <div class="title_bottom">
+      <slot name="title_bottom"></slot>
+    </div>
+    <div class="generalDetails_card_container">
+      <div v-for="(item, index) in dataPage" :key="index">
+        <el-card class="generalDetails_card">
+          <div @click="isShow(item)" class="generalDetails_card_header" slot="header">
+            <div>
+              <span class="generalDetails-card-header-icon">
+                <svg-icon style="color: #118dde" :icon-class="item.iconClass" />
+              </span>
+              <span class="generalDetails-card-header-text">{{ item.title }}</span>
+            </div>
+            <div class="fold">
+              <i :style="{ transform: `rotate(${item.isFold ? 0 : 180}deg)` }" class="el-icon-arrow-down generalDetails_card_arrow_down"></i>
+            </div>
+          </div>
+          <div :style="{ maxHeight: item.isFold ? '100vh' : '0px' }" class="my-cell">
+            <template v-if="item.listData.length && item.listData[0].field !== 'table'">
+              <div v-for="(i, x) in item.listData" :key="x" class="cell-item">
+                <span :title="i.remark" class="color-999 test-tst">
+                  {{ i.label }}
+                  <i v-if="i.remark" class="header-icon el-icon-info"></i>
+                  <i @click="isCopy($event)" v-if="i.isCopy" class="el-icon-document-copy"></i>
+                </span>
+                <br />
+                <slot class="inner-data" :name="`${i.field}`">
+                  <span class="inner-data">{{ i.value }}</span>
+                </slot>
+              </div>
+            </template>
+
+            <slot v-else name="table"> </slot>
+          </div>
+        </el-card>
+        <div>
+          <slot :name="`${index}card_bottom`"></slot>
+        </div>
+      </div>
+      <div v-for="(item, index) in dataPage2" :key="index + 'i'">
+        <el-card class="generalDetails_card">
+          <div @click="isShow2(item)" class="generalDetails_card_header" slot="header">
+            <div>
+              <span class="generalDetails-card-header-icon">
+                <svg-icon style="color: #118dde" :icon-class="item.iconClass" />
+              </span>
+              <span class="generalDetails-card-header-text">{{ item.title }}</span>
+            </div>
+            <div class="fold">
+              <i :style="{ transform: `rotate(${item.isFold ? 0 : 180}deg)` }" class="el-icon-arrow-down generalDetails_card_arrow_down"></i>
+            </div>
+          </div>
+          <div :style="{ maxHeight: item.isFold ? '100vh' : '0px' }" class="my-cell">
+            <template v-if="item.listData.length && item.listData[0].field !== 'table'">
+              <div v-for="(i, x) in item.listData" :key="x" class="cell-item">
+                <span :title="i.remark" class="color-999 test-tst">
+                  {{ i.label }}
+                  <i v-if="i.remark" class="header-icon el-icon-info"></i>
+                  <i @click="isCopy($event)" v-if="i.isCopy" class="el-icon-document-copy"></i>
+                </span>
+                <br />
+                <slot class="inner-data" :name="`${i.field}`">
+                  <span class="inner-data">{{ i.value }}</span>
+                </slot>
+              </div>
+            </template>
+
+            <slot v-else name="table"> </slot>
+          </div>
+        </el-card>
+        <div>
+          <slot :name="`${index}card_bottom`"></slot>
+        </div>
+      </div>
+    </div>
+    <div class="generalDetails_footer">
+      <slot name="footer">
+        <el-button @click="close" type="primary">关闭</el-button>
+      </slot>
+    </div>
+  </div>
+</template>
+
+<script>
+import handleClipboard from '@/utils/clipboard.js'
+export default {
+  name: 'generalDetailsAcc',
+  props: {
+    sourceData: {
+      type: Array,
+      default: () => []
+    },
+    mappingData: {
+      type: Array,
+      default: () => []
+    },
+    mappingData2: {
+      type: Array,
+      default: () => []
+    },
+    isHeader: {
+      type: Boolean,
+      default: false
+    },
+    title: {
+      type: String,
+      default: '详情'
+    }
+  },
+  data() {
+    return {
+      dataPage: [],
+      dataPage2: []
+    }
+  },
+  created() {
+    this.sourceData && this.mappingData.length && this.init()
+    this.sourceData && this.mappingData2.length && this.init2()
+  },
+  methods: {
+    isShow(item) {
+      item.isFold = !item.isFold
+    },
+    isShow2(item) {
+      item.isFold = !item.isFold
+    },
+    isCopy(event) {
+      handleClipboard(event)
+    },
+    close() {
+      this.$emit('close')
+    },
+    init() {
+      this.dataPage = this.mappingData.map((mappingDataItem, mappingDataIndex) => {
+        let shineData = this.sourceData[mappingDataIndex] || {}
+        return {
+          title: mappingDataItem.carTitle,
+          iconClass: mappingDataItem.iconClass || 'iconjichuziliao',
+          isFold: mappingDataItem.isFold || true,
+          listData: mappingDataItem.carItems.map(carItem => {
+            let value =
+              (typeof carItem.value == 'function' && carItem.value(shineData)) || shineData[carItem.value] == 0
+                ? 0
+                : shineData[carItem.value] || carItem.fieldDefault || ''
+            return {
+              label: carItem.label,
+              value: value,
+              field: carItem.value,
+              remark: carItem.remark,
+              isCopy: carItem.isCopy || false
+            }
+          })
+        }
+      })
+    },
+    init2() {
+      this.dataPage2 = this.mappingData2.map((mappingDataItem, mappingDataIndex) => {
+        let shineData2 = this.sourceData[mappingDataIndex] || {}
+        return {
+          title: mappingDataItem.carTitle,
+          iconClass: mappingDataItem.iconClass || 'iconjichuziliao',
+          isFold: mappingDataItem.isFold || true,
+          listData: mappingDataItem.carItems.map(carItem => {
+            let value =
+              (typeof carItem.value == 'function' && carItem.value(shineData2)) || shineData2[carItem.value] == 0
+                ? 0
+                : shineData2[carItem.value] || carItem.fieldDefault || ''
+            return {
+              label: carItem.label,
+              value: value,
+              field: carItem.value,
+              remark: carItem.remark,
+              isCopy: carItem.isCopy || false
+            }
+          })
+        }
+      })
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.title_bottom {
+  margin-top: 20px;
+}
+.fold {
+  display: flex;
+  justify-content: flex-end;
+  align-items: center;
+  flex: 1;
+}
+
+.generalDetails_card_arrow_down {
+  transition: all 0.9s;
+}
+
+.generalDetails_card_header {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+
+title {
+  background-color: black !important;
+}
+
+.inner-data {
+  font-size: 14px;
+}
+
+.my-cell {
+  color: #666;
+  display: flex;
+  flex-direction: row;
+  width: 100%;
+  float: left;
+  flex-wrap: wrap;
+  max-height: 100vh;
+  overflow: hidden;
+  transition: all 0.9s;
+}
+
+.color-999 {
+  color: #999;
+  font-size: 11px;
+  padding-right: 2rem;
+  padding-bottom: 8px !important;
+  display: inline-block;
+  min-width: 5rem;
+}
+
+.cell-item {
+  width: calc(100% / 4);
+  margin-bottom: 20px;
+}
+
+.generalDetails_card {
+  margin-bottom: 25px;
+  position: relative;
+}
+
+.generalDetails-card-header-icon {
+  font-size: 24px;
+}
+
+.generalDetails-card-header-text {
+  font-weight: bold;
+}
+
+.generalDetails_footer {
+  min-height: 50px;
+  position: sticky;
+  bottom: 0px;
+  width: 100%;
+  display: flex;
+  justify-content: right;
+  padding: 15px 20px;
+  box-sizing: border-box;
+  border-top: solid 1px #e5e5e5;
+}
+
+.generalDetails_header {
+  min-height: 50px;
+  width: 100%;
+  display: flex;
+  padding: 15px 20px;
+  box-sizing: border-box;
+  border-bottom: solid 1px #e5e5e5;
+  font-weight: bold;
+}
+
+.generalDetails_card_container {
+  flex: 1;
+  padding: 20px;
+  box-sizing: border-box;
+  overflow: auto;
+  position: relative;
+}
+
+.generalDetails_body {
+  width: 100%;
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+  position: relative;
+}
+</style>

src/views/refineryAccount/accountDetails/index.vue

@@ -0,0 +1,335 @@
+<template>
+  <div class="order">
+    <div class="frame">
+      <autocomplete class="mr20" :params="parameter.params" :config="configAutocomplete" />
+      <autocomplete class="mr20" :params="parameter.params" :config="configAutocompleteaccount" />
+      <el-select
+        v-model="parameter.params.createUser"
+        filterable
+        remote
+        reserve-keyword
+        clearable
+        placeholder="请输入姓名/手机号码"
+        :remote-method="searchUserInfo"
+      >
+        <el-option v-for="item in sysCustomerList" :key="item.id" :label="item.userName" :value="item.id">
+          {{ item.phone }} ( {{ item.userName }} - {{ item.userCode }})
+        </el-option>
+      </el-select>
+      <!-- <el-input v-model="parameter.params.creater" placeholder="创建人姓名或手机号" clearable></el-input> -->
+      <el-select v-model="parameter.params.transactionType" placeholder="交易类型" clearable>
+        <el-option v-for="(item, index) in rechargeTypeEnum" :key="index" :label="item.label" :value="item.value"> </el-option>
+      </el-select>
+      <el-date-picker
+        v-model="datetime"
+        type="datetimerange"
+        align="right"
+        start-placeholder="开始时间"
+        end-placeholder="结束时间"
+        :default-time="['00:00:00', '23:59:59']"
+        value-format="yyyy-MM-dd HH:mm:ss"
+        @change="changeDateTime"
+      >
+      </el-date-picker>
+      <div class="buttons">
+        <el-button icon="el-icon-search" @click="search">查询</el-button>
+        <el-button icon="el-icon-refresh" @click="reset">重置</el-button>
+      </div>
+    </div>
+    <div class="table">
+      <div class="operation"></div>
+      <el-table v-if="tableHeight" ref="multipleTable" :height="tableHeight" :data="tableData" style="width: 100%">
+        <el-table-column label="序号" type="index" :index="indexMethod" align="center" />
+        <el-table-column prop="refineryName" label="炼厂信息" show-overflow-tooltip align="center" min-width="180">
+          <template slot-scope="{ row }">
+            <p>{{ row.refineryName }}</p>
+            <p>{{ row.refineryId }}</p>
+          </template>
+        </el-table-column>
+        <el-table-column prop="transactionType" label="交易类型" show-overflow-tooltip align="center">
+          <template slot-scope="{ row }">
+            <p>
+              {{ rechargeTypeEnum.find(item => item.value == row.transactionType).label }}
+            </p>
+          </template>
+        </el-table-column>
+        <el-table-column prop="transactionAmount" label="发生金额" align="center"></el-table-column>
+        <el-table-column prop="balance" label="账户余额" align="center">
+          <template slot-scope="{ row }">
+            <p>上次：{{ row.lastBalance }}</p>
+            <p>当前：{{ row.currentBalance }}</p>
+          </template>
+        </el-table-column>
+        <el-table-column prop="rechargeBalance" label="充值余额" align="center">
+          <template slot-scope="{ row }">
+            <p>上次：{{ row.lastRechargeBalance }}</p>
+            <p>当前：{{ row.currentRechargeBalance }}</p>
+          </template>
+        </el-table-column>
+        <el-table-column prop="totalRechargeBalance" label="创建信息" align="center" min-width="180">
+          <template slot-scope="{ row }">
+            <p>{{ row.userName }}</p>
+            <p>{{ row.createTime }}</p>
+          </template>
+        </el-table-column>
+
+        <el-table-column label="操作" width="100">
+          <template slot-scope="{ row }">
+            <el-link type="primary" :underline="false" @click="detailBefore(row)">详情</el-link>
+          </template>
+        </el-table-column>
+      </el-table>
+      <!-- 分页 -->
+      <pagination :parameter="parameter" @searchAgain="getByPage" />
+    </div>
+
+    <el-drawer title="详情" direction="ltr" size="60%" :withHeader="false" :visible.sync="controlWindows.detail">
+      <general-details
+        class="pft14"
+        title="详情"
+        :isHeader="true"
+        v-if="controlWindows.detail"
+        :sourceData="oilCompanyMatch"
+        :mappingData="mappingData"
+        :mappingData2="mappingData2"
+        @close="controlWindows.detail = false"
+      >
+        <template #refineryType>
+          <p>
+            {{ refineryTypeEnum.find(item => item.value == oilCompanyMatch[0].accountType).label }}
+          </p>
+        </template>
+        <template #accountStatus>
+          <p>
+            {{ oilCompanyMatch[0].accountStatus === 'ENABLE' ? '启用' : '禁用' }}
+          </p>
+        </template>
+      </general-details>
+    </el-drawer>
+  </div>
+</template>
+
+<script>
+import serve from 'api/refineryAccount/accountDetails.js'
+
+import pagination from 'components/pagination/index.vue'
+import autocomplete from 'components/autocomplete/index.vue'
+import generalDetails from './components/generalDetails.vue'
+
+import { rechargeTypeEnum, refineryTypeEnum, refineryAccountTypeEnum } from 'utils/dataType.js'
+
+export default {
+  components: {
+    pagination,
+    autocomplete,
+    generalDetails
+  },
+  data() {
+    return {
+      rechargeTypeEnum: rechargeTypeEnum,
+      refineryTypeEnum: refineryTypeEnum,
+      refineryAccountTypeEnum: refineryAccountTypeEnum,
+      controlWindows: {
+        addInfo: {},
+        detail: false
+      },
+      configAutocomplete: {
+        serveTarget: serve.getLikeByName,
+        autocompleteKey: 'refineryName',
+        labelKey: 'refineryName',
+        valueKey: 'id',
+        placeholder: '炼厂名称',
+        querykey: 'refineryId'
+      },
+      configAutocompleteaccount: {
+        serveTarget: serve.getLikeRefineryAccount,
+        autocompleteKey: 'accountName',
+        labelKey: 'accountName',
+        valueKey: 'id',
+        placeholder: '炼厂账户名称',
+        querykey: 'refineryAccountId'
+      },
+      refineryList: [],
+      tableHeight: 0,
+      tableData: [],
+      parameter: {
+        currentPage: 1,
+        pageSize: 10,
+        total: 0,
+        params: {}
+      },
+      oilCompanyMatch: {},
+      mappingData: [
+        {
+          carTitle: '炼厂账户明细基础信息',
+          carItems: [
+            { label: '炼厂名称', value: 'refineryName' },
+            { label: '炼厂ID', value: 'refineryId' },
+            { label: '炼厂账户名称', value: 'accountName' },
+            { label: '炼厂账户ID', value: 'refineryAccountId' },
+            { label: '订单ID', value: 'orderId' },
+            { label: '业务申请ID', value: 'reverseId' }
+          ]
+        }
+      ],
+      mappingData2: [
+        {
+          carTitle: '炼厂账户明细财务信息',
+          carItems: [
+            { label: '发生金额', value: 'transactionAmount' },
+            { label: '交易类型', value: 'transactionType' },
+            { label: '上次累计充值金额', value: 'lastTotalRechargeAmount' },
+            { label: '当前累计充值金额', value: 'currentTotalRechargeAmount' },
+            { label: '上次账户总余额', value: 'lastBalance' },
+            { label: '当前账户总余额', value: 'currentBalance' },
+            { label: '上次充值金额', value: 'lastRechargeBalance' },
+            { label: '当前充值金额', value: 'currentRechargeBalance' },
+            { label: '创建人', value: 'userName' },
+            { label: '创建时间', value: 'createTime' },
+            { label: '创建系统', value: 'createSource' }
+          ]
+        }
+      ],
+      datetime: [],
+      sysCustomerList: []
+    }
+  },
+
+  mounted() {
+    this.$nextTick(() => {
+      this.heightHandle()
+    })
+    window.addEventListener('resize', this.$utils.debounce(this.heightHandle, 500))
+  },
+  created() {
+    this.getByPage()
+  },
+  methods: {
+    search() {
+      this.parameter.currentPage = 1
+      this.getByPage()
+    },
+    // table list
+    getByPage() {
+      serve.getByPage(this.parameter).then(res => {
+        this.tableData = res.data.list
+        this.parameter.total = res.data.totalCount
+      })
+    },
+    // 详情接口
+    detailBefore(row) {
+      serve.getById(row.id).then(res => {
+        this.detail(res.data)
+      })
+    },
+    // 详情
+    detail(row) {
+      this.oilCompanyMatch = [row]
+      this.controlWindows.detail = true
+    },
+    // 重置
+    reset() {
+      Object.assign(this.parameter, {
+        currentPage: 1,
+        pageSize: 10,
+        params: {}
+      })
+      this.datetime = []
+    },
+    // table height
+    heightHandle() {
+      let bodyHeight = document.body.clientHeight
+      let frameHeight = this.obtainElement('.frame').clientHeight
+      let operationHeight = this.obtainElement('.operation').clientHeight
+      let paginationHeight = this.obtainElement('.el-pagination').clientHeight
+      this.tableHeight = bodyHeight - frameHeight - operationHeight - paginationHeight - 145
+    },
+    obtainElement(className) {
+      return document.documentElement.querySelector(className)
+    },
+    changeDateTime(val) {
+      if (val) {
+        this.parameter.params.startCreateTime = val[0]
+        this.parameter.params.endCreateTime = val[1]
+      } else {
+        this.parameter.params.startCreateTime = ''
+        this.parameter.params.endCreateTime = ''
+      }
+    },
+    indexMethod(index) {
+      return index + 1
+    },
+    searchUserInfo(info) {
+      if (info && info !== '') {
+        serve.searchInfo(info).then(res => {
+          this.sysCustomerList = res.data
+        })
+      }
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.order {
+  .pft14 {
+    font-size: 14px;
+  }
+  .frame {
+    margin: 20px;
+    padding: 20px;
+    // width: 100%;
+    border-radius: 6px;
+    border: 1px solid #e3e3e5;
+    background: #fff;
+    .el-input,
+    .el-select {
+      width: 183px;
+      height: 40px;
+    }
+    .el-autocomplete + .el-select,
+    .el-input + .el-input,
+    .el-input + .el-select,
+    .el-select + .el-select,
+    .el-select + .el-input {
+      margin-right: 20px;
+      margin-bottom: 15px;
+    }
+    .mr20 {
+      margin-right: 20px;
+    }
+    .buttons {
+      text-align: right;
+    }
+  }
+
+  .table {
+    overflow: hidden;
+    margin: 0 20px;
+    padding-bottom: 20px;
+    background: #fff;
+    border-radius: 6px;
+    border: 1px solid #e3e3e5;
+    > .operation {
+      box-sizing: content-box;
+      padding: 15px;
+    }
+    .gray {
+      color: #999;
+      span {
+        color: #333;
+      }
+    }
+    .el-table {
+      margin-bottom: 20px;
+      border-radius: 10px 10px 0px 0px;
+    }
+    .el-link {
+      margin-right: 10px;
+    }
+  }
+  .pft14 {
+    font-size: 14px;
+  }
+}
+</style>