进度信息模块封装ui代码优化

src/views/service-management/registration-queue/components/prescribing-modle.vue

@@ -42,7 +42,7 @@
         </el-col>
         <el-col :span="8">
           <el-form-item label="宠物年龄" prop="age">
-            <el-input v-model="registerForm.petAge" :disabled="true" maxlength="20" />
+            <el-input v-model="registerForm.petAge" :disabled="true" maxlength="20"/>
           </el-form-item>
         </el-col>
         <el-col :span="8">
@@ -64,7 +64,7 @@
         </el-col>
         <el-col :span="8">
           <el-form-item label="体重" prop="petWeight">
-            <el-input v-model="registerForm.petWeight" :disabled="true" maxlength="20" />
+            <el-input v-model="registerForm.petWeight" :disabled="true" maxlength="20"/>
           </el-form-item>
         </el-col>
         <el-col :span="8">
@@ -74,12 +74,12 @@
         </el-col>
         <el-col :span="8">
           <el-form-item label="宠主姓名" prop="age">
-            <el-input v-model="registerForm.petOwnerBo.nickName" :disabled="true" maxlength="20" />
+            <el-input v-model="registerForm.petOwnerBo.nickName" :disabled="true" maxlength="20"/>
           </el-form-item>
         </el-col>
         <el-col :span="8">
           <el-form-item label="联系电话" prop="age">
-            <el-input v-model="registerForm.petOwnerBo.phoneNumber" :disabled="true" maxlength="20" />
+            <el-input v-model="registerForm.petOwnerBo.phoneNumber" :disabled="true" maxlength="20"/>
           </el-form-item>
         </el-col>
         <el-col :span="8">
@@ -106,18 +106,18 @@
       <el-row class="prescribing-content">
         <el-col :span="8">
           <el-form-item label="主治兽医" prop="nickName">
-            <el-input v-model="registerForm.doctorName" :disabled="true" maxlength="20" placeholder="请输入宠物昵称" />
+            <el-input v-model="registerForm.doctorName" :disabled="true" maxlength="20" placeholder="请输入宠物昵称"/>
           </el-form-item>
         </el-col>
         <el-col :span="8">
           <el-form-item label="科室" prop="petSex">
 
-            <el-input v-model="registerForm.hospitalDepartmentName" :disabled="true" maxlength="20" />
+            <el-input v-model="registerForm.hospitalDepartmentName" :disabled="true" maxlength="20"/>
           </el-form-item>
         </el-col>
         <el-col :span="8">
           <el-form-item label="诊位" prop="age">
-            <el-input v-model="registerForm.visitLocation" :disabled="true" maxlength="20" />
+            <el-input v-model="registerForm.visitLocation" :disabled="true" maxlength="20"/>
           </el-form-item>
         </el-col>
         <el-col :span="24">
@@ -133,12 +133,14 @@
         </el-col>
         <el-col :span="24">
           <el-form-item label="医嘱">
-            <el-input v-model="visitForm.doctorAdvice" disabled maxlength="200" placeholder="请输入医嘱" type="textarea" />
+            <el-input v-model="visitForm.doctorAdvice" disabled maxlength="200" placeholder="请输入医嘱"
+                      type="textarea"
+            />
           </el-form-item>
         </el-col>
         <el-col :span="24">
           <el-form-item label="诊断结果">
-            <el-input v-model="visitForm.diagnosisResult" disabled maxlength="30" placeholder="请输入诊断结果" />
+            <el-input v-model="visitForm.diagnosisResult" disabled maxlength="30" placeholder="请输入诊断结果"/>
           </el-form-item>
         </el-col>
         <!--        开药模块--后续开发 -->
@@ -146,7 +148,7 @@
           <el-form-item label="药物处理" prop="medication">
             <div v-for="(item, index) in prescribingForm.medication" :key="index" class="single-medication">
               <div class="single-file">
-                <el-form-item label="宠物名称:">
+                <el-form-item label="宠物名称:" prop="drug">
                   <el-select
                     v-model="item.drug"
                     clearable
@@ -163,18 +165,18 @@
                 </el-form-item>
               </div>
               <div class="single-file">
-                <el-form-item label="数量">
-                  <el-input-number v-model="item.num" :max="10" :min="1" controls-position="right" />
+                <el-form-item label="数量" prop="num">
+                  <el-input-number v-model="item.num" :max="10" :min="1" controls-position="right"/>
                 </el-form-item>
               </div>
               <div>
