From ae345d6fb26ca61bccbf51b471cfa9695430389b Mon Sep 17 00:00:00 2001 From: YunaiV Date: Sat, 25 Oct 2025 16:31:59 +0800 Subject: [PATCH] =?UTF-8?q?feat=EF=BC=9A=E3=80=90ele=E3=80=91=E3=80=90mall?= =?UTF-8?q?=E3=80=91=E5=B0=86=20draggable=20=E8=BF=81=E7=A7=BB=E5=88=B0=20?= =?UTF-8?q?mall/promotion/components=20=E4=B8=AD=EF=BC=8C=E8=81=9A?= =?UTF-8?q?=E7=84=A6=E4=B8=80=E7=82=B9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../components/mobile/Carousel/property.vue | 2 +- .../components/mobile/Popover/property.vue | 2 +- .../floating-action-button/property.vue | 2 +- .../components/mobile/menu-grid/property.vue | 2 +- .../components/mobile/menu-list/property.vue | 2 +- .../mobile/menu-swiper/property.vue | 2 +- .../components/mobile/notice-bar/property.vue | 2 +- .../components/mobile/search-bar/property.vue | 2 +- .../components/mobile/tab-bar/property.vue | 2 +- .../promotion}/components/draggable/index.vue | 34 ++++++++++--------- .../views/mall/promotion/components/index.ts | 1 + 11 files changed, 28 insertions(+), 25 deletions(-) rename apps/web-ele/src/{ => views/mall/promotion}/components/draggable/index.vue (80%) diff --git a/apps/web-ele/src/components/diy-editor/components/mobile/Carousel/property.vue b/apps/web-ele/src/components/diy-editor/components/mobile/Carousel/property.vue index 789e2642e..fdcf852b2 100644 --- a/apps/web-ele/src/components/diy-editor/components/mobile/Carousel/property.vue +++ b/apps/web-ele/src/components/diy-editor/components/mobile/Carousel/property.vue @@ -17,7 +17,7 @@ import { } from 'element-plus'; import ComponentContainerProperty from '#/components/diy-editor/components/component-container-property.vue'; -import Draggable from '#/components/draggable/index.vue'; +import { Draggable } from '#/views/mall/promotion/components'; import UploadFile from '#/components/upload/file-upload.vue'; import UploadImg from '#/components/upload/image-upload.vue'; import { AppLinkInput } from '#/views/mall/promotion/components'; diff --git a/apps/web-ele/src/components/diy-editor/components/mobile/Popover/property.vue b/apps/web-ele/src/components/diy-editor/components/mobile/Popover/property.vue index 8d7482c1f..de9af52eb 100644 --- a/apps/web-ele/src/components/diy-editor/components/mobile/Popover/property.vue +++ b/apps/web-ele/src/components/diy-editor/components/mobile/Popover/property.vue @@ -10,7 +10,7 @@ import { ElTooltip, } from 'element-plus'; -import Draggable from '#/components/draggable/index.vue'; +import { Draggable } from '#/views/mall/promotion/components'; import UploadImg from '#/components/upload/image-upload.vue'; import { AppLinkInput } from '#/views/mall/promotion/components'; diff --git a/apps/web-ele/src/components/diy-editor/components/mobile/floating-action-button/property.vue b/apps/web-ele/src/components/diy-editor/components/mobile/floating-action-button/property.vue index 9427d4ac2..59197de56 100644 --- a/apps/web-ele/src/components/diy-editor/components/mobile/floating-action-button/property.vue +++ b/apps/web-ele/src/components/diy-editor/components/mobile/floating-action-button/property.vue @@ -11,7 +11,7 @@ import { ElSwitch, } from 'element-plus'; -import Draggable from '#/components/draggable/index.vue'; +import { Draggable } from '#/views/mall/promotion/components'; import UploadImg from '#/components/upload/image-upload.vue'; import { AppLinkInput, diff --git a/apps/web-ele/src/components/diy-editor/components/mobile/menu-grid/property.vue b/apps/web-ele/src/components/diy-editor/components/mobile/menu-grid/property.vue index bcb5ace43..792c35496 100644 --- a/apps/web-ele/src/components/diy-editor/components/mobile/menu-grid/property.vue +++ b/apps/web-ele/src/components/diy-editor/components/mobile/menu-grid/property.vue @@ -12,7 +12,7 @@ import { } from 'element-plus'; import ComponentContainerProperty from '#/components/diy-editor/components/component-container-property.vue'; -import Draggable from '#/components/draggable/index.vue'; +import { Draggable } from '#/views/mall/promotion/components'; import UploadImg from '#/components/upload/image-upload.vue'; import { AppLinkInput } from '#/views/mall/promotion/components'; diff --git a/apps/web-ele/src/components/diy-editor/components/mobile/menu-list/property.vue b/apps/web-ele/src/components/diy-editor/components/mobile/menu-list/property.vue index 81725e454..b3ecad836 100644 --- a/apps/web-ele/src/components/diy-editor/components/mobile/menu-list/property.vue +++ b/apps/web-ele/src/components/diy-editor/components/mobile/menu-list/property.vue @@ -5,7 +5,7 @@ import { useVModel } from '@vueuse/core'; import { ElForm, ElFormItem, ElText } from 'element-plus'; import ComponentContainerProperty from '#/components/diy-editor/components/component-container-property.vue'; -import Draggable from '#/components/draggable/index.vue'; +import { Draggable } from '#/views/mall/promotion/components'; import UploadImg from '#/components/upload/image-upload.vue'; import { AppLinkInput, diff --git a/apps/web-ele/src/components/diy-editor/components/mobile/menu-swiper/property.vue b/apps/web-ele/src/components/diy-editor/components/mobile/menu-swiper/property.vue index a26cdc05e..e30191fd6 100644 --- a/apps/web-ele/src/components/diy-editor/components/mobile/menu-swiper/property.vue +++ b/apps/web-ele/src/components/diy-editor/components/mobile/menu-swiper/property.vue @@ -14,7 +14,7 @@ import { } from 'element-plus'; import ComponentContainerProperty from '#/components/diy-editor/components/component-container-property.vue'; -import Draggable from '#/components/draggable/index.vue'; +import { Draggable } from '#/views/mall/promotion/components'; import UploadImg from '#/components/upload/image-upload.vue'; import { AppLinkInput, diff --git a/apps/web-ele/src/components/diy-editor/components/mobile/notice-bar/property.vue b/apps/web-ele/src/components/diy-editor/components/mobile/notice-bar/property.vue index 162df7431..4f508dc71 100644 --- a/apps/web-ele/src/components/diy-editor/components/mobile/notice-bar/property.vue +++ b/apps/web-ele/src/components/diy-editor/components/mobile/notice-bar/property.vue @@ -5,7 +5,7 @@ import { useVModel } from '@vueuse/core'; import { ElCard, ElForm, ElFormItem, ElInput } from 'element-plus'; import ComponentContainerProperty from '#/components/diy-editor/components/component-container-property.vue'; -import Draggable from '#/components/draggable/index.vue'; +import { Draggable } from '#/views/mall/promotion/components'; import UploadImg from '#/components/upload/image-upload.vue'; import { AppLinkInput, ColorInput } from '#/views/mall/promotion/components'; diff --git a/apps/web-ele/src/components/diy-editor/components/mobile/search-bar/property.vue b/apps/web-ele/src/components/diy-editor/components/mobile/search-bar/property.vue index 149f52fce..32142b883 100644 --- a/apps/web-ele/src/components/diy-editor/components/mobile/search-bar/property.vue +++ b/apps/web-ele/src/components/diy-editor/components/mobile/search-bar/property.vue @@ -19,7 +19,7 @@ import { } from 'element-plus'; import ComponentContainerProperty from '#/components/diy-editor/components/component-container-property.vue'; -import Draggable from '#/components/draggable/index.vue'; +import { Draggable } from '#/views/mall/promotion/components'; /** 搜索框属性面板 */ defineOptions({ name: 'SearchProperty' }); diff --git a/apps/web-ele/src/components/diy-editor/components/mobile/tab-bar/property.vue b/apps/web-ele/src/components/diy-editor/components/mobile/tab-bar/property.vue index d003c665e..6ce0f0039 100644 --- a/apps/web-ele/src/components/diy-editor/components/mobile/tab-bar/property.vue +++ b/apps/web-ele/src/components/diy-editor/components/mobile/tab-bar/property.vue @@ -15,7 +15,7 @@ import { ElText, } from 'element-plus'; -import Draggable from '#/components/draggable/index.vue'; +import { Draggable } from '#/views/mall/promotion/components'; import UploadImg from '#/components/upload/image-upload.vue'; import { AppLinkInput, ColorInput } from '#/views/mall/promotion/components'; diff --git a/apps/web-ele/src/components/draggable/index.vue b/apps/web-ele/src/views/mall/promotion/components/draggable/index.vue similarity index 80% rename from apps/web-ele/src/components/draggable/index.vue rename to apps/web-ele/src/views/mall/promotion/components/draggable/index.vue index 1178d142e..ad7f9f3df 100644 --- a/apps/web-ele/src/components/draggable/index.vue +++ b/apps/web-ele/src/views/mall/promotion/components/draggable/index.vue @@ -5,43 +5,44 @@ import { IconifyIcon } from '@vben/icons'; import { cloneDeep } from '@vben/utils'; import { useVModel } from '@vueuse/core'; -// 拖拽组件 import VueDraggable from 'vuedraggable'; -// 拖拽组件封装 +/** 拖拽组件封装 */ defineOptions({ name: 'Draggable' }); -// 定义属性 +/** 定义属性 */ const props = defineProps({ - // 绑定值 modelValue: { type: Array, default: () => [], - }, - // 空的元素：点击添加按钮时，创建元素并添加到列表；默认为空对象 + }, // 绑定值 emptyItem: { type: Object, default: () => ({}), - }, - // 数量限制：默认为0，表示不限制 + }, // 空的元素：点击添加按钮时，创建元素并添加到列表；默认为空对象 limit: { type: Number, default: Number.MAX_VALUE, - }, - // 最小数量：默认为1 + }, // 数量限制：默认为 0，表示不限制 min: { type: Number, default: 1, - }, + }, // 最小数量：默认为1 }); -// 定义事件 + const emit = defineEmits(['update:modelValue']); + const formData = useVModel(props, 'modelValue', emit); -// 处理添加 -const handleAdd = () => formData.value.push(cloneDeep(props.emptyItem || {})); -// 处理删除 -const handleDelete = (index: number) => formData.value.splice(index, 1); +/** 处理添加 */ +function handleAdd() { + return formData.value.push(cloneDeep(props.emptyItem || {})); +} + +/** 处理删除 */ +const handleDelete = function (index: number) { + return formData.value.splice(index, 1); +};