lizhuo submits AnnualSaleGoal at 2023-7-19 17:00

src/views/business/spd/goal_management/MonthSaleGoal.vue

@@ -163,13 +163,209 @@
     />
 
     <el-drawer :title="title" :visible.sync="open" direction="rtl" :before-close="handleClose" size="100%">
-      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
-
+      <el-form ref="form" :model="form" :rules="rules" label-width="120px">
+        <el-row :gutter="20">
+          <el-col :span="6">
+            <el-form-item label="编码" prop="code">
+              <el-input v-model="form.code" placeholder="编码后端自动生成" disabled/>
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item label="目标名称" prop="goalName">
+              <el-input v-model="form.goalName" placeholder="目标名称后端自动生成" disabled/>
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item label="单据日期" prop="documentDate">
+              <el-date-picker clearable
+                              v-model="form.documentDate"
+                              type="date"
+                              value-format="yyyy-MM-dd"
+                              placeholder="请选择单据日期">
+              </el-date-picker>
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item label="年度" prop="annual">
+              <el-date-picker
+                v-model="form.annual"
+                type="year"
+                value-format="yyyy"
+                placeholder="选择年度">
+              </el-date-picker>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="20">
+          <el-col :span="6">
+            <el-form-item label="客户" prop="custom">
+              <el-popover-select-v2 v-model="form.custom" title="客户" valueKey="name"
+                                    referName="CUSTOMER_PARAM"
+                                    :dataMapping="{ customCode: 'code', custom: 'name'}"
+                                    :source.sync="form" placeholder="请输入客户">
+              </el-popover-select-v2>
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item label="销售区域" prop="saleZone">
+              <el-popover-select-v2 v-model="form.saleZone" title="销售区域" valueKey="name"
+                                    referName="CUSTOMER_PARAM"
+                                    :dataMapping="{ saleZoneCode: 'code', saleZone: 'name'}"
+                                    :source.sync="form" placeholder="请输入销售区域">
+              </el-popover-select-v2>
+            </el-form-item></el-col>
+          <el-col :span="6">
+            <el-form-item label="制单人" prop="creator">
+              <el-popover-select-v2 v-model="form.creator" title="制单人" valueKey="name"
+                                    referName="CONTACTS_PARAM"
+                                    :dataMapping="{ creatorCode: 'code', creator: 'name'}"
+                                    :source.sync="form" placeholder="请输入制单人">
+              </el-popover-select-v2>
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item label="部门" prop="dept">
+              <el-popover-select-v2 v-model="form.dept" title="部门" valueKey="name"
+                                    referName="DEPT_PARAM"
+                                    :dataMapping="{ deptCode: 'code', dept: 'name'}"
+                                    :source.sync="form" placeholder="请输入部门">
+              </el-popover-select-v2>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="20">
+          <el-col :span="6">
+            <el-form-item label="目标合计" prop="goalSum">
+              <el-input v-model="form.goalSum" placeholder="目标合计自动计算" disabled />
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item label="备注" prop="notes">
+              <el-input v-model="form.notes" placeholder="请输入备注"/>
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item label="单据状态" prop="documentStatus">
+              <el-input v-model="form.documentStatus" disabled/>
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item label="操作">
+              <el-button type="primary" @click="submitForm">确 定</el-button>
+              <el-button @click="cancel">取 消</el-button>
+            </el-form-item>
+          </el-col>
+        </el-row>
       </el-form>
