lilei 2 jaren geleden
bovenliggende
commit
b4c33acb93

BIN
src/assets/s1.png


BIN
src/assets/s2.png


BIN
src/assets/s3.png


+ 74 - 1
src/config/router.config.js

@@ -128,8 +128,81 @@ export const asyncRouterMap = [
           }
         ]
       },
+      // 数据统计
+      {
+        path: '/dataStatistics',
+        redirect: '/dataStatistics/userAnalysis',
+        component: PageView,
+        meta: {
+          title: '数据统计',
+          icon: 'hdd',
+          // permission: 'M_dataStatistics'
+        },
+        children: [
+          {
+            path: '/dataStatistics/userAnalysis',
+            redirect: '/dataStatistics/userAnalysis/list',
+            name: 'userAnalysis',
+            component: BlankLayout,
+            meta: {
+              title: '用户分析',
+              icon: 'monitor',
+              // permission: 'M_userAnalysisList'
+            },
+            hideChildrenInMenu: true,
+            children: [
+              {
+                path: 'list',
+                name: 'userAnalysisList',
+                component: () => import('@/views/dataStatistics/userAnalysis/list.vue'),
+                meta: {
+                  title: '用户分析',
+                  icon: 'monitor',
+                  hidden: true
+                }
+              },
+              {
+                path: 'registeredUser',
+                name: 'registeredUser',
+                component: () => import('@/views/dataStatistics/userAnalysis/registeredUser.vue'),
+                meta: {
+                  title: '注册用户',
+                  hidden: true,
+                }
+              },
+              {
+                path: 'usedUser',
+                name: 'usedUser',
+                component: () => import('@/views/dataStatistics/userAnalysis/usedUser.vue'),
+                meta: {
+                  title: '使用用户',
+                  hidden: true,
+                }
+              },
+              {
+                path: 'activeUser',
+                name: 'activeUser',
+                component: () => import('@/views/dataStatistics/userAnalysis/activeUser.vue'),
+                meta: {
+                  title: '活跃用户',
+                  hidden: true,
+                }
+              }
+            ]
+          },
+          {
+            path: '/dataStatistics/orderDataSummary',
+            name: 'orderDataSummary',
+            component: () => import('@/views/dataStatistics/orderDataSummary/list.vue'),
+            meta: {
+              title: '订单数据汇总',
+              icon: 'user',
+              // permission: 'M_orderDataSummary'
+            }
+          },
+        ]
+      },
       // 系统设置
