Просмотр исходного кода

feature_20260316_日报分享内容自定义配置

zhujindu 1 месяц назад
Родитель
Сommit
c5625541d9
2 измененных файлов с 611 добавлено и 0 удалено
  1. 1 0
      src/components/share.vue
  2. 610 0
      src/components/shareAtarget.vue

+ 1 - 0
src/components/share.vue

@@ -63,6 +63,7 @@
           </template>
         </template> -->
         <!-- 日报指标 -->
+        <!-- <template v-if=""></template> -->
         <!-- 日报填写内容 -->
         <!-- 今日拜访照片 -->
         <template v-if="photosData && photosData.length">

+ 610 - 0
src/components/shareAtarget.vue

@@ -0,0 +1,610 @@
+<template>
+  <div class="Atarget">
+    <div v-if="type != 4" class="container linep">
+      <!-- performanceSAP 业绩目标SAP(千元)/公裝业绩SAP(千元) -->
+      <template v-if="type != 3 && type != 4" name="1" :title="saptitle">
+        <performanceSAP :reportTargetAll="reportTargetAll" :JZQuota="JZQuota"></performanceSAP>
+      </template>
+      <template v-if="powerGrade != 1 && !JZQuota && !GZdata" name="2" title="质感外墙SAP(千元)">
+        <zhiganwaiqiangSAP :reportTargetAll="reportTargetAll"></zhiganwaiqiangSAP>
+      </template>
+      <template v-if="powerGrade != 1 && !JZQuota && !GZdata" name="3" title="魔术漆SAP(千元)">
+        <moshouqiSAP :reportTargetAll="reportTargetAll"></moshouqiSAP>
+      </template>
+      <template v-if="powerGrade != 1 && !JZQuota && !GZdata" name="4" title="防水+背胶SAP(千元)">
+        <fangshuiSAP :reportTargetAll="reportTargetAll"></fangshuiSAP>
+      </template>
+      <template v-if="powerGrade != 1 && !JZQuota && !GZdata" name="5" title="内墙中高端SAP(千元)">
+        <neiqiangzhonggaoduanSAP :reportTargetAll="reportTargetAll"></neiqiangzhonggaoduanSAP>
+      </template>
+      <!-- 内外墙平涂SAP -->
+      <template name="6" v-if="powerGrade != 1 && !JZQuota && !GZdata" title="内外墙平涂SAP(千元)">
+        <neiwaiqiangpingtu :reportTargetAll="reportTargetAll"></neiwaiqiangpingtu>
+      </template>
+      <template
+        v-if="!JZQuota && !GZdata && [1, 4, 5].indexOf(powerGrade) !== -1"
+        name="7"
+        title="专业时时丽SAP(千元)">
+        <ZYSAP :reportTargetAll="reportTargetAll"></ZYSAP>
+      </template>
+      <template
+        v-if="!JZQuota && !GZdata && [1, 4, 5].indexOf(powerGrade) !== -1"
+        name="8"
+        :title="'瓷砖胶SAP(千元)'">
+        <cizhuanjiaoSAP :reportTargetAll="reportTargetAll"></cizhuanjiaoSAP>
+      </template>
+      <template v-if="GZdata" name="9" title="纯态之家SAP(千元)">
+        <chunTaiSAP :reportTargetAll="reportTargetAll"></chunTaiSAP>
+      </template>
+      <template v-if="GZdata" name="10" title="商机关联的质感外墙业绩SAP(千元)">
+        <van-row style="margin-top: -10px">
+          <van-col span="12"><span class="leftTitle">本月</span></van-col
+          ><van-col span="12"><span class="rightTitle">本季</span></van-col>
+          <van-col span="12"
+            ><p>
+              业绩实际:<span class="colorbalck">{{
+                Micrometer(reportTargetAll.gzZgwqMonthAct)
+              }}</span>
+            </p></van-col
+          >
+          <van-col span="12"
+            ><p>
+              业绩实际:<span class="colorbalck">{{
+                Micrometer(reportTargetAll.gzZgwqQuarterAct)
+              }}</span>
+            </p></van-col
+          >
+          <van-col span="12"
+            ><p>
+              业绩成长率:<span class="colorbalck">{{ reportTargetAll.gzZgwqMonthGrowRate }}%</span>
+            </p></van-col
+          >
+          <van-col span="12"
+            ><p>
+              业绩成长率:<span class="colorbalck"
+                >{{ reportTargetAll.gzZgwqQuarterGrowRate }}%</span
+              >
+            </p></van-col
+          >
+        </van-row>
+      </template>
+      <template v-if="GZdata" name="11" title="累计出货有效客户">
+        <van-row>
+          <!--            <van-col span="12"><span class="leftTitle">全年开户</span></van-col><van-col span="12"><span class="rightTitle">本月报备</span></van-col>-->
+          <van-col span="12"
+            ><p>
+              全年实际:<span class="colorbalck">{{
+                Micrometer(reportTargetAll.gzKhljYearAct)
+              }}</span>
+            </p></van-col
+          >
+          <!--            <van-col span="12" ><p>报备成功数:<span class="colorbalck">{{ Micrometer(reportTargetAll.gzBbMonthSuccessNum) }}</span></p></van-col>-->
+          <!--            <van-col span="12"><p>&nbsp;</p></van-col>-->
+          <van-col span="12"
+            ><p>
+              全年目标:<span class="colorbalck">{{
+                Micrometer(reportTargetAll.gzKhljYearTarget)
+              }}</span>
+            </p></van-col
+          >
+          <van-col span="12"><p>&nbsp;</p></van-col>
+          <van-col span="12"
+            ><p>
+              目标达成率:<span class="colorbalck"
+                >{{ Micrometer(reportTargetAll.gzKhljSuccessRate) }}%</span
+              >
+            </p></van-col
+          >
+        </van-row>
+      </template>
+      <template v-if="GZdata" name="12" title="今日拜访">
+        <van-row style="margin-top: -10px">
+          <van-col span="12"
+            ><p>
+              公装客户数:<span class="colorbalck">{{
+                Micrometer(reportTargetAll.gzVisitCustomerNum)
+              }}</span>
+            </p></van-col
+          >
+          <van-col span="12"
+            ><p>
+              工地数:<span class="colorbalck">{{ Micrometer(reportTargetAll.gzVisitGdNum) }}</span>
+            </p></van-col
+          >
+          <van-col span="12"
+            ><p>
+              潜在客户数:<span class="colorbalck">{{
+                Micrometer(reportTargetAll.gzVisitQzCustomerNum)
+              }}</span>
+            </p></van-col
+          >
+        </van-row>
+      </template>
+      <template v-if="JZQuota" name="13" title="展厅上样">
+        <van-row>
+          <van-col span="24"
+            ><p>
+              当月新增店数:<span class="colorbalck">{{
+                Micrometer(reportTargetAll.exhibitionHallMonthAct)
+              }}</span>
+            </p></van-col
+          >
+          <van-col span="12"
+            ><p>
+              全年实际店数:<span class="colorbalck"
+                >{{ Micrometer(reportTargetAll.exhibitionHallYearAct) }}%</span
+              >
+            </p></van-col
+          >
+          <van-col span="12"
+            ><p>
+              全年达成进度率:<span class="colorbalck"
+                >{{ reportTargetAll.exhibitionHallYearRate }}%</span
+              >
+            </p></van-col
+          >
+        </van-row>
+      </template>
+      <template v-if="JZQuota" name="14" title="基材粉料过账(千元)">
+        <van-row>
+          <van-col span="12"><span class="leftTitle">本月实际</span></van-col
+          ><van-col span="12"><span class="rightTitle">本季实际</span></van-col>
+          <van-col span="12"
+            ><p>
+              客户数:<span class="colorbalck">{{ reportTargetAll.jcPostCustomerMonth }}</span>
+            </p></van-col
+          >
+          <van-col span="12"
+            ><p>
+              客户数:<span class="colorbalck">{{ reportTargetAll.jcPostCustomerQuarter }}</span>
+            </p></van-col
+          >
+          <van-col span="12"
+            ><p>
+              下单数(包):<span class="colorbalck">{{ reportTargetAll.jcPostOrderNumMonth }}</span>
+            </p></van-col
+          >
+          <van-col span="12"
+            ><p>
+              下单数(包):<span class="colorbalck">{{ reportTargetAll.jcPostOrderNumQuarter }}</span>
+            </p></van-col
+          >
+          <van-col span="12"
+            ><p>
+              下单销售额:<span class="colorbalck">{{
+                Micrometer(reportTargetAll.jcPostOrderPriceMonth)
+              }}</span>
+            </p></van-col
+          >
+          <van-col span="12"
+            ><p>
+              下单销售额:<span class="colorbalck">{{
+                Micrometer(reportTargetAll.jcPostOrderPriceQuarter)
+              }}</span>
+            </p></van-col
+          >
+          <van-col span="12"
+            ><p>
+              下单率:<span class="colorbalck">{{ reportTargetAll.jcPostOrderRateMonth }}%</span>
+            </p></van-col
+          >
+          <van-col span="12"
+            ><p>
+              下单率:<span class="colorbalck">{{ reportTargetAll.jcPostOrderRateQuarter }}%</span>
+            </p></van-col
+          >
+          <van-col span="24"><span class="leftTitle">年度累计实际</span></van-col>
+          <van-col span="24"
+            ><p>
+              客户数:<span class="colorbalck">{{ reportTargetAll.jcPostCustomerYear }}</span>
+            </p></van-col
+          >
+          <van-col span="24"
+            ><p>
+              下单数(包):<span class="colorbalck">{{ reportTargetAll.jcPostOrderNumYear }}</span>
+            </p></van-col
+          >
+          <van-col span="24"
+            ><p>
+              下单销售额:<span class="colorbalck">{{
+                Micrometer(reportTargetAll.jcPostOrderPriceYear)
+              }}</span>
+            </p></van-col
+          >
+          <van-col span="24"
+            ><p>
+              下单率:<span class="colorbalck">{{ reportTargetAll.jcPostOrderRateYear }}%</span>
+            </p></van-col
+          >
+        </van-row>
+      </template>
+      <template v-if="JZQuota" name="15" title="魔术漆过账(千元)">
+        <van-row>
+          <van-col span="12"><span class="leftTitle">本月实际</span></van-col
+          ><van-col span="12"><span class="rightTitle">本季实际</span></van-col>
+          <van-col span="12"
+            ><p>
+              客户数:<span class="colorbalck">{{ reportTargetAll.msqPostCustomerMonth }}</span>
+            </p></van-col
+          >
+          <van-col span="12"
+            ><p>
+              客户数:<span class="colorbalck">{{ reportTargetAll.msqPostCustomerQuarter }}</span>
+            </p></van-col
+          >
+          <van-col span="12"
+            ><p>
+              下单销售额:<span class="colorbalck">{{
+                Micrometer(reportTargetAll.msqPostOrderPriceMonth)
+              }}</span>
+            </p></van-col
+          >
+          <van-col span="12"
+            ><p>
+              下单销售额:<span class="colorbalck">{{
+                Micrometer(reportTargetAll.msqPostOrderPriceQuarter)
+              }}</span>
+            </p></van-col
+          >
+          <van-col span="12"
+            ><p>
+              下单率:<span class="colorbalck">{{ reportTargetAll.msqPostOrderRateMonth }}%</span>
+            </p></van-col
+          >
+          <van-col span="12"
+            ><p>
+              下单率:<span class="colorbalck">{{ reportTargetAll.msqPostOrderRateQuarter }}%</span>
+            </p></van-col
+          >
+          <van-col span="24"><span class="leftTitle">年度累计实际</span></van-col>
+          <van-col span="24"
+            ><p>
+              客户数:<span class="colorbalck">{{ reportTargetAll.msqPostCustomerYear }}</span>
+            </p></van-col
+          >
+          <van-col span="24"
+            ><p>
+              下单销售额:<span class="colorbalck">{{
+                Micrometer(reportTargetAll.msqPostOrderPriceYear)
+              }}</span>
+            </p></van-col
+          >
+          <van-col span="24"
+            ><p>
+              下单率:<span class="colorbalck">{{ reportTargetAll.msqPostOrderRateYear }}%</span>
+            </p></van-col
+          >
+        </van-row>
+      </template>
+    </div>
+  </div>
+</template>
+<script>
+import performanceSAP from '@/views/componentsTarget/performanceSAP';
+import neiwaiqiangpingtu from '@/views/componentsTarget/neiwaiqiangpingtu';
+import zhiganwaiqiangSAP from '@/views/componentsTarget/zhiganwaiqiangSAP';
+import moshouqiSAP from '@/views/componentsTarget/moshouqiSAP';
+import fangshuiSAP from '@/views/componentsTarget/fangshuiSAP';
+import neiqiangzhonggaoduanSAP from '@/views/componentsTarget/neiqiangzhonggaoduanSAP';
+export default {
+  components: {
+    performanceSAP,
+    neiwaiqiangpingtu,
+    zhiganwaiqiangSAP,
+    moshouqiSAP,
+    fangshuiSAP,
+    neiqiangzhonggaoduanSAP,
+  },
+  props: {
+    reportInfo: {
+      type: Object,
+    },
+  },
+  watch: {
+    reportInfo: {
+      handler(val) {
+        if (val.postType == 'GZ') {
+          this.GZdata = true;
+          this.saptitle = '公裝业绩SAP(千元)';
+        } else {
+          this.saptitle = '业绩目标SAP(千元)';
+          this.GZdata = false;
+        }
+        if (val.postType == 'JZ') {
+          this.JZQuota = true;
+        } else {
+          this.JZQuota = false;
+        }
+        this.reportInfoData = val;
+        this.powerGrade = val.positionId;
+        if (val.reportTargetAll != null) {
+          this.reportTargetAll = val.reportTargetAll;
+        }
+        this.type = val.userType;
+      },
+      deep: true,
+      immediate: true,
+    },
+  },
+  data() {
+    return {
+      type: '-1',
+      JZQuota: false,
+      GZdata: false,
+      saptitle: '业绩目标SAP(千元)',
+      powerGrade: '2',
+      reportTargetAll: {},
+      activeNames: [
+        '1',
+        '2',
+        '3',
+        '4',
+        '5',
+        '6',
+        '7',
+        '8',
+        '10',
+        '11',
+        '12',
+        '9',
+        '14',
+        '15',
+        '13',
+      ],
+    };
+  },
+};
+</script>
+
+<style scoped>
+.homeTitle {
+  padding: 6px 16px;
+}
+
+.homeTitle .van-icon__image {
+  width: 1.4em;
+  height: auto;
+}
+
+.container {
+  /* margin: 10px; */
+}
+
+.container .template {
+  margin-bottom: 10px;
+  border-radius: 6px;
+  overflow: hidden;
+}
+
+.progressContentlist {
+  font-size: 14px;
+  border-bottom: 1px dashed #f1f1f1;
+  padding: 10px 0;
+}
+
+.linep p {
+  margin: 10px 0 0 0;
+  font-size: 14px;
+  color: #666;
+}
+
+.leftTitle {
+  background-color: #74a4d9;
+  color: #fff;
+  display: inline-block;
+  padding: 0 4px;
+  border-radius: 2px;
+}
+
+.rightTitle {
+  background-color: #e7b4bb;
+  color: #fff;
+  display: inline-block;
+  padding: 0 4px;
+  border-radius: 2px;
+  white-space: nowrap;
+}
+</style>
+<style lang="scss">
+.myTab .van-tabs__nav--card {
+  margin: 0 !important;
+  border-left: 0;
+  border-right: 0;
+}
+.myTab .van-tabs__wrap,
+.van-tabs__nav--card {
+  height: 39px;
+}
+.myTab .van-tab {
+  line-height: 40px;
+}
+.linep .van-collapse-item__content {
+  color: #666;
+}
+.linep .van-collapse-item__content {
+  color: #666;
+}
+
+.linep .van-cell__title {
+  color: #1e5398;
+  font-weight: 500;
+  font-size: 16px;
+}
+
+.homeCellIcon {
+  line-height: 34px;
+}
+
+.homeTitle .van-cell__title {
+  color: #444;
+  font-size: 16px;
+  font-weight: bold;
+  padding-left: 4px;
+  line-height: 36px;
+  height: 36px;
+}
+
+.updataTime {
+  color: #999;
+  font-size: 12px;
+  text-align: center;
+}
+
+.homeTitle .van-tag--danger {
+  /* border-radius: 20px; */
+}
+
+.van-dialog__confirm,
+.van-dialog__confirm:active {
+  color: #0057ba;
+}
+
+.tipTitleBox p {
+  margin: 0;
+  line-height: 28px;
+  color: #555;
+}
+
+.tipTitleBox .p {
+  color: #555;
+  font-size: 16px;
+  border-bottom: 1px solid #f5f5f5;
+  margin: 0;
+  margin-bottom: 10px;
+  text-align: center;
+  padding: 14px 0px;
+}
+
+.storeTypeHome .van-collapse-item__content {
+  padding: 0;
+}
+
+.storeTypeHome .storeTypeHomeList .van-cell__title {
+  color: #4a4a4a;
+  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;
+  border-bottom-left-radius: 60px;
+  border-top-left-radius: 60px;
+  color: #fff;
+}
+.ABtarage {
+  .table-headermd {
+    font-size: 12px;
+    text-align: center;
+    position: initial;
+    width: 98% !important;
+    margin: 0 auto;
+    border-right: 0;
+  }
+  .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: #444;
+  }
+  .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;
+  }
+}
+.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;
+  }
+}
+</style>