-      <div slot="footer" class="dialog-footer">
-        <el-button type="primary" @click="submitForm">确 定</el-button>
-        <el-button @click="cancel">取 消</el-button>
-      </div>
+      <el-row :gutter="10" class="mb8">
+        <el-col :span="1.5">
+          <el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAddDetails">增行</el-button>
+        </el-col>
+      </el-row>
+      <el-table v-loading="loading" :data="monthSaleGoalDetailsList" @selection-change="handleSelectionChange">
+        <el-table-column type="selection" width="55" align="center" fixed />
+        <el-table-column label="销售组织" align="center" prop="saleOrg" width="180">
+          <template slot-scope="scope">
+            <el-popover-select-v2 v-model="monthSaleGoalDetailsList[scope.$index].saleOrg" title="销售组织" valueKey="name"
+                                  referName="CUSTOMER_PARAM"
+                                  :dataMapping="{ saleOrgCode: 'code', saleOrg: 'name'}"
+                                  :source.sync="monthSaleGoalDetailsList[scope.$index]" placeholder="请输入销售组织">
+            </el-popover-select-v2>
+          </template>
+        </el-table-column>
+        <el-table-column label="销售区域" align="center" prop="saleZone" width="180">
+          <template slot-scope="scope">
+            <el-popover-select-v2 v-model="monthSaleGoalDetailsList[scope.$index].saleZone" title="销售区域" valueKey="name"
+                                  referName="CUSTOMER_PARAM"
+                                  :dataMapping="{ saleZoneCode: 'code', saleZone: 'name'}"
+                                  :source.sync="monthSaleGoalDetailsList[scope.$index]" placeholder="请输入销售区域">
+            </el-popover-select-v2>
+          </template>
+        </el-table-column>
+        <el-table-column label="客户" align="center" prop="custom" width="180">
+          <template slot-scope="scope">
+            <el-popover-select-v2 v-model="monthSaleGoalDetailsList[scope.$index].custom" title="客户" valueKey="name"
+                                  referName="CUSTOMER_PARAM"
+                                  :dataMapping="{ customCode: 'code', custom: 'name'}"
+                                  :source.sync="monthSaleGoalDetailsList[scope.$index]" placeholder="请输入客户">
+            </el-popover-select-v2>
+          </template>
+        </el-table-column>
+        <el-table-column label="部门" align="center" prop="dept" width="180">
+          <template slot-scope="scope">
+            <el-popover-select-v2 v-model="monthSaleGoalDetailsList[scope.$index].dept" title="部门" valueKey="name"
+                                  referName="DEPT_PARAM"
+                                  :dataMapping="{ deptCode: 'code', dept: 'name'}"
+                                  :source.sync="monthSaleGoalDetailsList[scope.$index]" placeholder="请输入客户">
+            </el-popover-select-v2>
+          </template>
+        </el-table-column>
+        <el-table-column label="制单人" align="center" prop="creator" width="180">
+          <template slot-scope="scope">
+            <el-popover-select-v2 v-model="monthSaleGoalDetailsList[scope.$index].creator" title="负责人" valueKey="name"
+                                  referName="CONTACTS_PARAM"
+                                  :dataMapping="{ creatorCode: 'code', creator: 'name'}"
+                                  :source.sync="monthSaleGoalDetailsList[scope.$index]" placeholder="请输入负责人">
+            </el-popover-select-v2>
+          </template>
+        </el-table-column>
+        <el-table-column label="一级分类" align="center" prop="oneLevelClassify" width="180">
+          <template slot-scope="scope">
+            <el-input v-model="monthSaleGoalDetailsList[scope.$index].oneLevelClassify" disabled></el-input>
+          </template>
+        </el-table-column>
+        <el-table-column label="二级分类" align="center" prop="twoLevelClassify" width="180">
+          <template slot-scope="scope">
+            <el-input v-model="monthSaleGoalDetailsList[scope.$index].twoLevelClassify" disabled></el-input>
+          </template>
+        </el-table-column>
+        <el-table-column label="物料" align="center" prop="material" width="180">
+          <template slot-scope="scope">
+            <el-popover-select-v2 v-model="monthSaleGoalDetailsList[scope.$index].material" title="物料" valueKey="name"
+                                  referName="MATERIAL_PARAM"
+                                  :dataMapping="{ materialCode: 'code', material: 'name'}"
+                                  :source.sync="monthSaleGoalDetailsList[scope.$index]" placeholder="请输入物料">
+            </el-popover-select-v2>
+          </template>
+        </el-table-column>
+        <el-table-column label="科室" align="center" prop="department" width="180">
+          <template slot-scope="scope">
+            <el-input v-model="monthSaleGoalDetailsList[scope.$index].department" placeholder="请输入科室"></el-input>
+          </template>
+        </el-table-column>
+        <el-table-column label="数量" align="center" prop="num" width="220">
+          <template slot-scope="scope">
+            <el-input-number v-model="monthSaleGoalDetailsList[scope.$index].num" :min="0"></el-input-number>
+          </template>
+        </el-table-column>
+        <el-table-column label="月份" align="center" prop="num" width="250">
+          <template slot-scope="scope">
+            <el-date-picker v-model="monthSaleGoalDetailsList[scope.$index].monthly" value-format="M" type="month" placeholder="选择月份">
+            </el-date-picker>
+          </template>
+        </el-table-column>
+        <el-table-column label="合计" align="center" prop="totalGoal" width="220">
+          <template slot-scope="scope">
+            <el-input-number @change="computeTotal" v-model="monthSaleGoalDetailsList[scope.$index].goalValue" :precision="2" :step="1" :min="0"></el-input-number>
+          </template>
+        </el-table-column>
+        <el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="120px" fixed="right">
+          <template slot-scope="scope">
+            <el-button
+              size="mini"
+              type="text"
+              icon="el-icon-delete"
+              @click="handleDeleteDetails(scope.$index, scope.row)"
+            >删除</el-button>
+            <el-button
+              size="mini"
+              type="text"
+              icon="el-icon-delete"
+              @click="handleCopyDetails(scope.row)"
+            >复制</el-button>
+          </template>
+        </el-table-column>
+      </el-table>
     </el-drawer>
   </div>
 </template>
@@ -183,8 +379,15 @@ import {
   updateMonthSaleGoal
 } from "@/api/business/spd/goal_management/monthSaleGoal";
 
