Skip to content

S
shld-databoard-ui
Commit e74c7067 authored by 潘自豪's avatar 潘自豪
Browse files
Options

冲突解决

parents 1bc8378e 110cae9e
Hide whitespace changes
Inline Side-by-side
Showing with 622 additions and 208 deletions
src/module/api/apiList.js
View file @ e74c7067
......@@ -41,11 +41,15 @@ export const getBusinessConditionDatasByYear = (cur_day) => fetch('/api/query/*/
cur_day: cur_dayS
}
}, 'POST');
// 应收账款汇总
export const arSummaryBar = () => fetch("/api/query/dash_board/action/get_ar_summary_bar", {}, "POST")
// 应收账款列表
export const arCompanyList = () => fetch("/api/query/dash_board/action/get_ar_company_list", {}, "POST")
// 应收账款（结算单位）
export const arCompanyBar = () => fetch("/api/query/dash_board/action/get_ar_company_bar", {}, "POST")
// 应收账款（开票月份）
export const arMonthlyBar = () => fetch("/api/query/dash_board/action/get_ar_monthly_bar", {}, "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")
src/module/databoard/components/card/winners-list.vue
View file @ e74c7067
......@@ -2,9 +2,9 @@
<div class="winner_list">
<table>
<tbody>
<tr v-for="(row, idx) in rows" :key="idx" :style="{height: 100 / rows.length + '%'}">
<tr v-for="(row, idx) in $props.rows" :key="idx" :style="{height: 100 / rows.length + '%'}">
<td><div class="col_number">{{ idx + 1 }}</div></td>
<td class="winner_span" @click="goWinnerList">{{ row.title }}</td>
<td class="winner_span">{{ row.title }}</td>
<td v-for="(col, idz) in row.column" :key="idz">
<p class="key_span">{{ col.key }}</p>
<p class="value_span">{{ col.value }}</p>
......@@ -15,43 +15,23 @@
</div>
</template>
<script>
import DisplayBoard from "../container/display-board.vue";
export default {
name: "WinnersList",
components: {DisplayBoard},
props: {},
data() {
return {
rows: [
{
title: "XX有限公司",
column: [{key: "结算量（万吨）", value: 202012}, {key: "未收款（万元）", value: 202012}]
},
{
title: "XXXX有限公司",
column: [{key: "结算量（万吨）", value: 202012}, {key: "未收款（万元）", value: 202012}]
},
{
title: "XXXXX有限公司",
column: [{key: "结算量（万吨）", value: 202012}, {key: "未收款（万元）", value: 202012}]
},
{
title: "XXX有限公司",
column: [{key: "结算量（万吨）", value: 202012}, {key: "未收款（万元）", value: 202012}]
},
{
title: "XXXXXX有限公司",
column: [{key: "结算量（万吨）", value: 202012}, {key: "未收款（万元）", value: 202012}]
}
props: {
rows: {
type: Array,
default: [
{title: '标题列', column: [{key: '字段', value: '0'}]},
{title: '标题列', column: [{key: '字段', value: '0'}]},
{title: '标题列', column: [{key: '字段', value: '0'}]}
]
};
},
methods: {
goWinnerList() {
this.$router.push({path: '/winner_list'})
}
}
},
data() {
return {};
},
methods: {}
};
</script>
<style scoped>
......
src/module/databoard/components/chart/ar-company-bar.vue
View file @ e74c7067
......@@ -4,11 +4,13 @@
<script>
import * as echarts from "echarts";
import {arCompanyBar} from "../../../api/apiList";
export default {
name: "ArCompanyBar",
data() {
return {
arCompanyBar: null,
barChart: {
title: {
show: true,
......@@ -26,18 +28,23 @@ export default {
bottom: '10%'
},
xAxis: {
data: ['XXXXXX股份有限公司', 'XXXXXX股份有限公司', 'XXXXXX股份有限公司', 'XXXXXX股份有限公司', 'XXXXXX股份有限公司', 'XXXXXX股份有限公司', 'XXXXXX股份有限公司', 'XXXXXX股份有限公司', 'XXXXXX股份有限公司', 'XXXXXX股份有限公司'],
data: [
'XXXXXX股份有限公司', 'XXXXXX股份有限公司', 'XXXXXX股份有限公司', 'XXXXXX股份有限公司', 'XXXXXX股份有限公司',
'XXXXXX股份有限公司', 'XXXXXX股份有限公司', 'XXXXXX股份有限公司', 'XXXXXX股份有限公司', 'XXXXXX股份有限公司',
'XXXXXX股份有限公司', 'XXXXXX股份有限公司', 'XXXXXX股份有限公司', 'XXXXXX股份有限公司', 'XXXXXX股份有限公司',
'XXXXXX股份有限公司', 'XXXXXX股份有限公司', 'XXXXXX股份有限公司', 'XXXXXX股份有限公司', 'XXXXXX股份有限公司',
],
axisLabel: {
color: "#FFFFFF",
fontSize: "12",
interval: 0,
rotate: 0
rotate: 20
},
axisTick: {
show: false
}
},
},
yAxis: [{
yAxis: {
type: "value",
splitLine: {
lineStyle: {
......@@ -49,63 +56,81 @@ export default {
color: "#FFFFFFAA",
fontSize: "16"
}
}],
series: [
{
type: 'bar',
data: [25002, 57873, 11987, 71168, 41098, 25002, 57873, 11987, 71168, 41098],
barWidth: "40%",
showBackground: true,
backgroundStyle: {
color: 'rgba(255, 255, 255, 0.1)'
},
itemStyle: {
barBorderRadius: 10,
},
color: {
type: 'linear',
x: 0, y: 0, x2: 0, y2: 1,
colorStops: [
{offset: 0, color: '#00CCD2'},
{offset: 1, color: '#00A2FF'}
]
},
label: {
show: true,
position: 'top',
color: "#FFFFFF",
},
},
series: {
type: 'bar',
data: [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
barWidth: "40%",
showBackground: true,
backgroundStyle: {
color: 'rgba(255, 255, 255, 0.1)'
},
itemStyle: {
borderRadius: 10,
},
color: {
type: 'linear',
x: 0, y: 0, x2: 0, y2: 1,
colorStops: [
{offset: 0, color: '#00CCD2'},
{offset: 1, color: '#00A2FF'}
]
},
label: {
show: true,
position: 'top',
color: "#FFFFFF",
},
emphasis: {
focus: 'self',
blurScope: 'coordinateSystem'
}
]
}
},
myChart: null
}
},
methods: {
// 绘制图表
drawArCompanyBar() {
if (!this.arCompanyBar) {
this.arCompanyBar = echarts.init(document.getElementById('ar_company_bar'))
// 监听柱条点击事件，跳转子页面
let that = this
this.arCompanyBar.on('click', function (params) {
that.$router.push({path: '/ar_bar/company/monthly', query: {company: params.name}})
});
// 监听窗口大小变化，重绘图表
window.addEventListener('resize', this.resizeChart);
}
this.arCompanyBar.setOption(this.barChart);
},
// 重绘图表
resizeChart() {
if (this.myChart) {
this.myChart.resize();
if (this.arCompanyBar) {
this.arCompanyBar.resize();
}
},
},
mounted() {
// 设置500毫秒延迟执行，解决组件没有渲染完成就开始绘制图表的问题
setTimeout(() => {
let arCompanyBar = document.getElementById('ar_company_bar')
this.myChart = echarts.init(arCompanyBar)
this.myChart.setOption(this.barChart)
let that = this
this.myChart.on('click', function(params) {
that.$router.push({path: '/ar_bar/company', query: {name: params.name}})
});
// 监听窗口大小变化，重绘图表
window.addEventListener('resize', this.resizeChart);
}, 500)
// 获取图表数据
arCompanyBar().then(res => {
let data = res.data.data
let xAxisData = []
let seriesData = []
for (let item of data) {
xAxisData.push(item.settle_company)
seriesData.push(item.unregister_amount)
}
this.barChart.xAxis.data = xAxisData
this.barChart.series.data = seriesData
this.drawArCompanyBar()
}).catch(err => {
console.log(err);
}
);
},
beforeDestroy() {
window.removeEventListener("resize", this.resizeChart);
}
}
</script>
src/module/databoard/components/chart/ar-company-monthly-bar.vue 0 → 100644
View file @ e74c7067
<template>
<div id="ar_company_monthly_bar"/>
</template>
<script>
import * as echarts from "echarts";
import {arCompanyMonthlyBar} from "../../../api/apiList";
export default {
name: "ArCompanyMonthlyBar",
data() {
return {
arCompanyMonthlyBar: null,
barChart: {
title: {
show: true,
text: "XXXXXX股份有限公司 已开票未收款（开票月份）",
left: "center",
textStyle: {color: "white"}
},
textStyle: {
color: "#FFFFFF",
fontSize: "12"
},
grid: {
containLabel: true,
top: "10%",
bottom: '10%'
},
xAxis: {
data: ['2022-01', '2022-02', '2022-03', '2022-04', '2022-05', '2022-06', '2022-07', '2022-08',],
axisLabel: {
color: "#FFFFFF",
fontSize: "12",
interval: 0,
rotate: 0
},
axisTick: {
show: false
}
},
yAxis: [{
type: "value",
splitLine: {
lineStyle: {
color: "#1E2C58"
}
},
axisLabel: {
show: false,
color: "#FFFFFFAA",
fontSize: "16"
}
}, {
type: "value",
position: "left",
show: false,
max: 1
}],
series: [
{
type: 'bar',
data: [0, 0, 0, 0, 0, 0, 0, 0],
barWidth: "40%",
yAxisIndex: 0,
showBackground: true,
backgroundStyle: {
color: 'rgba(255, 255, 255, 0.1)'
},
itemStyle: {
borderRadius: 10,
},
color: {
type: 'linear',
x: 0, y: 0, x2: 0, y2: 1,
colorStops: [
{offset: 0, color: '#00CCD2'},
{offset: 1, color: '#00A2FF'}
]
},
label: {
show: true,
position: 'top',
color: "#FFFFFF",
},
},
{
type: "line",
barWidth: "40%",
yAxisIndex: 1,
data: [0, 0, 0, 0, 0, 0, 0, 0]
}
]
},
}
},
methods: {
// 绘制图表
drawArCompanyMonthlyBar() {
if (!this.arCompanyMonthlyBar) {
this.arCompanyMonthlyBar = echarts.init(document.getElementById('ar_company_monthly_bar'))
// 监听窗口大小变化，重绘图表
window.addEventListener('resize', this.resizeChart);
}
this.arCompanyMonthlyBar.setOption(this.barChart);
},
resizeChart() {
if (this.arCompanyMonthlyBar) {
this.arCompanyMonthlyBar.resize();
}
},
},
mounted() {
// 调整图表标题
let company = this.$route.query.company
if (!company) {
this.$router.push("/ar_bar/company")
}
this.barChart.title.text = company + " 已开票未收款（开票月份）"
// 获取图表数据
arCompanyMonthlyBar(company).then(res => {
let data = res.data.data
let xAxisData = []
let seriesData0 = []
let seriesData1 = []
for (let item of data) {
xAxisData.push(item.settle_month)
seriesData0.push(item.unregister_amount)
seriesData1.push(item.percentage)
}
this.barChart.xAxis.data = xAxisData
this.barChart.series[0].data = seriesData0
this.barChart.series[1].data = seriesData1
this.drawArCompanyMonthlyBar()
}).catch(err => {
console.log(err);
});
},
beforeDestroy() {
window.removeEventListener("resize", this.resizeChart);
}
}
</script>
src/module/databoard/components/chart/ar-monthly-bar.vue
View file @ e74c7067
......@@ -4,6 +4,7 @@
<script>
import * as echarts from "echarts";
import {arMonthlyBar} from "../../../api/apiList";
export default {
name: "ArMonthlyBar",
......@@ -37,7 +38,7 @@ export default {
show: false
}
},
yAxis: [{
yAxis: {
type: "value",
splitLine: {
lineStyle: {
......@@ -49,58 +50,78 @@ export default {
color: "#FFFFFFAA",
fontSize: "16"
}
}],
series: [
{
type: 'bar',
data: [25002, 57873, 71168, 41098, 25002, 57873, 71168, 41098],
barWidth: "40%",
showBackground: true,
backgroundStyle: {
color: 'rgba(255, 255, 255, 0.1)'
},
itemStyle: {
barBorderRadius: 10,
},
color: {
type: 'linear',
x: 0, y: 0, x2: 0, y2: 1,
colorStops: [
{offset: 0, color: '#00CCD2'},
{offset: 1, color: '#00A2FF'}
]
},
label: {
show: true,
position: 'top',
color: "#FFFFFF",
},
},
series: {
type: 'bar',
data: [25002, 57873, 71168, 41098, 25002, 57873, 71168, 41098],
barWidth: "40%",
showBackground: true,
backgroundStyle: {
color: 'rgba(255, 255, 255, 0.1)'
},
itemStyle: {
borderRadius: 10,
},
color: {
type: 'linear',
x: 0, y: 0, x2: 0, y2: 1,
colorStops: [
{offset: 0, color: '#00CCD2'},
{offset: 1, color: '#00A2FF'}
]
},
label: {
show: true,
position: 'top',
color: "#FFFFFF",
},
emphasis: {
focus: 'self',
blurScope: 'coordinateSystem'
}
]
}
},
myChart: null
arMonthlyBar: null
}
},
methods: {
// 绘制图表
drawArMonthlyBar() {
if (!this.arMonthlyBar) {
this.arMonthlyBar = echarts.init(document.getElementById('ar_monthly_bar'))
// 监听柱条点击事件，跳转子页面
let that = this
this.arMonthlyBar.on('click', function (params) {
that.$router.push({path: '/ar_bar/monthly/company', query: {month: params.name}})
});
// 监听窗口大小变化，重绘图表
window.addEventListener('resize', this.resizeChart);
}
this.arMonthlyBar.setOption(this.barChart);
},
// 重绘图表
resizeChart() {
if (this.myChart) {
this.myChart.resize();
if (this.arMonthlyBar) {
this.arMonthlyBar.resize();
}
},
},
mounted() {
// 设置500毫秒延迟执行，解决组件没有渲染完成就开始绘制图表的问题
setTimeout(() => {
let arCompanyBar = document.getElementById('ar_monthly_bar')
this.myChart = echarts.init(arCompanyBar)
this.myChart.setOption(this.barChart)
let that = this
this.myChart.on('click', function(params) {
that.$router.push({path: '/ar_bar/monthly', query: {name: params.name}})
});
// 监听窗口大小变化，重绘图表
window.addEventListener('resize', this.resizeChart);
}, 500)
// 获取图表数据
arMonthlyBar().then(res => {
let data = res.data.data
let xAxisData = []
let seriesData = []
for (let item of data) {
xAxisData.push(item.settle_month)
seriesData.push(item.unregister_amount)
}
this.barChart.xAxis.data = xAxisData
this.barChart.series.data = seriesData
this.drawArMonthlyBar()
}).catch(err => {
console.log(err);
});
},
beforeDestroy() {
window.removeEventListener("resize", this.resizeChart);
......
src/module/databoard/components/chart/ar-monthly-company-bar.vue 0 → 100644
View file @ e74c7067
<template>
<div id="ar_monthly_company_bar"/>
</template>
<script>
import * as echarts from "echarts";
import {arMonthlyCompanyBar} from "../../../api/apiList";
export default {
name: "ArMonthlyCompanyBar",
data() {
return {
arMonthlyCompanyBar: null,
barChart: {
title: {
show: true,
text: "XXXX-XX 已开票未收款（结算单位）",
left: "center",
textStyle: {color: "white"}
},
textStyle: {
color: "#FFFFFF",
fontSize: "12"
},
grid: {
containLabel: true,
top: "10%",
bottom: '10%'
},
xAxis: {
data: ['XXXXXX股份有限公司', 'XXXXXX股份有限公司', 'XXXXXX股份有限公司', 'XXXXXX股份有限公司', 'XXXXXX股份有限公司', 'XXXXXX股份有限公司', 'XXXXXX股份有限公司', 'XXXXXX股份有限公司', 'XXXXXX股份有限公司', 'XXXXXX股份有限公司'],
axisLabel: {
color: "#FFFFFF",
fontSize: "12",
interval: 0,
rotate: 20
},
axisTick: {
show: false
}
},
yAxis: {
type: "value",
splitLine: {
lineStyle: {
color: "#1E2C58"
}
},
axisLabel: {
show: false,
color: "#FFFFFFAA",
fontSize: "16"
}
},
series: {
type: 'bar',
data: [25002, 57873, 11987, 71168, 41098, 25002, 57873, 11987, 71168, 41098],
barWidth: "60%",
showBackground: true,
backgroundStyle: {
color: 'rgba(255, 255, 255, 0.1)'
},
itemStyle: {
borderRadius: 10,
},
color: {
type: 'linear',
x: 0, y: 0, x2: 0, y2: 1,
colorStops: [
{offset: 0, color: '#00CCD2'},
{offset: 1, color: '#00A2FF'}
]
},
label: {
show: true,
position: 'top',
color: "#FFFFFF",
},
}
},
}
},
methods: {
// 绘制图表
drawArMonthlyCompanyBar() {
if (!this.arMonthlyCompanyBar) {
this.arMonthlyCompanyBar = echarts.init(document.getElementById('ar_monthly_company_bar'))
// 监听窗口大小变化，重绘图表
window.addEventListener('resize', this.resizeChart);
}
this.arMonthlyCompanyBar.setOption(this.barChart);
},
resizeChart() {
if (this.arMonthlyCompanyBar) {
this.arMonthlyCompanyBar.resize();
}
},
},
mounted() {
// 调整图表标题
let month = this.$route.query.month
if (!month) {
this.$router.push("/ar_bar/monthly")
}
this.barChart.title.text = month + " 已开票未收款（结算单位）"
// 获取图表数据
arMonthlyCompanyBar(month).then(res => {
let data = res.data.data
let xAxisData = []
let seriesData = []
for (let item of data) {
xAxisData.push(item.settle_company)
seriesData.push(item.unregister_amount)
}
this.barChart.xAxis.data = xAxisData
this.barChart.series.data = seriesData
this.drawArMonthlyCompanyBar()
}).catch(err => {
console.log(err);
});
},
beforeDestroy() {
window.removeEventListener("resize", this.resizeChart);
}
}
</script>
src/module/databoard/components/chart/ar-summary-bar.vue
View file @ e74c7067
<template>
<div id="ar_summary_bar" @click="goArBar"/>
<div id="ar_summary_bar"/>
</template>
<script>
......@@ -9,6 +9,7 @@ export default {
name: "ArSummaryBar",
data() {
return {
arSummaryBar: null,
barChart: {
textStyle: {
color: "#FFFFFF",
......@@ -29,7 +30,7 @@ export default {
show: false
}
},
yAxis: [{
yAxis: {
type: "value",
splitLine: {
lineStyle: {
......@@ -41,64 +42,51 @@ export default {
color: "#FFFFFFAA",
fontSize: "16"
}
}],
series: [
{
type: 'bar',
data: [50002, 57873, 11987, 71168, 41098],
barWidth: "40%",
showBackground: true,
backgroundStyle: {
color: 'rgba(255, 255, 255, 0.1)'
},
itemStyle: {
barBorderRadius: 10,
},
color: {
type: 'linear',
x: 0, y: 0, x2: 0, y2: 1,
colorStops: [
{offset: 0, color: '#00CCD2'},
{offset: 1, color: '#00A2FF'}
]
},
label: {
show: true,
position: 'top',
color: "#FFFFFF",
},
}
]
},
series: {
type: 'bar',
data: [0, 0, 0, 0, 0],
barWidth: "40%",
showBackground: true,
backgroundStyle: {
color: 'rgba(255, 255, 255, 0.1)'
},
itemStyle: {
borderRadius: 10,
},
color: {
type: 'linear',
x: 0, y: 0, x2: 0, y2: 1,
colorStops: [
{offset: 0, color: '#00CCD2'},
{offset: 1, color: '#00A2FF'}
]
},
label: {
show: true,
position: 'top',
color: "#FFFFFF",
},
}
},
myChart: null
}
},
methods: {
goArBar() {
this.$router.push({path: "/ar_bar"})
drawArSummaryBar(seriesData) {
if (!this.arSummaryBar) {
this.arSummaryBar = echarts.init(document.getElementById('ar_summary_bar'))
}
this.barChart.series.data = seriesData
this.arSummaryBar.setOption(this.barChart);
},
resizeChart() {
if (this.myChart) {
this.myChart.resize();
if (this.arSummaryBar) {
this.arSummaryBar.resize();
}
}
},
mounted() {
// 获取图表数据
window.axios.post("/api/query/dash_board/action/get_ar_summary_bar", {
headers: {'content-type': 'application/json'}
}).then(res => {
this.barChart.series[0].data = res.data.data;
}).catch(err => {
console.log("获取应收账款数据失败", err);
});
// 设置500毫秒延迟执行，解决组件没有渲染完成就开始绘制图表的问题
setTimeout(() => {
this.arSummaryBar = echarts.init(document.getElementById('ar_summary_bar'))
this.arSummaryBar.setOption(this.barChart);
// 监听窗口大小变化，重绘图表
window.addEventListener('resize', this.resizeChart);
}, 500)
window.addEventListener('resize', this.resizeChart);
},
beforeDestroy() {
window.removeEventListener("resize", this.resizeChart);
......
src/module/databoard/index.vue
View file @ e74c7067
......@@ -25,7 +25,7 @@
isCenter isBold/>
</simple-card>
</div>
<ar-summary-bar style="width: 100%; height: 64%;"></ar-summary-bar>
<ar-summary-bar ref="arSummaryBar" style="width: 100%; height: 64%;"></ar-summary-bar>
</display-board>
<display-board class="trade_right" title="账款情况">
<div
......@@ -46,7 +46,7 @@
</div>
<div class="middle">
<display-board class="trade_left" title="已开票未收款">
<winners-list style="height: 96%"/>
<winners-list style="height: 96%" @click.native="goArBar" id="ar_company_list" :rows="arCompanyList"/>
</display-board>
<div class="trade_middle" style="border: none;box-shadow: none;">
<div style="display: flex; justify-content: space-between; height: 50%;">
......@@ -153,7 +153,7 @@ import WinnersList from "./components/card/winners-list.vue";
import TitleContentMark from "./components/layout/title-content-mark.vue";
import TableColumn from "./components/table/table-column.vue";
import RingPieChart from "./components/chart/ring-pie-chart.vue";
import {getBusinessConditionDatas} from "../api/apiList";
import {getBusinessConditionDatas, arSummaryBar, arCompanyList} from "../api/apiList";
import {calc_hb_str, calc_tb_str, conver_amont} from "../utils/numUtil";
export default {
......@@ -170,7 +170,6 @@ export default {
},
data() {
return {
// today: moment().format("yyyy-MM-DD"),
today: '2023-06-19',
yyqk: {
yye: {
......@@ -205,7 +204,8 @@ export default {
amount: "10,000",
rate: "+5.71%",
},
],
]
},
ml: {
title: "毛利",
......@@ -223,9 +223,69 @@ export default {
rate: "0.00%",
},
],
},
}
},
arCompanyList: [
{title: "XX有限公司", column: [{key: "未收款（万元）", value: 0}]},
{title: "XX有限公司", column: [{key: "未收款（万元）", value: 0}]},
{title: "XX有限公司", column: [{key: "未收款（万元）", value: 0}]},
{title: "XX有限公司", column: [{key: "未收款（万元）", value: 0}]},
{title: "XX有限公司", column: [{key: "未收款（万元）", value: 0}]},
],
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: {
yszk: {
title: "应收账款",
......@@ -410,7 +470,7 @@ export default {
methods: {
cellStyleFunction(data) {
let res = {color: '#33ff66'};
console.log(data+":"+data.indexOf('+'))
console.log(data + ":" + data.indexOf('+'))
if (data.indexOf('-') !== -1) {
res.color = '#ff3300'
}
......@@ -449,6 +509,35 @@ export default {
this.yyqk.ml.hb[1].amount = conver_amont(data.pre_month_gross_profit_amount);
this.yyqk.ml.hb[1].rate = calc_tb_str(data.cur_gross_profit_amount, data.pre_month_gross_profit_amount);
})
},
// 跳转已开票未收款页面
goArBar() {
this.$router.push('/ar_bar')
},
// 获取应收账款数据
getArSummaryBar() {
arSummaryBar().then(res => {
let data = res.data.data
let seriesData = []
seriesData.push(data.unsettled_amount)
seriesData.push(data.settled_amount)
seriesData.push(data.unregister_amount)
seriesData.push(data.receivable_amount)
seriesData.push(data.cancelled_amount)
this.$refs.arSummaryBar.drawArSummaryBar(seriesData)
}).catch(err => {
console.log(err);
});
},
// 获取已开票未收款排行
getArCompanyList() {
arCompanyList().then(res => {
if (res.data.data.length) {
this.arCompanyList = res.data.data
}
}).catch(err => {
console.log(err);
});
}
},
......@@ -457,9 +546,18 @@ export default {
setTimeout(() => {
window.addEventListener('resize', this.resizeChart);
}, 500)
this.getArSummaryBar();
this.getArCompanyList();
},
beforeDestroy() {
window.removeEventListener("resize", this.resizeChart);
}
};
</script>
<style scoped>
#ar_company_list:hover {
background-color: #19EBFF10;
transform: scale(101%);
}
</style>
src/module/index/index.vue
View file @ e74c7067
......@@ -7,10 +7,10 @@
<span>星期三</span>
</div>
<div class="text_right">
<span>刷新时间：10s</span>
<span>刷新时间：{{ countDown }}s</span>
</div>
</div>
<router-view style="height: 90%"></router-view>
<router-view style="height: 90%" v-if="isRouterAlive"></router-view>
</div>
</template>
......@@ -21,9 +21,38 @@ window.$ = window.jQuery = require('materialize-css/node_modules/jquery/dist/jqu
require('materialize-css')
export default {
name: 'app',
data() {
return {
countDown: 10,
isRouterAlive: true,
countDownTimer: null,
}
},
methods: {
goIndex() {
this.$router.push({path: '/'})
},
reload() {
this.isRouterAlive = false
this.$nextTick(function () {
this.isRouterAlive = true
})
}
},
mounted() {
// 倒计时器
this.countDownTimer = setInterval(() => {
this.countDown--
if (this.countDown <= 0) {
this.reload()
this.countDown = 10
}
}, 1000)
},
beforeDestroy() {
// 倒计时器
if (this.countDownTimer) {
clearInterval(this.countDownTimer)
}
}
}
......
src/module/index/router/index_router.js
View file @ e74c7067
......@@ -4,7 +4,8 @@ import Index from '../../databoard/index.vue'
import ArBar from "../../databoard/components/chart/ar-bar.vue";
import ArCompanyBar from "../../databoard/components/chart/ar-company-bar.vue";
import ArMonthlyBar from "../../databoard/components/chart/ar-monthly-bar.vue";
import WinnersList from "../../databoard/components/card/winners-list.vue";
import ArCompanyMonthlyBar from "../../databoard/components/chart/ar-company-monthly-bar.vue";
import ArMonthlyCompanyBar from "../../databoard/components/chart/ar-monthly-company-bar.vue";
import TurnoverDetail from "../../databoard/databoard/turnover-detail.vue";
Vue.use(Router)
......@@ -22,6 +23,7 @@ export default new Router({
},
{
path: '/ar_bar',
name: 'arBar',
component: ArBar,
children: [
{
......@@ -33,28 +35,23 @@ export default new Router({
name: 'arCompanyBar',
component: ArCompanyBar
},
{
path: '/ar_bar/company/monthly',
name: 'arCompanyMonthlyBar',
component: ArCompanyMonthlyBar
},
{
path: '/ar_bar/monthly',
name: 'arMonthlyBar',
component: ArMonthlyBar
},
{
path: '/ar_bar/monthly/company',
name: 'arMonthlyCompanyBar',
component: ArMonthlyCompanyBar
}
]
},
{
path: '/ar_company_bar',
name: 'arCompanyBar',
component: ArCompanyBar
},
{
path: '/ar_monthly_bar',
name: 'arMonthlyBar',
component: ArMonthlyBar
},
{
path: '/winner_list',
name: 'winnerList',
component: WinnersList
},
{
path: '/turnover-detail',
name: 'turnoverDetail',
......
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