From 5fbe4a5180a5de50d1bf32be51bac070c71fe1a3 Mon Sep 17 00:00:00 2001
From: ChenQiuYu <chenqiuyu@jizhiweb.cn>
Date: Mon, 26 May 2025 16:36:25 +0800
Subject: [PATCH] dev

---
 src/components/SearchInput.vue                | 111 +++---------------
 src/components/common/goods/GoodsDetail.vue   |  21 ++--
 .../common/service/ServiceDetail.vue          |  12 +-
 3 files changed, 30 insertions(+), 114 deletions(-)

diff --git a/src/components/SearchInput.vue b/src/components/SearchInput.vue
index f5e398a..ac3de17 100644
--- a/src/components/SearchInput.vue
+++ b/src/components/SearchInput.vue
@@ -17,47 +17,23 @@
           @click="changeInput"
       />
     </template>
-    <div class="container" style="height: 300px">
-      <el-scrollbar style="max-height: 300px;width: 100%">
-        <table class="table" style="width: 100%; border-collapse: collapse;max-height: 50px">
-          <!-- 表头 -->
-          <thead>
-          <tr class="table-title">
-            <th
-                v-for="item in showConfig"
-                :key="item.prop"
-                style="background-color: #f5f7fa; padding: 8px;"
-            >
-              {{ item.label }}
-            </th>
-          </tr>
-          </thead>
-          <!-- 表体 -->
-          <tbody>
-          <tr class="table-body"
-              v-for="(item, index) in searchList"
-              :key="index"
-              @click="clickRow(item)"
-              style="cursor: pointer; transition: background-color 0.2s;"
-          >
-            <td
-                v-for="showItem in showConfig"
-                :key="showItem.prop"
-                style="vertical-align: middle; padding: 8px;"
-            >
-              {{ item[showItem.prop] }}
-            </td>
-          </tr>
-          </tbody>
-        </table>
-      </el-scrollbar>
+    <div class="container" style="max-height: 300px">
+      <el-table :data="searchList" max-height="300" :header-cell-style="{ backgroundColor: '#F1F5FB' }">
+        <el-table-column
+            v-for="(conf, index) in props.showConfig"
+            :key="index"
+            :label="conf.label"
+            :prop="conf.prop"
+            show-overflow-tooltip
+        />
+    </el-table>
     </div>
   </el-popover>
 
 </template>
 
 <script setup lang="ts">
-import {ref, unref} from "vue";
+import {ref, unref, computed, onMounted} from "vue";
 import {post} from "@/utils/request.ts";
 import {Plus} from "@element-plus/icons-vue";
 
@@ -97,7 +73,7 @@ const props = defineProps({
   }
 });
 
-const searchList = ref([]);
+const searchList = ref<any>([]);
 
 const changeInput = (inputStr: string) => {
   unref(popoverRef).popperRef?.delayHide?.()
@@ -105,11 +81,10 @@ const changeInput = (inputStr: string) => {
     return;
   }
   post(props.requestApi, {keyword: keyword.value}).then((res: any) => {
-    searchList.value = res;
+    searchList.value = res
   });
 
 };
-
 const emit = defineEmits(['selectedCallBack', 'focus']);
 
 const clickRow = (row: any) => {
@@ -150,62 +125,8 @@ const handlerBlur = () => {
     border: 1px solid #409eff !important;
   }
 }