+// 树形参照
+import TreeRefers from '@/components/Refers/treeRefer.vue'
+import ElPopoverSelectV2 from "@/components/popover-select-v2"
+
 export default {
   name: "MonthSaleGoal",
+  components: {
+    TreeRefers, ElPopoverSelectV2
+  },
   data() {
     return {
       // 遮罩层
@@ -201,6 +404,7 @@ export default {
       total: 0,
       // 月销售目标填报表格数据
       monthSaleGoalList: [],
+      monthSaleGoalDetailsList: [],
       // 弹出层标题
       title: "",
       // 是否显示弹出层
@@ -281,6 +485,15 @@ export default {
         this.monthSaleGoalList = response.rows;
         this.total = response.total;
         this.loading = false;
+        for (const element of this.monthSaleGoalList) {
+          if (element.documentStatus === '0') {
+            element.documentStatus = '未提交'
+          } else if (element.documentStatus === '1') {
+            element.documentStatus = '审核中'
+          } else {
+            element.documentStatus = '已审核'
+          }
+        }
       });
     },
     // 取消按钮
@@ -334,12 +547,41 @@ export default {
       this.open = true;
       this.title = "添加月销售目标填报";
     },
+    handleAddDetails() {
+      let list = {
+        id: null,
+        code: null,
+        saleOrg: null,
+        saleZone: null,
+        custom: null,
+        dept: null,
+        creator: null,
+        oneLevelClassifyCode: null,
+        oneLevelClassify: null,
+        twoLevelClassifyCode: null,
+        twoLevelClassify: null,
+        materialCode: null,
+        material: null,
+        department: null,
+        num: null,
+        monthly: null,
+        goalValue: null
+      }
+      this.monthSaleGoalDetailsList.push(list)
+    },
     /** 修改按钮操作 */
     handleUpdate(row) {
       this.reset();
       const id = row.id || this.ids
       getMonthSaleGoal(id).then(response => {
         this.form = response.data;
+        if (this.form.documentStatus === '0') {
+          this.form.documentStatus = '未提交'
+        } else if (this.form.documentStatus === '1') {
+          this.form.documentStatus = '审批中'
+        } else {
+          this.form.documentStatus = '已审核'
+        }
         this.open = true;
         this.title = "修改月销售目标填报";
       });
@@ -349,12 +591,21 @@ export default {
       this.$refs["form"].validate(valid => {
         if (valid) {
           if (this.form.id != null) {
+            if (this.form.documentStatus === '未提交') {
+              this.form.documentStatus = 0
+            } else if (this.form.documentStatus === '审批中') {
+              this.form.documentStatus = 1
+            } else {
+              this.form.documentStatus = 2
+            }
+            this.form.monthDetailsList = this.monthSaleGoalDetailsList
             updateMonthSaleGoal(this.form).then(response => {
               this.$modal.msgSuccess("修改成功");
               this.open = false;
               this.getList();
             });
           } else {
+            this.form.monthDetailsList = this.monthSaleGoalDetailsList
             addMonthSaleGoal(this.form).then(response => {
               this.$modal.msgSuccess("新增成功");
               this.open = false;
@@ -375,11 +626,55 @@ export default {
       }).catch(() => {
       });
     },
+    handleDeleteDetails(index, row) {
+      this.monthSaleGoalDetailsList.splice(index, 1)
+      this.computeTotal()
+    },
     /** 导出按钮操作 */
     handleExport() {
       this.download('goal_management/monthSaleGoal/export', {
         ...this.queryParams
       }, `monthSaleGoal_${new Date().getTime()}.xlsx`)
+    },
+    handleClose(done) {
+      this.$confirm('确认关闭？')
+        .then(_ => {
+          done();
+        })
+        .catch(_ => {});
+    },
+    // 复制明细
+    handleCopyDetails(row) {
+      let list = {
+        id: row.id,
+        code: row.code,
+        saleOrg: row.saleOrg,
+        saleZone: row.saleZone,
+        custom: row.custom,
+        dept: row.dept,
+        creator: row.creator,
+        oneLevelClassifyCode: row.oneLevelClassifyCode,
+        oneLevelClassify: row.oneLevelClassify,
+        twoLevelClassifyCode: row.twoLevelClassifyCode,
+        twoLevelClassify: row.twoLevelClassify,
+        materialCode: row.materialCode,
+        material: row.material,
+        department: row.department,
+        num: row.num,
+        monthly: row.monthly,
+        goalValue: row.goalValue
+      }
+      this.monthSaleGoalDetailsList.push(list)
+      this.computeTotal()
+    },
+    // 计算主表合计
+    computeTotal() {
+      let list = this.monthSaleGoalDetailsList
+      let sum = 0
+      for (const listElement of list) {
+        sum = (sum * 1000000 + listElement.goalValue * 1000000) / 1000000
+      }
+      this.form.goalSum = sum
     }
   }
 };