9 changed files with 295 additions and 242 deletions
@ -1,85 +1,111 @@ |
|||||
var option = { |
import { getPointTime } from 'config/api'; |
||||
// title: {
|
|
||||
// left: '10%',
|
const mixin = { |
||||
// textStyle: {
|
data() { |
||||
// fontWeight: 'normal',
|
return { |
||||
// color: '#fff', //标题颜色
|
pointTimeCurrentList: [], |
||||
// },
|
pointTimeHospital: [], |
||||
// text: '急救时长分析',
|
pointTimeInternation: [], |
||||
// },
|
}; |
||||
tooltip: { trigger: 'axis' }, |
|
||||
legend: { |
|
||||
x: 'center', |
|
||||
y: 'bottom', |
|
||||
data: ['我院记录', '国际水准', '当前数据'], |
|
||||
textStyle: { |
|
||||
fontWeight: 'normal', |
|
||||
color: '#ccc', //标题颜色
|
|
||||
}, |
|
||||
}, |
|
||||
grid: { |
|
||||
left: '3%', |
|
||||
// right: '4%',
|
|
||||
bottom: '10%', |
|
||||
containLabel: true, |
|
||||
}, |
}, |
||||
xAxis: { |
|
||||
type: 'category', |
computed: { |
||||
boundaryGap: false, |
option() { |
||||
data: ['周一', '周二', '周三', '周四', '周五', '周六', '周日'], |
return { |
||||
axisLabel: { |
tooltip: { trigger: 'axis' }, |
||||
textStyle: { |
legend: { |
||||
fontWeight: 'normal', |
x: 'center', |
||||
color: '#ccc', //标题颜色
|
y: 'bottom', |
||||
}, |
data: ['我院记录', '国际水准', '当前数据'], |
||||
|
textStyle: { |
||||
|
fontWeight: 'normal', |
||||
|
color: '#ccc', //标题颜色
|
||||
|
}, |
||||
|
}, |
||||
|
grid: { |
||||
|
left: '3%', |
||||
|
// right: '4%',
|
||||
|
bottom: '10%', |
||||
|
containLabel: true, |
||||
|
}, |
||||
|
xAxis: { |
||||
|
type: 'category', |
||||
|
boundaryGap: false, |
||||
|
data: ['周一', '周二', '周三', '周四', '周五', '周六', '周日'], |
||||
|
axisLabel: { |
||||
|
textStyle: { |
||||
|
fontWeight: 'normal', |
||||
|
color: '#ccc', //标题颜色
|
||||
|
}, |
||||
|
}, |
||||
|
}, |
||||
|
yAxis: { |
||||
|
type: 'value', |
||||
|
name: '秒', |
||||
|
axisLabel: { |
||||
|
textStyle: { |
||||
|
fontWeight: 'normal', |
||||
|
color: '#ccc', //标题颜色
|
||||
|
}, |
||||
|
}, |
||||
|
nameTextStyle: { color: '#ccc' }, |
||||
|
splitLine: { |
||||
|
show: true, |
||||
|
lineStyle: { |
||||
|
type: 'dashed', |
||||
|
color: '#ccc', |
||||
|
}, |
||||
|
}, |
||||
|
}, |
||||
|
series: [ |
||||
|
{ |
||||
|
name: '我院记录', |
||||
|
type: 'line', |
||||
|
stack: '总量', |
||||
|
symbolSize: 6, |
||||
|
// symbol: 'star',
|
||||
|
data: this.pointTimeHospital, |
||||
|
color: 'rgb(18, 131, 227)', |
||||
|
}, |
||||
|
{ |
||||
|
name: '国际水准', |
||||
|
type: 'line', |
||||
|
stack: '总量', |
||||
|
symbolSize: 6, |
||||
|
data: this.pointTimeInternation, |
||||
|
color: 'rgb(30, 231, 231)', |
||||
|
}, |
||||
|
{ |
||||
|
name: '当前数据', |
||||
|
type: 'line', |
||||
|
stack: '总量', |
||||
|
symbolSize: 6, |
||||
|
data: this.pointTimeCurrentList, |
||||
|
color: 'rgb(227, 18, 187)', |
||||
|
}, |
||||
|
], |
||||
|
}; |
||||
}, |
}, |
||||
}, |
}, |
||||
yAxis: { |
|
||||
type: 'value', |
methods: { |
||||
name: '秒', |
async getData() { |
||||
interval: 200, |
try { |
||||
axisLabel: { |
const params = { param: { id: 0 } }; |
||||
textStyle: { |
const res = await getPointTime(params); |
||||
fontWeight: 'normal', |
const { code, msg, data } = res.data; |
||||
color: '#ccc', //标题颜色
|
if (code === 200) { |
||||
}, |
this.pointTimeCurrentList = data.pointTimeCurrentList; |
||||
}, |
this.pointTimeHospital = data.pointTimeHospital; |
||||
nameTextStyle: { color: '#ccc' }, |
this.pointTimeInternation = data.pointTimeInternation; |
||||
splitLine: { |
} else { |
||||
show: true, |
console.log(msg); |
||||
lineStyle: { |
} |
||||
type: 'dashed', |
} catch (error) { |
||||
color: '#ccc', |
console.log(error); |
||||
}, |
} |
||||
}, |
}, |
||||
}, |
}, |
||||
series: [ |
|
||||
{ |
|
||||
name: '我院记录', |
|
||||
type: 'line', |
|
||||
stack: '总量', |
|
||||
symbolSize: 6, |
|
||||
// symbol: 'star',
|
|
||||
data: [120, 132, 101, 134, 90, 230, 210], |
|
||||
color: 'rgb(18, 131, 227)', |
|
||||
}, |
|
||||
{ |
|
||||
name: '国际水准', |
|
||||
type: 'line', |
|
||||
stack: '总量', |
|
||||
symbolSize: 6, |
|
||||
data: [220, 182, 191, 234, 290, 330, 310], |
|
||||
color: 'rgb(30, 231, 231)', |
|
||||
}, |
|
||||
{ |
|
||||
name: '当前数据', |
|
||||
type: 'line', |
|
||||
stack: '总量', |
|
||||
symbolSize: 6, |
|
||||
data: [150, 232, 201, 154, 190, 330, 410], |
|
||||
color: 'rgb(227, 18, 187)', |
|
||||
}, |
|
||||
], |
|
||||
}; |
}; |
||||
|
|
||||
export default option; |
export default mixin; |
||||
|
@ -1,135 +1,177 @@ |
|||||
var option = { |
import { selResult } from 'config/api'; |
||||
tooltip: { trigger: 'axis' }, |
|
||||
legend: [ |
const mixin = { |
||||
{ |
data() { |
||||
x: 'center', |
return { |
||||
y: 'top', |
sigleLast: [], // 去年柱形图
|
||||
data: ['本年', '去年'], |
sigleNow: [], // 本年柱形图
|
||||
textStyle: { |
sumLast: [], // 去年折线图
|
||||
fontWeight: 'normal', |
sumNow: [], // 本年折线图
|
||||
color: '#ccc', //标题颜色
|
}; |
||||
}, |
|
||||
}, |
|
||||
{ |
|
||||
x: 'center', |
|
||||
y: 'bottom', |
|
||||
data: ['本年完成', '去年同期'], |
|
||||
textStyle: { |
|
||||
fontWeight: 'normal', |
|
||||
color: '#ccc', //标题颜色
|
|
||||
}, |
|
||||
}, |
|
||||
], |
|
||||
xAxis: { |
|
||||
type: 'category', |
|
||||
data: ['01月', '02月', '03月', '04月', '05月', '06月', '07月', '08月', '09月', '10月', '11月', '12月'], |
|
||||
axisLabel: { |
|
||||
textStyle: { |
|
||||
fontWeight: 'normal', |
|
||||
color: '#ccc', //标题颜色
|
|
||||
}, |
|
||||
}, |
|
||||
}, |
}, |
||||
yAxis: [ |
|
||||
{ |
computed: { |
||||
type: 'value', |
option() { |
||||
interval: 200, |
return { |
||||
name: '人次', |
tooltip: { trigger: 'axis' }, |
||||
axisTick: { |
legend: [ |
||||
//y轴刻度线
|
{ |
||||
show: false, |
x: 'center', |
||||
}, |
y: 'top', |
||||
splitLine: { |
data: ['本年', '去年'], |
||||
show: true, |
|
||||
lineStyle: { |
|
||||
type: 'dashed', |
|
||||
color: '#666', |
|
||||
}, |
|
||||
}, |
|
||||
nameTextStyle: { color: '#ccc' }, |
|
||||
axisLabel: { |
|
||||
textStyle: { |
|
||||
fontWeight: 'normal', |
|
||||
color: '#ccc', //标题颜色
|
|
||||
}, |
|
||||
}, |
|
||||
}, |
|
||||
{ |
|
||||
type: 'value', |
|
||||
interval: 200, |
|
||||
name: '数量', |
|
||||
splitLine: { |
|
||||
show: true, |
|
||||
lineStyle: { |
|
||||
type: 'dashed', |
|
||||
color: '#666', |
|
||||
}, |
|
||||
}, |
|
||||
nameTextStyle: { color: '#ccc' }, |
|
||||
axisLabel: { |
|
||||
textStyle: { |
|
||||
fontWeight: 'normal', |
|
||||
color: '#ccc', //标题颜色
|
|
||||
}, |
|
||||
}, |
|
||||
}, |
|
||||
], |
|
||||
series: [ |
|
||||
{ |
|
||||
name: '本年', |
|
||||
data: [120, 232, 301, 434, 590, 630, 720, 301, 434, 590, 630, 720], |
|
||||
type: 'line', |
|
||||
color: 'rgb(24, 144, 255)', |
|
||||
}, |
|
||||
{ |
|
||||
name: '去年', |
|
||||
data: [820, 932, 901, 934, 1290, 1330, 1320, 932, 901, 934, 1290, 1330], |
|
||||
type: 'line', |
|
||||
color: 'rgb(26, 235, 235)', |
|
||||
}, |
|
||||
{ |
|
||||
name: '本年完成', |
|
||||
data: [120, 232, 301, 434, 590, 630, 720, 232, 301, 434, 590, 630], |
|
||||
yAxisIndex: 1, |
|
||||
type: 'bar', |
|
||||
barWidth: '10%', |
|
||||
color: 'rgb(24, 144, 255)', |
|
||||
itemStyle: { |
|
||||
normal: { |
|
||||
label: { |
|
||||
show: true, //开启显示
|
|
||||
position: 'top', //在上方显示
|
|
||||
textStyle: { |
textStyle: { |
||||
//数值样式
|
fontWeight: 'normal', |
||||
color: 'white', |
color: '#ccc', //标题颜色
|
||||
fontSize: 12, |
|
||||
}, |
}, |
||||
}, |
}, |
||||
}, |
{ |
||||
}, |
x: 'center', |
||||
}, |
y: 'bottom', |
||||
{ |
data: ['本年完成', '去年同期'], |
||||
name: '去年同期', |
textStyle: { |
||||
data: [820, 932, 901, 934, 1290, 1330, 1320, 932, 901, 934, 1290, 1330], |
fontWeight: 'normal', |
||||
yAxisIndex: 1, |
color: '#ccc', //标题颜色
|
||||
type: 'bar', |
}, |
||||
barWidth: '10%', |
}, |
||||
color: 'rgb(26, 235, 235)', |
], |
||||
itemStyle: { |
xAxis: { |
||||
normal: { |
type: 'category', |
||||
label: { |
data: ['01月', '02月', '03月', '04月', '05月', '06月', '07月', '08月', '09月', '10月', '11月', '12月'], |
||||
show: true, //开启显示
|
axisLabel: { |
||||
position: 'top', //在上方显示
|
|
||||
textStyle: { |
textStyle: { |
||||
//数值样式
|
fontWeight: 'normal', |
||||
color: 'white', |
color: '#ccc', //标题颜色
|
||||
fontSize: 12, |
|
||||
}, |
}, |
||||
}, |
}, |
||||
}, |
}, |
||||
}, |
yAxis: [ |
||||
|
{ |
||||
|
type: 'value', |
||||
|
interval: 20, |
||||
|
name: '人次', |
||||
|
axisTick: { |
||||
|
//y轴刻度线
|
||||
|
show: false, |
||||
|
}, |
||||
|
splitLine: { |
||||
|
show: true, |
||||
|
lineStyle: { |
||||
|
type: 'dashed', |
||||
|
color: '#666', |
||||
|
}, |
||||
|
}, |
||||
|
nameTextStyle: { color: '#ccc' }, |
||||
|
axisLabel: { |
||||
|
textStyle: { |
||||
|
fontWeight: 'normal', |
||||
|
color: '#ccc', //标题颜色
|
||||
|
}, |
||||
|
}, |
||||
|
}, |
||||
|
{ |
||||
|
type: 'value', |
||||
|
interval: 20, |
||||
|
name: '数量', |
||||
|
splitLine: { |
||||
|
show: true, |
||||
|
lineStyle: { |
||||
|
type: 'dashed', |
||||
|
color: '#666', |
||||
|
}, |
||||
|
}, |
||||
|
nameTextStyle: { color: '#ccc' }, |
||||
|
axisLabel: { |
||||
|
textStyle: { |
||||
|
fontWeight: 'normal', |
||||
|
color: '#ccc', //标题颜色
|
||||
|
}, |
||||
|
}, |
||||
|
}, |
||||
|
], |
||||
|
series: [ |
||||
|
{ |
||||
|
name: '本年', |
||||
|
data: this.sumNow, |
||||
|
type: 'line', |
||||
|
color: 'rgb(24, 144, 255)', |
||||
|
}, |
||||
|
{ |
||||
|
name: '去年', |
||||
|
data: this.sumLast, |
||||
|
type: 'line', |
||||
|
color: 'rgb(26, 235, 235)', |
||||
|
}, |
||||
|
{ |
||||
|
name: '本年完成', |
||||
|
data: this.sigleNow, |
||||
|
yAxisIndex: 1, |
||||
|
type: 'bar', |
||||
|
barGap: '100%', |
||||
|
barWidth: '20%', |
||||
|
color: 'rgb(24, 144, 255)', |
||||
|
itemStyle: { |
||||
|
normal: { |
||||
|
label: { |
||||
|
show: true, //开启显示
|
||||
|
position: 'top', //在上方显示
|
||||
|
textStyle: { |
||||
|
//数值样式
|
||||
|
color: 'white', |
||||
|
fontSize: 12, |
||||
|
}, |
||||
|
}, |
||||
|
}, |
||||
|
}, |
||||
|
}, |
||||
|
{ |
||||
|
name: '去年同期', |
||||
|
data: this.sigleLast, |
||||
|
yAxisIndex: 1, |
||||
|
type: 'bar', |
||||
|
barWidth: '20%', |
||||
|
color: 'rgb(26, 235, 235)', |
||||
|
itemStyle: { |
||||
|
normal: { |
||||
|
label: { |
||||
|
show: true, //开启显示
|
||||
|
position: 'top', //在上方显示
|
||||
|
textStyle: { |
||||
|
//数值样式
|
||||
|
color: 'white', |
||||
|
fontSize: 12, |
||||
|
}, |
||||
|
}, |
||||
|
}, |
||||
|
}, |
||||
|
}, |
||||
|
], |
||||
|
}; |
||||
}, |
}, |
||||
], |
}, |
||||
|
methods: { |
||||
|
async getData() { |
||||
|
try { |
||||
|
const params = { |
||||
|
param: { |
||||
|
hospitalId: 0, |
||||
|
year: '2020', |
||||
|
}, |
||||
|
}; |
||||
|
const res = await selResult(params); |
||||
|
const { code, msg, data } = res.data; |
||||
|
if (code === 200) { |
||||
|
this.sigleLast = data.sigleLast; |
||||
|
this.sigleNow = data.sigleNow; |
||||
|
this.sumLast = data.sumLast; |
||||
|
this.sumNow = data.sumNow; |
||||
|
} else { |
||||
|
console.log(msg); |
||||
|
} |
||||
|
} catch (error) { |
||||
|
console.log(error); |
||||
|
} |
||||
|
}, |
||||
|
}, |
||||
}; |
}; |
||||
|
|
||||
export default option; |
export default mixin; |
||||
|
Loading…
Reference in new issue