fix: 修改路由

src/api/target-manage-app.js

@@ -4,7 +4,7 @@
  * @Author: 无尘
  * @Date: 2020-11-09 10:15:36
  * @LastEditors: 无尘
- * @LastEditTime: 2020-11-09 10:17:03
+ * @LastEditTime: 2020-11-12 11:26:09
  */
 
 import getFetch from './get-fetch.js';
@@ -13,6 +13,20 @@ let api = {
   // 指标管理
   getTargetList: '/', // 获取指标列表
 
+  getDaySet: '/', // 获取日指标设置
+  saveDaySet: {  // 保存日指标设置
+    url: '/',
+    method: 'post',
+    useFormData: true,
+    useIntercept: false
+  },
+  getSaleSet: '/', // 获取导购指标设置
+  saveSaleSet: { // 保存导购指标设置
+    url: '/',
+    method: 'post',
+    useFormData: true,
+    useIntercept: false
+  },
 };
 
 api = getFetch(api, '/hb-app-customer-web');

src/router/routes.js

@@ -4,7 +4,7 @@
  * @Author: 无尘
  * @Date: 2020-07-16 16:37:05
  * @LastEditors: 无尘
- * @LastEditTime: 2020-11-09 10:39:13
+ * @LastEditTime: 2020-11-12 11:33:51
  */
 import _import from './_import.js';
 
