Commit 24aba5b6 authored by 潘自豪's avatar 潘自豪

营业额明细

parent 4169eb02
...@@ -38,7 +38,7 @@ export const getBusinessConditionDataByMonth = (cur_day) => fetch('/api/query/*/ ...@@ -38,7 +38,7 @@ export const getBusinessConditionDataByMonth = (cur_day) => fetch('/api/query/*/
//明细页营业额汇年 -汇总 //明细页营业额汇年 -汇总
export const getBusinessConditionDatasByYear = (cur_day) => fetch('/api/query/*/action/get_business_condition_datas_by_year', { export const getBusinessConditionDatasByYear = (cur_day) => fetch('/api/query/*/action/get_business_condition_datas_by_year', {
aux: { aux: {
cur_day: cur_dayS cur_day: cur_day
} }
}, 'POST'); }, 'POST');
// 应收账款汇总 // 应收账款汇总
...@@ -68,3 +68,31 @@ export const getAllTypeBusinessConditionDetailByDay = (cur_day) => fetch('/api/q ...@@ -68,3 +68,31 @@ export const getAllTypeBusinessConditionDetailByDay = (cur_day) => fetch('/api/q
} }
}, 'POST'); }, 'POST');
//明细页各种运输类型营业额汇总-月维度
export const getAllTypeBusinessConditionDatasByMonth = (cur_day) => fetch('/api/query/*/action/get_all_type_business_condition_datas_by_month', {
aux: {
cur_day: cur_day
}
}, 'POST');
//明细页各种运输类型营业额汇总-年维度
export const getAllTypeBusinessConditionDatasByYear = (cur_day) => fetch('/api/query/*/action/get_all_type_business_condition_datas_by_year', {
aux: {
cur_day: cur_day
}
}, 'POST');
//明细页各种运输类型营业额明细-月维度
export const getAllTypeBusinessConditionDetailByMonth = (cur_day) => fetch('/api/query/*/action/get_all_type_business_condition_detail_by_month', {
aux: {
cur_day: cur_day
}
}, 'POST');
//明细页各种运输类型营业额明细-年维度
export const getAllTypeBusinessConditionDetailByYear = (cur_day) => fetch('/api/query/*/action/get_all_type_business_condition_detail_by_year', {
aux: {
cur_day: cur_day
}
}, 'POST');
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
<div class="turnover-detail"> <div class="turnover-detail">
<div class="card-board"> <div class="card-board">
<contrast-card v-for="(data,key) in currentData.head" style="height: 100%;width: 20%;" <contrast-card v-for="(data,key) in currentData.head" style="height: 100%;width: 20%;"
@click.native="selectLegend(data)"> @click.native="selectLegend(key)">
<title-content-mark style="color: #369afa;float: left;width: 40%;font-size: 18px" <title-content-mark style="color: #369afa;float: left;width: 40%;font-size: 18px"
:title-style="{'font-weight': 'bold'}" :title="key" :content="data.amount" isBold/> :title-style="{'font-weight': 'bold'}" :title="key" :content="data.amount" isBold/>
<div <div
...@@ -33,7 +33,7 @@ import TitleContentMark from "../components/layout/title-content-mark.vue"; ...@@ -33,7 +33,7 @@ import TitleContentMark from "../components/layout/title-content-mark.vue";
import TableColumn from "../components/table/table-column.vue"; import TableColumn from "../components/table/table-column.vue";
import ContrastCard from "../components/card/contrast-card.vue"; import ContrastCard from "../components/card/contrast-card.vue";
import * as echarts from "echarts"; import * as echarts from "echarts";
import {getTrunOverDayDetail} from "./turnoverDetail" import {getTrunOver} from "./turnoverDetail"
export default { export default {
name: "TurnoverDetail", name: "TurnoverDetail",
...@@ -41,6 +41,7 @@ export default { ...@@ -41,6 +41,7 @@ export default {
data() { data() {
return { return {
today: '2023-05-19', today: '2023-05-19',
curPageCode: this.$route.query.code ? this.$route.query.code : "yye",
currentData: {}, currentData: {},
mockDataDay: { mockDataDay: {
head: { head: {
...@@ -110,168 +111,7 @@ export default { ...@@ -110,168 +111,7 @@ export default {
} }
}, },
detail: [ detail: [
{"汽运(元)": 0, "水运(元)": 0, "铁运(元)": 0, "date": "2023-05-06"}, {"汽运(元)": 0, "水运(元)": 0, "铁运(元)": 0, "date": "2023-05-06"}
{date: '2月2日', '汽运(元)': 300, '水运(元)': 786, '铁运(元)': 848},
{date: '2月3日', '汽运(元)': 500, '水运(元)': 547, '铁运(元)': 256},
{date: '2月4日', '汽运(元)': 100, '水运(元)': 632, '铁运(元)': 677},
{date: '2月5日', '汽运(元)': 300, '水运(元)': 167, '铁运(元)': 176},
{date: '2月6日', '汽运(元)': 800, '水运(元)': 264, '铁运(元)': 584},
{date: '2月7日', '汽运(元)': 100, '水运(元)': 116, '铁运(元)': 110},
{date: '2月8日', '汽运(元)': 500, '水运(元)': 527, '铁运(元)': 610},
{date: '2月9日', '汽运(元)': 1000, '水运(元)': 277, '铁运(元)': 625},
{date: '2月10日', '汽运(元)': 358, '水运(元)': 854, '铁运(元)': 775},
{date: '2月11日', '汽运(元)': 290, '水运(元)': 801, '铁运(元)': 355},
{date: '2月12日', '汽运(元)': 239, '水运(元)': 648, '铁运(元)': 837},
{date: '2月13日', '汽运(元)': 413, '水运(元)': 375, '铁运(元)': 175},
{date: '2月14日', '汽运(元)': 379, '水运(元)': 678, '铁运(元)': 462},
{date: '2月15日', '汽运(元)': 470, '水运(元)': 787, '铁运(元)': 707},
{date: '2月16日', '汽运(元)': 893, '水运(元)': 507, '铁运(元)': 645},
{date: '2月17日', '汽运(元)': 544, '水运(元)': 473, '铁运(元)': 471},
{date: '2月18日', '汽运(元)': 387, '水运(元)': 799, '铁运(元)': 615},
{date: '2月19日', '汽运(元)': 123, '水运(元)': 942, '铁运(元)': 988},
{date: '2月20日', '汽运(元)': 795, '水运(元)': 518, '铁运(元)': 481},
{date: '2月21日', '汽运(元)': 885, '水运(元)': 917, '铁运(元)': 716},
{date: '2月22日', '汽运(元)': 327, '水运(元)': 682, '铁运(元)': 947},
{date: '2月23日', '汽运(元)': 599, '水运(元)': 768, '铁运(元)': 284},
{date: '2月24日', '汽运(元)': 731, '水运(元)': 665, '铁运(元)': 408},
{date: '2月25日', '汽运(元)': 569, '水运(元)': 150, '铁运(元)': 358},
{date: '2月26日', '汽运(元)': 642, '水运(元)': 747, '铁运(元)': 697},
{date: '2月27日', '汽运(元)': 963, '水运(元)': 674, '铁运(元)': 532},
{date: '2月28日', '汽运(元)': 522, '水运(元)': 273, '铁运(元)': 587},
]
},
mockDataMonth: {
head: {
"营业额": {
title: "营业额",
amount: "20,303",
hb: [
{
title: "上月",
amount: "21,000",
rate: "-3.32%",
},
{
title: "去年",
amount: "21,000",
rate: "+4.92%",
}
]
},
"汽运营业额": {
title: "汽运营业额",
amount: "10,000",
hb: [
{
title: "上月",
amount: "11,000",
rate: "-10.00%",
},
{
title: "去年",
amount: "10,000",
rate: "+0.00%",
}
]
},
"水运营业额": {
title: "水运营业额",
amount: "20,303",
hb: [
{
title: "上月",
amount: "11,000",
rate: "-10.00%",
},
{
title: "去年",
amount: "10,000",
rate: "+0.00%",
}
]
},
"铁运营业额": {
title: "铁运营业额",
amount: "303",
hb: [
{
title: "上月",
amount: "300",
rate: "-1.00%",
},
{
title: "去年",
amount: "301",
rate: "+0.64%",
}
]
}
},
detail: [
{date: '1月', '汽运(元)': 544, '水运(元)': 473, '铁运(元)': 471},
{date: '2月', '汽运(元)': 387, '水运(元)': 799, '铁运(元)': 615},
{date: '3月', '汽运(元)': 123, '水运(元)': 942, '铁运(元)': 988},
{date: '4月', '汽运(元)': 795, '水运(元)': 518, '铁运(元)': 481},
{date: '5月', '汽运(元)': 885, '水运(元)': 917, '铁运(元)': 716},
{date: '6月', '汽运(元)': 327, '水运(元)': 682, '铁运(元)': 947},
{date: '7月', '汽运(元)': 599, '水运(元)': 768, '铁运(元)': 284},
{date: '8月', '汽运(元)': 731, '水运(元)': 665, '铁运(元)': 408},
{date: '9月', '汽运(元)': 569, '水运(元)': 150, '铁运(元)': 358},
{date: '10月', '汽运(元)': 642, '水运(元)': 747, '铁运(元)': 697},
{date: '11月', '汽运(元)': 963, '水运(元)': 674, '铁运(元)': 532},
{date: '12月', '汽运(元)': 522, '水运(元)': 273, '铁运(元)': 587},
]
},
mockDataYear: {
head: {
"营业额": {
title: "营业额",
amount: "20,303",
hb: [
{
title: "去年",
amount: "21,000",
rate: "-3.32%",
},
]
},
"汽运营业额": {
title: "汽运营业额",
amount: "10,000",
hb: [
{
title: "去年",
amount: "11,000",
rate: "-10.00%",
},
]
},
"水运营业额": {
title: "水运营业额",
amount: "20,303",
hb: [
{
title: "去年",
amount: "11,000",
rate: "-10.00%",
},
]
},
"铁运营业额": {
title: "铁运营业额",
amount: "303",
hb: [
{
title: "去年",
amount: "300",
rate: "-1.00%",
},
]
}
},
detail: [
{date: '2022年', '汽运(元)': 544, '水运(元)': 674, '铁运(元)': 532},
{date: '2023年', '汽运(元)': 387, '水运(元)': 273, '铁运(元)': 587},
] ]
}, },
chart: null, chart: null,
...@@ -353,19 +193,19 @@ export default { ...@@ -353,19 +193,19 @@ export default {
this.chart.resize(); this.chart.resize();
} }
}, },
changeDimension(dimension) { async changeDimension(dimension) {
this.currentBtn = dimension; this.currentBtn = dimension;
switch (dimension) { switch (dimension) {
case 'day': case 'day':
this.currentData = this.mockDataDay; await this.getDayDate();
this.refreshChart(); this.refreshChart();
break; break;
case 'month': case 'month':
this.currentData = this.mockDataMonth; await this.getMonthDate();
this.refreshChart(); this.refreshChart();
break; break;
case 'year': case 'year':
this.currentData = this.mockDataYear; await this.getYearDate();
this.refreshChart(); this.refreshChart();
break; break;
default: default:
...@@ -378,12 +218,13 @@ export default { ...@@ -378,12 +218,13 @@ export default {
this.chart.setOption(this.chartOption); this.chart.setOption(this.chartOption);
} }
}, },
selectLegend(data) { selectLegend(title) {
console.log(title)
let name; let name;
this.chart.dispatchAction({ this.chart.dispatchAction({
type: 'legendAllSelect' type: 'legendAllSelect'
}); });
switch (data.title) { switch (title) {
case '营业额': case '营业额':
break; break;
case '汽运营业额': case '汽运营业额':
...@@ -398,6 +239,7 @@ export default { ...@@ -398,6 +239,7 @@ export default {
default: default:
break; break;
} }
console.log(name)
if (name) { if (name) {
this.chart.dispatchAction({ this.chart.dispatchAction({
type: 'legendInverseSelect' type: 'legendInverseSelect'
...@@ -414,14 +256,21 @@ export default { ...@@ -414,14 +256,21 @@ export default {
this.chart.setOption(this.chartOption); this.chart.setOption(this.chartOption);
}, },
//获取数据 //获取日维度数据
async getDate() { async getDayDate() {
this.currentData = await getTrunOverDayDetail("yye", this.today) this.currentData = await getTrunOver("day", this.curPageCode, this.today)
},
//获取月维度数据
async getMonthDate() {
this.currentData = await getTrunOver("month", this.curPageCode, this.today)
},
//获取月维度数据
async getYearDate() {
this.currentData = await getTrunOver("year", this.curPageCode, this.today)
}, },
}, },
async mounted() { async mounted() {
console.log("mockDataDay:"+JSON.stringify(this.mockDataDay)) await this.getDayDate();
await this.getDate();
// this.currentData = this.mockDataDay; // this.currentData = this.mockDataDay;
this.refreshChart(); this.refreshChart();
setTimeout(() => { setTimeout(() => {
......
import { import {
getBusinessConditionDatas, getBusinessConditionDatas,
getAllTypeBusinessConditionDatas, getAllTypeBusinessConditionDatas,
getAllTypeBusinessConditionDetailByDay getAllTypeBusinessConditionDetailByDay,
getBusinessConditionDataByMonth,
getAllTypeBusinessConditionDatasByMonth,
getAllTypeBusinessConditionDetailByMonth,
getBusinessConditionDatasByYear,
getAllTypeBusinessConditionDatasByYear,
getAllTypeBusinessConditionDetailByYear
} from "../../api/apiList"; } from "../../api/apiList";
import {calc_hb_str, calc_tb_str, conver_amont} from "../../utils/numUtil"; import {calc_hb_str, calc_tb_str, conver_amont} from "../../utils/numUtil";
import moment from 'moment' import moment from 'moment'
//天维度数据转换 //天维度数据转换
export const getTrunOverDayDetail = async function (type, cur_day) { export const getTrunOver = async function (dimension, type, cur_day) {
let pageData = new Object(); let pageData = new Object();
pageData.head = await getHeadDay(type, cur_day) pageData.head = await getHead(dimension, type, cur_day)
pageData.detail = await getDetailDay(type, cur_day) pageData.detail = await getDetail(dimension, type, cur_day)
console.log("pageData:" + JSON.stringify(pageData))
return pageData; return pageData;
}; };
/** /**
* @param cur_day * @param cur_day
*/ */
export const getHeadDay = async function (type, cur_day) { export const getHead = async function (dimension, type, cur_day) {
let typeName = new Object({"yye": "营业额", "cb": "成本", "ml": "毛利"});
let pageName = typeName[type]
let truck = "汽运" + pageName;
let ship = "水运" + pageName;
let tran = "铁运" + pageName;
let headData = new Object(); let headData = new Object();
let res = await reqSumData(cur_day); let transportData;
headData.营业额 = adapterSumDataDay(type, res); let res = await reqDaySumData(dimension, cur_day);
let transportData = await reqTransportData(cur_day) headData[pageName] = adapterSumData(dimension, type, res);
headData.汽运营业额 = initSumDataDay(); transportData = await reqDayTransportData(dimension, cur_day)
headData.水运营业额 = initSumDataDay(); headData[truck] = initSumDataDay();
headData.铁运营业额 = initSumDataDay(); headData[ship] = initSumDataDay();
headData[tran] = initSumDataDay();
if (transportData[10]) { if (transportData[10]) {
headData.汽运营业额 = adapterSumDataDay(type, transportData[10]); headData[truck] = adapterSumData(dimension, type, transportData[10]);
} }
if (transportData[30]) { if (transportData[30]) {
headData.水运营业额 = adapterSumDataDay(type, transportData[30]); headData[ship] = adapterSumData(dimension, type, transportData[30]);
} }
if (transportData[20]) { if (transportData[20]) {
headData.铁运营业额 = adapterSumDataDay(type, transportData[20]); headData[tran] = adapterSumData(dimension, type, transportData[20]);
} }
return headData; return headData;
}; };
//获取折线图明细 //获取折线图明细
export const getDetailDay = async function (type, cur_day) { export const getDetail = async function (dimension, type, cur_day) {
let transportDetail = await reqTransportDetailDayData(cur_day) let res;
return adapterDetailDataDay(type, transportDetail) if (dimension == 'day') {
res = await getAllTypeBusinessConditionDetailByDay(moment(cur_day).format('YYYY-MM'));
}
if (dimension == 'month') {
res = await getAllTypeBusinessConditionDetailByMonth(cur_day)
}
if (dimension == 'year') {
res = await getAllTypeBusinessConditionDetailByYear(cur_day)
}
let data = res.data
return adapterDetailData(dimension, type, data)
}; };
//获取汇总数据 //获取全部汇总数据
export const reqSumData = async function (cur_day) { export const reqDaySumData = async function (dimension, cur_day) {
let res = await getBusinessConditionDatas(cur_day); let res;
if (dimension == 'day') {
res = await getBusinessConditionDatas(cur_day);
}
if (dimension == 'month') {
res = await getBusinessConditionDataByMonth(cur_day);
}
if (dimension == 'year') {
res = await getBusinessConditionDatasByYear(cur_day);
}
let data = res.data let data = res.data
return data; return data;
} }
//获取汇总数据 //获取每个运输方式汇总数据
export const reqTransportData = async function (cur_day) { export const reqDayTransportData = async function (dimension, cur_day) {
let res = await getAllTypeBusinessConditionDatas(cur_day); let res;
if (dimension == 'day') {
res = await getAllTypeBusinessConditionDatas(cur_day);
}
if (dimension == 'month') {
res = await getAllTypeBusinessConditionDatasByMonth(cur_day);
}
if (dimension == 'year') {
res = await getAllTypeBusinessConditionDatasByYear(cur_day);
}
let data = res.data let data = res.data
return data; return data;
} }
//获取明细数据数据 //获取明细数据数据
export const reqTransportDetailDayData = async function (cur_day) { export const reqTransportDetailDayData = async function (cur_day) {
let res = await getAllTypeBusinessConditionDetailByDay(moment(cur_day).format('YYYY-MM')); let res = await getAllTypeBusinessConditionDetailByDay(moment(cur_day).format('YYYY-MM'));
...@@ -64,6 +104,26 @@ export const reqTransportDetailDayData = async function (cur_day) { ...@@ -64,6 +104,26 @@ export const reqTransportDetailDayData = async function (cur_day) {
} }
/**
* 数据匹配
* @param type
* @param data
*/
export const adapterSumData = function (dimension, type, data) {
let res;
if (dimension == 'day') {
res = adapterSumDataDay(type, data);
}
if (dimension == 'month') {
res = adapterSumDataMonth(type, data);
}
if (dimension == 'year') {
res = adapterSumDataYear(type, data);
}
return res;
}
/** /**
*日维度汇总 *日维度汇总
* @param type yye:营业额、cb:成本、ml:毛利 * @param type yye:营业额、cb:成本、ml:毛利
...@@ -167,7 +227,7 @@ export const initSumDataDay = function () { ...@@ -167,7 +227,7 @@ export const initSumDataDay = function () {
* @param type * @param type
* @param data * @param data
*/ */
export const adapterSumDatamonth = function (type, data) { export const adapterSumDataMonth = function (type, data) {
let turnOver = new Object() let turnOver = new Object()
let hb = new Array() let hb = new Array()
if (type == 'yye') { if (type == 'yye') {
...@@ -233,6 +293,7 @@ export const adapterSumDatamonth = function (type, data) { ...@@ -233,6 +293,7 @@ export const adapterSumDatamonth = function (type, data) {
} }
turnOver.hb = hb; turnOver.hb = hb;
} }
return turnOver;
} }
/** /**
...@@ -282,6 +343,7 @@ export const adapterSumDataYear = function (type, data) { ...@@ -282,6 +343,7 @@ export const adapterSumDataYear = function (type, data) {
} }
turnOver.hb = hb; turnOver.hb = hb;
} }
return turnOver;
} }
...@@ -291,12 +353,22 @@ export const adapterSumDataYear = function (type, data) { ...@@ -291,12 +353,22 @@ export const adapterSumDataYear = function (type, data) {
* @param data * @param data
* @returns {any[]} * @returns {any[]}
*/ */
export const adapterDetailDataDay = function (type, data) { export const adapterDetailData = function (dimension, type, data) {
let list = new Array() let list = new Array()
let detail = null let detail = null
for (let key in data) { for (let key in data) {
detail = detailConver(type, data[key]) detail = detailConver(type, data[key])
detail.date = moment(key).format('MM月DD日'); let date;
if (dimension == 'day') {
date = moment(key).format('MM月DD日')
}
if (dimension == 'month') {
date = moment(key).format('MM月')
}
if (dimension == 'year') {
date = moment(key).format('YYYY年')
}
detail.date = date;
list.push(detail); list.push(detail);
} }
return list; return list;
...@@ -310,7 +382,6 @@ export const adapterDetailDataDay = function (type, data) { ...@@ -310,7 +382,6 @@ export const adapterDetailDataDay = function (type, data) {
*/ */
export const detailConver = function (type, detailList) { export const detailConver = function (type, detailList) {
let detail = initDetail(); let detail = initDetail();
console.log(typeof detailList)
for (let det in detailList) { for (let det in detailList) {
let data = detailList[det] let data = detailList[det]
//初始化 //初始化
......
...@@ -170,7 +170,7 @@ export default { ...@@ -170,7 +170,7 @@ export default {
}, },
data() { data() {
return { return {
today: '2023-06-19', today: '2023-05-19',
yyqk: { yyqk: {
yye: { yye: {
title: "营业额", title: "营业额",
...@@ -233,59 +233,6 @@ export default { ...@@ -233,59 +233,6 @@ export default {
{title: "XX有限公司", column: [{key: "未收款(万元)", value: 0}]}, {title: "XX有限公司", column: [{key: "未收款(万元)", value: 0}]},
], ],
mockData: { mockData: {
yyqk: {
yye: {
title: "营业额",
amount: "20,303",
unit: "万元",
hb: [
{
title: "昨天",
amount: "21,000",
rate: "-3.32%",
},
{
title: "上月",
amount: "20,000",
rate: "+4.92%",
},
],
},
cb: {
title: "成本",
amount: "10,303",
unit: "万元",
hb: [
{
title: "昨日",
amount: "11,000",
rate: "-2.68%",
},
{
title: "上月",
amount: "10,000",
rate: "+5.71%",
},
],
},
ml: {
title: "毛利",
amount: "10,000",
unit: "万元",
hb: [
{
title: "昨日",
amount: "10,000",
rate: "0.00%",
},
{
title: "上月",
amount: "10,000",
rate: "0.00%",
},
],
},
},
zqk: { zqk: {
yszk: { yszk: {
title: "应收账款", title: "应收账款",
...@@ -460,9 +407,9 @@ export default { ...@@ -460,9 +407,9 @@ export default {
}, },
}, },
paths: { paths: {
"营业额": "/turnover-detail", "营业额": "yye",
"成本": "/turnover-detail", "成本": "cb",
"毛利": "/turnover-detail", "毛利": "ml",
}, },
charts: {} charts: {}
} }
...@@ -470,7 +417,6 @@ export default { ...@@ -470,7 +417,6 @@ export default {
methods: { methods: {
cellStyleFunction(data) { cellStyleFunction(data) {
let res = {color: '#33ff66'}; let res = {color: '#33ff66'};
console.log(data + ":" + data.indexOf('+'))
if (data.indexOf('-') !== -1) { if (data.indexOf('-') !== -1) {
res.color = '#ff3300' res.color = '#ff3300'
} }
...@@ -481,9 +427,8 @@ export default { ...@@ -481,9 +427,8 @@ export default {
this.charts[chartsKey].resize(); this.charts[chartsKey].resize();
} }
}, },
routerTo(path) { routerTo(code) {
console.log(path) this.$router.push({path: "/turnover-detail", query: {code: code}});
this.$router.push({path: path});
}, },
//营业情况 //营业情况
showBusinessConditionDatas() { showBusinessConditionDatas() {
......
...@@ -23,7 +23,7 @@ export default { ...@@ -23,7 +23,7 @@ export default {
name: 'app', name: 'app',
data() { data() {
return { return {
countDown: 10, countDown: 10000,
isRouterAlive: true, isRouterAlive: true,
countDownTimer: null, countDownTimer: null,
} }
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment