首页增加提示类tab,B类指标页优化,我的-增加业务员日常工作统计

src/App.vue

@@ -38,7 +38,7 @@ export default {
           watermark_alpha: 0.1,
         });
         // 获取移动端获取用户信息接口
-        store.dispatch('getUserInfo').then(() => {});
+        // store.dispatch('getUserInfo').then(() => {});
       }
     }, 1000);
   },

src/api/index.js

@@ -825,3 +825,12 @@ export function getMobileUserInfo(query) {
     params: query,
   });
 }
+
+// 各部门未拜访门店数量
+export function selectNoVisitsInfo(query) {
+  return request({
+    url: 'mobile/storeStatistics/selectNoVisitsInfo',
+    method: 'get',
+    params: query,
+  });
+}

src/router/index.js

@@ -1,390 +1,403 @@
-import Vue from "vue";
-import VueRouter from "vue-router";
-import layout from "@/layout/index.vue";
+import Vue from 'vue';
+import VueRouter from 'vue-router';
+import layout from '@/layout/index.vue';
 
 const originalPush = VueRouter.prototype.push;
 VueRouter.prototype.push = function push(location) {
-    return originalPush.call(this, location).catch(err => err);
+  return originalPush.call(this, location).catch((err) => err);
 };
 Vue.use(VueRouter);
 const router = new VueRouter({
-    // mode:"history",
-    // mode:process.env.NODE_ENV !==
-    // "production" ? "hash" : "history",
-    mode:"history",
-    scrollBehavior(to, from, savedPosition) {
-      if (savedPosition) {
-        return savedPosition;
-      } else {
-        return { x: 0, y: 0 };
-      }
+  // mode:"history",
+  // mode:process.env.NODE_ENV !==
+  // "production" ? "hash" : "history",
+  mode: 'history',
+  scrollBehavior(to, from, savedPosition) {
+    if (savedPosition) {
+      return savedPosition;
+    } else {
+      return { x: 0, y: 0 };
+    }
+  },
+  base: '/mobile/',
+  routes: [
+    {
+      path: '/',
+      component: layout,
+      redirect: '/home',
+      children: [
+        {
+          path: '/home',
+          name: 'home',
+          component: () => import('@/views/home/index.vue'),
+        },
+        {
+          path: '/reportingRate',
+          name: 'reportingRate',
+          component: () => import('@/views/home/reportingRate.vue'),
+        },
+        {
+          path: '/err',
+          name: 'err',
+          component: () => import('@/views/home/err.vue'),
+        },
+        {
+          path: '/login',
+          name: 'login',
+          component: () => import('@/views/home/login.vue'),
+        },
+        {
+          path: '/clew',
+          name: 'clew',
+          component: () => import('@/views/clew/index.vue'),
+        },
+        {
+          path: '/clewent',
+          name: 'clew',
+          component: () => import('@/views/clew/clewent.vue'),
+        },
+        // {
+        //     path: "/logincs",
+        //     name: "logincs",
+        //     component: () => import("@/views/home/logincs.vue")
+        // },
+        {
+          path: '/noVIsit',
+          name: 'noVIsit',
+          meta: { title: '未拜访门店' },
+          component: () => import('@/views/home/hintTabPage/noVIsit.vue'),
+        },
+        {
+          path: '/hintDetail',
+          name: 'hintDetail',
+          meta: { title: '提示类-拜访（实时） ' },
+          component: () => import('@/views/home/hintTabPage/hintDetail.vue'),
+        },
+      ],
     },
-    base: '/mobile/',
-    routes: [
-        {
-            path: "/",
-            component: layout,
-            redirect: "/home",
-            children: [
-                {
-                    path: "/home",
-                    name: "home",
-                    component: () => import("@/views/home/index.vue")
-                },
-                {
-                    path: "/reportingRate",
-                    name: "reportingRate",
-                    component: () => import("@/views/home/reportingRate.vue")
-                },
-                {
-                    path: "/err",
-                    name: "err",
-                    component: () => import("@/views/home/err.vue")
-                },
-                {
-                    path: "/login",
-                    name: "login",
-                    component: () => import("@/views/home/login.vue")
-                },
-                {
-                    path: "/clew",
-                    name: "clew",
-                    component: () => import("@/views/clew/index.vue")
-                },
-                {
-                    path: "/clewent",
-                    name: "clew",
-                    component: () => import("@/views/clew/clewent.vue")
-                },
-                // {
-                //     path: "/logincs",
-                //     name: "logincs",
-                //     component: () => import("@/views/home/logincs.vue")
-                // }
-            ]
-        },
-        {
-            path: "/storemanagementlist",
-            component: layout,
-            redirect: "/storemanagement/index",
-            children: [
-                {
-                    path: "/storemanagement/index",
-                    name: "storeManagement",
-                    component: () => import("@/views/storeManagement/index.vue")
-                },
-                {
-                    path: "/storeDetail",
-                    name: "storeDetail",
-                    component: () => import("@/views/storeManagement/storeDetail.vue")
-                },
-                {
-                    path: "/storeAdd",
-                    name: "storeAdd",
-                    component: () => import("@/views/storeManagement/storeAdd.vue")
-                },
-                {
-                    path: "/storeAddress",
-                    name: "storeAddress",
-                    component: () => import("@/views/storeManagement/storeAddress.vue")
-                },
-                {
-                    path: "/odersuccess",
-                    name: "storeAdd",
-                    component: () => import("@/views/deviceOutside/oderSuccess.vue")
-                },
-                {
-                    path: "/storeEdit",
-                    name: "storeEdit",
-                    component: () => import("@/views/storeManagement/storeEdit.vue")
-                },
-                {
-                    path: "/success",
-                    name: "success",
-                    component: () => import("@/views/storeManagement/success.vue")
-                }
-            ]
-        },
-        {
-            path: "/outsidelist",
-            component: layout,
-            redirect: "/outsidelist/index",
-            children: [
-                {
-                    path: "/outsidelist/index",
-                    name: "outsidelist",
-                    component: () => import("@/views/deviceOutside/index.vue")
-                },
-                {
-                    path: "/ai",
-                    name: "ai",
-                    component: () => import("@/views/intelligence/index.vue")
-                },
-                {
-                    path: "/topStore",
-                    name: "topStore",
-                    component: () => import("@/views/deviceOutside/topStore.vue")
-                },
-                {
-                    path: "/pItem",
-                    name: "pItem",
-                    component: () => import("@/views/deviceOutside/productItem.vue")
-                },
-                {
-                    path: "/suishenbangOutstoreVisit",
-                    name: "suishenbangOutstoreVisit",
-                    component: () => import("@/views/deviceOutside/suishenbangOutstoreVisit.vue")
-                },
-                {
-                    path: "/projectOut",
-                    name: "projectOut",
-                    component: () => import("@/views/deviceOutside/projectOut.vue")
-                },
-                {
-                    path: "/rangeStore",
-                    name: "rangeStore",
-                    component: () => import("@/views/deviceOutside/rangeStore.vue")
-                },
-                {
-                    path: "/outstoreVisit",
-                    name: "outstoreVisit",
-                    component: () => import("@/views/deviceOutside/outstoreVisit.vue")
-                },
-                {
-                    path: "/taskList",
-                    name: "taskList",
-                    component: () => import("@/views/deviceOutside/taskList.vue")
-                },
-                {
-                    path: "/storeGroup",
-                    name: "storeGroup",
-                    component: () => import("@/views/deviceOutside/storeGroup.vue")
-                },
-                {
-                    path: "/outabnormalVisit",
-                    name: "outabnormalVisit",
-                    component: () => import("@/views/deviceOutside/outabnormalVisit.vue")
-                }
-            ]
-        },
-        {
-            path: "/historicalVisit",
-            component: layout,
-            redirect: "/historicalVisit/index",
-            children: [
-                {
-                    path: "/historicalVisit/index",
-                    name: "historicalVisit",
-                    component: () => import("@/views/historicalVisit/index.vue")
-                },
-                {
-                    path: "/historAllVisit",
-                    name: "historAllVisit",
-                    component: () => import("@/views/historicalVisit/historAllVisit.vue")
-                },
-
-                {
-                    path: "/historicalDetails",
-                    name: "historicalDetails",
-                    component: () => import("@/views/historicalVisit/historicalDetails.vue")
-                },
-                {
-                    path: "/historiStoreVisit",
-                    name: "historiStoreVisit",
-                    component: () => import("@/views/historicalVisit/hisvistdeils.vue")
-                }
-            ]
-        },
-        {
-            path: "/deviceWithin",
-            component: layout,
-            redirect: "/deviceWithin/index",
-            children: [
-                {
-                    path: "/deviceWithin/index",
-                    name: "deviceWithin",
-                    component: () => import("@/views/deviceWithin/index.vue")
-                },
-                {
-                    path: "/storeVisitpage",
-                    name: "storeVisitpage",
-                    component: () => import("@/views/deviceWithin/storeVisit.vue")
-                },
-                {
-                    path: "/addStoreVisit",
-                    name: "addStoreVisit",
-                    component: () => import("@/views/deviceWithin/addStoreVisit.vue")
-                },
+    {
+      path: '/storemanagementlist',
+      component: layout,
+      redirect: '/storemanagement/index',
+      children: [
+        {
+          path: '/storemanagement/index',
+          name: 'storeManagement',
+          component: () => import('@/views/storeManagement/index.vue'),
+        },
+        {
+          path: '/storeDetail',
+          name: 'storeDetail',
+          component: () => import('@/views/storeManagement/storeDetail.vue'),
+        },
+        {
+          path: '/storeAdd',
+          name: 'storeAdd',
+          component: () => import('@/views/storeManagement/storeAdd.vue'),
+        },
+        {
+          path: '/storeAddress',
+          name: 'storeAddress',
+          component: () => import('@/views/storeManagement/storeAddress.vue'),
+        },
+        {
+          path: '/odersuccess',
+          name: 'storeAdd',
+          component: () => import('@/views/deviceOutside/oderSuccess.vue'),
+        },
+        {
+          path: '/storeEdit',
+          name: 'storeEdit',
+          component: () => import('@/views/storeManagement/storeEdit.vue'),
+        },
+        {
+          path: '/success',
+          name: 'success',
+          component: () => import('@/views/storeManagement/success.vue'),
+        },
+      ],
+    },
+    {
+      path: '/outsidelist',
+      component: layout,
+      redirect: '/outsidelist/index',
+      children: [
+        {
+          path: '/outsidelist/index',
+          name: 'outsidelist',
+          component: () => import('@/views/deviceOutside/index.vue'),
+        },
+        {
+          path: '/ai',
+          name: 'ai',
+          component: () => import('@/views/intelligence/index.vue'),
+        },
+        {
+          path: '/topStore',
+          name: 'topStore',
+          component: () => import('@/views/deviceOutside/topStore.vue'),
+        },
+        {
+          path: '/pItem',
+          name: 'pItem',
+          component: () => import('@/views/deviceOutside/productItem.vue'),
+        },
+        {
+          path: '/suishenbangOutstoreVisit',
+          name: 'suishenbangOutstoreVisit',
+          component: () => import('@/views/deviceOutside/suishenbangOutstoreVisit.vue'),
+        },
+        {
+          path: '/projectOut',
+          name: 'projectOut',
+          component: () => import('@/views/deviceOutside/projectOut.vue'),
+        },
+        {
+          path: '/rangeStore',
+          name: 'rangeStore',
+          component: () => import('@/views/deviceOutside/rangeStore.vue'),
+        },
+        {
+          path: '/outstoreVisit',
+          name: 'outstoreVisit',
+          component: () => import('@/views/deviceOutside/outstoreVisit.vue'),
+        },
+        {
+          path: '/taskList',
+          name: 'taskList',
+          component: () => import('@/views/deviceOutside/taskList.vue'),
+        },
+        {
+          path: '/storeGroup',
+          name: 'storeGroup',
+          component: () => import('@/views/deviceOutside/storeGroup.vue'),
+        },
+        {
+          path: '/outabnormalVisit',
+          name: 'outabnormalVisit',
+          component: () => import('@/views/deviceOutside/outabnormalVisit.vue'),
+        },
+      ],
+    },
+    {
+      path: '/historicalVisit',
+      component: layout,
+      redirect: '/historicalVisit/index',
+      children: [
+        {
+          path: '/historicalVisit/index',
+          name: 'historicalVisit',
+          component: () => import('@/views/historicalVisit/index.vue'),
+        },
+        {
+          path: '/historAllVisit',
+          name: 'historAllVisit',
+          component: () => import('@/views/historicalVisit/historAllVisit.vue'),
+        },
 
-                {
-                    path: "/addStoreVisitd",
-                    name: "addStoreVisitd",
-                    component: () => import("@/views/deviceWithin/addStoreVisitd.vue")
-                },
-                {
-                    path: "/addStoreVisitP",
-                    name: "addStoreVisitP",
-                    component: () => import("@/views/deviceWithin/addStoreVisitP.vue")
-                },
-                {
-                    path: "/abnormalVisit",
-                    name: "abnormalVisit",
-                    component: () => import("@/views/deviceWithin/abnormalVisit.vue")
-                }
-                ,
-                {
-                    path: "/sign",
-                    name: "sign",
-                    component: () => import("@/views/sign/index.vue")
-                } ,
-                {
-                    path: "/signApprovalList",
-                    name: "signApproval",
-                    component: () => import("@/views/signApproval/index.vue")
-                },
-                {
-                    path: "/signApproval",
-                    name: "signApproval",
-                    component: () => import("@/views/signApproval/signApproval.vue")
-                }
-            ]
+        {
+          path: '/historicalDetails',
+          name: 'historicalDetails',
+          component: () => import('@/views/historicalVisit/historicalDetails.vue'),
+        },
+        {
+          path: '/historiStoreVisit',
+          name: 'historiStoreVisit',
+          component: () => import('@/views/historicalVisit/hisvistdeils.vue'),
+        },
+      ],
+    },
+    {
+      path: '/deviceWithin',
+      component: layout,
+      redirect: '/deviceWithin/index',
+      children: [
+        {
+          path: '/deviceWithin/index',
+          name: 'deviceWithin',
+          component: () => import('@/views/deviceWithin/index.vue'),
+        },
+        {
+          path: '/storeVisitpage',
+          name: 'storeVisitpage',
+          component: () => import('@/views/deviceWithin/storeVisit.vue'),
+        },
+        {
+          path: '/addStoreVisit',
+          name: 'addStoreVisit',
+          component: () => import('@/views/deviceWithin/addStoreVisit.vue'),
         },
 
         {
-            path: "/My",
-            component: layout,
-            redirect: "/My/index",
-            children: [
-                {
-                    path: "/My/index",
-                    name: "MyList",
-                    component: () => import("@/views/week/index.vue")
-                },
-                {
-                    path: "/myInventory",
-                    name: "myInventory",
-                    component: () => import("@/views/my/myInventory.vue")
-                },
-                {
-                    path: "/material",
-                    name: "material",
-                    component: () => import("@/views/my/material.vue")
-                },
-                {
-                    path: "/subordinateHistoricalDaily",
-                    name: "subordinateHistoricalDaily",
-                    component: () => import("@/views/week/dailyHistorical.vue")
-                }, {
-                    path: "/subordinateHistoricalWeekly",
-                    name: "subordinateHistoricalWeekly",
-                    component: () => import("@/views/week/weeklyHistorical.vue")
-                }, {
-                    path: "/myHistoricalDaily",
-                    name: "myHistoricalDaily",
-                    component: () => import("@/views/week/myHistoricalDaily.vue")
-                },
-                {
-                    path: "/weeklyApproval",
-                    name: "weeklyApproval",
-                    component: () => import("@/views/week/weeklyApproval.vue")
-                },
-                {
-                    path: "/weeklyApprovalDetils",
-                    name: "weeklyApprovalDetils",
-                    component: () => import("@/views/week/weeklyApprovalDetils.vue")
-                },
-                {
-                    path: "/myComment",
-                    name: "myComment",
-                    component: () => import("@/views/week/myComment.vue")
-                },
-                {
-                    path: "/doubleWeeklyDetils",
-                    name: "doubleWeeklyDetils",
-                    component: () => import("@/views/week/doubleWeeklyDetils.vue")
-                },
-                {
-                    path: "/daily",
-                    name: "daily",
-                    component: () => import("@/views/week/daily.vue")
-                }, {
-                    path: "/dailyApprovalList",
-                    name: "dailyApprovalList",
-                    component: () => import("@/views/week/dailyApprovalList.vue")
-                },
-                {
-                    path: "/dailyApproval",
-                    name: "dailyApproval",
-                    component: () => import("@/views/week/dailyApproval.vue")
-                },
-                {
-                    path: "/dailyDetails",
-                    name: "dailyDetails",
-                    component: () => import("@/views/week/dailyDetails.vue")
-                },
-                {
-                    path: "/weeklyApproval",
-                    name: "weeklyApproval",
-                    component: () => import("@/views/week/weeklyApproval.vue")
-                },
-                {
-                    path: "/weekly",
-                    name: "weekly",
-                    component: () => import("@/views/week/weekly.vue")
-                },
-                {
-                    path: "/doubleWeekly",
-                    name: "doubleWeekly",
-                    component: () => import("@/views/week/doubleWeekly.vue")
-                },
-                {
-                    path: "/doubleWeeklyApproval",
-                    name: "doubleWeeklyApproval",
-                    component: () => import("@/views/week/doubleWeeklyApproval.vue")
-                },
-                {
-                    path: "/doubleWeeklyHistorical",
-                    name: "doubleWeeklyHistorical",
-                    component: () => import("@/views/week/doubleWeeklyHistorical.vue")
-                },
-                {
-                    path: "/dailyHistoricalDetails",
-                    name: "dailyHistoricalDetails",
-                    component: () => import("@/views/week/dailyHistoricalDetails.vue")
-                },
-                {
-                    path: "/doubleHistoricalWeeklyDetils",
-                    name: "doubleHistoricalWeeklyDetils",
-                    component: () => import("@/views/week/doubleHistoricalWeeklyDetils.vue")
-                },
-                {
-                    path: "/weeklyHistoricalDetils",
-                    name: "weeklyHistoricalDetils",
-                    component: () => import("@/views/week/weeklyHistoricalDetils.vue")
-                },
-                {
-                    path: "/VisitSummary",
-                    name: "VisitSummary",
-                    component: () => import("@/views/week/VisitSummary.vue")
-                },
-                {
-                    path: "/VisitSummaryMy",
-                    name: "VisitSummaryMy",
-                    component: () => import("@/views/week/VisitSummaryMy.vue")
-                },
-                {
-                    path: "/VisitSummaryAdd",
-                    name: "VisitSummaryAdd",
-                    component: () => import("@/views/week/VisitSummaryAdd.vue")
-                },
-                {
-                    path: "/VisitSummaryDetail",
-                    name: "VisitSummaryDetail",
-                    component: () => import("@/views/week/VisitSummaryDetail.vue")
-                },
-            ]
+          path: '/addStoreVisitd',
+          name: 'addStoreVisitd',
+          component: () => import('@/views/deviceWithin/addStoreVisitd.vue'),
+        },
+        {
+          path: '/addStoreVisitP',
+          name: 'addStoreVisitP',
+          component: () => import('@/views/deviceWithin/addStoreVisitP.vue'),
+        },
+        {
+          path: '/abnormalVisit',
+          name: 'abnormalVisit',
+          component: () => import('@/views/deviceWithin/abnormalVisit.vue'),
+        },
+        {
+          path: '/sign',
+          name: 'sign',
+          component: () => import('@/views/sign/index.vue'),
+        },
+        {
+          path: '/signApprovalList',
+          name: 'signApproval',
+          component: () => import('@/views/signApproval/index.vue'),
+        },
+        {
+          path: '/signApproval',
+          name: 'signApproval',
+          component: () => import('@/views/signApproval/signApproval.vue'),
+        },
+      ],
+    },
 
-        }
-    ]
+    {
+      path: '/My',
+      component: layout,
+      redirect: '/My/index',
+      children: [
+        {
+          path: '/My/index',
+          name: 'MyList',
+          component: () => import('@/views/week/index.vue'),
+        },
+        {
+          path: '/myInventory',
+          name: 'myInventory',
+          component: () => import('@/views/my/myInventory.vue'),
+        },
+        {
+          path: '/material',
+          name: 'material',
+          component: () => import('@/views/my/material.vue'),
+        },
+        {
+          path: '/subordinateHistoricalDaily',
+          name: 'subordinateHistoricalDaily',
+          component: () => import('@/views/week/dailyHistorical.vue'),
+        },
+        {
+          path: '/subordinateHistoricalWeekly',
+          name: 'subordinateHistoricalWeekly',
+          component: () => import('@/views/week/weeklyHistorical.vue'),
+        },
+        {
+          path: '/myHistoricalDaily',
+          name: 'myHistoricalDaily',
+          component: () => import('@/views/week/myHistoricalDaily.vue'),
+        },
+        {
+          path: '/weeklyApproval',
+          name: 'weeklyApproval',
+          component: () => import('@/views/week/weeklyApproval.vue'),
+        },
+        {
+          path: '/weeklyApprovalDetils',
+          name: 'weeklyApprovalDetils',
+          component: () => import('@/views/week/weeklyApprovalDetils.vue'),
+        },
+        {
+          path: '/myComment',
+          name: 'myComment',
+          component: () => import('@/views/week/myComment.vue'),
+        },
+        {
+          path: '/doubleWeeklyDetils',
+          name: 'doubleWeeklyDetils',
+          component: () => import('@/views/week/doubleWeeklyDetils.vue'),
+        },
+        {
+          path: '/daily',
+          name: 'daily',
+          component: () => import('@/views/week/daily.vue'),
+        },
+        {
+          path: '/dailyApprovalList',
+          name: 'dailyApprovalList',
+          component: () => import('@/views/week/dailyApprovalList.vue'),
+        },
+        {
+          path: '/dailyApproval',
+          name: 'dailyApproval',
+          component: () => import('@/views/week/dailyApproval.vue'),
+        },
+        {
+          path: '/dailyDetails',
+          name: 'dailyDetails',
+          component: () => import('@/views/week/dailyDetails.vue'),
+        },
+        {
+          path: '/weeklyApproval',
+          name: 'weeklyApproval',
+          component: () => import('@/views/week/weeklyApproval.vue'),
+        },
+        {
+          path: '/weekly',
+          name: 'weekly',
+          component: () => import('@/views/week/weekly.vue'),
+        },
+        {
+          path: '/doubleWeekly',
+          name: 'doubleWeekly',
+          component: () => import('@/views/week/doubleWeekly.vue'),
+        },
+        {
+          path: '/doubleWeeklyApproval',
+          name: 'doubleWeeklyApproval',
+          component: () => import('@/views/week/doubleWeeklyApproval.vue'),
+        },
+        {
+          path: '/doubleWeeklyHistorical',
+          name: 'doubleWeeklyHistorical',
+          component: () => import('@/views/week/doubleWeeklyHistorical.vue'),
+        },
+        {
+          path: '/dailyHistoricalDetails',
+          name: 'dailyHistoricalDetails',
+          component: () => import('@/views/week/dailyHistoricalDetails.vue'),
+        },
+        {
+          path: '/doubleHistoricalWeeklyDetils',
+          name: 'doubleHistoricalWeeklyDetils',
+          component: () => import('@/views/week/doubleHistoricalWeeklyDetils.vue'),
+        },
+        {
+          path: '/weeklyHistoricalDetils',
+          name: 'weeklyHistoricalDetils',
+          component: () => import('@/views/week/weeklyHistoricalDetils.vue'),
+        },
+        {
+          path: '/VisitSummary',
+          name: 'VisitSummary',
+          component: () => import('@/views/week/VisitSummary.vue'),
+        },
+        {
+          path: '/VisitSummaryMy',
+          name: 'VisitSummaryMy',
+          component: () => import('@/views/week/VisitSummaryMy.vue'),
+        },
+        {
+          path: '/VisitSummaryAdd',
+          name: 'VisitSummaryAdd',
+          component: () => import('@/views/week/VisitSummaryAdd.vue'),
+        },
+        {
+          path: '/VisitSummaryDetail',
+          name: 'VisitSummaryDetail',
+          component: () => import('@/views/week/VisitSummaryDetail.vue'),
+        },
+      ],
+    },
+  ],
 });
 export default router;

src/views/home/hintTabPage/hintDetail.vue

@@ -4,7 +4,7 @@
       <van-nav-bar class="navBar" title="门店拜访" left-arrow @click-left="onClickLeft" />
     </div>
     <div class="tab">
-      <van-tabs class="myTab" type="card" v-model="tabVal" color="#0057ba" @change="tabChange">
+      <van-tabs class="myTab" v-model="activeTabVal" color="#0057ba" @change="tabChange">
         <van-tab
           :title="item.title"
           :name="item.name"
@@ -12,35 +12,375 @@
           :key="index"></van-tab>
       </van-tabs>
     </div>
+    <div class="content">
+      <el-table
+        :data="tableList"
+        :load="load"
+        :tree-props="{ children: 'children', hasChildren: 'hasChildren' }"
+        border
+        class="elTreeTable"
+        lazy
+        row-key="id"
+        :key="toggleIndex">
+        <el-table-column
+          class="firstName"
+          :label="firstLabel"
+          prop="onlyName"
+          align="center"
+          width="120">
+          <template slot-scope="scope">
+            <span>{{ scope.row.onlyName }}</span>
+            <!-- <span v-if="scope.row.reportType != 1">{{ scope.row.deptName }}</span> -->
+          </template>
+        </el-table-column>
+        <el-table-column
+          :label="item.label"
+          width="46"
+          align="center"
+          v-for="(item, index) in tableColumn"
+          v-if="tableColumn.length">
+          <el-table-column
+            :label="val.label"
+            :prop="val.prop"
+            width="46"
+            align="center"
+            v-if="item.childredColumn"
+            v-for="(val, ind) in item.childredColumn">
+          </el-table-column>
+        </el-table-column>
+      </el-table>
+    </div>
   </div>
 </template>
 <script>
+import { selectNoVisitsInfo } from '@/api/index';
+import { mapState } from 'vuex';
 export default {
+  computed: {
+    ...mapState({
+      userInfo: (state) => state.user.userInfo,
+    }),
+  },
   data() {
     return {
-      tabVal: 0,
+      empLevel: 1,
+      deptId: null,
+      fromType: null,
+      activeTabVal: 'noVisit',
       tabsItem: [
         {
           title: '未拜访',
-          name: '0',
+          name: 'noVisit',
         },
         {
           title: '建店',
-          name: '1',
+          name: 'createStore',
         },
         {
           title: '色卡',
-          name: '0',
+          name: 'pantone',
+        },
+      ],
+      toggleIndex: 0,
+      firstLabel: '',
+      tableColumn: [],
+      tableList: [],
+      // 未拜访
+      noVisit: [
+        {
+          label: '可控店',
+          childredColumn: [
+            {
+              label: '(当月)',
+              prop: 'keKongNotVisited',
+            },
+          ],
+        },
+        {
+          label: '金牌店',
+          childredColumn: [
+            {
+              label: '(当月)',
+              prop: 'jinPaiNotVisited',
+            },
+          ],
+        },
+        {
+          label: '同A店',
+          childredColumn: [
+            {
+              label: '(进2月)',
+              prop: 'tongANotVisited',
+            },
+          ],
+        },
+        {
+          label: '同B店',
+          childredColumn: [
+            {
+              label: '(进2月)',
+              prop: 'tongBNotVisited',
+            },
+          ],
+        },
+      ],
+      // 建店
+      createStore: [
+        {
+          label: '可控店',
+          childredColumn: [
+            {
+              label: '(45天未结案)',
+              prop: 'notVisited',
+            },
+          ],
+        },
+        {
+          label: '金牌店',
+          childredColumn: [
+            {
+              label: '(7天未完工)',
+              prop: 'notVisited',
+            },
+            {
+              label: '(30天未结案)',
+              prop: 'notVisited',
+            },
+          ],
+        },
+        {
+          label: '同A店',
+          childredColumn: [
+            {
+              label: '(30天未结案)',
+              prop: 'notVisited',
+            },
+          ],
+        },
+        {
+          label: '同B店',
+          childredColumn: [
+            {
+              label: '(30天未结案)',
+              prop: 'notVisited',
+            },
+          ],
         },
       ],
     };
   },
+  activated() {
+    // this.empLevel = this.userInfo.empLevel || 2;
+    this.firstLabel = this.empLevel == 1 ? '组织名称/大区主管' : '销售部主管';
+    this.fromType = this.$route.query.fromType; // fromType: 'noVisit':未拜访; 'createStore':建店; 'pantone':色卡
+    this.tableColumn = this[this.fromType];
+    this.activeTabName = this.fromType;
+    // this.deptId = this.userInfo.deptId; // 当前用户部门id
+    this.initData();
+  },
   methods: {
-    tabChange(val) {},
+    initData() {
+      if (this.fromType == 'noVisit') {
+        this.selectNoVisitsInfoFun(this.deptId);
+      } else if (this.fromType == 'createStore') {
+      } else if (this.fromType == 'pantone') {
+      }
+    },
+    tabChange(val) {
+      setTimeout(() => {
+        this.tableColumn = this[val];
+        this.toggleIndex = this.toggleIndex++;
+      }, 2000);
+    },
     onClickLeft() {
       this.$router.go(-1);
     },
+    linKReportHistory(row, type) {},
+    // 加载子节点数据的函数
+    load(tree, treeNode, resolve) {
+      //   if (tree.reportType == 2) {
+      //     this.seacherFormload.parentId = tree.deptId;
+      //   } else if (tree.reportType == 3) {
+      //     // this.regionCode=tree.deptId
+      //     // this.regionName=tree.deptName+"销售大区"
+      //     this.seacherFormload.parentId = '';
+      //     this.seacherFormload.regionId = tree.deptId;
+      //   } else {
+      //     this.seacherFormload.parentId = '';
+      //   }
+      this.deptId = tree.deptId;
+      this.initData();
+      //   request({
+      //     url: 'mobile/reportMobile/queryRates',
+      //     method: 'get',
+      //     params: this.seacherFormload,
+      //   }).then((res) => {
+      //     if (res.code == 200) {
+      //       for (var i = 0; i < res.data.length; i++) {
+      //         if (res.data[i].reportType > 1) {
+      //           res.data[i].hasChildren = true;
+      //         } else {
+      //           res.data[i].hasChildren = false;
+      //         }
+      //       }
+      //       resolve(res.data);
+      //     } else {
+      //       this.$toast.fail('数据获取失败');
+      //     }
+      //   });
+    },
+    selectNoVisitsInfoFun() {
+      let resData = [
+        {
+          keKongNotVisited: 0,
+          tongBNotVisited: 0,
+          tongANotVisited: 3,
+          onlyId: 970,
+          onlyName: '北京销售（公司）',
+          jinPaiNotVisited: 52,
+        },
+        {
+          keKongNotVisited: 75,
+          tongBNotVisited: 432,
+          tongANotVisited: 127,
+          onlyId: 1210,
+          onlyName: '华北销售（公司）',
+          jinPaiNotVisited: 427,
+        },
+        {
+          keKongNotVisited: 1,
+          tongBNotVisited: 0,
+          tongANotVisited: 0,
+          onlyId: 969,
+          onlyName: '东北销售（公司）',
+          jinPaiNotVisited: 40,
+        },
+        {
+          keKongNotVisited: 1,
+          tongBNotVisited: 0,
+          tongANotVisited: 0,
+          onlyId: 1208,
+          onlyName: '山东销售（公司）',
+          jinPaiNotVisited: 80,
+        },
+        {
+          keKongNotVisited: -1,
+          tongBNotVisited: 38,
+          tongANotVisited: 75,
+          onlyId: 1206,
+          onlyName: '河南销售（公司）',
+          jinPaiNotVisited: 145,
+        },
+        {
+          keKongNotVisited: 0,
+          tongBNotVisited: 40,
+          tongANotVisited: -1,
+          onlyId: 1202,
+          onlyName: '西北销售（公司）',
+          jinPaiNotVisited: 129,
+        },
+        {
+          keKongNotVisited: 0,
+          tongBNotVisited: 3,
+          tongANotVisited: 9,
+          onlyId: 1203,
+          onlyName: '上海销售（公司）',
+          jinPaiNotVisited: 10,
+        },
+        {
+          keKongNotVisited: -2,
+          tongBNotVisited: 0,
+          tongANotVisited: 0,
+          onlyId: 967,
+          onlyName: '浙江销售（公司）',
+          jinPaiNotVisited: 167,
+        },
+        {
+          keKongNotVisited: -8,
+          tongBNotVisited: 30,
+          tongANotVisited: 79,
+          onlyId: 966,
+          onlyName: '江苏销售（公司）',
+          jinPaiNotVisited: 112,
+        },
+        {
+          keKongNotVisited: 0,
+          tongBNotVisited: 0,
+          tongANotVisited: 0,
+          onlyId: 964,
+          onlyName: '安徽销售（公司）',
+          jinPaiNotVisited: 78,
+        },
+        {
+          keKongNotVisited: 0,
+          tongBNotVisited: 0,
+          tongANotVisited: 0,
+          onlyId: 1207,
+          onlyName: '湘鄂销售（公司）',
+          jinPaiNotVisited: 230,
+        },
+        {
+          keKongNotVisited: 2,
+          tongBNotVisited: 2,
+          tongANotVisited: 1,
+          onlyId: 968,
+          onlyName: '广东销售（公司）',
+          jinPaiNotVisited: 89,
+        },
+        {
+          keKongNotVisited: 0,
+          tongBNotVisited: 0,
+          tongANotVisited: 1,
+          onlyId: 1205,
+          onlyName: '深桂海销售（公司）',
+          jinPaiNotVisited: 76,
+        },
+        {
+          keKongNotVisited: 0,
+          tongBNotVisited: -3,
+          tongANotVisited: 0,
+          onlyId: 1209,
+          onlyName: '闽赣销售（公司）',
+          jinPaiNotVisited: 110,
+        },
+        {
+          keKongNotVisited: 2,
+          tongBNotVisited: 114,
+          tongANotVisited: 42,
+          onlyId: 965,
+          onlyName: '川渝销售（公司）',
+          jinPaiNotVisited: 123,
+        },
+        {
+          keKongNotVisited: 0,
+          tongBNotVisited: 0,
+          tongANotVisited: 0,
+          onlyId: 1204,
+          onlyName: '云贵销售（公司）',
+          jinPaiNotVisited: 94,
+        },
+      ];
+      this.tableList = resData;
+      //   selectNoVisitsInfo({ deptId: this.deptId }).then((res) => {});
+    },
   },
 };
 </script>
 <style lang="scss" scoped></style>
+<style lang="scss">
+.hintDetail {
+  .el-table__head .el-table__body {
+    overflow: hidden;
+    width: 99.9% !important;
+  }
+  .elTreeTable table {
+    width: 99.9% !important;
+  }
+  .el-table__body {
+    width: 99.9% !important;
+  }
+  .el-table__empty-block {
+    width: 99.9% !important;
+  }
+}
+</style>

src/views/home/hintTabPage/index.vue

@@ -21,6 +21,8 @@
             </div>
           </template>
           <visitPage
+            fromType="noVisit"
+            :empLevel="empLevel"
             :contentData="visitCollapse.contentData"
             :maskShow="visitCollapse.collapseLosding"
             :resData="visitCollapse.resData"></visitPage>
@@ -86,8 +88,11 @@
         <van-collapse-item name="4" v-if="empLevel == 2 || empLevel == 3">
           <template #title>
             <div class="itemHeader" @click.stop>
-              <span class="itemTitle">{{ report.title }}</span>
+              <span class="itemTitle">{{ pantone.title }}</span>
               <el-popover placement="right" trigger="click" popper-class="hintPopover">
+                <div class="popoverConten">
+                  {{ pantone.tip }}
+                </div>
                 <div slot="reference" class="hintIconBox">
                   <img class="hintIcon" :src="hintIcon" />
                 </div>
@@ -113,7 +118,7 @@ export default {
   },
   data() {
     return {
-      empLevel: 1, //员工级别，1大区主管2销售部主管3业务员4其他 ***其他级别4，不显示日报、周报、半月报和色卡
+      empLevel: 2, //员工级别，1大区主管2销售部主管3业务员4其他 ***其他级别4，不显示日报、周报、半月报和色卡
       hintIcon: hintIcon,
       activeNames: ['1', '2', '3', '4', '5'],
       visitCollapse: {
@@ -308,7 +313,11 @@ export default {
         title: '',
         reportData: {},
       },
-      pantone: [
+      pantone: {
+        title: '色卡',
+        pantoneData: {},
+      },
+      pantoneData: [
         // 业务员
         {
           firstRowLLabel: '已领用',

src/views/home/hintTabPage/noVIsit.vue

@@ -0,0 +1,30 @@
+<template>
+  <div class="hintDetail">
+    <div class="header">
+      <van-nav-bar class="navBar" title="未拜访门店" left-arrow @click-left="onClickLeft" />
+    </div>
+    <div class="content">
+      <van-collapse v-model="activeName" accordion>
+        <van-collapse-item title="标题1" name="1">内容</van-collapse-item>
+        <van-collapse-item title="标题2" name="2">内容</van-collapse-item>
+        <van-collapse-item title="标题3" name="3">内容</van-collapse-item>
+      </van-collapse>
+    </div>
+  </div>
+</template>
+<script>
+export default {
+  data() {
+    return {
+      activeName: '1',
+    };
+  },
+  methods: {
+    tabChange(val) {},
+    onClickLeft() {
+      this.$router.go(-1);
+    },
+  },
+};
+</script>
+<style lang="scss" scoped></style>

src/views/home/hintTabPage/visitPage.vue

@@ -36,6 +36,12 @@ export default {
       type: Object,
       default: () => {},
     },
+    empLevel: {
+      type: Number,
+    },
+    fromType: {
+      type: String,
+    },
   },
   data() {
     return {};
@@ -48,7 +54,15 @@ export default {
       };
     },
     // 跳转详情
-    onClick() {},
+    onClick() {
+      // 业务员进入未拜访列表
+      if (this.empLevel == 3) {
+        this.$router.push({ path: '/noVIsit' });
+      } else {
+        // 销售部主管和大区负责人跳转统计页面
+        this.$router.push({ path: '/hintDetail', query: { fromType: this.fromType } });
+      }
+    },
   },
 };
 </script>