feature_20260402_指标修改

src/components/share.vue

@@ -64,16 +64,10 @@
         </template>
         <!-- 日报指标 -->
         <template v-if="isTarget">
-          <template v-if="reportTarget.postType == 'GZ' || reportTarget.postType == 'BMD'">
-            <!-- 0-历史指标  1-动态指标，String类型 -->
-            <target
-              v-if="reportTarget.targetType == '1'"
-              :homePageIndicatorDate="reportTarget.homePageIndicatorList"></target>
-            <template v-else>
-              <!-- 历史指标 -->
-              <shareAtarget :reportInfo="reportTarget"></shareAtarget>
-              <shareBtarget :reportInfo="reportTarget"></shareBtarget>
-            </template>
+          <template v-if="reportTarget.targetType == '1'">
+            <!--targetType 0-历史指标  1-动态指标，String类型 -->
+            <shareCommonTarget
+              :homePageIndicatorDate="reportTarget.homePageIndicatorList"></shareCommonTarget>
           </template>
           <template v-else>
             <!-- YFQuota:应用服务平台 不显示各项指标 -->
@@ -158,10 +152,10 @@ import ShareAtarget from './shareAtarget.vue';
 import shareBtarget from './shareBtarget.vue';
 import shareReportCustom from './shareReportCustom.vue';
 import uploadAliOss from '@/utils/uploadAliOss';
