From e9ff8d323752dd0df8bebbb71b8c3fe4f6e8caff Mon Sep 17 00:00:00 2001 From: owen Date: Sun, 29 Oct 2023 22:03:24 +0800 Subject: [PATCH] =?UTF-8?q?=E5=95=86=E5=9F=8E=E8=A3=85=E4=BF=AE?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/api/mall/promotion/diy/page.ts | 35 ++ src/api/mall/promotion/diy/template.ts | 41 ++ src/assets/imgs/diy/statusBar.png | Bin 0 -> 8917 bytes src/components/ColorInput/index.vue | 54 ++ .../DiyEditor/components/ComponentLibrary.vue | 196 +++++++ .../components/mobile/Carousel/config.ts | 44 ++ .../components/mobile/Carousel/index.vue | 75 +++ .../components/mobile/Carousel/property.vue | 125 ++++ .../components/mobile/Divider/config.ts | 29 + .../components/mobile/Divider/index.vue | 29 + .../components/mobile/Divider/property.vue | 80 +++ .../components/mobile/NavigationBar/config.ts | 38 ++ .../components/mobile/NavigationBar/index.vue | 60 ++ .../mobile/NavigationBar/property.vue | 63 ++ .../components/mobile/NoticeBar/config.ts | 39 ++ .../components/mobile/NoticeBar/index.vue | 26 + .../components/mobile/NoticeBar/property.vue | 77 +++ .../components/mobile/PageConfig/config.ts | 23 + .../components/mobile/PageConfig/property.vue | 34 ++ .../components/mobile/SearchBar/config.ts | 35 ++ .../components/mobile/SearchBar/index.vue | 80 +++ .../components/mobile/SearchBar/property.vue | 100 ++++ .../components/mobile/TabBar/config.ts | 91 +++ .../components/mobile/TabBar/index.vue | 58 ++ .../components/mobile/TabBar/property.vue | 161 ++++++ .../components/mobile/TitleBar/config.ts | 65 +++ .../components/mobile/TitleBar/index.vue | 80 +++ .../components/mobile/TitleBar/property.vue | 115 ++++ .../DiyEditor/components/mobile/index.ts | 61 ++ src/components/DiyEditor/index.vue | 539 ++++++++++++++++++ src/components/DiyEditor/util.ts | 59 ++ src/components/UploadFile/src/UploadImg.vue | 14 +- src/router/modules/remaining.ts | 28 + .../mall/promotion/diy/page/DiyPageForm.vue | 114 ++++ .../mall/promotion/diy/page/decorate.vue | 99 ++++ src/views/mall/promotion/diy/page/index.vue | 189 ++++++ .../diy/template/DiyTemplateForm.vue | 115 ++++ .../mall/promotion/diy/template/decorate.vue | 134 +++++ .../mall/promotion/diy/template/index.vue | 225 ++++++++ 39 files changed, 3425 insertions(+), 5 deletions(-) create mode 100644 src/api/mall/promotion/diy/page.ts create mode 100644 src/api/mall/promotion/diy/template.ts create mode 100644 src/assets/imgs/diy/statusBar.png create mode 100644 src/components/ColorInput/index.vue create mode 100644 src/components/DiyEditor/components/ComponentLibrary.vue create mode 100644 src/components/DiyEditor/components/mobile/Carousel/config.ts create mode 100644 src/components/DiyEditor/components/mobile/Carousel/index.vue create mode 100644 src/components/DiyEditor/components/mobile/Carousel/property.vue create mode 100644 src/components/DiyEditor/components/mobile/Divider/config.ts create mode 100644 src/components/DiyEditor/components/mobile/Divider/index.vue create mode 100644 src/components/DiyEditor/components/mobile/Divider/property.vue create mode 100644 src/components/DiyEditor/components/mobile/NavigationBar/config.ts create mode 100644 src/components/DiyEditor/components/mobile/NavigationBar/index.vue create mode 100644 src/components/DiyEditor/components/mobile/NavigationBar/property.vue create mode 100644 src/components/DiyEditor/components/mobile/NoticeBar/config.ts create mode 100644 src/components/DiyEditor/components/mobile/NoticeBar/index.vue create mode 100644 src/components/DiyEditor/components/mobile/NoticeBar/property.vue create mode 100644 src/components/DiyEditor/components/mobile/PageConfig/config.ts create mode 100644 src/components/DiyEditor/components/mobile/PageConfig/property.vue create mode 100644 src/components/DiyEditor/components/mobile/SearchBar/config.ts create mode 100644 src/components/DiyEditor/components/mobile/SearchBar/index.vue create mode 100644 src/components/DiyEditor/components/mobile/SearchBar/property.vue create mode 100644 src/components/DiyEditor/components/mobile/TabBar/config.ts create mode 100644 src/components/DiyEditor/components/mobile/TabBar/index.vue create mode 100644 src/components/DiyEditor/components/mobile/TabBar/property.vue create mode 100644 src/components/DiyEditor/components/mobile/TitleBar/config.ts create mode 100644 src/components/DiyEditor/components/mobile/TitleBar/index.vue create mode 100644 src/components/DiyEditor/components/mobile/TitleBar/property.vue create mode 100644 src/components/DiyEditor/components/mobile/index.ts create mode 100644 src/components/DiyEditor/index.vue create mode 100644 src/components/DiyEditor/util.ts create mode 100644 src/views/mall/promotion/diy/page/DiyPageForm.vue create mode 100644 src/views/mall/promotion/diy/page/decorate.vue create mode 100644 src/views/mall/promotion/diy/page/index.vue create mode 100644 src/views/mall/promotion/diy/template/DiyTemplateForm.vue create mode 100644 src/views/mall/promotion/diy/template/decorate.vue create mode 100644 src/views/mall/promotion/diy/template/index.vue diff --git a/src/api/mall/promotion/diy/page.ts b/src/api/mall/promotion/diy/page.ts new file mode 100644 index 00000000..255015d2 --- /dev/null +++ b/src/api/mall/promotion/diy/page.ts @@ -0,0 +1,35 @@ +import request from '@/config/axios' + +export interface DiyPageVO { + id?: number + templateId?: number + name: string + remark: string + previewImageUrls: string[] + property: string +} + +// 查询装修页面列表 +export const getDiyPagePage = async (params: any) => { + return await request.get({ url: `/promotion/diy-page/page`, params }) +} + +// 查询装修页面详情 +export const getDiyPage = async (id: number) => { + return await request.get({ url: `/promotion/diy-page/get?id=` + id }) +} + +// 新增装修页面 +export const createDiyPage = async (data: DiyPageVO) => { + return await request.post({ url: `/promotion/diy-page/create`, data }) +} + +// 修改装修页面 +export const updateDiyPage = async (data: DiyPageVO) => { + return await request.put({ url: `/promotion/diy-page/update`, data }) +} + +// 删除装修页面 +export const deleteDiyPage = async (id: number) => { + return await request.delete({ url: `/promotion/diy-page/delete?id=` + id }) +} diff --git a/src/api/mall/promotion/diy/template.ts b/src/api/mall/promotion/diy/template.ts new file mode 100644 index 00000000..72eea41c --- /dev/null +++ b/src/api/mall/promotion/diy/template.ts @@ -0,0 +1,41 @@ +import request from '@/config/axios' + +export interface DiyTemplateVO { + id?: number + name: string + used: boolean + usedTime?: Date + remark: string + previewImageUrls: string[] + property: string +} + +// 查询装修模板列表 +export const getDiyTemplatePage = async (params: any) => { + return await request.get({ url: `/promotion/diy-template/page`, params }) +} + +// 查询装修模板详情 +export const getDiyTemplate = async (id: number) => { + return await request.get({ url: `/promotion/diy-template/get?id=` + id }) +} + +// 新增装修模板 +export const createDiyTemplate = async (data: DiyTemplateVO) => { + return await request.post({ url: `/promotion/diy-template/create`, data }) +} + +// 修改装修模板 +export const updateDiyTemplate = async (data: DiyTemplateVO) => { + return await request.put({ url: `/promotion/diy-template/update`, data }) +} + +// 删除装修模板 +export const deleteDiyTemplate = async (id: number) => { + return await request.delete({ url: `/promotion/diy-template/delete?id=` + id }) +} + +// 使用装修模板 +export const useDiyTemplate = async (id: number) => { + return await request.put({ url: `/promotion/diy-template/use?id=` + id }) +} diff --git a/src/assets/imgs/diy/statusBar.png b/src/assets/imgs/diy/statusBar.png new file mode 100644 index 0000000000000000000000000000000000000000..b85562e4236852358c93161735671f8f0466db71 GIT binary patch literal 8917 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 Y)KD1lT9stKL4Yr5ae1*HB8Gwg2lSJ;0RR91 literal 0 HcmV?d00001 diff --git a/src/components/ColorInput/index.vue b/src/components/ColorInput/index.vue new file mode 100644 index 00000000..abd083a1 --- /dev/null +++ b/src/components/ColorInput/index.vue @@ -0,0 +1,54 @@ + + + + + diff --git a/src/components/DiyEditor/components/ComponentLibrary.vue b/src/components/DiyEditor/components/ComponentLibrary.vue new file mode 100644 index 00000000..8e918fa9 --- /dev/null +++ b/src/components/DiyEditor/components/ComponentLibrary.vue @@ -0,0 +1,196 @@ + + + + + diff --git a/src/components/DiyEditor/components/mobile/Carousel/config.ts b/src/components/DiyEditor/components/mobile/Carousel/config.ts new file mode 100644 index 00000000..6c790186 --- /dev/null +++ b/src/components/DiyEditor/components/mobile/Carousel/config.ts @@ -0,0 +1,44 @@ +import { DiyComponent } from '@/components/DiyEditor/util' + +/** 轮播图属性 */ +export interface CarouselProperty { + // 选择模板 + swiperType: number + // 图片圆角 + borderRadius: number + // 页面边距 + pageMargin: number + // 图片边距 + imageMargin: number + // 分页类型 + pagingType: 'bullets' | 'fraction' | 'progressbar' + // 一行个数 + rowIndividual: number + // 添加图片 + items: CarouselItemProperty[] +} + +export interface CarouselItemProperty { + title: string + imgUrl: string + link: string +} + +// 定义组件 +export const component = { + id: 'Carousel', + name: '轮播图', + icon: 'system-uicons:carousel', + property: { + swiperType: 0, // 选择模板 + borderRadius: 0, // 图片圆角 + pageMargin: 0, // 页面边距 + imageMargin: 0, // 图片边距 + pagingType: 'bullets', // 分页类型 + rowIndividual: 2, // 一行个数 + items: [ + { imgUrl: 'https://static.iocoder.cn/mall/banner-01.jpg' }, + { imgUrl: 'https://static.iocoder.cn/mall/banner-02.jpg' } + ] as CarouselItemProperty[] + } +} as DiyComponent diff --git a/src/components/DiyEditor/components/mobile/Carousel/index.vue b/src/components/DiyEditor/components/mobile/Carousel/index.vue new file mode 100644 index 00000000..e9a0ab39 --- /dev/null +++ b/src/components/DiyEditor/components/mobile/Carousel/index.vue @@ -0,0 +1,75 @@ + + + + diff --git a/src/components/DiyEditor/components/mobile/Carousel/property.vue b/src/components/DiyEditor/components/mobile/Carousel/property.vue new file mode 100644 index 00000000..acaee35f --- /dev/null +++ b/src/components/DiyEditor/components/mobile/Carousel/property.vue @@ -0,0 +1,125 @@ + + + + + diff --git a/src/components/DiyEditor/components/mobile/Divider/config.ts b/src/components/DiyEditor/components/mobile/Divider/config.ts new file mode 100644 index 00000000..9b553604 --- /dev/null +++ b/src/components/DiyEditor/components/mobile/Divider/config.ts @@ -0,0 +1,29 @@ +import { DiyComponent } from '@/components/DiyEditor/util' + +/** 分割线属性 */ +export interface DividerProperty { + // 高度 + height: number + // 线宽 + lineWidth: number + // 边距类型 + paddingType: 'none' | 'horizontal' + // 颜色 + lineColor: string + // 类型 + borderType: 'solid' | 'dashed' | 'dotted' | 'none' +} + +// 定义组件 +export const component = { + id: 'Divider', + name: '分割线', + icon: 'tdesign:component-divider-vertical', + property: { + height: 30, + lineWidth: 1, + paddingType: 'none', + lineColor: '#dcdfe6', + borderType: 'solid' + } +} as DiyComponent diff --git a/src/components/DiyEditor/components/mobile/Divider/index.vue b/src/components/DiyEditor/components/mobile/Divider/index.vue new file mode 100644 index 00000000..f7785043 --- /dev/null +++ b/src/components/DiyEditor/components/mobile/Divider/index.vue @@ -0,0 +1,29 @@ + + + + + diff --git a/src/components/DiyEditor/components/mobile/Divider/property.vue b/src/components/DiyEditor/components/mobile/Divider/property.vue new file mode 100644 index 00000000..3d7be26d --- /dev/null +++ b/src/components/DiyEditor/components/mobile/Divider/property.vue @@ -0,0 +1,80 @@ + + + + + diff --git a/src/components/DiyEditor/components/mobile/NavigationBar/config.ts b/src/components/DiyEditor/components/mobile/NavigationBar/config.ts new file mode 100644 index 00000000..b250f5f1 --- /dev/null +++ b/src/components/DiyEditor/components/mobile/NavigationBar/config.ts @@ -0,0 +1,38 @@ +import { DiyComponent } from '@/components/DiyEditor/util' + +/** 顶部导航栏属性 */ +export interface NavigationBarProperty { + // 页面标题 + title: string + // 页面描述 + description: string + // 顶部导航高度 + navBarHeight: number + // 页面背景颜色 + backgroundColor: string + // 页面背景图片 + backgroundImage: string + // 样式类型：默认 | 沉浸式 + styleType: 'default' | 'immersion' + // 常驻显示 + alwaysShow: boolean + // 是否显示返回按钮 + showGoBack: boolean +} + +// 定义组件 +export const component = { + id: 'NavigationBar', + name: '顶部导航栏', + icon: 'tabler:layout-navbar', + property: { + title: '页面标题', + description: '', + navBarHeight: 35, + backgroundColor: '#f5f5f5', + backgroundImage: '', + styleType: 'default', + alwaysShow: true, + showGoBack: true + } +} as DiyComponent diff --git a/src/components/DiyEditor/components/mobile/NavigationBar/index.vue b/src/components/DiyEditor/components/mobile/NavigationBar/index.vue new file mode 100644 index 00000000..953748c7 --- /dev/null +++ b/src/components/DiyEditor/components/mobile/NavigationBar/index.vue @@ -0,0 +1,60 @@ + + + diff --git a/src/components/DiyEditor/components/mobile/NavigationBar/property.vue b/src/components/DiyEditor/components/mobile/NavigationBar/property.vue new file mode 100644 index 00000000..c4ca4588 --- /dev/null +++ b/src/components/DiyEditor/components/mobile/NavigationBar/property.vue @@ -0,0 +1,63 @@ + + + + + diff --git a/src/components/DiyEditor/components/mobile/NoticeBar/config.ts b/src/components/DiyEditor/components/mobile/NoticeBar/config.ts new file mode 100644 index 00000000..03e7143a --- /dev/null +++ b/src/components/DiyEditor/components/mobile/NoticeBar/config.ts @@ -0,0 +1,39 @@ +import { DiyComponent } from '@/components/DiyEditor/util' + +/** 公告栏属性 */ +export interface NoticeBarProperty { + // 图标地址 + iconUrl: string + // 公告内容列表 + contents: NoticeContentProperty[] + // 背景颜色 + backgroundColor: string + // 文字颜色 + textColor: string +} + +/** 内容属性 */ +export interface NoticeContentProperty { + // 内容文字 + text: string + // 链接地址 + url: string +} + +// 定义组件 +export const component = { + id: 'NoticeBar', + name: '公告栏', + icon: 'ep:bell', + property: { + iconUrl: 'http://mall.yudao.iocoder.cn/static/images/xinjian.png', + contents: [ + { + text: '', + url: '' + } + ], + backgroundColor: '#fff', + textColor: '#333' + } +} as DiyComponent diff --git a/src/components/DiyEditor/components/mobile/NoticeBar/index.vue b/src/components/DiyEditor/components/mobile/NoticeBar/index.vue new file mode 100644 index 00000000..dc360688 --- /dev/null +++ b/src/components/DiyEditor/components/mobile/NoticeBar/index.vue @@ -0,0 +1,26 @@ + + + + + diff --git a/src/components/DiyEditor/components/mobile/NoticeBar/property.vue b/src/components/DiyEditor/components/mobile/NoticeBar/property.vue new file mode 100644 index 00000000..11e7f4b7 --- /dev/null +++ b/src/components/DiyEditor/components/mobile/NoticeBar/property.vue @@ -0,0 +1,77 @@ + + + + + diff --git a/src/components/DiyEditor/components/mobile/PageConfig/config.ts b/src/components/DiyEditor/components/mobile/PageConfig/config.ts new file mode 100644 index 00000000..f8e45e45 --- /dev/null +++ b/src/components/DiyEditor/components/mobile/PageConfig/config.ts @@ -0,0 +1,23 @@ +import { DiyComponent } from '@/components/DiyEditor/util' + +/** 页面设置属性 */ +export interface PageConfigProperty { + // 页面描述 + description: string + // 页面背景颜色 + backgroundColor: string + // 页面背景图片 + backgroundImage: string +} + +// 定义页面组件 +export const component = { + id: 'PageConfig', + name: '页面设置', + icon: 'ep:document', + property: { + description: '', + backgroundColor: '#f5f5f5', + backgroundImage: '' + } +} as DiyComponent diff --git a/src/components/DiyEditor/components/mobile/PageConfig/property.vue b/src/components/DiyEditor/components/mobile/PageConfig/property.vue new file mode 100644 index 00000000..278bc940 --- /dev/null +++ b/src/components/DiyEditor/components/mobile/PageConfig/property.vue @@ -0,0 +1,34 @@ + + + + + diff --git a/src/components/DiyEditor/components/mobile/SearchBar/config.ts b/src/components/DiyEditor/components/mobile/SearchBar/config.ts new file mode 100644 index 00000000..1241748d --- /dev/null +++ b/src/components/DiyEditor/components/mobile/SearchBar/config.ts @@ -0,0 +1,35 @@ +import { DiyComponent } from '@/components/DiyEditor/util' + +/** 搜索框属性 */ +export interface SearchProperty { + height: number // 搜索栏高度 + showScan: boolean // 显示扫一扫 + borderRadius: number // 框体样式 + placeholder: string // 占位文字 + placeholderPosition: PlaceholderPosition // 占位文字位置 + backgroundColor: string // 背景颜色 + borderColor: string // 框体颜色 + textColor: string // 字体颜色 + hotKeywords: string[] // 热词 +} + +// 文字位置 +export type PlaceholderPosition = 'left' | 'center' + +// 定义组件 +export const component = { + id: 'SearchBar', + name: '搜索框', + icon: 'ep:search', + property: { + height: 28, + showScan: false, + borderRadius: 0, + placeholder: '搜索商品', + placeholderPosition: 'left', + backgroundColor: 'rgb(249, 249, 249)', + borderColor: 'rgb(255, 255, 255)', + textColor: 'rgb(150, 151, 153)', + hotKeywords: [] + } +} as DiyComponent diff --git a/src/components/DiyEditor/components/mobile/SearchBar/index.vue b/src/components/DiyEditor/components/mobile/SearchBar/index.vue new file mode 100644 index 00000000..e120405a --- /dev/null +++ b/src/components/DiyEditor/components/mobile/SearchBar/index.vue @@ -0,0 +1,80 @@ + + + + + diff --git a/src/components/DiyEditor/components/mobile/SearchBar/property.vue b/src/components/DiyEditor/components/mobile/SearchBar/property.vue new file mode 100644 index 00000000..9123ebe5 --- /dev/null +++ b/src/components/DiyEditor/components/mobile/SearchBar/property.vue @@ -0,0 +1,100 @@ + + + + + diff --git a/src/components/DiyEditor/components/mobile/TabBar/config.ts b/src/components/DiyEditor/components/mobile/TabBar/config.ts new file mode 100644 index 00000000..4a570a8e --- /dev/null +++ b/src/components/DiyEditor/components/mobile/TabBar/config.ts @@ -0,0 +1,91 @@ +import { DiyComponent } from '@/components/DiyEditor/util' + +/** 底部导航菜单属性 */ +export interface TabBarProperty { + // 选项列表 + items: TabBarItemProperty[] + // 主题 + theme: string + // 样式 + style: TabBarStyle +} + +// 选项属性 +export interface TabBarItemProperty { + name: string // 标签名称 + link: string // 链接 + iconUrl: string // 默认图标链接 + activeIconUrl: string // 选中的图标链接 +} + +// 样式 +export interface TabBarStyle { + // 背景类型 + backgroundType: 'color' | 'img' + // 背景颜色 或 图片链接 + background: string + // 默认颜色 + color: string + // 选中的颜色 + activeColor: string +} + +// 定义组件 +export const component = { + id: 'TabBar', + name: '底部导航', + icon: 'fluent:table-bottom-row-16-filled', + property: { + theme: 'red', + style: { + backgroundType: 'color', + background: '#fff', + color: '#282828', + activeColor: '#fc4141' + }, + items: [ + { + name: '首页', + link: '/', + iconUrl: 'http://mall.yudao.iocoder.cn/static/images/1-001.png', + activeIconUrl: 'http://mall.yudao.iocoder.cn/static/images/1-002.png' + }, + { + name: '分类', + link: '/pages/goods_cate/goods_cate', + iconUrl: 'http://mall.yudao.iocoder.cn/static/images/2-001.png', + activeIconUrl: 'http://mall.yudao.iocoder.cn/static/images/2-002.png' + }, + { + name: '购物车', + link: '/pages/order_addcart/order_addcart', + iconUrl: 'http://mall.yudao.iocoder.cn/static/images/3-001.png', + activeIconUrl: 'http://mall.yudao.iocoder.cn/static/images/3-002.png' + }, + { + name: '我的', + link: '/pages/user/index', + iconUrl: 'http://mall.yudao.iocoder.cn/static/images/4-001.png', + activeIconUrl: 'http://mall.yudao.iocoder.cn/static/images/4-002.png' + } + ] + } +} as DiyComponent + +export const THEME_LIST = [ + { id: 'red', name: '中国红', icon: 'icon-park-twotone:theme', color: '#d10019' }, + { id: 'orange', name: '桔橙', icon: 'icon-park-twotone:theme', color: '#f37b1d' }, + { id: 'gold', name: '明黄', icon: 'icon-park-twotone:theme', color: '#fbbd08' }, + { id: 'green', name: '橄榄绿', icon: 'icon-park-twotone:theme', color: '#8dc63f' }, + { id: 'cyan', name: '天青', icon: 'icon-park-twotone:theme', color: '#1cbbb4' }, + { id: 'blue', name: '海蓝', icon: 'icon-park-twotone:theme', color: '#0081ff' }, + { id: 'purple', name: '姹紫', icon: 'icon-park-twotone:theme', color: '#6739b6' }, + { id: 'brightRed', name: '嫣红', icon: 'icon-park-twotone:theme', color: '#e54d42' }, + { id: 'forestGreen', name: '森绿', icon: 'icon-park-twotone:theme', color: '#39b54a' }, + { id: 'mauve', name: '木槿', icon: 'icon-park-twotone:theme', color: '#9c26b0' }, + { id: 'pink', name: '桃粉', icon: 'icon-park-twotone:theme', color: '#e03997' }, + { id: 'brown', name: '棕褐', icon: 'icon-park-twotone:theme', color: '#a5673f' }, + { id: 'grey', name: '玄灰', icon: 'icon-park-twotone:theme', color: '#8799a3' }, + { id: 'gray', name: '草灰', icon: 'icon-park-twotone:theme', color: '#aaaaaa' }, + { id: 'black', name: '墨黑', icon: 'icon-park-twotone:theme', color: '#333333' } +] diff --git a/src/components/DiyEditor/components/mobile/TabBar/index.vue b/src/components/DiyEditor/components/mobile/TabBar/index.vue new file mode 100644 index 00000000..266a20c5 --- /dev/null +++ b/src/components/DiyEditor/components/mobile/TabBar/index.vue @@ -0,0 +1,58 @@ + + + diff --git a/src/components/DiyEditor/components/mobile/TabBar/property.vue b/src/components/DiyEditor/components/mobile/TabBar/property.vue new file mode 100644 index 00000000..512bb5a8 --- /dev/null +++ b/src/components/DiyEditor/components/mobile/TabBar/property.vue @@ -0,0 +1,161 @@ + + + + + diff --git a/src/components/DiyEditor/components/mobile/TitleBar/config.ts b/src/components/DiyEditor/components/mobile/TitleBar/config.ts new file mode 100644 index 00000000..3d486cc3 --- /dev/null +++ b/src/components/DiyEditor/components/mobile/TitleBar/config.ts @@ -0,0 +1,65 @@ +import { DiyComponent } from '@/components/DiyEditor/util' + +/** 标题栏属性 */ +export interface TitleBarProperty { + // 主标题 + title: string + // 副标题 + description: string + // 标题大小 + titleSize: number + // 描述大小 + descriptionSize: number + // 标题粗细 + titleWeight: number + // 显示位置 + position: 'left' | 'center' + // 描述粗细 + descriptionWeight: number + // 标题颜色 + titleColor: string + // 描述颜色 + descriptionColor: string + // 背景颜色 + backgroundColor: string + // 底部分割线 + showBottomBorder: false + // 查看更多 + more: { + // 是否显示查看更多 + show: false + // 样式选择 + type: 'text' | 'icon' | 'all' + // 自定义文字 + text: string + // 链接 + url: string + } +} + +// 定义组件 +export const component = { + id: 'TitleBar', + name: '标题栏', + icon: 'material-symbols:line-start', + property: { + title: '主标题', + description: '副标题', + titleSize: 16, + descriptionSize: 12, + titleWeight: 400, + position: 'left', + descriptionWeight: 200, + titleColor: 'rgba(50, 50, 51, 10)', + descriptionColor: 'rgba(150, 151, 153, 10)', + backgroundColor: 'rgba(255, 255, 255, 10)', + showBottomBorder: false, + more: { + //查看更多 + show: false, + type: 'icon', + text: '查看更多', + url: '' + } + } +} as DiyComponent diff --git a/src/components/DiyEditor/components/mobile/TitleBar/index.vue b/src/components/DiyEditor/components/mobile/TitleBar/index.vue new file mode 100644 index 00000000..aab65779 --- /dev/null +++ b/src/components/DiyEditor/components/mobile/TitleBar/index.vue @@ -0,0 +1,80 @@ + + + diff --git a/src/components/DiyEditor/components/mobile/TitleBar/property.vue b/src/components/DiyEditor/components/mobile/TitleBar/property.vue new file mode 100644 index 00000000..3e4dac2d --- /dev/null +++ b/src/components/DiyEditor/components/mobile/TitleBar/property.vue @@ -0,0 +1,115 @@ + + + + diff --git a/src/components/DiyEditor/components/mobile/index.ts b/src/components/DiyEditor/components/mobile/index.ts new file mode 100644 index 00000000..c0dc67da --- /dev/null +++ b/src/components/DiyEditor/components/mobile/index.ts @@ -0,0 +1,61 @@ +/* + * 组件注册 + * + * 组件规范： + * 1. 每个子目录就是一个独立的组件，每个目录包括以下三个文件： + * 2. config.ts：组件配置，必选，用于定义组件、组件默认的属性、定义属性的类型 + * 3. index.vue：组件展示，用于展示组件的渲染效果。可以不提供，如 Page（页面设置），只需要属性配置表单即可 + * 4. property.vue：组件属性表单，用于配置组件，必选， + * + * 注： + * 组件ID以config.ts中配置的id为准，与组件目录的名称无关，但还是建议组件目录的名称与组件ID保持一致 + */ + +// 导入组件界面模块 +const viewModules: Record = import.meta.glob('./*/*.vue') +// 导入配置模块 +const configModules: Record = import.meta.glob('./*/config.ts', { eager: true }) + +// 界面模块 +const components = {} +// 组件配置模块 +const componentConfigs = {} + +// 组件界面的类型 +type ViewType = 'index' | 'property' + +/** + * 注册组件的界面模块 + * + * @param componentId 组件ID + * @param configPath 配置模块的文件路径 + * @param viewType 组件界面的类型 + */ +const registerComponentViewModule = ( + componentId: string, + configPath: string, + viewType: ViewType +) => { + const viewPath = configPath.replace('config.ts', `${viewType}.vue`) + const viewModule = viewModules[viewPath] + if (viewModule) { + // 定义异步组件 + components[componentId] = defineAsyncComponent(viewModule) + } +} + +// 注册 +Object.keys(configModules).forEach((modulePath: string) => { + const component = configModules[modulePath].component + const componentId = component?.id + if (componentId) { + // 注册组件 + componentConfigs[componentId] = component + // 注册预览界面 + registerComponentViewModule(componentId, modulePath, 'index') + // 注册属性配置表单 + registerComponentViewModule(`${componentId}Property`, modulePath, 'property') + } +}) + +export { components, componentConfigs } diff --git a/src/components/DiyEditor/index.vue b/src/components/DiyEditor/index.vue new file mode 100644 index 00000000..520cd497 --- /dev/null +++ b/src/components/DiyEditor/index.vue @@ -0,0 +1,539 @@ + + + + diff --git a/src/components/DiyEditor/util.ts b/src/components/DiyEditor/util.ts new file mode 100644 index 00000000..407efa30 --- /dev/null +++ b/src/components/DiyEditor/util.ts @@ -0,0 +1,59 @@ +import { ref, Ref } from 'vue' +import { PageConfigProperty } from '@/components/DiyEditor/components/mobile/PageConfig/config' +import { NavigationBarProperty } from '@/components/DiyEditor/components/mobile/NavigationBar/config' +import { TabBarProperty } from '@/components/DiyEditor/components/mobile/TabBar/config' + +export interface DiyComponent { + id: string + name: string + icon: string + property: T +} + +export interface DiyComponentLibrary { + name: string + extended: boolean + components: string[] +} + +// 页面配置 +export interface PageConfig { + // 页面属性 + page: PageConfigProperty + // 顶部导航栏属性 + navigationBar: NavigationBarProperty + // 底部导航菜单属性 + tabBar: TabBarProperty + // 页面组件列表 + components: PageComponent[] +} +// 页面组件，只保留组件ID，组件属性 +export interface PageComponent extends Pick, 'id' | 'property'> {} + +// 属性表单监听 +export function usePropertyForm(modelValue: T, emit: Function): { formData: Ref } { + const formData = ref() + // 监听属性数据变动 + watch( + () => modelValue, + () => { + formData.value = modelValue + }, + { + deep: true, + immediate: true + } + ) + // 监听表单数据变动 + watch( + () => formData.value, + () => { + emit('update:modelValue', formData.value) + }, + { + deep: true + } + ) + + return { formData } +} diff --git a/src/components/UploadFile/src/UploadImg.vue b/src/components/UploadFile/src/UploadImg.vue index 3cfc0a73..996fe40b 100644 --- a/src/components/UploadFile/src/UploadImg.vue +++ b/src/components/UploadFile/src/UploadImg.vue @@ -18,15 +18,15 @@
- {{ t('action.edit') }} + {{ t('action.edit') }}
- {{ t('action.detail') }} + {{ t('action.detail') }}
-
+
- {{ t('action.del') }} + {{ t('action.del') }}
@@ -81,7 +81,11 @@ const props = defineProps({ fileType: propTypes.array.def(['image/jpeg', 'image/png', 'image/gif']), // 图片类型限制 ==> 非必传（默认为 ["image/jpeg", "image/png", "image/gif"]） height: propTypes.string.def('150px'), // 组件高度 ==> 非必传（默认为 150px） width: propTypes.string.def('150px'), // 组件宽度 ==> 非必传（默认为 150px） - borderradius: propTypes.string.def('8px') // 组件边框圆角 ==> 非必传（默认为 8px） + borderradius: propTypes.string.def('8px'), // 组件边框圆角 ==> 非必传（默认为 8px） + // 是否显示删除按钮 + showDelete: propTypes.bool.def(true), + // 是否显示按钮文字 + showBtnText: propTypes.bool.def(true) }) const { t } = useI18n() // 国际化 const message = useMessage() // 消息弹窗 diff --git a/src/router/modules/remaining.ts b/src/router/modules/remaining.ts index aa260cf1..70dc5b2f 100644 --- a/src/router/modules/remaining.ts +++ b/src/router/modules/remaining.ts @@ -459,6 +459,34 @@ const remainingRouter: AppRouteRecordRaw[] = [ component: () => import('@/views/pay/cashier/index.vue') } ] + }, + { + path: '/diy', + name: 'DiyCenter', + meta: { hidden: true }, + component: Layout, + children: [ + { + path: 'template/decorate/:id', + name: 'DiyTemplateDecorate', + meta: { + title: '模板装修', + noCache: true, + hidden: true + }, + component: () => import('@/views/mall/promotion/diy/template/decorate.vue') + }, + { + path: 'page/decorate/:id', + name: 'DiyPageDecorate', + meta: { + title: '页面装修', + noCache: true, + hidden: true + }, + component: () => import('@/views/mall/promotion/diy/page/decorate.vue') + } + ] } ] diff --git a/src/views/mall/promotion/diy/page/DiyPageForm.vue b/src/views/mall/promotion/diy/page/DiyPageForm.vue new file mode 100644 index 00000000..e0cb18b6 --- /dev/null +++ b/src/views/mall/promotion/diy/page/DiyPageForm.vue @@ -0,0 +1,114 @@ + + diff --git a/src/views/mall/promotion/diy/page/decorate.vue b/src/views/mall/promotion/diy/page/decorate.vue new file mode 100644 index 00000000..76336bc4 --- /dev/null +++ b/src/views/mall/promotion/diy/page/decorate.vue @@ -0,0 +1,99 @@ + + diff --git a/src/views/mall/promotion/diy/page/index.vue b/src/views/mall/promotion/diy/page/index.vue new file mode 100644 index 00000000..6436c2f7 --- /dev/null +++ b/src/views/mall/promotion/diy/page/index.vue @@ -0,0 +1,189 @@ + + + diff --git a/src/views/mall/promotion/diy/template/DiyTemplateForm.vue b/src/views/mall/promotion/diy/template/DiyTemplateForm.vue new file mode 100644 index 00000000..e4289f65 --- /dev/null +++ b/src/views/mall/promotion/diy/template/DiyTemplateForm.vue @@ -0,0 +1,115 @@ + + diff --git a/src/views/mall/promotion/diy/template/decorate.vue b/src/views/mall/promotion/diy/template/decorate.vue new file mode 100644 index 00000000..9c7500b2 --- /dev/null +++ b/src/views/mall/promotion/diy/template/decorate.vue @@ -0,0 +1,134 @@ + + diff --git a/src/views/mall/promotion/diy/template/index.vue b/src/views/mall/promotion/diy/template/index.vue new file mode 100644 index 00000000..dcf13698 --- /dev/null +++ b/src/views/mall/promotion/diy/template/index.vue @@ -0,0 +1,225 @@ + + +