edit.blade.php 4.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293
  1. <div style="margin-top: 10px;" id="banners-app">
  2. <div style="text-align: center;margin-top: 5px;margin-bottom: 10px;font-size: 20px;">
  3. 编辑 - 轮播
  4. </div>
  5. <el-form action="{{route('admin.banner.update',array('id'=>$model->id))}}" method="post" id="form-create">
  6. <!-- 图片 -->
  7. <ui-input-text label="轮播标题" name="title" value="{{$model->title}}" placeholder="请输入轮播标题" maxlength="255" tips="请输入轮播标题" autofocus="true"></ui-input-text>
  8. <ui-file label="轮播图" size="0.5" name="image" :data="{uploadName:'banners'}" imageurl="{{$model->image}}" tips="图片大小建议(686*128)"></ui-file>
  9. <!-- 是否显示 -->
  10. <ui-radio label="是否开启" :params="params" tips="轮播显示"></ui-radio>
  11. <!-- 排序 -->
  12. <ui-input-number label="排序" checked="checked" name="sort" value="{{$model->sort}}" min="1" max="100" tips="控制前台显示顺序"></ui-input-number>
  13. <ui-submit></ui-submit>
  14. </el-form>
  15. </div>
  16. <script type="application/javascript">
  17. var edit_vm=null;
  18. $(function () {
  19. // 注意:Vue组件一定放在jQuery.validator前面验证
  20. edit_vm= new Vue({
  21. el: '#banners-app',
  22. data :function () {
  23. return {
  24. params: {
  25. // 注意:group和attr连个属性都不能省略 就算为空
  26. group: {},
  27. attr: {
  28. name: 'show', // 当前checkbox框的name属性 【必填】
  29. radioCheck:{{$model->show}}, // 当前选中项 int | string 【必填】
  30. label: 'el-radio-button', // 当前样式 默认 el-radio 样式 【非必填】
  31. radios: [ // 每个checkbox 就是一个json对象 【必填】
  32. {
  33. value:0, // 当前选中时值也就是value属性的值 【必填】
  34. label: '关闭', // 当前提示文字 【必填】
  35. disable: false // 是否禁止点击 默认:false 不禁止
  36. },
  37. {
  38. value:1, // 当前选中时值也就是value属性的值 【必填】
  39. label: '开启', // 当前提示文字 【必填】
  40. disable: false // 是否禁止点击 默认:false 不禁止
  41. }
  42. ]
  43. }
  44. }
  45. };
  46. },
  47. methods: {
  48. },
  49. });
  50. jQuery.validator.setDefaults({
  51. debug: false, // 调试模式true不会提交,false允许提交
  52. success: "success", // 匹配成功的class样式名称
  53. errorElement: 'div' // 兼容el标签时使用(兼容el Vue组件label.error标签问题)
  54. });
  55. // 前台数据验证 验证需要设置window.form全局变量
  56. window.form = $('#form-create').validate({
  57. rules: {
  58. image: {
  59. required: true,
  60. maxlength: 255,
  61. normalizer: function ( value ) {
  62. return $.trim(value);
  63. }
  64. },
  65. // link: {
  66. // required: true,
  67. // maxlength: 255,
  68. // normalizer: function ( value ) {
  69. // return $.trim(value);
  70. // }
  71. // },
  72. show: {
  73. required: true
  74. },
  75. sort: {
  76. required: true,
  77. normalizer: function ( value ) {
  78. return $.trim(value);
  79. }
  80. }
  81. }
  82. });
  83. // 编辑保存变量
  84. window.formDatum = $('form').serialize();
  85. });
  86. window.top.editVmItem=function (row){
  87. edit_vm.setGoods(row);
  88. }
  89. </script>
  90. @include('layouts.admin.form_script')