使用“铭软(企业版)“开发官网体验(四)-*---表单的编写

使用的是付费版企业版

自定义-自定义业务,可以完成前端用户的表单数据的采集工作,点击数据预览可以查看到对应的数据,
我的建议是,不要犹豫,直接按照文档

http://doc.mingsoft.net/plugs/zi-ding-yi-cha-jian/ye-wu-kai-fa/zi-ding-yi-biao-dan.html

我举一个简单的例子,
用户自己创建一个表单.

  <div class="ProductCenterContent">
                <div class="contentFormProduct">

                    <el-form ref="formProduct" :model="formProduct" :rules="rulesProduct">
                        <el-form-item label="产品编码查询" prop="productcode">
                            <span class="required-label">*</span>
                            <el-input v-model="formProduct.productcode" ></el-input>
                          <div class="submitBtnPosition">  <el-button type="primary" class="submitBtn" @click="saveProduct"
                                       >查询</el-button>
                          </div>
                        </el-form-item>
                    </el-form>
                </div>
        </div>

data中的变量

 formProduct:{
                modelName: '查询产品真伪',
                productcode:'',
            },
            rulesProduct: {
                // 产品编码
                productcode: [
                    {
                        "required": true,
                        "message": "产品编码不能为空"
                    },
                    {"min": 5, "max": 255, "message": "联系方式长度必须为5-255"}
                ],
            },

methods中的方法

 saveProduct: function () {
                var that = this;
                var url = "/mdiy/form/data/save.do"
                if (that.formProduct.id > 0) {
                    url = "/mdiy/form/data/update.do";
                }
                that.formProduct.modelName = "查询产品真伪"; //modelName需要填写自己的模型昵称
                this.$refs.formProduct.validate(function (valid) {
                    if (valid) {
                        that.loadingProduct = true;
                        var formProduct = JSON.parse(JSON.stringify(that.formProduct));
                        ms.http.post(url, formProduct).then(function (res) {
                            if (res.result) {
                                that.$notify({
                                    title: "成功",
                                    message: "产品为正品!",
                                    type: 'success'
                                });

                                that.$refs.formProduct.resetFields(); //清空表单
                            } else {
                                that.$notify({
                                    title: "错误",
                                    message: res.msg,
                                    type: 'warning'
                                });
                            }

                            that.loadingProduct = false;
                        }).catch(function (err) {
                            console.err(err);
                            that.loadingProduct = false;
                        });
                    } else {
                        return false;
                    }
                })
            },

这里面除了定义的变量以外,其他的格式都是固定的,不懂,直接抄上,先得跑起来,在理解.

创建模型,让系统认识我们的表单,能够存储收集的数据.

https://www.mingsoft.net/

免费试用,微信扫码登录


直接新建业务表

表单组件,关注的不是样式,是表单的字段的类型,每一个字段应该对应的后端存储的字段名.
要跟在form表单中写的字段的名字一致


我的html中是productcode,写了之后会自动变成全部大写的,这个是正确的,可以获取到的

将代码拷贝,复制代码

点击保存,就可以了,之后就是进行测试了,没什么诀窍,就是

 that.formProduct.modelName = "查询产品真伪"; //modelName需要填写自己的模型昵称

模型的名字一定要与表单的名字是相同的,
创建表单的时候变量的名字一定要相同

v-model="formProduct.productcode"