fix(@vben/web-antdv-next): 修复 antdv-next 废弃 API,迁移至新版本接口
将 ant-design-vue 旧版 API 统一迁移为 antdv-next 新版规范: - Modal: destroy-on-close → destroy-on-hidden - Card: :bordered="false" → variant="borderless",bodyStyle/headStyle → styles - Popover: overlay-style → styles.root - Divider: type → orientation - Space: direction → orientation - Alert: message → title - Spin: tip → description - Table: customRender → render - notification: message → title - Image preview: visible/onVisibleChange → open/onOpenChange - adapter: visibleEvent onVisibleChange → onOpenChangepull/344/head
parent
ccfc122eae
commit
6cbbe88902
|
|
@ -279,9 +279,9 @@ async function previewImage(
|
|||
{
|
||||
class: 'hidden',
|
||||
preview: {
|
||||
visible: visible.value,
|
||||
open: visible.value,
|
||||
current: currentIndex,
|
||||
onVisibleChange: (value: boolean) => {
|
||||
onOpenChange: (value: boolean) => {
|
||||
visible.value = value;
|
||||
if (!value) {
|
||||
setTimeout(() => {
|
||||
|
|
@ -366,7 +366,7 @@ function cropImage(file: File, aspectRatio: string | undefined) {
|
|||
closable: false,
|
||||
cancelText: $t('common.cancel'),
|
||||
okText: $t('ui.crop.confirm'),
|
||||
destroyOnClose: true,
|
||||
destroyOnHidden: true,
|
||||
onOk: async () => {
|
||||
const cropper = cropperRef.value;
|
||||
if (!cropper) {
|
||||
|
|
@ -676,13 +676,13 @@ async function initComponentAdapter() {
|
|||
fieldNames: { label: 'label', value: 'value', children: 'children' },
|
||||
loadingSlot: 'suffixIcon',
|
||||
modelPropName: 'value',
|
||||
visibleEvent: 'onVisibleChange',
|
||||
visibleEvent: 'onOpenChange',
|
||||
}),
|
||||
ApiSelect: withDefaultPlaceholder(ApiComponent, 'select', {
|
||||
component: Select,
|
||||
loadingSlot: 'suffixIcon',
|
||||
modelPropName: 'value',
|
||||
visibleEvent: 'onVisibleChange',
|
||||
visibleEvent: 'onOpenChange',
|
||||
}),
|
||||
ApiTreeSelect: withDefaultPlaceholder(ApiComponent, 'select', {
|
||||
component: TreeSelect,
|
||||
|
|
@ -690,7 +690,7 @@ async function initComponentAdapter() {
|
|||
loadingSlot: 'suffixIcon',
|
||||
modelPropName: 'value',
|
||||
optionsPropName: 'treeData',
|
||||
visibleEvent: 'onVisibleChange',
|
||||
visibleEvent: 'onOpenChange',
|
||||
}),
|
||||
AutoComplete,
|
||||
Cascader,
|
||||
|
|
|
|||
|
|
@ -438,7 +438,7 @@ function inputChange() {
|
|||
<Modal
|
||||
v-model:open="dialogVisible"
|
||||
:width="720"
|
||||
destroy-on-close
|
||||
destroy-on-hidden
|
||||
title="cron规则生成器"
|
||||
>
|
||||
<div class="sc-cron">
|
||||
|
|
|
|||
|
|
@ -172,13 +172,15 @@ export default defineComponent({
|
|||
|
||||
return (
|
||||
<Card
|
||||
bodyStyle={{ padding: '8px 0' }}
|
||||
headStyle={{
|
||||
padding: '8px 16px',
|
||||
fontSize: '14px',
|
||||
minHeight: '24px',
|
||||
}}
|
||||
style={{ margin: 0 }}
|
||||
styles={{
|
||||
body: { padding: '8px 0' },
|
||||
header: {
|
||||
padding: '8px 16px',
|
||||
fontSize: '14px',
|
||||
minHeight: '24px',
|
||||
},
|
||||
}}
|
||||
title={title}
|
||||
>
|
||||
{{
|
||||
|
|
|
|||
|
|
@ -95,7 +95,7 @@ export const useAuthStore = defineStore('auth', () => {
|
|||
notification.success({
|
||||
description: `${$t('authentication.loginSuccessDesc')}:${userInfo?.nickname}`,
|
||||
duration: 3,
|
||||
message: $t('authentication.loginSuccess'),
|
||||
title: $t('authentication.loginSuccess'),
|
||||
});
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -65,14 +65,16 @@ async function handleTabsScroll() {
|
|||
<div class="mb-3 mr-3 inline-block" v-for="role in roleList" :key="role.id">
|
||||
<Card
|
||||
class="relative rounded-lg"
|
||||
:body-style="{
|
||||
position: 'relative',
|
||||
display: 'flex',
|
||||
flexDirection: 'column',
|
||||
justifyContent: 'flex-start',
|
||||
width: '240px',
|
||||
maxWidth: '240px',
|
||||
padding: '15px',
|
||||
:styles="{
|
||||
body: {
|
||||
position: 'relative',
|
||||
display: 'flex',
|
||||
flexDirection: 'column',
|
||||
justifyContent: 'flex-start',
|
||||
width: '240px',
|
||||
maxWidth: '240px',
|
||||
padding: '15px',
|
||||
},
|
||||
}"
|
||||
>
|
||||
<!-- 头部:头像、名称 -->
|
||||
|
|
|
|||
|
|
@ -174,13 +174,15 @@ onUnmounted(async () => {
|
|||
</Drawer>
|
||||
<Card
|
||||
class="flex h-full w-full flex-col"
|
||||
:body-style="{
|
||||
margin: 0,
|
||||
padding: 0,
|
||||
height: '100%',
|
||||
position: 'relative',
|
||||
display: 'flex',
|
||||
flexDirection: 'column',
|
||||
:styles="{
|
||||
body: {
|
||||
margin: 0,
|
||||
padding: 0,
|
||||
height: '100%',
|
||||
position: 'relative',
|
||||
display: 'flex',
|
||||
flexDirection: 'column',
|
||||
},
|
||||
}"
|
||||
>
|
||||
<template #title>
|
||||
|
|
|
|||
|
|
@ -178,7 +178,7 @@ onMounted(async () => {
|
|||
</div>
|
||||
|
||||
<!-- 主体内容 -->
|
||||
<Card :body-style="{ padding: '10px' }" class="mb-4">
|
||||
<Card :styles="{ body: { padding: '10px' } }" class="mb-4">
|
||||
<div class="mt-12">
|
||||
<!-- 第一步:上传文档 -->
|
||||
<div v-if="currentStep === 0" class="mx-auto w-[560px]">
|
||||
|
|
|
|||
|
|
@ -338,7 +338,7 @@ watch(
|
|||
>
|
||||
编辑
|
||||
</Button>
|
||||
<Divider type="vertical" />
|
||||
<Divider orientation="vertical" />
|
||||
<Button
|
||||
size="small"
|
||||
type="link"
|
||||
|
|
@ -554,7 +554,7 @@ watch(
|
|||
>
|
||||
编辑
|
||||
</Button>
|
||||
<Divider type="vertical" />
|
||||
<Divider orientation="vertical" />
|
||||
<Button
|
||||
size="small"
|
||||
type="link"
|
||||
|
|
|
|||
|
|
@ -334,7 +334,7 @@ watch(
|
|||
>
|
||||
编辑
|
||||
</Button>
|
||||
<Divider type="vertical" />
|
||||
<Divider orientation="vertical" />
|
||||
<Button
|
||||
size="small"
|
||||
type="link"
|
||||
|
|
@ -539,7 +539,7 @@ watch(
|
|||
>
|
||||
编辑
|
||||
</Button>
|
||||
<Divider type="vertical" />
|
||||
<Divider orientation="vertical" />
|
||||
<Button
|
||||
size="small"
|
||||
type="link"
|
||||
|
|
|
|||
|
|
@ -201,7 +201,7 @@ watch(
|
|||
>
|
||||
编辑
|
||||
</Button>
|
||||
<Divider type="vertical" />
|
||||
<Divider orientation="vertical" />
|
||||
<Button
|
||||
size="small"
|
||||
type="link"
|
||||
|
|
|
|||
|
|
@ -277,7 +277,7 @@ watch(
|
|||
>
|
||||
编辑
|
||||
</Button>
|
||||
<Divider type="vertical" />
|
||||
<Divider orientation="vertical" />
|
||||
<Button
|
||||
size="small"
|
||||
type="link"
|
||||
|
|
@ -316,7 +316,7 @@ watch(
|
|||
>
|
||||
编辑
|
||||
</Button>
|
||||
<Divider type="vertical" />
|
||||
<Divider orientation="vertical" />
|
||||
<Button
|
||||
size="small"
|
||||
type="link"
|
||||
|
|
|
|||
|
|
@ -329,7 +329,7 @@ onMounted(async () => {
|
|||
>
|
||||
编辑
|
||||
</Button>
|
||||
<Divider type="vertical" />
|
||||
<Divider orientation="vertical" />
|
||||
<Button
|
||||
size="small"
|
||||
type="link"
|
||||
|
|
@ -366,7 +366,7 @@ onMounted(async () => {
|
|||
>
|
||||
编辑
|
||||
</Button>
|
||||
<Divider type="vertical" />
|
||||
<Divider orientation="vertical" />
|
||||
<Button
|
||||
size="small"
|
||||
type="link"
|
||||
|
|
|
|||
|
|
@ -172,7 +172,7 @@ defineExpose({ validate });
|
|||
/>
|
||||
</div>
|
||||
</div>
|
||||
<Space direction="vertical" size="small" class="w-11/12 pl-1">
|
||||
<Space orientation="vertical" size="small" class="w-11/12 pl-1">
|
||||
<template #split>
|
||||
{{ condition.conditionGroups.and ? '且' : '或' }}
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -225,7 +225,7 @@ defineExpose({ openDrawer }); // 暴露方法给父组件
|
|||
|
||||
<Form ref="formRef" :model="{ routerGroups }">
|
||||
<Card
|
||||
:body-style="{ padding: '10px' }"
|
||||
:styles="{ body: { padding: '10px' } }"
|
||||
class="mt-4"
|
||||
v-for="(item, index) in routerGroups"
|
||||
:key="index"
|
||||
|
|
|
|||
|
|
@ -330,7 +330,7 @@ function initApp() {
|
|||
<div class="mobile-form-preview-antd">
|
||||
<!-- 加载状态 -->
|
||||
<div v-if="loading" class="loading-container">
|
||||
<Spin size="large" tip="加载中..." />
|
||||
<Spin size="large" description="加载中..." />
|
||||
</div>
|
||||
|
||||
<!-- 错误状态 -->
|
||||
|
|
|
|||
|
|
@ -40,8 +40,8 @@ const [Modal, modalApi] = useVbenModal({
|
|||
<Modal
|
||||
class="w-2/5"
|
||||
title="流程表单详情"
|
||||
:body-style="{
|
||||
maxHeight: '100px',
|
||||
:styles="{
|
||||
body: { maxHeight: '100px' },
|
||||
}"
|
||||
>
|
||||
<FormCreate :option="formConfig.option" :rule="formConfig.rule" />
|
||||
|
|
|
|||
|
|
@ -468,7 +468,7 @@ onBeforeUnmount(() => {
|
|||
</div>
|
||||
</div>
|
||||
<!-- 主体内容 -->
|
||||
<Card :body-style="{ padding: '10px' }" class="mb-4">
|
||||
<Card :styles="{ body: { padding: '10px' } }" class="mb-4">
|
||||
<div class="mt-12">
|
||||
<!-- 第一步:基本信息 -->
|
||||
<div v-if="currentStep === 0" class="mx-auto w-4/6">
|
||||
|
|
|
|||
|
|
@ -144,7 +144,7 @@ async function handleCategorySortSubmit() {
|
|||
<!-- 流程分类表单弹窗 -->
|
||||
<CategoryFormModal @success="getList" />
|
||||
<Card
|
||||
:body-style="{ padding: '10px' }"
|
||||
:styles="{ body: { padding: '10px' } }"
|
||||
class="mb-4"
|
||||
title="流程模型"
|
||||
v-spinning="modelListSpinning"
|
||||
|
|
|
|||
|
|
@ -459,7 +459,7 @@ function handleRenameSuccess() {
|
|||
<template>
|
||||
<div>
|
||||
<Card
|
||||
:body-style="{ padding: 0 }"
|
||||
:styles="{ body: { padding: 0 } }"
|
||||
class="category-draggable-model mb-5 rounded-lg transition-all duration-300 ease-in-out hover:shadow-xl"
|
||||
>
|
||||
<div class="flex h-12 items-center">
|
||||
|
|
|
|||
|
|
@ -48,7 +48,7 @@ onMounted(() => {
|
|||
|
||||
<template>
|
||||
<ContentWrap class="m-2">
|
||||
<Spin :spinning="loading" tip="加载中...">
|
||||
<Spin :spinning="loading" description="加载中...">
|
||||
<Descriptions :data="formData" />
|
||||
</Spin>
|
||||
</ContentWrap>
|
||||
|
|
|
|||
|
|
@ -233,9 +233,8 @@ onMounted(() => {
|
|||
'animate-bounce-once !bg-[rgb(63_115_247_/_10%)]':
|
||||
searchName.trim().length > 0,
|
||||
}"
|
||||
:body-style="{
|
||||
width: '100%',
|
||||
padding: '16px',
|
||||
:styles="{
|
||||
body: { width: '100%', padding: '16px' },
|
||||
}"
|
||||
>
|
||||
<div class="flex items-center">
|
||||
|
|
@ -269,7 +268,7 @@ onMounted(() => {
|
|||
</Tabs>
|
||||
</div>
|
||||
<div v-else class="!py-48 text-center">
|
||||
<Space direction="vertical" size="large">
|
||||
<Space orientation="vertical" size="large">
|
||||
<span class="text-gray-500">没有找到搜索结果</span>
|
||||
</Space>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -265,10 +265,12 @@ defineExpose({ initProcessInfo });
|
|||
<Card
|
||||
:title="getTitle"
|
||||
class="h-full overflow-hidden"
|
||||
:body-style="{
|
||||
height: 'calc(100% - 112px)',
|
||||
paddingTop: '12px',
|
||||
overflowY: 'auto',
|
||||
:styles="{
|
||||
body: {
|
||||
height: 'calc(100% - 112px)',
|
||||
paddingTop: '12px',
|
||||
overflowY: 'auto',
|
||||
},
|
||||
}"
|
||||
>
|
||||
<template #extra>
|
||||
|
|
|
|||
|
|
@ -227,10 +227,8 @@ onMounted(async () => {
|
|||
<Page auto-content-height v-loading="loading">
|
||||
<Card
|
||||
class="flex h-full flex-col"
|
||||
:body-style="{
|
||||
flex: 1,
|
||||
overflowY: 'hidden',
|
||||
paddingTop: '12px',
|
||||
:styles="{
|
||||
body: { flex: 1, overflowY: 'hidden', paddingTop: '12px' },
|
||||
}"
|
||||
>
|
||||
<template #title>
|
||||
|
|
|
|||
|
|
@ -766,7 +766,7 @@ defineExpose({ loadTodoTask });
|
|||
<Popover
|
||||
v-model:open="popOverVisible.approve"
|
||||
placement="top"
|
||||
:overlay-style="{ minWidth: '400px', zIndex: 300 }"
|
||||
:styles="{ root: { minWidth: '400px', zIndex: 300 } }"
|
||||
trigger="click"
|
||||
@open-change="handlePopoverVisible"
|
||||
v-if="
|
||||
|
|
@ -870,7 +870,7 @@ defineExpose({ loadTodoTask });
|
|||
<Popover
|
||||
v-model:open="popOverVisible.reject"
|
||||
placement="top"
|
||||
:overlay-style="{ minWidth: '400px' }"
|
||||
:styles="{ root: { minWidth: '400px' } }"
|
||||
trigger="click"
|
||||
v-if="
|
||||
runningTask &&
|
||||
|
|
@ -927,7 +927,7 @@ defineExpose({ loadTodoTask });
|
|||
<Popover
|
||||
v-model:open="popOverVisible.copy"
|
||||
placement="top"
|
||||
:overlay-style="{ width: '400px' }"
|
||||
:styles="{ root: { width: '400px' } }"
|
||||
trigger="click"
|
||||
v-if="
|
||||
runningTask &&
|
||||
|
|
@ -999,7 +999,7 @@ defineExpose({ loadTodoTask });
|
|||
<Popover
|
||||
v-model:open="popOverVisible.transfer"
|
||||
placement="top"
|
||||
:overlay-style="{ width: '400px' }"
|
||||
:styles="{ root: { width: '400px' } }"
|
||||
trigger="click"
|
||||
v-if="
|
||||
runningTask &&
|
||||
|
|
@ -1072,7 +1072,7 @@ defineExpose({ loadTodoTask });
|
|||
<Popover
|
||||
v-model:open="popOverVisible.delegate"
|
||||
placement="top"
|
||||
:overlay-style="{ width: '400px' }"
|
||||
:styles="{ root: { width: '400px' } }"
|
||||
trigger="click"
|
||||
v-if="
|
||||
runningTask &&
|
||||
|
|
@ -1145,7 +1145,7 @@ defineExpose({ loadTodoTask });
|
|||
<Popover
|
||||
v-model:open="popOverVisible.addSign"
|
||||
placement="top"
|
||||
:overlay-style="{ width: '400px' }"
|
||||
:styles="{ root: { width: '400px' } }"
|
||||
trigger="click"
|
||||
v-if="
|
||||
runningTask &&
|
||||
|
|
@ -1230,7 +1230,7 @@ defineExpose({ loadTodoTask });
|
|||
<Popover
|
||||
v-model:open="popOverVisible.deleteSign"
|
||||
placement="top"
|
||||
:overlay-style="{ width: '400px' }"
|
||||
:styles="{ root: { width: '400px' } }"
|
||||
trigger="click"
|
||||
v-if="runningTask?.children.length > 0"
|
||||
>
|
||||
|
|
@ -1296,7 +1296,7 @@ defineExpose({ loadTodoTask });
|
|||
<Popover
|
||||
v-model:open="popOverVisible.return"
|
||||
placement="top"
|
||||
:overlay-style="{ width: '400px' }"
|
||||
:styles="{ root: { width: '400px' } }"
|
||||
trigger="click"
|
||||
v-if="
|
||||
runningTask &&
|
||||
|
|
|
|||
|
|
@ -184,7 +184,7 @@ onMounted(async () => {
|
|||
|
||||
<div class="mt-4 flex flex-col gap-4 md:flex-row">
|
||||
<!-- 左侧:建立连接、发送消息 -->
|
||||
<Card :bordered="false" class="w-full md:w-1/2">
|
||||
<Card variant="borderless" class="w-full md:w-1/2">
|
||||
<template #title>
|
||||
<div class="flex items-center">
|
||||
<Badge :status="getIsOpen ? 'success' : 'error'" />
|
||||
|
|
@ -274,7 +274,7 @@ onMounted(async () => {
|
|||
</Card>
|
||||
|
||||
<!-- 右侧:消息记录 -->
|
||||
<Card :bordered="false" class="w-full md:w-1/2">
|
||||
<Card variant="borderless" class="w-full md:w-1/2">
|
||||
<template #title>
|
||||
<div class="flex items-center">
|
||||
<IconifyIcon
|
||||
|
|
|
|||
|
|
@ -212,7 +212,7 @@ onMounted(() => {
|
|||
v-if="row.deviceMessage"
|
||||
placement="topLeft"
|
||||
trigger="hover"
|
||||
:overlay-style="{ maxWidth: '600px' }"
|
||||
:styles="{ root: { maxWidth: '600px' } }"
|
||||
>
|
||||
<template #content>
|
||||
<pre class="text-xs">{{ row.deviceMessage }}</pre>
|
||||
|
|
|
|||
|
|
@ -124,7 +124,7 @@ const tableColumns = computed(() => [
|
|||
key: 'index',
|
||||
width: 80,
|
||||
align: 'center' as const,
|
||||
customRender: ({ index }: { index: number }) => index + 1,
|
||||
render: ({ index }: { index: number }) => index + 1,
|
||||
},
|
||||
{
|
||||
title: '时间',
|
||||
|
|
|
|||
|
|
@ -322,7 +322,7 @@ onBeforeUnmount(() => {
|
|||
class="mb-4"
|
||||
>
|
||||
<Card
|
||||
:body-style="{ padding: '0' }"
|
||||
:styles="{ body: { padding: '0' } }"
|
||||
class="relative h-full overflow-hidden transition-colors"
|
||||
>
|
||||
<!-- 添加渐变背景层 -->
|
||||
|
|
|
|||
|
|
@ -276,7 +276,7 @@ onMounted(async () => {
|
|||
<DeviceImportFormModal @success="handleRefresh" />
|
||||
|
||||
<!-- 统一搜索工具栏 -->
|
||||
<Card :body-style="{ padding: '16px' }" class="mb-4">
|
||||
<Card :styles="{ body: { padding: '16px' } }" class="mb-4">
|
||||
<!-- 搜索表单 -->
|
||||
<div class="mb-3 flex flex-wrap items-center gap-3">
|
||||
<Select
|
||||
|
|
|
|||
|
|
@ -115,7 +115,7 @@ onMounted(() => {
|
|||
:lg="6"
|
||||
>
|
||||
<Card
|
||||
:body-style="{ padding: '16px' }"
|
||||
:styles="{ body: { padding: '16px' } }"
|
||||
class="device-card h-full rounded-lg transition-all duration-300 hover:-translate-y-0.5 hover:shadow-lg"
|
||||
>
|
||||
<!-- 顶部标题区域 -->
|
||||
|
|
|
|||
|
|
@ -104,7 +104,7 @@ const columns: TableColumnsType = [
|
|||
key: 'updateTime',
|
||||
align: 'center' as const,
|
||||
width: 180,
|
||||
customRender: ({ text }: any) => formatDate(text, 'YYYY-MM-DD HH:mm:ss'),
|
||||
render: ({ text }: any) => formatDate(text, 'YYYY-MM-DD HH:mm:ss'),
|
||||
},
|
||||
{
|
||||
title: '操作',
|
||||
|
|
|
|||
|
|
@ -143,7 +143,7 @@ const columns: TableColumnsType = [
|
|||
dataIndex: 'createTime',
|
||||
key: 'createTime',
|
||||
align: 'center' as const,
|
||||
customRender: ({ text }: any) => formatDate(text, 'YYYY-MM-DD HH:mm:ss'),
|
||||
render: ({ text }: any) => formatDate(text, 'YYYY-MM-DD HH:mm:ss'),
|
||||
},
|
||||
{
|
||||
title: '任务描述',
|
||||
|
|
|
|||
|
|
@ -175,7 +175,7 @@ onMounted(() => {
|
|||
<FormModal @success="handleRefresh" />
|
||||
|
||||
<!-- 统一搜索工具栏 -->
|
||||
<Card :body-style="{ padding: '16px' }" class="mb-4">
|
||||
<Card :styles="{ body: { padding: '16px' } }" class="mb-4">
|
||||
<!-- 搜索表单 -->
|
||||
<div class="mb-3 flex items-center gap-3">
|
||||
<Input
|
||||
|
|
|
|||
|
|
@ -101,7 +101,7 @@ onMounted(() => {
|
|||
:lg="6"
|
||||
>
|
||||
<Card
|
||||
:body-style="{ padding: '16px' }"
|
||||
:styles="{ body: { padding: '16px' } }"
|
||||
class="product-card h-full rounded-lg transition-all duration-300 hover:-translate-y-0.5 hover:shadow-lg"
|
||||
>
|
||||
<!-- 顶部标题区域 -->
|
||||
|
|
|
|||
|
|
@ -134,7 +134,7 @@ onMounted(async () => {
|
|||
<span>参数:{{ item.name }}</span>
|
||||
<div class="btn">
|
||||
<Button type="link" @click="openStructForm(item)"> 编辑 </Button>
|
||||
<Divider type="vertical" />
|
||||
<Divider orientation="vertical" />
|
||||
<Button type="link" danger @click="deleteStructItem(index)">
|
||||
删除
|
||||
</Button>
|
||||
|
|
|
|||
|
|
@ -131,7 +131,7 @@ function resetForm() {
|
|||
<span>参数名称:{{ item.name }}</span>
|
||||
<div class="btn">
|
||||
<Button type="link" @click="openParamForm(item)">编辑</Button>
|
||||
<Divider type="vertical" />
|
||||
<Divider orientation="vertical" />
|
||||
<Button type="link" danger @click="deleteParamItem(index)">删除</Button>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -48,7 +48,7 @@ const formattedReference = computed(() => {
|
|||
</script>
|
||||
|
||||
<template>
|
||||
<Card :bordered="false" class="h-full">
|
||||
<Card variant="borderless" class="h-full">
|
||||
<div class="flex flex-col gap-2">
|
||||
<div class="flex items-center justify-between text-gray-500">
|
||||
<span>{{ title }}</span>
|
||||
|
|
|
|||
|
|
@ -95,7 +95,7 @@ onMounted(() => {
|
|||
</script>
|
||||
|
||||
<template>
|
||||
<Card :bordered="false">
|
||||
<Card variant="borderless">
|
||||
<template #title>
|
||||
<div class="flex items-center justify-between">
|
||||
<span>用户统计</span>
|
||||
|
|
|
|||
|
|
@ -102,7 +102,7 @@ onMounted(() => {
|
|||
</script>
|
||||
|
||||
<template>
|
||||
<Card :bordered="false" title="运营数据">
|
||||
<Card variant="borderless" title="运营数据">
|
||||
<div class="flex flex-row flex-wrap items-center gap-8 p-4">
|
||||
<div
|
||||
v-for="(item, key) in data"
|
||||
|
|
|
|||
|
|
@ -69,7 +69,7 @@ function handleMenuClick(routerName: string) {
|
|||
</script>
|
||||
|
||||
<template>
|
||||
<Card :bordered="false" title="快捷入口">
|
||||
<Card variant="borderless" title="快捷入口">
|
||||
<div class="flex flex-row flex-wrap gap-8 p-4">
|
||||
<div
|
||||
v-for="menu in menuList"
|
||||
|
|
|
|||
|
|
@ -182,7 +182,7 @@ onMounted(() => {
|
|||
</script>
|
||||
|
||||
<template>
|
||||
<Card :bordered="false">
|
||||
<Card variant="borderless">
|
||||
<template #title>
|
||||
<div class="flex items-center justify-between">
|
||||
<span>交易量趋势</span>
|
||||
|
|
|
|||
|
|
@ -87,7 +87,7 @@ defineExpose({
|
|||
v-model:open="visible"
|
||||
title="选择规格"
|
||||
width="700px"
|
||||
:destroy-on-close="true"
|
||||
:destroy-on-hidden="true"
|
||||
:footer="null"
|
||||
@cancel="closeModal"
|
||||
>
|
||||
|
|
|
|||
|
|
@ -294,7 +294,7 @@ onMounted(async () => {
|
|||
v-model:open="visible"
|
||||
title="商品选择"
|
||||
width="70%"
|
||||
:destroy-on-close="true"
|
||||
:destroy-on-hidden="true"
|
||||
@ok="handleConfirm"
|
||||
@cancel="closeModal"
|
||||
>
|
||||
|
|
|
|||
|
|
@ -231,7 +231,7 @@ onMounted(async () => {
|
|||
v-model:open="visible"
|
||||
title="选择商品"
|
||||
width="950px"
|
||||
:destroy-on-close="true"
|
||||
:destroy-on-hidden="true"
|
||||
:footer="props.multiple ? undefined : null"
|
||||
@ok="handleConfirm"
|
||||
@cancel="closeModal"
|
||||
|
|
|
|||
|
|
@ -92,7 +92,7 @@ if (!formData.value._local) {
|
|||
<span class="mb-2 ml-2 text-xs text-gray-400">建议宽度:750</span>
|
||||
</div>
|
||||
</FormItem>
|
||||
<Card class="property-group" :bordered="false">
|
||||
<Card class="property-group" variant="borderless">
|
||||
<template #title>
|
||||
<div class="flex items-center justify-between">
|
||||
<span>内容(小程序)</span>
|
||||
|
|
@ -110,7 +110,7 @@ if (!formData.value._local) {
|
|||
</template>
|
||||
<NavigationBarCellProperty v-model="formData.mpCells" is-mp />
|
||||
</Card>
|
||||
<Card class="property-group" :bordered="false">
|
||||
<Card class="property-group" variant="borderless">
|
||||
<template #title>
|
||||
<div class="flex items-center justify-between">
|
||||
<span>内容(非小程序)</span>
|
||||
|
|
|
|||
|
|
@ -20,7 +20,7 @@ defineProps<{ property: NoticeBarProperty }>();
|
|||
}"
|
||||
>
|
||||
<Image :src="property.iconUrl" class="h-[18px]" :preview="false" />
|
||||
<Divider type="vertical" />
|
||||
<Divider orientation="vertical" />
|
||||
<Carousel
|
||||
:autoplay="true"
|
||||
:dots="false"
|
||||
|
|
|
|||
|
|
@ -39,10 +39,10 @@ const formData = useVModel(props, 'modelValue', emit);
|
|||
:wrapper-col="{ span: 18 }"
|
||||
:model="formData"
|
||||
>
|
||||
<Card title="商品列表" class="property-group" :bordered="false">
|
||||
<Card title="商品列表" class="property-group" variant="borderless">
|
||||
<SpuShowcase v-model="formData.spuIds" />
|
||||
</Card>
|
||||
<Card title="商品样式" class="property-group" :bordered="false">
|
||||
<Card title="商品样式" class="property-group" variant="borderless">
|
||||
<FormItem label="布局" name="type">
|
||||
<RadioGroup v-model:value="formData.layoutType">
|
||||
<Tooltip title="双列" placement="bottom">
|
||||
|
|
@ -81,7 +81,7 @@ const formData = useVModel(props, 'modelValue', emit);
|
|||
</div>
|
||||
</FormItem>
|
||||
</Card>
|
||||
<Card title="角标" class="property-group" :bordered="false">
|
||||
<Card title="角标" class="property-group" variant="borderless">
|
||||
<FormItem label="角标" name="badge.show">
|
||||
<Switch v-model:checked="formData.badge.show" />
|
||||
</FormItem>
|
||||
|
|
@ -97,7 +97,7 @@ const formData = useVModel(props, 'modelValue', emit);
|
|||
</UploadImg>
|
||||
</FormItem>
|
||||
</Card>
|
||||
<Card title="商品样式" class="property-group" :bordered="false">
|
||||
<Card title="商品样式" class="property-group" variant="borderless">
|
||||
<FormItem label="上圆角" name="borderRadiusTop">
|
||||
<Slider
|
||||
v-model:value="formData.borderRadiusTop"
|
||||
|
|
|
|||
|
|
@ -40,10 +40,10 @@ const formData = useVModel(props, 'modelValue', emit);
|
|||
:wrapper-col="{ span: 18 }"
|
||||
:model="formData"
|
||||
>
|
||||
<Card title="拼团活动" class="property-group" :bordered="false">
|
||||
<Card title="拼团活动" class="property-group" variant="borderless">
|
||||
<CombinationShowcase v-model="formData.activityIds" />
|
||||
</Card>
|
||||
<Card title="商品样式" class="property-group" :bordered="false">
|
||||
<Card title="商品样式" class="property-group" variant="borderless">
|
||||
<FormItem label="布局" name="type">
|
||||
<RadioGroup v-model:value="formData.layoutType">
|
||||
<Tooltip title="单列大图" placement="bottom">
|
||||
|
|
@ -109,7 +109,7 @@ const formData = useVModel(props, 'modelValue', emit);
|
|||
</div>
|
||||
</FormItem>
|
||||
</Card>
|
||||
<Card title="角标" class="property-group" :bordered="false">
|
||||
<Card title="角标" class="property-group" variant="borderless">
|
||||
<FormItem label="角标" name="badge.show">
|
||||
<Switch v-model:checked="formData.badge.show" />
|
||||
</FormItem>
|
||||
|
|
@ -120,7 +120,7 @@ const formData = useVModel(props, 'modelValue', emit);
|
|||
</UploadImg>
|
||||
</FormItem>
|
||||
</Card>
|
||||
<Card title="按钮" class="property-group" :bordered="false">
|
||||
<Card title="按钮" class="property-group" variant="borderless">
|
||||
<FormItem label="按钮类型" name="btnBuy.type">
|
||||
<RadioGroup v-model:value="formData.btnBuy.type">
|
||||
<RadioButton value="text">文字</RadioButton>
|
||||
|
|
@ -152,7 +152,7 @@ const formData = useVModel(props, 'modelValue', emit);
|
|||
</FormItem>
|
||||
</template>
|
||||
</Card>
|
||||
<Card title="商品样式" class="property-group" :bordered="false">
|
||||
<Card title="商品样式" class="property-group" variant="borderless">
|
||||
<FormItem label="上圆角" name="borderRadiusTop">
|
||||
<Slider
|
||||
v-model:value="formData.borderRadiusTop"
|
||||
|
|
|
|||
|
|
@ -307,7 +307,7 @@ onMounted(() => {
|
|||
</Col>
|
||||
<!-- 右侧操作区 -->
|
||||
<Col :span="8">
|
||||
<Space direction="vertical" size="large" class="flex justify-end">
|
||||
<Space orientation="vertical" size="large" class="flex justify-end">
|
||||
<Tooltip title="重置">
|
||||
<Button @click="handleReset">
|
||||
<IconifyIcon class="size-5" icon="lucide:refresh-cw" />
|
||||
|
|
@ -466,8 +466,10 @@ onMounted(() => {
|
|||
<Col :span="6" v-if="selectedComponent?.property">
|
||||
<Card
|
||||
class="h-[calc(80vh)] px-2 py-4"
|
||||
:body-style="{ padding: 0 }"
|
||||
:head-style="{ padding: 0, minHeight: '40px' }"
|
||||
:styles="{
|
||||
body: { padding: 0 },
|
||||
header: { padding: 0, minHeight: '40px' },
|
||||
}"
|
||||
>
|
||||
<!-- 组件名称 -->
|
||||
<template #title>
|
||||
|
|
|
|||
|
|
@ -10,7 +10,7 @@ defineOptions({ name: 'VerticalSpace' });
|
|||
|
||||
<template>
|
||||
<Space v-bind="$attrs">
|
||||
<Space.Compact direction="vertical">
|
||||
<Space.Compact orientation="vertical">
|
||||
<slot></slot>
|
||||
</Space.Compact>
|
||||
</Space>
|
||||
|
|
|
|||
|
|
@ -86,7 +86,7 @@ defineExpose({
|
|||
v-model:open="visible"
|
||||
title="选择优惠券"
|
||||
width="65%"
|
||||
:destroy-on-close="true"
|
||||
:destroy-on-hidden="true"
|
||||
@ok="handleConfirm"
|
||||
@cancel="closeModal"
|
||||
>
|
||||
|
|
|
|||
|
|
@ -170,7 +170,7 @@ async function handleSendMessage(event: any) {
|
|||
}
|
||||
// 1. 校验消息是否为空
|
||||
if (isEmpty(unref(message.value)?.trim())) {
|
||||
notification.warning({ message: '请输入消息后再发送哦!' });
|
||||
notification.warning({ title: '请输入消息后再发送哦!' });
|
||||
message.value = '';
|
||||
return;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -85,7 +85,7 @@ onMounted(() => {
|
|||
</script>
|
||||
|
||||
<template>
|
||||
<Card :bordered="false" title="会员地域分布" class="h-full">
|
||||
<Card variant="borderless" title="会员地域分布" class="h-full">
|
||||
<Spin :spinning="loading">
|
||||
<div class="flex gap-4">
|
||||
<div class="w-2/5">
|
||||
|
|
|
|||
|
|
@ -46,7 +46,7 @@ const calculateRelativeRate = (value?: number, reference?: number) => {
|
|||
</script>
|
||||
|
||||
<template>
|
||||
<Card :bordered="false" :loading="loading">
|
||||
<Card variant="borderless" :loading="loading">
|
||||
<template #title>
|
||||
<div class="flex items-center justify-between">
|
||||
<span>会员概览</span>
|
||||
|
|
|
|||
|
|
@ -54,7 +54,7 @@ onMounted(() => {
|
|||
</script>
|
||||
|
||||
<template>
|
||||
<Card :bordered="false" title="会员性别比例" class="h-full">
|
||||
<Card variant="borderless" title="会员性别比例" class="h-full">
|
||||
<Spin :spinning="loading">
|
||||
<EchartsUI ref="chartRef" />
|
||||
</Spin>
|
||||
|
|
|
|||
|
|
@ -48,7 +48,7 @@ onMounted(() => {
|
|||
</script>
|
||||
|
||||
<template>
|
||||
<Card :bordered="false" title="会员终端" class="h-full">
|
||||
<Card variant="borderless" title="会员终端" class="h-full">
|
||||
<Spin :spinning="loading">
|
||||
<EchartsUI ref="chartRef" />
|
||||
</Spin>
|
||||
|
|
|
|||
|
|
@ -126,7 +126,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
|
|||
</script>
|
||||
|
||||
<template>
|
||||
<Card :bordered="false" title="商品排行">
|
||||
<Card variant="borderless" title="商品排行">
|
||||
<template #extra>
|
||||
<ShortcutDateRangePicker @change="handleDateRangeChange" />
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -121,7 +121,7 @@ async function handleExport() {
|
|||
</script>
|
||||
|
||||
<template>
|
||||
<Card :bordered="false" title="商品概况" class="h-full">
|
||||
<Card variant="borderless" title="商品概况" class="h-full">
|
||||
<template #extra>
|
||||
<!-- 查询条件 -->
|
||||
<div class="flex items-center gap-2">
|
||||
|
|
|
|||
|
|
@ -124,7 +124,7 @@ async function handleExport() {
|
|||
</script>
|
||||
|
||||
<template>
|
||||
<Card :bordered="false" title="交易状况" class="h-full">
|
||||
<Card variant="borderless" title="交易状况" class="h-full">
|
||||
<template #extra>
|
||||
<!-- 查询条件 -->
|
||||
<div class="flex items-center gap-2">
|
||||
|
|
|
|||
|
|
@ -142,7 +142,7 @@ function selectMaterial(item: any) {
|
|||
title="选择图片"
|
||||
:width="1200"
|
||||
:footer="null"
|
||||
destroy-on-close
|
||||
destroy-on-hidden
|
||||
>
|
||||
<WxMaterialSelect
|
||||
type="image"
|
||||
|
|
|
|||
|
|
@ -134,7 +134,7 @@ function selectMaterial(item: any) {
|
|||
title="选择封面图"
|
||||
:width="1200"
|
||||
:footer="null"
|
||||
destroy-on-close
|
||||
destroy-on-hidden
|
||||
>
|
||||
<WxMaterialSelect
|
||||
type="image"
|
||||
|
|
|
|||
|
|
@ -79,7 +79,7 @@ function onDelete() {
|
|||
title="选择图文"
|
||||
:width="1200"
|
||||
:footer="null"
|
||||
destroy-on-close
|
||||
destroy-on-hidden
|
||||
>
|
||||
<WxMaterialSelect
|
||||
type="news"
|
||||
|
|
|
|||
|
|
@ -141,7 +141,7 @@ function selectMaterial(item: any) {
|
|||
title="选择视频"
|
||||
:width="1200"
|
||||
:footer="null"
|
||||
destroy-on-close
|
||||
destroy-on-hidden
|
||||
>
|
||||
<WxMaterialSelect
|
||||
type="video"
|
||||
|
|
|
|||
|
|
@ -143,7 +143,7 @@ function selectMaterial(item: Reply) {
|
|||
title="选择语音"
|
||||
:width="1200"
|
||||
:footer="null"
|
||||
destroy-on-close
|
||||
destroy-on-hidden
|
||||
>
|
||||
<WxMaterialSelect
|
||||
type="voice"
|
||||
|
|
|
|||
|
|
@ -36,7 +36,7 @@ function playVideo() {
|
|||
title="视频播放"
|
||||
:footer="null"
|
||||
:width="850"
|
||||
destroy-on-close
|
||||
destroy-on-hidden
|
||||
>
|
||||
<VideoPlayer
|
||||
v-if="dialogVideo"
|
||||
|
|
|
|||
|
|
@ -79,7 +79,7 @@ const [Modal, modalApi] = useVbenModal({
|
|||
</script>
|
||||
|
||||
<template>
|
||||
<Modal :title="getTitle" class="w-4/5" destroy-on-close>
|
||||
<Modal :title="getTitle" class="w-4/5" destroy-on-hidden>
|
||||
<NewsForm
|
||||
v-if="formData"
|
||||
v-model="newsList"
|
||||
|
|
|
|||
|
|
@ -196,7 +196,7 @@ function deleteMaterial() {
|
|||
title="选择图文"
|
||||
v-model:open="showNewsDialog"
|
||||
width="80%"
|
||||
destroy-on-close
|
||||
destroy-on-hidden
|
||||
>
|
||||
<WxMaterialSelect
|
||||
type="news"
|
||||
|
|
|
|||
|
|
@ -230,7 +230,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
|
|||
title="粉丝消息列表"
|
||||
:width="800"
|
||||
:footer="null"
|
||||
destroy-on-close
|
||||
destroy-on-hidden
|
||||
>
|
||||
<WxMsg :user-id="messageBoxUserId" />
|
||||
</Modal>
|
||||
|
|
|
|||
Loading…
Reference in New Issue