|
|
|
@ -1,54 +1,76 @@ |
|
|
|
<template> |
|
|
|
<div> |
|
|
|
<div class="app-container"> |
|
|
|
<div class="dis" style="width: 100%"> |
|
|
|
<div style="flex: 1; margin-right: 20px"> |
|
|
|
<el-card shadow="always"> |
|
|
|
<div class="dis title-box"> |
|
|
|
<span class="header-title">病种排名</span> |
|
|
|
<div class="dis"></div> |
|
|
|
</div> |
|
|
|
<div style="height: 300px" v-loading="loading"> |
|
|
|
<div id="diagnose" style="width: 100%"></div> |
|
|
|
</div> |
|
|
|
</el-card> |
|
|
|
</div> |
|
|
|
<div style="flex: 1; margin-right: 20px"> |
|
|
|
<el-card shadow="always"> |
|
|
|
<div class="dis title-box"> |
|
|
|
<span class="header-title">体型分布</span> |
|
|
|
<div class="dis"></div> |
|
|
|
</div> |
|
|
|
<div style="height: 300px" v-loading="loading"> |
|
|
|
<div id="system" style="width: 100%"></div> |
|
|
|
</div> |
|
|
|
</el-card> |
|
|
|
</div> |
|
|
|
<div style="flex: 1; margin-right: 20px"> |
|
|
|
<el-card shadow="always"> |
|
|
|
<div class="dis title-box"> |
|
|
|
<span class="header-title">体质分布</span> |
|
|
|
<div class="dis"></div> |
|
|
|
</div> |
|
|
|
<div style="height: 300px" v-loading="loading"> |
|
|
|
<div id="physique" style="width: 100%"></div> |
|
|
|
</div> |
|
|
|
</el-card> |
|
|
|
</div> |
|
|
|
<div style="flex: 1"> |
|
|
|
<el-card shadow="always"> |
|
|
|
<div class="dis title-box"> |
|
|
|
<span class="header-title">体态评估（TAPS）</span> |
|
|
|
<div class="dis"></div> |
|
|
|
</div> |
|
|
|
<div style="height: 300px" v-loading="loading"> |
|
|
|
<div id="posture" style="width: 100%"></div> |
|
|
|
</div> |
|
|
|
</el-card> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="app-container"> |
|
|
|
<div> |
|
|
|
<div class="app-container"> |
|
|
|
<div class="dis" style="width: 100%"> |
|
|
|
<div style="flex: 1; margin-right: 20px"> |
|
|
|
<el-card shadow="always"> |
|
|
|
<div class="dis title-box"> |
|
|
|
<span class="header-title">病种排名</span> |
|
|
|
<div class="dis"></div> |
|
|
|
</div> |
|
|
|
<div style="height: 300px" v-loading="loading"> |
|
|
|
<div id="diagnose" style="width: 100%"></div> |
|
|
|
</div> |
|
|
|
</el-card> |
|
|
|
</div> |
|
|
|
<div style="flex: 1; margin-right: 20px"> |
|
|
|
<el-card shadow="always"> |
|
|
|
<div class="dis title-box"> |
|
|
|
<span class="header-title">体型分布</span> |
|
|
|
<div class="dis"></div> |
|
|
|
</div> |
|
|
|
<div style="height: 300px" v-loading="loading"> |
|
|
|
<div id="system" style="width: 100%"></div> |
|
|
|
</div> |
|
|
|
</el-card> |
|
|
|
</div> |
|
|
|
<div style="flex: 1; margin-right: 20px"> |
|
|
|
<el-card shadow="always"> |
|
|
|
<div class="dis title-box"> |
|
|
|
<span class="header-title">体质分布</span> |
|
|
|
<div class="dis"></div> |
|
|
|
</div> |
|
|
|
<div style="height: 300px" v-loading="loading"> |
|
|
|
<div id="physique" style="width: 100%"></div> |
|
|
|
</div> |
|
|
|
</el-card> |
|
|
|
</div> |
|
|
|
<div style="flex: 1; margin-right: 20px"> |
|
|
|
<el-card shadow="always"> |
|
|
|
<div class="dis title-box"> |
|
|
|
<span class="header-title">体态评估（TAPS）</span> |
|
|
|
<div class="dis"></div> |
|
|
|
</div> |
|
|
|
<div style="height: 300px" v-loading="loading"> |
|
|
|
<div id="posture" style="width: 100%"></div> |
|
|
|
</div> |
|
|
|
</el-card> |
|
|
|
</div> |
|
|
|
<div style="flex: 1; margin-right: 20px"> |
|
|
|
<el-card shadow="always"> |
|
|
|
<div class="dis title-box"> |
|
|
|
<span class="header-title">失眠评估（PHQ-9）</span> |
|
|
|
<div class="dis"></div> |
|
|
|
</div> |
|
|
|
<div style="height: 300px" v-loading="loading"> |
|
|
|
<div id="agrypnia" style="width: 100%"></div> |
|
|
|
</div> |
|
|
|
</el-card> |
|
|
|
</div> |
|
|
|
<div style="flex: 1"> |
|
|
|
<el-card shadow="always"> |
|
|
|
<div class="dis title-box"> |
|
|
|
<span class="header-title">焦虑（HAMD-24）</span> |
|
|
|
<div class="dis"></div> |
|
|
|
</div> |
|
|
|
<div style="height: 300px" v-loading="loading"> |
|
|
|
<div id="anxiety" style="width: 100%"></div> |
|
|
|
</div> |
|
|
|
</el-card> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<!-- <div class="app-container"> |
|
|
|
<div class="dis" style="width: 100%"> |
|
|
|
<div style="flex: 1; margin-right: 20px"> |
|
|
|
<el-card shadow="always"> |
|
|
|
@ -73,335 +95,326 @@ |
|
|
|
</el-card> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> --> |
|
|
|
</div> |
|
|
|
</template> |
|
|
|
|
|
|
|
<script> |
|
|
|
import * as echarts from "echarts"; |
|
|
|
require("echarts/theme/macarons"); // echarts theme |
|
|
|
import resize from "@/views/dashboard/mixins/resize"; |
|
|
|
import { |
|
|
|
zlInfo |
|
|
|
} from "@/api/indexCom.js"; |
|
|
|
import { |
|
|
|
diagnoseEcharts, |
|
|
|
systemEcharts, |
|
|
|
physiqueEcharts, |
|
|
|
postureEcharts, |
|
|
|
agrypniaEcharts, |
|
|
|
anxietyEcharts, |
|
|
|
} from "./index"; |
|
|
|
export default { |
|
|
|
name: "Post", |
|
|
|
props: ["title"], |
|
|
|
mixins: [resize], |
|
|
|
data() { |
|
|
|
return { |
|
|
|
queryParams: { |
|
|
|
param: { |
|
|
|
startTime: "", |
|
|
|
endTime: "", |
|
|
|
}, |
|
|
|
}, |
|
|
|
import * as echarts from "echarts"; |
|
|
|
require("echarts/theme/macarons"); // echarts theme |
|
|
|
import resize from "@/views/dashboard/mixins/resize"; |
|
|
|
import { zlInfo } from "@/api/indexCom.js"; |
|
|
|
import { |
|
|
|
diagnoseEcharts, |
|
|
|
systemEcharts, |
|
|
|
physiqueEcharts, |
|
|
|
postureEcharts, |
|
|
|
agrypniaEcharts, |
|
|
|
anxietyEcharts, |
|
|
|
} from "./index"; |
|
|
|
export default { |
|
|
|
name: "Post", |
|
|
|
props: ["title"], |
|
|
|
mixins: [resize], |
|
|
|
data() { |
|
|
|
return { |
|
|
|
queryParams: { |
|
|
|
param: { |
|
|
|
startTime: "", |
|
|
|
endTime: "", |
|
|
|
}, |
|
|
|
}, |
|
|
|
|
|
|
|
loading: false, |
|
|
|
diagnoseValue: null, // 病种 |
|
|
|
systemValue: null, // 体系 |
|
|
|
physiqueValue: null, // 体质 |
|
|
|
postureValue: null, // 体态 |
|
|
|
agrypniaValue: null, // 失眠 |
|
|
|
anxietyValue: null, // 焦虑 |
|
|
|
// 体系中文 |
|
|
|
systemObj: { |
|
|
|
yxfpz: "隐形肥胖型", //隐形肥胖型 |
|
|
|
zfgdx: "脂肪过多型", //脂肪过多型 |
|
|
|
fpx: "肥胖型", //肥胖型 |
|
|
|
jrbzx: "肌肉不足型", //肌肉不足型 |
|
|
|
jkjcx: "健康匀称型", //健康匀称型 |
|
|
|
czjrx: "超重肌肉型", //超重肌肉型 |
|
|
|
xsx: "消瘦型", //消瘦型 |
|
|
|
dzfx: "低脂肪型", //低脂肪型 |
|
|
|
ydyx: "运动员型", //运动员型 |
|
|
|
}, |
|
|
|
// 体质 |
|
|
|
physiqueObj: { |
|
|
|
phz: "平和质", //平和质 |
|
|
|
qxz: "气虚质", //气虚质 |
|
|
|
yangxz: "阳虚质", //阳虚质 |
|
|
|
yinxz: "阴虚质", //阴虚质 |
|
|
|
tsz: "痰湿质", //痰湿质 |
|
|
|
srz: "湿热质", //湿热质 |
|
|
|
xyz: "血瘀质", //血瘀质 |
|
|
|
qyz: "气郁质", //气郁质 |
|
|
|
tlz: "特禀质", //特禀质 |
|
|
|
}, |
|
|
|
}; |
|
|
|
}, |
|
|
|
created() { |
|
|
|
// this.Linepatient(); |
|
|
|
this.getData(); |
|
|
|
}, |
|
|
|
methods: { |
|
|
|
statistics(_data, _type) { |
|
|
|
this.initial(_data, _type); // 处理数据 |
|
|
|
this.loading = true; |
|
|
|
this.getData(); // 获取数据 |
|
|
|
}, |
|
|
|
//患者信息 |
|
|
|
async getData() { |
|
|
|
try { |
|
|
|
await zlInfo(this.queryParams).then((res) => { |
|
|
|
const { |
|
|
|
jlfb, |
|
|
|
smfb, |
|
|
|
sort, |
|
|
|
ttfb, |
|
|
|
txfb, |
|
|
|
zytz |
|
|
|
} = res.data; |
|
|
|
// 病种（主要诊断） |
|
|
|
this.diagnoseValue = sort.sort((a, b) => a.total - b.total); |
|
|
|
this.handleDiagnose(); |
|
|
|
// 体系 |
|
|
|
this.systemValue = []; |
|
|
|
delete txfb.total; |
|
|
|
for (let key in txfb) { |
|
|
|
let data = { |
|
|
|
name: this.systemObj[key], |
|
|
|
value: txfb[key] || 0, |
|
|
|
}; |
|
|
|
this.systemValue.push(data); |
|
|
|
} |
|
|
|
this.handleSystem(); |
|
|
|
// 体质 |
|
|
|
this.physiqueValue = []; |
|
|
|
delete zytz.total; |
|
|
|
for (let key in zytz) { |
|
|
|
let data = { |
|
|
|
name: this.physiqueObj[key], |
|
|
|
value: zytz[key] || 0, |
|
|
|
}; |
|
|
|
this.physiqueValue.push(data); |
|
|
|
} |
|
|
|
this.handlePhysique(); |
|
|
|
// 体态 |
|
|
|
this.postureValue = [{ |
|
|
|
value: ttfb?.score1 || 0, |
|
|
|
name: "1分", |
|
|
|
}, |
|
|
|
{ |
|
|
|
value: ttfb?.score2 || 0, |
|
|
|
name: "2分", |
|
|
|
}, |
|
|
|
{ |
|
|
|
value: ttfb?.score3 || 0, |
|
|
|
name: "3分", |
|
|
|
}, |
|
|
|
{ |
|
|
|
value: ttfb?.score4 || 0, |
|
|
|
name: "4分", |
|
|
|
}, |
|
|
|
{ |
|
|
|
value: ttfb?.score5 || 0, |
|
|
|
name: "5分", |
|
|
|
}, |
|
|
|
]; |
|
|
|
this.handlePosture(); |
|
|
|
// 失眠评估（PHQ-9） |
|
|
|
this.agrypniaValue = []; |
|
|
|
for (let key in smfb) { |
|
|
|
this.agrypniaValue.push(smfb[key]); |
|
|
|
} |
|
|
|
this.handleAgrypnia(); |
|
|
|
// 焦虑度 |
|
|
|
this.anxietyValue = []; |
|
|
|
for (let key in jlfb) { |
|
|
|
this.anxietyValue.push(jlfb[key]); |
|
|
|
} |
|
|
|
this.handleAnxiety(); |
|
|
|
this.loading = false; |
|
|
|
}); |
|
|
|
|
|
|
|
} catch (e) { |
|
|
|
console.log('诊疗信息', e) |
|
|
|
} |
|
|
|
}, |
|
|
|
// 病种（主要诊断） |
|
|
|
handleDiagnose() { |
|
|
|
diagnoseEcharts.series[0].data = this.diagnoseValue?.map((item) => { |
|
|
|
return item.total; |
|
|
|
}); |
|
|
|
diagnoseEcharts.yAxis.data = this.diagnoseValue?.map((item) => { |
|
|
|
return item.type; |
|
|
|
}); |
|
|
|
this.$nextTick(() => { |
|
|
|
var myChart = echarts.init(document.getElementById("diagnose"), null, { |
|
|
|
height: 300, |
|
|
|
}); |
|
|
|
myChart.setOption(diagnoseEcharts, true); |
|
|
|
myChart.resize(); |
|
|
|
window.onresize = myChart.resize; |
|
|
|
}); |
|
|
|
}, |
|
|
|
// 体系 |
|
|
|
handleSystem() { |
|
|
|
systemEcharts.series[0].data = this.systemValue?.map((item) => { |
|
|
|
return item.value; |
|
|
|
}); |
|
|
|
systemEcharts.xAxis.data = this.systemValue?.map((item) => { |
|
|
|
return item.name; |
|
|
|
}); |
|
|
|
this.$nextTick(() => { |
|
|
|
var myChart = echarts.init(document.getElementById("system"), null, { |
|
|
|
height: 300, |
|
|
|
}); |
|
|
|
myChart.setOption(systemEcharts, true); |
|
|
|
myChart.resize(); |
|
|
|
window.onresize = myChart.resize; |
|
|
|
}); |
|
|
|
}, |
|
|
|
// 体质 |
|
|
|
handlePhysique() { |
|
|
|
physiqueEcharts.series[0].data = this.physiqueValue?.map((item) => { |
|
|
|
return item.value; |
|
|
|
}); |
|
|
|
physiqueEcharts.xAxis.data = this.physiqueValue?.map((item) => { |
|
|
|
return item.name; |
|
|
|
}); |
|
|
|
this.$nextTick(() => { |
|
|
|
var myChart = echarts.init(document.getElementById("physique"), null, { |
|
|
|
height: 300, |
|
|
|
}); |
|
|
|
myChart.setOption(physiqueEcharts, true); |
|
|
|
myChart.resize(); |
|
|
|
window.onresize = myChart.resize; |
|
|
|
}); |
|
|
|
}, |
|
|
|
// 体态评估 |
|
|
|
handlePosture() { |
|
|
|
postureEcharts.series[0].data = this.postureValue; |
|
|
|
this.$nextTick(() => { |
|
|
|
var myChart = echarts.init(document.getElementById("posture"), null, { |
|
|
|
height: 300, |
|
|
|
}); |
|
|
|
myChart.setOption(postureEcharts, true); |
|
|
|
myChart.resize(); |
|
|
|
window.onresize = myChart.resize; |
|
|
|
}); |
|
|
|
}, |
|
|
|
// 数据处理 查询类型判断参数 |
|
|
|
initial(_data, _type) { |
|
|
|
_data[0] = this.$moment(_data[0]).format("YYYY-MM-DD"); |
|
|
|
_data[1] = this.$moment(_data[1]).format("YYYY-MM-DD"); |
|
|
|
this.queryParams.param = { |
|
|
|
startTime: _data[0] + " " + "00:00:00", |
|
|
|
endTime: _data[1] + " " + "23:59:59", |
|
|
|
}; |
|
|
|
}, |
|
|
|
// 失眠评估 |
|
|
|
handleAgrypnia() { |
|
|
|
agrypniaEcharts.series[0].data = this.agrypniaValue; |
|
|
|
this.$nextTick(() => { |
|
|
|
var myChart = echarts.init(document.getElementById("agrypnia"), null, { |
|
|
|
height: 300, |
|
|
|
}); |
|
|
|
myChart.setOption(agrypniaEcharts, true); |
|
|
|
myChart.resize(); |
|
|
|
window.onresize = myChart.resize; |
|
|
|
}); |
|
|
|
}, |
|
|
|
// 焦虑评估 |
|
|
|
handleAnxiety() { |
|
|
|
anxietyEcharts.series[0].data = this.anxietyValue; |
|
|
|
this.$nextTick(() => { |
|
|
|
var myChart = echarts.init(document.getElementById("anxiety"), null, { |
|
|
|
height: 300, |
|
|
|
}); |
|
|
|
myChart.setOption(anxietyEcharts, true); |
|
|
|
myChart.resize(); |
|
|
|
window.onresize = myChart.resize; |
|
|
|
}); |
|
|
|
}, |
|
|
|
// 重新渲染图标 |
|
|
|
getRenew() { |
|
|
|
this.handleDiagnose(); |
|
|
|
this.handleSystem(); |
|
|
|
this.handlePhysique(); |
|
|
|
this.handlePosture(); |
|
|
|
this.handleAgrypnia(); |
|
|
|
this.handleAnxiety(); |
|
|
|
}, |
|
|
|
}, |
|
|
|
}; |
|
|
|
loading: false, |
|
|
|
diagnoseValue: null, // 病种 |
|
|
|
systemValue: null, // 体系 |
|
|
|
physiqueValue: null, // 体质 |
|
|
|
postureValue: null, // 体态 |
|
|
|
agrypniaValue: null, // 失眠 |
|
|
|
anxietyValue: null, // 焦虑 |
|
|
|
// 体系中文 |
|
|
|
systemObj: { |
|
|
|
yxfpz: "隐形肥胖型", //隐形肥胖型 |
|
|
|
zfgdx: "脂肪过多型", //脂肪过多型 |
|
|
|
fpx: "肥胖型", //肥胖型 |
|
|
|
jrbzx: "肌肉不足型", //肌肉不足型 |
|
|
|
jkjcx: "健康匀称型", //健康匀称型 |
|
|
|
czjrx: "超重肌肉型", //超重肌肉型 |
|
|
|
xsx: "消瘦型", //消瘦型 |
|
|
|
dzfx: "低脂肪型", //低脂肪型 |
|
|
|
ydyx: "运动员型", //运动员型 |
|
|
|
}, |
|
|
|
// 体质 |
|
|
|
physiqueObj: { |
|
|
|
phz: "平和质", //平和质 |
|
|
|
qxz: "气虚质", //气虚质 |
|
|
|
yangxz: "阳虚质", //阳虚质 |
|
|
|
yinxz: "阴虚质", //阴虚质 |
|
|
|
tsz: "痰湿质", //痰湿质 |
|
|
|
srz: "湿热质", //湿热质 |
|
|
|
xyz: "血瘀质", //血瘀质 |
|
|
|
qyz: "气郁质", //气郁质 |
|
|
|
tlz: "特禀质", //特禀质 |
|
|
|
}, |
|
|
|
}; |
|
|
|
}, |
|
|
|
created() { |
|
|
|
// this.Linepatient(); |
|
|
|
this.getData(); |
|
|
|
}, |
|
|
|
methods: { |
|
|
|
statistics(_data, _type) { |
|
|
|
this.initial(_data, _type); // 处理数据 |
|
|
|
this.loading = true; |
|
|
|
this.getData(); // 获取数据 |
|
|
|
}, |
|
|
|
//患者信息 |
|
|
|
async getData() { |
|
|
|
try { |
|
|
|
await zlInfo(this.queryParams).then((res) => { |
|
|
|
const { jlfb, smfb, sort, ttfb, txfb, zytz } = res.data; |
|
|
|
// 病种（主要诊断） |
|
|
|
this.diagnoseValue = sort.sort((a, b) => a.total - b.total); |
|
|
|
this.handleDiagnose(); |
|
|
|
// 体系 |
|
|
|
this.systemValue = []; |
|
|
|
delete txfb.total; |
|
|
|
for (let key in txfb) { |
|
|
|
let data = { |
|
|
|
name: this.systemObj[key], |
|
|
|
value: txfb[key] || 0, |
|
|
|
}; |
|
|
|
this.systemValue.push(data); |
|
|
|
} |
|
|
|
this.handleSystem(); |
|
|
|
// 体质 |
|
|
|
this.physiqueValue = []; |
|
|
|
delete zytz.total; |
|
|
|
for (let key in zytz) { |
|
|
|
let data = { |
|
|
|
name: this.physiqueObj[key], |
|
|
|
value: zytz[key] || 0, |
|
|
|
}; |
|
|
|
this.physiqueValue.push(data); |
|
|
|
} |
|
|
|
this.handlePhysique(); |
|
|
|
// 体态 |
|
|
|
this.postureValue = [ |
|
|
|
{ |
|
|
|
value: ttfb?.score1 || 0, |
|
|
|
name: "1分", |
|
|
|
}, |
|
|
|
{ |
|
|
|
value: ttfb?.score2 || 0, |
|
|
|
name: "2分", |
|
|
|
}, |
|
|
|
{ |
|
|
|
value: ttfb?.score3 || 0, |
|
|
|
name: "3分", |
|
|
|
}, |
|
|
|
{ |
|
|
|
value: ttfb?.score4 || 0, |
|
|
|
name: "4分", |
|
|
|
}, |
|
|
|
{ |
|
|
|
value: ttfb?.score5 || 0, |
|
|
|
name: "5分", |
|
|
|
}, |
|
|
|
]; |
|
|
|
this.handlePosture(); |
|
|
|
// 失眠评估（PHQ-9） |
|
|
|
this.agrypniaValue = []; |
|
|
|
for (let key in smfb) { |
|
|
|
this.agrypniaValue.push(smfb[key]); |
|
|
|
} |
|
|
|
this.handleAgrypnia(); |
|
|
|
// 焦虑度 |
|
|
|
this.anxietyValue = []; |
|
|
|
for (let key in jlfb) { |
|
|
|
this.anxietyValue.push(jlfb[key]); |
|
|
|
} |
|
|
|
this.handleAnxiety(); |
|
|
|
this.loading = false; |
|
|
|
}); |
|
|
|
} catch (e) { |
|
|
|
console.log("诊疗信息", e); |
|
|
|
} |
|
|
|
}, |
|
|
|
// 病种（主要诊断） |
|
|
|
handleDiagnose() { |
|
|
|
diagnoseEcharts.series[0].data = this.diagnoseValue?.map((item) => { |
|
|
|
return item.total; |
|
|
|
}); |
|
|
|
diagnoseEcharts.yAxis.data = this.diagnoseValue?.map((item) => { |
|
|
|
return item.type; |
|
|
|
}); |
|
|
|
this.$nextTick(() => { |
|
|
|
var myChart = echarts.init(document.getElementById("diagnose"), null, { |
|
|
|
height: 300, |
|
|
|
}); |
|
|
|
myChart.setOption(diagnoseEcharts, true); |
|
|
|
myChart.resize(); |
|
|
|
window.onresize = myChart.resize; |
|
|
|
}); |
|
|
|
}, |
|
|
|
// 体系 |
|
|
|
handleSystem() { |
|
|
|
systemEcharts.series[0].data = this.systemValue?.map((item) => { |
|
|
|
return item.value; |
|
|
|
}); |
|
|
|
systemEcharts.xAxis.data = this.systemValue?.map((item) => { |
|
|
|
return item.name; |
|
|
|
}); |
|
|
|
this.$nextTick(() => { |
|
|
|
var myChart = echarts.init(document.getElementById("system"), null, { |
|
|
|
height: 300, |
|
|
|
}); |
|
|
|
myChart.setOption(systemEcharts, true); |
|
|
|
myChart.resize(); |
|
|
|
window.onresize = myChart.resize; |
|
|
|
}); |
|
|
|
}, |
|
|
|
// 体质 |
|
|
|
handlePhysique() { |
|
|
|
physiqueEcharts.series[0].data = this.physiqueValue?.map((item) => { |
|
|
|
return item.value; |
|
|
|
}); |
|
|
|
physiqueEcharts.xAxis.data = this.physiqueValue?.map((item) => { |
|
|
|
return item.name; |
|
|
|
}); |
|
|
|
this.$nextTick(() => { |
|
|
|
var myChart = echarts.init(document.getElementById("physique"), null, { |
|
|
|
height: 300, |
|
|
|
}); |
|
|
|
myChart.setOption(physiqueEcharts, true); |
|
|
|
myChart.resize(); |
|
|
|
window.onresize = myChart.resize; |
|
|
|
}); |
|
|
|
}, |
|
|
|
// 体态评估 |
|
|
|
handlePosture() { |
|
|
|
postureEcharts.series[0].data = this.postureValue; |
|
|
|
this.$nextTick(() => { |
|
|
|
var myChart = echarts.init(document.getElementById("posture"), null, { |
|
|
|
height: 300, |
|
|
|
}); |
|
|
|
myChart.setOption(postureEcharts, true); |
|
|
|
myChart.resize(); |
|
|
|
window.onresize = myChart.resize; |
|
|
|
}); |
|
|
|
}, |
|
|
|
// 数据处理 查询类型判断参数 |
|
|
|
initial(_data, _type) { |
|
|
|
_data[0] = this.$moment(_data[0]).format("YYYY-MM-DD"); |
|
|
|
_data[1] = this.$moment(_data[1]).format("YYYY-MM-DD"); |
|
|
|
this.queryParams.param = { |
|
|
|
startTime: _data[0] + " " + "00:00:00", |
|
|
|
endTime: _data[1] + " " + "23:59:59", |
|
|
|
}; |
|
|
|
}, |
|
|
|
// 失眠评估 |
|
|
|
handleAgrypnia() { |
|
|
|
agrypniaEcharts.series[0].data = this.agrypniaValue; |
|
|
|
this.$nextTick(() => { |
|
|
|
var myChart = echarts.init(document.getElementById("agrypnia"), null, { |
|
|
|
height: 300, |
|
|
|
}); |
|
|
|
myChart.setOption(agrypniaEcharts, true); |
|
|
|
myChart.resize(); |
|
|
|
window.onresize = myChart.resize; |
|
|
|
}); |
|
|
|
}, |
|
|
|
// 焦虑评估 |
|
|
|
handleAnxiety() { |
|
|
|
anxietyEcharts.series[0].data = this.anxietyValue; |
|
|
|
this.$nextTick(() => { |
|
|
|
var myChart = echarts.init(document.getElementById("anxiety"), null, { |
|
|
|
height: 300, |
|
|
|
}); |
|
|
|
myChart.setOption(anxietyEcharts, true); |
|
|
|
myChart.resize(); |
|
|
|
window.onresize = myChart.resize; |
|
|
|
}); |
|
|
|
}, |
|
|
|
// 重新渲染图标 |
|
|
|
getRenew() { |
|
|
|
this.handleDiagnose(); |
|
|
|
this.handleSystem(); |
|
|
|
this.handlePhysique(); |
|
|
|
this.handlePosture(); |
|
|
|
this.handleAgrypnia(); |
|
|
|
this.handleAnxiety(); |
|
|
|
}, |
|
|
|
}, |
|
|
|
}; |
|
|
|
</script> |
|
|
|
<style scoped src="@/assets/styles/common.css"></style> |
|
|
|
<style scoped> |
|
|
|
>>>.el-card__body { |
|
|
|
padding: 10px 0 !important; |
|
|
|
} |
|
|
|
>>> .el-card__body { |
|
|
|
padding: 10px 0 !important; |
|
|
|
} |
|
|
|
|
|
|
|
.dis { |
|
|
|
display: flex; |
|
|
|
} |
|
|
|
.dis { |
|
|
|
display: flex; |
|
|
|
} |
|
|
|
|
|
|
|
.header-title { |
|
|
|
font-size: 18px; |
|
|
|
} |
|
|
|
.header-title { |
|
|
|
font-size: 18px; |
|
|
|
} |
|
|
|
|
|
|
|
.title-box { |
|
|
|
padding: 10px 20px; |
|
|
|
border-bottom: 1px solid #dfe6ec; |
|
|
|
} |
|
|
|
.title-box { |
|
|
|
padding: 10px 20px; |
|
|
|
border-bottom: 1px solid #dfe6ec; |
|
|
|
} |
|
|
|
|
|
|
|
.dian-box { |
|
|
|
align-items: center; |
|
|
|
} |
|
|
|
.dian-box { |
|
|
|
align-items: center; |
|
|
|
} |
|
|
|
|
|
|
|
.dian { |
|
|
|
display: inline-block; |
|
|
|
width: 16px; |
|
|
|
height: 16px; |
|
|
|
border-radius: 50%; |
|
|
|
margin: 0 10px; |
|
|
|
} |
|
|
|
.dian { |
|
|
|
display: inline-block; |
|
|
|
width: 16px; |
|
|
|
height: 16px; |
|
|
|
border-radius: 50%; |
|
|
|
margin: 0 10px; |
|
|
|
} |
|
|
|
|
|
|
|
.title-box { |
|
|
|
justify-content: space-between; |
|
|
|
} |
|
|
|
.title-box { |
|
|
|
justify-content: space-between; |
|
|
|
} |
|
|
|
|
|
|
|
.>>>.el-radio--small.is-bordered { |
|
|
|
margin-right: 20px !important; |
|
|
|
margin-left: 0 !important; |
|
|
|
} |
|
|
|
. >>> .el-radio--small.is-bordered { |
|
|
|
margin-right: 20px !important; |
|
|
|
margin-left: 0 !important; |
|
|
|
} |
|
|
|
|
|
|
|
>>>.el-radio__input { |
|
|
|
display: none; |
|
|
|
} |
|
|
|
>>> .el-radio__input { |
|
|
|
display: none; |
|
|
|
} |
|
|
|
|
|
|
|
>>>.el-radio__label { |
|
|
|
padding-left: 5px; |
|
|
|
} |
|
|
|
>>> .el-radio__label { |
|
|
|
padding-left: 5px; |
|
|
|
} |
|
|
|
|
|
|
|
.app-container { |
|
|
|
padding: 0; |
|
|
|
display: flex; |
|
|
|
justify-content: space-between; |
|
|
|
} |
|
|
|
.app-container { |
|
|
|
padding: 0; |
|
|
|
display: flex; |
|
|
|
justify-content: space-between; |
|
|
|
} |
|
|
|
|
|
|
|
.title { |
|
|
|
display: flex; |
|
|
|
align-items: center; |
|
|
|
font-size: 20px; |
|
|
|
font-weight: 600; |
|
|
|
} |
|
|
|
.title { |
|
|
|
display: flex; |
|
|
|
align-items: center; |
|
|
|
font-size: 20px; |
|
|
|
font-weight: 600; |
|
|
|
} |
|
|
|
|
|
|
|
.title-bor { |
|
|
|
display: inline-block; |
|
|
|
height: 20px; |
|
|
|
width: 6px; |
|
|
|
background: #4f8bff; |
|
|
|
margin-right: 10px; |
|
|
|
border-radius: 8px; |
|
|
|
} |
|
|
|
</style> |
|
|
|
.title-bor { |
|
|
|
display: inline-block; |
|
|
|
height: 20px; |
|
|
|
width: 6px; |
|
|
|
background: #4f8bff; |
|
|
|
margin-right: 10px; |
|
|
|
border-radius: 8px; |
|
|
|
} |
|
|
|
</style> |
|
|
|
|
1747191978@qq.com
4 months ago