storevisit-ui-mobile/src/views/week/daily.vue

<template>
  <div class="daily">
    <!--        顶部条-->
    <div class="navBarTOP">
      <van-nav-bar class="navBar" title="填写日报" left-arrow @click-left="onClickLeft">
        <template #right>
          <span
            v-if="temporaryShow != 'N'"
            @click="tsContentsFn"
            style="
              color: white;
              background: #74a4d9;
              display: block;
              padding: 6px 10px;
              border-radius: 6px;
            "
            >暂存</span
          >
        </template>
      </van-nav-bar>
    </div>
    <div class="lineGrey"></div>
    <div class="lineGrey"></div>
    <div class="lineGrey"></div>
    <div class="lineGrey"></div>
    <div style="height: 4px"></div>
    <!--        主体内容-->
    <div class="container linepAdd">
      <van-collapse v-model="activeNames" v-if="!YFQuota">
        <!-- YFQuota:应用服务平台 不显示各项指标 -->
        <van-collapse-item v-if="!GZQuota" title="拜访数据(实时)" name="7">
          <visitedRealTime
            :reportTargetAll="reportTargetAll"
            :powerGrade="powerGrade"
            :JZQuota="JZQuota"></visitedRealTime>
        </van-collapse-item>
        <van-collapse-item title="建店布机" v-if="!JZQuota && !GZQuota" name="2">
          <createStoreBJ :reportTargetAll="reportTargetAll"></createStoreBJ>
        </van-collapse-item>
        <van-collapse-item v-if="!JZQuota && !GZQuota" name="33" title="下单点数">
          <placeOrder :reportTargetAll="reportTargetAll"></placeOrder>
        </van-collapse-item>
        <van-collapse-item name="16" v-if="!JZQuota && !GZQuota" title="专业时时丽分销店下单">
          <ZYPlaceOrder :reportTargetAll="reportTargetAll"></ZYPlaceOrder>
        </van-collapse-item>
        <van-collapse-item v-if="type != 3 && type != 4" name="1" :title="saptitle">
          <performanceSAP :reportTargetAll="reportTargetAll" :JZQuota="JZQuota"></performanceSAP>
        </van-collapse-item>
        <van-collapse-item v-if="GZQuota" name="43" 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.gzCtzjMonthAct)
                }}</span>
              </p></van-col
            >
            <van-col span="12"
              ><p>
                业绩实际:<span class="colorbalck">{{
                  Micrometer(reportTargetAll.gzCtzjQuarterAct)
                }}</span>
              </p></van-col
            >
            <!--            <van-col span="12" ><p>业绩达成率:<span class="colorbalck">{{ Micrometer(reportTargetAll.gzCtzjMonthSuccessRate) }}%</span></p></van-col>-->
            <!--            <van-col span="12" ><p>业绩达成率:<span class="colorbalck">{{ Micrometer(reportTargetAll.gzCtzjQuarterSuccessRate) }}%</span></p></van-col>-->
            <van-col span="12"
              ><p>
                业绩成长率:<span class="colorbalck"
                  >{{ reportTargetAll.gzCtzjMonthGrowRate }}%</span
                >
              </p></van-col
            >
            <van-col span="12"
              ><p>
                业绩成长率:<span class="colorbalck"
                  >{{ reportTargetAll.gzCtzjQuarterGrowRate }}%</span
                >
              </p></van-col
            >
          </van-row>
        </van-collapse-item>
        <van-collapse-item v-if="GZQuota" name="42" 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">{{ Micrometer(reportTargetAll.gzZgwqMonthSuccessRate) }}%</span></p></van-col>-->
            <!--            <van-col span="12" ><p>业绩达成率:<span class="colorbalck">{{ Micrometer(reportTargetAll.gzZgwqQuarterSuccessRate) }}%</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>
        </van-collapse-item>
        <van-collapse-item v-if="GZQuota" name="41" 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>
        </van-collapse-item>
        <van-collapse-item v-if="GZQuota" name="40" title="今日拜访">
          <van-row>
            <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>
        </van-collapse-item>
        <van-collapse-item v-if="!JZQuota && !GZQuota" name="11" title="专业时时丽SAP(千元)">
          <ZYSAP :reportTargetAll="reportTargetAll"></ZYSAP>
        </van-collapse-item>
        <van-collapse-item v-if="!JZQuota && !GZQuota" name="29" title="瓷砖胶SAP(千元)">
          <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.czjSapMonthAct)
                }}</span>
              </p></van-col
            >
            <van-col span="12"
              ><p>
                实际:<span class="colorbalck">{{
                  Micrometer(reportTargetAll.czjSapQuarterAct)
                }}</span>
              </p></van-col
            >
            <van-col span="12"
              ><p>
                达成率:<span class="colorbalck">{{ reportTargetAll.czjSapMonthSuccessRate }}%</span>
              </p></van-col
            >
            <van-col span="12"
              ><p>
                达成率:<span class="colorbalck"
                  >{{ reportTargetAll.czjSapQuarterSuccessRate }}%</span
                >
              </p></van-col
            >
            <van-col span="12"
              ><p>
                成长率:<span class="colorbalck">{{ reportTargetAll.czjSapMonthGrowRate }}%</span>
              </p></van-col
            >
            <van-col span="12"
              ><p>
                成长率:<span class="colorbalck">{{ reportTargetAll.czjSapQuarterGrowRate }}%</span>
              </p></van-col
            >
          </van-row>
        </van-collapse-item>
        <van-collapse-item name="17" v-if="!JZQuota && !GZQuota" title="超好贴分销店下单">
          <veryGoodPlaceOrder :reportTargetAll="reportTargetAll"></veryGoodPlaceOrder>
        </van-collapse-item>
        <van-collapse-item v-if="JZQuota" name="23" title="展厅上样">
          <van-row>
            <van-col span="24"
              ><p>
                当月新增店数:<span class="colorbalck">{{
                  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>
        </van-collapse-item>
        <van-collapse-item v-if="JZQuota" name="22" 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>
        </van-collapse-item>
        <van-collapse-item v-if="JZQuota" name="21" 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>
        </van-collapse-item>
        <!-- 生动化陈列 sku -->
        <div v-if="photoSkuImgSummaryeList && photoSkuImgSummaryeList.length" class="SKUTable">
          <p style="padding-bottom: 10px; font-size: 14px; color: #1e5398; font-weight: 500">
            SKU陈列照识别结果
          </p>
          <p style="padding-bottom: 10px; font-size: 14px; font-weight: 500">
            目前识别桶装和战略产品合计106个，后续会增加被识别产品数
          </p>
          <el-table
            :data="photoSkuImgSummaryeList"
            border
            class="table-headermd1"
            style="width: 100%">
            <el-table-column label="序号" type="index" width="50px" align="center" />
            <el-table-column label="门店名称（编号）" prop="name" align="center">
              <template slot-scope="scope">
                {{ scope.row.storeName }}({{ scope.row.storeCode }})
              </template>
            </el-table-column>
            <el-table-column label="SKU数量" prop="count" width="80px" align="center" />
          </el-table>
        </div>
      </van-collapse>
      <div class="contentContainer">
        <!-- isHistory 是否为历史汇报：0-新汇报 1-历史汇报 -->
        <reportCustom
          ref="reportCustom"
          v-if="reportTarget.isHistory == '0'"
          :reportCustomData="reportTarget.customTaskList"></reportCustom>
        <template v-else>
          <div v-if="GZQuota">
            <p class="contentContainerTitle">今日项目跟进数<span class="colorRed">(必填)</span></p>
            <div style="padding: 10px 0">
              <van-field v-model="reportContents[2].projectFollowNum" type="digit" />
            </div>
            <p class="contentContainerTitle">
              今日TUC成功报备数量<span class="colorRed">(必填)</span>
            </p>
            <div style="padding: 10px 0">
              <van-field v-model="reportContents[3].tucReportingSuccessNum" type="digit" />
            </div>
          </div>
          <div
            v-if="
              (this.$route.query.reportId && notVisitReason) || reportTarget.showNotVisitReason
            ">
            <p class="contentContainerTitle">
              截至日报提交时间，今日拜访0家店的原因<span class="colorRed">(必填)</span>
            </p>
            <div style="padding: 10px 0">
              <van-field
                v-model="notVisitReason"
                rows="3"
                autosize
                maxlength="1000"
                show-word-limit
                type="textarea"
                :formatter="formatter" />
            </div>
          </div>
          <p class="contentContainerTitle">
            今日机会与挑战总结<span class="colorRed">(必填)</span>
          </p>
          <div style="padding: 10px 0">
            <van-field
              v-model="reportContents[0].dayContent"
              rows="4"
              autosize
              maxlength="800"
              show-word-limit
              type="textarea"
              :formatter="formatter" />
          </div>
          <p class="contentContainerTitle">明日工作规划 <span class="colorRed">(必填)</span></p>
          <div style="padding: 10px 0">
            <van-field
              v-model="reportContents[1].dayContent"
              rows="4"
              autosize
              maxlength="800"
              show-word-limit
              type="textarea"
              :formatter="formatter" />
          </div>
        </template>
      </div>
      <br />
    </div>
    <div class="contentborder">
      <van-button type="info" size="small" plain class="Btn1" @click="submint">提交日报</van-button>
    </div>
    <div class="lineGrey"></div>
    <div class="lineGrey"></div>
    <div class="lineGrey"></div>
    <div class="lineGrey"></div>
  </div>
</template>

<script>
import {
  userTodayPlanNum,
  updateReport,
  getReportInfo,
  getDetailById,
  tsContents,
  buryingPoint,
  getSkuDetailById,
} from '@/api/index';
import visitedRealTime from '@/views/componentsTarget/visitedRealTime';
import createStoreBJ from '@/views/componentsTarget/createStoreBJ';
import placeOrder from '@/views/componentsTarget/placeOrder';
import ZYPlaceOrder from '@/views/componentsTarget/ZYPlaceOrder';
import performanceSAP from '@/views/componentsTarget/performanceSAP';
import ZYSAP from '@/views/componentsTarget/ZYSAP';
import veryGoodPlaceOrder from '@/views/componentsTarget/veryGoodPlaceOrder';
import reportCustom from './reportCustom';

export default {
  name: 'daily',
  components: {
    visitedRealTime,
    createStoreBJ,
    placeOrder,
    ZYPlaceOrder,
    performanceSAP,
    ZYSAP,
    veryGoodPlaceOrder,
    reportCustom,
  },
  data() {
    return {
      show: true,
      num: 0,
      todayGoal: {},
      progressWidth: 0,
      activeNames: [
        '1',
        '2',
        '3',
        '4',
        '5',
        '6',
        '7',
        '8',
        '16',
        '17',
        '20',
        '21',
        '22',
        '23',
        '29',
        '11',
        '33',
        '40',
        '41',
        '42',
        '43',
      ],
      powerGrade: '',
      value: '2',
      message: '',
      isclick: true,
      saptitle: '业绩目标SAP(千元)',
      reportTargetAll: {},
      reportTarget: {},
      temporaryShow: '',
      projectFollowNum: '',
      reportingNum: '',
      tucReportingSuccessNum: '',
      reportContents: [
        {
          dayContent: '',
          contentTime: '',
          type: 2,
          status: '1',
        },
        {
          dayContent: '',
          contentTime: '',

          type: 3,
          status: '1',
        },
        {
          dayContent: '',
          contentTime: '',
          projectFollowNum: '',
          type: 3,
          status: '1',
        },
        {
          dayContent: '',
          contentTime: '',
          tucReportingSuccessNum: '',
          type: 3,
          status: '1',
        },
      ],
      type: '-1',
      JZQuota: false, //家装
      GZQuota: false, //工装
      YFQuota: false, //应用服务
      titlejz: '',
      notVisitReason: '', //今日拜访0家店的原因；
      photoSkuImgSummaryeList: null,
    };
  },
  created() {
    this.powerGrade = localStorage.getItem('powerGrade');
    this.temporaryShow = this.$route.query.temporaryShow;
    if (this.$route.query.reportId != undefined) {
      this.getDetailById();
    } else {
      this.getReportInfo();
    }
  },
  watch: {
    $route(to, from) {
      this.powerGrade = localStorage.getItem('powerGrade');
      if (to.path == '/daily') {
        this.temporaryShow = this.$route.query.temporaryShow;
        if (this.$route.query.reportId != undefined) {
          this.getDetailById();
        } else {
          this.notVisitReason = '';
          this.reportContents = [
            {
              dayContent: '',
              contentTime: '',
              type: 2,
              status: '1',
            },
            {
              dayContent: '',
              contentTime: '',

              type: 3,
              status: '1',
            },
            {
              dayContent: '',
              contentTime: '',
              projectFollowNum: '',
              type: 3,
              status: '1',
            },
            {
              dayContent: '',
              contentTime: '',
              tucReportingSuccessNum: '',
              type: 3,
              status: '1',
            },
          ];
          this.getReportInfo();
        }
      }
    },
  },
  methods: {
    // return value.replace(/[^\u4E00-\u9FA5|\d|\a-zA-Z|\r\n\s,.?!，。？！"…—（）&_%【】{}:“”‘#~@;：；￥$=()-+-·——/*{}[\]]|\r\n\s/g, '');
    formatter(value) {
      return value.replace(
        /[\uD83C|\uD83D|\uD83E][\uDC00-\uDFFF][\u200D|\uFE0F]|[\uD83C|\uD83D|\uD83E][\uDC00-\uDFFF]|[0-9|*|#]\uFE0F\u20E3|[0-9|#]\u20E3|[\u203C-\u3299]\uFE0F\u200D|[\u203C-\u3299]\uFE0F|[\u2122-\u2B55]|\u303D|[\A9|\AE]\u3030|\uA9|\uAE|\u3030/gi,
        ''
      );
    },
    getDetailById() {
      let loading1 = this.$toast.loading({
        duration: 0,
        message: '加载中...',
        forbidClick: true,
      });
      this.reportContents[0].dayContent = '';
      getDetailById({ reportId: this.$route.query.reportId }).then((res) => {
        loading1.clear();
        if (res.code == 200) {
          if (res.data.status != '0' && res.data.status != '2') {
            this.$dialog
              .alert({
                title: '系统提示',
                message: '日报已提交或过期',
              })
              .then(() => {
                window.location.replace(window.location.origin + '/mobile/home');
              });
          } else {
            localStorage.setItem('powerGrade', res.data.positionId);
            localStorage.setItem('userDeptLevel', res.data.userDeptLevel);
            this.GZQuota = false;
            this.JZQuota = false;
            this.YFQuota = res.data.postType == 'YF' ? true : false;
            if (res.data.postType == 'JZ') {
              this.JZQuota = true;
            } else if (res.data.postType == 'GZ') {
              this.GZQuota = true;
              this.saptitle = '公裝业绩SAP(千元)';
            } else {
              this.saptitle = '业绩目标SAP(千元)';
            }
            if (this.reportTarget.projectFollowNum) {
              this.projectFollowNum = this.reportTarget.projectFollowNum;
              this.reportingNum = this.reportTarget.reportingNum;
              this.tucReportingSuccessNum = this.reportTarget.tucReportingSuccessNum;
            }

            this.type = res.data.userType;
            if (res.data.reportContents.length > 0) {
              this.reportContents = res.data.reportContents;
              if (res.data.reportContents.length < 2) {
                res.data.reportContents.push({
                  dayContent: '',
                  contentTime: '',
                  type: 3,
                  status: '1',
                });
              }
              if (res.data.reportContents.length > 2) {
                if (res.data.reportContents[2].projectFollowNum != null) {
                  this.projectFollowNum = res.data.reportContents[2].projectFollowNum;
                } else {
                  this.projectFollowNum = '';
                  res.data.reportContents[2].projectFollowNum = '';
                }
                if (res.data.reportContents[3].tucReportingSuccessNum != null) {
                  this.tucReportingSuccessNum = res.data.reportContents[3].tucReportingSuccessNum;
                } else {
                  this.tucReportingSuccessNum = '';
                  res.data.reportContents[3].tucReportingSuccessNum = '';
                }
              }
            }
            this.reportTargetAll = res.data.reportTargetAll;
            this.reportTarget = res.data;
            this.notVisitReason = this.reportTarget.notVisitReason;
          }
          this.getskuDetailByIdFun();
        } else {
          this.$toast(res.msg);
        }
      });
    },
    tsContentsFn() {
      this.toastLoading(0, '加载中...', true);
      if (this.isclick) {
        // 旧的
        if (this.reportTarget.isHistory == '1') {
          this.reportContents[0].contentTime = this.parseTime(new Date(), '{y}-{m}-{d}');
          this.reportContents[1].contentTime = this.parseTime(new Date(), '{y}-{m}-{d}');
          if (this.GZQuota) {
            this.reportContents[2].contentTime = this.parseTime(new Date(), '{y}-{m}-{d}');
            this.reportContents[3].contentTime = this.parseTime(new Date(), '{y}-{m}-{d}');
          }
          this.reportTarget.reportContents = this.reportContents;
          this.reportTarget.notVisitReason = this.notVisitReason;
          this.tsContentsFun();
        } else {
          // 新的
          this.filterReportCustomData((reportCustomAnswers) => {
            this.tsContentsFun(reportCustomAnswers);
          });
        }
      }
    },
    tsContentsFun(reportCustomAnswers) {
      if (reportCustomAnswers) this.reportTarget.reportCustomAnswers = reportCustomAnswers;
      this.reportTarget.status = '1';
      this.isclick = false;
      tsContents(this.reportTarget).then((res) => {
        this.toastLoading().clear();
        this.isclick = true;
        if (res.code == 200) {
          this.$dialog
            .alert({
              title: '系统提示',
              message: '暂存成功',
            })
            .then(() => {});
        } else {
          this.$toast.fail(res.msg);
        }
      });
    },
    // 提交日报
    submint() {
      this.toastLoading(0, '加载中...', true);
      if (this.isclick) {
        // 旧的
        if (this.reportTarget.isHistory == '1') {
          if (this.GZQuota) {
            if (this.reportContents[2].projectFollowNum.trim() == '') {
              this.$toast('请输入今日项目跟进数量！');
              return false;
            }
            if (this.reportContents[3].tucReportingSuccessNum.trim() == '') {
              this.$toast('请输入今日TUC成功报备数量！');
              return false;
            }
          }
          if (
            (this.$route.query.reportId && this.notVisitReason) ||
            this.reportTarget.showNotVisitReason
          ) {
            if (this.notVisitReason.trim() == '') {
              this.$toast('请输入今日拜访0家店的原因！');
              return false;
            }
            this.reportTarget.notVisitReason = this.notVisitReason;
          }
          if (this.reportContents[0].dayContent.trim() == '') {
            this.$toast('请输入日报内容！');
            return false;
          } else if (this.reportContents[0].dayContent.length > 800) {
            this.$toast('日报内容太长！');
            return false;
          } else if (this.reportContents[1].dayContent.trim() == '') {
            this.$toast('请输入明日工作规划！');

            return false;
          } else if (this.reportContents[1].dayContent.length > 800) {
            this.$toast('明日工作规划内容太长！');
            return false;
          }
          this.reportContents[0].contentTime = this.parseTime(new Date(), '{y}-{m}-{d}');
          this.reportContents[1].contentTime = this.parseTime(new Date(), '{y}-{m}-{d}');
          if (this.GZQuota) {
            this.reportContents[2].contentTime = this.parseTime(new Date(), '{y}-{m}-{d}');
            this.reportContents[3].contentTime = this.parseTime(new Date(), '{y}-{m}-{d}');
          }
          this.reportTarget.reportContents = this.reportContents;
          this.submintFun();
        } else {
          // 新的
          this.reportCustomTabstoreVal((reportCustomAnswers) => {
            this.submintFun(reportCustomAnswers);
          });
        }
      }
    },
    submintFun(reportCustomAnswers) {
      this.reportTarget.status = '1';
      if (reportCustomAnswers) this.reportTarget.reportCustomAnswers = reportCustomAnswers;
      this.isclick = false;
      updateReport(this.reportTarget).then((res) => {
        this.toastLoading().clear();
        this.isclick = true;
        if (res.code == 200) {
          if (this.reportTarget.reportPostType == 'fx') {
            this.$dialog
              .alert({
                message: '已提交，是否分享',
                showCancelButton: true,
                confirmButtonText: '分享',
                cancelButtonText: '返回首页',
                className: 'dailyShareBtn',
              })
              .then(() => {
                buryingPoint({
                  systemModel: '日报审核',
                  buryingPointType: 2,
                  buryingPointValue: this.$route.query.reportId,
                  buryingPointName: '日报提交分享',
                  buryingPointPosition: '日报提交',
                });
                // 跳转历史汇报详情 分享汇报
                this.$router.replace({
                  path: 'dailyDetails',
                  query: { reportId: res.data, sourceType: 'daily' },
                });
              })
              .catch(() => {
                if (this.$route.query.reportId != undefined) {
                  window.location.replace(window.location.origin + '/mobile/home');
                } else {
                  this.onClickLeft();
                }
              });
          } else {
            this.$dialog
              .alert({
                title: '系统提示',
                message: '提交成功',
              })
              .then(() => {
                if (this.$route.query.reportId != undefined) {
                  window.location.replace(window.location.origin + '/mobile/myHistoricalDaily');
                } else {
                  this.onClickLeft();
                }
              });
          }
        } else {
          this.$toast.fail(res.msg);
        }
      });
    },
    reportCustomTabstoreVal(callback) {
      // 必填校验
      this.$refs.reportCustom.$refs.tabstoreVal
        .validate()
        .then(() => {
          // 验证通过
          this.filterReportCustomData(callback);
        })
        .catch((errors) => {
          this.toastLoading().clear();
          return;
        });
    },
    filterReportCustomData(callback) {
      let reportCustomData = this.$refs.reportCustom ? this.$refs.reportCustom.fromData : {} || {};
      let reportCustomAnswers = [];
      for (let i = 0; i < reportCustomData.length; i++) {
        let customData = reportCustomData[i].sfaReportCustomCollections;
        for (let x = 0; x < customData.length; x++) {
          if (
            customData[x].reportCustomCollectionType == 'dx' ||
            customData[x].reportCustomCollectionType == 'duox'
          ) {
            let optionData = customData[x].sfaReportCustomOptions;
            for (let y = 0; y < optionData.length; y++) {
              if (optionData[y].answerValue == 'Y') {
                reportCustomAnswers.push({
                  reportCustomTaskId: customData[x].reportCustomTaskId,
                  reportCustomCollectionId: optionData[y].reportCustomCollectionId,
                  reportCustomOptionId: optionData[y].reportCustomOptionId,
                  answerValue: 'Y',
                });
              }
            }
          } else {
            if (customData[x].answerValue)
              reportCustomAnswers.push({
                reportCustomTaskId: customData[x].reportCustomTaskId,
                reportCustomCollectionId: customData[x].reportCustomCollectionId,
                answerValue: customData[x].answerValue,
              });
          }
        }
      }
      console.log(reportCustomAnswers);
      callback && callback(reportCustomAnswers);
    },
    // 获取日报数据
    getReportInfo() {
      let loading1 = this.$toast.loading({
        duration: 0,
        message: '加载中...',
        forbidClick: true,
      });
      this.reportContents[0].dayContent = '';
      getReportInfo({ isContent: true }).then((res) => {
        loading1.clear();
        localStorage.setItem('powerGrade', res.data.positionId);
        localStorage.setItem('userDeptLevel', res.data.userDeptLevel);
        this.powerGrade = res.data.positionId;
        this.showButton = res.data.showButton;
        this.type = res.data.userType;
        this.reportTargetAll = res.data.reportTargetAll;
        this.reportTarget = res.data;
        this.GZQuota = false;
        this.JZQuota = false;
        this.YFQuota = res.data.postType == 'YF' ? true : false;
        if (res.data.postType == 'JZ') {
          this.JZQuota = true;
        } else if (res.data.postType == 'GZ') {
          this.GZQuota = true;
          this.saptitle = '公裝业绩SAP(千元)';
        } else {
          this.saptitle = '业绩目标SAP(千元)';
        }
        if (res.data.reportContents && res.data.reportContents.length > 0) {
          this.reportContents = res.data.reportContents;
          if (res.data.reportContents.length > 2) {
            this.projectFollowNum = res.data.reportContents[2].projectFollowNum;
            this.tucReportingSuccessNum = res.data.reportContents[3].tucReportingSuccessNum;
          }
        }
        this.notVisitReason = res.data.notVisitReason;
        this.getskuDetailByIdFun();
      });
    },
    getskuDetailByIdFun() {
      if (this.reportTarget.reportPostType != 'fx') return;
      getSkuDetailById({ reportId: this.reportTarget.id }).then((res) => {
        if (res.code == 200) {
          this.photoSkuImgSummaryeList = res.data;
        } else {
          this.photoSkuImgSummaryeList = null;
        }
      });
    },
    userTodayPlanNum() {
      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('storeType', res.data.user.type);
        } else {
          this.$toast.fail(res.msg);
        }
      });
    },
    onClickLeft() {
      this.$router.push('/home');
    },
  },
};
</script>

