build

src/components/newResults/company-month.vue

@@ -1,63 +1,67 @@
 <template>
   <div v-loading="loading">
-    <div class="search clear" style="align-items: center;">
-      <el-switch
-      :disabled="isEmpty"
-        style="margin-right: 10px;"
-        v-model="isTenThound"
-        active-text="万元"
-        inactive-text="元" 
-        />
-
-      <el-select size="small" style="margin-right:10px;width:145px" v-model="companyNo" @change="requestData" :disabled="isEmpty">
-        <el-option v-for="depart in cp_companies" :key="depart.id" :value="depart.value" :label="depart.label" />
-      </el-select>
-
-      <el-date-picker class="fr picker" v-model="daytime" style=";width:100px" value-format="yyyy" :editable="false" :disabled="isEmpty"
-        :clearable="false" :size="'small'" type="year" format="yyyy" align="right" placeholder="选择日期"
-        :picker-options="{ disabledDate(time) { return time.getTime() > Date.now(); } }" @change="requestData" />
+    <div class="search" style="align-items: center;">
+      <div style="float:left">
+        业绩毛利完成情况-月度
+      </div>
+
+      <div style="float:right">
+        <el-switch :disabled="isEmpty" style="margin-right: 10px;" v-model="isTenThound" active-text="万元"
+          inactive-text="元" />
+
+        <el-select size="small" style="margin-right:10px;width:145px" v-model="companyNo" @change="requestData"
+          :disabled="isEmpty">
+          <el-option v-for="depart in cp_companies" :key="depart.id" :value="depart.value" :label="depart.label" />
+        </el-select>
+
+        <el-date-picker class="fr picker" v-model="daytime" style=";width:100px" value-format="yyyy" :editable="false"
+          :disabled="isEmpty" :clearable="false" :size="'small'" type="year" format="yyyy" align="right"
+          placeholder="选择日期" :picker-options="{ disabledDate(time) { return time.getTime() > Date.now(); } }"
+          @change="requestData" />
+      </div>
     </div>
 
-    <el-row style="margin-top:10px" v-if="!isEmpty">
-      <el-table border size="mini" :data="tableData" :header-cell-class-name="setHeaderClassName" :cell-class-name="setCellClassName">
+    <el-row style="margin-top:10px;margin-top:10px" v-if="!isEmpty">
+      <el-table border size="mini" :data="tableData" :header-cell-class-name="setHeaderClassName"
+        :cell-class-name="setCellClassName">
         <el-table-column fixed="left" label="月度" prop="month" align="center" width="45px" />
         <el-table-column label="当月营收目标" align="center" min-width="140px">
           <template slot-scope="scope">
-            {{unit2TenThousand(scope.row.total_tips,isTenThound)}}
+            {{ unit2TenThousand(scope.row.total_tips, isTenThound) }}
           </template>
         </el-table-column>
         <el-table-column label="当月营业收入(净)" align="center" min-width="140px">
           <template slot-scope="scope">
-            <div :style="getCurrentValueStyle(scope.row.pure_sale,scope.row.total_tips,scope.row.month)">
-              {{unit2TenThousand(scope.row.pure_sale,isTenThound)}}
+            <div :style="getCurrentValueStyle(scope.row.pure_sale, scope.row.total_tips, scope.row.month)">
+              {{ unit2TenThousand(scope.row.pure_sale, isTenThound) }}
             </div>
           </template>
         </el-table-column>
         <el-table-column label="当月营收完成%" align="center" min-width="140px">
           <template slot-scope="scope">
-            <div :style="getCurrentRateStyle(scope.row.completion_rate,scope.row.month)">
-              {{Number(scope.row.completion_rate).toFixed(2) + "%"}}
+            <div :style="getCurrentRateStyle(scope.row.completion_rate, scope.row.month)">
+              {{ Number(scope.row.completion_rate).toFixed(2) + "%" }}
             </div>
           </template>
         </el-table-column>
         <el-table-column label="当月毛利完成%" align="center" min-width="140px">
           <template slot-scope="scope">
             <div :style="getCurrentRateStyle(scope.row.cost_rate, scope.row.month)">
