bug修改

src/views/equipment-management/equipment-management/equipment-add.vue

 <template>
   <div>
-    <div style="background-color: #fff;height: 100%;">
     <div class="app-container-container">
-        <div style=" text-align: center;padding-top: 35px;height: 90px;">
-          <span style="font-size: 24px;font-weight: bold; color: #333333;line-height: 20px;">新增</span>
+      <div class="box-card">
+        <div class="topTitle">
+          <span style="font-size: 24px;font-weight: bold; color: #333333;line-height: 24px;">新增</span>
         </div>
-        <el-form ref="form" :model="form" :rules="rules" :inline="true" label-width="auto">
+        <div style="width: 100%">
+          <el-form ref="form" :model="form" :rules="rules" label-width="125px">
             <div style=" display: flex;position: relative;left: 32px;padding-bottom: 20px;">
               <div class="title-paragraph">
-              <span class="title-text">当前设备信息</span>
+                <span class="title-text">基本信息</span>
               </div>
 
             </div>
             <!--            1-->
-          <el-row>
+            <el-row :gutter="24">
               <el-col :span="8">
                 <el-form-item label="设备名称" prop="deviceName">
                   <el-input v-model.trim="form.deviceName" placeholder="请输入设备名称" class="inputWidth" maxlength="20" />
@@ -49,7 +50,7 @@
               </el-col>
             </el-row>
             <!--            2-->
-          <el-row>
+            <el-row :gutter="24">
               <el-col :span="8">
                 <el-form-item label="负责人" prop="head">
                   <el-input v-model.trim="form.head" placeholder="请输入负责人" class="inputWidth" />
@@ -76,8 +77,8 @@
             </el-row>
             <!--                        3-->
             <el-row>
-            <el-col :span="16">
-              <el-form-item label="服务地点" prop="selectedOptions">
+              <el-col :span="6">
+                <el-form-item label="服务地点" prop="selectedOptions" :span="6" >
                   <el-cascader
                     v-model="form.selectedOptions"
                     size="large"
@@ -85,26 +86,28 @@
                     :disabled="serviceAreaShow"
                     placeholder="请选择服务地点"
                     expand-trigger="hover"
-                  clearable
                     class="inputWidth"
+                    clearable
+
                     @change="handleChangeCascader"
                   />
                 </el-form-item>
-              <el-form-item prop="address">
+              </el-col>
+              <el-col :span="9" style="margin-left:0.3125rem " >
+                <el-form-item prop="address" :span="9"  class="custom-form-item" >
                   <el-input
                     v-model.trim="form.address"
                     :disabled="serviceAreaShow"
+                    class="inputWidth"
                     placeholder="请输入详细地址(街道、楼牌号等)"
                     maxlength="40"
                     clearable
-                  class="address"
                   />
                 </el-form-item>
-
               </el-col>
 
-            <el-col :span="8">
-              <el-form-item label="单位时段服务数" prop="useNum">
+              <el-col :span="8" style="margin-left: 3.125rem">
+                <el-form-item label="单位时段服务数" prop="useNum" style="margin-left: 2.0625rem">
                   <el-input-number
                     v-model.trim="form.useNum"
                     :min="0"
@@ -120,7 +123,7 @@
 
             </el-row>
             <!--            4-->
-          <el-row>
+            <el-row :gutter="24">
               <el-col :span="8">
                 <el-form-item label="预约方式" prop="reservationMethod">
                   <el-select v-model="form.reservationMethod" placeholder="请选择预约方式" class="inputWidth">
@@ -173,7 +176,7 @@
               </el-col>
             </el-row>
             <!--            5-->
-          <el-row>
+            <el-row :gutter="24">
 
               <el-col :span="8" style="margin-left: 33.3%">
                 <el-form-item label="下午开始时间" prop="useTime.pms">
@@ -215,7 +218,7 @@
               </el-col>
             </el-row>
             <!--            6-->
-          <el-row>
+            <el-row :gutter="24">
               <el-col :span="8">
                 <el-form-item label="权重" prop="sort">
                   <el-input-number
@@ -250,7 +253,7 @@
               </el-col>
             </el-row>
             <!--            7-->
-          <el-row>
+            <el-row :gutter="24">
               <el-col :span="24">
                 <div class="deep-form">
                   <el-form-item label="备注" prop="remark">
@@ -259,7 +262,7 @@
                       type="textarea"
                       placeholder="请输入备注（2~200字）"
                       maxlength="200"
-                    class="remark_with"
+                      class="inputWidth"
                       :rows="4"
                     />
                   </el-form-item>
@@ -268,7 +271,7 @@
             </el-row>
             <!--             8-->
             <el-row>
-            <el-col>
+              <el-col :gutter="24">
                 <el-form-item label="支持服务地区" prop="serviceArea">
                   <el-cascader
                     v-model="form.serviceArea"
@@ -280,17 +283,17 @@
                     collapse-tags
                     expand-trigger="hover"
                     clearable
-                  style="width: 250px"
+                    class="remark_with"
                     @change="handleChangeServiceArea"
                   />
                 </el-form-item>
               </el-col>
             </el-row>
             <!--         9-->
-          <el-row>
+            <el-row :gutter="24" class="lastRow">
               <el-col>
                 <el-form-item label="支持检查项目" prop="checkType">
