add.html 2.4 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980
  1. <template>
  2. <el-card shadow="never" style="border: 0;">
  3. <yun-form
  4. ref="yunform"
  5. @render="onFormRender"
  6. @submit="onSubmit"
  7. @success="onSuccess"
  8. @fail="onFail"
  9. :data="row"
  10. :columns="columns">
  11. <template #default>
  12. {:token_field()}
  13. </template>
  14. <template #pid="{rows}">
  15. <el-form-item label="{:__('管理id')}:" prop="pid">
  16. <span>插槽内容</span>
  17. </el-form-item>
  18. </template>
  19. </yun-form>
  20. </el-card>
  21. </template>
  22. <script>
  23. import form from "@components/Form.js";
  24. export default{
  25. components:{
  26. 'YunForm':form
  27. },
  28. data:{
  29. columns:[
  30. {field:"id",title:"ID",edit:"hidden"},
  31. {field:"user_id",title:"工人id",edit:"number"},
  32. {field:"pid",title:"管理id",edit:"slot",rules:"required"},
  33. {field:"createtime",title:"创建时间"},
  34. ],
  35. row:Yunqi.data.row || {}
  36. },
  37. //页面加载完成时执行
  38. onLoad:function(query){
  39. console.log(query);
  40. },
  41. //页面初始显示或在框架内显示时执行
  42. onShow:function(){
  43. },
  44. //页面在框架内隐藏时执行
  45. onHide:function(){
  46. },
  47. //页面在框架内关闭时执行
  48. onUnload:function(){
  49. },
  50. methods: {
  51. onFormRender:function(rows){
  52. //表单渲染完成后执行
  53. },
  54. onSubmit:function(rows){
  55. //表单提交前执行,返回false可以阻止表单提交
  56. /**
  57. * form常用方法
  58. * this.$refs.yunform.setError(field,message);//聚焦表单项并显示错误信息
  59. * this.$refs.yunform.hideField(field);//隐藏表单项
  60. * this.$refs.yunform.showField(field);//显示表单项
  61. * this.$refs.yunform.setValue(field,value);//为表单项设置值
  62. * this.$refs.yunform.getValue(field);//为获取表单项的值
  63. * this.$refs.yunform.setField(field,key,value);//修改表单json的其他属性值,比如rules,title,searchList等
  64. */
  65. return true;
  66. },
  67. onSuccess:function(response){
  68. //表单提交成功后执行
  69. },
  70. onFail:function(err){
  71. //表单提交失败后执行
  72. }
  73. }
  74. }
  75. </script>
  76. <style>
  77. </style>