review:【antd/ele】【mp】代码迁移的 review

This commit is contained in:
YunaiV
2025-11-29 11:54:15 +08:00
parent 3409a8a88f
commit 6fb3480676
12 changed files with 31 additions and 26 deletions

View File

@@ -10,6 +10,7 @@ import { ACTION_ICON, TableAction, useVbenVxeGrid } from '#/adapter/vxe-table';
import { WxVideoPlayer } from '#/views/mp/components';
import { useVideoGridColumns } from './data';
import {$t} from '@vben/locales';
const props = defineProps<{
list: MpMaterialApi.Material[];
@@ -81,7 +82,7 @@ watch(
onClick: () => openWindow(row.url),
},
{
label: '删除',
label: $t('common.delete'),
type: 'link',
danger: true,
icon: ACTION_ICON.DELETE,

View File

@@ -4,6 +4,7 @@ import type { MpMaterialApi } from '#/api/mp/material';
import { watch } from 'vue';
import { $t } from '@vben/locales';
import { openWindow } from '@vben/utils';
import { ACTION_ICON, TableAction, useVbenVxeGrid } from '#/adapter/vxe-table';
@@ -81,7 +82,7 @@ watch(
onClick: () => openWindow(row.url),
},
{
label: '删除',
label: $t('common.delete'),
type: 'link',
danger: true,
icon: ACTION_ICON.DELETE,

View File

@@ -102,6 +102,7 @@ function handlePageChange(page: number, pageSize: number) {
function showTotal(total: number) {
return `${total}`;
}
// TODO @dylan是不是应该都用 Grid 哈1message-table 大部分合并到 index.vue2message-table 的 schema 放到 data.ts 里;
</script>
<template>

View File

@@ -74,4 +74,3 @@ export const useBeforeUpload = (type: UploadType, maxSizeMB?: number) => {
return fn;
};

View File

@@ -39,6 +39,7 @@ const total = ref(0); // 总条数
const accountId = ref(-1);
provide('accountId', accountId);
// TODO @AI这里是不是应该都用 grid类似 yudao-ui-admin-vben-v5/apps/web-ele/src/views/mp/autoReply/index.vue
const queryParams = reactive({
accountId,
pageNo: 1,

View File

@@ -1,5 +1,5 @@
<script lang="ts" setup>
import type { UploadProps, UploadRawFile } from 'element-plus';
import type { UploadProps } from 'element-plus';
import type { UploadData } from './upload';
@@ -19,6 +19,7 @@ import {
const props = defineProps<{ type: UploadType }>();
// TODO @dylan是不是要和 antd 的 props 定义相同哈?这样后续两侧维护方便点
const emit = defineEmits<{
uploaded: [v: void];
}>();
@@ -59,6 +60,7 @@ const customRequest: UploadProps['httpRequest'] = async function (options) {
if (res.code !== 0) {
ElMessage.error(`上传出错:${res.msg}`);
// TODO @dylan这里有个 linter 错误。
onError?.(new Error(res.msg));
return;
}
@@ -104,4 +106,3 @@ const customRequest: UploadProps['httpRequest'] = async function (options) {
<slot></slot>
</div>
</template>

View File

@@ -20,6 +20,7 @@ import {
import { beforeVideoUpload, HEADERS, UPLOAD_URL, UploadType } from './upload';
// TODO @dylan是不是要和 antd 的 props 定义相同哈?这样后续两侧维护方便点
withDefaults(
defineProps<{
modelValue?: boolean;
@@ -163,4 +164,3 @@ const customRequest: UploadProps['httpRequest'] = async function (options) {
</ElForm>
</ElDialog>
</template>

View File

@@ -3,6 +3,8 @@ import type { MpMaterialApi } from '#/api/mp/material';
import { nextTick, onMounted, watch } from 'vue';
import { $t } from '@vben/locales';
import { ACTION_ICON, TableAction, useVbenVxeGrid } from '#/adapter/vxe-table';
import { useImageGridColumns } from './data';
@@ -74,7 +76,7 @@ onMounted(async () => {
<template>
<Grid class="image-table-grid mt-4 pb-0">
<template #toolbar-tools>
<slot name="toolbar-tools" />
<slot name="toolbar-tools"></slot>
</template>
<template #image="{ row }">
<div class="flex items-center justify-center" style="height: 192px">
@@ -89,9 +91,9 @@ onMounted(async () => {
<TableAction
:actions="[
{
label: '删除',
type: 'link',
danger: true,
label: $t('common.delete'),
type: 'primary',
link: true,
icon: ACTION_ICON.DELETE,
auth: ['mp:material:delete'],
popConfirm: {
@@ -104,4 +106,3 @@ onMounted(async () => {
</template>
</Grid>
</template>

View File

@@ -44,4 +44,3 @@ export {
type UploadData,
UploadType,
};

View File

@@ -66,7 +66,7 @@ watch(
<template>
<Grid class="mt-4">
<template #toolbar-tools>
<slot name="toolbar-tools" />
<slot name="toolbar-tools"></slot>
</template>
<template #video="{ row }">
<WxVideoPlayer v-if="row.url" :url="row.url" />
@@ -76,14 +76,15 @@ watch(
:actions="[
{
label: '下载',
type: 'link',
type: 'primary',
link: true,
icon: ACTION_ICON.DOWNLOAD,
onClick: () => openWindow(row.url),
},
{
label: '删除',
type: 'link',
danger: true,
label: $t('common.delete'),
type: 'danger',
link: true,
icon: ACTION_ICON.DELETE,
auth: ['mp:material:delete'],
popConfirm: {
@@ -96,4 +97,3 @@ watch(
</template>
</Grid>
</template>

View File

@@ -4,6 +4,7 @@ import type { MpMaterialApi } from '#/api/mp/material';
import { watch } from 'vue';
import { $t } from '@vben/locales';
import { openWindow } from '@vben/utils';
import { ACTION_ICON, TableAction, useVbenVxeGrid } from '#/adapter/vxe-table';
@@ -76,14 +77,15 @@ watch(
:actions="[
{
label: '下载',
type: 'link',
type: 'primary',
link: true,
icon: ACTION_ICON.DOWNLOAD,
onClick: () => openWindow(row.url),
},
{
label: '删除',
type: 'link',
danger: true,
label: $t('common.delete'),
type: 'danger',
link: true,
icon: ACTION_ICON.DELETE,
auth: ['mp:material:delete'],
popConfirm: {
@@ -96,4 +98,3 @@ watch(
</template>
</Grid>
</template>

View File

@@ -109,12 +109,13 @@ function handleSizeChange(pageSize: number) {
function showTotal(total: number) {
return `${total}`;
}
// TODO @dylan是不是应该都用 Grid 哈?
</script>
<template>
<Page auto-content-height class="flex flex-col">
<!-- 搜索工作栏 -->
<div class="bg-background mb-4 rounded-lg p-4">
<div class="mb-4 rounded-lg bg-background p-4">
<ElForm
ref="queryFormRef"
:model="queryParams"
@@ -174,7 +175,7 @@ function showTotal(total: number) {
</div>
<!-- 列表 -->
<div class="bg-background flex-1 rounded-lg p-4">
<div class="flex-1 rounded-lg bg-background p-4">
<MessageTable :list="list" :loading="loading" @send="handleSend" />
<div v-show="total > 0" class="mt-4 flex justify-end">
<ElPagination
@@ -208,4 +209,3 @@ function showTotal(total: number) {
margin-bottom: 16px;
}
</style>