下次图标插件

acupuncture-前台/package.json

@@ -40,7 +40,7 @@
     "axios": "0.28.1",
     "clipboard": "2.0.8",
     "core-js": "3.37.1",
-    "echarts": "5.4.0",
+    "echarts": "^5.4.0",
     "element-ui": "^2.15.14",
     "file-saver": "2.0.5",
     "fuse.js": "6.4.3",

acupuncture-前台/src/api/indexCom.js

@@ -0,0 +1,107 @@
+import request from "@/utils/request";
+
+// 患者统计 - 饼状
+export function queryPatient(data) {
+  return request({
+    url: "/qualityControl/home/queryPatient",
+    method: "post",
+    data: data,
+  });
+}
+// 患者统计 - 柱状图
+export function queryByDatePatient(data) {
+  return request({
+    url: "/qualityControl/home/queryByDatePatient",
+    method: "post",
+    data: data,
+  });
+}
+
+// 静脉溶栓率 - 统计
+export function queryJmrs(data) {
+  return request({
+    url: "/qualityControl/home/queryJmrs",
+    method: "post",
+    data: data,
+  });
+}
+// 静脉溶栓率 - 数据对比
+// 静脉溶栓率 - DNT
+export function queryDntResult(data) {
+  return request({
+    url: "/qualityControl/home/queryDntResult",
+    method: "post",
+    data: data,
+  });
+}
+// 静脉溶栓率 - Sich
+export function querySichResult(data) {
+  return request({
+    url: "/qualityControl/home/querySichResult",
+    method: "post",
+    data: data,
+  });
+}
+// 血管治疗 - DPT
+export function queryDptResult(data) {
+  return request({
+    url: "/qualityControl/home/queryDptResult",
+    method: "post",
+    data: data,
+  });
+}
+// 血管治疗 - Rpt
+export function queryRptResult(data) {
+  return request({
+    url: "/qualityControl/home/queryRptResult",
+    method: "post",
+    data: data,
+  });
+}
+// 血管治疗 - SJDB
+// export function selectXgzl(data) {
+//   return request({
+//     url: "/qualityControl/home/selectXgzl",
+//     method: "post",
+//     data: data,
+//   });
+// }
+export function dataComparison(data) {
+  return request({
+    url: "/qualityControl/home/selectXgzl",
+    method: "post",
+    data: data,
+  });
+}
+// 血管治疗统计
+export function queryXgzlLv(data) {
+  return request({
+    url: "/qualityControl/home/queryXgzlLv",
+    method: "post",
+    data: data,
+  });
+}
+// 大屏急救数量统计
+export function queryPatientList(data) {
+  return request({
+    url: "/qualityControl/home/queryPatientList",
+    method: "post",
+    data: data,
+  });
+}
+// 大屏急救时长分析
+export function queryFirstAidTime(data) {
+  return request({
+    url: "/qualityControl/home/queryFirstAidTime",
+    method: "post",
+    data: data,
+  });
+}
+// 大屏智慧平车面板数据
+export function queryData(data) {
+  return request({
+    url: "/qualityControl/home/queryData",
+    method: "post",
+    data: data,
+  });
+}

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

