药品目录管理 -> 药品映射第三方药品选择改为多选

src/views/business/DrugMaping.vue

@@ -45,33 +45,38 @@
             <span>第三方药品：</span>
             <!-- <div class="flex-center">选择药品</div> -->
             <div>
-              <!-- reserve-keyword -->
-              <!-- <el-select size="small" v-model="hisVal" multiple filterable remote placeholder="请输入关键词"
-                                :remote-method="remoteMethod2" :loading="loading2" @change="hisChange" reserve-keyword>
-                                <el-option v-for="item in hisOptions" :key="item.drugId" :label="item.name"
-                                    :value="item.drugId">
-                                </el-option>
-              </el-select>-->
-              <el-autocomplete
+               <el-select size="small" v-model="hisVal" multiple filterable remote placeholder="请输入关键词"
+                          :remote-method="remoteMethod2" :loading="loading2" @change="hisChange"
+                          reserve-keyword collapse-tags
+               >
+                <el-option v-for="item in hisOptions" :key="item.drugId" :label="item.name"
+                    :value="item.drugId">
+                </el-option>
+              </el-select>
+              <!--<el-autocomplete
                 size="mini"
                 class="inline-input"
                 v-model="hisVal"
                 :fetch-suggestions="remoteMethod2"
                 placeholder="请输入关键词"
                 value-key="showName"
-                :trigger-on-focus="false"
+                :trigger-on-focus="true"
                 @select="handleHisSelect"
-              ></el-autocomplete>
+              ></el-autocomplete>-->
             </div>
           </div>
           <span class="clear" @click="clearHis">全部清除</span>
         </div>
 
         <div class="footer">
-          <div class="flex-vertical-between item" v-for="(item,index) in hisChoose" :key="index">
+          <div class="flex-vertical-between item row-old" v-for="(item,index) in hisChoose" :key="item.drugId">
             <div>{{item.name}}/{{item.gg}}/{{item.dw}}</div>
             <div class="clear" @click="deleteHis(index)">+</div>
           </div>
+          <div class="flex-vertical-between item row-new" v-for="(item,index) in hisChooseNew" :key="item.drugId">
+            <div>{{item.name}}/{{item.gg}}/{{item.dw}}</div>
+            <div class="clear" @click="deleteHisNew(index)">+</div>
+          </div>
         </div>
       </div>
     </div>
@@ -106,6 +111,7 @@ export default {
       loading2: false,
       hisVal: [],
       hisOptions: [],
+      hisChooseNew: [],
       hisChoose: []
     };
   },
@@ -125,21 +131,12 @@ export default {
     },
     // his 药品选择
     hisChange(e) {
-      console.log(e);
-
-      this.hisChoose = [];
-      e.forEach(item => {
-        this.hisOptions.forEach(item1 => {
-          if (item1.drugId == item) {
-            this.hisChoose.push(item1);
-          }
-        });
-      });
+      this.hisChooseNew = e.map(id => this.hisOptions.find(item => item.drugId === id)).filter(Boolean);
     },
     // 第三方药品选中
     handleHisSelect(e) {
       // console.log(e, '第三方药品选中')
-      this.hisChoose.push(e);
+      this.hisChooseNew.push(e);
       this.hisVal = "";
     },
     // 平台药品搜索
@@ -173,6 +170,7 @@ export default {
     // 清空his 药品
     clearHis() {
       this.hisVal = [];
+      this.hisChooseNew = [];
       this.hisChoose = [];
       this.hisOptions = [];
       this.searchHisDrug("");
@@ -180,6 +178,10 @@ export default {
     // HIs 药品删除
     deleteHis(index) {
       this.hisChoose.splice(index, 1);
+      // this.hisVal.splice(index, 1);
+    },
+    deleteHisNew(index) {
+      this.hisChooseNew.splice(index, 1);
       this.hisVal.splice(index, 1);
     },
 
@@ -194,7 +196,8 @@ export default {
         });
         return;
       }
-      if (this.hisChoose.length == 0) {
+      const hisChoose = [...this.hisChoose, ...this.hisChooseNew];
+      if (hisChoose.length == 0) {
         this.$message({
           type: "warning",
           message: "请至少选择一种HIS药品",
@@ -203,15 +206,11 @@ export default {
         return;
       }
 
-      this.addOrUpdateDrug(type);
+      this.addOrUpdateDrug(type, hisChoose.map(item => item.drugId));
     },
 
     /// 新增或修改药品映射
-    async addOrUpdateDrug(type) {
-      let jgDrugId = [];
-      this.hisChoose.forEach(item => {
-        jgDrugId.push(item.drugId);
-      });
+    async addOrUpdateDrug(type, jgDrugId) {
       let params = [
         {
           // orgId: this.getuserinfo.organizationid,
@@ -433,6 +432,11 @@ export default {
   min-height: 24px;
   // height: 0px;
 }
+
+.row {
+  &-old {}
+  &-new {}
+}
 </style>
 
 <style lang="scss" scoped>