Merge branch '20230223_pc_vue_new_branch' of http://git.shengws.com/csx/Vue_New into 20230223_pc_vue_new_branch

src/api/qcd.js

@@ -108,3 +108,26 @@ export function GetPersonAdviceData(params) {
   })
 }
 
+
+export function GetQCStatistisData(params) {
+  return request({
+    url: '/api/qc/statistiscall/get',
+    method: 'get',
+    params: params
+  })
+}
+
+export function GetPersonQCStatistisData(params) {
+  return request({
+    url: '/api/qc/statistiscperson/get',
+    method: 'get',
+    params: params
+  })
+}
+
+
+
+
+
+
+

src/lang/zh.js

@@ -104,7 +104,7 @@ export default {
     deviceManage: '院感管理',
     modemanagement: '型号配置',
     dialysisMachineManage: '设备管理',
-    
+
     workforce: '患者排班',
     appointment: '排班管理',
     sign: '治疗签到',
@@ -298,6 +298,7 @@ export default {
     hospitalhistory: '住院历史',
     dialysis_index:'信息归档',
     objectRegistration:"医疗器械登记",
+    Dialysisanalysis: '专业质控'
   },
   navbar: {
     logOut: '退出登录',

src/router/index.js

@@ -8,7 +8,6 @@ import device from './modules/device'
 import dialysis from './modules/dialysis'
 import patient from './modules/patient'
 import qcd from './modules/qcd'
-// import Dialysisanalysis from './modules/Dialysisanalysis'//
 import role from './modules/role'
 import stock from './modules/stock'
 import weight_sign from './modules/weight_sign'
@@ -61,7 +60,11 @@ import bedManagement from './modules/bedManagement'
 import dictionaryManagement from './modules/dictionaryManagement'
 import templateManagement from './modules/templateManagement'
 import DepartManage from './modules/DepartManage'
-import basicConfig from './modules/basicConfig' 
+import basicConfig from './modules/basicConfig'
+import Dialysisanalysis from './modules/Dialysisanalysis'
+
+
+import basicConfig from './modules/basicConfig'
 import dialysisIndex from './modules/dialysisIndex'
 Vue.use(Router)
 
@@ -173,7 +176,7 @@ var _asy_router_map = [
 
   otherManagement,
   qcd,
- 
+
   device,
   org,
   data_upload,
@@ -204,6 +207,7 @@ var _asy_router_map = [
   integration,
   basicConfig,
   supply,
+  Dialysisanalysis,// 新菜单6.1
   // Dialysisanalysis,// 新菜单6.1
   dialysisIndex,
 ]

src/router/modules/Dialysisanalysis.js

@@ -3,11 +3,11 @@ import Layout from '@/views/layout/Layout'
 export default {
   path: '/Dialysisanalysis',
   component: Layout,
-  redirect: 'noredirect',
+  redirect: '/Dialysisanalysis/qualitycontrol/thyroidGland',
   name: 'Dialysisanalysis',
   alwaysShow: true,
   meta: {
-    title: '透析分析',
+    title: '专业质控',
     icon: 'statistics'
   },
   children: [
@@ -21,87 +21,148 @@ export default {
       }
     },
     {
-      path: '/Dialysisanalysis/hemoglobin',
+      path: '/Dialysisanalysis/qualitycontrol/hemoglobin',
       component: () => import('@/xt_pages/Dialysisanalysis/hemoglobin/index'),
-      name: 'index',
+      name: 'thyroidGland',
       meta: {
         title: '血红蛋白',
         noCache: true
       }
     },
     {
-      path: '/Dialysisanalysis/bloodPotassium',
+      path: '/Dialysisanalysis/qualitycontrol/bloodPotassium',
       component: () => import('@/xt_pages/Dialysisanalysis/bloodPotassium/index'),
-      name: 'index',
+      name: 'thyroidGland',
       meta: {
         title: '血钾',
         noCache: true
       }
     },
     {
-      path: '/Dialysisanalysis/albumin',
+      path: '/Dialysisanalysis/qualitycontrol/albumin',
       component: () => import('@/xt_pages/Dialysisanalysis/albumin/index'),
-      name: 'index',
+      name: 'thyroidGland',
       meta: {
         title: '白蛋白',
         noCache: true
       }
     },
     {
-      path: '/Dialysisanalysis/bloodPhosphorus',
+      path: '/Dialysisanalysis/qualitycontrol/bloodPhosphorus',
       component: () => import('@/xt_pages/Dialysisanalysis/bloodPhosphorus/index'),
-      name: 'index',
+      name: 'thyroidGland',
       meta: {
         title: '血磷',
         noCache: true
       }
-    },
-    {
-      path: '/Dialysisanalysis/calcium',
+    }, {
+      path: '/Dialysisanalysis/qualitycontrol/calcium',
       component: () => import('@/xt_pages/Dialysisanalysis/calcium/index'),
-      name: 'index',
+      name: 'thyroidGland',
       meta: {
         title: '钙',
         noCache: true
-      }
-    },
-    {
-      path: '/Dialysisanalysis/platelets',
+      }},{
+      path: '/Dialysisanalysis/qualitycontrol/platelets',
       component: () => import('@/xt_pages/Dialysisanalysis/platelets/index'),
-      name: 'index',
+      name: 'thyroidGland',
       meta: {
         title: '血小板',
         noCache: true
       }
-    },
-    {
-      path: '/Dialysisanalysis/otherIndicators',
-      component: () => import('@/xt_pages/Dialysisanalysis/otherIndicators/index'),
-      name: 'index',
-      meta: {
-        title: '其他指标',
-        noCache: true
-      }
-    },
-    {
-      path: '/Dialysisanalysis/nonnumerical',
-      component: () => import('@/xt_pages/Dialysisanalysis/nonnumerical'),
-      name: 'nonnumerical',
+    },{
+      path: '/Dialysisanalysis/qualitycontrol/print',
+      component: () => import('@/xt_pages/Dialysisanalysis/print/print'),
+      name: 'print',
+      hidden: true,
+      is_menu: false,
       meta: {
-        title: '非数值类的列表展示',
+        title: 'print',
         noCache: true
       }
-    },
-    {
-      path: '/Dialysisanalysis/dialysis_index',
-      component: () => import('@/xt_pages/Dialysisanalysis/dialysis_index'),
-      name: 'dialysis_index',
-      meta: {
-        title: '透析指标详情',
-        noCache: true
-      }
-    },
-   
-  
+    }
+    // {
+    //   path: '/Dialysisanalysis/hemoglobin',
+    //   component: () => import('@/xt_pages/Dialysisanalysis/hemoglobin/index'),
+    //   name: 'index',
+    //   meta: {
+    //     title: '血红蛋白',
+    //     noCache: true
+    //   }
+    // },
+    // {
+    //   path: '/Dialysisanalysis/bloodPotassium',
+    //   component: () => import('@/xt_pages/Dialysisanalysis/bloodPotassium/index'),
+    //   name: 'index',
+    //   meta: {
+    //     title: '血钾',
+    //     noCache: true
+    //   }
+    // },
+    // {
+    //   path: '/Dialysisanalysis/albumin',
+    //   component: () => import('@/xt_pages/Dialysisanalysis/albumin/index'),
+    //   name: 'index',
+    //   meta: {
+    //     title: '白蛋白',
+    //     noCache: true
+    //   }
+    // },
+    // {
+    //   path: '/Dialysisanalysis/bloodPhosphorus',
+    //   component: () => import('@/xt_pages/Dialysisanalysis/bloodPhosphorus/index'),
+    //   name: 'index',
+    //   meta: {
+    //     title: '血磷',
+    //     noCache: true
+    //   }
+    // },
+    // {
+    //   path: '/Dialysisanalysis/calcium',
+    //   component: () => import('@/xt_pages/Dialysisanalysis/calcium/index'),
+    //   name: 'index',
+    //   meta: {
+    //     title: '钙',
+    //     noCache: true
+    //   }
+    // },
+    // {
+    //   path: '/Dialysisanalysis/platelets',
+    //   component: () => import('@/xt_pages/Dialysisanalysis/platelets/index'),
+    //   name: 'index',
+    //   meta: {
+    //     title: '血小板',
+    //     noCache: true
+    //   }
+    // },
+    // {
+    //   path: '/Dialysisanalysis/otherIndicators',
+    //   component: () => import('@/xt_pages/Dialysisanalysis/otherIndicators/index'),
+    //   name: 'index',
+    //   meta: {
+    //     title: '其他指标',
+    //     noCache: true
+    //   }
+    // },
+    // {
+    //   path: '/Dialysisanalysis/nonnumerical',
+    //   component: () => import('@/xt_pages/Dialysisanalysis/nonnumerical'),
+    //   name: 'nonnumerical',
+    //   meta: {
+    //     title: '非数值类的列表展示',
+    //     noCache: true
+    //   }
+    // },
+    // {
+    //   path: '/Dialysisanalysis/dialysis_index',
+    //   component: () => import('@/xt_pages/Dialysisanalysis/dialysis_index'),
+    //   name: 'dialysis_index',
+    //   meta: {
+    //     title: '透析指标详情',
+    //     noCache: true
+    //   }
+    // },
+
+
   ]
 }

src/views/layout/components/Sidebar/index.vue

@@ -120,7 +120,7 @@ export default {
             this.$emit('func',a)
           }
         }else if(newVal == '透析管理'){
-          let nameArr = ['home','workforce', 'dialysisrecord', 'dialysis', 'medicalScheduling', 'signIndex', 'qcd', 'device', 'quality_control'];
+          let nameArr = ['home','workforce', 'dialysisrecord', 'dialysis', 'medicalScheduling', 'signIndex', 'qcd', 'device', 'quality_control','Dialysisanalysis'];
           // console.log('permission_routers',this.permission_routers)
           let routerArr = [];
           this.permission_routers.map(item => {

src/xt_pages/Dialysisanalysis/albumin/albuminall.vue

@@ -1,262 +1,369 @@
 <template>
-    <div>
-        <!-- <div class="content_top">
-            <div class="block">
-                <span>查询时间:</span>
-                <el-date-picker
-                v-model="time_month"
-                type="month"
-                placeholder="选择月">
-                </el-date-picker>
-            </div>
-            <div>
-                <el-date-picker
-                v-model="stat_time"
-                type="date"
-                placeholder="选择日期">
-                </el-date-picker>
-                <span>-</span>
-                <el-date-picker
-                v-model="end_time"
-                type="date"
-                placeholder="选择日期">
-                </el-date-picker>
-            </div>
-            <div style="width: 200px;">
-                <el-input v-model="input" placeholder="请输入内容"></el-input>
-            </div>
-            <el-button type="primary">查询</el-button>
-        </div> -->
-        
-        <el-row :gutter="20">
-        <el-col :span="5"> 
-          <div class="block">
-            <span>查询时间:</span>
-            <el-date-picker
-            v-model="time_month"
-            type="month"
-            placeholder="选择月">
-            </el-date-picker>
-          </div>
-        </el-col>
-        <el-col :span="8">
-          <div>
-            <el-date-picker
-            v-model="stat_time"
+  <div>
+    <el-row :gutter="25">
+      <el-col :span="5">
+        <div class="block">
+          <span>查询时间:</span>
+          <el-select size="small" v-model="time_type" placeholder="请选择"
+                     style="width:150px;margin-left:10px;" @change="changeItem">
+            <el-option
+              v-for="item,index in times"
+              :key="index"
+              :label="item.label"
+              :value="item.value">
+            </el-option>
+          </el-select>
+        </div>
+      </el-col>
+      <el-col :span="8">
+        <div>
+          <el-date-picker
+            style="width: 200px"
+
+            v-model="start_time"
+            format="yyyy-MM-dd"
+            value-format="yyyy-MM-dd"
             type="date"
+
             placeholder="选择日期">
-            </el-date-picker>
-            <span>-</span>
-            <el-date-picker
+          </el-date-picker>
+          <span>-</span>
+          <el-date-picker
+            style="width: 200px"
             v-model="end_time"
+            format="yyyy-MM-dd"
+            value-format="yyyy-MM-dd"
             type="date"
             placeholder="选择日期">
-            </el-date-picker>
-          </div>
-        </el-col>
-        <el-col :span="3">
-          <div style="width: 200px;">
-            <el-input v-model="input" placeholder="请输入内容"></el-input>
-          </div>
-        </el-col>
-        <el-col :span="2">
-            <el-button type="primary">查询</el-button>
-        </el-col>
-        </el-row>
-        
-        <div class="cell clearfix" style="margin: 20px; font-weight: bold;">
-          <p class="chartTitle">统计图</p>
+          </el-date-picker>
         </div>
-        <div class="echart" id="mychart" :style={width:width,height:height}></div>
-        <div style="width: 80%;margin: auto;">
-            <el-table
-            :data="tableData"
-            :show-summary = true
-            border
-            style="width: 100%;">
-                <el-table-column
-                    prop="date"
-                    align="center"
-                    label="白蛋白"
-                    >
-                </el-table-column>
-                <el-table-column
-                    prop="name"
-                    
-                    label="人数"
-                    >
-                </el-table-column>
-                <el-table-column
-                    prop="address"
-                    align="center"
-                    label="操作">
-                    <template slot-scope="scope">
-                        <el-button @click="handleClick(scope.row)" style="font-size:16px;"
-                                type="text" >查看详情
-                        </el-button>
-                    </template>
-                </el-table-column>
-            </el-table>
+      </el-col>
+      <el-col :span="5">
+        <div >
+          <el-input disabled v-model="input" placeholder="请输入内容"></el-input>
         </div>
+      </el-col>
+      <el-col :span="3">
+        <el-button type="primary" @click="getData()">查询</el-button>
+      </el-col>
+    </el-row>
+    <div class="cell clearfix" style="margin: 20px; font-weight: bold;">
+      <p class="chartTitle">统计图</p>
+    </div>
+    <div class="echart" id="mychart" :style={width:width,height:height}></div>
+    <div style="width: 80%;margin: auto;">
+      <el-table
+        :data="tableData"
+        border
+        style="width: 100%;">
+        <el-table-column
+          prop="name"
+          align="center"
+          label="白蛋白"
+        >
+        </el-table-column>
+        <el-table-column
+          prop="count"
+          label="人数"
+        >
+        </el-table-column>
+<!--        <el-table-column-->
+<!--          prop="address"-->
+<!--          align="center"-->
+<!--          label="操作">-->
+<!--          <template slot-scope="scope">-->
+<!--            <el-button @click="handleClick(scope.row)" style="font-size:16px;"-->
+<!--                       type="text">查看详情-->
+<!--            </el-button>-->
+<!--          </template>-->
+<!--        </el-table-column>-->
+      </el-table>
     </div>
+  </div>
 </template>
 <script>
-import * as echarts from "echarts";
-export default{
-    props: {
-   
+import * as echarts from 'echarts'
+import { GetQCStatistisData } from '../../../api/qcd'
+
+const moment = require('moment')
+
+export default {
+  props: {
+
     width: {
       type: String,
-      default: "100%"
+      default: '100%'
     },
     height: {
       type: String,
-      default: "400px"
-    },
-    
+      default: '400px'
+    }
+
   },
-    data() {
-        return {
-            time_month:'',
-            stat_time:'',
-            end_time:'',
-            input:'',
-            myChart: {},
-            pieData : [
-            {
-          value: 463,
-          name: "不达标值患者"
-        },
-        {
-          value: 395,
-          name: "未检查患者"
-        },
-        {
-          value: 157,
-          name: "达标值患者"
-        },
-        // {
-        //   value: 149,
-        //   name: "广东"
-        // },
-        // {
-        //   value: 147,
-        //   name: "湖南"
-        // }
-            
-            ],
-            pieName: [],
-            // myChartStyle:{float: "right", width: "100%", height: "400px"},
-            tableData:[],
-        }
-    },
-    mounted() {
-    this.initDate(); //数据初始化
-    this.initEcharts();
+  data() {
+    return {
+      time_type: 1,
+      times: [
+        { value: 1, label: '本月' },
+        { value: 2, label: '上月' },
+        { value: 3, label: '今年' },
+        { value: 4, label: '上一年' },
+        { value: 5, label: '第一季度' },
+        { value: 6, label: '第二季度' },
+        { value: 7, label: '第三季度' },
+        { value: 8, label: '第四季度' },
+        { value: 9, label: '自定义' }
+
+      ],
+      time_month: '',
+      start_time: new Date(new Date().getFullYear(), new Date().getMonth(), 1).toLocaleDateString('en-CA'),
+      end_time: new Date(new Date().getFullYear(), new Date().getMonth() + 1, 0).toLocaleDateString('en-CA'),
+      input: '',
+      myChart: {},
+      pieData: [],
+      pieName: [],
+      // myChartStyle:{float: "right", width: "100%", height: "400px"},
+      tableData: [],
+      reference:{},
+    }
+  },
+  mounted() {
+    this.getData()
   },
   methods: {
-    initDate() {
-      for (let i = 0; i < this.pieData.length; i++) {
-        this.pieName[i] = this.pieData[i].name;
+    getData() {
+      if(this.start_time.length == 0){
+        this.$message.error("请选择开始时间")
       }
-    },
-    initEcharts() {
-      // 饼图
-      const option = {
-        legend: {
-          // 图例
-          data: this.pieName,
-          left: "10%",
-          top: "30%",
-          orient: "vertical"
-        },
-        color:['#ff7f9f','#fff67f','#1e5feb'],
-        title: {
-          // 设置饼图标题，位置设为顶部居中
-        //   text: "国内院士前五省份图示",
-          top: "0%",
-          left: "center"
-        },
-        series: [
-          {
-            type: "pie",
-            label: {
-              normal : {
-                formatter: '{b}:{c}: ({d}%)',
-                textStyle : {
-                    fontWeight : 'normal',
-                    fontSize : 15,
-                    color : "black"
-                }
-              }
-              // b代表名称，c代表对应值，d代表百分比"{b} : {d}% ({c})" 
+      if(this.end_time.length == 0){
+        this.$message.error("请选择结束时间")
+      }
+      let params = {
+        start_date: this.start_time,
+        end_date: this.end_time,
+        project_id: 2,
+        item_id: 35
+      }
+      this.pieData = []
+      this.tableData = []
+      console.log("~~~~~~~~~~")
+      GetQCStatistisData(params).then(response => {
+        if (response.data.state == 1) {
+          this.reference =  response.data.data.reference
+
+          this.input = response.data.data.reference.range_min + "<=" + response.data.data.reference.item_name + "<=" + response.data.data.reference.range_max
+          let objone = {
+            value:  response.data.data.unusual_total / response.data.data.patient_count,
+            name: '不达标值患者',
+            count:response.data.data.unusual_total,
+          }
+          this.pieData.push(objone)
+          this.tableData.push(objone)
+
+          let objtwo = {
+            value:   response.data.data.normal_total / response.data.data.patient_count,
+            name: '达标值患者',
+            count:response.data.data.normal_total,
+
+          }
+          this.pieData.push(objtwo)
+          this.tableData.push(objtwo)
+
+          let objthree = {
+            value: response.data.data.patient_count / response.data.data.no_check_total,
+            name: '未检查患者',
+            count:response.data.data.no_check_total,
+
+          }
+          this.pieData.push(objthree)
+          this.tableData.push(objthree)
+
+          let objfour = {
+            value: response.data.data.patient_count,
+            name: '合计',
+            count:response.data.data.patient_count,
+          }
+          this.tableData.push(objfour)
+          for (let i = 0; i < this.pieData.length; i++) {
+            this.pieName[i] = this.pieData[i].name
+          }
+          this.myChart = echarts.init(document.getElementById('mychart'))
+          window.addEventListener('resize', () => {
+            this.myChart.resize()
+          })
+          const option = {
+            legend: {
+              // 图例
+              data: this.pieName,
+              left: '10%',
+              top: '30%',
+              orient: 'vertical'
+            },
+            color: ['#ff7f9f', '#fff67f', '#1e5feb'],
+            title: {
+              // 设置饼图标题，位置设为顶部居中
+              //   text: "国内院士前五省份图示",
+              top: '0%',
+              left: 'center'
             },
-            radius: "65%", //饼图半径
-            data: this.pieData,
-            itemStyle : {
-              emphasis: {
-                  shadowBlur: 10,
-                  shadowOffsetX: 0,
-                  shadowColor: 'rgba(0, 0, 0, 0.5)'
+            series: [
+              {
+                type: 'pie',
+                label: {
+                  show: true,
+                  formatter: '{b} : {d}% ({c})'
+                  // b代表名称，c代表对应值，d代表百分比"{b} : {d}% ({c})"
+                },
+                radius: '65%', //饼图半径
+                data: this.pieData
               }
-            }
+            ]
           }
-        ]
-      };
-    //   console.log(this.seriesData);
-      const optionFree = {
-        series: [
-          {
-            data: this.seriesData,
-            type: "line",
-            smooth: true
+          //   console.log(this.seriesData);
+          const optionFree = {
+            series: [
+              {
+                data: this.seriesData,
+                type: 'line',
+                smooth: true
+              }
+            ]
           }
-        ]
-      };
-      this.myChart = echarts.init(document.getElementById("mychart"));
-      this.myChart.setOption(option);
-      //随着屏幕大小调节图表
-      window.addEventListener("resize", () => {
-        this.myChart.resize();
-      });
+          this.myChart = echarts.init(document.getElementById('mychart'))
+          this.myChart.setOption(option)
+        } else {
+          this.$message.error(response.data.msg)
+        }
+      })
+
+    },
+    changeItem(val) {
+      const currentDate = new Date()
+      switch (val) {
+        case 1:
+
+          const startOfMonth = new Date(currentDate.getFullYear(), currentDate.getMonth(), 1).toLocaleDateString('en-CA')
+          const endOfMonth = new Date(currentDate.getFullYear(), currentDate.getMonth() + 1, 0).toLocaleDateString('en-CA')
+
+          this.start_time = startOfMonth
+          this.end_time = endOfMonth
+          this.getData()
+
+          break
+        case 2:
+          // 上月的起始日期和结束日期
+          const startOfLastMonth = new Date(currentDate.getFullYear(), currentDate.getMonth() - 1, 1).toLocaleDateString('en-CA')
+          const endOfLastMonth = new Date(currentDate.getFullYear(), currentDate.getMonth(), 0).toLocaleDateString('en-CA')
+
+          this.start_time = startOfLastMonth
+          this.end_time = endOfLastMonth
+          this.getData()
+
+          break
+        case 3:
+          // 今年的起始日期和结束日期
+          const startOfYear = new Date(currentDate.getFullYear(), 0, 1).toLocaleDateString('en-CA')
+          const endOfYear = new Date(currentDate.getFullYear(), 11, 31).toLocaleDateString('en-CA')
+
+          this.start_time = startOfYear
+          this.end_time = endOfYear
+          this.getData()
+
+          break
+        case 4:
+          // 上一年的起始日期和结束日期
+          const startOfLastYear = new Date(currentDate.getFullYear() - 1, 0, 1).toLocaleDateString('en-CA')
+          const endOfLastYear = new Date(currentDate.getFullYear() - 1, 11, 31).toLocaleDateString('en-CA')
+
+          this.start_time = startOfLastYear
+          this.end_time = endOfLastYear
+          this.getData()
+
+          break
+        case 5:
+          // 第一季度的起始日期和结束日期
+          const startOfFirstQuarter = new Date(currentDate.getFullYear(), 0, 1).toLocaleDateString('en-CA')
+          const endOfFirstQuarter = new Date(currentDate.getFullYear(), 2, 31).toLocaleDateString('en-CA')
+
+          this.start_time = startOfFirstQuarter
+          this.end_time = endOfFirstQuarter
+          this.getData()
+
+          break
+        case 6:
+          // 第二季度的起始日期和结束日期
+          const startOfSecondQuarter = new Date(currentDate.getFullYear(), 3, 1).toLocaleDateString('en-CA')
+          const endOfSecondQuarter = new Date(currentDate.getFullYear(), 5, 30).toLocaleDateString('en-CA')
+
+          this.start_time = startOfSecondQuarter
+          this.end_time = endOfSecondQuarter
+          this.getData()
+
+          break
+        case 7:
+          // 第三季度的起始日期和结束日期
+          const startOfThirdQuarter = new Date(currentDate.getFullYear(), 6, 1).toLocaleDateString('en-CA')
+          const endOfThirdQuarter = new Date(currentDate.getFullYear(), 8, 30).toLocaleDateString('en-CA')
+
+          this.start_time = startOfThirdQuarter
+          this.end_time = endOfThirdQuarter
+          this.getData()
+
+          break
+        case 8:
+          // 第四季度的起始日期和结束日期
+          const startOfFourthQuarter = new Date(currentDate.getFullYear(), 9, 1).toLocaleDateString('en-CA')
+          const endOfFourthQuarter = new Date(currentDate.getFullYear(), 11, 31).toLocaleDateString('en-CA')
+
+          this.start_time = startOfFourthQuarter
+          this.end_time = endOfFourthQuarter
+          this.getData()
+          break
+        case 9:
+          this.start_time = ''
+          this.end_time = ''
+          break
+      }
     },
+
+
     getSummaries(param) {
-        const { columns, data } = param;
-        const sums = [];
-        columns.forEach((column, index) => {
-          if (index === 0) {
-            sums[index] = '总价';
-            return;
-          }
-          const values = data.map(item => Number(item[column.property]));
-          if (!values.every(value => isNaN(value))) {
-            sums[index] = values.reduce((prev, curr) => {
-              const value = Number(curr);
-              if (!isNaN(value)) {
-                return prev + curr;
-              } else {
-                return prev;
-              }
-            }, 0);
-            sums[index] += ' 元';
-          } else {
-            sums[index] = 'N/A';
-          }
-        });
+      const { columns, data } = param
+      const sums = []
+      columns.forEach((column, index) => {
+        if (index === 0) {
+          sums[index] = '总价'
+          return
+        }
+        const values = data.map(item => Number(item[column.property]))
+        if (!values.every(value => isNaN(value))) {
+          sums[index] = values.reduce((prev, curr) => {
+            const value = Number(curr)
+            if (!isNaN(value)) {
+              return prev + curr
+            } else {
+              return prev
+            }
+          }, 0)
+          sums[index] += ' 元'
+        } else {
+          sums[index] = 'N/A'
+        }
+      })
 
-        return sums;
+      return sums
     },
-    handleClick(id){
-        console.log(id);
+    handleClick(id) {
+      console.log(id)
     }
   }
 
 }
 </script>
 <style lang="scss" scoped>
-.content_top{
-    display: flex;
-    justify-content: space-around;
-    color: #1e5feb;
+.content_top {
+  display: flex;
+  justify-content: space-around;
+  color: #1e5feb;
 }
-</style>
+</style>

src/xt_pages/Dialysisanalysis/albumin/albuminalone.vue

@@ -1,218 +1,646 @@
 <template>
-    <div>
-       <div class="content_top">
-            <el-autocomplete
-            class="inline-input"
-            v-model="inputValue"
-            :fetch-suggestions="querySearch"
-            :trigger-on-focus="false"
-            placeholder="请输入患者名字或透析号"
-            @select="handleSubmit"
-            ></el-autocomplete>
+  <div class="main-contain">
+    <div class="app-container">
+      <div class="page_process">
+        <new-nav activeName="process"></new-nav>
+        <div class="cell clearfix">
+          <el-form :inline="true">
+            <el-form-item label>
+              <el-autocomplete
+                class="checkSearch"
+                popper-class="my-autocomplete"
+                v-model="search_value"
+                :fetch-suggestions="querySearchAsync"
+                :trigger-on-focus="false"
+                placeholder="请输入病人名字"
+                @select="handleSelect"
+                style="width:160px;"
+              >
+                <i class="el-icon-search el-input__icon" slot="suffix"></i>
+                <template slot-scope="{ item }">
+                  <div class="name">{{ item.name }}</div>
+                </template>
+              </el-autocomplete>
+
+            </el-form-item>
+          </el-form>
+
+          <label class="title">
+            <span class="name">日期查询</span> :
+          </label>
+          <el-date-picker
+            v-model="query.start_time"
+            prefix-icon="el-icon-date"
+            @change="changeTime"
+            :editable="false"
+            style="width: 150px;"
+            type="date"
+            placeholder="选择日期时间"
+            align="right"
+            format="yyyy-MM-dd"
+            value-format="yyyy-MM-dd"
+          ></el-date-picker>
+          <span class>-</span>
+          <el-date-picker
+            v-model="query.end_time"
+            prefix-icon="el-icon-date"
+            @change="changeEndTime"
+            :editable="false"
+            style="width: 150px;"
+            type="date"
+            placeholder="选择日期时间"
+            align="right"
+            format="yyyy-MM-dd"
+            value-format="yyyy-MM-dd"
+          ></el-date-picker>
+
+          <el-button size="small" icon="el-icon-printer" @click="printAction" type="primary">打印
+          </el-button>
+          <el-button size="small" icon="el-icon-printer" @click="exportAction" type="primary">导出
+
+          </el-button>
+        </div>
+
+        <el-container>
+          <div style="width:160px">
+
+            <div class="tableTitle">患者列表</div>
+
+
+            <el-table ref="table" :data="patientsData" border style="width: 100%;" height="500"
+                      :row-style="{ color: '#303133' }"
+                      :header-cell-style="{backgroundColor: 'rgb(245, 247, 250)',color: '#606266'}"
+                      highlight-current-row
+                      @current-change="handleChange">
+              <el-table-column prop="dialysis_no" label="透析号" width="70" align="center">
+                <template slot-scope="scope">{{scope.row.dialysis_no}}</template>
+              </el-table-column>
+              <el-table-column prop="name" label="姓名" width="90" align="center">
+                <template slot-scope="scope">{{ scope.row.name }}</template>
+              </el-table-column>
+            </el-table>
+          </div>
+          <div style="padding-left:10px;flex:1;width:0;">
+            <div class="tableTitle">指标趋势<span style="font-weight:normal">&nbsp;&nbsp;（当前患者: {{patient_name}}）</span></div>
             <div>
-                <span>查询时间:</span>
-                <el-date-picker
-                v-model="stat_time"
-                type="date"
-                placeholder="选择日期">
-                </el-date-picker>
-                <span>-</span>
-                <el-date-picker
-                v-model="end_time"
-                type="date"
-                placeholder="选择日期">
-                </el-date-picker>
-                <el-select v-model="value" placeholder="请选择">
-                    <el-option
-                    v-for="item in options"
-                    :key="item.value"
-                    :label="item.label"
-                    :value="item.value">
-                    </el-option>
-                </el-select>
-                <el-select v-model="value" placeholder="请选择">
-                    <el-option
-                    v-for="item in options"
-                    :key="item.value"
-                    :label="item.label"
-                    :value="item.value">
-                    </el-option>
-                </el-select>
-                <el-button type="primary">查询</el-button>
+              <line-chart :options="chart"></line-chart>
+              <!--              <line-chart :options="bar" v-if="query.statistics_type == 9 || query.statistics_type == 10"></line-chart>-->
+              <!--              <line-chart></line-chart>-->
+
             </div>
+            <div class="tableTitle">统计表</div>
             <div>
-                <el-button type="primary">打印</el-button>
-                <el-button type="primary">导出</el-button>
-            </div>
-       </div>
-       <div style="margin: 20px 0px;">
-        <h2 >患者列表</h2>
-       </div>
-       
-       <div >
-        <el-row :gutter="20">
-            <el-col :span="4">
-              <div class="grid-content bg-purple">
-                <!-- <span style="font-size: 18px;font-weight: bold;display: block;">患者列表</span> -->
-                
-                <el-table
-                :data="tableData"
-                border
-                style="width: 100%">
-                    <el-table-column
-                        align="center"
-                        prop="date"
-                        label="透析号"
-                       >
-                    </el-table-column>
-                    <el-table-column
-                        align="center"
-                        prop="name"
-                        label="姓名"
-                        >
-                    </el-table-column>
-                </el-table>
-              </div>
-            </el-col>
-            <el-col :span="19">
-               <div class="grid-content bg-purple">
-                <div class="echart" id="germychart" style="width:100%;height:400px"></div>
-                <el-table
-                    :data="tableData"
-                    style="width: 100%"
-                    border
-                    align="center"
-                    max-height="250">
-                    <el-table-column
-                    fixed
-                    prop="date"
-                    label="姓名"
-                   >
-                    </el-table-column>
-                    <el-table-column
-                    prop="name"
-                    label="检查日期"
-                    >
-                    </el-table-column>
-                    <el-table-column
-                    prop="province"
-                    label="白蛋白（g/L）"
-                    >
-                    </el-table-column>
-                    
-                </el-table>
-               </div>
-           </el-col>
-        </el-row>
-       </div>
+              <el-table ref="table" :data="tableData" v-loading="loading" border :row-style="{ color: '#303133' }" :header-cell-style="{backgroundColor: 'rgb(245, 247, 250)',color: '#606266'}">
+                <el-table-column label="姓名" align="center">
+                  <template slot-scope="scope">
+                    {{scope.row.name}}
+                  </template>
+                </el-table-column>
+
+                <el-table-column width="100" label="检查日期" align="center">
+                  <template slot-scope="scope">
+                    {{getTime(scope.row.inspect_date)}}
+
+                  </template>
+                </el-table-column>
 
+                <el-table-column width="100" label="白蛋白" align="center">
+                  <template slot-scope="scope">
+                    {{scope.row.value}}
+                  </template>
+                </el-table-column>
+              </el-table>
+
+
+            </div>
+          </div>
+        </el-container>
+      </div>
     </div>
+  </div>
 </template>
+
+
 <script>
-  import * as echarts from 'echarts'
-export default{
-    // props: {
-    //     width: {
-    //         type: String,
-    //         default: "100%"
-    //     },
-    //     height: {
-    //         type: String,
-    //         default: "400px"
-    //     },
-    
-    // },
-    data() {
-        return {
-            inputValue:'',
-            stat_time:'',
-            end_time:'',
-            value:'',
-            myChart: {},
-            xData: ["Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"], //横坐标
-            opinionData: [23, 24, 18, 25, 27, 28, 25], //人数数据
-            // myChartStyle: { float: "left", width: "100%", height: "400px" },//图表样式
-            tableData:[],
+import echarts from 'echarts'
+import {  uParseTime } from '@/utils/tools'
+import { getCurrentOrgPatients } from '@/api/common/common'
+import {
+  GetDefaultPatient,
+} from '@/api/common/statistics'
+import { PostSearch } from '@/api/patient'
+import { getDataConfig } from '@/utils/data'
+import { GetPersonQCStatistisData } from '../../../api/qcd'
+import LineChart from '../../qcd/components/LineChart.vue'
+
+export default {
+  components: {
+    LineChart
+  },
+  data() {
+    return {
+      pickerOptions: {
+        disabledDate(time) {
+          let threeMonths = new Date(new Date().setFullYear(new Date().getFullYear() - 1)).getTime() - 24 * 3600 * 1000
+          return time.getTime() > Date.now() || time.getTime() < threeMonths
+
         }
-    },
-    created(){
-        
-    },
-    mounted() {
-        // this.$nextTick(function() {
-            this.initEcharts();
-		// })  
-        // this.myChart = echarts.init(document.getElementById("germychart"));
-        //     this.myChart.setOption(option);
-            //随着屏幕大小调节图表
-            window.addEventListener("resize", () => {
-                this.myChart.resize();
-            });
-    },
-    methods:{
-        handleSubmit(){
-            console.log('asdfa');
+      },
+      patient_name:'',
+      percent:[],
+      patientsData: [],
+      tableData: [],
+      loading: false,
+      search_value: '',
+      total: 0,
+      query: {
+        patient_id: '',
+        statistics_type: 1,
+        start_time: '',
+        end_time: '',
+        limit: 10,
+        page: 1
+      },
+      crumbs: [
+        { path: false, name: '科室质控' },
+        { path: false, name: '指标评估统计' },
+        { path: false, name: '透析过程指标统计' }
+      ],
+      tableData1: [],
+      chart: {
+        title: {
+          text: 'ECharts 入门示例'
         },
-        initEcharts() {
-            const option = {
-                xAxis: {
-                    type: 'category',
-                        boundaryGap:true,
-                        axisTick:{
-                            alignWithLabel:true //保证刻度线和标签对齐
-                        },
-                    data: this.xData,
-                    splitNumber:this.xData.length, //纵坐标数
-                    interval:this.xData //强制设置坐标轴分割间隔
-                },
-                yAxis: {
-                    type: 'value',
-                    boundaryGap: true,
-                    splitNumber:4, //纵坐标数
-                    interval:10 //强制设置坐标轴分割间隔
+        tooltip: {},
+        legend: {
+          data: [],
+          left: 0
+        },
+        xAxis: {
+          data: []
+        },
+        yAxis: {
+          axisLabel: {
+            formatter: '{value} %'
+          },
+          show: false
+        },
+        series: [
+          {
+            name: '',
+            type: 'line',
+            data: [],
+            barWidth: 30,
+            label: {
+              normal: {
+                show: true,
+                position: 'top',
+                formatter: (params) => {
+                  if(this.percent.length > 0){
+                    let str = ''
+                    str = params.data + '('+ this.percent[params.dataIndex] +'%)'
+                    return str
+                  }else{
+                    let str = ''
+                    str = params.data
+                    return str
+                  }
+                }
+              }
+            },
+            //配置样式
+            itemStyle: {
+              //通常情况下：
+
+              //每个柱子的颜色即为colorList数组里的每一项，如果柱子数目多于colorList的长度，则柱子颜色循环使用该数组
+              normal: {
+                color: function(params) {
+                  //我这边就两个柱子，大体就两个柱子颜色渐变，所以数组只有两个值，多个颜色就多个值
+                  var colorList = [
+                    ['#A9E0F3', '#9FBDFC'],
+
+                    ['#FFD7C0', '#FF9994']
+                  ]
+
+                  var index = params.dataIndex
+                  if (params.dataIndex >= colorList.length) {
+                    index = params.dataIndex % colorList.length
+                  }
+
+                  return new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+                    { offset: 0, color: colorList[index][0] },
+                    // { offset: 0.5, color: colorList[index][1] },
+                    { offset: 1, color: colorList[index][1] }
+                  ])
                 },
-                legend: {
-                    show: true,
-                    align:'left',//文字在前图标在后
-                    left:'15%',
-                    top:'5%',
-                    data: [{name:'白蛋白g/L'}]
+                lineStyle:{
+                  color:'#409eff' //改变折线颜色
                 },
-                series: [
-                {
-                    data: this.opinionData,
-                    name:'白蛋白g/L',
-                    type: "line",// 类型设置为折线图
-                    symbol: 'circle',
-                    itemStyle: {
-                        normal: {
-                            color: '#409eff', //改变折线点的颜色#a80000
-                            lineStyle: {
-                                color: '#409eff' //改变折线颜色
-                            }
-                        }
-                    },
+                barBorderRadius: [5, 5, 0, 0] //柱状角成椭圆形
+              },
 
-                },
-                
-                ],
-                
-            };
-            this.myChart = echarts.init(document.getElementById("germychart"));
-            this.myChart.setOption(option);
-            //随着屏幕大小调节图表
-            window.addEventListener("resize", () => {
-                this.myChart.resize();
-            });
+              //鼠标悬停时：
+              emphasis: {
+                shadowBlur: 10,
+                shadowOffsetX: 0,
+                shadowColor: 'rgba(0, 0, 0, 0.5)'
+              }
+            }
+          }
+        ],
+        dataZoom: [
+          {
+            // Y轴固定,让内容滚动
+            type: 'slider',
+            show: false,
+            xAxisIndex: [0],
+            start: 1,
+            end: 20, // 设置X轴刻度之间的间隔(根据数据量来调整)
+            zoomLock: true // 锁定区域禁止缩放(鼠标滚动会缩放,所以禁止)
+          },
+          {
+            type: 'inside',
+            xAxisIndex: [0],
+            start: 1,
+            end: 20,
+            zoomLock: true // 锁定区域禁止缩放
+          }
+        ]
+      },
+      bar: {
+        title: {
+          text: 'ECharts 入门示例'
         },
+        tooltip: {},
+        legend: {
+          data: [],
+          left: 0
+        },
+        xAxis: {
+          data: []
+        },
+        yAxis: {
+          axisLabel: {
+            formatter: '{value} %'
+          },
+          show: false
+        },
+        series: [
+          {
+            name: '',
+            type: 'bar',
+            data: [],
+            barWidth: 30,
+            label: {
+              normal: {
+                show: true,
+                position: 'top',
+                formatter: (params) => {
+                  if(this.percent.length > 0){
+                    let str = ''
+                    str = params.data + '('+ this.percent[params.dataIndex] +'%)'
+                    return str
+                  }else{
+                    let str = ''
+                    str = params.data
+                    return str
+                  }
+                }
+              }
+            },
+            //配置样式
+            itemStyle: {
+              //通常情况下：
+
+              //每个柱子的颜色即为colorList数组里的每一项，如果柱子数目多于colorList的长度，则柱子颜色循环使用该数组
+              normal: {
+                color: function(params) {
+                  //我这边就两个柱子，大体就两个柱子颜色渐变，所以数组只有两个值，多个颜色就多个值
+                  var colorList = [
+                    ['#A9E0F3', '#9FBDFC'],
+                    ['#FFD7C0', '#FF9994']
+                  ]
+
+                  var index = params.dataIndex
+                  if (params.dataIndex >= colorList.length) {
+                    index = params.dataIndex % colorList.length
+                  }
+
+                  return new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+                    { offset: 0, color: colorList[index][0] },
+                    // { offset: 0.5, color: colorList[index][1] },
+                    { offset: 1, color: colorList[index][1] }
+                  ])
+                },
+                barBorderRadius: [5, 5, 0, 0] //柱状角成椭圆形
+              },
+
+              //鼠标悬停时：
+              emphasis: {
+                shadowBlur: 10,
+                shadowOffsetX: 0,
+                shadowColor: 'rgba(0, 0, 0, 0.5)'
+              }
+            }
+          }
+        ]
+      }
+
+    }
+  },
+  methods: {
+    printAction(){
+      this.$router.push({
+        path: "/Dialysisanalysis/qualitycontrol/print?patient_id=" + this.query.patient_id+"&project_id="+this.query.project_id+"&item_id="+this.query.item_id+"&start_time="+this.query.start_time+"&end_time="+this.query.end_time
+      });
+
+    },exportAction(){
+      let list = []
+      for (let i = 0; i < this.tableData.length; i++) {
+        let order = this.tableData[i]
+        let name = order.name
+        let value = order.value
+        let inspect_date = order.inspect_date
+
+        let obj = {
+          '姓名': name,
+          '数值': value,
+          '日期': inspect_date,
+        }
+        list.push(obj)
+      }
+      import('@/vendor/Export2Excel').then(excel => {
+        const tHeader = ['姓名', '数值', '日期']
+        const filterVal = ['姓名', '数值', '日期']
+        const data = this.formatJson(filterVal, list)
+        excel.export_json_to_excel1({
+          header: tHeader,
+          data,
+          filename: '明细',
+          ref: this.$refs['table'].$el
+        })
+      })
+    },
+    changeProject(val) {
+      this.query.statistics_type = val
+      this.query.page = 1
+      this.GetPersonQCStatistisData(this.query)
+      this.GetInspectionCheckIndexTableData(this.query)
+
+    },
+    handleChange(val) {
+      this.query.patient_id = val.id
+      this.query.page = 1
+      this.patient_name = val.name
+      this.GetPersonQCStatistisData(this.query)
+      this.GetInspectionCheckIndexTableData(this.query)
+    },
+    handleSizeChange(limit) {
+      this.query.limit = limit
+      this.GetInspectionCheckIndexTableData(this.query)
+
+    },
+    handleCurrentChange(page) {
+      this.query.page = page
+      this.GetPersonQCStatistisData(this.query)
+    },formatJson(filterVal, jsonData) {
+      return jsonData.map(v => filterVal.map(j => v[j]))
+    },
+    changeTime(val) {
+      var time = this.getTimestamp(val) - this.getTimestamp(this.query.end_time)
+      if (time > 0) {
+        this.$message.error('结束时间不能小于开始时间')
+        this.query.start_time = ''
+      } else {
+        // this.getDialysisList()
+        this.query.page = 1
+        this.GetPersonQCStatistisData(this.query)
+        this.GetInspectionCheckIndexTableData(this.query)
+
+      }
+
+    },
+    changeEndTime(val) {
+      var time =
+        this.getTimestamp(val) - this.getTimestamp(this.query.start_time)
+      if (time < 0) {
+        this.$message.error('结束时间不能小于开始时间')
+        this.query.end_time = ''
+      } else {
+        this.query.page = 1
+        this.GetPersonQCStatistisData(this.query)
+        this.GetInspectionCheckIndexTableData(this.query)
+
+      }
+    },
+    getTimestamp(time) {
+      // 把时间日期转成时间戳
+      return new Date(time).getTime() / 1000
+    },
+    QueryOperaById: function(val) {
+      let vascular_access_desc_name = ''
+      let vascular_access_desc = getDataConfig(
+        'hemodialysis',
+        'vascular_access_desc'
+      )
+      for (let i = 0; i < vascular_access_desc.length; i++) {
+        if (vascular_access_desc[i].id == val) {
+          vascular_access_desc_name = vascular_access_desc[i].name
+        }
+      }
+
+      return vascular_access_desc_name
     },
-    
+    GetAnticoagulantById: function(val) {
+      let anticoagulan_name = ''
+      var anticoagulantsConfitTwo = this.$store.getters.anticoagulants_confit
+      let anticoagulant = anticoagulantsConfitTwo
+      for (let keys in anticoagulant) {
+        if (anticoagulant[keys].id == val) {
+          anticoagulan_name = anticoagulant[keys].name
+        }
+      }
+      return anticoagulan_name
+    },
+    getModeName(mode_id) {
+      return this.$store.getters.treatment_mode[mode_id] != undefined ? this.$store.getters.treatment_mode[mode_id].name : ''
+    },  getTime(val) {
+      if(val == "" || val == undefined){
+        return ""
+      }else {
+        return uParseTime(val, '{y}-{m}-{d}')
+      }
+    },
+    GetInspectionCheckIndexTableData(params) {
+      this.loading = true
+      GetPersonQCStatistisData(params)
+        .then(rs => {
+          var resp = rs.data
+          console.log("resp=====",resp)
+          if (resp.state == 1) {
+            this.loading = false
+            this.tableData = []
+            for (let i = 0; i < resp.data.inspections.length; i++) {
+              let obj = {
+                name:resp.data.patient.name,
+                value:resp.data.inspections[i].inspect_value,
+                inspect_date:resp.data.inspections[i].inspect_date
+              }
+              this.tableData.push(obj)
+            }
+            this.total = resp.data.total
+
+          } else {
+            this.loading = false
+          }
+        })
+        .catch(error => {
+
+        })
+    },
+    GetPersonQCStatistisData(params) {
+      this.chart.xAxis.data = []
+      this.chart.series[0].data = []
+      this.bar.xAxis.data = []
+      this.bar.series[0].data = []
+      this.percent = []
+      GetPersonQCStatistisData(params)
+        .then(rs => {
+          var resp = rs.data
+          if (resp.state == 1) {
+            console.log(resp.data.inspections)
+            for (let i = 0; i < resp.data.inspections.length; i++) {
+              this.chart.xAxis.data.push(this.getTime(resp.data.inspections[i].inspect_date))
+              this.chart.series[0].data.push(resp.data.inspections[i].inspect_value)
+            }
+            console.log(this.chart.xAxis.data)
+            console.log( this.chart.series[0].data)
+
+            this.getArrLength(this.chart.xAxis.data,1)
+          } else {
+
+          }
+        })
+        .catch(error => {
+        })
+    },
+    handleSelect(val) {
+      this.query.patient_id = val.id
+      this.query.page = 1
+      this.patient_name = val.name
+      for (let i = 0;i < this.patientsData.length; i++){
+        if (this.patientsData[i].id == val.id){
+          this.$refs.table.setCurrentRow(this.patientsData[i])
+        }
+      }
+
+
+    },
+    querySearchAsync(keyword, cb) {
+      let key = ''
+      if (keyword != undefined) {
+        key = keyword
+      }
+      let searchArray = []
+      PostSearch(key).then(response => {
+        if (response.data.state == 1) {
+          searchArray = response.data.data.patient
+          cb(searchArray)
+        } else {
+          cb([])
+        }
+      })
+    },
+    chooseWay(way) {
+      this.wayType = way
+    }, getCurrentOrgPatients() {
+      getCurrentOrgPatients().then(response => {
+        if (response.data.state == 1) {
+          var patients = response.data.data.patients
+          this.patientsData = patients
+          this.GetDefaultPatient()
+        }
+      })
+    }, GetDefaultPatient() {
+      GetDefaultPatient().then(response => {
+        if (response.data.state == 1) {
+          var patient = response.data.data.patient
+          for (let i = 0;i < this.patientsData.length; i++){
+            if (this.patientsData[i].id == patient.id){
+              this.patient_name = this.patientsData[i].name
+              this.$refs.table.setCurrentRow(this.patientsData[i])
+            }
+          }
+          this.query.patient_id = patient.id
+          this.GetPersonQCStatistisData(this.query)
+
+        }
+      })
+
+    },
+    getArrLength(result,type){
+      if(type == 1){
+        if(result.length > 10){
+          var dataZoom_end = (10/result.length)*100;
+          this.chart.dataZoom[0].end = dataZoom_end
+        }else{
+          var dataZoom_end = 100;
+          this.chart.dataZoom[0].end = dataZoom_end
+        }
+      }else if(type == 2){
+        if(result.length > 10){
+          var dataZoom_end = (10/result.length)*100;
+          this.bar.dataZoom[0].end = dataZoom_end
+        }else{
+          var dataZoom_end = 100;
+          this.bar.dataZoom[0].end = dataZoom_end
+        }
+      }
+
+    }
+  }, mounted() {
+    var date = new Date()
+    var year = date.getFullYear() //获取完整的年份(4位)
+    var month = date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1).toString() : date.getMonth() + 1 //获取当前月份(0-11,0代表1月)
+    var day = date.getDate() < 10 ? '0' + date.getDate().toString() : date.getDate() //获取当前日(1-31)
+    var last_month = date.getMonth() < 10 ? '0' + date.getMonth().toString() : date.getMonth() //获取当前月份(0-11,0代表1月)
+    this.query.patient_id = 0
+    this.query.end_time = year + '-' + month + '-' + day
+    this.query.start_time = year + '-' + last_month + '-' + day
+    this.query.project_id = 2
+    this.query.item_id = 35
+    this.getCurrentOrgPatients()
+
+    // this.GetPersonQCStatistisData()
+
+
+  }
 }
 </script>
+
 <style lang="scss" scoped>
-.content_top{
-    display: flex;
-    justify-content: space-around;
-    margin-bottom: 20px;
+.tableTitle {
+  font-size: 16px;
+  color: #000;
+  font-weight: bold;
+  margin-bottom: 10px;
+}
+</style>
+<style lang="scss">
+.page_process {
+.el-tabs{
+  margin-bottom:0 !important;
+}
+.el-button--medium {
+  padding: 10px 8px;
+}
+
+.el-form-item {
+  margin-bottom: 0;
+}
+::-webkit-scrollbar{
+  height: 15px !important;
+}
+
 }
-</style>
+</style>

src/xt_pages/Dialysisanalysis/bloodPhosphorus/phosphorusall.vue

@@ -1,262 +1,369 @@
 <template>
-    <div>
-        <!-- <div class="content_top">
-            <div class="block">
-                <span>查询时间:</span>
-                <el-date-picker
-                v-model="time_month"
-                type="month"
-                placeholder="选择月">
-                </el-date-picker>
-            </div>
-            <div>
-                <el-date-picker
-                v-model="stat_time"
-                type="date"
-                placeholder="选择日期">
-                </el-date-picker>
-                <span>-</span>
-                <el-date-picker
-                v-model="end_time"
-                type="date"
-                placeholder="选择日期">
-                </el-date-picker>
-            </div>
-            <div style="width: 200px;">
-                <el-input v-model="input" placeholder="请输入内容"></el-input>
-            </div>
-            <el-button type="primary">查询</el-button>
-        </div> -->
-        <el-row :gutter="20">
-        <el-col :span="5"> 
-          <div class="block">
-            <span>查询时间:</span>
-            <el-date-picker
-            v-model="time_month"
-            type="month"
-            placeholder="选择月">
-            </el-date-picker>
-          </div>
-        </el-col>
-        <el-col :span="8">
-          <div>
-            <el-date-picker
-            v-model="stat_time"
+  <div>
+    <el-row :gutter="25">
+      <el-col :span="5">
+        <div class="block">
+          <span>查询时间:</span>
+          <el-select size="small" v-model="time_type" placeholder="请选择"
+                     style="width:150px;margin-left:10px;" @change="changeItem">
+            <el-option
+              v-for="item,index in times"
+              :key="index"
+              :label="item.label"
+              :value="item.value">
+            </el-option>
+          </el-select>
+        </div>
+      </el-col>
+      <el-col :span="8">
+        <div>
+          <el-date-picker
+            style="width: 200px"
+
+            v-model="start_time"
+            format="yyyy-MM-dd"
+            value-format="yyyy-MM-dd"
             type="date"
+
             placeholder="选择日期">
-            </el-date-picker>
-            <span>-</span>
-            <el-date-picker
+          </el-date-picker>
+          <span>-</span>
+          <el-date-picker
+            style="width: 200px"
             v-model="end_time"
+            format="yyyy-MM-dd"
+            value-format="yyyy-MM-dd"
             type="date"
             placeholder="选择日期">
-            </el-date-picker>
-          </div>
-        </el-col>
-        <el-col :span="3">
-          <div style="width: 200px;">
-            <el-input v-model="input" placeholder="请输入内容"></el-input>
-          </div>
-        </el-col>
-        <el-col :span="2">
-            <el-button type="primary">查询</el-button>
-        </el-col>
-        </el-row>
-        
-        
-        <div class="cell clearfix" style="margin: 20px; font-weight: bold;">
-          <p class="chartTitle">统计图</p>
+          </el-date-picker>
         </div>
-        <div class="echart" id="mychart" :style={width:width,height:height}></div>
-        <div style="width: 80%;margin: auto;">
-            <el-table
-            :data="tableData"
-            :show-summary = true
-            border
-            style="width: 100%;">
-                <el-table-column
-                    prop="date"
-                    align="center"
-                    label="血磷"
-                    >
-                </el-table-column>
-                <el-table-column
-                    prop="name"
-                    
-                    label="人数"
-                    >
-                </el-table-column>
-                <el-table-column
-                    prop="address"
-                    align="center"
-                    label="操作">
-                    <template slot-scope="scope">
-                        <el-button @click="handleClick(scope.row)" style="font-size:16px;"
-                                type="text" >查看详情
-                        </el-button>
-                    </template>
-                </el-table-column>
-            </el-table>
+      </el-col>
+      <el-col :span="5">
+        <div >
+          <el-input disabled v-model="input" placeholder="请输入内容"></el-input>
         </div>
+      </el-col>
+      <el-col :span="3">
+        <el-button type="primary" @click="getData()">查询</el-button>
+      </el-col>
+    </el-row>
+    <div class="cell clearfix" style="margin: 20px; font-weight: bold;">
+      <p class="chartTitle">统计图</p>
+    </div>
+    <div class="echart" id="mychart" :style={width:width,height:height}></div>
+    <div style="width: 80%;margin: auto;">
+      <el-table
+        :data="tableData"
+        border
+        style="width: 100%;">
+        <el-table-column
+          prop="name"
+          align="center"
+          label="血磷"
+
+        >
+        </el-table-column>
+        <el-table-column
+          prop="count"
+          label="人数"
+        >
+        </el-table-column>
+<!--        <el-table-column-->
+<!--          prop="address"-->
+<!--          align="center"-->
+<!--          label="操作">-->
+<!--          <template slot-scope="scope">-->
+<!--            <el-button @click="handleClick(scope.row)" style="font-size:16px;"-->
+<!--                       type="text">查看详情-->
+<!--            </el-button>-->
+<!--          </template>-->
+<!--        </el-table-column>-->
+      </el-table>
     </div>
+  </div>
 </template>
 <script>
-import * as echarts from "echarts";
-export default{
-    props: {
-   
+import * as echarts from 'echarts'
+import { GetQCStatistisData } from '../../../api/qcd'
+
+const moment = require('moment')
+
+export default {
+  props: {
+
     width: {
       type: String,
-      default: "100%"
+      default: '100%'
     },
     height: {
       type: String,
-      default: "400px"
-    },
-    
+      default: '400px'
+    }
+
   },
-    data() {
-        return {
-            time_month:'',
-            stat_time:'',
-            end_time:'',
-            input:'',
-            myChart: {},
-            pieData : [
-            {
-          value: 463,
-          name: "不达标值患者"
-        },
-        {
-          value: 395,
-          name: "未检查患者"
-        },
-        {
-          value: 157,
-          name: "达标值患者"
-        },
-        // {
-        //   value: 149,
-        //   name: "广东"
-        // },
-        // {
-        //   value: 147,
-        //   name: "湖南"
-        // }
-            
-            ],
-            pieName: [],
-            // myChartStyle:{float: "right", width: "100%", height: "400px"},
-            tableData:[],
-        }
-    },
-    mounted() {
-    this.initDate(); //数据初始化
-    this.initEcharts();
+  data() {
+    return {
+      time_type: 1,
+      times: [
+        { value: 1, label: '本月' },
+        { value: 2, label: '上月' },
+        { value: 3, label: '今年' },
+        { value: 4, label: '上一年' },
+        { value: 5, label: '第一季度' },
+        { value: 6, label: '第二季度' },
+        { value: 7, label: '第三季度' },
+        { value: 8, label: '第四季度' },
+        { value: 9, label: '自定义' }
+
+      ],
+      time_month: '',
+      start_time: new Date(new Date().getFullYear(), new Date().getMonth(), 1).toLocaleDateString('en-CA'),
+      end_time: new Date(new Date().getFullYear(), new Date().getMonth() + 1, 0).toLocaleDateString('en-CA'),
+      input: '',
+      myChart: {},
+      pieData: [],
+      pieName: [],
+      // myChartStyle:{float: "right", width: "100%", height: "400px"},
+      tableData: [],
+      reference:{},
+    }
+  },
+  mounted() {
+    this.getData()
   },
   methods: {
-    initDate() {
-      for (let i = 0; i < this.pieData.length; i++) {
-        this.pieName[i] = this.pieData[i].name;
+    getData() {
+      if(this.start_time.length == 0){
+        this.$message.error("请选择开始时间")
       }
-    },
-    initEcharts() {
-      // 饼图
-      const option = {
-        legend: {
-          // 图例
-          data: this.pieName,
-          left: "10%",
-          top: "30%",
-          orient: "vertical"
-        },
-        color:['#ff7f9f','#fff67f','#1e5feb'],
-        title: {
-          // 设置饼图标题，位置设为顶部居中
-        //   text: "国内院士前五省份图示",
-          top: "0%",
-          left: "center"
-        },
-        series: [
-          {
-            type: "pie",
-            label: {
-              normal : {
-                formatter: '{b}:{c}: ({d}%)',
-                textStyle : {
-                    fontWeight : 'normal',
-                    fontSize : 15,
-                    color : "black"
-                }
-              }
-              // b代表名称，c代表对应值，d代表百分比"{b} : {d}% ({c})" 
+      if(this.end_time.length == 0){
+        this.$message.error("请选择结束时间")
+      }
+      let params = {
+        start_date: this.start_time,
+        end_date: this.end_time,
+        project_id: 4,
+        item_id: 169
+      }
+      this.pieData = []
+      this.tableData = []
+      console.log("~~~~~~~~~~")
+      GetQCStatistisData(params).then(response => {
+        if (response.data.state == 1) {
+          this.reference =  response.data.data.reference
+          this.input = response.data.data.reference.range_min + "<=" + response.data.data.reference.item_name + "<=" + response.data.data.reference.range_max
+          let objone = {
+            value:  response.data.data.unusual_total / response.data.data.patient_count,
+            name: '不达标值患者',
+            count:response.data.data.unusual_total,
+          }
+          this.pieData.push(objone)
+          this.tableData.push(objone)
+
+          let objtwo = {
+            value:   response.data.data.normal_total / response.data.data.patient_count,
+            name: '达标值患者',
+            count:response.data.data.normal_total,
+
+          }
+          this.pieData.push(objtwo)
+          this.tableData.push(objtwo)
+
+          let objthree = {
+            value: response.data.data.patient_count / response.data.data.no_check_total,
+            name: '未检查患者',
+            count:response.data.data.no_check_total,
+
+          }
+          this.pieData.push(objthree)
+          this.tableData.push(objthree)
+
+          let objfour = {
+            value: response.data.data.patient_count,
+            name: '合计',
+            count:response.data.data.patient_count,
+          }
+          this.tableData.push(objfour)
+          for (let i = 0; i < this.pieData.length; i++) {
+            this.pieName[i] = this.pieData[i].name
+          }
+          this.myChart = echarts.init(document.getElementById('mychart'))
+          window.addEventListener('resize', () => {
+            this.myChart.resize()
+          })
+          const option = {
+            legend: {
+              // 图例
+              data: this.pieName,
+              left: '10%',
+              top: '30%',
+              orient: 'vertical'
+            },
+            color: ['#ff7f9f', '#fff67f', '#1e5feb'],
+            title: {
+              // 设置饼图标题，位置设为顶部居中
+              //   text: "国内院士前五省份图示",
+              top: '0%',
+              left: 'center'
             },
-            radius: "65%", //饼图半径
-            data: this.pieData,
-            itemStyle : {
-              emphasis: {
-                  shadowBlur: 10,
-                  shadowOffsetX: 0,
-                  shadowColor: 'rgba(0, 0, 0, 0.5)'
+            series: [
+              {
+                type: 'pie',
+                label: {
+                  show: true,
+                  formatter: '{b} : {d}% ({c})'
+                  // b代表名称，c代表对应值，d代表百分比"{b} : {d}% ({c})"
+                },
+                radius: '65%', //饼图半径
+                data: this.pieData
               }
-            }
+            ]
           }
-        ]
-      };
-    //   console.log(this.seriesData);
-      const optionFree = {
-        series: [
-          {
-            data: this.seriesData,
-            type: "line",
-            smooth: true
+          //   console.log(this.seriesData);
+          const optionFree = {
+            series: [
+              {
+                data: this.seriesData,
+                type: 'line',
+                smooth: true
+              }
+            ]
           }
-        ]
-      };
-      this.myChart = echarts.init(document.getElementById("mychart"));
-      this.myChart.setOption(option);
-      //随着屏幕大小调节图表
-      window.addEventListener("resize", () => {
-        this.myChart.resize();
-      });
+          this.myChart = echarts.init(document.getElementById('mychart'))
+          this.myChart.setOption(option)
+        } else {
+          this.$message.error(response.data.msg)
+        }
+      })
+
+    },
+    changeItem(val) {
+      const currentDate = new Date()
+      switch (val) {
+        case 1:
+
+          const startOfMonth = new Date(currentDate.getFullYear(), currentDate.getMonth(), 1).toLocaleDateString('en-CA')
+          const endOfMonth = new Date(currentDate.getFullYear(), currentDate.getMonth() + 1, 0).toLocaleDateString('en-CA')
+
+          this.start_time = startOfMonth
+          this.end_time = endOfMonth
+          this.getData()
+
+          break
+        case 2:
+          // 上月的起始日期和结束日期
+          const startOfLastMonth = new Date(currentDate.getFullYear(), currentDate.getMonth() - 1, 1).toLocaleDateString('en-CA')
+          const endOfLastMonth = new Date(currentDate.getFullYear(), currentDate.getMonth(), 0).toLocaleDateString('en-CA')
+
+          this.start_time = startOfLastMonth
+          this.end_time = endOfLastMonth
+          this.getData()
+
+          break
+        case 3:
+          // 今年的起始日期和结束日期
+          const startOfYear = new Date(currentDate.getFullYear(), 0, 1).toLocaleDateString('en-CA')
+          const endOfYear = new Date(currentDate.getFullYear(), 11, 31).toLocaleDateString('en-CA')
+
+          this.start_time = startOfYear
+          this.end_time = endOfYear
+          this.getData()
+
+          break
+        case 4:
+          // 上一年的起始日期和结束日期
+          const startOfLastYear = new Date(currentDate.getFullYear() - 1, 0, 1).toLocaleDateString('en-CA')
+          const endOfLastYear = new Date(currentDate.getFullYear() - 1, 11, 31).toLocaleDateString('en-CA')
+
+          this.start_time = startOfLastYear
+          this.end_time = endOfLastYear
+          this.getData()
+
+          break
+        case 5:
+          // 第一季度的起始日期和结束日期
+          const startOfFirstQuarter = new Date(currentDate.getFullYear(), 0, 1).toLocaleDateString('en-CA')
+          const endOfFirstQuarter = new Date(currentDate.getFullYear(), 2, 31).toLocaleDateString('en-CA')
+
+          this.start_time = startOfFirstQuarter
+          this.end_time = endOfFirstQuarter
+          this.getData()
+
+          break
+        case 6:
+          // 第二季度的起始日期和结束日期
+          const startOfSecondQuarter = new Date(currentDate.getFullYear(), 3, 1).toLocaleDateString('en-CA')
+          const endOfSecondQuarter = new Date(currentDate.getFullYear(), 5, 30).toLocaleDateString('en-CA')
+
+          this.start_time = startOfSecondQuarter
+          this.end_time = endOfSecondQuarter
+          this.getData()
+
+          break
+        case 7:
+          // 第三季度的起始日期和结束日期
+          const startOfThirdQuarter = new Date(currentDate.getFullYear(), 6, 1).toLocaleDateString('en-CA')
+          const endOfThirdQuarter = new Date(currentDate.getFullYear(), 8, 30).toLocaleDateString('en-CA')
+
+          this.start_time = startOfThirdQuarter
+          this.end_time = endOfThirdQuarter
+          this.getData()
+
+          break
+        case 8:
+          // 第四季度的起始日期和结束日期
+          const startOfFourthQuarter = new Date(currentDate.getFullYear(), 9, 1).toLocaleDateString('en-CA')
+          const endOfFourthQuarter = new Date(currentDate.getFullYear(), 11, 31).toLocaleDateString('en-CA')
+
+          this.start_time = startOfFourthQuarter
+          this.end_time = endOfFourthQuarter
+          this.getData()
+          break
+        case 9:
+          this.start_time = ''
+          this.end_time = ''
+          break
+      }
     },
+
+
     getSummaries(param) {
-        const { columns, data } = param;
-        const sums = [];
-        columns.forEach((column, index) => {
-          if (index === 0) {
-            sums[index] = '总价';
-            return;
-          }
-          const values = data.map(item => Number(item[column.property]));
-          if (!values.every(value => isNaN(value))) {
-            sums[index] = values.reduce((prev, curr) => {
-              const value = Number(curr);
-              if (!isNaN(value)) {
-                return prev + curr;
-              } else {
-                return prev;
-              }
-            }, 0);
-            sums[index] += ' 元';
-          } else {
-            sums[index] = 'N/A';
-          }
-        });
+      const { columns, data } = param
+      const sums = []
+      columns.forEach((column, index) => {
+        if (index === 0) {
+          sums[index] = '总价'
+          return
+        }
+        const values = data.map(item => Number(item[column.property]))
+        if (!values.every(value => isNaN(value))) {
+          sums[index] = values.reduce((prev, curr) => {
+            const value = Number(curr)
+            if (!isNaN(value)) {
+              return prev + curr
+            } else {
+              return prev
+            }
+          }, 0)
+          sums[index] += ' 元'
+        } else {
+          sums[index] = 'N/A'
+        }
+      })
 
-        return sums;
+      return sums
     },
-    handleClick(id){
-        console.log(id);
+    handleClick(id) {
+      console.log(id)
     }
   }
 
 }
 </script>
 <style lang="scss" scoped>
-.content_top{
-    display: flex;
-    justify-content: space-around;
-    color: #1e5feb;
+.content_top {
+  display: flex;
+  justify-content: space-around;
+  color: #1e5feb;
 }
-</style>
+</style>

src/xt_pages/Dialysisanalysis/bloodPhosphorus/phosphorusalone.vue

@@ -1,217 +1,646 @@
 <template>
-    <div>
-       <div class="content_top">
-            <el-autocomplete
-            class="inline-input"
-            v-model="inputValue"
-            :fetch-suggestions="querySearch"
-            :trigger-on-focus="false"
-            placeholder="请输入患者名字或透析号"
-            @select="handleSubmit"
-            ></el-autocomplete>
+  <div class="main-contain">
+    <div class="app-container">
+      <div class="page_process">
+        <new-nav activeName="process"></new-nav>
+        <div class="cell clearfix">
+          <el-form :inline="true">
+            <el-form-item label>
+              <el-autocomplete
+                class="checkSearch"
+                popper-class="my-autocomplete"
+                v-model="search_value"
+                :fetch-suggestions="querySearchAsync"
+                :trigger-on-focus="false"
+                placeholder="请输入病人名字"
+                @select="handleSelect"
+                style="width:160px;"
+              >
+                <i class="el-icon-search el-input__icon" slot="suffix"></i>
+                <template slot-scope="{ item }">
+                  <div class="name">{{ item.name }}</div>
+                </template>
+              </el-autocomplete>
+
+            </el-form-item>
+          </el-form>
+
+          <label class="title">
+            <span class="name">日期查询</span> :
+          </label>
+          <el-date-picker
+            v-model="query.start_time"
+            prefix-icon="el-icon-date"
+            @change="changeTime"
+            :editable="false"
+            style="width: 150px;"
+            type="date"
+            placeholder="选择日期时间"
+            align="right"
+            format="yyyy-MM-dd"
+            value-format="yyyy-MM-dd"
+          ></el-date-picker>
+          <span class>-</span>
+          <el-date-picker
+            v-model="query.end_time"
+            prefix-icon="el-icon-date"
+            @change="changeEndTime"
+            :editable="false"
+            style="width: 150px;"
+            type="date"
+            placeholder="选择日期时间"
+            align="right"
+            format="yyyy-MM-dd"
+            value-format="yyyy-MM-dd"
+          ></el-date-picker>
+
+          <el-button size="small" icon="el-icon-printer" @click="printAction" type="primary">打印
+          </el-button>
+          <el-button size="small" icon="el-icon-printer" @click="exportAction" type="primary">导出
+
+          </el-button>
+        </div>
+
+        <el-container>
+          <div style="width:160px">
+
+            <div class="tableTitle">患者列表</div>
+
+
+            <el-table ref="table" :data="patientsData" border style="width: 100%;" height="500"
+                      :row-style="{ color: '#303133' }"
+                      :header-cell-style="{backgroundColor: 'rgb(245, 247, 250)',color: '#606266'}"
+                      highlight-current-row
+                      @current-change="handleChange">
+              <el-table-column prop="dialysis_no" label="透析号" width="70" align="center">
+                <template slot-scope="scope">{{scope.row.dialysis_no}}</template>
+              </el-table-column>
+              <el-table-column prop="name" label="姓名" width="90" align="center">
+                <template slot-scope="scope">{{ scope.row.name }}</template>
+              </el-table-column>
+            </el-table>
+          </div>
+          <div style="padding-left:10px;flex:1;width:0;">
+            <div class="tableTitle">指标趋势<span style="font-weight:normal">&nbsp;&nbsp;（当前患者: {{patient_name}}）</span></div>
             <div>
-                <span>查询时间:</span>
-                <el-date-picker
-                v-model="stat_time"
-                type="date"
-                placeholder="选择日期">
-                </el-date-picker>
-                <span>-</span>
-                <el-date-picker
-                v-model="end_time"
-                type="date"
-                placeholder="选择日期">
-                </el-date-picker>
-                <el-select v-model="value" placeholder="请选择">
-                    <el-option
-                    v-for="item in options"
-                    :key="item.value"
-                    :label="item.label"
-                    :value="item.value">
-                    </el-option>
-                </el-select>
-                <el-select v-model="value" placeholder="请选择">
-                    <el-option
-                    v-for="item in options"
-                    :key="item.value"
-                    :label="item.label"
-                    :value="item.value">
-                    </el-option>
-                </el-select>
-                <el-button type="primary">查询</el-button>
+              <line-chart :options="chart"></line-chart>
+              <!--              <line-chart :options="bar" v-if="query.statistics_type == 9 || query.statistics_type == 10"></line-chart>-->
+              <!--              <line-chart></line-chart>-->
+
             </div>
+            <div class="tableTitle">统计表</div>
             <div>
-                <el-button type="primary">打印</el-button>
-                <el-button type="primary">导出</el-button>
-            </div>
-       </div>
-       <div style="margin: 20px 0px;">
-        <h2 >患者列表</h2>
-       </div>
-       <div >
-        <el-row :gutter="20">
-            <el-col :span="4">
-              <div class="grid-content bg-purple">
-                <!-- <span style="font-size: 18px;font-weight: bold;display: block;">患者列表</span> -->
-                <!-- <h2>患者列表</h2> -->
-                <el-table
-                :data="tableData"
-                border
-                style="width: 100%">
-                    <el-table-column
-                        align="center"
-                        prop="date"
-                        label="透析号"
-                       >
-                    </el-table-column>
-                    <el-table-column
-                        align="center"
-                        prop="name"
-                        label="姓名"
-                        >
-                    </el-table-column>
-                </el-table>
-              </div>
-            </el-col>
-            <el-col :span="19">
-               <div class="grid-content bg-purple">
-                <div class="echart" id="germychart" style="width:100%;height:400px"></div>
-                <el-table
-                    :data="tableData"
-                    style="width: 100%"
-                    border
-                    align="center"
-                    max-height="250">
-                    <el-table-column
-                    fixed
-                    prop="date"
-                    label="姓名"
-                   >
-                    </el-table-column>
-                    <el-table-column
-                    prop="name"
-                    label="检查日期"
-                    >
-                    </el-table-column>
-                    <el-table-column
-                    prop="province"
-                    label="血磷（mmol/L）"
-                    >
-                    </el-table-column>
-                    
-                </el-table>
-               </div>
-           </el-col>
-        </el-row>
-       </div>
+              <el-table ref="table" :data="tableData" v-loading="loading" border :row-style="{ color: '#303133' }" :header-cell-style="{backgroundColor: 'rgb(245, 247, 250)',color: '#606266'}">
+                <el-table-column label="姓名" align="center">
+                  <template slot-scope="scope">
+                    {{scope.row.name}}
+                  </template>
+                </el-table-column>
+
+                <el-table-column width="100" label="检查日期" align="center">
+                  <template slot-scope="scope">
+                    {{getTime(scope.row.inspect_date)}}
+
+                  </template>
+                </el-table-column>
 
+                <el-table-column width="100" label="血磷" align="center">
+                  <template slot-scope="scope">
+                    {{scope.row.value}}
+                  </template>
+                </el-table-column>
+              </el-table>
+
+
+            </div>
+          </div>
+        </el-container>
+      </div>
     </div>
+  </div>
 </template>
+
+
 <script>
-  import * as echarts from 'echarts'
-export default{
-    // props: {
-    //     width: {
-    //         type: String,
-    //         default: "100%"
-    //     },
-    //     height: {
-    //         type: String,
-    //         default: "400px"
-    //     },
-    
-    // },
-    data() {
-        return {
-            inputValue:'',
-            stat_time:'',
-            end_time:'',
-            value:'',
-            myChart: {},
-            xData: ["Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"], //横坐标
-            opinionData: [23, 24, 18, 25, 27, 28, 25], //人数数据
-            // myChartStyle: { float: "left", width: "100%", height: "400px" },//图表样式
-            tableData:[],
+import echarts from 'echarts'
+import {  uParseTime } from '@/utils/tools'
+import { getCurrentOrgPatients } from '@/api/common/common'
+import {
+  GetDefaultPatient,
+} from '@/api/common/statistics'
+import { PostSearch } from '@/api/patient'
+import { getDataConfig } from '@/utils/data'
+import { GetPersonQCStatistisData } from '../../../api/qcd'
+import LineChart from '../../qcd/components/LineChart.vue'
+
+export default {
+  components: {
+    LineChart
+  },
+  data() {
+    return {
+      pickerOptions: {
+        disabledDate(time) {
+          let threeMonths = new Date(new Date().setFullYear(new Date().getFullYear() - 1)).getTime() - 24 * 3600 * 1000
+          return time.getTime() > Date.now() || time.getTime() < threeMonths
+
         }
-    },
-    created(){
-        
-    },
-    mounted() {
-        // this.$nextTick(function() {
-            this.initEcharts();
-		// })  
-        // this.myChart = echarts.init(document.getElementById("germychart"));
-        //     this.myChart.setOption(option);
-            //随着屏幕大小调节图表
-            window.addEventListener("resize", () => {
-                this.myChart.resize();
-            });
-    },
-    methods:{
-        handleSubmit(){
-            console.log('asdfa');
+      },
+      patient_name:'',
+      percent:[],
+      patientsData: [],
+      tableData: [],
+      loading: false,
+      search_value: '',
+      total: 0,
+      query: {
+        patient_id: '',
+        statistics_type: 1,
+        start_time: '',
+        end_time: '',
+        limit: 10,
+        page: 1
+      },
+      crumbs: [
+        { path: false, name: '科室质控' },
+        { path: false, name: '指标评估统计' },
+        { path: false, name: '透析过程指标统计' }
+      ],
+      tableData1: [],
+      chart: {
+        title: {
+          text: 'ECharts 入门示例'
         },
-        initEcharts() {
-            const option = {
-                xAxis: {
-                    type: 'category',
-                        boundaryGap:true,
-                        axisTick:{
-                            alignWithLabel:true //保证刻度线和标签对齐
-                        },
-                    data: this.xData,
-                    splitNumber:this.xData.length, //纵坐标数
-                    interval:this.xData //强制设置坐标轴分割间隔
-                },
-                yAxis: {
-                    type: 'value',
-                    boundaryGap: true,
-                    splitNumber:4, //纵坐标数
-                    interval:10 //强制设置坐标轴分割间隔
+        tooltip: {},
+        legend: {
+          data: [],
+          left: 0
+        },
+        xAxis: {
+          data: []
+        },
+        yAxis: {
+          axisLabel: {
+            formatter: '{value} %'
+          },
+          show: false
+        },
+        series: [
+          {
+            name: '',
+            type: 'line',
+            data: [],
+            barWidth: 30,
+            label: {
+              normal: {
+                show: true,
+                position: 'top',
+                formatter: (params) => {
+                  if(this.percent.length > 0){
+                    let str = ''
+                    str = params.data + '('+ this.percent[params.dataIndex] +'%)'
+                    return str
+                  }else{
+                    let str = ''
+                    str = params.data
+                    return str
+                  }
+                }
+              }
+            },
+            //配置样式
+            itemStyle: {
+              //通常情况下：
+
+              //每个柱子的颜色即为colorList数组里的每一项，如果柱子数目多于colorList的长度，则柱子颜色循环使用该数组
+              normal: {
+                color: function(params) {
+                  //我这边就两个柱子，大体就两个柱子颜色渐变，所以数组只有两个值，多个颜色就多个值
+                  var colorList = [
+                    ['#A9E0F3', '#9FBDFC'],
+
+                    ['#FFD7C0', '#FF9994']
+                  ]
+
+                  var index = params.dataIndex
+                  if (params.dataIndex >= colorList.length) {
+                    index = params.dataIndex % colorList.length
+                  }
+
+                  return new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+                    { offset: 0, color: colorList[index][0] },
+                    // { offset: 0.5, color: colorList[index][1] },
+                    { offset: 1, color: colorList[index][1] }
+                  ])
                 },
-                legend: {
-                    show: true,
-                    align:'left',//文字在前图标在后
-                    left:'15%',
-                    top:'5%',
-                    data: [{name:'血磷mmol/L'}]
+                lineStyle:{
+                  color:'#409eff' //改变折线颜色
                 },
-                series: [
-                {
-                    data: this.opinionData,
-                    name:'血磷mmol/L',
-                    type: "line",// 类型设置为折线图
-                    symbol: 'circle',
-                    itemStyle: {
-                        normal: {
-                            color: '#409eff', //改变折线点的颜色#a80000
-                            lineStyle: {
-                                color: '#409eff' //改变折线颜色
-                            }
-                        }
-                    },
+                barBorderRadius: [5, 5, 0, 0] //柱状角成椭圆形
+              },
 
-                },
-                
-                ],
-                
-            };
-            this.myChart = echarts.init(document.getElementById("germychart"));
-            this.myChart.setOption(option);
-            //随着屏幕大小调节图表
-            window.addEventListener("resize", () => {
-                this.myChart.resize();
-            });
+              //鼠标悬停时：
+              emphasis: {
+                shadowBlur: 10,
+                shadowOffsetX: 0,
+                shadowColor: 'rgba(0, 0, 0, 0.5)'
+              }
+            }
+          }
+        ],
+        dataZoom: [
+          {
+            // Y轴固定,让内容滚动
+            type: 'slider',
+            show: false,
+            xAxisIndex: [0],
+            start: 1,
+            end: 20, // 设置X轴刻度之间的间隔(根据数据量来调整)
+            zoomLock: true // 锁定区域禁止缩放(鼠标滚动会缩放,所以禁止)
+          },
+          {
+            type: 'inside',
+            xAxisIndex: [0],
+            start: 1,
+            end: 20,
+            zoomLock: true // 锁定区域禁止缩放
+          }
+        ]
+      },
+      bar: {
+        title: {
+          text: 'ECharts 入门示例'
         },
+        tooltip: {},
+        legend: {
+          data: [],
+          left: 0
+        },
+        xAxis: {
+          data: []
+        },
+        yAxis: {
+          axisLabel: {
+            formatter: '{value} %'
+          },
+          show: false
+        },
+        series: [
+          {
+            name: '',
+            type: 'bar',
+            data: [],
+            barWidth: 30,
+            label: {
+              normal: {
+                show: true,
+                position: 'top',
+                formatter: (params) => {
+                  if(this.percent.length > 0){
+                    let str = ''
+                    str = params.data + '('+ this.percent[params.dataIndex] +'%)'
+                    return str
+                  }else{
+                    let str = ''
+                    str = params.data
+                    return str
+                  }
+                }
+              }
+            },
+            //配置样式
+            itemStyle: {
+              //通常情况下：
+
+              //每个柱子的颜色即为colorList数组里的每一项，如果柱子数目多于colorList的长度，则柱子颜色循环使用该数组
+              normal: {
+                color: function(params) {
+                  //我这边就两个柱子，大体就两个柱子颜色渐变，所以数组只有两个值，多个颜色就多个值
+                  var colorList = [
+                    ['#A9E0F3', '#9FBDFC'],
+                    ['#FFD7C0', '#FF9994']
+                  ]
+
+                  var index = params.dataIndex
+                  if (params.dataIndex >= colorList.length) {
+                    index = params.dataIndex % colorList.length
+                  }
+
+                  return new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+                    { offset: 0, color: colorList[index][0] },
+                    // { offset: 0.5, color: colorList[index][1] },
+                    { offset: 1, color: colorList[index][1] }
+                  ])
+                },
+                barBorderRadius: [5, 5, 0, 0] //柱状角成椭圆形
+              },
+
+              //鼠标悬停时：
+              emphasis: {
+                shadowBlur: 10,
+                shadowOffsetX: 0,
+                shadowColor: 'rgba(0, 0, 0, 0.5)'
+              }
+            }
+          }
+        ]
+      }
+
+    }
+  },
+  methods: {
+    printAction(){
+      this.$router.push({
+        path: "/Dialysisanalysis/qualitycontrol/print?patient_id=" + this.query.patient_id+"&project_id="+this.query.project_id+"&item_id="+this.query.item_id+"&start_time="+this.query.start_time+"&end_time="+this.query.end_time
+      });
+
+    },exportAction(){
+      let list = []
+      for (let i = 0; i < this.tableData.length; i++) {
+        let order = this.tableData[i]
+        let name = order.name
+        let value = order.value
+        let inspect_date = order.inspect_date
+
+        let obj = {
+          '姓名': name,
+          '数值': value,
+          '日期': inspect_date,
+        }
+        list.push(obj)
+      }
+      import('@/vendor/Export2Excel').then(excel => {
+        const tHeader = ['姓名', '数值', '日期']
+        const filterVal = ['姓名', '数值', '日期']
+        const data = this.formatJson(filterVal, list)
+        excel.export_json_to_excel1({
+          header: tHeader,
+          data,
+          filename: '明细',
+          ref: this.$refs['table'].$el
+        })
+      })
+    },
+    changeProject(val) {
+      this.query.statistics_type = val
+      this.query.page = 1
+      this.GetPersonQCStatistisData(this.query)
+      this.GetInspectionCheckIndexTableData(this.query)
+
+    },
+    handleChange(val) {
+      this.query.patient_id = val.id
+      this.query.page = 1
+      this.patient_name = val.name
+      this.GetPersonQCStatistisData(this.query)
+      this.GetInspectionCheckIndexTableData(this.query)
+    },
+    handleSizeChange(limit) {
+      this.query.limit = limit
+      this.GetInspectionCheckIndexTableData(this.query)
+
+    },
+    handleCurrentChange(page) {
+      this.query.page = page
+      this.GetPersonQCStatistisData(this.query)
+    },formatJson(filterVal, jsonData) {
+      return jsonData.map(v => filterVal.map(j => v[j]))
+    },
+    changeTime(val) {
+      var time = this.getTimestamp(val) - this.getTimestamp(this.query.end_time)
+      if (time > 0) {
+        this.$message.error('结束时间不能小于开始时间')
+        this.query.start_time = ''
+      } else {
+        // this.getDialysisList()
+        this.query.page = 1
+        this.GetPersonQCStatistisData(this.query)
+        this.GetInspectionCheckIndexTableData(this.query)
+
+      }
+
+    },
+    changeEndTime(val) {
+      var time =
+        this.getTimestamp(val) - this.getTimestamp(this.query.start_time)
+      if (time < 0) {
+        this.$message.error('结束时间不能小于开始时间')
+        this.query.end_time = ''
+      } else {
+        this.query.page = 1
+        this.GetPersonQCStatistisData(this.query)
+        this.GetInspectionCheckIndexTableData(this.query)
+
+      }
+    },
+    getTimestamp(time) {
+      // 把时间日期转成时间戳
+      return new Date(time).getTime() / 1000
+    },
+    QueryOperaById: function(val) {
+      let vascular_access_desc_name = ''
+      let vascular_access_desc = getDataConfig(
+        'hemodialysis',
+        'vascular_access_desc'
+      )
+      for (let i = 0; i < vascular_access_desc.length; i++) {
+        if (vascular_access_desc[i].id == val) {
+          vascular_access_desc_name = vascular_access_desc[i].name
+        }
+      }
+
+      return vascular_access_desc_name
     },
-    
+    GetAnticoagulantById: function(val) {
+      let anticoagulan_name = ''
+      var anticoagulantsConfitTwo = this.$store.getters.anticoagulants_confit
+      let anticoagulant = anticoagulantsConfitTwo
+      for (let keys in anticoagulant) {
+        if (anticoagulant[keys].id == val) {
+          anticoagulan_name = anticoagulant[keys].name
+        }
+      }
+      return anticoagulan_name
+    },
+    getModeName(mode_id) {
+      return this.$store.getters.treatment_mode[mode_id] != undefined ? this.$store.getters.treatment_mode[mode_id].name : ''
+    },  getTime(val) {
+      if(val == "" || val == undefined){
+        return ""
+      }else {
+        return uParseTime(val, '{y}-{m}-{d}')
+      }
+    },
+    GetInspectionCheckIndexTableData(params) {
+      this.loading = true
+      GetPersonQCStatistisData(params)
+        .then(rs => {
+          var resp = rs.data
+          console.log("resp=====",resp)
+          if (resp.state == 1) {
+            this.loading = false
+            this.tableData = []
+            for (let i = 0; i < resp.data.inspections.length; i++) {
+              let obj = {
+                name:resp.data.patient.name,
+                value:resp.data.inspections[i].inspect_value,
+                inspect_date:resp.data.inspections[i].inspect_date
+              }
+              this.tableData.push(obj)
+            }
+            this.total = resp.data.total
+
+          } else {
+            this.loading = false
+          }
+        })
+        .catch(error => {
+
+        })
+    },
+    GetPersonQCStatistisData(params) {
+      this.chart.xAxis.data = []
+      this.chart.series[0].data = []
+      this.bar.xAxis.data = []
+      this.bar.series[0].data = []
+      this.percent = []
+      GetPersonQCStatistisData(params)
+        .then(rs => {
+          var resp = rs.data
+          if (resp.state == 1) {
+            console.log(resp.data.inspections)
+            for (let i = 0; i < resp.data.inspections.length; i++) {
+              this.chart.xAxis.data.push(this.getTime(resp.data.inspections[i].inspect_date))
+              this.chart.series[0].data.push(resp.data.inspections[i].inspect_value)
+            }
+            console.log(this.chart.xAxis.data)
+            console.log( this.chart.series[0].data)
+
+            this.getArrLength(this.chart.xAxis.data,1)
+          } else {
+
+          }
+        })
+        .catch(error => {
+        })
+    },
+    handleSelect(val) {
+      this.query.patient_id = val.id
+      this.query.page = 1
+      this.patient_name = val.name
+      for (let i = 0;i < this.patientsData.length; i++){
+        if (this.patientsData[i].id == val.id){
+          this.$refs.table.setCurrentRow(this.patientsData[i])
+        }
+      }
+
+
+    },
+    querySearchAsync(keyword, cb) {
+      let key = ''
+      if (keyword != undefined) {
+        key = keyword
+      }
+      let searchArray = []
+      PostSearch(key).then(response => {
+        if (response.data.state == 1) {
+          searchArray = response.data.data.patient
+          cb(searchArray)
+        } else {
+          cb([])
+        }
+      })
+    },
+    chooseWay(way) {
+      this.wayType = way
+    }, getCurrentOrgPatients() {
+      getCurrentOrgPatients().then(response => {
+        if (response.data.state == 1) {
+          var patients = response.data.data.patients
+          this.patientsData = patients
+          this.GetDefaultPatient()
+        }
+      })
+    }, GetDefaultPatient() {
+      GetDefaultPatient().then(response => {
+        if (response.data.state == 1) {
+          var patient = response.data.data.patient
+          for (let i = 0;i < this.patientsData.length; i++){
+            if (this.patientsData[i].id == patient.id){
+              this.patient_name = this.patientsData[i].name
+              this.$refs.table.setCurrentRow(this.patientsData[i])
+            }
+          }
+          this.query.patient_id = patient.id
+          this.GetPersonQCStatistisData(this.query)
+
+        }
+      })
+
+    },
+    getArrLength(result,type){
+      if(type == 1){
+        if(result.length > 10){
+          var dataZoom_end = (10/result.length)*100;
+          this.chart.dataZoom[0].end = dataZoom_end
+        }else{
+          var dataZoom_end = 100;
+          this.chart.dataZoom[0].end = dataZoom_end
+        }
+      }else if(type == 2){
+        if(result.length > 10){
+          var dataZoom_end = (10/result.length)*100;
+          this.bar.dataZoom[0].end = dataZoom_end
+        }else{
+          var dataZoom_end = 100;
+          this.bar.dataZoom[0].end = dataZoom_end
+        }
+      }
+
+    }
+  }, mounted() {
+    var date = new Date()
+    var year = date.getFullYear() //获取完整的年份(4位)
+    var month = date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1).toString() : date.getMonth() + 1 //获取当前月份(0-11,0代表1月)
+    var day = date.getDate() < 10 ? '0' + date.getDate().toString() : date.getDate() //获取当前日(1-31)
+    var last_month = date.getMonth() < 10 ? '0' + date.getMonth().toString() : date.getMonth() //获取当前月份(0-11,0代表1月)
+    this.query.patient_id = 0
+    this.query.end_time = year + '-' + month + '-' + day
+    this.query.start_time = year + '-' + last_month + '-' + day
+    this.query.project_id = 4
+    this.query.item_id = 169
+    this.getCurrentOrgPatients()
+
+    // this.GetPersonQCStatistisData()
+
+
+  }
 }
 </script>
+
 <style lang="scss" scoped>
-.content_top{
-    display: flex;
-    justify-content: space-around;
-    margin-bottom: 20px;
+.tableTitle {
+  font-size: 16px;
+  color: #000;
+  font-weight: bold;
+  margin-bottom: 10px;
+}
+</style>
+<style lang="scss">
+.page_process {
+.el-tabs{
+  margin-bottom:0 !important;
+}
+.el-button--medium {
+  padding: 10px 8px;
+}
+
+.el-form-item {
+  margin-bottom: 0;
+}
+::-webkit-scrollbar{
+  height: 15px !important;
+}
+
 }
-</style>
+</style>

src/xt_pages/Dialysisanalysis/bloodPotassium/potassiumall.vue

@@ -1,262 +1,368 @@
 <template>
-    <div>
-        <!-- <div class="content_top">
-            <div class="block">
-                <span>查询时间:</span>
-                <el-date-picker
-                v-model="time_month"
-                type="month"
-                placeholder="选择月">
-                </el-date-picker>
-            </div>
-            <div>
-                <el-date-picker
-                v-model="stat_time"
-                type="date"
-                placeholder="选择日期">
-                </el-date-picker>
-                <span>-</span>
-                <el-date-picker
-                v-model="end_time"
-                type="date"
-                placeholder="选择日期">
-                </el-date-picker>
-            </div>
-            <div style="width: 200px;">
-                <el-input v-model="input" placeholder="请输入内容"></el-input>
-            </div>
-            <el-button type="primary">查询</el-button>
-        </div> -->
-        
-        <el-row :gutter="20">
-        <el-col :span="5"> 
-          <div class="block">
-            <span>查询时间:</span>
-            <el-date-picker
-            v-model="time_month"
-            type="month"
-            placeholder="选择月">
-            </el-date-picker>
-          </div>
-        </el-col>
-        <el-col :span="8">
-          <div>
-            <el-date-picker
-            v-model="stat_time"
+  <div>
+    <el-row :gutter="25">
+      <el-col :span="5">
+        <div class="block">
+          <span>查询时间:</span>
+          <el-select size="small" v-model="time_type" placeholder="请选择"
+                     style="width:150px;margin-left:10px;" @change="changeItem">
+            <el-option
+              v-for="item,index in times"
+              :key="index"
+              :label="item.label"
+              :value="item.value">
+            </el-option>
+          </el-select>
+        </div>
+      </el-col>
+      <el-col :span="8">
+        <div>
+          <el-date-picker
+            style="width: 200px"
+
+            v-model="start_time"
+            format="yyyy-MM-dd"
+            value-format="yyyy-MM-dd"
             type="date"
+
             placeholder="选择日期">
-            </el-date-picker>
-            <span>-</span>
-            <el-date-picker
+          </el-date-picker>
+          <span>-</span>
+          <el-date-picker
+            style="width: 200px"
             v-model="end_time"
+            format="yyyy-MM-dd"
+            value-format="yyyy-MM-dd"
             type="date"
             placeholder="选择日期">
-            </el-date-picker>
-          </div>
-        </el-col>
-        <el-col :span="3">
-          <div style="width: 200px;">
-            <el-input v-model="input" placeholder="请输入内容"></el-input>
-          </div>
-        </el-col>
-        <el-col :span="2">
-            <el-button type="primary">查询</el-button>
-        </el-col>
-        </el-row>
-        
-        <div class="cell clearfix" style="margin: 20px; font-weight: bold;">
-          <p class="chartTitle">统计图</p>
+          </el-date-picker>
         </div>
-        <div class="echart" id="mychart" :style={width:width,height:height}></div>
-        <div style="width: 80%;margin: auto;">
-            <el-table
-            :data="tableData"
-            :show-summary = true
-            border
-            style="width: 100%;">
-                <el-table-column
-                    prop="date"
-                    align="center"
-                    label="血钾"
-                    >
-                </el-table-column>
-                <el-table-column
-                    prop="name"
-                    
-                    label="人数"
-                    >
-                </el-table-column>
-                <el-table-column
-                    prop="address"
-                    align="center"
-                    label="操作">
-                    <template slot-scope="scope">
-                        <el-button @click="handleClick(scope.row)" style="font-size:16px;"
-                                type="text" >查看详情
-                        </el-button>
-                    </template>
-                </el-table-column>
-            </el-table>
+      </el-col>
+      <el-col :span="5">
+        <div >
+          <el-input disabled v-model="input" placeholder="请输入内容"></el-input>
         </div>
+      </el-col>
+      <el-col :span="3">
+        <el-button type="primary" @click="getData()">查询</el-button>
+      </el-col>
+    </el-row>
+    <div class="cell clearfix" style="margin: 20px; font-weight: bold;">
+      <p class="chartTitle">统计图</p>
+    </div>
+    <div class="echart" id="mychart" :style={width:width,height:height}></div>
+    <div style="width: 80%;margin: auto;">
+      <el-table
+        :data="tableData"
+        border
+        style="width: 100%;">
+        <el-table-column
+          prop="name"
+          align="center"
+          label="血钾"
+        >
+        </el-table-column>
+        <el-table-column
+          prop="count"
+          label="人数"
+        >
+        </el-table-column>
+<!--        <el-table-column-->
+<!--          prop="address"-->
+<!--          align="center"-->
+<!--          label="操作">-->
+<!--          <template slot-scope="scope">-->
+<!--            <el-button @click="handleClick(scope.row)" style="font-size:16px;"-->
+<!--                       type="text">查看详情-->
+<!--            </el-button>-->
+<!--          </template>-->
+<!--        </el-table-column>-->
+      </el-table>
     </div>
+  </div>
 </template>
 <script>
-import * as echarts from "echarts";
-export default{
-    props: {
-   
+import * as echarts from 'echarts'
+import { GetQCStatistisData } from '../../../api/qcd'
+
+const moment = require('moment')
+
+export default {
+  props: {
+
     width: {
       type: String,
-      default: "100%"
+      default: '100%'
     },
     height: {
       type: String,
-      default: "400px"
-    },
-    
+      default: '400px'
+    }
+
   },
-    data() {
-        return {
-            time_month:'',
-            stat_time:'',
-            end_time:'',
-            input:'',
-            myChart: {},
-            pieData : [
-            {
-          value: 463,
-          name: "不达标值患者"
-        },
-        {
-          value: 395,
-          name: "未检查患者"
-        },
-        {
-          value: 157,
-          name: "达标值患者"
-        },
-        // {
-        //   value: 149,
-        //   name: "广东"
-        // },
-        // {
-        //   value: 147,
-        //   name: "湖南"
-        // }
-            
-            ],
-            pieName: [],
-            // myChartStyle:{float: "right", width: "100%", height: "400px"},
-            tableData:[],
-        }
-    },
-    mounted() {
-    this.initDate(); //数据初始化
-    this.initEcharts();
+  data() {
+    return {
+      time_type: 1,
+      times: [
+        { value: 1, label: '本月' },
+        { value: 2, label: '上月' },
+        { value: 3, label: '今年' },
+        { value: 4, label: '上一年' },
+        { value: 5, label: '第一季度' },
+        { value: 6, label: '第二季度' },
+        { value: 7, label: '第三季度' },
+        { value: 8, label: '第四季度' },
+        { value: 9, label: '自定义' }
+
+      ],
+      time_month: '',
+      start_time: new Date(new Date().getFullYear(), new Date().getMonth(), 1).toLocaleDateString('en-CA'),
+      end_time: new Date(new Date().getFullYear(), new Date().getMonth() + 1, 0).toLocaleDateString('en-CA'),
+      input: '',
+      myChart: {},
+      pieData: [],
+      pieName: [],
+      // myChartStyle:{float: "right", width: "100%", height: "400px"},
+      tableData: [],
+      reference:{},
+    }
+  },
+  mounted() {
+    this.getData()
   },
   methods: {
-    initDate() {
-      for (let i = 0; i < this.pieData.length; i++) {
-        this.pieName[i] = this.pieData[i].name;
+    getData() {
+      if(this.start_time.length == 0){
+        this.$message.error("请选择开始时间")
       }
-    },
-    initEcharts() {
-      // 饼图
-      const option = {
-        legend: {
-          // 图例
-          data: this.pieName,
-          left: "10%",
-          top: "30%",
-          orient: "vertical"
-        },
-        color:['#ff7f9f','#fff67f','#1e5feb'],
-        title: {
-          // 设置饼图标题，位置设为顶部居中
-        //   text: "国内院士前五省份图示",
-          top: "0%",
-          left: "center"
-        },
-        series: [
-          {
-            type: "pie",
-            label: {
-              normal : {
-                formatter: '{b}:{c}: ({d}%)',
-                textStyle : {
-                    fontWeight : 'normal',
-                    fontSize : 15,
-                    color : "black"
-                }
-              }
-              // b代表名称，c代表对应值，d代表百分比"{b} : {d}% ({c})" 
+      if(this.end_time.length == 0){
+        this.$message.error("请选择结束时间")
+      }
+      let params = {
+        start_date: this.start_time,
+        end_date: this.end_time,
+        project_id: 4,
+        item_id: 48
+      }
+      this.pieData = []
+      this.tableData = []
+      console.log("~~~~~~~~~~")
+      GetQCStatistisData(params).then(response => {
+        if (response.data.state == 1) {
+          this.reference = response.data.data.reference
+          this.input = response.data.data.reference.range_min + "<=" + response.data.data.reference.item_name + "<=" + response.data.data.reference.range_max
+          let objone = {
+            value:  response.data.data.unusual_total / response.data.data.patient_count,
+            name: '不达标值患者',
+            count:response.data.data.unusual_total,
+          }
+          this.pieData.push(objone)
+          this.tableData.push(objone)
+
+          let objtwo = {
+            value:   response.data.data.normal_total / response.data.data.patient_count,
+            name: '达标值患者',
+            count:response.data.data.normal_total,
+
+          }
+          this.pieData.push(objtwo)
+          this.tableData.push(objtwo)
+
+          let objthree = {
+            value: response.data.data.patient_count / response.data.data.no_check_total,
+            name: '未检查患者',
+            count:response.data.data.no_check_total,
+
+          }
+          this.pieData.push(objthree)
+          this.tableData.push(objthree)
+
+          let objfour = {
+            value: response.data.data.patient_count,
+            name: '合计',
+            count:response.data.data.patient_count,
+          }
+          this.tableData.push(objfour)
+          for (let i = 0; i < this.pieData.length; i++) {
+            this.pieName[i] = this.pieData[i].name
+          }
+          this.myChart = echarts.init(document.getElementById('mychart'))
+          window.addEventListener('resize', () => {
+            this.myChart.resize()
+          })
+          const option = {
+            legend: {
+              // 图例
+              data: this.pieName,
+              left: '10%',
+              top: '30%',
+              orient: 'vertical'
+            },
+            color: ['#ff7f9f', '#fff67f', '#1e5feb'],
+            title: {
+              // 设置饼图标题，位置设为顶部居中
+              //   text: "国内院士前五省份图示",
+              top: '0%',
+              left: 'center'
             },
-            radius: "65%", //饼图半径
-            data: this.pieData,
-            itemStyle : {
-              emphasis: {
-                shadowBlur: 10,
-                shadowOffsetX: 0,
-                shadowColor: 'rgba(0, 0, 0, 0.5)'
+            series: [
+              {
+                type: 'pie',
+                label: {
+                  show: true,
+                  formatter: '{b} : {d}% ({c})'
+                  // b代表名称，c代表对应值，d代表百分比"{b} : {d}% ({c})"
+                },
+                radius: '65%', //饼图半径
+                data: this.pieData
               }
-            }
+            ]
           }
-        ]
-      };
-    //   console.log(this.seriesData);
-      const optionFree = {
-        series: [
-          {
-            data: this.seriesData,
-            type: "line",
-            smooth: true
+          //   console.log(this.seriesData);
+          const optionFree = {
+            series: [
+              {
+                data: this.seriesData,
+                type: 'line',
+                smooth: true
+              }
+            ]
           }
-        ]
-      };
-      this.myChart = echarts.init(document.getElementById("mychart"));
-      this.myChart.setOption(option);
-      //随着屏幕大小调节图表
-      window.addEventListener("resize", () => {
-        this.myChart.resize();
-      });
+          this.myChart = echarts.init(document.getElementById('mychart'))
+          this.myChart.setOption(option)
+        } else {
+          this.$message.error(response.data.msg)
+        }
+      })
+
+    },
+    changeItem(val) {
+      const currentDate = new Date()
+      switch (val) {
+        case 1:
+
+          const startOfMonth = new Date(currentDate.getFullYear(), currentDate.getMonth(), 1).toLocaleDateString('en-CA')
+          const endOfMonth = new Date(currentDate.getFullYear(), currentDate.getMonth() + 1, 0).toLocaleDateString('en-CA')
+
+          this.start_time = startOfMonth
+          this.end_time = endOfMonth
+          this.getData()
+
+          break
+        case 2:
+          // 上月的起始日期和结束日期
+          const startOfLastMonth = new Date(currentDate.getFullYear(), currentDate.getMonth() - 1, 1).toLocaleDateString('en-CA')
+          const endOfLastMonth = new Date(currentDate.getFullYear(), currentDate.getMonth(), 0).toLocaleDateString('en-CA')
+
+          this.start_time = startOfLastMonth
+          this.end_time = endOfLastMonth
+          this.getData()
+
+          break
+        case 3:
+          // 今年的起始日期和结束日期
+          const startOfYear = new Date(currentDate.getFullYear(), 0, 1).toLocaleDateString('en-CA')
+          const endOfYear = new Date(currentDate.getFullYear(), 11, 31).toLocaleDateString('en-CA')
+
+          this.start_time = startOfYear
+          this.end_time = endOfYear
+          this.getData()
+
+          break
+        case 4:
+          // 上一年的起始日期和结束日期
+          const startOfLastYear = new Date(currentDate.getFullYear() - 1, 0, 1).toLocaleDateString('en-CA')
+          const endOfLastYear = new Date(currentDate.getFullYear() - 1, 11, 31).toLocaleDateString('en-CA')
+
+          this.start_time = startOfLastYear
+          this.end_time = endOfLastYear
+          this.getData()
+
+          break
+        case 5:
+          // 第一季度的起始日期和结束日期
+          const startOfFirstQuarter = new Date(currentDate.getFullYear(), 0, 1).toLocaleDateString('en-CA')
+          const endOfFirstQuarter = new Date(currentDate.getFullYear(), 2, 31).toLocaleDateString('en-CA')
+
+          this.start_time = startOfFirstQuarter
+          this.end_time = endOfFirstQuarter
+          this.getData()
+
+          break
+        case 6:
+          // 第二季度的起始日期和结束日期
+          const startOfSecondQuarter = new Date(currentDate.getFullYear(), 3, 1).toLocaleDateString('en-CA')
+          const endOfSecondQuarter = new Date(currentDate.getFullYear(), 5, 30).toLocaleDateString('en-CA')
+
+          this.start_time = startOfSecondQuarter
+          this.end_time = endOfSecondQuarter
+          this.getData()
+
+          break
+        case 7:
+          // 第三季度的起始日期和结束日期
+          const startOfThirdQuarter = new Date(currentDate.getFullYear(), 6, 1).toLocaleDateString('en-CA')
+          const endOfThirdQuarter = new Date(currentDate.getFullYear(), 8, 30).toLocaleDateString('en-CA')
+
+          this.start_time = startOfThirdQuarter
+          this.end_time = endOfThirdQuarter
+          this.getData()
+
+          break
+        case 8:
+          // 第四季度的起始日期和结束日期
+          const startOfFourthQuarter = new Date(currentDate.getFullYear(), 9, 1).toLocaleDateString('en-CA')
+          const endOfFourthQuarter = new Date(currentDate.getFullYear(), 11, 31).toLocaleDateString('en-CA')
+
+          this.start_time = startOfFourthQuarter
+          this.end_time = endOfFourthQuarter
+          this.getData()
+          break
+        case 9:
+          this.start_time = ''
+          this.end_time = ''
+          break
+      }
     },
+
+
     getSummaries(param) {
-        const { columns, data } = param;
-        const sums = [];
-        columns.forEach((column, index) => {
-          if (index === 0) {
-            sums[index] = '总价';
-            return;
-          }
-          const values = data.map(item => Number(item[column.property]));
-          if (!values.every(value => isNaN(value))) {
-            sums[index] = values.reduce((prev, curr) => {
-              const value = Number(curr);
-              if (!isNaN(value)) {
-                return prev + curr;
-              } else {
-                return prev;
-              }
-            }, 0);
-            sums[index] += ' 元';
-          } else {
-            sums[index] = 'N/A';
-          }
-        });
+      const { columns, data } = param
+      const sums = []
+      columns.forEach((column, index) => {
+        if (index === 0) {
+          sums[index] = '总价'
+          return
+        }
+        const values = data.map(item => Number(item[column.property]))
+        if (!values.every(value => isNaN(value))) {
+          sums[index] = values.reduce((prev, curr) => {
+            const value = Number(curr)
+            if (!isNaN(value)) {
+              return prev + curr
+            } else {
+              return prev
+            }
+          }, 0)
+          sums[index] += ' 元'
+        } else {
+          sums[index] = 'N/A'
+        }
+      })
 
-        return sums;
+      return sums
     },
-    handleClick(id){
-        console.log(id);
+    handleClick(id) {
+      console.log(id)
     }
   }
 
 }
 </script>
 <style lang="scss" scoped>
-.content_top{
-    display: flex;
-    justify-content: space-around;
-    color: #1e5feb;
+.content_top {
+  display: flex;
+  justify-content: space-around;
+  color: #1e5feb;
 }
-</style>
+</style>

src/xt_pages/Dialysisanalysis/bloodPotassium/potassiumalone.vue

@@ -1,217 +1,646 @@
 <template>
-    <div>
-       <div class="content_top">
-            <el-autocomplete
-            class="inline-input"
-            v-model="inputValue"
-            :fetch-suggestions="querySearch"
-            :trigger-on-focus="false"
-            placeholder="请输入患者名字或透析号"
-            @select="handleSubmit"
-            ></el-autocomplete>
+  <div class="main-contain">
+    <div class="app-container">
+      <div class="page_process">
+        <new-nav activeName="process"></new-nav>
+        <div class="cell clearfix">
+          <el-form :inline="true">
+            <el-form-item label>
+              <el-autocomplete
+                class="checkSearch"
+                popper-class="my-autocomplete"
+                v-model="search_value"
+                :fetch-suggestions="querySearchAsync"
+                :trigger-on-focus="false"
+                placeholder="请输入病人名字"
+                @select="handleSelect"
+                style="width:160px;"
+              >
+                <i class="el-icon-search el-input__icon" slot="suffix"></i>
+                <template slot-scope="{ item }">
+                  <div class="name">{{ item.name }}</div>
+                </template>
+              </el-autocomplete>
+
+            </el-form-item>
+          </el-form>
+
+          <label class="title">
+            <span class="name">日期查询</span> :
+          </label>
+          <el-date-picker
+            v-model="query.start_time"
+            prefix-icon="el-icon-date"
+            @change="changeTime"
+            :editable="false"
+            style="width: 150px;"
+            type="date"
+            placeholder="选择日期时间"
+            align="right"
+            format="yyyy-MM-dd"
+            value-format="yyyy-MM-dd"
+          ></el-date-picker>
+          <span class>-</span>
+          <el-date-picker
+            v-model="query.end_time"
+            prefix-icon="el-icon-date"
+            @change="changeEndTime"
+            :editable="false"
+            style="width: 150px;"
+            type="date"
+            placeholder="选择日期时间"
+            align="right"
+            format="yyyy-MM-dd"
+            value-format="yyyy-MM-dd"
+          ></el-date-picker>
+
+          <el-button size="small" icon="el-icon-printer" @click="printAction" type="primary">打印
+          </el-button>
+          <el-button size="small" icon="el-icon-printer" @click="exportAction" type="primary">导出
+
+          </el-button>
+        </div>
+
+        <el-container>
+          <div style="width:160px">
+
+            <div class="tableTitle">患者列表</div>
+
+
+            <el-table ref="table" :data="patientsData" border style="width: 100%;" height="500"
+                      :row-style="{ color: '#303133' }"
+                      :header-cell-style="{backgroundColor: 'rgb(245, 247, 250)',color: '#606266'}"
+                      highlight-current-row
+                      @current-change="handleChange">
+              <el-table-column prop="dialysis_no" label="透析号" width="70" align="center">
+                <template slot-scope="scope">{{scope.row.dialysis_no}}</template>
+              </el-table-column>
+              <el-table-column prop="name" label="姓名" width="90" align="center">
+                <template slot-scope="scope">{{ scope.row.name }}</template>
+              </el-table-column>
+            </el-table>
+          </div>
+          <div style="padding-left:10px;flex:1;width:0;">
+            <div class="tableTitle">指标趋势<span style="font-weight:normal">&nbsp;&nbsp;（当前患者: {{patient_name}}）</span></div>
             <div>
-                <span>查询时间:</span>
-                <el-date-picker
-                v-model="stat_time"
-                type="date"
-                placeholder="选择日期">
-                </el-date-picker>
-                <span>-</span>
-                <el-date-picker
-                v-model="end_time"
-                type="date"
-                placeholder="选择日期">
-                </el-date-picker>
-                <el-select v-model="value" placeholder="请选择">
-                    <el-option
-                    v-for="item in options"
-                    :key="item.value"
-                    :label="item.label"
-                    :value="item.value">
-                    </el-option>
-                </el-select>
-                <el-select v-model="value" placeholder="请选择">
-                    <el-option
-                    v-for="item in options"
-                    :key="item.value"
-                    :label="item.label"
-                    :value="item.value">
-                    </el-option>
-                </el-select>
-                <el-button type="primary">查询</el-button>
+              <line-chart :options="chart"></line-chart>
+              <!--              <line-chart :options="bar" v-if="query.statistics_type == 9 || query.statistics_type == 10"></line-chart>-->
+              <!--              <line-chart></line-chart>-->
+
             </div>
+            <div class="tableTitle">统计表</div>
             <div>
-                <el-button type="primary">打印</el-button>
-                <el-button type="primary">导出</el-button>
-            </div>
-       </div>
-       <div style="margin: 20px 0px;">
-        <h2 >患者列表</h2>
-       </div>
-       <div >
-        <el-row :gutter="20">
-            <el-col :span="4">
-              <div class="grid-content bg-purple">
-                <!-- <span style="font-size: 18px;font-weight: bold;display: block;">患者列表</span> -->
-                <!-- <h2>患者列表</h2> -->
-                <el-table
-                :data="tableData"
-                border
-                style="width: 100%">
-                    <el-table-column
-                        align="center"
-                        prop="date"
-                        label="透析号"
-                       >
-                    </el-table-column>
-                    <el-table-column
-                        align="center"
-                        prop="name"
-                        label="姓名"
-                        >
-                    </el-table-column>
-                </el-table>
-              </div>
-            </el-col>
-            <el-col :span="19">
-               <div class="grid-content bg-purple">
-                <div class="echart" id="germychart" style="width:100%;height:400px"></div>
-                <el-table
-                    :data="tableData"
-                    style="width: 100%"
-                    border
-                    align="center"
-                    max-height="250">
-                    <el-table-column
-                    fixed
-                    prop="date"
-                    label="姓名"
-                   >
-                    </el-table-column>
-                    <el-table-column
-                    prop="name"
-                    label="检查日期"
-                    >
-                    </el-table-column>
-                    <el-table-column
-                    prop="province"
-                    label="血钾（mmol/L）"
-                    >
-                    </el-table-column>
-                    
-                </el-table>
-               </div>
-           </el-col>
-        </el-row>
-       </div>
+              <el-table ref="table" :data="tableData" v-loading="loading" border :row-style="{ color: '#303133' }" :header-cell-style="{backgroundColor: 'rgb(245, 247, 250)',color: '#606266'}">
+                <el-table-column label="姓名" align="center">
+                  <template slot-scope="scope">
+                    {{scope.row.name}}
+                  </template>
+                </el-table-column>
+
+                <el-table-column width="100" label="检查日期" align="center">
+                  <template slot-scope="scope">
+                    {{getTime(scope.row.inspect_date)}}
+
+                  </template>
+                </el-table-column>
 
+                <el-table-column width="100" label="血钾" align="center">
+                  <template slot-scope="scope">
+                    {{scope.row.value}}
+                  </template>
+                </el-table-column>
+              </el-table>
+
+
+            </div>
+          </div>
+        </el-container>
+      </div>
     </div>
+  </div>
 </template>
+
+
 <script>
-  import * as echarts from 'echarts'
-export default{
-    // props: {
-    //     width: {
-    //         type: String,
-    //         default: "100%"
-    //     },
-    //     height: {
-    //         type: String,
-    //         default: "400px"
-    //     },
-    
-    // },
-    data() {
-        return {
-            inputValue:'',
-            stat_time:'',
-            end_time:'',
-            value:'',
-            myChart: {},
-            xData: ["Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"], //横坐标
-            opinionData: [23, 24, 18, 25, 27, 28, 25], //人数数据
-            // myChartStyle: { float: "left", width: "100%", height: "400px" },//图表样式
-            tableData:[],
+import echarts from 'echarts'
+import {  uParseTime } from '@/utils/tools'
+import { getCurrentOrgPatients } from '@/api/common/common'
+import {
+  GetDefaultPatient,
+} from '@/api/common/statistics'
+import { PostSearch } from '@/api/patient'
+import { getDataConfig } from '@/utils/data'
+import { GetPersonQCStatistisData } from '../../../api/qcd'
+import LineChart from '../../qcd/components/LineChart.vue'
+
+export default {
+  components: {
+    LineChart
+  },
+  data() {
+    return {
+      pickerOptions: {
+        disabledDate(time) {
+          let threeMonths = new Date(new Date().setFullYear(new Date().getFullYear() - 1)).getTime() - 24 * 3600 * 1000
+          return time.getTime() > Date.now() || time.getTime() < threeMonths
+
         }
-    },
-    created(){
-        
-    },
-    mounted() {
-        // this.$nextTick(function() {
-            this.initEcharts();
-		// })  
-        // this.myChart = echarts.init(document.getElementById("germychart"));
-        //     this.myChart.setOption(option);
-            //随着屏幕大小调节图表
-            window.addEventListener("resize", () => {
-                this.myChart.resize();
-            });
-    },
-    methods:{
-        handleSubmit(){
-            console.log('asdfa');
+      },
+      patient_name:'',
+      percent:[],
+      patientsData: [],
+      tableData: [],
+      loading: false,
+      search_value: '',
+      total: 0,
+      query: {
+        patient_id: '',
+        statistics_type: 1,
+        start_time: '',
+        end_time: '',
+        limit: 10,
+        page: 1
+      },
+      crumbs: [
+        { path: false, name: '科室质控' },
+        { path: false, name: '指标评估统计' },
+        { path: false, name: '透析过程指标统计' }
+      ],
+      tableData1: [],
+      chart: {
+        title: {
+          text: 'ECharts 入门示例'
         },
-        initEcharts() {
-            const option = {
-                xAxis: {
-                    type: 'category',
-                        boundaryGap:true,
-                        axisTick:{
-                            alignWithLabel:true //保证刻度线和标签对齐
-                        },
-                    data: this.xData,
-                    splitNumber:this.xData.length, //纵坐标数
-                    interval:this.xData //强制设置坐标轴分割间隔
-                },
-                yAxis: {
-                    type: 'value',
-                    boundaryGap: true,
-                    splitNumber:4, //纵坐标数
-                    interval:10 //强制设置坐标轴分割间隔
+        tooltip: {},
+        legend: {
+          data: [],
+          left: 0
+        },
+        xAxis: {
+          data: []
+        },
+        yAxis: {
+          axisLabel: {
+            formatter: '{value} %'
+          },
+          show: false
+        },
+        series: [
+          {
+            name: '',
+            type: 'line',
+            data: [],
+            barWidth: 30,
+            label: {
+              normal: {
+                show: true,
+                position: 'top',
+                formatter: (params) => {
+                  if(this.percent.length > 0){
+                    let str = ''
+                    str = params.data + '('+ this.percent[params.dataIndex] +'%)'
+                    return str
+                  }else{
+                    let str = ''
+                    str = params.data
+                    return str
+                  }
+                }
+              }
+            },
+            //配置样式
+            itemStyle: {
+              //通常情况下：
+
+              //每个柱子的颜色即为colorList数组里的每一项，如果柱子数目多于colorList的长度，则柱子颜色循环使用该数组
+              normal: {
+                color: function(params) {
+                  //我这边就两个柱子，大体就两个柱子颜色渐变，所以数组只有两个值，多个颜色就多个值
+                  var colorList = [
+                    ['#A9E0F3', '#9FBDFC'],
+
+                    ['#FFD7C0', '#FF9994']
+                  ]
+
+                  var index = params.dataIndex
+                  if (params.dataIndex >= colorList.length) {
+                    index = params.dataIndex % colorList.length
+                  }
+
+                  return new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+                    { offset: 0, color: colorList[index][0] },
+                    // { offset: 0.5, color: colorList[index][1] },
+                    { offset: 1, color: colorList[index][1] }
+                  ])
                 },
-                legend: {
-                    show: true,
-                    align:'left',//文字在前图标在后
-                    left:'15%',
-                    top:'5%',
-                    data: [{name:'血钾mmol/L'}]
+                lineStyle:{
+                  color:'#409eff' //改变折线颜色
                 },
-                series: [
-                {
-                    data: this.opinionData,
-                    name:'血钾mmol/L',
-                    type: "line",// 类型设置为折线图
-                    symbol: 'circle',
-                    itemStyle: {
-                        normal: {
-                            color: '#409eff', //改变折线点的颜色#a80000
-                            lineStyle: {
-                                color: '#409eff' //改变折线颜色
-                            }
-                        }
-                    },
+                barBorderRadius: [5, 5, 0, 0] //柱状角成椭圆形
+              },
 
-                },
-                
-                ],
-                
-            };
-            this.myChart = echarts.init(document.getElementById("germychart"));
-            this.myChart.setOption(option);
-            //随着屏幕大小调节图表
-            window.addEventListener("resize", () => {
-                this.myChart.resize();
-            });
+              //鼠标悬停时：
+              emphasis: {
+                shadowBlur: 10,
+                shadowOffsetX: 0,
+                shadowColor: 'rgba(0, 0, 0, 0.5)'
+              }
+            }
+          }
+        ],
+        dataZoom: [
+          {
+            // Y轴固定,让内容滚动
+            type: 'slider',
+            show: false,
+            xAxisIndex: [0],
+            start: 1,
+            end: 20, // 设置X轴刻度之间的间隔(根据数据量来调整)
+            zoomLock: true // 锁定区域禁止缩放(鼠标滚动会缩放,所以禁止)
+          },
+          {
+            type: 'inside',
+            xAxisIndex: [0],
+            start: 1,
+            end: 20,
+            zoomLock: true // 锁定区域禁止缩放
+          }
+        ]
+      },
+      bar: {
+        title: {
+          text: 'ECharts 入门示例'
         },
+        tooltip: {},
+        legend: {
+          data: [],
+          left: 0
+        },
+        xAxis: {
+          data: []
+        },
+        yAxis: {
+          axisLabel: {
+            formatter: '{value} %'
+          },
+          show: false
+        },
+        series: [
+          {
+            name: '',
+            type: 'bar',
+            data: [],
+            barWidth: 30,
+            label: {
+              normal: {
+                show: true,
+                position: 'top',
+                formatter: (params) => {
+                  if(this.percent.length > 0){
+                    let str = ''
+                    str = params.data + '('+ this.percent[params.dataIndex] +'%)'
+                    return str
+                  }else{
+                    let str = ''
+                    str = params.data
+                    return str
+                  }
+                }
+              }
+            },
+            //配置样式
+            itemStyle: {
+              //通常情况下：
+
+              //每个柱子的颜色即为colorList数组里的每一项，如果柱子数目多于colorList的长度，则柱子颜色循环使用该数组
+              normal: {
+                color: function(params) {
+                  //我这边就两个柱子，大体就两个柱子颜色渐变，所以数组只有两个值，多个颜色就多个值
+                  var colorList = [
+                    ['#A9E0F3', '#9FBDFC'],
+                    ['#FFD7C0', '#FF9994']
+                  ]
+
+                  var index = params.dataIndex
+                  if (params.dataIndex >= colorList.length) {
+                    index = params.dataIndex % colorList.length
+                  }
+
+                  return new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+                    { offset: 0, color: colorList[index][0] },
+                    // { offset: 0.5, color: colorList[index][1] },
+                    { offset: 1, color: colorList[index][1] }
+                  ])
+                },
+                barBorderRadius: [5, 5, 0, 0] //柱状角成椭圆形
+              },
+
+              //鼠标悬停时：
+              emphasis: {
+                shadowBlur: 10,
+                shadowOffsetX: 0,
+                shadowColor: 'rgba(0, 0, 0, 0.5)'
+              }
+            }
+          }
+        ]
+      }
+
+    }
+  },
+  methods: {
+    printAction(){
+      this.$router.push({
+        path: "/Dialysisanalysis/qualitycontrol/print?patient_id=" + this.query.patient_id+"&project_id="+this.query.project_id+"&item_id="+this.query.item_id+"&start_time="+this.query.start_time+"&end_time="+this.query.end_time
+      });
+
+    },exportAction(){
+      let list = []
+      for (let i = 0; i < this.tableData.length; i++) {
+        let order = this.tableData[i]
+        let name = order.name
+        let value = order.value
+        let inspect_date = order.inspect_date
+
+        let obj = {
+          '姓名': name,
+          '数值': value,
+          '日期': inspect_date,
+        }
+        list.push(obj)
+      }
+      import('@/vendor/Export2Excel').then(excel => {
+        const tHeader = ['姓名', '数值', '日期']
+        const filterVal = ['姓名', '数值', '日期']
+        const data = this.formatJson(filterVal, list)
+        excel.export_json_to_excel1({
+          header: tHeader,
+          data,
+          filename: '明细',
+          ref: this.$refs['table'].$el
+        })
+      })
+    },
+    changeProject(val) {
+      this.query.statistics_type = val
+      this.query.page = 1
+      this.GetPersonQCStatistisData(this.query)
+      this.GetInspectionCheckIndexTableData(this.query)
+
+    },
+    handleChange(val) {
+      this.query.patient_id = val.id
+      this.query.page = 1
+      this.patient_name = val.name
+      this.GetPersonQCStatistisData(this.query)
+      this.GetInspectionCheckIndexTableData(this.query)
+    },
+    handleSizeChange(limit) {
+      this.query.limit = limit
+      this.GetInspectionCheckIndexTableData(this.query)
+
+    },
+    handleCurrentChange(page) {
+      this.query.page = page
+      this.GetPersonQCStatistisData(this.query)
+    },formatJson(filterVal, jsonData) {
+      return jsonData.map(v => filterVal.map(j => v[j]))
+    },
+    changeTime(val) {
+      var time = this.getTimestamp(val) - this.getTimestamp(this.query.end_time)
+      if (time > 0) {
+        this.$message.error('结束时间不能小于开始时间')
+        this.query.start_time = ''
+      } else {
+        // this.getDialysisList()
+        this.query.page = 1
+        this.GetPersonQCStatistisData(this.query)
+        this.GetInspectionCheckIndexTableData(this.query)
+
+      }
+
+    },
+    changeEndTime(val) {
+      var time =
+        this.getTimestamp(val) - this.getTimestamp(this.query.start_time)
+      if (time < 0) {
+        this.$message.error('结束时间不能小于开始时间')
+        this.query.end_time = ''
+      } else {
+        this.query.page = 1
+        this.GetPersonQCStatistisData(this.query)
+        this.GetInspectionCheckIndexTableData(this.query)
+
+      }
+    },
+    getTimestamp(time) {
+      // 把时间日期转成时间戳
+      return new Date(time).getTime() / 1000
+    },
+    QueryOperaById: function(val) {
+      let vascular_access_desc_name = ''
+      let vascular_access_desc = getDataConfig(
+        'hemodialysis',
+        'vascular_access_desc'
+      )
+      for (let i = 0; i < vascular_access_desc.length; i++) {
+        if (vascular_access_desc[i].id == val) {
+          vascular_access_desc_name = vascular_access_desc[i].name
+        }
+      }
+
+      return vascular_access_desc_name
     },
-    
+    GetAnticoagulantById: function(val) {
+      let anticoagulan_name = ''
+      var anticoagulantsConfitTwo = this.$store.getters.anticoagulants_confit
+      let anticoagulant = anticoagulantsConfitTwo
+      for (let keys in anticoagulant) {
+        if (anticoagulant[keys].id == val) {
+          anticoagulan_name = anticoagulant[keys].name
+        }
+      }
+      return anticoagulan_name
+    },
+    getModeName(mode_id) {
+      return this.$store.getters.treatment_mode[mode_id] != undefined ? this.$store.getters.treatment_mode[mode_id].name : ''
+    },  getTime(val) {
+      if(val == "" || val == undefined){
+        return ""
+      }else {
+        return uParseTime(val, '{y}-{m}-{d}')
+      }
+    },
+    GetInspectionCheckIndexTableData(params) {
+      this.loading = true
+      GetPersonQCStatistisData(params)
+        .then(rs => {
+          var resp = rs.data
+          console.log("resp=====",resp)
+          if (resp.state == 1) {
+            this.loading = false
+            this.tableData = []
+            for (let i = 0; i < resp.data.inspections.length; i++) {
+              let obj = {
+                name:resp.data.patient.name,
+                value:resp.data.inspections[i].inspect_value,
+                inspect_date:resp.data.inspections[i].inspect_date
+              }
+              this.tableData.push(obj)
+            }
+            this.total = resp.data.total
+
+          } else {
+            this.loading = false
+          }
+        })
+        .catch(error => {
+
+        })
+    },
+    GetPersonQCStatistisData(params) {
+      this.chart.xAxis.data = []
+      this.chart.series[0].data = []
+      this.bar.xAxis.data = []
+      this.bar.series[0].data = []
+      this.percent = []
+      GetPersonQCStatistisData(params)
+        .then(rs => {
+          var resp = rs.data
+          if (resp.state == 1) {
+            console.log(resp.data.inspections)
+            for (let i = 0; i < resp.data.inspections.length; i++) {
+              this.chart.xAxis.data.push(this.getTime(resp.data.inspections[i].inspect_date))
+              this.chart.series[0].data.push(resp.data.inspections[i].inspect_value)
+            }
+            console.log(this.chart.xAxis.data)
+            console.log( this.chart.series[0].data)
+
+            this.getArrLength(this.chart.xAxis.data,1)
+          } else {
+
+          }
+        })
+        .catch(error => {
+        })
+    },
+    handleSelect(val) {
+      this.query.patient_id = val.id
+      this.query.page = 1
+      this.patient_name = val.name
+      for (let i = 0;i < this.patientsData.length; i++){
+        if (this.patientsData[i].id == val.id){
+          this.$refs.table.setCurrentRow(this.patientsData[i])
+        }
+      }
+
+
+    },
+    querySearchAsync(keyword, cb) {
+      let key = ''
+      if (keyword != undefined) {
+        key = keyword
+      }
+      let searchArray = []
+      PostSearch(key).then(response => {
+        if (response.data.state == 1) {
+          searchArray = response.data.data.patient
+          cb(searchArray)
+        } else {
+          cb([])
+        }
+      })
+    },
+    chooseWay(way) {
+      this.wayType = way
+    }, getCurrentOrgPatients() {
+      getCurrentOrgPatients().then(response => {
+        if (response.data.state == 1) {
+          var patients = response.data.data.patients
+          this.patientsData = patients
+          this.GetDefaultPatient()
+        }
+      })
+    }, GetDefaultPatient() {
+      GetDefaultPatient().then(response => {
+        if (response.data.state == 1) {
+          var patient = response.data.data.patient
+          for (let i = 0;i < this.patientsData.length; i++){
+            if (this.patientsData[i].id == patient.id){
+              this.patient_name = this.patientsData[i].name
+              this.$refs.table.setCurrentRow(this.patientsData[i])
+            }
+          }
+          this.query.patient_id = patient.id
+          this.GetPersonQCStatistisData(this.query)
+
+        }
+      })
+
+    },
+    getArrLength(result,type){
+      if(type == 1){
+        if(result.length > 10){
+          var dataZoom_end = (10/result.length)*100;
+          this.chart.dataZoom[0].end = dataZoom_end
+        }else{
+          var dataZoom_end = 100;
+          this.chart.dataZoom[0].end = dataZoom_end
+        }
+      }else if(type == 2){
+        if(result.length > 10){
+          var dataZoom_end = (10/result.length)*100;
+          this.bar.dataZoom[0].end = dataZoom_end
+        }else{
+          var dataZoom_end = 100;
+          this.bar.dataZoom[0].end = dataZoom_end
+        }
+      }
+
+    }
+  }, mounted() {
+    var date = new Date()
+    var year = date.getFullYear() //获取完整的年份(4位)
+    var month = date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1).toString() : date.getMonth() + 1 //获取当前月份(0-11,0代表1月)
+    var day = date.getDate() < 10 ? '0' + date.getDate().toString() : date.getDate() //获取当前日(1-31)
+    var last_month = date.getMonth() < 10 ? '0' + date.getMonth().toString() : date.getMonth() //获取当前月份(0-11,0代表1月)
+    this.query.patient_id = 0
+    this.query.end_time = year + '-' + month + '-' + day
+    this.query.start_time = year + '-' + last_month + '-' + day
+    this.query.project_id = 4
+    this.query.item_id = 48
+    this.getCurrentOrgPatients()
+
+    // this.GetPersonQCStatistisData()
+
+
+  }
 }
 </script>
+
 <style lang="scss" scoped>
-.content_top{
-    display: flex;
-    justify-content: space-around;
-    margin-bottom: 20px;
+.tableTitle {
+  font-size: 16px;
+  color: #000;
+  font-weight: bold;
+  margin-bottom: 10px;
+}
+</style>
+<style lang="scss">
+.page_process {
+.el-tabs{
+  margin-bottom:0 !important;
+}
+.el-button--medium {
+  padding: 10px 8px;
+}
+
+.el-form-item {
+  margin-bottom: 0;
+}
+::-webkit-scrollbar{
+  height: 15px !important;
+}
+
 }
-</style>
+</style>

src/xt_pages/Dialysisanalysis/calcium/calciumall.vue

@@ -1,262 +1,369 @@
 <template>
-    <div>
-        <!-- <div class="content_top">
-            <div class="block">
-                <span>查询时间:</span>
-                <el-date-picker
-                v-model="time_month"
-                type="month"
-                placeholder="选择月">
-                </el-date-picker>
-            </div>
-            <div>
-                <el-date-picker
-                v-model="stat_time"
-                type="date"
-                placeholder="选择日期">
-                </el-date-picker>
-                <span>-</span>
-                <el-date-picker
-                v-model="end_time"
-                type="date"
-                placeholder="选择日期">
-                </el-date-picker>
-            </div>
-            <div style="width: 200px;">
-                <el-input v-model="input" placeholder="请输入内容"></el-input>
-            </div>
-            <el-button type="primary">查询</el-button>
-        </div> -->
-        
-        <el-row :gutter="20">
-        <el-col :span="5"> 
-          <div class="block">
-            <span>查询时间:</span>
-            <el-date-picker
-            v-model="time_month"
-            type="month"
-            placeholder="选择月">
-            </el-date-picker>
-          </div>
-        </el-col>
-        <el-col :span="8">
-          <div>
-            <el-date-picker
-            v-model="stat_time"
+  <div>
+    <el-row :gutter="25">
+      <el-col :span="5">
+        <div class="block">
+          <span>查询时间:</span>
+          <el-select size="small" v-model="time_type" placeholder="请选择"
+                     style="width:150px;margin-left:10px;" @change="changeItem">
+            <el-option
+              v-for="item,index in times"
+              :key="index"
+              :label="item.label"
+              :value="item.value">
+            </el-option>
+          </el-select>
+        </div>
+      </el-col>
+      <el-col :span="8">
+        <div>
+          <el-date-picker
+            style="width: 200px"
+
+            v-model="start_time"
+            format="yyyy-MM-dd"
+            value-format="yyyy-MM-dd"
             type="date"
+
             placeholder="选择日期">
-            </el-date-picker>
-            <span>-</span>
-            <el-date-picker
+          </el-date-picker>
+          <span>-</span>
+          <el-date-picker
+            style="width: 200px"
             v-model="end_time"
+            format="yyyy-MM-dd"
+            value-format="yyyy-MM-dd"
             type="date"
             placeholder="选择日期">
-            </el-date-picker>
-          </div>
-        </el-col>
-        <el-col :span="3">
-          <div style="width: 200px;">
-            <el-input v-model="input" placeholder="请输入内容"></el-input>
-          </div>
-        </el-col>
-        <el-col :span="2">
-            <el-button type="primary">查询</el-button>
-        </el-col>
-        </el-row>
-
-        <div class="cell clearfix" style="margin: 20px; font-weight: bold;">
-          <p class="chartTitle">统计图</p>
+          </el-date-picker>
         </div>
-        <div class="echart" id="mychart" :style={width:width,height:height}></div>
-        <div style="width: 80%;margin: auto;">
-            <el-table
-            :data="tableData"
-            :show-summary = true
-            border
-            style="width: 100%;">
-                <el-table-column
-                    prop="date"
-                    align="center"
-                    label="钙"
-                    >
-                </el-table-column>
-                <el-table-column
-                    prop="name"
-                    
-                    label="人数"
-                    >
-                </el-table-column>
-                <el-table-column
-                    prop="address"
-                    align="center"
-                    label="操作">
-                    <template slot-scope="scope">
-                        <el-button @click="handleClick(scope.row)" style="font-size:16px;"
-                                type="text" >查看详情
-                        </el-button>
-                    </template>
-                </el-table-column>
-            </el-table>
+      </el-col>
+      <el-col :span="5">
+        <div >
+          <el-input disabled v-model="input" placeholder="请输入内容"></el-input>
         </div>
+      </el-col>
+      <el-col :span="3">
+        <el-button type="primary" @click="getData()">查询</el-button>
+      </el-col>
+    </el-row>
+    <div class="cell clearfix" style="margin: 20px; font-weight: bold;">
+      <p class="chartTitle">统计图</p>
+    </div>
+    <div class="echart" id="mychart" :style={width:width,height:height}></div>
+    <div style="width: 80%;margin: auto;">
+      <el-table
+        :data="tableData"
+        border
+        style="width: 100%;">
+        <el-table-column
+          prop="name"
+          align="center"
+          label="钙"
+        >
+        </el-table-column>
+        <el-table-column
+          prop="count"
+          label="人数"
+        >
+        </el-table-column>
+<!--        <el-table-column-->
+<!--          prop="address"-->
+<!--          align="center"-->
+<!--          label="操作">-->
+<!--          <template slot-scope="scope">-->
+<!--            <el-button @click="handleClick(scope.row)" style="font-size:16px;"-->
+<!--                       type="text">查看详情-->
+<!--            </el-button>-->
+<!--          </template>-->
+<!--        </el-table-column>-->
+      </el-table>
     </div>
+  </div>
 </template>
 <script>
-import * as echarts from "echarts";
-export default{
-    props: {
-   
+import * as echarts from 'echarts'
+import { GetQCStatistisData } from '../../../api/qcd'
+
+const moment = require('moment')
+
+export default {
+  props: {
+
     width: {
       type: String,
-      default: "100%"
+      default: '100%'
     },
     height: {
       type: String,
-      default: "400px"
-    },
-    
+      default: '400px'
+    }
+
   },
-    data() {
-        return {
-            time_month:'',
-            stat_time:'',
-            end_time:'',
-            input:'',
-            myChart: {},
-            pieData : [
-            {
-          value: 463,
-          name: "不达标值患者"
-        },
-        {
-          value: 395,
-          name: "未检查患者"
-        },
-        {
-          value: 157,
-          name: "达标值患者"
-        },
-        // {
-        //   value: 149,
-        //   name: "广东"
-        // },
-        // {
-        //   value: 147,
-        //   name: "湖南"
-        // }
-            
-            ],
-            pieName: [],
-            // myChartStyle:{float: "right", width: "100%", height: "400px"},
-            tableData:[],
-        }
-    },
-    mounted() {
-    this.initDate(); //数据初始化
-    this.initEcharts();
+  data() {
+    return {
+      time_type: 1,
+      times: [
+        { value: 1, label: '本月' },
+        { value: 2, label: '上月' },
+        { value: 3, label: '今年' },
+        { value: 4, label: '上一年' },
+        { value: 5, label: '第一季度' },
+        { value: 6, label: '第二季度' },
+        { value: 7, label: '第三季度' },
+        { value: 8, label: '第四季度' },
+        { value: 9, label: '自定义' }
+
+      ],
+      time_month: '',
+      start_time: new Date(new Date().getFullYear(), new Date().getMonth(), 1).toLocaleDateString('en-CA'),
+      end_time: new Date(new Date().getFullYear(), new Date().getMonth() + 1, 0).toLocaleDateString('en-CA'),
+      input: '',
+      myChart: {},
+      pieData: [],
+      pieName: [],
+      // myChartStyle:{float: "right", width: "100%", height: "400px"},
+      tableData: [],
+      reference:{},
+    }
+  },
+  mounted() {
+    this.getData()
   },
   methods: {
-    initDate() {
-      for (let i = 0; i < this.pieData.length; i++) {
-        this.pieName[i] = this.pieData[i].name;
+    getData() {
+      if(this.start_time.length == 0){
+        this.$message.error("请选择开始时间")
       }
-    },
-    initEcharts() {
-      // 饼图
-      const option = {
-        legend: {
-          // 图例
-          data: this.pieName,
-          left: "10%",
-          top: "30%",
-          orient: "vertical"
-        },
-        color:['#ff7f9f','#fff67f','#1e5feb'],
-        title: {
-          // 设置饼图标题，位置设为顶部居中
-        //   text: "国内院士前五省份图示",
-          top: "0%",
-          left: "center"
-        },
-        series: [
-          {
-            type: "pie",
-            label: {
-              normal : {
-                formatter: '{b}:{c}: ({d}%)',
-                textStyle : {
-                    fontWeight : 'normal',
-                    fontSize : 15,
-                    color : "black"
-                }
-              }
-              // b代表名称，c代表对应值，d代表百分比"{b} : {d}% ({c})" 
+      if(this.end_time.length == 0){
+        this.$message.error("请选择结束时间")
+      }
+      let params = {
+        start_date: this.start_time,
+        end_date: this.end_time,
+        project_id: 4,
+        item_id: 289
+      }
+      this.pieData = []
+      this.tableData = []
+      console.log("~~~~~~~~~~")
+      GetQCStatistisData(params).then(response => {
+        if (response.data.state == 1) {
+          this.reference = response.data.data.reference
+
+          this.input = response.data.data.reference.range_min + "<=" + response.data.data.reference.item_name + "<=" + response.data.data.reference.range_max
+          let objone = {
+            value:  response.data.data.unusual_total / response.data.data.patient_count,
+            name: '不达标值患者',
+            count:response.data.data.unusual_total,
+          }
+          this.pieData.push(objone)
+          this.tableData.push(objone)
+
+          let objtwo = {
+            value:   response.data.data.normal_total / response.data.data.patient_count,
+            name: '达标值患者',
+            count:response.data.data.normal_total,
+
+          }
+          this.pieData.push(objtwo)
+          this.tableData.push(objtwo)
+
+          let objthree = {
+            value: response.data.data.patient_count / response.data.data.no_check_total,
+            name: '未检查患者',
+            count:response.data.data.no_check_total,
+
+          }
+          this.pieData.push(objthree)
+          this.tableData.push(objthree)
+
+          let objfour = {
+            value: response.data.data.patient_count,
+            name: '合计',
+            count:response.data.data.patient_count,
+          }
+          this.tableData.push(objfour)
+          for (let i = 0; i < this.pieData.length; i++) {
+            this.pieName[i] = this.pieData[i].name
+          }
+          this.myChart = echarts.init(document.getElementById('mychart'))
+          window.addEventListener('resize', () => {
+            this.myChart.resize()
+          })
+          const option = {
+            legend: {
+              // 图例
+              data: this.pieName,
+              left: '10%',
+              top: '30%',
+              orient: 'vertical'
+            },
+            color: ['#ff7f9f', '#fff67f', '#1e5feb'],
+            title: {
+              // 设置饼图标题，位置设为顶部居中
+              //   text: "国内院士前五省份图示",
+              top: '0%',
+              left: 'center'
             },
-            radius: "65%", //饼图半径
-            data: this.pieData,
-            itemStyle : {
-              emphasis: {
-                shadowBlur: 10,
-                shadowOffsetX: 0,
-                shadowColor: 'rgba(0, 0, 0, 0.5)'
+            series: [
+              {
+                type: 'pie',
+                label: {
+                  show: true,
+                  formatter: '{b} : {d}% ({c})'
+                  // b代表名称，c代表对应值，d代表百分比"{b} : {d}% ({c})"
+                },
+                radius: '65%', //饼图半径
+                data: this.pieData
               }
-            }
+            ]
           }
-        ]
-      };
-    //   console.log(this.seriesData);
-      const optionFree = {
-        series: [
-          {
-            data: this.seriesData,
-            type: "line",
-            smooth: true
+          //   console.log(this.seriesData);
+          const optionFree = {
+            series: [
+              {
+                data: this.seriesData,
+                type: 'line',
+                smooth: true
+              }
+            ]
           }
-        ]
-      };
-      this.myChart = echarts.init(document.getElementById("mychart"));
-      this.myChart.setOption(option);
-      //随着屏幕大小调节图表
-      window.addEventListener("resize", () => {
-        this.myChart.resize();
-      });
+          this.myChart = echarts.init(document.getElementById('mychart'))
+          this.myChart.setOption(option)
+        } else {
+          this.$message.error(response.data.msg)
+        }
+      })
+
+    },
+    changeItem(val) {
+      const currentDate = new Date()
+      switch (val) {
+        case 1:
+
+          const startOfMonth = new Date(currentDate.getFullYear(), currentDate.getMonth(), 1).toLocaleDateString('en-CA')
+          const endOfMonth = new Date(currentDate.getFullYear(), currentDate.getMonth() + 1, 0).toLocaleDateString('en-CA')
+
+          this.start_time = startOfMonth
+          this.end_time = endOfMonth
+          this.getData()
+
+          break
+        case 2:
+          // 上月的起始日期和结束日期
+          const startOfLastMonth = new Date(currentDate.getFullYear(), currentDate.getMonth() - 1, 1).toLocaleDateString('en-CA')
+          const endOfLastMonth = new Date(currentDate.getFullYear(), currentDate.getMonth(), 0).toLocaleDateString('en-CA')
+
+          this.start_time = startOfLastMonth
+          this.end_time = endOfLastMonth
+          this.getData()
+
+          break
+        case 3:
+          // 今年的起始日期和结束日期
+          const startOfYear = new Date(currentDate.getFullYear(), 0, 1).toLocaleDateString('en-CA')
+          const endOfYear = new Date(currentDate.getFullYear(), 11, 31).toLocaleDateString('en-CA')
+
+          this.start_time = startOfYear
+          this.end_time = endOfYear
+          this.getData()
+
+          break
+        case 4:
+          // 上一年的起始日期和结束日期
+          const startOfLastYear = new Date(currentDate.getFullYear() - 1, 0, 1).toLocaleDateString('en-CA')
+          const endOfLastYear = new Date(currentDate.getFullYear() - 1, 11, 31).toLocaleDateString('en-CA')
+
+          this.start_time = startOfLastYear
+          this.end_time = endOfLastYear
+          this.getData()
+
+          break
+        case 5:
+          // 第一季度的起始日期和结束日期
+          const startOfFirstQuarter = new Date(currentDate.getFullYear(), 0, 1).toLocaleDateString('en-CA')
+          const endOfFirstQuarter = new Date(currentDate.getFullYear(), 2, 31).toLocaleDateString('en-CA')
+
+          this.start_time = startOfFirstQuarter
+          this.end_time = endOfFirstQuarter
+          this.getData()
+
+          break
+        case 6:
+          // 第二季度的起始日期和结束日期
+          const startOfSecondQuarter = new Date(currentDate.getFullYear(), 3, 1).toLocaleDateString('en-CA')
+          const endOfSecondQuarter = new Date(currentDate.getFullYear(), 5, 30).toLocaleDateString('en-CA')
+
+          this.start_time = startOfSecondQuarter
+          this.end_time = endOfSecondQuarter
+          this.getData()
+
+          break
+        case 7:
+          // 第三季度的起始日期和结束日期
+          const startOfThirdQuarter = new Date(currentDate.getFullYear(), 6, 1).toLocaleDateString('en-CA')
+          const endOfThirdQuarter = new Date(currentDate.getFullYear(), 8, 30).toLocaleDateString('en-CA')
+
+          this.start_time = startOfThirdQuarter
+          this.end_time = endOfThirdQuarter
+          this.getData()
+
+          break
+        case 8:
+          // 第四季度的起始日期和结束日期
+          const startOfFourthQuarter = new Date(currentDate.getFullYear(), 9, 1).toLocaleDateString('en-CA')
+          const endOfFourthQuarter = new Date(currentDate.getFullYear(), 11, 31).toLocaleDateString('en-CA')
+
+          this.start_time = startOfFourthQuarter
+          this.end_time = endOfFourthQuarter
+          this.getData()
+          break
+        case 9:
+          this.start_time = ''
+          this.end_time = ''
+          break
+      }
     },
+
+
     getSummaries(param) {
-        const { columns, data } = param;
-        const sums = [];
-        columns.forEach((column, index) => {
-          if (index === 0) {
-            sums[index] = '总价';
-            return;
-          }
-          const values = data.map(item => Number(item[column.property]));
-          if (!values.every(value => isNaN(value))) {
-            sums[index] = values.reduce((prev, curr) => {
-              const value = Number(curr);
-              if (!isNaN(value)) {
-                return prev + curr;
-              } else {
-                return prev;
-              }
-            }, 0);
-            sums[index] += ' 元';
-          } else {
-            sums[index] = 'N/A';
-          }
-        });
+      const { columns, data } = param
+      const sums = []
+      columns.forEach((column, index) => {
+        if (index === 0) {
+          sums[index] = '总价'
+          return
+        }
+        const values = data.map(item => Number(item[column.property]))
+        if (!values.every(value => isNaN(value))) {
+          sums[index] = values.reduce((prev, curr) => {
+            const value = Number(curr)
+            if (!isNaN(value)) {
+              return prev + curr
+            } else {
+              return prev
+            }
+          }, 0)
+          sums[index] += ' 元'
+        } else {
+          sums[index] = 'N/A'
+        }
+      })
 
-        return sums;
+      return sums
     },
-    handleClick(id){
-        console.log(id);
+    handleClick(id) {
+      console.log(id)
     }
   }
 
 }
 </script>
 <style lang="scss" scoped>
-.content_top{
-    display: flex;
-    justify-content: space-around;
-    color: #1e5feb;
+.content_top {
+  display: flex;
+  justify-content: space-around;
+  color: #1e5feb;
 }
-</style>
+</style>

src/xt_pages/Dialysisanalysis/calcium/calciumalone.vue

@@ -1,217 +1,649 @@
 <template>
-    <div>
-       <div class="content_top">
-            <el-autocomplete
-            class="inline-input"
-            v-model="inputValue"
-            :fetch-suggestions="querySearch"
-            :trigger-on-focus="false"
-            placeholder="请输入患者名字或透析号"
-            @select="handleSubmit"
-            ></el-autocomplete>
+  <div class="main-contain">
+    <div class="app-container">
+      <div class="page_process">
+        <new-nav activeName="process"></new-nav>
+        <div class="cell clearfix">
+          <el-form :inline="true">
+            <el-form-item label>
+              <el-autocomplete
+                class="checkSearch"
+                popper-class="my-autocomplete"
+                v-model="search_value"
+                :fetch-suggestions="querySearchAsync"
+                :trigger-on-focus="false"
+                placeholder="请输入病人名字"
+                @select="handleSelect"
+                style="width:160px;"
+              >
+                <i class="el-icon-search el-input__icon" slot="suffix"></i>
+                <template slot-scope="{ item }">
+                  <div class="name">{{ item.name }}</div>
+                </template>
+              </el-autocomplete>
+
+            </el-form-item>
+          </el-form>
+
+          <label class="title">
+            <span class="name">日期查询</span> :
+          </label>
+          <el-date-picker
+            v-model="query.start_time"
+            prefix-icon="el-icon-date"
+            @change="changeTime"
+            :editable="false"
+            style="width: 150px;"
+            type="date"
+            placeholder="选择日期时间"
+            align="right"
+            format="yyyy-MM-dd"
+            value-format="yyyy-MM-dd"
+          ></el-date-picker>
+          <span class>-</span>
+          <el-date-picker
+            v-model="query.end_time"
+            prefix-icon="el-icon-date"
+            @change="changeEndTime"
+            :editable="false"
+            style="width: 150px;"
+            type="date"
+            placeholder="选择日期时间"
+            align="right"
+            format="yyyy-MM-dd"
+            value-format="yyyy-MM-dd"
+          ></el-date-picker>
+
+          <el-button size="small" icon="el-icon-printer" @click="printAction" type="primary">打印
+          </el-button>
+          <el-button size="small" icon="el-icon-printer" @click="exportAction" type="primary">导出
+
+          </el-button>
+        </div>
+
+        <el-container>
+          <div style="width:160px">
+
+            <div class="tableTitle">患者列表</div>
+
+
+            <el-table ref="table" :data="patientsData" border style="width: 100%;" height="500"
+                      :row-style="{ color: '#303133' }"
+                      :header-cell-style="{backgroundColor: 'rgb(245, 247, 250)',color: '#606266'}"
+                      highlight-current-row
+                      @current-change="handleChange">
+              <el-table-column prop="dialysis_no" label="透析号" width="70" align="center">
+                <template slot-scope="scope">{{scope.row.dialysis_no}}</template>
+              </el-table-column>
+              <el-table-column prop="name" label="姓名" width="90" align="center">
+                <template slot-scope="scope">{{ scope.row.name }}</template>
+              </el-table-column>
+            </el-table>
+          </div>
+          <div style="padding-left:10px;flex:1;width:0;">
+            <div class="tableTitle">指标趋势<span style="font-weight:normal">&nbsp;&nbsp;（当前患者: {{patient_name}}）</span></div>
             <div>
-                <span>查询时间:</span>
-                <el-date-picker
-                v-model="stat_time"
-                type="date"
-                placeholder="选择日期">
-                </el-date-picker>
-                <span>-</span>
-                <el-date-picker
-                v-model="end_time"
-                type="date"
-                placeholder="选择日期">
-                </el-date-picker>
-                <el-select v-model="value" placeholder="请选择">
-                    <el-option
-                    v-for="item in options"
-                    :key="item.value"
-                    :label="item.label"
-                    :value="item.value">
-                    </el-option>
-                </el-select>
-                <el-select v-model="value" placeholder="请选择">
-                    <el-option
-                    v-for="item in options"
-                    :key="item.value"
-                    :label="item.label"
-                    :value="item.value">
-                    </el-option>
-                </el-select>
-                <el-button type="primary">查询</el-button>
+              <line-chart :options="chart"
+                          v-if="query.statistics_type != 9 && query.statistics_type != 10"></line-chart>
+              <line-chart :options="bar" v-if="query.statistics_type == 9 || query.statistics_type == 10"></line-chart>
+
             </div>
+            <div class="tableTitle">统计表</div>
             <div>
-                <el-button type="primary">打印</el-button>
-                <el-button type="primary">导出</el-button>
-            </div>
-       </div>
-       <div style="margin: 20px 0px;">
-        <h2 >患者列表</h2>
-       </div>
-       <div >
-        <el-row :gutter="20">
-            <el-col :span="4">
-              <div class="grid-content bg-purple">
-                <!-- <span style="font-size: 18px;font-weight: bold;display: block;">患者列表</span> -->
-                <!-- <h2>患者列表</h2> -->
-                <el-table
-                :data="tableData"
-                border
-                style="width: 100%">
-                    <el-table-column
-                        align="center"
-                        prop="date"
-                        label="透析号"
-                       >
-                    </el-table-column>
-                    <el-table-column
-                        align="center"
-                        prop="name"
-                        label="姓名"
-                        >
-                    </el-table-column>
-                </el-table>
-              </div>
-            </el-col>
-            <el-col :span="19">
-               <div class="grid-content bg-purple">
-                <div class="echart" id="germychart" style="width:100%;height:400px"></div>
-                <el-table
-                    :data="tableData"
-                    style="width: 100%"
-                    border
-                    align="center"
-                    max-height="250">
-                    <el-table-column
-                    fixed
-                    prop="date"
-                    label="姓名"
-                   >
-                    </el-table-column>
-                    <el-table-column
-                    prop="name"
-                    label="检查日期"
-                    >
-                    </el-table-column>
-                    <el-table-column
-                    prop="province"
-                    label="钙（mmol/L）"
-                    >
-                    </el-table-column>
-                    
-                </el-table>
-               </div>
-           </el-col>
-        </el-row>
-       </div>
+              <el-table ref="table" :data="tableData" v-loading="loading" border :row-style="{ color: '#303133' }" :header-cell-style="{backgroundColor: 'rgb(245, 247, 250)',color: '#606266'}">
+                <el-table-column label="姓名" align="center">
+                  <template slot-scope="scope">
+                  </template>
+                </el-table-column>
+
+                <el-table-column width="100" label="检查日期" align="center">
+                  <template slot-scope="scope">
+                  </template>
+                </el-table-column>
 
+                <el-table-column width="100" label="钙" align="center">
+                  <template slot-scope="scope">
+                  </template>
+                </el-table-column>
+              </el-table>
+
+              <el-pagination
+                align="right"
+                @size-change="handleSizeChange"
+                @current-change="handleCurrentChange"
+                :current-page="query.page"
+                :page-sizes="[10, 20, 50, 100]"
+                :page-size="10"
+                background
+                style="margin-top:20px;"
+                layout="total, sizes, prev, pager, next, jumper"
+                :total="total"
+              ></el-pagination>
+            </div>
+          </div>
+        </el-container>
+      </div>
     </div>
+  </div>
 </template>
+
+
 <script>
-  import * as echarts from 'echarts'
-export default{
-    // props: {
-    //     width: {
-    //         type: String,
-    //         default: "100%"
-    //     },
-    //     height: {
-    //         type: String,
-    //         default: "400px"
-    //     },
-    
-    // },
-    data() {
-        return {
-            inputValue:'',
-            stat_time:'',
-            end_time:'',
-            value:'',
-            myChart: {},
-            xData: ["Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"], //横坐标
-            opinionData: [23, 24, 18, 25, 27, 28, 25], //人数数据
-            // myChartStyle: { float: "left", width: "100%", height: "400px" },//图表样式
-            tableData:[],
+import echarts from 'echarts'
+// import LineChart from '../../qcd/components/LineChart'
+import {  uParseTime } from '@/utils/tools'
+import { getCurrentOrgPatients } from '@/api/common/common'
+import {
+  GetDefaultPatient,
+} from '@/api/common/statistics'
+import { PostSearch } from '@/api/patient'
+import { getDataConfig } from '@/utils/data'
+import { GetPersonQCStatistisData } from '../../../api/qcd'
+
+export default {
+  components: {
+  },
+  data() {
+    return {
+      pickerOptions: {
+        disabledDate(time) {
+          let threeMonths = new Date(new Date().setFullYear(new Date().getFullYear() - 1)).getTime() - 24 * 3600 * 1000
+          return time.getTime() > Date.now() || time.getTime() < threeMonths
+
         }
-    },
-    created(){
-        
-    },
-    mounted() {
-        // this.$nextTick(function() {
-            this.initEcharts();
-		// })  
-        // this.myChart = echarts.init(document.getElementById("germychart"));
-        //     this.myChart.setOption(option);
-            //随着屏幕大小调节图表
-            window.addEventListener("resize", () => {
-                this.myChart.resize();
-            });
-    },
-    methods:{
-        handleSubmit(){
-            console.log('asdfa');
+      },
+      patient_name:'',
+      percent:[],
+      patientsData: [],
+      tableData: [],
+      loading: false,
+      search_value: '',
+      total: 0,
+      query: {
+        patient_id: '',
+        statistics_type: 1,
+        start_time: '',
+        end_time: '',
+        limit: 10,
+        page: 1
+      },
+      crumbs: [
+        { path: false, name: '科室质控' },
+        { path: false, name: '指标评估统计' },
+        { path: false, name: '透析过程指标统计' }
+      ],
+      tableData1: [],
+      chart: {
+        title: {
+          text: 'ECharts 入门示例'
         },
-        initEcharts() {
-            const option = {
-                xAxis: {
-                    type: 'category',
-                        boundaryGap:true,
-                        axisTick:{
-                            alignWithLabel:true //保证刻度线和标签对齐
-                        },
-                    data: this.xData,
-                    splitNumber:this.xData.length, //纵坐标数
-                    interval:this.xData //强制设置坐标轴分割间隔
-                },
-                yAxis: {
-                    type: 'value',
-                    boundaryGap: true,
-                    splitNumber:4, //纵坐标数
-                    interval:10 //强制设置坐标轴分割间隔
+        tooltip: {},
+        legend: {
+          data: [],
+          left: 0
+        },
+        xAxis: {
+          data: []
+        },
+        yAxis: {
+          axisLabel: {
+            formatter: '{value} %'
+          },
+          show: false
+        },
+        series: [
+          {
+            name: '',
+            type: 'line',
+            data: [],
+            barWidth: 30,
+            label: {
+              normal: {
+                show: true,
+                position: 'top',
+                formatter: (params) => {
+                  if(this.percent.length > 0){
+                    let str = ''
+                    str = params.data + '('+ this.percent[params.dataIndex] +'%)'
+                    return str
+                  }else{
+                    let str = ''
+                    str = params.data
+                    return str
+                  }
+                }
+              }
+            },
+            //配置样式
+            itemStyle: {
+              //通常情况下：
+
+              //每个柱子的颜色即为colorList数组里的每一项，如果柱子数目多于colorList的长度，则柱子颜色循环使用该数组
+              normal: {
+                color: function(params) {
+                  //我这边就两个柱子，大体就两个柱子颜色渐变，所以数组只有两个值，多个颜色就多个值
+                  var colorList = [
+                    ['#A9E0F3', '#9FBDFC'],
+
+                    ['#FFD7C0', '#FF9994']
+                  ]
+
+                  var index = params.dataIndex
+                  if (params.dataIndex >= colorList.length) {
+                    index = params.dataIndex % colorList.length
+                  }
+
+                  return new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+                    { offset: 0, color: colorList[index][0] },
+                    // { offset: 0.5, color: colorList[index][1] },
+                    { offset: 1, color: colorList[index][1] }
+                  ])
                 },
-                legend: {
-                    show: true,
-                    align:'left',//文字在前图标在后
-                    left:'15%',
-                    top:'5%',
-                    data: [{name:'钙mmol/L'}]
+                lineStyle:{
+                  color:'#409eff' //改变折线颜色
                 },
-                series: [
-                {
-                    data: this.opinionData,
-                    name:'钙mmol/L',
-                    type: "line",// 类型设置为折线图
-                    symbol: 'circle',
-                    itemStyle: {
-                        normal: {
-                            color: '#409eff', //改变折线点的颜色#a80000
-                            lineStyle: {
-                                color: '#409eff' //改变折线颜色
-                            }
-                        }
-                    },
+                barBorderRadius: [5, 5, 0, 0] //柱状角成椭圆形
+              },
 
-                },
-                
-                ],
-                
-            };
-            this.myChart = echarts.init(document.getElementById("germychart"));
-            this.myChart.setOption(option);
-            //随着屏幕大小调节图表
-            window.addEventListener("resize", () => {
-                this.myChart.resize();
-            });
+              //鼠标悬停时：
+              emphasis: {
+                shadowBlur: 10,
+                shadowOffsetX: 0,
+                shadowColor: 'rgba(0, 0, 0, 0.5)'
+              }
+            }
+          }
+        ],
+        dataZoom: [
+          {
+            // Y轴固定,让内容滚动
+            type: 'slider',
+            show: false,
+            xAxisIndex: [0],
+            start: 1,
+            end: 20, // 设置X轴刻度之间的间隔(根据数据量来调整)
+            zoomLock: true // 锁定区域禁止缩放(鼠标滚动会缩放,所以禁止)
+          },
+          {
+            type: 'inside',
+            xAxisIndex: [0],
+            start: 1,
+            end: 20,
+            zoomLock: true // 锁定区域禁止缩放
+          }
+        ]
+      },
+      bar: {
+        title: {
+          text: 'ECharts 入门示例'
+        },
+        tooltip: {},
+        legend: {
+          data: [],
+          left: 0
         },
+        xAxis: {
+          data: []
+        },
+        yAxis: {
+          axisLabel: {
+            formatter: '{value} %'
+          },
+          show: false
+        },
+        series: [
+          {
+            name: '',
+            type: 'bar',
+            data: [],
+            barWidth: 30,
+            label: {
+              normal: {
+                show: true,
+                position: 'top',
+                formatter: (params) => {
+                  if(this.percent.length > 0){
+                    let str = ''
+                    str = params.data + '('+ this.percent[params.dataIndex] +'%)'
+                    return str
+                  }else{
+                    let str = ''
+                    str = params.data
+                    return str
+                  }
+                }
+              }
+            },
+            //配置样式
+            itemStyle: {
+              //通常情况下：
+
+              //每个柱子的颜色即为colorList数组里的每一项，如果柱子数目多于colorList的长度，则柱子颜色循环使用该数组
+              normal: {
+                color: function(params) {
+                  //我这边就两个柱子，大体就两个柱子颜色渐变，所以数组只有两个值，多个颜色就多个值
+                  var colorList = [
+                    ['#A9E0F3', '#9FBDFC'],
+                    ['#FFD7C0', '#FF9994']
+                  ]
+
+                  var index = params.dataIndex
+                  if (params.dataIndex >= colorList.length) {
+                    index = params.dataIndex % colorList.length
+                  }
+
+                  return new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+                    { offset: 0, color: colorList[index][0] },
+                    // { offset: 0.5, color: colorList[index][1] },
+                    { offset: 1, color: colorList[index][1] }
+                  ])
+                },
+                barBorderRadius: [5, 5, 0, 0] //柱状角成椭圆形
+              },
+
+              //鼠标悬停时：
+              emphasis: {
+                shadowBlur: 10,
+                shadowOffsetX: 0,
+                shadowColor: 'rgba(0, 0, 0, 0.5)'
+              }
+            }
+          }
+        ]
+      }
+
+    }
+  },
+  methods: {
+    printAction(){
+      this.$router.push({
+        path: "/Dialysisanalysis/qualitycontrol/print?patient_id=" + this.query.patient_id+"&project_id="+this.query.project_id+"&item_id="+this.query.item_id+"&start_time="+this.query.start_time+"&end_time="+this.query.end_time
+      });
+
+    },exportAction(){
+      let list = []
+      for (let i = 0; i < this.tableData.length; i++) {
+        let order = this.tableData[i]
+        let name = order.name
+        let item_name = order.item_name
+        let count = order.count
+        let price = order.price.toFixed(2)
+        let pay_sumamt = (order.price.toFixed(2) * order.count).toFixed(2)
+        let total = order.total.toFixed(2)
+
+        let obj = {
+          '患者姓名': name,
+          '项目名称': item_name,
+          '数量': count,
+          '单价': price,
+          '费用': pay_sumamt,
+          '费用总额': total
+        }
+        list.push(obj)
+      }
+      import('@/vendor/Export2Excel').then(excel => {
+        const tHeader = ['患者姓名', '项目名称', '数量', '单价', '费用', '费用总额']
+        const filterVal = ['患者姓名', '项目名称', '数量', '单价', '费用', '费用总额']
+        const data = this.formatJson(filterVal, list)
+        excel.export_json_to_excel1({
+          header: tHeader,
+          data,
+          filename: '明细',
+          ref: this.$refs['table'].$el
+        })
+      })
+    },
+    changeProject(val) {
+      this.query.statistics_type = val
+      this.query.page = 1
+      this.GetPersonQCStatistisData(this.query)
+      this.GetInspectionCheckIndexTableData(this.query)
+
+    },
+    handleChange(val) {
+      this.query.patient_id = val.id
+      this.query.page = 1
+      this.patient_name = val.name
+      this.GetPersonQCStatistisData(this.query)
+      this.GetInspectionCheckIndexTableData(this.query)
+    },
+    handleSizeChange(limit) {
+      this.query.limit = limit
+      this.GetInspectionCheckIndexTableData(this.query)
+
     },
-    
+    handleCurrentChange(page) {
+      this.query.page = page
+      this.GetPersonQCStatistisData(this.query)
+    },formatJson(filterVal, jsonData) {
+      return jsonData.map(v => filterVal.map(j => v[j]))
+    },
+    changeTime(val) {
+      var time = this.getTimestamp(val) - this.getTimestamp(this.query.end_time)
+      if (time > 0) {
+        this.$message.error('结束时间不能小于开始时间')
+        this.query.start_time = ''
+      } else {
+        // this.getDialysisList()
+        this.query.page = 1
+        this.GetPersonQCStatistisData(this.query)
+        this.GetInspectionCheckIndexTableData(this.query)
+
+      }
+
+    },
+    changeEndTime(val) {
+      var time =
+        this.getTimestamp(val) - this.getTimestamp(this.query.start_time)
+      if (time < 0) {
+        this.$message.error('结束时间不能小于开始时间')
+        this.query.end_time = ''
+      } else {
+        this.query.page = 1
+        this.GetPersonQCStatistisData(this.query)
+        this.GetInspectionCheckIndexTableData(this.query)
+
+      }
+    },
+    getTimestamp(time) {
+      // 把时间日期转成时间戳
+      return new Date(time).getTime() / 1000
+    },
+    QueryOperaById: function(val) {
+      let vascular_access_desc_name = ''
+      let vascular_access_desc = getDataConfig(
+        'hemodialysis',
+        'vascular_access_desc'
+      )
+      for (let i = 0; i < vascular_access_desc.length; i++) {
+        if (vascular_access_desc[i].id == val) {
+          vascular_access_desc_name = vascular_access_desc[i].name
+        }
+      }
+
+      return vascular_access_desc_name
+    },
+    GetAnticoagulantById: function(val) {
+      let anticoagulan_name = ''
+      var anticoagulantsConfitTwo = this.$store.getters.anticoagulants_confit
+      let anticoagulant = anticoagulantsConfitTwo
+      for (let keys in anticoagulant) {
+        if (anticoagulant[keys].id == val) {
+          anticoagulan_name = anticoagulant[keys].name
+        }
+      }
+      return anticoagulan_name
+    },
+    getModeName(mode_id) {
+      return this.$store.getters.treatment_mode[mode_id] != undefined ? this.$store.getters.treatment_mode[mode_id].name : ''
+    },  getTime(val) {
+      if(val == "" || val == undefined){
+        return ""
+      }else {
+        return uParseTime(val, '{y}-{m}-{d} {h}:{i}')
+      }
+    },
+    GetInspectionCheckIndexTableData(params) {
+      this.loading = true
+      GetPersonQCStatistisData(params)
+        .then(rs => {
+          var resp = rs.data
+          console.log("resp=====",resp)
+          if (resp.state == 1) {
+            this.loading = false
+            this.tableData = []
+            for (let i = 0; i < resp.data.inspections.length; i++) {
+              this.tableData.push(resp.data.inspections[i])
+            }
+            this.total = resp.data.total
+
+          } else {
+            this.loading = false
+          }
+        })
+        .catch(error => {
+
+        })
+    },
+    GetPersonQCStatistisData(params) {
+      this.chart.xAxis.data = []
+      this.chart.series[0].data = []
+      this.bar.xAxis.data = []
+      this.bar.series[0].data = []
+      this.percent = []
+      GetPersonQCStatistisData(params)
+        .then(rs => {
+          var resp = rs.data
+          if (resp.state == 1) {
+            for (let i = 0; i < resp.data.inspections.length; i++) {
+              this.chart.xAxis.data.push(this.getTime(resp.data.inspections[i].inspect_date))
+              this.chart.series[0].data.push(resp.data.inspections[i].inspect_value)
+            }
+            this.getArrLength(this.chart.xAxis.data,1)
+          } else {
+
+          }
+        })
+        .catch(error => {
+        })
+    },
+    handleSelect(val) {
+      this.query.patient_id = val.id
+      this.query.page = 1
+      this.patient_name = val.name
+      for (let i = 0;i < this.patientsData.length; i++){
+        if (this.patientsData[i].id == val.id){
+          this.$refs.table.setCurrentRow(this.patientsData[i])
+        }
+      }
+
+
+    },
+    querySearchAsync(keyword, cb) {
+      let key = ''
+      if (keyword != undefined) {
+        key = keyword
+      }
+      let searchArray = []
+      PostSearch(key).then(response => {
+        if (response.data.state == 1) {
+          searchArray = response.data.data.patient
+          cb(searchArray)
+        } else {
+          cb([])
+        }
+      })
+    },
+    chooseWay(way) {
+      this.wayType = way
+    }, getCurrentOrgPatients() {
+      getCurrentOrgPatients().then(response => {
+        if (response.data.state == 1) {
+          var patients = response.data.data.patients
+          this.patientsData = patients
+          this.GetDefaultPatient()
+        }
+      })
+    }, GetDefaultPatient() {
+      GetDefaultPatient().then(response => {
+        if (response.data.state == 1) {
+          var patient = response.data.data.patient
+          for (let i = 0;i < this.patientsData.length; i++){
+            if (this.patientsData[i].id == patient.id){
+              this.patient_name = this.patientsData[i].name
+              this.$refs.table.setCurrentRow(this.patientsData[i])
+            }
+          }
+          this.query.patient_id = patient.id
+          this.GetPersonQCStatistisData(this.query)
+
+        }
+      })
+
+    },
+    getArrLength(result,type){
+      if(type == 1){
+        if(result.length > 10){
+          var dataZoom_end = (10/result.length)*100;
+          this.chart.dataZoom[0].end = dataZoom_end
+        }else{
+          var dataZoom_end = 100;
+          this.chart.dataZoom[0].end = dataZoom_end
+        }
+      }else if(type == 2){
+        if(result.length > 10){
+          var dataZoom_end = (10/result.length)*100;
+          this.bar.dataZoom[0].end = dataZoom_end
+        }else{
+          var dataZoom_end = 100;
+          this.bar.dataZoom[0].end = dataZoom_end
+        }
+      }
+
+    }
+  }, mounted() {
+    var date = new Date()
+    var year = date.getFullYear() //获取完整的年份(4位)
+    var month = date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1).toString() : date.getMonth() + 1 //获取当前月份(0-11,0代表1月)
+    var day = date.getDate() < 10 ? '0' + date.getDate().toString() : date.getDate() //获取当前日(1-31)
+    var last_month = date.getMonth() < 10 ? '0' + date.getMonth().toString() : date.getMonth() //获取当前月份(0-11,0代表1月)
+    this.query.patient_id = 0
+    this.query.end_time = year + '-' + month + '-' + day
+    this.query.start_time = year + '-' + last_month + '-' + day
+    this.query.project_id = 4
+    this.query.item_id = 289
+    this.getCurrentOrgPatients()
+
+    // this.GetPersonQCStatistisData()
+
+
+  }
 }
 </script>
+
 <style lang="scss" scoped>
-.content_top{
-    display: flex;
-    justify-content: space-around;
-    margin-bottom: 20px;
+.tableTitle {
+  font-size: 16px;
+  color: #000;
+  font-weight: bold;
+  margin-bottom: 10px;
+}
+</style>
+<style lang="scss">
+.page_process {
+.el-tabs{
+  margin-bottom:0 !important;
+}
+.el-button--medium {
+  padding: 10px 8px;
+}
+
+.el-form-item {
+  margin-bottom: 0;
+}
+::-webkit-scrollbar{
+  height: 15px !important;
+}
+
 }
-</style>
+</style>

src/xt_pages/Dialysisanalysis/components/BarChart.vue

@@ -0,0 +1,125 @@
+<template>
+  <div :class="className" :style="{height:height,width:width}"></div>
+</template>
+
+<script>
+import echarts from "echarts";
+require("echarts/theme/macarons"); // echarts theme
+import { debounce } from "@/utils";
+
+const animationDuration = 6000;
+
+export default {
+  props: {
+    className: {
+      type: String,
+      default: "chart"
+    },
+    width: {
+      type: String,
+      default: "100%"
+    },
+    height: {
+      type: String,
+      default: "380px"
+    },
+    title: {
+      type: String,
+      default: "chart"
+    },
+    options: {
+      type: Object,
+      default: function() {
+        return {};
+      }
+    }
+  },
+  data() {
+    return {
+      chart: null,
+      chartOptions: {}
+    };
+  },
+  mounted() {
+    this.initChart();
+    this.__resizeHanlder = debounce(() => {
+      if (this.chart) {
+        this.chart.resize();
+      }
+    }, 100);
+    window.addEventListener("resize", this.__resizeHanlder);
+  },
+  beforeDestroy() {
+    if (!this.chart) {
+      return;
+    }
+    window.removeEventListener("resize", this.__resizeHanlder);
+    this.chart.dispose();
+    this.chart = null;
+  },
+  created() {},
+  watch: {
+    options: function() {
+      this.chartOptions = this.options;
+      this.initChart();
+      this.__resizeHanlder = debounce(() => {
+        if (this.chart) {
+          this.chart.resize();
+        }
+      }, 100);
+      window.addEventListener("resize", this.__resizeHanlder);
+    }
+  },
+  methods: {
+    initChart() {
+      console.log("this.chartOptions", this.chartOptions);
+      this.chart = echarts.init(this.$el, "macarons");
+      this.chart.setOption({
+        title: {
+          text: this.title
+        },
+        tooltip: {
+          trigger: "axis",
+          axisPointer: {
+            // 坐标轴指示器，坐标轴触发有效
+            type: "shadow" // 默认为直线，可选为：'line' | 'shadow'
+          }
+        },
+        grid: {
+          left: "2%",
+          right: "2%",
+          bottom: "3%",
+          containLabel: true
+        },
+        xAxis: [
+          {
+            type: "category",
+            data: this.chartOptions.xAxis,
+            axisTick: {
+              alignWithLabel: true
+            }
+          }
+        ],
+        yAxis: [
+          {
+            type: "value",
+            axisTick: {
+              show: false
+            }
+          }
+        ],
+        series: [
+          {
+            name: "",
+            type: "bar",
+            stack: "vistors",
+            barWidth: "60%",
+            data: this.chartOptions.series,
+            animationDuration
+          }
+        ]
+      });
+    }
+  }
+};
+</script>

src/xt_pages/Dialysisanalysis/components/LineChart.vue

@@ -0,0 +1,261 @@
+<template>
+  <div :class="className" :style="{height:height,width:width}"></div>
+</template>
+
+<script>
+import echarts from "echarts";
+require("echarts/theme/macarons"); // echarts theme
+import { debounce } from "@/utils";
+
+export default {
+  props: {
+    className: {
+      type: String,
+      default: "chart"
+    },
+    width: {
+      type: String,
+      default: "100%"
+    },
+    height: {
+      type: String,
+      default: "230px"
+    },
+    autoResize: {
+      type: Boolean,
+      default: true
+    },
+    chartData: {
+      type: Object
+    },
+    title: {
+      type: String,
+      default: "chart"
+    },
+    options: {
+      type: Object,
+      default: function() {
+        return {};
+      }
+    }
+  },
+  data() {
+    return {
+      chart: null,
+      chartOptions: {
+        xAxis: [],
+        legend: [],
+        series: []
+      }
+    };
+  },
+  mounted() {
+    this.initChart();
+    if (this.autoResize) {
+      this.__resizeHanlder = debounce(() => {
+        if (this.chart) {
+          this.chart.resize();
+        }
+      }, 100);
+      window.addEventListener("resize", this.__resizeHanlder);
+    }
+
+    // 监听侧边栏的变化
+    const sidebarElm = document.getElementsByClassName("sidebar-container")[0];
+    sidebarElm.addEventListener("transitionend", this.__resizeHanlder);
+  },
+  beforeDestroy() {
+    if (!this.chart) {
+      return;
+    }
+    if (this.autoResize) {
+      window.removeEventListener("resize", this.__resizeHanlder);
+    }
+
+    const sidebarElm = document.getElementsByClassName("sidebar-container")[0];
+    sidebarElm.removeEventListener("transitionend", this.__resizeHanlder);
+
+    this.chart.dispose();
+    this.chart = null;
+  },
+  watch: {
+    // options: function(a) {
+    //   console.log(a)
+    //   this.chartOptions = this.options;
+    //   this.initChart();
+    //   this.__resizeHanlder = debounce(() => {
+    //     if (this.chart) {
+    //       this.chart.resize();
+    //     }
+    //   }, 100);
+    //   window.addEventListener("resize", this.__resizeHanlder);
+    // },
+    options:{
+      handler(newValue,oldValue){
+        this.getInitChart();
+      },
+      deep:true
+    },
+
+    chartData: {
+      deep: true,
+      handler(val) {
+        this.setOptions(val);
+      }
+    }
+  },
+  created() {
+    this.chartOptions = this.options;
+    // console.log("this.chartOptions", this.chartOptions, this.options);
+  },
+  methods: {
+    getInitChart() {
+      this.chartOptions = this.options;
+      this.initChart();
+      this.__resizeHanlder = debounce(() => {
+        if (this.chart) {
+          this.chart.resize();
+        }
+      }, 100);
+      window.addEventListener("resize", this.__resizeHanlder);
+    },
+    // setOptions({ expectedData, actualData } = {}) {
+    //   this.chart.setOption({
+    //     title: {
+    //         text: this.title,
+    //     },
+    //     xAxis: {
+    //       data: this.chartOptions.xAxis,
+    //       boundaryGap: false,
+    //       axisTick: {
+    //         show: false
+    //       }
+    //     },
+    //     grid: {
+    //       left: 50,
+    //       right: 50,
+    //       bottom: 20,
+    //       top: 30,
+    //       containLabel: true
+    //     },
+    //     tooltip: {
+    //       trigger: 'axis',
+    //       axisPointer: {
+    //         type: 'cross'
+    //       },
+    //       padding: [5, 10]
+    //     },
+    //     yAxis: {
+    //       axisTick: {
+    //         show: false
+    //       }
+    //     },
+    //     legend: {
+    //       data: this.chartOptions.legend,
+    //     },
+    //     series: this.chartOptions.series,
+    //   })
+    // },
+    setOptions({ expectedData, actualData } = {}) {
+      this.chart.setOption({
+        // title: {
+        //   text: this.title
+        // },
+        xAxis: {
+          data: this.chartOptions.xAxis.data,
+          // boundaryGap: false
+          axisTick: {
+            show: true
+          },
+          axisLine: {
+            lineStyle: {
+              color: "#E5E5E5" //x轴颜色
+            }
+          },
+          axisLabel: {
+            interval: 0,
+            formatter: function(value) {
+              var ret = ""; //拼接加\n返回的类目项
+              var maxLength = 10; //每项显示文字个数
+              var valLength = value.length; //X轴类目项的文字个数
+              var rowN = Math.ceil(valLength / maxLength); //类目项需要换行的行数
+              if (rowN > 1) {
+                //如果类目项的文字大于3,
+                for (var i = 0; i < rowN; i++) {
+                  var temp = ""; //每次截取的字符串
+                  var start = i * maxLength; //开始截取的位置
+                  var end = start + maxLength; //结束截取的位置
+                  //这里也可以加一个是否是最后一行的判断，但是不加也没有影响，那就不加吧
+                  temp = value.substring(start, end) + "\n";
+                  ret += temp; //凭借最终的字符串
+                }
+                return ret;
+              } else {
+                return value;
+              }
+            },
+            textStyle: {
+              color:"#2F3133"
+            }
+          }
+        },
+        grid: {
+          left: 0,
+          right: 50,
+          bottom: 10,
+          top: 30,
+          containLabel: true
+        },
+        tooltip: {
+          trigger: "axis",
+          axisPointer: {
+            type: "cross"
+          },
+          padding: [5, 10]
+        },
+        yAxis: {
+          axisTick: {
+            show: true
+          },
+          axisLine: {
+            lineStyle: {
+              color: "#E5E5E5" //y轴颜色
+            },
+          },
+          axisLabel: {
+            textStyle: {
+              color:"#2F3133"
+            }
+          }
+        },
+        // dataZoom: [
+        //   {
+        //     //Y轴固定,让内容滚动
+        //     type: "slider",
+        //     show: false,
+        //     xAxisIndex: [0],
+        //     start: 1,
+        //     end: 80, //设置X轴刻度之间的间隔(根据数据量来调整)
+        //     zoomLock: true //锁定区域禁止缩放(鼠标滚动会缩放,所以禁止)
+        //   },
+        //   {
+        //     type: "inside",
+        //     xAxisIndex: [0],
+        //     start: 1,
+        //     end: 80,
+        //     zoomLock: true //锁定区域禁止缩放
+        //   }
+        // ],
+        legend: this.chartOptions.legend,
+        series: this.chartOptions.series,
+        dataZoom: this.chartOptions.dataZoom,
+      });
+    },
+    initChart() {
+      this.chart = echarts.init(this.$el, "macarons");
+      this.chart.clear();
+      this.setOptions(this.chartData);
+    }
+  }
+};
+</script>

src/xt_pages/Dialysisanalysis/components/LineChart1.vue

@@ -0,0 +1,262 @@
+<template>
+  <div :class="className" :style="{height:height,width:width}"></div>
+</template>
+
+<script>
+import echarts from "echarts";
+require("echarts/theme/macarons"); // echarts theme
+import { debounce } from "@/utils";
+
+export default {
+  props: {
+    className: {
+      type: String,
+      default: "chart"
+    },
+    width: {
+      type: String,
+      default: "100%"
+    },
+    height: {
+      type: String,
+      default: "230px"
+    },
+    autoResize: {
+      type: Boolean,
+      default: true
+    },
+    chartData: {
+      type: Object
+    },
+    title: {
+      type: String,
+      default: "chart"
+    },
+    options: {
+      type: Object,
+      default: function() {
+        return {};
+      }
+    }
+  },
+  data() {
+    return {
+      chart: null,
+      chartOptions: {
+        xAxis: [],
+        legend: [],
+        series: []
+      }
+    };
+  },
+  mounted() {
+    this.initChart();
+    if (this.autoResize) {
+      this.__resizeHanlder = debounce(() => {
+        if (this.chart) {
+          this.chart.resize();
+        }
+      }, 100);
+      window.addEventListener("resize", this.__resizeHanlder);
+    }
+
+    // 监听侧边栏的变化
+    const sidebarElm = document.getElementsByClassName("sidebar-container")[0];
+    sidebarElm.addEventListener("transitionend", this.__resizeHanlder);
+  },
+  beforeDestroy() {
+    if (!this.chart) {
+      return;
+    }
+    if (this.autoResize) {
+      window.removeEventListener("resize", this.__resizeHanlder);
+    }
+
+    const sidebarElm = document.getElementsByClassName("sidebar-container")[0];
+    sidebarElm.removeEventListener("transitionend", this.__resizeHanlder);
+
+    this.chart.dispose();
+    this.chart = null;
+  },
+  watch: {
+    // options: function(a) {
+    //   console.log(a)
+    //   this.chartOptions = this.options;
+    //   this.initChart();
+    //   this.__resizeHanlder = debounce(() => {
+    //     if (this.chart) {
+    //       this.chart.resize();
+    //     }
+    //   }, 100);
+    //   window.addEventListener("resize", this.__resizeHanlder);
+    // },
+    options:{
+      handler(newValue,oldValue){
+        this.getInitChart();
+      },
+      deep:true
+    },
+
+    chartData: {
+      deep: true,
+      handler(val) {
+        this.setOptions(val);
+      }
+    }
+  },
+  created() {
+    this.chartOptions = this.options;
+    // console.log("this.chartOptions", this.chartOptions, this.options);
+  },
+  methods: {
+    getInitChart() {
+      this.chartOptions = this.options;
+      this.initChart();
+      this.__resizeHanlder = debounce(() => {
+        if (this.chart) {
+          this.chart.resize();
+        }
+      }, 100);
+      window.addEventListener("resize", this.__resizeHanlder);
+    },
+    // setOptions({ expectedData, actualData } = {}) {
+    //   this.chart.setOption({
+    //     title: {
+    //         text: this.title,
+    //     },
+    //     xAxis: {
+    //       data: this.chartOptions.xAxis,
+    //       boundaryGap: false,
+    //       axisTick: {
+    //         show: false
+    //       }
+    //     },
+    //     grid: {
+    //       left: 50,
+    //       right: 50,
+    //       bottom: 20,
+    //       top: 30,
+    //       containLabel: true
+    //     },
+    //     tooltip: {
+    //       trigger: 'axis',
+    //       axisPointer: {
+    //         type: 'cross'
+    //       },
+    //       padding: [5, 10]
+    //     },
+    //     yAxis: {
+    //       axisTick: {
+    //         show: false
+    //       }
+    //     },
+    //     legend: {
+    //       data: this.chartOptions.legend,
+    //     },
+    //     series: this.chartOptions.series,
+    //   })
+    // },
+    setOptions({ expectedData, actualData } = {}) {
+      this.chart.setOption({
+        // title: {
+        //   text: this.title
+        // },
+        xAxis: {
+          data: this.chartOptions.xAxis.data,
+          // boundaryGap: false
+          axisTick: {
+            show: true
+          },
+          axisLine: {
+            lineStyle: {
+              color: "#E5E5E5" //x轴颜色
+            }
+          },
+          axisLabel: {
+            interval: 0,
+            formatter: function(value) {
+              var ret = ""; //拼接加\n返回的类目项
+              var maxLength = 10; //每项显示文字个数
+              var valLength = value.length; //X轴类目项的文字个数
+              var rowN = Math.ceil(valLength / maxLength); //类目项需要换行的行数
+              if (rowN > 1) {
+                //如果类目项的文字大于3,
+                for (var i = 0; i < rowN; i++) {
+                  var temp = ""; //每次截取的字符串
+                  var start = i * maxLength; //开始截取的位置
+                  var end = start + maxLength; //结束截取的位置
+                  //这里也可以加一个是否是最后一行的判断，但是不加也没有影响，那就不加吧
+                  temp = value.substring(start, end) + "\n";
+                  ret += temp; //凭借最终的字符串
+                }
+                return ret;
+              } else {
+                return value;
+              }
+            },
+            textStyle: {
+              color:"#2F3133"
+            }
+          }
+        },
+        grid: {
+          left: 0,
+          right: 50,
+          bottom: 10,
+          top: 30,
+          containLabel: true
+        },
+        tooltip: {
+          trigger: "axis",
+          axisPointer: {
+            type: "cross"
+          },
+          padding: [5, 10]
+        },
+        yAxis: {
+          axisTick: {
+            show: true
+          },
+          axisLine: {
+            lineStyle: {
+              color: "#E5E5E5" //y轴颜色
+            },
+          },
+          axisLabel: {
+            textStyle: {
+              color:"#2F3133"
+            }
+          },
+          max:2
+        },
+        // dataZoom: [
+        //   {
+        //     //Y轴固定,让内容滚动
+        //     type: "slider",
+        //     show: false,
+        //     xAxisIndex: [0],
+        //     start: 1,
+        //     end: 80, //设置X轴刻度之间的间隔(根据数据量来调整)
+        //     zoomLock: true //锁定区域禁止缩放(鼠标滚动会缩放,所以禁止)
+        //   },
+        //   {
+        //     type: "inside",
+        //     xAxisIndex: [0],
+        //     start: 1,
+        //     end: 80,
+        //     zoomLock: true //锁定区域禁止缩放
+        //   }
+        // ],
+        legend: this.chartOptions.legend,
+        series: this.chartOptions.series,
+        dataZoom: this.chartOptions.dataZoom,
+      });
+    },
+    initChart() {
+      this.chart = echarts.init(this.$el, "macarons");
+      this.chart.clear();
+      this.setOptions(this.chartData);
+    }
+  }
+};
+</script>

src/xt_pages/Dialysisanalysis/components/PieChart.vue

@@ -0,0 +1,108 @@
+<template>
+  <div :class="className" :style="{height:height,width:width}"></div>
+</template>
+
+<script>
+import echarts from 'echarts'
+require('echarts/theme/macarons') // echarts theme
+import { debounce } from '@/utils'
+
+export default {
+  props: {
+    className: {
+      type: String,
+      default: 'chart'
+    },
+    width: {
+      type: String,
+      default: '100%'
+    },
+    height: {
+      type: String,
+      default: '380px'
+    },
+    title:{
+      type: String,
+      default: 'chart'
+    },
+    options:{
+      type:Object,
+      default:function(){
+        return {}
+      }
+    }
+  },
+  data() {
+    return {
+      chart: null,
+      chartOptions:{},
+    }
+  },
+  mounted() {
+    this.initChart()
+    this.__resizeHanlder = debounce(() => {
+      if (this.chart) {
+        this.chart.resize()
+      }
+    }, 100)
+    window.addEventListener('resize', this.__resizeHanlder)
+  },
+  beforeDestroy() {
+    if (!this.chart) {
+      return
+    }
+    window.removeEventListener('resize', this.__resizeHanlder)
+    this.chart.dispose()
+    this.chart = null
+  },
+  created(){
+    this.chartOptions = this.options;
+  },
+  methods: {
+    initChart() {
+      this.chart = echarts.init(this.$el, 'macarons')
+
+      this.chart.setOption({
+        title: {
+            text: this.title,
+        },
+        tooltip: {
+          trigger: 'item',
+          formatter: '{a} <br/>{b} : {c} ({d}%)'
+        },
+        legend: {
+          left: 'center',
+          bottom: '10',
+          data: this.chartOptions.legend,
+        },
+        calculable: true,
+        series: [
+          {
+            name: '',
+            type: 'pie',
+            roseType: 'radius',
+            radius: [15, 95],
+            center: ['50%', '38%'],
+            data: this.chartOptions.series,
+            animationEasing: 'cubicInOut',
+            animationDuration: 2600
+          }
+        ]
+      })
+    }
+  },
+  watch:{
+    "options":function(){
+      this.chartOptions = this.options;
+      this.initChart()
+      this.__resizeHanlder = debounce(() => {
+        if (this.chart) {
+          this.chart.resize() 
+        }
+      }, 100)
+      window.addEventListener('resize', this.__resizeHanlder)
+    }
+    
+  } 
+}
+</script>

src/xt_pages/Dialysisanalysis/hemoglobin/hemoglobinall.vue

@@ -1,261 +1,370 @@
 <template>
-    <div>
-        <!-- <div class="content_top">
-            <div class="block">
-                <span>查询时间:</span>
-                <el-date-picker
-                v-model="time_month"
-                type="month"
-                placeholder="选择月">
-                </el-date-picker>
-            </div>
-            <div>
-                <el-date-picker
-                v-model="stat_time"
-                type="date"
-                placeholder="选择日期">
-                </el-date-picker>
-                <span>-</span>
-                <el-date-picker
-                v-model="end_time"
-                type="date"
-                placeholder="选择日期">
-                </el-date-picker>
-            </div>
-            <div style="width: 200px;">
-                <el-input v-model="input" placeholder="请输入内容"></el-input>
-            </div>
-            <el-button type="primary">查询</el-button>
-        </div> -->
-        <el-row :gutter="20">
-        <el-col :span="5"> 
-          <div class="block">
-            <span>查询时间:</span>
-            <el-date-picker
-            v-model="time_month"
-            type="month"
-            placeholder="选择月">
-            </el-date-picker>
-          </div>
-        </el-col>
-        <el-col :span="8">
-          <div>
-            <el-date-picker
-            v-model="stat_time"
+  <div>
+    <el-row :gutter="25">
+      <el-col :span="5">
+        <div class="block">
+          <span>查询时间:</span>
+          <el-select size="small" v-model="time_type" placeholder="请选择"
+                     style="width:150px;margin-left:10px;" @change="changeItem">
+            <el-option
+              v-for="item,index in times"
+              :key="index"
+              :label="item.label"
+              :value="item.value">
+            </el-option>
+          </el-select>
+        </div>
+      </el-col>
+      <el-col :span="8">
+        <div>
+          <el-date-picker
+            style="width: 200px"
+
+            v-model="start_time"
+            format="yyyy-MM-dd"
+            value-format="yyyy-MM-dd"
             type="date"
+
             placeholder="选择日期">
-            </el-date-picker>
-            <span>-</span>
-            <el-date-picker
+          </el-date-picker>
+          <span>-</span>
+          <el-date-picker
+            style="width: 200px"
             v-model="end_time"
+            format="yyyy-MM-dd"
+            value-format="yyyy-MM-dd"
             type="date"
             placeholder="选择日期">
-            </el-date-picker>
-          </div>
-        </el-col>
-        <el-col :span="3">
-          <div style="width: 200px;">
-            <el-input v-model="input" placeholder="请输入内容"></el-input>
-          </div>
-        </el-col>
-        <el-col :span="2">
-            <el-button type="primary">查询</el-button>
-        </el-col>
-        </el-row>
-        
-        <div class="cell clearfix" style="margin: 20px; font-weight: bold;">
-          <p class="chartTitle">统计图</p>
+          </el-date-picker>
         </div>
-        <div class="echart" id="mychart" :style={width:width,height:height}></div>
-        <div style="width: 80%;margin: auto;">
-            <el-table
-            :data="tableData"
-            :show-summary = true
-            border
-            style="width: 100%;">
-                <el-table-column
-                    prop="date"
-                    align="center"
-                    label="血红蛋白"
-                    >
-                </el-table-column>
-                <el-table-column
-                    prop="name"
-                    
-                    label="人数"
-                    >
-                </el-table-column>
-                <el-table-column
-                    prop="address"
-                    align="center"
-                    label="操作">
-                    <template slot-scope="scope">
-                        <el-button @click="handleClick(scope.row)" style="font-size:16px;"
-                                type="text" >查看详情
-                        </el-button>
-                    </template>
-                </el-table-column>
-            </el-table>
+      </el-col>
+      <el-col :span="5">
+        <div >
+          <el-input disabled v-model="input" placeholder="请输入内容"></el-input>
         </div>
+      </el-col>
+      <el-col :span="3">
+        <el-button type="primary" @click="getData()">查询</el-button>
+      </el-col>
+    </el-row>
+    <div class="cell clearfix" style="margin: 20px; font-weight: bold;">
+      <p class="chartTitle">统计图</p>
+    </div>
+    <div class="echart" id="mychart" :style={width:width,height:height}></div>
+    <div style="width: 80%;margin: auto;">
+      <el-table
+        :data="tableData"
+        border
+        style="width: 100%;">
+        <el-table-column
+          prop="name"
+          align="center"
+          label="血红蛋白"
+
+
+        >
+        </el-table-column>
+        <el-table-column
+          prop="count"
+          label="人数"
+        >
+        </el-table-column>
+<!--        <el-table-column-->
+<!--          prop="address"-->
+<!--          align="center"-->
+<!--          label="操作">-->
+<!--          <template slot-scope="scope">-->
+<!--            <el-button @click="handleClick(scope.row)" style="font-size:16px;"-->
+<!--                       type="text">查看详情-->
+<!--            </el-button>-->
+<!--          </template>-->
+<!--        </el-table-column>-->
+      </el-table>
     </div>
+  </div>
 </template>
 <script>
-import * as echarts from "echarts";
-export default{
-    props: {
-   
+import * as echarts from 'echarts'
+import { GetQCStatistisData } from '../../../api/qcd'
+
+const moment = require('moment')
+
+export default {
+  props: {
+
     width: {
       type: String,
-      default: "100%"
+      default: '100%'
     },
     height: {
       type: String,
-      default: "400px"
-    },
-    
+      default: '400px'
+    }
+
   },
-    data() {
-        return {
-            time_month:'',
-            stat_time:'',
-            end_time:'',
-            input:'',
-            myChart: {},
-            pieData : [
-            {
-          value: 463,
-          name: "不达标值患者"
-        },
-        {
-          value: 395,
-          name: "未检查患者"
-        },
-        {
-          value: 157,
-          name: "达标值患者"
-        },
-        // {
-        //   value: 149,
-        //   name: "广东"
-        // },
-        // {
-        //   value: 147,
-        //   name: "湖南"
-        // }
-            
-            ],
-            pieName: [],
-            // myChartStyle:{float: "right", width: "100%", height: "400px"},
-            tableData:[],
-        }
-    },
-    mounted() {
-    this.initDate(); //数据初始化
-    this.initEcharts();
+  data() {
+    return {
+      time_type: 1,
+      times: [
+        { value: 1, label: '本月' },
+        { value: 2, label: '上月' },
+        { value: 3, label: '今年' },
+        { value: 4, label: '上一年' },
+        { value: 5, label: '第一季度' },
+        { value: 6, label: '第二季度' },
+        { value: 7, label: '第三季度' },
+        { value: 8, label: '第四季度' },
+        { value: 9, label: '自定义' }
+
+      ],
+      reference:{},
+      time_month: '',
+      start_time: new Date(new Date().getFullYear(), new Date().getMonth(), 1).toLocaleDateString('en-CA'),
+      end_time: new Date(new Date().getFullYear(), new Date().getMonth() + 1, 0).toLocaleDateString('en-CA'),
+      input: '',
+      myChart: {},
+      pieData: [],
+      pieName: [],
+      // myChartStyle:{float: "right", width: "100%", height: "400px"},
+      tableData: []
+    }
+  },
+  mounted() {
+    this.getData()
   },
   methods: {
-    initDate() {
-      for (let i = 0; i < this.pieData.length; i++) {
-        this.pieName[i] = this.pieData[i].name;
+    getData() {
+      if(this.start_time.length == 0){
+        this.$message.error("请选择开始时间")
       }
-    },
-    initEcharts() {
-      // 饼图
-      const option = {
-        legend: {
-          // 图例
-          data: this.pieName,
-          left: "10%",
-          top: "30%",
-          orient: "vertical"
-        },
-        color:['#ff7f9f','#fff67f','#1e5feb'],
-        title: {
-          // 设置饼图标题，位置设为顶部居中
-        //   text: "国内院士前五省份图示",
-          top: "0%",
-          left: "center"
-        },
-        series: [
-          {
-            type: "pie",
-            label: {
-              normal : {
-                formatter: '{b}:{c}: ({d}%)',
-                textStyle : {
-                    fontWeight : 'normal',
-                    fontSize : 15,
-                    color : "black"
-                }
-              }
-              // b代表名称，c代表对应值，d代表百分比"{b} : {d}% ({c})" 
+      if(this.end_time.length == 0){
+        this.$message.error("请选择结束时间")
+      }
+      let params = {
+        start_date: this.start_time,
+        end_date: this.end_time,
+        project_id: 1,
+        item_id: 17
+      }
+      this.pieData = []
+      this.tableData = []
+      console.log("~~~~~~~~~~")
+      GetQCStatistisData(params).then(response => {
+        if (response.data.state == 1) {
+          this.reference = response.data.data.reference
+          this.input = response.data.data.reference.range_min + "<=" + response.data.data.reference.item_name + "<=" + response.data.data.reference.range_max
+          let objone = {
+            value:  response.data.data.unusual_total / response.data.data.patient_count,
+            name: '不达标值患者',
+            count:response.data.data.unusual_total,
+          }
+          this.pieData.push(objone)
+          this.tableData.push(objone)
+
+          let objtwo = {
+            value:   response.data.data.normal_total / response.data.data.patient_count,
+            name: '达标值患者',
+            count:response.data.data.normal_total,
+
+          }
+          this.pieData.push(objtwo)
+          this.tableData.push(objtwo)
+
+          let objthree = {
+            value: response.data.data.patient_count / response.data.data.no_check_total,
+            name: '未检查患者',
+            count:response.data.data.no_check_total,
+
+          }
+          this.pieData.push(objthree)
+          this.tableData.push(objthree)
+
+          let objfour = {
+            value: response.data.data.patient_count,
+            name: '合计',
+            count:response.data.data.patient_count,
+          }
+          this.tableData.push(objfour)
+          for (let i = 0; i < this.pieData.length; i++) {
+            this.pieName[i] = this.pieData[i].name
+          }
+          this.myChart = echarts.init(document.getElementById('mychart'))
+          window.addEventListener('resize', () => {
+            this.myChart.resize()
+          })
+          const option = {
+            legend: {
+              // 图例
+              data: this.pieName,
+              left: '10%',
+              top: '30%',
+              orient: 'vertical'
             },
-            radius: "65%", //饼图半径
-            data: this.pieData,
-            itemStyle : {
-              emphasis: {
-                shadowBlur: 10,
-                shadowOffsetX: 0,
-                shadowColor: 'rgba(0, 0, 0, 0.5)'
+            color: ['#ff7f9f', '#fff67f', '#1e5feb'],
+            title: {
+              // 设置饼图标题，位置设为顶部居中
+              //   text: "国内院士前五省份图示",
+              top: '0%',
+              left: 'center'
+            },
+            series: [
+              {
+                type: 'pie',
+                label: {
+                  show: true,
+                  formatter: '{b} : {d}% ({c})'
+                  // b代表名称，c代表对应值，d代表百分比"{b} : {d}% ({c})"
+                },
+                radius: '65%', //饼图半径
+                data: this.pieData
               }
-            }
+            ]
           }
-        ]
-      };
-    //   console.log(this.seriesData);
-      const optionFree = {
-        series: [
-          {
-            data: this.seriesData,
-            type: "line",
-            smooth: true
+          //   console.log(this.seriesData);
+          const optionFree = {
+            series: [
+              {
+                data: this.seriesData,
+                type: 'line',
+                smooth: true
+              }
+            ]
           }
-        ]
-      };
-      this.myChart = echarts.init(document.getElementById("mychart"));
-      this.myChart.setOption(option);
-      //随着屏幕大小调节图表
-      window.addEventListener("resize", () => {
-        this.myChart.resize();
-      });
+          this.myChart = echarts.init(document.getElementById('mychart'))
+          this.myChart.setOption(option)
+        } else {
+          this.$message.error(response.data.msg)
+        }
+      })
+
     },
+    changeItem(val) {
+      const currentDate = new Date()
+      switch (val) {
+        case 1:
+
+          const startOfMonth = new Date(currentDate.getFullYear(), currentDate.getMonth(), 1).toLocaleDateString('en-CA')
+          const endOfMonth = new Date(currentDate.getFullYear(), currentDate.getMonth() + 1, 0).toLocaleDateString('en-CA')
+
+          this.start_time = startOfMonth
+          this.end_time = endOfMonth
+          this.getData()
+
+          break
+        case 2:
+          // 上月的起始日期和结束日期
+          const startOfLastMonth = new Date(currentDate.getFullYear(), currentDate.getMonth() - 1, 1).toLocaleDateString('en-CA')
+          const endOfLastMonth = new Date(currentDate.getFullYear(), currentDate.getMonth(), 0).toLocaleDateString('en-CA')
+
+          this.start_time = startOfLastMonth
+          this.end_time = endOfLastMonth
+          this.getData()
+
+          break
+        case 3:
+          // 今年的起始日期和结束日期
+          const startOfYear = new Date(currentDate.getFullYear(), 0, 1).toLocaleDateString('en-CA')
+          const endOfYear = new Date(currentDate.getFullYear(), 11, 31).toLocaleDateString('en-CA')
+
+          this.start_time = startOfYear
+          this.end_time = endOfYear
+          this.getData()
+
+          break
+        case 4:
+          // 上一年的起始日期和结束日期
+          const startOfLastYear = new Date(currentDate.getFullYear() - 1, 0, 1).toLocaleDateString('en-CA')
+          const endOfLastYear = new Date(currentDate.getFullYear() - 1, 11, 31).toLocaleDateString('en-CA')
+
+          this.start_time = startOfLastYear
+          this.end_time = endOfLastYear
+          this.getData()
+
+          break
+        case 5:
+          // 第一季度的起始日期和结束日期
+          const startOfFirstQuarter = new Date(currentDate.getFullYear(), 0, 1).toLocaleDateString('en-CA')
+          const endOfFirstQuarter = new Date(currentDate.getFullYear(), 2, 31).toLocaleDateString('en-CA')
+
+          this.start_time = startOfFirstQuarter
+          this.end_time = endOfFirstQuarter
+          this.getData()
+
+          break
+        case 6:
+          // 第二季度的起始日期和结束日期
+          const startOfSecondQuarter = new Date(currentDate.getFullYear(), 3, 1).toLocaleDateString('en-CA')
+          const endOfSecondQuarter = new Date(currentDate.getFullYear(), 5, 30).toLocaleDateString('en-CA')
+
+          this.start_time = startOfSecondQuarter
+          this.end_time = endOfSecondQuarter
+          this.getData()
+
+          break
+        case 7:
+          // 第三季度的起始日期和结束日期
+          const startOfThirdQuarter = new Date(currentDate.getFullYear(), 6, 1).toLocaleDateString('en-CA')
+          const endOfThirdQuarter = new Date(currentDate.getFullYear(), 8, 30).toLocaleDateString('en-CA')
+
+          this.start_time = startOfThirdQuarter
+          this.end_time = endOfThirdQuarter
+          this.getData()
+
+          break
+        case 8:
+          // 第四季度的起始日期和结束日期
+          const startOfFourthQuarter = new Date(currentDate.getFullYear(), 9, 1).toLocaleDateString('en-CA')
+          const endOfFourthQuarter = new Date(currentDate.getFullYear(), 11, 31).toLocaleDateString('en-CA')
+
+          this.start_time = startOfFourthQuarter
+          this.end_time = endOfFourthQuarter
+          this.getData()
+          break
+        case 9:
+          this.start_time = ''
+          this.end_time = ''
+          break
+      }
+    },
+
+
     getSummaries(param) {
-        const { columns, data } = param;
-        const sums = [];
-        columns.forEach((column, index) => {
-          if (index === 0) {
-            sums[index] = '总价';
-            return;
-          }
-          const values = data.map(item => Number(item[column.property]));
-          if (!values.every(value => isNaN(value))) {
-            sums[index] = values.reduce((prev, curr) => {
-              const value = Number(curr);
-              if (!isNaN(value)) {
-                return prev + curr;
-              } else {
-                return prev;
-              }
-            }, 0);
-            sums[index] += ' 元';
-          } else {
-            sums[index] = 'N/A';
-          }
-        });
+      const { columns, data } = param
+      const sums = []
+      columns.forEach((column, index) => {
+        if (index === 0) {
+          sums[index] = '总价'
+          return
+        }
+        const values = data.map(item => Number(item[column.property]))
+        if (!values.every(value => isNaN(value))) {
+          sums[index] = values.reduce((prev, curr) => {
+            const value = Number(curr)
+            if (!isNaN(value)) {
+              return prev + curr
+            } else {
+              return prev
+            }
+          }, 0)
+          sums[index] += ' 元'
+        } else {
+          sums[index] = 'N/A'
+        }
+      })
 
-        return sums;
+      return sums
     },
-    handleClick(id){
-        console.log(id);
+    handleClick(id) {
+      console.log(id)
     }
   }
 
 }
 </script>
 <style lang="scss" scoped>
-.content_top{
-    display: flex;
-    justify-content: space-around;
-    color: #1e5feb;
+.content_top {
+  display: flex;
+  justify-content: space-around;
+  color: #1e5feb;
 }
-</style>
+</style>

src/xt_pages/Dialysisanalysis/hemoglobin/hemoglobinalone.vue

@@ -1,217 +1,646 @@
 <template>
-    <div>
-       <div class="content_top">
-            <el-autocomplete
-            class="inline-input"
-            v-model="inputValue"
-            :fetch-suggestions="querySearch"
-            :trigger-on-focus="false"
-            placeholder="请输入患者名字或透析号"
-            @select="handleSubmit"
-            ></el-autocomplete>
+  <div class="main-contain">
+    <div class="app-container">
+      <div class="page_process">
+        <new-nav activeName="process"></new-nav>
+        <div class="cell clearfix">
+          <el-form :inline="true">
+            <el-form-item label>
+              <el-autocomplete
+                class="checkSearch"
+                popper-class="my-autocomplete"
+                v-model="search_value"
+                :fetch-suggestions="querySearchAsync"
+                :trigger-on-focus="false"
+                placeholder="请输入病人名字"
+                @select="handleSelect"
+                style="width:160px;"
+              >
+                <i class="el-icon-search el-input__icon" slot="suffix"></i>
+                <template slot-scope="{ item }">
+                  <div class="name">{{ item.name }}</div>
+                </template>
+              </el-autocomplete>
+
+            </el-form-item>
+          </el-form>
+
+          <label class="title">
+            <span class="name">日期查询</span> :
+          </label>
+          <el-date-picker
+            v-model="query.start_time"
+            prefix-icon="el-icon-date"
+            @change="changeTime"
+            :editable="false"
+            style="width: 150px;"
+            type="date"
+            placeholder="选择日期时间"
+            align="right"
+            format="yyyy-MM-dd"
+            value-format="yyyy-MM-dd"
+          ></el-date-picker>
+          <span class>-</span>
+          <el-date-picker
+            v-model="query.end_time"
+            prefix-icon="el-icon-date"
+            @change="changeEndTime"
+            :editable="false"
+            style="width: 150px;"
+            type="date"
+            placeholder="选择日期时间"
+            align="right"
+            format="yyyy-MM-dd"
+            value-format="yyyy-MM-dd"
+          ></el-date-picker>
+
+          <el-button size="small" icon="el-icon-printer" @click="printAction" type="primary">打印
+          </el-button>
+          <el-button size="small" icon="el-icon-printer" @click="exportAction" type="primary">导出
+
+          </el-button>
+        </div>
+
+        <el-container>
+          <div style="width:160px">
+
+            <div class="tableTitle">患者列表</div>
+
+
+            <el-table ref="table" :data="patientsData" border style="width: 100%;" height="500"
+                      :row-style="{ color: '#303133' }"
+                      :header-cell-style="{backgroundColor: 'rgb(245, 247, 250)',color: '#606266'}"
+                      highlight-current-row
+                      @current-change="handleChange">
+              <el-table-column prop="dialysis_no" label="透析号" width="70" align="center">
+                <template slot-scope="scope">{{scope.row.dialysis_no}}</template>
+              </el-table-column>
+              <el-table-column prop="name" label="姓名" width="90" align="center">
+                <template slot-scope="scope">{{ scope.row.name }}</template>
+              </el-table-column>
+            </el-table>
+          </div>
+          <div style="padding-left:10px;flex:1;width:0;">
+            <div class="tableTitle">指标趋势<span style="font-weight:normal">&nbsp;&nbsp;（当前患者: {{patient_name}}）</span></div>
             <div>
-                <span>查询时间:</span>
-                <el-date-picker
-                v-model="stat_time"
-                type="date"
-                placeholder="选择日期">
-                </el-date-picker>
-                <span>-</span>
-                <el-date-picker
-                v-model="end_time"
-                type="date"
-                placeholder="选择日期">
-                </el-date-picker>
-                <el-select v-model="value" placeholder="请选择">
-                    <el-option
-                    v-for="item in options"
-                    :key="item.value"
-                    :label="item.label"
-                    :value="item.value">
-                    </el-option>
-                </el-select>
-                <el-select v-model="value" placeholder="请选择">
-                    <el-option
-                    v-for="item in options"
-                    :key="item.value"
-                    :label="item.label"
-                    :value="item.value">
-                    </el-option>
-                </el-select>
-                <el-button type="primary">查询</el-button>
+              <line-chart :options="chart"></line-chart>
+              <!--              <line-chart :options="bar" v-if="query.statistics_type == 9 || query.statistics_type == 10"></line-chart>-->
+              <!--              <line-chart></line-chart>-->
+
             </div>
+            <div class="tableTitle">统计表</div>
             <div>
-                <el-button type="primary">打印</el-button>
-                <el-button type="primary">导出</el-button>
-            </div>
-       </div>
-       <div style="margin: 20px 0px;">
-        <h2 >患者列表</h2>
-       </div>
-       <div >
-        <el-row :gutter="20">
-            <el-col :span="4">
-              <div class="grid-content bg-purple">
-                <!-- <span style="font-size: 18px;font-weight: bold;display: block;">患者列表</span> -->
-                <!-- <h2>患者列表</h2> -->
-                <el-table
-                :data="tableData"
-                border
-                style="width: 100%">
-                    <el-table-column
-                        align="center"
-                        prop="date"
-                        label="透析号"
-                       >
-                    </el-table-column>
-                    <el-table-column
-                        align="center"
-                        prop="name"
-                        label="姓名"
-                        >
-                    </el-table-column>
-                </el-table>
-              </div>
-            </el-col>
-            <el-col :span="19">
-               <div class="grid-content bg-purple">
-                <div class="echart" id="germychart" style="width:100%;height:400px"></div>
-                <el-table
-                    :data="tableData"
-                    style="width: 100%"
-                    border
-                    align="center"
-                    max-height="250">
-                    <el-table-column
-                    fixed
-                    prop="date"
-                    label="姓名"
-                   >
-                    </el-table-column>
-                    <el-table-column
-                    prop="name"
-                    label="检查日期"
-                    >
-                    </el-table-column>
-                    <el-table-column
-                    prop="province"
-                    label="血红蛋白（g/L）"
-                    >
-                    </el-table-column>
-                    
-                </el-table>
-               </div>
-           </el-col>
-        </el-row>
-       </div>
+              <el-table ref="table" :data="tableData" v-loading="loading" border :row-style="{ color: '#303133' }" :header-cell-style="{backgroundColor: 'rgb(245, 247, 250)',color: '#606266'}">
+                <el-table-column label="姓名" align="center">
+                  <template slot-scope="scope">
+                    {{scope.row.name}}
+                  </template>
+                </el-table-column>
+
+                <el-table-column width="100" label="检查日期" align="center">
+                  <template slot-scope="scope">
+                    {{getTime(scope.row.inspect_date)}}
+
+                  </template>
+                </el-table-column>
 
+                <el-table-column width="100" label="血红蛋白" align="center">
+                  <template slot-scope="scope">
+                    {{scope.row.value}}
+                  </template>
+                </el-table-column>
+              </el-table>
+
+
+            </div>
+          </div>
+        </el-container>
+      </div>
     </div>
+  </div>
 </template>
+
+
 <script>
-  import * as echarts from 'echarts'
-export default{
-    // props: {
-    //     width: {
-    //         type: String,
-    //         default: "100%"
-    //     },
-    //     height: {
-    //         type: String,
-    //         default: "400px"
-    //     },
-    
-    // },
-    data() {
-        return {
-            inputValue:'',
-            stat_time:'',
-            end_time:'',
-            value:'',
-            myChart: {},
-            xData: ["Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"], //横坐标
-            opinionData: [23, 24, 18, 25, 27, 28, 25], //人数数据
-            // myChartStyle: { float: "left", width: "100%", height: "400px" },//图表样式
-            tableData:[],
+import echarts from 'echarts'
+import {  uParseTime } from '@/utils/tools'
+import { getCurrentOrgPatients } from '@/api/common/common'
+import {
+  GetDefaultPatient,
+} from '@/api/common/statistics'
+import { PostSearch } from '@/api/patient'
+import { getDataConfig } from '@/utils/data'
+import { GetPersonQCStatistisData } from '../../../api/qcd'
+import LineChart from '../../qcd/components/LineChart.vue'
+
+export default {
+  components: {
+    LineChart
+  },
+  data() {
+    return {
+      pickerOptions: {
+        disabledDate(time) {
+          let threeMonths = new Date(new Date().setFullYear(new Date().getFullYear() - 1)).getTime() - 24 * 3600 * 1000
+          return time.getTime() > Date.now() || time.getTime() < threeMonths
+
         }
-    },
-    created(){
-        
-    },
-    mounted() {
-        // this.$nextTick(function() {
-            this.initEcharts();
-		// })  
-        // this.myChart = echarts.init(document.getElementById("germychart"));
-        //     this.myChart.setOption(option);
-            //随着屏幕大小调节图表
-            window.addEventListener("resize", () => {
-                this.myChart.resize();
-            });
-    },
-    methods:{
-        handleSubmit(){
-            console.log('asdfa');
+      },
+      patient_name:'',
+      percent:[],
+      patientsData: [],
+      tableData: [],
+      loading: false,
+      search_value: '',
+      total: 0,
+      query: {
+        patient_id: '',
+        statistics_type: 1,
+        start_time: '',
+        end_time: '',
+        limit: 10,
+        page: 1
+      },
+      crumbs: [
+        { path: false, name: '科室质控' },
+        { path: false, name: '指标评估统计' },
+        { path: false, name: '透析过程指标统计' }
+      ],
+      tableData1: [],
+      chart: {
+        title: {
+          text: 'ECharts 入门示例'
         },
-        initEcharts() {
-            const option = {
-                xAxis: {
-                    type: 'category',
-                        boundaryGap:true,
-                        axisTick:{
-                            alignWithLabel:true //保证刻度线和标签对齐
-                        },
-                    data: this.xData,
-                    splitNumber:this.xData.length, //纵坐标数
-                    interval:this.xData //强制设置坐标轴分割间隔
-                },
-                yAxis: {
-                    type: 'value',
-                    boundaryGap: true,
-                    splitNumber:4, //纵坐标数
-                    interval:10 //强制设置坐标轴分割间隔
+        tooltip: {},
+        legend: {
+          data: [],
+          left: 0
+        },
+        xAxis: {
+          data: []
+        },
+        yAxis: {
+          axisLabel: {
+            formatter: '{value} %'
+          },
+          show: false
+        },
+        series: [
+          {
+            name: '',
+            type: 'line',
+            data: [],
+            barWidth: 30,
+            label: {
+              normal: {
+                show: true,
+                position: 'top',
+                formatter: (params) => {
+                  if(this.percent.length > 0){
+                    let str = ''
+                    str = params.data + '('+ this.percent[params.dataIndex] +'%)'
+                    return str
+                  }else{
+                    let str = ''
+                    str = params.data
+                    return str
+                  }
+                }
+              }
+            },
+            //配置样式
+            itemStyle: {
+              //通常情况下：
+
+              //每个柱子的颜色即为colorList数组里的每一项，如果柱子数目多于colorList的长度，则柱子颜色循环使用该数组
+              normal: {
+                color: function(params) {
+                  //我这边就两个柱子，大体就两个柱子颜色渐变，所以数组只有两个值，多个颜色就多个值
+                  var colorList = [
+                    ['#A9E0F3', '#9FBDFC'],
+
+                    ['#FFD7C0', '#FF9994']
+                  ]
+
+                  var index = params.dataIndex
+                  if (params.dataIndex >= colorList.length) {
+                    index = params.dataIndex % colorList.length
+                  }
+
+                  return new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+                    { offset: 0, color: colorList[index][0] },
+                    // { offset: 0.5, color: colorList[index][1] },
+                    { offset: 1, color: colorList[index][1] }
+                  ])
                 },
-                legend: {
-                    show: true,
-                    align:'left',//文字在前图标在后
-                    left:'15%',
-                    top:'5%',
-                    data: [{name:'血红蛋白g/L'}]
+                lineStyle:{
+                  color:'#409eff' //改变折线颜色
                 },
-                series: [
-                {
-                    data: this.opinionData,
-                    name:'血红蛋白g/L',
-                    type: "line",// 类型设置为折线图
-                    symbol: 'circle',
-                    itemStyle: {
-                        normal: {
-                            color: '#409eff', //改变折线点的颜色#a80000
-                            lineStyle: {
-                                color: '#409eff' //改变折线颜色
-                            }
-                        }
-                    },
+                barBorderRadius: [5, 5, 0, 0] //柱状角成椭圆形
+              },
 
-                },
-                
-                ],
-                
-            };
-            this.myChart = echarts.init(document.getElementById("germychart"));
-            this.myChart.setOption(option);
-            //随着屏幕大小调节图表
-            window.addEventListener("resize", () => {
-                this.myChart.resize();
-            });
+              //鼠标悬停时：
+              emphasis: {
+                shadowBlur: 10,
+                shadowOffsetX: 0,
+                shadowColor: 'rgba(0, 0, 0, 0.5)'
+              }
+            }
+          }
+        ],
+        dataZoom: [
+          {
+            // Y轴固定,让内容滚动
+            type: 'slider',
+            show: false,
+            xAxisIndex: [0],
+            start: 1,
+            end: 20, // 设置X轴刻度之间的间隔(根据数据量来调整)
+            zoomLock: true // 锁定区域禁止缩放(鼠标滚动会缩放,所以禁止)
+          },
+          {
+            type: 'inside',
+            xAxisIndex: [0],
+            start: 1,
+            end: 20,
+            zoomLock: true // 锁定区域禁止缩放
+          }
+        ]
+      },
+      bar: {
+        title: {
+          text: 'ECharts 入门示例'
         },
+        tooltip: {},
+        legend: {
+          data: [],
+          left: 0
+        },
+        xAxis: {
+          data: []
+        },
+        yAxis: {
+          axisLabel: {
+            formatter: '{value} %'
+          },
+          show: false
+        },
+        series: [
+          {
+            name: '',
+            type: 'bar',
+            data: [],
+            barWidth: 30,
+            label: {
+              normal: {
+                show: true,
+                position: 'top',
+                formatter: (params) => {
+                  if(this.percent.length > 0){
+                    let str = ''
+                    str = params.data + '('+ this.percent[params.dataIndex] +'%)'
+                    return str
+                  }else{
+                    let str = ''
+                    str = params.data
+                    return str
+                  }
+                }
+              }
+            },
+            //配置样式
+            itemStyle: {
+              //通常情况下：
+
+              //每个柱子的颜色即为colorList数组里的每一项，如果柱子数目多于colorList的长度，则柱子颜色循环使用该数组
+              normal: {
+                color: function(params) {
+                  //我这边就两个柱子，大体就两个柱子颜色渐变，所以数组只有两个值，多个颜色就多个值
+                  var colorList = [
+                    ['#A9E0F3', '#9FBDFC'],
+                    ['#FFD7C0', '#FF9994']
+                  ]
+
+                  var index = params.dataIndex
+                  if (params.dataIndex >= colorList.length) {
+                    index = params.dataIndex % colorList.length
+                  }
+
+                  return new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+                    { offset: 0, color: colorList[index][0] },
+                    // { offset: 0.5, color: colorList[index][1] },
+                    { offset: 1, color: colorList[index][1] }
+                  ])
+                },
+                barBorderRadius: [5, 5, 0, 0] //柱状角成椭圆形
+              },
+
+              //鼠标悬停时：
+              emphasis: {
+                shadowBlur: 10,
+                shadowOffsetX: 0,
+                shadowColor: 'rgba(0, 0, 0, 0.5)'
+              }
+            }
+          }
+        ]
+      }
+
+    }
+  },
+  methods: {
+    printAction(){
+      this.$router.push({
+        path: "/Dialysisanalysis/qualitycontrol/print?patient_id=" + this.query.patient_id+"&project_id="+this.query.project_id+"&item_id="+this.query.item_id+"&start_time="+this.query.start_time+"&end_time="+this.query.end_time
+      });
+
+    },exportAction(){
+      let list = []
+      for (let i = 0; i < this.tableData.length; i++) {
+        let order = this.tableData[i]
+        let name = order.name
+        let value = order.value
+        let inspect_date = order.inspect_date
+
+        let obj = {
+          '姓名': name,
+          '数值': value,
+          '日期': inspect_date,
+        }
+        list.push(obj)
+      }
+      import('@/vendor/Export2Excel').then(excel => {
+        const tHeader = ['姓名', '数值', '日期']
+        const filterVal = ['姓名', '数值', '日期']
+        const data = this.formatJson(filterVal, list)
+        excel.export_json_to_excel1({
+          header: tHeader,
+          data,
+          filename: '明细',
+          ref: this.$refs['table'].$el
+        })
+      })
+    },
+    changeProject(val) {
+      this.query.statistics_type = val
+      this.query.page = 1
+      this.GetPersonQCStatistisData(this.query)
+      this.GetInspectionCheckIndexTableData(this.query)
+
+    },
+    handleChange(val) {
+      this.query.patient_id = val.id
+      this.query.page = 1
+      this.patient_name = val.name
+      this.GetPersonQCStatistisData(this.query)
+      this.GetInspectionCheckIndexTableData(this.query)
+    },
+    handleSizeChange(limit) {
+      this.query.limit = limit
+      this.GetInspectionCheckIndexTableData(this.query)
+
+    },
+    handleCurrentChange(page) {
+      this.query.page = page
+      this.GetPersonQCStatistisData(this.query)
+    },formatJson(filterVal, jsonData) {
+      return jsonData.map(v => filterVal.map(j => v[j]))
+    },
+    changeTime(val) {
+      var time = this.getTimestamp(val) - this.getTimestamp(this.query.end_time)
+      if (time > 0) {
+        this.$message.error('结束时间不能小于开始时间')
+        this.query.start_time = ''
+      } else {
+        // this.getDialysisList()
+        this.query.page = 1
+        this.GetPersonQCStatistisData(this.query)
+        this.GetInspectionCheckIndexTableData(this.query)
+
+      }
+
+    },
+    changeEndTime(val) {
+      var time =
+        this.getTimestamp(val) - this.getTimestamp(this.query.start_time)
+      if (time < 0) {
+        this.$message.error('结束时间不能小于开始时间')
+        this.query.end_time = ''
+      } else {
+        this.query.page = 1
+        this.GetPersonQCStatistisData(this.query)
+        this.GetInspectionCheckIndexTableData(this.query)
+
+      }
+    },
+    getTimestamp(time) {
+      // 把时间日期转成时间戳
+      return new Date(time).getTime() / 1000
+    },
+    QueryOperaById: function(val) {
+      let vascular_access_desc_name = ''
+      let vascular_access_desc = getDataConfig(
+        'hemodialysis',
+        'vascular_access_desc'
+      )
+      for (let i = 0; i < vascular_access_desc.length; i++) {
+        if (vascular_access_desc[i].id == val) {
+          vascular_access_desc_name = vascular_access_desc[i].name
+        }
+      }
+
+      return vascular_access_desc_name
     },
-    
+    GetAnticoagulantById: function(val) {
+      let anticoagulan_name = ''
+      var anticoagulantsConfitTwo = this.$store.getters.anticoagulants_confit
+      let anticoagulant = anticoagulantsConfitTwo
+      for (let keys in anticoagulant) {
+        if (anticoagulant[keys].id == val) {
+          anticoagulan_name = anticoagulant[keys].name
+        }
+      }
+      return anticoagulan_name
+    },
+    getModeName(mode_id) {
+      return this.$store.getters.treatment_mode[mode_id] != undefined ? this.$store.getters.treatment_mode[mode_id].name : ''
+    },  getTime(val) {
+      if(val == "" || val == undefined){
+        return ""
+      }else {
+        return uParseTime(val, '{y}-{m}-{d}')
+      }
+    },
+    GetInspectionCheckIndexTableData(params) {
+      this.loading = true
+      GetPersonQCStatistisData(params)
+        .then(rs => {
+          var resp = rs.data
+          console.log("resp=====",resp)
+          if (resp.state == 1) {
+            this.loading = false
+            this.tableData = []
+            for (let i = 0; i < resp.data.inspections.length; i++) {
+              let obj = {
+                name:resp.data.patient.name,
+                value:resp.data.inspections[i].inspect_value,
+                inspect_date:resp.data.inspections[i].inspect_date
+              }
+              this.tableData.push(obj)
+            }
+            this.total = resp.data.total
+
+          } else {
+            this.loading = false
+          }
+        })
+        .catch(error => {
+
+        })
+    },
+    GetPersonQCStatistisData(params) {
+      this.chart.xAxis.data = []
+      this.chart.series[0].data = []
+      this.bar.xAxis.data = []
+      this.bar.series[0].data = []
+      this.percent = []
+      GetPersonQCStatistisData(params)
+        .then(rs => {
+          var resp = rs.data
+          if (resp.state == 1) {
+            console.log(resp.data.inspections)
+            for (let i = 0; i < resp.data.inspections.length; i++) {
+              this.chart.xAxis.data.push(this.getTime(resp.data.inspections[i].inspect_date))
+              this.chart.series[0].data.push(resp.data.inspections[i].inspect_value)
+            }
+            console.log(this.chart.xAxis.data)
+            console.log( this.chart.series[0].data)
+
+            this.getArrLength(this.chart.xAxis.data,1)
+          } else {
+
+          }
+        })
+        .catch(error => {
+        })
+    },
+    handleSelect(val) {
+      this.query.patient_id = val.id
+      this.query.page = 1
+      this.patient_name = val.name
+      for (let i = 0;i < this.patientsData.length; i++){
+        if (this.patientsData[i].id == val.id){
+          this.$refs.table.setCurrentRow(this.patientsData[i])
+        }
+      }
+
+
+    },
+    querySearchAsync(keyword, cb) {
+      let key = ''
+      if (keyword != undefined) {
+        key = keyword
+      }
+      let searchArray = []
+      PostSearch(key).then(response => {
+        if (response.data.state == 1) {
+          searchArray = response.data.data.patient
+          cb(searchArray)
+        } else {
+          cb([])
+        }
+      })
+    },
+    chooseWay(way) {
+      this.wayType = way
+    }, getCurrentOrgPatients() {
+      getCurrentOrgPatients().then(response => {
+        if (response.data.state == 1) {
+          var patients = response.data.data.patients
+          this.patientsData = patients
+          this.GetDefaultPatient()
+        }
+      })
+    }, GetDefaultPatient() {
+      GetDefaultPatient().then(response => {
+        if (response.data.state == 1) {
+          var patient = response.data.data.patient
+          for (let i = 0;i < this.patientsData.length; i++){
+            if (this.patientsData[i].id == patient.id){
+              this.patient_name = this.patientsData[i].name
+              this.$refs.table.setCurrentRow(this.patientsData[i])
+            }
+          }
+          this.query.patient_id = patient.id
+          this.GetPersonQCStatistisData(this.query)
+
+        }
+      })
+
+    },
+    getArrLength(result,type){
+      if(type == 1){
+        if(result.length > 10){
+          var dataZoom_end = (10/result.length)*100;
+          this.chart.dataZoom[0].end = dataZoom_end
+        }else{
+          var dataZoom_end = 100;
+          this.chart.dataZoom[0].end = dataZoom_end
+        }
+      }else if(type == 2){
+        if(result.length > 10){
+          var dataZoom_end = (10/result.length)*100;
+          this.bar.dataZoom[0].end = dataZoom_end
+        }else{
+          var dataZoom_end = 100;
+          this.bar.dataZoom[0].end = dataZoom_end
+        }
+      }
+
+    }
+  }, mounted() {
+    var date = new Date()
+    var year = date.getFullYear() //获取完整的年份(4位)
+    var month = date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1).toString() : date.getMonth() + 1 //获取当前月份(0-11,0代表1月)
+    var day = date.getDate() < 10 ? '0' + date.getDate().toString() : date.getDate() //获取当前日(1-31)
+    var last_month = date.getMonth() < 10 ? '0' + date.getMonth().toString() : date.getMonth() //获取当前月份(0-11,0代表1月)
+    this.query.patient_id = 0
+    this.query.end_time = year + '-' + month + '-' + day
+    this.query.start_time = year + '-' + last_month + '-' + day
+    this.query.project_id = 1
+    this.query.item_id = 17
+    this.getCurrentOrgPatients()
+
+    // this.GetPersonQCStatistisData()
+
+
+  }
 }
 </script>
+
 <style lang="scss" scoped>
-.content_top{
-    display: flex;
-    justify-content: space-around;
-    margin-bottom: 20px;
+.tableTitle {
+  font-size: 16px;
+  color: #000;
+  font-weight: bold;
+  margin-bottom: 10px;
+}
+</style>
+<style lang="scss">
+.page_process {
+.el-tabs{
+  margin-bottom:0 !important;
+}
+.el-button--medium {
+  padding: 10px 8px;
+}
+
+.el-form-item {
+  margin-bottom: 0;
+}
+::-webkit-scrollbar{
+  height: 15px !important;
+}
+
 }
-</style>
+</style>

src/xt_pages/Dialysisanalysis/otherIndicators/otherall.vue

@@ -27,9 +27,9 @@
             </div>
             <el-button type="primary">查询</el-button>
         </div> -->
-        
+
         <el-row :gutter="20">
-        <el-col :span="5"> 
+        <el-col :span="5">
           <div class="block">
             <span>查询时间:</span>
             <el-date-picker
@@ -63,7 +63,7 @@
             <el-button type="primary">查询</el-button>
         </el-col>
         </el-row>
-        
+
         <div class="cell clearfix" style="margin: 20px; font-weight: bold;">
           <p class="chartTitle">统计图</p>
         </div>
@@ -82,20 +82,20 @@
                 </el-table-column>
                 <el-table-column
                     prop="name"
-                    
+
                     label="人数"
                     >
                 </el-table-column>
-                <el-table-column
-                    prop="address"
-                    align="center"
-                    label="操作">
-                    <template slot-scope="scope">
-                        <el-button @click="handleClick(scope.row)" style="font-size:16px;"
-                                type="text" >查看详情
-                        </el-button>
-                    </template>
-                </el-table-column>
+<!--                <el-table-column-->
+<!--                    prop="address"-->
+<!--                    align="center"-->
+<!--                    label="操作">-->
+<!--                    <template slot-scope="scope">-->
+<!--                        <el-button @click="handleClick(scope.row)" style="font-size:16px;"-->
+<!--                                type="text" >查看详情-->
+<!--                        </el-button>-->
+<!--                    </template>-->
+<!--                </el-table-column>-->
             </el-table>
         </div>
     </div>
@@ -104,7 +104,7 @@
 import * as echarts from "echarts";
 export default{
     props: {
-   
+
     width: {
       type: String,
       default: "100%"
@@ -113,7 +113,7 @@ export default{
       type: String,
       default: "400px"
     },
-    
+
   },
     data() {
         return {
@@ -143,7 +143,7 @@ export default{
         //   value: 147,
         //   name: "湖南"
         // }
-            
+
             ],
             pieName: [],
             // myChartStyle:{float: "right", width: "100%", height: "400px"},
@@ -181,25 +181,12 @@ export default{
           {
             type: "pie",
             label: {
-              normal : {
-                formatter: '{b}:{c}: ({d}%)',
-                textStyle : {
-                    fontWeight : 'normal',
-                    fontSize : 15,
-                    color : "black"
-                }
-              }
-              // b代表名称，c代表对应值，d代表百分比"{b} : {d}% ({c})" 
+              show: true,
+              formatter:"{b} : {d}% ({c})"
+              // b代表名称，c代表对应值，d代表百分比"{b} : {d}% ({c})"
             },
             radius: "65%", //饼图半径
-            data: this.pieData,
-            itemStyle : {
-              emphasis: {
-                shadowBlur: 10,
-                shadowOffsetX: 0,
-                shadowColor: 'rgba(0, 0, 0, 0.5)'
-              }
-            }
+            data: this.pieData
           }
         ]
       };
@@ -259,4 +246,4 @@ export default{
     justify-content: space-around;
     color: #1e5feb;
 }
-</style>
+</style>

src/xt_pages/Dialysisanalysis/otherIndicators/otheralone.vue

@@ -1,217 +1,649 @@
 <template>
-    <div>
-       <div class="content_top">
-            <el-autocomplete
-            class="inline-input"
-            v-model="inputValue"
-            :fetch-suggestions="querySearch"
-            :trigger-on-focus="false"
-            placeholder="请输入患者名字或透析号"
-            @select="handleSubmit"
-            ></el-autocomplete>
+  <div class="main-contain">
+    <div class="app-container">
+      <div class="page_process">
+        <new-nav activeName="process"></new-nav>
+        <div class="cell clearfix">
+          <el-form :inline="true">
+            <el-form-item label>
+              <el-autocomplete
+                class="checkSearch"
+                popper-class="my-autocomplete"
+                v-model="search_value"
+                :fetch-suggestions="querySearchAsync"
+                :trigger-on-focus="false"
+                placeholder="请输入病人名字"
+                @select="handleSelect"
+                style="width:160px;"
+              >
+                <i class="el-icon-search el-input__icon" slot="suffix"></i>
+                <template slot-scope="{ item }">
+                  <div class="name">{{ item.name }}</div>
+                </template>
+              </el-autocomplete>
+
+            </el-form-item>
+          </el-form>
+
+          <label class="title">
+            <span class="name">日期查询</span> :
+          </label>
+          <el-date-picker
+            v-model="query.start_time"
+            prefix-icon="el-icon-date"
+            @change="changeTime"
+            :editable="false"
+            style="width: 150px;"
+            type="date"
+            placeholder="选择日期时间"
+            align="right"
+            format="yyyy-MM-dd"
+            value-format="yyyy-MM-dd"
+          ></el-date-picker>
+          <span class>-</span>
+          <el-date-picker
+            v-model="query.end_time"
+            prefix-icon="el-icon-date"
+            @change="changeEndTime"
+            :editable="false"
+            style="width: 150px;"
+            type="date"
+            placeholder="选择日期时间"
+            align="right"
+            format="yyyy-MM-dd"
+            value-format="yyyy-MM-dd"
+          ></el-date-picker>
+
+          <el-button size="small" icon="el-icon-printer" @click="printAction" type="primary">打印
+          </el-button>
+          <el-button size="small" icon="el-icon-printer" @click="exportAction" type="primary">导出
+
+          </el-button>
+        </div>
+
+        <el-container>
+          <div style="width:160px">
+
+            <div class="tableTitle">患者列表</div>
+
+
+            <el-table ref="table" :data="patientsData" border style="width: 100%;" height="500"
+                      :row-style="{ color: '#303133' }"
+                      :header-cell-style="{backgroundColor: 'rgb(245, 247, 250)',color: '#606266'}"
+                      highlight-current-row
+                      @current-change="handleChange">
+              <el-table-column prop="dialysis_no" label="透析号" width="70" align="center">
+                <template slot-scope="scope">{{scope.row.dialysis_no}}</template>
+              </el-table-column>
+              <el-table-column prop="name" label="姓名" width="90" align="center">
+                <template slot-scope="scope">{{ scope.row.name }}</template>
+              </el-table-column>
+            </el-table>
+          </div>
+          <div style="padding-left:10px;flex:1;width:0;">
+            <div class="tableTitle">指标趋势<span style="font-weight:normal">&nbsp;&nbsp;（当前患者: {{patient_name}}）</span></div>
             <div>
-                <span>查询时间:</span>
-                <el-date-picker
-                v-model="stat_time"
-                type="date"
-                placeholder="选择日期">
-                </el-date-picker>
-                <span>-</span>
-                <el-date-picker
-                v-model="end_time"
-                type="date"
-                placeholder="选择日期">
-                </el-date-picker>
-                <el-select v-model="value" placeholder="请选择">
-                    <el-option
-                    v-for="item in options"
-                    :key="item.value"
-                    :label="item.label"
-                    :value="item.value">
-                    </el-option>
-                </el-select>
-                <el-select v-model="value" placeholder="请选择">
-                    <el-option
-                    v-for="item in options"
-                    :key="item.value"
-                    :label="item.label"
-                    :value="item.value">
-                    </el-option>
-                </el-select>
-                <el-button type="primary">查询</el-button>
+              <line-chart :options="chart"
+                          v-if="query.statistics_type != 9 && query.statistics_type != 10"></line-chart>
+              <line-chart :options="bar" v-if="query.statistics_type == 9 || query.statistics_type == 10"></line-chart>
+
             </div>
+            <div class="tableTitle">统计表</div>
             <div>
-                <el-button type="primary">打印</el-button>
-                <el-button type="primary">导出</el-button>
-            </div>
-       </div>
-       <div style="margin: 20px 0px;">
-        <h2 >患者列表</h2>
-       </div>
-       <div >
-        <el-row :gutter="20">
-            <el-col :span="4">
-              <div class="grid-content bg-purple">
-                <!-- <span style="font-size: 18px;font-weight: bold;display: block;">患者列表</span> -->
-                <!-- <h2>患者列表</h2> -->
-                <el-table
-                :data="tableData"
-                border
-                style="width: 100%">
-                    <el-table-column
-                        align="center"
-                        prop="date"
-                        label="透析号"
-                       >
-                    </el-table-column>
-                    <el-table-column
-                        align="center"
-                        prop="name"
-                        label="姓名"
-                        >
-                    </el-table-column>
-                </el-table>
-              </div>
-            </el-col>
-            <el-col :span="19">
-               <div class="grid-content bg-purple">
-                <div class="echart" id="germychart" style="width:100%;height:400px"></div>
-                <el-table
-                    :data="tableData"
-                    style="width: 100%"
-                    border
-                    align="center"
-                    max-height="250">
-                    <el-table-column
-                    fixed
-                    prop="date"
-                    label="姓名"
-                   >
-                    </el-table-column>
-                    <el-table-column
-                    prop="name"
-                    label="检查日期"
-                    >
-                    </el-table-column>
-                    <el-table-column
-                    prop="province"
-                    label="白蛋白（g/L）"
-                    >
-                    </el-table-column>
-                    
-                </el-table>
-               </div>
-           </el-col>
-        </el-row>
-       </div>
+              <el-table ref="table" :data="tableData" v-loading="loading" border :row-style="{ color: '#303133' }" :header-cell-style="{backgroundColor: 'rgb(245, 247, 250)',color: '#606266'}">
+                <el-table-column label="姓名" align="center">
+                  <template slot-scope="scope">
+                  </template>
+                </el-table-column>
+
+                <el-table-column width="100" label="检查日期" align="center">
+                  <template slot-scope="scope">
+                  </template>
+                </el-table-column>
 
+                <el-table-column width="100" label="甲状旁腺激素分析" align="center">
+                  <template slot-scope="scope">
+                  </template>
+                </el-table-column>
+              </el-table>
+
+              <el-pagination
+                align="right"
+                @size-change="handleSizeChange"
+                @current-change="handleCurrentChange"
+                :current-page="query.page"
+                :page-sizes="[10, 20, 50, 100]"
+                :page-size="10"
+                background
+                style="margin-top:20px;"
+                layout="total, sizes, prev, pager, next, jumper"
+                :total="total"
+              ></el-pagination>
+            </div>
+          </div>
+        </el-container>
+      </div>
     </div>
+  </div>
 </template>
+
+
 <script>
-  import * as echarts from 'echarts'
-export default{
-    // props: {
-    //     width: {
-    //         type: String,
-    //         default: "100%"
-    //     },
-    //     height: {
-    //         type: String,
-    //         default: "400px"
-    //     },
-    
-    // },
-    data() {
-        return {
-            inputValue:'',
-            stat_time:'',
-            end_time:'',
-            value:'',
-            myChart: {},
-            xData: ["Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"], //横坐标
-            opinionData: [23, 24, 18, 25, 27, 28, 25], //人数数据
-            // myChartStyle: { float: "left", width: "100%", height: "400px" },//图表样式
-            tableData:[],
+import echarts from 'echarts'
+// import LineChart from '../../qcd/components/LineChart'
+import {  uParseTime } from '@/utils/tools'
+import { getCurrentOrgPatients } from '@/api/common/common'
+import {
+  GetDefaultPatient,
+} from '@/api/common/statistics'
+import { PostSearch } from '@/api/patient'
+import { getDataConfig } from '@/utils/data'
+import { GetPersonQCStatistisData } from '../../../api/qcd'
+
+export default {
+  components: {
+  },
+  data() {
+    return {
+      pickerOptions: {
+        disabledDate(time) {
+          let threeMonths = new Date(new Date().setFullYear(new Date().getFullYear() - 1)).getTime() - 24 * 3600 * 1000
+          return time.getTime() > Date.now() || time.getTime() < threeMonths
+
         }
-    },
-    created(){
-        
-    },
-    mounted() {
-        // this.$nextTick(function() {
-            this.initEcharts();
-		// })  
-        // this.myChart = echarts.init(document.getElementById("germychart"));
-        //     this.myChart.setOption(option);
-            //随着屏幕大小调节图表
-            window.addEventListener("resize", () => {
-                this.myChart.resize();
-            });
-    },
-    methods:{
-        handleSubmit(){
-            console.log('asdfa');
+      },
+      patient_name:'',
+      percent:[],
+      patientsData: [],
+      tableData: [],
+      loading: false,
+      search_value: '',
+      total: 0,
+      query: {
+        patient_id: '',
+        statistics_type: 1,
+        start_time: '',
+        end_time: '',
+        limit: 10,
+        page: 1
+      },
+      crumbs: [
+        { path: false, name: '科室质控' },
+        { path: false, name: '指标评估统计' },
+        { path: false, name: '透析过程指标统计' }
+      ],
+      tableData1: [],
+      chart: {
+        title: {
+          text: 'ECharts 入门示例'
         },
-        initEcharts() {
-            const option = {
-                xAxis: {
-                    type: 'category',
-                        boundaryGap:true,
-                        axisTick:{
-                            alignWithLabel:true //保证刻度线和标签对齐
-                        },
-                    data: this.xData,
-                    splitNumber:this.xData.length, //纵坐标数
-                    interval:this.xData //强制设置坐标轴分割间隔
-                },
-                yAxis: {
-                    type: 'value',
-                    boundaryGap: true,
-                    splitNumber:4, //纵坐标数
-                    interval:10 //强制设置坐标轴分割间隔
+        tooltip: {},
+        legend: {
+          data: [],
+          left: 0
+        },
+        xAxis: {
+          data: []
+        },
+        yAxis: {
+          axisLabel: {
+            formatter: '{value} %'
+          },
+          show: false
+        },
+        series: [
+          {
+            name: '',
+            type: 'line',
+            data: [],
+            barWidth: 30,
+            label: {
+              normal: {
+                show: true,
+                position: 'top',
+                formatter: (params) => {
+                  if(this.percent.length > 0){
+                    let str = ''
+                    str = params.data + '('+ this.percent[params.dataIndex] +'%)'
+                    return str
+                  }else{
+                    let str = ''
+                    str = params.data
+                    return str
+                  }
+                }
+              }
+            },
+            //配置样式
+            itemStyle: {
+              //通常情况下：
+
+              //每个柱子的颜色即为colorList数组里的每一项，如果柱子数目多于colorList的长度，则柱子颜色循环使用该数组
+              normal: {
+                color: function(params) {
+                  //我这边就两个柱子，大体就两个柱子颜色渐变，所以数组只有两个值，多个颜色就多个值
+                  var colorList = [
+                    ['#A9E0F3', '#9FBDFC'],
+
+                    ['#FFD7C0', '#FF9994']
+                  ]
+
+                  var index = params.dataIndex
+                  if (params.dataIndex >= colorList.length) {
+                    index = params.dataIndex % colorList.length
+                  }
+
+                  return new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+                    { offset: 0, color: colorList[index][0] },
+                    // { offset: 0.5, color: colorList[index][1] },
+                    { offset: 1, color: colorList[index][1] }
+                  ])
                 },
-                legend: {
-                    show: true,
-                    align:'left',//文字在前图标在后
-                    left:'15%',
-                    top:'5%',
-                    data: [{name:'白蛋白g/L'}]
+                lineStyle:{
+                  color:'#409eff' //改变折线颜色
                 },
-                series: [
-                {
-                    data: this.opinionData,
-                    name:'白蛋白g/L',
-                    type: "line",// 类型设置为折线图
-                    symbol: 'circle',
-                    itemStyle: {
-                        normal: {
-                            color: '#409eff', //改变折线点的颜色#a80000
-                            lineStyle: {
-                                color: '#409eff' //改变折线颜色
-                            }
-                        }
-                    },
+                barBorderRadius: [5, 5, 0, 0] //柱状角成椭圆形
+              },
 
-                },
-                
-                ],
-                
-            };
-            this.myChart = echarts.init(document.getElementById("germychart"));
-            this.myChart.setOption(option);
-            //随着屏幕大小调节图表
-            window.addEventListener("resize", () => {
-                this.myChart.resize();
-            });
+              //鼠标悬停时：
+              emphasis: {
+                shadowBlur: 10,
+                shadowOffsetX: 0,
+                shadowColor: 'rgba(0, 0, 0, 0.5)'
+              }
+            }
+          }
+        ],
+        dataZoom: [
+          {
+            // Y轴固定,让内容滚动
+            type: 'slider',
+            show: false,
+            xAxisIndex: [0],
+            start: 1,
+            end: 20, // 设置X轴刻度之间的间隔(根据数据量来调整)
+            zoomLock: true // 锁定区域禁止缩放(鼠标滚动会缩放,所以禁止)
+          },
+          {
+            type: 'inside',
+            xAxisIndex: [0],
+            start: 1,
+            end: 20,
+            zoomLock: true // 锁定区域禁止缩放
+          }
+        ]
+      },
+      bar: {
+        title: {
+          text: 'ECharts 入门示例'
+        },
+        tooltip: {},
+        legend: {
+          data: [],
+          left: 0
         },
+        xAxis: {
+          data: []
+        },
+        yAxis: {
+          axisLabel: {
+            formatter: '{value} %'
+          },
+          show: false
+        },
+        series: [
+          {
+            name: '',
+            type: 'bar',
+            data: [],
+            barWidth: 30,
+            label: {
+              normal: {
+                show: true,
+                position: 'top',
+                formatter: (params) => {
+                  if(this.percent.length > 0){
+                    let str = ''
+                    str = params.data + '('+ this.percent[params.dataIndex] +'%)'
+                    return str
+                  }else{
+                    let str = ''
+                    str = params.data
+                    return str
+                  }
+                }
+              }
+            },
+            //配置样式
+            itemStyle: {
+              //通常情况下：
+
+              //每个柱子的颜色即为colorList数组里的每一项，如果柱子数目多于colorList的长度，则柱子颜色循环使用该数组
+              normal: {
+                color: function(params) {
+                  //我这边就两个柱子，大体就两个柱子颜色渐变，所以数组只有两个值，多个颜色就多个值
+                  var colorList = [
+                    ['#A9E0F3', '#9FBDFC'],
+                    ['#FFD7C0', '#FF9994']
+                  ]
+
+                  var index = params.dataIndex
+                  if (params.dataIndex >= colorList.length) {
+                    index = params.dataIndex % colorList.length
+                  }
+
+                  return new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+                    { offset: 0, color: colorList[index][0] },
+                    // { offset: 0.5, color: colorList[index][1] },
+                    { offset: 1, color: colorList[index][1] }
+                  ])
+                },
+                barBorderRadius: [5, 5, 0, 0] //柱状角成椭圆形
+              },
+
+              //鼠标悬停时：
+              emphasis: {
+                shadowBlur: 10,
+                shadowOffsetX: 0,
+                shadowColor: 'rgba(0, 0, 0, 0.5)'
+              }
+            }
+          }
+        ]
+      }
+
+    }
+  },
+  methods: {
+    printAction(){
+      this.$router.push({
+        path: "/Dialysisanalysis/qualitycontrol/print?patient_id=" + this.query.patient_id+"&project_id="+this.query.project_id+"&item_id="+this.query.item_id+"&start_time="+this.query.start_time+"&end_time="+this.query.end_time
+      });
+
+    },exportAction(){
+      let list = []
+      for (let i = 0; i < this.tableData.length; i++) {
+        let order = this.tableData[i]
+        let name = order.name
+        let item_name = order.item_name
+        let count = order.count
+        let price = order.price.toFixed(2)
+        let pay_sumamt = (order.price.toFixed(2) * order.count).toFixed(2)
+        let total = order.total.toFixed(2)
+
+        let obj = {
+          '患者姓名': name,
+          '项目名称': item_name,
+          '数量': count,
+          '单价': price,
+          '费用': pay_sumamt,
+          '费用总额': total
+        }
+        list.push(obj)
+      }
+      import('@/vendor/Export2Excel').then(excel => {
+        const tHeader = ['患者姓名', '项目名称', '数量', '单价', '费用', '费用总额']
+        const filterVal = ['患者姓名', '项目名称', '数量', '单价', '费用', '费用总额']
+        const data = this.formatJson(filterVal, list)
+        excel.export_json_to_excel1({
+          header: tHeader,
+          data,
+          filename: '明细',
+          ref: this.$refs['table'].$el
+        })
+      })
+    },
+    changeProject(val) {
+      this.query.statistics_type = val
+      this.query.page = 1
+      this.GetPersonQCStatistisData(this.query)
+      this.GetInspectionCheckIndexTableData(this.query)
+
+    },
+    handleChange(val) {
+      this.query.patient_id = val.id
+      this.query.page = 1
+      this.patient_name = val.name
+      this.GetPersonQCStatistisData(this.query)
+      this.GetInspectionCheckIndexTableData(this.query)
+    },
+    handleSizeChange(limit) {
+      this.query.limit = limit
+      this.GetInspectionCheckIndexTableData(this.query)
+
     },
-    
+    handleCurrentChange(page) {
+      this.query.page = page
+      this.GetPersonQCStatistisData(this.query)
+    },formatJson(filterVal, jsonData) {
+      return jsonData.map(v => filterVal.map(j => v[j]))
+    },
+    changeTime(val) {
+      var time = this.getTimestamp(val) - this.getTimestamp(this.query.end_time)
+      if (time > 0) {
+        this.$message.error('结束时间不能小于开始时间')
+        this.query.start_time = ''
+      } else {
+        // this.getDialysisList()
+        this.query.page = 1
+        this.GetPersonQCStatistisData(this.query)
+        this.GetInspectionCheckIndexTableData(this.query)
+
+      }
+
+    },
+    changeEndTime(val) {
+      var time =
+        this.getTimestamp(val) - this.getTimestamp(this.query.start_time)
+      if (time < 0) {
+        this.$message.error('结束时间不能小于开始时间')
+        this.query.end_time = ''
+      } else {
+        this.query.page = 1
+        this.GetPersonQCStatistisData(this.query)
+        this.GetInspectionCheckIndexTableData(this.query)
+
+      }
+    },
+    getTimestamp(time) {
+      // 把时间日期转成时间戳
+      return new Date(time).getTime() / 1000
+    },
+    QueryOperaById: function(val) {
+      let vascular_access_desc_name = ''
+      let vascular_access_desc = getDataConfig(
+        'hemodialysis',
+        'vascular_access_desc'
+      )
+      for (let i = 0; i < vascular_access_desc.length; i++) {
+        if (vascular_access_desc[i].id == val) {
+          vascular_access_desc_name = vascular_access_desc[i].name
+        }
+      }
+
+      return vascular_access_desc_name
+    },
+    GetAnticoagulantById: function(val) {
+      let anticoagulan_name = ''
+      var anticoagulantsConfitTwo = this.$store.getters.anticoagulants_confit
+      let anticoagulant = anticoagulantsConfitTwo
+      for (let keys in anticoagulant) {
+        if (anticoagulant[keys].id == val) {
+          anticoagulan_name = anticoagulant[keys].name
+        }
+      }
+      return anticoagulan_name
+    },
+    getModeName(mode_id) {
+      return this.$store.getters.treatment_mode[mode_id] != undefined ? this.$store.getters.treatment_mode[mode_id].name : ''
+    },  getTime(val) {
+      if(val == "" || val == undefined){
+        return ""
+      }else {
+        return uParseTime(val, '{y}-{m}-{d} {h}:{i}')
+      }
+    },
+    GetInspectionCheckIndexTableData(params) {
+      this.loading = true
+      GetPersonQCStatistisData(params)
+        .then(rs => {
+          var resp = rs.data
+          console.log("resp=====",resp)
+          if (resp.state == 1) {
+            this.loading = false
+            this.tableData = []
+            for (let i = 0; i < resp.data.inspections.length; i++) {
+              this.tableData.push(resp.data.inspections[i])
+            }
+            this.total = resp.data.total
+
+          } else {
+            this.loading = false
+          }
+        })
+        .catch(error => {
+
+        })
+    },
+    GetPersonQCStatistisData(params) {
+      this.chart.xAxis.data = []
+      this.chart.series[0].data = []
+      this.bar.xAxis.data = []
+      this.bar.series[0].data = []
+      this.percent = []
+      GetPersonQCStatistisData(params)
+        .then(rs => {
+          var resp = rs.data
+          if (resp.state == 1) {
+            for (let i = 0; i < resp.data.inspections.length; i++) {
+              this.chart.xAxis.data.push(this.getTime(resp.data.inspections[i].inspect_date))
+              this.chart.series[0].data.push(resp.data.inspections[i].inspect_value)
+            }
+            this.getArrLength(this.chart.xAxis.data,1)
+          } else {
+
+          }
+        })
+        .catch(error => {
+        })
+    },
+    handleSelect(val) {
+      this.query.patient_id = val.id
+      this.query.page = 1
+      this.patient_name = val.name
+      for (let i = 0;i < this.patientsData.length; i++){
+        if (this.patientsData[i].id == val.id){
+          this.$refs.table.setCurrentRow(this.patientsData[i])
+        }
+      }
+
+
+    },
+    querySearchAsync(keyword, cb) {
+      let key = ''
+      if (keyword != undefined) {
+        key = keyword
+      }
+      let searchArray = []
+      PostSearch(key).then(response => {
+        if (response.data.state == 1) {
+          searchArray = response.data.data.patient
+          cb(searchArray)
+        } else {
+          cb([])
+        }
+      })
+    },
+    chooseWay(way) {
+      this.wayType = way
+    }, getCurrentOrgPatients() {
+      getCurrentOrgPatients().then(response => {
+        if (response.data.state == 1) {
+          var patients = response.data.data.patients
+          this.patientsData = patients
+          this.GetDefaultPatient()
+        }
+      })
+    }, GetDefaultPatient() {
+      GetDefaultPatient().then(response => {
+        if (response.data.state == 1) {
+          var patient = response.data.data.patient
+          for (let i = 0;i < this.patientsData.length; i++){
+            if (this.patientsData[i].id == patient.id){
+              this.patient_name = this.patientsData[i].name
+              this.$refs.table.setCurrentRow(this.patientsData[i])
+            }
+          }
+          this.query.patient_id = patient.id
+          this.GetPersonQCStatistisData(this.query)
+
+        }
+      })
+
+    },
+    getArrLength(result,type){
+      if(type == 1){
+        if(result.length > 10){
+          var dataZoom_end = (10/result.length)*100;
+          this.chart.dataZoom[0].end = dataZoom_end
+        }else{
+          var dataZoom_end = 100;
+          this.chart.dataZoom[0].end = dataZoom_end
+        }
+      }else if(type == 2){
+        if(result.length > 10){
+          var dataZoom_end = (10/result.length)*100;
+          this.bar.dataZoom[0].end = dataZoom_end
+        }else{
+          var dataZoom_end = 100;
+          this.bar.dataZoom[0].end = dataZoom_end
+        }
+      }
+
+    }
+  }, mounted() {
+    var date = new Date()
+    var year = date.getFullYear() //获取完整的年份(4位)
+    var month = date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1).toString() : date.getMonth() + 1 //获取当前月份(0-11,0代表1月)
+    var day = date.getDate() < 10 ? '0' + date.getDate().toString() : date.getDate() //获取当前日(1-31)
+    var last_month = date.getMonth() < 10 ? '0' + date.getMonth().toString() : date.getMonth() //获取当前月份(0-11,0代表1月)
+    this.query.patient_id = 0
+    this.query.end_time = year + '-' + month + '-' + day
+    this.query.start_time = year + '-' + last_month + '-' + day
+    this.query.project_id = 20
+    this.query.item_id = 171
+    this.getCurrentOrgPatients()
+
+    // this.GetPersonQCStatistisData()
+
+
+  }
 }
 </script>
+
 <style lang="scss" scoped>
-.content_top{
-    display: flex;
-    justify-content: space-around;
-    margin-bottom: 20px;
+.tableTitle {
+  font-size: 16px;
+  color: #000;
+  font-weight: bold;
+  margin-bottom: 10px;
+}
+</style>
+<style lang="scss">
+.page_process {
+.el-tabs{
+  margin-bottom:0 !important;
+}
+.el-button--medium {
+  padding: 10px 8px;
+}
+
+.el-form-item {
+  margin-bottom: 0;
+}
+::-webkit-scrollbar{
+  height: 15px !important;
+}
+
 }
-</style>
+</style>

src/xt_pages/Dialysisanalysis/platelets/plateletsall.vue

@@ -1,262 +1,369 @@
 <template>
-    <div>
-        <!-- <div class="content_top">
-            <div class="block">
-                <span>查询时间:</span>
-                <el-date-picker
-                v-model="time_month"
-                type="month"
-                placeholder="选择月">
-                </el-date-picker>
-            </div>
-            <div>
-                <el-date-picker
-                v-model="stat_time"
-                type="date"
-                placeholder="选择日期">
-                </el-date-picker>
-                <span>-</span>
-                <el-date-picker
-                v-model="end_time"
-                type="date"
-                placeholder="选择日期">
-                </el-date-picker>
-            </div>
-            <div style="width: 200px;">
-                <el-input v-model="input" placeholder="请输入内容"></el-input>
-            </div>
-            <el-button type="primary">查询</el-button>
-        </div> -->
-        
-        <el-row :gutter="20">
-        <el-col :span="5"> 
-          <div class="block">
-            <span>查询时间:</span>
-            <el-date-picker
-            v-model="time_month"
-            type="month"
-            placeholder="选择月">
-            </el-date-picker>
-          </div>
-        </el-col>
-        <el-col :span="8">
-          <div>
-            <el-date-picker
-            v-model="stat_time"
+  <div>
+    <el-row :gutter="25">
+      <el-col :span="5">
+        <div class="block">
+          <span>查询时间:</span>
+          <el-select size="small" v-model="time_type" placeholder="请选择"
+                     style="width:150px;margin-left:10px;" @change="changeItem">
+            <el-option
+              v-for="item,index in times"
+              :key="index"
+              :label="item.label"
+              :value="item.value">
+            </el-option>
+          </el-select>
+        </div>
+      </el-col>
+      <el-col :span="8">
+        <div>
+          <el-date-picker
+            style="width: 200px"
+
+            v-model="start_time"
+            format="yyyy-MM-dd"
+            value-format="yyyy-MM-dd"
             type="date"
+
             placeholder="选择日期">
-            </el-date-picker>
-            <span>-</span>
-            <el-date-picker
+          </el-date-picker>
+          <span>-</span>
+          <el-date-picker
+            style="width: 200px"
             v-model="end_time"
+            format="yyyy-MM-dd"
+            value-format="yyyy-MM-dd"
             type="date"
             placeholder="选择日期">
-            </el-date-picker>
-          </div>
-        </el-col>
-        <el-col :span="3">
-          <div style="width: 200px;">
-            <el-input v-model="input" placeholder="请输入内容"></el-input>
-          </div>
-        </el-col>
-        <el-col :span="2">
-            <el-button type="primary">查询</el-button>
-        </el-col>
-        </el-row>
-        
-        <div class="cell clearfix" style="margin: 20px; font-weight: bold;">
-          <p class="chartTitle">统计图</p>
+          </el-date-picker>
         </div>
-        <div class="echart" id="mychart" :style={width:width,height:height}></div>
-        <div style="width: 80%;margin: auto;">
-            <el-table
-            :data="tableData"
-            :show-summary = true
-            border
-            style="width: 100%;">
-                <el-table-column
-                    prop="date"
-                    align="center"
-                    label="血小板"
-                    >
-                </el-table-column>
-                <el-table-column
-                    prop="name"
-                    
-                    label="人数"
-                    >
-                </el-table-column>
-                <el-table-column
-                    prop="address"
-                    align="center"
-                    label="操作">
-                    <template slot-scope="scope">
-                        <el-button @click="handleClick(scope.row)" style="font-size:16px;"
-                                type="text" >查看详情
-                        </el-button>
-                    </template>
-                </el-table-column>
-            </el-table>
+      </el-col>
+      <el-col :span="5">
+        <div >
+          <el-input disabled v-model="input" placeholder="请输入内容"></el-input>
         </div>
+      </el-col>
+      <el-col :span="3">
+        <el-button type="primary" @click="getData()">查询</el-button>
+      </el-col>
+    </el-row>
+    <div class="cell clearfix" style="margin: 20px; font-weight: bold;">
+      <p class="chartTitle">统计图</p>
+    </div>
+    <div class="echart" id="mychart" :style={width:width,height:height}></div>
+    <div style="width: 80%;margin: auto;">
+      <el-table
+        :data="tableData"
+        border
+        style="width: 100%;">
+        <el-table-column
+          prop="name"
+          align="center"
+          label="血小板"
+
+        >
+        </el-table-column>
+        <el-table-column
+          prop="count"
+          label="人数"
+        >
+        </el-table-column>
+<!--        <el-table-column-->
+<!--          prop="address"-->
+<!--          align="center"-->
+<!--          label="操作">-->
+<!--          <template slot-scope="scope">-->
+<!--            <el-button @click="handleClick(scope.row)" style="font-size:16px;"-->
+<!--                       type="text">查看详情-->
+<!--            </el-button>-->
+<!--          </template>-->
+<!--        </el-table-column>-->
+      </el-table>
     </div>
+  </div>
 </template>
 <script>
-import * as echarts from "echarts";
-export default{
-    props: {
-   
+import * as echarts from 'echarts'
+import { GetQCStatistisData } from '../../../api/qcd'
+
+const moment = require('moment')
+
+export default {
+  props: {
+
     width: {
       type: String,
-      default: "100%"
+      default: '100%'
     },
     height: {
       type: String,
-      default: "400px"
-    },
-    
+      default: '400px'
+    }
+
   },
-    data() {
-        return {
-            time_month:'',
-            stat_time:'',
-            end_time:'',
-            input:'',
-            myChart: {},
-            pieData : [
-            {
-          value: 463,
-          name: "不达标值患者"
-        },
-        {
-          value: 395,
-          name: "未检查患者"
-        },
-        {
-          value: 157,
-          name: "达标值患者"
-        },
-        // {
-        //   value: 149,
-        //   name: "广东"
-        // },
-        // {
-        //   value: 147,
-        //   name: "湖南"
-        // }
-            
-            ],
-            pieName: [],
-            // myChartStyle:{float: "right", width: "100%", height: "400px"},
-            tableData:[],
-        }
-    },
-    mounted() {
-    this.initDate(); //数据初始化
-    this.initEcharts();
+  data() {
+    return {
+      time_type: 1,
+      times: [
+        { value: 1, label: '本月' },
+        { value: 2, label: '上月' },
+        { value: 3, label: '今年' },
+        { value: 4, label: '上一年' },
+        { value: 5, label: '第一季度' },
+        { value: 6, label: '第二季度' },
+        { value: 7, label: '第三季度' },
+        { value: 8, label: '第四季度' },
+        { value: 9, label: '自定义' }
+
+      ],
+      time_month: '',
+      start_time: new Date(new Date().getFullYear(), new Date().getMonth(), 1).toLocaleDateString('en-CA'),
+      end_time: new Date(new Date().getFullYear(), new Date().getMonth() + 1, 0).toLocaleDateString('en-CA'),
+      input: '',
+      myChart: {},
+      pieData: [],
+      pieName: [],
+      reference:{},
+      // myChartStyle:{float: "right", width: "100%", height: "400px"},
+      tableData: []
+    }
+  },
+  mounted() {
+    this.getData()
   },
   methods: {
-    initDate() {
-      for (let i = 0; i < this.pieData.length; i++) {
-        this.pieName[i] = this.pieData[i].name;
+    getData() {
+      if(this.start_time.length == 0){
+        this.$message.error("请选择开始时间")
       }
-    },
-    initEcharts() {
-      // 饼图
-      const option = {
-        legend: {
-          // 图例
-          data: this.pieName,
-          left: "10%",
-          top: "30%",
-          orient: "vertical"
-        },
-        color:['#ff7f9f','#fff67f','#1e5feb'],
-        title: {
-          // 设置饼图标题，位置设为顶部居中
-        //   text: "国内院士前五省份图示",
-          top: "0%",
-          left: "center"
-        },
-        series: [
-          {
-            type: "pie",
-            label: {
-              normal : {
-                formatter: '{b}:{c}: ({d}%)',
-                textStyle : {
-                    fontWeight : 'normal',
-                    fontSize : 15,
-                    color : "black"
-                }
-              }
-              // b代表名称，c代表对应值，d代表百分比"{b} : {d}% ({c})" 
+      if(this.end_time.length == 0){
+        this.$message.error("请选择结束时间")
+      }
+      let params = {
+        start_date: this.start_time,
+        end_date: this.end_time,
+        project_id: 1,
+        item_id: 166
+      }
+      this.pieData = []
+      this.tableData = []
+      console.log("~~~~~~~~~~")
+      GetQCStatistisData(params).then(response => {
+        if (response.data.state == 1) {
+          this.reference = response.data.data.reference
+          this.input = response.data.data.reference.range_min + "<=" + response.data.data.reference.item_name + "<=" + response.data.data.reference.range_max
+          let objone = {
+            value:  response.data.data.unusual_total / response.data.data.patient_count,
+            name: '不达标值患者',
+            count:response.data.data.unusual_total,
+          }
+          this.pieData.push(objone)
+          this.tableData.push(objone)
+
+          let objtwo = {
+            value:   response.data.data.normal_total / response.data.data.patient_count,
+            name: '达标值患者',
+            count:response.data.data.normal_total,
+
+          }
+          this.pieData.push(objtwo)
+          this.tableData.push(objtwo)
+
+          let objthree = {
+            value: response.data.data.patient_count / response.data.data.no_check_total,
+            name: '未检查患者',
+            count:response.data.data.no_check_total,
+
+          }
+          this.pieData.push(objthree)
+          this.tableData.push(objthree)
+
+          let objfour = {
+            value: response.data.data.patient_count,
+            name: '合计',
+            count:response.data.data.patient_count,
+          }
+          this.tableData.push(objfour)
+          for (let i = 0; i < this.pieData.length; i++) {
+            this.pieName[i] = this.pieData[i].name
+          }
+          this.myChart = echarts.init(document.getElementById('mychart'))
+          window.addEventListener('resize', () => {
+            this.myChart.resize()
+          })
+          const option = {
+            legend: {
+              // 图例
+              data: this.pieName,
+              left: '10%',
+              top: '30%',
+              orient: 'vertical'
+            },
+            color: ['#ff7f9f', '#fff67f', '#1e5feb'],
+            title: {
+              // 设置饼图标题，位置设为顶部居中
+              //   text: "国内院士前五省份图示",
+              top: '0%',
+              left: 'center'
             },
-            radius: "65%", //饼图半径
-            data: this.pieData,
-            itemStyle : {
-              emphasis: {
-                shadowBlur: 10,
-                shadowOffsetX: 0,
-                shadowColor: 'rgba(0, 0, 0, 0.5)'
+            series: [
+              {
+                type: 'pie',
+                label: {
+                  show: true,
+                  formatter: '{b} : {d}% ({c})'
+                  // b代表名称，c代表对应值，d代表百分比"{b} : {d}% ({c})"
+                },
+                radius: '65%', //饼图半径
+                data: this.pieData
               }
-            }
+            ]
           }
-        ]
-      };
-    //   console.log(this.seriesData);
-      const optionFree = {
-        series: [
-          {
-            data: this.seriesData,
-            type: "line",
-            smooth: true
+          //   console.log(this.seriesData);
+          const optionFree = {
+            series: [
+              {
+                data: this.seriesData,
+                type: 'line',
+                smooth: true
+              }
+            ]
           }
-        ]
-      };
-      this.myChart = echarts.init(document.getElementById("mychart"));
-      this.myChart.setOption(option);
-      //随着屏幕大小调节图表
-      window.addEventListener("resize", () => {
-        this.myChart.resize();
-      });
+          this.myChart = echarts.init(document.getElementById('mychart'))
+          this.myChart.setOption(option)
+        } else {
+          this.$message.error(response.data.msg)
+        }
+      })
+
+    },
+    changeItem(val) {
+      const currentDate = new Date()
+      switch (val) {
+        case 1:
+
+          const startOfMonth = new Date(currentDate.getFullYear(), currentDate.getMonth(), 1).toLocaleDateString('en-CA')
+          const endOfMonth = new Date(currentDate.getFullYear(), currentDate.getMonth() + 1, 0).toLocaleDateString('en-CA')
+
+          this.start_time = startOfMonth
+          this.end_time = endOfMonth
+          this.getData()
+
+          break
+        case 2:
+          // 上月的起始日期和结束日期
+          const startOfLastMonth = new Date(currentDate.getFullYear(), currentDate.getMonth() - 1, 1).toLocaleDateString('en-CA')
+          const endOfLastMonth = new Date(currentDate.getFullYear(), currentDate.getMonth(), 0).toLocaleDateString('en-CA')
+
+          this.start_time = startOfLastMonth
+          this.end_time = endOfLastMonth
+          this.getData()
+
+          break
+        case 3:
+          // 今年的起始日期和结束日期
+          const startOfYear = new Date(currentDate.getFullYear(), 0, 1).toLocaleDateString('en-CA')
+          const endOfYear = new Date(currentDate.getFullYear(), 11, 31).toLocaleDateString('en-CA')
+
+          this.start_time = startOfYear
+          this.end_time = endOfYear
+          this.getData()
+
+          break
+        case 4:
+          // 上一年的起始日期和结束日期
+          const startOfLastYear = new Date(currentDate.getFullYear() - 1, 0, 1).toLocaleDateString('en-CA')
+          const endOfLastYear = new Date(currentDate.getFullYear() - 1, 11, 31).toLocaleDateString('en-CA')
+
+          this.start_time = startOfLastYear
+          this.end_time = endOfLastYear
+          this.getData()
+
+          break
+        case 5:
+          // 第一季度的起始日期和结束日期
+          const startOfFirstQuarter = new Date(currentDate.getFullYear(), 0, 1).toLocaleDateString('en-CA')
+          const endOfFirstQuarter = new Date(currentDate.getFullYear(), 2, 31).toLocaleDateString('en-CA')
+
+          this.start_time = startOfFirstQuarter
+          this.end_time = endOfFirstQuarter
+          this.getData()
+
+          break
+        case 6:
+          // 第二季度的起始日期和结束日期
+          const startOfSecondQuarter = new Date(currentDate.getFullYear(), 3, 1).toLocaleDateString('en-CA')
+          const endOfSecondQuarter = new Date(currentDate.getFullYear(), 5, 30).toLocaleDateString('en-CA')
+
+          this.start_time = startOfSecondQuarter
+          this.end_time = endOfSecondQuarter
+          this.getData()
+
+          break
+        case 7:
+          // 第三季度的起始日期和结束日期
+          const startOfThirdQuarter = new Date(currentDate.getFullYear(), 6, 1).toLocaleDateString('en-CA')
+          const endOfThirdQuarter = new Date(currentDate.getFullYear(), 8, 30).toLocaleDateString('en-CA')
+
+          this.start_time = startOfThirdQuarter
+          this.end_time = endOfThirdQuarter
+          this.getData()
+
+          break
+        case 8:
+          // 第四季度的起始日期和结束日期
+          const startOfFourthQuarter = new Date(currentDate.getFullYear(), 9, 1).toLocaleDateString('en-CA')
+          const endOfFourthQuarter = new Date(currentDate.getFullYear(), 11, 31).toLocaleDateString('en-CA')
+
+          this.start_time = startOfFourthQuarter
+          this.end_time = endOfFourthQuarter
+          this.getData()
+          break
+        case 9:
+          this.start_time = ''
+          this.end_time = ''
+          break
+      }
     },
+
+
     getSummaries(param) {
-        const { columns, data } = param;
-        const sums = [];
-        columns.forEach((column, index) => {
-          if (index === 0) {
-            sums[index] = '总价';
-            return;
-          }
-          const values = data.map(item => Number(item[column.property]));
-          if (!values.every(value => isNaN(value))) {
-            sums[index] = values.reduce((prev, curr) => {
-              const value = Number(curr);
-              if (!isNaN(value)) {
-                return prev + curr;
-              } else {
-                return prev;
-              }
-            }, 0);
-            sums[index] += ' 元';
-          } else {
-            sums[index] = 'N/A';
-          }
-        });
+      const { columns, data } = param
+      const sums = []
+      columns.forEach((column, index) => {
+        if (index === 0) {
+          sums[index] = '总价'
+          return
+        }
+        const values = data.map(item => Number(item[column.property]))
+        if (!values.every(value => isNaN(value))) {
+          sums[index] = values.reduce((prev, curr) => {
+            const value = Number(curr)
+            if (!isNaN(value)) {
+              return prev + curr
+            } else {
+              return prev
+            }
+          }, 0)
+          sums[index] += ' 元'
+        } else {
+          sums[index] = 'N/A'
+        }
+      })
 
-        return sums;
+      return sums
     },
-    handleClick(id){
-        console.log(id);
+    handleClick(id) {
+      console.log(id)
     }
   }
 
 }
 </script>
 <style lang="scss" scoped>
-.content_top{
-    display: flex;
-    justify-content: space-around;
-    color: #1e5feb;
+.content_top {
+  display: flex;
+  justify-content: space-around;
+  color: #1e5feb;
 }
-</style>
+</style>

src/xt_pages/Dialysisanalysis/platelets/plateletsalone.vue

@@ -1,217 +1,646 @@
 <template>
-    <div>
-       <div class="content_top">
-            <el-autocomplete
-            class="inline-input"
-            v-model="inputValue"
-            :fetch-suggestions="querySearch"
-            :trigger-on-focus="false"
-            placeholder="请输入患者名字或透析号"
-            @select="handleSubmit"
-            ></el-autocomplete>
+  <div class="main-contain">
+    <div class="app-container">
+      <div class="page_process">
+        <new-nav activeName="process"></new-nav>
+        <div class="cell clearfix">
+          <el-form :inline="true">
+            <el-form-item label>
+              <el-autocomplete
+                class="checkSearch"
+                popper-class="my-autocomplete"
+                v-model="search_value"
+                :fetch-suggestions="querySearchAsync"
+                :trigger-on-focus="false"
+                placeholder="请输入病人名字"
+                @select="handleSelect"
+                style="width:160px;"
+              >
+                <i class="el-icon-search el-input__icon" slot="suffix"></i>
+                <template slot-scope="{ item }">
+                  <div class="name">{{ item.name }}</div>
+                </template>
+              </el-autocomplete>
+
+            </el-form-item>
+          </el-form>
+
+          <label class="title">
+            <span class="name">日期查询</span> :
+          </label>
+          <el-date-picker
+            v-model="query.start_time"
+            prefix-icon="el-icon-date"
+            @change="changeTime"
+            :editable="false"
+            style="width: 150px;"
+            type="date"
+            placeholder="选择日期时间"
+            align="right"
+            format="yyyy-MM-dd"
+            value-format="yyyy-MM-dd"
+          ></el-date-picker>
+          <span class>-</span>
+          <el-date-picker
+            v-model="query.end_time"
+            prefix-icon="el-icon-date"
+            @change="changeEndTime"
+            :editable="false"
+            style="width: 150px;"
+            type="date"
+            placeholder="选择日期时间"
+            align="right"
+            format="yyyy-MM-dd"
+            value-format="yyyy-MM-dd"
+          ></el-date-picker>
+
+          <el-button size="small" icon="el-icon-printer" @click="printAction" type="primary">打印
+          </el-button>
+          <el-button size="small" icon="el-icon-printer" @click="exportAction" type="primary">导出
+
+          </el-button>
+        </div>
+
+        <el-container>
+          <div style="width:160px">
+
+            <div class="tableTitle">患者列表</div>
+
+
+            <el-table ref="table" :data="patientsData" border style="width: 100%;" height="500"
+                      :row-style="{ color: '#303133' }"
+                      :header-cell-style="{backgroundColor: 'rgb(245, 247, 250)',color: '#606266'}"
+                      highlight-current-row
+                      @current-change="handleChange">
+              <el-table-column prop="dialysis_no" label="透析号" width="70" align="center">
+                <template slot-scope="scope">{{scope.row.dialysis_no}}</template>
+              </el-table-column>
+              <el-table-column prop="name" label="姓名" width="90" align="center">
+                <template slot-scope="scope">{{ scope.row.name }}</template>
+              </el-table-column>
+            </el-table>
+          </div>
+          <div style="padding-left:10px;flex:1;width:0;">
+            <div class="tableTitle">指标趋势<span style="font-weight:normal">&nbsp;&nbsp;（当前患者: {{patient_name}}）</span></div>
             <div>
-                <span>查询时间:</span>
-                <el-date-picker
-                v-model="stat_time"
-                type="date"
-                placeholder="选择日期">
-                </el-date-picker>
-                <span>-</span>
-                <el-date-picker
-                v-model="end_time"
-                type="date"
-                placeholder="选择日期">
-                </el-date-picker>
-                <el-select v-model="value" placeholder="请选择">
-                    <el-option
-                    v-for="item in options"
-                    :key="item.value"
-                    :label="item.label"
-                    :value="item.value">
-                    </el-option>
-                </el-select>
-                <el-select v-model="value" placeholder="请选择">
-                    <el-option
-                    v-for="item in options"
-                    :key="item.value"
-                    :label="item.label"
-                    :value="item.value">
-                    </el-option>
-                </el-select>
-                <el-button type="primary">查询</el-button>
+              <line-chart :options="chart"></line-chart>
+              <!--              <line-chart :options="bar" v-if="query.statistics_type == 9 || query.statistics_type == 10"></line-chart>-->
+              <!--              <line-chart></line-chart>-->
+
             </div>
+            <div class="tableTitle">统计表</div>
             <div>
-                <el-button type="primary">打印</el-button>
-                <el-button type="primary">导出</el-button>
-            </div>
-       </div>
-       <div style="margin: 20px 0px;">
-        <h2 >患者列表</h2>
-       </div>
-       <div >
-        <el-row :gutter="20">
-            <el-col :span="4">
-              <div class="grid-content bg-purple">
-                <!-- <span style="font-size: 18px;font-weight: bold;display: block;">患者列表</span> -->
-                <!-- <h2>患者列表</h2> -->
-                <el-table
-                :data="tableData"
-                border
-                style="width: 100%">
-                    <el-table-column
-                        align="center"
-                        prop="date"
-                        label="透析号"
-                       >
-                    </el-table-column>
-                    <el-table-column
-                        align="center"
-                        prop="name"
-                        label="姓名"
-                        >
-                    </el-table-column>
-                </el-table>
-              </div>
-            </el-col>
-            <el-col :span="19">
-               <div class="grid-content bg-purple">
-                <div class="echart" id="germychart" style="width:100%;height:400px"></div>
-                <el-table
-                    :data="tableData"
-                    style="width: 100%"
-                    border
-                    align="center"
-                    max-height="250">
-                    <el-table-column
-                    fixed
-                    prop="date"
-                    label="姓名"
-                   >
-                    </el-table-column>
-                    <el-table-column
-                    prop="name"
-                    label="检查日期"
-                    >
-                    </el-table-column>
-                    <el-table-column
-                    prop="province"
-                    label="血小板（/L）"
-                    >
-                    </el-table-column>
-                    
-                </el-table>
-               </div>
-           </el-col>
-        </el-row>
-       </div>
+              <el-table ref="table" :data="tableData" v-loading="loading" border :row-style="{ color: '#303133' }" :header-cell-style="{backgroundColor: 'rgb(245, 247, 250)',color: '#606266'}">
+                <el-table-column label="姓名" align="center">
+                  <template slot-scope="scope">
+                    {{scope.row.name}}
+                  </template>
+                </el-table-column>
+
+                <el-table-column width="100" label="检查日期" align="center">
+                  <template slot-scope="scope">
+                    {{getTime(scope.row.inspect_date)}}
+
+                  </template>
+                </el-table-column>
 
+                <el-table-column width="100" label="血小板" align="center">
+                  <template slot-scope="scope">
+                    {{scope.row.value}}
+                  </template>
+                </el-table-column>
+              </el-table>
+
+
+            </div>
+          </div>
+        </el-container>
+      </div>
     </div>
+  </div>
 </template>
+
+
 <script>
-  import * as echarts from 'echarts'
-export default{
-    // props: {
-    //     width: {
-    //         type: String,
-    //         default: "100%"
-    //     },
-    //     height: {
-    //         type: String,
-    //         default: "400px"
-    //     },
-    
-    // },
-    data() {
-        return {
-            inputValue:'',
-            stat_time:'',
-            end_time:'',
-            value:'',
-            myChart: {},
-            xData: ["Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"], //横坐标
-            opinionData: [23, 24, 18, 25, 27, 28, 25], //人数数据
-            // myChartStyle: { float: "left", width: "100%", height: "400px" },//图表样式
-            tableData:[],
+import echarts from 'echarts'
+import {  uParseTime } from '@/utils/tools'
+import { getCurrentOrgPatients } from '@/api/common/common'
+import {
+  GetDefaultPatient,
+} from '@/api/common/statistics'
+import { PostSearch } from '@/api/patient'
+import { getDataConfig } from '@/utils/data'
+import { GetPersonQCStatistisData } from '../../../api/qcd'
+import LineChart from '../../qcd/components/LineChart.vue'
+
+export default {
+  components: {
+    LineChart
+  },
+  data() {
+    return {
+      pickerOptions: {
+        disabledDate(time) {
+          let threeMonths = new Date(new Date().setFullYear(new Date().getFullYear() - 1)).getTime() - 24 * 3600 * 1000
+          return time.getTime() > Date.now() || time.getTime() < threeMonths
+
         }
-    },
-    created(){
-        
-    },
-    mounted() {
-        // this.$nextTick(function() {
-            this.initEcharts();
-		// })  
-        // this.myChart = echarts.init(document.getElementById("germychart"));
-        //     this.myChart.setOption(option);
-            //随着屏幕大小调节图表
-            window.addEventListener("resize", () => {
-                this.myChart.resize();
-            });
-    },
-    methods:{
-        handleSubmit(){
-            console.log('asdfa');
+      },
+      patient_name:'',
+      percent:[],
+      patientsData: [],
+      tableData: [],
+      loading: false,
+      search_value: '',
+      total: 0,
+      query: {
+        patient_id: '',
+        statistics_type: 1,
+        start_time: '',
+        end_time: '',
+        limit: 10,
+        page: 1
+      },
+      crumbs: [
+        { path: false, name: '科室质控' },
+        { path: false, name: '指标评估统计' },
+        { path: false, name: '透析过程指标统计' }
+      ],
+      tableData1: [],
+      chart: {
+        title: {
+          text: 'ECharts 入门示例'
         },
-        initEcharts() {
-            const option = {
-                xAxis: {
-                    type: 'category',
-                        boundaryGap:true,
-                        axisTick:{
-                            alignWithLabel:true //保证刻度线和标签对齐
-                        },
-                    data: this.xData,
-                    splitNumber:this.xData.length, //纵坐标数
-                    interval:this.xData //强制设置坐标轴分割间隔
-                },
-                yAxis: {
-                    type: 'value',
-                    boundaryGap: true,
-                    splitNumber:4, //纵坐标数
-                    interval:10 //强制设置坐标轴分割间隔
+        tooltip: {},
+        legend: {
+          data: [],
+          left: 0
+        },
+        xAxis: {
+          data: []
+        },
+        yAxis: {
+          axisLabel: {
+            formatter: '{value} %'
+          },
+          show: false
+        },
+        series: [
+          {
+            name: '',
+            type: 'line',
+            data: [],
+            barWidth: 30,
+            label: {
+              normal: {
+                show: true,
+                position: 'top',
+                formatter: (params) => {
+                  if(this.percent.length > 0){
+                    let str = ''
+                    str = params.data + '('+ this.percent[params.dataIndex] +'%)'
+                    return str
+                  }else{
+                    let str = ''
+                    str = params.data
+                    return str
+                  }
+                }
+              }
+            },
+            //配置样式
+            itemStyle: {
+              //通常情况下：
+
+              //每个柱子的颜色即为colorList数组里的每一项，如果柱子数目多于colorList的长度，则柱子颜色循环使用该数组
+              normal: {
+                color: function(params) {
+                  //我这边就两个柱子，大体就两个柱子颜色渐变，所以数组只有两个值，多个颜色就多个值
+                  var colorList = [
+                    ['#A9E0F3', '#9FBDFC'],
+
+                    ['#FFD7C0', '#FF9994']
+                  ]
+
+                  var index = params.dataIndex
+                  if (params.dataIndex >= colorList.length) {
+                    index = params.dataIndex % colorList.length
+                  }
+
+                  return new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+                    { offset: 0, color: colorList[index][0] },
+                    // { offset: 0.5, color: colorList[index][1] },
+                    { offset: 1, color: colorList[index][1] }
+                  ])
                 },
-                legend: {
-                    show: true,
-                    align:'left',//文字在前图标在后
-                    left:'15%',
-                    top:'5%',
-                    data: [{name:'血小板/L'}]
+                lineStyle:{
+                  color:'#409eff' //改变折线颜色
                 },
-                series: [
-                {
-                    data: this.opinionData,
-                    name:'血小板/L',
-                    type: "line",// 类型设置为折线图
-                    symbol: 'circle',
-                    itemStyle: {
-                        normal: {
-                            color: '#409eff', //改变折线点的颜色#a80000
-                            lineStyle: {
-                                color: '#409eff' //改变折线颜色
-                            }
-                        }
-                    },
+                barBorderRadius: [5, 5, 0, 0] //柱状角成椭圆形
+              },
 
-                },
-                
-                ],
-                
-            };
-            this.myChart = echarts.init(document.getElementById("germychart"));
-            this.myChart.setOption(option);
-            //随着屏幕大小调节图表
-            window.addEventListener("resize", () => {
-                this.myChart.resize();
-            });
+              //鼠标悬停时：
+              emphasis: {
+                shadowBlur: 10,
+                shadowOffsetX: 0,
+                shadowColor: 'rgba(0, 0, 0, 0.5)'
+              }
+            }
+          }
+        ],
+        dataZoom: [
+          {
+            // Y轴固定,让内容滚动
+            type: 'slider',
+            show: false,
+            xAxisIndex: [0],
+            start: 1,
+            end: 20, // 设置X轴刻度之间的间隔(根据数据量来调整)
+            zoomLock: true // 锁定区域禁止缩放(鼠标滚动会缩放,所以禁止)
+          },
+          {
+            type: 'inside',
+            xAxisIndex: [0],
+            start: 1,
+            end: 20,
+            zoomLock: true // 锁定区域禁止缩放
+          }
+        ]
+      },
+      bar: {
+        title: {
+          text: 'ECharts 入门示例'
         },
+        tooltip: {},
+        legend: {
+          data: [],
+          left: 0
+        },
+        xAxis: {
+          data: []
+        },
+        yAxis: {
+          axisLabel: {
+            formatter: '{value} %'
+          },
+          show: false
+        },
+        series: [
+          {
+            name: '',
+            type: 'bar',
+            data: [],
+            barWidth: 30,
+            label: {
+              normal: {
+                show: true,
+                position: 'top',
+                formatter: (params) => {
+                  if(this.percent.length > 0){
+                    let str = ''
+                    str = params.data + '('+ this.percent[params.dataIndex] +'%)'
+                    return str
+                  }else{
+                    let str = ''
+                    str = params.data
+                    return str
+                  }
+                }
+              }
+            },
+            //配置样式
+            itemStyle: {
+              //通常情况下：
+
+              //每个柱子的颜色即为colorList数组里的每一项，如果柱子数目多于colorList的长度，则柱子颜色循环使用该数组
+              normal: {
+                color: function(params) {
+                  //我这边就两个柱子，大体就两个柱子颜色渐变，所以数组只有两个值，多个颜色就多个值
+                  var colorList = [
+                    ['#A9E0F3', '#9FBDFC'],
+                    ['#FFD7C0', '#FF9994']
+                  ]
+
+                  var index = params.dataIndex
+                  if (params.dataIndex >= colorList.length) {
+                    index = params.dataIndex % colorList.length
+                  }
+
+                  return new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+                    { offset: 0, color: colorList[index][0] },
+                    // { offset: 0.5, color: colorList[index][1] },
+                    { offset: 1, color: colorList[index][1] }
+                  ])
+                },
+                barBorderRadius: [5, 5, 0, 0] //柱状角成椭圆形
+              },
+
+              //鼠标悬停时：
+              emphasis: {
+                shadowBlur: 10,
+                shadowOffsetX: 0,
+                shadowColor: 'rgba(0, 0, 0, 0.5)'
+              }
+            }
+          }
+        ]
+      }
+
+    }
+  },
+  methods: {
+    printAction(){
+      this.$router.push({
+        path: "/Dialysisanalysis/qualitycontrol/print?patient_id=" + this.query.patient_id+"&project_id="+this.query.project_id+"&item_id="+this.query.item_id+"&start_time="+this.query.start_time+"&end_time="+this.query.end_time
+      });
+
+    },exportAction(){
+      let list = []
+      for (let i = 0; i < this.tableData.length; i++) {
+        let order = this.tableData[i]
+        let name = order.name
+        let value = order.value
+        let inspect_date = order.inspect_date
+
+        let obj = {
+          '姓名': name,
+          '数值': value,
+          '日期': inspect_date,
+        }
+        list.push(obj)
+      }
+      import('@/vendor/Export2Excel').then(excel => {
+        const tHeader = ['姓名', '数值', '日期']
+        const filterVal = ['姓名', '数值', '日期']
+        const data = this.formatJson(filterVal, list)
+        excel.export_json_to_excel1({
+          header: tHeader,
+          data,
+          filename: '明细',
+          ref: this.$refs['table'].$el
+        })
+      })
+    },
+    changeProject(val) {
+      this.query.statistics_type = val
+      this.query.page = 1
+      this.GetPersonQCStatistisData(this.query)
+      this.GetInspectionCheckIndexTableData(this.query)
+
+    },
+    handleChange(val) {
+      this.query.patient_id = val.id
+      this.query.page = 1
+      this.patient_name = val.name
+      this.GetPersonQCStatistisData(this.query)
+      this.GetInspectionCheckIndexTableData(this.query)
+    },
+    handleSizeChange(limit) {
+      this.query.limit = limit
+      this.GetInspectionCheckIndexTableData(this.query)
+
+    },
+    handleCurrentChange(page) {
+      this.query.page = page
+      this.GetPersonQCStatistisData(this.query)
+    },formatJson(filterVal, jsonData) {
+      return jsonData.map(v => filterVal.map(j => v[j]))
+    },
+    changeTime(val) {
+      var time = this.getTimestamp(val) - this.getTimestamp(this.query.end_time)
+      if (time > 0) {
+        this.$message.error('结束时间不能小于开始时间')
+        this.query.start_time = ''
+      } else {
+        // this.getDialysisList()
+        this.query.page = 1
+        this.GetPersonQCStatistisData(this.query)
+        this.GetInspectionCheckIndexTableData(this.query)
+
+      }
+
+    },
+    changeEndTime(val) {
+      var time =
+        this.getTimestamp(val) - this.getTimestamp(this.query.start_time)
+      if (time < 0) {
+        this.$message.error('结束时间不能小于开始时间')
+        this.query.end_time = ''
+      } else {
+        this.query.page = 1
+        this.GetPersonQCStatistisData(this.query)
+        this.GetInspectionCheckIndexTableData(this.query)
+
+      }
+    },
+    getTimestamp(time) {
+      // 把时间日期转成时间戳
+      return new Date(time).getTime() / 1000
+    },
+    QueryOperaById: function(val) {
+      let vascular_access_desc_name = ''
+      let vascular_access_desc = getDataConfig(
+        'hemodialysis',
+        'vascular_access_desc'
+      )
+      for (let i = 0; i < vascular_access_desc.length; i++) {
+        if (vascular_access_desc[i].id == val) {
+          vascular_access_desc_name = vascular_access_desc[i].name
+        }
+      }
+
+      return vascular_access_desc_name
     },
-    
+    GetAnticoagulantById: function(val) {
+      let anticoagulan_name = ''
+      var anticoagulantsConfitTwo = this.$store.getters.anticoagulants_confit
+      let anticoagulant = anticoagulantsConfitTwo
+      for (let keys in anticoagulant) {
+        if (anticoagulant[keys].id == val) {
+          anticoagulan_name = anticoagulant[keys].name
+        }
+      }
+      return anticoagulan_name
+    },
+    getModeName(mode_id) {
+      return this.$store.getters.treatment_mode[mode_id] != undefined ? this.$store.getters.treatment_mode[mode_id].name : ''
+    },  getTime(val) {
+      if(val == "" || val == undefined){
+        return ""
+      }else {
+        return uParseTime(val, '{y}-{m}-{d}')
+      }
+    },
+    GetInspectionCheckIndexTableData(params) {
+      this.loading = true
+      GetPersonQCStatistisData(params)
+        .then(rs => {
+          var resp = rs.data
+          console.log("resp=====",resp)
+          if (resp.state == 1) {
+            this.loading = false
+            this.tableData = []
+            for (let i = 0; i < resp.data.inspections.length; i++) {
+              let obj = {
+                name:resp.data.patient.name,
+                value:resp.data.inspections[i].inspect_value,
+                inspect_date:resp.data.inspections[i].inspect_date
+              }
+              this.tableData.push(obj)
+            }
+            this.total = resp.data.total
+
+          } else {
+            this.loading = false
+          }
+        })
+        .catch(error => {
+
+        })
+    },
+    GetPersonQCStatistisData(params) {
+      this.chart.xAxis.data = []
+      this.chart.series[0].data = []
+      this.bar.xAxis.data = []
+      this.bar.series[0].data = []
+      this.percent = []
+      GetPersonQCStatistisData(params)
+        .then(rs => {
+          var resp = rs.data
+          if (resp.state == 1) {
+            console.log(resp.data.inspections)
+            for (let i = 0; i < resp.data.inspections.length; i++) {
+              this.chart.xAxis.data.push(this.getTime(resp.data.inspections[i].inspect_date))
+              this.chart.series[0].data.push(resp.data.inspections[i].inspect_value)
+            }
+            console.log(this.chart.xAxis.data)
+            console.log( this.chart.series[0].data)
+
+            this.getArrLength(this.chart.xAxis.data,1)
+          } else {
+
+          }
+        })
+        .catch(error => {
+        })
+    },
+    handleSelect(val) {
+      this.query.patient_id = val.id
+      this.query.page = 1
+      this.patient_name = val.name
+      for (let i = 0;i < this.patientsData.length; i++){
+        if (this.patientsData[i].id == val.id){
+          this.$refs.table.setCurrentRow(this.patientsData[i])
+        }
+      }
+
+
+    },
+    querySearchAsync(keyword, cb) {
+      let key = ''
+      if (keyword != undefined) {
+        key = keyword
+      }
+      let searchArray = []
+      PostSearch(key).then(response => {
+        if (response.data.state == 1) {
+          searchArray = response.data.data.patient
+          cb(searchArray)
+        } else {
+          cb([])
+        }
+      })
+    },
+    chooseWay(way) {
+      this.wayType = way
+    }, getCurrentOrgPatients() {
+      getCurrentOrgPatients().then(response => {
+        if (response.data.state == 1) {
+          var patients = response.data.data.patients
+          this.patientsData = patients
+          this.GetDefaultPatient()
+        }
+      })
+    }, GetDefaultPatient() {
+      GetDefaultPatient().then(response => {
+        if (response.data.state == 1) {
+          var patient = response.data.data.patient
+          for (let i = 0;i < this.patientsData.length; i++){
+            if (this.patientsData[i].id == patient.id){
+              this.patient_name = this.patientsData[i].name
+              this.$refs.table.setCurrentRow(this.patientsData[i])
+            }
+          }
+          this.query.patient_id = patient.id
+          this.GetPersonQCStatistisData(this.query)
+
+        }
+      })
+
+    },
+    getArrLength(result,type){
+      if(type == 1){
+        if(result.length > 10){
+          var dataZoom_end = (10/result.length)*100;
+          this.chart.dataZoom[0].end = dataZoom_end
+        }else{
+          var dataZoom_end = 100;
+          this.chart.dataZoom[0].end = dataZoom_end
+        }
+      }else if(type == 2){
+        if(result.length > 10){
+          var dataZoom_end = (10/result.length)*100;
+          this.bar.dataZoom[0].end = dataZoom_end
+        }else{
+          var dataZoom_end = 100;
+          this.bar.dataZoom[0].end = dataZoom_end
+        }
+      }
+
+    }
+  }, mounted() {
+    var date = new Date()
+    var year = date.getFullYear() //获取完整的年份(4位)
+    var month = date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1).toString() : date.getMonth() + 1 //获取当前月份(0-11,0代表1月)
+    var day = date.getDate() < 10 ? '0' + date.getDate().toString() : date.getDate() //获取当前日(1-31)
+    var last_month = date.getMonth() < 10 ? '0' + date.getMonth().toString() : date.getMonth() //获取当前月份(0-11,0代表1月)
+    this.query.patient_id = 0
+    this.query.end_time = year + '-' + month + '-' + day
+    this.query.start_time = year + '-' + last_month + '-' + day
+    this.query.project_id = 1
+    this.query.item_id = 166
+    this.getCurrentOrgPatients()
+
+    // this.GetPersonQCStatistisData()
+
+
+  }
 }
 </script>
+
 <style lang="scss" scoped>
-.content_top{
-    display: flex;
-    justify-content: space-around;
-    margin-bottom: 20px;
+.tableTitle {
+  font-size: 16px;
+  color: #000;
+  font-weight: bold;
+  margin-bottom: 10px;
+}
+</style>
+<style lang="scss">
+.page_process {
+.el-tabs{
+  margin-bottom:0 !important;
+}
+.el-button--medium {
+  padding: 10px 8px;
+}
+
+.el-form-item {
+  margin-bottom: 0;
+}
+::-webkit-scrollbar{
+  height: 15px !important;
+}
+
 }
-</style>
+</style>

src/xt_pages/Dialysisanalysis/print/print.vue

@@ -0,0 +1,212 @@
+<template>
+  <div class="main-contain">
+    <div class="position">
+      <bread-crumb :crumbs="crumbs"></bread-crumb>
+      <el-row style="float:right;">
+        <el-col :span="24">
+          <el-button
+            size="small"
+            icon="el-icon-printer"
+            type="primary"
+            @click="printAction"
+          >打印</el-button
+          >
+        </el-col>
+      </el-row>
+    </div>
+    <div class="app-container" style="background-color: white;">
+      <div id="print_content">
+        <div class="print_main_content">
+          <div class="order_title_panl">
+            <span class="main_title">{{reference.item_name}}详情</span>
+          </div>
+          <div class="table_panel">
+            <table class="table">
+              <thead>
+              <tr>
+                <td width="50">序号</td>
+                <td width="100" >透析号</td>
+                <td width="70">患者姓名</td>
+                <td width="70">检查日期</td>
+                <td width="70" >结果</td>
+              </tr>
+              </thead>
+              <tbody>
+              <tr v-for="(item, index) in checkData" :key="index">
+                <td :width="td_1_width">{{index + 1}}</td>
+                <td :width="td_1_width">
+                  <span>{{item.dialysis_no}}</span>
+                </td>
+                <td :width="td_1_width">{{item.name}}</td>
+                <td :width="td_1_width">{{getTime(item.check_date)}}</td>
+                <td :width="td_1_width">{{item.result}}</td>
+              </tr>
+              </tbody>
+            </table>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import { GetPersonQCStatistisData } from '@/api/qcd'
+import BreadCrumb from '@/xt_pages/components/bread-crumb'
+import print from 'print-js'
+import { jsGetAge, uParseTime } from '@/utils/tools'
+
+export default {
+  name: 'SchedulePrint',
+  data() {
+    return {
+      checkData:[],
+      crumbs: [
+        { path: false, name: '专业质控' },
+        { path: false, name: '检验详情打印' }
+      ],
+      scheduleData:[],
+      week_type: 0,
+      day:'',
+      td_1_width: '10%',
+      td_2_width: '10%',
+      td_3_width: '25%',
+      td_4_width: '45%',
+      modeOptions: null,
+      anticoagulants_confit:null,
+      currentDate:'',
+      org_id:0,
+      printObj:{},
+      week_time:0,
+      zone:0,
+      reference:null,
+    }
+  },
+  components: {
+    BreadCrumb
+  },
+  created() {
+    var patient_id = this.$route.query.patient_id
+    var project_id  = this.$route.query.project_id
+    var item_id  = this.$route.query.item_id
+    var start_time  = this.$route.query.start_time
+    var end_time  = this.$route.query.end_time
+
+    const params = {
+      patient_id:patient_id,
+      project_id:project_id,
+      item_id:item_id,
+      start_time: start_time,
+      end_time: end_time
+    }
+    GetPersonQCStatistisData(params).then(response=>{
+      if(response.data.state ==1){
+        let dialysis_no = response.data.data.patient.dialysis_no
+        let name = response.data.data.patient.name
+        this.checkData = []
+        this.reference = response.data.data.reference
+        for(let i = 0; i < response.data.data.inspections.length;i++){
+          let obj ={
+            dialysis_no:dialysis_no,
+            name:name,
+            check_date:response.data.data.inspections[i].inspect_date,
+            result:response.data.data.inspections[i].inspect_value
+          }
+          this.checkData.push(obj)
+
+
+        }
+
+
+      }
+    })
+  },
+  methods: {
+    getTime(val) {
+      if(val == "" || val == undefined){
+        return ""
+      }else {
+        return uParseTime(val, '{y}-{m}-{d}')
+      }
+    },
+    printAction: function() {
+      const style = '@media print { .print_main_content { background-color: white; width:960px;  margin:0 auto; padding: 0 0 20px 0; } .order_title_panl { text-align: center; } .main_title { font-size: 18px; line-height: 40px; font-weight: 500; } .table_panel { } .table { width: 100%; border: 1px solid; border-collapse: collapse; padding: 2px; } thead tr td { border: 1px solid; text-align: center; font-size: 20px; padding: 15px 5px; } tbody tr td { border: 1px solid; text-align: center; font-size: 18px; padding: 10px 5px; } .proj { padding: 5px 0; text-align: left; } .proj_title { font-size: 16px; font-weight: 500; line-height: 25px; } .proj_item { font-size: 15px; line-height: 20px; } .zone_name { font-weight: 500; } }'
+      printJS({
+        printable: 'print_content',
+        type: 'html',
+        documentTitle: '  ',
+        style: style,
+        scanStyles: false
+      })
+    },
+  },
+}
+</script>
+
+<style rel="stylesheet/scss" lang="scss" scoped>
+.print_main_content {
+  background-color: white;
+  max-width: 1500px;
+  margin: 0 auto;
+  padding: 0 0 20px 0;
+
+.order_title_panl {
+  text-align: center;
+
+.main_title {
+  font-size: 18px;
+  line-height: 40px;
+  font-weight: 500;
+}
+}
+.table_panel {
+.table {
+  width: 100%;
+  border: 1px solid;
+  border-collapse: collapse;
+  padding: 2px;
+
+thead {
+tr {
+td {
+  border: 1px solid;
+  text-align: center;
+  font-size: 20px;
+  padding: 15px 5px;
+}
+}
+}
+tbody {
+tr {
+td {
+  border: 1px solid;
+  text-align: center;
+  font-size: 18px;
+  padding: 10px 5px;
+
+.proj {
+  padding: 5px 0;
+  text-align: left;
+
+.proj_title {
+  font-size: 16px;
+  font-weight: 500;
+  line-height: 25px;
+}
+
+.proj_item {
+  font-size: 15px;
+  line-height: 20px;
+
+.zone_name {
+  font-weight: 500;
+}
+}
+}
+}
+}
+}
+}
+}
+}
+</style>

src/xt_pages/Dialysisanalysis/qualitycontrol/individual.vue

@@ -1,243 +1,649 @@
 <template>
-    <div>
-       <div class="content_top">
-            <el-autocomplete
-            class="inline-input"
-            v-model="inputValue"
-            :fetch-suggestions="querySearch"
-            :trigger-on-focus="false"
-            placeholder="请输入患者名字或透析号"
-            @select="handleSubmit"
-            ></el-autocomplete>
+  <div class="main-contain">
+    <div class="app-container">
+      <div class="page_process">
+        <new-nav activeName="process"></new-nav>
+        <div class="cell clearfix">
+          <el-form :inline="true">
+            <el-form-item label>
+              <el-autocomplete
+                class="checkSearch"
+                popper-class="my-autocomplete"
+                v-model="search_value"
+                :fetch-suggestions="querySearchAsync"
+                :trigger-on-focus="false"
+                placeholder="请输入病人名字"
+                @select="handleSelect"
+                style="width:160px;"
+              >
+                <i class="el-icon-search el-input__icon" slot="suffix"></i>
+                <template slot-scope="{ item }">
+                  <div class="name">{{ item.name }}</div>
+                </template>
+              </el-autocomplete>
+
+            </el-form-item>
+          </el-form>
+
+          <label class="title">
+            <span class="name">日期查询</span> :
+          </label>
+          <el-date-picker
+            v-model="query.start_time"
+            prefix-icon="el-icon-date"
+            @change="changeTime"
+            :editable="false"
+            style="width: 150px;"
+            type="date"
+            placeholder="选择日期时间"
+            align="right"
+            format="yyyy-MM-dd"
+            value-format="yyyy-MM-dd"
+          ></el-date-picker>
+          <span class>-</span>
+          <el-date-picker
+            v-model="query.end_time"
+            prefix-icon="el-icon-date"
+            @change="changeEndTime"
+            :editable="false"
+            style="width: 150px;"
+            type="date"
+            placeholder="选择日期时间"
+            align="right"
+            format="yyyy-MM-dd"
+            value-format="yyyy-MM-dd"
+          ></el-date-picker>
+
+          <el-button size="small" icon="el-icon-printer" @click="printAction" type="primary">打印
+          </el-button>
+          <el-button size="small" icon="el-icon-printer" @click="exportAction" type="primary">导出
+
+          </el-button>
+        </div>
+
+        <el-container>
+          <div style="width:160px">
+
+            <div class="tableTitle">患者列表</div>
+
+
+            <el-table ref="table" :data="patientsData" border style="width: 100%;" height="500"
+                      :row-style="{ color: '#303133' }"
+                      :header-cell-style="{backgroundColor: 'rgb(245, 247, 250)',color: '#606266'}"
+                      highlight-current-row
+                      @current-change="handleChange">
+              <el-table-column prop="dialysis_no" label="透析号" width="70" align="center">
+                <template slot-scope="scope">{{scope.row.dialysis_no}}</template>
+              </el-table-column>
+              <el-table-column prop="name" label="姓名" width="90" align="center">
+                <template slot-scope="scope">{{ scope.row.name }}</template>
+              </el-table-column>
+            </el-table>
+          </div>
+          <div style="padding-left:10px;flex:1;width:0;">
+            <div class="tableTitle">指标趋势<span style="font-weight:normal">&nbsp;&nbsp;（当前患者: {{patient_name}}）</span></div>
             <div>
-                <span>查询时间:</span>
-                <el-date-picker
-                v-model="stat_time"
-                type="date"
-                placeholder="选择日期">
-                </el-date-picker>
-                <span>-</span>
-                <el-date-picker
-                v-model="end_time"
-                type="date"
-                placeholder="选择日期">
-                </el-date-picker>
-                <el-select v-model="value" placeholder="请选择">
-                    <el-option
-                    v-for="item in options"
-                    :key="item.value"
-                    :label="item.label"
-                    :value="item.value">
-                    </el-option>
-                </el-select>
-                <el-select v-model="value" placeholder="请选择">
-                    <el-option
-                    v-for="item in options"
-                    :key="item.value"
-                    :label="item.label"
-                    :value="item.value">
-                    </el-option>
-                </el-select>
-                <el-button type="primary">查询</el-button>
+              <line-chart :options="chart"></line-chart>
+<!--              <line-chart :options="bar" v-if="query.statistics_type == 9 || query.statistics_type == 10"></line-chart>-->
+<!--              <line-chart></line-chart>-->
+
             </div>
+            <div class="tableTitle">统计表</div>
             <div>
-                <el-button type="primary">打印</el-button>
-                <el-button type="primary">导出</el-button>
-            </div>
-       </div>
-       <div style="margin: 20px 0px;">
-        <h2 >患者列表</h2>
-       </div>
-       <div >
-        <el-row :gutter="20">
-            <el-col :span="4">
-              <div class="grid-content bg-purple">
-                <!-- <span style="font-size: 18px;font-weight: bold;display: block;">患者列表</span> -->
-                <!-- <h2>患者列表</h2> -->
-                <el-table
-                :data="tableData"
-                border
-                style="width: 100%">
-                    <el-table-column
-                        align="center"
-                        prop="date"
-                        label="透析号"
-                       >
-                    </el-table-column>
-                    <el-table-column
-                        align="center"
-                        prop="name"
-                        label="姓名"
-                        >
-                    </el-table-column>
-                </el-table>
-              </div>
-            </el-col>
-            <el-col :span="19">
-               <div class="grid-content bg-purple">
-                <div class="echart" id="germychart" style="width:100%;height:400px"></div>
-                <el-table
-                    :data="tableData"
-                    style="width: 100%"
-                    border
-                    align="center"
-                    max-height="250">
-                    <el-table-column
-                    fixed
-                    prop="date"
-                    label="姓名"
-                   >
-                    </el-table-column>
-                    <el-table-column
-                    prop="name"
-                    label="检查日期"
-                    >
-                    </el-table-column>
-                    <el-table-column
-                    prop="province"
-                    label="甲状旁腺激素（pg/ml）"
-                    >
-                    </el-table-column>
-                    
-                </el-table>
-               </div>
-           </el-col>
-        </el-row>
-       </div>
+              <el-table ref="table" :data="tableData" v-loading="loading" border :row-style="{ color: '#303133' }" :header-cell-style="{backgroundColor: 'rgb(245, 247, 250)',color: '#606266'}">
+                <el-table-column label="姓名" align="center">
+                  <template slot-scope="scope">
+                    {{scope.row.name}}
+                  </template>
+                </el-table-column>
+
+                <el-table-column width="100" label="检查日期" align="center">
+                  <template slot-scope="scope">
+                    {{getTime(scope.row.inspect_date)}}
+
+                  </template>
+                </el-table-column>
 
+                <el-table-column width="100" label="甲状旁腺激素分析" align="center">
+                  <template slot-scope="scope">
+                    {{scope.row.value}}
+                  </template>
+                </el-table-column>
+              </el-table>
+
+
+            </div>
+          </div>
+        </el-container>
+      </div>
     </div>
+  </div>
 </template>
+
+
 <script>
-  import * as echarts from 'echarts'
-export default{
-    // props: {
-    //     width: {
-    //         type: String,
-    //         default: "100%"
-    //     },
-    //     height: {
-    //         type: String,
-    //         default: "400px"
-    //     },
-    
-    // },
-    data() {
-        return {
-            inputValue:'',
-            stat_time:'',
-            end_time:'',
-            value:'',
-            querySearch:'',
-            tableData:[],
-            options:[],
-            myChartTwo: {},
-            xData: ["Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"], //横坐标
-            opinionData: [23, 24, 18, 25, 27, 28, 25], //人数数据
-            // myChartStyle: { float: "left", width: "100%", height: "400px" },//图表样式
-            
+import echarts from 'echarts'
+import {  uParseTime } from '@/utils/tools'
+import { getCurrentOrgPatients } from '@/api/common/common'
+import {
+  GetDefaultPatient,
+} from '@/api/common/statistics'
+import { PostSearch } from '@/api/patient'
+import { getDataConfig } from '@/utils/data'
+import { GetPersonQCStatistisData } from '../../../api/qcd'
+import LineChart from '../../qcd/components/LineChart.vue'
+
+export default {
+  components: {
+    LineChart
+  },
+  data() {
+    return {
+      pickerOptions: {
+        disabledDate(time) {
+          let threeMonths = new Date(new Date().setFullYear(new Date().getFullYear() - 1)).getTime() - 24 * 3600 * 1000
+          return time.getTime() > Date.now() || time.getTime() < threeMonths
+
         }
-    },
-    created(){
-        
-       
-    },
-    mounted() {
-        // this.$nextTick(function() {
-            this.initEcharts();
-            // this.myChartTwo = echarts.init(document.getElementById("germychart"));
-            // this.myChartTwo.setOption(option);
-            // // //随着屏幕大小调节图表
-            // window.addEventListener("resize", () => {
-            //     console.log('asdfgfdhdgfdghdffgasda');
-            //     this.myChartTwo.resize();
-            // });
-            
-            // window.onresize = this.myChartTwo.resize;
-		// })  
-    },
-    // beforeDestroy(){
-    //     window.addEventListener("resize", () => {
-    //         this.myChartTwo.resize();
-    //     });
-    //     const quality = document.getElementById("germychart");
-    //     quality.addEventListener("transitionend", this.__resizeHanlder);
-    // },
-    methods:{
-        handleSubmit(){
-            console.log('asdfa');
-            this.querySearch
+      },
+      patient_name:'',
+      percent:[],
+      patientsData: [],
+      tableData: [],
+      loading: false,
+      search_value: '',
+      total: 0,
+      query: {
+        patient_id: '',
+        statistics_type: 1,
+        start_time: '',
+        end_time: '',
+        limit: 10,
+        page: 1
+      },
+      crumbs: [
+        { path: false, name: '科室质控' },
+        { path: false, name: '指标评估统计' },
+        { path: false, name: '透析过程指标统计' }
+      ],
+      tableData1: [],
+      chart: {
+        title: {
+          text: 'ECharts 入门示例'
         },
-        initEcharts() {
-            this.myChartTwo = echarts.init(document.getElementById("germychart"));
-            console.log('zxczvbbnm,m');
-            const option = {
-                xAxis: {
-                    type: 'category',
-                        boundaryGap:true,
-                        axisTick:{
-                            alignWithLabel:true //保证刻度线和标签对齐
-                        },
-                    data: this.xData,
-                    splitNumber:this.xData.length, //纵坐标数
-                    interval:this.xData //强制设置坐标轴分割间隔
-                },
-                yAxis: {
-                    type: 'value',
-                    boundaryGap: true,
-                    splitNumber:4, //纵坐标数
-                    interval:10 //强制设置坐标轴分割间隔
-                },
-                legend: {
-                    // show: true,
-                    align:'left',//文字在前图标在后
-                    left:'15%',
-                    top:'5%',
-                    data: [{name:'甲状旁腺激素 pg/ml'}]
+        tooltip: {},
+        legend: {
+          data: [],
+          left: 0
+        },
+        xAxis: {
+          data: []
+        },
+        yAxis: {
+          axisLabel: {
+            formatter: '{value} %'
+          },
+          show: false
+        },
+        series: [
+          {
+            name: '',
+            type: 'line',
+            data: [],
+            barWidth: 30,
+            label: {
+              normal: {
+                show: true,
+                position: 'top',
+                formatter: (params) => {
+                  if(this.percent.length > 0){
+                    let str = ''
+                    str = params.data + '('+ this.percent[params.dataIndex] +'%)'
+                    return str
+                  }else{
+                    let str = ''
+                    str = params.data
+                    return str
+                  }
+                }
+              }
+            },
+            //配置样式
+            itemStyle: {
+              //通常情况下：
+
+              //每个柱子的颜色即为colorList数组里的每一项，如果柱子数目多于colorList的长度，则柱子颜色循环使用该数组
+              normal: {
+                color: function(params) {
+                  //我这边就两个柱子，大体就两个柱子颜色渐变，所以数组只有两个值，多个颜色就多个值
+                  var colorList = [
+                    ['#A9E0F3', '#9FBDFC'],
+
+                    ['#FFD7C0', '#FF9994']
+                  ]
+
+                  var index = params.dataIndex
+                  if (params.dataIndex >= colorList.length) {
+                    index = params.dataIndex % colorList.length
+                  }
+
+                  return new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+                    { offset: 0, color: colorList[index][0] },
+                    // { offset: 0.5, color: colorList[index][1] },
+                    { offset: 1, color: colorList[index][1] }
+                  ])
                 },
-                grid:{
-                    show:true,
-                    left: "5%",
-                    right: "5%",
-                    bottom: "5%"
+                lineStyle:{
+                  color:'#409eff' //改变折线颜色
                 },
-                series: [
-                {
-                    data: this.opinionData,
-                    name:'甲状旁腺激素 pg/ml',
-                    type: "line",// 类型设置为折线图
-                    symbol: 'circle',
-                    itemStyle: {
-                        normal: {
-                            color: '#409eff', //改变折线点的颜色#a80000
-                            lineStyle: {
-                                color: '#409eff' //改变折线颜色
-                            }
-                        }
-                    },
+                barBorderRadius: [5, 5, 0, 0] //柱状角成椭圆形
+              },
 
-                },
-                
-                ],
-                
-            };
-            
-            this.myChartTwo.setOption(option);
-            // //随着屏幕大小调节图表
-            window.addEventListener("resize", () => {
-                console.log('123456788');
-                this.myChartTwo.resize();
-            });
-            
-            // window.onresize = this.myChartTwo.resize;
+              //鼠标悬停时：
+              emphasis: {
+                shadowBlur: 10,
+                shadowOffsetX: 0,
+                shadowColor: 'rgba(0, 0, 0, 0.5)'
+              }
+            }
+          }
+        ],
+        dataZoom: [
+          {
+            // Y轴固定,让内容滚动
+            type: 'slider',
+            show: false,
+            xAxisIndex: [0],
+            start: 1,
+            end: 20, // 设置X轴刻度之间的间隔(根据数据量来调整)
+            zoomLock: true // 锁定区域禁止缩放(鼠标滚动会缩放,所以禁止)
+          },
+          {
+            type: 'inside',
+            xAxisIndex: [0],
+            start: 1,
+            end: 20,
+            zoomLock: true // 锁定区域禁止缩放
+          }
+        ]
+      },
+      bar: {
+        title: {
+          text: 'ECharts 入门示例'
+        },
+        tooltip: {},
+        legend: {
+          data: [],
+          left: 0
+        },
+        xAxis: {
+          data: []
         },
+        yAxis: {
+          axisLabel: {
+            formatter: '{value} %'
+          },
+          show: false
+        },
+        series: [
+          {
+            name: '',
+            type: 'bar',
+            data: [],
+            barWidth: 30,
+            label: {
+              normal: {
+                show: true,
+                position: 'top',
+                formatter: (params) => {
+                  if(this.percent.length > 0){
+                    let str = ''
+                    str = params.data + '('+ this.percent[params.dataIndex] +'%)'
+                    return str
+                  }else{
+                    let str = ''
+                    str = params.data
+                    return str
+                  }
+                }
+              }
+            },
+            //配置样式
+            itemStyle: {
+              //通常情况下：
+
+              //每个柱子的颜色即为colorList数组里的每一项，如果柱子数目多于colorList的长度，则柱子颜色循环使用该数组
+              normal: {
+                color: function(params) {
+                  //我这边就两个柱子，大体就两个柱子颜色渐变，所以数组只有两个值，多个颜色就多个值
+                  var colorList = [
+                    ['#A9E0F3', '#9FBDFC'],
+                    ['#FFD7C0', '#FF9994']
+                  ]
+
+                  var index = params.dataIndex
+                  if (params.dataIndex >= colorList.length) {
+                    index = params.dataIndex % colorList.length
+                  }
+
+                  return new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+                    { offset: 0, color: colorList[index][0] },
+                    // { offset: 0.5, color: colorList[index][1] },
+                    { offset: 1, color: colorList[index][1] }
+                  ])
+                },
+                barBorderRadius: [5, 5, 0, 0] //柱状角成椭圆形
+              },
+
+              //鼠标悬停时：
+              emphasis: {
+                shadowBlur: 10,
+                shadowOffsetX: 0,
+                shadowColor: 'rgba(0, 0, 0, 0.5)'
+              }
+            }
+          }
+        ]
+      }
+
+    }
+  },
+  methods: {
+    printAction(){
+      this.$router.push({
+        path: "/Dialysisanalysis/qualitycontrol/print?patient_id=" + this.query.patient_id+"&project_id="+this.query.project_id+"&item_id="+this.query.item_id+"&start_time="+this.query.start_time+"&end_time="+this.query.end_time
+      });
+
+    },exportAction(){
+      let list = []
+      for (let i = 0; i < this.tableData.length; i++) {
+        let order = this.tableData[i]
+        let name = order.name
+        let value = order.value
+        let inspect_date = order.inspect_date
+
+        let obj = {
+          '姓名': name,
+          '数值': value,
+          '日期': inspect_date,
+        }
+        list.push(obj)
+      }
+      import('@/vendor/Export2Excel').then(excel => {
+        const tHeader = ['姓名', '数值', '日期']
+        const filterVal = ['姓名', '数值', '日期']
+        const data = this.formatJson(filterVal, list)
+        excel.export_json_to_excel1({
+          header: tHeader,
+          data,
+          filename: '明细',
+          ref: this.$refs['table'].$el
+        })
+      })
+    },
+    changeProject(val) {
+      this.query.statistics_type = val
+      this.query.page = 1
+      this.GetPersonQCStatistisData(this.query)
+      this.GetInspectionCheckIndexTableData(this.query)
+
+    },
+    handleChange(val) {
+      this.query.patient_id = val.id
+      this.query.page = 1
+      this.patient_name = val.name
+      this.GetPersonQCStatistisData(this.query)
+      this.GetInspectionCheckIndexTableData(this.query)
+    },
+    handleSizeChange(limit) {
+      this.query.limit = limit
+      this.GetInspectionCheckIndexTableData(this.query)
+
+    },
+    handleCurrentChange(page) {
+      this.query.page = page
+      this.GetPersonQCStatistisData(this.query)
+    },formatJson(filterVal, jsonData) {
+      return jsonData.map(v => filterVal.map(j => v[j]))
+    },
+    changeTime(val) {
+      var time = this.getTimestamp(val) - this.getTimestamp(this.query.end_time)
+      if (time > 0) {
+        this.$message.error('结束时间不能小于开始时间')
+        this.query.start_time = ''
+      } else {
+        // this.getDialysisList()
+        this.query.page = 1
+        this.GetPersonQCStatistisData(this.query)
+        this.GetInspectionCheckIndexTableData(this.query)
+
+      }
+
+    },
+    changeEndTime(val) {
+      var time =
+        this.getTimestamp(val) - this.getTimestamp(this.query.start_time)
+      if (time < 0) {
+        this.$message.error('结束时间不能小于开始时间')
+        this.query.end_time = ''
+      } else {
+        this.query.page = 1
+        this.GetPersonQCStatistisData(this.query)
+        this.GetInspectionCheckIndexTableData(this.query)
+
+      }
+    },
+    getTimestamp(time) {
+      // 把时间日期转成时间戳
+      return new Date(time).getTime() / 1000
+    },
+    QueryOperaById: function(val) {
+      let vascular_access_desc_name = ''
+      let vascular_access_desc = getDataConfig(
+        'hemodialysis',
+        'vascular_access_desc'
+      )
+      for (let i = 0; i < vascular_access_desc.length; i++) {
+        if (vascular_access_desc[i].id == val) {
+          vascular_access_desc_name = vascular_access_desc[i].name
+        }
+      }
+
+      return vascular_access_desc_name
+    },
+    GetAnticoagulantById: function(val) {
+      let anticoagulan_name = ''
+      var anticoagulantsConfitTwo = this.$store.getters.anticoagulants_confit
+      let anticoagulant = anticoagulantsConfitTwo
+      for (let keys in anticoagulant) {
+        if (anticoagulant[keys].id == val) {
+          anticoagulan_name = anticoagulant[keys].name
+        }
+      }
+      return anticoagulan_name
+    },
+    getModeName(mode_id) {
+      return this.$store.getters.treatment_mode[mode_id] != undefined ? this.$store.getters.treatment_mode[mode_id].name : ''
+    },  getTime(val) {
+      if(val == "" || val == undefined){
+        return ""
+      }else {
+        return uParseTime(val, '{y}-{m}-{d}')
+      }
+    },
+    GetInspectionCheckIndexTableData(params) {
+      this.loading = true
+      GetPersonQCStatistisData(params)
+        .then(rs => {
+          var resp = rs.data
+          console.log("resp=====",resp)
+          if (resp.state == 1) {
+            this.loading = false
+            this.tableData = []
+            for (let i = 0; i < resp.data.inspections.length; i++) {
+              let obj = {
+                name:resp.data.patient.name,
+                value:resp.data.inspections[i].inspect_value,
+                inspect_date:resp.data.inspections[i].inspect_date
+              }
+              this.tableData.push(obj)
+            }
+            this.total = resp.data.total
+
+          } else {
+            this.loading = false
+          }
+        })
+        .catch(error => {
+
+        })
+    },
+    GetPersonQCStatistisData(params) {
+      this.chart.xAxis.data = []
+      this.chart.series[0].data = []
+      this.bar.xAxis.data = []
+      this.bar.series[0].data = []
+      this.percent = []
+      GetPersonQCStatistisData(params)
+        .then(rs => {
+          var resp = rs.data
+          if (resp.state == 1) {
+            console.log(resp.data.inspections)
+              for (let i = 0; i < resp.data.inspections.length; i++) {
+                this.chart.xAxis.data.push(this.getTime(resp.data.inspections[i].inspect_date))
+                this.chart.series[0].data.push(resp.data.inspections[i].inspect_value)
+              }
+              console.log(this.chart.xAxis.data)
+            console.log( this.chart.series[0].data)
+
+              this.getArrLength(this.chart.xAxis.data,1)
+          } else {
+
+          }
+        })
+        .catch(error => {
+        })
+    },
+    handleSelect(val) {
+      this.query.patient_id = val.id
+      this.query.page = 1
+      this.patient_name = val.name
+      for (let i = 0;i < this.patientsData.length; i++){
+        console.log(this.patientsData[i].id)
+        console.log(val.id)
+
+        if (this.patientsData[i].id == val.id){
+          this.$refs.table.setCurrentRow(this.patientsData[i])
+        }
+      }
+
+
+    },
+    querySearchAsync(keyword, cb) {
+      let key = ''
+      if (keyword != undefined) {
+        key = keyword
+      }
+      let searchArray = []
+      PostSearch(key).then(response => {
+        if (response.data.state == 1) {
+          searchArray = response.data.data.patient
+          cb(searchArray)
+        } else {
+          cb([])
+        }
+      })
+    },
+    chooseWay(way) {
+      this.wayType = way
+    }, getCurrentOrgPatients() {
+      getCurrentOrgPatients().then(response => {
+        if (response.data.state == 1) {
+          var patients = response.data.data.patients
+          this.patientsData = patients
+          this.GetDefaultPatient()
+        }
+      })
+    }, GetDefaultPatient() {
+      GetDefaultPatient().then(response => {
+        if (response.data.state == 1) {
+          var patient = response.data.data.patient
+          for (let i = 0;i < this.patientsData.length; i++){
+            if (this.patientsData[i].id == patient.id){
+              this.patient_name = this.patientsData[i].name
+              this.$refs.table.setCurrentRow(this.patientsData[i])
+            }
+          }
+          this.query.patient_id = patient.id
+          this.GetPersonQCStatistisData(this.query)
+
+        }
+      })
+
     },
-    
+    getArrLength(result,type){
+      if(type == 1){
+        if(result.length > 10){
+          var dataZoom_end = (10/result.length)*100;
+          this.chart.dataZoom[0].end = dataZoom_end
+        }else{
+          var dataZoom_end = 100;
+          this.chart.dataZoom[0].end = dataZoom_end
+        }
+      }else if(type == 2){
+        if(result.length > 10){
+          var dataZoom_end = (10/result.length)*100;
+          this.bar.dataZoom[0].end = dataZoom_end
+        }else{
+          var dataZoom_end = 100;
+          this.bar.dataZoom[0].end = dataZoom_end
+        }
+      }
+
+    }
+  }, mounted() {
+    var date = new Date()
+    var year = date.getFullYear() //获取完整的年份(4位)
+    var month = date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1).toString() : date.getMonth() + 1 //获取当前月份(0-11,0代表1月)
+    var day = date.getDate() < 10 ? '0' + date.getDate().toString() : date.getDate() //获取当前日(1-31)
+    var last_month = date.getMonth() < 10 ? '0' + date.getMonth().toString() : date.getMonth() //获取当前月份(0-11,0代表1月)
+    this.query.patient_id = 0
+    this.query.end_time = year + '-' + month + '-' + day
+    this.query.start_time = year + '-' + last_month + '-' + day
+    this.query.project_id = 20
+    this.query.item_id = 171
+    this.getCurrentOrgPatients()
+
+    // this.GetPersonQCStatistisData()
+
+
+  }
 }
 </script>
+
 <style lang="scss" scoped>
-.content_top{
-    display: flex;
-    justify-content: space-around;
-    margin-bottom: 20px;
+.tableTitle {
+  font-size: 16px;
+  color: #000;
+  font-weight: bold;
+  margin-bottom: 10px;
+}
+</style>
+<style lang="scss">
+.page_process {
+.el-tabs{
+  margin-bottom:0 !important;
+}
+.el-button--medium {
+  padding: 10px 8px;
+}
+
+.el-form-item {
+  margin-bottom: 0;
+}
+::-webkit-scrollbar{
+  height: 15px !important;
+}
+
 }
-</style>
+</style>

src/xt_pages/Dialysisanalysis/qualitycontrol/totalSstatistics.vue

@@ -1,268 +1,469 @@
-
 <template>
   <div>
-      <!-- <div class="content_top">
-          <div class="block">
-              <span>查询时间:</span>
-              <el-date-picker
-              v-model="time_month"
-              type="month"
-              placeholder="选择月">
-              </el-date-picker>
-          </div>
-          <div>
-              <el-date-picker
-              v-model="stat_time"
-              type="date"
-              placeholder="选择日期">
-              </el-date-picker>
-              <span>-</span>
-              <el-date-picker
-              v-model="end_time"
-              type="date"
-              placeholder="选择日期">
-              </el-date-picker>
-          </div>
-          <div style="width: 200px;">
-              <el-input v-model="input" placeholder="请输入内容"></el-input>
-          </div>
-          <el-button type="primary">查询</el-button>
-      </div> -->
-      <el-row :gutter="20">
-      <el-col :span="5"> 
+    <el-row :gutter="25">
+      <el-col :span="5">
         <div class="block">
           <span>查询时间:</span>
-          <el-date-picker
-          v-model="time_month"
-          type="month"
-          placeholder="选择月">
-          </el-date-picker>
+          <el-select size="small" v-model="time_type" placeholder="请选择"
+                     style="width:150px;margin-left:10px;" @change="changeItem">
+            <el-option
+              v-for="item,index in times"
+              :key="index"
+              :label="item.label"
+              :value="item.value">
+            </el-option>
+          </el-select>
         </div>
       </el-col>
       <el-col :span="8">
         <div>
           <el-date-picker
-          v-model="stat_time"
-          type="date"
-          placeholder="选择日期">
+            style="width: 200px"
+
+            v-model="start_time"
+            format="yyyy-MM-dd"
+            value-format="yyyy-MM-dd"
+            type="date"
+
+            placeholder="选择日期">
           </el-date-picker>
           <span>-</span>
           <el-date-picker
-          v-model="end_time"
-          type="date"
-          placeholder="选择日期">
+            style="width: 200px"
+            v-model="end_time"
+            format="yyyy-MM-dd"
+            value-format="yyyy-MM-dd"
+            type="date"
+            placeholder="选择日期">
           </el-date-picker>
         </div>
       </el-col>
-      <el-col :span="3">
-        <div style="width: 200px;">
-          <el-input v-model="input" placeholder="请输入内容"></el-input>
+      <el-col :span="5">
+        <div >
+          <el-input disabled v-model="input" placeholder="请输入内容"></el-input>
         </div>
       </el-col>
-      <el-col :span="2">
-          <el-button type="primary">查询</el-button>
+      <el-col :span="3">
+        <el-button type="primary" @click="getData()">查询</el-button>
       </el-col>
-      </el-row>
-      
-      <div class="cell clearfix" style="margin: 20px; font-weight: bold;">
-        <p class="chartTitle">统计图</p>
-      </div>
-      <div class="echart" id="mychart" :style={width:width,height:height}></div>
-      <div style="width: 80%;margin: auto;">
-          <el-table
-          :data="tableData"
-          :show-summary = true
-          border
-          style="width: 100%;">
-              <el-table-column
-                  prop="date"
-                  align="center"
-                  label="甲状旁腺激素"
-                  >
-              </el-table-column>
-              <el-table-column
-                  prop="name"
-                  
-                  label="人数"
-                  >
-              </el-table-column>
-              <el-table-column
-                  prop="address"
-                  align="center"
-                  label="操作">
-                  <template slot-scope="scope">
-                      <el-button @click="handleClick(scope.row)" style="font-size:16px;"
-                              type="text" >查看详情
-                      </el-button>
-                  </template>
-              </el-table-column>
-          </el-table>
-      </div>
+    </el-row>
+    <div class="cell clearfix" style="margin: 20px; font-weight: bold;">
+      <p class="chartTitle">统计图</p>
+    </div>
+    <div class="echart" id="mychart" :style={width:width,height:height}></div>
+    <div style="width: 80%;margin: auto;">
+      <el-table
+        :data="tableData"
+        border
+        style="width: 100%;">
+        <el-table-column
+          prop="name"
+          align="center"
+          label="甲状旁腺激素"
+        >
+        </el-table-column>
+        <el-table-column
+          prop="count"
+          label="人数"
+        >
+        </el-table-column>
+<!--        <el-table-column-->
+<!--          prop="address"-->
+<!--          align="center"-->
+<!--          label="操作">-->
+<!--          <template slot-scope="scope">-->
+<!--            <el-button @click="handleClick(scope.row)" style="font-size:16px;"-->
+<!--                       type="text">查看详情-->
+<!--            </el-button>-->
+<!--          </template>-->
+<!--        </el-table-column>-->
+      </el-table>
+    </div>
+<!--    <el-dialog class="centerDialog"-->
+<!--               title="打印"-->
+<!--              >-->
+<!--      <el-row :gutter="25">-->
+<!--        <el-col :span="5">-->
+<!--          <div class="block">-->
+<!--            <span>查询时间:</span>-->
+<!--            <el-select size="small" v-model="time_type" placeholder="请选择"-->
+<!--                       style="width:150px;margin-left:10px;" @change="changeItem">-->
+<!--              <el-option-->
+<!--                v-for="item,index in times"-->
+<!--                :key="index"-->
+<!--                :label="item.label"-->
+<!--                :value="item.value">-->
+<!--              </el-option>-->
+<!--            </el-select>-->
+<!--          </div>-->
+<!--        </el-col>-->
+<!--        <el-col :span="8">-->
+<!--          <div>-->
+<!--            <el-date-picker-->
+<!--              style="width: 200px"-->
+
+<!--              v-model="start_time"-->
+<!--              format="yyyy-MM-dd"-->
+<!--              value-format="yyyy-MM-dd"-->
+<!--              type="date"-->
+
+<!--              placeholder="选择日期">-->
+<!--            </el-date-picker>-->
+<!--            <span>-</span>-->
+<!--            <el-date-picker-->
+<!--              style="width: 200px"-->
+<!--              v-model="end_time"-->
+<!--              format="yyyy-MM-dd"-->
+<!--              value-format="yyyy-MM-dd"-->
+<!--              type="date"-->
+<!--              placeholder="选择日期">-->
+<!--            </el-date-picker>-->
+<!--          </div>-->
+<!--        </el-col>-->
+<!--        <el-col :span="5">-->
+<!--          <el-select-->
+<!--            placeholder="请选择类型"-->
+<!--            style="width:95%"-->
+<!--          >-->
+<!--            <el-option label="不达标患者" value="1"></el-option>-->
+<!--            <el-option label="未检查患者" value="2"></el-option>-->
+<!--            <el-option label="达标患者" value="3"></el-option>-->
+<!--            <el-option label="不限" value="0"></el-option>-->
+<!--          </el-select>-->
+<!--        </el-col>-->
+<!--        <el-col :span="5">-->
+<!--          <el-select-->
+<!--            placeholder="请选择排序"-->
+<!--            style="width:95%"-->
+<!--          >-->
+<!--            <el-option label="按时间" value="1"></el-option>-->
+<!--            <el-option label="按患者" value="2"></el-option>-->
+<!--            <el-option label="不限" value="0"></el-option>-->
+<!--          </el-select>-->
+<!--        </el-col>-->
+<!--        <el-col :span="3">-->
+<!--          <el-button type="primary" @click="getData()">查询</el-button>-->
+<!--          <el-button type="primary" @click="getData()">打印</el-button>-->
+<!--          <el-button type="primary" @click="getData()">导出</el-button>-->
+
+<!--        </el-col>-->
+<!--      </el-row>-->
+<!--      <div style="width: 80%;margin: auto;">-->
+<!--        <el-table-->
+<!--          :data="tableData"-->
+<!--          border-->
+<!--          style="width: 100%;">-->
+<!--          <el-table-column-->
+<!--            prop="name"-->
+<!--            align="center"-->
+<!--            label="透析号"-->
+<!--          >-->
+<!--          </el-table-column>-->
+<!--          <el-table-column-->
+<!--            prop="count"-->
+<!--            label="姓名"-->
+<!--          >-->
+<!--          </el-table-column>-->
+<!--          <el-table-column-->
+<!--            prop="address"-->
+<!--            align="center"-->
+<!--            label="检查日期">-->
+
+<!--          </el-table-column>-->
+<!--          <el-table-column-->
+<!--            prop="address"-->
+<!--            align="center"-->
+<!--            label="结果">-->
+
+<!--          </el-table-column>-->
+<!--        </el-table>-->
+<!--      </div>-->
+
+<!--    </el-dialog>-->
   </div>
 </template>
 <script>
-import * as echarts from "echarts";
-export default{
+import * as echarts from 'echarts'
+import { GetQCStatistisData } from '../../../api/qcd'
+
+const moment = require('moment')
+
+export default {
   props: {
- 
-  width: {
-    type: String,
-    default: "100%"
-  },
-  height: {
-    type: String,
-    default: "400px"
+
+    width: {
+      type: String,
+      default: '100%'
+    },
+    height: {
+      type: String,
+      default: '400px'
+    }
+
   },
-  
-},
   data() {
-      return {
-          time_month:'',
-          stat_time:'',
-          end_time:'',
-          input:'',
-          myChart: {},
-          pieData : [
-          {
-        value: 463,
-        name: "不达标值患者"
-      },
-      {
-        value: 395,
-        name: "未检查患者"
-      },
-      {
-        value: 157,
-        name: "达标值患者"
-      },
-      // {
-      //   value: 149,
-      //   name: "广东"
-      // },
-      // {
-      //   value: 147,
-      //   name: "湖南"
-      // }
-          
-          ],
-          pieName: [],
-          // myChartStyle:{float: "right", width: "100%", height: "400px"},
-          tableData:[],
-      }
+    return {
+      time_type: 1,
+      times: [
+        { value: 1, label: '本月' },
+        { value: 2, label: '上月' },
+        { value: 3, label: '今年' },
+        { value: 4, label: '上一年' },
+        { value: 5, label: '第一季度' },
+        { value: 6, label: '第二季度' },
+        { value: 7, label: '第三季度' },
+        { value: 8, label: '第四季度' },
+        { value: 9, label: '自定义' }
+
+      ],
+      time_month: '',
+      start_time: new Date(new Date().getFullYear(), new Date().getMonth(), 1).toLocaleDateString('en-CA'),
+      end_time: new Date(new Date().getFullYear(), new Date().getMonth() + 1, 0).toLocaleDateString('en-CA'),
+      input: '',
+      myChart: {},
+      pieData: [],
+      pieName: [],
+      // myChartStyle:{float: "right", width: "100%", height: "400px"},
+      tableData: [],
+      reference:{},
+    }
   },
   mounted() {
-  this.initDate(); //数据初始化
-  this.initEcharts();
-},
-methods: {
-  initDate() {
-    for (let i = 0; i < this.pieData.length; i++) {
-      this.pieName[i] = this.pieData[i].name;
-    }
+    this.getData()
   },
-  initEcharts() {
-    // 饼图
-    this.myChart = echarts.init(document.getElementById("mychart"));
-    window.addEventListener("resize", () => {
-      console.log('098765adsfghg');
-      this.myChart.resize();
-    });
-    console.log('09876543454676');
-    const option = {
-      legend: {
-        // 图例
-        data: this.pieName,
-        left: "10%",
-        top: "30%",
-        orient: "vertical"
-      },
-      color:['#ff7f9f','#fff67f','#1e5feb'],
-      title: {
-        // 设置饼图标题，位置设为顶部居中
-      //   text: "国内院士前五省份图示",
-        top: "0%",
-        left: "center"
-      },
-      series: [
-        {
-          type: "pie",
-          label: {
-            normal : {
-              formatter: '{b}:{c}: ({d}%)',
-              textStyle : {
-                  fontWeight : 'normal',
-                  fontSize : 15,
-                  color : "black"
+  methods: {
+    getData() {
+      if(this.start_time.length == 0){
+        this.$message.error("请选择开始时间")
+      }
+      if(this.end_time.length == 0){
+        this.$message.error("请选择结束时间")
+      }
+      let params = {
+        start_date: this.start_time,
+        end_date: this.end_time,
+        project_id: 20,
+        item_id: 171
+      }
+      this.pieData = []
+      this.tableData = []
+      console.log("~~~~~~~~~~")
+      GetQCStatistisData(params).then(response => {
+        if (response.data.state == 1) {
+          this.reference = response.data.data.reference
+          this.input = response.data.data.reference.range_min + "<=" + response.data.data.reference.item_name + "<=" + response.data.data.reference.range_max
+          let objone = {
+            value:  response.data.data.unusual_total / response.data.data.patient_count,
+            name: '不达标值患者',
+            count:response.data.data.unusual_total,
+          }
+          this.pieData.push(objone)
+          this.tableData.push(objone)
+
+            let objtwo = {
+            value:   response.data.data.normal_total / response.data.data.patient_count,
+            name: '达标值患者',
+            count:response.data.data.normal_total,
+
+          }
+          this.pieData.push(objtwo)
+          this.tableData.push(objtwo)
+
+          let objthree = {
+            value: response.data.data.patient_count / response.data.data.no_check_total,
+            name: '未检查患者',
+            count:response.data.data.no_check_total,
+
+          }
+          this.pieData.push(objthree)
+          this.tableData.push(objthree)
+
+          let objfour = {
+            value: response.data.data.patient_count,
+            name: '合计',
+            count:response.data.data.patient_count,
+          }
+          this.tableData.push(objfour)
+          for (let i = 0; i < this.pieData.length; i++) {
+            this.pieName[i] = this.pieData[i].name
+          }
+          this.myChart = echarts.init(document.getElementById('mychart'))
+          window.addEventListener('resize', () => {
+            this.myChart.resize()
+          })
+          const option = {
+            legend: {
+              // 图例
+              data: this.pieName,
+              left: '10%',
+              top: '30%',
+              orient: 'vertical'
+            },
+            color: ['#ff7f9f', '#fff67f', '#1e5feb'],
+            title: {
+              // 设置饼图标题，位置设为顶部居中
+              //   text: "国内院士前五省份图示",
+              top: '0%',
+              left: 'center'
+            },
+            series: [
+              {
+                type: 'pie',
+                label: {
+                  show: true,
+                  formatter: '{b} : {d}% ({c})'
+                  // b代表名称，c代表对应值，d代表百分比"{b} : {d}% ({c})"
+                },
+                radius: '65%', //饼图半径
+                data: this.pieData
               }
-            }
-            // b代表名称，c代表对应值，d代表百分比"{b} : {d}% ({c})" 
-          },
-          radius: "65%", //饼图半径
-          data: this.pieData,
-          itemStyle : {
-            emphasis: {
-              shadowBlur: 10,
-              shadowOffsetX: 0,
-              shadowColor: 'rgba(0, 0, 0, 0.5)'
-            }
+            ]
           }
+          //   console.log(this.seriesData);
+          const optionFree = {
+            series: [
+              {
+                data: this.seriesData,
+                type: 'line',
+                smooth: true
+              }
+            ]
+          }
+          this.myChart = echarts.init(document.getElementById('mychart'))
+          this.myChart.setOption(option)
+        } else {
+          this.$message.error(response.data.msg)
         }
-      ]
-    };
-  //   console.log(this.seriesData);
-    const optionFree = {
-      series: [
-        {
-          data: this.seriesData,
-          type: "line",
-          smooth: true
-        }
-      ]
-    };
-    this.myChart = echarts.init(document.getElementById("mychart"));
-    this.myChart.setOption(option);
-    //随着屏幕大小调节图表
-  //   window.addEventListener("resize", () => {
-  //     this.myChart.resize();
-  //   });
-  },
-  getSummaries(param) {
-      const { columns, data } = param;
-      const sums = [];
+      })
+
+    },
+    changeItem(val) {
+      const currentDate = new Date()
+      switch (val) {
+        case 1:
+
+          const startOfMonth = new Date(currentDate.getFullYear(), currentDate.getMonth(), 1).toLocaleDateString('en-CA')
+          const endOfMonth = new Date(currentDate.getFullYear(), currentDate.getMonth() + 1, 0).toLocaleDateString('en-CA')
+
+          this.start_time = startOfMonth
+          this.end_time = endOfMonth
+          this.getData()
+
+          break
+        case 2:
+          // 上月的起始日期和结束日期
+          const startOfLastMonth = new Date(currentDate.getFullYear(), currentDate.getMonth() - 1, 1).toLocaleDateString('en-CA')
+          const endOfLastMonth = new Date(currentDate.getFullYear(), currentDate.getMonth(), 0).toLocaleDateString('en-CA')
+
+          this.start_time = startOfLastMonth
+          this.end_time = endOfLastMonth
+          this.getData()
+
+          break
+        case 3:
+          // 今年的起始日期和结束日期
+          const startOfYear = new Date(currentDate.getFullYear(), 0, 1).toLocaleDateString('en-CA')
+          const endOfYear = new Date(currentDate.getFullYear(), 11, 31).toLocaleDateString('en-CA')
+
+          this.start_time = startOfYear
+          this.end_time = endOfYear
+          this.getData()
+
+          break
+        case 4:
+          // 上一年的起始日期和结束日期
+          const startOfLastYear = new Date(currentDate.getFullYear() - 1, 0, 1).toLocaleDateString('en-CA')
+          const endOfLastYear = new Date(currentDate.getFullYear() - 1, 11, 31).toLocaleDateString('en-CA')
+
+          this.start_time = startOfLastYear
+          this.end_time = endOfLastYear
+          this.getData()
+
+          break
+        case 5:
+          // 第一季度的起始日期和结束日期
+          const startOfFirstQuarter = new Date(currentDate.getFullYear(), 0, 1).toLocaleDateString('en-CA')
+          const endOfFirstQuarter = new Date(currentDate.getFullYear(), 2, 31).toLocaleDateString('en-CA')
+
+          this.start_time = startOfFirstQuarter
+          this.end_time = endOfFirstQuarter
+          this.getData()
+
+          break
+        case 6:
+          // 第二季度的起始日期和结束日期
+          const startOfSecondQuarter = new Date(currentDate.getFullYear(), 3, 1).toLocaleDateString('en-CA')
+          const endOfSecondQuarter = new Date(currentDate.getFullYear(), 5, 30).toLocaleDateString('en-CA')
+
+          this.start_time = startOfSecondQuarter
+          this.end_time = endOfSecondQuarter
+          this.getData()
+
+          break
+        case 7:
+          // 第三季度的起始日期和结束日期
+          const startOfThirdQuarter = new Date(currentDate.getFullYear(), 6, 1).toLocaleDateString('en-CA')
+          const endOfThirdQuarter = new Date(currentDate.getFullYear(), 8, 30).toLocaleDateString('en-CA')
+
+          this.start_time = startOfThirdQuarter
+          this.end_time = endOfThirdQuarter
+          this.getData()
+
+          break
+        case 8:
+          // 第四季度的起始日期和结束日期
+          const startOfFourthQuarter = new Date(currentDate.getFullYear(), 9, 1).toLocaleDateString('en-CA')
+          const endOfFourthQuarter = new Date(currentDate.getFullYear(), 11, 31).toLocaleDateString('en-CA')
+
+          this.start_time = startOfFourthQuarter
+          this.end_time = endOfFourthQuarter
+          this.getData()
+          break
+        case 9:
+          this.start_time = ''
+          this.end_time = ''
+          break
+      }
+    },
+
+
+    getSummaries(param) {
+      const { columns, data } = param
+      const sums = []
       columns.forEach((column, index) => {
         if (index === 0) {
-          sums[index] = '总价';
-          return;
+          sums[index] = '总价'
+          return
         }
-        const values = data.map(item => Number(item[column.property]));
+        const values = data.map(item => Number(item[column.property]))
         if (!values.every(value => isNaN(value))) {
           sums[index] = values.reduce((prev, curr) => {
-            const value = Number(curr);
+            const value = Number(curr)
             if (!isNaN(value)) {
-              return prev + curr;
+              return prev + curr
             } else {
-              return prev;
+              return prev
             }
-          }, 0);
-          sums[index] += ' 元';
+          }, 0)
+          sums[index] += ' 元'
         } else {
-          sums[index] = 'N/A';
+          sums[index] = 'N/A'
         }
-      });
+      })
 
-      return sums;
-  },
-  handleClick(id){
-      console.log(id);
+      return sums
+    },
+    handleClick(id) {
+      console.log(id)
+    }
   }
-}
 
 }
 </script>
 <style lang="scss" scoped>
-.content_top{
+.content_top {
   display: flex;
   justify-content: space-around;
   color: #1e5feb;
 }
-</style>
+</style>

src/xt_pages/hospitalStation/batchStatementTemplate/hospitalBatchPrint.vue

@@ -1,421 +1,420 @@
 <template>
-    <div id="statement-print" class="statement-print">
-      <div  v-for="(info,index) in infos">
-      <div class="statementTitle">广东省社会医疗保险医疗费用结算单</div>
-      <table class="statementTable" border="1">
-        <tr>
-          <td width="80">机构名称</td>
-          <td colspan="4">{{info.fixmedins_name}}</td>
-          <td width="80">机构编码</td>
-          <td colspan="4">{{info.fixmedins_code}}</td>
-          <td width="100">医保结算级别</td>
-          <td width="100" v-if="info.hosp_lv == '1'">三级特等</td>
-          <td width="100" v-if="info.hosp_lv == '2'">三级甲等</td>
-          <td width="100" v-if="info.hosp_lv == '3'">三级乙等</td>
-          <td width="100" v-if="info.hosp_lv == '4'">三级丙等</td>
-          <td width="100" v-if="info.hosp_lv == '5'">二级甲等</td>
-          <td width="100" v-if="info.hosp_lv == '6'">二级乙等</td>
-          <td width="100" v-if="info.hosp_lv == '7'">二级丙等</td>
-          <td width="100" v-if="info.hosp_lv == '8'">一级甲等</td>
-          <td width="100" v-if="info.hosp_lv == '9'">一级乙等</td>
-          <td width="100" v-if="info.hosp_lv == '10'">一级丙等</td>
-          <td width="100" v-if="info.hosp_lv == '11'">无等级</td>
-          <td width="100" v-else></td>
-  
-        </tr>
-        <tr>
-          <td width="90">就医登记号</td>
-          <td colspan="11">{{info.mdtrt_id}}</td>
-        </tr>
-        <tr>
-          <td width="80">姓名</td>
-          <td width="80">{{info.psn_name}}</td>
-          <td width="80">性别</td>
-          <td width="50" v-if="info.gend == '1'">男</td>
-          <td width="50" v-if="info.gend == '2'">女</td>
-  
-          <td width="80">出生日期</td>
-          <td width="100">{{info.brdy}}</td>
-          <td width="90">个人电脑号</td>
-          <td width="110">{{info.psn_no}}</td>
-          <td width="80">人员类别</td>
-          <td colspan="3" v-if="info.psn_type == '11'">在职</td>
-          <td colspan="3" v-if="info.psn_type == '1101'">职工在职</td>
-          <td colspan="3" v-if="info.psn_type == '1102'">公务员在职</td>
-          <td colspan="3" v-if="info.psn_type == '1103'">灵活就业人员在职</td>
-          <td colspan="3" v-if="info.psn_type == '1160'">地方其他扩展人员</td>
-  
-  
-          <td colspan="3" v-if="info.psn_type == '12'">退休人员</td>
-          <td colspan="3" v-if="info.psn_type == '1201'">职工退休</td>
-          <td colspan="3" v-if="info.psn_type == '1202'">公务员退休</td>
-          <td colspan="3" v-if="info.psn_type == '1203'">灵活就业人员退休</td>
-          <td colspan="3" v-if="info.psn_type == '1260'">地方其他扩展人员</td>
-  
-  
-          <td colspan="3" v-if="info.psn_type == '13'">离休</td>
-          <td colspan="3" v-if="info.psn_type == '1300'">离休人员</td>
-          <td colspan="3" v-if="info.psn_type == '1360'">地方其他扩展人员</td>
-  
-          <td colspan="3" v-if="info.psn_type == '14'">居民(未成年)</td>
-          <td colspan="3" v-if="info.psn_type == '1401'">新生儿</td>
-          <td colspan="3" v-if="info.psn_type == '1402'">学龄前儿童</td>
-          <td colspan="3" v-if="info.psn_type == '1403'">中小学生</td>
-          <td colspan="3" v-if="info.psn_type == '1404'">大学生</td>
-          <td colspan="3" v-if="info.psn_type == '1405'">未成年(未入学)</td>
-  
-  
-          <td colspan="3" v-if="info.psn_type == '15'">居民(成年)</td>
-          <td colspan="3" v-if="info.psn_type == '1501'">普通居民(成年)</td>
-          <td colspan="3" v-if="info.psn_type == '1560'">地方其他扩展身份</td>
-  
-          <td colspan="3" v-if="info.psn_type == '16'">居民(老年)</td>
-  
-  
-  
-        </tr>
-        <tr>
-          <td>单位名称</td>
-          <td colspan="5">{{info.emp_name}}</td>
-          <td width="80">联系电话</td>
-          <td width="110">{{info.patient.phone}}</td>
-          <td width="80">身份证号</td>
-          <td colspan="3">{{info.certno}}</td>
-        </tr>
-        <tr>
-          <td>住院号</td>
-          <td>{{info.number}}</td>
-          <td>科别</td>
-          <td width="100"></td>
-          <td>床号</td>
-          <td></td>
-          <td>入院日期</td>
-          <td>{{info.begndate}}</td>
-          <td>出院日期</td>
-          <td width="100">{{info.enddate}}</td>
-          <td>住院天数</td>
-          <td>{{getDay(info.begndate,info.enddate)}}</td>
-  
-        </tr>
-        <tr>
-          <td>险种</td>
-          <td colspan="2" v-if="info.insutype == '310'">职工基本医疗保险</td>
-          <td colspan="2" v-if="info.insutype == '320'">公务员医疗补助</td>
-          <td colspan="2" v-if="info.insutype == '330'">大额医疗费用补助</td>
-          <td colspan="2" v-if="info.insutype == '340'">离休人员医疗保障</td>
-          <td colspan="2" v-if="info.insutype == '390'">城乡居民基本医疗保险</td>
-          <td colspan="2" v-if="info.insutype == '392'">城乡居民大病医疗保险</td>
-          <td colspan="2" v-if="info.insutype == '510'">生育保险</td>
-          <td>入院第一诊断</td>
-          <td colspan="3">{{info.diagnosis}}</td>
-          <td>出院第一诊断</td>
-          <td colspan="4">{{info.diagnosis}}</td>
-  
-  
-        </tr>
-        <tr>
-          <td>业务类别</td>
-          <td colspan="5" style="text-align:left;padding-left:10px;" v-if="info.med_type == '11'">普通门诊</td>
-          <td colspan="5" style="text-align:left;padding-left:10px;" v-if="info.med_type == '12'">门诊挂号</td>
-          <td colspan="5" style="text-align:left;padding-left:10px;" v-if="info.med_type == '13'">急诊</td>
-          <td colspan="5" style="text-align:left;padding-left:10px;" v-if="info.med_type == '14'">门诊慢性病</td>
-          <td colspan="5" style="text-align:left;padding-left:10px;" v-if="info.med_type == '15'">门诊统筹</td>
-          <!--        <td colspan="5" style="text-align:left;padding-left:10px;" v-if="info.med_type == '16'">门诊慢性病</td>-->
-          <td colspan="5" style="text-align:left;padding-left:10px;" v-if="info.med_type == '21'">普通住院</td>
-  
-          <td>结算时间</td>
-          <td colspan="5" style="text-align:left;padding-left:10px;">{{info.setl_time.split(' ')[0]}}</td>
-        </tr>
-        <tr>
-          <td colspan="12" style="text-align:left;padding-left:10px;">
-            本次就医：总费用{{info.medfee_sumamt}}元，基金支付{{info.fund_pay_sumamt}}元，个人支付{{info.psn_pay}}元。
-            (起付线 {{info.act_pay_dedc}}元, 先自付 {{info.preselfpay_amt}}元, 段内自付 {{(info.psn_pay - info.preselfpay_amt).toFixed(2)}} )
-  
-          </td>
-        </tr>
-        <tr>
-          <td>费用名称</td>
-          <td colspan="2">总费用</td>
-          <td>自费</td>
-          <td colspan="2">部分项目自付</td>
-          <td>费用名称</td>
-          <td colspan="2">总费用</td>
-          <td>自费</td>
-          <td colspan="2">部分项目自付</td>
-        </tr>
-        <tr>
-          <td>床位费</td>
-          <td colspan="2" style="text-align:right;padding-right:10px;">{{info.bed_cost_total}}</td>
-          <td style="text-align:right;padding-right:10px;">{{info.bed_cost_self_total}}</td>
-          <td colspan="2" style="text-align:right;padding-right:10px;">{{info.bed_cost_part_self_total}}</td>
-          <td>西成药</td>
-          <td colspan="2" style="text-align:right;padding-right:10px;">{{info.western_medicine_cost_total}}</td>
-          <td style="text-align:right;padding-right:10px;">{{info.western_medicine_cost_self_total}}</td>
-          <td colspan="2" style="text-align:right;padding-right:10px;">{{info.western_medicine_cost_part_self_total}}</td>
-        </tr>
-        <tr>
-          <td>中药费</td>
-          <td colspan="2" style="text-align:right;padding-right:10px;">0</td>
-          <td style="text-align:right;padding-right:10px;">0</td>
-          <td colspan="2" style="text-align:right;padding-right:10px;">0</td>
-          <td>中成药</td>
-          <td colspan="2" style="text-align:right;padding-right:10px;">{{info.chinese_traditional_medicine_cost_total}}
-          </td>
-          <td style="text-align:right;padding-right:10px;">{{info.chinese_traditional_medicine_cost_self_total}}</td>
-          <td colspan="2" style="text-align:right;padding-right:10px;">
-            {{info.chinese_traditional_medicine_cost_part_self_total}}
-          </td>
-        </tr>
-        <tr>
-          <td>中草药</td>
-          <td colspan="2" style="text-align:right;padding-right:10px;">0</td>
-          <td style="text-align:right;padding-right:10px;">0</td>
-          <td colspan="2" style="text-align:right;padding-right:10px;">0</td>
-          <td>检查费</td>
-          <td colspan="2" style="text-align:right;padding-right:10px;">{{info.check_cost_total}}</td>
-          <td style="text-align:right;padding-right:10px;">{{info.check_cost_self_total}}</td>
-          <td colspan="2" style="text-align:right;padding-right:10px;">{{info.check_cost_part_self_total}}</td>
-        </tr>
-        <tr>
-          <td>治疗费</td>
-          <td colspan="2" style="text-align:right;padding-right:10px;">{{info.treat_cost_total}}</td>
-          <td style="text-align:right;padding-right:10px;">{{info.treat_cost_self_total}}</td>
-          <td colspan="2" style="text-align:right;padding-right:10px;">{{info.treat_cost_part_self_total}}</td>
-          <td>放射费</td>
-          <td colspan="2" style="text-align:right;padding-right:10px;">0</td>
-          <td style="text-align:right;padding-right:10px;">0</td>
-          <td colspan="2" style="text-align:right;padding-right:10px;">0</td>
-        </tr>
-        <tr>
-          <td>手术费</td>
-          <td colspan="2" style="text-align:right;padding-right:10px;">{{info.operation_cost_total}}</td>
-          <td style="text-align:right;padding-right:10px;">{{info.operation_cost_self_total}}</td>
-          <td colspan="2" style="text-align:right;padding-right:10px;">{{info.operation_cost_part_self_total}}</td>
-          <td>化验费</td>
-          <td colspan="2" style="text-align:right;padding-right:10px;">{{info.laboratory_cost_total}}</td>
-          <td style="text-align:right;padding-right:10px;">{{info.laboratory_cost_self_total}}</td>
-          <td colspan="2" style="text-align:right;padding-right:10px;">{{info.laboratory_cost_part_self_total}}</td>
-        </tr>
-        <tr>
-          <td>输血费</td>
-          <td colspan="2" style="text-align:right;padding-right:10px;">0</td>
-          <td style="text-align:right;padding-right:10px;">0</td>
-          <td colspan="2" style="text-align:right;padding-right:10px;">0</td>
-          <td>输氧费</td>
-          <td colspan="2" style="text-align:right;padding-right:10px;">0</td>
-          <td style="text-align:right;padding-right:10px;">0</td>
-          <td colspan="2" style="text-align:right;padding-right:10px;">0</td>
-        </tr>
-        <tr>
-          <td>其他</td>
-          <td colspan="2" style="text-align:right;padding-right:10px;">{{info.other_cost_total}}</td>
-          <td style="text-align:right;padding-right:10px;">{{info.other_cost_self_total}}</td>
-          <td colspan="2" style="text-align:right;padding-right:10px;">{{info.other_cost_part_self_total}}</td>
-          <td>麻醉费</td>
-          <td colspan="2" style="text-align:right;padding-right:10px;">0</td>
-          <td style="text-align:right;padding-right:10px;">0</td>
-          <td colspan="2" style="text-align:right;padding-right:10px;">0</td>
-        </tr>
-        <tr>
-          <td>材料费</td>
-          <td colspan="2" style="text-align:right;padding-right:10px;">{{info.material_cost_total}}</td>
-          <td style="text-align:right;padding-right:10px;">{{info.material_cost_self_total}}</td>
-          <td colspan="2" style="text-align:right;padding-right:10px;">{{info.material_cost_part_self_total}}</td>
-          <td>特殊检查费</td>
-          <td colspan="2" style="text-align:right;padding-right:10px;">0</td>
-          <td style="text-align:right;padding-right:10px;">0</td>
-          <td colspan="2" style="text-align:right;padding-right:10px;">0</td>
-        </tr>
-        <tr>
-          <td>特殊治疗费</td>
-          <td colspan="2" style="text-align:right;padding-right:10px;">0</td>
-          <td style="text-align:right;padding-right:10px;">0</td>
-          <td colspan="2" style="text-align:right;padding-right:10px;">0</td>
-          <td style="text-align:right;padding-right:10px;"></td>
-          <td colspan="2" style="text-align:right;padding-right:10px;"></td>
-          <td style="text-align:right;padding-right:10px;"></td>
-          <td colspan="2" style="text-align:right;padding-right:10px;"></td>
-        </tr>
-        <tr>
-          <td>合计</td>
-          <td colspan="2" style="text-align:right;padding-right:10px;">{{(parseFloat(info.bed_cost_total) +
-            parseFloat(info.operation_cost_total) + parseFloat(info.other_cost_total) +
-            parseFloat(info.material_cost_total) + parseFloat(info.western_medicine_cost_total) +
-            parseFloat(info.chinese_traditional_medicine_cost_total) + parseFloat(info.check_cost_total) +
-            parseFloat(info.laboratory_cost_total) + parseFloat(info.treat_cost_total)).toFixed(2) }}
-          </td>
-          <td style="text-align:right;padding-right:10px;">{{(parseFloat(info.bed_cost_self_total )+
-            parseFloat(info.operation_cost_self_total) + parseFloat(info.other_cost_self_total) +
-            parseFloat(info.material_cost_self_total) + parseFloat(info.western_medicine_cost_self_total) +
-            parseFloat(info.chinese_traditional_medicine_cost_self_total) + parseFloat(info.check_cost_self_total) +
-            parseFloat(info.laboratory_cost_self_total) + parseFloat(info.treat_cost_self_total)).toFixed(2)}}
-          </td>
-          <td colspan="2" style="text-align:right;padding-right:10px;">{{(parseFloat(info.bed_cost_part_self_total) +
-            parseFloat(info.operation_cost_part_self_total) + parseFloat(info.other_cost_part_self_total) +
-            parseFloat(info.material_cost_part_self_total) + parseFloat(info.western_medicine_cost_part_self_total) +
-            parseFloat(info.chinese_traditional_medicine_cost_part_self_total) +
-            parseFloat(info.check_cost_part_self_total) + parseFloat(info.laboratory_cost_part_self_total) +
-            parseFloat(info.treat_cost_part_self_total)).toFixed(2)}}
-          </td>
-          <td style="text-align:right;padding-right:10px;"></td>
-          <td colspan="2" style="text-align:right;padding-right:10px;"></td>
-          <td style="text-align:right;padding-right:10px;"></td>
-          <td colspan="2" style="text-align:right;padding-right:10px;"></td>
-        </tr>
-        <tr>
-          <td colspan="3" style="text-align:left;padding-left:10px;">基本医疗保险统筹基金支付</td>
-          <td colspan="3">{{info.hifp_pay}}</td>
-          <td colspan="3" style="text-align:left;padding-left:10px;">大额基金支付</td>
-          <td colspan="3">{{info.hifob_pay}}</td>
-        </tr>
-        <tr>
-          <td colspan="3" style="text-align:left;padding-left:10px;">大病基金支付</td>
-          <td colspan="3">{{info.hifmi_pay}}</td>
-          <td colspan="3" style="text-align:left;padding-left:10px;">补充保险基金支付</td>
-          <td colspan="3">{{info.hifes_pay}}</td>
-        </tr>
-        <tr>
-          <td colspan="3" style="text-align:left;padding-left:10px;">医疗救助基金支付</td>
-          <td colspan="3">{{info.maf_pay}}</td>
-          <td colspan="3" style="text-align:left;padding-left:10px;">公务员基金支付</td>
-          <td colspan="3">{{info.cvlserv_pay}}</td>
-        </tr>
-  
-        <tr>
-          <td colspan="3" style="text-align:left;padding-left:10px;">其他基金支付</td>
-          <td colspan="3">{{info.oth_pay}}</td>
-          <td colspan="3" style="text-align:left;padding-left:10px;">个人账户支付</td>
-          <td colspan="3">{{info.acct_pay}}</td>
-        </tr>
-        <tr>
-          <td>收款人:</td>
-          <td colspan="2">{{info.charge_admin.user_name}}</td>
-          <td>审核人:</td>
-          <td colspan="2">{{info.p_admin.user_name}}</td>
-          <td>制单人:</td>
-          <td colspan="2">{{info.p_admin.user_name}}</td>
-          <td>打印日期</td>
-          <td colspan="2">{{getNowTime()}}</td>
-        </tr>
-        <tr>
-          <td colspan="12" style="text-align:left;padding-left:10px;line-height:20px;">
-            注: 1、部分项目自付金额是指基本医疗保险范围内的项目需参保人先按规定比例自付的金额。<br/>
-            &ensp;&ensp;&ensp;2、此表由医院打印。<br/>
-            &ensp;&ensp;&ensp;3、此表一式两份，医院、参保人各一份。
-          </td>
-        </tr>
-        <tr>
-          <td colspan="12" style="text-align:left;padding-left:10px;">
-            病人家属签字:
-          </td>
-        </tr>
-      </table>
-    </div>
-    </div>
-  </template>
-  <script>
-  
-  export default {
-    name: 'hospitalBatchPrint',
-    props: {
-      infos:{
-        type: Array,
-        default: function() {
-          return []
-        }
-      },
-      info: {
-        type: Object,
-        default: function() {
-          return {}
-        }
-      }, p_admin: {
-        type: Object,
-        default: function() {
-          return {}
-        }
-      }, charge_admin: {
-        type: Object,
-        default: function() {
-          return {}
-        },
-      },his: {
-        type: Object,
-        default: function() {
-          return {}
-        },
-      },his_record: {
-        type: Object,
-        default: function() {
-          return {}
-        },
-      },patient:{
-        type: Object,
-        default: function() {
-          return {}
-        },
-  
+  <div id="statement-print" class="statement-print">
+    <div  v-for="(info,index) in infos">
+    <div class="statementTitle">广东省社会医疗保险医疗费用结算单</div>
+    <table class="statementTable" border="1">
+      <tr>
+        <td width="80">机构名称</td>
+        <td colspan="4">{{info.fixmedins_name}}</td>
+        <td width="80">机构编码</td>
+        <td colspan="4">{{info.fixmedins_code}}</td>
+        <td width="100">医保结算级别</td>
+        <td width="100" v-if="info.hosp_lv == '1'">三级特等</td>
+        <td width="100" v-if="info.hosp_lv == '2'">三级甲等</td>
+        <td width="100" v-if="info.hosp_lv == '3'">三级乙等</td>
+        <td width="100" v-if="info.hosp_lv == '4'">三级丙等</td>
+        <td width="100" v-if="info.hosp_lv == '5'">二级甲等</td>
+        <td width="100" v-if="info.hosp_lv == '6'">二级乙等</td>
+        <td width="100" v-if="info.hosp_lv == '7'">二级丙等</td>
+        <td width="100" v-if="info.hosp_lv == '8'">一级甲等</td>
+        <td width="100" v-if="info.hosp_lv == '9'">一级乙等</td>
+        <td width="100" v-if="info.hosp_lv == '10'">一级丙等</td>
+        <td width="100" v-if="info.hosp_lv == '11'">无等级</td>
+        <td width="100" v-else></td>
+
+      </tr>
+      <tr>
+        <td width="90">就医登记号</td>
+        <td colspan="11">{{info.mdtrt_id}}</td>
+      </tr>
+      <tr>
+        <td width="80">姓名</td>
+        <td width="80">{{info.psn_name}}</td>
+        <td width="80">性别</td>
+        <td width="50" v-if="info.gend == '1'">男</td>
+        <td width="50" v-if="info.gend == '2'">女</td>
+
+        <td width="80">出生日期</td>
+        <td width="100">{{info.brdy}}</td>
+        <td width="90">个人电脑号</td>
+        <td width="110">{{info.psn_no}}</td>
+        <td width="80">人员类别</td>
+        <td colspan="3" v-if="info.psn_type == '11'">在职</td>
+        <td colspan="3" v-if="info.psn_type == '1101'">职工在职</td>
+        <td colspan="3" v-if="info.psn_type == '1102'">公务员在职</td>
+        <td colspan="3" v-if="info.psn_type == '1103'">灵活就业人员在职</td>
+        <td colspan="3" v-if="info.psn_type == '1160'">地方其他扩展人员</td>
+
+
+        <td colspan="3" v-if="info.psn_type == '12'">退休人员</td>
+        <td colspan="3" v-if="info.psn_type == '1201'">职工退休</td>
+        <td colspan="3" v-if="info.psn_type == '1202'">公务员退休</td>
+        <td colspan="3" v-if="info.psn_type == '1203'">灵活就业人员退休</td>
+        <td colspan="3" v-if="info.psn_type == '1260'">地方其他扩展人员</td>
+
+
+        <td colspan="3" v-if="info.psn_type == '13'">离休</td>
+        <td colspan="3" v-if="info.psn_type == '1300'">离休人员</td>
+        <td colspan="3" v-if="info.psn_type == '1360'">地方其他扩展人员</td>
+
+        <td colspan="3" v-if="info.psn_type == '14'">居民(未成年)</td>
+        <td colspan="3" v-if="info.psn_type == '1401'">新生儿</td>
+        <td colspan="3" v-if="info.psn_type == '1402'">学龄前儿童</td>
+        <td colspan="3" v-if="info.psn_type == '1403'">中小学生</td>
+        <td colspan="3" v-if="info.psn_type == '1404'">大学生</td>
+        <td colspan="3" v-if="info.psn_type == '1405'">未成年(未入学)</td>
+
+
+        <td colspan="3" v-if="info.psn_type == '15'">居民(成年)</td>
+        <td colspan="3" v-if="info.psn_type == '1501'">普通居民(成年)</td>
+        <td colspan="3" v-if="info.psn_type == '1560'">地方其他扩展身份</td>
+
+        <td colspan="3" v-if="info.psn_type == '16'">居民(老年)</td>
+
+
+
+      </tr>
+      <tr>
+        <td>单位名称</td>
+        <td colspan="5">{{info.emp_name}}</td>
+        <td width="80">联系电话</td>
+        <td width="110">{{info.patient.phone}}</td>
+        <td width="80">身份证号</td>
+        <td colspan="3">{{info.certno}}</td>
+      </tr>
+      <tr>
+        <td>住院号</td>
+        <td>{{info.number}}</td>
+        <td>科别</td>
+        <td width="100"></td>
+        <td>床号</td>
+        <td></td>
+        <td>入院日期</td>
+        <td>{{info.begndate}}</td>
+        <td>出院日期</td>
+        <td width="100">{{info.enddate}}</td>
+        <td>住院天数</td>
+        <td>{{getDay(info.begndate,info.enddate)}}</td>
+
+      </tr>
+      <tr>
+        <td>险种</td>
+        <td colspan="2" v-if="info.insutype == '310'">职工基本医疗保险</td>
+        <td colspan="2" v-if="info.insutype == '320'">公务员医疗补助</td>
+        <td colspan="2" v-if="info.insutype == '330'">大额医疗费用补助</td>
+        <td colspan="2" v-if="info.insutype == '340'">离休人员医疗保障</td>
+        <td colspan="2" v-if="info.insutype == '390'">城乡居民基本医疗保险</td>
+        <td colspan="2" v-if="info.insutype == '392'">城乡居民大病医疗保险</td>
+        <td colspan="2" v-if="info.insutype == '510'">生育保险</td>
+        <td>入院第一诊断</td>
+        <td colspan="3">{{info.diagnosis}}</td>
+        <td>出院第一诊断</td>
+        <td colspan="4">{{info.diagnosis}}</td>
+
+
+      </tr>
+      <tr>
+        <td>业务类别</td>
+        <td colspan="5" style="text-align:left;padding-left:10px;" v-if="info.med_type == '11'">普通门诊</td>
+        <td colspan="5" style="text-align:left;padding-left:10px;" v-if="info.med_type == '12'">门诊挂号</td>
+        <td colspan="5" style="text-align:left;padding-left:10px;" v-if="info.med_type == '13'">急诊</td>
+        <td colspan="5" style="text-align:left;padding-left:10px;" v-if="info.med_type == '14'">门诊慢性病</td>
+        <td colspan="5" style="text-align:left;padding-left:10px;" v-if="info.med_type == '15'">门诊统筹</td>
+        <!--        <td colspan="5" style="text-align:left;padding-left:10px;" v-if="info.med_type == '16'">门诊慢性病</td>-->
+        <td colspan="5" style="text-align:left;padding-left:10px;" v-if="info.med_type == '21'">普通住院</td>
+
+        <td>结算时间</td>
+        <td colspan="5" style="text-align:left;padding-left:10px;">{{info.setl_time.split(' ')[0]}}</td>
+      </tr>
+      <tr>
+        <td colspan="12" style="text-align:left;padding-left:10px;">
+          本次就医：总费用{{info.medfee_sumamt}}元，基金支付{{info.fund_pay_sumamt}}元，个人支付{{info.psn_pay}}元。
+          (起付线 {{info.act_pay_dedc}}元, 先自付 {{info.preselfpay_amt}}元, 段内自付 {{(info.psn_pay - info.preselfpay_amt).toFixed(2)}} )
+
+        </td>
+      </tr>
+      <tr>
+        <td>费用名称</td>
+        <td colspan="2">总费用</td>
+        <td>自费</td>
+        <td colspan="2">部分项目自付</td>
+        <td>费用名称</td>
+        <td colspan="2">总费用</td>
+        <td>自费</td>
+        <td colspan="2">部分项目自付</td>
+      </tr>
+      <tr>
+        <td>床位费</td>
+        <td colspan="2" style="text-align:right;padding-right:10px;">{{info.bed_cost_total}}</td>
+        <td style="text-align:right;padding-right:10px;">{{info.bed_cost_self_total}}</td>
+        <td colspan="2" style="text-align:right;padding-right:10px;">{{info.bed_cost_part_self_total}}</td>
+        <td>西成药</td>
+        <td colspan="2" style="text-align:right;padding-right:10px;">{{info.western_medicine_cost_total}}</td>
+        <td style="text-align:right;padding-right:10px;">{{info.western_medicine_cost_self_total}}</td>
+        <td colspan="2" style="text-align:right;padding-right:10px;">{{info.western_medicine_cost_part_self_total}}</td>
+      </tr>
+      <tr>
+        <td>中药费</td>
+        <td colspan="2" style="text-align:right;padding-right:10px;">0</td>
+        <td style="text-align:right;padding-right:10px;">0</td>
+        <td colspan="2" style="text-align:right;padding-right:10px;">0</td>
+        <td>中成药</td>
+        <td colspan="2" style="text-align:right;padding-right:10px;">{{info.chinese_traditional_medicine_cost_total}}
+        </td>
+        <td style="text-align:right;padding-right:10px;">{{info.chinese_traditional_medicine_cost_self_total}}</td>
+        <td colspan="2" style="text-align:right;padding-right:10px;">
+          {{info.chinese_traditional_medicine_cost_part_self_total}}
+        </td>
+      </tr>
+      <tr>
+        <td>中草药</td>
+        <td colspan="2" style="text-align:right;padding-right:10px;">0</td>
+        <td style="text-align:right;padding-right:10px;">0</td>
+        <td colspan="2" style="text-align:right;padding-right:10px;">0</td>
+        <td>检查费</td>
+        <td colspan="2" style="text-align:right;padding-right:10px;">{{info.check_cost_total}}</td>
+        <td style="text-align:right;padding-right:10px;">{{info.check_cost_self_total}}</td>
+        <td colspan="2" style="text-align:right;padding-right:10px;">{{info.check_cost_part_self_total}}</td>
+      </tr>
+      <tr>
+        <td>治疗费</td>
+        <td colspan="2" style="text-align:right;padding-right:10px;">{{info.treat_cost_total}}</td>
+        <td style="text-align:right;padding-right:10px;">{{info.treat_cost_self_total}}</td>
+        <td colspan="2" style="text-align:right;padding-right:10px;">{{info.treat_cost_part_self_total}}</td>
+        <td>放射费</td>
+        <td colspan="2" style="text-align:right;padding-right:10px;">0</td>
+        <td style="text-align:right;padding-right:10px;">0</td>
+        <td colspan="2" style="text-align:right;padding-right:10px;">0</td>
+      </tr>
+      <tr>
+        <td>手术费</td>
+        <td colspan="2" style="text-align:right;padding-right:10px;">{{info.operation_cost_total}}</td>
+        <td style="text-align:right;padding-right:10px;">{{info.operation_cost_self_total}}</td>
+        <td colspan="2" style="text-align:right;padding-right:10px;">{{info.operation_cost_part_self_total}}</td>
+        <td>化验费</td>
+        <td colspan="2" style="text-align:right;padding-right:10px;">{{info.laboratory_cost_total}}</td>
+        <td style="text-align:right;padding-right:10px;">{{info.laboratory_cost_self_total}}</td>
+        <td colspan="2" style="text-align:right;padding-right:10px;">{{info.laboratory_cost_part_self_total}}</td>
+      </tr>
+      <tr>
+        <td>输血费</td>
+        <td colspan="2" style="text-align:right;padding-right:10px;">0</td>
+        <td style="text-align:right;padding-right:10px;">0</td>
+        <td colspan="2" style="text-align:right;padding-right:10px;">0</td>
+        <td>输氧费</td>
+        <td colspan="2" style="text-align:right;padding-right:10px;">0</td>
+        <td style="text-align:right;padding-right:10px;">0</td>
+        <td colspan="2" style="text-align:right;padding-right:10px;">0</td>
+      </tr>
+      <tr>
+        <td>其他</td>
+        <td colspan="2" style="text-align:right;padding-right:10px;">{{info.other_cost_total}}</td>
+        <td style="text-align:right;padding-right:10px;">{{info.other_cost_self_total}}</td>
+        <td colspan="2" style="text-align:right;padding-right:10px;">{{info.other_cost_part_self_total}}</td>
+        <td>麻醉费</td>
+        <td colspan="2" style="text-align:right;padding-right:10px;">0</td>
+        <td style="text-align:right;padding-right:10px;">0</td>
+        <td colspan="2" style="text-align:right;padding-right:10px;">0</td>
+      </tr>
+      <tr>
+        <td>材料费</td>
+        <td colspan="2" style="text-align:right;padding-right:10px;">{{info.material_cost_total}}</td>
+        <td style="text-align:right;padding-right:10px;">{{info.material_cost_self_total}}</td>
+        <td colspan="2" style="text-align:right;padding-right:10px;">{{info.material_cost_part_self_total}}</td>
+        <td>特殊检查费</td>
+        <td colspan="2" style="text-align:right;padding-right:10px;">0</td>
+        <td style="text-align:right;padding-right:10px;">0</td>
+        <td colspan="2" style="text-align:right;padding-right:10px;">0</td>
+      </tr>
+      <tr>
+        <td>特殊治疗费</td>
+        <td colspan="2" style="text-align:right;padding-right:10px;">0</td>
+        <td style="text-align:right;padding-right:10px;">0</td>
+        <td colspan="2" style="text-align:right;padding-right:10px;">0</td>
+        <td style="text-align:right;padding-right:10px;"></td>
+        <td colspan="2" style="text-align:right;padding-right:10px;"></td>
+        <td style="text-align:right;padding-right:10px;"></td>
+        <td colspan="2" style="text-align:right;padding-right:10px;"></td>
+      </tr>
+      <tr>
+        <td>合计</td>
+        <td colspan="2" style="text-align:right;padding-right:10px;">{{(parseFloat(info.bed_cost_total) +
+          parseFloat(info.operation_cost_total) + parseFloat(info.other_cost_total) +
+          parseFloat(info.material_cost_total) + parseFloat(info.western_medicine_cost_total) +
+          parseFloat(info.chinese_traditional_medicine_cost_total) + parseFloat(info.check_cost_total) +
+          parseFloat(info.laboratory_cost_total) + parseFloat(info.treat_cost_total)).toFixed(2) }}
+        </td>
+        <td style="text-align:right;padding-right:10px;">{{(parseFloat(info.bed_cost_self_total )+
+          parseFloat(info.operation_cost_self_total) + parseFloat(info.other_cost_self_total) +
+          parseFloat(info.material_cost_self_total) + parseFloat(info.western_medicine_cost_self_total) +
+          parseFloat(info.chinese_traditional_medicine_cost_self_total) + parseFloat(info.check_cost_self_total) +
+          parseFloat(info.laboratory_cost_self_total) + parseFloat(info.treat_cost_self_total)).toFixed(2)}}
+        </td>
+        <td colspan="2" style="text-align:right;padding-right:10px;">{{(parseFloat(info.bed_cost_part_self_total) +
+          parseFloat(info.operation_cost_part_self_total) + parseFloat(info.other_cost_part_self_total) +
+          parseFloat(info.material_cost_part_self_total) + parseFloat(info.western_medicine_cost_part_self_total) +
+          parseFloat(info.chinese_traditional_medicine_cost_part_self_total) +
+          parseFloat(info.check_cost_part_self_total) + parseFloat(info.laboratory_cost_part_self_total) +
+          parseFloat(info.treat_cost_part_self_total)).toFixed(2)}}
+        </td>
+        <td style="text-align:right;padding-right:10px;"></td>
+        <td colspan="2" style="text-align:right;padding-right:10px;"></td>
+        <td style="text-align:right;padding-right:10px;"></td>
+        <td colspan="2" style="text-align:right;padding-right:10px;"></td>
+      </tr>
+      <tr>
+        <td colspan="3" style="text-align:left;padding-left:10px;">基本医疗保险统筹基金支付</td>
+        <td colspan="3">{{info.hifp_pay}}</td>
+        <td colspan="3" style="text-align:left;padding-left:10px;">大额基金支付</td>
+        <td colspan="3">{{info.hifob_pay}}</td>
+      </tr>
+      <tr>
+        <td colspan="3" style="text-align:left;padding-left:10px;">大病基金支付</td>
+        <td colspan="3">{{info.hifmi_pay}}</td>
+        <td colspan="3" style="text-align:left;padding-left:10px;">补充保险基金支付</td>
+        <td colspan="3">{{info.hifes_pay}}</td>
+      </tr>
+      <tr>
+        <td colspan="3" style="text-align:left;padding-left:10px;">医疗救助基金支付</td>
+        <td colspan="3">{{info.maf_pay}}</td>
+        <td colspan="3" style="text-align:left;padding-left:10px;">公务员基金支付</td>
+        <td colspan="3">{{info.cvlserv_pay}}</td>
+      </tr>
+
+      <tr>
+        <td colspan="3" style="text-align:left;padding-left:10px;">其他基金支付</td>
+        <td colspan="3">{{info.oth_pay}}</td>
+        <td colspan="3" style="text-align:left;padding-left:10px;">个人账户支付</td>
+        <td colspan="3">{{info.acct_pay}}</td>
+      </tr>
+      <tr>
+        <td>收款人:</td>
+        <td colspan="2">{{info.charge_admin.user_name}}</td>
+        <td>审核人:</td>
+        <td colspan="2">{{info.p_admin.user_name}}</td>
+        <td>制单人:</td>
+        <td colspan="2">{{info.p_admin.user_name}}</td>
+        <td>打印日期</td>
+        <td colspan="2">{{getNowTime()}}</td>
+      </tr>
+      <tr>
+        <td colspan="12" style="text-align:left;padding-left:10px;line-height:20px;">
+          注: 1、部分项目自付金额是指基本医疗保险范围内的项目需参保人先按规定比例自付的金额。<br/>
+          &ensp;&ensp;&ensp;2、此表由医院打印。<br/>
+          &ensp;&ensp;&ensp;3、此表一式两份，医院、参保人各一份。
+        </td>
+      </tr>
+      <tr>
+        <td colspan="12" style="text-align:left;padding-left:10px;">
+          病人家属签字:
+        </td>
+      </tr>
+    </table>
+  </div>
+  </div>
+</template>
+<script>
+
+export default {
+  name: 'hospitalBatchPrint',
+  props: {
+    infos:{
+      type: Array,
+      default: function() {
+        return []
+      }
+    },
+    info: {
+      type: Object,
+      default: function() {
+        return {}
+      }
+    }, p_admin: {
+      type: Object,
+      default: function() {
+        return {}
       }
-    },methods:{
-      getDay(dateString1,dateString2){
-        var  startDate = Date.parse(dateString1);
-        var  endDate = Date.parse(dateString2);
-        if (startDate>endDate){
-          return 0;
-        }
-        if (startDate==endDate){
-          return 1;
-        }
-        var days=(endDate - startDate)/(1*24*60*60*1000);
-        return  days+1;
-  
+    }, charge_admin: {
+      type: Object,
+      default: function() {
+        return {}
+      },
+    },his: {
+      type: Object,
+      default: function() {
+        return {}
+      },
+    },his_record: {
+      type: Object,
+      default: function() {
+        return {}
       },
-      getNowTime: function () {
-        let dateTime;
-        let yy = new Date().getFullYear();
-        let mm = new Date().getMonth() + 1;
-        let dd = new Date().getDate();
-        // let hh = new Date().getHours();
-        // let mf = new Date().getMinutes() < 10 ? '0' + new Date().getMinutes()
-        //   :
-        //   new Date().getMinutes();
-        // let ss = new Date().getSeconds() < 10 ? '0' + new Date().getSeconds()
-        //   :
-        //   new Date().getSeconds();
-        dateTime = yy + '-' + mm + '-' + dd
-        return dateTime
+    },patient:{
+      type: Object,
+      default: function() {
+        return {}
       },
-  
+
     }
+  },methods:{
+    getDay(dateString1,dateString2){
+      var  startDate = Date.parse(dateString1);
+      var  endDate = Date.parse(dateString2);
+      if (startDate>endDate){
+        return 0;
+      }
+      if (startDate==endDate){
+        return 1;
+      }
+      var days=(endDate - startDate)/(1*24*60*60*1000);
+      return  days+1;
+
+    },
+    getNowTime: function () {
+      let dateTime;
+      let yy = new Date().getFullYear();
+      let mm = new Date().getMonth() + 1;
+      let dd = new Date().getDate();
+      // let hh = new Date().getHours();
+      // let mf = new Date().getMinutes() < 10 ? '0' + new Date().getMinutes()
+      //   :
+      //   new Date().getMinutes();
+      // let ss = new Date().getSeconds() < 10 ? '0' + new Date().getSeconds()
+      //   :
+      //   new Date().getSeconds();
+      dateTime = yy + '-' + mm + '-' + dd
+      return dateTime
+    },
+
   }
-  
-  
-  </script>
-  
-  
-  <style lang="scss" scoped>
-  .statement-print {
-    -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.27), 0 0 60px rgba(0, 0, 0, 0.06) inset;
-    -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.27), 0 0 40px rgba(0, 0, 0, 0.06) inset;
-    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.27), 0 0 40px rgba(0, 0, 0, 0.06) inset;
-    margin-bottom: 20px;
-    padding: 20px 10px;
-  }
-  
-  .statementTitle {
-    font-size: 28px;
-    text-align: center;
-    font-weight: bold;
-    margin-bottom: 10px;
-  }
-  
-  .statementTable {
-    width: 100%;
-    text-align: center;
-    border-collapse: collapse;
-    line-height: 40px;
-    font-size: 14px;
-    border-color: #000;
-  }
-  </style>
-  
+}
+
+
+</script>
+
+
+<style lang="scss" scoped>
+.statement-print {
+  -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.27), 0 0 60px rgba(0, 0, 0, 0.06) inset;
+  -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.27), 0 0 40px rgba(0, 0, 0, 0.06) inset;
+  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.27), 0 0 40px rgba(0, 0, 0, 0.06) inset;
+  margin-bottom: 20px;
+  padding: 20px 10px;
+}
+
+.statementTitle {
+  font-size: 28px;
+  text-align: center;
+  font-weight: bold;
+  margin-bottom: 10px;
+}
+
+.statementTable {
+  width: 100%;
+  text-align: center;
+  border-collapse: collapse;
+  line-height: 40px;
+  font-size: 14px;
+  border-color: #000;
+}
+</style>

src/xt_pages/hospitalStation/components/chargeDialog.vue

@@ -317,13 +317,13 @@
             this.form.pay_price = this.tmp_pay
             return
           }
-          if (parseFloat(this.form.tmp_decimal) > parseFloat(this.form.private_price)) {
-            // alert("押金不得大于自费金额")
-            this.$message.error("押金不得大于自费金额");
-            this.form.tmp_decimal = ""
-            this.form.pay_price = this.tmp_pay
-            return
-          }
+          // if (parseFloat(this.form.tmp_decimal) > parseFloat(this.form.private_price)) {
+          //   // alert("押金不得大于自费金额")
+          //   this.$message.error("押金不得大于自费金额");
+          //   this.form.tmp_decimal = ""
+          //   this.form.pay_price = this.tmp_pay
+          //   return
+          // }
           // this.form.private_price = parseFloat(this.form.tmp_decimal) + parseFloat(this.form.pay_price)
 
           this.form.pay_price = ((parseFloat(this.form.private_price) * 10000 - parseFloat(this.form.tmp_decimal) * 10000) / 10000).toFixed(2)
@@ -340,12 +340,12 @@
           } else {
             //储存临时付款
             this.tmp_pay = this.form.pay_price
-            if (parseFloat(this.form.tmp_decimal) > parseFloat(this.form.private_price)) {
-              this.form.tmp_decimal = 0
-              // alert("押金不得大于自费金额")
-              this.$message.error("押金不得大于自费金额");
-              return
-            }
+            // if (parseFloat(this.form.tmp_decimal) > parseFloat(this.form.private_price)) {
+            //   this.form.tmp_decimal = 0
+            //   // alert("押金不得大于自费金额")
+            //   this.$message.error("押金不得大于自费金额");
+            //   return
+            // }
             // this.form.private_price = parseFloat(this.form.tmp_decimal) + parseFloat(this.form.pay_price)
             this.tmp_pay = this.form.pay_price
             this.form.pay_price = ((parseFloat(this.form.private_price) * 10000 - parseFloat(this.form.tmp_decimal) * 10000) / 10000).toFixed(2)

src/xt_pages/hospitalStation/components/deskPrescription.vue

@@ -2442,7 +2442,7 @@ export default {
                     if(arr.length > 0){
                       let objInfo = {};
                       arr.forEach((item, index) => {
-                    
+
                       let { id } = item.id;
                       if (!objInfo[id]) {
                           objInfo[id] = {
@@ -2505,7 +2505,7 @@ export default {
                      if(arr_one.length > 0){
                       let objInfo = {};
                       arr_one.forEach((item, index) => {
-                     
+
                       let { id } = item.id;
                       if (!objInfo[id]) {
                           objInfo[id] = {
@@ -3158,14 +3158,14 @@ export default {
       }
 
       if (this.curStatus == 1 && this.rightTab == 2) {
-        this.$message.error('改处方是药品，无法添加项目')
+        this.$message.error('该处方是药品，无法添加项目')
         this.teamList = []
         this.$refs.tables.clearSelection()
         return
       }
 
       if (this.curStatus == 2 && this.rightTab == 1) {
-        this.$message.error('改处方是项目，无法添加药品')
+        this.$message.error('该处方是项目，无法添加药品')
         this.curDrugs = []
         this.tempDrugs = []
         this.$refs.multipleTable.clearSelection()
@@ -3295,10 +3295,10 @@ export default {
             for (let b = 0; b < temp2.length; b++) {
               let obj = {
                 id: 0,
+                single_dose: temp2[b].single_dose.toString(),
                 project_id: temp2[b].id,
                 project_name: temp2[b].project_name,
                 statistical_classification: '',
-                single_dose: temp2[b].single_dose.toString(),
                 delivery_way: temp2[b].delivery_way,
                 execution_frequency: temp2[b].execution_frequency,
                 number_days: temp2[b].number_days.toString(),
@@ -3313,6 +3313,7 @@ export default {
                 obj['project'] = temp2[b].project
                 obj['unit'] = temp2[b].project.unit
 
+
               } else if (temp2[b].type == 3) {
                 obj['good_info'] = temp2[b].good_info
                 obj['unit'] = temp2[b].good_info.packing_unit
@@ -3451,7 +3452,7 @@ export default {
               cus_total: 1,
               price: good_info[i].packing_price,
               medical_code: good_info[i].medical_insurance_number,
-              unit: this.getGoodUnit(good_info[i].good_unit),
+              unit: good_info[i].packing_unit,
               type: 3,
               total: good_info[i].total,
               is_special_diseases: good_info[i].is_special_diseases,
@@ -3586,7 +3587,7 @@ export default {
                   id: project[i].project_id,
                   project_name: project[i].good_info.good_name,
                   statistical_classification: '',
-                  single_dose: '',
+                  single_dose: project[i].good_info.default_count,
                   delivery_way: '',
                   execution_frequency: '',
                   number_days: '',
@@ -3594,7 +3595,7 @@ export default {
                   price: project[i].good_info.retail_price,
                   remark: '',
                   medical_code: project[i].good_info.medical_insurance_number,
-                  unit: project[i].good_info.unit,
+                  unit: project[i].good_info.packing_unit,
                   type: project[i].type,
                   is_special_diseases: project[i].good_info.is_special_diseases,
                   team_id: team_id,

src/xt_pages/hospitalStation/components/inquiriesDetail.vue

@@ -10,6 +10,10 @@
     <div style="position: absolute;right:20px;z-index:99">
       <el-button v-if="activeName == 'first'" @click="open(1)" type="primary">打印</el-button>
       <el-button v-if="activeName == 'second'" @click="open(2)" type="primary">打印</el-button>
+
+      <el-button @click="open(3)" type="primary">打印清单</el-button>
+      <el-button @click="open(4)" type="primary">打印汇总</el-button>
+
     </div>
     <el-tabs v-model="activeName">
 
@@ -113,6 +117,25 @@
       <print v-if="activeName == 'first'" :paramsObj='paramsObj' :showBtn='true'></print>
       <recordPrint v-if="activeName == 'second'" :patientid="patientid" :showBtn='true'></recordPrint>
     </el-dialog>
+
+    <div >
+      <el-dialog
+        class="centerDialog"
+        width="900px"
+        title="打印"
+        :visible.sync="listVisible"  append-to-body>
+        <hospital-list-print :paramsObj='paramsObjTwo'></hospital-list-print>
+      </el-dialog>
+    </div>
+    <div >
+      <el-dialog
+        class="centerDialog"
+        width="900px"
+        title="打印"
+        :visible.sync="allListVisible"  append-to-body>
+        <hospital-all-list-print :paramsObj='paramsObjTwo'></hospital-all-list-print>
+      </el-dialog>
+    </div>
   </el-dialog>
 </div>
 </template>
@@ -120,7 +143,6 @@
 
 
 <script>
-  import { getDictionaryDataConfig} from "@/utils/data";
   import { getHisPrescriptionInfo } from '@/api/his/his'
   import NewPrescriptionTable from './newPrescriptionTable'
   import { uParseTime } from '@/utils/tools'
@@ -128,14 +150,19 @@
   import moment from 'moment';
   import print from '../print'
   import recordPrint from '../recordPrint'
+  import HospitalListPrint from '../pastQuiriesPrint/hospitalListPrint.vue'
+  import HospitalAllListPrint from '../pastQuiriesPrint/hospitalAllListPrint.vue'
 
   export default {
-    components: { NewPrescriptionTable,print,recordPrint },
+    components: { HospitalAllListPrint, HospitalListPrint, NewPrescriptionTable,print,recordPrint },
     data() {
       return {
+        listVisible:false,
+        allListVisible:false,
         visible: false,
         activeName: 'first',
         curPrescriptions: {},
+        paramsObjTwo:{},
         prescriptions: [],
         record_date: '',
         editableTabsValue: '处方1',
@@ -188,11 +215,26 @@
            this.innerVisible = true
           //  this.$router.push("/outpatientDoctorStation/print?record="+record_date+"&prescription_id="+prescription_id+"&ids="+ids+"&patient_id="+this.patientInfo.id)
 
-        }else if(index == 2){
+        } else if(index == 2){
           var record_date = this.format(this.case_history.sick_date);
           this.patientid = this.patientInfo.id;
           this.innerVisible = true
           // this.$router.push("/outpatientDoctorStation/recordPrint?record="+record_date+"&patient_id="+this.case_history.patient_id)
+        }else if(index == 3){
+          // var record_date = this.format(this.order.record_date);
+          this.patientid = this.patientInfo.id;
+          this.paramsObjTwo = {
+            record_date:this.order.record_date,
+            patient_id:this.patientid
+          }
+          this.listVisible = true
+        }else if(index == 4){
+          this.patientid = this.patientInfo.id;
+          this.paramsObjTwo = {
+            record_date:this.order.record_date,
+            patient_id:this.patientid
+          }
+          this.allListVisible = true
         }
       },
       getTimes(time,temp) {

src/xt_pages/hospitalStation/components/registerDialog9504.vue

@@ -104,6 +104,28 @@
             </el-form-item>
 
 
+          <el-form-item label="参保地：" prop="id_card_type">
+            <el-autocomplete
+              popper-class="my-autocomplete"
+              v-model="form.insuplc_admdvs"
+              :fetch-suggestions="querySearch"
+              placeholder="请输入内容"
+              @select="handleSelectTwo">
+              <i
+                class="el-icon-edit el-input__icon"
+                slot="suffix"
+                @click="handleIconClick">
+              </i>
+              <template slot-scope="{ item }">
+                <div class="name">{{ item.value }}</div>
+                <span class="addr">{{ item.address }}</span>
+              </template>
+            </el-autocomplete>
+          </el-form-item>
+
+
+
+
             <el-form-item label="读卡类型：" prop="id_card_type">
                 <el-select v-model="form.id_card_type" placeholder="请选择">
                     <el-option
@@ -212,6 +234,7 @@
           id: '',
           settlement_value: '',
           medical_insurance_card: '',
+          insuplc_admdvs:'',
           name: '',
           gender: '',
           certificates: '',
@@ -238,6 +261,384 @@
           value: 2,
           label: '身份证'
         }],
+        area:[
+          {id:110000,name:"北京市"},
+          {id:120000,name:"天津市"},
+          {id:130000,name:"河北省"},
+          {id:130100,name:"石家庄市"},
+          {id:130200,name:"唐山市"},
+          {id:130300,name:"秦皇岛市"},
+          {id:130400,name:"邯郸市"},
+          {id:130500,name:"邢台市"},
+          {id:130600,name:"保定市"},
+          {id:130700,name:"张家口市"},
+          {id:130800,name:"承德市"},
+          {id:130900,name:"沧州市"},
+          {id:131000,name:"廊坊市"},
+          {id:131100,name:"衡水市"},
+          {id:140000,name:"山西省"},
+          {id:140100,name:"太原市"},
+          {id:140200,name:"大同市"},
+          {id:140300,name:"阳泉市"},
+          {id:140400,name:"长治市"},
+          {id:140500,name:"晋城市"},
+          {id:140600,name:"朔州市"},
+          {id:140700,name:"晋中市"},
+          {id:140800,name:"运城市"},
+          {id:140900,name:"忻州市"},
+          {id:141000,name:"临汾市"},
+          {id:141100,name:"吕梁市"},
+          {id:150000,name:"内蒙古自治区"},
+          {id:150100,name:"呼和浩特市"},
+          {id:150200,name:"包头市"},
+          {id:150300,name:"乌海市"},
+          {id:150400,name:"赤峰市"},
+          {id:150500,name:"通辽市"},
+          {id:150600,name:"鄂尔多斯市"},
+          {id:150700,name:"呼伦贝尔市"},
+          {id:150800,name:"巴彦淖尔市"},
+          {id:150900,name:"乌兰察布市"},
+          {id:152200,name:"兴安盟"},
+          {id:152500,name:"锡林郭勒盟"},
+          {id:152900,name:"阿拉善盟"},
+          {id:210000,name:"辽宁省"},
+          {id:210100,name:"沈阳市"},
+          {id:210200,name:"大连市"},
+          {id:210300,name:"鞍山市"},
+          {id:210400,name:"抚顺市"},
+          {id:210500,name:"本溪市"},
+          {id:210600,name:"丹东市"},
+          {id:210700,name:"锦州市"},
+          {id:210800,name:"营口市"},
+          {id:210900,name:"阜新市"},
+          {id:211000,name:"辽阳市"},
+          {id:211100,name:"盘锦市"},
+          {id:211200,name:"铁岭市"},
+          {id:211300,name:"朝阳市"},
+          {id:211400,name:"葫芦岛市"},
+          {id:220000,name:"吉林省"},
+          {id:220100,name:"长春市"},
+          {id:220200,name:"吉林市"},
+          {id:220300,name:"四平市"},
+          {id:220400,name:"辽源市"},
+          {id:220500,name:"通化市"},
+          {id:220600,name:"白山市"},
+          {id:220700,name:"松原市"},
+          {id:220800,name:"白城市"},
+          {id:222400,name:"延边朝鲜族自治州"},
+          {id:230000,name:"黑龙江省"},
+          {id:230100,name:"哈尔滨市"},
+          {id:230200,name:"齐齐哈尔市"},
+          {id:230300,name:"鸡西市"},
+          {id:230400,name:"鹤岗市"},
+          {id:230500,name:"双鸭山市"},
+          {id:230600,name:"大庆市"},
+          {id:230700,name:"伊春市"},
+          {id:230800,name:"佳木斯市"},
+          {id:230900,name:"七台河市"},
+          {id:231000,name:"牡丹江市"},
+          {id:231100,name:"黑河市"},
+          {id:231200,name:"绥化市"},
+          {id:232700,name:"大兴安岭地区"},
+          {id:310000,name:"上海市"},
+          {id:320000,name:"江苏省"},
+          {id:320100,name:"南京市"},
+          {id:320200,name:"无锡市"},
+          {id:320300,name:"徐州市"},
+          {id:320400,name:"常州市"},
+          {id:320500,name:"苏州市"},
+          {id:320600,name:"南通市"},
+          {id:320700,name:"连云港市"},
+          {id:320800,name:"淮安市"},
+          {id:320900,name:"盐城市"},
+          {id:321000,name:"扬州市"},
+          {id:321100,name:"镇江市"},
+          {id:321200,name:"泰州市"},
+          {id:321300,name:"宿迁市"},
+          {id:330000,name:"浙江省"},
+          {id:330100,name:"杭州市"},
+          {id:330200,name:"宁波市"},
+          {id:330300,name:"温州市"},
+          {id:330400,name:"嘉兴市"},
+          {id:330500,name:"湖州市"},
+          {id:330600,name:"绍兴市"},
+          {id:330700,name:"金华市"},
+          {id:330800,name:"衢州市"},
+          {id:330900,name:"舟山市"},
+          {id:331000,name:"台州市"},
+          {id:331100,name:"丽水市"},
+          {id:340000,name:"安徽省"},
+          {id:340100,name:"合肥市"},
+          {id:340200,name:"芜湖市"},
+          {id:340300,name:"蚌埠市"},
+          {id:340400,name:"淮南市"},
+          {id:340500,name:"马鞍山市"},
+          {id:340600,name:"淮北市"},
+          {id:340700,name:"铜陵市"},
+          {id:340800,name:"安庆市"},
+          {id:341000,name:"黄山市"},
+          {id:341100,name:"滁州市"},
+          {id:341200,name:"阜阳市"},
+          {id:341300,name:"宿州市"},
+          {id:341500,name:"六安市"},
+          {id:341600,name:"亳州市"},
+          {id:341700,name:"池州市"},
+          {id:341800,name:"宣城市"},
+          {id:350000,name:"福建省"},
+          {id:350100,name:"福州市"},
+          {id:350200,name:"厦门市"},
+          {id:350300,name:"莆田市"},
+          {id:350400,name:"三明市"},
+          {id:350500,name:"泉州市"},
+          {id:350600,name:"漳州市"},
+          {id:350700,name:"南平市"},
+          {id:350800,name:"龙岩市"},
+          {id:350900,name:"宁德市"},
+          {id:360000,name:"江西省"},
+          {id:360100,name:"南昌市"},
+          {id:360200,name:"景德镇市"},
+          {id:360300,name:"萍乡市"},
+          {id:360400,name:"九江市"},
+          {id:360500,name:"新余市"},
+          {id:360600,name:"鹰潭市"},
+          {id:360700,name:"赣州市"},
+          {id:360800,name:"吉安市"},
+          {id:360900,name:"宜春市"},
+          {id:361000,name:"抚州市"},
+          {id:361100,name:"上饶市"},
+          {id:370000,name:"山东省"},
+          {id:370100,name:"济南市"},
+          {id:370200,name:"青岛市"},
+          {id:370300,name:"淄博市"},
+          {id:370400,name:"枣庄市"},
+          {id:370500,name:"东营市"},
+          {id:370600,name:"烟台市"},
+          {id:370700,name:"潍坊市"},
+          {id:370800,name:"济宁市"},
+          {id:370900,name:"泰安市"},
+          {id:371000,name:"威海市"},
+          {id:371100,name:"日照市"},
+          {id:371300,name:"临沂市"},
+          {id:371400,name:"德州市"},
+          {id:371500,name:"聊城市"},
+          {id:371600,name:"滨州市"},
+          {id:371700,name:"菏泽市"},
+          {id:410000,name:"河南省"},
+          {id:410100,name:"郑州市"},
+          {id:410200,name:"开封市"},
+          {id:410300,name:"洛阳市"},
+          {id:410400,name:"平顶山市"},
+          {id:410500,name:"安阳市"},
+          {id:410600,name:"鹤壁市"},
+          {id:410700,name:"新乡市"},
+          {id:410800,name:"焦作市"},
+          {id:410900,name:"濮阳市"},
+          {id:411000,name:"许昌市"},
+          {id:411100,name:"漯河市"},
+          {id:411200,name:"三门峡市"},
+          {id:411300,name:"南阳市"},
+          {id:411400,name:"商丘市"},
+          {id:411500,name:"信阳市"},
+          {id:411600,name:"周口市"},
+          {id:411700,name:"驻马店市"},
+          {id:420000,name:"湖北省"},
+          {id:420100,name:"武汉市"},
+          {id:420200,name:"黄石市"},
+          {id:420300,name:"十堰市"},
+          {id:420500,name:"宜昌市"},
+          {id:420600,name:"襄阳市"},
+          {id:420700,name:"鄂州市"},
+          {id:420800,name:"荆门市"},
+          {id:420900,name:"孝感市"},
+          {id:421000,name:"荆州市"},
+          {id:421100,name:"黄冈市"},
+          {id:421200,name:"咸宁市"},
+          {id:421300,name:"随州市"},
+          {id:422800,name:"恩施土家族苗族自治州"},
+          {id:430000,name:"湖南省"},
+          {id:430100,name:"长沙市"},
+          {id:430200,name:"株洲市"},
+          {id:430300,name:"湘潭市"},
+          {id:430400,name:"衡阳市"},
+          {id:430500,name:"邵阳市"},
+          {id:430600,name:"岳阳市"},
+          {id:430700,name:"常德市"},
+          {id:430800,name:"张家界市"},
+          {id:430900,name:"益阳市"},
+          {id:431000,name:"郴州市"},
+          {id:431100,name:"永州市"},
+          {id:431200,name:"怀化市"},
+          {id:431300,name:"娄底市"},
+          {id:433100,name:"湘西土家族苗族自治州"},
+          {id:440000,name:"广东省"},
+          {id:440100,name:"广州市"},
+          {id:440200,name:"韶关市"},
+          {id:440300,name:"深圳市"},
+          {id:440400,name:"珠海市"},
+          {id:440500,name:"汕头市"},
+          {id:440600,name:"佛山市"},
+          {id:440700,name:"江门市"},
+          {id:440800,name:"湛江市"},
+          {id:440900,name:"茂名市"},
+          {id:441200,name:"肇庆市"},
+          {id:441300,name:"惠州市"},
+          {id:441400,name:"梅州市"},
+          {id:441500,name:"汕尾市"},
+          {id:441600,name:"河源市"},
+          {id:441700,name:"阳江市"},
+          {id:441800,name:"清远市"},
+          {id:441900,name:"东莞市"},
+          {id:442000,name:"中山市"},
+          {id:445100,name:"潮州市"},
+          {id:445200,name:"揭阳市"},
+          {id:445300,name:"云浮市"},
+          {id:450000,name:"广西壮族自治区"},
+          {id:450100,name:"南宁市"},
+          {id:450200,name:"柳州市"},
+          {id:450300,name:"桂林市"},
+          {id:450400,name:"梧州市"},
+          {id:450500,name:"北海市"},
+          {id:450600,name:"防城港市"},
+          {id:450700,name:"钦州市"},
+          {id:450800,name:"贵港市"},
+          {id:450900,name:"玉林市"},
+          {id:451000,name:"百色市"},
+          {id:451100,name:"贺州市"},
+          {id:451200,name:"河池市"},
+          {id:451300,name:"来宾市"},
+          {id:451400,name:"崇左市"},
+          {id:460000,name:"海南省"},
+          {id:460100,name:"海口市"},
+          {id:460200,name:"三亚市"},
+          {id:460300,name:"三沙市"},
+          {id:460400,name:"儋州市"},
+          {id:500000,name:"重庆市"},
+          {id:510000,name:"四川省"},
+          {id:510100,name:"成都市"},
+          {id:510300,name:"自贡市"},
+          {id:510400,name:"攀枝花市"},
+          {id:510500,name:"泸州市"},
+          {id:510600,name:"德阳市"},
+          {id:510700,name:"绵阳市"},
+          {id:510800,name:"广元市"},
+          {id:510900,name:"遂宁市"},
+          {id:511000,name:"内江市"},
+          {id:511100,name:"乐山市"},
+          {id:511300,name:"南充市"},
+          {id:511400,name:"眉山市"},
+          {id:511500,name:"宜宾市"},
+          {id:511600,name:"广安市"},
+          {id:511700,name:"达州市"},
+          {id:511800,name:"雅安市"},
+          {id:511900,name:"巴中市"},
+          {id:512000,name:"资阳市"},
+          {id:513200,name:"阿坝藏族羌族自治州"},
+          {id:513300,name:"甘孜藏族自治州"},
+          {id:513400,name:"凉山彝族自治州"},
+          {id:520000,name:"贵州省"},
+          {id:520100,name:"贵阳市"},
+          {id:520200,name:"六盘水市"},
+          {id:520300,name:"遵义市"},
+          {id:520400,name:"安顺市"},
+          {id:520500,name:"毕节市"},
+          {id:520600,name:"铜仁市"},
+          {id:522300,name:"黔西南布依族苗族自治州"},
+          {id:522600,name:"黔东南苗族侗族自治州"},
+          {id:522700,name:"黔南布依族苗族自治州"},
+          {id:530000,name:"云南省"},
+          {id:530100,name:"昆明市"},
+          {id:530300,name:"曲靖市"},
+          {id:530400,name:"玉溪市"},
+          {id:530500,name:"保山市"},
+          {id:530600,name:"昭通市"},
+          {id:530700,name:"丽江市"},
+          {id:530800,name:"普洱市"},
+          {id:530900,name:"临沧市"},
+          {id:532300,name:"楚雄彝族自治州"},
+          {id:532500,name:"红河哈尼族彝族自治州"},
+          {id:532600,name:"文山壮族苗族自治州"},
+          {id:532800,name:"西双版纳傣族自治州"},
+          {id:532900,name:"大理白族自治州"},
+          {id:533100,name:"德宏傣族景颇族自治州"},
+          {id:533300,name:"怒江傈僳族自治州"},
+          {id:533400,name:"迪庆藏族自治州"},
+          {id:540000,name:"西藏自治区"},
+          {id:540100,name:"拉萨市"},
+          {id:540200,name:"日喀则市"},
+          {id:540300,name:"昌都市"},
+          {id:540400,name:"林芝市"},
+          {id:540500,name:"山南市"},
+          {id:540600,name:"那曲市"},
+          {id:542500,name:"阿里地区"},
+          {id:610000,name:"陕西省"},
+          {id:610100,name:"西安市"},
+          {id:610200,name:"铜川市"},
+          {id:610300,name:"宝鸡市"},
+          {id:610400,name:"咸阳市"},
+          {id:610500,name:"渭南市"},
+          {id:610600,name:"延安市"},
+          {id:610700,name:"汉中市"},
+          {id:610800,name:"榆林市"},
+          {id:610900,name:"安康市"},
+          {id:611000,name:"商洛市"},
+          {id:620000,name:"甘肃省"},
+          {id:620100,name:"兰州市"},
+          {id:620200,name:"嘉峪关市"},
+          {id:620300,name:"金昌市"},
+          {id:620400,name:"白银市"},
+          {id:620500,name:"天水市"},
+          {id:620600,name:"武威市"},
+          {id:620700,name:"张掖市"},
+          {id:620800,name:"平凉市"},
+          {id:620900,name:"酒泉市"},
+          {id:621000,name:"庆阳市"},
+          {id:621100,name:"定西市"},
+          {id:621200,name:"陇南市"},
+          {id:622900,name:"临夏回族自治州"},
+          {id:623000,name:"甘南藏族自治州"},
+          {id:630000,name:"青海省"},
+          {id:630100,name:"西宁市"},
+          {id:630200,name:"海东市"},
+          {id:632200,name:"海北藏族自治州"},
+          {id:632300,name:"黄南藏族自治州"},
+          {id:632500,name:"海南藏族自治州"},
+          {id:632600,name:"果洛藏族自治州"},
+          {id:632700,name:"玉树藏族自治州"},
+          {id:632800,name:"海西蒙古族藏族自治州"},
+          {id:640000,name:"宁夏回族自治区"},
+          {id:640100,name:"银川市"},
+          {id:640200,name:"石嘴山市"},
+          {id:640300,name:"吴忠市"},
+          {id:640400,name:"固原市"},
+          {id:640500,name:"中卫市"},
+          {id:650000,name:"新疆维吾尔自治区"},
+          {id:650100,name:"乌鲁木齐市"},
+          {id:650200,name:"克拉玛依市"},
+          {id:650400,name:"吐鲁番市"},
+          {id:650500,name:"哈密市"},
+          {id:652300,name:"昌吉回族自治州"},
+          {id:652700,name:"博尔塔拉蒙古自治州"},
+          {id:652800,name:"巴音郭楞蒙古自治州"},
+          {id:652900,name:"阿克苏地区"},
+          {id:653000,name:"克孜勒苏柯尔克孜自治州"},
+          {id:653100,name:"喀什地区"},
+          {id:653200,name:"和田地区"},
+          {id:654000,name:"伊犁哈萨克自治州"},
+          {id:654200,name:"塔城地区"},
+          {id:654300,name:"阿勒泰地区"},
+          {id:659001,name:"石河子市"},
+          {id:659002,name:"阿拉尔市"},
+          {id:659003,name:"图木舒克市"},
+          {id:659004,name:"五家渠市"},
+          {id:659005,name:"北屯市"},
+          {id:659006,name:"铁门关市"},
+          {id:659007,name:"双河市"},
+          {id:659008,name:"可克达拉市"},
+          {id:659009,name:"昆玉市"},
+          {id:710000,name:"台湾省"},
+          {id:810000,name:"香港特别行政区"},
+          {id:820000,name:"澳门特别行政区"}
+        ],
         settlement: [
           {value: 1, label: '医保'},
           {value: 2, label: '自费'},
@@ -381,6 +782,24 @@
       diagnoses: Array,
     },
     methods: {
+      handleIconClick(){
+
+
+      },
+      handleSelectTwo(){
+
+
+      },  createFilter(queryString) {
+        return (restaurant) => {
+          return (restaurant.name.indexOf(queryString) === 0 || restaurant.id.indexOf(queryString) === 0);
+        };
+      },
+      querySearch(queryString, cb) {
+        var restaurants = this.area;
+        var results = queryString ? restaurants.filter(this.createFilter(queryString)) : restaurants;
+        // 调用 callback 返回建议列表的数据
+        cb(results);
+      },
       changeDoctor() {
         for (let i = 0; i < this.doctors.length; i++) {
           if (this.doctors[i].admin_user_id == this.form.doctor) {

src/xt_pages/hospitalStation/hospitalBatchStatementPrint.vue

@@ -44,7 +44,7 @@ export default {
       patient_id: 0,
       prescription_id: 0,
       ids: '',
-      info: {},
+      info: null,
       org_id: '',
       list:[],
       infos:[],
@@ -193,159 +193,58 @@ export default {
       })
         .then(function(response) {
           if (response.data.state == 0) {
-            that.$message.error(response.data.msg)
+            this.$message.error(response.data.msg)
             return false
           } else {
             let infos = []
-            for(var i = 0; i < response.data.data.infos.length; i++){
-              console.log("~~~~~~~-----")
-              var subInfo = response.data.data.infos[i]
-              var temp_info = {}
-              console.log(infos)
-              console.log("11111")
-              console.log(infos.patient)
-              console.log(that.info)
-              temp_info =  subInfo.info
-              temp_info['patient'] = subInfo.patient
-              console.log("22222")
-
-              temp_info['diagnosis'] = subInfo.diagnosis
-              console.log("333333")
-
-              temp_info['p_admin'] = subInfo.printor_admin
-              console.log("4444444")
-
-              temp_info['charge_admin'] = subInfo.charge_admin
-              console.log("5555555")
-
-              temp_info['fixmedins_name'] = subInfo.org_name
-              console.log("6666666")
-
-              temp_info['fixmedins_code'] = subInfo.org_code
-              console.log("7777777")
-
-              temp_info['order'] = subInfo.order
-              console.log("8888888")
-
-              temp_info['date'] = subInfo.date
-              console.log("9999999")
-
-              temp_info['number'] = subInfo.number
-              console.log("9999999")
-
-              temp_info['order_infos'] = subInfo.order_infos
-              console.log("9999999")
-
-              temp_info['diagnosis'] = subInfo.diagnosis
-              console.log("9999999")
-
-              temp_info['dia_config'] = subInfo.dia_config
-              console.log("9999999")
-
-              temp_info['doctor_info'] = subInfo.doctor_info
-              console.log("9999999")
-
-              temp_info['bed_cost_total'] = subInfo.bedCostTotal
-              console.log("9999999")
-
-              temp_info['bed_cost_self_total'] = subInfo.bedCostSelfTotal
-              console.log("9999999")
-
-              temp_info['bed_cost_part_self_total'] = subInfo.bedCostPartSelfTotal
-              console.log("9999999")
-
-              temp_info['operation_cost_total'] = subInfo.operationCostTotal
-              console.log("9999999")
-
-              temp_info['operation_cost_self_total'] = subInfo.operationCostSelfTotal
-              console.log("9999999")
-
-              temp_info['operation_cost_part_self_total'] = subInfo.operationCostPartSelfTotal
-              console.log("9999999")
-
-              temp_info['other_cost_total'] = subInfo.otherCostTotal
-              console.log("9999999")
-
-              temp_info['other_cost_self_total'] = subInfo.otherCostSelfTotal
-              console.log("9999999")
-
-              temp_info['other_cost_part_self_total'] = subInfo.otherCostPartSelfTotal
-              console.log("9999999")
-
-              temp_info['material_cost_total'] = subInfo.materialCostTotal
-              console.log("9999999")
-
-              temp_info['material_cost_self_total'] = subInfo.materialCostSelfTotal
-              console.log("9999999")
-
-              temp_info['material_cost_part_self_total'] = subInfo.materialCostPartSelfTotal
-              console.log("9999999")
-
-              temp_info['western_medicine_cost_total'] = subInfo.westernMedicineCostTotal
-              console.log("9999999")
-
-              temp_info['western_medicine_cost_self_total'] = subInfo.westernMedicineCostSelfTotal
-              console.log("9999999")
-
-              temp_info['western_medicine_cost_part_self_total'] = subInfo.westernMedicineCostPartSelfTotal
-              console.log("9999999")
-
-              temp_info['chinese_traditional_medicine_cost_total'] = subInfo.chineseTraditionalMedicineCostTotal
-              console.log("9999999")
-
-              temp_info['chinese_traditional_medicine_cost_self_total'] = subInfo.chineseTraditionalMedicineCostSelfTotal
-              console.log("9999999")
-
-              temp_info['chinese_traditional_medicine_cost_part_self_total'] = subInfo.chineseTraditionalMedicineCostPartSelfTotal
-              console.log("9999999")
-
-              temp_info['check_cost_total'] = subInfo.checkCostTotal
-              console.log("9999999")
-
-              temp_info['check_cost_self_total'] = subInfo.checkCostSelfTotal
-              console.log("9999999")
-
-              temp_info['check_cost_part_self_total'] = subInfo.checkCostPartSelfTotal
-              console.log("9999999")
-
-              temp_info['laboratory_cost_total'] = subInfo.laboratoryCostTotal
-              console.log("9999999")
-
-              temp_info['laboratory_cost_self_total'] = subInfo.laboratoryCostSelfTotal
-              console.log("9999999")
-
-              temp_info['laboratory_cost_part_self_total'] = subInfo.laboratoryCostPartSelfTotal
-              console.log("9999999")
-
-              temp_info['treat_cost_total'] = subInfo.treatCostTotal
-              console.log("9999999")
-
-              temp_info['treat_cost_self_total'] = subInfo.treatCostSelfTotal
-              console.log("9999999")
-
-              temp_info['treat_cost_part_self_total'] = subInfo.treatCostPartSelfTotal
-              console.log("9999999")
-
-              temp_info['date'] = subInfo.date
-              console.log("9999999")
-
-              temp_info['number'] = subInfo.number
-              console.log("9999999")
-
-              temp_info['order_infos'] = subInfo.order_infos
-              console.log("9999999")
-
-              temp_info['diagnosis'] = subInfo.diagnosis
-              console.log("9999999")
-
-              temp_info['his'] = subInfo.his_hospital
-              console.log("9999999")
-
-              infos.push(temp_info)
-              console.log("9999999")
-
-              console.log(infos)
-
+            for(var i  = 0; i < response.data.data.infos.length; i++){
+              var info = response.data.data.infos[i]
+              that.info['patient'] = info.patient
+              that.info['diagnosis'] = info.diagnosis
+              that.info['p_admin'] = info.printor_admin
+              that.info['charge_admin'] = info.charge_admin
+              that.info['fixmedins_name'] = info.org_name
+              that.info['fixmedins_code'] = info.org_code
+              that.info['order'] = info.order
+              that.info['date'] = info.date
+              that.info['number'] = info.number
+              that.info['order_infos'] = info.order_infos
+              that.info['diagnosis'] = info.diagnosis
+              that.info['dia_config'] = info.dia_config
+              that.info['doctor_info'] = info.doctor_info
+              that.info['bed_cost_total'] = info.bedCostTotal
+              that.info['bed_cost_self_total'] = info.bedCostSelfTotal
+              that.info['bed_cost_part_self_total'] = info.bedCostPartSelfTotal
+              that.info['operation_cost_total'] = info.operationCostTotal
+              that.info['operation_cost_self_total'] = info.operationCostSelfTotal
+              that.info['operation_cost_part_self_total'] = info.operationCostPartSelfTotal
+              that.info['other_cost_total'] = info.otherCostTotal
+              that.info['other_cost_self_total'] = info.otherCostSelfTotal
+              that.info['other_cost_part_self_total'] = info.otherCostPartSelfTotal
+              that.info['material_cost_total'] = info.materialCostTotal
+              that.info['material_cost_self_total'] = info.materialCostSelfTotal
+              that.info['material_cost_part_self_total'] = info.materialCostPartSelfTotal
+              that.info['western_medicine_cost_total'] = info.westernMedicineCostTotal
+              that.info['western_medicine_cost_self_total'] = info.westernMedicineCostSelfTotal
+              that.info['western_medicine_cost_part_self_total'] = info.westernMedicineCostPartSelfTotal
+              that.info['chinese_traditional_medicine_cost_total'] = info.chineseTraditionalMedicineCostTotal
+              that.info['chinese_traditional_medicine_cost_self_total'] = info.chineseTraditionalMedicineCostSelfTotal
+              that.info['chinese_traditional_medicine_cost_part_self_total'] = info.chineseTraditionalMedicineCostPartSelfTotal
+              that.info['check_cost_total'] = info.checkCostTotal
+              that.info['check_cost_self_total'] = info.checkCostSelfTotal
+              that.info['check_cost_part_self_total'] = info.checkCostPartSelfTotal
+              that.info['laboratory_cost_total'] = info.laboratoryCostTotal
+              that.info['laboratory_cost_self_total'] = info.laboratoryCostSelfTotal
+              that.info['laboratory_cost_part_self_total'] = info.laboratoryCostPartSelfTotal
+              that.info['treat_cost_total'] = info.treatCostTotal
+              that.info['treat_cost_self_total'] = info.treatCostSelfTotal
+              that.info['treat_cost_part_self_total'] = info.treatCostPartSelfTotal
+              that.info['date'] = info.date
+              that.info['number'] = info.number
+              that.info['order_infos'] = info.order_infos
+              that.info['diagnosis'] = info.diagnosis
+              that.info['his'] = info.his_hospital
+              infos.push(that.info)
             }
             that.infos = infos
             console.log(infos)

src/xt_pages/hospitalStation/pastInquiries.vue

@@ -63,6 +63,8 @@
       </el-pagination>
       <inquiries-detail ref="inquiriesDetail"></inquiries-detail>
     </div>
+
+
   </div>
 </template>
 

src/xt_pages/hospitalStation/pastQuiriesPrint/hospitalAllListPrint.vue

@@ -0,0 +1,552 @@
+<template>
+  <div>
+    <template>
+      <el-button
+        style="position:fixed;right:25px;z-index:999"
+        :loading="loading"
+        size="small"
+        icon="el-icon-printer"
+        @click="printThisPage"
+        type="primary"
+      >打印
+      </el-button
+      >
+    </template>
+
+    <div class='dialysisPage' style="padding-top:40px;">
+<!--      <printOne :list="list" :patient="patient" :order="order" :admin="admin"></printOne>-->
+      <hospital-all-list-print-one :list="new_list" :patient="patient" :record="record" :admin="admin"></hospital-all-list-print-one>
+    </div>
+  </div>
+</template>
+
+<script>
+import { uParseTime } from '@/utils/tools'
+import HospitalAllListPrintOne from './hospitalAllListPrintOne.vue'
+import { getHospitalUnChargeSummary } from '../../../api/his/his'
+
+export default {
+  name: 'hospitalAllListPrint',
+  components: {
+    HospitalAllListPrintOne,
+  },
+  props: {
+    paramsObj: Object
+  },
+  data() {
+    return {
+      list: [],
+      new_list: [],
+
+      patient: {},
+      record: {},
+      admin: {},
+    }
+  },
+
+  created() {
+    this.getInfo(this.paramsObj.patient_id, this.paramsObj.record_date)
+
+  },
+  methods: {
+    getTimes(time) {
+      return uParseTime(time, '{y}-{m}-{d} {h}:{i}')
+    },
+    getInfo(patient_id, record_date) {
+      let params = {
+        patient_id: patient_id,
+        record_date: record_date,
+        admin_user_id: this.$store.getters.xt_user.user.id,
+        p_type: 1,
+      };
+      getHospitalUnChargeSummary(params).then(response => {
+        if (response.data.state == 0) {
+          this.$message.error(response.data.msg);
+          return false
+        } else {
+          this.record = response.data.data.record;
+          this.patient = response.data.data.xt_info;
+          this.admin = response.data.data.admin_info;
+          this.list = []
+          this.new_list = []
+          for (let i = 0; i < response.data.data.prescription.length; i++) {
+            if (response.data.data.prescription[i].type == 1) {
+              var infos = response.data.data.prescription[i]
+              for (let b = 0; b < infos.advices.length; b++) {
+                let obj = {
+                  drug_id: infos.advices[b].drug_id,
+                  project_id: 0,
+                  med_chrgitm_type: this.getType(1),
+                  price: parseFloat(infos.advices[b].price),
+                  count: parseFloat(infos.advices[b].prescribing_number),
+                  p_time: this.getTimes(infos.advices[b].created_time),
+                  name: infos.advices[b].advice_name,
+                  spec: infos.advices[b].drug.drug_spec,
+                  unit: infos.advices[b].prescribing_number_unit,
+                  feedetl_sn: infos.advices[b].feedetl_sn,
+                  medicine_insurance_kind:this.getMedicineInsuranceKind(infos.advices[b].drug.medical_insurance_level)
+                }
+                this.list.push(obj)
+              }
+            }
+          }
+          for (let i = 0; i < response.data.data.prescription.length; i++) {
+            if (response.data.data.prescription[i].type == 2) {
+              var infos = response.data.data.prescription[i]
+              for (let b = 0; b < infos.project.length; b++) {
+                if (infos.project[b].type == 2) {
+                  let obj = {
+                    drug_id: 0,
+                    project_id: infos.project[b].project_id,
+                    med_chrgitm_type: this.getType(infos.project[b].project.cost_classify),
+                    price: parseFloat(infos.project[b].price),
+                    count: parseFloat(infos.project[b].count),
+                    p_time: this.getTimes(infos.project[b].ctime),
+                    name: infos.project[b].project.project_name,
+                    spec: "",
+                    unit: infos.project[b].project.unit,
+                    feedetl_sn: infos.project[b].feedetl_sn,
+                    medicine_insurance_kind:this.getMedicineInsuranceKind(infos.project[b].project.medical_coverage)
+
+                  }
+                  this.list.push(obj)
+                } else {
+                  let obj = {
+                    drug_id: 0,
+                    med_chrgitm_type: this.getType(5),
+                    project_id: infos.project[b].project_id,
+                    price: parseFloat(infos.project[b].price),
+                    count: parseFloat(infos.project[b].count),
+                    p_time: this.getTimes(infos.project[b].ctime),
+                    name: infos.project[b].good_info.good_name,
+                    spec: infos.project[b].good_info.specification_name,
+                    unit: infos.project[b].good_info.packing_unit,
+                    feedetl_sn: infos.project[b].feedetl_sn,
+                    medicine_insurance_kind:this.getMedicineInsuranceKind(infos.project[b].good_info.medical_insurance_level)
+
+                    // medicine_insurance_kind:this.getMedicineInsuranceKind(infos.advices[b].drug.medical_coverage)
+
+
+                  }
+                  this.list.push(obj)
+                }
+              }
+            }
+
+          }
+
+          //获取所有项目类型进行去重
+          let med_chrgitm_types = [];
+          for (let i = 0; i < this.list.length; i++) {
+            med_chrgitm_types.push(this.list[i].med_chrgitm_type)
+          }
+          const obj = {};
+          med_chrgitm_types = med_chrgitm_types.reduce((cur, next) => {
+            obj[next] ? '' : obj[next] = true && cur.push(next);
+            return cur
+          }, []); // 设置cur默认类型为数组，并且初始值为空的数组
+
+          let tempOrderInfo = [];
+          for (let i = 0; i < med_chrgitm_types.length; i++) {
+            let obj = {
+              total: 0,
+              details: []
+            };
+            let tempDetails = [];
+            for (let b = 0; b < this.list.length; b++) {
+              if (med_chrgitm_types[i] == this.list[b].med_chrgitm_type) {
+                tempDetails.push(this.list[b])
+              }
+            }
+
+            obj.details = this.setNewData(tempDetails);
+            // obj.total = this.getTotal(obj.details);
+            // obj.details.push({
+            //   // total: obj.total,
+            //   // is_total: 1,
+            // });
+            this.new_list = this.new_list.concat(obj.details)
+          }
+        }
+      })
+    },
+    getTotal: function(items) {
+      let total = 0;
+      for (let i = 0; i < items.length; i++) {
+        total = Number(total) + Number((parseFloat(items[i].count) * parseFloat(items[i].price)).toFixed(2))
+      }
+      return total.toFixed(2)
+    },
+    setNewData(details) {
+      let drug_ids = [];
+      let project_ids = [];
+
+      for (let i = 0; i < details.length; i++) {
+        if (details[i].drug_id > 0 && details[i].project_id == 0) { //药品
+          let obj = {
+            id: details[i].drug_id,
+            price: details[i].price
+          };
+          drug_ids.push(obj)
+        } else if (details[i].drug_id == 0 && details[i].project_id > 0) { //项目
+          let obj = {
+            id: details[i].project_id,
+            price: details[i].price
+          };
+          project_ids.push(obj)
+        }
+      }
+
+      let new_drug_ids = this.unique(drug_ids);
+      let new_project_ids = this.unique(project_ids);
+      let list = [];
+
+      console.log('ids');
+      console.log(new_drug_ids);
+      console.log(new_project_ids);
+      console.log('ids');
+
+      if (new_drug_ids.length > 0) {
+        for (let i = 0; i < new_drug_ids.length; i++) {
+          let obj = {};
+          let count = 0;
+          for (let a = 0; a < details.length; a++) {
+            if (new_drug_ids[i].id == details[a].drug_id && new_drug_ids[i].price == details[a].price) {
+              obj['name'] = details[a].name;
+              obj['spec'] = details[a].spec;
+              obj['unit'] = details[a].unit;
+              obj['medicine_insurance_kind'] = details[a].medicine_insurance_kind;
+
+              obj['med_chrgitm_type'] = details[a].med_chrgitm_type;
+              obj['price'] = parseFloat(details[a].price);
+              count = count + parseFloat(details[a].count)
+            }
+          }
+          obj['count'] = count;
+          list.push(obj)
+        }
+      }
+      console.log(list)
+
+      if (new_project_ids.length > 0) {
+        for (let i = 0; i < new_project_ids.length; i++) {
+          let obj = {}
+          let count = 0
+          for (let a = 0; a < details.length; a++) {
+            if (new_project_ids[i].id == details[a].project_id && new_project_ids[i].price == details[a].price) {
+              obj['name'] = details[a].name
+              obj['unit'] = details[a].unit
+              obj['spec'] = '1'
+              obj['med_chrgitm_type'] = (details[a].med_chrgitm_type)
+              obj['price'] = parseFloat(details[a].price)
+              count = count + parseFloat(details[a].count)
+            }
+          }
+          obj['count'] = count
+          list.push(obj)
+        }
+      }
+      console.log(list)
+
+      return list
+
+    },
+    unique(array) {
+      // res用来存储结果
+      var res = [];
+      for (var i = 0, arrayLen = array.length; i < arrayLen; i++) {
+        for (var j = 0, resLen = res.length; j < resLen; j++) {
+          if (array[i].id === res[j].id && array[i].price === res[j].price) {
+            break
+          }
+        }
+        // 如果array[i]是唯一的，那么执行完循环，j等于resLen
+        if (j === resLen) {
+          res.push(array[i])
+        }
+      }
+      return res
+    },
+    getMedicineInsuranceKind(type){
+      switch (type) {
+        case 1:
+          return '甲类';
+        case 2:
+          return '乙类';
+        case 3:
+          return '丙类';
+          break;
+      }
+
+    },
+    getType(med_chrgitm_type) {
+      switch (med_chrgitm_type) {
+        case 1:
+          return '西药费';
+        case 2:
+          return '治疗费';
+        case 3:
+          return '检验费';
+          break;
+        case 4:
+          return '心电图费';
+          break;
+        case 5:
+          return '耗材费';
+          break;
+        case 6:
+          return '护理费';
+          break;
+        case 7:
+          return '放射费';
+          break;
+        case 8:
+          return '检查费';
+          break;
+        case 9:
+          return '超声费';
+          break;
+        case 10:
+          return '麻醉费';
+          break;
+        case 11:
+          return '手术费';
+          break;
+        case 12:
+          return '其他费';
+          break;
+        case 13:
+          return '床位费';
+          break;
+        case 14:
+          return '化验费';
+          break;
+        case 15:
+          return '诊察费';
+          break;
+
+      }
+
+    },
+    printThisPage() {
+      const style =
+        '@media print {.allListTitle{font-size: 24px;text-align: center;font-weight: bold;margin-bottom: 10px;}.allListInfo{display: flex;font-size: 16px;justify-content: space-between;margin: 10px 0;} .allListTable{width: 100%;text-align: center;border-collapse: collapse;line-height: 20px;font-size: 14px;border-color: #000;text-align:left;}.allListTable tr td {padding: 0 5px;}.tableBottom{font-size: 16px;display: flex;margin-top: 20px;}.tableBottomOne{margin-right: 40px;}}'
+      const style1 =
+        '@media print {.allListTitle{font-size: 24px;text-align: center;font-weight: bold;margin-bottom: 10px;}.allListInfo{display: flex;font-size: 16px;justify-content: space-between;margin: 10px 0;} .allListTable{width: 100%;text-align: center;border-collapse: collapse;line-height: 20px;font-size: 14px;border-color: #000;text-align:left;} .allListTable tr td {padding: 0 5px;} .allListTable .allListTable_1{border: none;width: 100%;text-align: center;border-collapse: collapse;line-height: 20px;font-size: 14px;border-color: #000;text-align:left;} .allListTable_1 tr{page-break-inside:avoid;} .allListTable_1 tr td {padding: 0 5px;border: 1px solid #000;} .tableBottom{font-size: 16px;display: flex;margin-top: 20px;}.tableBottomOne{margin-right: 40px;}}'
+
+        printJS({
+          printable: 'allList',
+          type: 'html',
+          style: style1,
+          scanStyles: false
+        })
+      // if (this.org_template_info.template_id == 1) {
+      //   printJS({
+      //     printable: "dialysis-print-box",
+      //     type: "html",
+      //     style: style,
+      //     scanStyles: false
+      //   });
+      // }
+
+    },
+  },
+  watch: {
+    paramsObj: {//深度监听，可监听到对象、数组的变化
+      handler(val, oldVal) {
+        this.getInfo(val.patient_id, val.record_date)
+      },
+      deep: true
+    }
+  }
+}
+</script>
+
+<style>
+.dialysis-print-order {
+  width: 960px;
+  margin: 0 auto;
+}
+
+.dialysis-print-order .order-yy-name {
+  margin: auto;
+  text-align: center;
+  font-size: 20px;
+  letter-spacing: 5px;
+}
+
+.dialysis-print-order .order-title {
+  margin: auto;
+  font-weight: 600;
+  text-align: center;
+  font-size: 22px;
+  padding: 10px;
+}
+
+.dialysis-print-order .table-box {
+  width: 100%;
+  line-height: 23px;
+  font-size: 14px;
+}
+
+.dialysis-print-order .print-table {
+  width: 100%;
+  text-align: center;
+  border-collapse: collapse;
+  line-height: 40px;
+  font-size: 14px;
+  border-color: #000;
+}
+
+.dialysis-print-order .print-table-no {
+  width: 100%;
+  text-align: center;
+  border-collapse: collapse;
+  font-size: 14px;
+}
+
+.dialysis-print-order .under-line {
+  border-bottom: 1px solid #999;
+  width: 95%;
+  text-align: center;
+  margin-left: 2px;
+}
+
+.dialysis-print-order .title-box {
+  text-align: center;
+  font-size: 16px;
+}
+
+.dialysis-print-order .radio-lebel-box {
+  font-weight: 400;
+  cursor: pointer;
+}
+
+.dialysis-print-order .radio-no {
+  opacity: 0;
+  outline: none;
+  position: absolute;
+  margin: 0;
+  width: 0;
+  height: 0;
+  z-index: -1;
+}
+
+.dialysis-print-order .radio-inner {
+  white-space: nowrap;
+  cursor: pointer;
+  outline: none;
+  display: inline-block;
+  line-height: 1;
+  position: relative;
+  vertical-align: middle;
+}
+
+.dialysis-print-order .radio-fang {
+  display: inline-block;
+  position: relative;
+  border: 1px solid #000;
+  box-sizing: border-box;
+  width: 14px;
+  height: 14px;
+  background-color: #fff;
+  z-index: 1;
+  transition: border-color 0.25s cubic-bezier(0.71, -0.46, 0.29, 1.46),
+  background-color 0.25s cubic-bezier(0.71, -0.46, 0.29, 1.46);
+}
+
+.dialysis-print-order .is-checked-radio::after {
+  content: "√";
+  font-size: 15px;
+}
+
+.dialysis-print-order .print-table-no tr td {
+  padding: 8px 5px;
+  line-height: 25px;
+}
+
+.dialysis-print-order .print-table tr td {
+  padding: 1px 1px;
+  /*line-height: 25px;*/
+}
+
+.es-img {
+  height: 30px;
+}
+
+.advice-name {
+  text-align: left;
+}
+
+.advice-children {
+  display: flex;
+}
+
+.title-box-pro {
+  border: 0 #fff;
+  line-height: 25px;
+  height: 25px;
+  text-align: left;
+  padding-left: 10px !important;
+}
+
+.title-box-pro-tr {
+  border: 0 #fff;
+}
+
+.text-align-left {
+  text-align: left !important;
+  padding-left: 10px !important;
+  font-size: 14px !important;
+  line-height: 25px;
+}
+
+.print-table-tr-new td {
+  line-height: 20px !important;
+}
+
+.border-top-solid {
+  border: solid 1px #000;
+}
+
+.print-template-two tr {
+  line-height: 30px;
+}
+
+.table-box1 {
+  border: 1px solid #000;
+  width: 100%;
+  line-height: 30px;
+  font-size: 14px;
+  border-collapse: collapse;
+}
+
+.table-box1 tr {
+  border-bottom: 1px solid #000;
+}
+</style>
+
+<style lang="scss">
+
+.newContainer {
+
+.dialysisPage::-webkit-scrollbar {
+  height: 15px;
+}
+
+.el-date-editor {
+
+.el-input__inner {
+  padding-right: 0px;
+}
+
+}
+.el-table td, .el-table th {
+  text-align: center;
+}
+
+}
+.newContainer::-webkit-scrollbar {
+  height: 15px !important;
+}
+</style>

src/xt_pages/hospitalStation/pastQuiriesPrint/hospitalAllListPrintOne.vue

@@ -0,0 +1,406 @@
+<template>
+  <div id="allList" class="allList-print">
+    <table
+      class="allListTable"
+      border="0"
+      cellspacing="0"
+      style="font-size: 14px"
+      align="center"
+    >
+      <THEAD
+        style="
+          display: table-header-group;
+          font-weight: bold;
+        "
+      >
+      <TR style="border-bottom: 1px solid">
+        <TD colspan="4" align="center" style="font-size: 20px">
+          {{ $store.getters.xt_user.org.org_name }}汇总清单
+        </TD>
+      </TR>
+      <TR>
+        <TD colspan="1">科别：门诊</TD>
+        <TD width="130">床号：</TD>
+        <TD>门诊号：{{ record.number }}</TD>
+        <TD>姓名：{{ patient.name }}</TD>
+      </TR>
+      <TR style="border-bottom: 1px solid">
+        <TD colspan="2"> 预交款：</TD>
+        <TD>总费用：{{ getTotal(list) }} </TD>
+        <TD
+        >门诊日期：{{
+            record.in_hosptial_time
+              ? record.in_hosptial_time.split(" ")[0]
+              : ""
+          }}</TD
+        >
+      </TR>
+      <TR>
+        <TD colspan="2">
+          西药:&nbsp;&nbsp;&nbsp;{{
+            getWesternMedicineCostTotal()
+              ? getWesternMedicineCostTotal()
+              : ""
+          }}</TD
+        >
+        <TD
+        >中成药:</TD>
+        <TD>中草药:</TD>
+      </TR>
+      <TR>
+        <TD colspan="2">
+          检查费:{{
+            getCheckCostTotal()
+              ? getCheckCostTotal()
+              : ""
+          }}</TD
+        >
+        <TD>输氧费:</TD>
+        <TD
+        >手术费:</TD
+        >
+      </TR>
+      <TR>
+        <TD colspan="2"
+        >化验费:{{
+            getHuaYanCostTotal()
+              ? getHuaYanCostTotal()
+              : ""
+          }}</TD
+        >
+        <TD>输血费:</TD>
+        <TD
+        >诊察费:{{
+            getzhenchanCostTotal()
+              ? getzhenchanCostTotal()
+              : ""
+          }}</TD>
+      </TR>
+      <TR>
+        <TD colspan="2"
+        >治疗费:{{
+            getzhiliaoCostTotal()
+              ?  getzhiliaoCostTotal()
+              : ""
+          }}</TD
+        >
+        <TD>护理费:</TD>
+        <TD
+        >床位费:</TD
+        >
+      </TR>
+      <TR>
+        <TD colspan="2">麻醉费:</TD>
+        <TD
+        >材料费:{{
+           getmaterialCostTotal() ? getmaterialCostTotal(): ""
+          }}</TD
+        >
+        <TD
+        >其他:{{
+           getotherCostTota() ? getotherCostTota() : ""
+          }}</TD
+        >
+      </TR>
+      </THEAD>
+
+      <TBODY style="text-align: center">
+      <TR>
+        <TD colspan="4">
+          <Table class="allListTable_1" border="1">
+            <TR>
+              <TH width="70"> 费用类别 </TH>
+              <TH width="70"> 项目名称 </TH>
+              <TH width="70">单位</TH>
+              <TH width="70">数量</TH>
+              <TH width="70">单价</TH>
+              <TH width="70">金额</TH>
+              <TH width="70">医保类型</TH>
+            </TR>
+            <template v-for="(item, index) in list">
+              <tr v-if="item.name&&item.name.length > 0">
+                <td style="width: 10%">{{ item.med_chrgitm_type }}</td>
+                <td
+                  style="
+                      width: 35%;
+                      white-space: nowrap;
+                      overflow: hidden;
+                      text-overflow: ellipsis;
+                    "
+                >
+                  {{ item.name }}{{ item.spec }}
+                </td>
+                <td style="width: 5%">{{ item.unit }}</td>
+                <td style="width: 10%; text-align: right">
+                  {{ item.count }}
+                </td>
+                <td style="width: 10%; text-align: right">
+                  {{ item.price}}
+                </td>
+                <td style="width: 10%; text-align: right">
+                  {{ (item.price * item.count).toFixed(2) }}
+                </td>
+                <td style="width: 10%">{{ item.medicine_insurance_kind }}</td>
+              </tr>
+            </template>
+              <tr>
+              <td style="width: 10%"></td>
+              <td
+                style="
+                      width: 35%;
+                      white-space: nowrap;
+                      overflow: hidden;
+                      text-overflow: ellipsis;
+                    "
+              >
+                合计
+              </td>
+              <td style="width: 5%"></td>
+              <td style="width: 10%; text-align: right"></td>
+              <td style="width: 10%; text-align: right"></td>
+              <td style="width: 10%; text-align: right">
+                {{ getTotal(list) }}
+              </td>
+              <td style="width: 10%"></td>
+            </tr>
+          </Table>
+        </TD>
+      </TR>
+      </TBODY>
+    </table>
+  </div>
+</template>
+
+<script>
+import { uParseTime } from "@/utils/tools";
+
+export default {
+  props: {
+    list: {
+      type: Array,
+      default: function () {
+        return [];
+      },
+    },
+    patient: {
+      type: Object,
+      default: function () {
+        return {};
+      },
+    },
+    record: {
+      type: Object,
+      default: function () {
+        return {};
+      },
+    },
+    admin: {
+      type: Object,
+      default: function () {
+        return {};
+      },
+    },
+    hospital: {
+      type: Object,
+      default: function () {
+        return {};
+      },
+    },
+  },
+  data() {
+    return {
+      page: 1,
+      pageArr: [],
+    };
+  },
+  methods: {
+    getWesternMedicineCostTotal(){
+      let total = 0
+      for(let i = 0;i < this.list.length;i++){
+        if(this.list[i].med_chrgitm_type == "西药费"){
+          total = total + (this.list[i].count * parseFloat(this.list[i].price.toFixed(2)))
+        }
+
+      }
+      return total.toFixed(2)
+    },
+    getCheckCostTotal(){
+      let total = 0
+
+      for(let i = 0;i < this.list.length;i++){
+        if(this.list[i].med_chrgitm_type == "检查费"){
+
+          total = total + (this.list[i].count * parseFloat(this.list[i].price.toFixed(2)))
+
+
+        }
+
+      }
+      return total.toFixed(2)
+
+    }, getHuaYanCostTotal(){
+      let total = 0
+
+      for(let i = 0;i < this.list.length;i++){
+        if(this.list[i].med_chrgitm_type == "化验费"){
+          total = total + (this.list[i].count * parseFloat(this.list[i].price.toFixed(2)))
+        }
+      }
+      return total.toFixed(2)
+    },getzhenchanCostTotal(){
+      let total = 0
+
+      for(let i = 0;i < this.list.length;i++){
+        if(this.list[i].med_chrgitm_type == "诊察费"){
+          total = total + (this.list[i].count * parseFloat(this.list[i].price.toFixed(2)))
+        }
+
+      }
+      return total.toFixed(2)
+
+
+    },getzhiliaoCostTotal(){
+      let total = 0
+      for(let i = 0;i < this.list.length;i++){
+        if(this.list[i].med_chrgitm_type == "治疗费"){
+          total = total + (this.list[i].count * parseFloat(this.list[i].price.toFixed(2)))
+        }
+      }
+      return total.toFixed(2)
+
+
+    },getmaterialCostTotal(){
+      let total = 0
+      for(let i = 0;i < this.list.length;i++){
+        if(this.list[i].med_chrgitm_type == '耗材费'){
+          total = total + (this.list[i].count *parseFloat(this.list[i].price.toFixed(2)))
+        }
+
+      }
+      return total.toFixed(2)
+
+    },getotherCostTota(){
+      let total = 0
+      for(let i = 0;i < this.list.length;i++){
+        if(this.list[i].med_chrgitm_type == "其他费"){
+          total = total + (this.list[i].count * parseFloat(this.list[i].price.toFixed(2)))
+        }
+      }
+      return total.toFixed(2)
+    },
+    getNowTime: function () {
+      let dateTime;
+      let yy = new Date().getFullYear();
+      let mm = new Date().getMonth() + 1;
+      let dd = new Date().getDate();
+      let hh = new Date().getHours();
+      let mf =
+        new Date().getMinutes() < 10
+          ? "0" + new Date().getMinutes()
+          : new Date().getMinutes();
+      let ss =
+        new Date().getSeconds() < 10
+          ? "0" + new Date().getSeconds()
+          : new Date().getSeconds();
+      dateTime = yy + "-" + mm + "-" + dd + " " + hh + ":" + mf + ":" + ss;
+      return dateTime;
+    },
+    getTimes(time) {
+      return uParseTime(time, "{y}-{m}-{d}");
+    },
+    // getTotal: function (items) {
+    //   let total = 0;
+    //   for (let i = 0; i < items.length; i++) {
+    //     total = total + (items[i].count * items[i].price).toFixed(2);
+    //   }
+    //   return total;
+    // },
+    getTotal: function (items) {
+      console.log(items)
+      let total = 0;
+      for (let i = 0; i < items.length; i++) {
+        total = total + (parseFloat(items[i].count) * parseFloat(items[i].price.toFixed(2)));
+      }
+      return total.toFixed(2);
+    },
+
+  },
+  watch: {
+    list: {
+      handler(newVal) {
+        // this.getPage();
+      },
+      deep: true,
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.allList-print {
+  -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.27),
+  0 0 60px rgba(0, 0, 0, 0.06) inset;
+  -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.27),
+  0 0 40px rgba(0, 0, 0, 0.06) inset;
+  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.27), 0 0 40px rgba(0, 0, 0, 0.06) inset;
+  margin-bottom: 20px;
+  padding: 20px 10px;
+}
+
+.allListTitle {
+  font-size: 24px;
+  text-align: center;
+  font-weight: bold;
+  margin-bottom: 10px;
+}
+
+.allListInfo {
+  display: flex;
+  font-size: 16px;
+  justify-content: space-between;
+  margin: 10px 0;
+}
+
+.allListInfo div {
+  min-width: 200px;
+}
+
+.allListTable {
+  width: 100%;
+  text-align: center;
+  border-collapse: collapse;
+  line-height: 20px;
+  font-size: 14px;
+  border-color: #000;
+  text-align: left;
+}
+
+.allListTable tr td {
+  padding: 0 5px;
+}
+
+.allListTable_1 {
+  width: 100%;
+  text-align: center;
+  border-collapse: collapse;
+  line-height: 20px;
+  font-size: 14px;
+  border-color: #000;
+  text-align: left;
+}
+
+.allListTable_1 tr td {
+  padding: 0 5px;
+}
+
+.tableBottom {
+  font-size: 16px;
+  display: flex;
+  margin-top: 20px;
+}
+
+.tableBottomOne {
+  margin-right: 40px;
+}
+
+</style>

src/xt_pages/hospitalStation/pastQuiriesPrint/hospitalListPrint.vue

@@ -0,0 +1,396 @@
+<template>
+  <div>
+    <template>
+      <el-button
+        style="position:fixed;right:25px;z-index:999"
+        size="small"
+        icon="el-icon-printer"
+        @click="printThisPage"
+        type="primary"
+      >打印
+      </el-button
+      >
+    </template>
+
+    <div class='dialysisPage' style="padding-top:40px;">
+      <hospital-list-print-one :list="list" :patient="patient" :record="record" :admin="admin"></hospital-list-print-one>
+    </div>
+  </div>
+</template>
+
+<script>
+import { getHospitalUnChargeList } from '@/api/his/his'
+import { uParseTime } from '@/utils/tools'
+import HospitalListPrintOne from './hospitalListPrintOne.vue'
+export default {
+  name: 'hospitalListPrint',
+  components: {
+    HospitalListPrintOne
+
+  },
+  props: {
+    paramsObj: Object
+  },
+  data() {
+    return {
+      list: [],
+      patient:{},
+      order:{},
+      admin:{},
+      record:{},
+    }
+  },
+  created() {
+    this.getInfo(this.paramsObj.patient_id,this.paramsObj.record_date)
+  },
+
+  methods: {
+    getTimes(time) {
+      return uParseTime(time, '{y}-{m}-{d} {h}:{i}')
+    },
+    getInfo(patient_id,record_date) {
+      let params = {
+        patient_id: patient_id,
+        record_date: record_date,
+        admin_user_id:this.$store.getters.xt_user.user.id,
+        p_type:1,
+      }
+      getHospitalUnChargeList(params).then(response => {
+        if (response.data.state == 0) {
+          this.$message.error(response.data.msg)
+          return false
+        } else {
+          this.patient = response.data.data.xt_info
+          this.record = response.data.data.record
+          this.admin = response.data.data.admin_info
+          this.list = []
+          for (let i = 0; i < response.data.data.prescription.length; i++) {
+            if(response.data.data.prescription[i].type == 1){
+              var infos = response.data.data.prescription[i]
+              for(let b = 0; b < infos.advices.length; b++){
+                let obj = {
+                  med_chrgitm_type: this.getType(1),
+                  price: infos.advices[b].price,
+                  count: infos.advices[b].prescribing_number,
+                  p_time:this.getTimes(infos.advices[b].created_time),
+                  name: infos.advices[b].advice_name,
+                  spec: infos.advices[b].drug.drug_spec,
+                  unit: infos.advices[b].prescribing_number_unit,
+                  feedetl_sn:infos.advices[b].feedetl_sn
+                }
+                this.list.push(obj)
+              }
+            }
+          }
+          for (let i = 0; i < response.data.data.prescription.length; i++) {
+            if(response.data.data.prescription[i].type == 2){
+              var infos = response.data.data.prescription[i]
+              for(let b = 0; b < infos.project.length; b++){
+                if(infos.project[b].type == 2){
+                  let obj = {
+                    med_chrgitm_type: this.getType(infos.project[b].project.cost_classify),
+                    price: infos.project[b].price,
+                    count: infos.project[b].count,
+                    p_time:this.getTimes(infos.project[b].ctime),
+                    name: infos.project[b].project.project_name,
+                    spec: "",
+                    unit: infos.project[b].project.unit,
+                    feedetl_sn:infos.project[b].feedetl_sn
+
+                  }
+                  this.list.push(obj)
+                }else{
+                  let obj = {
+                    med_chrgitm_type: this.getType(5),
+                    price: infos.project[b].price,
+                    count: infos.project[b].count,
+                    p_time:this.getTimes(infos.project[b].ctime),
+                    name: infos.project[b].good_info.good_name,
+                    spec: infos.project[b].good_info.specification_name,
+                    unit: infos.project[b].good_info.packing_unit,
+                    feedetl_sn:infos.project[b].feedetl_sn
+
+                  }
+                  this.list.push(obj)
+                }
+              }
+            }
+
+          }
+          this.list.sort(function(a, b) {
+            return b.p_time < a.p_time ? 1 : -1
+          })
+        }
+      })
+    },
+
+    getType(med_chrgitm_type) {
+      switch (med_chrgitm_type) {
+        case 1:
+          return '西药费';
+        case 2:
+          return '治疗费';
+        case 3:
+          return '检验费';
+          break;
+        case 4:
+          return '心电图费';
+          break;
+        case 5:
+          return '耗材费';
+          break;
+        case 6:
+          return '护理费';
+          break;
+        case 7:
+          return '放射费';
+          break;
+        case 8:
+          return '检查费';
+          break;
+        case 9:
+          return '超声费';
+          break;
+        case 10:
+          return '麻醉费';
+          break;
+        case 11:
+          return '手术费';
+          break;
+        case 12:
+          return '其他费';
+          break;
+        case 13:
+          return '床位费';
+          break;
+        case 14:
+          return '化验费';
+          break;
+        case 15:
+          return '诊察费';
+          break;
+
+      }
+
+    },
+    printThisPage() {
+      const style =
+        '@media print {.allListTitle{font-size: 24px;text-align: center;font-weight: bold;margin-bottom: 10px;}.allListInfo{display: flex;font-size: 16px;justify-content: space-between;margin: 10px 0;} .listTable{width: 100%;text-align: center;border-collapse: collapse;line-height: 20px;font-size: 14px;border-color: #000;text-align:left;}  .listTable tr td {padding: 0 5px;}.tableBottom{font-size: 16px;display: flex;margin-top: 10px;}.tableBottomOne{margin-right: 40px;} .allListTable{border: none;width: 100%;text-align: center;border-collapse: collapse;line-height: 20px;font-size: 14px;border-color: #000;text-align:left;} .allListTable tr{page-break-inside:avoid;} .allListTable tr td {padding: 0 5px;border: 1px solid #000;}.tableBottom{font-size: 16px;display: flex;margin-top: 20px;}.tableBottomOne{margin-right: 40px;}}'
+      printJS({
+        printable: 'allList-print',
+        type: 'html',
+        style: style,
+        scanStyles: false
+      })
+
+
+      // if (this.org_template_info.template_id == 1) {
+      //   printJS({
+      //     printable: "dialysis-print-box",
+      //     type: "html",
+      //     style: style,
+      //     scanStyles: false
+      //   });
+      // }
+    }
+  },
+  watch:{
+    paramsObj:{//深度监听，可监听到对象、数组的变化
+      handler(val, oldVal){
+        this.getInfo(val.patient_id,val.record_date)
+      },
+      deep:true
+    }
+  }
+
+}
+</script>
+
+<style>
+.dialysis-print-order {
+  width: 960px;
+  margin: 0 auto;
+}
+
+.dialysis-print-order .order-yy-name {
+  margin: auto;
+  text-align: center;
+  font-size: 20px;
+  letter-spacing: 5px;
+}
+
+.dialysis-print-order .order-title {
+  margin: auto;
+  font-weight: 600;
+  text-align: center;
+  font-size: 22px;
+  padding: 10px;
+}
+
+.dialysis-print-order .table-box {
+  width: 100%;
+  line-height: 23px;
+  font-size: 14px;
+}
+
+.dialysis-print-order .print-table {
+  width: 100%;
+  text-align: center;
+  border-collapse: collapse;
+  line-height: 40px;
+  font-size: 14px;
+  border-color: #000;
+}
+
+.dialysis-print-order .print-table-no {
+  width: 100%;
+  text-align: center;
+  border-collapse: collapse;
+  font-size: 14px;
+}
+
+.dialysis-print-order .under-line {
+  border-bottom: 1px solid #999;
+  width: 95%;
+  text-align: center;
+  margin-left: 2px;
+}
+
+.dialysis-print-order .title-box {
+  text-align: center;
+  font-size: 16px;
+}
+
+.dialysis-print-order .radio-lebel-box {
+  font-weight: 400;
+  cursor: pointer;
+}
+
+.dialysis-print-order .radio-no {
+  opacity: 0;
+  outline: none;
+  position: absolute;
+  margin: 0;
+  width: 0;
+  height: 0;
+  z-index: -1;
+}
+
+.dialysis-print-order .radio-inner {
+  white-space: nowrap;
+  cursor: pointer;
+  outline: none;
+  display: inline-block;
+  line-height: 1;
+  position: relative;
+  vertical-align: middle;
+}
+
+.dialysis-print-order .radio-fang {
+  display: inline-block;
+  position: relative;
+  border: 1px solid #000;
+  box-sizing: border-box;
+  width: 14px;
+  height: 14px;
+  background-color: #fff;
+  z-index: 1;
+  transition: border-color 0.25s cubic-bezier(0.71, -0.46, 0.29, 1.46),
+  background-color 0.25s cubic-bezier(0.71, -0.46, 0.29, 1.46);
+}
+
+.dialysis-print-order .is-checked-radio::after {
+  content: "√";
+  font-size: 15px;
+}
+
+.dialysis-print-order .print-table-no tr td {
+  padding: 8px 5px;
+  line-height: 25px;
+}
+
+.dialysis-print-order .print-table tr td {
+  padding: 1px 1px;
+  /*line-height: 25px;*/
+}
+
+.es-img {
+  height: 30px;
+}
+
+.advice-name {
+  text-align: left;
+}
+
+.advice-children {
+  display: flex;
+}
+
+.title-box-pro {
+  border: 0 #fff;
+  line-height: 25px;
+  height: 25px;
+  text-align: left;
+  padding-left: 10px !important;
+}
+
+.title-box-pro-tr {
+  border: 0 #fff;
+}
+
+.text-align-left {
+  text-align: left !important;
+  padding-left: 10px !important;
+  font-size: 14px !important;
+  line-height: 25px;
+}
+
+.print-table-tr-new td {
+  line-height: 20px !important;
+}
+
+.border-top-solid {
+  border: solid 1px #000;
+}
+
+.print-template-two tr {
+  line-height: 30px;
+}
+
+.table-box1 {
+  border: 1px solid #000;
+  width: 100%;
+  line-height: 30px;
+  font-size: 14px;
+  border-collapse: collapse;
+}
+
+.table-box1 tr {
+  border-bottom: 1px solid #000;
+}
+</style>
+
+<style lang="scss">
+
+.newContainer {
+
+.dialysisPage::-webkit-scrollbar {
+  height: 15px;
+}
+
+.el-date-editor {
+
+.el-input__inner {
+  padding-right: 0px;
+}
+
+}
+.el-table td, .el-table th {
+  text-align: center;
+}
+
+}
+.newContainer::-webkit-scrollbar {
+  height: 15px !important;
+}
+</style>

src/xt_pages/hospitalStation/pastQuiriesPrint/hospitalListPrintOne.vue

@@ -0,0 +1,318 @@
+<template>
+  <div id="allList-print" class="allList-print">
+    <table
+      class="listTable"
+      border="0"
+      cellspacing="0"
+      style="font-size: 14px"
+      align="center"
+    >
+      <THEAD
+        style="
+          display: table-header-group;
+          font-weight: bold;
+        "
+      >
+      <TR>
+        <TD colspan="3" align="center" style="font-size: 20px">
+          {{ $store.getters.xt_user.org.org_name }}费用清单
+        </TD>
+      </TR>
+      <TR>
+        <TD colspan="1">患者姓名：{{ patient.name }}</TD>
+        <TD>性别：{{ patient.gender == 1 ? "男" : "女" }}</TD>
+        <!--        <TD>年龄：{{ // getAge(patient.id_card_no)?getAge(patient.id_card_no)+'岁':''}}</TD>-->
+        <TD
+        >结算类型：{{record.balance_accounts_type == 2?'自费':"医保"
+          }}</TD
+        >
+      </TR>
+      <TR>
+        <TD> 住院/门诊号：{{ record.number }} </TD>
+        <TD>科室：血透 </TD>
+        <TD>就诊流水号：{{ record.number }}</TD>
+      </TR>
+      <TR>
+        <TD> 总费用：{{ getTotal(list)  }} </TD>
+        <TD>个人支付： </TD>
+        <TD>基金支付记账：</TD>
+      </TR>
+      <TR>
+        <TD>补充医疗支付记账</TD>
+        <TD>救助支付金额：</TD>
+        <TD></TD>
+      </TR>
+      </THEAD>
+
+      <TBODY style="text-align: center">
+      <TR>
+        <TD colspan="3">
+          <Table class="allListTable" border="1">
+            <TR>
+              <TD style="width: 5%">序号</TD>
+              <TD style="width: 15%">处方日期</TD>
+              <TD style="width: 10%">费用编号</TD>
+              <TD style="width: 40%">费用名称</TD>
+              <TD style="width: 5%">单位</TD>
+              <TD style="width: 5%">数量</TD>
+              <TD style="width: 10%">单价</TD>
+              <TD style="width: 10%">金额</TD>
+            </TR>
+            <template v-for="(item, index) in list">
+              <tr >
+                <td style="width: 5%">{{ index + 1 }}</td>
+                <td style="width: 15%">{{ item.p_time }}</td>
+                <td style="width: 10%">
+                  {{ item.feedetl_sn.split("-")[2] }}
+                </td>
+                <td style="width: 30%; white-space: nowrap; overflow: hidden">
+                  {{ item.name }}{{ item.spec }}
+                </td>
+                <td style="width: 5%">{{ item.unit }}</td>
+                <td style="width: 5%; text-align: right">{{ item.count }}</td>
+                <td style="width: 10%; text-align: right">
+                  {{ item.price }}
+                </td>
+                <td style="width: 10%; text-align: right">
+                  {{ (item.price * item.count).toFixed(2) }}
+                </td>
+              </tr>
+            </template>
+            <tr >
+              <td style="width: 5%"></td>
+              <td style="width: 15%"></td>
+              <td style="width: 10%"></td>
+              <td style="width: 30%; white-space: nowrap; overflow: hidden">
+                {{"合计"}}
+              </td>
+              <td style="width: 5%"></td>
+              <td style="width: 5%"></td>
+              <td style="width: 10%; text-align: right"></td>
+              <td style="width: 10%; text-align: right">
+                {{ getTotal(list) }}
+              </td>
+            </tr>
+
+          </Table>
+        </TD>
+      </TR>
+      </TBODY>
+    </table>
+    <!-- <div class="allListTitle">
+
+    </div> -->
+    <!-- <div class="allListInfo">
+      <div style="text-align: left">患者姓名：{{ patient.name }}</div>
+      <div style="text-align: left; padding-left: -20px">
+        性别：{{ patient.gender == 1 ? "男" : "女" }}
+      </div>
+      <div style="text-align: left">
+        结算类型：{{ order.is_medicine_insurance == 1 ? "医保" : "自费" }}
+      </div>
+    </div>
+
+     <div class="allListInfo">
+      <div style="text-align: left">住院/门诊号：{{ order.mdtrt_id }}</div>
+      <div style="text-align: left">科室：血透</div>
+      <div style="text-align: left">就诊流水号：{{ order.mdtrt_id }}</div>
+    </div>
+
+    <div class="allListInfo">
+      <div style="text-align: left">总费用：{{ order.medfee_sumamt }}</div>
+      <div style="text-align: left">个人支付：{{ order.psn_part_amt }}</div>
+      <div style="text-align: left">
+        基金支付记账：{{ order.fund_pay_sumamt }}
+      </div>
+    </div>
+
+    <div class="allListInfo">
+      <div style="text-align: left">补充医疗支付记账：0.00</div>
+      <div style="text-align: left">救助支付金额：{{ order.maf_pay }}</div>
+      <div></div>
+    </div>-->
+  </div>
+</template>
+
+<script>
+import { uParseTime } from "@/utils/tools";
+
+export default {
+  props: {
+    list: {
+      type: Array,
+      default: function () {
+        return [];
+      },
+    },
+    patient: {
+      type: Object,
+      default: function () {
+        return {};
+      },
+    },
+    record: {
+      type: Object,
+      default: function () {
+        return {};
+      },
+    },
+    admin: {
+      type: Object,
+      default: function () {
+        return {};
+      },
+    },
+    hospital: {
+      type: Object,
+      default: function () {
+        return {};
+      },
+    },
+  },
+  data() {
+    return {
+      page: 1,
+      pageArr: [],
+    };
+  },
+  methods: {
+    getAge(val){
+      var thisLen = val.length;
+      var birth = "";
+      if (thisLen == 15) {
+        birth = "19" + val.substr(6, 6);
+      } else {
+        birth = val.substr(6, 8);
+      }
+      var birthTwo =
+        birth.substr(0, 4) +
+        "-" +
+        birth.substr(4, 2) +
+        "-" +
+        birth.substr(6, 2);
+      var age = this.jsGetAge(birthTwo, "-");
+      return age;
+    },
+
+    getNowTime: function () {
+      let dateTime;
+      let yy = new Date().getFullYear();
+      let mm = new Date().getMonth() + 1;
+      let dd = new Date().getDate();
+      let hh = new Date().getHours();
+      let mf =
+        new Date().getMinutes() < 10
+          ? "0" + new Date().getMinutes()
+          : new Date().getMinutes();
+      let ss =
+        new Date().getSeconds() < 10
+          ? "0" + new Date().getSeconds()
+          : new Date().getSeconds();
+      dateTime = yy + "-" + mm + "-" + dd + " " + hh + ":" + mf + ":" + ss;
+      return dateTime;
+    },
+    getTimes(time) {
+      return uParseTime(time, "{y}-{m}-{d}");
+    },
+    getTotal: function (items) {
+      let total = 0;
+      for (let i = 0; i < items.length; i++) {
+        total = total + (parseFloat(items[i].count) * parseFloat(items[i].price.toFixed(2)));
+      }
+      return total.toFixed(2);
+    },
+  },
+  watch: {
+    list: {
+      handler(newVal) {
+        // this.getPage()
+      },
+      deep: true,
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.allList-print {
+  -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.27),
+  0 0 60px rgba(0, 0, 0, 0.06) inset;
+  -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.27),
+  0 0 40px rgba(0, 0, 0, 0.06) inset;
+  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.27), 0 0 40px rgba(0, 0, 0, 0.06) inset;
+  margin-bottom: 20px;
+  padding: 20px 10px;
+}
+
+.allListTitle {
+  font-size: 24px;
+  text-align: center;
+  font-weight: bold;
+  margin-bottom: 10px;
+}
+
+.allListInfo {
+  display: flex;
+  font-size: 16px;
+  justify-content: space-between;
+  margin: 10px 0;
+}
+
+.allListInfo div {
+  min-width: 200px;
+}
+
+.allListTable {
+  width: 100%;
+  text-align: center;
+  border-collapse: collapse;
+  line-height: 20px;
+  font-size: 14px;
+  border-color: #000;
+  text-align: left;
+}
+
+.allListTable tr td {
+  padding: 0 5px;
+}
+
+.tableBottom {
+  font-size: 16px;
+  display: flex;
+  margin-top: 20px;
+}
+
+.tableBottomOne {
+  margin-right: 40px;
+}
+
+.listTable {
+  width: 100%;
+  text-align: center;
+  border-collapse: collapse;
+  line-height: 40px;
+  font-size: 14px;
+  border-color: #000;
+  text-align: left;
+}
+.listTable thead {
+  width: 100%;
+  text-align: center;
+  border-collapse: collapse;
+  line-height: 40px;
+  font-size: 14px;
+  border-color: #000;
+  text-align: left;
+}
+.listTable thead tr td {
+  padding: 0 5px;
+}
+.tableBottom {
+  font-size: 16px;
+  display: flex;
+  margin-top: 20px;
+}
+.tableBottomOne {
+  margin-right: 40px;
+}
+</style>

src/xt_pages/hospitalStation/statementPrint.vue

@@ -23,6 +23,9 @@
 <!--      <print-one :info="info" ></print-one>-->
       <hospital-settle-print :info="info" :list="list"></hospital-settle-print>
     </div>
+    <div class='dialysisPage' style="padding-top:40px;" v-if="this.$store.getters.xt_user.org_id != 10215 && this.paramsObj.balance_accounts_type == 2 && this.$store.getters.xt_user.org_id != 10265">
+    <private-charge-print :info="info" ></private-charge-print>
+    </div>
 
 <!--    <div class='dialysisPage' style="padding-top:40px;" v-else>-->
 <!--      <private-charge-print :info="info" v-if="this.paramsObj.balance_accounts_type == 2"></private-charge-print>-->

src/xt_pages/outpatientCharges/components/registerDialog9504.vue

@@ -102,6 +102,19 @@
           </el-option>
         </el-select>
       </el-form-item>
+      <el-form-item label="参保地：">
+        <el-autocomplete
+          popper-class="my-autocomplete"
+          v-model="form.insuplc_admdvs"
+          :fetch-suggestions="querySearch"
+          placeholder="请输入内容"
+          @select="handleSelectTwo">
+
+          <template slot-scope="{ item }">
+            <div class="id">{{ item.id }}{{ item.name }}</div>
+          </template>
+        </el-autocomplete>
+      </el-form-item>
 
 
       <el-form-item label="读卡类型：" prop="id_card_type">
@@ -188,6 +201,385 @@
     data() {
 
       return {
+        area:[
+          {id:110000,name:"北京市"},
+          {id:120000,name:"天津市"},
+          {id:130000,name:"河北省"},
+          {id:130100,name:"石家庄市"},
+          {id:130200,name:"唐山市"},
+          {id:130300,name:"秦皇岛市"},
+          {id:130400,name:"邯郸市"},
+          {id:130500,name:"邢台市"},
+          {id:130600,name:"保定市"},
+          {id:130700,name:"张家口市"},
+          {id:130800,name:"承德市"},
+          {id:130900,name:"沧州市"},
+          {id:131000,name:"廊坊市"},
+          {id:131100,name:"衡水市"},
+          {id:140000,name:"山西省"},
+          {id:140100,name:"太原市"},
+          {id:140200,name:"大同市"},
+          {id:140300,name:"阳泉市"},
+          {id:140400,name:"长治市"},
+          {id:140500,name:"晋城市"},
+          {id:140600,name:"朔州市"},
+          {id:140700,name:"晋中市"},
+          {id:140800,name:"运城市"},
+          {id:140900,name:"忻州市"},
+          {id:141000,name:"临汾市"},
+          {id:141100,name:"吕梁市"},
+          {id:150000,name:"内蒙古自治区"},
+          {id:150100,name:"呼和浩特市"},
+          {id:150200,name:"包头市"},
+          {id:150300,name:"乌海市"},
+          {id:150400,name:"赤峰市"},
+          {id:150500,name:"通辽市"},
+          {id:150600,name:"鄂尔多斯市"},
+          {id:150700,name:"呼伦贝尔市"},
+          {id:150800,name:"巴彦淖尔市"},
+          {id:150900,name:"乌兰察布市"},
+          {id:152200,name:"兴安盟"},
+          {id:152500,name:"锡林郭勒盟"},
+          {id:152900,name:"阿拉善盟"},
+          {id:210000,name:"辽宁省"},
+          {id:210100,name:"沈阳市"},
+          {id:210200,name:"大连市"},
+          {id:210300,name:"鞍山市"},
+          {id:210400,name:"抚顺市"},
+          {id:210500,name:"本溪市"},
+          {id:210600,name:"丹东市"},
+          {id:210700,name:"锦州市"},
+          {id:210800,name:"营口市"},
+          {id:210900,name:"阜新市"},
+          {id:211000,name:"辽阳市"},
+          {id:211100,name:"盘锦市"},
+          {id:211200,name:"铁岭市"},
+          {id:211300,name:"朝阳市"},
+          {id:211400,name:"葫芦岛市"},
+          {id:220000,name:"吉林省"},
+          {id:220100,name:"长春市"},
+          {id:220200,name:"吉林市"},
+          {id:220300,name:"四平市"},
+          {id:220400,name:"辽源市"},
+          {id:220500,name:"通化市"},
+          {id:220600,name:"白山市"},
+          {id:220700,name:"松原市"},
+          {id:220800,name:"白城市"},
+          {id:222400,name:"延边朝鲜族自治州"},
+          {id:230000,name:"黑龙江省"},
+          {id:230100,name:"哈尔滨市"},
+          {id:230200,name:"齐齐哈尔市"},
+          {id:230300,name:"鸡西市"},
+          {id:230400,name:"鹤岗市"},
+          {id:230500,name:"双鸭山市"},
+          {id:230600,name:"大庆市"},
+          {id:230700,name:"伊春市"},
+          {id:230800,name:"佳木斯市"},
+          {id:230900,name:"七台河市"},
+          {id:231000,name:"牡丹江市"},
+          {id:231100,name:"黑河市"},
+          {id:231200,name:"绥化市"},
+          {id:232700,name:"大兴安岭地区"},
+          {id:310000,name:"上海市"},
+          {id:320000,name:"江苏省"},
+          {id:320100,name:"南京市"},
+          {id:320200,name:"无锡市"},
+          {id:320300,name:"徐州市"},
+          {id:320400,name:"常州市"},
+          {id:320500,name:"苏州市"},
+          {id:320600,name:"南通市"},
+          {id:320700,name:"连云港市"},
+          {id:320800,name:"淮安市"},
+          {id:320900,name:"盐城市"},
+          {id:321000,name:"扬州市"},
+          {id:321100,name:"镇江市"},
+          {id:321200,name:"泰州市"},
+          {id:321300,name:"宿迁市"},
+          {id:330000,name:"浙江省"},
+          {id:330100,name:"杭州市"},
+          {id:330200,name:"宁波市"},
+          {id:330300,name:"温州市"},
+          {id:330400,name:"嘉兴市"},
+          {id:330500,name:"湖州市"},
+          {id:330600,name:"绍兴市"},
+          {id:330700,name:"金华市"},
+          {id:330800,name:"衢州市"},
+          {id:330900,name:"舟山市"},
+          {id:331000,name:"台州市"},
+          {id:331100,name:"丽水市"},
+          {id:340000,name:"安徽省"},
+          {id:340100,name:"合肥市"},
+          {id:340200,name:"芜湖市"},
+          {id:340300,name:"蚌埠市"},
+          {id:340400,name:"淮南市"},
+          {id:340500,name:"马鞍山市"},
+          {id:340600,name:"淮北市"},
+          {id:340700,name:"铜陵市"},
+          {id:340800,name:"安庆市"},
+          {id:341000,name:"黄山市"},
+          {id:341100,name:"滁州市"},
+          {id:341200,name:"阜阳市"},
+          {id:341300,name:"宿州市"},
+          {id:341500,name:"六安市"},
+          {id:341600,name:"亳州市"},
+          {id:341700,name:"池州市"},
+          {id:341800,name:"宣城市"},
+          {id:350000,name:"福建省"},
+          {id:350100,name:"福州市"},
+          {id:350200,name:"厦门市"},
+          {id:350300,name:"莆田市"},
+          {id:350400,name:"三明市"},
+          {id:350500,name:"泉州市"},
+          {id:350600,name:"漳州市"},
+          {id:350700,name:"南平市"},
+          {id:350800,name:"龙岩市"},
+          {id:350900,name:"宁德市"},
+          {id:360000,name:"江西省"},
+          {id:360100,name:"南昌市"},
+          {id:360200,name:"景德镇市"},
+          {id:360300,name:"萍乡市"},
+          {id:360400,name:"九江市"},
+          {id:360500,name:"新余市"},
+          {id:360600,name:"鹰潭市"},
+          {id:360700,name:"赣州市"},
+          {id:360800,name:"吉安市"},
+          {id:360900,name:"宜春市"},
+          {id:361000,name:"抚州市"},
+          {id:361100,name:"上饶市"},
+          {id:370000,name:"山东省"},
+          {id:370100,name:"济南市"},
+          {id:370200,name:"青岛市"},
+          {id:370300,name:"淄博市"},
+          {id:370400,name:"枣庄市"},
+          {id:370500,name:"东营市"},
+          {id:370600,name:"烟台市"},
+          {id:370700,name:"潍坊市"},
+          {id:370800,name:"济宁市"},
+          {id:370900,name:"泰安市"},
+          {id:371000,name:"威海市"},
+          {id:371100,name:"日照市"},
+          {id:371300,name:"临沂市"},
+          {id:371400,name:"德州市"},
+          {id:371500,name:"聊城市"},
+          {id:371600,name:"滨州市"},
+          {id:371700,name:"菏泽市"},
+          {id:410000,name:"河南省"},
+          {id:410100,name:"郑州市"},
+          {id:410200,name:"开封市"},
+          {id:410300,name:"洛阳市"},
+          {id:410400,name:"平顶山市"},
+          {id:410500,name:"安阳市"},
+          {id:410600,name:"鹤壁市"},
+          {id:410700,name:"新乡市"},
+          {id:410800,name:"焦作市"},
+          {id:410900,name:"濮阳市"},
+          {id:411000,name:"许昌市"},
+          {id:411100,name:"漯河市"},
+          {id:411200,name:"三门峡市"},
+          {id:411300,name:"南阳市"},
+          {id:411400,name:"商丘市"},
+          {id:411500,name:"信阳市"},
+          {id:411600,name:"周口市"},
+          {id:411700,name:"驻马店市"},
+          {id:420000,name:"湖北省"},
+          {id:420100,name:"武汉市"},
+          {id:420200,name:"黄石市"},
+          {id:420300,name:"十堰市"},
+          {id:420500,name:"宜昌市"},
+          {id:420600,name:"襄阳市"},
+          {id:420700,name:"鄂州市"},
+          {id:420800,name:"荆门市"},
+          {id:420900,name:"孝感市"},
+          {id:421000,name:"荆州市"},
+          {id:421100,name:"黄冈市"},
+          {id:421200,name:"咸宁市"},
+          {id:421300,name:"随州市"},
+          {id:422800,name:"恩施土家族苗族自治州"},
+          {id:430000,name:"湖南省"},
+          {id:430100,name:"长沙市"},
+          {id:430200,name:"株洲市"},
+          {id:430300,name:"湘潭市"},
+          {id:430400,name:"衡阳市"},
+          {id:430500,name:"邵阳市"},
+          {id:430600,name:"岳阳市"},
+          {id:430700,name:"常德市"},
+          {id:430800,name:"张家界市"},
+          {id:430900,name:"益阳市"},
+          {id:431000,name:"郴州市"},
+          {id:431100,name:"永州市"},
+          {id:431200,name:"怀化市"},
+          {id:431300,name:"娄底市"},
+          {id:433100,name:"湘西土家族苗族自治州"},
+          {id:440000,name:"广东省"},
+          {id:440100,name:"广州市"},
+          {id:440200,name:"韶关市"},
+          {id:440300,name:"深圳市"},
+          {id:440400,name:"珠海市"},
+          {id:440500,name:"汕头市"},
+          {id:440600,name:"佛山市"},
+          {id:440700,name:"江门市"},
+          {id:440800,name:"湛江市"},
+          {id:440900,name:"茂名市"},
+          {id:441200,name:"肇庆市"},
+          {id:441300,name:"惠州市"},
+          {id:441400,name:"梅州市"},
+          {id:441500,name:"汕尾市"},
+          {id:441600,name:"河源市"},
+          {id:441700,name:"阳江市"},
+          {id:441800,name:"清远市"},
+          {id:441900,name:"东莞市"},
+          {id:442000,name:"中山市"},
+          {id:445100,name:"潮州市"},
+          {id:445200,name:"揭阳市"},
+          {id:445300,name:"云浮市"},
+          {id:450000,name:"广西壮族自治区"},
+          {id:450100,name:"南宁市"},
+          {id:450200,name:"柳州市"},
+          {id:450300,name:"桂林市"},
+          {id:450400,name:"梧州市"},
+          {id:450500,name:"北海市"},
+          {id:450600,name:"防城港市"},
+          {id:450700,name:"钦州市"},
+          {id:450800,name:"贵港市"},
+          {id:450900,name:"玉林市"},
+          {id:451000,name:"百色市"},
+          {id:451100,name:"贺州市"},
+          {id:451200,name:"河池市"},
+          {id:451300,name:"来宾市"},
+          {id:451400,name:"崇左市"},
+          {id:460000,name:"海南省"},
+          {id:460100,name:"海口市"},
+          {id:460200,name:"三亚市"},
+          {id:460300,name:"三沙市"},
+          {id:460400,name:"儋州市"},
+          {id:500000,name:"重庆市"},
+          {id:510000,name:"四川省"},
+          {id:510100,name:"成都市"},
+          {id:510300,name:"自贡市"},
+          {id:510400,name:"攀枝花市"},
+          {id:510500,name:"泸州市"},
+          {id:510600,name:"德阳市"},
+          {id:510700,name:"绵阳市"},
+          {id:510800,name:"广元市"},
+          {id:510900,name:"遂宁市"},
+          {id:511000,name:"内江市"},
+          {id:511100,name:"乐山市"},
+          {id:511300,name:"南充市"},
+          {id:511400,name:"眉山市"},
+          {id:511500,name:"宜宾市"},
+          {id:511600,name:"广安市"},
+          {id:511700,name:"达州市"},
+          {id:511800,name:"雅安市"},
+          {id:511900,name:"巴中市"},
+          {id:512000,name:"资阳市"},
+          {id:513200,name:"阿坝藏族羌族自治州"},
+          {id:513300,name:"甘孜藏族自治州"},
+          {id:513400,name:"凉山彝族自治州"},
+          {id:520000,name:"贵州省"},
+          {id:520100,name:"贵阳市"},
+          {id:520200,name:"六盘水市"},
+          {id:520300,name:"遵义市"},
+          {id:520400,name:"安顺市"},
+          {id:520500,name:"毕节市"},
+          {id:520600,name:"铜仁市"},
+          {id:522300,name:"黔西南布依族苗族自治州"},
+          {id:522600,name:"黔东南苗族侗族自治州"},
+          {id:522700,name:"黔南布依族苗族自治州"},
+          {id:530000,name:"云南省"},
+          {id:530100,name:"昆明市"},
+          {id:530300,name:"曲靖市"},
+          {id:530400,name:"玉溪市"},
+          {id:530500,name:"保山市"},
+          {id:530600,name:"昭通市"},
+          {id:530700,name:"丽江市"},
+          {id:530800,name:"普洱市"},
+          {id:530900,name:"临沧市"},
+          {id:532300,name:"楚雄彝族自治州"},
+          {id:532500,name:"红河哈尼族彝族自治州"},
+          {id:532600,name:"文山壮族苗族自治州"},
+          {id:532800,name:"西双版纳傣族自治州"},
+          {id:532900,name:"大理白族自治州"},
+          {id:533100,name:"德宏傣族景颇族自治州"},
+          {id:533300,name:"怒江傈僳族自治州"},
+          {id:533400,name:"迪庆藏族自治州"},
+          {id:540000,name:"西藏自治区"},
+          {id:540100,name:"拉萨市"},
+          {id:540200,name:"日喀则市"},
+          {id:540300,name:"昌都市"},
+          {id:540400,name:"林芝市"},
+          {id:540500,name:"山南市"},
+          {id:540600,name:"那曲市"},
+          {id:542500,name:"阿里地区"},
+          {id:610000,name:"陕西省"},
+          {id:610100,name:"西安市"},
+          {id:610200,name:"铜川市"},
+          {id:610300,name:"宝鸡市"},
+          {id:610400,name:"咸阳市"},
+          {id:610500,name:"渭南市"},
+          {id:610600,name:"延安市"},
+          {id:610700,name:"汉中市"},
+          {id:610800,name:"榆林市"},
+          {id:610900,name:"安康市"},
+          {id:611000,name:"商洛市"},
+          {id:620000,name:"甘肃省"},
+          {id:620100,name:"兰州市"},
+          {id:620200,name:"嘉峪关市"},
+          {id:620300,name:"金昌市"},
+          {id:620400,name:"白银市"},
+          {id:620500,name:"天水市"},
+          {id:620600,name:"武威市"},
+          {id:620700,name:"张掖市"},
+          {id:620800,name:"平凉市"},
+          {id:620900,name:"酒泉市"},
+          {id:621000,name:"庆阳市"},
+          {id:621100,name:"定西市"},
+          {id:621200,name:"陇南市"},
+          {id:622900,name:"临夏回族自治州"},
+          {id:623000,name:"甘南藏族自治州"},
+          {id:630000,name:"青海省"},
+          {id:630100,name:"西宁市"},
+          {id:630200,name:"海东市"},
+          {id:632200,name:"海北藏族自治州"},
+          {id:632300,name:"黄南藏族自治州"},
+          {id:632500,name:"海南藏族自治州"},
+          {id:632600,name:"果洛藏族自治州"},
+          {id:632700,name:"玉树藏族自治州"},
+          {id:632800,name:"海西蒙古族藏族自治州"},
+          {id:640000,name:"宁夏回族自治区"},
+          {id:640100,name:"银川市"},
+          {id:640200,name:"石嘴山市"},
+          {id:640300,name:"吴忠市"},
+          {id:640400,name:"固原市"},
+          {id:640500,name:"中卫市"},
+          {id:650000,name:"新疆维吾尔自治区"},
+          {id:650100,name:"乌鲁木齐市"},
+          {id:650200,name:"克拉玛依市"},
+          {id:650400,name:"吐鲁番市"},
+          {id:650500,name:"哈密市"},
+          {id:652300,name:"昌吉回族自治州"},
+          {id:652700,name:"博尔塔拉蒙古自治州"},
+          {id:652800,name:"巴音郭楞蒙古自治州"},
+          {id:652900,name:"阿克苏地区"},
+          {id:653000,name:"克孜勒苏柯尔克孜自治州"},
+          {id:653100,name:"喀什地区"},
+          {id:653200,name:"和田地区"},
+          {id:654000,name:"伊犁哈萨克自治州"},
+          {id:654200,name:"塔城地区"},
+          {id:654300,name:"阿勒泰地区"},
+          {id:659001,name:"石河子市"},
+          {id:659002,name:"阿拉尔市"},
+          {id:659003,name:"图木舒克市"},
+          {id:659004,name:"五家渠市"},
+          {id:659005,name:"北屯市"},
+          {id:659006,name:"铁门关市"},
+          {id:659007,name:"双河市"},
+          {id:659008,name:"可克达拉市"},
+          {id:659009,name:"昆玉市"},
+          {id:710000,name:"台湾省"},
+          {id:810000,name:"香港特别行政区"},
+          {id:820000,name:"澳门特别行政区"}
+        ],
+
         read_loading:false,
         registers: [
           {value: 11, label: "普通门诊"},
@@ -215,6 +607,7 @@
 
         form: {
           id: '',
+          insuplc_admdvs:"",
           settlement_value: '',
           medical_insurance_card: '',
           name: '',
@@ -437,6 +830,23 @@
           })
           .catch(function(error) {
           })
+      },handleIconClick(){
+
+
+      },handleSelectTwo(item){
+          this.form.insuplc_admdvs = item.id
+
+      },  createFilter(queryString) {
+        console.log(queryString)
+        return (restaurant) => {
+          return (restaurant.name.indexOf(queryString) === 0 || restaurant.id.toString().indexOf(queryString) === 0);
+        };
+      }, querySearch(queryString, cb) {
+        var restaurants = this.area;
+        console.log(restaurants)
+        var results = queryString ? restaurants.filter(this.createFilter(queryString)) : restaurants;
+        console.log(results)
+        cb(results);
       },
       check14(){
         if(this.form.social_type == 0 || this.form.social_type == ''){
@@ -549,98 +959,103 @@
 
         }
         this.read_loading = true
-        axios.get('http://127.0.0.1:9532/api/readcard', {
-          params: params
-        })
-          .then(function (response) {
-            if (response.data.state == 0) {
-              that.read_loading = false
+        {
+          axios.get('http://127.0.0.1:9532/api/readcard', {
+            params: params
+          })
+            .then(function (response) {
+              if (response.data.state == 0) {
+                that.read_loading = false
 
-              that.$message.error(response.data.msg)
-              return false
-            } else {
-              that.read_loading = false
-              var patient = response.data.data.patient
-              if (that.form.id_card_type == 1) {
-                that.form.id = patient.id
-                that.form.name = patient.name
-                that.form.gender = patient.gender
-                that.form.age = patient.age
-                that.form.birthday = uParseTime(patient.birthday, '{y}-{m}-{d}')
-                that.form.phone = patient.phone
-                that.form.id_card = patient.id_card_no
-                that.form.medical_insurance_card = response.data.data.health_card_no
-
-                var thisLen = that.form.id_card.length
-                var birth = ''
-                if (thisLen == 15) {
-                  birth = '19' + that.form.id_card.substr(6, 6)
-                } else {
-                  birth = that.form.id_card.substr(6, 8)
-                }
-                var births =
-                  birth.substr(0, 4) +
-                  '-' +
-                  birth.substr(4, 2) +
-                  '-' +
-                  birth.substr(6, 2)
-                that.form.age = jsGetAge(births, '-')
-
-
-              } else if (that.form.id_card_type == 2) {
-                that.form.id = patient.id
-                that.form.name = patient.name
-                that.form.gender = patient.gender
-                that.form.age = patient.age
-                that.form.birthday = uParseTime(patient.birthday, '{y}-{m}-{d}')
-                that.form.phone = patient.phone
-                that.form.id_card = patient.id_card_no
-
-                var thisLen = that.form.id_card.length
-                var birth = ''
-                if (thisLen == 15) {
-                  birth = '19' + that.form.id_card.substr(6, 6)
-                } else {
-                  birth = that.form.id_card.substr(6, 8)
-                }
-                var births =
-                  birth.substr(0, 4) +
-                  '-' +
-                  birth.substr(4, 2) +
-                  '-' +
-                  birth.substr(6, 2)
-                that.form.age = jsGetAge(births, '-')
-              }else  {
-                that.form.id = patient.id
-                that.form.name = patient.name
-                that.form.gender = patient.gender
-                that.form.age = patient.age
-                that.form.birthday = uParseTime(patient.birthday, '{y}-{m}-{d}')
-                that.form.phone = patient.phone
-                that.form.id_card = patient.id_card_no
-
-                var thisLen = that.form.id_card.length
-                var birth = ''
-                if (thisLen == 15) {
-                  birth = '19' + that.form.id_card.substr(6, 6)
-                } else {
-                  birth = that.form.id_card.substr(6, 8)
-                }
-                var births =
+                that.$message.error(response.data.msg)
+                return false
+              } else {
+                that.read_loading = false
+                var patient = response.data.data.patient
+                if (that.form.id_card_type == 1) {
+                  that.form.id = patient.id
+                  that.form.name = patient.name
+                  that.form.gender = patient.gender
+                  that.form.age = patient.age
+                  that.form.birthday = uParseTime(patient.birthday, '{y}-{m}-{d}')
+                  that.form.phone = patient.phone
+                  that.form.id_card = patient.id_card_no
+                  that.form.medical_insurance_card = response.data.data.health_card_no
+
+                  var thisLen = that.form.id_card.length
+                  var birth = ''
+                  if (thisLen == 15) {
+                    birth = '19' + that.form.id_card.substr(6, 6)
+                  } else {
+                    birth = that.form.id_card.substr(6, 8)
+                  }
+                  var births =
                     birth.substr(0, 4) +
                     '-' +
                     birth.substr(4, 2) +
                     '-' +
                     birth.substr(6, 2)
-                that.form.age = jsGetAge(births, '-')
+                  that.form.age = jsGetAge(births, '-')
+
+
+                } else if (that.form.id_card_type == 2) {
+                  that.form.id = patient.id
+                  that.form.name = patient.name
+                  that.form.gender = patient.gender
+                  that.form.age = patient.age
+                  that.form.birthday = uParseTime(patient.birthday, '{y}-{m}-{d}')
+                  that.form.phone = patient.phone
+                  that.form.id_card = patient.id_card_no
+
+                  var thisLen = that.form.id_card.length
+                  var birth = ''
+                  if (thisLen == 15) {
+                    birth = '19' + that.form.id_card.substr(6, 6)
+                  } else {
+                    birth = that.form.id_card.substr(6, 8)
+                  }
+                  var births =
+                    birth.substr(0, 4) +
+                    '-' +
+                    birth.substr(4, 2) +
+                    '-' +
+                    birth.substr(6, 2)
+                  that.form.age = jsGetAge(births, '-')
+                }else  {
+                  that.form.id = patient.id
+                  that.form.name = patient.name
+                  that.form.gender = patient.gender
+                  that.form.age = patient.age
+                  that.form.birthday = uParseTime(patient.birthday, '{y}-{m}-{d}')
+                  that.form.phone = patient.phone
+                  that.form.id_card = patient.id_card_no
+
+                  var thisLen = that.form.id_card.length
+                  var birth = ''
+                  if (thisLen == 15) {
+                    birth = '19' + that.form.id_card.substr(6, 6)
+                  } else {
+                    birth = that.form.id_card.substr(6, 8)
+                  }
+                  var births =
+                    birth.substr(0, 4) +
+                    '-' +
+                    birth.substr(4, 2) +
+                    '-' +
+                    birth.substr(6, 2)
+                  that.form.age = jsGetAge(births, '-')
+                }
+                that.$message({message: '读卡成功', type: 'success'})
+
               }
-              that.$message({message: '读卡成功', type: 'success'})
+            })
+            .catch(function (error) {
 
-            }
-          })
-          .catch(function (error) {
+            });
+
+
+        }
 
-          });
 
 
       },

src/xt_pages/outpatientCharges/listPrint.vue

@@ -146,8 +146,8 @@
                   }
                 }
                 obj.total = this.getTotal(tempDetails)
-                obj.jiaTotal = this.getJiaTotal(tempDetails)
-                obj.yiTotal = this.getYiTotal(tempDetails)
+                obj.jiaTotal = this.getJiaTotal(tempDetails,this.hospital_record.balance_accounts_type)
+                obj.yiTotal = this.getYiTotal(tempDetails,this.hospital_record.balance_accounts_type)
                 obj.noMedicineTotal = this.getNoMedicineTotal(tempDetails)
                 obj.bingTotal = this.getBingTotal(tempDetails)
                 obj.otherTotal = this.getOtherTotal(tempDetails)

src/xt_pages/outpatientCharges/statementPrint.vue

@@ -40,7 +40,6 @@
           :paramsObj="paramsObj"
           :balanceAccounts="balanceAccounts"
         ></printFour>
-        <!--        <privateChargePrint  :info="info" v-if="org_id == 10215 && this.paramsObj.balance_accounts_type == 2"></privateChargePrint>-->
       </div>
       <!--      <print-other :info="info" v-if="org_id == 9919"></print-other>-->
       <!--      <printOne :info=" info" v-if="org_id == 10215 && this.paramsObj.balance_accounts_type == 2"></printOne>-->
@@ -65,8 +64,13 @@
             org_id != 9504 &&
             org_id != 10028 &&
             org_id != 0 &&
-            org_id != 10278 && org_id != 10387 && org_id != 0 && org_id != 10191 &&org_id != 10210"></printOne>
+            org_id != 10278 && org_id != 10387 && org_id != 0 && org_id != 10191 &&org_id != 10210 && this.paramsObj.balance_accounts_type == 1"></printOne>
 
+      <privateChargePrint  :info="info" v-if="org_id != 9990 &&
+            org_id != 10138 &&
+            org_id != 9504 &&
+            org_id != 10028 &&
+            org_id != 10278 && org_id != 10387 && org_id != 10191 &&org_id != 10210 && this.paramsObj.balance_accounts_type == 2"></privateChargePrint>
     </div>
   </div>
 </template>
@@ -75,11 +79,9 @@
   import {uParseTime} from "@/utils/tools";
   import axios from "axios";
   import print from "print-js";
-
   import BreadCrumb from "@/xt_pages/components/bread-crumb";
   import printOne from "./statementTemplate/printOne";
   import privateChargePrint from "./statementTemplate/privateChargePrint";
-
   import printTwo from "./statementTemplate/printTwo";
   import printThree from "./statementTemplate/printThree";
   import printFour from "./statementTemplate/printFour";
@@ -90,8 +92,6 @@
   import printSeven from "./statementTemplate/printSeven";
   import Print10191 from "./statementTemplate/print10191";
   import printTen from "./statementTemplate/printTen";
-
-  // import PrintOther from '../hospitalStation/statementTemplate/printOther'
   export default {
     name: "dialysisPrintOrder",
     components: {

src/xt_pages/outpatientCharges/statementTemplate/printOne.vue

@@ -42,7 +42,7 @@
         <td width="50" v-if="info.gend == '2'">女</td>
 
         <td width="80">出生日期</td>
-        <td width="100">{{info.brdy}}</td>
+        <td width="100">{{getBirth(info.certno)}}</td>
         <td width="90">个人电脑号</td>
         <td width="110"></td>
         <td width="80">人员类别</td>
@@ -114,11 +114,14 @@
         <td colspan="2" v-if="info.insutype == '392'">城乡居民大病医疗保险</td>
         <td colspan="2" v-if="info.insutype == '510'">生育保险</td>
 
-
-        <td>入院第一诊断</td>
-        <td colspan="3">{{info.dise_name}}</td>
-        <td>出院第一诊断</td>
-        <td colspan="6">{{info.dise_name}}</td>
+        <td v-if="this.$store.getters.xt_user.org_id != 10188 && this.$store.getters.xt_user.org_id != 10217">入院第一诊断</td>
+        <td v-else>病种名称</td>
+        <td v-if="this.$store.getters.xt_user.org_id != 10188 && this.$store.getters.xt_user.org_id != 10217" colspan="3">{{info.dise_name}}</td>
+        <td v-else colspan="3">{{'慢性肾功能衰竭'}}</td>
+        <td v-if="this.$store.getters.xt_user.org_id != 10188 && this.$store.getters.xt_user.org_id != 10217">出院第一诊断</td>
+        <td v-else>病种编码</td>
+        <td v-if="this.$store.getters.xt_user.org_id != 10188 && this.$store.getters.xt_user.org_id != 10217" colspan="6">{{info.dise_name}}</td>
+        <td v-else colspan="6">{{'M07800'}}</td>
       </tr>
       <tr>
         <td>业务类别</td>
@@ -135,9 +138,8 @@
       </tr>
       <tr>
         <td colspan="12" style="text-align:left;padding-left:10px;">
-          本次就医：总费用{{info.medfee_sumamt}}元，基金支付{{info.fund_pay_sumamt}}元，个人支付{{info.psn_pay}}元。
-          (起付线 {{info.act_pay_dedc}}元, 先自付 {{info.preselfpay_amt}}元, 段内自付 {{(info.psn_pay - info.preselfpay_amt).toFixed(2)}} )
-
+          本次就医：总费用{{info.medfee_sumamt}}元，基金支付{{info.fund_pay_sumamt}}元，个人支付{{info.new_order.psn_cash_pay}}元。
+          (起付线 {{info.act_pay_dedc}}元, 先自付 {{info.preselfpay_amt}}元, 段内自付 {{(info.new_order.psn_cash_pay - info.preselfpay_amt).toFixed(2)}} )
         </td>
       </tr>
       <tr>
@@ -264,11 +266,13 @@
           parseFloat(info.check_cost_part_self_total) + parseFloat(info.laboratory_cost_part_self_total) +
           parseFloat(info.treat_cost_part_self_total)).toFixed(2)}}
         </td>
-        <td style="text-align:right;padding-right:10px;"></td>
+
+        <td>报销比例</td>
+        <td colspan="2" style="text-align:right;padding-right:10px;">{{info.new_order.pool_prop_selfpay}}</td>
         <td colspan="2" style="text-align:right;padding-right:10px;"></td>
-        <td style="text-align:right;padding-right:10px;"></td>
         <td colspan="2" style="text-align:right;padding-right:10px;"></td>
       </tr>
+
       <tr>
         <td colspan="3" style="text-align:left;padding-left:10px;">基本医疗保险统筹基金支付</td>
         <td colspan="3">{{info.hifp_pay}}</td>
@@ -340,6 +344,12 @@
         }
       }
     },methods:{
+      getBirth(idNo){
+        var year = idNo.substring(6, 10);
+        var month = idNo.substring(10, 12);
+        var day = idNo.substring(12, 14);
+        return  year + '-' + month + '-' + day;
+      },
       getDay(dateString1,dateString2){
           var  startDate = Date.parse(dateString1);
           var  endDate = Date.parse(dateString2);

src/xt_pages/outpatientDoctorStation/doctorDesk.vue

@@ -165,7 +165,7 @@
                            :org_id="org_id"
                            ref="prescriptions" :prescriptions="prescriptions" :patientInfo="patientInfo"
                            v-on:getSunziValue = "getSunziValue"
-                           :hisPatientInfo="hisPatientInfo" :patient_diagnoses="patient_diagnoses" @event1="changetwo($event)" @editKeepLoad="editKeepLoad"
+                           :hisPatientInfo="hisPatientInfo" @event1="changetwo($event)" @editKeepLoad="editKeepLoad"
                            v-if="titleType == '电子处方'" style="flex:1;"></desk-prescription>
 
 
@@ -1470,7 +1470,7 @@ export default {
         'type': this.radio,
         'sch_type': this.schedule_type
       }
-      
+
       this.un_cure_data = []
       this.cure_data = []
       this.all_data = []

src/xt_pages/outpatientDoctorStation/modeTemplateDetail.vue

@@ -1374,7 +1374,7 @@
           }
         }
         if (this.curStatus == 1 && this.rightTab == 2) {
-          this.$message.error('改处方是药品，无法添加项目')
+          this.$message.error('该处方是药品，无法添加项目')
           this.teamList = []
           this.$refs.tables.clearSelection()
 
@@ -1382,7 +1382,7 @@
         }
 
         if (this.curStatus == 2 && this.rightTab == 1) {
-          this.$message.error('改处方是项目，无法添加药品')
+          this.$message.error('该处方是项目，无法添加药品')
           this.curDrugs = []
           this.tempDrugs = []
           this.$refs.multipleTable.clearSelection()
@@ -1989,7 +1989,7 @@
         display: flex;
         flex-direction: column;
         position: relative;
-        
+
     .el-form-item {
         width: 33%;
         margin-bottom: 14px;

src/xt_pages/outpatientDoctorStation/prescriptionTemplatedetail.vue

@@ -1412,7 +1412,7 @@
           }
         }
         if (this.curStatus == 1 && this.rightTab == 2) {
-          this.$message.error('改处方是药品，无法添加项目')
+          this.$message.error('该处方是药品，无法添加项目')
           this.teamList = []
           this.$refs.tables.clearSelection()
 
@@ -1420,7 +1420,7 @@
         }
 
         if (this.curStatus == 2 && this.rightTab == 1) {
-          this.$message.error('改处方是项目，无法添加药品')
+          this.$message.error('该处方是项目，无法添加药品')
           this.curDrugs = []
           this.tempDrugs = []
           this.$refs.multipleTable.clearSelection()

src/xt_pages/outpatientTool/components/detailStatistics.vue

@@ -47,6 +47,9 @@
         >
         </el-date-picker>
         <el-button type="primary" size="small" @click="toPrint">打印</el-button>
+
+        <el-button type="primary" size="small" @click="toExport">导出</el-button>
+
       </div>
       <div></div>
     </div>
@@ -55,6 +58,7 @@
       border
       :row-style="{ color: '#303133' }"
       ref="table"
+
       :header-cell-style="{
         backgroundColor: 'rgb(245, 247, 250)',
         color: '#606266',
@@ -146,6 +150,25 @@
           </div>
         </template>
       </el-table-column>
+
+      <el-table-column align="center" label="先行支付" prop="total_price">
+        <template slot-scope="scope">
+          <div>
+            {{ scope.row.preselfpay_amt }}
+          </div>
+        </template>
+      </el-table-column>
+      <el-table-column align="center" label="限价金额" prop="total_price">
+        <template slot-scope="scope">
+          <div>
+            {{ scope.row.pric_uplmt_amt }}
+          </div>
+        </template>
+      </el-table-column>
+
+
+
+
       <el-table-column align="center" prop="name" label="备注">
         <template slot-scope="scope">
           <div>
@@ -434,6 +457,9 @@ export default {
             this.tableData = new_arr;
           }
         }
+        console.log("11111222")
+
+        console.log( this.tableData)
       });
     },
 
@@ -486,6 +512,22 @@ export default {
         }
       }
       return maf_pay.toFixed(2);
+    }, export_detail() {
+      console.log("~~~~~~~")
+
+      let list = []
+      import('@/vendor/Export2Excel').then(excel => {
+        const tHeader = [ ]
+        const filterVal = []
+        const data = this.formatJson(filterVal, list)
+        excel.export_json_to_excel1({
+          header: tHeader,
+          data,
+          filename: '结算明细',
+          ref:this.$refs['report-table'].$el
+        })
+      })
+
     },
     toPrint() {
       this.$router.push({

src/xt_pages/outpatientTool/components/settle.vue

@@ -395,92 +395,94 @@ import { uParseTime } from '@/utils/tools'
         })
 
         return sums
-      }, export_detail() {
+      },
+      export_detail() {
+        console.log("~~~~~~~")
 
         let list = []
-        for (let i = 0; i < this.tableData.length; i++) {
-          let order = this.tableData[i]
-          let name = order.other_name
-          let id_card_no = order.id_card_no
-
-          let time = ''
-          let balance_accounts = ""
-          let med_type = ""
-          let medfee_sumamt = ""
-          let fund_pay_sumamt = ""
-          let acct_pay = ""
-          let psn_cash_pay = ""
-          let hifes_pay = ""
-          let hifmi_pay = ""
-          let hifp_pay = ""
-          let hifob_pay = ""
-          let maf_pay = ""
-          let time2 = ""
-          time2 = this.getTimes(order.settle_accounts_date)
-
-          let total = ""
-
-          if(order.setl_time.length == 0){
-
-            time = this.getTimes(order.settle_accounts_date)
-
-          }else {
-
-            time = order.setl_time.split(" ")[0]
-
-          }
-
-          if (order.is_medicine_insurance == 0) {
-            balance_accounts = '自费'
-          }
-
-          if (order.is_medicine_insurance == 1) {
-            balance_accounts = '医保'
-          }
-
-          if (order.med_type == '14') {
-            med_type = '门诊特殊病'
-          }
-
-          if (order.med_type == '11') {
-            med_type = '普通门诊'
-          }
-
-          medfee_sumamt = order.medfee_sumamt
-          fund_pay_sumamt = order.fund_pay_sumamt
-
-          acct_pay = order.acct_pay
-
-          psn_cash_pay = order.psn_cash_pay
-          hifes_pay = order.hifes_pay
-          hifmi_pay = order.hifmi_pay
-          hifp_pay = order.hifp_pay
-          hifob_pay = order.hifob_pay
-          maf_pay = order.maf_pay
-          total = order.total
-
-
-          let obj = {
-            '患者姓名': name,
-            '身份证': id_card_no,
-            '治疗日期': time2,
-            '结算日期': time,
-            '结算类型': balance_accounts,
-            '处方类型': med_type,
-            '医疗费总额': medfee_sumamt,
-            '基金支付金额': fund_pay_sumamt,
-            '基金统筹金额': hifp_pay,
-            '大额基金支付':hifob_pay,
-            '医疗救助基金':maf_pay,
-            '个人账户支付金额': acct_pay,
-            '个人支付基金': psn_cash_pay,
-            '企业补充医疗保险基金支出': hifes_pay,
-            '居民大病保险资金支出': hifmi_pay,
-            '费用总额':total,
-
-          }
-          list.push(obj)
-        }
+        // for (let i = 0; i < this.tableData.length; i++) {
+        //   let order = this.tableData[i]
+        //   let name = order.other_name
+        //   let id_card_no = order.id_card_no
+        //
+        //   let time = ''
+        //   let balance_accounts = ""
+        //   let med_type = ""
+        //   let medfee_sumamt = ""
+        //   let fund_pay_sumamt = ""
+        //   let acct_pay = ""
+        //   let psn_cash_pay = ""
+        //   let hifes_pay = ""
+        //   let hifmi_pay = ""
+        //   let hifp_pay = ""
+        //   let hifob_pay = ""
+        //   let maf_pay = ""
+        //   let time2 = ""
+        //   time2 = this.getTimes(order.settle_accounts_date)
+        //
+        //   let total = ""
+        //
+        //   if(order.setl_time.length == 0){
+        //
+        //     time = this.getTimes(order.settle_accounts_date)
+        //
+        //   }else {
+        //
+        //     time = order.setl_time.split(" ")[0]
+        //
+        //   }
+        //
+        //   if (order.is_medicine_insurance == 0) {
+        //     balance_accounts = '自费'
+        //   }
+        //
+        //   if (order.is_medicine_insurance == 1) {
+        //     balance_accounts = '医保'
+        //   }
+        //
+        //   if (order.med_type == '14') {
+        //     med_type = '门诊特殊病'
+        //   }
+        //
+        //   if (order.med_type == '11') {
+        //     med_type = '普通门诊'
+        //   }
+        //
+        //   medfee_sumamt = order.medfee_sumamt
+        //   fund_pay_sumamt = order.fund_pay_sumamt
+        //
+        //   acct_pay = order.acct_pay
+        //
+        //   psn_cash_pay = order.psn_cash_pay
+        //   hifes_pay = order.hifes_pay
+        //   hifmi_pay = order.hifmi_pay
+        //   hifp_pay = order.hifp_pay
+        //   hifob_pay = order.hifob_pay
+        //   maf_pay = order.maf_pay
+        //   total = order.total
+        //
+        //
+        //   let obj = {
+        //     '患者姓名': name,
+        //     '身份证': id_card_no,
+        //     '治疗日期': time2,
+        //     '结算日期': time,
+        //     '结算类型': balance_accounts,
+        //     '处方类型': med_type,
+        //     '医疗费总额': medfee_sumamt,
+        //     '基金支付金额': fund_pay_sumamt,
+        //     '基金统筹金额': hifp_pay,
+        //     '大额基金支付':hifob_pay,
+        //     '医疗救助基金':maf_pay,
+        //     '个人账户支付金额': acct_pay,
+        //     '个人支付基金': psn_cash_pay,
+        //     '企业补充医疗保险基金支出': hifes_pay,
+        //     '居民大病保险资金支出': hifmi_pay,
+        //     '费用总额':total,
+        //
+        //   }
+        //   list.push(obj)
+        // }
         import('@/vendor/Export2Excel').then(excel => {
           const tHeader = [ '患者姓名','身份证', '治疗日期','结算日期', '结算类型', '处方类型', '医疗费总额', '基金支付金额', '个人账户支付金额', '个人支付基金','企业补充医疗保险基金支出','居民大病保险资金支出', '费用总额']
           const filterVal = [ '患者姓名','身份证', '治疗日期','结算日期', '结算类型', '处方类型', '医疗费总额', '基金支付金额', '个人账户支付金额', '个人支付基金','企业补充医疗保险基金支出','居民大病保险资金支出',  '费用总额']