From fe7a69f570a2451bb9223b1eb061517788051b1c Mon Sep 17 00:00:00 2001 From: YunaiV Date: Tue, 28 Oct 2025 23:21:07 +0800 Subject: [PATCH] =?UTF-8?q?feat=EF=BC=9A=E3=80=90mall=E3=80=91diy=20editor?= =?UTF-8?q?=20=E7=9A=84=20hot-zone=20=E4=BB=A3=E7=A0=81=E4=BC=98=E5=8C=96?= =?UTF-8?q?=EF=BC=88100%=EF=BC=89=E5=AE=8C=E6=88=90=E5=95=86=E5=93=81?= =?UTF-8?q?=E5=88=86=E7=B1=BB=E7=9A=84=E6=94=AF=E6=8C=81?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- ...ategory-select.vue => category-select.vue} | 25 +++--- .../mall/product/category/components/index.ts | 1 + .../app-link-input/select-dialog.vue | 86 +++++++++++-------- .../components/hot-zone-edit-dialog/index.vue | 2 + 4 files changed, 63 insertions(+), 51 deletions(-) rename apps/web-ele/src/views/mall/product/category/components/{product-category-select.vue => category-select.vue} (86%) create mode 100644 apps/web-ele/src/views/mall/product/category/components/index.ts diff --git a/apps/web-ele/src/views/mall/product/category/components/product-category-select.vue b/apps/web-ele/src/views/mall/product/category/components/category-select.vue similarity index 86% rename from apps/web-ele/src/views/mall/product/category/components/product-category-select.vue rename to apps/web-ele/src/views/mall/product/category/components/category-select.vue index 23169691e..814ec22ae 100644 --- a/apps/web-ele/src/views/mall/product/category/components/product-category-select.vue +++ b/apps/web-ele/src/views/mall/product/category/components/category-select.vue @@ -3,32 +3,33 @@ import { computed, onMounted, ref } from 'vue'; import { handleTree } from '@vben/utils'; +import { ElTreeSelect } from 'element-plus'; + import { getCategoryList } from '#/api/mall/product/category'; /** 商品分类选择组件 */ defineOptions({ name: 'ProductCategorySelect' }); const props = defineProps({ - // 选中的ID modelValue: { type: [Number, Array], default: undefined, - }, - // 是否多选 + }, // 选中的 ID multiple: { type: Boolean, default: false, - }, - // 上级品类的编号 + }, // 是否多选 parentId: { type: Number, default: undefined, - }, + }, // 上级品类的编号 }); /** 分类选择 */ const emit = defineEmits(['update:modelValue']); +const categoryList = ref([]); // 分类树 + /** 选中的分类 ID */ const selectCategoryId = computed({ get: () => { @@ -40,7 +41,6 @@ const selectCategoryId = computed({ }); /** 初始化 */ -const categoryList = ref([]); // 分类树 onMounted(async () => { const data = await getCategoryList({ parentId: props.parentId, @@ -49,20 +49,19 @@ onMounted(async () => { }); diff --git a/apps/web-ele/src/views/mall/product/category/components/index.ts b/apps/web-ele/src/views/mall/product/category/components/index.ts new file mode 100644 index 000000000..aa1424405 --- /dev/null +++ b/apps/web-ele/src/views/mall/product/category/components/index.ts @@ -0,0 +1 @@ +export { default as ProductCategorySelect } from './category-select.vue'; diff --git a/apps/web-ele/src/views/mall/promotion/components/app-link-input/select-dialog.vue b/apps/web-ele/src/views/mall/promotion/components/app-link-input/select-dialog.vue index 445060aee..3ab7d7fa6 100644 --- a/apps/web-ele/src/views/mall/promotion/components/app-link-input/select-dialog.vue +++ b/apps/web-ele/src/views/mall/promotion/components/app-link-input/select-dialog.vue @@ -8,9 +8,15 @@ import { nextTick, ref } from 'vue'; import { useVbenModal } from '@vben/common-ui'; import { getUrlNumberValue } from '@vben/utils'; -import { ElButton, ElScrollbar, ElTooltip } from 'element-plus'; +import { + ElButton, + ElForm, + ElFormItem, + ElScrollbar, + ElTooltip, +} from 'element-plus'; -import ProductCategorySelect from '#/views/mall/product/category/components/product-category-select.vue'; +import { ProductCategorySelect } from '#/views/mall/product/category/components/'; import { APP_LINK_GROUP_LIST, APP_LINK_TYPE_ENUM } from './data'; @@ -33,9 +39,7 @@ const groupBtnRefs = ref([]); // 分组引用列表 const detailSelectDialog = ref<{ id?: number; type?: APP_LINK_TYPE_ENUM; - visible: boolean; }>({ - visible: false, id: undefined, type: undefined, }); // 详情选择对话框 @@ -48,6 +52,14 @@ const [Modal, modalApi] = useVbenModal({ }, }); +const [DetailSelectModal, detailSelectModalApi] = useVbenModal({ + onConfirm() { + detailSelectModalApi.close(); + }, +}); + +defineExpose({ open }); + /** 打开弹窗 */ async function open(link: string) { activeAppLink.value.path = link; @@ -69,8 +81,6 @@ async function open(link: string) { } } -defineExpose({ open }); - /** 处理 APP 链接选中 */ function handleAppLinkSelected(appLink: AppLink) { if (!isSameLink(appLink.path, activeAppLink.value.path)) { @@ -78,7 +88,6 @@ function handleAppLinkSelected(appLink: AppLink) { } switch (appLink.type) { case APP_LINK_TYPE_ENUM.PRODUCT_CATEGORY_LIST: { - detailSelectDialog.value.visible = true; detailSelectDialog.value.type = appLink.type; // 返显 detailSelectDialog.value.id = @@ -86,6 +95,7 @@ function handleAppLinkSelected(appLink: AppLink) { 'id', `http://127.0.0.1${activeAppLink.value.path}`, ) || undefined; + detailSelectModalApi.open(); break; } default: { @@ -144,41 +154,41 @@ function isSameLink(link1: string, link2: string) { /** 处理详情选择 */ function handleProductCategorySelected(id: number) { - // TODO @AI：这里有点问题；activeAppLink 地址； + // 生成 activeAppLink const url = new URL(activeAppLink.value.path, 'http://127.0.0.1'); - // 修改 id 参数 url.searchParams.set('id', `${id}`); - // 排除域名 activeAppLink.value.path = `${url.pathname}${url.search}`; - // 关闭对话框 - detailSelectDialog.value.visible = false; - // 重置 id + + // 关闭对话框，并重置 id + detailSelectModalApi.close(); detailSelectDialog.value.id = undefined; } diff --git a/apps/web-ele/src/views/mall/promotion/components/diy-editor/components/mobile/hot-zone/components/hot-zone-edit-dialog/index.vue b/apps/web-ele/src/views/mall/promotion/components/diy-editor/components/mobile/hot-zone/components/hot-zone-edit-dialog/index.vue index 7bc1dc1e1..c232854eb 100644 --- a/apps/web-ele/src/views/mall/promotion/components/diy-editor/components/mobile/hot-zone/components/hot-zone-edit-dialog/index.vue +++ b/apps/web-ele/src/views/mall/promotion/components/diy-editor/components/mobile/hot-zone/components/hot-zone-edit-dialog/index.vue @@ -167,11 +167,13 @@ const setHeight = (item: HotZoneItemProperty, height: number) => { const activeHotZone = ref(); const appLinkDialogRef = ref(); +/** 显示 App 链接选择对话框 */ const handleShowAppLinkDialog = (hotZone: HotZoneItemProperty) => { activeHotZone.value = hotZone; appLinkDialogRef.value.open(hotZone.url); }; +/** 处理 App 链接选择变更 */ const handleAppLinkChange = (appLink: AppLink) => { if (!appLink || !activeHotZone.value) { return;