1. 自定义模型

可以快速扩展现有的业务表数据,例如:文章内容字段不满足,可以通过 文章栏目 来绑定模型,还有 会员管理 的 会员扩展信息。

[!tip] 核心设计思想,主从表一对一

通过代码生成器设计好配置表单 导入自定义模型

[!tip] 这里选择的是 文章 类型模型,只会在内容管理模块生效

1.1. 其他数据库导入模型

如果是非mysql数据库,但模型中json的sql项为mysql语法(开启数据库忽略大小写)

  1. 在数据库中手动创建表,表名需要为MDIYMODEL + 代码生成器业务表名,字段和代码生成器中拖拽的保持一致
  2. 将模型json中的sql项置为空串 "sql": "", 再导入模型即可

栏目绑定模型 在栏目下新增文章就会多出一个文章扩展的tab选项卡

1.2. JavaScript 工具类

参考 src/main/webapp/static/mdiy/index.js

[!tip] 具体参考范例中的描述

2. 范例

2.1. 扩展一张表的信息

先通过 代码生成器 拖拽出需要的表单项,导入 自定义模型

基于后台UI规范通过 Tabs 标签页 控件实现

下面代码片段来自 会员插件src/main/webapp/WEB-INF/manager/people/user/form.ftl页面

<script src="${base}/static/mdiy/index.js"></script>

HTML片段

...
<el-tabs v-model="activeName">
    <el-tab-pane label="基本信息" name="基本信息">
    ...
    </el-tab-pane>
    <el-tab-pane label="扩展信息" name="扩展信息">
        <!--关键点1-->
        <div id="peopleUserModel"></div>
    </el-tab-pane>    
</el-tabs>
...

JavaScript片段

<script>
var form = new Vue({
    el: '#form',
    data: function() {
        // data 代码片段
        return {
            //关键点2:定义自定义模型变量
            peopleUserModel: undefined, 
        };
    },
    methods: {
        // save 代码片段
        save: function() {

            // 关键点3、判断自定义模型的表单是否通过校验
            if (that.peopleUserModel && !that.peopleUserModel.validate()) {
                that.activeName = '扩展信息';
                return;
            }

                    //保存用户信息
                    ms.http.post(url, data).then(function(data) {

                        if (data.result) {

                            // 关键点4,自定义模型保存
                            if (that.peopleUserModel) {
                                //将自定义模型的linkId与用户的Id,形成一对一关系
                                that.peopleUserModel.form.linkId = data.data.id;
                                //执行保存请求
                                that.peopleUserModel.save();
                            }
                        }

                    });

        }
    },
    created: function() {
        // created 代码片段
        var that = this;
        //关键点5,加载自定义模型,modelName:模型名称,linkId:
        this.$nextTick(function () {
            ms.mdiy.model.extend("peopleUserModel", { "modelName": "会员信息" }, { linkId: this.form.peopleId }).then(function(obj) {
            //赋值
            that.peopleUserModel = obj;
            });
        }
    }
});
</script>

[!tip] 注意代码片段中提示的 关键点1到5

2.2. 文章内容扩展

文章扩展是另外一种业务场景,是通过 栏目绑定扩展模型,间接的通过业务代码实现文章内容扩展

具体参考 MCms手册常见问题中标签问题 相关案例

Copyright © mingsoft.net 2012-2022 all right reserved,powered by Gitbook该文件修订时间: 2024-03-01 08:43:26

results matching ""

    No results matching ""

    results matching ""

      No results matching ""