review：【antd/ele】代码迁移的 review

apps/web-antd/src/views/mp/components/wx-msg/msg.vue

@@ -12,11 +12,16 @@ import {
 
 import MsgEvent from './msg-event.vue';
 
-defineOptions({ name: 'Msg' });
+defineOptions({ name: 'WxMsg' });
 
-defineProps<{
-  item: any;
-}>();
+withDefaults(
+  defineProps<{
+    item?: any;
+  }>(),
+  {
+    item: {},
+  },
+);
 </script>
 
 <template>

apps/web-antd/src/views/mp/components/wx-music/wx-music.vue

@@ -7,6 +7,7 @@ import { Typography } from 'ant-design-vue';
 
 /** 微信消息 - 音乐 */
 defineOptions({ name: 'WxMusic' });
+
 const props = withDefaults(defineProps<WxMusicProps>(), {
   title: '',
   description: '',
@@ -15,8 +16,6 @@ const props = withDefaults(defineProps<WxMusicProps>(), {
   thumbMediaUrl: '',
 });
 
-const { Link } = Typography;
-
 const href = computed(() => props.hqMusicUrl || props.musicUrl);
 
 defineExpose({
@@ -26,7 +25,11 @@ defineExpose({
 
 <template>
   <div>
-    <Link :href="href" target="_blank" class="text-success no-underline">
+    <Typography.Link
+      :href="href"
+      target="_blank"
+      class="text-success no-underline"
+    >
       <div
         class="flex items-center rounded-[5px] border border-[#e8e8e8] bg-white p-2.5 transition hover:border-black/10 hover:shadow-sm"
       >
@@ -48,6 +51,6 @@ defineExpose({
           </div>
         </div>
       </div>
-    </Link>
+    </Typography.Link>
   </div>
 </template>

apps/web-ele/src/views/mp/components/wx-msg/msg.vue

@@ -1,15 +1,17 @@
 <script lang="ts" setup>
 import { MpMsgType } from '@vben/constants';
 
-import Location from '#/views/mp/components/wx-location/wx-location.vue';
-import Music from '#/views/mp/components/wx-music/wx-music.vue';
-import News from '#/views/mp/components/wx-news/wx-news.vue';
-import VideoPlayer from '#/views/mp/components/wx-video-play/wx-video-play.vue';
-import VoicePlayer from '#/views/mp/components/wx-voice-play/wx-voice-play.vue';
+import {
+  WxLocation,
+  WxMusic,
+  WxNews,
+  WxVideoPlayer,
+  WxVoicePlayer,
+} from '#/views/mp/components';
 
 import MsgEvent from './msg-event.vue';
 
-defineOptions({ name: 'Msg' });
+defineOptions({ name: 'WxMsg' });
 
 withDefaults(
   defineProps<{
@@ -28,7 +30,7 @@ withDefaults(
     <div v-else-if="item.type === MpMsgType.Text">{{ item.content }}</div>
 
     <div v-else-if="item.type === MpMsgType.Voice">
-      <VoicePlayer :url="item.mediaUrl" :content="item.recognition" />
+      <WxVideoPlayer :url="item.mediaUrl" :content="item.recognition" />
     </div>
 
     <div v-else-if="item.type === MpMsgType.Image">
@@ -41,7 +43,7 @@ withDefaults(
       v-else-if="item.type === MpMsgType.Video || item.type === 'shortvideo'"
       class="text-center"
     >
-      <VideoPlayer :url="item.mediaUrl" />
+      <WxVoicePlayer :url="item.mediaUrl" />
     </div>
 
     <div v-else-if="item.type === MpMsgType.Link" class="flex-1">
@@ -66,7 +68,7 @@ withDefaults(
     </div>
 
     <div v-else-if="item.type === MpMsgType.Location">
-      <Location
+      <WxLocation
         :label="item.label"
         :location-y="item.locationY"
         :location-x="item.locationX"
@@ -74,11 +76,11 @@ withDefaults(
     </div>
 
     <div v-else-if="item.type === MpMsgType.News" class="w-[300px]">
-      <News :articles="item.articles" />
+      <WxNews :articles="item.articles" />
     </div>
 
     <div v-else-if="item.type === MpMsgType.Music">
-      <Music
+      <WxMusic
         :title="item.title"
         :description="item.description"
         :thumb-media-url="item.thumbMediaUrl"

apps/web-ele/src/views/mp/components/wx-music/wx-music.vue

@@ -4,6 +4,7 @@ import type { WxMusicProps } from './types';
 import { computed } from 'vue';
 
 import { ElLink } from 'element-plus';
+
 /** 微信消息 - 音乐 */
 defineOptions({ name: 'WxMusic' });