Commit 3b61dddd authored by 王礼鸿 Baimax Wang's avatar 王礼鸿 Baimax Wang

Merge remote-tracking branch 'origin/ld_databoard_fix' into ld_databoard_fix

# Conflicts:
#	src/module/api/apiList.js
#	src/module/databoard/databoard/turnover-detail.vue
#	src/module/databoard/index.vue
parents 53bbe868 24aba5b6
...@@ -30,7 +30,7 @@ export const getBusinessConditionDatas = (cur_day) => fetch('/api/query/*/action ...@@ -30,7 +30,7 @@ export const getBusinessConditionDatas = (cur_day) => fetch('/api/query/*/action
//明细页营业额汇月 -汇总 //明细页营业额汇月 -汇总
export const getBusinessConditionDataByMonth = (cur_day) => fetch('/api/query/*/action/get_business_condition_datas_by_month', { export const getBusinessConditionDataByMonth = (cur_day) => fetch('/api/query/*/action/get_business_condition_datas_by_month', {
aux: { aux: {
cur_day: cur_dayS cur_day: cur_day
} }
}, 'POST'); }, 'POST');
...@@ -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');
...@@ -62,6 +62,49 @@ export const arMonthlyBar = () => fetch("/api/query/dash_board/action/get_ar_mon ...@@ -62,6 +62,49 @@ export const arMonthlyBar = () => fetch("/api/query/dash_board/action/get_ar_mon
export const arCompanyMonthlyBar = (company) => fetch("/api/query/dash_board/action/get_ar_company_monthly_bar", {aux: {company: company}}, "POST") export const arCompanyMonthlyBar = (company) => fetch("/api/query/dash_board/action/get_ar_company_monthly_bar", {aux: {company: company}}, "POST")
// 开票月份 应收账款(结算单位) // 开票月份 应收账款(结算单位)
export const arMonthlyCompanyBar = (month) => fetch("/api/query/dash_board/action/get_ar_monthly_company_bar", {aux: {month: month}}, "POST") export const arMonthlyCompanyBar = (month) => fetch("/api/query/dash_board/action/get_ar_monthly_company_bar", {aux: {month: month}}, "POST")
//明细页营业额汇月 -汇总
export const getAllTypeBusinessConditionDatas = (cur_day) => fetch('/api/query/*/action/get_all_type_business_condition_datas', {
aux: {
cur_day: cur_day
}
}, 'POST');
//明细页各种运输类型营业额明细
export const getAllTypeBusinessConditionDetailByDay = (cur_day) => fetch('/api/query/*/action/get_all_type_business_condition_detail_by_day', {
aux: {
cur_day: cur_day
}
}, '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');
export const transportTypeOrderFinishPie = (date) => fetch("/api/query/dash_board/action/get_order_finish_data_by_transport_type_day", {aux: {"cur_day":date}}, "POST") export const transportTypeOrderFinishPie = (date) => fetch("/api/query/dash_board/action/get_order_finish_data_by_transport_type_day", {aux: {"cur_day":date}}, "POST")
export const customerOrderFinishPie = (date) => fetch("/api/query/dash_board/action/get_order_finish_data_by_customer_day", {aux: {"cur_day":date}}, "POST") export const customerOrderFinishPie = (date) => fetch("/api/query/dash_board/action/get_order_finish_data_by_customer_day", {aux: {"cur_day":date}}, "POST")
......
<template> <template>
<div class="turnover-detail"> <div class="turnover-detail">
<div class="card-board"> <div class="card-board">
<contrast-card v-for="data in currentData.head" style="height: 100%;width: 20%;" :class="{'selectCard': currentCard === data.title}" @click.native="selectLegend(data)"> <contrast-card v-for="(data,key) in currentData.head" style="height: 100%;width: 20%;" :class="{'selectCard': key}"
<title-content-mark style="color: #369afa;float: left;width: 40%;font-size: 18px" :title-style="{'font-weight': 'bold'}" :title="data.title" :content="data.amount" isBold/> @click.native="selectLegend(key)">
<div style="width: 60%; height: 100%; float:left; padding: 2% 2% 0 8%; line-height: 60px; display: flex; align-items: center;font-size: 16px;"> <title-content-mark style="color: #369afa;float: left;width: 40%;font-size: 18px"
:title-style="{'font-weight': 'bold'}" :title="key" :content="data.amount" isBold/>
<div
style="width: 60%; height: 100%; float:left; padding: 2% 2% 0 8%; line-height: 60px; display: flex; align-items: center;font-size: 16px;">
<table-column style="float: left;width: 25%;" :data="data.hb" name="title"/> <table-column style="float: left;width: 25%;" :data="data.hb" name="title"/>
<table-column style="float: left;width: 40%;" :data="data.hb" name="amount"/> <table-column style="float: left;width: 40%;" :data="data.hb" name="amount"/>
<table-column style="float: left;width: 35%;" :data="data.hb" name="rate" cell-style-js="var res = {color: '#5eeef4'}; if(data.indexOf('+') !== -1){res.color = '#fee064'} res;"/> <table-column style="float: left;width: 35%;" :data="data.hb" name="rate"
cell-style-js="var res = {color: '#5eeef4'}; if(data.indexOf('+') !== -1){res.color = '#fee064'} res;"/>
</div> </div>
</contrast-card> </contrast-card>
</div> </div>
<div class="menu"> <div class="menu">
<input type="button" :class="{'selectedBtn': currentBtn === 'day'}" value="日统计" @click="changeDimension('day')"> <input type="button" :class="{'selectedBtn': currentBtn === 'day'}" value="日统计"
<input type="button" :class="{'selectedBtn': currentBtn === 'month'}" value="月统计" @click="changeDimension('month')"> @click="changeDimension('day')">
<input type="button" :class="{'selectedBtn': currentBtn === 'year'}" value="年统计" @click="changeDimension('year')"> <input type="button" :class="{'selectedBtn': currentBtn === 'month'}" value="月统计"
@click="changeDimension('month')">
<input type="button" :class="{'selectedBtn': currentBtn === 'year'}" value="年统计"
@click="changeDimension('year')">
</div> </div>
<div class="chart"> <div class="chart">
<div ref="chart" style="width: 100%;height: 100%;" @click=""/> <div ref="chart" style="width: 100%;height: 100%;" @click=""/>
...@@ -26,16 +33,19 @@ import TitleContentMark from "../components/layout/title-content-mark.vue"; ...@@ -26,16 +33,19 @@ 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 {getTrunOver} from "./turnoverDetail"
export default { export default {
name:"TurnoverDetail", name: "TurnoverDetail",
components: {ContrastCard, TableColumn, TitleContentMark}, components: {ContrastCard, TableColumn, TitleContentMark},
data() { data() {
return { return {
today: '2023-05-19',
curPageCode: this.$route.query.code ? this.$route.query.code : "yye",
currentData: {}, currentData: {},
mockDataDay:{ mockDataDay: {
head:{ head: {
"营业额":{ "营业额": {
title: "营业额", title: "营业额",
amount: "20,303", amount: "20,303",
hb: [ hb: [
...@@ -51,7 +61,7 @@ export default { ...@@ -51,7 +61,7 @@ export default {
} }
] ]
}, },
"汽运营业额":{ "汽运营业额": {
title: "汽运营业额", title: "汽运营业额",
amount: "10,000", amount: "10,000",
hb: [ hb: [
...@@ -67,7 +77,7 @@ export default { ...@@ -67,7 +77,7 @@ export default {
} }
] ]
}, },
"水运营业额":{ "水运营业额": {
title: "水运营业额", title: "水运营业额",
amount: "20,303", amount: "20,303",
hb: [ hb: [
...@@ -83,7 +93,7 @@ export default { ...@@ -83,7 +93,7 @@ export default {
} }
] ]
}, },
"铁运营业额":{ "铁运营业额": {
title: "铁运营业额", title: "铁运营业额",
amount: "303", amount: "303",
hb: [ hb: [
...@@ -100,169 +110,8 @@ export default { ...@@ -100,169 +110,8 @@ export default {
] ]
} }
}, },
detail:[ detail: [
{ date: '2月1日', '汽运(元)': 0, '水运(元)': 747, '铁运(元)': 674 }, {"汽运(元)": 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,
...@@ -361,37 +210,38 @@ export default { ...@@ -361,37 +210,38 @@ 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:
return; return;
} }
}, },
refreshChart(){ refreshChart() {
this.chartOption.dataset.source = this.currentData.detail this.chartOption.dataset.source = this.currentData.detail
if (this.chart){ if (this.chart) {
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 '汽运营业额':
...@@ -406,7 +256,8 @@ export default { ...@@ -406,7 +256,8 @@ export default {
default: default:
break; break;
} }
if (name){ console.log(name)
if (name) {
this.chart.dispatchAction({ this.chart.dispatchAction({
type: 'legendInverseSelect' type: 'legendInverseSelect'
}); });
...@@ -414,9 +265,9 @@ export default { ...@@ -414,9 +265,9 @@ export default {
type: 'legendSelect', type: 'legendSelect',
name: name name: name
}) })
this.chartOption.series[3].encode = {x: 'date',y: name}; this.chartOption.series[3].encode = {x: 'date', y: name};
this.chartOption.series[3].data = undefined; this.chartOption.series[3].data = undefined;
}else { } else {
this.chartOption.series[3].data = []; this.chartOption.series[3].data = [];
} }
this.currentLegend = name; this.currentLegend = name;
...@@ -424,49 +275,65 @@ export default { ...@@ -424,49 +275,65 @@ export default {
this.chart.setOption(this.chartOption); this.chart.setOption(this.chartOption);
}, },
//获取日维度数据
async getDayDate() {
this.currentData = await getTrunOver("day", this.curPageCode, this.today)
},
//获取月维度数据
async getMonthDate() {
this.currentData = await getTrunOver("month", this.curPageCode, this.today)
}, },
mounted() { //获取月维度数据
this.currentData = this.mockDataDay; async getYearDate() {
this.currentData = await getTrunOver("year", this.curPageCode, this.today)
},
},
async mounted() {
await this.getDayDate();
// this.currentData = this.mockDataDay;
this.refreshChart(); this.refreshChart();
setTimeout(() => { setTimeout(() => {
let chartDom = this.$refs.chart; let chartDom = this.$refs.chart;
this.chart = echarts.init(chartDom); this.chart = echarts.init(chartDom);
this.chart.setOption(this.chartOption); this.chart.setOption(this.chartOption);
window.addEventListener('resize', this.resizeChart); window.addEventListener('resize', this.resizeChart);
}, 500) }, 500);
}, },
beforeDestroy() { beforeDestroy() {
window.removeEventListener("resize", this.resizeChart); window.removeEventListener("resize", this.resizeChart);
}, },
props:{ props: {},
},
} }
</script> </script>
<style scoped> <style scoped>
.turnover-detail{ .turnover-detail {
width: 100%; width: 100%;
height: 100%; height: 100%;
} }
.card-board{
.card-board {
width: 100%; width: 100%;
height: 25%; height: 25%;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
padding: 2rem; padding: 2rem;
} }
.menu{
.menu {
width: 100%; width: 100%;
height: 5%; height: 5%;
display: flex; display: flex;
align-items: center; align-items: center;
padding-left: 5%; padding-left: 5%;
} }
.chart{
.chart {
width: 100%; width: 100%;
height: 70%; height: 70%;
} }
input[type="button"]{
input[type="button"] {
height: 80%; height: 80%;
margin: 0.5%; margin: 0.5%;
border: none; border: none;
...@@ -477,6 +344,7 @@ input[type="button"]{ ...@@ -477,6 +344,7 @@ input[type="button"]{
color: #00c8d6; color: #00c8d6;
background-color: #1234a1; background-color: #1234a1;
} }
input[type="button"]:hover{ input[type="button"]:hover{
color: #1234a1 !important; color: #1234a1 !important;
background-color: #00c8d6 !important; background-color: #00c8d6 !important;
...@@ -485,7 +353,8 @@ input[type="button"]:hover{ ...@@ -485,7 +353,8 @@ input[type="button"]:hover{
color: #1234a1 !important; color: #1234a1 !important;
background-color: #00c8d6 !important; background-color: #00c8d6 !important;
} }
.unSelectedBtn{
.unSelectedBtn {
color: #00c8d6; color: #00c8d6;
background-color: #1234a1; background-color: #1234a1;
} }
......
import {
getBusinessConditionDatas,
getAllTypeBusinessConditionDatas,
getAllTypeBusinessConditionDetailByDay,
getBusinessConditionDataByMonth,
getAllTypeBusinessConditionDatasByMonth,
getAllTypeBusinessConditionDetailByMonth,
getBusinessConditionDatasByYear,
getAllTypeBusinessConditionDatasByYear,
getAllTypeBusinessConditionDetailByYear
} from "../../api/apiList";
import {calc_hb_str, calc_tb_str, conver_amont} from "../../utils/numUtil";
import moment from 'moment'
//天维度数据转换
export const getTrunOver = async function (dimension, type, cur_day) {
let pageData = new Object();
pageData.head = await getHead(dimension, type, cur_day)
pageData.detail = await getDetail(dimension, type, cur_day)
return pageData;
};
/**
* @param 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 transportData;
let res = await reqDaySumData(dimension, cur_day);
headData[pageName] = adapterSumData(dimension, type, res);
transportData = await reqDayTransportData(dimension, cur_day)
headData[truck] = initSumDataDay();
headData[ship] = initSumDataDay();
headData[tran] = initSumDataDay();
if (transportData[10]) {
headData[truck] = adapterSumData(dimension, type, transportData[10]);
}
if (transportData[30]) {
headData[ship] = adapterSumData(dimension, type, transportData[30]);
}
if (transportData[20]) {
headData[tran] = adapterSumData(dimension, type, transportData[20]);
}
return headData;
};
//获取折线图明细
export const getDetail = async function (dimension, type, cur_day) {
let res;
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 reqDaySumData = async function (dimension, 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
return data;
}
//获取每个运输方式汇总数据
export const reqDayTransportData = async function (dimension, 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
return data;
}
//获取明细数据数据
export const reqTransportDetailDayData = async function (cur_day) {
let res = await getAllTypeBusinessConditionDetailByDay(moment(cur_day).format('YYYY-MM'));
let data = res.data
return data;
}
/**
* 数据匹配
* @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 data
*/
export const adapterSumDataDay = function (type, data) {
let turnOver = new Object()
let hb = new Array()
if (type == 'yye') {
turnOver.title = '营业额'
turnOver.amount = conver_amont(data.cur_sell_settle_amount);
//昨日环比
if (data.pre_sell_settle_amount) {
let yesterday = new Object()
yesterday.title = '昨日'
yesterday.amount = conver_amont(data.pre_sell_settle_amount);
yesterday.rate = calc_hb_str(data.cur_sell_settle_amount, data.pre_sell_settle_amount);
hb.push(yesterday)
}
//昨日环比
if (data.pre_month_sell_settle_amount) {
let premonth = new Object()
premonth.title = '上月'
premonth.amount = conver_amont(data.pre_month_sell_settle_amount);
premonth.rate = calc_tb_str(data.cur_sell_settle_amount, data.pre_month_sell_settle_amount);
hb.push(premonth)
}
turnOver.hb = hb;
}
if (type == 'cb') {
turnOver.title = '成本'
turnOver.amount = conver_amont(data.cur_buy_settle_amount);
//昨日环比
if (data.pre_buy_settle_amount) {
let yesterday = new Object()
yesterday.title = '昨日'
yesterday.amount = conver_amont(data.pre_buy_settle_amount);
yesterday.rate = calc_hb_str(data.cur_buy_settle_amount, data.pre_buy_settle_amount);
hb.push(yesterday)
}
//昨日环比
if (data.pre_month_buy_settle_amount) {
let premonth = new Object()
premonth.title = '上月'
premonth.amount = conver_amont(data.pre_month_buy_settle_amount);
premonth.rate = calc_tb_str(data.cur_buy_settle_amount, data.pre_month_buy_settle_amount);
hb.push(premonth)
}
turnOver.hb = hb;
}
if (type == 'ml') {
turnOver.title = '毛利'
turnOver.amount = conver_amont(data.cur_gross_profit_amount);
//昨日环比
if (data.pre_gross_profit_amount) {
let yesterday = new Object()
yesterday.title = '昨日'
yesterday.amount = conver_amont(data.pre_gross_profit_amount);
yesterday.rate = calc_hb_str(data.cur_gross_profit_amount, data.pre_gross_profit_amount);
hb.push(yesterday)
}
//昨日环比
if (data.pre_month_gross_profit_amount) {
let premonth = new Object()
premonth.title = '上月'
premonth.amount = conver_amont(data.pre_month_gross_profit_amount);
premonth.rate = calc_tb_str(data.cur_gross_profit_amount, data.pre_month_gross_profit_amount);
hb.push(premonth)
}
turnOver.hb = hb;
}
return turnOver;
}
/**
* 初始化汇总数据
* @returns {Object}
*/
export const initSumDataDay = function () {
let turnOver = new Object()
turnOver.title = '营业额'
turnOver.amount = "0.0"
let hb = new Array()
let yesterday = new Object()
yesterday.title = '昨日'
yesterday.amount = "0.0"
yesterday.rate = "0.0"
hb.push(yesterday)
yesterday = new Object()
yesterday.title = '上月'
yesterday.amount = "0.0"
yesterday.rate = "0.0"
hb.push(yesterday)
turnOver.hb = hb
return turnOver;
}
/**
* 月维度汇总
* @param type
* @param data
*/
export const adapterSumDataMonth = function (type, data) {
let turnOver = new Object()
let hb = new Array()
if (type == 'yye') {
turnOver.title = '营业额'
turnOver.amount = conver_amont(data.cur_month_buy_settle_amount);
//昨日环比
if (data.pre_month_sell_settle_amount) {
let yesterday = new Object()
yesterday.title = '上月'
yesterday.amount = conver_amont(data.pre_month_sell_settle_amount);
yesterday.rate = calc_hb_str(data.cur_month_buy_settle_amount, data.pre_month_sell_settle_amount);
hb.push(yesterday)
}
//昨日环比
if (data.pre_year_sell_settle_amount) {
let premonth = new Object()
premonth.title = '去年'
premonth.amount = conver_amont(data.pre_year_sell_settle_amount);
premonth.rate = calc_tb_str(data.cur_sell_settle_amount, data.pre_year_sell_settle_amount);
hb.push(premonth)
}
turnOver.hb = hb;
}
if (type == 'cb') {
turnOver.title = '成本'
turnOver.amount = conver_amont(data.cur_month_buy_settle_amount);
//上月环比
if (data.pre_month_buy_settle_amount) {
let yesterday = new Object()
yesterday.title = '上月'
yesterday.amount = conver_amont(data.pre_month_buy_settle_amount);
yesterday.rate = calc_hb_str(data.cur_month_buy_settle_amount, data.pre_month_buy_settle_amount);
hb.push(yesterday)
}
//去年环比
if (data.pre_year_buy_settle_amount) {
let premonth = new Object()
premonth.title = '去年'
premonth.amount = conver_amont(data.pre_year_buy_settle_amount);
premonth.rate = calc_tb_str(data.cur_month_buy_settle_amount, data.pre_year_buy_settle_amount);
hb.push(premonth)
}
turnOver.hb = hb;
}
if (type == 'ml') {
turnOver.title = '毛利'
turnOver.amount = conver_amont(data.cur_month_gross_profit_amount);
//昨日环比
if (data.pre_month_gross_profit_amount) {
let yesterday = new Object()
yesterday.title = '上月'
yesterday.amount = conver_amont(data.pre_month_gross_profit_amount);
yesterday.rate = calc_hb_str(data.cur_month_gross_profit_amount, data.pre_month_gross_profit_amount);
hb.push(yesterday)
}
//昨日环比
if (data.pre_year_gross_profit_amount) {
let premonth = new Object()
premonth.title = '去年'
premonth.amount = conver_amont(data.pre_year_gross_profit_amount);
premonth.rate = calc_tb_str(data.cur_month_gross_profit_amount, data.pre_year_gross_profit_amount);
hb.push(premonth)
}
turnOver.hb = hb;
}
return turnOver;
}
/**
* 月维度汇总
* @param type
* @param data
*/
export const adapterSumDataYear = function (type, data) {
let turnOver = new Object()
let hb = new Array()
if (type == 'yye') {
turnOver.title = '营业额'
turnOver.amount = conver_amont(data.cur_year_sell_settle_amount);
//昨日环比
if (data.pre_year_sell_settle_amount) {
let yesterday = new Object()
yesterday.title = '去年'
yesterday.amount = conver_amont(data.pre_year_sell_settle_amount);
yesterday.rate = calc_hb_str(data.cur_year_sell_settle_amount, data.pre_year_sell_settle_amount);
hb.push(yesterday)
}
turnOver.hb = hb;
}
if (type == 'cb') {
turnOver.title = '成本'
turnOver.amount = conver_amont(data.cur_year_buy_settle_amount);
//上月环比
if (data.pre_year_buy_settle_amount) {
let yesterday = new Object()
yesterday.title = '去年'
yesterday.amount = conver_amont(data.pre_year_buy_settle_amount);
yesterday.rate = calc_hb_str(data.cur_year_buy_settle_amount, data.pre_year_buy_settle_amount);
hb.push(yesterday)
}
turnOver.hb = hb;
}
if (type == 'ml') {
turnOver.title = '毛利'
turnOver.amount = conver_amont(data.cur_year_gross_profit_amount);
//昨日环比
if (data.pre_year_gross_profit_amount) {
let yesterday = new Object()
yesterday.title = '去年'
yesterday.amount = conver_amont(data.pre_year_gross_profit_amount);
yesterday.rate = calc_hb_str(data.cur_year_gross_profit_amount, data.pre_year_gross_profit_amount);
hb.push(yesterday)
}
turnOver.hb = hb;
}
return turnOver;
}
/**
* 详细数据匹配
* @param type
* @param data
* @returns {any[]}
*/
export const adapterDetailData = function (dimension, type, data) {
let list = new Array()
let detail = null
for (let key in data) {
detail = detailConver(type, data[key])
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);
}
return list;
}
/**
* 详细数据转换
* @param type
* @param detailList
* @returns {Object}
*/
export const detailConver = function (type, detailList) {
let detail = initDetail();
for (let det in detailList) {
let data = detailList[det]
//初始化
if (type == 'yye') {
if (data.cur_transport_type == '10') {
detail['汽运(元)'] = data.cur_sell_settle_amount;
}
if (data.cur_transport_type == '30') {
detail['水运(元)'] = data.cur_sell_settle_amount
}
if (data.cur_transport_type == '20') {
detail['铁运(元)'] = data.cur_sell_settle_amount
}
}
if (type == 'cb') {
if (data.cur_transport_type == '10') {
detail['汽运(元)'] = data.cur_buy_settle_amount
}
if (data.cur_transport_type == '30') {
detail['水运(元)'] = data.cur_buy_settle_amount
}
if (data.cur_transport_type == '20') {
detail['铁运(元)'] = data.cur_buy_settle_amount
}
}
if (type == 'ml') {
if (data.cur_transport_type == '10') {
detail['汽运(元)'] = data.cur_gross_profit_amount
}
if (data.cur_transport_type == '30') {
detail['水运(元)'] = data.cur_gross_profit_amount
}
if (data.cur_transport_type == '20') {
detail['铁运(元)'] = data.cur_gross_profit_amount
}
}
}
return detail;
}
/**
* @returns {{}}
*/
export const initDetail = function () {
let detail = {};
detail['汽运(元)'] = 0
detail['水运(元)'] = 0
detail['铁运(元)'] = 0
return detail;
}
...@@ -4,7 +4,7 @@ ...@@ -4,7 +4,7 @@
<display-board class="trade_left" title="营业情况"> <display-board class="trade_left" title="营业情况">
<div <div
style="height: 100%; display: flex; flex-direction: column; justify-content: space-around; padding: 0 1rem 0 1rem;"> style="height: 100%; display: flex; flex-direction: column; justify-content: space-around; padding: 0 1rem 0 1rem;">
<contrast-card v-for="data in yyqk" style="height: 28%;" @click.native="routerTo(paths[data.title])"> <contrast-card v-for="data in yyqk" style="height: 28%;" @click.native="routerTo1(paths[data.title])">
<title-content-mark style="width: 40%;color: #369afa;float: left;" :title="data.title" <title-content-mark style="width: 40%;color: #369afa;float: left;" :title="data.title"
:content="data.amount" :mark="data.unit"/> :content="data.amount" :mark="data.unit"/>
<div <div
...@@ -133,8 +133,8 @@ ...@@ -133,8 +133,8 @@
</div> </div>
<display-board class="trade_right" title="当日订单量占比"> <display-board class="trade_right" title="当日订单量占比">
<div style="height: 100%; display: flex; flex-direction: column; justify-content: space-around; padding: 0 1rem 0 1rem;"> <div style="height: 100%; display: flex; flex-direction: column; justify-content: space-around; padding: 0 1rem 0 1rem;">
<ring-pie-chart ref="transportTypeChart" style="width: 100%;height: 50%;z-index: 999" name="运输类型占比" :data="transportTypeOrderFinishPie" @click.native="routerTo('/order-proportion')"/> <ring-pie-chart ref="transportTypeChart" style="width: 100%;height: 50%;z-index: 999" name="运输类型占比" :data="transportTypeOrderFinishPie" @click.native="routerTo1('/order-proportion')"/>
<ring-pie-chart ref="customerChart" style="width: 100%;height: 50%;" name="公司占比" :data="customerOrderFinishPie" @click.native="routerTo('/order-proportion')"/> <ring-pie-chart ref="customerChart" style="width: 100%;height: 50%;" name="公司占比" :data="customerOrderFinishPie" @click.native="routerTo1('/order-proportion')"/>
</div> </div>
</display-board> </display-board>
</div> </div>
...@@ -168,6 +168,7 @@ export default { ...@@ -168,6 +168,7 @@ export default {
}, },
data() { data() {
return { return {
today: '2023-05-19',
// today: moment().format("yyyy-MM-DD"), // today: moment().format("yyyy-MM-DD"),
today: '2023-06-19', today: '2023-06-19',
yyqk: { yyqk: {
...@@ -398,9 +399,9 @@ export default { ...@@ -398,9 +399,9 @@ export default {
}, },
}, },
paths: { paths: {
"营业额": "/turnover-detail", "营业额": "yye",
"成本": "/turnover-detail", "成本": "cb",
"毛利": "/turnover-detail", "毛利": "ml",
}, },
dataset:{}, dataset:{},
transportTypeOrderFinishPie:[], transportTypeOrderFinishPie:[],
...@@ -414,7 +415,6 @@ export default { ...@@ -414,7 +415,6 @@ export default {
}, },
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'
} }
...@@ -425,7 +425,10 @@ export default { ...@@ -425,7 +425,10 @@ export default {
this.charts[chartsKey].resize(); this.charts[chartsKey].resize();
} }
}, },
routerTo(path){ routerTo(code) {
this.$router.push({path: "/turnover-detail", query: {code: code}});
},
routerTo1(path){
this.$router.push({path: path}); this.$router.push({path: path});
}, },
//营业情况 //营业情况
......
...@@ -24,7 +24,7 @@ export default { ...@@ -24,7 +24,7 @@ export default {
name: 'app', name: 'app',
data() { data() {
return { return {
countDown: 10, countDown: 10000,
isRouterAlive: true, isRouterAlive: true,
countDownTimer: null, countDownTimer: null,
} }
......
...@@ -18,10 +18,19 @@ export const conver_num_rate = function (amont) { ...@@ -18,10 +18,19 @@ export const conver_num_rate = function (amont) {
if (amont > 0) { if (amont > 0) {
return "+" + amont + "%" return "+" + amont + "%"
} else { } else {
return "-" + amont + "%" return amont + "%"
} }
}; };
/**
* 保留两位小数
* @param amont
* @returns {string|*}
*/
export const conver_num_retain = function (amont) {
return formater(amont)
}
//数字金额显示 //数字金额显示
function formater(data) { function formater(data) {
......
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