smart-flow/yudao-ui-admin-vben
4
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat：【ele】【mall】将 draggable 迁移到 mall/promotion/components 中，聚焦一点

Browse Source
This commit is contained in:
YunaiV
2025-10-25 16:31:59 +08:00
parent 1af1a9b2d4
commit ae345d6fb2
11 changed files with 28 additions and 25 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
apps/web-ele/src/components/diy-editor/components/mobile/Carousel/property.vue
View File

@@ -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';

2
apps/web-ele/src/components/diy-editor/components/mobile/Popover/property.vue
View File

@@ -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';

2
apps/web-ele/src/components/diy-editor/components/mobile/floating-action-button/property.vue
View File

@@ -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,

2
apps/web-ele/src/components/diy-editor/components/mobile/menu-grid/property.vue
View File

@@ -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';

2
apps/web-ele/src/components/diy-editor/components/mobile/menu-list/property.vue
View File

@@ -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,

2
apps/web-ele/src/components/diy-editor/components/mobile/menu-swiper/property.vue
View File

@@ -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,

2
apps/web-ele/src/components/diy-editor/components/mobile/notice-bar/property.vue
View File

@@ -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';

2
apps/web-ele/src/components/diy-editor/components/mobile/search-bar/property.vue
View File

@@ -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' });

2
apps/web-ele/src/components/diy-editor/components/mobile/tab-bar/property.vue
View File

@@ -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';

34
apps/web-ele/src/components/draggable/index.vue → apps/web-ele/src/views/mall/promotion/components/draggable/index.vue
View File

@@ -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);
};
</script>
<template>
@@ -57,6 +58,7 @@ const handleDelete = (index: number) => formData.value.splice(index, 1);
<template #item="{ element, index }">
<div class="mb-1 flex flex-col gap-1 rounded border border-gray-200 p-2">
<!-- 操作按钮区 -->
<!-- TODO @AI：是不是用错了？看看项目里，有没替代的 -->
<div
class="-m-2 mb-1 flex flex-row items-center justify-between p-2"
style="background-color: var(--app-content-bg-color)"

1
apps/web-ele/src/views/mall/promotion/components/index.ts
View File

@@ -1,5 +1,6 @@
export { default as AppLinkInput } from './app-link-input/index.vue';
export { default as ColorInput } from './color-input/index.vue';
export { default as Draggable } from './draggable/index.vue';
export { default as InputWithColor } from './input-with-color/index.vue';
export { default as MagicCubeEditor } from './magic-cube-editor/index.vue';
export { default as VerticalButtonGroup } from './vertical-button-group/index.vue';