<style scoped lang="scss">
.container {
  margin: 10px;
}
.container .van-collapse-item {
  margin-bottom: 10px;
  border-radius: 6px;
  overflow: hidden;
}
.linepAdd p {
  margin: 6px 0 0 0;
  font-size: 14px;
  color: #666;
}

.linepAdd .texttitle {
  color: #0057ba;
  position: relative;
  padding-left: 10px;
}

.linepAdd .texttitle2 {
  padding-left: 0;
}

.linepAdd .texttitle .opint {
  position: absolute;
  left: 0px;
  top: 6px;
  margin-right: 6px;
  display: inline-block;
  width: 6px;
  height: 6px;
  border-radius: 10px;
  background-color: #004d8c;
}

.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;
}
</style>
<style lang="scss">
.daily {
  .SKUTable {
    padding-bottom: 10px;
    .table-headermd1 {
      font-size: 12px;
      text-align: center;
      position: initial;
      width: 98% !important;
      margin: 0 auto;
      border-right: 0;
      border-radius: 10px;
      .el-table__cell {
        padding: 6px 0 !important;
      }
      thead {
        .el-table__cell {
          background-color: #1989fa;
          color: #fff;
        }
      }
    }
  }
}
.linepAdd .van-cell__title {
  color: #1e5398;
  font-weight: 500;
}
.linepAdd .contentContainer {
  background-color: white;
  border-radius: 8px;
  padding: 10px 16px;
  margin-bottom: 10px;
}

.linepAdd .contentContainer .contentContainerTitle {
  color: #222;
}

.linepAdd .contentContainer .contentContainerTitle span {
  font-size: 12px;
  color: #666;
}
.linepAdd .contentContainer .van-field__control {
  background-color: #f8f8f8;
  padding: 10px;
  border-radius: 8px;
}
.linepAdd .contentContainer .van-cell {
  padding: 0;
}
.van-dialog__confirm,
.van-dialog__confirm:active {
  color: #0057ba;
}
.linepAdd .contentContainer .contentContainerTitle .colorRed {
  color: red;
}
.dailyShareBtn {
  .van-dialog__confirm {
    // border: 1px solid #ccc;
    // border-bottom: none;
  }
  .van-hairline--left {
    background: #0057ba;
    color: #fff;
  }
}
</style>