feat: select组件替换

src/views/material-center/components/finished-products/manuscript/check-list/components/filter-block/index.vue

@@ -54,18 +54,18 @@
       <template v-if="[AuditStatus.Auditing, AuditStatus.Passed].includes(query.audit_status)">
         <div class="filter-row-item">
           <span class="label">审核平台</span>
-          <a-select
-            v-model="query.audit_platform"
-            size="medium"
+          <Select
+            v-model:value="query.audit_platform"
+            size="middle"
             placeholder="全部"
-            allow-clear
+            allowClear
             @change="handleSearch"
             class="!w-160px"
           >
-            <a-option v-for="(item, index) in PLATFORMS" :key="index" :value="item.value" :label="item.label">{{
+            <Option v-for="(item, index) in PLATFORMS" :key="index" :value="item.value" :label="item.label">{{
               item.label
-            }}</a-option>
-          </a-select>
+            }}</Option>
+          </Select>
         </div>
         <div class="filter-row-item">
           <span class="label">审核时间</span>
@@ -99,7 +99,8 @@
 </template>
 
 <script setup>
-import { Button, Input } from 'ant-design-vue';
+import { Button, Input, Select } from 'ant-design-vue';
+const { Option } = Select;
 import { defineEmits, defineProps } from 'vue';
 import { PLATFORMS } from '@/views/material-center/components/finished-products/manuscript/check-list/constants';
 import { AuditStatus } from '@/views/material-center/components/finished-products/constants';

src/views/material-center/components/finished-products/manuscript/check/components/content-card/highlight-textarea.vue

@@ -1,15 +1,15 @@
 <template>
   <div class="highlight-textarea-container">
-    <a-textarea
+    <TextArea
       ref="textareaWrapRef"
-      v-model="inputValue"
+      v-model:value="inputValue"
       placeholder="请输入作品描述"
       :disabled="disabled"
-      show-word-limit
-      :max-length="1000"
+      showCount
+      :maxlength="1000"
       size="large"
       class="textarea-input h-full w-full"
-      @input="handleInput"
+      @change="handleInput"
       @focus="() => (focus = true)"
       @blur="() => (focus = false)"
     />
@@ -24,6 +24,9 @@
 </template>
 
 <script setup lang="ts">
+import { Input } from 'ant-design-vue';
+import type { ElementEvent } from 'echarts';
+const { TextArea } = Input;
 import { ref, computed, watch, defineProps, defineEmits, onMounted, onUnmounted } from 'vue';
 import { escapeRegExp } from './constants';
 
@@ -67,7 +70,8 @@ watch(
 );
 
 // 处理输入事件
-const handleInput = (value: string) => {
+const handleInput = (e: any) => {
+  const value = e.currentTarget.value;
   emit('update:modelValue', value);
 };
 
@@ -113,9 +117,9 @@ const generateHighlightedHtml = (): string => {
 
 onMounted(() => {
   nativeTextarea =
-    (textareaWrapRef.value?.$el || textareaWrapRef.value)?.querySelector?.('textarea.arco-textarea') ||
-    document.querySelector('.textarea-input .arco-textarea');
-
+    (textareaWrapRef.value?.$el || textareaWrapRef.value)?.querySelector?.('textarea.ant-input') ||
+    document.querySelector('.textarea-input .ant-input');
+    
   if (nativeTextarea) {
     nativeTextarea.addEventListener('scroll', handleTextareaScroll);
     nativeTextarea.addEventListener('compositionstart', handleCompositionUpdate);
@@ -143,7 +147,9 @@ const handleTextareaScroll = (e: Event) => {
 };
 
 const handleCompositionUpdate = () => {
+  console.log('handleCompositionUpdate');
   if (!nativeTextarea) return;
+
   // 使用 rAF 等待浏览器把最新字符写入 textarea.value 再读取
   requestAnimationFrame(() => {
     if (!nativeTextarea) return;
@@ -197,36 +203,35 @@ const handleCompositionUpdate = () => {
     }
   }
 
-  :deep(.arco-textarea-wrapper) {
+  :deep(.ant-input-textarea) {
     @include textarea-style;
-
-    .arco-textarea {
+    .ant-input {
       padding: 0;
       overflow: hidden;
       position: absolute;
       z-index: 1;
       width: 100%;
+      height: 100%;
       background: transparent;
       color: transparent;
       caret-color: #211f24 !important;
       resize: none;
       @include textarea-padding;
       overflow-y: auto;
-    }
-
-    .arco-textarea-word-limit {
-      z-index: 2;
-    }
-
-    &.arco-textarea-disabled {
-      .arco-textarea {
-        background: #f2f3f5;
-      }
+      border: none;
     }
   }
 
+  :deep(.ant-input-data-count) {
+    z-index: 2;
+  }
+
+  &:deep(.ant-input:disabled) {
+    background: #f2f3f5;
+  }
+
   // 处于中文输入法合成态时，显示真实文本并隐藏高亮层
-  :deep(.textarea-input.composing .arco-textarea) {
+  :deep(.textarea-input.composing .ant-input) {
     color: #211f24 !important;
     -webkit-text-fill-color: #211f24 !important;
   }