From b46bc2dba51a3885a68e4c58316b41a31ea16bb2 Mon Sep 17 00:00:00 2001
From: loulijun2021 <1694218219@qq.com>
Date: 星期二, 14 二月 2023 13:35:03 +0800
Subject: [PATCH] 1.存货档案修改
---
src/views/bbgl/pzyc.vue | 148 ++++++++++++++++++++++++++++++------------------
1 files changed, 92 insertions(+), 56 deletions(-)
diff --git a/src/views/bbgl/pzyc.vue b/src/views/bbgl/pzyc.vue
index 5c990f1..d5b8cea 100644
--- a/src/views/bbgl/pzyc.vue
+++ b/src/views/bbgl/pzyc.vue
@@ -1,8 +1,11 @@
<template>
<div>
<div class="body" :style="{height:mainHeight+'px'}">
- <div style="margin: 30px auto;width: 1600px;" :style="{height:mainHeight+'px'}">
- <div id="Echarts" style="width: 100%;height: 100%" />
+ <div style="margin: 10px auto;width: 1680px;background-color: #fff" :style="{height:mainHeight+'px'}">
+
+ <div style="margin: 20px auto;width: 1600px" :style="{height:(mainHeight-60)+'px'}">
+ <div id="Echarts" style="width: 100%;height: 100%" />
+ </div>
</div>
</div>
</div>
@@ -50,12 +53,13 @@
textAlign: 'center',
textStyle: {
// color: '#fff',
- color: '#00ffff',
+ color: '#000',
fontSize: '20',
fontWeight: 'bolder'
}
},
- backgroundColor: '#323a5e',
+ // backgroundColor: '#323a5e',
+ backgroundColor: 'transparent',
tooltip: {
trigger: 'axis',
axisPointer: { // 鍧愭爣杞存寚绀哄櫒锛屽潗鏍囪酱瑙﹀彂鏈夋晥
@@ -69,29 +73,36 @@
top: '15%',
containLabel: true
},
- legend: {
- data: ['1', '2', '3'],
- right: 10,
- top: 12,
- textStyle: {
- color: '#fff'
- },
- itemWidth: 12,
- itemHeight: 10
- // itemGap: 35
- },
+ // legend: {
+ // data: ['1', '2', '3'],
+ // right: 10,
+ // top: 12,
+ // textStyle: {
+ // color: '#fff'
+ // },
+ // itemWidth: 12,
+ // itemHeight: 10
+ // // itemGap: 35
+ // },
xAxis: {
name: '绉嶇被',
nameTextStyle: {
- // color: ,
+ color: '#000',
fontSize: 16,
lineHeight: 20
},
type: 'category',
data: this.echartsData.map(r => r.name),
+ splitLine: {
+ show: false
+ },
+ axisTick: {
+ show: true
+ },
axisLine: {
+ show: true,
lineStyle: {
- color: 'white'
+ color: '#000'
}
},
axisLabel: {
@@ -99,32 +110,47 @@
rotate: 20,
textStyle: {
fontSize: 16,
+ color: '#000',
fontFamily: 'Microsoft YaHei'
}
}
},
yAxis: {
name: '鏁伴噺',
+ max: Math.ceil(Math.max(...this.echartsData.map(r => r.cont)) * 1.1), // 鍙栨暟缁勯噷闈㈡渶澶х殑鍊间箻1.1鍊嶇殑鏁存暟鐨勫ぉ鑺辨澘
+ interval: 1,
nameTextStyle: {
- // color: ,
+ color: '#000',
fontSize: 16,
lineHeight: 20
},
type: 'value',
// max: '1200',
+ axisTick: {
+ show: true
+ },
axisLine: {
- show: false,
+ show: true,
lineStyle: {
- color: 'white'
+ color: '#000'
}
},
splitLine: {
- show: true,
+ show: false,
lineStyle: {
- color: 'rgba(255,255,255,0.3)'
+ // color: 'rgba(255,255,255,0.3)'
+ color: '#000'
}
},
- axisLabel: {}
+ axisLabel: {
+ // interval: 0,
+ // rotate: 20,
+ textStyle: {
+ fontSize: 16,
+ color: '#000',
+ fontFamily: 'Microsoft YaHei'
+ }
+ }
},
dataZoom: [{
show: true,
@@ -138,33 +164,44 @@
handleIcon: 'path://M306.1,413c0,2.2-1.8,4-4,4h-59.8c-2.2,0-4-1.8-4-4V200.8c0-2.2,1.8-4,4-4h59.8c2.2,0,4,1.8,4,4V413z',
handleSize: '110%',
handleStyle: {
- color: '#d3dee5'
-
+ // color: '#d3dee5'
+ color: '#000'
},
textStyle: {
- color: '#fff'
+ color: '#000'
},
- borderColor: '#90979c'
-
+ // borderColor: '#90979c'
+ borderColor: '#000',
+ fillerColor: `rgba(42, 197, 137, 0.1)`
}, {
type: 'inside',
show: true,
height: 15,
start: 1,
end: 35
- }],
+ }
+ ],
series: [{
name: '鏁伴噺',
type: 'bar',
barWidth: '15%',
+ label: {
+ show: true,
+ position: 'top',
+ textStyle: {
+ color: '#000'
+ }
+ },
itemStyle: {
normal: {
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
offset: 0,
- color: '#fccb05'
+ // color: '#fccb05'
+ color: `rgba(42, 197, 137, 1)`// 0% 澶勭殑棰滆壊
}, {
offset: 1,
- color: '#f5804d'
+ color: `rgba(187, 236, 218, 1)` // 100% 澶勭殑棰滆壊
+ // color: '#f5804d'
}]),
barBorderRadius: 12
}
@@ -186,7 +223,6 @@
// }]),
// barBorderRadius: 11,
// }
-
// },
// data: [400, 500, 500, 500, 500, 400,400, 500, 500]
// },
@@ -217,30 +253,30 @@
const myChart = echarts.init(document.getElementById('Echarts'))
- setInterval(function() {
- var dataLen = option.series[0].data.length
-
- // 鍙栨秷涔嬪墠楂樹寒鐨勫浘褰�
- myChart.dispatchAction({
- type: 'downplay',
- seriesIndex: 0,
- dataIndex: app.currentIndex
- })
- app.currentIndex = (app.currentIndex + 1) % dataLen
- // console.log(app.currentIndex);
- // 楂樹寒褰撳墠鍥惧舰
- myChart.dispatchAction({
- type: 'highlight',
- seriesIndex: 0,
- dataIndex: app.currentIndex
- })
- // 鏄剧ず tooltip
- myChart.dispatchAction({
- type: 'showTip',
- seriesIndex: 0,
- dataIndex: app.currentIndex
- })
- }, 1000)
+ // setInterval(function() {
+ // var dataLen = option.series[0].data.length
+ //
+ // // 鍙栨秷涔嬪墠楂樹寒鐨勫浘褰�
+ // myChart.dispatchAction({
+ // type: 'downplay',
+ // seriesIndex: 0,
+ // dataIndex: app.currentIndex
+ // })
+ // app.currentIndex = (app.currentIndex + 1) % dataLen
+ // // console.log(app.currentIndex);
+ // // 楂樹寒褰撳墠鍥惧舰
+ // myChart.dispatchAction({
+ // type: 'highlight',
+ // seriesIndex: 0,
+ // dataIndex: app.currentIndex
+ // })
+ // // 鏄剧ず tooltip
+ // myChart.dispatchAction({
+ // type: 'showTip',
+ // seriesIndex: 0,
+ // dataIndex: app.currentIndex
+ // })
+ // }, 1000)
if (option.textStyle == null) {
option.textStyle = {
--
Gitblit v1.9.3