fix: 修复招商页面交互问题

xinkeaboard-promotion-portal/src/components/CountrySelct.vue

@@ -188,7 +188,7 @@ defineExpose({
   display: flex;
   justify-content: center;
   align-items: center;
-  background-color: #fff;
+  // background-color: #fff;
   margin-left: 10px;
 
   &-item {

xinkeaboard-promotion-portal/src/components/TopContent.vue

@@ -42,7 +42,7 @@ import { useRouter } from 'vue-router';
 import CountrySelct from '@/components/CountrySelct.vue';
 import ProductDescription from '@/components/ProductDescription.vue';
 import CompetitorWebsite from '@/components/CompetitorWebsite.vue';
-import Logo from '@/assets/images/logo.svg';
+import Logo from '@/assets/images/logo.png';
 
 import { showMessage } from '@/utils/common';
 const mainStore = useMainStore();
@@ -112,8 +112,19 @@ const getFormData = () => {
   };
 };
 
+const isValidUrl = (url: string) => {
+  const pattern = /^(https?:\/\/|ftp:\/\/)([a-zA-Z0-9.-]+)(:[0-9]+)?(\/[^\s]*)?$/;
+  return pattern.test(url);
+};
+
+const validateCompetitorWebsite = (site: string) => {
+  if (!site.trim()) return true;
+  const list = site.split(',');
+  return list.every((item) => isValidUrl(item));
+};
+
 const acceptRecod = async () => {
-    btnLoading.value = true;
+  btnLoading.value = true;
 
   const { allowed, remaining } = await checkLimit();
   if (!allowed) {
@@ -125,13 +136,17 @@ const acceptRecod = async () => {
     return;
   }
   const formData = getFormData();
-  // const { competitorWebsite } = formData;
-  // if (!competitorWebsite) {
-  //   return showMessage({
-  //     type: 'error',
-  //     message: '请输入竞品网站'
-  //   });
-  // }
+  const { competitorWebsite } = formData;
+  const result = validateCompetitorWebsite(competitorWebsite);
+
+  if (!result) {
+    showMessage({
+      type: 'error',
+      message: '请输入正确的竞品网站'
+    });
+    btnLoading.value = false;
+    return;
+  }
   mainStore.setFormData(formData);
   mainStore.setClearCache(true);
 
@@ -151,7 +166,7 @@ const acceptRecod = async () => {
 
   &-logo {
     position: absolute;
-    width: 194px;
+    width: 320px;
     height: 88px;
     left: 260px;
     top: 32px;

xinkeaboard-promotion-portal/src/store/index.ts

@@ -29,7 +29,7 @@ export const useMainStore = defineStore('main', {
   }),
   actions: {
     setClearCache(val: boolean) {
-      this.clearCache = val;  
+      this.clearCache = val;
     },
     setIsLoadOver(val: boolean) {
       this.isLoadOver = val;
@@ -64,6 +64,7 @@ export const useMainStore = defineStore('main', {
           this.suggestionsInfo.autoFinish = true;
           setTimeout(() => {
             this.suggestionsInfo.loading = false;
+            this.suggestionsInfo.autoFinish = false;
           }, 300);
         })
         .catch(() => (this.suggestionsInfo.fail = true));
@@ -76,9 +77,9 @@ export const useMainStore = defineStore('main', {
         .then((res) => {
           this.keywordInfo.data = res.data;
         })
-        .finally(async() => {
+        .finally(async () => {
           this.keywordInfo.loading = false;
-          await incrementCount()
+          await incrementCount();
         });
     },
     initData() {

xinkeaboard-promotion-portal/src/views/Record.vue

@@ -4,10 +4,12 @@
     <div class="record-wrap" ref="pdfContent">
       <div class="record-wrap-content">
         <div class="record-wrap-content__overview" v-loading="loading">
-          <span>概述关于你的产品的描述，通常的英语表述为</span>
-          <span class="active">{{ keywordEn }},</span>
-          <span>在互联网上搜索的关键词为</span>
-          <span class="active">{{ keywords }}</span>
+          <span class="overview-text">
+            <span>概述关于你的产品的描述，通常的英语表述为</span>
+            <span class="active">{{ keywordEn }},</span>
+            <span>在互联网上搜索的关键词为</span>
+            <span class="active">{{ keywords }}</span>
+          </span>
         </div>
         <div class="overview-left">概述</div>
         <div class="overview-right">
@@ -124,6 +126,10 @@ onMounted(() => {
         font-size: 20px;
         color: #282e30;
 
+        .overview-text {
+          word-break: break-all;
+        }
+
         .active {
           color: var(--promotion--color-primary);
         }
@@ -172,8 +178,8 @@ onMounted(() => {
         margin-top: 40px;
 
         img {
-          width: 584px;
-          height: 166px;
+          width: 450px;
+          height: 125px;
         }
 
         .content {
@@ -210,8 +216,8 @@ onMounted(() => {
         margin-top: 65px;
 
         img {
-          width: 624px;
-          height: 166px;
+          width: 450px;
+          height: 125px;
         }
 
         .list {
@@ -228,8 +234,8 @@ onMounted(() => {
         margin-top: 60px;
 
         img {
-          width: 624px;
-          height: 166px;
+          width: 468px;
+          height: 125px;
         }
       }