-
-.table {
-  th {
-    background: none !important;
-  }
-
-  .table-title {
-    height: 52px;
-    font-weight: 500;
-    font-size: 14px;
-    color: #333333;
-    font-style: normal;
-
-    th {
-      text-align: left;
-
-      &:nth-child(1) {
-        width: 200px;
-        text-align: left;
-        border-radius: 8px 8px 0 0;
-        padding-left: 24px !important;
-      }
-    }
-  }
-
-  .table-body {
-    height: 52px;
-    font-weight: 500;
-    font-size: 14px;
-    color: #666666;
-    font-style: normal;
-
-    td {
-      &:nth-child(1) {
-        width: 200px;
-        text-align: left;
-        padding-left: 30px !important;
-        white-space: nowrap; /* 防止文本换行 */
-        overflow: hidden; /* 隐藏溢出的文本 */
-        text-overflow: ellipsis; /* 显示省略号 */
-      }
-    }
-
-
-    &:last-child {
-      border-radius: 0 0 8px 8px;
-    }
-
-    &:hover {
-      background-color: #4D6DE4;
-      color: #fff;
-    }
-  }
-}
-
-table thead tr {
-  background: #F5FAFF;;
+:deep(.el-table__cell) {
+  padding: 0 4px;
+  height: 36px;
 }
 </style>
\ No newline at end of file
diff --git a/src/components/common/goods/GoodsDetail.vue b/src/components/common/goods/GoodsDetail.vue
index 5d8a8b3..12765b8 100644
--- a/src/components/common/goods/GoodsDetail.vue
+++ b/src/components/common/goods/GoodsDetail.vue
@@ -51,8 +51,9 @@
         <el-table-column prop="number" label="数量" width="250">
           <template #default="scope">
             <div v-if="props.status">
-              <el-input-number v-model="scope.row.selectedNum" ref="inputRef" :min="0" @change="handleNumChange(scope.row)"
-                               style="margin-right: 5px"></el-input-number>
+              <el-input-number v-model="scope.row.selectedNum" ref="inputRef" :min="0"
+                               @change="handleNumChange(scope.row)"
+                               style="margin-right: 5px" size="small"></el-input-number>
               <el-dropdown v-if="scope.row.trdnFlag == 1">
                 <span style="line-height: 30px;margin-left: 10px;cursor: pointer">{{ scope.row.selectedUnit }}</span>
                 <template #dropdown>
@@ -130,7 +131,6 @@ const showTooltip = ref(false);
 const goodsDetail = defineModel<any>();
 const delGoods = (item: any) => {
   goodsDetail.value = goodsDetail.value.filter((i: any) => i.id != item.id)
-
 }
 
 const goodsSearchApi = "goods/goods/search";
@@ -168,7 +168,7 @@ const goodsShowConfig = [
     prop: "limit",
   }
 ]
-const inputRef=ref<any>()
+const inputRef = ref<any>()
 const goodsSelect = (row: any) => {
   row.selectedNum = 1
   row.selectedUnit = row.packagingUnit
@@ -225,10 +225,9 @@ const focus = (e: any) => {
 }
 const hilistInfo = ref<any>({})
 const getHilistInfo = (item: any) => {
-  console.log("item", item)
   if (item.hilistCode != null) {
     post("social/directory/getByCode", {code: item.hilistCode}).then((res: any) => {
-      if (!res){
+      if (!res) {
         hilistInfo.value = {}
         return
       }
@@ -243,18 +242,16 @@ const colosInfo = () => {
 }
 </script>
 <style scoped lang="scss">
-:deep(.el-table tr) {
-  font-size: 16px;
-  font-weight: 500;
-  color: #333333;
-  height: 40px;
+:deep(.el-table__cell) {
+  padding: 0 4px;
+  height: 36px;
 }
 
 .bottom {
   text-align: right;
   border-top: 1px solid #EAEAEC;
   display: flex;
-  height: 50px;
+  height: 36px;
   align-items: center;
 
   .search {
diff --git a/src/components/common/service/ServiceDetail.vue b/src/components/common/service/ServiceDetail.vue
index 5b7695b..00aee81 100644
--- a/src/components/common/service/ServiceDetail.vue
+++ b/src/components/common/service/ServiceDetail.vue
@@ -37,7 +37,7 @@
         <el-table-column label="数量" width="250">
           <template #default="scope">
             <el-input-number v-if="props.status" v-model="scope.row.selectedNum" :min="0"
-                             @change="handleNumChange" style="margin-right: 5px"></el-input-number>
+                             @change="handleNumChange" style="margin-right: 5px" size="small"></el-input-number>
             <span v-else>{{ scope.row.selectedNum }}</span>
             {{ scope.row.selectedUnit }}
           </template>
@@ -168,18 +168,16 @@ const hide = () => {
 }
 </script>
 <style scoped lang="scss">
-:deep(.el-table tr) {
-  font-size: 16px;
-  font-weight: 500;
-  color: #333333;
-  height: 40px;
+:deep(.el-table__cell) {
+  padding: 0 4px;
+  height: 36px;
 }
 
 .bottom {
   text-align: right;
   border-top: 1px solid #EAEAEC;
   display: flex;
-  height: 50px;
+  height: 36px;
   align-items: center;
 
   .search {