Files
medical-mall/pages/mall/admin/design/config.uts
2026-02-02 20:07:37 +08:00

440 lines
10 KiB
Plaintext

/**
* 设计模块页面路由配置与数据
* 将 design.uts 的函数输出转换为页面路由/配置格式
*/
import type { DesignItem, DesignComponent, DesignTemplate } from './design.uts'
/**
* 装修页面列表路由配置
*/
export const designListPageConfig = {
id: 'design-list',
path: '/pages/mall/admin/design/list',
name: '装修列表',
title: '装修管理',
data: [
{
id: 1,
name: '首页装修',
type: 'homepage' as const,
status: 1,
path: '/pages/mall/admin/design/index?tab=homepage',
content: [],
updated_at: '2026-01-30 14:30:00'
},
{
id: 2,
name: '年货节活动页',
type: 'custom' as const,
status: 1,
path: '/pages/mall/admin/design/index?tab=custom',
content: [],
updated_at: '2026-01-28 10:15:00'
}
] as DesignItem[]
}
/**
* 首页装修页面路由配置
*/
export const designHomepagePageConfig = {
id: 'design-homepage',
path: '/pages/mall/admin/design/index?tab=homepage',
name: '首页装修',
title: '首页装修 - 打造吸引人的商城首页',
data: {
id: 'homepage',
name: '首页装修',
type: 'homepage' as const,
status: 1,
content: [
{
id: 'carousel-1',
type: 'carousel' as const,
name: '轮播图',
icon: 'C',
description: '首页顶部轮播图展示',
config: {
autoplay: true,
duration: 5000,
height: 300
}
},
{
id: 'product-1',
type: 'product' as const,
name: '商品展示',
icon: 'P',
description: '热销商品列表',
config: {
count: 8,
columns: 2,
layout: 'grid'
}
}
],
version: '1.0.0',
updated_at: '2026-01-30 14:30:00'
} as DesignItem
}
/**
* 分类页装修页面路由配置
*/
export const designCategoryPageConfig = {
id: 'design-category',
path: '/pages/mall/admin/design/index?tab=category',
name: '分类页装修',
title: '分类页装修 - 为不同分类创建独特展示',
data: [
{
id: 1,
name: '默认分类装修',
type: 'category' as const,
status: 1,
categoryId: 0,
categoryName: '全部分类',
path: '/pages/mall/admin/design/index?tab=category&id=1',
content: [],
updated_at: '2026-01-30 14:30:00'
},
{
id: 2,
name: '热销商品分类',
type: 'category' as const,
status: 0,
categoryId: 1,
categoryName: '推荐分类',
path: '/pages/mall/admin/design/index?tab=category&id=2',
content: [],
updated_at: '2026-01-29 10:15:00'
}
] as DesignItem[]
}
/**
* 商品页装修页面路由配置
*/
export const designProductPageConfig = {
id: 'design-product',
path: '/pages/mall/admin/design/index?tab=product',
name: '商品页装修',
title: '商品页装修 - 自定义商品详情页展示',
data: {
id: 'product',
name: '商品页装修',
type: 'product' as const,
status: 1,
content: [
{
id: 'image-1',
type: 'image' as const,
name: '商品图',
icon: 'I',
description: '商品主图展示'
},
{
id: 'product-info',
type: 'text' as const,
name: '商品信息',
icon: 'T',
description: '商品名称和价格'
}
],
version: '1.0.0',
updated_at: '2026-01-30 14:30:00'
} as DesignItem
}
/**
* 自定义页面路由配置
*/
export const designCustomPageConfig = {
id: 'design-custom',
path: '/pages/mall/admin/design/index?tab=custom',
name: '自定义页面',
title: '自定义页面 - 创建特殊内容页面',
data: [
{
id: 1,
name: '新年促销页',
type: 'custom' as const,
status: 1,
path: '/pages/mall/admin/design/index?tab=custom&id=1',
content: [],
updated_at: '2026-01-28 09:00:00'
}
] as DesignItem[]
}
/**
* 模板库页面路由配置
*/
export const designTemplatePageConfig = {
id: 'design-templates',
path: '/pages/mall/admin/design/index?tab=templates',
name: '模板库',
title: '模板库 - 选择预设装修模板',
data: [
{
id: 1,
name: '电商风格A',
description: '简洁现代的电商布局',
type: 'homepage',
preview: '/static/images/template-a.png',
content: []
},
{
id: 2,
name: '电商风格B',
description: '豪华展示的电商布局',
type: 'homepage',
preview: '/static/images/template-b.png',
content: []
},
{
id: 3,
name: '精品风格',
description: '精品商品展示布局',
type: 'homepage',
preview: '/static/images/template-c.png',
content: []
},
{
id: 4,
name: '商城风格',
description: '完整商城功能布局',
type: 'homepage',
preview: '/static/images/template-d.png',
content: []
}
] as DesignTemplate[]
}
/**
* 组件库页面路由配置
*/
export const designComponentPageConfig = {
id: 'design-components',
path: '/pages/mall/admin/design/index?tab=components',
name: '组件库',
title: '组件库 - 丰富的页面组件',
data: [
{
id: 'image',
type: 'image' as const,
name: '图片组件',
icon: 'I',
description: '展示图片和图片轮播',
componentName: 'ImageComponent',
config: {
defaultWidth: '100%',
defaultHeight: 'auto'
}
},
{
id: 'text',
type: 'text' as const,
name: '文本组件',
icon: 'T',
description: '展示文本内容和段落',
componentName: 'TextComponent'
},
{
id: 'product',
type: 'product' as const,
name: '商品组件',
icon: 'P',
description: '展示商品列表和推荐',
componentName: 'ProductComponent',
config: {
defaultCount: 6,
defaultColumns: 2
}
},
{
id: 'carousel',
type: 'carousel' as const,
name: '轮播组件',
icon: 'C',
description: '图片和内容轮播',
componentName: 'CarouselComponent',
config: {
autoplay: true,
duration: 5000
}
},
{
id: 'divider',
type: 'divider' as const,
name: '分割线',
icon: 'D',
description: '分割不同内容区域',
componentName: 'DividerComponent'
},
{
id: 'spacer',
type: 'spacer' as const,
name: '间距组件',
icon: 'S',
description: '调整元素间距',
componentName: 'SpacerComponent',
config: {
defaultHeight: 16
}
},
{
id: 'button',
type: 'button' as const,
name: '按钮组件',
icon: 'B',
description: '创建点击按钮',
componentName: 'ButtonComponent'
},
{
id: 'form',
type: 'form' as const,
name: '表单组件',
icon: 'F',
description: '收集用户输入数据',
componentName: 'FormComponent'
}
] as DesignComponent[]
}
/**
* 编辑页面路由配置
*/
export const designEditorPageConfig = {
id: 'design-editor',
path: '/pages/mall/admin/design/editor',
name: '装修编辑器',
title: '装修编辑器 - 可视化编辑装修页面',
components: [
{
id: 'canvas',
name: '编辑画布',
description: '拖拽编辑区域'
},
{
id: 'sidebar',
name: '组件侧栏',
description: '可用组件列表'
},
{
id: 'properties',
name: '属性面板',
description: '组件属性编辑'
},
{
id: 'preview',
name: '预览窗口',
description: '实时效果预览'
}
]
}
/**
* 预览页面路由配置
*/
export const designPreviewPageConfig = {
id: 'design-preview',
path: '/pages/mall/design/preview/:id',
name: '装修预览',
title: '装修效果预览',
features: [
'全屏预览',
'响应式展示',
'交互测试',
'性能分析'
]
}
/**
* 所有设计页面路由配置
*/
export const allDesignPageConfigs = [
designListPageConfig,
designHomepagePageConfig,
designCategoryPageConfig,
designProductPageConfig,
designCustomPageConfig,
designTemplatePageConfig,
designComponentPageConfig,
designEditorPageConfig,
designPreviewPageConfig
]
/**
* 根据 tab 获取对应的页面配置
*/
export function getDesignPageConfig(tab: string) {
const configMap: Record<string, any> = {
'homepage': designHomepagePageConfig,
'category': designCategoryPageConfig,
'product': designProductPageConfig,
'custom': designCustomPageConfig,
'templates': designTemplatePageConfig,
'components': designComponentPageConfig,
'editor': designEditorPageConfig,
'preview': designPreviewPageConfig,
'list': designListPageConfig
}
return configMap[tab] || designListPageConfig
}
/**
* 装修页面导航菜单结构
*/
export const designMenuStructure = {
id: 'design',
title: '设计',
icon: '/static/design.svg',
path: '/pages/mall/admin/design/index',
children: [
{
id: 'page-decoration',
title: '页面装修',
children: [
{
id: 'design-homepage',
title: '首页装修',
path: '/pages/mall/admin/design/index?tab=homepage'
},
{
id: 'design-category',
title: '分类页装修',
path: '/pages/mall/admin/design/index?tab=category'
},
{
id: 'design-product',
title: '商品页装修',
path: '/pages/mall/admin/design/index?tab=product'
},
{
id: 'design-custom',
title: '自定义页面',
path: '/pages/mall/admin/design/index?tab=custom'
}
]
},
{
id: 'design-library',
title: '设计库',
children: [
{
id: 'design-templates',
title: '模板库',
path: '/pages/mall/admin/design/index?tab=templates'
},
{
id: 'design-components',
title: '组件库',
path: '/pages/mall/admin/design/index?tab=components'
}
]
}
]
}