123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182 |
- <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="元"
- />
- <el-select size="small" style="margin-right:10px" v-model="companyNo" @change="requestData">
- <el-option v-for="depart in 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"
- :clearable="false" :size="'small'" type="year" format="yyyy" align="right" placeholder="选择日期"
- :picker-options="{ disabledDate(time) { return time.getTime() > Date.now(); } }" @change="requestData" />
- </div>
- <el-row style="margin-top:10px">
- <el-table border size="mini" :data="tableData" :cell-class-name="setCellClassName">
- <el-table-column fixed="left" label="月度" prop="month" align="center" width="60px" />
- <el-table-column label="当月营收目标" align="center" min-width="140px">
- <template slot-scope="scope">
- {{unit2TenThousand(scope.row.total_tips,isTenThound)}}
- </template>
- </el-table-column>
- <el-table-column label="当月营业收入(净)" align="center" min-width="140px">
- <template slot-scope="scope">
- {{unit2TenThousand(scope.row.pure_sale,isTenThound)}}
- </template>
- </el-table-column>
- <el-table-column label="当月营收完成%" align="center" min-width="140px">
- <template slot-scope="scope">
- {{Number(scope.row.completion_rate).toFixed(2) + "%"}}
- </template>
- </el-table-column>
- <el-table-column label="当月毛利完成%" align="center" min-width="140px">
- <template slot-scope="scope">
- {{Number(scope.row.cost_rate).toFixed(2) + "%"}}
- </template>
- </el-table-column>
- <el-table-column label="当月毛利指标" align="center" min-width="140px">
- <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">
- {{unit2TenThousand(scope.row.pure_profit,isTenThound)}}
- </template>
- </el-table-column>
- </el-table>
- </el-row>
- </div>
- </template>
- <script>
- import asyncRequest from "@/api/newResults";
- import { unit2TenThousand, subtraction, multiplication, division, addition } from "../newReport/src/_utils";
- export default {
- data(){
- return {
- loading: false,
- isTenThound:true,
- daytime: "",
- tableData: [],
- companyNo: "",
- companies:[
- { value:"",label: "所有公司"},
- { value:"GS2302231125079621",label: "北京百辰荣达国际科贸有限公司"},
- { value:"GS2302231323386950",label: "北京泓源广诚国际商贸有限公司"},
- { value:"GS2203161855277894 ",label: "北京万宇恒通国际科贸有限公司"},
- { value:"GS2302231124114965",label: "普润&锦兴&知事"}
- ]
- }
- },
- mounted() {
- this.daytime = this.transformTime();
- this.requestData();
- },
- methods: {
- unit2TenThousand,
- transformTime() {
- let time = new Date();
- let y = time.getFullYear();
- let M = time.getMonth() + 1;
- let d = time.getDate();
- return y + "-" + (M < 10 ? "0" + M : M) + "-" + (d < 10 ? "0" + d : d);
- },
- async requestData() {
- this.loading = true;
- const result = await asyncRequest.companyEvery({ year: (this.daytime.split('-'))[0], companyNo: this.companyNo })
- if(this.companyNo === "GS2302231124114965"){
- const jxResult = await asyncRequest.companyEvery({ year: (this.daytime.split('-'))[0], companyNo: "GS2304031312553746" })
- result.data = result.data.map((_,index) => {
- const prItem = result.data[index];
- const jxItem = jxResult.data[index];
- return {
- month:prItem.month,
- cgd_th_total: Number(addition(prItem['cgd_th_total'],jxItem['cgd_th_total'])).toFixed(2),
- cgd_total:Number(addition(prItem['cgd_total'],jxItem['cgd_total'])).toFixed(2),
- cost_tips:Number(addition(prItem['cost_tips'],jxItem['cost_tips'])).toFixed(2),
- sale_total:Number(addition(prItem['sale_total'],jxItem['sale_total'])).toFixed(2),
- th_total:Number(addition(prItem['th_total'],jxItem['th_total'])).toFixed(2),
- total_tips:Number(addition(prItem['total_tips'],jxItem['total_tips'])).toFixed(2),
- }
- })
-
- console.log(result);
- };
-
- switch(Number(result.code)){
- case 0:
- this.tableData = (result.data || []).map(tableItem => {
- /* 销售净额 = 销售额 - 退货额 **/
- const pure_sale = subtraction(tableItem.sale_total,tableItem.th_total)
- /* 指标达成率 = 销售净额 / 销售指标 **/
- const completion_rate = multiplication(division(pure_sale,tableItem.total_tips),100)
- /* 采购净额 = 采购额 - 采购退货额 **/
- const pure_purch = subtraction(tableItem.cgd_total,tableItem.cgd_th_total)
- /* 毛利润 = (本月销售净额 - 本月采购净额) **/
- const pure_profit = subtraction(pure_sale,pure_purch)
- /* 毛利率 = (本月毛利润 / 本月销售净额) * 100 **/
- const pure_interest_rate = multiplication(division(pure_profit,pure_sale) || 0,100)
- return {
- pure_sale,
- pure_purch,
- pure_profit,
- completion_rate,
- pure_interest_rate,
- 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)
- }
- })
- console.log(this.tableData);
- // const totalItem = createTotalItem(tableData)
- // totalItem.month = "年度合计"
- // /* 年度指标达成率 = (年度销售净额 / 年度销售指标) **/
- // totalItem.completion_rate = multiplication(division(totalItem.pure_sale,totalItem.total_tips),100)
- // /* 年度毛利润 = 年度销售额 - 年度采购额 **/
- // totalItem.pure_profit = subtraction(totalItem.pure_sale,totalItem.pure_purch)
- // /* 年度毛利率 = (年度毛利润 / 年度销售额) **/
- // totalItem.pure_interest_rate = multiplication(division(totalItem.pure_profit,totalItem.pure_sale),100)
- // this.tableData = [...tableData,totalItem]
- break
- default:
- break
- }
- // this.getHeight();
- this.loading = false;
- }
- }
- }
- </script>
- <style lang="scss" scoped>
- .new-results{
- .search {
- height:36px;
- display: flex;
- justify-content: end;
- padding:0px 10px;
- margin-top:10px
- }
- }
- </style>
|