bb19620c by zhangmeng

看版

1 parent ea14d3b4
......@@ -327,13 +327,12 @@ async function handelGetYS005() {
function getdata() {
total = 0
api.getDegree().then(res => {
list.value = res.data
for (let n in list.value) {
total = total + (list.value[n] || 0)
}
})
clear()
handelGetYS001()
handelGetYS002()
handelGetYS003()
handelGetYS004()
handelGetYS005()
}
function handleResize() {
......
......@@ -42,7 +42,21 @@
<div class="chartCard mt30">
<div>
<div class="title">应收账款余额组成</div>
<div class="po_right" style="justify-content: end;">
<div class="po_right">
<div class="itemBox">
<el-select
v-model="type4"
class="select"
collapse-tags
multiple
placeholder="全部基地"
size="small"
@change="handelSelect4">
<el-option :label="`${Year1}年`" value="1"/>
<el-option :label="`${Year2}年`" value="2"/>
</el-select>
</div>
<div class="itemBox">
<el-select
v-model="type3"
......@@ -67,6 +81,7 @@ import {autoToolTip} from "@/plugins/auto-toolTip";
import * as echarts from "echarts";
import * as api from "@/apiPc/common"
import {getYS006} from '@/api/server.js'
import {dayjs} from 'element-plus'
const props = defineProps({
url: {
......@@ -86,12 +101,9 @@ const obj = computed(() => props.obj)
const zhuRef = ref(null)
const lineRef = ref(null)
const payeeRef = ref(null)
const kindList = ref([])
const dataA = ref([])
const radioA = ref('month')
const radioB = ref('month')
const type3 = ref('0')
const type4 = ref(['1'])
const type2 = ref([])
const type1 = ref(['1', '2'])
......@@ -111,7 +123,18 @@ const h1 = ref([])
const h2 = ref([])
const h3 = ref([])
const h4 = ref([])
const h5 = ref([])
const h6 = ref([])
const Year1 = dayjs().year() - 1
const Year2 = dayjs().year()
const legend1 = [`${Year1}待收款`, `${Year1}收费单待签`, `${Year1}合同待签`]
const legend2 = [`${Year2}待收款`, `${Year2}收费单待签`, `${Year2}合同待签`]
console.log(Year1, Year2)
let chartA
let chartB
let chartC
......@@ -141,6 +164,9 @@ async function handelGetYS006() {
h1.value = [...new Array(12).fill(0)]// 初始化 12 个月,默认值 0
h2.value = [...new Array(12).fill(0)] // 初始化 12 个月,默认值 0
h3.value = [...new Array(12).fill({value: 0, info: ''})] // 初始化 12 个月,默认值 0
h4.value = [...new Array(12).fill(0)] // 初始化 12 个月,默认值 0
h5.value = [...new Array(12).fill(0)] // 初始化 12 个月,默认值 0
h6.value = [...new Array(12).fill({value: 0, info: ''})] // 初始化 12 个月,默认值 0
// h3.value = new Array(12).fill(0); // 初始化 12 个月,默认值 0
type2.value = []
for (const v1 of list.value) {
......@@ -172,6 +198,13 @@ async function handelGetYS006() {
obj.value += v2.HTDQ / 10000 || 0;
obj.info += v2.YSWELLINFO;
h3.value[i] = {...obj}
h4.value[i] += v2.JNYSDSK / 10000 || 0
h5.value[i] += v2.JNSFDDQ / 10000 || 0
let obj2 = {...h3.value[i]}
obj2.value += v2.JNHTDQ / 10000 || 0;
obj2.info += v2.JNYSWELLINFO;
h6.value[i] = {...obj2}
s1.value[i] += v2.INCOME / 10000 || 0;
s2.value[i] += v2.LASTINCOME / 10000 || 0;
s3.value[i] += v2.LASTYSBALANCE / 10000 || 0;
......@@ -187,7 +220,20 @@ async function handelGetYS006() {
type1.value.includes('2') ? s4.value : []
)
// h3.value = h3.value.map((item) => JSON.parse(item))
setC(h1.value, h2.value, h3.value)
// setC(h1.value, h2.value, h3.value, h4.value, h5.value, h6.value)
setC(
type4.value.includes('1') ? h1.value : [],
type4.value.includes('1') ? h2.value : [],
type4.value.includes('1') ? h3.value : [],
type4.value.includes('2') ? h4.value : [],
type4.value.includes('2') ? h5.value : [],
type4.value.includes('2') ? h6.value : [],
type4.value.includes('1') ? legend1 : [],
type4.value.includes('2') ? legend2 : [],
)
console.log(2222222, h3.value)
console.log(33333333, h6.value)
}
function handelSelect1() {
......@@ -228,6 +274,10 @@ function handelSelect3() {
h1.value = [...new Array(12).fill(0)] // 初始化 12 个月,默认值 0
h2.value = [...new Array(12).fill(0)] // 初始化 12 个月,默认值 0
h3.value = [...new Array(12).fill({value: 0, info: ''})] // 初始化 12 个月,默认值 0
h4.value = [...new Array(12).fill(0)] // 初始化 12 个月,默认值 0
h5.value = [...new Array(12).fill(0)] // 初始化 12 个月,默认值 0
h6.value = [...new Array(12).fill({value: 0, info: ''})] // 初始化 12 个月,默认值 0
if (type3.value == '0') {
// h1.value.push(val.YSDSK)//应待收款
// h2.value.push(val.SFDDQ)//收费单待签
......@@ -241,6 +291,13 @@ function handelSelect3() {
obj.value += monthData.HTDQ / 10000 || 0;
obj.info += monthData.YSWELLINFO;
h3.value[i] = {...obj}
h4.value[i] += v2.JNYSDSK / 10000 || 0
h5.value[i] += v2.JNSFDDQ / 10000 || 0
let obj2 = {...h3.value[i]}
obj2.value += v2.JNHTDQ / 10000 || 0;
obj2.info += v2.JNYSWELLINFO;
h6.value[i] = {...obj2}
}
}
// h3.value = h3.value.map((item) => JSON.parse(item))
......@@ -249,6 +306,9 @@ function handelSelect3() {
h3.value = []
h2.value = []
h1.value = []
h4.value = []
h5.value = []
h6.value = []
let obj = list.value.find(item => item.BASEJC === type3.value)
for (const val of obj.list) {
h1.value.push(val.YSDSK / 10000 || 0)//应待收款
......@@ -257,53 +317,56 @@ function handelSelect3() {
value: val.HTDQ / 10000 || 0,
info: val.YSWELLINFO
})//合同待签
h4.value.push(val.JNYSDSK / 10000 || 0)//应待收款
h5.value.push(val.JNSFDDQ / 10000 || 0)//收费单待签
let obj2 = {...h3.value[i]}
obj2.value += v2.JNHTDQ / 10000 || 0;
obj2.info += v2.JNYSWELLINFO;
h6.value[i] = {...obj2}
}
}
setC(h1.value, h2.value, h3.value)
setC(
type4.value.includes('1') ? h1.value : [],
type4.value.includes('1') ? h2.value : [],
type4.value.includes('1') ? h3.value : [],
type4.value.includes('2') ? h4.value : [],
type4.value.includes('2') ? h5.value : [],
type4.value.includes('2') ? h6.value : [],
type4.value.includes('1') ? legend1 : [],
type4.value.includes('2') ? legend2 : [],
)
// setC(h1.value, h2.value, h3.value, h4.value, h5.value, h6.value)
}
function handelSelect4() {
// console.log(type4.value)
// if (type4.value)
setC(
type4.value.includes('1') ? h1.value : [],
type4.value.includes('1') ? h2.value : [],
type4.value.includes('1') ? h3.value : [],
type4.value.includes('2') ? h4.value : [],
type4.value.includes('2') ? h5.value : [],
type4.value.includes('2') ? h6.value : [],
type4.value.includes('1') ? legend1 : [],
type4.value.includes('2') ? legend2 : [],
)
}
const init = () => {
clear()
if (!intervalA) {
handelGetYS006()
}
intervalA = setInterval(getdata, 1000 * 60 * 60);
intervalA = setInterval(getdata(), 1000 * 60 * 60);
}
const getdata = () => {
clear()
getAdata()
getBdata()
}
const getAdata = () => {
api.getJieDai({type: radioA.value}).then(res => {
dataA.value = []
kindList.value = []
for (let n of res.data) {
if (n.count > 0) {
kindList.value.push(n.name)
dataA.value.push(n.count)
}
}
setA()
})
}
const getBdata = () => {
api.getJianSuo({type: radioB.value}).then(res => {
dataA.value = []
kindList.value = []
for (let n of res.data) {
if (n.count > 0) {
kindList.value.push(n.name)
dataA.value.push(n.count)
}
}
setB()
})
handelGetYS006()
}
const setA = (arr, arr2, arr3) => {
......@@ -528,7 +591,7 @@ const setB = (arr1, arr2, arr3, arr4) => {
],
series: [
{
name: '2025年应收账款余额',
name: `${Year2}年应收账款余额`,
type: 'bar',
barGap: 0,
emphasis: {
......@@ -551,7 +614,7 @@ const setB = (arr1, arr2, arr3, arr4) => {
barWidth: '15%'
},
{
name: '2024年应收账款余额',
name: `${Year1}年应收账款余额`,
type: 'bar',
emphasis: {
focus: 'series'
......@@ -574,7 +637,7 @@ const setB = (arr1, arr2, arr3, arr4) => {
barWidth: '15%'
},
{
name: '2025年收入',
name: `${Year2}年收入`,
type: 'bar',
emphasis: {
focus: 'series'
......@@ -596,7 +659,7 @@ const setB = (arr1, arr2, arr3, arr4) => {
barWidth: '15%'
},
{
name: '2024年收入',
name: `${Year1}年收入`,
type: 'bar',
emphasis: {
focus: 'series'
......@@ -616,13 +679,14 @@ const setB = (arr1, arr2, arr3, arr4) => {
borderWidth: 1
},
barWidth: '15%'
},
]
}
chartB.setOption(option)
autoHover(chartB, option, 0, 2000)
}
const setC = (h1, h2, h3) => {
const setC = (h1, h2, h3, h4, h5, h6, l1, l2) => {
chartC = echarts.init(payeeRef.value)
const option = {
tooltip: {
......@@ -652,13 +716,29 @@ const setC = (h1, h2, h3) => {
`;
}
},
legend: {
top: '10%',
legend: [
{
data: l1,
left: 'center',
itemGap: 20,
top: '5%',
textStyle: {
color: '#FFF'
},
},
{
data: l2,
left: 'center',
itemGap: 20,
padding: [25, 0, 0, 0], // 上右下左内边距
top: '5%',
textStyle: {
color: '#FFF'
},
}
],
grid: {
top: '30%',
left: '3%',
right: '4%',
bottom: '3%',
......@@ -704,9 +784,10 @@ const setC = (h1, h2, h3) => {
],
series: [
{
name: '待收款',
name: `${Year1}待收款`,
type: 'bar',
stack: 'Ad',
barGap: 0,
emphasis: {
focus: 'series'
},
......@@ -725,9 +806,10 @@ const setC = (h1, h2, h3) => {
barWidth: '40%'
},
{
name: '收费单待签',
name: `${Year1}收费单待签`,
type: 'bar',
stack: 'Ad',
barGap: 0,
emphasis: {
focus: 'series'
},
......@@ -746,9 +828,10 @@ const setC = (h1, h2, h3) => {
barWidth: '40%'
},
{
name: '合同待签',
name: `${Year1}合同待签`,
type: 'bar',
stack: 'Ad',
barGap: 0,
emphasis: {
focus: 'series'
},
......@@ -766,21 +849,87 @@ const setC = (h1, h2, h3) => {
},
barWidth: '40%'
},
{
name: `${Year2}待收款`,
type: 'bar',
stack: 'Ad2',
barGap: 0,
emphasis: {
focus: 'series'
},
// data: [320, 332, 301, 334, 390, 330, 320, 320, 332, 301, 334, 390],
data: h4,
itemStyle: {
color: {
type: 'linear',
x: 0, y: 0, x2: 1, y2: 1, // 垂直渐变
colorStops: [
{offset: 0, color: 'rgba(46, 125, 50, 1)'},
{offset: 1, color: 'rgba(76, 175, 80, 1)'}
]
},
},
barWidth: '40%'
},
{
name: `${Year2}收费单待签`,
type: 'bar',
barGap: 0,
stack: 'Ad2',
emphasis: {
focus: 'series'
},
// data: [120, 132, 101, 134, 90, 230, 210, 101, 134, 90, 230, 210],
data: h5,
itemStyle: {
color: {
type: 'linear',
x: 0, y: 0, x2: 1, y2: 1, // 垂直渐变
colorStops: [
{offset: 0, color: 'rgba(58, 123, 213, 1)'},
{offset: 1, color: 'rgba(96, 181, 255, 1)'}
// {offset: 0, color: 'rgba(142, 36, 170, 1)'},
// {offset: 1, color: 'rgba(213, 0, 249, 1)'}
// {offset: 0, color: 'rgba(255, 215, 0, 0.8)'},
// {offset: 1, color: 'rgba(255, 255, 0, 0.6)'}
]
},
},
barWidth: '40%'
},
{
name: `${Year2}合同待签`,
type: 'bar',
stack: 'Ad2',
barGap: 0,
emphasis: {
focus: 'series'
},
// data: [220, 182, 191, 234, 290, 330, 310, 220, 182, 191, 234, 290,],
data: h6,
itemStyle: {
color: {
type: 'linear',
x: 0, y: 0, x2: 1, y2: 1, // 垂直渐变
colorStops: [
// {offset: 0, color: 'rgba(255, 87, 34, 0.8)'},
// {offset: 1, color: 'rgba(255, 138, 101, 0.6)'}
{offset: 0, color: 'rgba(138, 43, 226, 0.8)'},
{offset: 1, color: 'rgba(180, 120, 255, 0.6)'}
]
},
},
barWidth: '40%'
},
]
}
chartC.setOption(option)
autoHover(chartC, option, 0, 2000)
}
const radioAChange = (e) => {
clear()
getAdata()
}
const radioBChange = (e) => {
clear()
getBdata()
}
const clear = () => {
if (autoToolTip) {
......
......@@ -417,25 +417,11 @@ async function handelGetYS009() {
}
const getdata = () => {
getA()
getB()
}
const getA = () => {
//定时更新
api.getJieYue({type: radioA.value}).then(res => {
dataA.value = []
kindList.value = []
for (let n of res.data) {
if (n.count > 0) {
kindList.value.push(n.name)
dataA.value.push(n.count)
}
}
setA()
})
handelGetYS007()
handelGetYS008()
handelGetYS009()
}
const setA = (arrY, arr1, arr2, arr3, markLineName, BC) => {
chartA = echarts.init(zhuRef.value)
const option = {
......@@ -619,20 +605,6 @@ const setA = (arrY, arr1, arr2, arr3, markLineName, BC) => {
chartA.setOption(option)
autoHover(chartA, option, 0, 2000)
}
const getB = () => {
api.getJieShou().then(res => {
dataA.value = []
kindList.value = []
for (let n of res.data) {
if (n.count > 0) {
kindList.value.push(n.name)
dataA.value.push(n.count)
}
}
setB()
})
}
const setB = (arrY, arr1, arr2) => {
chartB = echarts.init(lineRef.value)
const option = {
......
Styling with Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!