-      // auth
       {
         path: '/auth',
         redirect: '/auth/userList',

+ 101 - 0
src/views/common/areaList.js

@@ -0,0 +1,101 @@
+import { getArea } from '@/api/data'
+const areaList = {
+  template: `
+      <a-cascader
+        :value="defaultVal"
+        allowClear
+        :change-on-select="changeOnSelect"
+        @change="handleChange"
+        :options="list"
+        expand-trigger="hover"
+        :show-search="{ filterOption }"
+        :placeholder="placeholder"
+        :id="id"
+        :fieldNames="{ label: 'name', value: 'areaSn', children:'children'}"/>
+    `,
+  props: {
+    value: {
+      type: Array,
+      defatut: function(){
+        return []
+      }
+    },
+    id: {
+      type: String,
+      default: ''
+    },
+    placeholder:{
+      type: String,
+      default: '请选择'
+    },
+    changeOnSelect:{
+      type: Boolean,
+      default: false
+    },
+    level:{
+      type: [String,Number],
+      default: ''
+    }
+  },
+  data() {
+    return {
+      defaultVal: this.value,
+      list: []
+    };
+  },
+  mounted() {
+    this.getArea()
+  },
+  watch: {
+    value(newValue, oldValue) {
+      this.defaultVal = newValue
+    }
+  },
+  methods: {
+    filterOption(inputValue, path) {
+      return path.some(option => option.name.toLowerCase().indexOf(inputValue.toLowerCase()) > -1);
+    },
+    handleChange(value,opts) {
+      this.defaultVal = value;
+      this.$emit('input', value);
+      this.$emit('change', value,opts);
+    },
+    getArea () {
+      getArea({}).then(res => {
+        if (res.status == 200) {
+          this.list = this.getBylevel(res.data)
+        } else {
+          this.list = []
+        }
+      })
+    },
+    getBylevel(data){
+      const a = data.filter(item => item.type == 2) // 省
+      const b = data.filter(item => item.type == 3) // 市
+      const c = data.filter(item => item.type == 4) // 县
+      
+      // 显示一级分类
+      if(this.level == 1){
+        return a
+      }
+      // 显示二级分类
+      if(this.level == 2){
+        a.map(item => {
+           item.children = b.filter(k => k.parentId == item.id)
+        })
+        console.log(a)
+        return a
+      }
+      // 全部显示
+      b.map(item => {
+        item.children = c.filter(k => k.parentId == item.id)
+      })
+      a.map(item => {
+         item.children = b.filter(k => k.parentId == item.id)
+      })
+      return a
+    }
+  },
+};
+
+export default areaList

+ 269 - 0
src/views/dataStatistics/orderDataSummary/list.vue

@@ -0,0 +1,269 @@
+<template>
+  <div class="userd-baseInfo">
+    <a-card size="small" :bordered="false">
+      <a-spin :spinning="spinning" tip="Loading...">
+        <div ref="tableSearch" class="table-page-search-wrapper">
+          <a-form layout="inline" @keyup.enter.native="$refs.table.refresh(true)">
+            <a-row :gutter="15">
+              <a-col :md="5" :sm="24">
+                <a-form-item label="货架创建时间">
+                  <rangeDate ref="rangeDate" :value="time" @change="dateChange" />
+                </a-form-item>
+              </a-col>
+              <a-col :md="5" :sm="24">
+                <a-form-item label="汽车修理厂">
+                  <storeList ref="storeList" @change="storeChange" id="userd-storeChange"></storeList>
+                </a-form-item>
+              </a-col>
+              <a-col :md="5" :sm="24">
+                <a-form-item label="配件经销商">
+                  <dealerList ref="dealerList" @change="dealerChange" id="userd-dealerChange"></dealerList>
+                </a-form-item>
+              </a-col>
+              <a-col :md="4" :sm="24">
+                <a-form-item label="所在地">
+                  <areaList level="2" placeholder="请选择所在地"></areaList>
+                </a-form-item>
+              </a-col>
+              <template v-if="advanced">
+                <a-col :md="4" :sm="24">
+                  <a-form-item label="货架状态">
+                    <v-select id="userd-state" code="SHELF_STATE" v-model="queryParam.state" allowClear placeholder="请选择状态"></v-select>
+                  </a-form-item>
+                </a-col>
+                <a-col :md="5" :sm="24">
+                  <a-form-item label="下单时间">
+                    <rangeDate ref="orderDate" :value="orderTime" @change="orderDateChange" />
+                  </a-form-item>
+                </a-col>
+                <a-col :md="5" :sm="24">
+                  <a-form-item label="货架取货数量">
+                    <a-input-group compact>
+                      <a-input-number
+                        :precision="0"
+                        style=" width: 42%; text-align: center"
+                        v-model.trim="queryParam.qhslMin"
+                        allowClear
+                        placeholder="请输入最小值"/>
+                      <a-input
+                        style=" width: 16%; pointer-events: none; backgroundColor: #fff"
+                        placeholder="至"
+                        disabled
+                      />
+                      <a-input-number
+                        :precision="0"
+                        :min="queryParam.qhslMin"
+                        style=" width: 42%; text-align: center"
+                        v-model.trim="queryParam.qhslMax"
+                        allowClear
+                        placeholder="请输入最大值"/>
+                    </a-input-group>
+                  </a-form-item>
+                </a-col>
+                <a-col :md="5" :sm="24">
+                  <a-form-item label="销售数量">
+                    <a-input-group compact>
+                      <a-input-number
+                        :precision="0"
+                        style=" width: 42%; text-align: center"
+                        v-model.trim="queryParam.qhslMin"
+                        allowClear
+                        placeholder="请输入最小值"/>
+                      <a-input
+                        style=" width: 16%; pointer-events: none; backgroundColor: #fff"
+                        placeholder="至"
+                        disabled
+                      />
+                      <a-input-number
+                        :precision="0"
+                        :min="queryParam.qhslMin"
+                        style=" width: 42%; text-align: center"
+                        v-model.trim="queryParam.qhslMax"
+                        allowClear
+                        placeholder="请输入最大值"/>
+                    </a-input-group>
+                  </a-form-item>
+                </a-col>
+              </template>
+              <a-col :md="4" :sm="24" style="margin-bottom: 10px;">
+                <a-button type="primary" @click="$refs.table.refresh(true)" id="userd-refresh">查询</a-button>
+                <a-button type="" @click="reset" style="margin-left: 10px;" id="userd-reset">重置</a-button>
+                <a-button type="primary" class="button-warning" style="margin-left: 10px;" id="userd-reset">导出</a-button>
+                <a @click="advanced=!advanced" style="margin-left: 8px">
+                  {{ advanced ? '收起' : '展开' }}
+                  <a-icon :type="advanced ? 'up' : 'down'"/>
+                </a>
+              </a-col>
+            </a-row>
+          </a-form>
+        </div>
+        <div class="table-operator">
+          <a-alert type="info">
+            <div slot="message" class="total-bar">
+              <div>
+                门店数量:<strong>399</strong>;
+                铺货数量合计:<strong>399</strong>;
+                铺货金额合计:<strong>26545</strong>;
+              </div>
+            </div>
+          </a-alert>
+        </div>
+        <s-table
+          class="sTable fixPagination"
+          ref="table"
+          :style="{ height: tableHeight+84.5+'px', wordBreak: 'break-all' }"
+          size="small"
+          rowKey="id"
+          :columns="columns"
+          :data="loadData"
+          :scroll="{ y: tableHeight }"
+          :defaultLoadData="false"
+          bordered>
+          <span slot="customTitle">
+            <a-popover>
+              <template slot="content">
+                表示此修理厂最近一次从货架上取货的时间
+              </template>
+              <a-icon type="question-circle" theme="twoTone" />
+            </a-popover>
+            最近下单时间
+          </span>
+        </s-table>
+      </a-spin>
+    </a-card>
+  </div>
+</template>
+
+<script>
+import { STable, VSelect } from '@/components'
+import rangeDate from '@/views/common/rangeDate.vue'
+import { bondRecordByPage } from '@/api/boundRecord.js'
+import areaList from '@/views/common/areaList.js'
+import dealerList from '@/views/common/dealerList.vue'
+import storeList from '@/views/common/storeList.vue'
+import { toThousands } from '@/libs/tools.js'
+export default {
+  name: 'UserList',
+  components: { STable, VSelect, rangeDate, dealerList, storeList, areaList },
+  data () {
+    return {
+      spinning: false,
+      advanced: false,
+      tableHeight: 0,
+      time: [],
+      orderTime: [],
+      // 查询参数
+      queryParam: {
+        shelfName: '',
+        state: undefined
+      },
+      showModal: false,
+      itemData: null, // 编辑行数据
+      openStatusModal: false, // 货架状态弹窗初始状态
+      // 表头
+      columns: [
+        { title: '序号', dataIndex: 'no', width: '5%', align: 'center' },
+        { title: '货架创建时间', dataIndex: 'createDate', width: '10%', align: 'center', customRender: function (text) { return text || '--' } },
+        { title: '汽车修理厂', dataIndex: 'storeName', width: '15%', align: 'left', customRender: function (text) { return text || '--' }, ellipsis: true },
+        { title: '配件经销商', dataIndex: 'dealerName', width: '15%', align: 'left', customRender: function (text) { return text || '--' }, ellipsis: true },
+        { title: '所在地', dataIndex: 'createDate2', width: '11%', align: 'center', customRender: function (text) { return text || '--' } },
+        { title: '货架状态', dataIndex: 'stateDictValue', width: '11%', align: 'center', customRender: function (text) { return text || '--' } },
+        { title: '铺货数量', dataIndex: 'bondAmount', width: '11%', align: 'center', customRender: function (text) { return text && toThousands(text, 2) || '--' }, sorter: true },
+        { title: '铺货金额', dataIndex: 'bondAmount', width: '11%', align: 'center', customRender: function (text) { return text && toThousands(text, 2) || '--' }, sorter: true },
+        { slots: { title: 'customTitle' }, dataIndex: 'createDate', width: '11%', align: 'center', customRender: function (text) { return text || '--' } }
+      ],
+      // 加载数据方法 必须为 Promise 对象
+      loadData: parameter => {
+        this.spinning = true
+        return bondRecordByPage(Object.assign(parameter, this.queryParam)).then(res => {
+          let data
+          if (res.status == 200) {
+            data = res.data
+            const no = (data.pageNo - 1) * data.pageSize
+            for (let i = 0; i < data.list.length; i++) {
+              const _item = data.list[i]
+              _item.no = no + i + 1
+            }
+          }
+          this.spinning = false
+          return data
+        })
+      }
+    }
+  },
+  methods: {
+    handleBack () {
+      this.$router.go(-1)
+    },
+    //  时间  change
+    dateChange (date) {
+      this.queryParam.beginDate = date[0]
+      this.queryParam.endDate = date[1]
+    },
+    //  时间  change
+    orderDateChange (date) {
+      this.queryParam.beginDate = date[0]
+      this.queryParam.endDate = date[1]
+    },
+    // 经销商 change
+    dealerChange (obj) {
+      this.queryParam.dealerSn = obj.key || undefined
+    },
+    // 汽车修理厂 change
+    storeChange (obj) {
+      this.queryParam.storeSn = obj.key || undefined
+    },
+    // 重置
+    reset () {
+      this.queryParam = {
+        shelfName: '',
+        state: undefined
+      }
+      this.$refs.dealerList.resetForm()
+      this.$refs.storeList.resetForm()
+      this.$refs.table.refresh(true)
+    },
+    pageInit () {
+      const _this = this
+      this.$nextTick(() => { // 页面渲染完成后的回调
+        _this.setTableH()
+      })
+    },
+    setTableH () {
+      const tableSearchH = this.$refs.tableSearch.offsetHeight
+      this.tableHeight = window.innerHeight - tableSearchH - 205
+    }
+  },
+  watch: {
+    advanced (newValue, oldValue) {
+      const _this = this
+      this.$nextTick(() => { // 页面渲染完成后的回调
+        _this.setTableH()
+      })
+    },
+    '$store.state.app.winHeight' (newValue, oldValue) { //  窗口变更时,需同时更改表格高度
+      this.setTableH()
+    }
+  },
+  mounted () {
+    if (!this.$store.state.app.isNewTab) { // 页签刷新时调用
+      this.pageInit()
+      this.reset()
+    }
+  },
+  activated () {
+    // 如果是新页签打开,则重置当前页面
+    if (this.$store.state.app.isNewTab) {
+      this.pageInit()
+      this.reset()
+    }
+  }
+}
+</script>
+<style lang="less">
+  .userd-baseInfo{
+    .userd-back{
+      margin-bottom: 6px;
+    }
+  }
+</style>

+ 316 - 0
src/views/dataStatistics/userAnalysis/activeUser.vue

@@ -0,0 +1,316 @@
+<template>
+  <div class="activeuser-baseInfo">
+    <a-page-header :ghost="false" title="活跃用户" :backIcon="false" class="activeuser-back">
+      <template slot="subTitle">
+        <a href="javascript:;" @click="handleBack" id="activeuser-handleBack">
+          <a-icon type="left"></a-icon> 返回上页
+        </a>
+      </template>
+    </a-page-header>
+    <a-card size="small" :bordered="false" style="margin-bottom: 6px;">
+      <div style="padding:0 10px;color: #00aaff;cursor: pointer;" slot="extra" @click="showSetModal=true"><a-icon type="setting" /> 参数设置</div>
+      <div class="gard-box">
+        <div>
+          <a-card size="small">
+            <h4>LV1</h4>
+            <p>近30天销售金额 ≤ 1000元</p>
+            <div>
+              <div><span>门店数量</span><span>21个</span></div>
+              <div><span>累计销售金额</span><span>21元</span></div>
+              <div><span>门店数量占比</span><span>21%</span></div>
+              <div><span>累计销售金额占比</span><span>21%</span></div>
+            </div>
+          </a-card>
+        </div>
+        <div>
+          <a-card size="small">
+            <h4>LV2</h4>
+            <p> 1000元 < 近30天销售金额 ≤ 2000元</p>
+            <div>
+              <div><span>门店数量</span><span>21个</span></div>
+              <div><span>累计销售金额</span><span>21元</span></div>
+              <div><span>门店数量占比</span><span>21%</span></div>
+              <div><span>累计销售金额占比</span><span>21%</span></div>
+            </div>
+          </a-card>
+        </div>
+        <div>
+          <a-card size="small">
+            <h4>LV3</h4>
+            <p> 2000元 < 近30天销售金额 ≤ 3000元</p>
+            <div>
+              <div><span>门店数量</span><span>21个</span></div>
+              <div><span>累计销售金额</span><span>21元</span></div>
+              <div><span>门店数量占比</span><span>21%</span></div>
+              <div><span>累计销售金额占比</span><span>21%</span></div>
+            </div>
+          </a-card>
+        </div>
+        <div>
+          <a-card size="small">
+            <h4>LV4</h4>
+            <p> 3000元 < 近30天销售金额 ≤ 5000元</p>
+            <div>
+              <div><span>门店数量</span><span>21个</span></div>
+              <div><span>累计销售金额</span><span>21元</span></div>
+              <div><span>门店数量占比</span><span>21%</span></div>
+              <div><span>累计销售金额占比</span><span>21%</span></div>
+            </div>
+          </a-card>
+        </div>
+        <div>
+          <a-card size="small">
+            <h4>LV5</h4>
+            <p> 5000元 < 近30天销售金额</p>
+            <div>
+              <div><span>门店数量</span><span>21个</span></div>
+              <div><span>累计销售金额</span><span>21元</span></div>
+              <div><span>门店数量占比</span><span>21%</span></div>
+              <div><span>累计销售金额占比</span><span>21%</span></div>
+            </div>
+          </a-card>
+        </div>
+      </div>
+    </a-card>
+    <a-card size="small" :bordered="false">
+      <a-spin :spinning="spinning" tip="Loading...">
+        <div ref="tableSearch" class="table-page-search-wrapper">
+          <a-form layout="inline" @keyup.enter.native="$refs.table.refresh(true)">
+            <a-row :gutter="15">
+              <a-col :md="5" :sm="24">
+                <a-form-item label="货架创建时间">
+                  <rangeDate ref="rangeDate" :value="time" @change="dateChange" />
+                </a-form-item>
+              </a-col>
+              <a-col :md="5" :sm="24">
+                <a-form-item label="汽车修理厂">
+                  <storeList ref="storeList" @change="storeChange" id="activeuser-storeChange"></storeList>
+                </a-form-item>
+              </a-col>
+              <a-col :md="5" :sm="24">
+                <a-form-item label="配件经销商">
+                  <dealerList ref="dealerList" @change="dealerChange" id="activeuser-dealerChange"></dealerList>
+                </a-form-item>
+              </a-col>
+              <a-col :md="4" :sm="24">
+                <a-form-item label="所在地">
+                  <areaList level="2" placeholder="请选择所在地"></areaList>
+                </a-form-item>
+              </a-col>
+              <template v-if="advanced">
+                <a-col :md="4" :sm="24">
+                  <a-form-item label="货架状态">
+                    <v-select id="activeuser-state" code="SHELF_STATE" v-model="queryParam.state" allowClear placeholder="请选择状态"></v-select>
+                  </a-form-item>
+                </a-col>
+              </template>
+              <a-col :md="4" :sm="24" style="margin-bottom: 10px;">
+                <a-button type="primary" @click="$refs.table.refresh(true)" id="activeuser-refresh">查询</a-button>
+                <a-button type="" @click="reset" style="margin-left: 10px;" id="activeuser-reset">重置</a-button>
+                <a-button type="primary" class="button-warning" style="margin-left: 10px;" id="activeuser-reset">导出</a-button>
+                <a @click="advanced=!advanced" style="margin-left: 8px">
+                  {{ advanced ? '收起' : '展开' }}
+                  <a-icon :type="advanced ? 'up' : 'down'"/>
+                </a>
+              </a-col>
+            </a-row>
+          </a-form>
+        </div>
+        <div class="table-operator">
+          <a-alert type="info">
+            <div slot="message" class="total-bar">
+              <div>
+                门店数量:<strong>399</strong>;
+                近30天货架取货数量合计:<strong>399</strong>;
+                近30天货架取货金额合计:<strong>26545</strong>;
+                近30天销售数量合计:<strong>26545</strong>;
+                近30天销售金额合计:<strong>26545</strong>;
+              </div>
+            </div>
+          </a-alert>
+        </div>
+        <s-table
+          class="sTable fixPagination"
+          ref="table"
+          :style="{ height: tableHeight+84.5+'px', wordBreak: 'break-all' }"
+          size="small"
+          rowKey="id"
+          :columns="columns"
+          :data="loadData"
+          :scroll="{ y: tableHeight }"
+          :defaultLoadData="false"
+          bordered>
+        </s-table>
+      </a-spin>
+    </a-card>
+    <!-- 参数设置 -->
+    <setModal :openModal="showSetModal" :nowData="itemData" @close="showSetModal=false"></setModal>
+  </div>
+</template>
+
+<script>
+import { STable, VSelect } from '@/components'
+import rangeDate from '@/views/common/rangeDate.vue'
+import { bondRecordByPage } from '@/api/boundRecord.js'
+import areaList from '@/views/common/areaList.js'
+import dealerList from '@/views/common/dealerList.vue'
+import storeList from '@/views/common/storeList.vue'
+import { toThousands } from '@/libs/tools.js'
+import setModal from './setModal.vue'
+export default {
+  name: 'UserList',
+  components: { STable, VSelect, rangeDate, dealerList, storeList, areaList, setModal },
+  data () {
+    return {
+      spinning: false,
+      advanced: false,
+      showSetModal: false,
+      tableHeight: 0,
+      activeKey: ['1'],
+      time: [],
+      orderTime: [],
+      // 查询参数
+      queryParam: {
+        shelfName: '',
+        state: undefined
+      },
+      showModal: false,
+      itemData: null, // 编辑行数据
+      openStatusModal: false, // 货架状态弹窗初始状态
+      // 表头
+      columns: [
+        { title: '序号', dataIndex: 'no', width: '5%', align: 'center' },
+        { title: '货架创建时间', dataIndex: 'createDate', width: '10%', align: 'center', customRender: function (text) { return text || '--' } },
+        { title: '汽车修理厂', dataIndex: 'storeName', width: '15%', align: 'left', customRender: function (text) { return text || '--' }, ellipsis: true },
+        { title: '配件经销商', dataIndex: 'dealerName', width: '15%', align: 'left', customRender: function (text) { return text || '--' }, ellipsis: true },
+        { title: '所在地', dataIndex: 'createDate2', width: '11%', align: 'center', customRender: function (text) { return text || '--' } },
+        { title: '货架状态', dataIndex: 'stateDictValue', width: '11%', align: 'center', customRender: function (text) { return text || '--' } },
+        { title: '近30天货架取货数量', dataIndex: 'bondAmount', width: '11%', align: 'center', customRender: function (text) { return text && toThousands(text, 2) || '--' }, sorter: true },
+        { title: '近30天货架取货金额', dataIndex: 'bondAmount', width: '11%', align: 'center', customRender: function (text) { return text && toThousands(text, 2) || '--' }, sorter: true },
+        { title: '近30天销售数量', dataIndex: 'bondAmount', width: '11%', align: 'center', customRender: function (text) { return text && toThousands(text, 2) || '--' }, sorter: true },
+        { title: '近30天销售金额', dataIndex: 'bondAmount', width: '11%', align: 'center', customRender: function (text) { return text && toThousands(text, 2) || '--' }, sorter: true }
+      ],
+      // 加载数据方法 必须为 Promise 对象
+      loadData: parameter => {
+        this.spinning = true
+        return bondRecordByPage(Object.assign(parameter, this.queryParam)).then(res => {
+          let data
+          if (res.status == 200) {
+            data = res.data
+            const no = (data.pageNo - 1) * data.pageSize
+            for (let i = 0; i < data.list.length; i++) {
+              const _item = data.list[i]
+              _item.no = no + i + 1
+            }
+          }
+          this.spinning = false
+          return data
+        })
+      }
+    }
+  },
+  methods: {
+    handleBack () {
+      this.$router.go(-1)
+    },
+    //  时间  change
+    dateChange (date) {
+      this.queryParam.beginDate = date[0]
+      this.queryParam.endDate = date[1]
+    },
+    //  时间  change
+    orderDateChange (date) {
+      this.queryParam.beginDate = date[0]
+      this.queryParam.endDate = date[1]
+    },
+    // 经销商 change
+    dealerChange (obj) {
+      this.queryParam.dealerSn = obj.key || undefined
+    },
+    // 汽车修理厂 change
+    storeChange (obj) {
+      this.queryParam.storeSn = obj.key || undefined
+    },
+    // 重置
+    reset () {
+      this.queryParam = {
+        shelfName: '',
+        state: undefined
+      }
+      this.$refs.dealerList.resetForm()
+      this.$refs.storeList.resetForm()
+      this.$refs.table.refresh(true)
+    },
+    pageInit () {
+      const _this = this
+      this.$nextTick(() => { // 页面渲染完成后的回调
+        _this.setTableH()
+      })
+    },
+    setTableH () {
+      const tableSearchH = this.$refs.tableSearch.offsetHeight
+      this.tableHeight = window.innerHeight - tableSearchH - 255
+    }
+  },
+  watch: {
+    advanced (newValue, oldValue) {
+      const _this = this
+      this.$nextTick(() => { // 页面渲染完成后的回调
+        _this.setTableH()
+      })
+    },
+    '$store.state.app.winHeight' (newValue, oldValue) { //  窗口变更时,需同时更改表格高度
+      this.setTableH()
+    }
+  },
+  mounted () {
+    if (!this.$store.state.app.isNewTab) { // 页签刷新时调用
+      this.pageInit()
+      this.reset()
+    }
+  },
+  activated () {
+    // 如果是新页签打开,则重置当前页面
+    if (this.$store.state.app.isNewTab) {
+      this.pageInit()
+      this.reset()
+    }
+  }
+}
+</script>
+<style lang="less">
+  .activeuser-baseInfo{
+    .activeuser-back{
+      margin-bottom: 6px;
+    }
+    .gard-box{
+      display: flex;
+      > div{
+        width: 20%;
+        padding:0 10px;
+        .ant-card-body{
+          > h4,p{
+            text-align: center;
+          }
+          > h4{
+            font-size: 18px;
+            margin: 0 0 5px;
+          }
+          > div{
+            > div{
+              display: flex;
+              align-items: center;
+              justify-content: space-between;
+              padding: 2px 0;
+              > span{
+                &:first-child{
+                  color:#999;
+                }
+              }
+            }
+          }
+        }
+      }
+    }
+  }
+</style>

+ 161 - 0
src/views/dataStatistics/userAnalysis/list.vue

@@ -0,0 +1,161 @@
+<template>
+  <a-card size="small" :bordered="false">
+    <div class="s-list">
+      <div class="s-row">
+        <div class="c-1">
+          <div>
+            <span>75%</span>
+            <span>转化率 ◕</span>
+          </div>
+        </div>
+        <div class="c-2">
+          <img src="@/assets/s1.png"></img>
+          <div class="text">
+            <div>注册用户</div>
+            <div>1800个</div>
+          </div>
+        </div>
+        <div class="c-3">
+          ● 只要登录过修配易码通就算注册用户。
+        </div>
+        <div class="c-4">
+          <a-button type="link" class="button-info" @click="toPage('registeredUser')">查看详情></a-button>
+        </div>
+      </div>
+      <div class="s-row">
+        <div class="c-1">
+          <div>
+            <span>75%</span>
+            <span>转化率 ◕</span>
+          </div>
+        </div>
+        <div class="c-2">
+          <img src="@/assets/s2.png"></img>
+          <div class="text">
+            <div>使用用户</div>
+            <div>802个/450家门店</div>
+          </div>
+        </div>
+        <div class="c-3">
+          <p>● 注册用户中,数字货架汽修店的员工定义为使用用户</p>
+          <p>● 如果一个汽修店-共有5位员工,会算做5个使用用户,1家门店</p>
+        </div>
+        <div class="c-4">
+          <a-button type="link" class="button-info" @click="toPage('usedUser')">查看详情></a-button>
+        </div>
+      </div>
+      <div class="s-row">
+        <div class="c-1"></div>
+        <div class="c-2">
+          <img src="@/assets/s3.png"></img>
+          <div class="text">
+            <div>活跃用户</div>
+            <div>1012个/450家门店</div>
+          </div>
+        </div>
+        <div class="c-3">
+          <p>● 使用用户中,最近30天内,有产生货架订单的汽修店定义为活跃门店</p>
+          <p>● 这些活跃门店的员工为活跃用户</p>
+        </div>
+        <div class="c-4">
+          <a-button type="link" class="button-info" @click="toPage('activeUser')">查看详情></a-button>
+        </div>
+      </div>
+    </div>
+  </a-card>
+</template>
+
+<script>
+export default {
+  data () {
+    return {
+
+    }
+  },
+  methods: {
+    toPage (name) {
+      this.$router.push({ name })
+    }
+  }
+}
+</script>
+
+<style lang="less">
+  .s-list{
+    height: calc(100vh - 135px);
+    .s-row{
+      display: flex;
+      align-items:center;
+      &:first-child{
+        margin-top: 50px;
+      }
+      &:last-child{
+        > div{
+          border: 0;
+        }
+      }
+      > div{
+        height: 96px;
+        display: flex;
+        flex-direction: column;
+        justify-content: center;
+      }
+      .c-1{
+        width: 20%;
+        position: relative;
+        > div{
+          position: absolute;
+          bottom: -18px;
+          right: 20px;
+          display: flex;
+          align-items:center;
+          > span{
+            &:first-child{
+              font-size: 24px;
+              margin-right: 20px;
+            }
+            &:last-child{
+              font-size: 16px;
+              color: #999;
+            }
+          }
+        }
+      }
+      .c-2{
+        width: 374px;
+        position: relative;
+        img{
+          width:100%;
+          height: 96px;
+        }
+        .text{
+          position: absolute;
+          left:0;
+          top:0;
+          width:100%;
+          display: flex;
+          align-items:center;
+          flex-direction: column;
+          height: 100%;
+          justify-content: center;
+          color: #fff;
+          font-size: 18px;
+        }
+      }
+      .c-3{
+        width: 40%;
+        color: #666;
+        border-bottom:1px dashed #d3cfcf;
+        padding: 0 30px;
+        font-size: 14px;
+        > p{
+          margin: 3px 0;
+        }
+      }
+      .c-4{
+        width: 10%;
+        border-bottom:1px dashed #d3cfcf;
+      }
+    }
+  }
+</style>

+ 218 - 0
src/views/dataStatistics/userAnalysis/registeredUser.vue

@@ -0,0 +1,218 @@
+<template>
+  <div class="registeredUser-baseInfo">
+    <a-page-header :ghost="false" title="注册用户" :backIcon="false" class="registeredUser-back">
+      <template slot="subTitle">
+        <a href="javascript:;" @click="handleBack" id="registeredUser-handleBack">
+          <a-icon type="left"></a-icon> 返回上页
+        </a>
+      </template>
+    </a-page-header>
+    <a-card size="small" :bordered="false">
+      <a-spin :spinning="spinning" tip="Loading...">
+        <div ref="tableSearch" class="table-page-search-wrapper">
+          <a-form layout="inline" @keyup.enter.native="$refs.table.refresh(true)">
+            <a-row :gutter="15">
+              <a-col :md="5" :sm="24">
+                <a-form-item label="注册时间">
+                  <rangeDate ref="rangeDate" :value="time" @change="dateChange" />
+                </a-form-item>
+              </a-col>
+              <a-col :md="5" :sm="24">
+                <a-form-item label="手机号码">
+                  <a-input id="registeredUser-mobile" v-model.trim="queryParam.mobile" allowClear placeholder="请输入手机号码"/>
+                </a-form-item>
+              </a-col>
+              <a-col :md="4" :sm="24">
+                <a-form-item label="用户类型">
+                  <v-select id="registeredUser-userType" code="BOND_RECORD_STATE" v-model="queryParam.userType" allowClear placeholder="请选择用户类型"></v-select>
+                </a-form-item>
+              </a-col>
+              <a-col :md="5" :sm="24">
+                <a-form-item label="汽车修理厂">
+                  <storeList ref="storeList" @change="storeChange" id="registeredUser-storeChange"></storeList>
+                </a-form-item>
+              </a-col>
+              <template v-if="advanced">
+                <a-col :md="4" :sm="24">
+                  <a-form-item label="职位">
+                    <v-select id="registeredUser-position" code="BOND_RECORD_STATE" v-model="queryParam.position" allowClear placeholder="请选择职位"></v-select>
+                  </a-form-item>
+                </a-col>
+                <a-col :md="5" :sm="24">
+                  <a-form-item label="配件经销商">
+                    <dealerList ref="dealerList" @change="dealerChange" id="registeredUser-dealerChange"></dealerList>
+                  </a-form-item>
+                </a-col>
+              </template>
+              <a-col :md="4" :sm="24" style="margin-bottom: 10px;">
+                <a-button type="primary" @click="$refs.table.refresh(true)" id="registeredUser-refresh">查询</a-button>
+                <a-button type="" @click="reset" style="margin-left: 10px;" id="registeredUser-reset">重置</a-button>
+                <a @click="advanced=!advanced" style="margin-left: 8px">
+                  {{ advanced ? '收起' : '展开' }}
+                  <a-icon :type="advanced ? 'up' : 'down'"/>
+                </a>
+              </a-col>
+            </a-row>
+          </a-form>
+        </div>
+        <div class="table-operator">
+          <a-alert type="info">
+            <div slot="message" class="total-bar">
+              <div>
+                用户数量:<strong>399</strong>;
+                累计vin扫描次数合计:<strong>26545</strong>;
+              </div>
+            </div>
+          </a-alert>
+        </div>
+        <s-table
+          class="sTable fixPagination"
+          ref="table"
+          :style="{ height: tableHeight+84.5+'px', wordBreak: 'break-all' }"
+          size="small"
+          rowKey="id"
+          :columns="columns"
+          :data="loadData"
+          :scroll="{ y: tableHeight }"
+          :defaultLoadData="false"
+          bordered>
+          <span slot="customTitle">
+            <a-popover>
+              <template slot="content">
+                表示以用户身份的vin扫描次数,<br>而不是用户所在门店的vin扫描次数
+              </template>
+              <a-icon type="question-circle" theme="twoTone" />
+            </a-popover>
+            累计vin扫描次数
+          </span>
+        </s-table>
+      </a-spin>
+    </a-card>
+  </div>
+</template>
+
+<script>
+import { STable, VSelect } from '@/components'
+import rangeDate from '@/views/common/rangeDate.vue'
+import { bondRecordByPage } from '@/api/boundRecord.js'
+import dealerList from '@/views/common/dealerList.vue'
+import storeList from '@/views/common/storeList.vue'
+import { toThousands } from '@/libs/tools.js'
+export default {
+  name: 'UserList',
+  components: { STable, VSelect, rangeDate, dealerList, storeList },
+  data () {
+    return {
+      spinning: false,
+      advanced: false,
+      tableHeight: 0,
+      time: [],
+      // 查询参数
+      queryParam: {
+        shelfName: '',
+        state: undefined
+      },
+      showModal: false,
+      itemData: null, // 编辑行数据
+      openStatusModal: false, // 货架状态弹窗初始状态
+      // 表头
+      columns: [
+        { title: '序号', dataIndex: 'no', width: '5%', align: 'center' },
+        { title: '注册时间', dataIndex: 'createDate', width: '15%', align: 'left', customRender: function (text) { return text || '--' } },
+        { title: '手机号码', dataIndex: 'stateDictValue', width: '10%', align: 'center', customRender: function (text) { return text || '--' } },
+        { title: '用户类型', dataIndex: 'createDate', width: '10%', align: 'center', customRender: function (text) { return text || '--' } },
+        { title: '汽车修理厂', dataIndex: 'storeName', width: '20%', align: 'left', customRender: function (text) { return text || '--' }, ellipsis: true },
+        { title: '职位', dataIndex: 'createDate', width: '10%', align: 'center', customRender: function (text) { return text || '--' } },
+        { title: '配件经销商', dataIndex: 'dealerName', width: '20%', align: 'left', customRender: function (text) { return text || '--' }, ellipsis: true },
+        { slots: { title: 'customTitle' }, dataIndex: 'bondAmount', width: '10%', align: 'right', customRender: function (text) { return toThousands(text, 2) || '--' }, sorter: true }
+      ],
+      // 加载数据方法 必须为 Promise 对象
+      loadData: parameter => {
+        this.spinning = true
+        return bondRecordByPage(Object.assign(parameter, this.queryParam)).then(res => {
+          let data
+          if (res.status == 200) {
+            data = res.data
+            const no = (data.pageNo - 1) * data.pageSize
+            for (let i = 0; i < data.list.length; i++) {
+              const _item = data.list[i]
+              _item.no = no + i + 1
+            }
+          }
+          this.spinning = false
+          return data
+        })
+      }
+    }
+  },
+  methods: {
+    handleBack () {
+      this.$router.go(-1)
+    },
+    //  时间  change
+    dateChange (date) {
+      this.queryParam.beginDate = date[0]
+      this.queryParam.endDate = date[1]
+    },
+    // 经销商 change
+    dealerChange (obj) {
+      this.queryParam.dealerSn = obj.key || undefined
+    },
+    // 汽车修理厂 change
+    storeChange (obj) {
+      this.queryParam.storeSn = obj.key || undefined
+    },
+    // 重置
+    reset () {
+      this.queryParam = {
+        shelfName: '',
+        state: undefined
+      }
+      this.$refs.dealerList.resetForm()
+      this.$refs.storeList.resetForm()
+      this.$refs.table.refresh(true)
+    },
+    pageInit () {
+      const _this = this
+      this.$nextTick(() => { // 页面渲染完成后的回调
+        _this.setTableH()
+      })
+    },
+    setTableH () {
+      const tableSearchH = this.$refs.tableSearch.offsetHeight
+      this.tableHeight = window.innerHeight - tableSearchH - 255
+    }
+  },
+  watch: {
+    advanced (newValue, oldValue) {
+      const _this = this
+      this.$nextTick(() => { // 页面渲染完成后的回调
+        _this.setTableH()
+      })
+    },
+    '$store.state.app.winHeight' (newValue, oldValue) { //  窗口变更时,需同时更改表格高度
+      this.setTableH()
+    }
+  },
+  mounted () {
+    if (!this.$store.state.app.isNewTab) { // 页签刷新时调用
+      this.pageInit()
+      this.reset()
+    }
+  },
+  activated () {
+    // 如果是新页签打开,则重置当前页面
+    if (this.$store.state.app.isNewTab) {
+      this.pageInit()
+      this.reset()
+    }
+  }
+}
+</script>
+<style lang="less">
+  .registeredUser-baseInfo{
+    .registeredUser-back{
+      margin-bottom: 6px;
+    }
+  }
+</style>

+ 195 - 0
src/views/dataStatistics/userAnalysis/setModal.vue

@@ -0,0 +1,195 @@
+<template>
+  <div>
+    <a-modal
+      centered
+      wrapClassName="setModal-modal"
+      :footer="null"
+      :maskClosable="false"
+      :title="textTitle"
+      v-model="isshow"
+      @cancle="isshow=false"
+      :width="500">
+      <a-spin :spinning="spinning" tip="Loading...">
+        <a-form-model
+          id="setModal-form"
+          ref="ruleForm"
+          :model="form"
+          :rules="rules"
+        >
+          <div style="margin-bottom: 10px;text-align: center;">
+            <strong>近30天下单额</strong>
+          </div>
+          <a-form-model-item label="LV1" prop="lv1" :label-col="{span: 4}" :wrapper-col="{span: 18}">
+            <a-input-number style="width:80%;" v-model.trim="form.lv1" :precision="2" allowClear placeholder="请输入LV1下单额"/>
+            元以下
+          </a-form-model-item>
+          <a-form-model-item label="LV2" prop="lv2" :label-col="{span: 4}" :wrapper-col="{span: 18}">
+            <a-input-group style="width: 90%;" compact>
+              <a-input style="width: 43%; text-align: center;pointer-events: none; backgroundColor: #f8f8f8;color:#666;" disabled v-model.trim="form.lv1"/>
+              <a-input
+                style=" width: 12%; pointer-events: none; backgroundColor: #fff"
+                placeholder="至"
+                disabled
+              />
+              <a-input-number
+                :precision="2"
+                :min="form.lv1"
+                style="width: 43%; text-align: center"
+                v-model.trim="form.lv2"
+                allowClear
+                placeholder="请输入LV2下单额"/>
+            </a-input-group>
+            元
+          </a-form-model-item>
+          <a-form-model-item label="LV3" prop="lv3" :label-col="{span: 4}" :wrapper-col="{span: 18}">
+            <a-input-group style="width: 90%;" compact>
+              <a-input style=" width: 43%; text-align: center;pointer-events: none; backgroundColor: #f8f8f8;color:#666;" disabled v-model.trim="form.lv2"/>
+              <a-input
+                style=" width: 12%; pointer-events: none; backgroundColor: #fff"
+                placeholder="至"
+                disabled
+              />
+              <a-input-number
+                :precision="2"
+                :min="form.lv2"
+                style=" width: 43%; text-align: center"
+                v-model.trim="form.lv3"
+                allowClear
+                placeholder="请输入LV3下单额"/>
+            </a-input-group>
+            元
+          </a-form-model-item>
+          <a-form-model-item label="LV4" prop="lv4" :label-col="{span: 4}" :wrapper-col="{span: 18}">
+            <a-input-group style="width: 90%;" compact>
+              <a-input style=" width: 43%; text-align: center;pointer-events: none; backgroundColor: #f8f8f8;color:#666;" disabled v-model.trim="form.lv3"/>
+              <a-input
+                style=" width: 12%; pointer-events: none; backgroundColor: #fff"
+                placeholder="至"
+                disabled
+              />
+              <a-input-number
+                :precision="2"
+                :min="form.lv3"
+                style=" width: 43%; text-align: center"
+                v-model.trim="form.lv4"
+                allowClear
+                placeholder="请输入LV4下单额"/>
+            </a-input-group>
+            元
+          </a-form-model-item>
+          <a-form-model-item label="LV5" :label-col="{span: 4}" :wrapper-col="{span: 18}">
+            <a-input style="width: 80%; text-align: center;pointer-events: none; backgroundColor: #f8f8f8;color:#666;" disabled v-model.trim="form.lv4"/>
+            元以上
+          </a-form-model-item>
+
+          <a-form-model-item :label-col="{span: 0}" :wrapper-col="{span: 24}" style="text-align: center;">
+            <a-button type="primary" @click="handleSubmit()" :style="{ marginRight: '8px' }" id="setModal-handleSubmit">保存</a-button>
+            <a-button :style="{ marginLeft: '8px' }" @click="isshow=false" id="setModal-close">取消</a-button>
+          </a-form-model-item>
+        </a-form-model>
+      </a-spin>
+    </a-modal>
+  </div>
+</template>
+
+<script>
+import { saveHw, shelfHWDetail } from '@/api/shelf.js'
+export default {
+  name: 'AddHWModal',
+  props: {
+    openModal: {
+      type: Boolean,
+      default: false
+    },
+    shelfSn: {
+      type: [String, Number],
+      default: ''
+    },
+    nowData: {
+      type: Object,
+      default: function () {
+        return {}
+      }
+    }
+  },
+
+  data () {
+    return {
+      spinning: false,
+      isshow: this.openModal,
+      textTitle: '参数设置',
+      roleList: [],
+      pageInfo: null,
+      form: {
+        lv1: '',
+        lv2: '',
+        lv3: '',
+        lv4: ''
+      },
+      rules: {
+        lv1: [{ required: true, message: '请输入LV1下单金额', trigger: 'blur' }],
+        lv2: [{ required: true, message: '请输入LV2下单金额', trigger: 'blur' }],
+        lv3: [{ required: true, message: '请输入LV3下单金额', trigger: 'blur' }],
+        lv4: [{ required: true, message: '请输入LV4下单金额', trigger: 'blur' }]
+      }
+    }
+  },
+  methods: {
+    // 查询货位详情
+    getShelfHWDetail () {
+      this.spinning = true
+      shelfHWDetail({ shelfPlaceSn: this.nowData.shelfPlaceSn }).then(res => {
+        if (res.status == 200) {
+          this.form = Object.assign({}, res.data)
+        }
+        this.spinning = false
+      })
+    },
+    // 保存提交
+    handleSubmit () {
+      const _this = this
+      this.$refs.ruleForm.validate(valid => {
+        if (valid) {
+          const params = JSON.parse(JSON.stringify(_this.form))
+          params.shelfSn = _this.shelfSn ? _this.shelfSn : null
+          console.log(params.id, params.shelfSn, '------------编辑新增')
+          _this.spinning = true
+          saveHw(params).then(res => {
+            if (res.status == 200) {
+              _this.$message.success(res.message)
+              _this.$emit('refresh')
+              setTimeout(function () {
+                _this.isshow = false
+                _this.spinning = false
+              }, 300)
+            } else {
+              _this.spinning = false
+            }
+          })
+        } else {
+          console.log('error submit!!')
+          return false
+        }
+      })
+    }
+  },
+  watch: {
+    openModal (newValue, oldValue) {
+      this.isshow = newValue
+    },
+    isshow (newValue, oldValue) {
+      if (!newValue) {
+        this.$refs.ruleForm.resetFields()
+        this.form = {}
+        this.$emit('close')
+      } else {
+        if (this.nowData && this.nowData.id) { //  编辑
+          this.getShelfHWDetail()
+        }
+      }
+    }
+  }
+}
+</script>
+<style lang="less">
+</style>

+ 228 - 0
src/views/dataStatistics/userAnalysis/usedUser.vue

@@ -0,0 +1,228 @@
+<template>
+  <div class="userd-baseInfo">
+    <a-page-header :ghost="false" title="使用用户" :backIcon="false" class="userd-back">
+      <template slot="subTitle">
+        <a href="javascript:;" @click="handleBack" id="userd-handleBack">
+          <a-icon type="left"></a-icon> 返回上页
+        </a>
+      </template>
+    </a-page-header>
+    <a-card size="small" :bordered="false">
+      <a-spin :spinning="spinning" tip="Loading...">
+        <div ref="tableSearch" class="table-page-search-wrapper">
+          <a-form layout="inline" @keyup.enter.native="$refs.table.refresh(true)">
+            <a-row :gutter="15">
+              <a-col :md="5" :sm="24">
+                <a-form-item label="货架创建时间">
+                  <rangeDate ref="rangeDate" :value="time" @change="dateChange" />
+                </a-form-item>
+              </a-col>
+              <a-col :md="5" :sm="24">
+                <a-form-item label="汽车修理厂">
+                  <storeList ref="storeList" @change="storeChange" id="userd-storeChange"></storeList>
+                </a-form-item>
+              </a-col>
+              <a-col :md="5" :sm="24">
+                <a-form-item label="配件经销商">
+                  <dealerList ref="dealerList" @change="dealerChange" id="userd-dealerChange"></dealerList>
+                </a-form-item>
+              </a-col>
+              <a-col :md="4" :sm="24">
+                <a-form-item label="所在地">
+                  <areaList level="2" placeholder="请选择所在地"></areaList>
+                </a-form-item>
+              </a-col>
+              <template v-if="advanced">
+                <a-col :md="4" :sm="24">
+                  <a-form-item label="货架状态">
+                    <v-select id="userd-state" code="SHELF_STATE" v-model="queryParam.state" allowClear placeholder="请选择状态"></v-select>
+                  </a-form-item>
+                </a-col>
+                <a-col :md="5" :sm="24">
+                  <a-form-item label="最近下单时间">
+                    <rangeDate ref="orderDate" :value="orderTime" @change="orderDateChange" />
+                  </a-form-item>
+                </a-col>
+              </template>
+              <a-col :md="4" :sm="24" style="margin-bottom: 10px;">
+                <a-button type="primary" @click="$refs.table.refresh(true)" id="userd-refresh">查询</a-button>
+                <a-button type="" @click="reset" style="margin-left: 10px;" id="userd-reset">重置</a-button>
+                <a-button type="primary" class="button-warning" style="margin-left: 10px;" id="userd-reset">导出</a-button>
+                <a @click="advanced=!advanced" style="margin-left: 8px">
+                  {{ advanced ? '收起' : '展开' }}
+                  <a-icon :type="advanced ? 'up' : 'down'"/>
+                </a>
+              </a-col>
+            </a-row>
+          </a-form>
+        </div>
+        <div class="table-operator">
+          <a-alert type="info">
+            <div slot="message" class="total-bar">
+              <div>
+                门店数量:<strong>399</strong>;
+                铺货数量合计:<strong>399</strong>;
+                铺货金额合计:<strong>26545</strong>;
+              </div>
+            </div>
+          </a-alert>
+        </div>
+        <s-table
+          class="sTable fixPagination"
+          ref="table"
+          :style="{ height: tableHeight+84.5+'px', wordBreak: 'break-all' }"
+          size="small"
+          rowKey="id"
+          :columns="columns"
+          :data="loadData"
+          :scroll="{ y: tableHeight }"
+          :defaultLoadData="false"
+          bordered>
+          <span slot="customTitle">
+            <a-popover>
+              <template slot="content">
+                表示此修理厂最近一次从货架上取货的时间
+              </template>
+              <a-icon type="question-circle" theme="twoTone" />
+            </a-popover>
+            最近下单时间
+          </span>
+        </s-table>
+      </a-spin>
+    </a-card>
+  </div>
+</template>
+
+<script>
+import { STable, VSelect } from '@/components'
+import rangeDate from '@/views/common/rangeDate.vue'
+import { bondRecordByPage } from '@/api/boundRecord.js'
+import areaList from '@/views/common/areaList.js'
+import dealerList from '@/views/common/dealerList.vue'
+import storeList from '@/views/common/storeList.vue'
+import { toThousands } from '@/libs/tools.js'
+export default {
+  name: 'UserList',
+  components: { STable, VSelect, rangeDate, dealerList, storeList, areaList },
+  data () {
+    return {
+      spinning: false,
+      advanced: false,
+      tableHeight: 0,
+      time: [],
+      orderTime: [],
+      // 查询参数
+      queryParam: {
+        shelfName: '',
+        state: undefined
+      },
+      showModal: false,
+      itemData: null, // 编辑行数据
+      openStatusModal: false, // 货架状态弹窗初始状态
+      // 表头
+      columns: [
+        { title: '序号', dataIndex: 'no', width: '5%', align: 'center' },
+        { title: '货架创建时间', dataIndex: 'createDate', width: '10%', align: 'center', customRender: function (text) { return text || '--' } },
+        { title: '汽车修理厂', dataIndex: 'storeName', width: '15%', align: 'left', customRender: function (text) { return text || '--' }, ellipsis: true },
+        { title: '配件经销商', dataIndex: 'dealerName', width: '15%', align: 'left', customRender: function (text) { return text || '--' }, ellipsis: true },
+        { title: '所在地', dataIndex: 'createDate2', width: '11%', align: 'center', customRender: function (text) { return text || '--' } },
+        { title: '货架状态', dataIndex: 'stateDictValue', width: '11%', align: 'center', customRender: function (text) { return text || '--' } },
+        { title: '铺货数量', dataIndex: 'bondAmount', width: '11%', align: 'center', customRender: function (text) { return text && toThousands(text, 2) || '--' }, sorter: true },
+        { title: '铺货金额', dataIndex: 'bondAmount', width: '11%', align: 'center', customRender: function (text) { return text && toThousands(text, 2) || '--' }, sorter: true },
+        { slots: { title: 'customTitle' }, dataIndex: 'createDate', width: '11%', align: 'center', customRender: function (text) { return text || '--' } }
+      ],
+      // 加载数据方法 必须为 Promise 对象
+      loadData: parameter => {
+        this.spinning = true
+        return bondRecordByPage(Object.assign(parameter, this.queryParam)).then(res => {
+          let data
+          if (res.status == 200) {
+            data = res.data
+            const no = (data.pageNo - 1) * data.pageSize
+            for (let i = 0; i < data.list.length; i++) {
+              const _item = data.list[i]
+              _item.no = no + i + 1
+            }
+          }
+          this.spinning = false
+          return data
+        })
+      }
+    }
+  },
+  methods: {
+    handleBack () {
+      this.$router.go(-1)
+    },
+    //  时间  change
+    dateChange (date) {
+      this.queryParam.beginDate = date[0]
+      this.queryParam.endDate = date[1]
+    },
+    //  时间  change
+    orderDateChange (date) {
+      this.queryParam.beginDate = date[0]
+      this.queryParam.endDate = date[1]
+    },
+    // 经销商 change
+    dealerChange (obj) {
+      this.queryParam.dealerSn = obj.key || undefined
+    },
+    // 汽车修理厂 change
+    storeChange (obj) {
+      this.queryParam.storeSn = obj.key || undefined
+    },
+    // 重置
+    reset () {
+      this.queryParam = {
+        shelfName: '',
+        state: undefined
+      }
+      this.$refs.dealerList.resetForm()
+      this.$refs.storeList.resetForm()
+      this.$refs.table.refresh(true)
+    },
+    pageInit () {
+      const _this = this
+      this.$nextTick(() => { // 页面渲染完成后的回调
+        _this.setTableH()
+      })
+    },
+    setTableH () {
+      const tableSearchH = this.$refs.tableSearch.offsetHeight
+      this.tableHeight = window.innerHeight - tableSearchH - 255
+    }
+  },
+  watch: {
+    advanced (newValue, oldValue) {
+      const _this = this
+      this.$nextTick(() => { // 页面渲染完成后的回调
+        _this.setTableH()
+      })
+    },
+    '$store.state.app.winHeight' (newValue, oldValue) { //  窗口变更时,需同时更改表格高度
+      this.setTableH()
+    }
+  },
+  mounted () {
+    if (!this.$store.state.app.isNewTab) { // 页签刷新时调用
+      this.pageInit()
+      this.reset()
+    }
+  },
+  activated () {
+    // 如果是新页签打开,则重置当前页面
+    if (this.$store.state.app.isNewTab) {
+      this.pageInit()
+      this.reset()
+    }
+  }
+}
+</script>
+<style lang="less">
+  .userd-baseInfo{
+    .userd-back{
+      margin-bottom: 6px;
+    }
+  }
+</style>

+ 5 - 5
src/views/numsGoodsShelves/bondManagement/list.vue

@@ -4,23 +4,23 @@
       <div ref="tableSearch" class="table-page-search-wrapper">
         <a-form layout="inline" @keyup.enter.native="$refs.table.refresh(true)">
           <a-row :gutter="15">
-            <a-col :md="6" :sm="24">
+            <a-col :md="5" :sm="24">
               <a-form-item label="货架名称">
                 <a-input id="bondManagementList-shelfName" allowClear v-model.trim="queryParam.shelfName" placeholder="请输入货架名称"/>
               </a-form-item>
             </a-col>
-            <a-col :md="6" :sm="24">
+            <a-col :md="5" :sm="24">
               <a-form-item label="配件经销商">
                 <dealerList ref="dealerList" @change="dealerChange" id="bondManagementList-dealerChange"></dealerList>
               </a-form-item>
             </a-col>
-            <a-col :md="6" :sm="24">
+            <a-col :md="5" :sm="24">
               <a-form-item label="汽车修理厂">
                 <storeList ref="storeList" @change="storeChange" id="bondManagementList-storeChange"></storeList>
               </a-form-item>
             </a-col>
             <template v-if="advanced">
-              <a-col :md="6" :sm="24">
+              <a-col :md="5" :sm="24">
                 <a-form-item label="状态">
                   <v-select id="bondManagementList-state" code="BOND_RECORD_STATE" v-model="queryParam.state" allowClear placeholder="请选择状态"></v-select>
                 </a-form-item>
@@ -38,7 +38,7 @@
         </a-form>
       </div>
       <div class="table-operator">
-        <a-button size="small" type="primary" class="button-error" @click="handleEdit()" id="bondManagementList-handleEdit">新增保证金</a-button>
+        <a-button type="primary" class="button-error" @click="handleEdit()" id="bondManagementList-handleEdit">新增保证金</a-button>
       </div>
       <s-table
         class="sTable fixPagination"

+ 2 - 2
vue.config.js

@@ -108,8 +108,8 @@ const vueConfig = {
     // If you want to turn on the proxy, please remove the mockjs /src/main.jsL11
     proxy: {
       '/api': {
-        // target: 'http://p.xprh.360arrow.com/xprh-admin',
-        target: 'http://192.168.0.215:8701/xprh-admin',
+        target: 'http://p.xprh.360arrow.com/xprh-admin',
+        // target: 'http://192.168.0.215:8701/xprh-admin',
         // ws: false,
         ws: true,
         changeOrigin: true,