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. 703
      acupuncture-前台/src/views/indexCom/JM.vue
  2. 64
      acupuncture-前台/src/views/indexCom/index.js

703
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, loading: false,
diagnoseValue: null, // 病种 diagnoseValue: null, // 病种
systemValue: null, // 体系 systemValue: null, // 体系
physiqueValue: null, // 体质 physiqueValue: null, // 体质
postureValue:null, // 体态 postureValue: null, // 体态
agrypniaValue: null, // 失眠
// 体系中文
systemObj: { // 体系中文
"yxfpz": "隐形肥胖型", //隐形肥胖型 systemObj: {
"zfgdx": "脂肪过多型", //脂肪过多型 yxfpz: "隐形肥胖型", //隐形肥胖型
"fpx": "肥胖型", //肥胖型 zfgdx: "脂肪过多型", //脂肪过多型
"jrbzx": "肌肉不足型", //肌肉不足型 fpx: "肥胖型", //肥胖型
"jkjcx": "健康匀称型", //健康匀称型 jrbzx: "肌肉不足型", //肌肉不足型
"czjrx": "超重肌肉型", //超重肌肉型 jkjcx: "健康匀称型", //健康匀称型
"xsx": "消瘦型", //消瘦型 czjrx: "超重肌肉型", //超重肌肉型
"dzfx": "低脂肪型", //低脂肪型 xsx: "消瘦型", //消瘦型
"ydyx": "运动员型", //运动员型 dzfx: "低脂肪型", //低脂肪型
}, ydyx: "运动员型", //运动员型
// 体质 },
physiqueObj: { // 体质
"phz": "平和质", //平和质 physiqueObj: {
"qxz": "气虚质", //气虚质 phz: "平和质", //平和质
"yangxz": "阳虚质", //阳虚质 qxz: "气虚质", //气虚质
"yinxz": "阴虚质", //阴虚质 yangxz: "阳虚质", //阳虚质
"tsz": "痰湿质", //痰湿质 yinxz: "阴虚质", //阴虚质
"srz": "湿热质", //湿热质 tsz: "痰湿质", //痰湿质
"xyz": "血瘀质", //血瘀质 srz: "湿热质", //湿热质
"qyz": "气郁质", //气郁质 xyz: "血瘀质", //血瘀质
"tlz": "特禀质", //特禀质 qyz: "气郁质", //气郁质
}, tlz: "特禀质", //特禀质
}; },
}, };
created() { },
// this.Linepatient(); created() {
this.getData(); // this.Linepatient();
}, this.getData();
methods: { },
statistics(_data, _type) { methods: {
this.initial(_data, _type); // 处理数据 statistics(_data, _type) {
this.loading = true; this.initial(_data, _type); // 处理数据
this.getData(); // 获取数据 this.loading = true;
}, this.getData(); // 获取数据
//患者信息 },
async getData() { //患者信息
try { async getData() {
await zlInfo(this.queryParams).then((res) => { try {
const { await zlInfo(this.queryParams).then((res) => {
jlfb, const { jlfb, smfb, sort, ttfb, txfb, zytz } = res.data;
smfb, // 病种（主要诊断）
sort, this.diagnoseValue = sort.sort((a, b) => a.total - b.total);
ttfb, this.handleDiagnose();
txfb, // 体系
zytz this.systemValue = [];
} = res.data delete txfb.total;
// 病种（主要诊断） for (let key in txfb) {
this.diagnoseValue = sort.sort((a, b) => a.total - b.total) let data = {
this.handleDiagnose() name: this.systemObj[key],
// 体系 value: txfb[key],
this.systemValue = [] };
delete txfb.total this.systemValue.push(data);
for (let key in txfb) { }
let data = { this.handleSystem();
name: this.systemObj[key], // 体质
value: txfb[key] this.physiqueValue = [];
} delete zytz.total;
this.systemValue.push(data) for (let key in zytz) {
} let data = {
this.handleSystem() name: this.physiqueObj[key],
// 体质 value: zytz[key],
this.physiqueValue = [] };
delete zytz.total this.physiqueValue.push(data);
for (let key in zytz) { }
let data = { this.handlePhysique();
name: this.physiqueObj[key], // 体态
value: zytz[key], this.postureValue = [
} {
this.physiqueValue.push(data) value: ttfb.score1,
} name: "1分",
this.handlePhysique() },
// 体态 {
this.postureValue = [{ value: ttfb.score2,
value: ttfb.score1, name: "2分",
name: "1分" },
},{ {
value: ttfb.score2, value: ttfb.score3,
name: "2分" name: "3分",
},{ },
value: ttfb.score3, {
name: "3分" value: ttfb.score4,
},{ name: "4分",
value: ttfb.score4, },
name: "4分" {
},{ value: ttfb.score5,
value: ttfb.score5, name: "5分",
name: "5分" },
}] ];
this.handlePosture() this.handlePosture();
}); // 失眠评估（PHQ-9）
this.loading = false; this.agrypniaValue = [];
} catch (e) {} for (let key in smfb) {
}, this.agrypniaValue.push(smfb[key]);
// 病种（主要诊断） }
handleDiagnose() { this.handleAgrypnia();
diagnoseEcharts.series[0].data = this.diagnoseValue?.map((item) => { });
return item.total; this.loading = false;
}); } catch (e) {}
diagnoseEcharts.yAxis.data = this.diagnoseValue?.map((item) => { },
return item.type; // 病种（主要诊断）
}); handleDiagnose() {
this.$nextTick(() => { diagnoseEcharts.series[0].data = this.diagnoseValue?.map((item) => {
var myChart = echarts.init(document.getElementById("diagnose"), null, { return item.total;
height: 300, });
}); diagnoseEcharts.yAxis.data = this.diagnoseValue?.map((item) => {
myChart.setOption(diagnoseEcharts, true); return item.type;
myChart.resize(); });
window.onresize = myChart.resize; this.$nextTick(() => {
}); var myChart = echarts.init(document.getElementById("diagnose"), null, {
}, height: 300,
// 体系 });
handleSystem() { myChart.setOption(diagnoseEcharts, true);
systemEcharts.series[0].data = this.systemValue?.map((item) => { myChart.resize();
return item.value; window.onresize = myChart.resize;
}); });
systemEcharts.xAxis.data = this.systemValue?.map((item) => { },
return item.name; // 体系
}); handleSystem() {
this.$nextTick(() => { systemEcharts.series[0].data = this.systemValue?.map((item) => {
var myChart = echarts.init(document.getElementById("system"), null, { return item.value;
height: 300, });
}); systemEcharts.xAxis.data = this.systemValue?.map((item) => {
myChart.setOption(systemEcharts, true); return item.name;
myChart.resize(); });
window.onresize = myChart.resize; this.$nextTick(() => {
}); var myChart = echarts.init(document.getElementById("system"), null, {
}, height: 300,
// 体质 });
handlePhysique() { myChart.setOption(systemEcharts, true);
physiqueEcharts.series[0].data = this.physiqueValue?.map((item) => { myChart.resize();
return item.value; window.onresize = myChart.resize;
}); });
physiqueEcharts.xAxis.data = this.physiqueValue?.map((item) => { },
return item.name; // 体质
}); handlePhysique() {
this.$nextTick(() => { physiqueEcharts.series[0].data = this.physiqueValue?.map((item) => {
var myChart = echarts.init(document.getElementById("physique"), null, { return item.value;
height: 300, });
}); physiqueEcharts.xAxis.data = this.physiqueValue?.map((item) => {
myChart.setOption(physiqueEcharts, true); return item.name;
myChart.resize(); });
window.onresize = myChart.resize; this.$nextTick(() => {
}); var myChart = echarts.init(document.getElementById("physique"), null, {
}, height: 300,
// 体态评估 });
handlePosture() { myChart.setOption(physiqueEcharts, true);
postureEcharts.series[0].data = this.postureValue myChart.resize();
this.$nextTick(() => { window.onresize = myChart.resize;
var myChart = echarts.init(document.getElementById("posture"), null, { });
height: 300, },
}); // 体态评估
myChart.setOption(postureEcharts, true); handlePosture() {
myChart.resize(); postureEcharts.series[0].data = this.postureValue;
window.onresize = myChart.resize; this.$nextTick(() => {
}); var myChart = echarts.init(document.getElementById("posture"), null, {
}, height: 300,
// 数据处理 查询类型判断参数 });
initial(_data, _type) { myChart.setOption(postureEcharts, true);
_data[0] = this.$moment(_data[0]).format("YYYY-MM-DD"); myChart.resize();
_data[1] = this.$moment(_data[1]).format("YYYY-MM-DD"); window.onresize = myChart.resize;
this.queryParams.param = { });
startTime: _data[0] + " " + "00:00:00", },
endTime: _data[1] + " " + "23:59:59", // 数据处理 查询类型判断参数
}; initial(_data, _type) {
}, _data[0] = this.$moment(_data[0]).format("YYYY-MM-DD");
// 重新渲染图标 _data[1] = this.$moment(_data[1]).format("YYYY-MM-DD");
getRenew() { this.queryParams.param = {
this.Linepatient(); startTime: _data[0] + " " + "00:00:00",
this.columnar(); 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