feat: tag，Notification替换

src/views/components/dataEngine/hotCloud.vue

@@ -20,7 +20,7 @@
             class="tag-row"
             :style="{ justifyContent: row.align || 'center' }"
           >
-            <a-tag
+            <Tag
               v-for="(tag, tagIndex) in row.tags"
               :key="tagIndex"
               class="cursor-pointer"
@@ -42,7 +42,7 @@
                 <Tooltip :title="`性价比:${Number(tag.rate * 100)}%`" placement="topLeft">
                   <span>{{ tag.term }}</span>
                 </Tooltip>
-            </a-tag>
+            </Tag>
           </div>
         </template>
       </div>
@@ -54,7 +54,7 @@
 import topHeader from './topHeader.vue';
 import { ref, computed } from 'vue';
 import { fetchindustryTerms } from '@/api/all/index';
-import { Tooltip } from 'ant-design-vue';
+import { Tooltip, Tag } from 'ant-design-vue';
 
 const topHeaderRef = ref();
 // 从topHeader获取统一的状态
@@ -198,7 +198,7 @@ const processTagData = (apiData) => {
 }
 
 /* 悬停放大效果 */
-a-tag:hover {
+.ant-tag:hover {
   transform: scale(1.1);
   z-index: 1;
 }

src/views/components/dataEngine/hotTranslation.vue

@@ -32,11 +32,11 @@
             <span v-else>{{ record.rank }}</span>
           </template>
           <template v-else-if="column.slotName === 'keywords'" #customRender="{ record }">
-            <a-tag
+            <Tag
               v-for="item in record.keywords"
               :key="item"
               class="!rounded-2px !px-8px !py-1px !bg-#F2F3F5 !h-22px !color-#3C4043 mb-5px mr-5px"
-              >{{ item }}</a-tag
+              >{{ item }}</Tag
             >
           </template>
           <template v-else-if="column.slotName === 'hot'" #customRender="{ record }">
@@ -105,11 +105,11 @@
           </div>
           <div class="mb-4px flex items-center">
             <p class="cts !mr-16px flex-shrink-0 w-48px">关键词</p>
-            <a-tag
+            <Tag
               v-for="item in topicInfo.keywords"
               :key="item"
               class="mr-8px py-10px px-8px rounded-4px bg-#F2F3F5 cts !h-24px"
-              >{{ item }}</a-tag
+              >{{ item }}</Tag
             >
           </div>
           <div class="mb-4px flex items-center">
@@ -153,7 +153,7 @@
 
 <script setup>
 import topHeader from './topHeader.vue';
-import { Modal, Button, Tooltip, Space, Table } from 'ant-design-vue';
+import { Modal, Button, Tooltip, Space, Table, Tag } from 'ant-design-vue';
 import { ref, computed } from 'vue';
 import { fetchIndustriesTree, fetchIndustryTopics, fetchIndustryTopicDetail } from '@/api/all/index';
 import star1 from '@/assets/img/hottranslation/star-fill1.png';

src/views/components/dataEngine/keyWord.vue

@@ -52,7 +52,7 @@
           <span v-else>{{ record.rank }}</span>
         </template>
         <template #keywords="{ record }">
-          <a-tag v-for="item in record.keywords" :key="item" style="margin-right: 5px">{{ item }}</a-tag>
+          <Tag v-for="item in record.keywords" :key="item" style="margin-right: 5px">{{ item }}</Tag>
         </template>
         <template #hot="{ record }">
           <img v-for="i in record.hot" :key="i" :src="starImages[i - 1]" style="width: 16px; height: 16px" />
@@ -269,7 +269,7 @@
 
 <script setup>
 import topHeader from './topHeader.vue';
-import { Checkbox, Modal, Button, Tooltip, Space, Table } from 'ant-design-vue';
+import { Checkbox, Modal, Button, Tooltip, Space, Table, Tag } from 'ant-design-vue';
 import {
   fetchKeywordTrendsList,
   fetchIndustryEmotions,

src/views/components/dataEngine/topHeader.vue

@@ -9,20 +9,21 @@
       <Space align="start" style="width: 100%; align-items: flex-start" class="mb-12px">
         <span style="flex-shrink: 0; line-height: 28px" class="mr-32px">行业大类</span>
         <div style="display: flex; flex-wrap: wrap; gap: 16px; width: 100%; align-items: flex-start">
-          <a-tag
+          <Tag
             v-for="item in industriesTree"
             :key="item.id"
             size="Medium"
             :checkable="true"
             :checked="selectedIndustry == item.id"
-            style="padding: 10px 16px; border-radius: 30px; height: 28px"
+            style="padding: 0 16px; border-radius: 30px; height: 28px"
+            class="lh-28px cursor-pointer"
             :style="
               selectedIndustry == item.id
                 ? 'color: #6D4CFE; background-color: #F0EDFF'
                 : 'color: #3C4043; background-color: #F7F8FA'
             "
-            @check="handleIndustryCheck(item.id)"
-            >{{ item.name }}</a-tag
+            @click="handleIndustryCheck(item.id)"
+            >{{ item.name }}</Tag
           >
         </div>
       </Space>
@@ -30,20 +31,21 @@
       <Space align="start" style="width: 100%; align-items: flex-start" class="mb-12px">
         <span style="flex-shrink: 0; line-height: 28px" class="mr-32px">二级类目</span>
         <div style="display: flex; flex-wrap: wrap; gap: 16px; width: 100%; align-items: flex-start">
-          <a-tag
+          <Tag
             v-for="item in subCategories"
             :key="item.id"
-            size="Medium"
+            size="small"
             :checkable="true"
             :checked="selectedSubCategory == item.id"
-            style="padding: 10px 16px; border-radius: 30px; height: 28px"
+            style="padding: 0 16px; border-radius: 30px; height: 28px"
+            class="lh-28px cursor-pointer"
             :style="
               selectedSubCategory == item.id
                 ? 'color: #6d4cfe; background-color: #f0edff'
                 : 'color: #3C4043; background-color: #F7F8FA'
             "
-            @check="handleSubCategoryCheck(item.id)"
-            >{{ item.name }}</a-tag
+            @click="handleSubCategoryCheck(item.id)"
+            >{{ item.name }}</Tag
           >
         </div>
       </Space>
@@ -51,21 +53,22 @@
       <Space align="start" style="width: 100%; align-items: flex-start" class="mb-12px">
         <span style="flex-shrink: 0; line-height: 28px" class="mr-32px">时间筛选</span>
         <div style="display: flex; flex-wrap: wrap; gap: 16px; width: 100%; align-items: flex-start">
-          <a-tag
+          <Tag
             v-for="item in timePeriods"
             :key="item.value"
             size="Medium"
             :checkable="true"
             :checked="selectedTimePeriod == item.value"
-            style="padding: 10px 16px; border-radius: 30px; height: 28px"
+            class="lh-28px cursor-pointer"
+            style="padding: 0 16px; border-radius: 30px; height: 28px"
             :style="
               selectedTimePeriod == item.value
                 ? 'color: #6d4cfe; background-color: #f0edff'
                 : 'color: #3C4043; background-color: #F7F8FA'
             "
-            @check="handleTimePeriodCheck(item.value)"
+            @click="handleTimePeriodCheck(item.value)"
             >{{ item.label }}
-          </a-tag>
+          </Tag>
         </div>
       </Space>
       <!-- 搜索区域 -->
@@ -91,7 +94,7 @@
 <script setup lang="ts">
 import { ref, computed } from 'vue';
 import { fetchIndustriesTree } from '@/api/all/index';
-import { Button, Space } from 'ant-design-vue';
+import { Button, Space, Tag } from 'ant-design-vue';
 const emit = defineEmits<(e: 'search') => void>();
 // 行业大类
 const industriesTree = ref([]);
@@ -139,6 +142,7 @@ const handleIndustryCheck = (id) => {
 };
 
 const handleSubCategoryCheck = (id) => {
+  console.log('handleSubCategoryCheck');
   selectedSubCategory.value = id;
 };
 

src/views/components/dataEngine/userPainPoints.vue

@@ -39,19 +39,19 @@
             <span v-else>{{ record.rank }}</span>
           </template>
           <template v-else-if="column.slotName === 'keywords'" #customRender="{ record }">
-            <a-tag
+            <Tag
               v-for="item in record.keywords"
               :key="item"
               class="!rounded-2px !px-8px !py-1px !bg-#F2F3F5 !h-22px !color-#3C4043 mb-5px mr-5px"
-              >{{ item }}</a-tag
+              >{{ item }}</Tag
             >
           </template>
           <template v-else-if="column.slotName === 'frequency'" #customRender="{ record }">
-            <a-tag
+            <Tag
               :class="`!rounded-2px !px-8px !py-1px !bg-${frequencyStatus[record.frequency].bgColor} !h-22px !color-${
                 frequencyStatus[record.frequency].color
               }`"
-              >{{ frequencyStatus[record.frequency].label }}</a-tag
+              >{{ frequencyStatus[record.frequency].label }}</Tag
             >
           </template>
           <template v-else-if="column.slotName === 'optional'" #customRender="{ record }">
@@ -84,20 +84,20 @@
           </div>
           <div class="mb-12px flex items-center">
             <p class="cts !mr-16px flex-shrink-0 w-60px">关键词</p>
-            <a-tag
+            <Tag
               v-for="item in topicInfo.keywords"
               :key="item"
               class="mr-8px py-10px px-8px rounded-4px bg-#F2F3F5 cts !h-24px"
-              >{{ item }}</a-tag
+              >{{ item }}</Tag
             >
           </div>
           <div class="mb-12px flex items-center">
             <p class="cts !mr-16px flex-shrink-0 w-60px">频次</p>
-            <a-tag
+            <Tag
               :class="`!rounded-2px !px-8px !py-1px !bg-${
                 frequencyStatus[topicInfo.frequency].bgColor
               } !h-22px !color-${frequencyStatus[topicInfo.frequency].color}`"
-              >{{ frequencyStatus[topicInfo.frequency].label }}</a-tag
+              >{{ frequencyStatus[topicInfo.frequency].label }}</Tag
             >
           </div>
           <div class="mb-12px flex items-center">
@@ -127,7 +127,7 @@
 
 <script setup>
 import topHeader from './topHeader.vue';
-import { Modal, Button, Tooltip, Space, Table } from 'ant-design-vue';
+import { Modal, Button, Tooltip, Space, Table, Tag } from 'ant-design-vue';
 import { fetchUserPainPointsDetail, fetchUserPainPointsList } from '@/api/all/index';
 import { ref, onMounted, computed } from 'vue';
 import top1 from '@/assets/img/captcha/top1.svg';

src/views/components/management/account/index.vue

@@ -15,8 +15,8 @@
         <template #customRender="{ record }">
           <div class="flex item-center pt-13px pb-13px">
             <span class="mr-4px">{{ record.mobile }}</span>
-            <a-tag v-if="record.type === 0" class="primary-account">主账号</a-tag>
-            <a-tag v-else class="sub-account">子账号</a-tag>
+            <Tag v-if="record.type === 0" class="primary-account">主账号</Tag>
+            <Tag v-else class="sub-account">子账号</Tag>
           </div>
         </template>
       </Table.Column>
@@ -63,7 +63,7 @@
 </template>
 <script setup lang="ts">
 import { ref, onMounted, reactive, computed } from 'vue';
-import { Button, Table, message } from 'ant-design-vue';
+import { Button, Table, message, Tag } from 'ant-design-vue';
 
 import { fetchSubAccountPage, removeEnterpriseAccount, getEnterpriseInviteCode } from '@/api/all';
 import Modal from '@/components/modal.vue';

src/views/components/workplace/modules/product.vue

@@ -2,10 +2,10 @@
   <div class="container">
     <div class="flex arco-row-justify-space-between">
       <img class="avatar" :src="props.product.image" :alt="props.product.name" />
-      <a-tag v-if="props.product.status === Status.Enable" class="status status-enable">已开通</a-tag>
-      <a-tag v-if="props.product.status === Status.Disable" class="status status-disable">未开通</a-tag>
-      <a-tag v-if="props.product.status === Status.EXPIRED" class="status status-expired">已到期</a-tag>
-      <a-tag v-if="props.product.status === Status.TRIAL_ENDS" class="status status-expired">试用结束</a-tag>
+      <Tag v-if="props.product.status === Status.Enable" class="status status-enable">已开通</Tag>
+      <Tag v-if="props.product.status === Status.Disable" class="status status-disable">未开通</Tag>
+      <Tag v-if="props.product.status === Status.EXPIRED" class="status status-expired">已到期</Tag>
+      <Tag v-if="props.product.status === Status.TRIAL_ENDS" class="status status-expired">试用结束</Tag>
       <a-countdown
         v-if="props.product.status === Status.ON_TRIAL"
         class="status-on-trill"
@@ -73,7 +73,7 @@ import { now } from '@vueuse/core';
 import { trialProduct } from '@/api/all';
 import { useRouter } from 'vue-router';
 import CustomerServiceModal from '@/components/customer-service-modal.vue';
-import { Button, message } from 'ant-design-vue';
+import { Button, message, Tag } from 'ant-design-vue';
 
 import { useSidebarStore } from '@/stores/modules/side-bar';
 import { useEnterpriseStore } from '@/stores/modules/enterprise';