Merge branch 'wzf' of http://git.shengws.com/zhangbj/xt_pad into wzf

src/pages/advice/DialysisAdviceTable.vue

@@ -158,9 +158,9 @@
       </template>
       </table>-->
 
-      <div class="NoData" v-show="zones.length <= 1">
+      <!-- <div class="NoData" v-show="zones.length <= 1">
         <img style="margin-top: 50px; margin-bottom: 50px" src="@/assets/login/data.jpg" alt />
-      </div>
+      </div>-->
       <el-table :data="date" border style="width: 100%">
         <el-table-column fixed prop="date" label="姓名" width="100" align="center">
             <template slot-scope="scope">
@@ -575,14 +575,14 @@ export default {
   }
 }
 .DialysisAdvice {
-  padding-top: 85px;
+  padding-top: 75px;
   // background: #fff;
   min-height: calc(100vh - 2px);
   // @media only screen and (max-width: 812px) {
   //   padding-top: 70px !important;
   // }
   @media only screen and (min-width: 768px) {
-    padding-top: 130px !important;
+    padding-top: 126px !important;
   }
   // @media only screen and (min-width: 813px) and (max-width: 1024px) {
   //   padding-top: 118px !important;

src/pages/main/DialysisArea.vue

@@ -456,7 +456,7 @@ export default {
 .screening {
   border-bottom: 1px #e5e5e5 solid;
   position: fixed;
-  top: 98px;
+  top: 100px;
   @media only screen and (min-width: 768px) {
     top: 163px;
   }

src/pages/main/PatientBox.vue

@@ -422,7 +422,7 @@ export default {
   color: #fff;
   border-radius: 15px;
   font-size: 14px;
-  @media only screen and (max-width: 376px) {
+  @media only screen and (max-width: 415px) {
     font-size: 0.34rem !important;
   }
 }

src/pages/main/RecordPage.vue

@@ -239,8 +239,8 @@ export default {
       float: left;
       font-size: 0.45rem;
       margin: 0 0.2rem;
-      height: 0.8rem;
-      line-height: 0.8rem;
+      height: 0.9rem;
+      line-height: 0.85rem;
       padding: 0 0.4rem;
       // color: $title-color;
       color: #fff;

src/pages/main/WaitingArea.vue

@@ -634,7 +634,7 @@ export default {
 .screening {
   border-bottom: 1px #e5e5e5 solid;
   position: fixed;
-  top: 98px;
+  top: 100px;
   @media only screen and (min-width: 768px) {
     top: 163px;
   }

src/pages/main/add_urgent_schedule.vue

@@ -21,7 +21,27 @@
           </van-col>
         </van-row>
         <van-row class="row">
-          <van-col :span="12">
+          <van-col :span="24">
+            <div class="field_panel">
+              <el-autocomplete
+                class="Input"
+                popper-class="my-autocomplete"
+                v-model="value"
+                :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>
+            </div>
+          </van-col>
+        </van-row>
+        <van-row class="row">
+          <van-col :span="24">
             <span class="title">日期：</span>
             <div class="field_panel">
               <van-field v-model="date" class="field"></van-field>
@@ -29,7 +49,7 @@
           </van-col>
         </van-row>
         <van-row class="row">
-          <van-col :span="12">
+          <van-col :span="24">
             <span class="title">患者：</span>
             <div class="field_panel">
               <van-field
@@ -41,28 +61,9 @@
               ></van-field>
             </div>
           </van-col>
-
-          <van-col :span="9">
-            <div class="field_panel">
-              <el-autocomplete
-                style="float: right"
-                popper-class="my-autocomplete"
-                v-model="value"
-                :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>
-            </div>
-          </van-col>
         </van-row>
         <van-row class="row">
-          <van-col :span="12">
+          <van-col :span="24">
             <span class="title">班次：</span>
             <div class="field_panel">
               <van-field
@@ -75,7 +76,7 @@
             </div>
           </van-col>
 
-          <van-col :span="12">
+          <van-col :span="24">
             <span class="title">治疗模式：</span>
             <div class="field_panel">
               <van-field
@@ -87,7 +88,7 @@
               ></van-field>
             </div>
           </van-col>
-          <van-col :span="12">
+          <van-col :span="24">
             <span class="title">床位：</span>
             <div class="field_panel">
               <van-field
@@ -102,10 +103,11 @@
         </van-row>
         <van-row class="row">
           <van-col :span="24">
-            <span class="title">&nbsp;</span>
+            <!-- <span class="title">&nbsp;</span>
             <div class="field_panel">
               <van-button type="info" size="normal" @click="submitAction">立即排班</van-button>
-            </div>
+            </div>-->
+            <div class="nowScheduling" @click="submitAction">立即排班</div>
           </van-col>
         </van-row>
       </div>
@@ -519,7 +521,7 @@ export default {
     }
     .nav {
       text-align: center;
-      font-size: 0.36rem;
+      font-size: 0.45rem;
       margin-right: 56px;
     }
   }
@@ -528,25 +530,29 @@ export default {
     background: #fff;
     min-height: calc(100vh - 2px);
     padding-top: 55px;
-    padding-left: 20px;
-
+    // padding-left: 20px;
+    @media only screen and (min-width: 768px) {
+      padding-top: 100px;
+    }
     .row {
-      padding: 5px 0;
+      // padding: 5px 0;
+      width: 80%;
+      margin: 0 auto;
       .title {
         color: #8f8f8f;
         margin-right: 5px;
-        text-align: right;
-        font-size: 16px;
+        text-align: left;
+        font-size: 0.45rem;
         line-height: 45px;
-        width: 80px;
+        width: 3rem;
         float: left;
         // @media only screen and (max-width: 812px) {
         //   font-size: 0.3rem !important;
         // }
-        @media only screen and (max-width: 376px) {
-          width: 50px !important;
-          font-size: 0.3rem !important;
-        }
+        // @media only screen and (max-width: 376px) {
+        //   width: 50px !important;
+        //   font-size: 0.3rem !important;
+        // }
       }
       .el-input__inner {
         @media only screen and (max-width: 812px) {
@@ -555,15 +561,16 @@ export default {
         }
       }
       .field_panel {
-        display: inline-block;
+        // display: inline-block;
+        height: 1.4rem;
         .field {
           padding: 0 0;
-          font-size: 18px;
+          font-size: 0.45rem;
           line-height: 45px;
           width: 180px;
-          @media only screen and (max-width: 812px) {
-            width: 100px;
-          }
+          // @media only screen and (max-width: 812px) {
+          //   width: 100px;
+          // }
         }
       }
 
@@ -576,6 +583,17 @@ export default {
           margin-left: -10px !important;
         }
       }
+      .nowScheduling {
+        width: 100%;
+        height: 1.3rem;
+        line-height: 1.3rem;
+        border-radius: 30px;
+        text-align: center;
+        background: #258ffc;
+        font-size: 0.45rem;
+        color: #fff;
+        margin-top: 0.5rem;
+      }
     }
   }
 }
@@ -593,3 +611,24 @@ export default {
   }
 }
 </style>
+<style lang="scss">
+.Input {
+  width: 100%;
+  .el-input__inner {
+    border-radius: 30px;
+    font-size: 0.4rem;
+    @media only screen and (min-width: 768px) {
+      height: 1.2rem;
+      line-height: 1.2rem;
+      border-radius: 50px;
+    }
+  }
+  .el-input__icon {
+    font-size: 0.45rem;
+    @media only screen and (min-width: 768px) {
+      margin-top: 2px;
+      margin-right: 8px;
+    }
+  }
+}
+</style>

src/pages/main/dialysis/AdviceTable.vue

@@ -1550,6 +1550,9 @@ export default {
       margin: 0 auto;
       font-size: 0.32rem;
       color: $pgh-color;
+      @media only screen and (min-width: 768px) {
+        width: 76%;
+      }
       li {
         @include display-flex;
         @include align-items-center;
@@ -1559,9 +1562,9 @@ export default {
 
         .iconfont {
           margin: 0 0.1rem;
-          @media only screen and (max-width: 812px) {
-            font-size: 12px !important;
-          }
+          // @media only screen and (max-width: 767px) {
+          //   font-size: 12px !important;
+          // }
         }
         .line {
           background: #a8b3ba;

src/pages/main/dialysis/MissionTable.vue

@@ -223,9 +223,9 @@ export default {
       margin: 0 auto;
       .iconfont {
         margin: 0 0.1rem;
-        @media only screen and (max-width: 812px) {
-          font-size: 12px !important;
-        }
+        // @media only screen and (max-width: 812px) {
+        //   font-size: 12px !important;
+        // }
       }
       .line {
         background: #a8b3ba;

src/pages/main/dialysis/RecordTable.vue

@@ -481,6 +481,9 @@ export default {
     margin: 0 auto;
     font-size: 0.4rem;
     color: $pgh-color;
+    @media only screen and (min-width: 768px) {
+      width: 80%;
+    }
     li {
       @include display-flex;
       @include align-items-center;
@@ -488,9 +491,9 @@ export default {
       padding: 0.3rem 0;
       .iconfont {
         margin: 0 0.1rem;
-        @media only screen and (max-width: 812px) {
-          font-size: 12px !important;
-        }
+        // @media only screen and (max-width: 812px) {
+        //   font-size: 12px !important;
+        // }
       }
       .line {
         background: #a8b3ba;

src/pages/main/today/acceptsAssessment.vue

@@ -59,7 +59,7 @@
           <span class="content">{{this.record.sick_condition_other}}</span>
         </li>
 
-        <li style="height: 0.6rem;" v-if="isShow('摄入量')">
+        <li v-if="isShow('摄入量')">
           <label>摄入量:</label>
           <span class="content">{{intakes}}</span>
         </li>

src/pages/main/today/dialysisMonitoring.vue

@@ -56,160 +56,142 @@
     </div>-->
     <el-table :data="tableDate" border style="width: 100%" ref="form">
       <span v-if="isShow('监测时间')">
-         <el-table-column fixed prop="date" label="时间" width="100" align="center">
-            <template slot-scope="scope">
-                {{parseTime(scope.row.operate_time, "{y}-{m}-{d} {h}:{i}")}}
-            </template>
+        <el-table-column fixed prop="date" label="时间" width="100" align="center">
+          <template slot-scope="scope">{{parseTime(scope.row.operate_time, "{y}-{m}-{d} {h}:{i}")}}</template>
         </el-table-column>
       </span>
-      <span  v-if="isShow('体温')">
-          <el-table-column prop="name" label="体温(℃)" width="100" align="center">
-             <template slot-scope="scope">
-                 {{scope.row.temperature?scope.row.temperature:''}}
-             </template>
-          </el-table-column>
+      <span v-if="isShow('体温')">
+        <el-table-column prop="name" label="体温(℃)" width="80" align="center">
+          <template slot-scope="scope">{{scope.row.temperature?scope.row.temperature:''}}</template>
+        </el-table-column>
       </span>
-      <span v-if="isShow('血压')" >
-          <el-table-column prop="province" label="血压(mmHg)" width="100" align="center">
-               <template slot-scope="scope">
-                   {{scope.row.systolic_blood_pressure?scope.row.systolic_blood_pressure:''}}/{{scope.row.diastolic_blood_pressure?scope.row.diastolic_blood_pressure:''}}
-               </template>
-          </el-table-column>
+      <span v-if="isShow('血压')">
+        <el-table-column prop="province" label="血压(mmHg)" width="110" align="center">
+          <template
+            slot-scope="scope"
+          >{{scope.row.systolic_blood_pressure?scope.row.systolic_blood_pressure:''}}/{{scope.row.diastolic_blood_pressure?scope.row.diastolic_blood_pressure:''}}</template>
+        </el-table-column>
       </span>
       <span v-if="isShow('脉搏')">
-            <el-table-column prop="city" label="脉搏(次/分)" width="100" align="center">
-                <template slot-scope="scope">
-                  {{scope.row.pulse_frequency?scope.row.pulse_frequency:''}}
-                </template>
-            </el-table-column>
+        <el-table-column prop="city" label="脉搏(次/分)" width="100" align="center">
+          <template slot-scope="scope">{{scope.row.pulse_frequency?scope.row.pulse_frequency:''}}</template>
+        </el-table-column>
       </span>
       <span v-if="isShow('呼吸频率')">
-           <el-table-column prop="address" label="呼吸频率(次/分)" width="200" align="center">
-                 <template slot-scope="scope">
-                   {{scope.row.breathing_rate?scope.row.breathing_rate:''}}
-                 </template>
-           </el-table-column>
+        <el-table-column prop="address" label="呼吸频率(次/分)" width="140" align="center">
+          <template slot-scope="scope">{{scope.row.breathing_rate?scope.row.breathing_rate:''}}</template>
+        </el-table-column>
       </span>
       <el-table-column prop="zip" label="静脉压/动脉压(mmHg)" width="100" align="center">
-           <template slot-scope="scope" >
-              {{scope.row.venous_pressure?scope.row.venous_pressure:''}}/{{scope.row.arterial_pressure?scope.row.arterial_pressure:''}}
-           </template>
+        <template
+          slot-scope="scope"
+        >{{scope.row.venous_pressure?scope.row.venous_pressure:''}}/{{scope.row.arterial_pressure?scope.row.arterial_pressure:''}}</template>
       </el-table-column>
       <span v-if="isShow('血流量')">
-           <el-table-column prop="zip" label="血流量(ml/min)" width="150" align="center">
-              <template slot-scope="scope">
-                {{scope.row.blood_flow_volume?scope.row.blood_flow_volume:''}}
-              </template>
-           </el-table-column>
+        <el-table-column prop="zip" label="血流量(ml/min)" width="150" align="center">
+          <template
+            slot-scope="scope"
+          >{{scope.row.blood_flow_volume?scope.row.blood_flow_volume:''}}</template>
+        </el-table-column>
       </span>
       <span v-if="isShow('跨膜压')">
-           <el-table-column prop="zip" label="跨膜压(mmHg)" width="200" align="center">
-                <template slot-scope="scope">
-                   {{scope.row.transmembrane_pressure?scope.row.transmembrane_pressure:''}}
-                </template>
-           </el-table-column>
+        <el-table-column prop="zip" label="跨膜压(mmHg)" width="130" align="center">
+          <template
+            slot-scope="scope"
+          >{{scope.row.transmembrane_pressure?scope.row.transmembrane_pressure:''}}</template>
+        </el-table-column>
       </span>
-      <span  v-if="isShow('超滤量')">
-            <el-table-column prop="zip" label="超滤量(ml)" width="200" align="center">
-                <template slot-scope="scope">
-                    {{scope.row.ultrafiltration_volume?scope.row.ultrafiltration_volume:''}}
-                </template>
-            </el-table-column>
+      <span v-if="isShow('超滤量')">
+        <el-table-column prop="zip" label="超滤量(ml)" width="100" align="center">
+          <template
+            slot-scope="scope"
+          >{{scope.row.ultrafiltration_volume?scope.row.ultrafiltration_volume:''}}</template>
+        </el-table-column>
       </span>
 
       <span v-if="isShow('钠浓度')">
-            <el-table-column prop="zip" label="钠浓度(mmol/L)" width="200" align="center">
-                <template slot-scope="scope">
-                     {{scope.row.sodium_concentration?scope.row.sodium_concentration:''}}
-                </template>
-            </el-table-column>
+        <el-table-column prop="zip" label="钠浓度(mmol/L)" width="100" align="center">
+          <template
+            slot-scope="scope"
+          >{{scope.row.sodium_concentration?scope.row.sodium_concentration:''}}</template>
+        </el-table-column>
       </span>
 
       <span v-if="isShow('透析液温度')">
-           <el-table-column prop="zip" label="透析液温度(℃)" width="200" align="center">
-                 <template slot-scope="scope">
-                    {{scope.row.dialysate_temperature?scope.row.dialysate_temperature:''}}
-                 </template>
-             </el-table-column>
+        <el-table-column prop="zip" label="透析液温度(℃)" width="100" align="center">
+          <template
+            slot-scope="scope"
+          >{{scope.row.dialysate_temperature?scope.row.dialysate_temperature:''}}</template>
+        </el-table-column>
       </span>
 
       <span v-if="isShow('置换率')">
-          <el-table-column prop="zip" label="置换率(L/h)" width="200" align="center">
-             <template slot-scope="scope">
-                {{scope.row.replacement_rate?scope.row.replacement_rate:''}}
-             </template>
-          </el-table-column>
+        <el-table-column prop="zip" label="置换率(L/h)" width="200" align="center">
+          <template slot-scope="scope">{{scope.row.replacement_rate?scope.row.replacement_rate:''}}</template>
+        </el-table-column>
       </span>
 
       <span v-if="isShow('置换量')">
-           <el-table-column prop="zip" label="置换量(L)" width="200" align="center">
-                <template slot-scope="scope">
-                  {{scope.row.displacement_quantity?scope.row.displacement_quantity:''}}
-                </template>
-           </el-table-column>
+        <el-table-column prop="zip" label="置换量(L)" width="200" align="center">
+          <template
+            slot-scope="scope"
+          >{{scope.row.displacement_quantity?scope.row.displacement_quantity:''}}</template>
+        </el-table-column>
       </span>
 
       <span v-if="isShow('电导度')">
-         <el-table-column prop="zip" label="电导度(mS/m)" width="200" align="center">
-              <template slot-scope="scope">
-               {{scope.row.conductivity?scope.row.conductivity:''}}
-              </template>
-         </el-table-column>
+        <el-table-column prop="zip" label="电导度(mS/m)" width="200" align="center">
+          <template slot-scope="scope">{{scope.row.conductivity?scope.row.conductivity:''}}</template>
+        </el-table-column>
       </span>
 
-      <span  v-if="isShow('置换液流量')">
-             <el-table-column prop="zip" label="置换液流量(ml/h)" width="200" align="center">
-                <template slot-scope="scope">
-                    {{scope.row.displacement_flow_quantity?scope.row.displacement_flow_quantity:''}}
-                </template>
-             </el-table-column>
+      <span v-if="isShow('置换液流量')">
+        <el-table-column prop="zip" label="置换液流量(ml/h)" width="200" align="center">
+          <template
+            slot-scope="scope"
+          >{{scope.row.displacement_flow_quantity?scope.row.displacement_flow_quantity:''}}</template>
+        </el-table-column>
       </span>
 
       <span v-if="isShow('病情变化')">
-           <el-table-column prop="zip" label="病情变化" width="200" align="center">
-             <template slot-scope="scope">
-                 {{scope.row.symptom}}
-             </template>
-           </el-table-column>
+        <el-table-column prop="zip" label="病情变化" width="200" align="center">
+          <template slot-scope="scope">{{scope.row.symptom}}</template>
+        </el-table-column>
       </span>
 
-       <span v-if="isShow('处理')">
-            <el-table-column prop="zip" label="处理" width="200" align="center">
-              <template slot-scope="scope">
-               {{scope.row.dispose}}
-              </template>
-            </el-table-column>
-       </span>
+      <span v-if="isShow('处理')">
+        <el-table-column prop="zip" label="处理" width="200" align="center">
+          <template slot-scope="scope">{{scope.row.dispose}}</template>
+        </el-table-column>
+      </span>
 
       <span v-if="isShow('结果')">
-            <el-table-column prop="zip" label="结果" width="200" align="center">
-                 <template slot-scope="scope">
-                   {{scope.row.result}}
-                 </template>
-            </el-table-column>
+        <el-table-column prop="zip" label="结果" width="200" align="center">
+          <template slot-scope="scope">{{scope.row.result}}</template>
+        </el-table-column>
       </span>
     </el-table>
   </div>
 </template>
 
 <script>
-import { parseTime } from '@/utils'
+import { parseTime } from "@/utils";
 
 export default {
-  name: 'statOrder',
-  data () {
+  name: "statOrder",
+  data() {
     return {
-      title: '透析监测 ',
+      title: "透析监测 ",
       template_id: 0,
       tableDate: []
-    }
+    };
   },
-  created () {
-    this.template_id = this.$store.getters.user.template_info.template_id
+  created() {
+    this.template_id = this.$store.getters.user.template_info.template_id;
   },
   methods: {
-    isShow (name) {
-      var filedList = this.$store.getters.user.fileds
+    isShow(name) {
+      var filedList = this.$store.getters.user.fileds;
 
       for (let i = 0; i < filedList.length; i++) {
         if (
@@ -217,26 +199,26 @@ export default {
           filedList[i].filed_name_cn == name &&
           filedList[i].is_show == 1
         ) {
-          return true
+          return true;
         }
       }
-      return false
+      return false;
     },
-    setRecords (records) {
+    setRecords(records) {
       if (records == null) {
-        records = []
+        records = [];
       }
-      this.tableDate.splice(0, this.tableDate.length)
-      this.tableDate.push(...records)
+      this.tableDate.splice(0, this.tableDate.length);
+      this.tableDate.push(...records);
     },
-    parseTime (time, layout) {
-      return parseTime(time, layout)
+    parseTime(time, layout) {
+      return parseTime(time, layout);
     },
-    addRecords (records) {
-      this.tableDate.push(...records)
+    addRecords(records) {
+      this.tableDate.push(...records);
     }
   }
-}
+};
 </script>
 
 <style rel="stylesheet/scss" lang="scss" scoped>

src/pages/monitoring/index.vue

@@ -170,7 +170,10 @@
       </van-list>-->
       <div class="monitoringTable">
         <el-table :data="tableData" border style="width: 100%" class="newTable">
-          <el-table-column fixed prop="date" label="机号" width="100" align="center">
+          <el-table-column fixed prop="name" label="姓名" width="80" align="center">
+            <template slot-scope="scope">{{scope.row.patient.name}}</template>
+          </el-table-column>
+          <el-table-column prop="date" label="机号" width="60" align="center">
             <template slot-scope="scope">
               {{
               scope.row.dialysis_order.device_number.number.length > 0
@@ -179,16 +182,13 @@
               }}
             </template>
           </el-table-column>
-          <el-table-column prop="name" label="姓名" width="100" align="center">
-            <template slot-scope="scope">{{scope.row.patient.name}}</template>
-          </el-table-column>
-          <el-table-column prop="province" label="透析号" width="100" align="center">
+          <el-table-column prop="province" label="透析号" width="80" align="center">
             <template slot-scope="scope">{{scope.row.patient.dialysis_no}}</template>
           </el-table-column>
           <el-table-column prop="city" label="排班时间" width="100" align="center">
             <template slot-scope="scope">{{parseTime(scope.row.schedule_date,"{y}-{m}-{d}")}}</template>
           </el-table-column>
-          <el-table-column prop="address" label="透析模式" width="200" align="center">
+          <el-table-column prop="address" label="透析模式" width="100" align="center">
             <template slot-scope="scope">{{ scope.row.treatment_mode.name}}</template>
           </el-table-column>
           <el-table-column prop="zip" label="脱水量" width="100" align="center">
@@ -644,6 +644,9 @@ export default {
 }
 
 .monitoringTable {
+  .el-table {
+    width: 99.9% !important;
+  }
   .newTable {
     margin-top: 80px;
     @media only screen and (min-width: 768px) {

src/pages/personal/ChangePassword.vue

@@ -31,9 +31,14 @@
     .van-field__label {
       height: 1.4rem;
       line-height: 1.4rem;
+      font-size: 0.45rem;
     }
     .van-field__body {
       height: 100%;
+      font-size: 0.45rem;
+    }
+    .van-field__label {
+      max-width: 2.5rem;
     }
   }
   .finish {

src/pages/personal/ElectronicSignature.vue

@@ -378,7 +378,7 @@ export default {
 }
 .mainContent {
   .title {
-    font-size: 0.36rem;
+    font-size: 0.45rem;
     padding: 0.3rem 0.37rem;
     color: $title-color;
     @include align-items-center;
@@ -388,19 +388,26 @@ export default {
     background: #fff;
     .GoBack {
       color: $main-color;
-      font-size: 0.36rem;
+      font-size: 0.45rem;
       @include display-flex;
       .iconfont {
         color: $main-color;
         font-size: 0.5rem;
+        margin-top: 1px;
+        @media only screen and (min-width: 768px) {
+          margin-top: 3px;
+        }
       }
     }
+    .name {
+      margin-right: 1.3rem;
+    }
   }
   .information {
     width: 100%;
     margin: 0 auto;
     .imagename {
-      width: 600px;
+      width: 100%;
       margin: 0 auto;
       text-align: center;
       padding: 10px 0;
@@ -408,15 +415,15 @@ export default {
     }
     .name {
       background: #fff;
-      width: 600px;
+      width: 100%;
       height: 400px;
       margin: 0 auto;
       border-radius: 4px;
 
-      @media only screen and (max-width: 812px) {
-        width: 500px !important;
-        height: 200px !important;
-      }
+      // @media only screen and (max-width: 812px) {
+      //   width: 500px !important;
+      //   height: 200px !important;
+      // }
       .item {
         padding: 0.37rem 0.4rem;
         @include align-items-center;
@@ -453,13 +460,14 @@ export default {
 }
 .fl {
   @media only screen and (max-width: 812px) {
-    width: 500px !important;
-    height: 200px !important;
+    width: 100% !important;
+    height: 400px !important;
   }
 }
 .mainBox {
   height: 100%;
   display: flex;
+  overflow: hidden;
   flex-direction: column;
   > :first-child {
     flex: 1;

src/styles/style.scss

@@ -90,6 +90,9 @@ body {
         @media only screen and (min-width: 376px) and (max-width: 413px) {
           width: 4.2rem;
         }
+        @media only screen and (min-width: 768px) {
+          width: 6.6rem;
+        }
         .content {
           color: $main-color;
         }
@@ -323,10 +326,10 @@ body {
 .popover-demo-content {
   ul {
     li {
-      font-size: 0.32rem;
+      font-size: 0.45rem;
       color: $title-color;
-      line-height: 0.7rem;
-      height: 0.7rem;
+      line-height: 1rem;
+      height: 1rem;
       .iconfont {
         float: right;
         color: #409eff;
@@ -872,7 +875,7 @@ body {
 //   background: #fff;
 // }
 .stateBox {
-  padding-top: 130px;
+  padding-top: 140px;
   background: #fff;
   min-height: calc(100vh - 2px);
   padding-left: 0.45rem;