edit.blade.php 8.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158
  1. {{--
  2. Вьюха: Создание / редактирование веб-формы с конструктором полей
  3. Создана: 2026-05-07
  4. Контроллер: Admin\WebFormController::create() / edit()
  5. Переменные: $form (WebForm — пустая при создании, заполненная при редактировании)
  6. JS-конструктор вынесен в: admin/forms/partials/_form_editor_js.blade.php
  7. Типы полей: text, tel, email, select, textarea, checkbox
  8. Ширина поля: full (100%) / half (50%)
  9. --}}
  10. @extends('admin.layout')
  11. @section('title', $form->exists ? 'Редактировать форму' : 'Новая форма')
  12. @section('content_header')
  13. <div class="d-flex justify-content-between align-items-center">
  14. <h1 class="m-0">{{ $form->exists ? 'Редактировать форму: ' . $form->title : 'Новая форма' }}</h1>
  15. <a href="{{ route('admin.forms.index') }}" class="btn btn-default btn-sm">
  16. <i class="fas fa-arrow-left"></i> Назад
  17. </a>
  18. </div>
  19. @stop
  20. @section('breadcrumb')
  21. <li class="breadcrumb-item"><a href="{{ route('admin.dashboard') }}">Главная</a></li>
  22. <li class="breadcrumb-item"><a href="{{ route('admin.forms.index') }}">Веб-формы</a></li>
  23. <li class="breadcrumb-item active">{{ $form->exists ? 'Редактировать' : 'Создать' }}</li>
  24. @stop
  25. @section('content')
  26. @if($errors->any())
  27. <div class="alert alert-danger">
  28. <ul class="mb-0">
  29. @foreach($errors->all() as $e) <li>{{ $e }}</li> @endforeach
  30. </ul>
  31. </div>
  32. @endif
  33. @if($form->exists)
  34. <form id="formEditor" action="{{ route('admin.forms.update', $form) }}" method="POST">
  35. @method('PUT')
  36. @else
  37. <form id="formEditor" action="{{ route('admin.forms.store') }}" method="POST">
  38. @endif
  39. @csrf
  40. <div class="row">
  41. {{-- Основные настройки --}}
  42. <div class="col-md-8">
  43. <div class="card card-primary card-outline">
  44. <div class="card-header"><h3 class="card-title">Настройки формы</h3></div>
  45. <div class="card-body">
  46. <div class="row">
  47. <div class="col-md-6">
  48. <div class="form-group">
  49. <label>Название <span class="text-danger">*</span></label>
  50. <input type="text" name="title" id="formTitle"
  51. class="form-control @error('title') is-invalid @enderror"
  52. value="{{ old('title', $form->title) }}"
  53. placeholder="Контактная форма" required>
  54. @error('title')<div class="invalid-feedback">{{ $message }}</div>@enderror
  55. </div>
  56. </div>
  57. <div class="col-md-6">
  58. <div class="form-group">
  59. <label>Слаг (уникальный идентификатор) <span class="text-danger">*</span></label>
  60. <input type="text" name="slug" id="formSlug"
  61. class="form-control @error('slug') is-invalid @enderror"
  62. value="{{ old('slug', $form->slug) }}"
  63. placeholder="contact" pattern="[a-z0-9\-_]+" required>
  64. <small class="text-muted">Только строчные буквы, цифры, дефис</small>
  65. @error('slug')<div class="invalid-feedback">{{ $message }}</div>@enderror
  66. </div>
  67. </div>
  68. </div>
  69. <div class="row">
  70. <div class="col-md-8">
  71. <div class="form-group mb-0">
  72. <label>Email для уведомлений о заявках</label>
  73. <input type="email" name="notify_email"
  74. class="form-control @error('notify_email') is-invalid @enderror"
  75. value="{{ old('notify_email', $form->notify_email) }}"
  76. placeholder="manager@example.ru">
  77. @error('notify_email')<div class="invalid-feedback">{{ $message }}</div>@enderror
  78. </div>
  79. </div>
  80. <div class="col-md-4">
  81. <div class="form-group mb-0">
  82. <label>Статус</label>
  83. <div class="mt-2">
  84. <div class="custom-control custom-switch">
  85. <input type="checkbox" class="custom-control-input" id="isActive"
  86. name="is_active" value="1"
  87. {{ old('is_active', $form->is_active ?? true) ? 'checked' : '' }}>
  88. <label class="custom-control-label" for="isActive">Форма активна</label>
  89. </div>
  90. </div>
  91. </div>
  92. </div>
  93. </div>
  94. </div>
  95. </div>
  96. {{-- Конструктор полей --}}
  97. <div class="card card-secondary card-outline">
  98. <div class="card-header d-flex justify-content-between align-items-center">
  99. <h3 class="card-title">Поля формы</h3>
  100. <button type="button" class="btn btn-primary btn-sm" id="addFieldBtn">
  101. <i class="fas fa-plus"></i> Добавить поле
  102. </button>
  103. </div>
  104. <div class="card-body p-0">
  105. <div id="fieldsContainer"></div>
  106. <div id="fieldsEmpty" class="text-center text-muted py-4" style="display:none">
  107. <i class="fas fa-list fa-2x mb-2"></i><br>
  108. Нет полей. Нажмите «Добавить поле».
  109. </div>
  110. </div>
  111. <div class="card-footer">
  112. <small class="text-muted">
  113. <strong>Типы:</strong> text — текст, tel — телефон, email — почта, select — список, textarea — многострочный, checkbox — согласие<br>
  114. <strong>Ширина:</strong> full — полная, half — половина
  115. </small>
  116. </div>
  117. </div>
  118. </div>
  119. {{-- Правая колонка --}}
  120. <div class="col-md-4">
  121. <div class="card card-secondary card-outline">
  122. <div class="card-header"><h3 class="card-title">Использование</h3></div>
  123. <div class="card-body text-muted" style="font-size:13px;line-height:1.9">
  124. <p>Вставьте компонент в Blade-шаблон:</p>
  125. <code id="shortcodeHint">&lt;x-web-form slug="{{ $form->slug ?: 'слаг' }}" /&gt;</code>
  126. <hr>
  127. <p><strong>Checkbox</strong> — одиночный чекбокс-согласие (данные не сохраняются в заявку)</p>
  128. <p><strong>Select</strong> — укажите варианты через Enter</p>
  129. <p class="mb-0"><strong>name</strong> — авто-заполняется из label, можно изменить</p>
  130. </div>
  131. </div>
  132. <div class="card card-secondary card-outline">
  133. <div class="card-body">
  134. <button type="submit" class="btn btn-primary btn-block">
  135. <i class="fas fa-save"></i> Сохранить форму
  136. </button>
  137. </div>
  138. </div>
  139. </div>
  140. </div>
  141. {{-- Скрытое поле — JSON полей, заполняется перед отправкой --}}
  142. <input type="hidden" name="fields_json" id="fieldsJson">
  143. </form>
  144. @stop
  145. @push('js')
  146. @include('admin.forms.partials._form_editor_js')
  147. @endpush