修改适宜技术处方的排版

src/views/business/SuitableTech.vue

@@ -276,7 +276,8 @@
         <div class="dialog-back-btn" @click="handleEditBack">返回</div>
         <div class="dialog-scroll-area">
           <div class="dialog-form flex-wrap">
-            <div class="form-item flex flex-col-center">
+            <!-- 第一行：方名、中医病名、共享至、处方出处、证型、治法 -->
+            <div class="form-item flex flex-col-center form-item-sixth">
               <div class="name"><span style="color: red">*</span> 方名：</div>
               <div class="input">
                 <el-input
@@ -286,7 +287,7 @@
                 ></el-input>
               </div>
             </div>
-            <div class="form-item flex flex-col-center">
+            <div class="form-item flex flex-col-center form-item-sixth">
               <span style="opacity:0">*</span>
               <div class="name">中医病名：</div>
               <div class="input">
@@ -309,7 +310,53 @@
                 </el-autocomplete>
               </div>
             </div>
-            <div class="form-item flex flex-col-center">
+             <div class="form-item flex flex-col-center form-item-sixth">
+              <span style="opacity:0">*</span>
+              <div class="name">证型：</div>
+              <div class="input">
+                <el-autocomplete
+                  size="mini"
+                  v-model="editData.symptomName"
+                  :fetch-suggestions="querySymptom"
+                  value-key="symname"
+                  placeholder="请搜索选择"
+                  clearable
+                  :trigger-on-focus="true"
+                  @select="onSymptomSelect"
+                  @clear="onSymptomClear"
+                >
+                  <template slot-scope="{ item }">
+                    <div :class="{ 'autocomplete-disabled': item._disabled }">
+                      {{ item.symname }}
+                    </div>
+                  </template>
+                </el-autocomplete>
+              </div>
+            </div>
+            <div class="form-item flex flex-col-center form-item-sixth">
+              <span style="opacity:0">*</span>
+              <div class="name">治法：</div>
+              <div class="input">
+                <el-autocomplete
+                  size="mini"
+                  v-model="editData.therapyName"
+                  :fetch-suggestions="queryTherapy"
+                  value-key="therapy"
+                  placeholder="请搜索选择"
+                  clearable
+                  :trigger-on-focus="true"
+                  @select="onTherapySelect"
+                  @clear="onTherapyClear"
+                >
+                  <template slot-scope="{ item }">
+                    <div :class="{ 'autocomplete-disabled': item._disabled }">
+                      {{ item.therapy }}
+                    </div>
+                  </template>
+                </el-autocomplete>
+              </div>
+            </div>
+            <div class="form-item flex flex-col-center form-item-sixth">
               <span style="opacity:0">*</span>
               <div class="name">共享至：</div>
               <div class="input">
@@ -327,7 +374,7 @@
                 </el-select>
               </div>
             </div>
-            <div class="form-item flex flex-col-center">
+            <div class="form-item flex flex-col-center form-item-sixth">
               <span style="opacity:0">*</span>
               <div class="name">处方出处：</div>
               <div class="input">
@@ -338,6 +385,8 @@
                 ></el-input>
               </div>
             </div>
+           
+            <!-- 第二行：西医诊断、功效与适应症 -->
             <div class="form-item flex flex-col-center form-item-half">
               <span style="opacity:0">*</span>
               <div class="name">西医诊断：</div>
@@ -380,52 +429,7 @@
                 ></el-input>
               </div>
             </div>
-            <div class="form-item flex flex-col-center">
-              <span style="opacity:0">*</span>
-              <div class="name">证型：</div>
-              <div class="input">
-                <el-autocomplete
-                  size="mini"
-                  v-model="editData.symptomName"
-                  :fetch-suggestions="querySymptom"
-                  value-key="symname"
-                  placeholder="请搜索选择"
-                  clearable
-                  :trigger-on-focus="true"
-                  @select="onSymptomSelect"
-                  @clear="onSymptomClear"
-                >
-                  <template slot-scope="{ item }">
-                    <div :class="{ 'autocomplete-disabled': item._disabled }">
-                      {{ item.symname }}
-                    </div>
-                  </template>
-                </el-autocomplete>
-              </div>
-            </div>
-            <div class="form-item flex flex-col-center">
-              <span style="opacity:0">*</span>
-              <div class="name">治法：</div>
-              <div class="input">
-                <el-autocomplete
-                  size="mini"
-                  v-model="editData.therapyName"
-                  :fetch-suggestions="queryTherapy"
-                  value-key="therapy"
-                  placeholder="请搜索选择"
-                  clearable
-                  :trigger-on-focus="true"
-                  @select="onTherapySelect"
-                  @clear="onTherapyClear"
-                >
-                  <template slot-scope="{ item }">
-                    <div :class="{ 'autocomplete-disabled': item._disabled }">
-                      {{ item.therapy }}
-                    </div>
-                  </template>
-                </el-autocomplete>
-              </div>
-            </div>
+            <!-- 第三行：统建处方 -->
             <div class="form-item flex flex-col-center">
               <span style="opacity:0">*</span>
               <el-checkbox v-model="editData.isUnified" class="unified-checkbox">统建处方</el-checkbox>
@@ -1545,6 +1549,15 @@ export default {
       width: 50%;
     }
 
+    &.form-item-sixth {
+      width: 16.5%;
+
+      .name {
+        width: 60px;
+        min-width: 60px;
+      }
+    }
+
     .name {
       width: 110px;
       min-width: 110px;
@@ -1559,7 +1572,8 @@ export default {
       min-width: 0;
 
       .el-input,
-      .el-select {
+      .el-select,
+      .el-autocomplete {
         width: 100%;
       }
     }