blog-web/js/vab-formtable.713ab94a.js

1 line
4.1 KiB
JavaScript
Raw Normal View History

2024-05-09 14:47:05 +08:00
"use strict";(self["webpackChunkscui"]=self["webpackChunkscui"]||[]).push([[8879],{6936:function(e,l,t){t.r(l),t.d(l,{default:function(){return m}});var a=t(641);function o(e,l,t,o,d,u){const r=(0,a.g2)("el-alert"),m=(0,a.g2)("el-input"),p=(0,a.g2)("el-form-item"),n=(0,a.g2)("el-time-select"),i=(0,a.g2)("el-table-column"),s=(0,a.g2)("el-option"),c=(0,a.g2)("el-select"),b=(0,a.g2)("el-checkbox"),f=(0,a.g2)("el-switch"),k=(0,a.g2)("sc-form-table"),h=(0,a.g2)("el-button"),F=(0,a.g2)("el-form"),w=(0,a.g2)("el-card"),V=(0,a.g2)("el-main");return(0,a.uX)(),(0,a.Wv)(V,null,{default:(0,a.k6)((()=>[(0,a.bF)(r,{title:"来自AVUE的灵感, 业务会有表单里含有对象数组的可能, 进行封装后进行增删改操作, 并且支持联动form表单的禁用属性",type:"success",style:{"margin-bottom":"20px"}}),(0,a.bF)(w,{shadow:"never"},{default:(0,a.k6)((()=>[(0,a.bF)(F,{ref:"ruleForm",model:d.form,rules:d.rules,"label-width":"100px"},{default:(0,a.k6)((()=>[(0,a.bF)(p,{label:"标题",prop:"title"},{default:(0,a.k6)((()=>[(0,a.bF)(m,{modelValue:d.form.title,"onUpdate:modelValue":l[0]||(l[0]=e=>d.form.title=e)},null,8,["modelValue"])])),_:1}),(0,a.bF)(p,{label:"表格",prop:"list"},{default:(0,a.k6)((()=>[(0,a.bF)(k,{ref:"table",modelValue:d.form.list,"onUpdate:modelValue":l[1]||(l[1]=e=>d.form.list=e),addTemplate:d.addTemplate,"drag-sort":"",placeholder:"暂无数据"},{default:(0,a.k6)((()=>[(0,a.bF)(i,{prop:"time",label:"时间",width:"180"},{default:(0,a.k6)((e=>[(0,a.bF)(n,{modelValue:e.row.time,"onUpdate:modelValue":l=>e.row.time=l},null,8,["modelValue","onUpdate:modelValue"])])),_:1}),(0,a.bF)(i,{prop:"type",label:"类型",width:"180"},{default:(0,a.k6)((e=>[(0,a.bF)(c,{modelValue:e.row.type,"onUpdate:modelValue":l=>e.row.type=l,placeholder:"请选择"},{default:(0,a.k6)((()=>[((0,a.uX)(!0),(0,a.CE)(a.FK,null,(0,a.pI)(d.typeDic,(e=>((0,a.uX)(),(0,a.Wv)(s,{key:e.value,label:e.label,value:e.value},null,8,["label","value"])))),128))])),_:2},1032,["modelValue","onUpdate:modelValue"])])),_:1}),(0,a.bF)(i,{prop:"val",label:"数量","min-width":"180"},{default:(0,a.k6)((e=>[(0,a.bF)(m,{modelValue:e.row.val,"onUpdate:modelValue":l=>e.row.val=l,placeholder:"请输入内容"},null,8,["modelValue","onUpdate:modelValue"])])),_:1}),(0,a.bF)(i,{prop:"open",label:"checked",width:"85",align:"center"},{default:(0,a.k6)((e=>[(0,a.bF)(b,{modelValue:e.row.checked,"onUpdate:modelValue":l=>e.row.checked=l},null,8,["modelValue","onUpdate:modelValue"])])),_:1}),(0,a.bF)(i,{prop:"open",label:"开关",width:"80",align:"center"},{default:(0,a.k6)((e=>[(0,a.bF)(f,{modelValue:e.row.open,"onUpdate:modelValue":l=>e.row.open=l},null,8,["modelValue","onUpdate:modelValue"])])),_:1})])),_:1},8,["modelValue","addTemplate"])])),_:1}),(0,a.bF)(p,null,{default:(0,a.k6)((()=>[(0,a.bF)(h,{type:"primary",onClick:u.submitForm},{default:(0,a.k6)((()=>[(0,a.eW)("保存")])),_:1},8,["onClick"]),(0,a.bF)(h,{onClick:u.resetForm},{default:(0,a.k6)((()=>[(0,a.eW)("重置")])),_:1},8,["onClick"])])),_:1})])),_:1},8,["model","rules"])])),_:1}),(0,a.bF)(w,{shadow:"never",header:"方法",style:{"margin-top":"15px"}},{default:(0,a.k6)((()=>[(0,a.bF)(h,{type:"primary",onClick:u.pushRow},{default:(0,a.k6)((()=>[(0,a.eW)("外部插入行")])),_:1},8,["onClick"]),(0,a.bF)(h,{type:"primary",onClick:u.deleteRow},{default:(0,a.k6)((()=>[(0,a.eW)("外部删除第一行")])),_:1},8,["onClick"])])),_:1})])),_:1})}var d={name:"formtable",data(){return{addTemplate:{time:"",type:"",val:"",open:!0,checked:!1},form:{title:"标题",list:[{time:"09:00",type:"1",val:"100",open:!0,checked:!0},{time:"10:00",type:"0",val:"50",open:!1,checked:!0}]},typeDic:[{label:"全局",value:"0"},{label:"局部",value:"1"}],rules:{title:[{required:!0,message:"请上传",trigger:"blur"}]}}},methods:{submitForm(){this.$refs.ruleForm.validate((e=>{if(!e)return!1;alert("请看控制台输出"),console.log(this.form)}))},resetForm(){this.$refs.ruleForm.resetFields()},pushRow(){const e={time:"18:00",type:"1",val:"0",open:!0,checked:!0};this.$refs.table.pushRow(e)},deleteRow(){this.$refs.table.deleteRow(0)}}},u