@@ -233,6 +233,16 @@ export const routes = [
             component: _import('apps/target-manage', 'target-store')
           },
           {
+            path: '/perfect-sale-target',
+            name: '完善导购指标',
+            component: _import('apps/target-manage', 'perfect-sale-target')
+          },
+          {
+            path: '/perfect-day-target',
+            name: '完善日指标',
+            component: _import('apps/target-manage', 'perfect-day-target')
+          },
+          {
             path: '/set-month-target',
             name: '设置月指标',
             component: _import('apps/target-manage', 'set-month-target')

src/views/apps/target-manage/perfect-sale-target.vue

+<!--
+ * @Descripttion: 完善导购指标
+ * @version: 1.0.0
+ * @Author: 无尘
+ * @Date: 2020-11-12 10:48:40
+ * @LastEditors: 无尘
+ * @LastEditTime: 2020-11-12 11:32:52
+-->
+<template>
+  <div class="app-detail-wrap common-right-wrap">
+    <div class="task-set-content border-box">
+      <div class="saler-set-title flex flex-space-between m-b-15">
+        <div class="saler-set-title_left">
+          <span>{{ clerkObj.yearMonth }}</span><span class="p-l-18">{{ clerkObj.storeName }}门店导购月指标详情</span>
+        </div>
+        <!-- <div class="saler-set-title_right"><span>门店月指标：</span><el-input class="w-105 p-l-8" v-model="clerkObj.storePerformance" placeholder="请输入指标值" :disabled="clerkObj.settingAble == 0" @blur="value => inputMonthPerformance(value)"></el-input></div> -->
+      </div>
+      <div class="saler-set-table">
+        <el-table class="select-table" ref="multipleTable" :span-method="objectSpanMethod" :data="tableData" tooltip-effect="dark" :style="{ width: '100%', minHeight: tableH }">
+          <el-table-column label="导购">
+            <template slot-scope="scope">
+              <div>{{ scope.row.clerkName }}</div>
+            </template>
+          </el-table-column>
+          <el-table-column label="月指标">
+            <template slot-scope="scope">
+              <div>
+                <el-input class="w-120 p-l-8" maxlength="50" v-model="scope.row.clerkPerformance" placeholder="请输入" :disabled="clerkObj.settingAble == 0 || scope.row.bindFlag == 0" @blur="value => inputPerformance(value, scope.$index, scope.row)">
+                  <i slot="prefix" style="font-style: normal;position: absolute;top: 4px;left: 12px;">￥</i>
+                </el-input>
+              </div>
+            </template>
+          </el-table-column>
+          <el-table-column label="总计=门店月指标" width="418px">
+            <template >
+              <div><span class="font-14 color-606266 text-left">总计</span><span class=" p-l-175 font-14 color-606266 text-left">门店月指标</span></div>
+              <div style="margin-top: 4px;">
+                <el-input class="w-161" v-model="performanceSum" disabled>
+                  <i slot="prefix" style="font-style: normal;position: absolute;top: 4px;left: 10px;">￥</i>
+                </el-input>
+                <span class="p-l-10 p-r-10">=</span>
+                <el-input class="w-161 p-l-8" maxlength="50" v-model="clerkObj.storePerformance" placeholder="请输入指标值" :disabled="clerkObj.settingAble == 0" @blur="value => inputMonthPerformance(value)">
+                  <i slot="prefix" style="font-style: normal;position: absolute;top: 4px;left: 16px;">￥</i>
+                </el-input>
+              </div>
+            </template>
+          </el-table-column>
+        </el-table>
+      </div>
+      <div class="task-set-save text-center m-t-30">
+        <el-button v-if="clerkObj.settingAble == 1" :disabled="!equalFlag ? true : false" type="primary" @click="saveSet">确认</el-button>
+      </div>
+    </div>
+  </div>
+</template>
+<script>
+import { _debounce } from '@/common/js/public';
+import errMsg from '@/common/js/error';
+import showMsg from '@/common/js/showmsg';
+import fetch from '@/api/target-manage-app.js';
+const { saveSaleSet, getSaleSet } = fetch;
+export default {
+  name: 'PerfectSaleTarget',
+  components: {},
+  props: {
+    brandId: {
+      type: String,
+      default() {
+        return '';
+      }
+    }
+  },
+  data() {
+    return {
+      tableH: window.screen.availHeight - 464 - 126,
+      activeTab: '1',
+      activeBrand: this.brandId, // 商户(品牌) id
+      operationStaffName: localStorage.getItem('userInfos') ? JSON.parse(localStorage.getItem('userInfos')).staffDTO['staffName'] : '',
+      activeId: '4',
+      tableData: [],
+      performanceSum: '0.00', // 总指标
+      clerkObj: {
+        storeId: '',
+        storeName: '',
+        yearMonth: '',
+        settingAble: 1,
+        storePerformance: ''
+      },
+      equalFlag: true // 相等标志
+    };
+  },
+  mounted() {
+    let that = this;
+    document.documentElement.style.backgroundColor = '#f0f2f5';
+    that.$emit('showTab', '1');
+
+    if (!!that.brandId) {
+      that.clerkObj.yearMonth = that.$route.query.yearMonth;
+      that.clerkObj.storeId = that.$route.query.storeId;
+      that.getData();
+    }
+  },
+  destroyed() {
+    document.documentElement.style.backgroundColor = '#fff';
+  },
+  methods: {
+    objectSpanMethod({ row, column, rowIndex, columnIndex }) {
+      const that = this;
+      if (columnIndex === 2) {
+        if (rowIndex == 0) {
+          return {
+            rowspan: that.tableData.length,
+            colspan: 1
+          };
+        } else {
+          return {
+            rowspan: 0,
+            colspan: 0
+          };
+        }
+      }
+    },
+    /**
+     * @description:输入
+     * @param {Function} val
+     * @param {Number} index
+     * @param {Object} row
+     * @author: 无尘
+     */
+    inputPerformance: function(val, index, row) {
+      const that = this;
+      row.clerkPerformance = !!Number(row.clerkPerformance.replace(/[^\d.]/g, '')) ? row.clerkPerformance.replace(/[^\d+(.\d+)]/g, '') : '';
+      row.clerkPerformance = Number(row.clerkPerformance).toFixed(2);
+      let sumData = 0;
+      that.tableData.forEach(ele => {
+        sumData += Number(ele.clerkPerformance);
+      });
+      that.performanceSum = Number(sumData).toFixed(2);
+      that.diffData();
+    },
+    inputMonthPerformance: function(val) {
+      let that = this;
+      that.clerkObj.storePerformance = !!Number(that.clerkObj.storePerformance.replace(/[^\d.]/g, '')) ? that.clerkObj.storePerformance.replace(/[^\d+(.\d+)]/g, '') : '';
+      that.clerkObj.storePerformance = Number(that.clerkObj.storePerformance).toFixed(2);
+      that.diffData();
+    },
+
+    diffData() {
+      let that = this;
+      let dataFlag = Number(that.performanceSum) == Number(that.clerkObj.storePerformance);
+      if (!dataFlag) {
+        that.equalFlag = false;
+      } else {
+        that.equalFlag = true;
+      }
+      return dataFlag;
+    },
+    /**
+     * @description:保存
+     * @author: 无尘
+     */
+    saveSet: _debounce(function() {
+      const that = this;
+      if (!that.diffData()) {
+        return false;
+      }
+      /* 非空验证 */
+      if (that.clerkObj.storePerformance == '') {
+        that.$message.error({
+          duration: 1000,
+          message: '请输入门店月指标'
+        });
+        return false;
+      }
+      const data = {
+        clerkPerformanceList: that.tableData,
+        storePerformance: that.clerkObj.storePerformance,
+        operationStaffName: that.operationStaffName
+      };
+      that.postSave(data);
+    }, 500),
+    postSave(data) {
+      const that = this;
+      const para = {
+        enterpriseId: that.activeBrand,
+        storeId: that.clerkObj.storeId,
+        yearMonth: that.clerkObj.yearMonth,
+        performance: JSON.stringify(data)
+      };
+      saveSaleSet(para)
+        .then(res => {
+          if (res.code == '0000') {
+            showMsg.showmsg('保存成功', 'success');
+            return;
+          }
+          errMsg.errorMsg(res);
+        })
+        .catch(function(error) {
+          that.$message.error({
+            duration: 1000,
+            message: error.message
+          });
+        });
+    },
+    /**
+     * @description:获取设置数据
+     * @author: 无尘
+     */
+    getData() {
+      const that = this;
+      const para = {
+        enterpriseId: that.activeBrand,
+        storeId: that.clerkObj.storeId,
+        yearMonth: that.clerkObj.yearMonth
+      };
+      getSaleSet(para)
+        .then(res => {
+          if (res.code == '0000') {
+            if (!!res.result.clerkPerformanceList && !!res.result.clerkPerformanceList.length) {
+              res.result.clerkPerformanceList.forEach(ele => {
+                ele.clerkPerformance = Number(ele.clerkPerformance).toFixed(2);
+              });
+              that.tableData = res.result.clerkPerformanceList || [];
+            }
+            res.result.storePerformance = Number(res.result.storePerformance).toFixed(2);
+            that.clerkObj = res.result;
+            let allSum = 0;
+            that.tableData.forEach(ele => {
+              allSum += Number(ele.clerkPerformance);
+            });
+            that.performanceSum = Number(allSum).toFixed(2);
+            return;
+          }
+          errMsg.errorMsg(res);
+        })
+        .catch(function(error) {
+          that.$message.error({
+            duration: 1000,
+            message: error.message
+          });
+        });
+    }
+  },
+  watch: {
+    brandId: function(newData, oldData) {
+      const that = this;
+      if (!!newData) {
+        that.activeBrand = newData;
+        that.clerkObj.yearMonth = that.$route.query.yearMonth;
+        that.clerkObj.storeId = that.$route.query.storeId;
+        that.getData();
+      }
+    }
+  },
+
+};
+</script>
+<style type="text/scss" lang="scss" scoped>
+.task-set-content {
+  padding: 20px;
+  box-sizing: border-box;
+  .w-105 {
+    width: 105px;
+  }
+  .w-120 {
+    width: 120px;
+  }
+  .w-161 {
+    width: 161px;
+  }
+  .m-b-15 {
+    margin-bottom: 15px;
+  }
+  .p-l-8 {
+    padding-left: 8px;
+  }
+  .p-l-18 {
+    padding-left: 18px;
+  }
+  .p-l-24 {
+    padding-left: 24px;
+  }
+  .p-l-175 {
+    padding-left: 175px;
+  }
+  .color-1890ff {
+    color: #2f54eb;
+  }
+  .color-f5222d {
+    color: #f5222d;
+  }
+
+}
+</style>