修改

src/xt_pages/qcd/basicInformationAnalysis.vue

     <div class="app-container">
       <div class="cell clearfix">
         <label class="title">
-          <span class="name">转归状态</span> :
+          <span class="name">日期查询</span> :
         </label>
         <div class="time">
           <ul class>
       stateType: 0,
       month: [
         { value: 0, label: "本月", state: 0 },
-        { value: 1, label: "近三个月", state: 1 },
+        { value: 1, label: "近三月", state: 1 },
         { value: 2, label: "近半年", state: 2 },
         { value: 3, label: "近一年", state: 3 },
         { value:4,label:"自定义",state:4}
   flex-wrap: wrap;
   .infoOne {
     margin-right: 30px;
-    margin-top: 30px;
+    margin-top: 20px;
     .titleBox {
       display: flex;
       align-items: center;

src/xt_pages/qcd/checkStatistical.vue

     <div class="position">
       <bread-crumb :crumbs="crumbs"></bread-crumb>
     </div>
-    <div class="app-container">
+    <div class="app-container checkStatistical">
       <el-tabs v-model="tabActiveName" @tab-click="handleTabClick" style="margin-bottom:10px">
         <el-tab-pane label="质控达标统计配置" name="control"></el-tab-pane>
         <el-tab-pane label="检验检查统计配置" name="query"></el-tab-pane>
         </el-col>
       </el-row>
       <div class="configTable">
-        <el-table :data="checkList" border style="width: 100%">
+        <el-table :data="checkList" border style="width: 100%" :row-style="{ color: '#303133' }" :header-cell-style="{backgroundColor: 'rgb(245, 247, 250)',color: '#606266'}">
           <el-table-column prop="date" label="检验检查项">
               <template slot-scope="scope">{{ scope.row.project_name }}</template>
           </el-table-column>
     text-align: center;
   }
 }
+.checkStatistical{
+  .el-tabs{
+    margin-bottom: 0 !important;
+  }
+}
 </style>
 
  <style rel="stylesheet/scss" lang="scss" scoped>

src/xt_pages/qcd/indicatorControlAnalysis/analysis.vue

       ],
       way: [
         { value: 0, label: "科室", state: 0 },
-        { value: 1, label: "个人", state: 1 }
+        { value: 1, label: "患者", state: 1 }
       ],
       wayType: 0
     };
   }
 };
 </script>
+
+<style lang="scss">
+.page_analysis{
+  .el-tabs{
+    margin-bottom:0 !important;
+  }
+}
+
+</style>

src/xt_pages/qcd/indicatorControlAnalysis/components/office.vue

 <template>
   <div class="page_office">
     <div class="cell clearfix">
-      <el-select v-model="query.project_id" placeholder="请选择" style="width:120px;margin-right:20px"
+      <el-select v-model="query.project_id" placeholder="请选择" style="width:120px;margin-right:10px"
                  @change="changeProject">
         <el-option
           v-for="item in project_columns"
       <el-select
         v-model="query.item_id"
         placeholder="请选择"
-        style="width:120px;margin-right:20px"
+        style="width:120px;margin-right:10px"
         @change="changeItem"
       >
         <el-option
         ></el-option>
       </el-select>
 
-      <el-select v-model="query.range_value" placeholder="请选择" style="width:120px;margin-right:20px"
+      <el-select v-model="query.range_value" placeholder="请选择" style="width:120px;margin-right:10px"
                  @change="changeRangeValue">
         <el-option
           v-for="item in range_value_columns"

src/xt_pages/qcd/officesControlAnalysis/project.vue

         <el-tab-pane label="按项目分组" name="second"></el-tab-pane>
       </el-tabs>
       <div class="cell clearfix">
-        <el-select v-model="lapseto" placeholder="请选择" style="width:120px;margin-right:20px" @change="changeOptions">
+        <el-select v-model="lapseto" placeholder="请选择" style="width:120px;margin-right:10px" @change="changeOptions">
           <el-option
             v-for="item in options"
             :key="item.value"
             :value="item.value"
           ></el-option>
         </el-select>