-                <el-form-item label="sig">
-                  <el-input v-model="item.sig" placeholder="请输入具体用法" />
+                <el-form-item label="sig" prop="sig">
+                  <el-input v-model="item.sig" placeholder="请输入具体用法"/>
                 </el-form-item>
               </div>
               <div class="content-option">
-                <i class="el-icon-plus" @click="addRow('medication')" />
-                <i class="el-icon-minus" @click="minusRow(index,'medication')" />
+                <i class="el-icon-plus" @click="addRow('medication')"/>
+                <i class="el-icon-minus" @click="minusRow(index,'medication')"/>
               </div>
             </div>
           </el-form-item>
@@ -185,7 +187,9 @@
             <div v-for="(singleItem, index) in prescribingForm.inspect" :key="index" class="single-medication">
               <div class="single-file">
                 <el-form-item label="检查类型">
-                  <el-select v-model="singleItem.checkType" placeholder="检查类型" clearable @change="getCheckItemOptions">
+                  <el-select v-model="singleItem.checkType" clearable placeholder="检查类型"
+                             @change="getCheckItemOptions"
+                  >
                     <el-option
                       v-for="(item, index) in dict.type.check_type"
                       :key="index"
@@ -197,7 +201,9 @@
               </div>
               <div class="single-file">
                 <el-form-item label="项目">
-                  <el-select v-model="singleItem.checkItemsId" placeholder="请选择" clearable @change="setCheckItemsName(singleItem,checkItemOptions)">
+                  <el-select v-model="singleItem.checkItemsId" clearable placeholder="请选择"
+                             @change="setCheckItemsName(singleItem,checkItemOptions)"
+                  >
                     <el-option
                       v-for="(item, index) in checkItemOptions"
                       :key="index"
@@ -208,8 +214,8 @@
                 </el-form-item>
               </div>
               <div class="content-option">
-                <i class="el-icon-plus" @click="addRow('inspect')" />
-                <i class="el-icon-minus" @click="minusRow(index,'inspect')" />
+                <i class="el-icon-plus" @click="addRow('inspect')"/>
+                <i class="el-icon-minus" @click="minusRow(index,'inspect')"/>
               </div>
             </div>
           </el-form-item>
@@ -220,7 +226,9 @@
             <div v-for="(singleItem, index) in prescribingForm.treatment" :key="index" class="single-medication">
               <div class="single-file">
                 <el-form-item label="治疗名称:">
-                  <el-select v-model="singleItem.treatItemsId" placeholder="请选择" clearable @change="setTreatItemsName(singleItem,treatItemOptions)">
+                  <el-select v-model="singleItem.treatItemsId" clearable placeholder="请选择"
+                             @change="setTreatItemsName(singleItem,treatItemOptions)"
+                  >
                     <el-option
                       v-for="(item, index) in treatItemOptions"
                       :key="index"
@@ -231,8 +239,8 @@
                 </el-form-item>
               </div>
               <div class="content-option">
-                <i class="el-icon-plus" @click="addRow('treatment')" />
-                <i class="el-icon-minus" @click="minusRow(index,'treatment')" />
+                <i class="el-icon-plus" @click="addRow('treatment')"/>
+                <i class="el-icon-minus" @click="minusRow(index,'treatment')"/>
               </div>
             </div>
           </el-form-item>
@@ -241,7 +249,7 @@
         <el-row class="hospital-content">
           <el-col :span="8">
             <el-form-item label="住院治疗">
-              <el-input-number v-model="registerForm.petSex" :max="10" :min="1" controls-position="right" />
+              <el-input-number v-model="registerForm.petSex" :max="10" :min="1" controls-position="right"/>
             </el-form-item>
           </el-col>
           <el-col :span="8">
