数据水感应数据看板处理

src/config/router.config.js

@@ -31,7 +31,7 @@ export const asyncRouterMap = [{
         component: () => import('@/views/home/Index'),
         meta: {
           title: '数据看板',
-          keepAlive: true,
+          keepAlive: false,
           icon: 'user',
           permission: ['home']
         }

src/views/home/Index.vue

@@ -3,16 +3,15 @@
 
     <!-- <a-col :lg="10" :md="24" :sm="24" :xl="8" :xxl="7">
       <UserInfo />
-    </a-col>
+    </a-col> -->
 
     <a-col :lg="24" :md="24" :sm="24" :xl="24" :xxl="24">
       <Count v-if="info!=={}" :info="info" />
-    </a-col> -->
-    <a-col :lg="24" :md="24" :sm="24" :xl="24" :xxl="24">
-      <!-- <Analysis /> -->
-      首页展示。。
     </a-col>
-
+    <!--
+    <a-col :lg="24" :md="24" :sm="24" :xl="24" :xxl="24">
+      <Analysis />
+    </a-col> -->
   </a-row>
 </template>
 

src/views/home/components/Analysis.vue

@@ -2,7 +2,7 @@
   <div>
     <a-row>
       <a-col :xl="12" :lg="24" :md="24" :sm="24" :xs="24">
-        <a-card class="antd-pro-pages-dashboard-analysis-salesCard" :loading="loading" :bordered="false" title="数据统计" :style="{ height: '100%' }">
+        <a-card class="antd-pro-pages-dashboard-analysis-salesCard" :loading="loading" :bordered="false" title="售卖数据管理" :style="{ height: '100%' }">
           <div slot="extra" style="height: inherit;">
             <span class="dashboard-analysis-iconGroup">
               <a-dropdown :trigger="['click']" placement="bottomLeft">
@@ -14,19 +14,25 @@
                   <a-menu-item>
                     <a href="javascript:;">当周</a>
                   </a-menu-item>
+                  <a-menu-item>
+                    <a href="javascript:;">当月</a>
+                  </a-menu-item>
+                  <a-menu-item>
+                    <a href="javascript:;">当年</a>
+                  </a-menu-item>
                 </a-menu>
               </a-dropdown>
             </span>
             <div class="analysis-salesTypeRadio">
               <a-radio-group defaultValue="a">
-                <a-radio-button value="a">当周</a-radio-button>
+                <a-radio-button value="a">当日</a-radio-button>
-                <a-radio-button value="b">当日</a-radio-button>
+                <a-radio-button value="b">当周</a-radio-button>
                 <a-radio-button value="c">当月</a-radio-button>
-                <a-radio-button value="c">当</a-radio-button>
+                <a-radio-button value="d">当年</a-radio-button>
               </a-radio-group>
             </div>
           </div>
-          <h4>副标题</h4>
+          <!-- <h4>副标题</h4> -->
           <div>
             <v-chart :force-fit="true" :height="405" :data="pieData" :scale="pieScale">
               <v-tooltip :showTitle="false" dataKey="item*percent" />
@@ -111,12 +117,10 @@ for (let i = 0; i < 50; i += 1) {
 const DataSet = require('@antv/data-set')
 
 const sourceData = [
-  { item: '家用电器', count: 32.2 },
+  { item: '代理进货金额', count: 32.2 },
-  { item: '食用酒水', count: 21 },
+  { item: '创客进货金额', count: 21 },
-  { item: '个护健康', count: 17 },
+  { item: '线上销售金额', count: 17 },
-  { item: '服饰箱包', count: 13 },
+  { item: '线下销售金额', count: 13 }
-  { item: '母婴产品', count: 9 },
-  { item: '其他', count: 7.8 }
 ]
 
 const pieScale = [{

src/views/home/components/Count.vue

@@ -1,54 +1,48 @@
 <template>
-  <a-row :gutter="[16,8]">
+  <a-row>
     <a-row :gutter="24">
-      <!-- 总成交额 -->
+      <!-- 分公司库存 -->
       <a-col
         :sm="24"
         :md="12"
         :xl="12"
-        :xxl="6"
+        :xxl="12"
-        :style="{ marginBottom: '24px' }"
+        :style="{ marginBottom: '10px' }"
         v-if="info.total">
-        <chart-card :loading="loading" :title="$t('总成交额')" :total="'￥'+info.total.total">
+        <chart-card :loading="loading" :title="$t('分公司总库存')" :total="'￥'+info.total.total">
-          <a-tooltip :title="$t('总成交额统计')" slot="action">
+          <a-tooltip :title="$t('总分公司总库存')" slot="action">
             <a-icon type="info-circle-o" />
           </a-tooltip>
-          <div>
+          <template slot="footer">
-            <trend flag="up" style="margin-right: 16px;">
+            <!-- <span> {{ info.total.people }}瓶</span> -->
-              <span slot="term">{{ $t('注册实名率') }}</span>
+            <trend flag="up"> <span slot="term">{{ $t('线上库存') }}</span>321瓶</trend>
-              100%
+            <trend flag="down" style="margin-left: 20px;">
+              <span slot="term">{{ $t('线下库存') }}</span>1234瓶
             </trend>
-            <trend flag="down">
-              <span slot="term">{{ $t('下单率') }}</span>
-              100%
-            </trend>
-          </div>
-          <template slot="footer">{{ $t('注册人数 ') }}
-            <span> {{ info.total.people }}人</span>
           </template>
         </chart-card>
       </a-col>
-      <!-- 用户总人数 -->
+      <!-- 经销商总库存 -->
       <a-col
         :sm="24"
         :md="12"
         :xl="12"
-        :xxl="6"
+        :xxl="12"
-        :style="{ marginBottom: '24px' }"
+        :style="{ marginBottom: '10px' }"
         v-if="info.people"
       >
-        <chart-card :loading="loading" :title="$t('分配用户总数')" :total="info.people.total | NumberFormat">
+        <chart-card :loading="loading" :title="$t('经销商总库存')" :total="info.people.total | NumberFormat">
-          <a-tooltip :title="$t('总用户数量与成交单数量进行比对')" slot="action">
+          <a-tooltip :title="$t('经销商总库存')" slot="action">
             <a-icon type="info-circle-o" />
           </a-tooltip>
           <div>
             <mini-area :data="info.people.charts" />
           </div>
-          <template slot="footer">{{ $t('成交订单总数') }}<span style="margin-right:20px;"> {{ info.people.count | NumberFormat }}</span></template>
+          <template slot="footer">{{ $t('经销商总数') }}<span style="margin-right:20px;"> {{ info.people.count | NumberFormat }} 人</span></template>
         </chart-card>
       </a-col>
       <!-- 日成交额 -->
-      <a-col
+      <!-- <a-col
         :sm="24"
         :md="12"
         :xl="12"
@@ -70,9 +64,9 @@
             </trend>
           </template>
         </chart-card>
-      </a-col>
+      </a-col> -->
       <!-- 订单进行比例 -->
-      <a-col :sm="24" :md="12" :xl="12" :xxl="6" :style="{ marginBottom: '24px' }">
+      <!-- <a-col :sm="24" :md="12" :xl="12" :xxl="6" :style="{ marginBottom: '24px' }">
         <chart-card :loading="loading" :title="$t('订单进度比例')" :total="info.process">
           <a-tooltip :title="$t('订单进度比例包含未完成已完成订单的比例')" slot="action">
             <a-icon type="info-circle-o" />
@@ -91,57 +85,83 @@
             </trend>
           </template>
         </chart-card>
-      </a-col>
+      </a-col> -->
     </a-row>
 
-    <a-col :span="24" v-if="info.check">
+    <a-col :span="24">
-      <a-card :bordered="false" title="我的待办">
+      <a-card :bordered="false" title="用户数据">
+        <template #extra>
+          <a-dropdown v-model="visible">
+            <a class="ant-dropdown-link" @click="e => e.preventDefault()">{{ searchs[typeIndex].title }} <a-icon type="down" /></a>
+            <a-menu slot="overlay" @click="handleMenuClick">
+              <a-menu-item
+                v-for="item in searchs"
+                :key="item.key">
+                <a href="javascript:;">{{ item.title }}</a>
+              </a-menu-item>
+            </a-menu>
+          </a-dropdown>
+        </template>
         <a-row>
-          <a-col :sm="8" :xs="24">
+          <a-col :sm="24" :md="12" :xl="8" :xxl="8" class="mt20">
-            <info title="待初审" :value="info.check.first+''" :bordered="true" />
+            <info title="用户总数量(人)" :value="info.check.first+''" :bordered="true" />
           </a-col>
-          <a-col :sm="8" :xs="24">
+          <a-col :sm="24" :md="12" :xl="8" :xxl="8" class="mt20">
-            <info title="待复审" :value="info.check.recheck+''" :bordered="true" />
+            <info title="新增代理数(人)" :value="info.check.recheck+''" :bordered="true" />
           </a-col>
-          <a-col :sm="8" :xs="24">
+          <a-col :sm="24" :md="12" :xl="8" :xxl="8" class="mt20">
-            <info title="待签收资料" :value="info.check.unsign+''" />
+            <info title="新增创客数(人)" :value="info.check.unsign+''" />
+          </a-col>
+          <a-col :sm="24" :md="12" :xl="8" :xxl="8" class="mt20">
+            <info title="新增VIP数(人)" :value="info.check.unsign+''" :bordered="true"/>
+          </a-col>
+          <a-col :sm="24" :md="12" :xl="8" :xxl="8" class="mt20">
+            <info title="新增游客数量(人)" :value="info.check.unsign+''"/>
           </a-col>
         </a-row>
       </a-card>
     </a-col>
     <a-col :span="24" v-if="info.init">
-      <a-card :bordered="false" title="已指派订单">
+      <a-card :bordered="false" title="累计销售数量">
         <a-row>
-          <a-col :sm="8" :xs="24">
+          <a-col :sm="24" :md="12" :xl="8" :xxl="8" class="mt20">
-            <info title="待支付咨询费" :value="info.init.init+''" :bordered="true" />
+            <info title="线上销售数量(瓶)" :value="info.init.apply+''" :bordered="true" />
           </a-col>
-          <a-col :sm="8" :xs="24">
+          <a-col :sm="24" :md="12" :xl="8" :xxl="8" class="mt20">
-            <info title="待补充资料" :value="info.init.apply+''" :bordered="true" />
+            <info title="线上零售数量(瓶)" :value="info.init.base+''" :bordered="true"/>
           </a-col>
-          <a-col :sm="8" :xs="24">
+          <a-col :sm="24" :md="12" :xl="8" :xxl="8" class="mt20">
-            <info title="本周申请总数" :value="info.init.base+''" />
+            <info title="线上代理进货数量(瓶)" :value="info.init.base+''"/>
+          </a-col>
+          <a-col :sm="24" :md="12" :xl="8" :xxl="8" class="mt20">
+            <info title="线上创客进货数量(瓶)" :value="info.init.base+''" :bordered="true"/>
+          </a-col>
+          <a-col :sm="24" :md="12" :xl="8" :xxl="8" class="mt20">
+            <info title="线下出货数量(瓶)" :value="info.init.init+''" />
           </a-col>
         </a-row>
       </a-card>
     </a-col>
-
     <a-col :span="24" v-if="info.b_check">
-      <a-card :bordered="false" title="初审业务操作">
+      <a-card :bordered="false" title="售卖数据管理">
         <a-row>
-          <a-col :sm="8" :xs="24">
+          <a-col :sm="24" :md="12" :xl="6" :xxl="6" class="mt20">
-            <info title="本周初审订单" :value="info.b_check.process+''" :bordered="true" />
+            <info title="代理进货金额(元)" :value="info.b_check.process+''" :bordered="true"/>
           </a-col>
-          <a-col :sm="8" :xs="24">
+          <a-col :sm="24" :md="12" :xl="6" :xxl="6" class="mt20">
-            <info title="本周通过数" :value="info.b_check.pass+''" :bordered="true" />
+            <info title="创客进货金额(元)" :value="info.b_check.pass+''" :bordered="true"/>
           </a-col>
-          <a-col :sm="8" :xs="24">
+          <a-col :sm="24" :md="12" :xl="6" :xxl="6" class="mt20">
-            <info title="本周补差价数" :value="info.b_check.diff+''" />
+            <info title="线上销售金额(元)" :value="info.b_check.diff+''" :bordered="true"/>
+          </a-col>
+          <a-col :sm="24" :md="12" :xl="6" :xxl="6" class="mt20">
+            <info title="线下销售金额(元)" :value="info.b_check.diff+''" />
           </a-col>
         </a-row>
       </a-card>
     </a-col>
 
-    <a-col :span="24" v-if="info.b_recheck">
+    <!-- <a-col :span="24" v-if="info.b_recheck">
       <a-card :bordered="false" title="复审业务操作">
         <a-row>
           <a-col :sm="8" :xs="24">
@@ -155,7 +175,7 @@
           </a-col>
         </a-row>
       </a-card>
-    </a-col>
+    </a-col> -->
 
   </a-row>
 </template>
@@ -197,14 +217,34 @@ export default {
   },
   name: 'Count',
   data: () => ({
-    loading: false
+    visible: false,
+    loading: false,
+    type: 'today',
+    typeIndex: 0,
+    searchs: [
+      { key: 'today', title: '本日' },
+      { key: 'week', title: '本周' },
+      { key: 'month', title: '本月' },
+      { key: 'year', title: '本年' }
+    ]
   }),
-  beforeCreate () {},
+  beforeCreate () {
-  methods: {}
+    console.log('beforeCreate.......')
+  },
+  methods: {
+    handleMenuClick (e) {
+      this.typeIndex = this.searchs.findIndex(item => item.key === e.key)
+      console.log(e.key)
+      this.visible = false
+      this.type = e.key
+    }
+  }
 }
 </script>
 
 <style lang='less' scoped>
 @import '../Index.less';
-
+.mt20{
+  margin-top: 30px;
+}
 </style>

src/views/permissions/Index.vue

@@ -199,10 +199,11 @@ export default {
     methods: {
         // 获取当前用户的组织
         staffDeparts () {
+            this.loading = true
             staffDeparts().then(res => {
                 console.log(res)
-                this.loading = true
                 this.promissions = res
+                this.loading = true
                 if (res.length > 0) {
                     this.departs = [{ key: '', title: '全部角色' }, ...res[0].departs]
                 }