开方选择药房若有多个药剂类型则分组平铺展开排列

src/components/ChineseMedicine.vue

@@ -56,7 +56,7 @@
         </div>
         <!-- @change="getPharmacyID" -->
         <!-- @change="changePharmacy(recipe_tabs[recipe_tabs_c].lastType)" -->
-        <div class="t-con-radio flex-vertical-center-l">
+        <div class="t-con-radio flex-vertical-center-l" v-if="false">
           <div class="t-radio-group">
             <el-radio-group
               v-model="recipe_tabs[recipe_tabs_c].radio"
@@ -73,6 +73,17 @@
             </el-radio-group>
           </div>
         </div>
+        <div class="t-con-radio flex-vertical-center-l" style="flex-wrap: wrap;align-items: center;">
+          <div class="t-radio-group2" :class="{multiple: group.options.length > 1}" v-for="group in pharmacyTypeGroup" :key="group.name">
+            <label v-if="group.options.length > 1">{{group.name}}</label>
+            <el-radio v-for="item in group.options" :key="item.ptype"
+                      v-model="recipe_tabs[recipe_tabs_c].radio"
+                      :disabled="recipe_tabs[recipe_tabs_c].disable"
+                      :label="item.ptype"
+                      @click.native.prevent="changePharmacy(recipe_tabs[recipe_tabs_c].lastType,item.ptype)"
+            >{{item.name}}</el-radio>
+          </div>
+        </div>
 
         <!-- <div class="add-presc1 flex-center" @click="clearRecipe()">清空处方</div> -->
       </div>
@@ -1102,6 +1113,7 @@ export default {
       isAutoCheck: "0", // 是否自动审核 0 手动 1自动 (自动的时候用his 的是否支付成功字段 判断显示)
       pharmacyList: [], // 药房选择器 数据
       pharmacyTypes: [],
+      pharmacyTypeGroup: [],
       clickPid: "", // 点击的药品id
       maxDose: null,
       minDose: null,
@@ -2373,18 +2385,43 @@ export default {
       });
       if (res.ResultCode == 0) {
         let pharmacyTypes = [];
+        let pharmacyTypeGroup = [];
         res.Data.forEach(item => {
           item.dosageForms = item.dosageForms.split(",");
           item.dosageForms.forEach(item1 => {
             pharmacyTypes.push({
               type: item1,
               ptype: item.pid + "@" + item1,
-              name: item.displayName //+ this.getRadioName(item1)
+              name: item.displayName + (item.dosageForms.length > 1 ? ` (${this.getRadioName(item1)})` : '')
             });
           });
+          if (item.dosageForms.length > 1) {
+            pharmacyTypeGroup.push({
+              name: item.displayName,
+              options: item.dosageForms.map(item1 => {
+                return {
+                  type: item1,
+                  ptype: item.pid + "@" + item1,
+                  name: this.getRadioName(item1),
+                }
+              })
+            })
+          } else if (item.dosageForms.length === 1) {
+            pharmacyTypeGroup.push({
+              name: item.displayName,
+              options: item.dosageForms.map(item1 => {
+                return {
+                  type: item1,
+                  ptype: item.pid + "@" + item1,
+                  name: item.displayName,
+                }
+              })
+            })
+          }
         });
         this.pharmacyList = res.Data;
         this.pharmacyTypes = pharmacyTypes;
+        this.pharmacyTypeGroup = pharmacyTypeGroup;
       }
     },
     // 获取药房id
