v6.0.2

src/components/icss/MedicineInfoPg.vue

@@ -107,10 +107,10 @@ export default {
         //   { required: true, message: '请选择是否属于诊断', trigger: 'change' }
         // ],
         position: [
-          { required: true, message: '请选择显示位置', trigger: 'change' }
+          { required: true, message: '请选择内容类型', trigger: 'change' }
         ],
         title: [
-          { required: true, message: '请输入标题名称', trigger: 'change' },
+          { required: true, message: '请输入段落标题', trigger: 'change' },
           {
             validator: (rule, value, callback) => {
               if (value.length > 30) {

src/components/icss/dept/AddDept.vue

@@ -6,7 +6,13 @@
       :param="$route.params"
       linkTo="DeptManage"
     ></crumbs>
-    <el-form :model="form" label-position="right" label-width="120px" ref="relationForm">
+    <el-form
+      :model="form"
+      :rules="rules"
+      label-position="right"
+      label-width="120px"
+      ref="relationForm"
+    >
       <div class="AddChemicalAndCommonMappingBox clearfix">
         <div class="titleBox clearfix">
           <p class="title">医院术语</p>
@@ -15,9 +21,12 @@
         <div class="leftBox clearfix">
           <el-row>
             <el-col :span="16">
-              <el-form-item label="科室名称：">
+              <el-form-item label="科室名称：" prop="hisName">
                 <el-input v-model="form.hisName" clearable></el-input>
               </el-form-item>
+              <el-form-item label="科室编码：">
+                <el-input v-model="form.hisCode" clearable></el-input>
+              </el-form-item>
               <el-form-item label="科室名称预览：">
                 <span class="previewInfo">{{form.hisName}}</span>
               </el-form-item>
@@ -31,7 +40,7 @@
         <div class="rightBox">
           <el-row>
             <el-col :span="16">
-              <el-form-item label="科室名称：">
+              <el-form-item label="科室名称：" prop="searchText">
                 <el-select
                   style="width:100%"
                   v-model="form.searchText"
@@ -80,7 +89,16 @@ export default {
       uniqueNameList: [],
       form: {
         searchText: '', //搜索字段
-        hisName: ''
+        hisName: '',
+        hisCode: ''
+      },
+      rules: {
+        hisName: [
+          { required: true, message: '请输入科室名称', trigger: 'change' }
+        ],
+        searchText: [
+          { required: true, message: '请选择科室名称', trigger: 'change' }
+        ]
       },
       saveDisable: false, //保存按钮禁止点击
       showDrop: false //下拉框显示文字
@@ -89,11 +107,13 @@ export default {
   created() {
     //修改
     const { isEdit, data } = this.$route.params;
+    console.log(data,'data');
     if (isEdit) {
       this.isEdit = isEdit;
       this.editId = data.id;
       this.form.hisName = data.hisName;
       this.form.searchText = data.uniqueName;
+      this.form.hisCode = data.hisCode;
     }
   },
   methods: {
@@ -128,12 +148,20 @@ export default {
 
     // 建立关联-参数处理
     submitForm() {
-      const { searchText, hisName } = this.form;
-      let params = {
-        hisName: hisName,
-        uniqueName: searchText
-      };
-      this.showSaveDialog(params);
+      this.$refs.relationForm.validate(valid => {
+        if (valid) {
+          const { searchText, hisName, hisCode } = this.form;
+          let params = {
+            hisName: hisName,
+            uniqueName: searchText,
+            hisCode: hisCode
+          };
+          this.showSaveDialog(params);
+        } else {
+          console.log('error submit!!');
+          return false;
+        }
+      });
     },
     // 建立关联-映射关系是否已存在
     showSaveDialog(params) {

src/components/icss/dept/DeptManage.vue

@@ -30,8 +30,8 @@
       <el-table :data="list" border style="width: 100%">
         <el-table-column :resizable="false" type="index" :index="indexMethod" label="编号" width="60"></el-table-column>
         <el-table-column :resizable="false" prop="gmtModified" label="操作时间" width="180"></el-table-column>
+        <el-table-column :resizable="false" prop="hisCode" label="医院科室编码" show-overflow-tooltip></el-table-column>
         <el-table-column :resizable="false" prop="hisName" label="医院科室名称" show-overflow-tooltip></el-table-column>
-        <el-table-column :resizable="false" prop="uniqueCode" label="对应项编码" show-overflow-tooltip></el-table-column>
         <el-table-column :resizable="false" prop="uniqueName" label="标准科室名称" show-overflow-tooltip></el-table-column>
         <el-table-column :resizable="false" prop="operate" label="操作">
           <template slot-scope="scope">

src/components/icss/disease/AddChemicalAndCommonMapping.vue

@@ -4,9 +4,15 @@
       :title="isEdit ? '诊断关联维护--修改关联' : '诊断关联维护--添加关联'"
       class="topBack"
       :param="$route.params"
-      linkTo="DeptManage"
+      linkTo="ChemicalAndCommonMapping"
     ></crumbs>
-    <el-form :model="form" label-position="right" label-width="120px" ref="relationForm">
+    <el-form
+      :model="form"
+      :rules="rules"
+      label-position="right"
+      label-width="120px"
+      ref="relationForm"
+    >
       <div class="AddChemicalAndCommonMappingBox clearfix">
         <div class="titleBox clearfix">
           <p class="title">医院术语</p>
@@ -15,7 +21,7 @@
         <div class="leftBox clearfix">
           <el-row>
             <el-col :span="16">
-              <el-form-item label="诊断名称：">
+              <el-form-item label="诊断名称：" prop="hisName">
                 <el-input v-model="form.hisName" clearable></el-input>
               </el-form-item>
               <el-form-item label="诊断名称预览：">
@@ -31,7 +37,7 @@
         <div class="rightBox">
           <el-row>
             <el-col :span="16">
-              <el-form-item label="诊断名称：">
+              <el-form-item label="诊断名称：" prop="searchText">
                 <el-select
                   style="width:100%"
                   v-model="form.searchText"
@@ -50,13 +56,17 @@
                     v-for="item in uniqueNameList"
                     :key="item.icd10Code"
                     :label="item.name"
-                    :value="item.name"
+                    :value="item"
                   ></el-option>
                 </el-select>
               </el-form-item>
               <el-form-item label="诊断名称预览：">
+                <!-- <span class="previewInfo">{{!isEdit ? form.searchText.name : form.searchText}}</span> -->
                 <span class="previewInfo">{{form.searchText}}</span>
               </el-form-item>
+              <el-form-item label="ICD编码：">
+                <span class="previewInfo">{{form.icdCode}}</span>
+              </el-form-item>
             </el-col>
           </el-row>
         </div>
@@ -80,7 +90,17 @@ export default {
       uniqueNameList: [],
       form: {
         searchText: '', //搜索字段
-        hisName: ''
+        hisName: '',
+        icdCode: ''
+      },
+
+      rules: {
+        hisName: [
+          { required: true, message: '请输入诊断名称', trigger: 'change' }
+        ],
+        searchText: [
+          { required: true, message: '请选择诊断名称', trigger: 'change' }
+        ]
       },
       saveDisable: false, //保存按钮禁止点击
       showDrop: false //下拉框显示文字
@@ -94,6 +114,7 @@ export default {
       this.editId = data.id;
       this.form.hisName = data.hisName;
       this.form.searchText = data.uniqueName;
+      this.form.icdCode = data.icdCode;
     }
   },
   methods: {
@@ -116,7 +137,10 @@ export default {
         }
       });
     },
-    changeWord() {},
+    changeWord(newValue) {
+      this.form.searchText = newValue.name;
+      this.form.icdCode = newValue.icd10Code;
+    },
     // 获取焦点
     handleFocus() {},
 
@@ -124,16 +148,25 @@ export default {
     initForm() {
       this.form.hisName = '';
       this.form.searchText = '';
+      this.form.icdCode = '';
     },
 
     // 建立关联-参数处理
     submitForm() {
-      const { searchText, hisName } = this.form;
-      let params = {
-        hisName: hisName,
-        uniqueName: searchText
-      };
-      this.showSaveDialog(params);
+      this.$refs.relationForm.validate(valid => {
+        if (valid) {
+          const { searchText, hisName,icdCode } = this.form;
+          let params = {
+            hisName: hisName,
+            uniqueName: searchText,
+            icdCode: icdCode
+          };
+          this.showSaveDialog(params);
+        } else {
+          console.log('error submit!!');
+          return false;
+        }
+      });
     },
     // 建立关联-映射关系是否已存在
     showSaveDialog(params) {

src/components/icss/disease/ChemicalAndCommonMapping.vue

@@ -34,7 +34,7 @@
         <el-table-column :resizable="false" prop="hisName" label="医院诊断名称" show-overflow-tooltip></el-table-column>
         <el-table-column
           :resizable="false"
-          prop="uniqueCode"
+          prop="icdCode"
           label="ICD-10编码"
           show-overflow-tooltip
         ></el-table-column>

src/components/icss/drug/AddDrug.vue

@@ -4,9 +4,9 @@
       :title="isEdit ? '药品关联维护--修改关联' : '药品关联维护--添加关联'"
       class="topBack"
       :param="$route.params"
-      linkTo="DeptManage"
+      linkTo="DrugManage"
     ></crumbs>
-    <el-form :model="form" label-position="right" label-width="120px" ref="relationForm">
+    <el-form :model="form"  :rules="rules" label-position="right" label-width="120px" ref="relationForm">
       <div class="AddChemicalAndCommonMappingBox clearfix">
         <div class="titleBox clearfix">
           <p class="title">医院术语</p>
@@ -15,7 +15,7 @@
         <div class="leftBox clearfix">
           <el-row>
             <el-col :span="16">
-              <el-form-item label="药品名称：">
+              <el-form-item label="药品名称：" prop="hisName">
                 <el-input v-model="form.hisName" clearable></el-input>
               </el-form-item>
               <el-form-item label="药品名称预览：">
@@ -31,7 +31,7 @@
         <div class="rightBox">
           <el-row>
             <el-col :span="16">
-              <el-form-item label="药品名称：">
+              <el-form-item label="药品名称："  prop="searchText">
                 <el-select
                   style="width:100%"
                   v-model="form.searchText"
@@ -81,6 +81,14 @@ export default {
       form: {
         searchText: '', //搜索字段
         hisName: ''
+      },
+       rules: {
+        hisName: [
+          { required: true, message: '请输入药品名称', trigger: 'change' }
+        ],
+        searchText: [
+          { required: true, message: '请选择药品名称', trigger: 'change' }
+        ]
       },
       saveDisable: false, //保存按钮禁止点击
       showDrop: false //下拉框显示文字
@@ -128,12 +136,19 @@ export default {
 
     // 建立关联-参数处理
     submitForm() {
-      const { searchText, hisName } = this.form;
-      let params = {
-        hisName: hisName,
-        uniqueName: searchText
-      };
-      this.showSaveDialog(params);
+      this.$refs.relationForm.validate(valid => {
+        if (valid) {
+          const { searchText, hisName } = this.form;
+          let params = {
+            hisName: hisName,
+            uniqueName: searchText
+          };
+          this.showSaveDialog(params);
+        } else {
+          console.log('error submit!!');
+          return false;
+        }
+      });
     },
     // 建立关联-映射关系是否已存在
     showSaveDialog(params) {

src/components/icss/drug/DrugManage.vue

@@ -32,8 +32,9 @@
         <el-table-column :resizable="false" prop="gmtModified" label="操作时间" width="180"></el-table-column>
         <!-- <el-table-column :resizable="false" prop="mealName" label="化验大项" show-overflow-tooltip></el-table-column> -->
         <el-table-column :resizable="false" prop="hisName" label="医院药品名称" show-overflow-tooltip></el-table-column>
-        <el-table-column :resizable="false" prop="uniqueCode" label="对应项编码" show-overflow-tooltip></el-table-column>
+        <!-- <el-table-column :resizable="false" prop="uniqueCode" label="对应项编码" show-overflow-tooltip></el-table-column> -->
         <el-table-column :resizable="false" prop="uniqueName" label="标准药品名称" show-overflow-tooltip></el-table-column>
+        <el-table-column :resizable="false" prop="u" label="药品剂型" show-overflow-tooltip></el-table-column>
         <el-table-column :resizable="false" prop="operate" label="操作">
           <template slot-scope="scope">
             <el-button @click="modifyRelation(scope.row)" type="text" size="small">修改</el-button>

src/components/icss/fusion/AddFusion.vue

@@ -1,99 +1,103 @@
 <template>
-  <div class="AddChemicalAndCommonMappingWrapper clearfix" @click="close">
+  <div class="AddChemicalAndCommonMappingWrapper clearfix">
     <crumbs
       :title="isEdit ? '输血关联维护--修改关联' : '输血关联维护--添加关联'"
       class="topBack"
       :param="$route.params"
       linkTo="Fusion"
     ></crumbs>
-    <div class="AddChemicalAndCommonMappingBox clearfix">
-      <div class="titleBox clearfix">
-        <p class="title">医院术语</p>
-        <p class="title">标准术语</p>
-      </div>
-      <div class="leftBox clearfix">
-        <div class="itemLabel clearfix">
-          <label class="itemLabelName">用血类型</label>
-          <input class="searchInput" type="text" v-model="hisName" />
+    <el-form
+      :model="form"
+      :rules="rules"
+      label-position="right"
+      label-width="120px"
+      ref="relationForm"
+    >
+      <div class="AddChemicalAndCommonMappingBox clearfix">
+        <div class="titleBox clearfix">
+          <p class="title">医院术语</p>
+          <p class="title">标准术语</p>
         </div>
-        <div class="itemLabel clearfix">
-          <label class="itemLabelName">用血类型预览：</label>
-          <span class="selectItemName">{{hisName}}</span>
+        <div class="leftBox clearfix">
+          <el-row>
+            <el-col :span="16">
+              <el-form-item label="用血类型：" prop="hisName">
+                <el-input v-model="form.hisName" clearable></el-input>
+              </el-form-item>
+              <el-form-item label="用血类型预览：">
+                <span class="previewInfo">{{form.hisName}}</span>
+              </el-form-item>
+            </el-col>
+          </el-row>
         </div>
-      </div>
-      <div class="midBox">
-        <img class="midLogo" src="../../../images/relation.png" alt />
-        <p class="midTitle">相互关联</p>
-      </div>
-      <div class="rightBox">
-        <div class="itemLabel">
-          <label class="itemLabelName">用血类型</label>
-          <input class="searchInput" @focus="focuInput" type="text" v-model="uniqueText" />
-          <span class="searchName" @click="searchMealItem(3)">搜索</span>
-          <ul
-            v-if="showUniqueNameList&&uniqueNameList.length >0"
-            class="itemList uniqueNameList"
-            ref="uniqueNameList"
-          >
-            <li
-              v-for="item in uniqueNameList"
-              class="mealNameItem ellipsis"
-              :title="item"
-              @click="selectUniqueName(item)"
-              :key="item"
-            >{{item}}</li>
-          </ul>
-          <ul
-            v-else-if="showUniqueNameList&&uniqueNameList.length === 0"
-            class="itemList uniqueNameList"
-          >
-            <li class="mealNameItem ellipsis">无数据</li>
-          </ul>
-          <ul v-else-if=" isSendDataOver === 1" class="itemList uniqueNameList">
-            <li class="mealNameItem ellipsis">加载中.....</li>
-          </ul>
+        <div class="midBox">
+          <img class="midLogo" src="../../../images/relation.png" alt />
+          <p class="midTitle">相互关联</p>
         </div>
-        <div class="itemLabel">
-          <!-- <label class="itemLabelName isRequired">诊断名称预览：</label> -->
-          <label class="itemLabelName">用血类型预览：</label>
-          <span class="selectItemName">{{form.uniqueName}}</span>
+        <div class="rightBox">
+          <el-row>
+            <el-col :span="16">
+              <el-form-item label="用血类型：" prop="searchText">
+                <el-select
+                  style="width:100%"
+                  v-model="form.searchText"
+                  filterable
+                  remote
+                  clearable
+                  :loading="showDrop"
+                  loading-text="加载中..."
+                  @change="changeWord"
+                  @focus="handleFocus"
+                  placeholder="搜索"
+                  :remote-method="searchTerms"
+                  reserve-keyword
+                >
+                  <el-option
+                    v-for="(item,idx) in uniqueNameList"
+                    :key="idx"
+                    :label="item"
+                    :value="item"
+                  ></el-option>
+                </el-select>
+              </el-form-item>
+              <el-form-item label="用血类型预览：">
+                <span class="previewInfo">{{form.searchText}}</span>
+              </el-form-item>
+            </el-col>
+          </el-row>
         </div>
       </div>
-    </div>
-    <div class="btn">
-      <!-- <span class="sumbit" @click="submitForm">建立关联</span> -->
-      <el-button type="primary" :disabled="saveDisable" @click="submitForm">确定</el-button>
-    </div>
+      <div class="btn">
+        <el-form-item>
+          <el-button type="primary" :disabled="saveDisable" @click="submitForm">确定</el-button>
+        </el-form-item>
+      </div>
+    </el-form>
   </div>
 </template>
 <script>
 import api from '@api/icss.js';
-
 export default {
   name: 'AddFusion',
   data() {
     return {
-      hisName: '', //检查项目
-      itemText: '', //化验小项搜索文字内容
-      uniqueText: '', //公表项搜索文字内容
       isEdit: false,
       editId: '',
-      mealNameList: [],
-      itemNameList: [],
       uniqueNameList: [],
-      showMealNameList: false,
-      showItemNameList: false,
-      showUniqueNameList: false,
       form: {
-        mealName: '', //大项名称
-        mealId: '', //大项Id
-        itemName: '', //小项名称
-        itemId: '', //小项Id
-        uniqueName: '', //公表名称，必填
-        uniqueId: '' //公表项Id
+        searchText: '', //搜索字段
+        hisName: ''
+      },
+      rules: {
+        hisName: [
+          { required: true, message: '请输入用血类型', trigger: 'change' }
+        ],
+        searchText: [
+          { required: true, message: '请选择用血类型', trigger: 'change' }
+        ]
       },
       saveDisable: false, //保存按钮禁止点击
-      isSendDataOver: 0 // 请求列表数据过程   0  发送请求前   1 请求过程   2请求结束
+      showDrop: false //下拉框显示文字
     };
   },
   created() {
@@ -102,105 +106,55 @@ export default {
     if (isEdit) {
       this.isEdit = isEdit;
       this.editId = data.id;
-      this.uniqueText = data.uniqueName;
-      this.hisName = data.hisName;
-      this.form.uniqueName = data.uniqueName;
+      this.form.hisName = data.hisName;
+      this.form.searchText = data.uniqueName;
     }
   },
   methods: {
-    close() {
-      this.mealNameList = [];
-      this.itemNameList = [];
-      this.uniqueNameList = [];
-      this.showSearchList();
-    },
-    // 搜索
-    searchMealItem(type) {
-      if (type == '1' || type == '2') {
-        this.getTagList(type);
-      } else if (type == '3') {
-        this.isSendDataOver = 1; // 发送请求中
-        // 搜索标准术语列表
-        this.getAllLisConcept();
+    // 搜索列表
+    searchTerms(query) {
+      if (!query) {
+        return;
       }
-    },
-
-    // 标准术语搜索列表
-    getAllLisConcept() {
+      this.showDrop = true;
       let params = {
-        type: 8, //血液
-        inputStr: this.uniqueText,
+        type: 8,//输血
+        inputStr: query,
         sex: 3,
         age: 0
       };
-      if (!params.inputStr) {
-        return;
-      }
       api.retrievalSearch(params).then(res => {
+        this.showDrop = false;
         if (res.data.code === '0') {
-          this.isSendDataOver = 2; //请求发送结束
           this.uniqueNameList = res.data.data.transfusionNames;
-          this.showSearchList('showUniqueNameList');
         }
       });
     },
+    changeWord() {},
+    // 获取焦点
+    handleFocus() {},
 
-    // 获取焦点搜索
-    focuInput() {
-      this.showSearchList();
-    },
-
-    // 显示搜索列表数据
-    showSearchList(type) {
-      this.showMealNameList = false;
-      this.showItemNameList = false;
-      this.showUniqueNameList = false;
-      if (type === 'showMealNameList') {
-        this.showMealNameList = true;
-      } else if (type === 'showItemNameList') {
-        this.showItemNameList = true;
-      } else if (type === 'showUniqueNameList') {
-        this.showUniqueNameList = true;
-      }
-    },
-    selectMealName(item) {
-      this.form.mealName = item.conceptName;
-      this.form.mealId = item.conceptId;
-      // this.$refs['mealNameList'].style.display='none'
-      this.hisName = '';
-      this.mealNameList = [];
-    },
-    selectItemName(item) {
-      this.form.itemName = item.conceptName;
-      this.form.itemId = item.conceptId;
-      this.itemText = '';
-      this.itemNameList = [];
-    },
-    // 选中诊断标准术语
-    selectUniqueName(item) {
-      this.form.uniqueName = item;
-      this.uniqueNameList = [];
-    },
     // 初始化表单数据
     initForm() {
-      this.form.uniqueName = '';
-      this.hisName = '';
-      this.uniqueText = '';
+      this.form.hisName = '';
+      this.form.searchText = '';
     },
 
     // 建立关联-参数处理
     submitForm() {
-      const { hisName } = this;
-      const { uniqueName } = this.form;
-      if (!hisName || !uniqueName) {
-        this.warning('请填写相关数据');
-        return;
-      }
-      let params = {
-        hisName: hisName,
-        uniqueName: uniqueName
-      };
-      this.showSaveDialog(params);
+      this.$refs.relationForm.validate(valid => {
+        if (valid) {
+          const { searchText, hisName } = this.form;
+          let params = {
+            hisName: hisName,
+            uniqueName: searchText
+          };
+          this.showSaveDialog(params);
+        } else {
+          console.log('error submit!!');
+          return false;
+        }
+      });
     },
     // 建立关联-映射关系是否已存在
     showSaveDialog(params) {
@@ -217,9 +171,6 @@ export default {
             this.saveLisMapping(params, '保存成功', 'success');
           } else {
             // 已存在,提示修改
-            // this.showConfirmDialog('该关联已存在是否替换旧的关系信息', () => {
-            //   this.saveLisMapping(params, '关联建立成功', 'success');
-            // });
             this.warning('该条关联已存在，无法添加');
             this.saveDisable = false;
           }
@@ -234,7 +185,6 @@ export default {
       api.saveOrUpdateFusionRecord(params).then(res => {
         if (res.data.code === '0') {
           this.warning(res.data.msg || msg, type);
-          // this.$router.push({name: 'ChemicalAndCommonMapping'});
           this.initForm();
           this.$router.push({
             name: 'Fusion',
@@ -284,17 +234,6 @@ export default {
   .topBack {
     top: 0;
   }
-  // .groupTitle {
-  //     width: calc(100% - 50px);
-  //     height: 40px;
-  //     background: #fff;
-  //     padding: 0 20px 0 30px;
-  //     margin-bottom: 20px;
-  //     line-height: 40px;
-  //     position: relative;
-  //     z-index: 5;
-
-  // }
   .titleBox {
     padding: 0 0 10px 0px;
   }
@@ -395,9 +334,25 @@ export default {
   .mealNameItem:hover {
     background: #f5f7fa;
   }
-  .selectItemName {
+  // .selectItemName {
+  //   padding-left: 4px;
+  //   display: inline-block;
+  //   margin-top: 8px;
+  //   // width: calc(100% - 160px);s
+  //   line-height: 24px;
+  //   overflow: hidden;
+  //   word-wrap: break-word;
+  //   word-break: break-all;
+  // }
+  .previewInfo {
+    padding-left: 4px;
     display: inline-block;
-    width: calc(100% - 160px);
+    margin-top: 8px;
+    // width: calc(100% - 160px);s
+    line-height: 24px;
+    overflow: hidden;
+    word-wrap: break-word;
+    word-break: break-all;
   }
   .btn {
     position: relative;

src/components/icss/fusion/Fusion.vue

@@ -31,9 +31,9 @@
         <el-table-column :resizable="false" type="index" :index="indexMethod" label="编号" width="60"></el-table-column>
         <el-table-column :resizable="false" prop="gmtModified" label="操作时间" width="180"></el-table-column>
         <!-- <el-table-column :resizable="false" prop="mealName" label="化验大项" show-overflow-tooltip></el-table-column> -->
-        <el-table-column :resizable="false" prop="hisName" label="医院用血类型" show-overflow-tooltip></el-table-column>
+        <el-table-column :resizable="false" prop="hisName" label="医院输血类型" show-overflow-tooltip></el-table-column>
         <el-table-column :resizable="false" prop="uniqueCode" label="对应项编码" show-overflow-tooltip></el-table-column>
-        <el-table-column :resizable="false" prop="uniqueName" label="标准用血术语" show-overflow-tooltip></el-table-column>
+        <el-table-column :resizable="false" prop="uniqueName" label="标准输血类型" show-overflow-tooltip></el-table-column>
         <el-table-column :resizable="false" prop="operate" label="操作">
           <template slot-scope="scope">
             <el-button @click="modifyRelation(scope.row)" type="text" size="small">修改</el-button>

src/components/icss/lis/AddLis.vue

@@ -1,110 +1,115 @@
 <template>
-  <div class="AddChemicalAndCommonMappingWrapper clearfix" @click="close">
+  <div class="AddChemicalAndCommonMappingWrapper clearfix">
     <crumbs
       :title="isEdit ? '检验关联维护--修改关联' : '检验关联维护--添加关联'"
       class="topBack"
       :param="$route.params"
       linkTo="Lis"
     ></crumbs>
-    <div class="AddChemicalAndCommonMappingBox clearfix">
-      <div class="titleBox clearfix">
-        <p class="title">医院术语</p>
-        <p class="title">标准术语</p>
-      </div>
-      <div class="leftBox clearfix">
-        <div class="itemLabel clearfix">
-          <label class="itemLabelName">检验套餐：</label>
-          <input class="searchInput" type="text" v-model="hisName" v-on:input="handleInput" />
-          <span class="searchInputInfo" v-if="isVila">请输入检验套餐名称</span>
+    <el-form
+      :model="form"
+      :rules="rules"
+      label-position="right"
+      label-width="140px"
+      ref="relationForm"
+    >
+      <div class="AddChemicalAndCommonMappingBox clearfix">
+        <div class="titleBox clearfix">
+          <p class="title">医院术语</p>
+          <p class="title">标准术语</p>
         </div>
-        <div class="itemLabel clearfix">
-          <label class="itemLabelName">检验套餐预览：</label>
-          <span class="selectItemName">{{hisName}}</span>
+        <div class="leftBox clearfix">
+          <el-row>
+            <el-col :span="16">
+              <el-form-item label="检验套餐：" prop="hisName">
+                <el-input v-model="form.hisName" clearable></el-input>
+              </el-form-item>
+              <el-form-item label="检验套餐预览：">
+                <span class="previewInfo">{{form.hisName}}</span>
+              </el-form-item>
+            </el-col>
+          </el-row>
+          <el-row>
+            <el-col :span="16">
+              <el-form-item label="检验细项：">
+                <el-input v-model="form.hisDetailName" clearable></el-input>
+              </el-form-item>
+              <el-form-item label="检验细项预览：">
+                <span class="previewInfo">{{form.hisDetailName}}</span>
+              </el-form-item>
+            </el-col>
+          </el-row>
         </div>
-        <div class="itemLabel clearfix">
-          <label class="itemLabelName">检验细项：</label>
-          <input class="searchInput" type="text" v-model="hisDetailName" />
+        <div class="midBox">
+          <img class="midLogo" src="../../../images/relation.png" alt />
+          <p class="midTitle">相互关联</p>
         </div>
-        <div class="itemLabel clearfix">
-          <label class="itemLabelName">检验细项预览：</label>
-          <span class="selectItemName">{{hisDetailName}}</span>
+        <div class="rightBox">
+          <el-row>
+            <el-col :span="16">
+              <el-form-item label="检验标准术语：" prop="searchText">
+                <el-select
+                  style="width:100%"
+                  v-model="form.searchText"
+                  filterable
+                  remote
+                  clearable
+                  :loading="showDrop"
+                  loading-text="加载中..."
+                  @change="changeWord"
+                  @focus="handleFocus"
+                  placeholder="搜索"
+                  :remote-method="searchTerms"
+                  reserve-keyword
+                  @click.native="handleclick"
+                >
+                  <el-option
+                    v-for="(item,idx) in uniqueNameList"
+                    :key="idx"
+                    :label="searchType === 2 ? `${item.uniqueName}(${item.name})` : item"
+                    :value="searchType === 2 ? `${item.uniqueName}(${item.name})` : item"
+                  ></el-option>
+                </el-select>
+              </el-form-item>
+              <el-form-item label="检验标准术语预览：">
+                <span class="previewInfo">{{form.searchText}}</span>
+              </el-form-item>
+            </el-col>
+          </el-row>
         </div>
       </div>
-      <div class="midBox">
-        <img class="midLogo" src="../../../images/relation.png" alt />
-        <p class="midTitle">相互关联</p>
+      <div class="btn">
+        <el-form-item>
+          <el-button type="primary" :disabled="saveDisable" @click="submitForm">确定</el-button>
+        </el-form-item>
       </div>
-      <div class="rightBox">
-        <div class="itemLabel">
-          <label class="itemLabelName">检验标准术语：</label>
-          <input class="searchInput" @focus="focuInput" type="text" v-model="uniqueText" />
-          <span class="searchName" @click="searchMealItem()">搜索</span>
-          <ul
-            v-if="showUniqueNameList&&uniqueNameList.length >0"
-            class="itemList uniqueNameList"
-            ref="uniqueNameList"
-          >
-            <li
-              v-for="item in uniqueNameList"
-              class="mealNameItem ellipsis"
-              :title="searchType === 2 ? `${item.uniqueName}(${item.name})` : item"
-              @click="selectUniqueName(item)"
-              :key="searchType === 2? `${item.uniqueName}(${item.name})` : item"
-            >{{searchType === 2 ? `${item.uniqueName}(${item.name})` : item}}</li>
-          </ul>
-          <ul
-            v-else-if="showUniqueNameList&&uniqueNameList.length === 0"
-            class="itemList uniqueNameList"
-          >
-            <li class="mealNameItem ellipsis">无数据</li>
-          </ul>
-          <ul v-else-if=" isSendDataOver === 1" class="itemList uniqueNameList">
-            <li class="mealNameItem ellipsis">加载中.....</li>
-          </ul>
-        </div>
-        <div class="itemLabel">
-          <!-- <label class="itemLabelName isRequired">诊断名称预览：</label> -->
-          <label class="itemLabelName">检验标准术语预览：</label>
-          <span class="selectItemName">{{form.uniqueName}}</span>
-        </div>
-      </div>
-    </div>
-    <div class="btn">
-      <!-- <span class="sumbit" @click="submitForm">建立关联</span> -->
-      <el-button type="primary" :disabled="saveDisable" @click="submitForm">确定</el-button>
-    </div>
+    </el-form>
   </div>
 </template>
 <script>
 import api from '@api/icss.js';
-
 export default {
-  name: 'AddOperation',
+  name: 'AddLis',
   data() {
     return {
-      hisName: '', //检查项目
-      hisDetailName: '',
-      itemText: '', //化验小项搜索文字内容
-      uniqueText: '', //公表项搜索文字内容
       isEdit: false,
       editId: '',
-      mealNameList: [],
-      itemNameList: [],
       uniqueNameList: [],
-      showMealNameList: false,
-      showItemNameList: false,
-      showUniqueNameList: false,
       form: {
-        mealName: '', //大项名称
-        mealId: '', //大项Id
-        itemName: '', //小项名称
-        itemId: '', //小项Id
-        uniqueName: '', //公表名称，必填
-        uniqueId: '' //公表项Id
+        searchText: '', //搜索字段
+        hisName: '',
+        hisDetailName: ''
+      },
+      rules: {
+        hisName: [
+          { required: true, message: '请输入检验套餐', trigger: 'change' }
+        ],
+        searchText: [
+          { required: true, message: '请选择检验标准术语', trigger: 'change' }
+        ]
       },
       saveDisable: false, //保存按钮禁止点击
-      isVila: false,
-      isSendDataOver: 0, // 请求列表数据过程   0  发送请求前   1 请求过程   2请求结束
+      showDrop: false, //下拉框显示文字
       searchType: 2
     };
   },
@@ -114,122 +119,71 @@ export default {
     if (isEdit) {
       this.isEdit = isEdit;
       this.editId = data.id;
-      this.uniqueText = data.uniqueName;
-      this.hisName = data.hisName;
-      this.hisDetailName = data.hisDetailName;
-      this.form.uniqueName = data.uniqueName;
+      this.form.hisName = data.hisName;
+      this.form.searchText = data.uniqueName;
+      this.form.hisDetailName = data.hisDetailName;
     }
   },
   methods: {
-    close() {
-      this.mealNameList = [];
-      this.itemNameList = [];
-      this.uniqueNameList = [];
-      this.showSearchList();
-    },
-    // 搜索
-    searchMealItem() {
-      const { hisName, hisDetailName } = this;
-      this.isSendDataOver = 1; // 发送请求中
+    // 搜索列表
+    searchTerms(query) {
+      if (!query) {
+        return;
+      }
+      const { hisName, hisDetailName } = this.form;
       let type = 2; // 1-化验大项、2-化验小项
       if (hisName !== '' && hisDetailName === '') {
         type = 1;
       }
-      this.getAllLisConcept(type);
-    },
-    // 标准术语搜索列表
-    getAllLisConcept(type) {
-      // console.log(type, type, '================');
       this.searchType = type;
+      this.showDrop = true;
       let params = {
-        type: type, //手术/操作
-        inputStr: this.uniqueText,
+        type: type,
+        inputStr: query,
         sex: 3,
         age: 0
       };
-      if (!params.inputStr) {
-        return;
-      }
       api.retrievalSearch(params).then(res => {
+        this.showDrop = false;
         if (res.data.code === '0') {
-          this.isSendDataOver = 2; //请求发送结束
           this.uniqueNameList =
             type === 1 ? res.data.data.lisNames : res.data.data.lisDetailNames;
-          this.showSearchList('showUniqueNameList');
         }
       });
     },
-
-    // 获取焦点搜索
-    focuInput() {
-      this.showSearchList();
-    },
-
-    // 显示搜索列表数据
-    showSearchList(type) {
-      this.showMealNameList = false;
-      this.showItemNameList = false;
-      this.showUniqueNameList = false;
-      if (type === 'showMealNameList') {
-        this.showMealNameList = true;
-      } else if (type === 'showItemNameList') {
-        this.showItemNameList = true;
-      } else if (type === 'showUniqueNameList') {
-        this.showUniqueNameList = true;
-      }
-    },
-    selectMealName(item) {
-      this.form.mealName = item.conceptName;
-      this.form.mealId = item.conceptId;
-      // this.$refs['mealNameList'].style.display='none'
-      this.hisName = '';
-      this.hisDetailName = '';
-      this.mealNameList = [];
-    },
-    selectItemName(item) {
-      this.form.itemName = item.conceptName;
-      this.form.itemId = item.conceptId;
-      this.itemText = '';
-      this.itemNameList = [];
+    changeWord() {},
+    // 获取焦点
+    handleFocus() {
+      // this.uniqueNameList = [];
     },
-    // 选中诊断标准术语
-    selectUniqueName(item) {
-      this.form.uniqueName =
-        this.searchType === 2 ? `${item.uniqueName}(${item.name})` : item;
+    handleclick() {
       this.uniqueNameList = [];
+      this.form.searchText = '';
     },
+
     // 初始化表单数据
     initForm() {
-      this.form.uniqueName = '';
-      this.hisName = '';
-      this.uniqueText = '';
-      this.hisDetailName = '';
-    },
-
-    handleInput() {
-      // console.log(event.target.value,'=============');
-      if (event.target.value.length !== 0) {
-        this.isVila = false;
-      }
+      this.form.hisName = '';
+      this.form.hisDetailName = '';
+      this.form.searchText = '';
     },
 
     // 建立关联-参数处理
     submitForm() {
-      const { hisName, hisDetailName } = this;
-      const { uniqueName } = this.form;
-      if (!hisName) {
-        this.isVila = true;
-      }
-      if (!hisName || !uniqueName) {
-        this.warning('请填写相关数据');
-        return;
-      }
-      let params = {
-        hisName: hisName,
-        hisDetailName,
-        uniqueName: uniqueName
-      };
-      this.showSaveDialog(params);
+      this.$refs.relationForm.validate(valid => {
+        if (valid) {
+          const { searchText, hisName, hisDetailName } = this.form;
+          let params = {
+            hisName: hisName,
+            uniqueName: searchText,
+            hisDetailName: hisDetailName
+          };
+          this.showSaveDialog(params);
+        } else {
+          console.log('error submit!!');
+          return false;
+        }
+      });
     },
     // 建立关联-映射关系是否已存在
     showSaveDialog(params) {
@@ -246,9 +200,6 @@ export default {
             this.saveLisMapping(params, '保存成功', 'success');
           } else {
             // 已存在,提示修改
-            // this.showConfirmDialog('该关联已存在是否替换旧的关系信息', () => {
-            //   this.saveLisMapping(params, '关联建立成功', 'success');
-            // });
             this.warning('该条关联已存在，无法添加');
             this.saveDisable = false;
           }
@@ -263,7 +214,6 @@ export default {
       api.saveOrUpdateLisRecord(params).then(res => {
         if (res.data.code === '0') {
           this.warning(res.data.msg || msg, type);
-          // this.$router.push({name: 'ChemicalAndCommonMapping'});
           this.initForm();
           this.$router.push({
             name: 'Lis',
@@ -313,17 +263,6 @@ export default {
   .topBack {
     top: 0;
   }
-  // .groupTitle {
-  //     width: calc(100% - 50px);
-  //     height: 40px;
-  //     background: #fff;
-  //     padding: 0 20px 0 30px;
-  //     margin-bottom: 20px;
-  //     line-height: 40px;
-  //     position: relative;
-  //     z-index: 5;
-
-  // }
   .titleBox {
     padding: 0 0 10px 0px;
   }
@@ -374,14 +313,6 @@ export default {
     float: left;
     color: #606266;
   }
-  .searchInputInfo {
-    // margin-left: 8px;
-    color: #ed808d;
-    position: absolute;
-    top: 26px;
-    left: 150px;
-    font-size: 14px;
-  }
   .itemLabelName {
     width: 150px;
   }
@@ -432,10 +363,21 @@ export default {
   .mealNameItem:hover {
     background: #f5f7fa;
   }
-  .selectItemName {
+  // .selectItemName {
+  //   padding-left: 4px;
+  //   display: inline-block;
+  //   margin-top: 8px;
+  //   // width: calc(100% - 160px);s
+  //   line-height: 24px;
+  //   overflow: hidden;
+  //   word-wrap: break-word;
+  //   word-break: break-all;
+  // }
+  .previewInfo {
+    padding-left: 4px;
     display: inline-block;
     margin-top: 8px;
-    width: calc(100% - 160px);
+    // width: calc(100% - 160px);s
     line-height: 24px;
     overflow: hidden;
     word-wrap: break-word;

src/components/icss/lis/Lis.vue

@@ -35,7 +35,7 @@
         <el-table-column :resizable="false" prop="gmtModified" label="操作时间" width="180"></el-table-column>
         <el-table-column :resizable="false" prop="hisName" label="检验套餐" show-overflow-tooltip></el-table-column>
         <el-table-column :resizable="false" prop="hisDetailName" label="检验细项" show-overflow-tooltip></el-table-column>
-        <el-table-column :resizable="false" prop="uniqueCode" label="对应项编码" show-overflow-tooltip></el-table-column>
+        <!-- <el-table-column :resizable="false" prop="uniqueCode" label="对应项编码" show-overflow-tooltip></el-table-column> -->
         <el-table-column :resizable="false" prop="uniqueName" label="标准检验项" show-overflow-tooltip></el-table-column>
         <el-table-column :resizable="false" prop="operate" label="操作">
           <template slot-scope="scope">

src/components/icss/operation/AddOperation.vue

@@ -1,99 +1,103 @@
 <template>
-  <div class="AddChemicalAndCommonMappingWrapper clearfix" @click="close">
+  <div class="AddChemicalAndCommonMappingWrapper clearfix">
     <crumbs
       :title="isEdit ? '手术/操作关联维护--修改关联' : '手术/操作关联维护--添加关联'"
       class="topBack"
       :param="$route.params"
       linkTo="Operation"
     ></crumbs>
-    <div class="AddChemicalAndCommonMappingBox clearfix">
-      <div class="titleBox clearfix">
-        <p class="title">医院术语</p>
-        <p class="title">标准术语</p>
-      </div>
-      <div class="leftBox clearfix">
-        <div class="itemLabel clearfix">
-          <label class="itemLabelName">手术/操作名称</label>
-          <input class="searchInput" type="text" v-model="hisName" />
+    <el-form
+      :model="form"
+      :rules="rules"
+      label-position="right"
+      label-width="160px"
+      ref="relationForm"
+    >
+      <div class="AddChemicalAndCommonMappingBox clearfix">
+        <div class="titleBox clearfix">
+          <p class="title">医院术语</p>
+          <p class="title">标准术语</p>
         </div>
-        <div class="itemLabel clearfix">
-          <label class="itemLabelName">手术/操作名称预览：</label>
-          <span class="selectItemName">{{hisName}}</span>
+        <div class="leftBox clearfix">
+          <el-row>
+            <el-col :span="20">
+              <el-form-item label="手术/操作名称：" prop="hisName">
+                <el-input v-model="form.hisName" clearable></el-input>
+              </el-form-item>
+              <el-form-item label="手术/操作名称预览：">
+                <span class="previewInfo">{{form.hisName}}</span>
+              </el-form-item>
+            </el-col>
+          </el-row>
         </div>
-      </div>
-      <div class="midBox">
-        <img class="midLogo" src="../../../images/relation.png" alt />
-        <p class="midTitle">相互关联</p>
-      </div>
-      <div class="rightBox">
-        <div class="itemLabel">
-          <label class="itemLabelName">手术/操作名称</label>
-          <input class="searchInput" @focus="focuInput" type="text" v-model="uniqueText" />
-          <span class="searchName" @click="searchMealItem(3)">搜索</span>
-          <ul
-            v-if="showUniqueNameList&&uniqueNameList.length >0"
-            class="itemList uniqueNameList"
-            ref="uniqueNameList"
-          >
-            <li
-              v-for="item in uniqueNameList"
-              class="mealNameItem ellipsis"
-              :title="item.name"
-              @click="selectUniqueName(item)"
-              :key="item.name"
-            >{{item.name}}</li>
-          </ul>
-          <ul
-            v-else-if="showUniqueNameList&&uniqueNameList.length === 0"
-            class="itemList uniqueNameList"
-          >
-            <li class="mealNameItem ellipsis">无数据</li>
-          </ul>
-          <ul v-else-if=" isSendDataOver === 1" class="itemList uniqueNameList">
-            <li class="mealNameItem ellipsis">加载中.....</li>
-          </ul>
+        <div class="midBox">
+          <img class="midLogo" src="../../../images/relation.png" alt />
+          <p class="midTitle">相互关联</p>
         </div>
-        <div class="itemLabel">
-          <!-- <label class="itemLabelName isRequired">诊断名称预览：</label> -->
-          <label class="itemLabelName">手术/操作名称预览：</label>
-          <span class="selectItemName">{{form.uniqueName}}</span>
+        <div class="rightBox">
+          <el-row>
+            <el-col :span="20">
+              <el-form-item label="手术/操作名称：" prop="searchText">
+                <el-select
+                  style="width:100%"
+                  v-model="form.searchText"
+                  filterable
+                  remote
+                  clearable
+                  :loading="showDrop"
+                  loading-text="加载中..."
+                  @change="changeWord"
+                  @focus="handleFocus"
+                  placeholder="搜索"
+                  :remote-method="searchTerms"
+                  reserve-keyword
+                >
+                  <el-option
+                    v-for="(item,idx) in uniqueNameList"
+                    :key="idx"
+                    :label="item.name"
+                    :value="item.name"
+                  ></el-option>
+                </el-select>
+              </el-form-item>
+              <el-form-item label="手术/操作名称预览：">
+                <span class="previewInfo">{{form.searchText}}</span>
+              </el-form-item>
+            </el-col>
+          </el-row>
         </div>
       </div>
-    </div>
-    <div class="btn">
-      <!-- <span class="sumbit" @click="submitForm">建立关联</span> -->
-      <el-button type="primary" :disabled="saveDisable" @click="submitForm">确定</el-button>
-    </div>
+      <div class="btn">
+        <el-form-item>
+          <el-button type="primary" :disabled="saveDisable" @click="submitForm">确定</el-button>
+        </el-form-item>
+      </div>
+    </el-form>
   </div>
 </template>
 <script>
 import api from '@api/icss.js';
-
 export default {
   name: 'AddOperation',
   data() {
     return {
-      hisName: '', //检查项目
-      itemText: '', //化验小项搜索文字内容
-      uniqueText: '', //公表项搜索文字内容
       isEdit: false,
       editId: '',
-      mealNameList: [],
-      itemNameList: [],
       uniqueNameList: [],
-      showMealNameList: false,
-      showItemNameList: false,
-      showUniqueNameList: false,
       form: {
-        mealName: '', //大项名称
-        mealId: '', //大项Id
-        itemName: '', //小项名称
-        itemId: '', //小项Id
-        uniqueName: '', //公表名称，必填
-        uniqueId: '' //公表项Id
+        searchText: '', //搜索字段
+        hisName: ''
+      },
+      rules: {
+        hisName: [
+          { required: true, message: '请输入手术/操作名称', trigger: 'change' }
+        ],
+        searchText: [
+          { required: true, message: '请选择手术/操作名称', trigger: 'change' }
+        ]
       },
       saveDisable: false, //保存按钮禁止点击
-      isSendDataOver: 0 // 请求列表数据过程   0  发送请求前   1 请求过程   2请求结束
+      showDrop: false //下拉框显示文字
     };
   },
   created() {
@@ -102,131 +106,55 @@ export default {
     if (isEdit) {
       this.isEdit = isEdit;
       this.editId = data.id;
-      this.uniqueText = data.uniqueName;
-      this.hisName = data.hisName;
-      this.form.uniqueName = data.uniqueName;
+      this.form.hisName = data.hisName;
+      this.form.searchText = data.uniqueName;
     }
   },
   methods: {
-    close() {
-      this.mealNameList = [];
-      this.itemNameList = [];
-      this.uniqueNameList = [];
-      this.showSearchList();
-    },
-    // 搜索
-    searchMealItem(type) {
-      if (type == '1' || type == '2') {
-        this.getTagList(type);
-      } else if (type == '3') {
-        this.isSendDataOver = 1; // 发送请求中
-        // 搜索标准术语列表
-        this.getAllLisConcept();
-      }
-    },
-    getTagList(type) {
-      let param = {
-        relationPosition: 3
-      };
-      if (type == 1) {
-        param.name = this.hisName.trim();
-        param.typeId = 12;
-      } else if (type == 2) {
-        param.name = this.itemText.trim();
-        param.typeId = 13;
-      }
-      if (!param.name) {
+    // 搜索列表
+    searchTerms(query) {
+      if (!query) {
         return;
       }
-      api.getConceptInfoAssay(param).then(res => {
-        if (res.data.code === '0') {
-          if (type == 1) {
-            this.mealNameList = res.data.data;
-            this.showSearchList('showMealNameList');
-          } else if (type == 2) {
-            this.itemNameList = res.data.data;
-            this.showSearchList('showItemNameList');
-          }
-        }
-      });
-    },
-
-    // 标准术语搜索列表
-    getAllLisConcept() {
+      this.showDrop = true;
       let params = {
-        type: 6, //手术/操作
-        inputStr: this.uniqueText,
+        type: 6,//手术和操作
+        inputStr: query,
         sex: 3,
         age: 0
       };
-      if (!params.inputStr) {
-        return;
-      }
       api.retrievalSearch(params).then(res => {
+        this.showDrop = false;
         if (res.data.code === '0') {
-          this.isSendDataOver = 2; //请求发送结束
           this.uniqueNameList = res.data.data.operationNames;
-          this.showSearchList('showUniqueNameList');
         }
       });
     },
+    changeWord() {},
+    // 获取焦点
+    handleFocus() {},
 
-    // 获取焦点搜索
-    focuInput() {
-      this.showSearchList();
-    },
-
-    // 显示搜索列表数据
-    showSearchList(type) {
-      this.showMealNameList = false;
-      this.showItemNameList = false;
-      this.showUniqueNameList = false;
-      if (type === 'showMealNameList') {
-        this.showMealNameList = true;
-      } else if (type === 'showItemNameList') {
-        this.showItemNameList = true;
-      } else if (type === 'showUniqueNameList') {
-        this.showUniqueNameList = true;
-      }
-    },
-    selectMealName(item) {
-      this.form.mealName = item.conceptName;
-      this.form.mealId = item.conceptId;
-      // this.$refs['mealNameList'].style.display='none'
-      this.hisName = '';
-      this.mealNameList = [];
-    },
-    selectItemName(item) {
-      this.form.itemName = item.conceptName;
-      this.form.itemId = item.conceptId;
-      this.itemText = '';
-      this.itemNameList = [];
-    },
-    // 选中诊断标准术语
-    selectUniqueName(item) {
-      this.form.uniqueName = item.name;
-      this.uniqueNameList = [];
-    },
     // 初始化表单数据
     initForm() {
-      this.form.uniqueName = '';
-      this.hisName = '';
-      this.uniqueText = '';
+      this.form.hisName = '';
+      this.form.searchText = '';
     },
 
     // 建立关联-参数处理
     submitForm() {
-      const { hisName } = this;
-      const { uniqueName } = this.form;
-      if (!hisName || !uniqueName) {
-        this.warning('请填写相关数据');
-        return;
-      }
-      let params = {
-        hisName: hisName,
-        uniqueName: uniqueName
-      };
-      this.showSaveDialog(params);
+      this.$refs.relationForm.validate(valid => {
+        if (valid) {
+          const { searchText, hisName } = this.form;
+          let params = {
+            hisName: hisName,
+            uniqueName: searchText
+          };
+          this.showSaveDialog(params);
+        } else {
+          console.log('error submit!!');
+          return false;
+        }
+      });
     },
     // 建立关联-映射关系是否已存在
     showSaveDialog(params) {
@@ -243,9 +171,6 @@ export default {
             this.saveLisMapping(params, '保存成功', 'success');
           } else {
             // 已存在,提示修改
-            // this.showConfirmDialog('该关联已存在是否替换旧的关系信息', () => {
-            //   this.saveLisMapping(params, '关联建立成功', 'success');
-            // });
             this.warning('该条关联已存在，无法添加');
             this.saveDisable = false;
           }
@@ -260,7 +185,6 @@ export default {
       api.saveOrUpdateOperationRecord(params).then(res => {
         if (res.data.code === '0') {
           this.warning(res.data.msg || msg, type);
-          // this.$router.push({name: 'ChemicalAndCommonMapping'});
           this.initForm();
           this.$router.push({
             name: 'Operation',
@@ -310,17 +234,6 @@ export default {
   .topBack {
     top: 0;
   }
-  // .groupTitle {
-  //     width: calc(100% - 50px);
-  //     height: 40px;
-  //     background: #fff;
-  //     padding: 0 20px 0 30px;
-  //     margin-bottom: 20px;
-  //     line-height: 40px;
-  //     position: relative;
-  //     z-index: 5;
-
-  // }
   .titleBox {
     padding: 0 0 10px 0px;
   }
@@ -421,9 +334,25 @@ export default {
   .mealNameItem:hover {
     background: #f5f7fa;
   }
-  .selectItemName {
+  // .selectItemName {
+  //   padding-left: 4px;
+  //   display: inline-block;
+  //   margin-top: 8px;
+  //   // width: calc(100% - 160px);s
+  //   line-height: 24px;
+  //   overflow: hidden;
+  //   word-wrap: break-word;
+  //   word-break: break-all;
+  // }
+  .previewInfo {
+    padding-left: 4px;
     display: inline-block;
-    width: calc(100% - 160px);
+    margin-top: 8px;
+    // width: calc(100% - 160px);s
+    line-height: 24px;
+    overflow: hidden;
+    word-wrap: break-word;
+    word-break: break-all;
   }
   .btn {
     position: relative;

src/components/icss/pacs/AddPacs.vue

@@ -1,99 +1,103 @@
 <template>
-  <div class="AddChemicalAndCommonMappingWrapper clearfix" @click="close">
+  <div class="AddChemicalAndCommonMappingWrapper clearfix">
     <crumbs
       :title="isEdit ? '检查关联维护--修改关联' : '检查关联维护--添加关联'"
       class="topBack"
       :param="$route.params"
       linkTo="Pacs"
     ></crumbs>
-    <div class="AddChemicalAndCommonMappingBox clearfix">
-      <div class="titleBox clearfix">
-        <p class="title">医院术语</p>
-        <p class="title">标准术语</p>
-      </div>
-      <div class="leftBox clearfix">
-        <div class="itemLabel clearfix">
-          <label class="itemLabelName">检查项目</label>
-          <input class="searchInput" type="text" v-model="hisName" />
+    <el-form
+      :model="form"
+      :rules="rules"
+      label-position="right"
+      label-width="120px"
+      ref="relationForm"
+    >
+      <div class="AddChemicalAndCommonMappingBox clearfix">
+        <div class="titleBox clearfix">
+          <p class="title">医院术语</p>
+          <p class="title">标准术语</p>
         </div>
-        <div class="itemLabel clearfix">
-          <label class="itemLabelName">检查项目预览：</label>
-          <span class="selectItemName">{{hisName}}</span>
+        <div class="leftBox clearfix">
+          <el-row>
+            <el-col :span="16">
+              <el-form-item label="检查项目：" prop="hisName">
+                <el-input v-model="form.hisName" clearable></el-input>
+              </el-form-item>
+              <el-form-item label="检查项目预览：">
+                <span class="previewInfo">{{form.hisName}}</span>
+              </el-form-item>
+            </el-col>
+          </el-row>
         </div>
-      </div>
-      <div class="midBox">
-        <img class="midLogo" src="../../../images/relation.png" alt />
-        <p class="midTitle">相互关联</p>
-      </div>
-      <div class="rightBox">
-        <div class="itemLabel">
-          <label class="itemLabelName">检查项目</label>
-          <input class="searchInput" @focus="focuInput" type="text" v-model="uniqueText" />
-          <span class="searchName" @click="searchMealItem(3)">搜索</span>
-          <ul
-            v-if="showUniqueNameList&&uniqueNameList.length >0"
-            class="itemList uniqueNameList"
-            ref="uniqueNameList"
-          >
-            <li
-              v-for="item in uniqueNameList"
-              class="mealNameItem ellipsis"
-              :title="item"
-              @click="selectUniqueName(item)"
-              :key="item"
-            >{{item}}</li>
-          </ul>
-          <ul
-            v-else-if="showUniqueNameList&&uniqueNameList.length === 0"
-            class="itemList uniqueNameList"
-          >
-            <li class="mealNameItem ellipsis">无数据</li>
-          </ul>
-          <ul v-else-if=" isSendDataOver === 1" class="itemList uniqueNameList">
-            <li class="mealNameItem ellipsis">加载中.....</li>
-          </ul>
+        <div class="midBox">
+          <img class="midLogo" src="../../../images/relation.png" alt />
+          <p class="midTitle">相互关联</p>
         </div>
-        <div class="itemLabel">
-          <!-- <label class="itemLabelName isRequired">诊断名称预览：</label> -->
-          <label class="itemLabelName">检查项目预览：</label>
-          <span class="selectItemName">{{form.uniqueName}}</span>
+        <div class="rightBox">
+          <el-row>
+            <el-col :span="16">
+              <el-form-item label="检查项目：" prop="searchText">
+                <el-select
+                  style="width:100%"
+                  v-model="form.searchText"
+                  filterable
+                  remote
+                  clearable
+                  :loading="showDrop"
+                  loading-text="加载中..."
+                  @change="changeWord"
+                  @focus="handleFocus"
+                  placeholder="搜索"
+                  :remote-method="searchTerms"
+                  reserve-keyword
+                >
+                  <el-option
+                    v-for="(item,idx) in uniqueNameList"
+                    :key="idx"
+                    :label="item"
+                    :value="item"
+                  ></el-option>
+                </el-select>
+              </el-form-item>
+              <el-form-item label="检查项目预览：">
+                <span class="previewInfo">{{form.searchText}}</span>
+              </el-form-item>
+            </el-col>
+          </el-row>
         </div>
       </div>
-    </div>
-    <div class="btn">
-      <!-- <span class="sumbit" @click="submitForm">建立关联</span> -->
-      <el-button type="primary" :disabled="saveDisable" @click="submitForm">确定</el-button>
-    </div>
+      <div class="btn">
+        <el-form-item>
+          <el-button type="primary" :disabled="saveDisable" @click="submitForm">确定</el-button>
+        </el-form-item>
+      </div>
+    </el-form>
   </div>
 </template>
 <script>
 import api from '@api/icss.js';
-
 export default {
   name: 'AddPacs',
   data() {
     return {
-      hisName: '', //检查项目
-      itemText: '', //化验小项搜索文字内容
-      uniqueText: '', //公表项搜索文字内容
       isEdit: false,
       editId: '',
-      mealNameList: [],
-      itemNameList: [],
       uniqueNameList: [],
-      showMealNameList: false,
-      showItemNameList: false,
-      showUniqueNameList: false,
       form: {
-        mealName: '', //大项名称
-        mealId: '', //大项Id
-        itemName: '', //小项名称
-        itemId: '', //小项Id
-        uniqueName: '', //公表名称，必填
-        uniqueId: '' //公表项Id
+        searchText: '', //搜索字段
+        hisName: ''
+      },
+      rules: {
+        hisName: [
+          { required: true, message: '请输入检查项目', trigger: 'change' }
+        ],
+        searchText: [
+          { required: true, message: '请选择检查项目', trigger: 'change' }
+        ]
       },
       saveDisable: false, //保存按钮禁止点击
-      isSendDataOver: 0 // 请求列表数据过程   0  发送请求前   1 请求过程   2请求结束
+      showDrop: false //下拉框显示文字
     };
   },
   created() {
@@ -102,131 +106,55 @@ export default {
     if (isEdit) {
       this.isEdit = isEdit;
       this.editId = data.id;
-      this.uniqueText = data.uniqueName;
-      this.hisName = data.hisName;
-      this.form.uniqueName = data.uniqueName;
+      this.form.hisName = data.hisName;
+      this.form.searchText = data.uniqueName;
     }
   },
   methods: {
-    close() {
-      this.mealNameList = [];
-      this.itemNameList = [];
-      this.uniqueNameList = [];
-      this.showSearchList();
-    },
-    // 搜索
-    searchMealItem(type) {
-      if (type == '1' || type == '2') {
-        this.getTagList(type);
-      } else if (type == '3') {
-        this.isSendDataOver = 1; // 发送请求中
-        // 搜索标准术语列表
-        this.getAllLisConcept();
-      }
-    },
-    getTagList(type) {
-      let param = {
-        relationPosition: 3
-      };
-      if (type == 1) {
-        param.name = this.hisName.trim();
-        param.typeId = 12;
-      } else if (type == 2) {
-        param.name = this.itemText.trim();
-        param.typeId = 13;
-      }
-      if (!param.name) {
+    // 搜索列表
+    searchTerms(query) {
+      if (!query) {
         return;
       }
-      api.getConceptInfoAssay(param).then(res => {
-        if (res.data.code === '0') {
-          if (type == 1) {
-            this.mealNameList = res.data.data;
-            this.showSearchList('showMealNameList');
-          } else if (type == 2) {
-            this.itemNameList = res.data.data;
-            this.showSearchList('showItemNameList');
-          }
-        }
-      });
-    },
-
-    // 标准术语搜索列表
-    getAllLisConcept() {
+      this.showDrop = true;
       let params = {
-        type: 3, //辅检
-        inputStr: this.uniqueText,
+        type: 3,
+        inputStr: query,
         sex: 3,
         age: 0
       };
-      if (!params.inputStr) {
-        return;
-      }
       api.retrievalSearch(params).then(res => {
+        this.showDrop = false;
         if (res.data.code === '0') {
-          this.isSendDataOver = 2; //请求发送结束
           this.uniqueNameList = res.data.data.pacsNames;
-          this.showSearchList('showUniqueNameList');
         }
       });
     },
+    changeWord() {},
+    // 获取焦点
+    handleFocus() {},
 
-    // 获取焦点搜索
-    focuInput() {
-      this.showSearchList();
-    },
-
-    // 显示搜索列表数据
-    showSearchList(type) {
-      this.showMealNameList = false;
-      this.showItemNameList = false;
-      this.showUniqueNameList = false;
-      if (type === 'showMealNameList') {
-        this.showMealNameList = true;
-      } else if (type === 'showItemNameList') {
-        this.showItemNameList = true;
-      } else if (type === 'showUniqueNameList') {
-        this.showUniqueNameList = true;
-      }
-    },
-    selectMealName(item) {
-      this.form.mealName = item.conceptName;
-      this.form.mealId = item.conceptId;
-      // this.$refs['mealNameList'].style.display='none'
-      this.hisName = '';
-      this.mealNameList = [];
-    },
-    selectItemName(item) {
-      this.form.itemName = item.conceptName;
-      this.form.itemId = item.conceptId;
-      this.itemText = '';
-      this.itemNameList = [];
-    },
-    // 选中诊断标准术语
-    selectUniqueName(item) {
-      this.form.uniqueName = item;
-      this.uniqueNameList = [];
-    },
     // 初始化表单数据
     initForm() {
-      this.form.uniqueName = '';
-      this.hisName = '';
-      this.uniqueText = '';
+      this.form.hisName = '';
+      this.form.searchText = '';
     },
 
     // 建立关联-参数处理
     submitForm() {
-      const { hisName } = this;
-      const { uniqueName } = this.form;
-      if (!hisName || !uniqueName) {
-        this.warning('请填写相关数据');
-        return;
-      }
-      let params = {
-        hisName: hisName,
-        uniqueName: uniqueName
-      };
-      this.showSaveDialog(params);
+      this.$refs.relationForm.validate(valid => {
+        if (valid) {
+          const { searchText, hisName } = this.form;
+          let params = {
+            hisName: hisName,
+            uniqueName: searchText
+          };
+          this.showSaveDialog(params);
+        } else {
+          console.log('error submit!!');
+          return false;
+        }
+      });
     },
     // 建立关联-映射关系是否已存在
     showSaveDialog(params) {
@@ -243,9 +171,6 @@ export default {
             this.saveLisMapping(params, '保存成功', 'success');
           } else {
             // 已存在,提示修改
-            // this.showConfirmDialog('该关联已存在是否替换旧的关系信息', () => {
-            //   this.saveLisMapping(params, '关联建立成功', 'success');
-            // });
             this.warning('该条关联已存在，无法添加');
             this.saveDisable = false;
           }
@@ -260,14 +185,13 @@ export default {
       api.saveOrUpdatePacsRecord(params).then(res => {
         if (res.data.code === '0') {
           this.warning(res.data.msg || msg, type);
-          // this.$router.push({name: 'ChemicalAndCommonMapping'});
+          this.initForm();
           this.$router.push({
             name: 'Pacs',
             params: Object.assign({}, this.$route.params, {
               currentPage: 1
             })
           });
-          this.initForm();
         } else {
           this.warning(res.data.msg);
         }
@@ -310,17 +234,6 @@ export default {
   .topBack {
     top: 0;
   }
-  // .groupTitle {
-  //     width: calc(100% - 50px);
-  //     height: 40px;
-  //     background: #fff;
-  //     padding: 0 20px 0 30px;
-  //     margin-bottom: 20px;
-  //     line-height: 40px;
-  //     position: relative;
-  //     z-index: 5;
-
-  // }
   .titleBox {
     padding: 0 0 10px 0px;
   }
@@ -421,9 +334,25 @@ export default {
   .mealNameItem:hover {
     background: #f5f7fa;
   }
-  .selectItemName {
+  // .selectItemName {
+  //   padding-left: 4px;
+  //   display: inline-block;
+  //   margin-top: 8px;
+  //   // width: calc(100% - 160px);s
+  //   line-height: 24px;
+  //   overflow: hidden;
+  //   word-wrap: break-word;
+  //   word-break: break-all;
+  // }
+  .previewInfo {
+    padding-left: 4px;
     display: inline-block;
-    width: calc(100% - 160px);
+    margin-top: 8px;
+    // width: calc(100% - 160px);s
+    line-height: 24px;
+    overflow: hidden;
+    word-wrap: break-word;
+    word-break: break-all;
   }
   .btn {
     position: relative;

src/components/icss/pacs/Pacs.vue

@@ -32,7 +32,7 @@
         <el-table-column :resizable="false" prop="gmtModified" label="操作时间" width="180"></el-table-column>
         <!-- <el-table-column :resizable="false" prop="mealName" label="化验大项" show-overflow-tooltip></el-table-column> -->
         <el-table-column :resizable="false" prop="hisName" label="医院检查项目" show-overflow-tooltip></el-table-column>
-        <el-table-column :resizable="false" prop="uniqueCode" label="对应项编码" show-overflow-tooltip></el-table-column>
+        <!-- <el-table-column :resizable="false" prop="uniqueCode" label="对应项编码" show-overflow-tooltip></el-table-column> -->
         <el-table-column :resizable="false" prop="uniqueName" label="标准检查项目" show-overflow-tooltip></el-table-column>
         <el-table-column :resizable="false" prop="operate" label="操作">
           <template slot-scope="scope">