-        <el-select v-model="type" placeholder="请选择" @change="chooseType" style="margin-right:20px">
+        <el-select v-model="type" placeholder="请选择" @change="chooseType" style="margin-right:10px">
           <el-option
             v-for="item in options1"
             :key="item.value"
             :value="item.value"
           ></el-option>
         </el-select>
-        <el-select v-model="mode_type" placeholder="请选择" style="width:120px;margin-right:20px" @change="handleModeType">
+        <el-select v-model="mode_type" placeholder="请选择" style="width:120px;margin-right:0px" @change="handleModeType">
           <el-option
             v-for="item in normdata"
             :key="item.inspection_minor"
       <div class="cell clearfix">
         <p class="chartTitle">统计图</p>
       </div>
+      <div class="cell clearfix">
+        <p class="point"></p>
+        <p class="pointTitle">达标率</p>
+      </div>
       <div>
         <line-chart :options="chart"></line-chart>
       </div>
       mode_type:"",
       range_type:"",
       chart: {
-        title: {
-          text: "ECharts 入门示例"
-        },
+        // title: {
+        //   text: "ECharts 入门示例"
+        // },
         tooltip: {},
-        legend: {
-          data: ["次数"],
-          left: 0
-        },
+        // legend: {
+        //   data: ["次数"],
+        //   left: 0
+        // },
         xAxis: {
           data: ["1", "2", "3", "4", "5", "6", "7", "8", "9"]
         },
               emphasis: {
                 shadowBlur: 10,
                 shadowOffsetX: 0,
-                shadowColor: "rgba(0, 0, 0, 0.5)"
+                shadowColor: "rgba(0, 0, 0, 0.2)"
               }
             }
           }
 }
 .newDisplay {
   flex-wrap: wrap;
+  padding-left: 20px;
 }
 </style>

src/xt_pages/qcd/officesControlAnalysis/time.vue

         <el-tab-pane label="按项目分组" name="second"></el-tab-pane>
       </el-tabs>
       <div class="cell clearfix">
-        <el-select v-model="lapseto" placeholder="请选择" style="width:120px;margin-right:20px" @change="changeLapseto">
+        <el-select v-model="lapseto" placeholder="请选择" style="width:120px;margin-right:10px" @change="changeLapseto">
           <el-option
             v-for="item in options"
             :key="item.value"
             :value="item.value"
           ></el-option>
         </el-select>
-        <el-select v-model="type" placeholder="请选择" @change="chooseType" style="margin-right:20px">
+        <el-select v-model="type" placeholder="请选择" @change="chooseType" style="margin-right:10px">
           <el-option
             v-for="item in options1"
             :key="item.value"
       <div class="cell clearfix">
         <p class="chartTitle">统计图</p>
       </div>
+      <div class="cell clearfix">
+        <p class="point"></p>
+        <p class="pointTitle">达标率</p>
+      </div>
       <div>
         <line-chart :options="chart"></line-chart>
       </div>
       ],
       monthType: 0,
       chart: {
-        title: {
-          text: "ECharts 入门示例"
-        },
+        // title: {
+        //   text: "ECharts 入门示例"
+        // },
         tooltip: {},
-        legend: {
-          data: ["次数"],
-          left: 0
-        },
+        // legend: {
+        //   data: ["达标率"],
+        //   left: 0
+        // },
         xAxis: {
           data: []
         },
         },
         series: [
           {
-            name: "次数",
+            name: "达标率",
             type: "bar",
             data: [],
             barWidth: 30,
               emphasis: {
                 shadowBlur: 10,
                 shadowOffsetX: 0,
-                shadowColor: "rgba(0, 0, 0, 0.5)"
+                shadowColor: "rgba(0, 0, 0, 0.2)"
               }
             }
           }
 }
 .newDisplay {
   flex-wrap: wrap;
+  padding-left: 20px;
 }
 </style>

src/xt_pages/qcd/patientComplianceDetails.vue

           </el-form>
         </div>
         <el-container>
