2021/03/25

src/api/data/order_belong.js

@@ -0,0 +1,20 @@
+import request from '@/utils/request'
+
+// list
+export function list(params) {
+  return request({
+    url: '/orders/GetBelongOrderRank',
+    method: 'get',
+    params
+  })
+}
+
+// 导出
+export function toExport(params) {
+  return request({
+    url: '/orders/ExportBelongOrderRank',
+    method: 'get',
+    params
+  })
+}
+

src/api/order/store.js

@@ -18,3 +18,20 @@ export function downOrder(params) {
   })
 }
 
+// 拆单
+export function BreakUpOrder(params) {
+  return request({
+    url: '/data/orderStoreBreakUpCourier',
+    method: 'get',
+    params
+  })
+}
+
+// 订单金额
+export function list_down(params) {
+  return request({
+    url: '/data/order_store_list_down',
+    method: 'get',
+    params
+  })
+}

src/pages/data/order.vue

@@ -2,7 +2,7 @@
   <div class="app-container">
     <div v-loading.fullscreen.lock="loadingFull" />
     <div class="search-container">
-      <el-input v-model="listQuery.search_name" type="text" placeholder="下单人昵称" style="width:300px" @keyup.enter.native="listQuery.page_index = 1; getList()" />
+      <el-input v-model="listQuery.search_name" type="text" placeholder="下单人昵称/姓名/手机号" style="width:300px" @keyup.enter.native="listQuery.page_index = 1; getList()" />
       <el-select v-model="listQuery.activity_id" style="width: 400px">
         <el-option label="全部" value="" />
         <el-option v-for="item in activitys" :key="item.id" :label="item.title" :value="item.id" />

src/pages/data/order_belong.vue