@@ -2643,6 +2680,7 @@ export default {
 
     // 根据表格获取数据类型
     async getSelectType(data, index) {
+      if (data === '中药药品用法' && this.usageList.length) return;
       let res = await getSelectType(data);
 
       if (data == "中药药品用法") {
@@ -2935,6 +2973,24 @@ export default {
         flex: 1;
       }
 
+      .t-radio-group2 {
+        padding: 4px 8px;
+
+        &.multiple {
+          border: 2px dashed #5386f6;
+
+          > label:first-of-type {
+            margin-right: 8px;
+            color: rgba(0, 0, 0, 0.6);
+
+            &:after {
+              margin-left: 2px;
+              content: ":";
+            }
+          }
+        }
+      }
+
       .add-presc1 {
         width: 84px;
         height: 34px;

src/components/MedicineAccord.vue

@@ -21,21 +21,34 @@
           </div>
         </div>
         <!-- @change="getPharmacyID" -->
-        <div class="t-con-radio flex-vertical-center-l" v-if="!isPurposeType">
-          <div class="t-radio-group">
-            <el-radio-group
-              v-model="recipe_tabs[recipe_tabs_c].radio"
-              :disabled="recipe_tabs[recipe_tabs_c].disable"
-              @change="changePharmacy(recipe_tabs[recipe_tabs_c].lastType)"
-            >
-              <el-radio
-                :label="item.ptype"
-                v-for="(item,index) in pharmacyTypes"
-                :key="index"
+        <template v-if="!isPurposeType">
+          <div class="t-con-radio flex-vertical-center-l" v-if="false">
+            <div class="t-radio-group">
+              <el-radio-group
+                  v-model="recipe_tabs[recipe_tabs_c].radio"
+                  :disabled="recipe_tabs[recipe_tabs_c].disable"
+                  @change="changePharmacy(recipe_tabs[recipe_tabs_c].lastType)"
+              >
+                <el-radio
+                    :label="item.ptype"
+                    v-for="(item,index) in pharmacyTypes"
+                    :key="index"
+                >{{item.name}}</el-radio>
+              </el-radio-group>
+            </div>
+          </div>
+          <div class="t-con-radio flex-vertical-center-l" style="flex-wrap: wrap;align-items: center;">
+            <div class="t-radio-group2" :class="{multiple: group.options.length > 1}" v-for="group in pharmacyTypeGroup" :key="group.name">
+              <label v-if="group.options.length > 1">{{group.name}}</label>
+              <el-radio v-for="item in group.options" :key="item.ptype"
+                        v-model="recipe_tabs[recipe_tabs_c].radio"
+                        :disabled="recipe_tabs[recipe_tabs_c].disable"
+                        :label="item.ptype"
+                        @click.native.prevent="changePharmacy(recipe_tabs[recipe_tabs_c].lastType,item.ptype)"
               >{{item.name}}</el-radio>
-            </el-radio-group>
+            </div>
           </div>
-        </div>
+        </template>
 
         <!-- <div class="add-presc1 flex-center" @click="clearRecipe()">清空处方</div> -->
       </div>
@@ -667,6 +680,7 @@ export default {
       countWay: "1", // 计算方式
       pharmacyList: [], // 药房选择器 数据
       pharmacyTypes: [],
+      pharmacyTypeGroup: [],
       clickPid: "", // 点击的药品id
       maxDose: null,
       minDose: null,
@@ -1826,15 +1840,39 @@ export default {
       });
       if (res.ResultCode == 0) {
         let pharmacyTypes = [];
+        let pharmacyTypeGroup = [];
         res.Data.forEach(item => {
           item.dosageForms = item.dosageForms.split(",");
           item.dosageForms.forEach(item1 => {
             pharmacyTypes.push({
               type: item1,
               ptype: item.pid + "@" + item1,
-              name: item.displayName //+ this.getRadioName(item1)
+              name: item.displayName + (item.dosageForms.length > 1 ? ` (${this.getRadioName(item1)})` : '')
             });
           });
+          if (item.dosageForms.length > 1) {
+            pharmacyTypeGroup.push({
+              name: item.displayName,
+              options: item.dosageForms.map(item1 => {
+                return {
+                  type: item1,
+                  ptype: item.pid + "@" + item1,
+                  name: this.getRadioName(item1),
+                }
+              })
+            })
+          } else if (item.dosageForms.length === 1) {
+            pharmacyTypeGroup.push({
+              name: item.displayName,
+              options: item.dosageForms.map(item1 => {
+                return {
+                  type: item1,
+                  ptype: item.pid + "@" + item1,
+                  name: item.displayName,
+                }
+              })
+            })
+          }
         });
 
         this.recipe_tabs[this.recipe_tabs_c].pharmacyID = res.Data[0].pid;
@@ -1842,6 +1880,7 @@ export default {
         this.recipe_tabs[this.recipe_tabs_c].lastType = pharmacyTypes[0].ptype;
         this.pharmacyList = res.Data;
         this.pharmacyTypes = pharmacyTypes;
+        this.pharmacyTypeGroup = pharmacyTypeGroup;
         this.$forceUpdate();
         this.getPharmacyMsg(res.Data[0].pid);
       }
@@ -2297,6 +2336,24 @@ export default {
       flex: 1;
     }
 
+    .t-radio-group2 {
+      padding: 4px 8px;
+
+      &.multiple {
+        border: 2px dashed #5386f6;
+
+        > label:first-of-type {
+          margin-right: 8px;
+          color: rgba(0, 0, 0, 0.6);
+
+          &:after {
+            margin-left: 2px;
+            content: ":";
+          }
+        }
+      }
+    }
+
     .add-presc1 {
       width: 84px;
       height: 34px;

src/views/diagnosis/components/submitRecipe.vue

@@ -453,10 +453,11 @@ export default {
     },
     // 处理数据
     dealPriviewData() {
+      if (!this.priviewData) return;
       // this.isPs = false;
       // this.isDj = false;
       // 中药处方
-      if (this.priviewData.tcmPrescriptionFormVos.length > 0) {
+      if (Array.isArray(this.priviewData.tcmPrescriptionFormVos) && this.priviewData.tcmPrescriptionFormVos.length > 0) {
         this.priviewData.tcmPrescriptionFormVos.forEach((item, index) => {
           item.showSign = true;
           item.recipeType = 1;
@@ -483,7 +484,7 @@ export default {
         }
       }
 
-      this.recipeItem = this.recipes[0];
+      this.recipeItem = this.recipes[0] || {};
       // this.recipes.forEach(item => {
       //   if (item.recipeType == 1 && item.fried == "代煎") {
       //     this.isDj = true;