feature_20250917_调色机预警

src/api/index.js

@@ -903,6 +903,15 @@ export function getReportMaterial(query) {
   });
 }
 
+// 提示类页签-调色预警查询接口
+export function getColorWarning(query) {
+  return request({
+    url: '/mobile/reportMobile/getReportMaterial',
+    method: 'get',
+    params: query,
+  });
+}
+
 // 提示类页签-查询下属业务员色卡指标接口
 export function getReportMaterialType(data, signal) {
   return request({

src/router/index.js

@@ -78,6 +78,15 @@ const router = new VueRouter({
             title: '提示类-业务员建店未完成页面',
           },
         },
+        {
+          path: '/warningStore',
+          name: 'warningStore',
+          meta: { title: '提示类-业务员预警门店页面' },
+          component: () => import('@/views/home/hintTabPage/warningStore.vue'),
+          meta: {
+            title: '提示类-业务员预警门店页面',
+          },
+        },
       ],
     },
     {

src/views/home/hintTabPage/hintDetail.vue

@@ -16,7 +16,7 @@
         v-model="activaPantoneName"
         color="#0057ba"
         @change="tabChangePantone"
-        v-if="activeTabName == 'pantone'">
+        v-if="activeTabName == 'pantone' || activeTabName == 'colorWarning'">
         <van-tab
           v-for="(val, key, index) in tabsItemPantone"
           :key="index"
@@ -244,6 +244,54 @@ export default {
           ],
         },
       ],
+      // 调色预警
+      colorWarning: [
+        {
+          label: '七天未调色',
+          childredColumn: [
+            {
+              label: '(家)',
+              prop: 'zfxsbNum',
+            },
+          ],
+        },
+        {
+          label: '当月未调色',
+          childredColumn: [
+            {
+              label: '(家)',
+              prop: 'ywyylyNum',
+            },
+          ],
+        },
+        {
+          label: '从未调色',
+          childredColumn: [
+            {
+              label: '(家)',
+              prop: 'ywyyffNum',
+            },
+          ],
+        },
+        {
+          label: '有调色机但DIS为0',
+          childredColumn: [
+            {
+              label: '(家)',
+              prop: 'mdwqsNum',
+            },
+          ],
+        },
+        {
+          label: '合计',
+          childredColumn: [
+            {
+              label: '(家)',
+              prop: 'wqsmdNum',
+            },
+          ],
+        },
+      ],
       materialCode: null, //色卡物料来源
       maskShow: true,
       controller: null, //取消请求
@@ -295,6 +343,10 @@ export default {
           title: '建店',
           name: 'createStore',
         },