@@ -318,6 +326,10 @@ export default {
 
   },
   data() {
+    const validNum = (rule, value, callback) => {
+      console.log('这是自定义校验', value)
+      callback()
+    }
     var validatePass = (rule, value, callback) => {
       console.log('kkkkkkkkkkkkkk', value)
       callback()
@@ -355,6 +367,11 @@ export default {
       rules: {
         medication: [
           { validator: validatePass, trigger: 'change' }
+        ],
+        // 自定义药品连锁触发校验
+        num: [
+          { required: true, message: '请输入药品数量', trigger: 'change' },
+          +{ validator: validNum, trigger: 'change' }
         ]
       }
     }

src/views/service-management/registration-queue/registration-add.vue

@@ -228,8 +228,7 @@
     />
     <!--      选择宠物-->
     <div slot="footer" class="dialog-footer">
-      <el-button class="queryBtn" icon="el-icon-check" @click="submitForm">提 交</el-button>
-      <el-button class="resetBtn" icon="el-icon-back" @click="cancel">返 回</el-button>
+      <el-button class="resetBtn" icon="el-icon-back" @click="goBack">返 回</el-button>
     </div>
   </div>
 </template>
@@ -378,6 +377,10 @@ export default {
     this.getpesonlist()
   },
   methods: {
+    /** 返回跳转列表页 */
+    goBack() {
+      this.$router.back()
+    },
     /** 根据手机号判断宠主是否存在，不存在新增宠主 回显宠主信息*/
     checkOwner() {
       checkPetOwner({ phone: this.form.masterPhone }).then(response => {

src/views/service-management/registration-queue/registration-detail.vue

@@ -17,7 +17,7 @@ color: #333333;"
           <!--宠物头像-->
           <div style="display: flex">
             <!--   1-- 宠物基本信息的页面--标签头 -->
-            <div class="tip-green" />
+            <div class="tip-green"/>
             <div
               style="padding-left: 13px;font-size: 16px;font-family: Microsoft YaHei-Bold, Microsoft YaHei,serif;font-weight: bold;color: #333333;"
             >宠物头像
@@ -28,14 +28,14 @@ color: #333333;"
             <div>
               <!--宠物图片-->
               <div class="petPicture" style="padding-bottom: 40px;">
-                <ImagePreview :height="150" :src="baseURL+detailInfo.petPicture" :width="150" />
+                <ImagePreview :height="150" :src="baseURL+detailInfo.petPicture" :width="150"/>
               </div>
             </div>
           </div>
           <!--基本信息-->
           <div style="display: flex">
             <!--   1-- 宠物基本信息的页面--标签头 -->
-            <div class="tip-green" />
+            <div class="tip-green"/>
             <div
               style="padding-left: 13px;font-size: 16px;font-family: Microsoft YaHei-Bold, Microsoft YaHei,serif;font-weight: bold;color: #333333;"
             >宠物信息
@@ -50,19 +50,19 @@ color: #333333;"
                 <el-row>
                   <el-col :span="8">
                     <el-form-item label="宠物昵称">
-                      <el-input v-model="detailInfo.petNickname" disabled />
+                      <el-input v-model="detailInfo.petNickname" disabled/>
                     </el-form-item>
                   </el-col>
                   <el-col :span="8">
                     <!--宠物ID-->
                     <el-form-item label="宠物ID">
-                      <el-input v-model="detailInfo.petsId" disabled />
+                      <el-input v-model="detailInfo.petsId" disabled/>
                     </el-form-item>
                   </el-col>
                   <el-col :span="8">
                     <!--宠物品种-->
                     <el-form-item label="宠物品种">
-                      <el-input v-model="detailInfo.petBreed" disabled />
+                      <el-input v-model="detailInfo.petBreed" disabled/>
                     </el-form-item>
                   </el-col>
                 </el-row>
@@ -92,14 +92,14 @@ color: #333333;"
                   <el-col :span="8">
                     <!--宠物年龄-->
                     <el-form-item label="宠物年龄">
-                      <el-input v-model="detailInfo.petAge" disabled />
+                      <el-input v-model="detailInfo.petAge" disabled/>
                       岁
                     </el-form-item>
                   </el-col>
                   <el-col :span="8">
                     <!--宠物体重-->
                     <el-form-item label="宠物体重">
-                      <el-input v-model="detailInfo.petWeight" disabled />
+                      <el-input v-model="detailInfo.petWeight" disabled/>
                       kg
                     </el-form-item>
                   </el-col>
@@ -704,10 +704,7 @@ export default {
     },
     /** 返回跳转列表页 */
     goBack() {
-      // this.$router.back()
-      this.$router.push({
-        path: '/service-management/registration-queue'
-      })
+      this.$router.back()
     },
     /** 获取宠物信息(传参传宠物表id)*/
     getInfo(id) {
@@ -839,4 +836,15 @@ export default {
     color: #333333 !important;
   }
 }
+
+//文本框样式
+::v-deep .el-textarea {
+  width: 90% !important;
+}
+.bottom-input-style{
+  //输入框样式
+  ::v-deep .el-input__inner{
+    width: 400% !important;
+  }
+}
 </style>