diff --git a/apps/web-ele/src/views/mall/promotion/components/diy-editor/components/mobile/menu-list/config.ts b/apps/web-ele/src/views/mall/promotion/components/diy-editor/components/mobile/menu-list/config.ts index 6567c553d..375546ae3 100644 --- a/apps/web-ele/src/views/mall/promotion/components/diy-editor/components/mobile/menu-list/config.ts +++ b/apps/web-ele/src/views/mall/promotion/components/diy-editor/components/mobile/menu-list/config.ts @@ -4,28 +4,21 @@ import { cloneDeep } from '@vben/utils'; /** 列表导航属性 */ export interface MenuListProperty { - // 导航菜单列表 - list: MenuListItemProperty[]; - // 组件样式 - style: ComponentStyle; + list: MenuListItemProperty[]; // 导航菜单列表 + style: ComponentStyle; // 组件样式 } /** 列表导航项目属性 */ export interface MenuListItemProperty { - // 图标链接 - iconUrl: string; - // 标题 - title: string; - // 标题颜色 - titleColor: string; - // 副标题 - subtitle: string; - // 副标题颜色 - subtitleColor: string; - // 链接 - url: string; + iconUrl: string; // 图标链接 + title: string; // 标题 + titleColor: string; // 标题颜色 + subtitle: string; // 副标题 + subtitleColor: string; // 副标题颜色 + url: string; // 链接 } +/** 空的列表导航项目属性 */ export const EMPTY_MENU_LIST_ITEM_PROPERTY = { title: '标题', titleColor: '#333', @@ -33,7 +26,7 @@ export const EMPTY_MENU_LIST_ITEM_PROPERTY = { subtitleColor: '#bbb', }; -// 定义组件 +/** 定义组件 */ export const component = { id: 'MenuList', name: '列表导航', diff --git a/apps/web-ele/src/views/mall/promotion/components/diy-editor/components/mobile/menu-list/index.vue b/apps/web-ele/src/views/mall/promotion/components/diy-editor/components/mobile/menu-list/index.vue index 12670dcb0..0a05a6c7b 100644 --- a/apps/web-ele/src/views/mall/promotion/components/diy-editor/components/mobile/menu-list/index.vue +++ b/apps/web-ele/src/views/mall/promotion/components/diy-editor/components/mobile/menu-list/index.vue @@ -7,6 +7,7 @@ import { ElImage } from 'element-plus'; /** 列表导航 */ defineOptions({ name: 'MenuList' }); + defineProps<{ property: MenuListProperty }>(); @@ -19,14 +20,14 @@ defineProps<{ property: MenuListProperty }>(); >
- {{ - item.title - }} + + {{ item.title }} +
- {{ - item.subtitle - }} + + {{ item.subtitle }} +
diff --git a/apps/web-ele/src/views/mall/promotion/components/diy-editor/components/mobile/menu-list/property.vue b/apps/web-ele/src/views/mall/promotion/components/diy-editor/components/mobile/menu-list/property.vue index c5b076936..2c5991501 100644 --- a/apps/web-ele/src/views/mall/promotion/components/diy-editor/components/mobile/menu-list/property.vue +++ b/apps/web-ele/src/views/mall/promotion/components/diy-editor/components/mobile/menu-list/property.vue @@ -18,7 +18,9 @@ import { EMPTY_MENU_LIST_ITEM_PROPERTY } from './config'; defineOptions({ name: 'MenuListProperty' }); const props = defineProps<{ modelValue: MenuListProperty }>(); + const emit = defineEmits(['update:modelValue']); + const formData = useVModel(props, 'modelValue', emit); @@ -26,8 +28,6 @@ const formData = useVModel(props, 'modelValue', emit); 菜单设置 拖动左侧的小圆点可以调整顺序 - - - -