dev

src/components/PopoverInput.vue

@@ -1,8 +1,6 @@
 <template>
-  <el-popover placement="bottom-start" trigger="click" :width="props.width">
+  <el-input v-model="input" :style="{'width': props.width+'px'}" clearable :disabled="disabled" ref="inputRef" @click="showPopo"></el-input>
-    <template #reference>
+  <el-popover placement="bottom-start" trigger="click" :width="props.width" :virtual-ref="inputRef" ref="popoverRef">
-      <el-input v-model="input" :style="{'width': props.width+'px'}" clearable :disabled="disabled"></el-input>
-    </template>
     <div class="code-popo" v-if="props.list.length > 0">
       <div class="code-item" v-for="item in props.list">
         <div class="code-item-name" v-for="subItem in item" @click="inputStr(subItem)">
@@ -13,7 +11,7 @@
   </el-popover>
 </template>
 <script setup lang="ts">
-import {ref} from "vue";
+import {ref, unref} from "vue";
 
 const input = defineModel<string | null>();
 const props = defineProps({
@@ -30,13 +28,17 @@ const props = defineProps({
     default: false
   }
 })
-
+const popoverRef = ref();
+const showPopo = () => {
+  unref(popoverRef).popperRef?.delayHide?.()
+}
 const inputStr = (str: string) => {
   let strList = input.value ? input.value.split(",") : [];
   strList.push(str);
   input.value = strList.join(",");
-}
 
+}
+const inputRef = ref();
 </script>
 <style scoped lang="scss">
 .code-popo {

src/components/SearchInput.vue

@@ -1,8 +1,8 @@
 
 <template>
-  <el-popover placement="bottom-start" trigger="click" :width="props.width" ref="popoverRef">
+  <el-input
-    <template #reference>
+      ref="inputRef"
-      <el-input  style="width: 100%;"
+      style="width: 100%;"
              v-model="keyword"
              :prefix-icon="Plus"
              :placeholder="props.placeholder"
@@ -11,9 +11,11 @@
              @input="changeInput"
              class="no-border-input"
              :disabled="disabled"
+
   >
   </el-input>
-    </template>
+
+  <el-popover placement="bottom-start" trigger="click" :width="props.width" ref="popoverRef" :virtual-ref="inputRef">
     <div class="container">
       <el-table
           :data="searchList"        style="width: 100%"
@@ -32,13 +34,13 @@
   </el-popover>
 </template>
 
-<script setup lang="ts">import { ref } from "vue";
+<script setup lang="ts">import {ref, unref} from "vue";
 import { post } from "@/utils/request.ts";
 import { Plus } from "@element-plus/icons-vue";
 
 const keyword = ref("");
 const popoverRef = ref();
-
+const inputRef = ref();
 interface showConfig {
   prop: string;
   label: string;
@@ -74,12 +76,14 @@ const props = defineProps({
 const searchList = ref([]);
 
 const changeInput = (inputStr: string) => {
+  unref(popoverRef).popperRef?.delayHide?.()
   if (!props.requestApi || props.requestApi === "") {
     return;
   }
   post(props.requestApi, { keyword: keyword.value }).then((res: any) => {
     searchList.value = res;
   });
+
 };
 
 const emit = defineEmits(['selectedCallBack']);

src/components/charge/GoodsDetail.vue

@@ -1,8 +1,8 @@
 <template>
-  <el-table :data="data.goodsDetail" max-height="150">
+  <el-table :data="data.goodsDetail" max-height="150" style="width: 100%">
-    <el-table-column prop="name" label="名称" show-overflow-tooltip></el-table-column>
+    <el-table-column prop="name" label="名称" show-overflow-tooltip ></el-table-column>
-    <el-table-column prop="selectedPrice" label="单价"></el-table-column>
+    <el-table-column prop="selectedPrice" label="单价" width="100"></el-table-column>
-    <el-table-column prop="number" label="数量">
+    <el-table-column prop="number" label="数量" width="200">
       <template #default="scope">
         <div v-if="data.status == 0">
           <el-input-number v-model="scope.row.selectedNum" min="0" @change="handleNumChange"></el-input-number>
@@ -24,9 +24,9 @@
 
       </template>
     </el-table-column>
-    <el-table-column label="操作" v-if="data.status == 0">
+    <el-table-column label="操作" v-if="data.status == 0" width="60">
       <template #default="scope">
-        <el-button type="danger" link @click="delGoods(scope.row)">X</el-button>
+        <div  @click="delGoods(scope.row)">X</div>
       </template>
     </el-table-column>
   </el-table>

src/components/outpatient/DiagnosisSearchInput.vue

@@ -1,9 +1,9 @@
 <template>
-  <el-popover placement="bottom-start" trigger="click" :width="props.width" ref="popoverRef" @before-enter="beforeShow">
-    <template #reference>
   <el-input v-model="keyword" style="width:100%;height: 100%" @input="changeInput" :disabled="disabled"
-                placeholder="诊断选择"></el-input>
+            placeholder="诊断选择" ref="inputRef"></el-input>
-    </template>
+
+  <el-popover placement="bottom-start" trigger="click" :width="props.width" ref="popoverRef" @before-enter="beforeShow" :virtual-ref="inputRef">
+
     <div class="container" v-if="searchList.length > 0">
       <el-table :data="searchList" style="width: 100%" @row-click="clickRow" :show-header="props.showHeader"
                 max-height="200px">
@@ -14,7 +14,7 @@
   </el-popover>
 </template>
 <script setup lang="ts">
-import {ref, watch} from "vue";
+import {ref, unref, watch} from "vue";
 import {post} from "@/utils/request.ts";
 
 const keyword = ref("");
@@ -32,6 +32,7 @@ const props = defineProps({
   },
   width: {
     type: Number,
+    default: 1000
 
   },
   showConfig: {
@@ -47,9 +48,13 @@ const props = defineProps({
     default: false
   }
 })
+const inputRef = ref();
+
+
 
 const searchList = ref([]);
 const changeInput = (inputStr: string) => {
+  unref(popoverRef).popperRef?.delayHide?.()
   if (!props.requestApi || props.requestApi === "") {
     return
   }

src/views/charge/index.vue

@@ -200,6 +200,7 @@ const getOrderTotalPrice = () => {
 
   .middle {
     flex: 1;
+    overflow: hidden;
     display: flex;
     flex-direction: column;