company-month.vue 7.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182
  1. <template>
  2. <div v-loading="loading">
  3. <div class="search clear" style="align-items: center;">
  4. <el-switch
  5. style="margin-right: 10px;"
  6. v-model="isTenThound"
  7. active-text="万元"
  8. inactive-text="元"
  9. />
  10. <el-select size="small" style="margin-right:10px" v-model="companyNo" @change="requestData">
  11. <el-option v-for="depart in companies" :key="depart.id" :value="depart.value" :label="depart.label" />
  12. </el-select>
  13. <el-date-picker class="fr picker" v-model="daytime" style=";width:100px" value-format="yyyy" :editable="false"
  14. :clearable="false" :size="'small'" type="year" format="yyyy" align="right" placeholder="选择日期"
  15. :picker-options="{ disabledDate(time) { return time.getTime() > Date.now(); } }" @change="requestData" />
  16. </div>
  17. <el-row style="margin-top:10px">
  18. <el-table border size="mini" :data="tableData" :cell-class-name="setCellClassName">
  19. <el-table-column fixed="left" label="月度" prop="month" align="center" width="60px" />
  20. <el-table-column label="当月营收目标" align="center" min-width="140px">
  21. <template slot-scope="scope">
  22. {{unit2TenThousand(scope.row.total_tips,isTenThound)}}
  23. </template>
  24. </el-table-column>
  25. <el-table-column label="当月营业收入(净)" align="center" min-width="140px">
  26. <template slot-scope="scope">
  27. {{unit2TenThousand(scope.row.pure_sale,isTenThound)}}
  28. </template>
  29. </el-table-column>
  30. <el-table-column label="当月营收完成%" align="center" min-width="140px">
  31. <template slot-scope="scope">
  32. {{Number(scope.row.completion_rate).toFixed(2) + "%"}}
  33. </template>
  34. </el-table-column>
  35. <el-table-column label="当月毛利完成%" align="center" min-width="140px">
  36. <template slot-scope="scope">
  37. {{Number(scope.row.cost_rate).toFixed(2) + "%"}}
  38. </template>
  39. </el-table-column>
  40. <el-table-column label="当月毛利指标" align="center" min-width="140px">
  41. <template slot-scope="scope">
  42. {{unit2TenThousand(scope.row.cost_tips,isTenThound)}}
  43. </template>
  44. </el-table-column>
  45. <el-table-column label="当月毛利完成" align="center" min-width="140px">
  46. <template slot-scope="scope">
  47. {{unit2TenThousand(scope.row.pure_profit,isTenThound)}}
  48. </template>
  49. </el-table-column>
  50. </el-table>
  51. </el-row>
  52. </div>
  53. </template>
  54. <script>
  55. import asyncRequest from "@/api/newResults";
  56. import { unit2TenThousand, subtraction, multiplication, division, addition } from "../newReport/src/_utils";
  57. export default {
  58. data(){
  59. return {
  60. loading: false,
  61. isTenThound:true,
  62. daytime: "",
  63. tableData: [],
  64. companyNo: "",
  65. companies:[
  66. { value:"",label: "所有公司"},
  67. { value:"GS2302231125079621",label: "北京百辰荣达国际科贸有限公司"},
  68. { value:"GS2302231323386950",label: "北京泓源广诚国际商贸有限公司"},
  69. { value:"GS2203161855277894 ",label: "北京万宇恒通国际科贸有限公司"},
  70. { value:"GS2302231124114965",label: "普润&锦兴&知事"}
  71. ]
  72. }
  73. },
  74. mounted() {
  75. this.daytime = this.transformTime();
  76. this.requestData();
  77. },
  78. methods: {
  79. unit2TenThousand,
  80. transformTime() {
  81. let time = new Date();
  82. let y = time.getFullYear();
  83. let M = time.getMonth() + 1;
  84. let d = time.getDate();
  85. return y + "-" + (M < 10 ? "0" + M : M) + "-" + (d < 10 ? "0" + d : d);
  86. },
  87. async requestData() {
  88. this.loading = true;
  89. const result = await asyncRequest.companyEvery({ year: (this.daytime.split('-'))[0], companyNo: this.companyNo })
  90. if(this.companyNo === "GS2302231124114965"){
  91. const jxResult = await asyncRequest.companyEvery({ year: (this.daytime.split('-'))[0], companyNo: "GS2304031312553746" })
  92. result.data = result.data.map((_,index) => {
  93. const prItem = result.data[index];
  94. const jxItem = jxResult.data[index];
  95. return {
  96. month:prItem.month,
  97. cgd_th_total: Number(addition(prItem['cgd_th_total'],jxItem['cgd_th_total'])).toFixed(2),
  98. cgd_total:Number(addition(prItem['cgd_total'],jxItem['cgd_total'])).toFixed(2),
  99. cost_tips:Number(addition(prItem['cost_tips'],jxItem['cost_tips'])).toFixed(2),
  100. sale_total:Number(addition(prItem['sale_total'],jxItem['sale_total'])).toFixed(2),
  101. th_total:Number(addition(prItem['th_total'],jxItem['th_total'])).toFixed(2),
  102. total_tips:Number(addition(prItem['total_tips'],jxItem['total_tips'])).toFixed(2),
  103. }
  104. })
  105. console.log(result);
  106. };
  107. switch(Number(result.code)){
  108. case 0:
  109. this.tableData = (result.data || []).map(tableItem => {
  110. /* 销售净额 = 销售额 - 退货额 **/
  111. const pure_sale = subtraction(tableItem.sale_total,tableItem.th_total)
  112. /* 指标达成率 = 销售净额 / 销售指标 **/
  113. const completion_rate = multiplication(division(pure_sale,tableItem.total_tips),100)
  114. /* 采购净额 = 采购额 - 采购退货额 **/
  115. const pure_purch = subtraction(tableItem.cgd_total,tableItem.cgd_th_total)
  116. /* 毛利润 = (本月销售净额 - 本月采购净额) **/
  117. const pure_profit = subtraction(pure_sale,pure_purch)
  118. /* 毛利率 = (本月毛利润 / 本月销售净额) * 100 **/
  119. const pure_interest_rate = multiplication(division(pure_profit,pure_sale) || 0,100)
  120. return {
  121. pure_sale,
  122. pure_purch,
  123. pure_profit,
  124. completion_rate,
  125. pure_interest_rate,
  126. month:tableItem.month,
  127. cost_tips:tableItem.cost_tips,
  128. total_tips:tableItem.total_tips,
  129. cost_rate: Number(tableItem.cost_tips) === 0 ? 0 : multiplication(division(pure_profit, tableItem.cost_tips) || 0, 100).toFixed(2)
  130. }
  131. })
  132. console.log(this.tableData);
  133. // const totalItem = createTotalItem(tableData)
  134. // totalItem.month = "年度合计"
  135. // /* 年度指标达成率 = (年度销售净额 / 年度销售指标) **/
  136. // totalItem.completion_rate = multiplication(division(totalItem.pure_sale,totalItem.total_tips),100)
  137. // /* 年度毛利润 = 年度销售额 - 年度采购额 **/
  138. // totalItem.pure_profit = subtraction(totalItem.pure_sale,totalItem.pure_purch)
  139. // /* 年度毛利率 = (年度毛利润 / 年度销售额) **/
  140. // totalItem.pure_interest_rate = multiplication(division(totalItem.pure_profit,totalItem.pure_sale),100)
  141. // this.tableData = [...tableData,totalItem]
  142. break
  143. default:
  144. break
  145. }
  146. // this.getHeight();
  147. this.loading = false;
  148. }
  149. }
  150. }
  151. </script>
  152. <style lang="scss" scoped>
  153. .new-results{
  154. .search {
  155. height:36px;
  156. display: flex;
  157. justify-content: end;
  158. padding:0px 10px;
  159. margin-top:10px
  160. }
  161. }
  162. </style>