+        {
+          title: '调色预警',
+          name: 'colorWarning',
+        },
       ];
       // 业务员不显示色卡
       if (this.userInfo.empLevel != '3') {
@@ -330,6 +382,11 @@ export default {
         this.firstProp = 'warehouseName';
         let deptId = tree ? tree.deptId : null;
         this.getPantoneData(resolve, deptId);
+      }else if (this.fromType == 'colorWarning') {
+        // 调色预警
+        this.firstProp = 'warehouseName';
+        let deptId = tree ? tree.deptId : null;
+        this.getPantoneData(resolve, deptId);
       }
     },
     tabChange(val) {

src/views/home/hintTabPage/index.vue

@@ -199,6 +199,60 @@
             </div>
           </div>
         </van-collapse-item>
+         <!-- 调色预警 -->
+        <van-collapse-item name="5">
+          <template #title>
+            <div class="itemHeader" @click.stop>
+              <span class="itemTitle">{{ colorWarning.title }}</span>
+              <el-popover placement="right" trigger="click" popper-class="hintPopover">
+                <div class="popoverConten">
+                  {{ colorWarning.tip }}
+                </div>
+                <div slot="reference" class="hintIconBox">
+                  <img class="hintIcon" :src="hintIcon" />
+                </div>
+              </el-popover>
+            </div>
+          </template>
+          <div class="pantoneContent">
+            <div v-for="(val, key, index) in colorWarning.contentData" :key="index">
+                <div :class="['title',key=='1988色卡'?'kekong':'jinpai']">{{ key }}</div>
+                <div class="pantoneItem">
+                  <div class="firstItem item">
+                    <div class="left">
+                      <div class="lebel">滚动7天未调色：</div>
+                      <div class="value valueIsClick" @click="colorWarningClick(val, key, val.mdwqsNum)">
+                        {{ Micrometer(val.ywyylyNum) }}家
+                      </div>
+                    </div>
+                    <div class="right">
+                      <div class="lebel">当月未调色：</div>
+                      <div class="value valueIsClick" @click="colorWarningClick(val, key, val.mdwqsNum)">
+                        {{ Micrometer(val.ywyyffNum) }}家
+                      </div>
+                    </div>
+                  </div>
+                  <div class="secondItem item">
+                    <div class="left">
+                      <div class="lebel">从未调色：</div>
+                      <div class="value valueIsClick" @click="colorWarningClick(val, key, val.mdwqsNum)">
+                        {{ Micrometer(val.mdwqsNum) }}家
+                      </div>
+                    </div>
+                    <div class="right">
+                      <div class="lebel">近两年DIS为0：</div>
+                      <div class="value valueIsClick" @click="colorWarningClick(val, key, val.mdwqsNum)">
+                        {{ Micrometer(val.wqsmdNum) }}家
+                      </div>
+                    </div>
+                  </div>
+                </div>
+            </div>
+            <div class="mask" v-if="colorWarning.contentLosding">
+              <van-loading type="spinner" color="#1989fa" />
+            </div>
+          </div>
+        </van-collapse-item>
       </van-collapse>
     </div>
   </div>
@@ -209,6 +263,7 @@ import {
   selectBuildingStore,
   getReportTarget,
   getReportMaterial,
+  getColorWarning,
   buryingPoint,
 } from '@/api/index';
 import hintIcon from '@/assets/hintIcon.png';
@@ -438,6 +493,12 @@ export default {
         pantoneLosding: true,
         pantoneData: {},
       },
+      colorWarning: {
+        title: '调色预警',
+        tip: '调色预警tips',
+        contentLosding: true,
+        contentData: {},
+      },
       isLoading: false,
     };
   },
@@ -468,6 +529,8 @@ export default {
       this.getReportData();
       // 获取色卡数据
       this.getPantoneData();
+      // 获取调色预警数据
+      this.getColorWarning();
     },
     getVisitCollapseData() {
       this.visitCollapse.collapseLosding = true;
@@ -515,6 +578,17 @@ export default {
         });
       }
     },
+    getColorWarning() {
+       if (this.empLevel !== 4) {
+        this.colorWarning.contentLosding = true;
+        getColorWarning().then((res) => {
+          this.colorWarning.contentLosding = false;
+          this.colorWarning.tip = res.data.tip;
+          this.colorWarning.contentData = res.data;
+          delete this.colorWarning.contentData.tip;
+        });
+      }
+    },
     // 汇报下属详情-点击
     reportClick(type, value) {
       // 埋点
@@ -554,6 +628,27 @@ export default {
         });
       }
     },
+    // 调色预警查看详情
+    colorWarningClick(val, key, value) {
+      // 埋点
+      buryingPoint({
+        systemModel: '提示类',
+        buryingPointType: 7,
+        buryingPointValue: value,
+        buryingPointName: key,
+        buryingPointPosition: '调色预警',
+      });
+      // 业务员进入调色预警列表
+      if (this.empLevel == '3') {
+        this.$router.push({ path: '/warningStore', query: { storeId: val.storeId } });
+      } else {
+        // 销售部，大区，公司，总部
+        this.$router.push({
+          path: '/hintDetail',
+          query: { fromType: 'pantone', materialCode: val.materialCode, pantoneName: key }, // materialCode物料来源
+        });
+      }
+    },
   },
 };
 </script>
