ccsens_zhengzhichuan
/
acupuncture
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

诊疗档案（失眠评估）

newMaster
liuzhipeng 4 months ago
parent
83039da15c
commit
967bf02348
2 changed files with 424 additions and 343 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 699
      acupuncture-前台/src/views/indexCom/JM.vue
  2. 64
      acupuncture-前台/src/views/indexCom/index.js

699
acupuncture-前台/src/views/indexCom/JM.vue
View File

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

64
acupuncture-前台/src/views/indexCom/index.js
View File

@ -445,6 +445,70 @@ export const postureEcharts = {
}, },
], ],
}; };
// 失眠
export const agrypniaEcharts = {
tooltip: {
trigger: "axis",
axisPointer: {
type: "cross",
label: {
backgroundColor: "#6a7985",
},
},
formatter: function (params) {
let res1 = params[0].name;
for (var i = 0, l = params.length; i < l; i++) {
res1 +=
"<br/>" +
`<span style="background:${params[i].color};width:12px;display:inline-block;height:12px;border-radius:50%;margin-right:5px;"></span>` +
params[i].seriesName +
" : " +
params[i].value +
"个";
}
return res1;
},
},
xAxis: {
type: "category",
data: ['0~4分', '5~9分', '10~14分','15~19分','20~27分'],
},
grid: {
top: "12%",
left: "5%",
right: "2%",
bottom: "0%",
containLabel: true,
},
yAxis: {
name: "数量( 个 )",
type: "value",
minInterval: 1,
splitLine: {
show: true,
lineStyle: {
type: "dashed",
},
},
},
series: [
{
name: "数量：",
data: [],
type: "bar",
barMaxWidth: 24, //柱图宽度
color: "#4f8bff",
itemStyle: {
normal: {
//这里设置柱形图圆角 [左上角，右上角，右下角，左下角]
barBorderRadius: [50, 50, 0, 0],
},
},
},
],
};
// 患者信息 - 数据分析 // 患者信息 - 数据分析
export const HZXXSJFX = { export const HZXXSJFX = {
tooltip: { tooltip: {

Write Preview
Loading…
Cancel
Save