✨ feat: 商品分析: 切换商品对搜索词编码

src/views/productCenter/productAnalysis/components/TopParentAsin/ExchangeProduct.vue

@@ -40,12 +40,13 @@ async function fetchProductLine() {
 
 async function handleChange() {
   parentloading.value = true
+  const encodedSearchItem = encodeURIComponent(searchInp.value)
   const query = {
     profileId: profile.value.profile_id,
     productlineId: productSelect.value,
-    searchItem: searchInp.value,
+    searchItem: encodedSearchItem,
   }
-  if (searchInp.value) {
+  if (encodedSearchItem) {
     const res = await getProduct(query)
     allData.value = res.data
     emitter.emit('ExchangeProduct-allData', allData) // 让useSelectItem()中的allData得到正确更新, 否则无法正确选择parentAsin
@@ -65,9 +66,11 @@ function resetProductList() {
   selectedIndex.value = -1
 }
 
-watch(searchInp, () => {
-  emitter.emit('ExchangeProduct-searchInp', searchInp)
-  if (searchInp.value === '') {
+// 监听搜索框的变化并对搜索框的值编码
+watch(searchInp, (newValue) => {
+  const encodedSearchItem = encodeURIComponent(newValue)
+  emitter.emit('ExchangeProduct-searchInp', encodedSearchItem)
+  if (newValue === '') {
     resetProductList()
   }
 })
@@ -104,7 +107,7 @@ onBeforeUnmount(() => {
       <el-icon @click="visible = false" style="cursor: pointer"><CloseBold /></el-icon>
     </div>
     <div class="filter-bar">
-      <el-input v-model="searchInp" style="max-width: 600px" @change="handleChange" placeholder="请输入标题/父ASIN/ASIN/SKU查询商品">
+      <el-input v-model="searchInp" @change="handleChange" clearable placeholder="请输入标题/父ASIN/ASIN/SKU查询商品" style="max-width: 600px">
         <template #prepend>
           <el-select v-model="filterSelect" class="filter-bar-select">
             <el-option label="模糊" value="vague" />

src/views/productCenter/productAnalysis/hooks/useInfiniteScroll.ts

@@ -13,7 +13,7 @@ export default function useInfiniteScroll() {
 
   const searchInp = ref('')
   emitter.on('ExchangeProduct-searchInp', (value: any) => {
-    searchInp.value = value.value
+    searchInp.value = value
   })
 
   const allData = ref([])

src/views/productCenter/productAnalysis/index.vue

@@ -48,7 +48,7 @@ const options2 = [
 const updatedData = ref([])
 provide('tableData', updatedData)
 
-function handleUpdate(value) {
+function handleUpdate(value: any) {
   updatedData.value = value
 }
 </script>