| 12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576 |
- <template>
- <el-card shadow="never" style="border: 0;">
- <yun-form
- ref="yunform"
- @render="onFormRender"
- @submit="onSubmit"
- @success="onSuccess"
- @fail="onFail"
- :data="row"
- :columns="columns">
- <template #default>
- {:token_field()}
- </template>
-
- </yun-form>
- </el-card>
- </template>
- <script>
- import form from "@components/Form.js";
- export default{
- components:{
- 'YunForm':form
- },
- data:{
- columns:[
- {field:"id",title:"ID",edit:"hidden"},
- {field:"type",title:"记账类型", edit: {form:'radio',change:'changeType'},rules:"required",searchList:{1:"收入", 2:"支出"} },
- {field: 'type_name',title:__('账变名称'),edit: "select",rules:"required",searchList: Yunqi.data.parentList},
- {field:"bank_account",title:"记账账户",edit:"radio",rules:"required", searchList: Yunqi.data.bankList},
- {field:"change",title:"变动金额",edit:"text",rules:"required"},
- {field:"create_date",title:"记账日期",edit:"date",rules:"required"},
- {field:"remark",title:"备注",edit:"textarea"},
- ],
- row:Yunqi.data.row || {}
- },
-
- methods: {
- changeType:function(data,row){
- //这是监听
- this.$refs.yunform.setValue('type_name','')
- if(data == 1){
- this.$refs.yunform.setField('type_name', 'searchList', Yunqi.data.typeInList);//为表单项设置值
- }else{
- this.$refs.yunform.setField('type_name', 'searchList', Yunqi.data.typeOutList);//为表单项设置值
- }
- },
- onSubmit:function(rows){
- //表单提交前执行,返回false可以阻止表单提交
- /**
- * form常用方法
- * this.$refs.yunform.setError(field,message);//聚焦表单项并显示错误信息
- * this.$refs.yunform.hideField(field);//隐藏表单项
- * this.$refs.yunform.showField(field);//显示表单项
- * this.$refs.yunform.setValue(field,value);//为表单项设置值
- * this.$refs.yunform.getValue(field);//为获取表单项的值
- * this.$refs.yunform.setField(field,key,value);//修改表单json的其他属性值,比如rules,title, searchList 等
- */
- return true;
- },
- onSuccess:function(response){
- //表单提交成功后执行
- },
- onFail:function(err){
- //表单提交失败后执行
- },
- },
- //页面加载完成时执行
- onShow:function(query){
-
- },
- }
- </script>
- <style>
- </style>
|