统计跳转：体重，血压，指标控制

src/api/qcd.js

     method: 'get',
     params: params
   })
-}
+}
+export function GetPersonWeightData(params) {
+  return request({
+    url: '/api/qcd/papersonweightdata',
+    method: 'get',
+    params: params
+  })
+}
+export function GetPersonBloodPressureData(params) {
+  return request({
+    url: '/api/qcd/papersonbloodpressuredata',
+    method: 'get',
+    params: params
+  })
+}
+
+export function GetPersonICData(params) {
+  return request({
+    url: '/api/qcd/papersonicdata',
+    method: 'get',
+    params: params
+  })
+}
+

src/xt_pages/dialysis/details/index.vue

 <template>
 <div class="main-contain">
   <div class="position">
-       <bread-crumb></bread-crumb>
+       <bread-crumb :crumbs='crumbs'></bread-crumb>
        <div class="print" style="float:left;"  >
             <!-- <el-button type="primary" @click="dialogFormVisible = true">长期医嘱</el-button> -->
             <!-- <el-button type="primary" @click="orders = true">临时医嘱</el-button> -->
   },
   data() {
     return {
+      crumbs:[
+        {path:false, name:'科室质控'},
+        {path:false, name:'透析管理'},
+        {path:false, name:'透析记录'},
+        {path:false, name:'透析单'},
+      ],
       dialogFormVisible: false,
       orders: false,
       loading: false,

src/xt_pages/qcd/components/LineChart.vue

+<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: '350px'
+    },
+    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(){
+      this.chartOptions = this.options;
+      this.initChart()
+      this.__resizeHanlder = debounce(() => {
+        if (this.chart) {
+          this.chart.resize() 
+        }
+      }, 100)
+      window.addEventListener('resize', this.__resizeHanlder)
+    },
+    
+
+    chartData: {
+      deep: true,
+      handler(val) {
+        this.setOptions(val)
+      }
+    }
+  },
+  created(){
+    this.chartOptions = this.options;
+    console.log("this.chartOptions", this.chartOptions, this.options);
+  },
+  methods: {
+    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,
+      })
+    },
+    initChart() {
+      this.chart = echarts.init(this.$el, 'macarons')
+      this.chart.clear();
+      this.setOptions(this.chartData)
+    }
+  }
+}
+</script>

src/xt_pages/qcd/dialysisTotal.vue

         </el-select>
       </div>
 
-      <h4 class="hui">统计图</h4>
-      <hr class="huixiao">
+      <div class="cqd-dataTitle">统计图</div>
       <el-row :gutter="32">
         <el-col :xs="24" :sm="24" :lg="24">
           <div class="chart-wrapper">
           </div>
         </el-col>
       </el-row>
-
-      <h4 class="hui">统计表</h4>
-      <hr class="huixiao">
+      <div style="height:20px">&nbsp;</div>
+      <div class="cqd-dataTitle">统计表</div>
       <el-table
         ref="multipleTable"
         :data="tableData"
+        id="qcddt"
         border
         fit
         highlight-current-row
         style="width: 100%;margin-top: 10px;"
         :header-cell-style="{ backgroundColor: 'rgb(245, 247, 250)'}"
       >
-        <el-table-column label="日期" min-width="80" property="date" align="center"></el-table-column>
-        <el-table-column
-          :label="modeOptions[1].name"
-          v-if="listQuery.mode_id==1||listQuery.mode_id==''"
-          property="data[1].number"
-          align="center"
-        ></el-table-column>
-        <el-table-column
-          :label="modeOptions[2].name"
-          v-if="listQuery.mode_id==2||listQuery.mode_id==''"
-          property="data[2].number"
-          align="center"
-        ></el-table-column>
-        <el-table-column
-          :label="modeOptions[3].name"
-          v-if="listQuery.mode_id==3||listQuery.mode_id==''"
-          property="data[3].number"
-          align="center"
-        ></el-table-column>
-        <el-table-column
-          :label="modeOptions[4].name"
-          v-if="listQuery.mode_id==4||listQuery.mode_id==''"
-          property="data[4].number"
-          align="center"
-        ></el-table-column>
-        <el-table-column
-          :label="modeOptions[5].name"
-          v-if="listQuery.mode_id==5||listQuery.mode_id==''"
-          property="data[5].number"
-          align="center"
-        ></el-table-column>
-        <el-table-column
-          :label="modeOptions[6].name"
-          v-if="listQuery.mode_id==6||listQuery.mode_id==''"
-          property="data[6].number"
-          align="center"
-        ></el-table-column>
-        <el-table-column
-          :label="modeOptions[7].name"
-          v-if="listQuery.mode_id==7||listQuery.mode_id==''"
-          property="data[7].number"
-          align="center"
-        ></el-table-column>
-        <el-table-column
-          :label="modeOptions[8].name"
-          v-if="listQuery.mode_id==8||listQuery.mode_id==''"
-          property="data[8].number"
-          align="center"
-        ></el-table-column>
-        <el-table-column
-          :label="modeOptions[9].name"
-          v-if="listQuery.mode_id==9||listQuery.mode_id==''"
-          property="data[9].number"
-          align="center"
-        ></el-table-column>
-        <el-table-column
-          :label="modeOptions[10].name"
-          v-if="listQuery.mode_id==10||listQuery.mode_id==''"
-          property="data[10].number"
-          align="center"
-        ></el-table-column>
+        <el-table-column fixed label="日期" width="100" property="date" align="center"></el-table-column>
         <el-table-column
-          :label="modeOptions[11].name"
-          v-if="listQuery.mode_id==11||listQuery.mode_id==''"
-          property="data[11].number"
+          :label="modeItem.name"
+          property="number"
           align="center"
