自定义页面

对应的组件存放到数据表中

表: lucky_diy_view_util

create table if not exists lucky_diy_view_util
(
    id               int auto_increment
        primary key,
    name             varchar(50)  default ''       not null comment '标识',
    title            varchar(50)  default ''       not null comment '组件名称',
    type             varchar(50)  default 'SYSTEM' not null comment '组件类型',
    value            text                          null comment '配置:json格式',
    addon_name       varchar(50)  default ''       not null comment '插件标识',
    sort             int          default 0        not null comment '排序号',
    support_diy_view varchar(500) default ''       not null comment '支持的自定义页面（为空表示公共组件都支持）',
    max_count        int          default 0        not null comment '限制添加次数',
    is_delete        int          default 0        not null comment '是否可以删除，0 允许，1 禁用',
    icon             varchar(255) default ''       not null comment '组件图标',
    icon_type        int          default 0        not null comment '0图片1图标',
    constraint name
        unique (name)
)

页面设计及组件展示

src\app\model\web\DiyView.php
src\app\shop\view\diy\edit.html
src\public\static\ext\diyview\js\components.js

如何添加新组件

1. 添加组件到数据表中

insert into lucky_diy_view_util (name, title, type, value, addon_name, sort, support_diy_view, max_count, is_delete, icon, icon_type)
values ('test', '测试', 'SYSTEM', '{"test": "test"}', '', 0, '', 0, 0, '', 0);

--- 微信视频号
-- 仅当WechatChannel不存在时添加记录
INSERT INTO lucky_diy_view_util (`name`, `title`, `type`, `value`, `addon_name`, `sort`, `support_diy_view`, `max_count`, `is_delete`, `icon`, `icon_type`)
SELECT 'WechatChannel', '微信视频号', 'SYSTEM', '{  "list": [{ "channelName":"", "finderUserName": "", "avatarImageType": "url", "avatarUrl": "", "videoTitle": "", "coverImageType": "url", "coverUrl": "", "feedId": "",  "feedToken": "",  "viewCount": 0,  "showViewCount": true,  "embedMode": false, "channelType":"wechat"   }],  "rowCount": 2,  "showStyle": "fixed",  "aspectRatio":"16:9",  "titleLineClamp": 1,  "showPlayBtn": true}', '', 100110, '', 0, 0, '/public/static/img/svg/xuanxiangka.svg', 0
WHERE NOT EXISTS (
    SELECT 1 FROM lucky_diy_view_util WHERE name = 'WechatChannel'
);

2. 建立组件的控制器

在 src\app\component\controller 目录下创建对应的控制器文件，处理组件的业务逻辑。

例如：创建 src\app\component\controller\TestController.php 文件，用于处理测试组件的业务逻辑。

3. 建立组件的视图

在 src\app\component\view 目录下创建对应的视图文件，处理组件的前端展示。

例如：创建 src\app\component\view\test.php 文件，用于展示测试组件。

4. 在前端页面中使用组件

在前端页面中使用组件，需要在页面中添加对应的组件标签。

3.1 KiB Raw Blame History Unescape Escape