@@ -0,0 +1,334 @@
+<template>
+  <div class="app-container">
+    <div v-loading.fullscreen.lock="loadingFull" />
+    <div class="search-container">
+      <el-input v-model="listQuery.search_name" type="text" placeholder="所属者昵称/姓名/手机号" style="width:300px" @keyup.enter.native="listQuery.page_index = 1; getList()" />
+      <el-select v-model="listQuery.activity_id" style="width: 400px">
+        <el-option label="全部" value="" />
+        <el-option v-for="item in activitys" :key="item.id" :label="item.title" :value="item.id" />
+      </el-select>
+      <el-date-picker
+        v-model="listQuery.time"
+        type="datetimerange"
+        range-separator="至"
+        start-placeholder="开始日期"
+        end-placeholder="结束日期"
+        value-format="yyyy-MM-dd HH:mm"
+        format="yyyy-MM-dd HH:mm"
+      />
+      <el-button type="primary" @click="listQuery.page_index = 1; getList()">搜索</el-button>
+      <el-button type="primary" @click="toExport">导出</el-button>
+    </div>
+    <!-- <div class="total_money">
+      <span>总订货金额: <i class="red">{{ parseMoney(total.all) }}</i></span>
+      <span>总付款金额: <i class="red">{{ parseMoney(total.pay) }}</i></span>
+      <span>总未付款金额: <i class="red">{{ parseMoney(total.no_pay) }}</i></span>
+      <span>总资金账户余额: <i class="red">{{ parseMoney(total.all_money) }}</i></span>
+    </div> -->
+    <el-table
+      border
+      stripe
+      :header-cell-style="{ background: '#f8fbfc' }"
+      class="tableBorder"
+      :data="limitTable"
+      @sort-change="MoneySort"
+    >
+      <el-table-column
+        type="index"
+        :index="index"
+        label="序号"
+        width="80"
+        align="center"
+      >
+        <span slot-scope="{ row: { no_pay_account }, $index }" :class="no_pay_account > 0 ? 'red' : ''">{{ $index + 1 + Number(listQuery.page_size) * (Number(listQuery.page_index) - 1) }}</span>
+      </el-table-column>
+      <el-table-column
+        prop="nickname"
+        label="所属者昵称"
+      >
+        <span slot-scope="{ row: { nickname, no_pay_account } }" :class="no_pay_account > 0 ? 'red' : ''">{{ nickname }}</span>
+      </el-table-column>
+      <el-table-column
+        prop="realname"
+        label="所属者姓名"
+      >
+        <span slot-scope="{ row: { realname, no_pay_account } }" :class="no_pay_account > 0 ? 'red' : ''">{{ realname }}</span>
+      </el-table-column>
+      <el-table-column
+        prop="level"
+        label="所属者等级"
+      >
+        <template slot-scope="{ row }">
+          <span :class="row.no_pay_account > 0 ? 'red' : ''">{{ row['level'] || 0 }} </span>
+        </template>
+      </el-table-column>
+      <el-table-column
+        prop="mobile"
+        label="所属者手机号"
+      >
+        <span slot-scope="{ row: { mobile, no_pay_account } }" :class="no_pay_account > 0 ? 'red' : ''">{{ mobile }}</span>
+      </el-table-column>
+      <el-table-column
+        prop="u_nickname"
+        label="下单人昵称"
+      >
+        <span slot-scope="{ row: { u_nickname, no_pay_account } }" :class="no_pay_account > 0 ? 'red' : ''">{{ u_nickname }}</span>
+      </el-table-column>
+      <el-table-column
+        prop="u_mobile"
+        label="下单人手机号"
+      >
+        <span slot-scope="{ row: { u_mobile, no_pay_account } }" :class="no_pay_account > 0 ? 'red' : ''">{{ u_mobile }}</span>
+      </el-table-column>
+
+      <el-table-column
+        prop="精装版"
+        label="精装版"
+        sortable="custom"
+      >
+        <template slot-scope="{ row }">
+          <span :class="row.no_pay_account > 0 ? 'red' : ''">{{ row['精装版'] || 0 }} </span>
+        </template>
+      </el-table-column>
+      <el-table-column
+        prop="简约版"
+        label="简约版"
+        sortable="custom"
+      >
+        <template slot-scope="{ row }">
+          <span :class="row.no_pay_account > 0 ? 'red' : ''">{{ row['简约版'] || 0 }} </span>
+        </template>
+      </el-table-column>
+      <el-table-column
+        prop="老人版"
+        label="老人版"
+        sortable="custom"
+      >
+        <template slot-scope="{ row }">
+          <span :class="row.no_pay_account > 0 ? 'red' : ''">{{ row['老人版'] || 0 }} </span>
+        </template>
+      </el-table-column>
+      <el-table-column
+        prop="纯棉老人版"
+        label="纯棉老人版"
+        sortable="custom"
+      >
+        <template slot-scope="{ row }">
+          <span :class="row.no_pay_account > 0 ? 'red' : ''">{{ row['纯棉老人版'] || 0 }} </span>
+        </template>
+      </el-table-column>
+      <!-- <el-table-column
+        prop="account"
+        label="订货金额"
+        sortable="custom"
+      >
+        <span slot-scope="{ row: { account, no_pay_account } }" :class="no_pay_account > 0 ? 'red' : ''">{{ parseMoney(account) }}</span>
+      </el-table-column>
+      <el-table-column
+        prop="pay_account"
+        label="已付款金额"
+        sortable="custom"
+      >
+        <span slot-scope="{ row: { pay_account, no_pay_account } }" :class="no_pay_account > 0 ? 'red' : ''">{{ parseMoney(pay_account) }}</span>
+      </el-table-column>
+      <el-table-column
+        prop="no_pay_account"
+        label="未付款金额"
+        sortable="custom"
+      >
+        <span slot-scope="{ row: { no_pay_account } }" :class="no_pay_account > 0 ? 'red' : ''">{{ parseMoney(no_pay_account) }}</span>
+      </el-table-column> -->
+      <!-- <el-table-column
+        prop="money"
+        label="账户余额"
+        sortable="custom"
+      >
+        <span slot-scope="{ row: { money } }" :class="money > 0 ? 'red' : ''">{{ parseMoney(money) }}</span>
+      </el-table-column> -->
+    </el-table>
+    <!-- 分页 -->
+    <pagination :total="tablelist.length" :limit="listQuery.page_size" :page="listQuery.page_index" @pagination="changePagination" @update:limit="changePagination" />
+  </div>
+</template>
+<script>
+// api
+import { list, toExport } from '@/api/data/order_belong'
+import { parseMoney } from '@/utils/index'
+import { formatter } from '@/filters/index'
+import { activityList } from '@/api/giftB'
+export default {
+  data() {
+    return {
+      loadingFull: false,
+      listQuery: {
+        page_index: 1,
+        page_size: 50,
+        search_name: '',
+        time: '',
+        activity_id: ''
+      },
+      tablelist: [],
+      tableTotal: 0,
+      total: {
+        all: 0,
+        pay: 0,
+        no_pay: 0,
+        all_money: 0
+      },
+      activitys: []
+    }
+  },
+  computed: {
+    limitTable() {
+      const { page_index, page_size } = this.listQuery
+      return this.tablelist.slice((Number(page_index) - 1) * Number(page_size), (Number(page_index) - 1) * Number(page_size) + page_size)
+    }
+  },
+  created() {
+    this.parseMoney = parseMoney
+    this.activityList(() => {
+      this.getList()
+    })
+  },
+  methods: {
+    async getList() {
+      this.loadingFull = true
+      const { page_index, page_size, search_name, time, activity_id } = this.listQuery
+      await list({
+        page_index, page_size, search_name, activity_id,
+        start_time: (time && time.length > 0) ? time[0] : '',
+        end_time: (time && time.length > 0) ? time[1] : ''
+      }).then(res => {
+        this.total = {
+          all: 0,
+          pay: 0,
+          no_pay: 0,
+          all_money: 0
+        }
+        this.loadingFull = false
+        if (res.code === 200) {
+          this.tablelist = res.data.list.list
+          // res.data.list.map(item => {
+          //   this.total.all += item.account
+          //   this.total.pay += item.pay_account
+          //   this.total.no_pay += item.no_pay_account
+          // })
+          this.total = {
+            all: res.data.list.total[0].account,
+            pay: res.data.list.total[0].pay_account,
+            no_pay: res.data.list.total[0].account - res.data.list.total[0].pay_account,
+            all_money: res.data.list.all_money
+          }
+          this.tableTotal = res.data.total
+        } else {
+          this.$message.error(res.message)
+        }
+      }).catch(e => {
+        this.loadingFull = false
+      })
+    },
+    index(i) {
+      const { page_index: a, page_size: b } = this.listQuery
+      return (a - 1) * b + i + 1
+    },
+    // 分页页码变化
+    changePagination(data) {
+      const { page, limit } = data
+      this.listQuery.page_size = limit
+      this.listQuery.page_index = page
+      // this.getList()
+    },
+    async toExport() {
+      this.loadingFull = true
+      const { page_index, page_size, search_name, time, activity_id } = this.listQuery
+      toExport({
+        page_index, page_size, search_name, activity_id,
+        start_time: (time && time.length > 0) ? time[0] : '',
+        end_time: (time && time.length > 0) ? time[1] : ''
+      }).then(res => {
+        if (res.code === 200) {
+          if (res.data.length === 0) {
+            this.$message.error('没有可导出数据')
+            return false
+          } else {
+            const header = Object.keys(res.data[0])
+            header.unshift('序号')
+            import('@/vendor/Export2Excel').then(excel => {
+              excel.export_json_to_excel({
+                header: header,
+                data: res.data.map((listItem, i) => header.map(j => {
+                  if (j === '简约版' || j === '纯棉老人版' || j === '精装版' || j === '老人版') {
+                    listItem[j] = Number(listItem[j]) || 0
+                  }
+                  if (j === '序号') {
+                    listItem[j] = i + 1
+                  }
+                  return listItem[j]
+                })),
+                filename: `${formatter(new Date(), 'yyyy-MM-dd')}订单排名`,
+                bookType: 'xlsx'
+              })
+            })
+          }
+        }
+      }).catch(e => {
+        this.$message.error('导出失败')
+      }).finally(() => {
+        this.loadingFull = false
+      })
+    },
+    MoneySort(column) {
+      const fieldName = column.prop
+      const sortingType = column.order
+      if (sortingType === 'descending') {
+        this.tablelist.sort((a, b) => Number(b[fieldName] || 0) - Number(a[fieldName] || 0))
+      } else if (sortingType === 'ascending') {
+        this.tablelist.sort((a, b) => Number(a[fieldName] || 0) - Number(b[fieldName] || 0))
+      }
+    },
+    async activityList(cb) {
+      this.loadingFull = true
+      await activityList().then(res => {
+        this.loadingFull = false
+        if (res.code === 200) {
+          this.activitys = res.data
+          res.data.map(item => {
+            if (item.is_ing === 1) {
+              this.listQuery.activity_id = item.id
+            }
+          })
+        }
+        cb && cb()
+      }).catch(e => {
+        this.loadingFull = false
+        cb && cb()
+      })
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+  .search-container {
+    margin-bottom: 15px;
+  }
+
+  .red {
+    color: crimson;
+  }
+
+  .total_money {
+    margin-bottom: 15px;
+
+    span {
+      display: inline-block;
+      margin-right: 15px;
+    }
+
+    .red {
+      display: inline-block;
+      color: crimson;
+      font-size: 18px;
+    }
+  }
+</style>

src/pages/data/order_co.vue

@@ -0,0 +1,313 @@
+<template>
+  <div class="app-container">
+    <div v-loading.fullscreen.lock="loadingFull" />
+    <div class="search-container">
+      <el-input v-model="listQuery.search_name" type="text" placeholder="下单人昵称" style="width:300px" @keyup.enter.native="listQuery.page_index = 1; getList()" />
+      <el-select v-model="listQuery.activity_id" style="width: 400px">
+        <el-option label="全部" value="" />
+        <el-option v-for="item in activitys" :key="item.id" :label="item.title" :value="item.id" />
+      </el-select>
+      <el-date-picker
+        v-model="listQuery.time"
+        type="datetimerange"
+        range-separator="至"
+        start-placeholder="开始日期"
+        end-placeholder="结束日期"
+        value-format="yyyy-MM-dd HH:mm"
+        format="yyyy-MM-dd HH:mm"
+      />
+      <el-button type="primary" @click="listQuery.page_index = 1; getList()">搜索</el-button>
+      <el-button type="primary" @click="toExport">导出</el-button>
+    </div>
+    <div class="total_money">
+      <span>总订货金额: <i class="red">{{ parseMoney(total.all) }}</i></span>
+      <span>总付款金额: <i class="red">{{ parseMoney(total.pay) }}</i></span>
+      <span>总未付款金额: <i class="red">{{ parseMoney(total.no_pay) }}</i></span>
+      <span>总资金账户余额: <i class="red">{{ parseMoney(total.all_money) }}</i></span>
+    </div>
+    <el-table
+      border
+      stripe
+      :header-cell-style="{ background: '#f8fbfc' }"
+      class="tableBorder"
+      :data="limitTable"
+      @sort-change="MoneySort"
+    >
+      <el-table-column
+        type="index"
+        :index="index"
+        label="序号"
+        width="80"
+        align="center"
+      >
+        <span slot-scope="{ row: { no_pay_account }, $index }" :class="no_pay_account > 0 ? 'red' : ''">{{ $index + 1 + Number(listQuery.page_size) * (Number(listQuery.page_index) - 1) }}</span>
+      </el-table-column>
+      <el-table-column
+        prop="nickname"
+        label="代理昵称"
+      >
+        <span slot-scope="{ row: { nickname, no_pay_account } }" :class="no_pay_account > 0 ? 'red' : ''">{{ nickname }}</span>
+      </el-table-column>
+      <el-table-column
+        prop="realname"
+        label="代理姓名"
+      >
+        <span slot-scope="{ row: { realname, no_pay_account } }" :class="no_pay_account > 0 ? 'red' : ''">{{ realname }}</span>
+      </el-table-column>
+      <el-table-column
+        prop="mobile"
+        label="代理手机号"
+      >
+        <span slot-scope="{ row: { mobile, no_pay_account } }" :class="no_pay_account > 0 ? 'red' : ''">{{ mobile }}</span>
+      </el-table-column>
+      <el-table-column
+        prop="精装版"
+        label="精装版"
+        sortable="custom"
+      >
+        <template slot-scope="{ row }">
+          <span :class="row.no_pay_account > 0 ? 'red' : ''">{{ row['精装版'] || 0 }} </span>
+        </template>
+      </el-table-column>
+      <el-table-column
+        prop="简约版"
+        label="简约版"
+        sortable="custom"
+      >
+        <template slot-scope="{ row }">
+          <span :class="row.no_pay_account > 0 ? 'red' : ''">{{ row['简约版'] || 0 }} </span>
+        </template>
+      </el-table-column>
+      <el-table-column
+        prop="老人版"
+        label="老人版"
+        sortable="custom"
+      >
+        <template slot-scope="{ row }">
+          <span :class="row.no_pay_account > 0 ? 'red' : ''">{{ row['老人版'] || 0 }} </span>
+        </template>
+      </el-table-column>
+      <el-table-column
+        prop="纯棉老人版"
+        label="纯棉老人版"
+        sortable="custom"
+      >
+        <template slot-scope="{ row }">
+          <span :class="row.no_pay_account > 0 ? 'red' : ''">{{ row['纯棉老人版'] || 0 }} </span>
+        </template>
+      </el-table-column>
+      <el-table-column
+        prop="account"
+        label="订货金额"
+        sortable="custom"
+      >
+        <span slot-scope="{ row: { account, no_pay_account } }" :class="no_pay_account > 0 ? 'red' : ''">{{ parseMoney(account) }}</span>
+      </el-table-column>
+      <el-table-column
+        prop="pay_account"
+        label="已付款金额"
+        sortable="custom"
+      >
+        <span slot-scope="{ row: { pay_account, no_pay_account } }" :class="no_pay_account > 0 ? 'red' : ''">{{ parseMoney(pay_account) }}</span>
+      </el-table-column>
+      <el-table-column
+        prop="no_pay_account"
+        label="未付款金额"
+        sortable="custom"
+      >
+        <span slot-scope="{ row: { no_pay_account } }" :class="no_pay_account > 0 ? 'red' : ''">{{ parseMoney(no_pay_account) }}</span>
+      </el-table-column>
+      <el-table-column
+        prop="money"
+        label="账户余额"
+        sortable="custom"
+      >
+        <span slot-scope="{ row: { money } }" :class="money > 0 ? 'red' : ''">{{ parseMoney(money) }}</span>
+      </el-table-column>
+    </el-table>
+    <!-- 分页 -->
+    <pagination :total="tablelist.length" :limit="listQuery.page_size" :page="listQuery.page_index" @pagination="changePagination" @update:limit="changePagination" />
+  </div>
+</template>
+<script>
+// api
+import { list, toExport } from '@/api/data/order'
+import { parseMoney } from '@/utils/index'
+import { formatter } from '@/filters/index'
+import { activityList } from '@/api/giftB'
+export default {
+  data() {
+    return {
+      loadingFull: false,
+      listQuery: {
+        page_index: 1,
+        page_size: 50,
+        search_name: '',
+        time: '',
+        activity_id: ''
+      },
+      tablelist: [],
+      tableTotal: 0,
+      total: {
+        all: 0,
+        pay: 0,
+        no_pay: 0,
+        all_money: 0
+      },
+      activitys: []
+    }
+  },
+  computed: {
+    limitTable() {
+      const { page_index, page_size } = this.listQuery
+      return this.tablelist.slice((Number(page_index) - 1) * Number(page_size), (Number(page_index) - 1) * Number(page_size) + page_size)
+    }
+  },
+  created() {
+    this.parseMoney = parseMoney
+    this.activityList(() => {
+      this.getList()
+    })
+  },
+  methods: {
+    async getList() {
+      this.loadingFull = true
+      const { page_index, page_size, search_name, time, activity_id } = this.listQuery
+      await list({
+        page_index, page_size, search_name, activity_id,
+        start_time: (time && time.length > 0) ? time[0] : '',
+        end_time: (time && time.length > 0) ? time[1] : ''
+      }).then(res => {
+        this.total = {
+          all: 0,
+          pay: 0,
+          no_pay: 0,
+          all_money: 0
+        }
+        this.loadingFull = false
+        if (res.code === 200) {
+          this.tablelist = res.data.list.list
+          // res.data.list.map(item => {
+          //   this.total.all += item.account
+          //   this.total.pay += item.pay_account
+          //   this.total.no_pay += item.no_pay_account
+          // })
+          this.total = {
+            all: res.data.list.total[0].account,
+            pay: res.data.list.total[0].pay_account,
+            no_pay: res.data.list.total[0].account - res.data.list.total[0].pay_account,
+            all_money: res.data.list.all_money
+          }
+          this.tableTotal = res.data.total
+        } else {
+          this.$message.error(res.message)
+        }
+      }).catch(e => {
+        this.loadingFull = false
+      })
+    },
+    index(i) {
+      const { page_index: a, page_size: b } = this.listQuery
+      return (a - 1) * b + i + 1
+    },
+    // 分页页码变化
+    changePagination(data) {
+      const { page, limit } = data
+      this.listQuery.page_size = limit
+      this.listQuery.page_index = page
+      // this.getList()
+    },
+    async toExport() {
+      this.loadingFull = true
+      const { page_index, page_size, search_name, time, activity_id } = this.listQuery
+      toExport({
+        page_index, page_size, search_name, activity_id,
+        start_time: (time && time.length > 0) ? time[0] : '',
+        end_time: (time && time.length > 0) ? time[1] : ''
+      }).then(res => {
+        if (res.code === 200) {
+          if (res.data.length === 0) {
+            this.$message.error('没有可导出数据')
+            return false
+          } else {
+            const header = Object.keys(res.data[0])
+            header.unshift('序号')
+            import('@/vendor/Export2Excel').then(excel => {
+              excel.export_json_to_excel({
+                header: header,
+                data: res.data.map((listItem, i) => header.map(j => {
+                  if (j === '简约版' || j === '纯棉老人版' || j === '精装版' || j === '老人版') {
+                    listItem[j] = Number(listItem[j]) || 0
+                  }
+                  if (j === '序号') {
+                    listItem[j] = i + 1
+                  }
+                  return listItem[j]
+                })),
+                filename: `${formatter(new Date(), 'yyyy-MM-dd')}订单排名`,
+                bookType: 'xlsx'
+              })
+            })
+          }
+        }
+      }).catch(e => {
+        this.$message.error('导出失败')
+      }).finally(() => {
+        this.loadingFull = false
+      })
+    },
+    MoneySort(column) {
+      const fieldName = column.prop
+      const sortingType = column.order
+      if (sortingType === 'descending') {
+        this.tablelist.sort((a, b) => Number(b[fieldName] || 0) - Number(a[fieldName] || 0))
+      } else if (sortingType === 'ascending') {
+        this.tablelist.sort((a, b) => Number(a[fieldName] || 0) - Number(b[fieldName] || 0))
+      }
+    },
+    async activityList(cb) {
+      this.loadingFull = true
+      await activityList().then(res => {
+        this.loadingFull = false
+        if (res.code === 200) {
+          this.activitys = res.data
+          res.data.map(item => {
+            if (item.is_ing === 1) {
+              this.listQuery.activity_id = item.id
+            }
+          })
+        }
+        cb && cb()
+      }).catch(e => {
+        this.loadingFull = false
+        cb && cb()
+      })
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+  .search-container {
+    margin-bottom: 15px;
+  }
+
+  .red {
+    color: crimson;
+  }
+
+  .total_money {
+    margin-bottom: 15px;
+
+    span {
+      display: inline-block;
+      margin-right: 15px;
+    }
+
+    .red {
+      display: inline-block;
+      color: crimson;
+      font-size: 18px;
+    }
+  }
+</style>

src/pages/dataScreen/11.vue

@@ -0,0 +1,971 @@
+<template>
+  <div class="data-screen2">
+    <template v-if="dataInfo.base">
+      <el-backtop />
+      <div class="s_top">
+        <p class="s_top_title">活动订货数据实时追踪</p>
+        <p class="s_top_name">{{ dataInfo.base.activity_title }}</p>
+      </div>
+      <div class="s_money">
+        <p class="s_money_value"> {{ dataInfo.base.money }}</p>
+        <div class="s_money_spec s_money_ly">
+          <p>临沭体验店金额: {{ dataInfo.base['临沭体验店'] }}</p>
+          <p>占比: {{ (Math.floor(dataInfo.base['临沭体验店'] / dataInfo.base.money * 10000)/100).toFixed(1) + '%' }}</p>
+        </div>
+        <div class="s_money_spec s_money_wq">
+          <p>吴桥体验店金额: {{ dataInfo.base['吴桥体验店'] }}</p>
+          <p>占比: {{ (Math.floor(dataInfo.base['吴桥体验店'] / dataInfo.base.money * 10000)/100).toFixed(1) + '%' }}</p>
+        </div>
+      </div>
+      <div class="s_module_title">
+        <p>产品区</p>
+      </div>
+      <div class="s_all" :style="`background-image: url(${require('@/assets/data_display/all.png')})`">
+        <p class="s_all_num">{{ dataInfo.base.hard * 3 + dataInfo.base.simple * 12 + dataInfo.base.old * 12 + dataInfo.base.newold * 18 }}</p>
+        <p class="s_all_text">总条数</p>
+      </div>
+      <div class="s_goods">
+        <div class="s_goods_item" :style="`background-image: url(${require('@/assets/data_display/s_good_0.png')})`">
+          <div class="item_title">
+            <div class="item_title_icon" :style="`background-image: url(${require('@/assets/data_display/s_good_item_0.png')})`" />
+            <p>大卫博士精装版</p>
+          </div>
+          <div class="item_data">
+            <div class="item_data_child">
+              <p>{{ dataInfo.base.hard }}</p>
+              <p>数量</p>
+            </div>
+            <div class="item_data_child">
+              <p>{{ dataInfo.base.hard_money }}</p>
+              <p>金额/元</p>
+            </div>
+            <div class="item_data_child">
+              <p>{{ dataInfo.base.hard_today }}</p>
+              <p>新增</p>
+            </div>
+            <div class="item_data_child">
+              <p>{{ getPer(dataInfo.base.hard_money) }}%</p>
+              <p>金额占比</p>
+            </div>
+          </div>
+        </div>
+        <div class="s_goods_item" :style="`background-image: url(${require('@/assets/data_display/s_good_1.png')})`">
+          <div class="item_title">
+            <div class="item_title_icon" :style="`background-image: url(${require('@/assets/data_display/s_good_item_1.png')})`" />
+            <p>大卫博士简约版</p>
+          </div>
+          <div class="item_data">
+            <div class="item_data_child">
+              <p>{{ dataInfo.base.simple }}</p>
+              <p>数量</p>
+            </div>
+            <div class="item_data_child">
+              <p>{{ dataInfo.base.simple_money }}</p>
+              <p>金额/元</p>
+            </div>
+            <div class="item_data_child">
+              <p>{{ dataInfo.base.simple_today }}</p>
+              <p>新增</p>
+            </div>
+            <div class="item_data_child">
+              <p>{{ getPer(dataInfo.base.simple_money) }}%</p>
+              <p>金额占比</p>
+            </div>
+          </div>
+        </div>
+        <div class="s_goods_item" :style="`background-image: url(${require('@/assets/data_display/s_good_2.png')})`">
+          <div class="item_title">
+            <div class="item_title_icon" :style="`background-image: url(${require('@/assets/data_display/s_good_item_2.png')})`" />
+            <p>大卫博士老人版</p>
+          </div>
+          <div class="item_data">
+            <div class="item_data_child">
+              <p>{{ dataInfo.base.old }}</p>
+              <p>数量</p>
+            </div>
+            <div class="item_data_child">
+              <p>{{ dataInfo.base.old_money }}</p>
+              <p>金额/元</p>
+            </div>
+            <div class="item_data_child">
+              <p>{{ dataInfo.base.old_today }}</p>
+              <p>新增</p>
+            </div>
+            <div class="item_data_child">
+              <p>{{ getPer(dataInfo.base.old_money) }}%</p>
+              <p>金额占比</p>
+            </div>
+          </div>
+        </div>
+        <div class="s_goods_item" :style="`background-image: url(${require('@/assets/data_display/s_good_3.png')})`">
+          <div class="item_title">
+            <div class="item_title_icon" :style="`background-image: url(${require('@/assets/data_display/s_good_item_3.png')})`" />
+            <p>大卫博士纯棉老人版</p>
+          </div>
+          <div class="item_data">
+            <div class="item_data_child">
+              <p>{{ dataInfo.base.newold }}</p>
+              <p>数量</p>
+            </div>
+            <div class="item_data_child">
+              <p>{{ dataInfo.base.newold_money }}</p>
+              <p>金额/元</p>
+            </div>
+            <div class="item_data_child">
+              <p>{{ dataInfo.base.newold_today }}</p>
+              <p>新增</p>
+            </div>
+            <div class="item_data_child">
+              <p>{{ getPer(dataInfo.base.newold_money) }}%</p>
+              <p>金额占比</p>
+            </div>
+          </div>
+        </div>
+      </div>
+      <div class="s_module_title">
+        <p>荣誉区</p>
+      </div>
+      <div class="s_honor">
+        <div
+          v-for="(v, k, i) in dataInfo.base.honor_num"
+          :key="k"
+          class="s_honor_item"
+          :style="`background-image: url(${require(`@/assets/data_display/s_honor_${i % 3}.png`)})`"
+          @click="toSeeHonorUser(v.user, '大礼包名单')"
+        >
+          <p>{{ v.count }}</p>
+          <p>{{ k }}</p>
+        </div>
+      </div>
+      <div class="s_module_title">
+        <p>赠品区</p>
+      </div>
+      <div class="s_honor s_gift">
+        <div
+          v-for="(v, k, i) in dataInfo.base.gifts_num"
+          :key="`${k}_${i}`"
+          class="s_honor_item s_gift_item"
+        >
+          <p :style="`color: ${i % 3 === 0 ? '#3394F8' : i % 3 === 1 ? '#F76454' : '#FF9E00' }`">{{ v }}</p>
+          <p />
+          <p>{{ k }}</p>
+        </div>
+      </div>
+      <div class="s_module_title">
+        <p>达标情况</p>
+      </div>
+      <div class="s_standard">
+        <div
+          class="s_standard_item"
+          :style="`background-image: url(${require(`@/assets/data_display/standard_0.png`)})`"
+          @click="toSeeHonorUser(dataInfo.base.down_user.up, '达标名单')"
+        >
+          <p>{{ dataInfo.base.down_info.up }}</p>
+          <p>达标</p>
+        </div>
+        <div
+          class="s_standard_item"
+          :style="`background-image: url(${require(`@/assets/data_display/standard_1.png`)})`"
+          @click="toSeeHonorUser(dataInfo.base.down_user.down, '未达标名单')"
+        >
+          <p>{{ dataInfo.base.down_info.down }}</p>
+          <p>未达标</p>
+        </div>
+      </div>
+      <div class="s_module_title s_map_title">
+        <p>全国数据情况</p>
+      </div>
+      <div class="s_map">
+        <div v-if="dataInfo.base.list" class="s_map_container">
+          <div id="china4" style="width:100%;height:100%;" />
+        </div>
+      </div>
+      <div class="s_table_nav">
+        <p
+          v-for="item in moduleListNav"
+          :key="item.value"
+          :class="showDataType === item.value ? 'active' : ''"
+          @click="showDataType = item.value"
+        >
+          {{ item.name }}
+        </p>
+      </div>
+      <template v-if="+showDataType === 0">
+        <div id="table-wrapper" class="table-wrapper">
+          <el-table :key="showDataType" ref="table" :data="dataInfo.base.list" style="width: 100%" border @expand-change="openProvinceTeam">
+            <el-table-column label="排名" width="40" type="index" align="center" />
+            <el-table-column label="地区" :width="width / 9" prop="name" align="center" />
+            <el-table-column label="精" :width="width / 8" prop="hard" align="center" />
+            <el-table-column label="简" :width="width / 8" prop="simple" align="center" />
+            <el-table-column label="老" :width="width / 8" prop="old" align="center" />
+            <el-table-column label="棉老" :width="width / 8" prop="newold" align="center" />
+            <el-table-column label="合计" prop="value" align="center" :width="width / 7" />
+            <el-table-column type="expand" width="20">
+              <template slot-scope="{ row }">
+                <el-table v-if="row.list && row.list.length > 0" :data="row.list" border style="width: 100%;margin:20px 0">
+                  <el-table-column label="昵称" prop="nickname" align="center" :width="width / 6" />
+                  <el-table-column label="精" prop="hard" align="center" :width="width / 7" />
+                  <el-table-column label="简" prop="simple" align="center" :width="width / 7" />
+                  <el-table-column label="老" prop="old" align="center" :width="width / 7" />
+                  <el-table-column label="棉老" prop="cold" align="center" :width="width / 7" />
+                  <el-table-column label="合计" prop="acc" align="center" :width="width / 6" />
+                </el-table>
+              </template>
+            </el-table-column>
+          </el-table>
+        </div>
+      </template>
+      <template v-else-if="+showDataType === 1 ">
+        <el-table :key="showDataType" :data="dataInfo.crown" border>
+          <el-table-column label="排名" width="40" type="index" align="center" />
+          <el-table-column label="代理公司" prop="nickname" align="center" :width="width / 6.5" />
+          <el-table-column label="精" prop="hard" align="center" :width="width / 7" />
+          <el-table-column label="简" prop="simple" align="center" :width="width / 7" />
+          <el-table-column label="老" prop="old" align="center" :width="width / 7" />
+          <el-table-column label="棉老" prop="newold" align="center" :width="width / 7" />
+          <el-table-column label="金额" prop="money" align="center" :width="width / 6.5" />
+        </el-table>
+      </template>
+      <template v-else-if="+showDataType === 2">
+        <el-table :key="showDataType" :data="dataInfo.size" border>
+          <el-table-column label="商品名称" prop="goods_name" align="center" />
+          <el-table-column label="商品类型" prop="goods_size" align="center" />
+          <el-table-column label="销量" prop="num" align="center" sortable :sort-method="sizeNumSort" />
+        </el-table>
+      </template>
+    </template>
+    <div v-if="dataPasswordVis" class="data_password">
+      <el-input v-model="dataPassword" type="text" style="width: 300px;margin-bottom: 20px;" placeholder="请输入密码" />
+      <el-button type="primary" @click="checkDataPassword">确定</el-button>
+    </div>
+    <!-- 已达标/未达标 -->
+    <el-dialog
+      :title="dialogUser.title"
+      :visible.sync="dialogUser.vis"
+      width="90%"
+      top="50px"
+    >
+      <template v-if="dataInfo.base">
+        <el-table
+          :data="dialogUser.list"
+        >
+          <el-table-column
+            type="index"
+            label="序号"
+            align="center"
+          />
+          <el-table-column
+            prop="nickname"
+            label="昵称"
+            align="center"
+          />
+          <el-table-column
+            prop="realname"
+            label="真实姓名"
+            align="center"
+          />
+          <el-table-column
+            prop="account"
+            label="总金额"
+            align="center"
+          />
+          <!-- <el-table-column
+            prop="pay_account"
+            label="已支付"
+            align="center"
+          /> -->
+        </el-table>
+      </template>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import { isPC } from '@/utils'
+import { getSizeList, provinceTeam, baseData, crownList } from '@/api/datascreen'
+export default {
+  name: 'DataScreen4',
+  props: {},
+  data() {
+    return {
+      showDataType: 0,
+      width: document.body.offsetWidth,
+      moduleListNav: [
+        { value: 0, name: '各省排名' },
+        { value: 1, name: '代理公司排名' },
+        { value: 2, name: '尺码明细' }
+      ],
+      dataPasswordVis: true,
+      dataPassword: '',
+      dataInfo: {
+        base: null,
+        crown: [],
+        size: []
+      },
+      dialogUser: {
+        list: [],
+        title: '',
+        vis: false
+      }
+    }
+  },
+  watch: {
+    dataPasswordVis(a) {
+      a ? null : this.init()
+    }
+  },
+  created() {
+    if (isPC()) {
+      this.$router.replace({ path: '/1' })
+      return
+    }
+  },
+  beforeDestroy() {
+    clearInterval(this.timer)
+  },
+  methods: {
+    toSeeHonorUser(list, title) {
+      this.dialogUser.list = list
+      this.dialogUser.title = title
+      this.dialogUser.vis = true
+    },
+    init() { // 初始话
+      this.mergeAllData()
+      this.timer = setInterval(() => {
+        this.mergeAllData()
+      }, 1000 * 30)
+    },
+    mergeAllData() { // 统一请求
+      const loading = this.$loading()
+      Promise.all([this.getBaseData(), this.getCrownData(), this.getSizeData()]).then(res => {
+        loading.close()
+        this.dataInfo.base = res[0]
+        this.dataInfo.crown = res[1]
+        this.dataInfo.size = res[2]
+        this.baseDataChange(res[0])
+      }).catch(e => {
+        console.log(e)
+        loading.close()
+        this.$message.error(e || '获取数据失败')
+      })
+    },
+    getBaseData() { // 基础数据
+      return new Promise((resolve, reject) => {
+        baseData().then(res => {
+          if (res.code === 200) {
+            res.data.down_user.up = res.data.down_user.up.sort((a, b) => b.account - a.account)
+            res.data.down_user.down = res.data.down_user.down.sort((a, b) => b.account - a.account)
+            Object.keys(res.data.honor_num).forEach(k => {
+              res.data.honor_num[k]['user'] = res.data.honor_num[k]['user'].sort((a, b) => b.account - a.account)
+            })
+            resolve(res.data)
+          } else {
+            reject(res.message)
+          }
+        }).catch(e => {
+          reject(e)
+        })
+      })
+    },
+    getCrownData() { // 皇冠数据
+      return new Promise((resolve, reject) => {
+        crownList().then(res => {
+          if (res.code === 200) {
+            resolve(res.data.list.sort((a, b) => b.money - a.money))
+          } else {
+            reject(res.message)
+          }
+        }).catch(e => {
+          reject(e)
+        })
+      })
+    },
+    getSizeData() { // 尺码数据
+      return new Promise((resolve, reject) => {
+        getSizeList().then(res => {
+          if (res.code === 200) {
+            resolve(res.data.list.sort((a, b) => b.num - a.num))
+          } else {
+            reject(res.message)
+          }
+        }).catch(e => {
+          reject(e)
+        })
+      })
+    },
+    baseDataChange(data) { // 地图处理
+      let max = 0
+      let maxIndex = 0
+      data.list.forEach((e, i) => {
+        if (e.value > max) {
+          max = e.value
+          maxIndex = i
+        }
+      })
+      const step = Math.floor(max / 6)
+      this.$nextTick(() => {
+        this.echarts = window.echarts.init(document.getElementById('china4'))
+        this.echarts.setOption({
+          backgroundColor: '#FFFFFF',
+          textStyle: {
+            fontSize: 6
+          },
+          tooltip: {
+            trigger: 'item',
+            enterable: true,
+            alwaysShowContent: false,
+            formatter: params => {
+              this.$emit('renderDetail', params.dataIndex)
+              return `
+                <div id="s_map_tip">
+                  <div id="TooltipInfo">
+                    <div>${params.name}</div>
+                    <div>排名: <span>${params.dataIndex + 1}</span></div>
+                    <div>总金额: <span>${params.value}</span></div>
+                    <div>精装版：<span>${data.list[params.dataIndex].hard}</span></div>
+                    <div>简约版：<span>${data.list[params.dataIndex].simple}</span></div>
+                    <div>老人版：<span>${data.list[params.dataIndex].old}</span></div>
+                    <div>棉老版：<span>${data.list[params.dataIndex].newold}</span></div>
+                  </div>
+                </div>
+              `
+            }
+          },
+          visualMap: {
+            show: true,
+            x: 'left',
+            y: 'bottom',
+            splitList: [
+              { start: step * 6, end: step * 7, label: `${step * 6} - ${step * 7} 元` },
+              { start: step * 5, end: step * 6, label: `${step * 5} - ${step * 6} 元` },
+              { start: step * 4, end: step * 5, label: `${step * 4} - ${step * 5} 元` },
+              { start: step * 3, end: step * 4, label: `${step * 3} - ${step * 4} 元` },
+              { start: step * 2, end: step * 3, label: `${step * 2} - ${step * 3} 元` },
+              { start: step * 1, end: step * 2, label: `${step * 1} - ${step * 2} 元` },
+              { start: 1, end: step * 1, label: `${1} - ${step * 1} 元` },
+              { start: 0, end: 0, label: '0 元' }
+            ],
+            itemGap: 0,
+            itemWidth: 8,
+            itemHeight: 5.6,
+            textStyle: {
+              fontSize: 8
+            },
+            color: ['#FF4C4C', '#FF6666', '#FF7F7F', '#FF9999', '#FFB2B2', '#FFCCCC', '#FFE5E5', '#EFEFEF']
+          },
+          series: [{
+            name: '销售套数',
+            type: 'map',
+            mapType: 'china',
+            aspectScale: 1,
+            zoom: 1.23,
+            label: {
+              normal: { show: true },
+              emphasis: { show: true }
+            },
+            data: data.list
+          }],
+          animation: true
+        })
+        if (!this.click) {
+          this.click = true
+          this.echarts.on('click', params => {
+            console.log(params)
+          })
+        }
+        this.echarts.dispatchAction({
+          type: 'showTip',
+          seriesIndex: 0,
+          dataIndex: maxIndex
+        })
+      })
+    },
+    getPer(num) { // 百分比
+      const { hard_money, old_money, simple_money, newold_money } = this.dataInfo.base
+      const all = hard_money + old_money + simple_money + newold_money
+      const per = Math.floor(num / all * 10000) / 100
+      const last = per.toFixed(1)
+      return last
+    },
+    checkDataPassword() { // 密码检测
+      if (this.dataPassword === '000') {
+        this.dataPasswordVis = false
+      } else {
+        if (!this.dataPassword) {
+          this.$message.error('请输入密码')
+        } else {
+          this.$message.error('密码错误')
+        }
+      }
+    },
+    async openProvinceTeam(row, v) { // 省排名展开
+      if (row.list === undefined) {
+        this.loading = this.$loading()
+        const res = await provinceTeam({ province: row.name })
+        this.loading.close()
+        row.list = res.data.sort((a, b) => b.acc - a.acc)
+        this.$refs.table.toggleRowExpansion(row) // 收取折叠表格
+        this.$refs.table.toggleRowExpansion(row) // 再次展开强制渲染
+      }
+    },
+    sizeNumSort(a, b) { // 尺码排序
+      return a.num - b.num
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+  .data-screen2 {
+    background:#f9f9fb;
+    /deep/ .el-dialog__wrapper {
+      z-index: 999999999 !important;
+    }
+    p {
+      margin: 0;
+    }
+    .s_top {
+      width: 100%;
+      height: 174px;
+      background-image: url(../../assets/data_display/top_bg.png);
+      background-size: 100% auto;
+      background-repeat: no-repeat;
+      background-position: 50% 50%;
+      overflow: hidden;
+      display: flex;
+      align-items: center;
+      justify-content: flex-start;
+      padding: 20px 15px;
+      box-sizing: border-box;
+      color: #ffffff;
+      flex-direction: column;
+      .s_top_title {
+        font-size: 30px;
+        margin-bottom: 6px;
+        font-weight: bold;
+      }
+      .s_top_name {
+        font-size: 12px;
+      }
+    }
+    .s_money {
+      width: calc(100% - 30px);
+      margin: 0 auto;
+      margin-top: -80px;
+      height: 163px;
+      background-position: 0% 50%;
+      background-size: 100% auto;
+      background-color: #ffffff;
+      border-radius: 12px;
+      position: relative;
+      .s_money_value {
+            background:#EA4A41;
+            text-align: center;
+            width:92%;
+            border-radius: 8px;
+            height:70px;
+            line-height:70px;
+        position: absolute;
+        color: #ffffff;
+        font-size: 44px;
+        left: 50%;
+        top: 20px;
+        transform: translateX(-50%);
+      }
+      .s_money_unit {
+        position: absolute;
+        color: #ffffff;
+        color: #ffffff;
+        font-size: 12px;
+        left: 50%;
+        top: 100px;
+        transform: translateX(-50%);
+      }
+      .s_money_spec{
+        position: absolute;
+        left: 50%;
+        transform: translateX(-50%);
+        width: calc(100% - 70px);
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        color: #333333;
+        font-size: 12px;
+        &.s_money_ly{
+          bottom: 42px;
+        };
+        &.s_money_wq{
+          bottom: 20px;
+        }
+      }
+    }
+    .s_module_title {
+      height: 52px;
+      width: calc(100% - 30px);
+      margin: 0 auto;
+      display: flex;
+      align-items: center;
+      justify-content: flex-start;
+      p{
+        color: #333333;
+        font-size: 16px;
+      }
+      &::before {
+        content: "";
+        display: block;
+        width: 14px;
+        height: 8px;
+        background-image: url(../../assets/data_display/s_module_icon.png);
+        background-size: 100%;
+        background-repeat: no-repeat;
+        margin-right: 5px;
+      }
+    }
+    .s_goods {
+      width: calc(100% - 30px);
+      margin: 0 auto;
+      .s_goods_item {
+        width: 100%;
+        height: 120px;
+        background-repeat: no-repeat;
+        background-size: 100%;
+        margin-bottom: 15px;
+        background-color: #ffffff;
+        &:nth-last-of-type(1) {
+          margin-bottom: 0;
+        }
+        padding: 15px;
+        box-sizing: border-box;
+        display: flex;
+        justify-content: space-between;
+        flex-direction: column;
+        .item_title {
+          display: flex;
+          align-items: center;
+          justify-content: flex-start;
+          margin-bottom: 16px;
+          .item_title_icon{
+            width: 18px;
+            height: 20px;
+            background-size: contain;
+            background-repeat: no-repeat;
+            background-position: 50% 50%;
+            margin-right: 5px;
+          }
+          p {
+            color: #333333;
+            font-size: 16px;
+          }
+        }
+        .item_data {
+          width: 100%;
+          display: flex;
+          align-items: center;
+          justify-content: space-between;
+          flex: 1;
+          overflow: hidden;
+          padding-left: 12px;
+          .item_data_child {
+            display: flex;
+            align-items: center;
+            justify-content: space-between;
+            flex-direction: column;
+            flex: 1;
+            height: 100%;
+            overflow: hidden;
+            &:nth-of-type(1) {
+              p:nth-of-type(1) {
+                color: #3394F8 !important;
+              }
+            }
+            &:nth-of-type(2) {
+              p:nth-of-type(1) {
+                color: #EA4A41 !important;
+              }
+            }
+            &:nth-of-type(3) {
+              p:nth-of-type(1) {
+                color: #FF9E00 !important;
+              }
+            }
+            &:nth-of-type(4) {
+              p:nth-of-type(1) {
+                color: #333333 !important;
+              }
+            }
+            p {
+              &:nth-of-type(1) {
+                font-size: 20px;
+              }
+              &:nth-last-of-type(1) {
+                color: #999999;
+                font-size: 14px;
+              }
+            }
+          }
+        }
+      }
+    }
+    .s_honor {
+      width: calc(100% - 30px);
+      margin: 0 auto;
+      display: flex;
+      align-items: center;
+      justify-content: flex-start;
+      flex-wrap: wrap;
+      .s_honor_item {
+        width: 105px;
+        height: 105px;
+        background-repeat: no-repeat;
+        background-size: cover;
+        background-position: 50% 50%;
+        margin-right: 15px;
+        border-radius: 12px;
+        margin-bottom: 15px;
+        &:nth-of-type(3n) {
+          margin-right: 0;
+        }
+        position: relative;
+        p {
+          position: absolute;
+          left: 15px;
+          color: #FFFFFF;
+          &:nth-of-type(1) {
+            bottom: 32px;
+            font-size:24px;
+          }
+          &:nth-last-of-type(1) {
+            bottom: 12px;
+            font-size: 12px;
+          }
+        }
+      }
+    }
+    .s_all {
+      width: calc(100% - 30px);
+      height: 120px;
+      background-repeat: no-repeat;
+      background-size: 100%;
+      background-position: 50% 50%;
+      margin: 0 auto;
+      margin-bottom: 15px;
+      position: relative;
+      .s_all_num {
+        position: absolute;
+        font-size: 32px;
+        color: #333333;
+        left: 67px;
+        bottom: 50px;
+      }
+      .s_all_text {
+        color: #999999;
+        font-size: 14px;
+        position: absolute;
+        left: 67px;
+        bottom: 30px;
+      }
+    }
+    .s_gift{
+      .s_gift_item {
+        background: #ffffff;
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        flex-direction: column;
+        padding: 18px 0;
+        box-sizing: border-box;
+        &:nth-of-type(1) {
+          p:nth-of-type(2) {
+            background: linear-gradient(to right, #A3CFF9, #487FE5)
+          }
+        }
+        &:nth-of-type(2) {
+          p:nth-of-type(2) {
+            background: linear-gradient(to right, #FF7801, #FE1F00)
+          }
+        }
+        &:nth-of-type(3) {
+          p:nth-of-type(2) {
+            background: linear-gradient(to right, #FBA753, #FA803C)
+          }
+        }
+        p{
+          text-align: center;
+          width: 100%;
+          position: initial;
+          &:nth-of-type(1) {
+            font-size: 24px;
+          }
+          &:nth-of-type(2) {
+            width: 22px;
+            height: 4px;
+            border-radius: 4px;
+          }
+          &:nth-last-of-type(1) {
+            color: #333333;
+            font-size: 12px;
+          }
+        }
+      }
+    }
+    .s_map_title {
+      background-color: #ffffff;
+      width: 100%;
+      padding: 0 15px;
+    }
+    .s_map {
+      width: 100%;
+      background-color: #ffffff;
+      padding: 15px;
+      margin-bottom: 2px;
+      .s_map_container {
+        width: 100%;
+        margin: 0 auto;
+        height: 254px;
+      }
+    }
+    .s_table_nav {
+      width: 100%;
+      padding: 15px;
+      padding-bottom: 30px;
+      box-sizing: border-box;
+      background: #ffffff;
+      display: flex;
+      align-items: center;
+      justify-content: flex-start;
+      p {
+        color: #999999;
+        font-size: 14px;
+        margin-right: 15px;
+        &:nth-last-of-type(1) {
+          margin-right: 0;
+        }
+        position: relative;
+        &.active {
+          color: #333333 !important;
+          &::after {
+            position: absolute;
+            content: "";
+            display: block;
+            left: 50%;
+            margin-top: 5px;
+            transform: translateX(-50%);
+            width: 17px;
+            height: 4px;
+            border-radius: 4px;
+            background: linear-gradient(to right, #F97C55, #F44545);
+          }
+        }
+      }
+    }
+    .s_standard {
+      width: calc(100% - 30px);
+      margin: 0 auto;
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      margin-bottom: 15px;
+      .s_standard_item {
+        width: 165px;
+        height: 97px;
+        background-repeat: no-repeat;
+        background-size: cover;
+        background-position: 50% 50%;
+        position: relative;
+        p{
+          position: absolute;
+          color: #ffffff;
+          left: 15px;
+          &:nth-of-type(1) {
+            font-size: 24px;
+            bottom: 40px;
+          }
+          &:nth-last-of-type(1) {
+            font-size: 14px;
+            bottom: 15px;
+          }
+        }
+      }
+    }
+    .header {
+      height: 60px;
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+      color: #43464D;
+      font-size: 18px;
+      font-weight: bold;
+      box-sizing: border-box;
+      padding: 0 8px;
+      background: #F5F5F5;
+      .el-select {
+        width: 160px;
+      }
+    }
+    .table-wrapper {
+      width: 100vw;
+      padding: 0;
+    }
+    .table-wrapper5 {
+      >.el-table {
+        >>> td[class^="el-table_6_column_"] {
+          padding: 0;
+          display: table-cell;
+        }
+        >>> .cell {
+          padding: 0;
+        }
+        .merge-item-item {
+          font-size: 12px;
+          line-height: 36px;
+          border-bottom: 1px solid rgb(223, 230, 236);
+        }
+        .merge-item-item:last-child {
+          border-bottom: none;
+        }
+      }
+    }
+    .el-table >>> .el-table__header-wrapper {
+      font-size: 3.11vw;
+    }
+    .el-table >>> .el-table__expanded-cell {
+      padding: 0 8px 8px;
+    }
+  }
+  /deep/ #s_map_tip {
+    padding: 6px;
+    box-sizing: border-box;
+    #TooltipInfo{
+      flex: 1;
+      height: 100%;
+      font-size: 8px;
+      line-height: 12px;
+      div{
+        margin-bottom: 8px;
+        &:nth-last-of-type(1) {
+          margin-bottom: 0;
+        }
+        &:nth-of-type(1) {
+          font-size: 14px;
+        }
+        span {
+          color: #F2F204;
+          display: inline-block;
+        }
+      }
+    }
+  }
+  .data_password {
+    position: fixed;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    z-index: 99;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    flex-direction: column;
+    background: #fff;
+  }
+</style>

src/pages/dataScreen/hint.vue

@@ -0,0 +1,20 @@
+<template>
+  <div class="content">
+    <div class="title">
+      <h3>微信版本过低，无法打开。请升级微信版本后重试。</h3>
+    </div>
+  </div>
+</template>
+<script>
+document.title = '升级提醒'
+</script>
+<style lang="scss" scoped>
+    .content {
+        padding:200px 50px;
+        .title {
+            margin: 0 auto;
+            line-height: 30px;
+            text-align:center
+        }
+    }
+</style>

src/pages/order/list.vue

@@ -49,7 +49,7 @@
         <el-button v-permit="2" :roles-permit="roles" type="primary" class="bg3" @click="machExamine(2)">发货审核</el-button>
         <el-button v-permit="3" :roles-permit="roles" type="primary" @click="showMergeOrder">合并订单</el-button>
         <!-- <el-button v-permit="[0,1,2]" :roles-permit="roles" type="primary" icon="el-icon-download" @click="dialog.export_order = true">导出</el-button> -->
-        <el-button v-permit="2" :roles-permit="roles" type="primary" icon="el-icon-upload2" @click="dialog.lead_order = true">导入</el-button>
+        <!-- <el-button v-permit="2" :roles-permit="roles" type="primary" icon="el-icon-upload2" @click="dialog.lead_order = true">导入</el-button> -->
         <!-- <el-button v-permit="2" :roles-permit="roles" type="primary" icon="el-icon-refresh" @click="dialog.import_wuliunew = true">物流更新</el-button> -->
         <!-- <el-button v-permit="[0,1,2]" :roles-permit="roles" type="primary" :loading="downloadLoading" icon="el-icon-document" class="filter-item" @click="exportOrder">导出订单信息</el-button>
         <el-button v-permit="[0,1,2]" :roles-permit="roles" type="primary" :loading="downloadLoading" icon="el-icon-document" class="filter-item" @click="exporOrdertOrder">导出拆单信息</el-button> -->
@@ -57,7 +57,28 @@
         <el-button v-permit="2" :roles-permit="roles" type="primary" :loading="downloadLoading" icon="el-icon-document" class="filter-item">导入物流</el-button> -->
         <!-- <el-button v-permit="[0,1,2]" :roles-permit="roles" type="primary" @click="exportOrder">导出订单数据</el-button>
         <el-button v-permit="[0,1,2]" :roles-permit="roles" type="primary" @click="exporOrdertOrder">导出拆单数据</el-button> -->
-        <el-button v-permit="[0,1,2]" :roles-permit="roles" type="primary" icon="el-icon-download" @click="dialog.export_order = true">导出</el-button>
+        <!-- <el-button v-permit="[0,1,2]" :roles-permit="roles" type="primary" icon="el-icon-download" @click="dialog.export_order = true">导出</el-button> -->
+        <el-popover
+          placement="bottom"
+          width="230"
+          trigger="hover"
+        >
+          <el-button type="primary" @click="dialog.import_wuliu = true">导入单号</el-button>
+          <el-button type="primary" @click="dialog.import_wuliunew = true">修改单号</el-button>
+          <!-- <el-button slot="reference" type="primary" :loading="downloadLoading" icon="el-icon-document" class="filter-item">导出</el-button> -->
+          <el-button slot="reference" v-permit="2" :roles-permit="roles" type="primary" icon="el-icon-upload2" @click="dialog.lead_order = true">导入</el-button>
+        </el-popover>
+        <el-popover
+          placement="bottom"
+          width="330"
+          trigger="hover"
+        >
+          <el-button type="primary" @click="exportOrder">订单明细</el-button>
+          <el-button type="primary" @click="exporOrdertOrder">拆单明细</el-button>
+          <el-button type="primary" @click="exportMoney">订单金额</el-button>
+          <!-- <el-button slot="reference" type="primary" :loading="downloadLoading" icon="el-icon-document" class="filter-item">导出</el-button> -->
+          <el-button slot="reference" v-permit="[0,1,2]" :roles-permit="roles" type="primary" icon="el-icon-download" @click="dialog.export_order = true">导出</el-button>
+        </el-popover>
       </div>
     </div>
     <!-- 合并订单 -->
@@ -448,26 +469,24 @@
           <el-input v-model="exportForm.good" type="text" placeholder="输入商品名称" style="width: 400px" />
         </el-form-item>
         <el-form-item label="订单状态">
-          <el-tree
-            ref="status_tree"
-            :data="statusTree"
-            show-checkbox
-            default-expand-all
-            node-key="id"
-            highlight-current
-            :expand-on-click-node="false"
-          />
+          <div style="display:flex;">
+            <div style="margin-right:20px">
+              <el-checkbox v-model="checkAll" :indeterminate="isIndeterminate" @change="handleCheckAllChange">全选</el-checkbox>
+            </div>
+            <el-checkbox-group v-model="exportForm.order_status" @change="handleCheckedCitiesChange">
+              <el-checkbox v-for="(item,index) in statusTree" :key="index" :value="item.id" :label="item.id">{{ item.label }}</el-checkbox>
+            </el-checkbox-group>
+          </div>
         </el-form-item>
         <el-form-item label="支付状态">
-          <el-tree
-            ref="pay_status_tree"
-            :data="paystatusTree"
-            show-checkbox
-            default-expand-all
-            node-key="id"
-            highlight-current
-            :expand-on-click-node="false"
-          />
+          <div style="display:flex;">
+            <div style="margin-right:20px">
+              <el-checkbox v-model="checkAlls" :indeterminate="isIndeterminates" @change="handleCheckAllChanges">全选</el-checkbox>
+            </div>
+            <el-checkbox-group v-model="exportForm.pay_status" @change="handleCheckedCitiesChanges">
+              <el-checkbox v-for="(item,index) in paystatusTree" :key="index" :value="item.id" :label="item.id">{{ item.label }}</el-checkbox>
+            </el-checkbox-group>
+          </div>
         </el-form-item>
         <el-form-item label="下单方式">
           <el-radio-group v-model="exportForm.type">
@@ -690,7 +709,6 @@ const moduleList = {
   '快递公司代码': '',
   '发货状态': ''
 }
-
 export default {
   name: 'OrderList',
   components: { ChangeAddress, VDistpicker, examine },
@@ -822,60 +840,55 @@ export default {
       },
       statusTree: [
         {
-          id: -1,
-          label: '全部',
-          children: [
-            {
-              id: 0,
-              label: '待订单审核'
-            },
-            {
-              id: 1,
-              label: '待财务审核'
-            },
-            {
-              id: 2,
-              label: '待发货审核'
-            },
-            {
-              id: 3,
-              label: '待收货'
-            },
-            {
-              id: 4,
-              label: '已完成'
-            },
-            {
-              id: 5,
-              label: '已作废'
-            }
-          ]
+          id: 0,
+          label: '待订单审核'
+        },
+        {
+          id: 1,
+          label: '待财务审核'
+        },
+        {
+          id: 2,
+          label: '待发货审核'
+        },
+        {
+          id: 3,
+          label: '待收货'
+        },
+        {
+          id: 4,
+          label: '已完成'
+        },
+        {
+          id: 5,
+          label: '已作废'
         }
       ],
       paystatusTree: [
         {
-          id: -1,
-          label: '全部',
-          children: [
-            {
-              id: 0,
-              label: '未付款'
-            },
-            {
-              id: 1,
-              label: '部分付款'
-            },
-            {
-              id: 2,
-              label: '已付款'
-            },
-            {
-              id: 3,
-              label: '待退款'
-            }
-          ]
+          id: 0,
+          label: '未付款'
+        },
+        {
+          id: 1,
+          label: '部分付款'
+        },
+        {
+          id: 2,
+          label: '已付款'
+        },
+        {
+          id: 3,
+          label: '待退款'
         }
       ],
+      isIndeterminate: false,
+      isIndeterminates: false,
+      checkAlls: false,
+      checkAll: false,
+      oreder_status: [],
+      checkedCities: [],
+      // allOreder_status:[],
       exportForm: {
         order_num: '',
         name: '',
@@ -883,6 +896,7 @@ export default {
         good: '',
         address: '',
         status: [],
+        order_status: [],
         pay_status: [],
         type: -1,
         page_size: 10,
@@ -980,12 +994,35 @@ export default {
     this.getStore()
   },
   mounted() {
-    // console.log('权限',this.roles,this.authList)
     this.$nextTick(() => {
       this.tableHeight = document.getElementsByClassName('table-wrapper')[0].offsetHeight
     })
   },
   methods: {
+    handleCheckAllChange(val) {
+      const all = this.statusTree.map(item => {
+        return item.id
+      })
+      this.exportForm.order_status = val ? all : []
+      this.isIndeterminate = false
+    },
+    handleCheckedCitiesChange(value) {
+      const checkedCount = value.length
+      this.checkAll = checkedCount === this.statusTree.length
+      this.isIndeterminate = checkedCount > 0 && checkedCount < this.statusTree.length
+    },
+    handleCheckAllChanges(val) {
+      const all = this.paystatusTree.map(item => {
+        return item.id
+      })
+      this.exportForm.pay_status = val ? all : []
+      this.isIndeterminates = false
+    },
+    handleCheckedCitiesChanges(value) {
+      const checkedCount = value.length
+      this.checkAlls = checkedCount === this.paystatusTree.length
+      this.isIndeterminates = checkedCount > 0 && checkedCount < this.paystatusTree.length
+    },
     // 获取订单作废原因
     getVoidList() {
       const loading = this.$loading()
@@ -1232,7 +1269,7 @@ export default {
       }
       const formdata = new FormData()
       formdata.append('file', this.import_file)
-      console.log(typeof (formdata), 'formdata')
+      // console.log(typeof (formdata), 'formdata')
       this.loadingFull = true
       try {
         this.$request(orderSpend(formdata), () => {
@@ -1260,7 +1297,7 @@ export default {
       }
       const formdata = new FormData()
       formdata.append('file', this.import_file)
-      console.log(typeof (formdata), 'formdata')
+      // console.log(typeof (formdata), 'formdata')
       this.loadingFull = true
       try {
         this.$request(UpdateExpress(formdata), () => {
@@ -1372,7 +1409,7 @@ export default {
           this.$message.error(message)
         }
       } catch (e) {
-        console.log(`获取订单列表失败:${e}`)
+        // console.log(`获取订单列表失败:${e}`)
       }
       this.loadingFull = false
     },
@@ -1416,7 +1453,7 @@ export default {
           this.$message.error(message)
         }
       } catch (e) {
-        console.log(`取消订单失败:${e}`)
+        // console.log(`取消订单失败:${e}`)
       }
     },
     // 更改收货人信息
@@ -1518,8 +1555,8 @@ export default {
         this.$request(downList({ id: this.chooseList.map(e => e.id) }), (res) => {
           const exportData = res.list
           import('@/vendor/Export2Excel').then(excel => {
-            const header = ['序号', '下单时间', '所属政委', '下单人昵称', '下单人姓名', '订单状态', '支付状态', '数量合计', '订单总额', '所属者姓名', '所属者手机号', '所属体验店', '收货人', '联系方式', '收货地址', '订单备注']
-            const exportK = ['index', 'updated_at', 'admin_name', 'nickname', 'realname', 'status', 'pay_status', 'total', 'money', 'belong_realname', 'belong_mobile', 'get_store', 'username', 'mobile', 'address', 'remark']
+            const header = ['序号', '下单时间', '所属政委', '下单人昵称', '下单人姓名', '订单状态', '支付状态', '数量合计', '订单总额', '所属者姓名', '所属者手机号', '收货人', '联系方式', '收货地址', '订单备注']
+            const exportK = ['index', 'updated_at', 'admin_name', 'nickname', 'realname', 'status', 'pay_status', 'total', 'money', 'belong_realname', 'belong_mobile', 'username', 'mobile', 'address', 'remark']
             const exportV = exportData.map((item, i) => {
               const obj = {
                 index: i + 1,
@@ -1531,7 +1568,6 @@ export default {
                 pay_status: payStatus(item.pay_status).name,
                 total: item.total || '',
                 money: item.money || '',
-                get_store: item.get_store && item.get_store.name,
                 username: item.get_address.username || '',
                 mobile: +item.get_address.mobile,
                 belong_realname: item.belong_user && item.belong_user.realname,
@@ -1594,12 +1630,10 @@ export default {
           }
         }
         this.$request(downList(query), (res) => {
-          // console.log(res.data)
           const exportData = res.list
-          // console.log(exportData)
               import('@/vendor/Export2Excel').then(excel => {
-                const header = ['序号', '下单时间', '所属政委', '下单人昵称', '下单人姓名', '订单状态', '支付状态', '数量合计', '订单总额', '所属者姓名', '所属者手机号', '所属体验店', '收货人', '联系方式', '收货地址', '订单备注']
-                const exportK = ['index', 'updated_at', 'admin_name', 'nickname', 'realname', 'status', 'pay_status', 'total', 'money', 'belong_realname', 'belong_mobile', 'get_store', 'username', 'mobile', 'address', 'remark']
+                const header = ['序号', '下单时间', '所属政委', '下单人昵称', '下单人姓名', '订单状态', '支付状态', '数量合计', '订单总额', '所属者姓名', '所属者手机号', '收货人', '联系方式', '收货地址', '订单备注']
+                const exportK = ['index', 'updated_at', 'admin_name', 'nickname', 'realname', 'status', 'pay_status', 'total', 'money', 'belong_realname', 'belong_mobile', 'username', 'mobile', 'address', 'remark']
                 // if(+this.collect == false) {
                 //     header.splice(12,1)
                 //     exportK.splice(12,1)
@@ -1616,7 +1650,6 @@ export default {
                     total: item.total || '',
                     money: item.money || '',
                     username: item.get_address.username || '',
-                    get_store: item.get_store && item.get_store.name,
                     mobile: +item.get_address.mobile,
                     belong_realname: item.belong_user && item.belong_user.realname,
                     belong_mobile: item.belong_user && item.belong_user.mobile,
@@ -2078,9 +2111,11 @@ export default {
     },
     // 高级搜索
     submitExport() {
-      let order_status = this.$refs.status_tree.getCheckedKeys()
+      // let order_status = this.$refs.status_tree.getCheckedKeys()
+      let order_status = this.exportForm.order_status
       if (order_status.indexOf(-1) !== -1) order_status = [-1]
-      let pay_status = this.$refs.pay_status_tree.getCheckedKeys()
+      // let pay_status = this.$refs.pay_status_tree.getCheckedKeys()
+      let pay_status = this.exportForm.pay_status
       if (pay_status.indexOf(-1) !== -1) pay_status = [-1]
       const { page_index, page_size, order_num, time, name, address, good, type, provice, city, area, activity_id } = this.exportForm
       this.loadingFull = true
@@ -2122,6 +2157,7 @@ export default {
         good: '',
         address: '',
         status: [],
+        order_status: [],
         pay_status: [],
         type: -1,
         page_size: 10,
@@ -2131,8 +2167,8 @@ export default {
         area: '',
         activity_id: ''
       }
-      this.$refs.status_tree.setCheckedKeys([])
-      this.$refs.pay_status_tree.setCheckedKeys([])
+      // this.$refs.status_tree.setCheckedKeys([])
+      // this.$refs.pay_status_tree.setCheckedKeys([])
       this.dialog.export = false
       this.listQuery.page_index = 1
       this.listQuery.page_size = 10

src/pages/order/store.vue

@@ -16,7 +16,16 @@
         <el-option v-for="item in activitys" :key="item.id" :label="item.title" :value="item.id" />
       </el-select>
       <el-button type="primary" icon="el-icon-search" class="filter-item" @click="listQuery.page_index = 1;getList()">搜索</el-button>
-      <el-button type="primary" :loading="downloadLoading" icon="el-icon-document" class="filter-item" @click="exportOrder">导出</el-button>
+      <el-popover
+        placement="bottom"
+        width="350"
+        trigger="hover"
+      >
+        <el-button type="primary" @click="exportOrder">订单明细</el-button>
+        <el-button type="primary" @click="exporOrdertOrder">拆单明细</el-button>
+        <el-button type="primary" @click="exportMoney">订单金额</el-button>
+        <el-button slot="reference" type="primary" :loading="downloadLoading" icon="el-icon-document" class="filter-item">导出</el-button>
+      </el-popover>
     </div>
     <el-table :data="tableList" :header-cell-style="{ background: '#f8fbfc' }" border stripe @selection-change="orderMulSelect">
       <el-table-column type="selection" width="50" align="center" :show-overflow-tooltip="true" />
@@ -56,7 +65,7 @@
         </template>
       </el-table-column>
       <el-table-column prop="total" label="数量合计" align="center" width="80" :show-overflow-tooltip="true" />
-      <el-table-column prop="money" label="订单总额" align="center" width="120" :show-overflow-tooltip="true">
+      <el-table-column prop="money" label="订单总额" align="censtoreter" width="120" :show-overflow-tooltip="true">
         <template slot-scope="{ row }">{{ `￥${row.money}` }}</template>
       </el-table-column>
       <el-table-column prop="get_address" label="收货人" align="center" width="120" :show-overflow-tooltip="true">
@@ -72,14 +81,58 @@
     </el-table>
     <!-- 分页 -->
     <pagination :total="tableTotal" :limit="listQuery.page_size" :page="listQuery.page_index" @pagination="changePagination" @update:limit="changePagination" />
+    <el-dialog title="导出数据" :visible.sync="export_order" width="520px">
+      <el-form label-width="120">
+        <el-form-item label="导出类型">
+          <el-button type="primary" @click="exportOrder">订单明细</el-button>
+          <el-button type="primary" @click="exporOrdertOrder">拆单明细</el-button>
+          <el-button type="primary" @click="exportMoney">订单金额</el-button>
+        </el-form-item>
+      </el-form>
+    </el-dialog>
   </div>
 </template>
 <script>
-import { getList, downOrder } from '@/api/order/store'
+import { getList, BreakUpOrder, downOrder, list_down } from '@/api/order/store'
 import { getStore } from '@/api/order/list'
 import { orderStatus, payStatus } from '@/filters/common'
 import { formatter } from '@/filters/index'
 import { activityList } from '@/api/giftB'
+const moduleList = {
+  '订单编号': '',
+  '下单时间': '',
+  '所属政委': '',
+  '寄件人': '大卫博士',
+  '联系方式': '4006867733',
+  '发件人详细地址': '河南省郑州市经开区',
+  '下单人昵称': '',
+  '下单人姓名': '',
+  '下单人手机号': '',
+  '收件人': '',
+  '电话': '',
+  '收件人省': '',
+  '收件人市': '',
+  '收件人区': '',
+  '收件人街道地址': '',
+  'L': '',
+  'XL': '',
+  'XXL': '',
+  'XXXL': '',
+  '女M': '',
+  '女L': '',
+  '女XL': '',
+  '女XXL': '',
+  '女XXXL': '',
+  '5XL': '',
+  '数据求和': '',
+  '所属': '',
+  '备注': '',
+  '赠品': '',
+  '快递单号': '',
+  '快递公司': '',
+  '快递公司代码': '',
+  '发货状态': ''
+}
 export default {
   data() {
     return {
@@ -87,6 +140,7 @@ export default {
       authList: this.$route.meta.authList,
       loadingFull: false,
       downloadLoading: false,
+      export_order: false,
       listQuery: {
         order_no: '',
         page_index: 1,
@@ -96,6 +150,7 @@ export default {
         store_id: '',
         activity_id: ''
       },
+      expressData: [],
       storeList: [],
       tableList: [],
       tableTotal: 0,
@@ -156,7 +211,151 @@ export default {
       this.listQuery.page_index = page
       this.getList()
     },
-    // 导出
+    // 订单金额
+    exportMoney() {
+      if (this.chooseList.length) {
+        // this.$request(downList({ id: this.chooseList.map(e => e.id) }), (res) => {
+        //   this.expressData = res
+        //   const exportData = this.getExportModule()
+        //   import('@/vendor/Export2Excel').then(excel => {
+        //     excel.export_json_to_excel({
+        //       header: Object.keys(moduleList),
+        //       data: exportData.map(listItem => Object.keys(exportData[0]).map(j => listItem[j])),
+        //       filename: `${new Date().toLocaleDateString()}快递单导出`,
+        //       bookType: 'xlsx',
+        //       isCSV: true
+        //     })
+        //     this.dialog.export_order = false
+        //   })
+        // })
+        this.$request(list_down({ id: this.chooseList.map(e => e.id) }), (res) => {
+          const exportData = res.list
+          import('@/vendor/Export2Excel').then(excel => {
+            const header = ['序号', '下单时间', '所属政委', '下单人昵称', '下单人姓名', '订单状态', '支付状态', '数量合计', '订单总额', '所属者姓名', '所属者手机号', '所属体验店', '收货人', '联系方式', '收货地址', '订单备注']
+            const exportK = ['index', 'updated_at', 'admin_name', 'nickname', 'realname', 'status', 'pay_status', 'total', 'money', 'belong_realname', 'belong_mobile', 'get_store', 'username', 'mobile', 'address', 'remark']
+            const exportV = exportData.map((item, i) => {
+              const obj = {
+                index: i + 1,
+                updated_at: item.updated_at || '',
+                admin_name: item.get_user && item.get_user.warea && item.get_user.warea.admin_name,
+                nickname: item.get_user.nickname || '',
+                realname: item.get_user.realname || '',
+                status: orderStatus(item.status).name || '',
+                pay_status: payStatus(item.pay_status).name,
+                total: item.total || '',
+                money: item.money || '',
+                get_store: item.get_store && item.get_store.name,
+                username: item.get_address.username || '',
+                mobile: +item.get_address.mobile,
+                belong_realname: item.belong_user && item.belong_user.realname,
+                belong_mobile: item.belong_user && item.belong_user.mobile,
+                address: item.get_address.province + item.get_address.city + item.get_address.town + item.get_address.address,
+                remark: item.remark || ''
+              }
+              return obj
+            })
+            const exportD = exportV.map(item => exportK.map(k => item[k]))
+            excel.export_json_to_excel({
+              header,
+              data: exportD,
+              filename: `${formatter(new Date(), 'yyyy-MM-dd')}订单金额`,
+              autoWidth: true,
+              bookType: 'xlsx'
+            })
+            this.export_order = false
+          })
+        })
+      } else {
+        if (this.tableList.length === 0) {
+          this.$message.error('没有可导出的数据')
+          return false
+        }
+        let query = {}
+        if (!this.highSearchFlag) {
+          const { order_status, order_no, page_index, page_size, store_id, search_name, time, activity_id } = this.listQuery
+          query = {
+            order_status, order_no, page_index, page_size, search_name, store_id,
+            start_time: time.length > 0 ? time[0] : '',
+            end_time: time.length > 0 ? time[1] : '',
+            activity_id
+          }
+        } else {
+          let order_status
+          let pay_status
+          try {
+            order_status = this.$refs.status_tree.getCheckedKeys()
+            if (order_status.indexOf(-1) !== -1) order_status = [-1]
+            pay_status = this.$refs.pay_status_tree.getCheckedKeys()
+            if (pay_status.indexOf(-1) !== -1) pay_status = [-1]
+          } catch (e) {
+            order_status = []
+            pay_status = []
+          }
+          const { page_index, page_size, order_num, time, name, address, good, type, provice, city, area, activity_id } = this.exportForm
+          query = {
+            page_index,
+            page_size,
+            order_no: order_num,
+            start_time: time.length > 0 ? time[0] : '',
+            end_time: time.length > 0 ? time[1] : '',
+            user_name: name,
+            receive_info: address,
+            goods_info: good,
+            order_status,
+            pay_status,
+            order_type: type,
+            provice: provice || '',
+            city: city || '',
+            area: area || '',
+            activity_id
+          }
+        }
+        this.$request(list_down(query), (res) => {
+          // console.log(res.data)
+          const exportData = res.list
+          // console.log(exportData)
+              import('@/vendor/Export2Excel').then(excel => {
+                const header = ['序号', '下单时间', '所属政委', '下单人昵称', '下单人姓名', '订单状态', '支付状态', '数量合计', '订单总额', '所属者姓名', '所属者手机号', '所属体验店', '收货人', '联系方式', '收货地址', '订单备注']
+                const exportK = ['index', 'updated_at', 'admin_name', 'nickname', 'realname', 'status', 'pay_status', 'total', 'money', 'belong_realname', 'belong_mobile', 'get_store', 'username', 'mobile', 'address', 'remark']
+                // if(+this.collect == false) {
+                //     header.splice(12,1)
+                //     exportK.splice(12,1)
+                //   }
+                const exportV = exportData.map((item, i) => {
+                  const obj = {
+                    index: i + 1,
+                    updated_at: item.updated_at || '',
+                    admin_name: item.get_user && item.get_user.warea && item.get_user.warea.admin_name,
+                    nickname: item.get_user.nickname || '',
+                    realname: item.get_user.realname || '',
+                    status: orderStatus(item.status).name || '',
+                    pay_status: payStatus(item.pay_status).name,
+                    total: item.total || '',
+                    money: item.money || '',
+                    username: item.get_address.username || '',
+                    get_store: item.get_store && item.get_store.name,
+                    mobile: +item.get_address.mobile,
+                    belong_realname: item.belong_user && item.belong_user.realname,
+                    belong_mobile: item.belong_user && item.belong_user.mobile,
+                    address: item.get_address.province + item.get_address.city + item.get_address.town + item.get_address.address,
+                    remark: item.remark || ''
+                  }
+                  return obj
+                })
+                const exportD = exportV.map(item => exportK.map(k => item[k]))
+                excel.export_json_to_excel({
+                  header,
+                  data: exportD,
+                  filename: `${formatter(new Date(), 'yyyy-MM-dd')}订单金额`,
+                  autoWidth: true,
+                  bookType: 'xlsx'
+                })
+                this.export_order = false
+              })
+        })
+      }
+    },
+    // 订单明细
     async exportOrder() {
       if (this.chooseList.length) {
         this.$request(downOrder({ id: this.chooseList.map(e => e.id) }), ({ list }) => {
@@ -169,7 +368,12 @@ export default {
             })
           })
         })
+        this.export_order = false
       } else {
+        if (this.tableList.length === 0) {
+          this.$message.error('没有可导出的数据')
+          return false
+        }
         let query = {}
         const { order_no, page_index, page_size, search_name, time, store_id, activity_id } = this.listQuery
         query = {
@@ -188,7 +392,296 @@ export default {
             })
           })
         })
+        this.export_order = false
+      }
+    },
+    // 导出拆单
+    async exporOrdertOrder() {
+      if (this.chooseList.length) {
+        this.$request(BreakUpOrder({ id: this.chooseList.map(e => e.id) }), (res) => {
+          this.expressData = res
+          const exportData = this.getExportModule()
+          import('@/vendor/Export2Excel').then(excel => {
+            excel.export_json_to_excel({
+              header: Object.keys(moduleList),
+              data: exportData.map(listItem => Object.keys(exportData[0]).map(j => listItem[j])),
+              filename: `${new Date().toLocaleDateString()}快递单导出`,
+              bookType: 'xlsx',
+              isCSV: true
+            })
+            this.export_order = false
+          })
+        })
+      } else {
+        if (this.tableList.length === 0) {
+          this.$message.error('没有可导出的数据')
+          return false
+        }
+        let query = {}
+        if (!this.highSearchFlag) {
+          const { order_status, order_no, page_index, page_size, search_name, time, activity_id, store_id } = this.listQuery
+          query = {
+            order_status, order_no, page_index, page_size, search_name, store_id,
+            start_time: time.length > 0 ? time[0] : '',
+            end_time: time.length > 0 ? time[1] : '',
+            activity_id
+          }
+        } else {
+          let order_status
+          let pay_status
+          try {
+            order_status = this.$refs.status_tree.getCheckedKeys()
+            if (order_status.indexOf(-1) !== -1) order_status = [-1]
+            pay_status = this.$refs.pay_status_tree.getCheckedKeys()
+            if (pay_status.indexOf(-1) !== -1) pay_status = [-1]
+          } catch (e) {
+            order_status = []
+            pay_status = []
+          }
+          const { page_index, page_size, order_num, time, name, address, good, type, provice, city, area, activity_id, store_id } = this.exportForm
+          query = {
+            page_index,
+            page_size,
+            store_id,
+            order_no: order_num,
+            start_time: time.length > 0 ? time[0] : '',
+            end_time: time.length > 0 ? time[1] : '',
+            user_name: name,
+            receive_info: address,
+            goods_info: good,
+            order_status,
+            pay_status,
+            order_type: type,
+            provice: provice || '',
+            city: city || '',
+            area: area || '',
+            activity_id
+          }
+        }
+        this.$request(BreakUpOrder(query), (res) => {
+          this.expressData = res
+          const exportData = this.getExportModule()
+          import('@/vendor/Export2Excel').then(excel => {
+            excel.export_json_to_excel({
+              header: Object.keys(moduleList),
+              data: exportData.map(listItem => Object.keys(exportData[0]).map(j => listItem[j])),
+              filename: `${new Date().toLocaleDateString()}快递单导出`,
+              bookType: 'xlsx',
+              isCSV: true
+            })
+            this.export_order = false
+          })
+        })
+      }
+    },
+    getExportModule() {
+      const data = this.expressData
+      const out = []
+      for (const i in data) {
+        const item = data[i]
+        const info = item.data
+        let a = 0
+        let b = 0
+        let c = 0
+        let d = 0
+        while (a < item['精装'].length) {
+          const obj = Object.assign({}, moduleList)
+          obj['订单编号'] = i
+          obj['下单时间'] = info.created_at
+          obj['所属政委'] = info.admin_name
+          obj['下单人昵称'] = info.u_nickname
+          obj['下单人姓名'] = info.u_name
+          obj['下单人手机号'] = info.u_mobile
+          obj['收件人'] = info.username
+          obj['电话'] = info.mobile
+          obj['收件人省'] = info.province
+          obj['收件人市'] = info.city
+          obj['收件人区'] = info.town
+          obj['收件人街道地址'] = info.address
+          obj['备注'] = info.remark
+          obj['所属'] = info.belong
+          obj['赠品'] = info.gift.map(item => `${item.name}${item.num}`).join(';')
+          let num_all = 0
+          if (item['精装'][a].sec_attr === '男女款') {
+            const sex = item['精装'][a].size.split('-')[0]
+            let size = item['精装'][a].size.split('-')[1]
+            size = size === '3XL' ? 'XXXL' : size
+            if (sex === '男款') {
+              obj[size] = `${item['精装'][a].num}${item['精装'][a].main_attr}`
+              num_all += item['精装'][a].num
+            } else {
+              obj['女' + size] = `${item['精装'][a].num}${item['精装'][a].main_attr}`
+              num_all += item['精装'][a].num
+            }
+          } else {
+            if (item['精装'][a].size === '3XL') {
+              item['精装'][a].size = 'XXXL'
+            }
+            if (item['精装'][a].sec_attr === '男款') {
+              obj[item['精装'][a].size] = `${item['精装'][a].num}${item['精装'][a].main_attr}`
+              num_all += item['精装'][a].num
+            }
+            if (item['精装'][a].sec_attr === '女款') {
+              obj['女' + item['精装'][a].size] = `${item['精装'][a].num}${item['精装'][a].main_attr}`
+              num_all += item['精装'][a].num
+            }
+          }
+          obj['数据求和'] = num_all
+          out.push(obj)
+          a++
+        }
+        while (b < item['普通'].length) {
+          const obj = Object.assign({}, moduleList)
+          obj['订单编号'] = i
+          obj['下单时间'] = info.created_at
+          obj['所属政委'] = info.admin_name
+          obj['下单人昵称'] = info.u_nickname
+          obj['下单人姓名'] = info.u_name
+          obj['下单人手机号'] = info.u_mobile
+          obj['收件人'] = info.username
+          obj['电话'] = info.mobile
+          obj['收件人省'] = info.province
+          obj['收件人市'] = info.city
+          obj['收件人区'] = info.town
+          obj['收件人街道地址'] = info.address
+          obj['备注'] = info.remark
+          obj['所属'] = info.belong
+          obj['赠品'] = info.gift.map(item => `${item.name}${item.num}`).join(';')
+          let num_all = 0
+          if (item['普通'][b].sec_attr === '男女款') {
+            const sex = item['普通'][b].size.split('-')[0]
+            let size = item['普通'][b].size.split('-')[1]
+            size = size === '3XL' ? 'XXXL' : size
+            if (sex === '男款') {
+              obj[size] = `${item['普通'][b].num}${item['普通'][b].main_attr}`
+              num_all += item['普通'][b].num
+            } else {
+              obj['女' + size] = `${item['普通'][b].num}${item['普通'][b].main_attr}`
+              num_all += item['普通'][b].num
+            }
+          } else {
+            if (item['普通'][b].size === '3XL') {
+              item['普通'][b].size = 'XXXL'
+            }
+            if (item['普通'][b].sec_attr === '男款') {
+              obj[item['普通'][b].size] = `${item['普通'][b].num}${item['普通'][b].main_attr}`
+              num_all += item['普通'][b].num
+            }
+            if (item['普通'][b].sec_attr === '女款') {
+              obj['女' + item['普通'][b].size] = `${item['普通'][b].num}${item['普通'][b].main_attr}`
+              num_all += item['普通'][b].num
+            }
+          }
+          obj['数据求和'] = num_all
+          out.push(obj)
+          b++
+        }
+        while (c < item['精装混合'].length) {
+          const obj = Object.assign({}, moduleList)
+          obj['订单编号'] = i
+          obj['下单时间'] = info.created_at
+          obj['所属政委'] = info.admin_name
+          obj['下单人昵称'] = info.u_nickname
+          obj['下单人姓名'] = info.u_name
+          obj['下单人手机号'] = info.u_mobile
+          obj['收件人'] = info.username
+          obj['电话'] = info.mobile
+          obj['收件人省'] = info.province
+          obj['收件人市'] = info.city
+          obj['收件人区'] = info.town
+          obj['收件人街道地址'] = info.address
+          obj['备注'] = info.remark
+          obj['所属'] = info.belong
+          obj['赠品'] = info.gift.map(item => `${item.name}${item.num}`).join(';')
+          let num_all = 0
+          for (let j = 0; j < item['精装混合'][c].length; j++) {
+            if (item['精装混合'][c][j].sec_attr === '男女款') {
+              const sex = item['精装混合'][c][j].size.split('-')[0]
+              let size = item['精装混合'][c][j].size.split('-')[1]
+              size = size === '3XL' ? 'XXXL' : size
+              if (sex === '男款') {
+                obj[size] += `${item['精装混合'][c][j].num}${item['精装混合'][c][j].main_attr}`
+                num_all += item['精装混合'][c][j].num
+              } else {
+                obj['女' + size] += `${item['精装混合'][c][j].num}${item['精装混合'][c][j].main_attr}`
+                num_all += item['精装混合'][c][j].num
+              }
+            } else {
+              if (item['精装混合'][c][j].size === '3XL') {
+                if (item['精装混合'][c][j].sec_attr === '男款') {
+                  obj['XXXL'] += `${item['精装混合'][c][j].num}${item['精装混合'][c][j].main_attr}`
+                  num_all += item['精装混合'][c][j].num
+                }
+              } else {
+                if (item['精装混合'][c][j].sec_attr === '男款') {
+                  obj[item['精装混合'][c][j].size] += `${item['精装混合'][c][j].num}${item['精装混合'][c][j].main_attr}`
+                  num_all += item['精装混合'][c][j].num
+                }
+                if (item['精装混合'][c][j].sec_attr === '女款') {
+                  obj['女' + item['精装混合'][c][j].size] += `${item['精装混合'][c][j].num}${item['精装混合'][c][j].main_attr}`
+                  num_all += item['精装混合'][c][j].num
+                }
+              }
+            }
+          }
+          obj['数据求和'] = num_all
+          out.push(obj)
+          c++
+        }
+        while (d < item['普通混合'].length) {
+          const obj = Object.assign({}, moduleList)
+          obj['订单编号'] = i
+          obj['下单时间'] = info.created_at
+          obj['所属政委'] = info.admin_name
+          obj['下单人昵称'] = info.u_nickname
+          obj['下单人姓名'] = info.u_name
+          obj['下单人手机号'] = info.u_mobile
+          obj['收件人'] = info.username
+          obj['电话'] = info.mobile
+          obj['收件人省'] = info.province
+          obj['收件人市'] = info.city
+          obj['收件人区'] = info.town
+          obj['收件人街道地址'] = info.address
+          obj['备注'] = info.remark
+          obj['所属'] = info.belong
+          obj['赠品'] = info.gift.map(item => `${item.name}${item.num}`).join(';')
+          let num_all = 0
+          for (let j = 0; j < item['普通混合'][d].length; j++) {
+            if (item['普通混合'][d][j].sec_attr === '男女款') {
+              const sex = item['普通混合'][d][j].size.split('-')[0]
+              let size = item['普通混合'][d][j].size.split('-')[1]
+              size = size === '3XL' ? 'XXXL' : size
+              if (sex === '男款') {
+                obj[size] += `${item['普通混合'][d][j].num}${item['普通混合'][d][j].main_attr}`
+                num_all += item['普通混合'][d][j].num
+              } else {
+                obj['女' + size] += `${item['普通混合'][d][j].num}${item['普通混合'][d][j].main_attr}`
+                num_all += item['普通混合'][d][j].num
+              }
+            } else {
+              if (item['普通混合'][d][j].size === '3XL') {
+                if (item['普通混合'][d][j].sec_attr === '男款') {
+                  obj['XXXL'] += `${item['普通混合'][d][j].num}${item['普通混合'][d][j].main_attr}`
+                  num_all += item['普通混合'][d][j].num
+                }
+              } else {
+                if (item['普通混合'][d][j].sec_attr === '男款') {
+                  obj[item['普通混合'][d][j].size] += `${item['普通混合'][d][j].num}${item['普通混合'][d][j].main_attr}`
+                  num_all += item['普通混合'][d][j].num
+                }
+                if (item['普通混合'][d][j].sec_attr === '女款') {
+                  obj['女' + item['普通混合'][d][j].size] += `${item['普通混合'][d][j].num}${item['普通混合'][d][j].main_attr}`
+                  num_all += item['普通混合'][d][j].num
+                }
+              }
+            }
+          }
+          obj['数据求和'] = num_all
+          out.push(obj)
+          d++
+        }
       }
+      return out
     },
     orderMulSelect(val) {
       this.chooseList = val

src/pages/order/test.vue

@@ -0,0 +1,25 @@
+<template>
+  <div>
+    <button @click="dialogVisible=true">点击</button>
+    <el-dialog
+      title="提示"
+      :visible.sync="dialogVisible"
+      width="30%"
+      append-to-body
+    >
+      <span>这是一段信息</span>
+      <span slot="footer" class="dialog-footer">
+        <el-button @click="dialogVisible = false">取 消</el-button>
+      </span>
+    </el-dialog>
+  </div>
+</template>
+<script>
+export default {
+  data() {
+    return {
+      dialogVisible: false
+    }
+  }
+}
+</script>

src/pages/studio/order_detail.vue

@@ -22,10 +22,13 @@
           </div>
         </div>
         <div v-if="roles.indexOf(2) !== -1" class="head-btns">
-          <div v-if="orderDetail && orderDetail.status === 2">
+          <div v-if="orderDetail && orderDetail.status === 2 || orderDetail.status === 3">
             <!-- <el-button icon="el-icon-edit-outline" @click="ycn_changGoodList_dialog = true">修改</el-button> -->
             <el-button icon="el-icon-refresh" @click="dialog.back = true">退回</el-button>
           </div>
+          <!-- <div v-else-if="orderDetail && orderDetail.status === 3">
+              <el-button icon="el-icon-refresh" @click="dialog.back = true">退回</el-button>
+          </div> -->
         </div>
       </div>
       <!-- 表格 -->

src/permission.js

@@ -10,7 +10,7 @@ import { filterRouter } from '@/filterRouter'
 
 NProgress.configure({ showSpinner: false }) // 滚动条配置
 
-const whiteList = ['/login', '/auth-redirect', '/1', '/2'] // 路由重定向白名单
+const whiteList = ['/login', '/auth-redirect', '/1', '/2', '/9'] // 路由重定向白名单
 
 router.beforeEach(async(to, from, next) => {
   // 开始加载滚动条

src/router/auth.js

@@ -27,6 +27,11 @@ export const defaultRoutes = [
     hidden: true
   },
   {
+    path: '/9',
+    component: '/dataScreen/hint',
+    hidden: true
+  },
+  {
     path: '/404',
     component: '/error-page/404',
     hidden: true
@@ -439,7 +444,16 @@ export const asyncRoutes = [
         component: '/data/order',
         name: 'data_order',
         meta: {
-          title: '订单排名',
+          title: '代理公司排名',
+          noCache: true
+        }
+      },
+      {
+        path: 'order_belong',
+        component: '/data/order_belong',
+        name: 'data_order_belong',
+        meta: {
+          title: '所属者排名',
           noCache: true
         }
       },

src/router/index.js

@@ -90,6 +90,11 @@ export const constantRoutes = [
     hidden: true
   },
   {
+    path: '/9',
+    component: () => import('@/pages/dataScreen/hint'),
+    hidden: true
+  },
+  {
     path: '/',
     component: Layout,
     redirect: '/home',