-                <el-select v-model="form.checkType" placeholder="请选择支持检查项目" style="width: 250px" multiple collapse-tags clearable>
+                  <el-select v-model="form.checkType" placeholder="请选择支持检查项目"  class="remark_with" multiple collapse-tags clearable>
                     <el-option
                       v-for=" (item,index) in checkItemOptions"
                       :key="index"
@@ -302,6 +305,7 @@
               </el-col>
             </el-row>
           </el-form>
+        </div>
         <el-row>
           <el-col class="sbuButton">
             <el-button :loading="submitShow" class="queryBtn" size="mini" icon="el-icon-check" @click="submitForm">
@@ -841,21 +845,42 @@ export default {
   //left: 0;
 }
 .title-paragraph {
-  margin-bottom: 15px;
-  border-left: 5px solid #5FB54B;
+  margin-top: 40px;
+  margin-bottom: 30px;
+  border-left: 3px solid #5FB54B;
+  border-radius: 2px;
+  height: 24px;
 
   .title-text {
+    font-weight: bold;
     margin-left: 10px;
+    font-size: 16px;
+    color: #333333;
+    line-height: 24px;
+  }
+}
+.box-card{
+  padding-right: 48px;
+  padding-left: 32px;
+  background-color: #fff;
+  height: 100%;
+  .topTitle {
+    text-align: center;
+    padding-top: 30px;
+  }
+  .lastRow {
+    ::v-deep .el-form-item {
+      margin-bottom: 0;
+    }
   }
 
-  .title {
-    color: #666666;
-    font-weight: 600;
-    font-size: 17px
-
+  .inputWidth{
+    width: 100%;
+  }
+  .inputWidth1{
+    width: 30%;
   }
 }
-
 .headerTitle {
   width: 100%;
   height: 50px;
@@ -881,20 +906,26 @@ export default {
 }
 
 .address{
-  width: 535px;
-}
-.inputWidth{
-  width: 300px;
+  width: 30%;
 }
 .inputNumber_Width{
-  width: 270px;
+  width: 93%;
 }
 .text{
   margin-left: 10px;
 }
 .remark_with{
-  width: 1390px;
+  width: 30%;;
+}
+.custom-form-item {
+
+  ::v-deep.el-form-item__content {
+    margin-left: 0 !important;
+    line-height: 2.25rem;
+
+  }
 }
+
 ::v-deep.el-input-number.is-without-controls .el-input__inner {
   //width: 100px;
   line-height: 30px;
@@ -906,12 +937,6 @@ export default {
   font-weight: bold;
   cursor: pointer;
 }
-//::v-deep.el-time-select-item:hover {
-//  background: #F6fcf5;
-//  color: #5FB54B;
-//  font-weight: bold;
-//  cursor: pointer
-//}
 </style>
 <style lang="scss">
 .equipment-use-time {
@@ -929,7 +954,7 @@ export default {
 .sbuButton{
   display: flex;
   justify-content: left;
-  margin: 15px 0 50px 32px
+  margin: 30px 0 50px 32px
 
 }
 </style>

src/views/equipment-management/use-management/use-management.vue

@@ -95,7 +95,7 @@
           <span>{{ scope.$index + 1 }}</span>
         </template>
       </el-table-column>
-      <el-table-column label="设备名称" align="left" prop="deviceName" min-width="100" :show-overflow-tooltip="true">
+      <el-table-column label="设备名称" align="left" prop="deviceName" min-width="120" :show-overflow-tooltip="true">
         <template slot-scope="scope">
           <span>{{ scope.row.deviceName || '-' }}</span>
         </template>
@@ -105,7 +105,7 @@
           <span>{{ scope.row.deviceCode || '-' }}</span>
         </template>
       </el-table-column>
-      <el-table-column label="检查项目" align="left" prop="checkItemsName" min-width="100" :show-overflow-tooltip="true">
+      <el-table-column label="检查项目" align="left" prop="checkItemsName" min-width="120" :show-overflow-tooltip="true">
         <template slot-scope="scope">
           <span>{{ scope.row.checkItemsName || '-' }}</span>
         </template>
@@ -120,12 +120,12 @@
           <dict-tag :options="dict.type.pet_insure" :value="scope.row.insure" />
         </template>
       </el-table-column>
-      <el-table-column label="宠主姓名" align="left" prop="ownerNikename" min-width="120" :show-overflow-tooltip="true">
+      <el-table-column label="宠主姓名" align="left" prop="ownerNikename" min-width="100" :show-overflow-tooltip="true">
         <template slot-scope="scope">
           <span>{{ scope.row.ownerNickname || '-' }}</span>
         </template>
       </el-table-column>
-      <el-table-column label="宠主手机号" align="left" min-width="120" prop="phoneNumber">
+      <el-table-column label="宠主手机号" align="left" min-width="100" prop="phoneNumber">
         <template slot-scope="scope">
           <span>{{ scope.row.ownerPhone || '-' }}</span>
         </template>
@@ -161,7 +161,7 @@
           >{{ showStatus(scope.row.status) || '-' }}</span>
         </template>
       </el-table-column>
-      <el-table-column label="操作" align="left" class-name="small-padding fixed-width" min-width="120">
+      <el-table-column label="操作" align="left" class-name="small-padding fixed-width" min-width="60">
         <template slot-scope="scope">
           <el-button
             v-hasPermi="['business:use:query']"