review:【antd/ele】代码迁移的 review
This commit is contained in:
@@ -12,11 +12,16 @@ import {
|
|||||||
|
|
||||||
import MsgEvent from './msg-event.vue';
|
import MsgEvent from './msg-event.vue';
|
||||||
|
|
||||||
defineOptions({ name: 'Msg' });
|
defineOptions({ name: 'WxMsg' });
|
||||||
|
|
||||||
|
withDefaults(
|
||||||
defineProps<{
|
defineProps<{
|
||||||
item: any;
|
item?: any;
|
||||||
}>();
|
}>(),
|
||||||
|
{
|
||||||
|
item: {},
|
||||||
|
},
|
||||||
|
);
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
|
|||||||
@@ -7,6 +7,7 @@ import { Typography } from 'ant-design-vue';
|
|||||||
|
|
||||||
/** 微信消息 - 音乐 */
|
/** 微信消息 - 音乐 */
|
||||||
defineOptions({ name: 'WxMusic' });
|
defineOptions({ name: 'WxMusic' });
|
||||||
|
|
||||||
const props = withDefaults(defineProps<WxMusicProps>(), {
|
const props = withDefaults(defineProps<WxMusicProps>(), {
|
||||||
title: '',
|
title: '',
|
||||||
description: '',
|
description: '',
|
||||||
@@ -15,8 +16,6 @@ const props = withDefaults(defineProps<WxMusicProps>(), {
|
|||||||
thumbMediaUrl: '',
|
thumbMediaUrl: '',
|
||||||
});
|
});
|
||||||
|
|
||||||
const { Link } = Typography;
|
|
||||||
|
|
||||||
const href = computed(() => props.hqMusicUrl || props.musicUrl);
|
const href = computed(() => props.hqMusicUrl || props.musicUrl);
|
||||||
|
|
||||||
defineExpose({
|
defineExpose({
|
||||||
@@ -26,7 +25,11 @@ defineExpose({
|
|||||||
|
|
||||||
<template>
|
<template>
|
||||||
<div>
|
<div>
|
||||||
<Link :href="href" target="_blank" class="text-success no-underline">
|
<Typography.Link
|
||||||
|
:href="href"
|
||||||
|
target="_blank"
|
||||||
|
class="text-success no-underline"
|
||||||
|
>
|
||||||
<div
|
<div
|
||||||
class="flex items-center rounded-[5px] border border-[#e8e8e8] bg-white p-2.5 transition hover:border-black/10 hover:shadow-sm"
|
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>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</Link>
|
</Typography.Link>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|||||||
@@ -1,15 +1,17 @@
|
|||||||
<script lang="ts" setup>
|
<script lang="ts" setup>
|
||||||
import { MpMsgType } from '@vben/constants';
|
import { MpMsgType } from '@vben/constants';
|
||||||
|
|
||||||
import Location from '#/views/mp/components/wx-location/wx-location.vue';
|
import {
|
||||||
import Music from '#/views/mp/components/wx-music/wx-music.vue';
|
WxLocation,
|
||||||
import News from '#/views/mp/components/wx-news/wx-news.vue';
|
WxMusic,
|
||||||
import VideoPlayer from '#/views/mp/components/wx-video-play/wx-video-play.vue';
|
WxNews,
|
||||||
import VoicePlayer from '#/views/mp/components/wx-voice-play/wx-voice-play.vue';
|
WxVideoPlayer,
|
||||||
|
WxVoicePlayer,
|
||||||
|
} from '#/views/mp/components';
|
||||||
|
|
||||||
import MsgEvent from './msg-event.vue';
|
import MsgEvent from './msg-event.vue';
|
||||||
|
|
||||||
defineOptions({ name: 'Msg' });
|
defineOptions({ name: 'WxMsg' });
|
||||||
|
|
||||||
withDefaults(
|
withDefaults(
|
||||||
defineProps<{
|
defineProps<{
|
||||||
@@ -28,7 +30,7 @@ withDefaults(
|
|||||||
<div v-else-if="item.type === MpMsgType.Text">{{ item.content }}</div>
|
<div v-else-if="item.type === MpMsgType.Text">{{ item.content }}</div>
|
||||||
|
|
||||||
<div v-else-if="item.type === MpMsgType.Voice">
|
<div v-else-if="item.type === MpMsgType.Voice">
|
||||||
<VoicePlayer :url="item.mediaUrl" :content="item.recognition" />
|
<WxVideoPlayer :url="item.mediaUrl" :content="item.recognition" />
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div v-else-if="item.type === MpMsgType.Image">
|
<div v-else-if="item.type === MpMsgType.Image">
|
||||||
@@ -41,7 +43,7 @@ withDefaults(
|
|||||||
v-else-if="item.type === MpMsgType.Video || item.type === 'shortvideo'"
|
v-else-if="item.type === MpMsgType.Video || item.type === 'shortvideo'"
|
||||||
class="text-center"
|
class="text-center"
|
||||||
>
|
>
|
||||||
<VideoPlayer :url="item.mediaUrl" />
|
<WxVoicePlayer :url="item.mediaUrl" />
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div v-else-if="item.type === MpMsgType.Link" class="flex-1">
|
<div v-else-if="item.type === MpMsgType.Link" class="flex-1">
|
||||||
@@ -66,7 +68,7 @@ withDefaults(
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div v-else-if="item.type === MpMsgType.Location">
|
<div v-else-if="item.type === MpMsgType.Location">
|
||||||
<Location
|
<WxLocation
|
||||||
:label="item.label"
|
:label="item.label"
|
||||||
:location-y="item.locationY"
|
:location-y="item.locationY"
|
||||||
:location-x="item.locationX"
|
:location-x="item.locationX"
|
||||||
@@ -74,11 +76,11 @@ withDefaults(
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div v-else-if="item.type === MpMsgType.News" class="w-[300px]">
|
<div v-else-if="item.type === MpMsgType.News" class="w-[300px]">
|
||||||
<News :articles="item.articles" />
|
<WxNews :articles="item.articles" />
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div v-else-if="item.type === MpMsgType.Music">
|
<div v-else-if="item.type === MpMsgType.Music">
|
||||||
<Music
|
<WxMusic
|
||||||
:title="item.title"
|
:title="item.title"
|
||||||
:description="item.description"
|
:description="item.description"
|
||||||
:thumb-media-url="item.thumbMediaUrl"
|
:thumb-media-url="item.thumbMediaUrl"
|
||||||
|
|||||||
@@ -4,6 +4,7 @@ import type { WxMusicProps } from './types';
|
|||||||
import { computed } from 'vue';
|
import { computed } from 'vue';
|
||||||
|
|
||||||
import { ElLink } from 'element-plus';
|
import { ElLink } from 'element-plus';
|
||||||
|
|
||||||
/** 微信消息 - 音乐 */
|
/** 微信消息 - 音乐 */
|
||||||
defineOptions({ name: 'WxMusic' });
|
defineOptions({ name: 'WxMusic' });
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user