hasmanytable.blade.php 4.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116
  1. <style>
  2. .table-has-many .input-group{flex-wrap: nowrap!important}
  3. .table-has-many th{vertical-align: middle!important;}
  4. .table-has-many td{vertical-align: middle!important;height: 102px;}
  5. .table-has-many .remove{margin-bottom: 0px;}
  6. .table-has-many .fields-group .form-group .remove {margin-bottom: 0px;}
  7. </style>
  8. <div class="row form-group">
  9. <div class="{{$viewClass['label']}} control-label"><label class="control-label pull-right">{!! $label !!}</label></div>
  10. <div class="{{$viewClass['field']}}">
  11. @include('admin::form.error')
  12. <span name="{{$column}}"></span> {{-- 用于显示错误信息 --}}
  13. <div class="has-many-table-{{$columnClass}}" >
  14. <table class="table table-has-many has-many-table-{{$columnClass}}">
  15. <thead>
  16. <tr>
  17. @foreach($headers as $header)
  18. <th>{{ $header }}</th>
  19. @endforeach
  20. <th class="hidden"></th>
  21. @if($options['allowDelete'])
  22. <th></th>
  23. @endif
  24. </tr>
  25. </thead>
  26. <tbody class="has-many-table-{{$columnClass}}-forms">
  27. @foreach($forms as $pk => $form)
  28. <tr class="has-many-table-{{$columnClass}}-form fields-group">
  29. <?php $hidden = ''; ?>
  30. @foreach($form->fields() as $field)
  31. @if (is_a($field, Dcat\Admin\Form\Field\Hidden::class))
  32. <?php $hidden .= $field->render(); ?>
  33. @continue
  34. @endif
  35. <td>{!! $field->setLabelClass(['hidden'])->width(12, 0)->render() !!}</td>
  36. @endforeach
  37. <td class="hidden">{!! $hidden !!}</td>
  38. @if($options['allowDelete'])
  39. <td class="form-group">
  40. <div>
  41. <div class="remove btn btn-white btn-sm pull-right"><i class="feather icon-trash"></i></div>
  42. </div>
  43. </td>
  44. @endif
  45. </tr>
  46. @endforeach
  47. </tbody>
  48. </table>
  49. <template class="{{$columnClass}}-tpl">
  50. <tr class="has-many-table-{{$columnClass}}-form fields-group">
  51. {!! $template !!}
  52. <td class="form-group">
  53. <div>
  54. <div class="remove btn btn-white btn-sm pull-right"><i class="feather icon-trash"></i></div>
  55. </div>
  56. </td>
  57. </tr>
  58. </template>
  59. @if($options['allowCreate'])
  60. <div class="form-group row m-t-10">
  61. <div class="{{$viewClass['field']}}" style="margin-top: 8px">
  62. <div class="add btn btn-primary btn-outline btn-sm"><i class="feather icon-plus"></i>&nbsp;{{ trans('admin.new') }}</div>
  63. </div>
  64. </div>
  65. @endif
  66. </div>
  67. </div>
  68. </div>
  69. {{--<hr style="margin-top: 0px;">--}}
  70. <script>
  71. (function () {
  72. var nestedIndex = {!! $count !!},
  73. container = '.has-many-table-{{ $columnClass }}';
  74. function replaceNestedFormIndex(value) {
  75. return String(value).replace(/{{ $parentKey ?: Dcat\Admin\Form\NestedForm::DEFAULT_KEY_NAME }}/g, nestedIndex);
  76. }
  77. $(document).off('click', container+' .add').on('click', container+' .add', function (e) {
  78. var $con = $(this).closest(container);
  79. var tpl = $con.find('template.{{ $columnClass }}-tpl');
  80. nestedIndex++;
  81. $con.find('.has-many-table-{{ $columnClass }}-forms').append(replaceNestedFormIndex(tpl.html()));
  82. e.preventDefault();
  83. return false
  84. });
  85. $(document).off('click', container+' .remove').on('click', container+' .remove', function () {
  86. var $form = $(this).closest('.has-many-table-{{ $columnClass }}-form');
  87. $form.hide();
  88. $form.find('[required]').prop('required', false);
  89. $form.find('.{{ Dcat\Admin\Form\NestedForm::REMOVE_FLAG_CLASS }}').val(1);
  90. });
  91. })();
  92. </script>