From 377d4c4027610c69ccc9e1af913bab579a4d5e17 Mon Sep 17 00:00:00 2001
From: loulijun2021 <1694218219@qq.com>
Date: 星期六, 30 七月 2022 14:16:50 +0800
Subject: [PATCH] 1.仓库管理看板静态页面初步实现2.采购订单看板静态页面初步实现
---
src/utils/myEcharts.js | 216 +++++++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 214 insertions(+), 2 deletions(-)
diff --git a/src/utils/myEcharts.js b/src/utils/myEcharts.js
index a68e0d0..b38af77 100644
--- a/src/utils/myEcharts.js
+++ b/src/utils/myEcharts.js
@@ -406,7 +406,7 @@
},
rich: {
lg: {
- // backgroundColor: '#339911',
+ // backgroundColor: '#339911',
color: '#fff',
borderRadius: 15,
// padding: 5,
@@ -463,7 +463,7 @@
formatter: '{c}',
fontSize: 14,
color: '#fff'
- // formatter: '{c}%',
+ // formatter: '{c}%',
}
}
}
@@ -472,3 +472,215 @@
return option
}
+
+// 浠撳簱绠＄悊鐪嬫澘鍥�
+export function bar03(titleText) {
+ const path = 'path://M214,1079l8-6h16l8,6-8,6H222Z'
+ const zzx1 = ['800', '900', '700', '300', '500', '800', '700']
+ const wgx1 = ['700', '600', '500', '400', '300', '333', '222']
+ const option = {
+ backgroundColor: 'transparent',
+ tooltip: {
+ show: false,
+ trigger: 'axis',
+ axisPointer: { // 鍧愭爣杞存寚绀哄櫒锛屽潗鏍囪酱瑙﹀彂鏈夋晥
+ type: 'shadow' // 榛樿涓虹洿绾匡紝鍙�変负锛�'line' | 'shadow'
+ },
+ formatter: function(e) {
+ if (e.length > 1) {
+ var S = e[1].data - e[0].data
+ return e[0].axisValue + ':<br>宸=褰撳墠锛嶅勾鍒�<br>=' + S
+ } else if (e.length = 1) {
+ return e[0].axisValue + ':<br>' + e[0].seriesName + '=' + e[0].data
+ }
+ }
+ },
+ title: {
+ text: titleText,
+ x: '70%',
+ y: '2%',
+ textStyle: {
+ color: '#fff',
+ fontSize: '22'
+ },
+ subtextStyle: {
+ color: '#90979c',
+ fontSize: '16'
+ }
+ },
+ grid: {
+ left: '4%',
+ right: '4%',
+ bottom: '4%',
+ top: '15%',
+ containLabel: true
+ },
+ legend: {
+ data: ['title1', 'title2'],
+ left: 220,
+ top: 10,
+ textStyle: {
+ color: '#00ffff',
+ fontSize: 14
+ },
+ itemWidth: 12,
+ itemHeight: 10,
+ itemGap: 35,
+ color: '#242424'
+ },
+ xAxis: {
+ type: 'category',
+ data: ['鏄熸湡鏃�', '鏄熸湡涓�', '鏄熸湡浜�', '鏄熸湡涓�', '鏄熸湡鍥�', '鏄熸湡浜�', '鏄熸湡鍏�'],
+ axisLine: {
+ lineStyle: {
+ show: true,
+ lineStyle: {
+ color: '#6A989E'
+ }
+ }
+ },
+ axisLabel: {
+ // interval: 0,
+ // rotate: 40,
+ textStyle: {
+ fontFamily: 'Microsoft YaHei',
+ color: '#fff', // x杞撮鑹�
+ fontWeight: 'normal',
+ fontSize: '14',
+ lineHeight: 22
+ }
+ }
+ // splitLine:{
+ // show:true,
+ // lineStyle: {
+ // type: 'dashed',
+ // color: 'rgba(135,140,147,0.8)'
+ // }
+ // },
+ },
+ yAxis: {
+ type: 'value',
+ name: '鏁伴噺锛堝崟浣嶏細涓級',
+ nameTextStyle: {
+ color: '#ffffff'
+ },
+ axisLine: {
+ show: false,
+ lineStyle: {
+ type: 'dashed',
+ color: 'rgba(135,140,147,0.8)'
+ }
+ },
+ splitLine: {
+ show: true,
+ lineStyle: {
+ color: 'rgba(135,140,147,1)' // 宸︿晶鏄剧ず绾�
+ }
+ },
+ axisLabel: {
+ formatter: '{value}',
+ color: '#fff',
+ fontSize: 14
+ }
+ },
+ series: [
+ {
+ type: 'pictorialBar',
+ symbol: path,
+ symbolSize: [30, 8],
+ symbolOffset: [-18, -4],
+ symbolPosition: 'end',
+ z: 12,
+ color: '#3440FF',
+ data: zzx1
+ },
+ {
+ type: 'pictorialBar',
+ symbol: path,
+ symbolSize: [30, 8],
+ symbolOffset: [18, -4],
+ // symbolOffset: [20, -5],
+ symbolPosition: 'end',
+ z: 12,
+ color: '#FF1155',
+ data: wgx1
+ },
+ {
+ type: 'pictorialBar',
+ symbol: path,
+ symbolSize: [30, 8],
+ symbolOffset: [-18, 4],
+ z: 12,
+ color: 'rgba(126,192,238,0.6)',
+ data: zzx1
+ },
+ {
+ name: '',
+ type: 'pictorialBar',
+ symbol: path,
+ symbolSize: [30, 8],
+ // symbolOffset: [20, 4],
+ symbolOffset: [18, 4],
+ color: '#FFC0CB',
+ z: 12,
+ data: wgx1
+ }, {
+ name: 'title1',
+ type: 'bar',
+ barWidth: '30',
+ itemStyle: {
+ normal: {
+ opacity: 0.7,
+ color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
+ offset: 0,
+ color: 'blue'
+ }, {
+ offset: 1,
+ color: '#7EC0EE'
+ }]),
+ barBorderRadius: 0
+ }
+
+ },
+ label: {
+ show: true,
+ // position: ['-18','-18'],
+ position: 'top',
+ color: '#00f8ff',
+ fontSize: 12
+ },
+ data: zzx1
+ },
+ {
+ name: 'title2',
+ type: 'bar',
+ barWidth: '30',
+ itemStyle: {
+ normal: {
+ opacity: 0.7,
+ color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
+ offset: 0,
+ color: '#FF2246'
+ }, {
+ offset: 1,
+ color: '#FFC0CB'
+
+ }]),
+ barBorderRadius: 0
+ }
+
+ },
+ label: {
+ show: true,
+ // position: ['18','-18'],
+ position: 'top',
+ color: '#00f8ff',
+ fontSize: 12
+ },
+ data: wgx1
+ }
+ ]
+ }
+
+ return option
+}
--
Gitblit v1.9.3