-          <div style="width:150px">
+          <div style="width:160px">
+            <el-form :inline="true" :model="listQuery">
+              <el-form-item label>
+                <el-autocomplete
+                  class="checkSearch"
+                  popper-class="my-autocomplete"
+                  v-model.trim="listQuery.search"
+                  :fetch-suggestions="querySearchAsync"
+                  :trigger-on-focus="false"
+                  placeholder="病人透析号/姓名"
+                  @select="handleSelect"
+                >
+                  <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>
             <div class="tableTitle">患者列表</div>
-            <el-table :data="patientsData" border style="width: 100%;" height="500"  highlight-current-row @current-change="handleChange">
-              <el-table-column prop="name" label="透析号" width="80">
+            <el-table :data="patientsData" border style="width: 100%;" height="500"  highlight-current-row @current-change="handleChange" :row-style="{ color: '#303133' }" :header-cell-style="{backgroundColor: 'rgb(245, 247, 250)',color: '#606266'}">
+              <el-table-column prop="name" label="透析号" width="70">
                  <template slot-scope="scope">
                     {{scope.row.dialysis_no}}
                  </template>
               </el-table-column>
-              <el-table-column prop="date" label="透析号" width="70">
+              <el-table-column prop="date" label="姓名" width="90">
                  <template slot-scope="scope">
                     {{scope.row.name }}
                  </template>
               </div>
             </div>
             <div class="tableTitle">指标趋势</div>
+            <div class="cell clearfix">
+              <p class="point"></p>
+              <p class="pointTitle">达标率</p>
+            </div>
             <div>
               <line-chart :options="chart"></line-chart>
             </div>
       item_id:0,
       month: [
         { value: 0, label: "本月", state: 0 },
-        { value: 1, label: "近三个月", state: 1 },
+        { value: 1, label: "近三月", state: 1 },
         { value: 2, label: "近半年", state: 2 },
         { value: 3, label: "近一年", state: 3 }
       ],
       },
       patientid:0,
       monthType: 0,
-      arr: ["钙", "磷", "钙萨达撒所多", "磷", "钙", "磷", "钙", "磷"],
+      arr: [],
       quality: 0,
       chart: {
         title: {
           text: "ECharts 入门示例"
         },
         tooltip: {},
-        legend: {
-          data: ["次数"],
-          left: 0
-        },
+        // legend: {
+        //   data: ["次数"],
+        //   left: 0
+        // },
         xAxis: {
           data: []
         },
                     { offset: 1, color: colorList[index][1] }
                   ]);
                 },
+                lineStyle:{ 
+                  color:'#409eff' //改变折线颜色
+                }, 
                 barBorderRadius: [5, 5, 0, 0] //柱状角成椭圆形
               },
 
 </script>
 
 <style lang="scss" scoped>
+.point {
+  width: 13px;
+  height: 13px;
+  background: linear-gradient(
+    0deg,
+    rgba(169, 224, 243, 1),
+    rgba(159, 189, 252, 1)
+  );
+  border-radius: 7px;
+  margin-right: 8px;
+}
+.pointTitle {
+  font-size: 13px;
+}
 .containerRight {
   padding-left: 10px;
 }
   display: flex;
   flex-wrap: nowrap;
   min-width: 1800px;
+  padding-bottom: 10px;
   .qualityOne {
     width: 4.5rem;
     height: 4.5rem;
   ::-webkit-scrollbar{
     height: 15px !important;
   }
+  .el-form--inline .el-form-item{
+    margin-right:0;
+  }
 }
 </style>

src/xt_pages/qcd/patientControlAnalysis.vue

                 v-model.trim="listQuery.search"
                 :fetch-suggestions="querySearchAsync"
                 :trigger-on-focus="false"
-                placeholder="输入病人透析号/姓名"
+                placeholder="病人透析号/姓名"
                 @select="handleSelect"
               >
                 <i class="el-icon-search el-input__icon" slot="suffix"></i>
         <div class="cell clearfix">
           <p class="chartTitle">统计图</p>
         </div>
