质量管理添加flv.js
This commit is contained in:
熊丽君
@ -45,6 +45,7 @@
|
||||
"echarts-liquidfill": "^2.0.2",
|
||||
"element-ui": "2.15.6",
|
||||
"file-saver": "2.0.5",
|
||||
"flv.js": "^1.6.2",
|
||||
"fuse.js": "6.4.3",
|
||||
"highlight.js": "9.18.5",
|
||||
"js-beautify": "1.13.0",
|
||||
|
||||
@ -1,38 +1,68 @@
|
||||
export const yelloColorList = [
|
||||
'#FFFDE7',
|
||||
'#FFF9C4',
|
||||
'#FFF59D',
|
||||
'#FFF176',
|
||||
'#FFEE58',
|
||||
'#FFEB3B',
|
||||
'#FDD835',
|
||||
'#FBC02D',
|
||||
'#F9A825',
|
||||
'#F57F17',
|
||||
'#fff7e8',
|
||||
'#fff2d8',
|
||||
'#fce5b8',
|
||||
'#f5d89e',
|
||||
'#f0cc82',
|
||||
'#f4cb72',
|
||||
'#ecbe5a',
|
||||
'#e6b346',
|
||||
'#e3ac34',
|
||||
'#dea72d',
|
||||
'#d9a127',
|
||||
'#c58f1b',
|
||||
'#bd8711',
|
||||
'#a97910',
|
||||
'#90670d',
|
||||
'#7d5705',
|
||||
'#6a4b07',
|
||||
'#583d02',
|
||||
'#4b3402',
|
||||
'#332300',
|
||||
]
|
||||
export const greenColorList = [
|
||||
'#F1F8E9',
|
||||
'#DCEDC8',
|
||||
'#C5E1A5',
|
||||
'#AED581',
|
||||
'#9CCC65',
|
||||
'#8BC34A',
|
||||
'#7CB342',
|
||||
'#689F38',
|
||||
'#558B2F',
|
||||
'#33691E',
|
||||
'#EBFFF7',
|
||||
'#DAFEF0',
|
||||
'#B3FFE1',
|
||||
'#9DFAD5',
|
||||
'#7AF6C4',
|
||||
'#58EAB0',
|
||||
'#26DC94',
|
||||
'#1EC580',
|
||||
'#0FB570',
|
||||
'#03A562',
|
||||
'#089F61',
|
||||
'#06965B',
|
||||
'#048C54',
|
||||
'#087A4B',
|
||||
'#03623B',
|
||||
'#045936',
|
||||
'#034F30',
|
||||
'#004327',
|
||||
'#00341F',
|
||||
'#002918',
|
||||
]
|
||||
export const blueColorList = [
|
||||
'#E3F2FD',
|
||||
'#BBDEFB',
|
||||
'#90CAF9',
|
||||
'#64B5F6',
|
||||
'#42A5F5',
|
||||
'#2196F3',
|
||||
'#1E88E5',
|
||||
'#1976D2',
|
||||
'#1565C0',
|
||||
'#0D47A1',
|
||||
'#F4F7FF',
|
||||
'#E9F0FF',
|
||||
'#D3E1FF',
|
||||
'#C6D6F8',
|
||||
'#B9CFFD',
|
||||
'#AEC4F3',
|
||||
'#9BB6EE',
|
||||
'#88A6E8',
|
||||
'#6c92e4',
|
||||
'#618be4',
|
||||
'#507edf',
|
||||
'#4576de',
|
||||
'#2d61cb',
|
||||
'#1b51c0',
|
||||
'#1948aa',
|
||||
'#073aa4',
|
||||
'#093691',
|
||||
'#092c74',
|
||||
'#052464',
|
||||
'#001541',
|
||||
]
|
||||
export const greyColorList = [
|
||||
// #FAFAFA
|
||||
|
||||
@ -62,11 +62,24 @@ export default {
|
||||
progressBar,
|
||||
},
|
||||
data() {
|
||||
return {}
|
||||
return {
|
||||
dataInfo: {},
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.getData()
|
||||
},
|
||||
mounted() {},
|
||||
beforeDestroy() {},
|
||||
methods: {},
|
||||
methods: {
|
||||
getData() {
|
||||
this.request({
|
||||
url: '/hx/qualityAssurance/getQualityManage',
|
||||
method: 'get',
|
||||
}).then(({ data }) => {
|
||||
this.dataInfo = data
|
||||
})
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
@ -1,7 +1,9 @@
|
||||
<template>
|
||||
<div>
|
||||
<center2 title="关键参数SPC分析">
|
||||
<el-select v-model="value" slot="datePicker" size="mini" placeholder="请选择"> </el-select>
|
||||
<el-select v-model="value" slot="datePicker" size="mini" placeholder="请选择" @change="handleValue">
|
||||
<el-option v-for="item in selectData" :key="item" :label="item" :value="item"> </el-option>
|
||||
</el-select>
|
||||
<div style="height: 100%; width: 100%" ref="chart"></div>
|
||||
</center2>
|
||||
</div>
|
||||
@ -25,24 +27,55 @@ export default {
|
||||
data() {
|
||||
return {
|
||||
value: '',
|
||||
selectData: [],
|
||||
chart: null,
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.$nextTick(() => {
|
||||
this.initChart()
|
||||
this.getSelectData()
|
||||
})
|
||||
},
|
||||
beforeDestroy() {},
|
||||
methods: {
|
||||
initChart() {
|
||||
this.chart = echarts.init(this.$refs.chart)
|
||||
this.setOptions()
|
||||
handleValue(e) {
|
||||
this.initChart()
|
||||
},
|
||||
setOptions() {
|
||||
getSelectData() {
|
||||
this.request({
|
||||
url: '/hx/qualityAssurance/getHxAllSpcCategory',
|
||||
method: 'get',
|
||||
}).then(({ data }) => {
|
||||
if (!data.length) return console.log('暂无分类')
|
||||
this.selectData = data
|
||||
this.value = data[0]
|
||||
this.initChart()
|
||||
})
|
||||
},
|
||||
initChart() {
|
||||
this.request({
|
||||
url: '/hx/qualityAssurance/getHxSpcPic',
|
||||
method: 'get',
|
||||
params: {
|
||||
category: this.value,
|
||||
},
|
||||
}).then(({ data }) => {
|
||||
this.chart = echarts.init(this.$refs.chart)
|
||||
this.setOptions(data)
|
||||
})
|
||||
},
|
||||
setOptions(resData) {
|
||||
let product = []
|
||||
let lowerLimit = []
|
||||
let upperLimit = []
|
||||
for (let i = 0; i < resData.length; i++) {
|
||||
const item = resData[i]
|
||||
product.push(item.product)
|
||||
upperLimit.push(item.upperLimit)
|
||||
lowerLimit.push(item.lowerLimit)
|
||||
}
|
||||
this.chart.setOption({
|
||||
legend: {
|
||||
data: ['X管制图', 'R管制图'],
|
||||
textStyle: {
|
||||
color: '#fff',
|
||||
},
|
||||
@ -56,20 +89,7 @@ export default {
|
||||
xAxis: [
|
||||
{
|
||||
type: 'category',
|
||||
data: [
|
||||
'产品实物一',
|
||||
'产品实物一',
|
||||
'产品实物一',
|
||||
'产品实物一',
|
||||
'产品实物一',
|
||||
'产品实物一',
|
||||
'产品实物一',
|
||||
'产品实物一',
|
||||
'产品实物一',
|
||||
'产品实物一',
|
||||
'产品实物一',
|
||||
'产品实物一',
|
||||
],
|
||||
data: product,
|
||||
axisPointer: {
|
||||
type: 'shadow',
|
||||
},
|
||||
@ -130,13 +150,17 @@ export default {
|
||||
top: 50,
|
||||
bottom: 10,
|
||||
},
|
||||
// dataZoom: {},
|
||||
// dataZoom: {
|
||||
// type: 'slider',
|
||||
// start: 0,
|
||||
// end: this.dataZoomEnd(titData.length, 7),
|
||||
// },
|
||||
series: [
|
||||
{
|
||||
name: 'R管制图',
|
||||
type: 'line',
|
||||
barWidth: 20,
|
||||
data: [72.6, 75.9, 79.0, 26.4, 28.7, 70.7, 75.6, 82.2, 48.7, 18.8, 66.0, 62.3],
|
||||
data: upperLimit,
|
||||
itemStyle: {
|
||||
color: '#61DDAA',
|
||||
},
|
||||
@ -146,7 +170,7 @@ export default {
|
||||
name: 'X管制图',
|
||||
type: 'line',
|
||||
smooth: false,
|
||||
data: [2.0, 2.2, 3.3, 4.5, 6.3, 10.2, 20.3, 23.4, 30.0, 36.5, 42.0, 56.2],
|
||||
data: lowerLimit,
|
||||
itemStyle: {
|
||||
color: '#7EA7FC',
|
||||
},
|
||||
|
||||
@ -78,6 +78,7 @@ export default {
|
||||
|
||||
input {
|
||||
background-color: transparent;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -72,10 +72,27 @@ export default {
|
||||
beforeDestroy() {},
|
||||
methods: {
|
||||
initChart() {
|
||||
this.chart = echarts.init(this.$refs.chart)
|
||||
this.setOptions()
|
||||
this.request({
|
||||
url: '/hx/qualityAssurance/getQualityPlan',
|
||||
method: 'get',
|
||||
params: {
|
||||
type: '1',
|
||||
},
|
||||
}).then(({ data }) => {
|
||||
this.chart = echarts.init(this.$refs.chart)
|
||||
this.setOptions(data)
|
||||
})
|
||||
},
|
||||
setOptions() {
|
||||
setOptions(resData) {
|
||||
let month = []
|
||||
let rate = []
|
||||
let completed = []
|
||||
for (let i = 0; i < resData.length; i++) {
|
||||
const item = resData[i]
|
||||
month.push(item.month)
|
||||
rate.push(item.rate)
|
||||
completed.push(item.completed)
|
||||
}
|
||||
this.chart.setOption({
|
||||
legend: {
|
||||
data: ['数量', '完成率'],
|
||||
@ -92,20 +109,7 @@ export default {
|
||||
xAxis: [
|
||||
{
|
||||
type: 'category',
|
||||
data: [
|
||||
'2021-01',
|
||||
'2021-02',
|
||||
'2021-03',
|
||||
'2021-04',
|
||||
'2021-05',
|
||||
'2021-06',
|
||||
'2021-07',
|
||||
'2021-08',
|
||||
'2021-09',
|
||||
'2021-10',
|
||||
'2021-11',
|
||||
'2021-12',
|
||||
],
|
||||
data: month,
|
||||
axisPointer: {
|
||||
type: 'shadow',
|
||||
},
|
||||
@ -172,7 +176,7 @@ export default {
|
||||
name: '数量',
|
||||
type: 'bar',
|
||||
barWidth: 20,
|
||||
data: [2.6, 5.9, 9.0, 26.4, 28.7, 70.7, 175.6, 182.2, 48.7, 18.8, 6.0, 2.3],
|
||||
data: completed,
|
||||
itemStyle: {
|
||||
color: {
|
||||
type: 'linear', // 线性渐变
|
||||
@ -198,7 +202,7 @@ export default {
|
||||
type: 'line',
|
||||
yAxisIndex: 1,
|
||||
smooth: false,
|
||||
data: [2.0, 2.2, 3.3, 4.5, 6.3, 10.2, 20.3, 23.4, 23.0, 16.5, 12.0, 6.2],
|
||||
data: rate,
|
||||
itemStyle: {
|
||||
color: '#7EA7FC',
|
||||
},
|
||||
@ -245,14 +249,30 @@ export default {
|
||||
})
|
||||
},
|
||||
initChart2() {
|
||||
this.chart2 = echarts.init(this.$refs.chart2)
|
||||
this.setOptions2()
|
||||
this.request({
|
||||
url: '/hx/qualityAssurance/getQualityPlan',
|
||||
method: 'get',
|
||||
params: {
|
||||
type: '2',
|
||||
},
|
||||
}).then(({ data }) => {
|
||||
this.chart2 = echarts.init(this.$refs.chart2)
|
||||
this.setOptions2(data)
|
||||
})
|
||||
},
|
||||
setOptions2() {
|
||||
setOptions2(resData) {
|
||||
let deptName = []
|
||||
let rate = []
|
||||
let completed = []
|
||||
for (let i = 0; i < resData.length; i++) {
|
||||
const item = resData[i]
|
||||
deptName.push(item.deptName)
|
||||
rate.push(item.rate)
|
||||
completed.push(item.completed)
|
||||
}
|
||||
this.chart2.setOption({
|
||||
tooltip: {
|
||||
trigger: 'axis',
|
||||
formatter: '{a1}<br/>{b1}：{c1}',
|
||||
},
|
||||
// legend: {
|
||||
// // data: ['收入', '实际', '目标'],
|
||||
@ -269,7 +289,7 @@ export default {
|
||||
bottom: 50,
|
||||
},
|
||||
xAxis: {
|
||||
data: ['部门', '部门', '部门', '部门', '部门', '部门', '部门', '部门', '部门', '部门', '部门', '部门'],
|
||||
data: deptName,
|
||||
axisLine: {
|
||||
lineStyle: {
|
||||
color: 'rgb(255, 255, 255)',
|
||||
@ -324,17 +344,6 @@ export default {
|
||||
},
|
||||
],
|
||||
series: [
|
||||
{
|
||||
name: '收入',
|
||||
type: 'bar',
|
||||
z: '-1',
|
||||
barGap: '-75%',
|
||||
barWidth: 30,
|
||||
itemStyle: {
|
||||
color: 'rgba(85, 197, 162, .3)',
|
||||
},
|
||||
data: [80, 80, 95, 95, 95, 95, 80, 80, 95, 95, 95, 95],
|
||||
},
|
||||
{
|
||||
name: '实际',
|
||||
type: 'bar',
|
||||
@ -343,19 +352,20 @@ export default {
|
||||
itemStyle: {
|
||||
color: 'rgba(90, 216, 166, 0.85)',
|
||||
},
|
||||
data: [5, 20, 36, 10, 10, 20, 10, 20, 30, 10, 70, 75],
|
||||
data: completed,
|
||||
},
|
||||
{
|
||||
name: '目标',
|
||||
type: 'scatter',
|
||||
symbol: 'rect',
|
||||
yAxisIndex: 1,
|
||||
symbolSize: [30, 4],
|
||||
symbolOffset: [3, 0],
|
||||
position: [0, 0],
|
||||
// symbolOffset: [3, 0],
|
||||
// position: [0, 0],
|
||||
itemStyle: {
|
||||
color: '#F64F58',
|
||||
},
|
||||
data: [20, 30, 45, 20, 20, 30, 20, 30, 40, 20, 90, 90],
|
||||
data: [50, 40],
|
||||
},
|
||||
],
|
||||
})
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<div>
|
||||
<container3 title="质量计划">
|
||||
<container3 title="质量体系">
|
||||
<div class="wrap">
|
||||
<el-row class="content1" style="height: 100%">
|
||||
<el-col :span="8" style="height: 100%">
|
||||
@ -41,57 +41,12 @@ export default {
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
testData: [
|
||||
{ name: '运行策划控制', height: '部门3', weight: 51.6 },
|
||||
{ name: '产品服务要求', height: '部门4', weight: 59 },
|
||||
{ name: '产品、服务设计开发', height: '部门4', weight: 49.2 },
|
||||
{ name: '外部提供的过程、产品和服务控制', height: '部门5', weight: 63 },
|
||||
{ name: '生产服务提供', height: '部门6', weight: 53.6 },
|
||||
{ name: '产品、服务设计开发', height: '部门7', weight: 59 },
|
||||
{ name: '产品服务要求', height: '部门1', weight: 47.6 },
|
||||
{ name: '生产服务提供', height: '部门2', weight: 69.8 },
|
||||
],
|
||||
index: 0,
|
||||
colorList,
|
||||
|
||||
listData: [1, 2, 3, 4, 5, 6, 7, 8],
|
||||
scrollList: [
|
||||
{
|
||||
id: 1,
|
||||
name: 'xx车间未开启安全闸门',
|
||||
txt: '能昌',
|
||||
status: 2,
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
name: 'xx车间未开启安全闸门',
|
||||
txt: '葛岚福',
|
||||
status: 2,
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
name: 'xx车间未开启安全闸门',
|
||||
txt: '酆芳琼',
|
||||
status: 1,
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
name: 'xx车间未开启安全闸门',
|
||||
txt: '酆芳琼',
|
||||
status: 1,
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
name: 'xx车间未开启安全闸门',
|
||||
txt: '酆芳琼',
|
||||
status: 1,
|
||||
},
|
||||
],
|
||||
|
||||
dateRange: [],
|
||||
chart: null,
|
||||
chart2: null,
|
||||
chart3: null,
|
||||
series: [],
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
@ -109,166 +64,139 @@ export default {
|
||||
},
|
||||
methods: {
|
||||
initChart() {
|
||||
this.chart = echarts.init(this.$refs.chart)
|
||||
const data = [
|
||||
[
|
||||
['部门1', 77, 17096869, '运行策划控制'],
|
||||
['部门2', 77.4, 27662440, '运行策划控制'],
|
||||
['部门3', 68, 1154605773, '运行策划控制'],
|
||||
['部门4', 74.7, 10582082, '运行策划控制'],
|
||||
['部门5', 75, 4986705, '运行策划控制'],
|
||||
['部门6', 77.1, 56943299, '运行策划控制'],
|
||||
['部门7', 75.4, 78958237, '运行策划控制'],
|
||||
['部门8', 78.1, 254830, '运行策划控制'],
|
||||
],
|
||||
[
|
||||
['部门1', 45, 23968973, '产品服务要求'],
|
||||
['部门2', 88, 35939927, '产品服务要求'],
|
||||
['部门3', 76.9, 1376048943, '产品服务要求'],
|
||||
['部门4', 78.5, 11389562, '产品服务要求'],
|
||||
['部门5', 80.8, 5503457, '产品服务要求'],
|
||||
['部门6', 81.9, 64395345, '产品服务要求'],
|
||||
['部门7', 81.1, 80688545, '产品服务要求'],
|
||||
['部门8', 82.8, 329425, '产品服务要求'],
|
||||
],
|
||||
[
|
||||
['部门1', 81.8, 23968973, '产品、服务设计开发'],
|
||||
['部门2', 81.7, 35939927, '产品、服务设计开发'],
|
||||
['部门3', 76.9, 1376048943, '产品、服务设计开发'],
|
||||
['部门4', 56, 11389562, '产品、服务设计开发'],
|
||||
['部门5', 75, 5503457, '产品、服务设计开发'],
|
||||
['部门6', 67, 64395345, '产品、服务设计开发'],
|
||||
['部门7', 79, 80688545, '产品、服务设计开发'],
|
||||
['部门8', 88, 329425, '产品、服务设计开发'],
|
||||
],
|
||||
[
|
||||
['部门1', 68, 23968973, '外部提供的过程、产品和服务控制'],
|
||||
['部门2', 78, 35939927, '外部提供的过程、产品和服务控制'],
|
||||
['部门3', 76.9, 1376048943, '外部提供的过程、产品和服务控制'],
|
||||
['部门4', 78.5, 11389562, '外部提供的过程、产品和服务控制'],
|
||||
['部门5', 45, 5503457, '外部提供的过程、产品和服务控制'],
|
||||
['部门6', 81.9, 64395345, '外部提供的过程、产品和服务控制'],
|
||||
['部门7', 84, 80688545, '外部提供的过程、产品和服务控制'],
|
||||
['部门8', 69, 329425, '外部提供的过程、产品和服务控制'],
|
||||
],
|
||||
[
|
||||
['部门1', 85, 23968973, '生产服务提供'],
|
||||
['部门2', 81.7, 35939927, '生产服务提供'],
|
||||
['部门3', 70, 1376048943, '生产服务提供'],
|
||||
['部门4', 78, 11389562, '生产服务提供'],
|
||||
['部门5', 67, 5503457, '生产服务提供'],
|
||||
['部门6', 45, 64395345, '生产服务提供'],
|
||||
['部门7', 65, 80688545, '生产服务提供'],
|
||||
['部门8', 56, 329425, '生产服务提供'],
|
||||
],
|
||||
]
|
||||
this.chart.setOption({
|
||||
legend: {
|
||||
textStyle: {
|
||||
color: '#fff',
|
||||
},
|
||||
right: '10%',
|
||||
top: '3%',
|
||||
data: [
|
||||
'运行策划控制',
|
||||
'产品服务要求',
|
||||
'产品、服务设计开发',
|
||||
'外部提供的过程、产品和服务控制',
|
||||
'生产服务提供',
|
||||
],
|
||||
},
|
||||
grid: {
|
||||
left: '8%',
|
||||
top: '10%',
|
||||
},
|
||||
xAxis: {
|
||||
type: 'category',
|
||||
// splitLine: {
|
||||
// lineStyle: {
|
||||
// type: 'dashed',
|
||||
// },
|
||||
// },
|
||||
splitLine: {
|
||||
show: false, //不显示网格线
|
||||
},
|
||||
splitArea: {
|
||||
show: false, //不显示网格区域
|
||||
},
|
||||
axisLine: {
|
||||
lineStyle: {
|
||||
color: 'rgb(255, 255, 255)',
|
||||
},
|
||||
},
|
||||
},
|
||||
// yAxis: {
|
||||
// splitLine: {
|
||||
// lineStyle: {
|
||||
// type: 'dashed',
|
||||
// },
|
||||
// },
|
||||
// scale: true,
|
||||
// },
|
||||
yAxis: {
|
||||
type: 'value',
|
||||
scale: true,
|
||||
splitLine: {
|
||||
show: false, //不显示网格线
|
||||
},
|
||||
splitArea: {
|
||||
show: false, //不显示网格区域
|
||||
},
|
||||
axisLine: {
|
||||
lineStyle: {
|
||||
color: 'rgb(255, 255, 255)',
|
||||
},
|
||||
},
|
||||
},
|
||||
series: [
|
||||
{
|
||||
name: '运行策划控制',
|
||||
data: data[0],
|
||||
type: 'scatter',
|
||||
symbolSize: 8,
|
||||
this.request({
|
||||
url: '/hx/qualityAssurance/getQualitySystem/2',
|
||||
method: 'get',
|
||||
}).then(({ data: resData }) => {
|
||||
let newData = []
|
||||
let source = []
|
||||
let product = ['product']
|
||||
for (let i = 0; i < resData.allSystem.length; i++) {
|
||||
const element = resData.allSystem[i]
|
||||
product.push(element)
|
||||
this.series.push({ type: 'scatter' })
|
||||
}
|
||||
// console.log(product)
|
||||
|
||||
itemStyle: {
|
||||
color: '#FF667F',
|
||||
for (let i = 0; i < resData.allList.length; i++) {
|
||||
const item = resData.allList[i]
|
||||
|
||||
for (let k = 0; k < resData.allSystem.length; k++) {
|
||||
const item3 = resData.allSystem[k]
|
||||
if (!item['list'][k]) {
|
||||
item['list'][k] = {
|
||||
total: 0,
|
||||
systemName: item3,
|
||||
}
|
||||
}
|
||||
}
|
||||
for (let j = 0; j < item['list'].length; j++) {
|
||||
const item2 = item['list'][j]
|
||||
// console.log(j)
|
||||
// console.log(item2)
|
||||
|
||||
// console.log(source[j])
|
||||
if (source[j]) {
|
||||
source[j].push(item2.total)
|
||||
} else {
|
||||
source[j] = []
|
||||
source[j].push(item2.total)
|
||||
}
|
||||
}
|
||||
}
|
||||
for (let i = 0; i < resData.allDept.length; i++) {
|
||||
const item = resData.allDept[i]
|
||||
source[i].unshift(item)
|
||||
}
|
||||
source.unshift(product)
|
||||
console.log(source)
|
||||
// console.log(newData)
|
||||
this.chart = echarts.init(this.$refs.chart)
|
||||
this.chart.setOption({
|
||||
legend: {
|
||||
textStyle: {
|
||||
color: '#fff',
|
||||
},
|
||||
right: '10%',
|
||||
top: '3%',
|
||||
data: resData.allSystem,
|
||||
},
|
||||
tooltip: {},
|
||||
color: this.colorList,
|
||||
grid: {
|
||||
left: '8%',
|
||||
top: '10%',
|
||||
},
|
||||
dataset: {
|
||||
source,
|
||||
},
|
||||
xAxis: {
|
||||
type: 'category',
|
||||
// splitLine: {
|
||||
// lineStyle: {
|
||||
// type: 'dashed',
|
||||
// },
|
||||
// },
|
||||
splitLine: {
|
||||
show: false, //不显示网格线
|
||||
},
|
||||
splitArea: {
|
||||
show: false, //不显示网格区域
|
||||
},
|
||||
axisLine: {
|
||||
lineStyle: {
|
||||
color: 'rgb(255, 255, 255)',
|
||||
},
|
||||
},
|
||||
},
|
||||
{
|
||||
name: '产品服务要求',
|
||||
data: data[1],
|
||||
type: 'scatter',
|
||||
symbolSize: 8,
|
||||
itemStyle: {
|
||||
color: '#9CEB00',
|
||||
yAxis: {
|
||||
type: 'value',
|
||||
scale: true,
|
||||
splitLine: {
|
||||
show: false, //不显示网格线
|
||||
},
|
||||
splitArea: {
|
||||
show: false, //不显示网格区域
|
||||
},
|
||||
axisLine: {
|
||||
lineStyle: {
|
||||
color: 'rgb(255, 255, 255)',
|
||||
},
|
||||
},
|
||||
},
|
||||
{
|
||||
name: '产品、服务设计开发',
|
||||
data: data[2],
|
||||
type: 'scatter',
|
||||
symbolSize: 8,
|
||||
itemStyle: {
|
||||
color: '#9966FF',
|
||||
},
|
||||
},
|
||||
{
|
||||
name: '外部提供的过程、产品和服务控制',
|
||||
data: data[3],
|
||||
type: 'scatter',
|
||||
symbolSize: 8,
|
||||
itemStyle: {
|
||||
color: '#4E00EB',
|
||||
},
|
||||
},
|
||||
],
|
||||
series: this.series,
|
||||
})
|
||||
})
|
||||
},
|
||||
initLine() {
|
||||
this.chart2 = echarts.init(this.$refs.chart2)
|
||||
this.setOptions2()
|
||||
this.request({
|
||||
url: '/hx/qualityAssurance/getQualitySystem/1',
|
||||
method: 'get',
|
||||
}).then(({ data }) => {
|
||||
this.chart2 = echarts.init(this.$refs.chart2)
|
||||
this.setOptions2(data)
|
||||
})
|
||||
},
|
||||
setOptions2() {
|
||||
setOptions2(resData) {
|
||||
resData.elementsList.map(item => {
|
||||
item['value'] = item.total
|
||||
})
|
||||
let newList = []
|
||||
for (const k in resData.reviewList[0]) {
|
||||
let str = ''
|
||||
if (k == 'externalTotal') {
|
||||
str = '外审'
|
||||
} else if (k == 'internalTotal') {
|
||||
str = '内审'
|
||||
} else {
|
||||
str = '第三方审核'
|
||||
}
|
||||
newList.push({
|
||||
value: resData.reviewList[0][k],
|
||||
name: str,
|
||||
})
|
||||
}
|
||||
console.log(newList)
|
||||
this.chart2.setOption({
|
||||
tooltip: {
|
||||
trigger: 'item',
|
||||
@ -284,7 +212,7 @@ export default {
|
||||
},
|
||||
series: [
|
||||
{
|
||||
name: '内审',
|
||||
name: '',
|
||||
type: 'pie',
|
||||
radius: ['60%', '80%'],
|
||||
center: ['30%', '50%'],
|
||||
@ -303,17 +231,11 @@ export default {
|
||||
labelLine: {
|
||||
show: false,
|
||||
},
|
||||
data: [
|
||||
{ value: 1048, name: '内审1' },
|
||||
{ value: 735, name: '内审2' },
|
||||
{ value: 580, name: '内审3' },
|
||||
{ value: 484, name: '内审4' },
|
||||
{ value: 301, name: '内审5' },
|
||||
],
|
||||
data: resData.elementsList,
|
||||
color: blueColorList,
|
||||
},
|
||||
{
|
||||
name: '外审',
|
||||
name: '',
|
||||
type: 'pie',
|
||||
radius: ['35%', '55%'],
|
||||
center: ['30%', '50%'],
|
||||
@ -332,44 +254,9 @@ export default {
|
||||
labelLine: {
|
||||
show: false,
|
||||
},
|
||||
data: [
|
||||
{ value: 1048, name: '外审1' },
|
||||
{ value: 735, name: '外审2' },
|
||||
{ value: 580, name: '外审3' },
|
||||
{ value: 484, name: '外审4' },
|
||||
{ value: 300, name: '外审5' },
|
||||
],
|
||||
data: newList,
|
||||
color: greenColorList,
|
||||
},
|
||||
{
|
||||
name: '第三方审核',
|
||||
type: 'pie',
|
||||
radius: ['10%', '30%'],
|
||||
center: ['30%', '50%'],
|
||||
avoidLabelOverlap: false,
|
||||
label: {
|
||||
show: false,
|
||||
position: 'center',
|
||||
},
|
||||
emphasis: {
|
||||
label: {
|
||||
show: false,
|
||||
fontSize: '40',
|
||||
fontWeight: 'bold',
|
||||
},
|
||||
},
|
||||
labelLine: {
|
||||
show: false,
|
||||
},
|
||||
data: [
|
||||
{ value: 1048, name: '第三方1' },
|
||||
{ value: 735, name: '第三方2' },
|
||||
{ value: 580, name: '第三方3' },
|
||||
{ value: 484, name: '第三方4' },
|
||||
{ value: 300, name: '第三方5' },
|
||||
],
|
||||
color: yelloColorList,
|
||||
},
|
||||
],
|
||||
})
|
||||
},
|
||||
|
||||
@ -3,7 +3,8 @@
|
||||
<container2 title="视频检验系统实况">
|
||||
<div class="box">
|
||||
<div class="_img">
|
||||
<img src="./1.jpg" alt="" />
|
||||
<!-- <img src="./1.jpg" alt="" /> -->
|
||||
<video id="videoElement" controls autoplay>Your browser is too old which doesn't support HTML5 video.</video>
|
||||
</div>
|
||||
<div class="text">
|
||||
<p style="opacity: 0.8">实况信息</p>
|
||||
@ -15,6 +16,8 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import flvjs from 'flv.js'
|
||||
|
||||
import scalseBox from '../components/scaleBox.vue'
|
||||
import bigScreenHead from '../components/bigScreenHead/index.vue'
|
||||
import rocketTit from '../components/rocketTit/index.vue'
|
||||
@ -33,9 +36,42 @@ export default {
|
||||
container2,
|
||||
},
|
||||
data() {
|
||||
return {}
|
||||
return {
|
||||
flvPlayer: null,
|
||||
}
|
||||
},
|
||||
methods: {},
|
||||
mounted() {
|
||||
this.$nextTick(() => {
|
||||
if (flvjs.isSupported()) {
|
||||
var videoElement = document.getElementById('videoElement')
|
||||
this.flvPlayer = flvjs.createPlayer(
|
||||
{
|
||||
type: 'flv',
|
||||
isLive: true,
|
||||
fluid: true,
|
||||
stashInitialSize: 128, // 减少首桢显示等待时长
|
||||
url: 'http://192.168.0.151:81/stream/live/livestream.flv',
|
||||
},
|
||||
{
|
||||
enableStashBuffer: false,
|
||||
fixAudioTimestampGap: false,
|
||||
isLive: true,
|
||||
}
|
||||
)
|
||||
this.flvPlayer.attachMediaElement(videoElement)
|
||||
this.flvPlayer.load()
|
||||
this.flvPlayer.play()
|
||||
}
|
||||
})
|
||||
},
|
||||
beforeDestroy() {
|
||||
this.flvPlayer.player.pause()
|
||||
this.flvPlayer.player.unload()
|
||||
this.flvPlayer.player.detachMediaElement()
|
||||
this.flvPlayer.player.destroy()
|
||||
this.flvPlayer.player = null
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
@ -46,7 +82,7 @@ export default {
|
||||
._img {
|
||||
width: 310px;
|
||||
height: 229px;
|
||||
img {
|
||||
video {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
@ -23,6 +23,7 @@
|
||||
<vue-seamless-scroll
|
||||
:data="listData"
|
||||
class="warp-scroll"
|
||||
ref="seamlessScroll"
|
||||
:class-option="{
|
||||
singleHeight: 43,
|
||||
}"
|
||||
@ -31,8 +32,8 @@
|
||||
<li v-for="item in scrollList" :key="item.id">
|
||||
<el-row style="font-size: 14px">
|
||||
<el-col style="text-align: center" :span="4">{{ item.id }}</el-col>
|
||||
<el-col style="text-align: center" :span="8">{{ item.name }}</el-col>
|
||||
<el-col style="text-align: center" :span="12">{{ item.txt }}</el-col>
|
||||
<el-col style="text-align: center" :span="8">{{ item.className }}</el-col>
|
||||
<el-col style="text-align: center" :span="12">{{ item.faultRevelation }}</el-col>
|
||||
</el-row>
|
||||
</li>
|
||||
</ul>
|
||||
@ -102,39 +103,14 @@ export default {
|
||||
chart22: null,
|
||||
|
||||
listData: [1, 2, 3, 4, 5, 6, 7, 8],
|
||||
scrollList: [
|
||||
{
|
||||
id: 1,
|
||||
name: '部门一',
|
||||
txt: '高压作业',
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
name: '部门二',
|
||||
txt: '易燃作业',
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
name: '部门三',
|
||||
txt: '易燃作业',
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
name: '部门四',
|
||||
txt: '易燃作业',
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
name: '部门五',
|
||||
txt: '易燃作业',
|
||||
},
|
||||
],
|
||||
scrollList: [],
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.$nextTick(() => {
|
||||
this.initChart()
|
||||
this.initLine()
|
||||
this.getData()
|
||||
})
|
||||
},
|
||||
watch: {
|
||||
@ -171,76 +147,36 @@ export default {
|
||||
},
|
||||
beforeDestroy() {},
|
||||
methods: {
|
||||
// 获取滚动列表数据
|
||||
getData() {
|
||||
this.request({
|
||||
url: '/hx/qualityAssurance/getHxQualityCasePic',
|
||||
method: 'get',
|
||||
}).then(({ data }) => {
|
||||
this.scrollList = data
|
||||
this.$refs.seamlessScroll.reset()
|
||||
})
|
||||
},
|
||||
// 右上切换前
|
||||
initChart() {
|
||||
this.chart = echarts.init(this.$refs.chart)
|
||||
this.setOptions()
|
||||
this.request({
|
||||
url: '/hx/qualityAssurance/getQualityProblem',
|
||||
method: 'get',
|
||||
params: {
|
||||
type: '1',
|
||||
},
|
||||
}).then(({ data }) => {
|
||||
this.chart = echarts.init(this.$refs.chart)
|
||||
this.setOptions(data.list)
|
||||
})
|
||||
},
|
||||
setOptions() {
|
||||
let data = [
|
||||
{
|
||||
name: '部门',
|
||||
children: [
|
||||
{
|
||||
name: '部门1',
|
||||
children: [
|
||||
{
|
||||
name: '部门11',
|
||||
value: 1,
|
||||
},
|
||||
{
|
||||
name: '部门22',
|
||||
value: 2,
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
name: '型号',
|
||||
children: [
|
||||
{
|
||||
name: '型号1',
|
||||
children: [
|
||||
{
|
||||
name: '型号11',
|
||||
value: 1,
|
||||
},
|
||||
{
|
||||
name: '型号22',
|
||||
value: 2,
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
name: '类型',
|
||||
children: [
|
||||
{
|
||||
name: '类型1',
|
||||
children: [
|
||||
{
|
||||
name: '类型11',
|
||||
value: 1,
|
||||
},
|
||||
{
|
||||
name: '类型22',
|
||||
value: 2,
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
},
|
||||
]
|
||||
setOptions(resData) {
|
||||
resData.map((item, index) => {
|
||||
item.value.map(i => {
|
||||
i.value = i.TOTAL
|
||||
})
|
||||
})
|
||||
this.chart.setOption({
|
||||
// series: {
|
||||
// type: 'sunburst',
|
||||
// center: ['45%', '50%'],
|
||||
// radius: [15, '80%'],
|
||||
// data: data,
|
||||
// },
|
||||
|
||||
tooltip: {
|
||||
trigger: 'item',
|
||||
},
|
||||
@ -256,7 +192,7 @@ export default {
|
||||
},
|
||||
series: [
|
||||
{
|
||||
name: '型号',
|
||||
name: resData[0].dimension,
|
||||
type: 'pie',
|
||||
center: ['35%', '50%'],
|
||||
radius: ['60%', '80%'],
|
||||
@ -275,17 +211,18 @@ export default {
|
||||
labelLine: {
|
||||
show: false,
|
||||
},
|
||||
data: [
|
||||
{ value: 1048, name: '型号1' },
|
||||
{ value: 735, name: '型号2' },
|
||||
{ value: 580, name: '型号3' },
|
||||
{ value: 484, name: '型号4' },
|
||||
{ value: 301, name: '型号5' },
|
||||
],
|
||||
data: resData[0].value,
|
||||
// [
|
||||
// { value: 1048, name: '型号1' },
|
||||
// { value: 735, name: '型号2' },
|
||||
// { value: 580, name: '型号3' },
|
||||
// { value: 484, name: '型号4' },
|
||||
// { value: 301, name: '型号5' },
|
||||
// ],
|
||||
color: blueColorList,
|
||||
},
|
||||
{
|
||||
name: '类别',
|
||||
name: resData[1].dimension,
|
||||
type: 'pie',
|
||||
radius: ['35%', '55%'],
|
||||
center: ['35%', '50%'],
|
||||
@ -304,17 +241,18 @@ export default {
|
||||
labelLine: {
|
||||
show: false,
|
||||
},
|
||||
data: [
|
||||
{ value: 1048, name: '类别1' },
|
||||
{ value: 735, name: '类别2' },
|
||||
{ value: 580, name: '类别3' },
|
||||
{ value: 484, name: '类别4' },
|
||||
{ value: 300, name: '类别5' },
|
||||
],
|
||||
data: resData[1].value,
|
||||
// [
|
||||
// { value: 1048, name: '类别1' },
|
||||
// { value: 735, name: '类别2' },
|
||||
// { value: 580, name: '类别3' },
|
||||
// { value: 484, name: '类别4' },
|
||||
// { value: 300, name: '类别5' },
|
||||
// ],
|
||||
color: greenColorList,
|
||||
},
|
||||
{
|
||||
name: '部门',
|
||||
name: resData[2].dimension,
|
||||
type: 'pie',
|
||||
radius: ['10%', '30%'],
|
||||
center: ['35%', '50%'],
|
||||
@ -333,13 +271,14 @@ export default {
|
||||
labelLine: {
|
||||
show: false,
|
||||
},
|
||||
data: [
|
||||
{ value: 1048, name: '部门1' },
|
||||
{ value: 735, name: '部门2' },
|
||||
{ value: 580, name: '部门3' },
|
||||
{ value: 484, name: '部门4' },
|
||||
{ value: 300, name: '部门5' },
|
||||
],
|
||||
data: resData[2].value,
|
||||
// [
|
||||
// { value: 1048, name: '部门1' },
|
||||
// { value: 735, name: '部门2' },
|
||||
// { value: 580, name: '部门3' },
|
||||
// { value: 484, name: '部门4' },
|
||||
// { value: 300, name: '部门5' },
|
||||
// ],
|
||||
color: yelloColorList,
|
||||
},
|
||||
],
|
||||
@ -347,10 +286,44 @@ export default {
|
||||
},
|
||||
// 右上切换后
|
||||
initChart1() {
|
||||
this.chart1 = echarts.init(this.$refs.chart1)
|
||||
this.setOptions1()
|
||||
this.request({
|
||||
url: '/hx/qualityAssurance/getQualityProblem',
|
||||
method: 'get',
|
||||
params: {
|
||||
type: '2',
|
||||
},
|
||||
}).then(({ data }) => {
|
||||
this.chart1 = echarts.init(this.$refs.chart1)
|
||||
this.setOptions1(data)
|
||||
})
|
||||
},
|
||||
setOptions1() {
|
||||
setOptions1(resData) {
|
||||
let titData = resData.allName
|
||||
delete resData.allName
|
||||
let titList = []
|
||||
let valList = []
|
||||
for (let index = 0; index < titData.length; index++) {
|
||||
valList.push([])
|
||||
}
|
||||
let newData = {}
|
||||
for (let i = 0; i < resData.list.length; i++) {
|
||||
const item = resData.list[i]
|
||||
for (const key in item) {
|
||||
newData[key] = item[key]
|
||||
}
|
||||
}
|
||||
for (const key in newData) {
|
||||
if (Object.hasOwnProperty.call(newData, key)) {
|
||||
const item = newData[key]
|
||||
titList.push(key)
|
||||
for (let i = 0; i < item.length; i++) {
|
||||
const ele = item[i]
|
||||
let index = titData.findIndex(e => e == ele.name)
|
||||
valList[index][titList.length - 1] = ele.COMPLETED
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
this.chart1.setOption({
|
||||
tooltip: {
|
||||
trigger: 'axis',
|
||||
@ -359,7 +332,7 @@ export default {
|
||||
},
|
||||
},
|
||||
legend: {
|
||||
data: ['类别一', '类别二', '类别三'],
|
||||
data: titData,
|
||||
textStyle: {
|
||||
color: '#fff', //legend字体颜色
|
||||
},
|
||||
@ -373,16 +346,17 @@ export default {
|
||||
},
|
||||
dataZoom: {
|
||||
type: 'slider',
|
||||
// start: 0,
|
||||
// end: 50,
|
||||
start: 0,
|
||||
end: this.dataZoomEnd(titList.length, 5),
|
||||
textStyle: {
|
||||
color: '#fff',
|
||||
},
|
||||
},
|
||||
color: colorList,
|
||||
xAxis: [
|
||||
{
|
||||
type: 'category',
|
||||
data: ['2021-01', '2021-02', '2021-03', '2021-04', '2021-05', '2021-06', '2021-07'],
|
||||
data: titList,
|
||||
axisLine: {
|
||||
lineStyle: {
|
||||
color: 'rgb(255, 255, 255)',
|
||||
@ -415,55 +389,49 @@ export default {
|
||||
},
|
||||
],
|
||||
series: [
|
||||
{
|
||||
name: '类别三',
|
||||
type: 'bar',
|
||||
stack: 'Ad',
|
||||
emphasis: {
|
||||
focus: 'series',
|
||||
},
|
||||
itemStyle: {
|
||||
color: '#F7DC87',
|
||||
},
|
||||
barWidth: 30,
|
||||
data: [220, 182, 191, 234, 290, 330, 310],
|
||||
},
|
||||
{
|
||||
name: '类别二',
|
||||
type: 'bar',
|
||||
stack: 'Ad',
|
||||
emphasis: {
|
||||
focus: 'series',
|
||||
},
|
||||
itemStyle: {
|
||||
color: '#55C5A2',
|
||||
},
|
||||
barWidth: 30,
|
||||
data: [150, 232, 201, 154, 190, 330, 410],
|
||||
},
|
||||
{
|
||||
name: '类别一',
|
||||
type: 'bar',
|
||||
stack: 'Ad',
|
||||
emphasis: {
|
||||
focus: 'series',
|
||||
},
|
||||
itemStyle: {
|
||||
color: '#5B8FF9',
|
||||
},
|
||||
barWidth: 30,
|
||||
data: [150, 232, 201, 154, 190, 330, 410],
|
||||
},
|
||||
...valList.map((e, index) => {
|
||||
return {
|
||||
name: titData[index],
|
||||
type: 'bar',
|
||||
stack: 'Ad',
|
||||
emphasis: {
|
||||
focus: 'series',
|
||||
},
|
||||
barWidth: 30,
|
||||
data: e,
|
||||
}
|
||||
}),
|
||||
],
|
||||
})
|
||||
},
|
||||
|
||||
initLine() {
|
||||
this.chart2 = echarts.init(this.$refs.chart2)
|
||||
this.setOptions2()
|
||||
this.request({
|
||||
url: '/hx/qualityAssurance/getHxQualityInspect',
|
||||
method: 'get',
|
||||
params: {
|
||||
type: '1',
|
||||
},
|
||||
}).then(({ data }) => {
|
||||
this.chart2 = echarts.init(this.$refs.chart2)
|
||||
this.setOptions2(data.factory)
|
||||
})
|
||||
},
|
||||
setOptions2() {
|
||||
setOptions2(resData) {
|
||||
let month = []
|
||||
let cate = [] // 率
|
||||
let completed = [] // 完成
|
||||
for (let i = 0; i < resData.length; i++) {
|
||||
const item = resData[i]
|
||||
month.push(item.month)
|
||||
cate.push(item.CATE)
|
||||
completed.push(item.COMPLETED)
|
||||
}
|
||||
this.chart2.setOption({
|
||||
tooltip: {
|
||||
trigger: 'axis',
|
||||
// formatter: '{a1}<br/>{b1}：{c1}',
|
||||
},
|
||||
legend: {
|
||||
data: ['数量', '完成率'],
|
||||
textStyle: {
|
||||
@ -479,20 +447,7 @@ export default {
|
||||
xAxis: [
|
||||
{
|
||||
type: 'category',
|
||||
data: [
|
||||
'2021-01',
|
||||
'2021-02',
|
||||
'2021-03',
|
||||
'2021-04',
|
||||
'2021-05',
|
||||
'2021-06',
|
||||
'2021-07',
|
||||
'2021-08',
|
||||
'2021-09',
|
||||
'2021-10',
|
||||
'2021-11',
|
||||
'2021-12',
|
||||
],
|
||||
data: month,
|
||||
axisPointer: {
|
||||
type: 'shadow',
|
||||
},
|
||||
@ -559,7 +514,7 @@ export default {
|
||||
name: '数量',
|
||||
type: 'bar',
|
||||
barWidth: 20,
|
||||
data: [75.6, 82.2, 26.4, 28.7, 70.7, 50.7, 60.7, 70.7, 80.7, 48.7, 18.8],
|
||||
data: completed,
|
||||
itemStyle: {
|
||||
color: {
|
||||
type: 'linear', // 线性渐变
|
||||
@ -585,7 +540,7 @@ export default {
|
||||
type: 'line',
|
||||
yAxisIndex: 1,
|
||||
smooth: false,
|
||||
data: [80, 70, 80, 70, 80, 70, 80, 70, 80, 70, 80, 70],
|
||||
data: cate,
|
||||
itemStyle: {
|
||||
color: '#55C5A2',
|
||||
},
|
||||
@ -632,14 +587,34 @@ export default {
|
||||
})
|
||||
},
|
||||
initChart22() {
|
||||
this.chart22 = echarts.init(this.$refs.chart22)
|
||||
this.setOptions22()
|
||||
this.request({
|
||||
url: '/hx/qualityAssurance/getHxQualityInspect',
|
||||
method: 'get',
|
||||
params: {
|
||||
type: '2',
|
||||
},
|
||||
}).then(({ data }) => {
|
||||
this.chart22 = echarts.init(this.$refs.chart22)
|
||||
this.setOptions22(data.dept)
|
||||
})
|
||||
},
|
||||
setOptions22() {
|
||||
setOptions22(resData) {
|
||||
console.log(resData)
|
||||
let deptName = []
|
||||
let cate = [] // 率
|
||||
let completed = [] // 完成
|
||||
let total = [] // 总
|
||||
for (let i = 0; i < resData.length; i++) {
|
||||
const item = resData[i]
|
||||
deptName.push(item.dept_name)
|
||||
cate.push(item.CATE)
|
||||
completed.push(item.COMPLETED)
|
||||
total.push(item.TOTAL)
|
||||
}
|
||||
this.chart22.setOption({
|
||||
tooltip: {
|
||||
trigger: 'axis',
|
||||
formatter: '{a1}<br/>{b1}：{c1}',
|
||||
// formatter: '{a1}<br/>{b1}：{c1}',
|
||||
},
|
||||
// legend: {
|
||||
// // data: ['收入', '实际', '目标'],
|
||||
@ -656,7 +631,7 @@ export default {
|
||||
bottom: 50,
|
||||
},
|
||||
xAxis: {
|
||||
data: ['部门', '部门', '部门', '部门', '部门', '部门', '部门', '部门', '部门', '部门', '部门', '部门'],
|
||||
data: deptName,
|
||||
axisLine: {
|
||||
lineStyle: {
|
||||
color: 'rgb(255, 255, 255)',
|
||||
@ -720,7 +695,7 @@ export default {
|
||||
itemStyle: {
|
||||
color: 'rgba(85, 197, 162, .3)',
|
||||
},
|
||||
data: [80, 80, 95, 95, 95, 95, 80, 80, 95, 95, 95, 95],
|
||||
data: total,
|
||||
},
|
||||
{
|
||||
name: '实际',
|
||||
@ -730,7 +705,7 @@ export default {
|
||||
itemStyle: {
|
||||
color: 'rgba(90, 216, 166, 0.85)',
|
||||
},
|
||||
data: [5, 20, 36, 10, 10, 20, 10, 20, 30, 10, 70, 75],
|
||||
data: completed,
|
||||
itemStyle: {
|
||||
color: {
|
||||
type: 'linear', // 线性渐变
|
||||
@ -761,7 +736,8 @@ export default {
|
||||
itemStyle: {
|
||||
color: '#F6D97E',
|
||||
},
|
||||
data: [20, 30, 45, 20, 20, 30, 20, 30, 40, 20, 90, 90],
|
||||
yAxisIndex: 1,
|
||||
data: cate,
|
||||
},
|
||||
],
|
||||
})
|
||||
@ -791,8 +767,8 @@ export default {
|
||||
display: block;
|
||||
height: 42px;
|
||||
line-height: 42px;
|
||||
background: #2a437d;
|
||||
opacity: 0.6;
|
||||
background: linear-gradient(270deg, rgba(30, 43, 99, 0) 0%, #1e2b63 100%);
|
||||
// opacity: 0.6;
|
||||
// box-shadow: 0px 1px 0px 0px rgba(139, 177, 237, 0.5);
|
||||
margin-bottom: 1px;
|
||||
img {
|
||||
|
||||
Reference in New Issue
Block a user