diff --git a/src/views/projectAdmin/dataBoard/projectHuScreen/jChart/bar/JProgressChart.vue b/src/views/projectAdmin/dataBoard/projectHuScreen/jChart/bar/JProgressChart.vue index 7bf460e2..23b3d295 100644 --- a/src/views/projectAdmin/dataBoard/projectHuScreen/jChart/bar/JProgressChart.vue +++ b/src/views/projectAdmin/dataBoard/projectHuScreen/jChart/bar/JProgressChart.vue @@ -6,21 +6,11 @@ import echarts from 'echarts4' export default { props: { - title: { - type: Object, - default: () => ({ - text: '' - }) - }, grid: { type: Array, - default: () => ['15%', '2%', '2%', '2%'] + default: () => ['10', '8%', '10', '10'] }, - color: { - type: Array, - default: () => ['#5EC2D0', '#61D2B9', '#F67F51', '#7851F6'] - }, - xData: { + seriesData: { required: true, type: Array, default: () => [] @@ -40,17 +30,10 @@ export default { }, methods: { createChart() { - const { title, grid, color, xData, yData } = this + const { grid, seriesData, yData } = this + const max = Math.max(...seriesData) + const maxData = seriesData.map(item => max) const option = { - title: { - text: title.text, - right: 20, - textStyle: { - fontSize: '14px', - color: '#5EC2D0', - fontWeight: 'normal' - } - }, grid: { top: grid[0], right: grid[1], @@ -58,56 +41,77 @@ export default { left: grid[3], containLabel: true }, - color, xAxis: { - type: 'category', - data: xData, - axisLine: { - show: true, - lineStyle: { - type: [5, 10] - } - }, + type: 'value', axisLabel: { - show: true, - textStyle: { - color: '#fff' - } + formatter: () => '' + }, + splitLine: { + show: false + }, + axisLine: { + show: false }, axisTick: { show: false } }, yAxis: { - type: 'value', - splitLine: { - show: true, - lineStyle: { - type: [5, 10], - color: '#323D50' - } - }, + type: 'category', axisLine: { - show: true, - lineStyle: { - type: [5, 10] - } - }, - axisLabel: { - show: true, - textStyle: { - color: '#fff' - } + show: false }, axisTick: { show: false + }, + data: yData, + axisLabel: { + textStyle: { + fontSize: 12, + color: 'rgba(225, 225, 225, .8)' + } } }, series: [ { - data: yData, type: 'bar', - barWidth: 15 + itemStyle: { + color: new echarts.graphic.LinearGradient(0, 0, 1, 0, [ + { offset: 0, color: '#4A90E2' }, + { offset: 1, color: '#4ADEE2' } + ]), + barBorderRadius: 3 + }, + label: { + show: true, + position: 'right', + color: 'white', + textStyle: { + fontSize: 15 + } + }, + data: seriesData, + barWidth: 13 + }, + { + type: 'bar', + itemStyle: { + color: 'rgba(255, 255, 255, 0.1)', + barBorderRadius: 3 + }, + // label: { + // show: true, + // position: 'right', + // color: 'white', + // textStyle: { + // fontSize: 15 + // } + // }, + barGap: '-100%', + barCategoryGap: '40%', + data: maxData, + barWidth: 13, + animation: false } ] } diff --git a/src/views/projectAdmin/dataBoard/projectHuScreen/qualityManage/leftTop.vue b/src/views/projectAdmin/dataBoard/projectHuScreen/qualityManage/leftTop.vue index d72e82c3..cdabe809 100644 --- a/src/views/projectAdmin/dataBoard/projectHuScreen/qualityManage/leftTop.vue +++ b/src/views/projectAdmin/dataBoard/projectHuScreen/qualityManage/leftTop.vue @@ -2,7 +2,7 @@