+        <div class="cell clearfix">
+          <p class="point"></p>
+          <p class="pointTitle">指标正常范围值</p>
+        </div>
         <div>
           <line-chart :options="chart"></line-chart>
         </div>
         </el-table-column>
             <el-table-column fixed="right" label="操作" width="100">
               <template slot-scope="scope">
-                <el-button @click="handleClick(scope.row.patient_id,scope.row.inspect_date)" type="text" size="small">查看</el-button>
+                <el-button @click="handleClick(scope.row.patient_id,scope.row.inspect_date)" style="font-size:14px;" type="text" size="small">查看</el-button>
               </template>
             </el-table-column>
           </el-table>
         series: []
       },
       chart: {
-        title: {
-          text: "ECharts 入门示例"
-        },
+        // title: {
+        //   text: "ECharts 入门示例"
+        // },
         tooltip: {},
-        legend: {
-          data: ["次数"],
-          left: 0
-        },
+        // legend: {
+        //   data: ["次数"],
+        //   left: 0
+        // },
         xAxis: {
-          data: ["达标", "未达标"]
+          data: []
         },
         yAxis: {
           axisLabel: {
           {
             name: "次数",
             type: "bar",
-            data: ["78.57", "50"],
+            data: [],
             barWidth: 30,
             label: {
               normal: {
               emphasis: {
                 shadowBlur: 10,
                 shadowOffsetX: 0,
-                shadowColor: "rgba(0, 0, 0, 0.5)"
+                shadowColor: "rgba(0, 0, 0, 0.2)"
               }
             }
           }
   .pointTitle {
     font-size: 13px;
   }
+  .chartTitle {
+    font-size: 16px;
+    font-weight: bold;
+    color: #000000;
+  }
+  .point {
+    width: 13px;
+    height: 13px;
+    background: linear-gradient(
+      0deg,
+      rgba(169, 224, 243, 1),
+      rgba(159, 189, 252, 1)
+    );
+    border-radius: 7px;
+    margin-right: 8px;
+  }
+  .pointTitle {
+    font-size: 13px;
+  }
 }
 
 </style>

src/xt_pages/qcd/statisticalConfiguration.vue

     <div class="position">
       <bread-crumb :crumbs="crumbs"></bread-crumb>
     </div>
-    <div class="app-container">
+    <div class="app-container statisticalConfig">
       <el-tabs v-model="tabActiveName" @tab-click="handleTabClick" style="margin-bottom:10px">
         <el-tab-pane label="质控达标统计配置" name="control"></el-tab-pane>
         <el-tab-pane label="检验检查统计配置" name="query"></el-tab-pane>
         </el-col>
       </el-row>
       <div class="configTable">
-        <el-table :data="configuraData" border style="width: 100%">
+        <el-table :data="configuraData" border style="width: 100%" :row-style="{ color: '#303133' }" :header-cell-style="{backgroundColor: 'rgb(245, 247, 250)',color: '#606266'}">
           <el-table-column prop="date" label="检验检查大项" width="180">
               <template slot-scope="scope">{{ scope.row.project_name }}</template>
           </el-table-column>
     margin-left:0 !important;
   }
 }
+.statisticalConfig{
+  .el-tabs{
+    margin-bottom: 0 !important;
+  }
+}
 </style>
 
  <style rel="stylesheet/scss" lang="scss" scoped>

src/xt_pages/qcd/treatmentControlAnalysis/components/CheckAll.vue

              :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 }">
           </el-autocomplete>
         </el-form-item>
       </el-form>
-      <label class="title">
+      <label class="title" style="text-align:left;">
         <span class="name">日期查询</span> :
       </label>
       <el-date-picker
       ></el-date-picker>
     </div>
     <el-container>
-      <div style="width:150px">
+      <div style="width:160px">
         <div class="tableTitle">患者列表</div>
         <el-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="80">
+           <el-table-column prop="dialysis_no" label="透析号" width="70">
             <template slot-scope="scope">{{scope.row.dialysis_no}}</template>
           </el-table-column>
-          <el-table-column prop="name" label="姓名" width="80">
+          <el-table-column prop="name" label="姓名" width="90">
             <template slot-scope="scope">{{ scope.row.name }}</template>
           </el-table-column>
         </el-table>