-        ></el-table-column>
-        <el-table-column
-          :label="modeOptions[12].name"
-          v-if="listQuery.mode_id==12||listQuery.mode_id==''"
-          property="data[12].number"
-          align="center"
-        ></el-table-column>
-        <el-table-column
-          :label="modeOptions[13].name"
-          v-if="listQuery.mode_id==13||listQuery.mode_id==''"
-          property="data[13].number"
-          align="center"
-        ></el-table-column>
-        <el-table-column
-          :label="modeOptions[14].name"
-          v-if="listQuery.mode_id==14||listQuery.mode_id==''"
-          property="data[14].number"
-          align="center"
-        ></el-table-column>
-        <el-table-column
-          :label="modeOptions[15].name"
-          v-if="listQuery.mode_id==15||listQuery.mode_id==''"
-          property="data[15].number"
-          align="center"
-        ></el-table-column>
-        <el-table-column
-          :label="modeOptions[16].name"
-          v-if="listQuery.mode_id==16||listQuery.mode_id==''"
-          property="data[16].number"
-          align="center"
-        ></el-table-column>
-        <el-table-column
-          :label="modeOptions[17].name"
-          v-if="listQuery.mode_id==17||listQuery.mode_id==''"
-          property="data[17].number"
-          align="center"
-        ></el-table-column>
-        <el-table-column
-          :label="modeOptions[18].name"
-          v-if="listQuery.mode_id==18||listQuery.mode_id==''"
-          property="data[18].number"
-          align="center"
-        ></el-table-column>
-        <el-table-column label="总数" min-width="80" property="total" align="center"></el-table-column>
+          min-width="100" 
+          v-for="(modeItem, index) in activeModes"
+          :key="index"
+        >
+          <template slot-scope="scope">
+            {{scope.row.data[modeItem.id].number?scope.row.data[modeItem.id].number:''}}
+          </template>
+        </el-table-column>
+
+        <el-table-column fixed='right' label="总数" width="80" property="total" align="center"></el-table-column>
       </el-table>
 
       <!-- <pagi-nation title="分页"></pagi-nation> -->
             for (const mkey in this.modeOptions) {
               if (mkey in dd[key]) {
                 dd[key][mkey].mode = this.modeOptions[mkey].name;
-                total += parseInt(dd[key][mkey].number);
+                var number = parseInt(dd[key][mkey].number);
+                if (isNaN(number) || number==0) {
+                  dd[key][mkey].number = ''
+                  number = 0;
+                }
+                total += number;
               } else {
                 dd[key][mkey] = {
                   mode: this.modeOptions[mkey].name,
       this.getList();
     }
   },
+  computed:{
+    activeModes:function(){
+      var modes = [];
+      for (const key in this.modeOptions) {
+        if(this.listQuery.mode_id == key || this.listQuery.mode_id=='') {
+          modes.push(this.modeOptions[key]);
+        }
+      }
+      return modes;
+    }
+  },
   components: {
     BarChart,
     BreadCrumb
 };
 </script>
 
+<style>
+#qcddt ::-webkit-scrollbar {
+  height: 15px;
+}
+</style>
 <style rel="stylesheet/scss" lang="scss" scoped>
 .app-container {
 //   margin: 20px;
   .filter-container {
     padding-bottom: 5px;
   }
-  .hui {
-    color: #909399;
-    margin-bottom: 5px;
+  .cqd-dataTitle{
+    color: #303133;
+    font-size: 14px;
+    border-bottom: 2px #E4E7ED solid;
+    height: 36px;
+    line-height: 36px;
+    margin: 0 0 25px 0;
+    position: relative;
   }
-  .huixiao {
-    border: solid 1px #ebeef5;
+  .cqd-dataTitle::before {
+      position: absolute;
+      left: 0;
+      bottom: -2px;
+      content: "";
+      width: 42px;
+      height: 2px;
+      background: #409eff;
   }
   .search-component {
     width: 500px;

src/xt_pages/qcd/outcomeIndicators/control.vue

         </el-select>
       </div>
 
-      <h4 class="hui">统计图</h4>
-      <hr class="huixiao">
+      <div class="cqd-dataTitle">统计图</div>
       <el-row :gutter="32">
         <el-col :xs="24" :sm="24" :lg="24">
           <div class="chart-wrapper">
         </el-col>
       </el-row>
 
-      <h4 class="hui">统计表</h4>
-      <hr class="huixiao">
+      <div style="height:20px">&nbsp;</div>
+      <div class="cqd-dataTitle">统计表</div>
       <el-table
         ref="multipleTable"
         :data="tableData"
           <template slot-scope="scope"><span>{{getTime(scope.row.inspect_date, '{y}{m}{d}')}}</span></template>
         </el-table-column>
         
-        <el-table-column :label="reference.item_name+'//'+reference.unit" min-width="120" align="center" v-if="showTableColumn(reference)" v-for="(reference, index) in references" :key="index"  :render-header="renderheader">
+        <el-table-column :label="reference.item_name+'//'+reference.unit" min-width="210" align="center" v-for="(reference, index) in activeReferences" :key="index"  :render-header="renderheader">
           <template slot-scope="scope"><span>{{getItemVulue(reference.project_id, reference.id, scope.row)}}</span></template>
         </el-table-column>
       </el-table>
 
     }
   },
+  computed:{
+    activeReferences:function(){
+      var references = [];
+      for (const index in this.references) {
+        if (this.listQuery.project_id == '' || (this.listQuery.item_id == '' && this.references[index].project_id == this.listQuery.project_id) || this.references[index].id == this.listQuery.item_id) {
+          references.push(this.references[index]);
+        }
+      }
+      return references;
+    }
+  },
   components: {
     PieChart,
     BreadCrumb
   .filter-container {
     padding-bottom: 5px;
   }
-  .hui {
-    color: #909399;
-    margin-bottom: 5px;
+  .cqd-dataTitle{
+    color: #303133;
+    font-size: 14px;
+    border-bottom: 2px #E4E7ED solid;
+    height: 36px;
+    line-height: 36px;
+    margin: 0 0 25px 0;
+    position: relative;
   }
-  .huixiao {
-    border: solid 1px #ebeef5;
+  .cqd-dataTitle::before {
+      position: absolute;
+      left: 0;
+      bottom: -2px;
+      content: "";
+      width: 42px;
+      height: 2px;
+      background: #409eff;
   }
   .search-component {
     width: 500px;

src/xt_pages/qcd/outcomeIndicators/query.vue

         </el-select>
       </div>
 
-      <h4 class="hui">统计表</h4>
-      <hr class="huixiao">
+      <div class="cqd-dataTitle">统计表</div>
       <el-table
         ref="multipleTable"
         :data="tableData"
           <template slot-scope="scope"><span>{{getTime(scope.row.inspect_date, '{y}{m}{d}')}}</span></template>
         </el-table-column>
         
-        <el-table-column :label="reference.item_name+'//'+reference.unit" min-width="120" align="center" v-if="showTableColumn(reference)" v-for="(reference, index) in references" :key="index"  :render-header="renderheader">
+        <el-table-column :label="reference.item_name+'//'+reference.unit" min-width="210" align="center"  v-for="(reference, index) in activeReferences" :key="index"  :render-header="renderheader">
           <template slot-scope="scope"><span>{{getItemVulue(reference.project_id, reference.id, scope.row)}}</span></template>
         </el-table-column>
       </el-table>
 
     }
   },
+  computed:{
+    activeReferences:function(){
+      var references = [];
+      for (const index in this.references) {
+        if (this.listQuery.project_id == '' || (this.references[index].project_id == this.listQuery.project_id && (this.listQuery.project_id!=1 || this.references[index].id in this.routineBloodShowItem) )) {
+          references.push(this.references[index]);
+        }
+      }
+      return references;
+    }
+  },
   components: {
     BreadCrumb
   }
   .filter-container {
     padding-bottom: 5px;
   }
-  .hui {
-    color: #909399;
-    margin-bottom: 5px;
+  .cqd-dataTitle{
+    color: #303133;
+    font-size: 14px;
+    border-bottom: 2px #E4E7ED solid;
+    height: 36px;
+    line-height: 36px;
+    margin: 0 0 25px 0;
+    position: relative;
   }
-  .huixiao {
-    border: solid 1px #ebeef5;
+  .cqd-dataTitle::before {
+      position: absolute;
+      left: 0;
+      bottom: -2px;
+      content: "";
+      width: 42px;
+      height: 2px;
+      background: #409eff;
   }
   .search-component {
     width: 500px;

src/xt_pages/qcd/patientAnalysis/bloodPressure.vue

       </div>
 
 
-      <h4 class="hui">统计图</h4>
-      <hr class="huixiao">
+      <div class="cqd-dataTitle">统计图</div>
       <el-row :gutter="32">
         <el-col :xs="24" :sm="24" :lg="24">
           <div class="chart-wrapper">
-              <pie-chart title="血压（从次）" :options="CompletionOptions"/>
+              <pie-chart title="血压（人次）" :options="CompletionOptions"/>
           </div>
         </el-col>
       </el-row>
 
-      <h4 class="hui">统计表</h4>
-      <hr class="huixiao">
+      <div style="height:20px">&nbsp;</div>
+      <div class="cqd-dataTitle">统计表</div>
       <el-table
         ref="multipleTable"
         :data="tableData"
         :header-cell-style="{ backgroundColor: 'rgb(245, 247, 250)'}"
       >
         
-        
         <el-table-column  label="透析日期" min-width="80" property="schedule_date" align="center">
           <template slot-scope="scope"><span>{{getTime(scope.row.schedule_date, '{y}{m}{d}')}}</span></template>
         </el-table-column>
   .filter-container {
     padding-bottom: 5px;
   }
-  .hui {
-    color: #909399;
-    margin-bottom: 5px;
+  .cqd-dataTitle{
+    color: #303133;
+    font-size: 14px;
+    border-bottom: 2px #E4E7ED solid;
+    height: 36px;
+    line-height: 36px;
+    margin: 0 0 25px 0;
+    position: relative;
   }
-  .huixiao {
-    border: solid 1px #ebeef5;
+  .cqd-dataTitle::before {
+      position: absolute;
+      left: 0;
+      bottom: -2px;
+      content: "";
+      width: 42px;
+      height: 2px;
+      background: #409eff;
   }
   .search-component {
     width: 500px;

src/xt_pages/qcd/patientAnalysis/complication.vue

         </div>
       </div>
 
-
-      <h4 class="hui">统计图</h4>
-      <hr class="huixiao">
+      <div class="cqd-dataTitle">统计图</div>
       <el-row :gutter="32">
         <el-col :xs="24" :sm="24" :lg="24">
           <div class="chart-wrapper">
           </div>
         </el-col>
       </el-row>
-
-      <h4 class="hui">统计表</h4>
-      <hr class="huixiao">
+      <div style="height:20px">&nbsp;</div>
+      <div class="cqd-dataTitle">统计表</div>
       <el-table
         ref="multipleTable"
         :data="tableData"
   .filter-container {
     padding-bottom: 5px;
   }
-  .hui {
-    color: #909399;
-    margin-bottom: 5px;
+  .cqd-dataTitle{
+    color: #303133;
+    font-size: 14px;
+    border-bottom: 2px #E4E7ED solid;
+    height: 36px;
+    line-height: 36px;
+    margin: 0 0 25px 0;
+    position: relative;
   }
-  .huixiao {
-    border: solid 1px #ebeef5;
+  .cqd-dataTitle::before {
+      position: absolute;
+      left: 0;
+      bottom: -2px;
+      content: "";
+      width: 42px;
+      height: 2px;
+      background: #409eff;
   }
   .search-component {
     width: 500px;

src/xt_pages/qcd/patientAnalysis/dialysisAge.vue

         </div>
       </div>
 
-
-      <h4 class="hui">统计图</h4>
-      <hr class="huixiao">
+      <div class="cqd-dataTitle">统计图</div>
       <el-row :gutter="32">
         <el-col :xs="24" :sm="24" :lg="24">
           <div class="chart-wrapper">
         </el-col>
       </el-row>
 
-      <h4 class="hui">统计表</h4>
-      <hr class="huixiao">
+      <div style="height:20px">&nbsp;</div>
+      <div class="cqd-dataTitle">统计表</div>
       <el-table
         ref="multipleTable"
         :data="tableData"
   .filter-container {
     padding-bottom: 5px;
   }
-  .hui {
-    color: #909399;
-    margin-bottom: 5px;
+  .cqd-dataTitle{
+    color: #303133;
+    font-size: 14px;
+    border-bottom: 2px #E4E7ED solid;
+    height: 36px;
+    line-height: 36px;
+    margin: 0 0 25px 0;
+    position: relative;
   }
-  .huixiao {
-    border: solid 1px #ebeef5;
+  .cqd-dataTitle::before {
+      position: absolute;
+      left: 0;
+      bottom: -2px;
+      content: "";
+      width: 42px;
+      height: 2px;
+      background: #409eff;
   }
   .search-component {
     width: 500px;

src/xt_pages/qcd/patientAnalysis/infectiousDiseases.vue

         </div>
       </div>
 
-      <h4 class="hui">统计图</h4>
-      <hr class="huixiao">
+      <div class="cqd-dataTitle">统计图</div>
       <el-row :gutter="32">
         <el-col :xs="24" :sm="24" :lg="8">
           <div class="chart-wrapper">
         </el-col>
       </el-row>
 
-      <h4 class="hui">统计表</h4>
-      <hr class="huixiao">
+      <div style="height:20px">&nbsp;</div>
+      <div class="cqd-dataTitle">统计表</div>
       <el-table
         ref="multipleTable"
         :data="tableData"
   .filter-container {
     padding-bottom: 5px;
   }
-  .hui {
-    color: #909399;
-    margin-bottom: 5px;
+  .cqd-dataTitle{
+    color: #303133;
+    font-size: 14px;
+    border-bottom: 2px #E4E7ED solid;
+    height: 36px;
+    line-height: 36px;
+    margin: 0 0 25px 0;
+    position: relative;
   }
-  .huixiao {
-    border: solid 1px #ebeef5;
+  .cqd-dataTitle::before {
+      position: absolute;
+      left: 0;
+      bottom: -2px;
+      content: "";
+      width: 42px;
+      height: 2px;
+      background: #409eff;
   }
   .search-component {
     width: 500px;

src/xt_pages/qcd/patientAnalysis/lapseto.vue

         </div>
       </div>
 
-
-      <h4 class="hui">统计图</h4>
-      <hr class="huixiao">
+      <div class="cqd-dataTitle">统计图</div>
       <el-row :gutter="32">
         <el-col :xs="24" :sm="24" :lg="24">
           <div class="chart-wrapper">
         </el-col>
       </el-row>
 
-      <h4 class="hui">统计表</h4>
-      <hr class="huixiao">
+      <div style="height:20px">&nbsp;</div>
+      <div class="cqd-dataTitle">统计表</div>
       <el-table
         ref="multipleTable"
         :data="tableData"
   .filter-container {
     padding-bottom: 5px;
   }
-  .hui {
-    color: #909399;
-    margin-bottom: 5px;
+  .cqd-dataTitle{
+    color: #303133;
+    font-size: 14px;
+    border-bottom: 2px #E4E7ED solid;
+    height: 36px;
+    line-height: 36px;
+    margin: 0 0 25px 0;
+    position: relative;
   }
-  .huixiao {
-    border: solid 1px #ebeef5;
+  .cqd-dataTitle::before {
+      position: absolute;
+      left: 0;
+      bottom: -2px;
+      content: "";
+      width: 42px;
+      height: 2px;
+      background: #409eff;
   }
   .search-component {
     width: 500px;

src/xt_pages/qcd/patientAnalysis/person/bloodPressure.vue

+<template>
+ <div class="main-contain">
+    <div class="position">
+      <bread-crumb :crumbs='crumbs'></bread-crumb>
+    </div>
+    <div class="app-container" id="outcome-indicators-query">
+      <person-info :patient="patientInfo"></person-info>
+      <person-nav activeName="bloodpressure" :patientID="patientID"></person-nav>
+
+      
+      <div class="cell clearfix">
+        <label class="title">
+          <span class="name">日期查询</span> :
+        </label>
+        <el-date-picker
+          v-model="listQuery.start_time"
+          prefix-icon="el-icon-date"
+          @change="changeTime"
+          :editable="false"
+          style="width: 196px;"
+          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="listQuery.end_time"
+          prefix-icon="el-icon-date"
+          @change="changeTime"
+          :editable="false"
+          style="width: 196px;"
+          type="date"
+          placeholder="选择日期时间"
+          align="right"
+          format="yyyy-MM-dd"
+          value-format="yyyy-MM-dd"
+        ></el-date-picker>
+      </div>
+      
+      <div class="cell clearfix">
+        <label class="title">
+          <span class="name">曲线图</span> :
+        </label>
+        <div class="time">
+          <ul class>
+            <li
+              :class="item.value==diagramType?'active':''"
+              @click="selectDiagramType( item.value)"
+              v-for="item in diagramTypeOptions"
+              :key="item.value"
+            >{{item.label}}</li>
+          </ul>
+        </div>
+      </div>
+      
+      <div class="cqd-dataTitle">统计图</div>
+      <el-row :gutter="32">
+        <el-col :xs="24" :sm="24" :lg="24">
+          <div class="chart-wrapper">
+              <line-chart title="曲线图(mmHg)" :options="CompletionOptions" />
+          </div>
+        </el-col>
+      </el-row>
+
+      <div style="height:20px">&nbsp;</div>
+      <div class="cqd-dataTitle">统计表</div>
+      <el-table
+        ref="multipleTable"
+        :data="tableData"
+        border
+        fit
+        highlight-current-row
+        style="width: 100%;margin-top: 10px;"
+        :header-cell-style="{ backgroundColor: 'rgb(245, 247, 250)'}"
+      >
+        
+        <el-table-column  label="透析日期" min-width="80" property="schedule_date" align="center">
+          <template slot-scope="scope"><span>{{getTime(scope.row.schedule_date, '{y}{m}{d}')}}</span></template>
+        </el-table-column>
+        <el-table-column  label="透前血压//mmHg" min-width="80" property="assessment_before_dislysis" align="center" :render-header="renderheader">
+          <template slot-scope="scope"><span>{{scope.row.assessment_before_dislysis&&scope.row.assessment_before_dislysis.systolic_blood_pressure&&scope.row.assessment_before_dislysis.diastolic_blood_pressure? scope.row.assessment_before_dislysis.systolic_blood_pressure +'/'+scope.row.assessment_before_dislysis.diastolic_blood_pressure:'--'}}</span></template>
+        </el-table-column>
+        <el-table-column  label="透析中最低血压//mmHg" min-width="80" property="monitor_records" align="center" :render-header="renderheader">
+          <template slot-scope="scope"><span>{{minBloodPressure(scope.row.monitor_records)}}</span></template>
+        </el-table-column>
+        <el-table-column  label="透析中最高血压//mmHg" min-width="80" property="monitor_records" align="center" :render-header="renderheader">
+          <template slot-scope="scope"><span>{{maxBloodPressure(scope.row.monitor_records)}}</span></template>
+        </el-table-column>
+        <el-table-column  label="透后血压//mmHg" min-width="80" property="assessment_after_dislysis" align="center" :render-header="renderheader">
+          <template slot-scope="scope"><span>{{scope.row.assessment_after_dislysis&&scope.row.assessment_after_dislysis.systolic_blood_pressure&&scope.row.assessment_after_dislysis.diastolic_blood_pressure? scope.row.assessment_after_dislysis.systolic_blood_pressure +'/'+scope.row.assessment_after_dislysis.diastolic_blood_pressure:'--'}}</span></template>
+        </el-table-column>
+        
+      </el-table>
+
+      <!-- <pagi-nation title="分页"></pagi-nation> -->
+
+      <el-pagination
+      align="right"
+        @size-change="handleSizeChange"
+        @current-change="handleCurrentChange"
+        :current-page="listQuery.pate"
+        :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>
+</template>
+
+
+<script>
+import { GetPersonBloodPressureData  } from "@/api/qcd";
+import {jsGetAge, uParseTime} from "@/utils/tools";
+import personNav from './components/personNav'
+import personInfo from './components/personInfo'
+import BreadCrumb from "@/xt_pages/components/bread-crumb";
+import LineChart from "../../components/LineChart";
+export default {
+  name: "totalAnalysis",
+  data() {
+    return {
+      crumbs:[
+        {path:false, name:'科室质控'},
+        {path:false, name:'患者分析'},
+        {path:false, name:'统计'},
+        {path:false, name:'血压'},
+      ],
+      total: 0,
+      patientMap:{},
+      listQuery: {
+        start_time: "",
+        end_time: "",
+        page: 1,
+        limit: 10,
+      },
+      CompletionOptions:{
+          xAxis:[],
+          legend:[],
+          series:[],
+      },
+      tableData: [],
+      pieData:[],
+      patientInfo:null,
+      patientID:0,
+      diagramType:1,
+      diagramTypeOptions: [
+        { value: 1, label: "透前血压",  },
+        { value: 2, label: "透析中最低血压", },
+        { value: 3, label: "透析中最高血压", },
+        { value: 4, label: "透后血压", },
+      ],
+    };
+  },
+  created() {
+    var patientID = this.$route.query && this.$route.query.id;
+    if(typeof(patientID) == 'undefined' || !patientID || patientID<=0) {
+      this.$message.error('参数错误，无法请求');
+      return false;
+    }
+    patientID = parseInt(patientID);
+    this.patientID = patientID;
+    this.listQuery.patient_id = patientID;
+
+    var nowDate = new Date();
+    var nowYear = nowDate.getFullYear();
+    var nowMonth = nowDate.getMonth() + 1;
+    var nowDay = nowDate.getDate();
+    this.listQuery.end_time =
+      nowYear +
+      "-" +
+      (nowMonth < 10 ? "0" + nowMonth : nowMonth) +
+      "-" +
+      (nowDay < 10 ? "0" + nowDay : nowDay);
+    nowDate.setMonth(nowDate.getMonth() - 3);
+    nowYear = nowDate.getFullYear();
+    nowMonth = nowDate.getMonth() + 1;
+    nowDay = nowDate.getDate();
+    this.listQuery.start_time =
+      nowYear +
+      "-" +
+      (nowMonth < 10 ? "0" + nowMonth : nowMonth) +
+      "-" +
+      (nowDay < 10 ? "0" + nowDay : nowDay);
+    
+    this.getList();
+  },
+  methods: {
+    getList() {
+      GetPersonBloodPressureData(this.listQuery).then(response => {
+        if (response.data.state == 0) {
+          this.$message.error(response.data.msg);
+          return false;
+        } else {
+            this.tableData = [];
+            this.total = response.data.data.total;
+            this.patientInfo = response.data.data.patient;
+            var bps = response.data.data.bps;
+            for (const index in bps) {
+                this.tableData.push(bps[index]);
+            }
+            var pieData = response.data.data.lines;
+            for (const index in pieData) {
+                this.pieData.push(pieData[index]);
+            }
+        }
+      });
+    },
+    changeTime() {
+      this.getList();
+    },
+    onSearch(){
+      this.getList();
+    },
+    changeModel() {
+      this.getList();
+    },
+    handleSizeChange(val) {
+      this.listQuery.limit = val;
+      this.getList();
+    },
+    handleCurrentChange(val) {
+      this.listQuery.page = val;
+      this.getList();
+    },
+    getTime(value, temp) {
+        if (value != undefined) {
+          return uParseTime(value, temp)
+        }
+        return ""
+    },
+    getProjectName(id) {
+      return (id in this.projectOptions) ? this.projectOptions[id].project_name:'';
+    },
+    getPatientName(id) {
+      return (id in this.patientMap) ? this.patientMap[id].name:'';
+    },
+    getPatientLapseto(lapseto) {
+      if(lapseto==1) {
+        return '留治';
+      }else if(lapseto == 2) {
+        return '转出';
+      }
+      return '--';
+    },
+    getPatientSource(srouce){
+      if(srouce==1) {
+        return '门诊';
+      }else if(srouce == 2) {
+        return '住院';
+      }
+      return '其他';
+    },
+    getPatientGender(gender) {
+      if (gender == 1) {
+        return '男';
+      } else if(gender == 2) {
+        return '女';
+      }
+      return '';
+    },
+    tranAge(birthday) {
+        var birth = uParseTime(birthday, '{y}-{m}-{d}');
+        return jsGetAge(birth, '-');
+    },
+    getPatientDialysisNo(id) {
+      return (id in this.patientMap) ? this.patientMap[id].dialysis_no:'';
+    },
+    getItemVulue(project_id, item_id, row) {
+        var key = project_id + '_' + item_id;
+        return (typeof(row.items) !== 'undefined' && (key in row.items)) ? row.items[key].inspect_value:'';
+    },
+    renderheader(h, { column, $index }) {
+        return h('span', {}, [
+            h('span', {}, column.label.split('//')[0]),
+            h('br'),
+            h('span', {}, column.label.split('//')[1])
+        ])
+    },
+    maxBloodPressure(records){
+      if (typeof(records) == "undefined" || !records || records.length == 0) {
+        return '--';
+      }
+      var arr = [];
+      for (const key in records) {
+        arr.push(records[key]);
+      }
+      if(arr.length == 0) {
+        return '--';
+      }
+
+      var sortData = this.selectionSort(arr);
+      arr = [];
+      for (const key in sortData) {
+        arr.push(sortData[key]);
+      }
+      var index = arr.length - 1;
+      return arr[index].systolic_blood_pressure + '/' + arr[index].diastolic_blood_pressure
+    },
+    maxLineBloodPressure(records){
+      if (typeof(records) == "undefined" || !records || records.length == 0) {
+        return [0, 0];
+      }
+      var arr = [];
+      for (const key in records) {
+        arr.push(records[key]);
+      }
+      if(arr.length == 0) {
+        return [0, 0];
+      }
+
+      var sortData = this.selectionSort(arr);
+      arr = [];
+      for (const key in sortData) {
+        arr.push(sortData[key]);
+      }
+      var index = arr.length - 1;
+      return [arr[index].systolic_blood_pressure,arr[index].diastolic_blood_pressure];
+    },
+    minLineBloodPressure(records){
+      if (typeof(records) == "undefined" || !records || records.length == 0) {
+        return [0, 0];
+      }
+      var arr = [];
+      for (const key in records) {
+        arr.push(records[key]);
+      }
+      if(arr.length == 0) {
+        return [0, 0];
+      }
+
+      var sortData = this.selectionSort(arr);
+      arr = [];
+      for (const key in sortData) {
+        arr.push(sortData[key]);
+      }
+      var index = 0;
+      return [arr[index].systolic_blood_pressure,arr[index].diastolic_blood_pressure];
+    },
+    minBloodPressure(records){
+      
+      if (typeof(records) == "undefined" || !records || records.length == 0) {
+        return '--';
+      }
+      var arr = [];
+      for (const key in records) {
+        arr.push(records[key]);
+      }
+      if(arr.length == 0) {
+        return '--';
+      }
+
+      var sortData = this.selectionSort(arr);
+      arr = [];
+      for (const key in sortData) {
+        arr.push(sortData[key]);
+      }
+      var index = 0;
+      return arr[index].systolic_blood_pressure + '/' + arr[index].diastolic_blood_pressure
+    },
+    selectionSort(arr) {
+      var len = arr.length;
+      var minIndex, temp;
+      for (var i = 0; i < len - 1; i++) {
+          minIndex = i;
+          for (var j = i + 1; j < len; j++) {
+              if (arr[j].systolic_blood_pressure < arr[minIndex].systolic_blood_pressure || (arr[j].systolic_blood_pressure == arr[minIndex].systolic_blood_pressure && arr[j].diastolic_blood_pressure < arr[minIndex].diastolic_blood_pressure)) {     //寻找最小的数
+                  minIndex = j;                 //将最小数的索引保存
+              }
+          }
+          temp = arr[i];
+          arr[i] = arr[minIndex];
+          arr[minIndex] = temp;
+      }
+      return arr;
+    },
+    selectDiagramType(type) {
+      this.diagramType = type;
+      this.listQuery.diagram_type = type;
+      // this.getList();
+    },
+    drawPie(){
+      this.CompletionOptions = {
+          xAxis:[],
+          legend:[],
+          series:[],
+      };
+
+
+      if(this.diagramType < 1 || this.diagramType >4) {
+        return false;
+      }
+
+      this.CompletionOptions.legend = ['收缩压', '舒张压'];
+      this.CompletionOptions.series = [
+        { name:'收缩压', type:'line', data:[] },
+        { name:'舒张压', type:'line', data:[] },
+      ];
+
+
+      for (const index in this.pieData) {
+        var dateDay = uParseTime(this.pieData[index].schedule_date, '{y}-{m}-{d}');
+        this.CompletionOptions.xAxis.push(dateDay);
+        if (this.diagramType == 1) {
+          if (this.pieData[index].assessment_before_dislysis) {
+            this.CompletionOptions.series[0].data.push(this.pieData[index].assessment_before_dislysis.systolic_blood_pressure);
+            this.CompletionOptions.series[1].data.push(this.pieData[index].assessment_before_dislysis.diastolic_blood_pressure);
+          } else {
+            this.CompletionOptions.series[0].data.push(0);
+            this.CompletionOptions.series[1].data.push(0);
+          }
+        } else if (this.diagramType == 2){
+          var item = this.minLineBloodPressure(this.pieData[index].monitor_records);
+          this.CompletionOptions.series[0].data.push(item[0]);
+          this.CompletionOptions.series[1].data.push(item[1]);
+          
+        }else if (this.diagramType == 3){
+          var item = this.maxLineBloodPressure(this.pieData[index].monitor_records);
+          this.CompletionOptions.series[0].data.push(item[0]);
+          this.CompletionOptions.series[1].data.push(item[1]);
+          
+        }else{
+          if (this.pieData[index].assessment_after_dislysis) {
+            this.CompletionOptions.series[0].data.push(this.pieData[index].assessment_after_dislysis.systolic_blood_pressure);
+            this.CompletionOptions.series[1].data.push(this.pieData[index].assessment_after_dislysis.diastolic_blood_pressure);
+          } else {
+            this.CompletionOptions.series[0].data.push(0);
+            this.CompletionOptions.series[1].data.push(0);
+          }
+        }
+      }
+    },
+  },
+  components: {
+      personNav,
+      BreadCrumb,
+      personInfo,
+      LineChart
+  },
+  watch:{
+    "diagramType":function(){
+      this.drawPie();
+    },
+    "pieData":function (){
+      this.drawPie();
+    },
+  }
+};
+</script>
+<style>
+#oictable ::-webkit-scrollbar {
+  height: 15px;
+}
+#outcome-indicators-query .el-form-item {
+    margin-bottom: 0px !important;
+}
+</style>
+
+
+<style rel="stylesheet/scss" lang="scss" scoped>
+.app-container {
+//   margin: 20px;
+  font-size: 15px;
+  .filter-container {
+    padding-bottom: 5px;
+  }
+  .cqd-dataTitle{
+    color: #303133;
+    font-size: 14px;
+    border-bottom: 2px #E4E7ED solid;
+    height: 36px;
+    line-height: 36px;
+    margin: 0 0 25px 0;
+    position: relative;
+  }
+  .cqd-dataTitle::before {
+      position: absolute;
+      left: 0;
+      bottom: -2px;
+      content: "";
+      width: 42px;
+      height: 2px;
+      background: #409eff;
+  }
+  .search-component {
+    width: 500px;
+    .searchBox {
+      width: 300px;
+      height: 36px;
+      line-height: 36px;
+      padding-left: 15px;
+      border: 1px #dcdfe6 solid;
+      border-right: none;
+      outline: none;
+      float: left;
+      border-radius: 6px 0 0 6px;
+      font-size: 14px;
+      color: #333;
+      background: #fff;
+      box-shadow: 3px 3px 4px rgba(135, 135, 135, 0.05);
+    }
+    .searchBtn {
+      background-color: #409eff;
+      color: #fff;
+      font-size: 15px;
+      text-align: center;
+      height: 36px;
+      line-height: 36px;
+      float: left;
+      outline: none;
+      width: 70px;
+      border: none;
+      border-radius: 0 6px 6px 0;
+      font-family: "Microsoft Yahei";
+      cursor: pointer;
+    }
+  }
+  .amount {
+    font-weight: normal;
+    padding: 10px 0 0 0;
+    color: #606266;
+    font-size: 14px;
+    span {
+      color: #ef2525;
+      font-family: "Arial";
+      padding: 0 2px;
+    }
+  }
+}
+</style>

src/xt_pages/qcd/patientAnalysis/person/components/personNav.vue

 <template>
     <el-tabs v-model="tabActiveName" @tab-click="handleTabClick">
         <el-tab-pane label="转归" name="lapseto"></el-tab-pane>
+        <el-tab-pane label="体重" name="weight"></el-tab-pane>
+        <el-tab-pane label="血压" name="bloodpressure"></el-tab-pane>
+        <el-tab-pane label="指标控制" name="indicators"></el-tab-pane>
     </el-tabs>
 </template>
 <script>
         activeName:{
             type:String,
             default: 'total'
-        }
+        },
+        patientID:{
+            type:Number,
+            default:0,
+        },
     },
     data(){
         return{
-            tabActiveName:'total',
+            tabActiveName:'lapseto',
         }
     }, 
     methods:{
         handleTabClick(tab, event) {
-            this.$router.push({ path: "/qcd/patientanalysis/"+this.tabActiveName });
+            if(typeof(this.patientID) == "undefined" || !this.patientID || this.patientID <=0) {
+                this.$message.error('参数错误，无法请求');
+                return false;
+            }
+            this.$router.push({ path: "/qcd/pa/person/"+this.tabActiveName +'?id='+this.patientID });
         }
     },
     created(){

src/xt_pages/qcd/patientAnalysis/person/indicators.vue

+<template>
+ <div class="main-contain">
+    <div class="position">
+      <bread-crumb :crumbs='crumbs'></bread-crumb>
+    </div>
+    <div class="app-container" id="outcome-indicators-query">
+      <person-info :patient="patientInfo"></person-info>
+      <person-nav activeName="indicators" :patientID="patientID"></person-nav>
+
+      <div class="cqd-dataTitle">统计表</div>
+      <el-table
+        ref="multipleTable"
+        :data="tableData"
+        id="personictable"
+        border
+        fit
+        highlight-current-row
+        style="width: 100%;margin-top: 10px;"
+        :header-cell-style="{ backgroundColor: 'rgb(245, 247, 250)'}"
+      >
+        
+        <el-table-column fixed label="检查日期" width="100" property="inspect_date" align="center">
+          <template slot-scope="scope"><span>{{getTime(scope.row.inspect_date, '{y}{m}{d}')}}</span></template>
+        </el-table-column>
+        
+        <el-table-column :label="reference.item_name+'//'+reference.unit" min-width="120" align="center"  v-for="(reference, index) in activeReferences" :key="index"  :render-header="renderheader">
+          <template slot-scope="scope"><span>{{getItemVulue(reference.project_id, reference.id, scope.row)}}</span></template>
+        </el-table-column>
+        
+      </el-table>
+
+      <!-- <pagi-nation title="分页"></pagi-nation> -->
+
+      <el-pagination
+      align="right"
+        @size-change="handleSizeChange"
+        @current-change="handleCurrentChange"
+        :current-page="listQuery.pate"
+        :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>
+</template>
+
+
+<script>
+import { GetPersonICData  } from "@/api/qcd";
+import {jsGetAge, uParseTime} from "@/utils/tools";
+import personNav from './components/personNav'
+import personInfo from './components/personInfo'
+import BreadCrumb from "@/xt_pages/components/bread-crumb";
+export default {
+  name: "totalAnalysis",
+  data() {
+    return {
+      crumbs:[
+        {path:false, name:'科室质控'},
+        {path:false, name:'患者分析'},
+        {path:false, name:'统计'},
+        {path:false, name:'指标控制'},
+      ],
+      total: 0,
+      patientMap:{},
+      listQuery: {
+        page: 1,
+        limit: 10,
+      },
+      CompletionOptions:{
+        legend:[],
+        series:[],
+      },
+      tableData: [],
+      patientInfo:null,
+      patientID:0,
+      references:[],
+      projectOptions:{},
+    };
+  },
+  created() {
+    var patientID = this.$route.query && this.$route.query.id
+    console.log(this.patientID);
+    if(typeof(patientID) == 'undefined' || !patientID || patientID<=0) {
+      this.$message.error('参数错误，无法请求');
+      return false;
+    }
+    patientID = parseInt(patientID);
+    this.patientID = patientID;
+    this.listQuery.patient_id = patientID;
+    // if (this.patientID==0)
+    this.getList();
+  },
+  methods: {
+    getList() {
+      GetPersonICData(this.listQuery).then(response => {
+        if (response.data.state == 0) {
+          this.$message.error(response.data.msg);
+          return false;
+        } else {
+            this.tableData = [];
+            this.total = response.data.data.total;
+            this.patientInfo = response.data.data.patient;
+            
+            var references = response.data.data.references;
+            this.references = response.data.data.references;
+
+            
+            this.projectOptions = {};
+            for (const index in references) {
+              if (!(references[index].project_id in this.projectOptions)) {
+                this.$set(this.projectOptions, references[index].project_id, {project_id:references[index].project_id, project_name:references[index].project_name}); 
+              }
+              if (!('children' in this.projectOptions[references[index].project_id])) {
+                  this.projectOptions[references[index].project_id]['children'] = [];
+              }
+              this.projectOptions[references[index].project_id]['children'].push(references[index]);
+            }
+            var temInspections = {};
+            var inspections = response.data.data.inspections;
+            
+            for (const index in inspections) {
+              var key = inspections[index].inspect_date + '_' + inspections[index].patient_id;
+              if (!(key in temInspections)) {
+                temInspections[key] = {patient_id:inspections[index].patient_id, inspect_date:inspections[index].inspect_date, items:{}};
+              }
+              var itemKey = inspections[index].project_id + '_' + inspections[index].item_id;
+              
+              temInspections[key].items[itemKey] = inspections[index];
+            }
+            for (const key in temInspections) {
+                this.tableData.push(temInspections[key]);
+            }
+
+          
+        }
+      });
+    },
+    changeTime() {
+      this.getList();
+    },
+    onSearch(){
+      this.getList();
+    },
+    changeModel() {
+      this.getList();
+    },
+    handleSizeChange(val) {
+      this.listQuery.limit = val;
+      this.getList();
+    },
+    handleCurrentChange(val) {
+      this.listQuery.page = val;
+      this.getList();
+    },
+    getTime(value, temp) {
+        if (value != undefined) {
+          return uParseTime(value, temp)
+        }
+        return ""
+    },
+    getProjectName(id) {
+      return (id in this.projectOptions) ? this.projectOptions[id].project_name:'';
+    },
+    getPatientName(id) {
+      return (id in this.patientMap) ? this.patientMap[id].name:'';
+    },
+    getPatientLapseto(lapseto) {
+      if(lapseto==1) {
+        return '留治';
+      }else if(lapseto == 2) {
+        return '转出';
+      }
+      return '--';
+    },
+    getPatientSource(srouce){
+      if(srouce==1) {
+        return '门诊';
+      }else if(srouce == 2) {
+        return '住院';
+      }
+      return '其他';
+    },
+    getPatientGender(gender) {
+      if (gender == 1) {
+        return '男';
+      } else if(gender == 2) {
+        return '女';
+      }
+      return '';
+    },
+    tranAge(birthday) {
+        var birth = uParseTime(birthday, '{y}-{m}-{d}');
+        return jsGetAge(birth, '-');
+    },
+    getPatientDialysisNo(id) {
+      return (id in this.patientMap) ? this.patientMap[id].dialysis_no:'';
+    },
+    getItemVulue(project_id, item_id, row) {
+        var key = project_id + '_' + item_id;
+        return (typeof(row.items) !== 'undefined' && (key in row.items)) ? row.items[key].inspect_value:'';
+    },
+    renderheader(h, { column, $index }) {
+        return h('span', {}, [
+            h('span', {}, column.label.split('//')[0]),
+            h('br'),
+            h('span', {}, column.label.split('//')[1])
+        ])
+    },
+  },
+  computed:{
+    activeReferences:function(){
+      var routineBloodShowItem = {17:17,35:35,36:36,37:37,51:51,46:46};
+      var references = [];
+      for (const index in this.references) {
+        if (this.references[index].id in routineBloodShowItem) {
+          references.push(this.references[index]);
+        }
+      }
+      return references;
+    }
+  },
+  components: {
+      personNav,
+      BreadCrumb,
+      personInfo
+  }
+};
+</script>
+<style>
+#personictable ::-webkit-scrollbar {
+  height: 15px;
+}
+#outcome-indicators-query .el-form-item {
+    margin-bottom: 0px !important;
+}
+</style>
+
+
+<style rel="stylesheet/scss" lang="scss" scoped>
+.app-container {
+//   margin: 20px;
+  font-size: 15px;
+  .filter-container {
+    padding-bottom: 5px;
+  }
+  .cqd-dataTitle{
+    color: #303133;
+    font-size: 14px;
+    border-bottom: 2px #E4E7ED solid;
+    height: 36px;
+    line-height: 36px;
+    margin: 0 0 25px 0;
+    position: relative;
+  }
+  .cqd-dataTitle::before {
+      position: absolute;
+      left: 0;
+      bottom: -2px;
+      content: "";
+      width: 42px;
+      height: 2px;
+      background: #409eff;
+  }
+  .search-component {
+    width: 500px;
+    .searchBox {
+      width: 300px;
+      height: 36px;
+      line-height: 36px;
+      padding-left: 15px;
+      border: 1px #dcdfe6 solid;
+      border-right: none;
+      outline: none;
+      float: left;
+      border-radius: 6px 0 0 6px;
+      font-size: 14px;
+      color: #333;
+      background: #fff;
+      box-shadow: 3px 3px 4px rgba(135, 135, 135, 0.05);
+    }
+    .searchBtn {
+      background-color: #409eff;
+      color: #fff;
+      font-size: 15px;
+      text-align: center;
+      height: 36px;
+      line-height: 36px;
+      float: left;
+      outline: none;
+      width: 70px;
+      border: none;
+      border-radius: 0 6px 6px 0;
+      font-family: "Microsoft Yahei";
+      cursor: pointer;
+    }
+  }
+  .amount {
+    font-weight: normal;
+    padding: 10px 0 0 0;
+    color: #606266;
+    font-size: 14px;
+    span {
+      color: #ef2525;
+      font-family: "Arial";
+      padding: 0 2px;
+    }
+  }
+}
+</style>

src/xt_pages/qcd/patientAnalysis/person/lapseto.vue

     </div>
     <div class="app-container" id="outcome-indicators-query">
       <person-info :patient="patientInfo"></person-info>
-      <person-nav activeName="lapseto"></person-nav>
+      <person-nav activeName="lapseto" :patientID="patientID"></person-nav>
 
-      <h4 class="hui">统计表</h4>
-      <hr class="huixiao">
+      <div class="cqd-dataTitle">统计表</div>
       <el-table
         ref="multipleTable"
         :data="tableData"
       this.$message.error('参数错误，无法请求');
       return false;
     }
+    patientID = parseInt(patientID);
     this.patientID = patientID;
     this.listQuery.patient_id = patientID;
     // if (this.patientID==0)
   .filter-container {
     padding-bottom: 5px;
   }
-  .hui {
-    color: #909399;
-    margin-bottom: 5px;
+  .cqd-dataTitle{
+    color: #303133;
+    font-size: 14px;
+    border-bottom: 2px #E4E7ED solid;
+    height: 36px;
+    line-height: 36px;
+    margin: 0 0 25px 0;
+    position: relative;
   }
-  .huixiao {
-    border: solid 1px #ebeef5;
+  .cqd-dataTitle::before {
+      position: absolute;
+      left: 0;
+      bottom: -2px;
+      content: "";
+      width: 42px;
+      height: 2px;
+      background: #409eff;
   }
   .search-component {
     width: 500px;

src/xt_pages/qcd/patientAnalysis/person/weight.vue

+<template>
+ <div class="main-contain">
+    <div class="position">
+      <bread-crumb :crumbs='crumbs'></bread-crumb>
+    </div>
+    <div class="app-container" id="outcome-indicators-query">
+      <person-info :patient="patientInfo"></person-info>
+      <person-nav activeName="weight" :patientID="patientID"></person-nav>
+
+      
+      <div class="cell clearfix">
+        <label class="title">
+          <span class="name">日期查询</span> :
+        </label>
+        <el-date-picker
+          v-model="listQuery.start_time"
+          prefix-icon="el-icon-date"
+          @change="changeTime"
+          :editable="false"
+          style="width: 196px;"
+          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="listQuery.end_time"
+          prefix-icon="el-icon-date"
+          @change="changeTime"
+          :editable="false"
+          style="width: 196px;"
+          type="date"
+          placeholder="选择日期时间"
+          align="right"
+          format="yyyy-MM-dd"
+          value-format="yyyy-MM-dd"
+        ></el-date-picker>
+      </div>
+      
+      <div class="cell clearfix">
+        <label class="title">
+          <span class="name">曲线图</span> :
+        </label>
+        <div class="time">
+          <ul class>
+            <li
+              :class="item.value==diagramType?'active':''"
+              @click="selectDiagramType( item.value)"
+              v-for="item in diagramTypeOptions"
+              :key="item.value"
+            >{{item.label}}</li>
+          </ul>
+        </div>
+      </div>
+      
+      <div class="cqd-dataTitle">统计图</div>
+      <el-row :gutter="32">
+        <el-col :xs="24" :sm="24" :lg="24">
+          <div class="chart-wrapper">
+              <line-chart title="曲线图(Kg)" :options="CompletionOptions" />
+          </div>
+        </el-col>
+      </el-row>
+
+      <div style="height:20px">&nbsp;</div>
+      <div class="cqd-dataTitle">统计表</div>
+      <el-table
+        ref="multipleTable"
+        :data="tableData"
+        border
+        fit
+        highlight-current-row
+        style="width: 100%;margin-top: 10px;"
+        :header-cell-style="{ backgroundColor: 'rgb(245, 247, 250)'}"
+      >
+        
+        <el-table-column  label="透析日期" min-width="80" property="schedule_date" align="center">
+          <template slot-scope="scope"><span>{{getTime(scope.row.schedule_date, '{y}{m}{d}')}}</span></template>
+        </el-table-column>
+        <el-table-column  label="干体重" min-width="80" property="assessment_before_dislysis" align="center">
+          <template slot-scope="scope"><span>{{scope.row.assessment_before_dislysis?scope.row.assessment_before_dislysis.dry_weight + 'Kg':'--'}}</span></template>
+        </el-table-column>
+        <el-table-column  label="透前体重" min-width="80" property="assessment_before_dislysis" align="center">
+          <template slot-scope="scope"><span>{{scope.row.assessment_before_dislysis?scope.row.assessment_before_dislysis.weight_before + 'Kg':'--'}}</span></template>
+        </el-table-column>
+        <el-table-column  label="体重增加" min-width="80" property="assessment_before_dislysis" align="center">
+          <template slot-scope="scope"><span>{{scope.row.assessment_before_dislysis?scope.row.assessment_before_dislysis.weight_before - scope.row.assessment_before_dislysis.dry_weight + 'Kg':'--'}}</span></template>
+        </el-table-column>
+        <el-table-column  label="透后体重" min-width="80" property="assessment_after_dislysis" align="center">
+          <template slot-scope="scope"><span>{{scope.row.assessment_after_dislysis?scope.row.assessment_after_dislysis.weight_after+ 'Kg':'--'}}</span></template>
+        </el-table-column>
+        
+      </el-table>
+
+      <!-- <pagi-nation title="分页"></pagi-nation> -->
+
+      <el-pagination
+      align="right"
+        @size-change="handleSizeChange"
+        @current-change="handleCurrentChange"
+        :current-page="listQuery.pate"
+        :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>
+</template>
+
+
+<script>
+import { GetPersonWeightData  } from "@/api/qcd";
+import {jsGetAge, uParseTime} from "@/utils/tools";
+import personNav from './components/personNav'
+import personInfo from './components/personInfo'
+import BreadCrumb from "@/xt_pages/components/bread-crumb";
+import LineChart from "../../components/LineChart";
+export default {
+  name: "totalAnalysis",
+  data() {
+    return {
+      crumbs:[
+        {path:false, name:'科室质控'},
+        {path:false, name:'患者分析'},
+        {path:false, name:'统计'},
+        {path:false, name:'体重'},
+      ],
+      total: 0,
+      patientMap:{},
+      listQuery: {
+        start_time: "",
+        end_time: "",
+        page: 1,
+        limit: 10,
+      },
+      CompletionOptions:{
+          xAxis:[],
+          legend:[],
+          series:[],
+      },
+      tableData: [],
+      pieData:[],
+      patientInfo:null,
+      patientID:0,
+      diagramType:1,
+      diagramTypeOptions: [
+        { value: 1, label: "体重变化趋势",  },
+        { value: 2, label: "体重增加", }
+      ],
+    };
+  },
+  created() {
+    var patientID = this.$route.query && this.$route.query.id;
+    if(typeof(patientID) == 'undefined' || !patientID || patientID<=0) {
+      this.$message.error('参数错误，无法请求');
+      return false;
+    }
+    patientID = parseInt(patientID);
+    this.patientID = patientID;
+    this.listQuery.patient_id = patientID;
+
+    var nowDate = new Date();
+    var nowYear = nowDate.getFullYear();
+    var nowMonth = nowDate.getMonth() + 1;
+    var nowDay = nowDate.getDate();
+    this.listQuery.end_time =
+      nowYear +
+      "-" +
+      (nowMonth < 10 ? "0" + nowMonth : nowMonth) +
+      "-" +
+      (nowDay < 10 ? "0" + nowDay : nowDay);
+    nowDate.setMonth(nowDate.getMonth() - 3);
+    nowYear = nowDate.getFullYear();
+    nowMonth = nowDate.getMonth() + 1;
+    nowDay = nowDate.getDate();
+    this.listQuery.start_time =
+      nowYear +
+      "-" +
+      (nowMonth < 10 ? "0" + nowMonth : nowMonth) +
+      "-" +
+      (nowDay < 10 ? "0" + nowDay : nowDay);
+    
+    this.getList();
+  },
+  methods: {
+    getList() {
+      GetPersonWeightData(this.listQuery).then(response => {
+        if (response.data.state == 0) {
+          this.$message.error(response.data.msg);
+          return false;
+        } else {
+            this.tableData = [];
+            this.total = response.data.data.total;
+            this.patientInfo = response.data.data.patient;
+            var weight = response.data.data.weight;
+            for (const index in weight) {
+                this.tableData.push(weight[index]);
+            }
+            var pieData = response.data.data.pie;
+            for (const index in pieData) {
+                this.pieData.push(pieData[index]);
+            }
+        }
+      });
+    },
+    changeTime() {
+      this.getList();
+    },
+    onSearch(){
+      this.getList();
+    },
+    changeModel() {
+      this.getList();
+    },
+    handleSizeChange(val) {
+      this.listQuery.limit = val;
+      this.getList();
+    },
+    handleCurrentChange(val) {
+      this.listQuery.page = val;
+      this.getList();
+    },
+    getTime(value, temp) {
+        if (value != undefined) {
+          return uParseTime(value, temp)
+        }
+        return ""
+    },
+    getProjectName(id) {
+      return (id in this.projectOptions) ? this.projectOptions[id].project_name:'';
+    },
+    getPatientName(id) {
+      return (id in this.patientMap) ? this.patientMap[id].name:'';
+    },
+    getPatientLapseto(lapseto) {
+      if(lapseto==1) {
+        return '留治';
+      }else if(lapseto == 2) {
+        return '转出';
+      }
+      return '--';
+    },
+    getPatientSource(srouce){
+      if(srouce==1) {
+        return '门诊';
+      }else if(srouce == 2) {
+        return '住院';
+      }
+      return '其他';
+    },
+    getPatientGender(gender) {
+      if (gender == 1) {
+        return '男';
+      } else if(gender == 2) {
+        return '女';
+      }
+      return '';
+    },
+    tranAge(birthday) {
+        var birth = uParseTime(birthday, '{y}-{m}-{d}');
+        return jsGetAge(birth, '-');
+    },
+    getPatientDialysisNo(id) {
+      return (id in this.patientMap) ? this.patientMap[id].dialysis_no:'';
+    },
+    getItemVulue(project_id, item_id, row) {
+        var key = project_id + '_' + item_id;
+        return (typeof(row.items) !== 'undefined' && (key in row.items)) ? row.items[key].inspect_value:'';
+    },
+    renderheader(h, { column, $index }) {
+        return h('span', {}, [
+            h('span', {}, column.label.split('//')[0]),
+            h('br'),
+            h('span', {}, column.label.split('//')[1])
+        ])
+    },
+    selectDiagramType(type) {
+      this.diagramType = type;
+      this.listQuery.diagram_type = type;
+      // this.getList();
+    },
+    drawPie(){
+      this.CompletionOptions = {
+          xAxis:[],
+          legend:[],
+          series:[],
+      };
+
+
+      if(this.diagramType !== 1 && this.diagramType !== 2) {
+        return false;
+      }
+
+      if (this.diagramType == 1) {
+        this.CompletionOptions.legend = ['透前体重', '透后体重', '干体重'];
+        this.CompletionOptions.series = [
+          { name:'透前体重', type:'line', data:[] },
+          { name:'透后体重', type:'line', data:[] },
+          { name:'干体重', type:'line', data:[] },
+        ];
+      }else {
+        this.CompletionOptions.legend = ['体重增加'];
+        this.CompletionOptions.series = [
+          // { name:'透前体重', type:'line', data:[] },
+          { name:'体重增加', type:'line', data:[] },
+          // { name:'干体重', type:'line', data:[] },
+        ];
+      }
+      for (const index in this.pieData) {
+
+        var dateDay = uParseTime(this.pieData[index].schedule_date, '{y}-{m}-{d}');
+        if (this.diagramType == 1) {
+          this.CompletionOptions.xAxis.push(dateDay);
+          if (this.pieData[index].assessment_after_dislysis) {
+            this.CompletionOptions.series[1].data.push(this.pieData[index].assessment_after_dislysis.weight_after);
+          } else {
+            this.CompletionOptions.series[1].data.push(0);
+          }
+          if (this.pieData[index].assessment_before_dislysis) {
+            this.CompletionOptions.series[0].data.push(this.pieData[index].assessment_before_dislysis.weight_before);
+            this.CompletionOptions.series[2].data.push(this.pieData[index].assessment_before_dislysis.dry_weight);
+          } else {
+            this.CompletionOptions.series[0].data.push(0);
+            this.CompletionOptions.series[2].data.push(0);
+          }
+        } else {
+          this.CompletionOptions.xAxis.push(dateDay);
+          if (this.pieData[index].assessment_before_dislysis) {
+            var weightTem = this.pieData[index].assessment_before_dislysis.weight_before - this.pieData[index].assessment_before_dislysis.dry_weight;
+            // this.CompletionOptions.series[0].data.push(this.pieData[index].assessment_before_dislysis.weight_before);
+            this.CompletionOptions.series[0].data.push(weightTem);
+            // this.CompletionOptions.series[2].data.push(this.pieData[index].assessment_before_dislysis.dry_weight);
+          } else {
+            this.CompletionOptions.series[0].data.push(0);
+          }
+        }
+      }
+    },
+  },
+  components: {
+      personNav,
+      BreadCrumb,
+      personInfo,
+      LineChart
+  },
+  watch:{
+    "diagramType":function(){
+      this.drawPie();
+    },
+    "pieData":function (){
+      this.drawPie();
+    },
+  }
+};
+</script>
+<style>
+#oictable ::-webkit-scrollbar {
+  height: 15px;
+}
+#outcome-indicators-query .el-form-item {
+    margin-bottom: 0px !important;
+}
+</style>
+
+
+<style rel="stylesheet/scss" lang="scss" scoped>
+.app-container {
+//   margin: 20px;
+  font-size: 15px;
+  .filter-container {
+    padding-bottom: 5px;
+  }
+  .cqd-dataTitle{
+    color: #303133;
+    font-size: 14px;
+    border-bottom: 2px #E4E7ED solid;
+    height: 36px;
+    line-height: 36px;
+    margin: 0 0 25px 0;
+    position: relative;
+  }
+  .cqd-dataTitle::before {
+      position: absolute;
+      left: 0;
+      bottom: -2px;
+      content: "";
+      width: 42px;
+      height: 2px;
+      background: #409eff;
+  }
+  .search-component {
+    width: 500px;
+    .searchBox {
+      width: 300px;
+      height: 36px;
+      line-height: 36px;
+      padding-left: 15px;
+      border: 1px #dcdfe6 solid;
+      border-right: none;
+      outline: none;
+      float: left;
+      border-radius: 6px 0 0 6px;
+      font-size: 14px;
+      color: #333;
+      background: #fff;
+      box-shadow: 3px 3px 4px rgba(135, 135, 135, 0.05);
+    }
+    .searchBtn {
+      background-color: #409eff;
+      color: #fff;
+      font-size: 15px;
+      text-align: center;
+      height: 36px;
+      line-height: 36px;
+      float: left;
+      outline: none;
+      width: 70px;
+      border: none;
+      border-radius: 0 6px 6px 0;
+      font-family: "Microsoft Yahei";
+      cursor: pointer;
+    }
+  }
+  .amount {
+    font-weight: normal;
+    padding: 10px 0 0 0;
+    color: #606266;
+    font-size: 14px;
+    span {
+      color: #ef2525;
+      font-family: "Arial";
+      padding: 0 2px;
+    }
+  }
+}
+</style>

src/xt_pages/qcd/patientAnalysis/total.vue

           </ul>
         </div>
       </div>
-
-
-      <h4 class="hui">统计图</h4>
-      <hr class="huixiao">
+      <div class="cqd-dataTitle">统计图</div>
       <el-row :gutter="32">
         <el-col :xs="24" :sm="24" :lg="24">
           <div class="chart-wrapper">
         </el-col>
       </el-row>
 
-      <h4 class="hui">统计表</h4>
-      <hr class="huixiao">
+      <div style="height:20px">&nbsp;</div>
+      <div class="cqd-dataTitle">统计表</div>
       <el-table
         ref="multipleTable"
         :data="tableData"
   .filter-container {
     padding-bottom: 5px;
   }
-  .hui {
-    color: #909399;
-    margin-bottom: 5px;
+  .cqd-dataTitle{
+    color: #303133;
+    font-size: 14px;
+    border-bottom: 2px #E4E7ED solid;
+    height: 36px;
+    line-height: 36px;
+    margin: 0 0 25px 0;
+    position: relative;
   }
-  .huixiao {
-    border: solid 1px #ebeef5;
+  .cqd-dataTitle::before {
+      position: absolute;
+      left: 0;
+      bottom: -2px;
+      content: "";
+      width: 42px;
+      height: 2px;
+      background: #409eff;
   }
   .search-component {
     width: 500px;

src/xt_pages/qcd/patientAnalysis/weight.vue

       </div>
 
 
-      <h4 class="hui">统计图</h4>
-      <hr class="huixiao">
+      <div class="cqd-dataTitle">统计图</div>
       <el-row :gutter="32">
         <el-col :xs="24" :sm="24" :lg="8">
           <div class="chart-wrapper">
         </el-col>
       </el-row>
 
-      <h4 class="hui">统计表</h4>
-      <hr class="huixiao">
+      <div style="height:20px">&nbsp;</div>
+      <div class="cqd-dataTitle">统计表</div>
       <el-table
         ref="multipleTable"
         :data="tableData"
   .filter-container {
     padding-bottom: 5px;
   }
-  .hui {
-    color: #909399;
-    margin-bottom: 5px;
+  .cqd-dataTitle{
+    color: #303133;
+    font-size: 14px;
+    border-bottom: 2px #E4E7ED solid;
+    height: 36px;
+    line-height: 36px;
+    margin: 0 0 25px 0;
+    position: relative;
   }
-  .huixiao {
-    border: solid 1px #ebeef5;
+  .cqd-dataTitle::before {
+      position: absolute;
+      left: 0;
+      bottom: -2px;
+      content: "";
+      width: 42px;
+      height: 2px;
+      background: #409eff;
   }
   .search-component {
     width: 500px;

src/xt_pages/qcd/processIndicators.vue

         </el-select>
       </div>
 
-      <h4 class="hui">统计图</h4>
-      <hr class="huixiao">
+      <div class="cqd-dataTitle">统计图</div>
       <el-row :gutter="32">
         <el-col :xs="24" :sm="24" :lg="24">
           <div class="chart-wrapper">
         </el-col>
       </el-row>
 
-      <h4 class="hui">统计表</h4>
-      <hr class="huixiao">
+      <div style="height:20px">&nbsp;</div>
+      <div class="cqd-dataTitle">统计表</div>
       <el-table
         ref="multipleTable"
         :data="tableData"
   .filter-container {
     padding-bottom: 5px;
   }
-  .hui {
-    color: #909399;
-    margin-bottom: 5px;
+  .cqd-dataTitle{
+    color: #303133;
+    font-size: 14px;
+    border-bottom: 2px #E4E7ED solid;
+    height: 36px;
+    line-height: 36px;
+    margin: 0 0 25px 0;
+    position: relative;
   }
-  .huixiao {
-    border: solid 1px #ebeef5;
+  .cqd-dataTitle::before {
+      position: absolute;
+      left: 0;
+      bottom: -2px;
+      content: "";
+      width: 42px;
+      height: 2px;
+      background: #409eff;
   }
   .search-component {
     width: 500px;

src/xt_pages/statistics/index.vue

   data() {
     return {
       crumbs: [
+        { path: 'statistics', name: '科室质控' },
         { path: 'statistics', name: '统计分析' },
-
       ],
         pageLoad:true,
         patientCount:0,

src/xt_pages/user/components/PatientForm.vue

               </el-col>
               <el-col :span="8" >
                 <el-form-item label="透析号 : " class="is-required" prop="dialysisNo" >
-<<<<<<< .mine
-                    <el-input v-model="form.dialysisNo" placeholder="填写或自动生成" style="width:62%;float:left;margin-right: 2%;" ></el-input> 
-                    <el-button style="width:36%;padding:10px 0;" :disabled="$store.getters.xt_user.subscibe.state==3||!subscibeFlag?true:false" type="primary" @click="generatedialysisno">自动生成</el-button>
-=======
                     <el-input v-model="form.dialysisNo" placeholder="填写或自动生成" style="width:62%;float:left;margin-right: 1%;" ></el-input>
                     <el-button style="width:70px;padding:10px 0;" :disabled="$store.getters.xt_user.subscibe.state==3||!subscibeFlag?true:false" type="primary" @click="generatedialysisno">自动生成</el-button>
->>>>>>> .theirs
                 </el-form-item>
               </el-col>
             </template>