1 line
6.9 KiB
JavaScript
1 line
6.9 KiB
JavaScript
|
"use strict";(self["webpackChunkscui"]=self["webpackChunkscui"]||[]).push([[7193],{7826:function(e,l,a){a.r(l),a.d(l,{default:function(){return m}});var t=a(641),n=a(2644);function o(e,l,a,o,i,s){const r=(0,t.g2)("el-timeline-item"),m=(0,t.g2)("el-timeline"),u=(0,t.g2)("el-alert"),c=(0,t.g2)("el-card"),d=(0,t.g2)("el-button"),p=(0,t.g2)("el-col"),b=(0,t.g2)("sc-form"),f=(0,t.g2)("el-row"),g=(0,t.g2)("el-main");return(0,t.uX)(),(0,t.Wv)(g,null,{default:(0,t.k6)((()=>[(0,t.bF)(f,{gutter:15},{default:(0,t.k6)((()=>[(0,t.bF)(p,{lg:6},{default:(0,t.k6)((()=>[(0,t.bF)(c,{shadow:"never",header:"处理逻辑说明"},{default:(0,t.k6)((()=>[(0,t.bF)(m,null,{default:(0,t.k6)((()=>[(0,t.bF)(r,{timestamp:"两者数据并无顺序要求,只是获取表单值时需要自行设置loading"},{default:(0,t.k6)((()=>[(0,t.eW)("1.远程获取表单配置参数和表单的值")])),_:1}),(0,t.bF)(r,{timestamp:"构建form对象, 循环渲染对应组件, 获取远程选项数据. 完成前组件将由骨架代替"},{default:(0,t.k6)((()=>[(0,t.eW)("2.根据配置构建表单组件")])),_:1}),(0,t.bF)(r,{timestamp:"合并form对象和表单值"},{default:(0,t.k6)((()=>[(0,t.eW)("3.给表单赋值")])),_:1})])),_:1}),(0,t.bF)(u,{title:"当前版本为预览版本,并未在正式项目中实施,请谨慎使用. 更多配置以及图形化编辑器正在路上.",type:"warning","show-icon":""})])),_:1}),(0,t.bF)(c,{shadow:"never",header:"双向绑定"},{default:(0,t.k6)((()=>[(0,t.bF)(d,{type:"primary",onClick:s.setName},{default:(0,t.k6)((()=>[(0,t.eW)("改变输入框的值")])),_:1},8,["onClick"]),(0,t.bF)(d,{type:"primary",onClick:s.setConfig},{default:(0,t.k6)((()=>[(0,t.eW)("改变指定栅格配置")])),_:1},8,["onClick"])])),_:1})])),_:1}),(0,t.bF)(p,{lg:12},{default:(0,t.k6)((()=>[(0,t.bF)(c,{shadow:"never",header:"动态表单渲染器"},{default:(0,t.k6)((()=>[(0,t.bF)(b,{ref:"formref",config:i.config,modelValue:i.form,"onUpdate:modelValue":l[0]||(l[0]=e=>i.form=e),loading:i.loading},{default:(0,t.k6)((()=>[(0,t.bF)(d,{type:"primary",onClick:s.save},{default:(0,t.k6)((()=>[(0,t.eW)("保 存")])),_:1},8,["onClick"]),(0,t.bF)(d,{onClick:s.reset},{default:(0,t.k6)((()=>[(0,t.eW)("重 置")])),_:1},8,["onClick"])])),_:1},8,["config","modelValue","loading"])])),_:1})])),_:1}),(0,t.bF)(p,{lg:6},{default:(0,t.k6)((()=>[(0,t.bF)(c,{shadow:"never",header:"表单输出"},{default:(0,t.k6)((()=>[(0,t.Lk)("pre",null,(0,n.v_)(i.form),1)])),_:1})])),_:1})])),_:1})])),_:1})}var i={name:"formRender",data(){return{loading:!1,config:{},form:{}}},mounted(){const e={labelWidth:"130px",labelPosition:"right",size:"medium",formItems:[{label:"ElementPlus",component:"title"},{label:"输入框",name:"name",value:"",component:"input",options:{maxlength:"20",placeholder:"Activity name"},rules:[{required:!0,message:"Please input Activity name",trigger:"blur"}],requiredHandle:"$.required==true"},{label:"栅格(12/24)",name:"name2",value:"",component:"input",span:12,options:{placeholder:"span: 12"}},{label:"栅格(12/24)",name:"name3",value:"",component:"input",span:12,options:{placeholder:"span: 12"}},{label:"选择器(多选)",name:"select",value:"",component:"select",span:24,options:{remote:{api:`${this.$CONFIG.API_URL}/system/dic/get`,data:{name:"a"}},multiple:!0,items:[{label:"选项1",value:"1"},{label:"选项2",value:"2"}]},rules:[{required:!0,message:"Please input Activity name",trigger:"change"}],requiredHandle:"$.required==true"},{label:"选择器(单选)",name:"select2",value:"",component:"select",span:24,options:{remote:{api:`${this.$CONFIG.API_URL}/system/dic/get`,data:{name:"b"}},items:[{label:"选项1",value:"1"},{label:"选项2",value:"2"}]}},{label:"级联选择器",name:"cascader",value:"",component:"cascader",span:24,options:{items:[{label:"Guide",value:"guide",children:[{label:"Disciplines",value:"disciplines"},{label:"Consistency",value:"consistency"}]},{label:"Resource",value:"resource",children:[{label:"Axure Components",value:"axure"},{label:"Sketch Templates",value:"sketch"},{label:"Design Documentation",value:"docs"}]},{label:"Component",val
|