@@ -0,0 +1,296 @@
+<template>
+  <div class="app-container">
+    <!-- 静脉溶栓 数据对比 -->
+    <div class="dis" style="width: 100%">
+      <div style="flex: 1">
+        <el-card shadow="always">
+          <div class="dis title-box">
+            <span class="header-title">静脉溶栓率 </span>
+          </div>
+          <!-- 统计图 -->
+          <div style="height: 300px" v-loading="loading">
+            <div id="JMz" style="width: 100%"></div>
+          </div>
+        </el-card>
+      </div>
+      <div style="flex: 1; margin-left: 20px">
+        <el-card shadow="always">
+          <div class="dis title-box">
+            <span class="header-title">数据对比</span>
+            <div class="dis">
+              <div class="dian-box dis">
+                <span class="dian" style="background: #00d1a1"></span>
+                静脉溶栓人数
+              </div>
+              <div class="dian-box dis">
+                <span class="dian" style="background: #4f8bff"></span>
+                急救特征人数
+              </div>
+            </div>
+          </div>
+          <!-- 统计图 -->
+          <div style="height: 300px" v-loading="loading">
+            <div id="JMy" style="width: 100%"></div>
+          </div>
+        </el-card>
+      </div>
+    </div>
+    <!-- DNT分布  sICH发生率  -->
+    <div class="dis" style="width: 100%">
+      <div style="flex: 1">
+        <el-card shadow="always">
+          <div class="dis title-box">
+            <span class="header-title">DNT分布 </span>
+            <div class="dis">
+              <div class="dian-box dis">
+                <span class="dian" style="background: #ffcd6c"></span> ≤45 min
+              </div>
+              <div class="dian-box dis">
+                <span class="dian" style="background: #f97186"></span> ≤60 min
+              </div>
+              <div class="dian-box dis">
+                <span class="dian" style="background: #4f8bff"></span> >60 min
+              </div>
+            </div>
+          </div>
+          <!-- 统计图 -->
+          <div style="height: 300px" v-loading="loading">
+            <div id="DNT" style="width: 100%"></div>
+          </div>
+        </el-card>
+      </div>
+      <div style="flex: 1; margin-left: 20px">
+        <el-card shadow="always">
+          <div class="dis title-box">
+            <span class="header-title">sICH发生率</span>
+          </div>
+          <!-- 统计图 -->
+          <div style="height: 300px" v-loading="loading">
+            <div id="sICH" style="width: 100%"></div>
+          </div>
+        </el-card>
+      </div>
+    </div>
+  </div>
+</template>
+<script>
+import * as echarts from "echarts";
+require("echarts/theme/macarons"); // echarts theme
+import resize from "@/views/dashboard/mixins/resize";
+import { queryDntResult, querySichResult, queryJmrs } from "@/api/indexCom.js";
+import { JMRSL, JMSJDB, DNT, SICH } from "./index";
+export default {
+  name: "Post",
+  props: ["title"],
+  mixins: [resize],
+  data() {
+    return {
+      loading: false,
+      JMRSLvalue: null,
+      DNTvalue: null,
+      SICHvalue: null,
+      // 查询参数
+      queryParams: {
+        param: {
+          timeType: 4,
+          startTime: "",
+          endTime: "",
+        },
+      },
+    };
+  },
+  created() {
+    // this.getData();
+  },
+  methods: {
+    statistics(_data, _type) {
+      this.initial(_data, _type); // 处理数据
+      this.loading = true;
+      this.getData(); // 获取数据
+    },
+    // 查询
+    async getData() {
+      try {
+        //RSL 静脉溶栓率
+        await queryJmrs(this.queryParams).then((res) => {
+          this.JMRSLvalue = res.data;
+          console.log("this.JMRSLvalue: ", this.JMRSLvalue);
+          this.columnar();
+        });
+        //DNT
+        await queryDntResult(this.queryParams).then((res) => {
+          this.DNTvalue = res.data;
+          console.log("this.DNTvalue: ", this.DNTvalue);
+          this.lineDNT();
+        });
+        // //数据对比
+        await querySichResult(this.queryParams).then((res) => {
+          this.SICHvalue = res.data;
+          this.LineSICH();
+        });
+
+        this.LineJM();
+        this.columnar();
+        this.lineDNT();
+        this.LineSICH();
+        this.loading = false;
+      } catch (e) {}
+    },
+    // 静脉溶栓率` 数据对比
+    LineJM() {
+      JMSJDB.series[0].data = this.JMRSLvalue?.map((item) => {
+        return item.gailv;
+      });
+      JMSJDB.series[1].data = this.JMRSLvalue?.map((item) => {
+        return item.total;
+      });
+      JMSJDB.xAxis[0].data = this.JMRSLvalue?.map((item) => {
+        return item.date; //X轴
+      });
+      this.$nextTick(() => {
+        // 基于准备好的dom，初始化echarts实例
+        var myChart = echarts.init(document.getElementById("JMy"), null, {
+          height: 300,
+        });
+        myChart.setOption(JMSJDB, true);
+        myChart.resize();
+        window.onresize = myChart.resize;
+      });
+    },
+    // 静脉溶栓率
+    columnar() {
+      JMRSL.series[0].data = this.JMRSLvalue?.map((item) => {
+        return item.decimal;
+      });
+      JMRSL.xAxis.data = this.JMRSLvalue?.map((item) => {
+        return item.date;
+      });
+      JMRSL.series[0].data = this.JMRSLvalue?.map((item) => {
+        return item.decimal;
+      });
+      this.$nextTick(() => {
+        // 基于准备好的dom，初始化echarts实例
+        var myChart = echarts.init(document.getElementById("JMz"), null, {
+          height: 300,
+        });
+        myChart.setOption(JMRSL, true);
+        myChart.resize();
+        window.onresize = myChart.resize;
+      });
+    },
+    lineDNT() {
+      DNT.series[0].data = this.DNTvalue?.map((item) => {
+        return item.dy45; //≤45
+      });
+      DNT.series[1].data = this.DNTvalue?.map((item) => {
+        return item.dy60; //≤60
+      });
+      DNT.series[2].data = this.DNTvalue?.map((item) => {
+        return item.other; //>60
+      });
+      DNT.xAxis.data = this.DNTvalue?.map((item) => {
+        return item.date; //X轴
+      });
+      this.$nextTick(() => {
+        // 基于准备好的dom，初始化echarts实例
+        var myChart = echarts.init(document.getElementById("DNT"), null, {
+          height: 300,
+        });
+        myChart.setOption(DNT, true);
+        myChart.resize();
+        window.onresize = myChart.resize;
+      });
+    },
+    LineSICH() {
+      SICH.series[0].data = this.SICHvalue?.map((item) => {
+        return item.decimal; //≤45
+      });
+      SICH.xAxis[0].data = this.SICHvalue?.map((item) => {
+        return item.time; //X轴
+      });
+      this.$nextTick(() => {
+        // 基于准备好的dom，初始化echarts实例
+        var myChart = echarts.init(document.getElementById("sICH"), null, {
+          height: 300,
+        });
+        myChart.setOption(SICH, 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 = {
+        timeType: _type,
+        startTime: _data[0] + " " + "00:00:00",
+        endTime: _data[1] + " " + "23:59:59",
+      };
+    },
+    // 重新渲染图标
+    getRenew() {
+      this.LineJM();
+      this.columnar();
+      this.lineDNT();
+      this.LineSICH();
+    },
+  },
+};
+</script>
+<style scoped src="@/assets/styles/common.css"></style>
+<style scoped>
+>>> .el-card__body {
+  padding: 10px 0 !important;
+}
+.dis {
+  display: flex;
+}
+.header-title {
+  font-size: 18px;
+}
+.title-box {
+  padding: 10px 20px;
+  border-bottom: 1px solid #dfe6ec;
+}
+.dian-box {
+  align-items: center;
+}
+.dian {
+  display: inline-block;
+  width: 16px;
+  height: 16px;
+  border-radius: 50%;
+  margin: 0 10px;
+}
+.title-box {
+  justify-content: space-between;
+}
+. >>> .el-radio--small.is-bordered {
+  margin-right: 20px !important;
+  margin-left: 0 !important;
+}
+>>> .el-radio__input {
+  display: none;
+}
+>>> .el-radio__label {
+  padding-left: 5px;
+}
+.app-container {
+  padding: 0;
+}
+.title1 {
+  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>

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

@@ -0,0 +1,324 @@
+<template>
+  <div class="app-container">
+    <!-- 静脉溶栓 数据对比 -->
+    <div class="dis" style="width: 100%">
+      <div style="flex: 1">
+        <el-card shadow="always">
+          <div class="dis title-box">
+            <span class="header-title">血管内治疗率 </span>
+          </div>
+          <!-- 统计图 -->
+          <div style="height: 300px" v-loading="loading">
+            <div id="XGZL" style="width: 100%"></div>
+          </div>
+        </el-card>
+      </div>
+      <div style="flex: 1; margin-left: 20px">
+        <el-card shadow="always">
+          <div class="dis title-box">
+            <span class="header-title">数据对比</span>
+            <div class="dis">
+              <div class="dian-box dis">
+                <span class="dian" style="background: #00d1a1"></span>
+                桥接治疗人数
+              </div>
+              <div class="dian-box dis">
+                <span class="dian" style="background: #4f8bff"></span>
+                非桥接治疗人数
+              </div>
+            </div>
+          </div>
+          <!-- 统计图 -->
+          <div style="height: 300px" v-loading="loading">
+            <div id="SJDB" style="width: 100%"></div>
+          </div>
+        </el-card>
+      </div>
+    </div>
+    <!-- DNT分布  sICH发生率  -->
+    <div class="dis" style="width: 100%">
+      <div style="flex: 1">
+        <el-card shadow="always">
+          <div class="dis title-box">
+            <span class="header-title">DPT</span>
+            <div class="dis">
+              <div class="dian-box dis">
+                <span class="dian" style="background: #00d1a1"></span> ≤60 min
+              </div>
+              <div class="dian-box dis">
+                <span class="dian" style="background: #ffcd6c"></span> ≤90 min
+              </div>
+              <div class="dian-box dis">
+                <span class="dian" style="background: #a794fe"></span> >90 min
+              </div>
+            </div>
+          </div>
+          <!-- 统计图 -->
+          <div style="height: 300px" v-loading="loading">
+            <div id="DPT" style="width: 100%"></div>
+          </div>
+        </el-card>
+      </div>
+      <div style="flex: 1; margin-left: 20px">
+        <el-card shadow="always">
+          <div class="dis title-box">
+            <span class="header-title">PRT</span>
+            <div class="dis">
+              <div class="dian-box dis">
+                <span class="dian" style="background: #a794fe"></span> ≤60 min
+              </div>
+              <div class="dian-box dis">
+                <span class="dian" style="background: #4f8bff"></span> ≤90 min
+              </div>
+              <div class="dian-box dis">
+                <span class="dian" style="background: #ffcd6c"></span> >90 min
+              </div>
+            </div>
+          </div>
+          <!-- 统计图 -->
+          <div style="height: 300px" v-loading="loading">
+            <div id="RPT" style="width: 100%"></div>
+          </div>
+        </el-card>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import * as echarts from "echarts";
+require("echarts/theme/macarons"); // echarts theme
+import resize from "@/views/dashboard/mixins/resize";
+import {
+  queryDptResult,
+  queryRptResult,
+  dataComparison,
+  queryXgzlLv,
+} from "@/api/indexCom.js";
+import { XGZL, XGSJDB, DPT, RPT } from "./index";
+export default {
+  name: "Post",
+  props: ["title"],
+  mixins: [resize],
+  data() {
+    return {
+      loading: false,
+      DPTvalue: null,
+      RPTvalue: null,
+      SJDBvalue: null,
+      XGZLvalue: null,
+      queryParams: {
+        param: {
+          timeType: 4,
+          startTime: "",
+          endTime: "",
+        },
+      },
+    };
+  },
+  created() {
+    // this.getData();
+  },
+  methods: {
+    statistics(_data, _type) {
+      this.initial(_data, _type); // 处理数据
+      this.loading = true;
+      this.getData(); // 获取数据
+    },
+    // 查询
+    async getData() {
+      try {
+        // /DNT
+        await queryDptResult(this.queryParams).then((res) => {
+          this.DPTvalue = res.data;
+          console.log("this.DPTvalue: ", this.DPTvalue);
+          this.DPT();
+        });
+        //RPT
+        await queryRptResult(this.queryParams).then((res) => {
+          this.RPTvalue = res.data;
+          this.RPT();
+        });
+        // 数据对比
+        // await dataComparison(this.queryParams).then((res) => {
+        //   console.log("dataComparison: ", dataComparison);
+        //   this.SJDBvalue = res.date;
+        //   this.SJDB();
+        // });
+        await dataComparison(this.queryParams).then((res) => {
+          console.log("res1111: ", res);
+          this.SJDBvalue = res.data;
+          this.SJDB();
+        });
+        await queryXgzlLv(this.queryParams).then((res) => {
+          this.XGZLvalue = res.data;
+          this.XGZL();
+        });
+        this.loading = false;
+      } catch (e) {
+        console.log(e, "e");
+      }
+    },
+    // 数据对比
+    SJDB(_statData) {
+      XGSJDB.series[0].data = this.SJDBvalue?.map((item) => {
+        return item.qiaojie; //静脉溶栓人数
+      });
+      XGSJDB.series[1].data = this.SJDBvalue?.map((item) => {
+        return item.falseQiaojie; //静脉溶栓人数
+      });
+      XGSJDB.xAxis[0].data = this.SJDBvalue?.map((item) => {
+        return item.date; //X轴
+      });
+      this.$nextTick(() => {
+        // 基于准备好的dom，初始化echarts实例
+        var myChart = echarts.init(document.getElementById("SJDB"), null, {
+          height: 300,
+        });
+        myChart.setOption(XGSJDB, true);
+        myChart.resize();
+        window.onresize = myChart.resize;
+      });
+    },
+    // 血管治疗
+    XGZL() {
+      XGZL.series[0].data = this.XGZLvalue?.map((item) => {
+        return item.decimal; //静脉溶栓人数
+      });
+      XGZL.xAxis.data = this.XGZLvalue?.map((item) => {
+        return item.date; //X轴
+      });
+      this.$nextTick(() => {
+        // 基于准备好的dom，初始化echarts实例
+        var myChart = echarts.init(document.getElementById("XGZL"), null, {
+          height: 300,
+        });
+        myChart.setOption(XGZL, true);
+        myChart.resize();
+        window.onresize = myChart.resize;
+      });
+    },
+    // DPT
+    DPT() {
+      DPT.series[0].data = this.DPTvalue?.map((item) => {
+        return item.dy60; //<= 60
+      });
+      DPT.series[1].data = this.DPTvalue?.map((item) => {
+        return item.dy90; //<= 90
+      });
+      DPT.series[2].data = this.DPTvalue?.map((item) => {
+        return item.other; //<= 90
+      });
+      DPT.xAxis[0].data = this.DPTvalue?.map((item) => {
+        return item.date; //X轴
+      });
+      this.$nextTick(() => {
+        // 基于准备好的dom，初始化echarts实例
+        var myChart = echarts.init(document.getElementById("DPT"), null, {
+          height: 300,
+        });
+        myChart.setOption(DPT, true);
+        myChart.resize();
+        window.onresize = myChart.resize;
+      });
+    },
+    // RPT
+    RPT(_statData) {
+      RPT.series[0].data = this.RPTvalue?.map((item) => {
+        return item.dy60; //<= 60
+      });
+      RPT.series[1].data = this.RPTvalue?.map((item) => {
+        return item.dy90; //<= 90
+      });
+      RPT.series[2].data = this.RPTvalue?.map((item) => {
+        return item.other; //> 90
+      });
+      RPT.xAxis[0].data = this.RPTvalue?.map((item) => {
+        return item.date; //X轴
+      });
+      this.$nextTick(() => {
+        // 基于准备好的dom，初始化echarts实例
+        var myChart = echarts.init(document.getElementById("RPT"), null, {
+          height: 300,
+        });
+        myChart.setOption(RPT, 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 = {
+        timeType: _type,
+        startTime: _data[0] + " " + "00:00:00",
+        endTime: _data[1] + " " + "23:59:59",
+      };
+    },
+    // 重新渲染图标
+    getRenew() {
+      this.SJDB(); // 数据对比
+      this.XGZL(); // 血管治疗
+      this.DPT();
+      this.RPT();
+    },
+  },
+};
+</script>
+<style scoped src="@/assets/styles/common.css"></style>
+<style scoped>
+>>> .el-card__body {
+  padding: 10px 0 !important;
+}
+.dis {
+  display: flex;
+}
+.header-title {
+  font-size: 18px;
+}
+.title-box {
+  padding: 10px 20px;
+  border-bottom: 1px solid #dfe6ec;
+}
+.dian-box {
+  align-items: center;
+}
+.dian {
+  display: inline-block;
+  width: 16px;
+  height: 16px;
+  border-radius: 50%;
+  margin: 0 10px;
+}
+.title-box {
+  justify-content: space-between;
+}
+. >>> .el-radio--small.is-bordered {
+  margin-right: 20px !important;
+  margin-left: 0 !important;
+}
+>>> .el-radio__input {
+  display: none;
+}
+>>> .el-radio__label {
+  padding-left: 5px;
+}
+.app-container {
+  padding: 0;
+}
+.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>

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

@@ -0,0 +1,246 @@
+<template>
+  <div class="app-container">
+    <div class="dis" style="width: 100%">
+      <div style="flex: 1; margin-right: 20px; min-width: 600px">
+        <el-card shadow="always">
+          <div class="dis title-box">
+            <span class="header-title">病例统计</span>
+            <div class="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 class="dian-box dis">
+                <span class="dian" style="background: #00d1a1"></span>
+                未溶栓且未介入人数
+              </div>
+              <div class="dian-box dis">
+                <span class="dian" style="background: #a794fe"></span>
+                溶栓+介入人数
+              </div>
+            </div>
+          </div>
+          <!-- 统计图 -->
+          <div style="height: 300px" v-loading="loading">
+            <div id="patienty" style="width: 100%"></div>
+          </div>
+        </el-card>
+      </div>
+      <div style="flex: 2; min-width: 610px">
+        <el-card shadow="always">
+          <div class="dis title-box">
+            <span class="header-title">数据对比 </span>
+            <div class="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 class="dian-box dis">
+                <span class="dian" style="background: #00d1a1"></span>
+                未溶栓且未介入人数
+              </div>
+              <div class="dian-box dis">
+                <span class="dian" style="background: #a794fe"></span>
+                溶栓+介入人数
+              </div>
+            </div>
+          </div>
+          <!-- 统计图 -->
+          <div style="height: 300px" v-loading="loading">
+            <div id="patientz" style="width: 100%"></div>
+          </div>
+        </el-card>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import * as echarts from "echarts";
+require("echarts/theme/macarons"); // echarts theme
+import resize from "@/views/dashboard/mixins/resize";
+import { queryPatient, queryByDatePatient } from "@/api/indexCom.js";
+import { HZXX, HZXXSJFX } from "./index";
+export default {
+  name: "Post",
+  props: ["title"],
+  mixins: [resize],
+  data() {
+    return {
+      loading: false,
+      HZXXvalue: null,
+      SJDBvalue: null,
+      queryParams: {
+        param: {
+          timeType: 4,
+          startTime: "",
+          endTime: "",
+        },
+      },
+    };
+  },
+  created() {
+    // this.Linepatient()
+    // this.getData();
+  },
+  methods: {
+    statistics(_data, _type) {
+      this.initial(_data, _type); // 处理数据
+      this.loading = true;
+      this.getData(); // 获取数据
+    },
+    // 查询
+    async getData() {
+      try {
+        //患者信息
+        await queryPatient(this.queryParams).then((res) => {
+          this.HZXXvalue = res.data;
+          this.Linepatient();
+        });
+        //数据对比
+        await queryByDatePatient(this.queryParams).then((res) => {
+          this.SJDBvalue = res.data.list;
+          this.columnar();
+        });
+        this.loading = false;
+      } catch (e) {}
+    },
+
+    // 患者信息
+    Linepatient() {
+      HZXX.title.text = this.HZXXvalue?.total;
+      HZXX.series[0].data = [
+        { value: this.HZXXvalue?.onlyRs, name: "仅溶栓人数", roundCap: true },
+        {
+          value: this.HZXXvalue?.onlyXgzl,
+          name: "仅介入人数",
+          roundCap: true,
+        },
+        { value: this.HZXXvalue?.neither, name: "未溶栓且未介入人数" },
+        { value: this.HZXXvalue?.both, name: "溶栓+介入人数" },
+        // { value: 200, name: "仅溶栓人数", roundCap: true },
+        // { value: 150, name: "血管内治疗人数", roundCap: true },
+        // { value: 100, name: "未溶栓人数" },
+      ];
+      this.$nextTick(() => {
+        // 基于准备好的dom，初始化echarts实例
+        var myChart = echarts.init(document.getElementById("patienty"), null, {
+          height: 300,
+        });
+        myChart.setOption(HZXX, true);
+        myChart.resize();
+        window.onresize = myChart.resize;
+      });
+    },
+    // 患者信息 - 数据分析
+    columnar() {
+      HZXXSJFX.series[0].data = this.SJDBvalue?.map((item) => {
+        return item.onlyRs; //仅溶栓人数
+      });
+      HZXXSJFX.series[1].data = this.SJDBvalue?.map((item) => {
+        return item.onlyXgzl; //仅介入人数
+      });
+      HZXXSJFX.series[2].data = this.SJDBvalue?.map((item) => {
+        return item.neither; //未溶栓且未介入人数
+      });
+      HZXXSJFX.series[3].data = this.SJDBvalue?.map((item) => {
+        return item.both; //溶栓+介入人数
+      });
+      HZXXSJFX.xAxis.data = this.SJDBvalue?.map((item) => {
+        return item.date; //X轴
+      });
+      this.$nextTick(() => {
+        // 基于准备好的dom，初始化echarts实例
+        var myChart = echarts.init(document.getElementById("patientz"), null, {
+          height: 300,
+        });
+        myChart.setOption(HZXXSJFX, true);
+        myChart.resize();
+        window.onresize = myChart.resize;
+      });
+    },
+    // 数据处理 查询类型判断参数
+    initial(_data, _type) {
+      console.log("_data, _type: ", _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 = {
+        timeType: _type,
+        startTime: _data[0] + " " + "00:00:00",
+        endTime: _data[1] + " " + "23:59:59",
+      };
+    },
+    // 重新渲染图标
+    getRenew() {
+      this.Linepatient();
+      this.columnar();
+    },
+  },
+};
+</script>
+<style scoped src="@/assets/styles/common.css"></style>
+<style scoped>
+>>> .el-card__body {
+  padding: 10px 0 !important;
+}
+.dis {
+  display: flex;
+}
+.header-title {
+  font-size: 18px;
+}
+.title-box {
+  padding: 10px 20px;
+  border-bottom: 1px solid #dfe6ec;
+}
+.dian-box {
+  align-items: center;
+}
+.dian {
+  display: inline-block;
+  width: 16px;
+  height: 16px;
+  border-radius: 50%;
+  margin: 0 10px;
+}
+.title-box {
+  justify-content: space-between;
+}
+. >>> .el-radio--small.is-bordered {
+  margin-right: 20px !important;
+  margin-left: 0 !important;
+}
+>>> .el-radio__input {
+  display: none;
+}
+>>> .el-radio__label {
+  padding-left: 5px;
+}
+.app-container {
+  padding: 0;
+  display: flex;
+  justify-content: space-between;
+}
+.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>

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

@@ -0,0 +1,183 @@
+<template>
+  <div class="app-container">
+    <div class="title1">
+      <span class="title-bor"></span>
+      {{ title }}
+    </div>
+    <div>
+      <div>
+        <el-radio-group
+          v-model="radioValue"
+          size="small"
+          style="height: 36px"
+          @change="radioChange"
+        >
+          <el-radio label="0" border style="margin: 0 20px 0 0">周</el-radio>
+          <el-radio label="1" border style="margin: 0 20px 0 0">月</el-radio>
+          <el-radio label="2" border style="margin: 0 20px 0 0">季</el-radio>
+          <el-radio label="3" border style="margin: 0 20px 0 0">年</el-radio>
+          <!-- <el-radio label="4" border style="margin: 0 20px 0 0">周</el-radio>
+          <el-radio label="4" border style="margin: 0 20px 0 0">月</el-radio>
+          <el-radio label="1" border style="margin: 0 20px 0 0">季</el-radio>
+          <el-radio label="1" border style="margin: 0 20px 0 0">年</el-radio> -->
+        </el-radio-group>
+        <el-date-picker
+          v-model="pickerValue"
+          type="daterange"
+          align="right"
+          unlink-panels
+          range-separator="至"
+          start-placeholder="开始日期"
+          end-placeholder="结束日期"
+          value-format="yyyy-MM-dd"
+          @change="pickerChage"
+        >
+        </el-date-picker>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+// import { deviceType } from "./index.js";
+//  this.$store.commit('headerFun', data)
+export default {
+  name: "Post",
+  props: ["title", "type"],
+  data() {
+    return {
+      radioValue: "1",
+      radioTime: [],
+      pickerValue: null,
+      pickerOptions: {
+        shortcuts: [
+          {
+            text: "最近一周",
+            onClick(picker) {
+              const end = new Date();
+              const start = new Date();
+              start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
+              picker.$emit("pick", [start, end]);
+            },
+          },
+          {
+            text: "最近一个月",
+            onClick(picker) {
+              const end = new Date();
+              const start = new Date();
+              start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
+              picker.$emit("pick", [start, end]);
+            },
+          },
+          {
+            text: "最近三个月",
+            onClick(picker) {
+              const end = new Date();
+              const start = new Date();
+              start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
+              picker.$emit("pick", [start, end]);
+            },
+          },
+        ],
+      },
+    };
+  },
+  created() {
+    console.log(this.pickerValue, 222);
+  },
+  methods: {
+    radioChange() {
+      const start = new Date();
+      const end = new Date();
+      this.timeType = 4;
+      if (this.radioValue == 0) {
+        this.timeType = 4;
+        start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
+        this.radioTime = [start, end];
+      }
+      if (this.radioValue == 1) {
+        this.timeType = 4;
+        start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
+        this.radioTime = [start, end];
+      }
+      if (this.radioValue == 2) {
+        this.timeType = 1;
+        const now = new Date(); // 当前日期
+        const nowYear = now.getFullYear(); //当前年
+        const nowMonth = now.getMonth(); //当前月
+        const nowDay = now.getDate(); // 当前日
+        const nowDayOfWeek = now.getDay(); // 周几
+        const jd = Math.ceil((nowMonth + 1) / 3); // 当前季度
+        const startDate = new Date(nowYear, (jd - 1) * 3, 1);
+        const endDate = new Date(nowYear, jd * 3, 0);
+        this.radioTime = [startDate, endDate];
+      }
+      if (this.radioValue == 3) {
+        this.timeType = 1;
+        end.setTime(start.getTime());
+        start.setTime(start.getTime() - 3600 * 1000 * 24 * 365);
+        this.radioTime = [start, end];
+      }
+      this.$emit(
+        "radio-change",
+        this.pickerValue || this.radioTime,
+        this.type,
+        this.timeType
+      );
+    },
+    pickerChage() {
+      if (!this.pickerValue) {
+        this.radioChange();
+      }
+      console.log(this.pickerValue, 111);
+      this.radioTime = [];
+      this.timeType = 4;
+      if (this.radioValue == 0) {
+        this.timeType = 4;
+      }
+      if (this.radioValue == 1) {
+        this.timeType = 4;
+      }
+      if (this.radioValue == 2) {
+        this.timeType = 1;
+      }
+      if (this.radioValue == 3) {
+        this.timeType = 1;
+      }
+      this.$emit("picker-change", this.pickerValue, this.type, this.timeType);
+    },
+  },
+};
+</script>
+<style scoped src="@/assets/styles/common.css"></style>
+<style scoped>
+. >>> .el-radio--small.is-bordered {
+  margin-right: 20px !important;
+  margin-left: 0 !important;
+}
+>>> .el-radio__input {
+  display: none;
+}
+>>> .el-radio__label {
+  padding-left: 5px;
+}
+.app-container {
+  padding: 0;
+  display: flex;
+  justify-content: space-between;
+}
+.title1 {
+  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>

package-lock.json

@@ -0,0 +1,6 @@
+{
+  "name": "针灸",
+  "lockfileVersion": 2,
+  "requires": true,
+  "packages": {}
+}