患者统计（既往病种）

acupuncture-前台/src/views/indexCom/index.js

@@ -155,7 +155,69 @@ export const ageEcharts = {
     
   ],
 };
-
+// 病种分布
+export const diseaseEcharts = {
+  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: ["<40岁","41-50岁","51-60岁","61-70岁","71-80岁",">80岁",],
+  },
+  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 = {
   tooltip: {

acupuncture-前台/src/views/indexCom/patient.vue

@@ -56,19 +56,19 @@
 						<div class="dis title-box">
 							<span class="header-title">既往病种分布</span>
 							<div class="dis">
-								<div class="dian-box dis">
+								<!-- <div class="dian-box dis">
 									<div class="dian-box dis">
 										<span class="dian" style="background: #4f8bff"></span>
 										男
 									</div>
 									<span class="dian" style="background: #ffcd6c"></span>
 									女
-								</div>
+								</div> -->
 							</div>
 						</div>
 						<!-- 既往病种分布 -->
 						<div style="height: 300px" v-loading="loading">
-							<!-- <div id="gender" style="width: 100%"></div> -->
+							<div id="disease" style="width: 100%"></div>
 						</div>
 					</el-card>
 				</div>
@@ -89,7 +89,8 @@
 		HZXX,
 		HZXXSJFX,
 		gende,
-		ageEcharts
+		ageEcharts,
+		diseaseEcharts
 	} from "./index";
 	export default {
 		name: "Post",
@@ -101,12 +102,33 @@
 				HZXXvalue: null, // 患者总数统计值
 				gendeValue: null, // 性别统计值
 				ageValue: null, // 年龄统计值
+				diseaseValue: null, // 年龄统计值
 				queryParams: {
 					param: {
 						startTime: "",
 						endTime: "",
 					},
 				},
+				jwbzObj: {
+					"gxy": "高血压", //高血压
+					"nxgb": "脑血管病", //脑血管病
+					"exzl": "恶性肿瘤", //恶性肿瘤
+					"gxb": "冠心病", //冠心病
+					"jsjb": "精神疾病", //精神疾病
+					"whsezcky": "胃和十二指肠溃疡", //胃和十二指肠溃疡
+					"fpz": "肥胖症", //肥胖症
+					"gzssz": "骨质疏松症", //骨质疏松症
+					"ycxXtxjb": "遗传性、先天性疾病", //遗传性、先天性疾病
+					"tnb": "糖尿病", //糖尿病
+					"mxfxjb": "慢性肺系疾病", //慢性肺系疾病
+					"gzxz": "高脂血症", //高脂血症
+					"gzjb": "肝脏疾病", //肝脏疾病
+					"gmxjb": "过敏性疾病", //过敏性疾病
+					"gjy": "关节炎", //关节炎
+					"tf": "痛风", //痛风
+					"sySb": "肾炎、肾病", //肾炎、肾病
+					"other": "其他" //其他
+				}
 			};
 		},
 		created() {
@@ -143,10 +165,20 @@
 						this.ageValue = [ageValue.num1, ageValue.num2, ageValue.num2, ageValue.num4, ageValue
 							.num5, ageValue.num6
 						]
+						// 病种分布
+						let diseaseValue = res.data.jwbz
+						this.diseaseValue = []
+						for (let key in diseaseValue) {
+							let data = {
+								name: this.jwbzObj[key],
+								value: diseaseValue[key]
+							}
+							this.diseaseValue.push(data)
+						}
 						this.Linepatient(); // 患者总数
 						this.handleAge(); // 年龄
 						this.columnar(); //性别分析图
-						
+						this.handleDisease(); //病种分布
 					});
 					this.loading = false;
 				} catch (e) {}
@@ -177,12 +209,10 @@
 					window.onresize = myChart.resize;
 				});
 			},
+			// 年龄分布图
 			handleAge() {
-				console.log('ageEcharts',ageEcharts)
 				ageEcharts.series[0].data = this.ageValue
-				
 				this.$nextTick(() => {
-					// 基于准备好的dom，初始化echarts实例
 					var myChart = echarts.init(document.getElementById("age"), null, {
 						height: 300,
 					});
@@ -191,6 +221,23 @@
 					window.onresize = myChart.resize;
 				});
 			},
+			// 病种分布图
+			handleDisease() {
+				diseaseEcharts.series[0].data = this.diseaseValue?.map((item) => {
+					return item.value;
+				});
+				diseaseEcharts.xAxis.data = this.diseaseValue?.map((item) => {
+					return item.name;
+				});
+				this.$nextTick(() => {
+					var myChart = echarts.init(document.getElementById("disease"), null, {
+						height: 300,
+					});
+					myChart.setOption(diseaseEcharts, true);
+					myChart.resize();
+					window.onresize = myChart.resize;
+				});
+			},
 			// 数据处理 查询类型判断参数
 			initial(_data, _type) {
 				_data[0] = this.$moment(_data[0]).format("YYYY-MM-DD");