-import target from '@/views/week/target.vue';
+import shareCommonTarget from './shareCommonTarget.vue';
 export default {
   name: 'share',
-  components: { VueQr, ShareAtarget, shareReportCustom, shareBtarget, target },
+  components: { VueQr, ShareAtarget, shareReportCustom, shareBtarget, shareCommonTarget },
   props: {
     // 日报数据
     reportTarget: {

src/components/shareCommonTarget.vue

@@ -0,0 +1,643 @@
+<template>
+  <div class="shareCommonTarget">
+    <!-- labelStyle 垃圾，不能全匹配，需要特殊处理 -->
+    <template>
+      <div class="container linep">
+        <van-collapse v-model="activeNames">
+          <div v-for="(homePageItem, index) in homePageIndicatorList" :key="index">
+            <van-collapse-item v-if="homePageItem.labelStyle == 1" :name="(index + 1).toString()">
+              <template #title>
+                <div class="text">{{ homePageItem.name }}</div>
+              </template>
+              <van-row>
+                <!-- 动态渲染标题栏 -->
+                <div
+                  v-for="(periodItem, periodIndex) in homePageItem.children"
+                  :key="'title-' + periodIndex">
+                  <van-col span="12" v-if="periodItem.name">
+                    <span :class="periodIndex % 2 === 0 ? 'leftTitle' : 'rightTitle'">{{
+                      periodItem.name
+                    }}</span>
+                  </van-col>
+                </div>
+                <!-- 动态渲染指标项 -->
+                <div v-if="homePageItem.children.length >= 2">
+                  <!-- 遍历第一个周期的所有指标 -->
+                  <div
+                    v-for="(metric, metricIndex) in homePageItem.children[0].children"
+                    :key="'metric-' + metricIndex">
+                    <!-- 左侧指标 -->
+                    <van-col span="12">
+                      <p>
+                        {{ metric.name }}:
+                        <span class="colorblack">
+                          {{ metric.indicatorDisplayValue }}
+                        </span>
+                      </p>
+                    </van-col>
+                    <!-- 对应右侧指标 -->
+                    <van-col span="12">
+                      <p>
+                        {{ homePageItem.children[1]?.children[metricIndex]?.name || '-' }}:
+                        <span class="colorblack">
+                          {{
+                            homePageItem.children[1]?.children[metricIndex]?.indicatorDisplayValue
+                          }}
+                        </span>
+                      </p>
+                    </van-col>
+                  </div>
+                </div>
+              </van-row>
+            </van-collapse-item>
+            <van-collapse-item v-if="homePageItem.labelStyle == 2" :name="(index + 1).toString()">
+              <template #title>
+                <div class="text">{{ homePageItem.name }}</div>
+              </template>
+              <!-- 外层循环：遍历主要类别 -->
+              <van-row
+                v-for="(category, index) in homePageItem.children"
+                :key="index"
+                :style="{ marginTop: index > 0 ? '10px' : '0' }">
+                <van-col span="24" v-if="category.name">
+                  <span :class="index % 2 === 0 ? 'leftTitle' : 'rightTitle'">{{
+                    category.name
+                  }}</span>
+                </van-col>
+
+                <!-- 内层循环：遍历各个统计项 -->
+                <div v-for="(item, idx) in category.children" :key="idx">
+                  <van-col :span="idx == 0 ? 24 : 12">
+                    <p>
+                      {{ item.name }}：<span
+                        :style="labelStyle(item.clickable)"
+                        @click="onClick(item.clickable)"
+                        class="colorbalck"
+                        >{{ item.indicatorDisplayValue }}</span
+                      >
+                    </p>
+                  </van-col>
+                </div>
+              </van-row>
+            </van-collapse-item>
+            <van-collapse-item v-if="homePageItem.labelStyle == 3" :name="(index + 1).toString()">
+              <template #title>
+                <div class="text">{{ homePageItem.name }}</div>
+              </template>
+              <!-- 外层循环：遍历主要类别 -->
+              <van-row
+                v-for="(category, index) in homePageItem.children"
+                :key="index"
+                :style="{ marginTop: index == 0 ? '-10px' : '0' }">
+                <!-- 内层循环：遍历各个统计项 -->
+                <div v-for="(item, idx) in category.children" :key="idx">
+                  <van-col :span="idx == 0 ? 24 : 12">
+                    <p>
+                      {{ item.name }}：<span
+                        :style="labelStyle(item.clickable)"
+                        @click="onClick(item.clickable)"
+                        class="colorbalck"
+                        >{{ item.indicatorDisplayValue }}</span
+                      >
+                    </p>
+                  </van-col>
+                </div>
+              </van-row>
+            </van-collapse-item>
+            <van-collapse-item v-if="homePageItem.labelStyle == 4" :name="(index + 1).toString()">
+              <template #title>
+                <div class="text">{{ homePageItem.name }}</div>
+              </template>
+              <!-- 外层循环：遍历主要类别 -->
+              <template v-for="(category, index) in homePageItem.children">
+                <van-row
+                  :style="{
+                    width: category.name ? '49%' : '100%',
+                    float: category.name ? 'left' : 'none',
+                  }">
+                  <van-col
+                    span="20"
+                    :class="index % 2 === 0 ? 'leftTitle' : 'rightTitle'"
+                    v-if="category.name">
+                    <span>{{ category.name }}</span>
+                  </van-col>
+
+                  <!-- 内层循环：遍历各个统计项 -->
+                  <div v-for="(item, idx) in category.children" :key="idx">
+                    <van-col :span="24">
+                      <p>
+                        {{ item.name }}：<span
+                          :style="labelStyle(item.clickable)"
+                          @click="onClick(item.clickable)"
+                          class="colorbalck"
+                          >{{ item.indicatorDisplayValue }}</span
+                        >
+                      </p>
+                    </van-col>
+                  </div>
+                </van-row>
+              </template>
+            </van-collapse-item>
+            <van-collapse-item v-if="homePageItem.labelStyle == 5" :name="(index + 1).toString()">
+              <template #title>
+                <div class="text">{{ homePageItem.name }}</div>
+              </template>
+              <!-- 外层循环：遍历主要类别 -->
+              <van-row
+                v-for="(category, index) in homePageItem.children"
+                :key="index"
+                :style="{ marginTop: index == 0 ? '-10px' : '0' }">
+                <!-- 内层循环：遍历各个统计项 -->
+                <div v-for="(item, idx) in category.children" :key="idx">
+                  <van-col :span="24">
+                    <p>
+                      {{ item.name }}：<span
+                        :style="labelStyle(item.clickable)"
+                        @click="onClick(item.clickable)"
+                        class="colorbalck"
+                        >{{ item.indicatorDisplayValue }}</span
+                      >
+                    </p>
+                  </van-col>
+                </div>
+              </van-row>
+            </van-collapse-item>
+          </div>
+        </van-collapse>
+      </div>
+    </template>
+  </div>
+</template>
+
+<script>
+import store from '@/store';
+import { userTodayPlanNum, getReportInfo } from '@/api/index';
+import { mapState } from 'vuex';
+export default {
+  name: 'home',
+  computed: {
+    ...mapState({
+      reportInfo: (state) => state.user.reportInfo,
+    }),
+  },
+  props: {
+    tabVal: {
+      type: [String, Number],
+      default: '-1',
+    },
+  },
+  data() {
+    return {
+      shows: true,
+      show: true,
+      num: 0,
+      todayGoal: {},
+      progressWidth: 0,
+      updataTime: '',
+      activeNames: [
+        '1',
+        '2',
+        '3',
+        '4',
+        '5',
+        '6',
+        '7',
+        '8',
+        '10',
+        '11',
+        '12',
+        '16',
+        '17',
+        '20',
+        '21',
+        '22',
+        '23',
+        '24',
+        '25',
+        '26',
+        '27',
+        '28',
+        '29',
+        '30',
+        '31',
+        '32',
+        '33',
+        '34',
+        '35',
+        '36',
+        '37',
+        '38',
+        '39',
+        '40',
+        '41',
+        '42',
+        '43',
+      ],
+      activeNameType: [],
+      powerGradeShow: false,
+      showButton: false,
+      isCommit: null,
+      powerGrade: '2',
+      deptLevel: '',
+      // positionId：等级（1-销售员 2-销售部主管 3-大区主管 4-区域公司总经理 5-DIY公司）
+      reportTargetAll: {},
+      homePageIndicatorList: [],
+      approvalPendingNum: 0,
+      isDiy: false,
+      approvalButton: false,
+      times: 5,
+      timer: null,
+      type: '-1',
+      monthNoVisit: {},
+      flag: true,
+      reportInfoData: {},
+      applyNumber: '',
+      proccessPendingNum: 0,
+      JZQuota: false,
+      GZdata: false,
+    };
+  },
+  watch: {
+    // tabVal: {
+    //   handler(val) {
+    //     if (val == 2) {
+    //       // keep-alive 模式watch执行了两次
+    //       this.initData();
+    //     }
+    //   },
+    //   immediate: true,
+    // },
+    reportInfo: {
+      handler(val) {
+        if (val) {
+          this.initData();
+        }
+      },
+      immediate: true,
+    },
+  },
+  methods: {
+    labelStyle(val) {
+      return {
+        'text-decoration': 'none',
+        color: '#fff',
+      };
+    },
+    // 跳转详情
+    onClick(val) {
+      if (val == 1) {
+        store.dispatch('setActivaTypeStore', 'FuWuShang');
+        this.$router.push({ path: '/noVisit' });
+      }
+    },
+    initData() {
+      console.log(this.tabVal);
+      this.getReportInfo();
+      this.userTodayPlanNum();
+    },
+    getReportInfo() {
+      if (this.reportInfo && this.reportInfo.homePageIndicatorList != null) {
+        this.homePageIndicatorList = this.reportInfo.homePageIndicatorList;
+        this.updataTime = this.reportInfo.homePageIndicatorUpdateTime;
+      }
+      return;
+      let loading1 = this.$toast.loading({
+        duration: 0,
+        message: '加载中...',
+        forbidClick: true,
+      });
+      getReportInfo({ isContent: false }).then((res) => {
+        if (res.code == 200) {
+          loading1.clear();
+          localStorage.setItem('powerGrade', res.data.positionId);
+          localStorage.setItem('userDeptLevel', res.data.userDeptLevel);
+          localStorage.setItem('isDiy', res.data.diy);
+          localStorage.setItem('uType', res.data.userType);
+          localStorage.setItem('jzType', res.data.jzType);
+          localStorage.setItem('customerVisits', res.data.customerManagerVisits);
+          localStorage.setItem('postType', res.data.postType);
+          if (res.data.homePageIndicatorList != null) {
+            this.homePageIndicatorList = res.data.homePageIndicatorList;
+            this.updataTime = res.data.homePageIndicatorUpdateTime;
+          }
+          this.type = res.data.userType;
+        } else {
+          this.$toast(res.msg);
+        }
+      });
+    },
+    userTodayPlanNum() {
+      localStorage.setItem('outvstoreName', '');
+      localStorage.setItem('outvchainName', '');
+      localStorage.removeItem('outvstoreLabelTypes');
+      localStorage.removeItem('outvjpdStoreLevelTypes');
+      localStorage.removeItem('outvstoreCategoryList');
+      localStorage.setItem('outvchainCode', '');
+      localStorage.setItem('outvstoreName', '');
+      localStorage.setItem('deviveStoreName', '');
+      localStorage.setItem('outvsortType', '');
+      localStorage.setItem('outsortParam', '');
+      localStorage.setItem('lat', '');
+      localStorage.setItem('lon', '');
+      userTodayPlanNum().then((res) => {
+        if (res.code == 200) {
+          this.todayGoal = res.data;
+          this.progressWidth = (this.todayGoal.finishNum / this.todayGoal.planNum) * 100 + '%';
+          localStorage.setItem('nickName', res.data.user.nickName);
+          localStorage.setItem('postName', res.data.user.postName);
+          localStorage.setItem('zipPhoto', res.data.zipPhoto);
+          localStorage.setItem('storeType', res.data.user.type);
+          localStorage.setItem('deptLevel', res.data.user.depts[0].deptLevel);
+          localStorage.setItem('userId', res.data.user.userId);
+          localStorage.setItem('deptIds', JSON.stringify(res.data.user.deptIds));
+          this.monthNoVisit = res.data.monthNoVisit;
+        } else {
+          this.$toast(res.msg);
+        }
+      });
+    },
+  },
+};
+</script>
+<style scoped>
+.shareCommonTarget {
+  .homeTitle {
+    padding: 6px 16px;
+  }
+
+  .homeTitle .van-icon__image {
+    width: 1.4em;
+    height: auto;
+  }
+
+  .container {
+    margin: 10px 0;
+  }
+
+  .container .van-collapse-item {
+    margin-bottom: 10px;
+    overflow: hidden;
+  }
+
+  .progressContentlist {
+    font-size: 14px;
+    padding: 10px 0;
+  }
+
+  .linep p {
+    margin: 10px 0 0 0;
+    font-size: 14px;
+    color: #fff;
+  }
+
+  .leftTitle {
+    /* background-color: #74a4d9; */
+    color: #fff;
+    display: inline-block;
+    /* border-radius: 2px; */
+  }
+
+  .rightTitle {
+    /* background-color: #e7b4bb; */
+    color: #fff;
+    display: inline-block;
+    /* border-radius: 2px; */
+    white-space: nowrap;
+  }
+  .colorblack {
+    color: #fff;
+  }
+  .colorbalck {
+    color: #fff;
+  }
+}
+</style>
+<style lang="scss">
+.shareCommonTarget {
+  .myTab .van-tabs__nav--card {
+    margin: 0 !important;
+  }
+
+  .myTab .van-tabs__wrap,
+  .van-tabs__nav--card {
+    height: 39px;
+  }
+
+  .myTab .van-tab {
+    line-height: 40px;
+  }
+
+  .linep .van-collapse-item__content {
+    color: #fff;
+  }
+
+  .linep .van-collapse-item__content {
+    color: #fff;
+  }
+
+  .linep .van-cell__title {
+    color: #fff;
+    font-weight: 500;
+    font-size: 16px;
+  }
+
+  .homeCellIcon {
+    line-height: 34px;
+  }
+
+  .homeTitle .van-cell__title {
+    color: #fff;
+    font-size: 16px;
+    font-weight: bold;
+    padding-left: 4px;
+    line-height: 36px;
+    height: 36px;
+  }
+
+  .updataTime {
+    color: #fff;
+    font-size: 12px;
+    text-align: center;
+  }
+
+  .homeTitle .van-tag--danger {
+    /* border-radius: 20px; */
+  }
+
+  .van-dialog__confirm,
+  .van-dialog__confirm:active {
+    color: #fff;
+  }
+
+  .van-collapse-item__content {
+    padding: 0px !important;
+    overflow: hidden;
+    background-color: unset !important;
+  }
+
+  .storeTypeHome .storeTypeHomeList .van-cell__title {
+    color: #fff;
+    font-size: 14px;
+  }
+
+  .storeTypeHome .monthNoVisit {
+    padding: 10px;
+    margin: 10px;
+    border-radius: 5px;
+    background-color: #ebf4ff;
+  }
+
+  .storeTypeHome .leftContent {
+    padding-right: 68px;
+    position: relative;
+  }
+
+  .storeTypeHome .monthNoVisitStatstext {
+    font-size: 12px;
+    background-color: #0057ba;
+    position: absolute;
+    right: 0;
+    top: 6px;
+    padding: 2px 6px 2px 12px;
+    color: #fff;
+  }
+
+  .colBack {
+    width: 100%;
+    height: 100%;
+    display: block;
+    /* overflow: unset; */
+    position: relative;
+    z-index: 2;
+    float: left;
+    z-index: 2;
+
+    .back {
+      position: absolute;
+      background: rgb(226, 240, 217);
+      height: 100%;
+      display: block;
+      overflow: hidden;
+      /* z-index: 1; */
+      border-radius: 12px;
+      bottom: -4px;
+    }
+
+    .backLeft {
+      width: 45%;
+      left: -12px;
+    }
+
+    .backRight {
+      width: 50%;
+      left: calc(50% - 12px);
+    }
+
+    .van-col {
+      position: relative;
+      z-index: 3;
+    }
+  }
+}
+.shareCommonTarget {
+  color: #fff;
+  .van-cell {
+    background-color: unset !important;
+    padding: 0 !important;
+  }
+  :deep(*) {
+    border: none !important;
+  }
+
+  .table-headermdhome {
+    font-size: 14px;
+  }
+
+  .table-headermdhome th.el-table__cell > .cell {
+    white-space: pre;
+  }
+
+  .table-headermd .el-table__header,
+  .table-headermd .el-table__body {
+    width: 100% !important;
+  }
+
+  .table-headermdhome.van-cell {
+    padding: 0 6px;
+    height: 100%;
+  }
+
+  .table-headermd th.el-table__cell > .cell {
+    padding: 0 4px;
+    text-align: center;
+  }
+
+  .table-headermdhometh.el-table__cell:first-child > .cell {
+    text-align: left;
+  }
+
+  .table-headermd th.el-table__cell {
+    background-color: #1989fa;
+    color: #fff;
+  }
+
+  .table-headermdhome th.el-table__cell {
+    // background-color: #fff;
+    color: #fff;
+  }
+
+  .table-headermd .el-table__cell {
+    padding: 4px 0;
+  }
+
+  .table-headermdhome.el-table .cell {
+    padding: 0 4px;
+    text-align: center;
+  }
+
+  .table-headermdhome .tipTitle {
+    overflow: hidden;
+    text-overflow: ellipsis;
+    display: -webkit-box;
+    -webkit-box-orient: vertical;
+    -webkit-line-clamp: 2;
+    text-align: center;
+  }
+
+  .table-headermd::before {
+    height: 0;
+  }
+
+  .table-headermd .cell,
+  .el-table--border .el-table__cell:first-child .cell {
+    padding: 0 4px;
+  }
+  .van-hairline--top-bottom::after,
+  .van-hairline-unset--top-bottom::after {
+    border-width: 0;
+  }
+  .van-cell::after {
+    border-width: 0;
+  }
+  .van-collapse-item--border::after {
+    border-width: 0;
+  }
+  .van-cell__right-icon {
+    display: none;
+  }
+  .text {
+    background: url('../assets/textBack.png') no-repeat;
+    width: 100%;
+    height: vw(94);
+    background-size: cover;
+    color: #7d0207;
+    font-size: vw(36);
+    text-align: center;
+    line-height: vw(94);
+    // margin-top: vw(152);
+    // margin-bottom: vw(45);
+    margin: vw(35) 0 vw(15) 0;
+    font-weight: bold;
+  }
+}
+</style>

src/views/week/dailyDetails.vue

@@ -212,7 +212,7 @@
             align-items: center;
             cursor: pointer;
           "
-          v-if="reportTarget.isHistory == '0' && !YFQuota"
+          v-if="reportTarget.isHistory == '0'"
           @click="isTarget = !isTarget">
           <van-checkbox v-model="isTarget" style="margin-right: 10px" @click.stop></van-checkbox>
           <span>日报指标</span>