-              {{Number(scope.row.cost_rate).toFixed(2) + "%"}}
+              {{ Number(scope.row.cost_rate).toFixed(2) + "%" }}
             </div>
           </template>
         </el-table-column>
-        
+
         <template v-if="costField">
           <el-table-column label="当月毛利目标" align="center" min-width="140px">
-           <template slot-scope="scope">
-             {{unit2TenThousand(scope.row.cost_tips,isTenThound)}}
-           </template>
+            <template slot-scope="scope">
+              {{ unit2TenThousand(scope.row.cost_tips, isTenThound) }}
+            </template>
           </el-table-column>
           <el-table-column label="当月毛利完成" align="center" min-width="140px">
             <template slot-scope="scope">
-              <div :style="getCurrentValueStyle(scope.row.pure_profit,scope.row.cost_tips,scope.row.month)">
-                {{unit2TenThousand(scope.row.pure_profit,isTenThound)}}
+              <div :style="getCurrentValueStyle(scope.row.pure_profit, scope.row.cost_tips, scope.row.month)">
+                {{ unit2TenThousand(scope.row.pure_profit, isTenThound) }}
               </div>
             </template>
           </el-table-column>
@@ -79,16 +83,16 @@ import { mapCompany } from "./mapCompany";
 import dayjs from "dayjs"
 
 export default {
-  props:['companies','costField'],
-  data(){
+  props: ['companies', 'costField'],
+  data() {
     return {
       loading: false,
-      isTenThound:true,
+      isTenThound: true,
       daytime: "",
       tableData: [],
       companyNo: "",
-      cp_companies:[],
-      isEmpty:false
+      cp_companies: [],
+      isEmpty: false
     }
   },
   mounted() {
@@ -96,14 +100,14 @@ export default {
     const jxIndex = this.companies.findIndex((item) => item.label === "北京锦兴弘昌科技有限公司");
     const prIndex = this.companies.findIndex((item) => item.label === "北京普润心堂商贸有限公司");
 
-    if(jxIndex !== -1 || prIndex !== -1) this.hasCompose = true;
+    if (jxIndex !== -1 || prIndex !== -1) this.hasCompose = true;
     this.cp_companies = this.companies.filter((item) => item.label !== "北京锦兴弘昌科技有限公司" && item.label !== "北京普润心堂商贸有限公司")
-    if(this.hasCompose) this.cp_companies = [...this.cp_companies,{ value:"GS2401181650538135",label: "普润&锦兴&知事"}]
-    if(this.cp_companies.length === 4) this.cp_companies = [{ value:"",label: "所有公司"},...this.cp_companies];
+    if (this.hasCompose) this.cp_companies = [...this.cp_companies, { value: "GS2401181650538135", label: "普润&锦兴&知事" }]
+    if (this.cp_companies.length === 4) this.cp_companies = [{ value: "", label: "所有公司" }, ...this.cp_companies];
 
     this.isEmpty = this.cp_companies.length === 0;
-    if(this.isEmpty) return;
-    this.cp_companies = this.cp_companies.map(item => ({ ...item, label:mapCompany[item.label] || item.label}))
+    if (this.isEmpty) return;
+    this.cp_companies = this.cp_companies.map(item => ({ ...item, label: mapCompany[item.label] || item.label }))
 
     this.companyNo = this.cp_companies[0].value;
     this.daytime = this.transformTime();
@@ -111,33 +115,33 @@ export default {
   },
   methods: {
     unit2TenThousand,
-    getCurrentRateStyle(current,month){
+    getCurrentRateStyle(current, month) {
       const days = dayjs().daysInMonth();
-      const currentMonth =dayjs().month() + 1;
-      if(Number(month) > Number(currentMonth)) return;
-      const oneDay = Number(division(100,days)).toFixed(2);
+      const currentMonth = dayjs().month() + 1;
+      if (Number(month) > Number(currentMonth)) return;
+      const oneDay = Number(division(100, days)).toFixed(2);
       const currentDay = dayjs().date();
-      const currentTotalTip = Number( multiplication(currentDay,oneDay)).toFixed(2);
+      const currentTotalTip = Number(multiplication(currentDay, oneDay)).toFixed(2);
       return Number(currentTotalTip) > Number(current) ? 'color:red' : ''
     },
-    getCurrentValueStyle(current,total,month){
+    getCurrentValueStyle(current, total, month) {
       const days = dayjs().daysInMonth();
-      const currentMonth =dayjs().month() + 1;
-      if(Number(month) > Number(currentMonth)) return;
-      const oneDay = Number(division(total,days)).toFixed(2);
+      const currentMonth = dayjs().month() + 1;
+      if (Number(month) > Number(currentMonth)) return;
+      const oneDay = Number(division(total, days)).toFixed(2);
       const currentDay = dayjs().date();
-      const currentTotalTip = Number( multiplication(currentDay,oneDay)).toFixed(2);
+      const currentTotalTip = Number(multiplication(currentDay, oneDay)).toFixed(2);
       return Number(currentTotalTip) > Number(current) ? 'color: red' : '';
     },
     setCellClassName({ column }) {
       const { label } = column;
-      if(label === "当月营收目标")  return "bg__yellow"
-      if(label === "当月毛利目标") return "bg__red"
+      if (label === "当月营收目标") return "bg__yellow"
+      if (label === "当月毛利目标") return "bg__red"
     },
-    setHeaderClassName({ column }){
+    setHeaderClassName({ column }) {
       const { label } = column;
-      if(label === "当月营收目标")  return "bg__yellow"
-      if(label === "当月毛利目标") return "bg__red"
+      if (label === "当月营收目标") return "bg__yellow"
+      if (label === "当月毛利目标") return "bg__red"
     },
     transformTime() {
       let time = new Date();
@@ -185,20 +189,20 @@ export default {
       //   }
       // }
 
-      
-      switch(Number(result.code)){
+
+      switch (Number(result.code)) {
         case 0:
           this.tableData = (result.data || []).map(tableItem => {
             /* 销售净额 = 销售额 - 退货额 **/
-            const pure_sale = subtraction(tableItem.sale_total,tableItem.th_total)
+            const pure_sale = subtraction(tableItem.sale_total, tableItem.th_total)
             /* 指标达成率 = 销售净额 / 销售指标 **/
-            const completion_rate = multiplication(division(pure_sale,tableItem.total_tips),100)
+            const completion_rate = multiplication(division(pure_sale, tableItem.total_tips), 100)
             /* 采购净额 = 采购额 - 采购退货额 **/
-            const pure_purch = subtraction(tableItem.cgd_total,tableItem.cgd_th_total)
+            const pure_purch = subtraction(tableItem.cgd_total, tableItem.cgd_th_total)
             /* 毛利润 = (本月销售净额 - 本月采购净额) **/
-            const pure_profit = subtraction(pure_sale,pure_purch)
+            const pure_profit = subtraction(pure_sale, pure_purch)
             /*  毛利率 = (本月毛利润 / 本月销售净额) * 100 **/
-            const pure_interest_rate = multiplication(division(pure_profit,pure_sale) || 0,100)
+            const pure_interest_rate = multiplication(division(pure_profit, pure_sale) || 0, 100)
 
             return {
               pure_sale,
@@ -206,9 +210,9 @@ export default {
               pure_profit,
               completion_rate,
               pure_interest_rate,
-              month:tableItem.month,
-              cost_tips:tableItem.cost_tips,
-              total_tips:tableItem.total_tips,
+              month: tableItem.month,
+              cost_tips: tableItem.cost_tips,
+              total_tips: tableItem.total_tips,
               cost_rate: Number(tableItem.cost_tips) === 0 ? 0 : multiplication(division(pure_profit, tableItem.cost_tips) || 0, 100).toFixed(2)
             }
           })
@@ -236,14 +240,11 @@ export default {
 
 
 <style lang="scss" scoped>
-
-.new-results{
+.new-results {
   .search {
-    height:36px;
-    display: flex;
-    justify-content: flex-end;
-    padding:0px 10px;
-    margin-top:10px
+    height: 36px;
+    padding: 0px 10px;
+    margin-top: 10px
   }
 }
 </style>

src/components/newResults/company.vue

@@ -1,22 +1,32 @@
 <template>
   <div v-loading="loading">
     <div class="search clear" style="align-items: center;;">
-      <el-switch style="margin-right: 10px;" v-model="isTenThound" active-text="万元" inactive-text="元" :disabled="isEmpty" />
-
-      <el-select size="small" style="margin-right:10px;width:125px" v-model="companyNo" @change="requestData" :disabled="isEmpty">
-        <el-option v-for="company in cp_companies" :key="company.value" :value="company.value" :label="company.label" />
-      </el-select>
-
-      <el-date-picker class="fr picker" v-model="daytime" style=";width:140px" value-format="yyyy-MM-dd" :editable="false" :disabled="isEmpty"
-        :clearable="false" :size="'small'" format="yyyy-MM-dd" type="date" align="right" placeholder="选择日期"
-        :picker-options="{ disabledDate(time) { return time.getTime() > Date.now(); } }" @change="requestData" />
+      <div style="float:left">
+        业绩毛利完成情况-年度
+      </div>
+
+      <div style="float:right">
+        <el-switch style="margin-right: 10px;" v-model="isTenThound" active-text="万元" inactive-text="元"
+          :disabled="isEmpty" />
+        <el-select size="small" style="margin-right:10px;width:125px" v-model="companyNo" @change="requestData"
+          :disabled="isEmpty">
+          <el-option v-for="company in cp_companies" :key="company.value" :value="company.value" :label="company.label" />
+        </el-select>
+
+        <el-date-picker class="fr picker" v-model="daytime" style=";width:140px" value-format="yyyy-MM-dd"
+          :editable="false" :disabled="isEmpty" :clearable="false" :size="'small'" format="yyyy-MM-dd" type="date"
+          align="right" placeholder="选择日期"
+          :picker-options="{ disabledDate(time) { return time.getTime() > Date.now(); } }" @change="requestData" />
+      </div>
     </div>
 
-    <el-row style="margin-top:10px" v-if="!isEmpty">
-      <el-table border size="mini" :data="tableData" :header-cell-class-name="setHeaderClassName" :cell-class-name="setCellClassName">
+    <el-row style="margin-top:10px;margin-top:10px" v-if="!isEmpty">
+      <el-table border size="mini" :data="tableData" :header-cell-class-name="setHeaderClassName"
+        :cell-class-name="setCellClassName">
         <el-table-column fixed="left" label="业务公司" prop="companyName" align="center" width="70px">
           <template slot-scope="scope">
-            <div v-if="scope.row.companyName.indexOf('普润') === -1">{{mapCompany[scope.row.companyName] || scope.row.companyName}}</div>
+            <div v-if="scope.row.companyName.indexOf('普润') === -1">{{ mapCompany[scope.row.companyName] ||
+              scope.row.companyName }}</div>
             <div v-else>
               <p style="margin:0px">普润</p>
               <p style="margin:0px">锦兴</p>
@@ -38,10 +48,10 @@
         <el-table-column label="当月营业收入(净)" align="center" min-width="420px">
           <template slot-scope="scope">
             <div style="display:flex;flex-direction: column;">
-              <p :style="`text-align: center;${getCurrentValueStyle(scope.row.msale_total,scope.row.total_tips)}`" >
+              <p :style="`text-align: center;${getCurrentValueStyle(scope.row.msale_total, scope.row.total_tips)}`">
                 {{ unit2TenThousand(scope.row.msale_total, isTenThound) }}
               </p>
-              
+
               <div class="table-size">
                 <p>直营/自营: {{ unit2TenThousand(scope.row.info[0][0].monthinfo.msale_total, isTenThound) }}</p>
                 <p>渠道: {{ unit2TenThousand(scope.row.info[0][1].monthinfo.msale_total, isTenThound) }}</p>
@@ -72,11 +82,11 @@
               </div>
             </template>
           </el-table-column>
-          
+
           <el-table-column label="当月实际毛利率" align="center" width="105px">
             <template slot-scope="scope">
               <!-- <div :style="`${getCurrentRateStyle(scope.row.gross_sale_completion_rate)}`"> -->
-                {{ unit2TenThousand(scope.row.gross_sale_completion_rate) + "%" }}
+              {{ unit2TenThousand(scope.row.gross_sale_completion_rate) + "%" }}
               <!-- </div> -->
             </template>
           </el-table-column>
@@ -141,30 +151,30 @@ export default {
     this.cp_companies = this.companies.filter((item) => item.label !== "北京锦兴弘昌科技有限公司" && item.label !== "北京普润心堂商贸有限公司")
     if (this.hasCompose) this.cp_companies = [...this.cp_companies, { value: "GS2302231124114965", label: "普润&锦兴&知事" }]
     if (this.cp_companies.length === 4) this.cp_companies = [{ value: "", label: "所有公司" }, ...this.cp_companies];
-    
+
     this.isEmpty = this.cp_companies.length === 0;
-    if(this.isEmpty) return;
+    if (this.isEmpty) return;
+
+    this.cp_companies = this.cp_companies.map(item => ({ ...item, label: mapCompany[item.label] || item.label }))
 
-    this.cp_companies = this.cp_companies.map(item => ({ ...item, label:mapCompany[item.label] || item.label}))
-    
     this.companyNo = this.cp_companies[0].value;
     this.daytime = this.transformTime();
     this.requestData();
   },
   methods: {
     unit2TenThousand,
-    getCurrentRateStyle(current){
+    getCurrentRateStyle(current) {
       const days = dayjs().daysInMonth();
-      const oneDay = Number(division(100,days)).toFixed(2);
+      const oneDay = Number(division(100, days)).toFixed(2);
       const currentDay = dayjs().date();
-      const currentTotalTip = Number( multiplication(currentDay,oneDay)).toFixed(2);
+      const currentTotalTip = Number(multiplication(currentDay, oneDay)).toFixed(2);
       return Number(currentTotalTip) > Number(current) ? 'color:red' : ''
     },
-    getCurrentValueStyle(current,total){
+    getCurrentValueStyle(current, total) {
       const days = dayjs().daysInMonth();
-      const oneDay = Number(division(total,days)).toFixed(2);
+      const oneDay = Number(division(total, days)).toFixed(2);
       const currentDay = dayjs().date();
-      const currentTotalTip = Number( multiplication(currentDay,oneDay)).toFixed(2);
+      const currentTotalTip = Number(multiplication(currentDay, oneDay)).toFixed(2);
       return Number(currentTotalTip) > Number(current) ? 'color: red' : '';
     },
     addDataToCompany(c1, c2) {
@@ -188,20 +198,20 @@ export default {
             sale_total: Number(addition(item.sale_total, c2.dayinfo[index].sale_total)).toFixed(2),
             th_total: Number(addition(item.th_total, c2.dayinfo[index].th_total)).toFixed(2),
             type: item.type
-        }
+          }
         }),
       }
     },
     setCellClassName({ column }) {
       const { label } = column;
-      if(label === "当月营业收入(净)" || label === '当月成本合计') return "pure__cell";
-      if(label === "当月营收目标")  return "bg__yellow"
-      if(label === "当月毛利目标") return "bg__red"
+      if (label === "当月营业收入(净)" || label === '当月成本合计') return "pure__cell";
+      if (label === "当月营收目标") return "bg__yellow"
+      if (label === "当月毛利目标") return "bg__red"
     },
-    setHeaderClassName({ column }){
+    setHeaderClassName({ column }) {
       const { label } = column;
-      if(label === "当月营收目标")  return "bg__yellow"
-      if(label === "当月毛利目标") return "bg__red"
+      if (label === "当月营收目标") return "bg__yellow"
+      if (label === "当月毛利目标") return "bg__red"
     },
     transformTime() {
       let time = new Date();
@@ -331,10 +341,9 @@ export default {
 .new-results {
   .search {
     height: 36px;
-    display: flex;
-    justify-content: flex-end;
     padding: 0px 10px;
-    margin-top: 10px
+    margin-top: 10px;
+    flex-wrap:wrap;
   }
 
   .table-size {

src/components/newResults/department.vue

@@ -1,12 +1,9 @@
 <template>
   <div v-loading="loading">
-    <div class="search">
-      <el-select size="small" style="margin-right:10px;width:230px" v-model="companyNo" @change="requestData"
-        :disabled="isEmpty">
-        <el-option v-for="depart in companies" :key="depart.value" :label="depart.label" :value="depart.value" />
-      </el-select>
+    <div class="search clear">
+      <div style="float:left">部门业绩毛利完成情况</div>
 
-      <div style="display:flex;align-items:center">
+      <div style="float:right">
         <el-switch 
             :disabled="isEmpty" 
             :inline-prompt="true" 
@@ -15,7 +12,12 @@
             active-text="万元"
             inactive-text="元" 
           />
-        
+
+        <el-select size="small" style="margin-right:10px;width:80px" v-model="companyNo" @change="requestData"
+           :disabled="isEmpty">
+           <el-option v-for="depart in companies" :key="depart.value" :label="depart.label" :value="depart.value" />
+        </el-select>
+
         <el-date-picker 
           :disabled="isEmpty" 
           class="fr picker" 
@@ -30,7 +32,7 @@
       </div>
     </div>
 
-    <el-row style="margin-top: 10px; display: flex;" v-if="!isEmpty">
+    <el-row style="margin-top: 10px; display: flex;width:100%;margin-top:10px" v-if="!isEmpty">
       <el-table border size="mini" :data="list" :header-cell-class-name="setHeaderClassName"
         :cell-class-name="setCellClassName">
         <!-- <el-table-column fixed="left" label="公司" prop="company" align="center" width="45px" /> -->
@@ -152,7 +154,10 @@ export default {
     this.isEmpty = this.companies.length === 0;
     if (this.isEmpty) return;
     this.companyNo = this.companies[0].value;
-    this.companies = this.companies.map(item => ({ ...item, label: item.label }))
+    this.companies = this.companies.map(item => ({
+       ...item, 
+       label: mapCompany[item.label] || item.label
+      }))
     this.daytime = this.transformTime();
     this.requestData();
   },
@@ -227,7 +232,21 @@ export default {
       this.list = [];
       const res = await asyncRequest.departmentEveryDay({ daytime: this.daytime, companyNo: this.companyNo });
 
+
+
       if (res.code === 0 && res.data && res.data.length > 0) {
+        // 非万宇 营业目标重取
+        if(this.companyNo !== "GS2203161855277894") {
+          const r = await asyncRequest.companyEveryMonth({ daytime: this.daytime, companyNo: this.companyNo });
+          const { total_tips, companyName } = r.data[0] || {};
+          res.data.forEach(item => {
+            const index = companyName.indexOf(item.depart);
+            item.total_tips = (index === -1 && !(item.depart === "普润" && this.companyNo === "GS2304031312553746"))  ? '0.00' : total_tips;
+          })
+        }
+
+
+
         let list = (res.data || [])
           .map(({ depart, msale_total, mth_total, sale_total, th_total, total_tips, mzy_sale_total, mchannel_sale_total, channel_cost_total, zy_cost_total, mzy_cost_total, mchannel_cost_total }) => {
             return {
@@ -289,8 +308,6 @@ export default {
     height: 36px;
     padding: 0px 10px;
     margin-top: 10px;
-    display: flex;
-    align-items: center;
     width:100%;
     box-sizing: border-box;
     justify-content:space-between;