src/xt_pages/qcd/treatmentControlAnalysis/components/CheckPersonal.vue

              :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 }">
           </el-autocomplete>
         </el-form-item>
       </el-form>
-      <label class="title">
+      <label class="title" style="text-align:left;">
         <span class="name">日期查询</span> :
       </label>
       <el-date-picker
       ></el-date-picker>
     </div>
     <el-container>
-      <div style="width:150px">
+      <div style="width:160px">
         <div class="tableTitle">患者列表</div>
         <el-table :data="patientsData" border style="width: 100%;" 
           height="500" :row-style="{ color: '#303133' }" 
            ref="singleTable"
           @current-change="handleChange"
           >
-           <el-table-column prop="dialysis_no" label="透析号" width="80">
+           <el-table-column prop="dialysis_no" label="透析号" width="70">
             <template slot-scope="scope">{{scope.row.dialysis_no}}</template>
           </el-table-column>
-          <el-table-column prop="name" label="姓名" width="80">
+          <el-table-column prop="name" label="姓名" width="90">
             <template slot-scope="scope">{{ scope.row.name }}</template>
           </el-table-column>
         </el-table>

src/xt_pages/qcd/treatmentControlAnalysis/components/TimeAll.vue

       ></el-date-picker>
     </div>
     <div class="tableTitle">统计图</div>
+    <div class="cell clearfix" style="margin:0;">
+        <p class="point"></p>
+        <p class="pointTitle">次</p>
+      </div>
     <div>
       <line-chart :options="chart"></line-chart>
     </div>
       ],
       chart: {
         tooltip: {},
-        legend: {
-          data: ["次"],
-          left: 0
-        },
+        // legend: {
+        //   data: ["次"],
+        //   left: 0
+        // },
         xAxis: {
           data: []
         },
               },
 
               //鼠标悬停时：
-              // emphasis: {
-              //   shadowBlur: 10,
-              //   shadowOffsetX: 0,
-              //   shadowColor: "rgba(0, 0, 0, 0.5)"
-              // }
+              emphasis: {
+                shadowBlur: 10,
+                shadowOffsetX: 0,
+                shadowColor: "rgba(0, 0, 0, 0.2)"
+              }
             }
           }
         ]
   font-weight: bold;
   margin-bottom: 10px;
 }
+.point {
+  width: 13px;
+  height: 13px;
+  background: linear-gradient(
+    0deg,
+    rgba(169, 224, 243, 1),
+    rgba(159, 189, 252, 1)
+  );
+  border-radius: 7px;
+  margin-right: 8px;
+}
+.pointTitle {
+  font-size: 13px;
+}
 </style>
 
 <style lang="scss">

src/xt_pages/qcd/treatmentControlAnalysis/components/TimePersonal.vue

              v-model.trim="listQuery.search"
              :fetch-suggestions="querySearchAsync"
              :trigger-on-focus="false"
-             placeholder="输入病人透析号/姓名"
+             placeholder="病人透析号/姓名"
              @select="handleSelect"
+              style="width:160px;"
               >
              <i class="el-icon-search el-input__icon" slot="suffix"></i>
                <template slot-scope="{ item }">
           </el-autocomplete>
         </el-form-item>
       </el-form>
-      <label class="title">
+      <label class="title" style="text-align:left;">
         <span class="name">日期查询</span> :
       </label>
       <el-date-picker
       ></el-date-picker>
     </div>
     <el-container>
-      <div style="width:150px">
+      <div style="width:160px">
         <div class="tableTitle">患者列表</div>
         <el-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="80">
+          <el-table-column prop="dialysis_no" label="透析号" width="70">
             <template slot-scope="scope">{{scope.row.dialysis_no}}</template>
           </el-table-column>
-          <el-table-column prop="name" label="姓名" width="80">
+          <el-table-column prop="name" label="姓名" width="90">
             <template slot-scope="scope">{{ scope.row.name }}</template>
           </el-table-column>
         </el-table>