index.html 3.1 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889
  1. <template>
  2. <el-card shadow="never">
  3. <yun-table
  4. :columns="columns"
  5. ref="yuntable"
  6. @render="onTableRender"
  7. toolbar="refresh,add,edit,del"
  8. :auth="{
  9. add:{:$auth->check('app\\admin\\controller\\shop\\CustomerSpec','add')},
  10. edit:{:$auth->check('app\\admin\\controller\\shop\\CustomerSpec','edit')},
  11. del:{:$auth->check('app\\admin\\controller\\shop\\CustomerSpec','del')},
  12. multi:{:$auth->check('app\\admin\\controller\\shop\\CustomerSpec','multi')},
  13. }"
  14. :extend="extend">
  15. </yun-table>
  16. </el-card>
  17. </template>
  18. <script>
  19. import table from "@components/Table.js";
  20. export default{
  21. components:{
  22. 'YunTable':table
  23. },
  24. data:{
  25. extend:{
  26. index_url: 'shop/customer_spec/index',
  27. add_url: 'shop/customer_spec/add',
  28. edit_url: 'shop/customer_spec/edit',
  29. del_url: 'shop/customer_spec/del',
  30. multi_url: 'shop/customer_spec/multi',
  31. },
  32. columns:[
  33. {checkbox: true,selectable:function (row,index){
  34. //可以根据业务需求返回false让某些行不可选中
  35. return true;
  36. }},
  37. {field:"id",title:"主键",operate:false},
  38. {field:"customer_id",title:"客户ID"},
  39. {field:"variety",title:"品种",operate:false},
  40. {field:"specs",title:"品种规格",operate:false},
  41. {field:"create_time",title:"创建时间",operate:"daterange",formatter:Yunqi.formatter.datetime},
  42. {field:"update_time",title:"修改时间",operate: false,formatter:Yunqi.formatter.datetime},
  43. {
  44. field: 'operate',
  45. title: __('操作'),
  46. width:130,
  47. action:{
  48. edit:function(row){
  49. //可以根据业务需求返回false让按钮不显示
  50. return true
  51. },
  52. del:true,
  53. }
  54. }
  55. ]
  56. },
  57. //页面加载完成时执行
  58. onLoad:function(query){
  59. console.log(query);
  60. },
  61. //页面初始显示或在框架内显示时执行
  62. onShow:function(){
  63. },
  64. //页面在框架内隐藏时执行
  65. onHide:function(){
  66. },
  67. //页面在框架内关闭时执行
  68. onUnload:function(){
  69. },
  70. methods: {
  71. onTableRender:function(list){
  72. //表格渲染完成后执行
  73. /**
  74. * table常用方法
  75. * this.$refs.yuntable.reset();//重新渲染整个组件,当columns修改时,需要重新渲染表格才能生效,可以执行该方法。
  76. * this.$refs.yuntable.reload();//保持当前的page,重新获取数据
  77. * this.$refs.yuntable.submit();//返回第一页,重新获取数据
  78. * this.$refs.yuntable.expandAllTree();//树形表格展开所有节点
  79. * this.$refs.yuntable.expandTree(topid);//树形表格展开指定节点
  80. */
  81. }
  82. }
  83. }
  84. </script>
  85. <style>
  86. </style>