@@ -630,17 +725,29 @@ export default {
         display: inline-block;
         color: #fff;
       }
+      .kekong{
+        background: rgb(235, 104, 119);
+      }
+      .jinpai{
+        background: rgb(255, 165, 0);
+
+      }
       .pantoneItem {
         .item {
           display: flex;
           justify-content: space-between;
           .left {
             display: flex;
+            flex: 1;
+            .valueIsClick {
+              text-decoration: underline;
+              color: #0057ba;
+            }
           }
           .right {
             display: flex;
-            width: 48%;
-            justify-content: left;
+            width: 160px;
+            // justify-content: center;
             .valueIsClick {
               text-decoration: underline;
               color: #0057ba;

src/views/home/hintTabPage/warningStore.vue

@@ -0,0 +1,510 @@
+<template>
+  <div class="unCreateStore">
+    <div class="header">
+      <van-nav-bar class="navBar" title="调色机预警门店明细" left-arrow @click-left="onClickLeft" />
+    </div>
+    <div class="content">
+      <van-collapse v-model="activeName" accordion @change="collapseCange">
+        <van-collapse-item v-for="(val, key, ind) in list" :key="ind" :name="key">
+          <template #title>
+            <div class="title">{{ key | storeType }}</div>
+            <div class="num">{{ val ? val.length : 0 }}家</div>
+          </template>
+          <div class="itemContent">
+            <template v-if="val && val.length">
+              <div class="item" v-for="(item, index) in val" :key="index">
+                <van-cell>
+                  <div class="card">
+                    <div></div>
+                    <div class="title" style="padding-right: 74px">
+                      <span class="btn" :data-clipboard-text="item.storeCode">
+                        <span>{{ item.storeName }}</span>
+                        (<span style="color: #0057ba">{{ item.storeCode }}</span
+                        >)
+                        <van-icon
+                          :name="require('@/assets/paste.png')"
+                          color="#ee0a24"
+                          size="20"
+                          style="top: 6px; margin-left: 4px" />
+                      </span>
+                      <!-- validFlag: 0正常门店，1无效门店，2临时门店 -->
+                      <span
+                        v-if="item.validFlag == 2"
+                        style="
+                          display: inline-block;
+                          border-radius: 100px;
+                          width: 20px;
+                          text-align: center;
+                          color: orange;
+                          font-weight: normal;
+                        "
+                        >临</span
+                      >
+                      <!-- "approvalStatus": 1:已结案;0:未结案， -->
+                      <!-- "processApprovalStatus": 审批状态（0=未提交，1=已提交待审核，2=审批通过，3=审批拒绝） -->
+                      <template v-if="item.approvalStatus == 0 && item.validFlag == 0">
+                        <span class="statusIcon submit" v-if="item.processApprovalStatus == 1"
+                          >已提交</span
+                        >
+                        <span class="statusIcon noSubmit" v-if="item.processApprovalStatus == 0"
+                          >未提交</span
+                        >
+                      </template>
+                      <van-button
+                        type="info"
+                        size="small"
+                        plain
+                        class="centerBtn ctns"
+                        @click="storeDetailFn(item.storeId)">
+                        客户信息
+                        <van-icon name="arrow" />
+                      </van-button>
+                    </div>
+                    <div class="info" style="position: relative">
+                      联系人：{{ item.contactName }}
+                      <div
+                        style="position: absolute; bottom: 0px; right: 0px"
+                        v-if="item.storeLabels">
+                        <el-popover
+                          popper-class="zpover zpover6"
+                          placement="bottom"
+                          trigger="click">
+                          <div>
+                            <p>
+                              本店{{ timeData }}下单SKU数：<a
+                                @click="linkList(item)"
+                                style="text-decoration: underline"
+                                >点击查看详情</a
+                              >
+                            </p>
+                          </div>
+                          <div
+                            class="visitStoreIco"
+                            v-if="item.storeLabels.zysslNums !== false"
+                            style="background-color: #fff; position: relative"
+                            slot="reference">
+                            <p
+                              style="
+                                width: 100%;
+                                position: absolute;
+                                z-index: 1;
+                                top: 0.2px;
+                                width: 22px;
+                                margin: 0;
+                                margin-left: 3.6px;
+                                text-align: center;
+                                font-size: 12px;
+                              ">
+                              {{ item.storeLabels.zysslNums }}
+                            </p>
+                            <van-icon :name="require('@/assets/ord.png')" size="26" />
+                          </div>
+                        </el-popover>
+                        <el-popover
+                          popper-class="zpover zpover5"
+                          placement="bottom"
+                          width="200"
+                          trigger="click">
+                          <div v-if="item.storeLabels">
+                            <p>已参加:</p>
+                            <p v-for="tt in (item.storeLabels.targetOne + '').split(';')">
+                              {{ tt }}
+                            </p>
+                          </div>
+                          <div
+                            class="visitStoreIco"
+                            v-if="item.storeLabels.targetOne"
+                            style="background-color: #fff"
+                            slot="reference">
+                            <van-icon :name="targetOne" size="26" />
+                          </div>
+                        </el-popover>
+                        <el-popover
+                          popper-class="zpover"
+                          placement="bottom"
+                          width="200"
+                          trigger="click"
+                          content="同城店近60天未下单">
+                          <div
+                            v-if="item.storeLabels.fxNoOrder"
+                            class="visitStoreIco"
+                            style="background-color: #fff"
+                            slot="reference">
+                            <van-icon :name="order60" size="26" />
+                          </div>
+                        </el-popover>
+                        <el-popover
+                          popper-class="zpover"
+                          placement="bottom"
+                          width="200"
+                          trigger="click"
+                          content="金牌店近30天未下单">
+                          <div
+                            v-if="item.storeLabels.noOrder"
+                            class="visitStoreIco"
+                            style="background-color: #fff"
+                            slot="reference">
+                            <van-icon :name="order" size="26" />
+                          </div>
+                        </el-popover>
+                        <el-popover
+                          popper-class="zpover"
+                          placement="bottom"
+                          width="200"
+                          trigger="click"
+                          content="本店本月进过专业时时丽">
+                          <div
+                            v-if="item.storeLabels.zyssl"
+                            class="visitStoreIco"
+                            style="background-color: #ed5c68"
+                            slot="reference">
+                            专
+                          </div>
+                        </el-popover>
+                        <el-popover
+                          popper-class="zpover zpover1"
+                          placement="bottom"
+                          width="200"
+                          trigger="click"
+                          content="本店本月进过超好贴">
+                          <div
+                            v-if="item.storeLabels.chtczj"
+                            class="visitStoreIco"
+                            style="background-color: #0057ba"
+                            slot="reference">
+                            超
+                          </div>
+                        </el-popover>
+                        <el-popover
+                          placement="bottom"
+                          popper-class="zpover zpover1 zpover1sb"
+                          trigger="click"
+                          :content="'本店本月已拜访过' + item.storeLabels.visitTimes + '次'">
+                          <div
+                            v-if="
+                              false &&
+                              item.storeLabels.visitTimes &&
+                              item.storeLabels.visitTimes > 0
+                            "
+                            class="visitStoreIco"
+                            slot="reference"
+                            style="background-color: #fff; position: relative">
+                            <p
+                              style="
+                                width: 100%;
+                                position: absolute;
+                                z-index: 10;
+                                top: -2px;
+                                margin: 0;
+                                text-align: center;
+                                font-size: 12px;
+                              ">
+                              {{ item.storeLabels.visitTimes }}
+                            </p>
+                            <van-icon :name="ordernum" size="26" />
+                          </div>
+                          <el-table :data="item.userVisitTimesMap" border max-height="180px">
+                            <el-table-column label="业务员" prop="userName" />
+                            <el-table-column label="拜访次数" prop="visitTimes" />
+                          </el-table>
+                        </el-popover>
+                      </div>
+                    </div>
+                    <div class="info">
+                      类型：{{ item.storeCategoryName }}&nbsp;
+                      <el-popover
+                        popper-class="zpover zpover6"
+                        placement="bottom-start"
+                        trigger="click">
+                        <div>
+                          <p>
+                            本店经营品项指导:
+                            <a @click="linkimg(item)" style="text-decoration: underline"
+                              >点击查看</a
+                            >
+                          </p>
+                        </div>
+                        <van-icon name="question-o" size="18" slot="reference" />
+                      </el-popover>
+                    </div>
+                    <div class="info">联系电话：{{ item.telephone }}</div>
+                    <div class="info">地址：{{ item.addressLine }}</div>
+                    <!-- 潜在店不显示经销商 -->
+                    <template v-if="item.sfaStoreType.type != 'qzd'">
+                      <!-- 分销店 -->
+                      <template
+                        v-if="
+                          item.sfaStoreType &&
+                          item.sfaStoreType.type == 'fxd' &&
+                          item.sfaStoreChainsContactList
+                        ">
+                        <div class="info">
+                          经销商：
+                          <div
+                            class="TCFXListItem"
+                            v-for="(item, index) in item.sfaStoreChainsContactList">
+                            <el-popover
+                              popper-class="zpover zpoverStoreztype"
+                              placement="bottom-start"
+                              trigger="click">
+                              <div>
+                                <div>{{ item.chainCode }}</div>
+                                <div>{{ item.chainName }}</div>
+                              </div>
+                              <div slot="reference" :key="index">
+                                {{ item.categoryDescribe }}
+                              </div>
+                            </el-popover>
+                          </div>
+                        </div>
+                      </template>
+                      <template v-else>
+                        <div class="info">经销商：{{ item.chainName }}</div>
+                      </template>
+                    </template>
+                  </div>
+                </van-cell>
+              </div>
+            </template>
+            <van-empty description="暂无数据" v-else />
+          </div>
+        </van-collapse-item>
+      </van-collapse>
+    </div>
+  </div>
+</template>
+<script>
+import { getStoreInfos } from '@/api/home';
+import { mapState } from 'vuex';
+import store from '@/store';
+import { getMonthCommon } from '@/utils';
+import { ProductItemImge } from '@/api/index';
+export default {
+  name: 'unCreateStore',
+  computed: {
+    ...mapState({
+      activaCreateTypeStore: (state) => state.user.activaCreateTypeStore,
+    }),
+  },
+  data() {
+    return {
+      activeName: '',
+      list: {},
+      TXPiont: {}, //腾讯定位数据
+      TXisBD: {}, // 腾讯定位数据转百度
+      activatStoreVal: {}, //当前点击门店数据
+      visitRoutePath: '', //拜访页面路径
+      clickIsFlage: true,
+      timeData: '',
+    };
+  },
+  filters: {
+    storeType(value) {
+      let type = '';
+      if (value == 'keKongAbnormalNum') {
+        type = '可控店45天未结案列表';
+      } else if (value == 'jinPaiUnfinishedNum') {
+        type = '金牌店7天未完工列表';
+      } else if (value == 'jinPaiAbnormalNum') {
+        type = '金牌店30天未结案列表';
+      } else if (value == 'TuLiaoAbnormalNum') {
+        type = '同城分销-涂料店7天未结案列表';
+      } else if (value == 'QiTaAbnormalNum') {
+        type = '同城分销-其他店7天未结案列表';
+      }
+      return type;
+    },
+  },
+  activated() {
+    this.timeData = getMonthCommon();
+    this.getList();
+    this.activeName = this.activaCreateTypeStore || '';
+  },
+  methods: {
+    collapseCange(value) {
+      store.dispatch('activaCreateTypeStore', value);
+    },
+    getList() {
+      this.toastLoading(0, '加载中...', true);
+      getStoreInfos()
+        .then((res) => {
+          this.toastLoading().clear();
+          this.list = res.data;
+          console.log(this.list);
+        })
+        .catch(() => {
+          this.toastLoading().clear();
+        });
+    },
+    storeDetailFn(id) {
+      this.$router.push({
+        path: '/storeDetail',
+        query: { id: id },
+      });
+    },
+    onClickLeft() {
+      this.$router.go(-1);
+    },
+    linkList(val) {
+      this.$router.push({
+        path: '/pItem',
+        query: {
+          id: val.storeId,
+          detilId: 'a',
+          storeCode: val.storeCode,
+          showOrderButton: val.showOrderButton,
+        },
+      });
+    },
+    linkimg(val) {
+      ProductItemImge({ storeId: val.storeId }).then((response) => {
+        if (response.code == 200) {
+          if (response.data != undefined) {
+            window.open(response.data);
+          } else {
+            this.$toast(response.msg);
+          }
+        } else {
+          this.$toast(res.msg);
+        }
+      });
+    },
+  },
+};
+</script>
+<style lang="scss" scoped>
+/* Base container styles */
+.unCreateStore {
+  height: 100%;
+  width: 100%;
+
+  .content {
+    padding: 8px 10px;
+  }
+}
+
+/* Store item styles */
+.item {
+  padding: 8px 10px;
+  margin: 10px 0;
+  background: #fff;
+
+  .van-cell {
+    padding: 0;
+
+    &__right-icon {
+      height: 144px;
+      line-height: 144px;
+      margin-right: 10px;
+    }
+  }
+}
+
+/* Card styles */
+.card {
+  box-sizing: border-box;
+
+  .title {
+    font-size: 16px;
+    font-weight: bold;
+    color: #333;
+    line-height: 30px;
+  }
+
+  .info {
+    font-size: 14px;
+    color: #909090;
+    line-height: 26px;
+  }
+}
+
+/* Icon styles */
+.visitStoreIco {
+  float: left;
+  width: 26px;
+  text-align: center;
+  background-color: #ffba13;
+  color: #fff;
+  border-radius: 100%;
+  margin-left: 14px;
+  line-height: 26px;
+  height: 26px;
+}
+
+/* Button styles */
+.centerBtn {
+  display: block;
+  color: #0057ba;
+  border-radius: 5px;
+  padding: 0 6px;
+  height: 28px;
+
+  &.ctns {
+    position: absolute;
+    top: 0;
+    right: 0;
+    width: 80px;
+  }
+}
+
+/* Status styles */
+.statusIcon {
+  padding: 3px;
+  font-size: 12px;
+  margin: 0 3px;
+  color: #fff;
+  display: inline-block;
+  height: 20px;
+  line-height: 16px;
+  vertical-align: -1px;
+
+  &.submit {
+    background: #ffba13;
+  }
+
+  &.noSubmit {
+    background: #f11818;
+  }
+}
+
+/* List item styles */
+.TCFXListItem {
+  display: inline-block;
+  border: 1px solid #ccc;
+  padding: 3px 5px;
+  margin: 0 5px;
+  border-radius: 6px;
+}
+
+/* Collapse styles */
+.van-collapse-item {
+  border-bottom: 1px solid #dcdcdc;
+}
+</style>
+<style lang="scss">
+.unCreateStore {
+  .van-cell__title {
+    font-size: 16px;
+    font-weight: bold;
+    color: #333;
+    display: flex;
+    justify-content: space-between;
+    .num {
+      color: #909090;
+      margin-right: 5px;
+    }
+  }
+  .van-collapse-item__wrapper {
+    border-top: 1px solid #dcdcdc;
+  }
+  .van-collapse-item__title--expanded {
+    position: sticky;
+    top: 0px;
+    z-index: 10;
+  }
+  .van-collapse-item__content {
+    background-color: unset;
+    padding: 0;
+  }
+}
+</style>