Commit e9f19836bda65271788be6a9032892d9e59ed41c
Exists in
master
Merge branch 'master' of http://gitlab.nologostudio.ru/alarionov/rekamore-su
Showing 1 changed file Inline Diff
resources/views/admin/education/form.blade.php
1 | @csrf | ||
2 | 1 | ||
3 | @method('PUT') | ||
4 | <div class="px-4 py-3 mb-8 bg-white rounded-lg shadow-md dark:bg-gray-800"> | 2 | <div class="px-4 py-3 mb-8 bg-white rounded-lg shadow-md dark:bg-gray-800"> |
5 | <form method="POST" action="{{ route('admin.education.update', ['education' => $education->id]) }}" enctype="multipart/form-data"> | 3 | <form method="POST" action="{{ route('admin.education.update', ['education' => $education->id]) }}" enctype="multipart/form-data"> |
4 | @csrf | ||
5 | |||
6 | @method('PUT') | ||
6 | <label class="block text-sm"> | 7 | <label class="block text-sm"> |
7 | <span class="text-gray-700 dark:text-gray-400">Название учебного заведения</span> | 8 | <span class="text-gray-700 dark:text-gray-400">Название учебного заведения</span> |
8 | <input name="name" id="name" | 9 | <input name="name" id="name" |
9 | class="block w-full mt-1 text-sm dark:border-gray-600 dark:bg-gray-700 focus:border-purple-400 focus:outline-none focus:shadow-outline-purple dark:text-gray-300 dark:focus:shadow-outline-gray form-input" | 10 | class="block w-full mt-1 text-sm dark:border-gray-600 dark:bg-gray-700 focus:border-purple-400 focus:outline-none focus:shadow-outline-purple dark:text-gray-300 dark:focus:shadow-outline-gray form-input" |
10 | placeholder="Название учебного заведения" value="{{ old('name') ?? $education->name ?? '' }}" | 11 | placeholder="Название учебного заведения" value="{{ old('name') ?? $education->name ?? '' }}" |
11 | /> | 12 | /> |
12 | @error('name') | 13 | @error('name') |
13 | <span class="text-xs text-red-600 dark:text-red-400"> | 14 | <span class="text-xs text-red-600 dark:text-red-400"> |
14 | {{ $message }} | 15 | {{ $message }} |
15 | </span> | 16 | </span> |
16 | @enderror | 17 | @enderror |
17 | </label><br> | 18 | </label><br> |
18 | 19 | ||
19 | <label class="block text-sm"> | 20 | <label class="block text-sm"> |
20 | <span class="text-gray-700 dark:text-gray-400">Текст</span> | 21 | <span class="text-gray-700 dark:text-gray-400">Текст</span> |
21 | <textarea class="block w-full mt-1 text-sm dark:text-gray-300 dark:border-gray-600 dark:bg-gray-700 form-textarea focus:border-purple-400 focus:outline-none focus:shadow-outline-purple dark:focus:shadow-outline-gray ckeditor_" name="text" placeholder="Текст (html)" required | 22 | <textarea class="block w-full mt-1 text-sm dark:text-gray-300 dark:border-gray-600 dark:bg-gray-700 form-textarea focus:border-purple-400 focus:outline-none focus:shadow-outline-purple dark:focus:shadow-outline-gray ckeditor_" name="text" placeholder="Текст (html)" required |
22 | rows="10">{{ old('text') ?? $education->text ?? '' }}</textarea> | 23 | rows="10">{{ old('text') ?? $education->text ?? '' }}</textarea> |
23 | @error('text') | 24 | @error('text') |
24 | <span class="text-xs text-red-600 dark:text-red-400"> | 25 | <span class="text-xs text-red-600 dark:text-red-400"> |
25 | {{ $message }} | 26 | {{ $message }} |
26 | </span> | 27 | </span> |
27 | @enderror | 28 | @enderror |
28 | </label><br> | 29 | </label><br> |
29 | 30 | ||
30 | <label class="block text-sm"> | 31 | <label class="block text-sm"> |
31 | <span class="text-gray-700 dark:text-gray-400">Картинка</span> | 32 | <span class="text-gray-700 dark:text-gray-400">Картинка</span> |
32 | <input type="file" class="block w-full mt-1 text-sm dark:border-gray-600 dark:bg-gray-700 | 33 | <input type="file" class="block w-full mt-1 text-sm dark:border-gray-600 dark:bg-gray-700 |
33 | focus:border-purple-400 focus:outline-none focus:shadow-outline-purple | 34 | focus:border-purple-400 focus:outline-none focus:shadow-outline-purple |
34 | dark:text-gray-300 dark:focus:shadow-outline-gray form-input" | 35 | dark:text-gray-300 dark:focus:shadow-outline-gray form-input" |
35 | id="image" name="image" accept="image/png, image/jpeg"> | 36 | id="image" name="image" accept="image/png, image/jpeg"> |
36 | @error('image') | 37 | @error('image') |
37 | <span class="text-xs text-red-600 dark:text-red-400"> | 38 | <span class="text-xs text-red-600 dark:text-red-400"> |
38 | {{ $message }} | 39 | {{ $message }} |
39 | </span> | 40 | </span> |
40 | @enderror | 41 | @enderror |
41 | @isset($education->image) | 42 | @isset($education->image) |
42 | <img src="{{asset(Storage::url($education->image))}}" width="100px"/> | 43 | <img src="{{asset(Storage::url($education->image))}}" width="100px"/> |
43 | @endisset | 44 | @endisset |
44 | </label><br> | 45 | </label><br> |
45 | 46 | ||
46 | <hr> | 47 | <hr> |
47 | <h5 class="text-gray-700 dark:text-gray-400">Контакты: </h5> | 48 | <h5 class="text-gray-700 dark:text-gray-400">Контакты: </h5> |
48 | <label class="block text-sm"> | 49 | <label class="block text-sm"> |
49 | <span class="text-gray-700 dark:text-gray-400">Адрес</span> | 50 | <span class="text-gray-700 dark:text-gray-400">Адрес</span> |
50 | <input name="address" id="address" | 51 | <input name="address" id="address" |
51 | class="block w-full mt-1 text-sm dark:border-gray-600 dark:bg-gray-700 focus:border-purple-400 focus:outline-none focus:shadow-outline-purple dark:text-gray-300 dark:focus:shadow-outline-gray form-input" | 52 | class="block w-full mt-1 text-sm dark:border-gray-600 dark:bg-gray-700 focus:border-purple-400 focus:outline-none focus:shadow-outline-purple dark:text-gray-300 dark:focus:shadow-outline-gray form-input" |
52 | placeholder="Адрес" value="{{ old('address') ?? $education->address ?? '' }}" | 53 | placeholder="Адрес" value="{{ old('address') ?? $education->address ?? '' }}" |
53 | /> | 54 | /> |
54 | @error('address') | 55 | @error('address') |
55 | <span class="text-xs text-red-600 dark:text-red-400"> | 56 | <span class="text-xs text-red-600 dark:text-red-400"> |
56 | {{ $message }} | 57 | {{ $message }} |
57 | </span> | 58 | </span> |
58 | @enderror | 59 | @enderror |
59 | </label><br> | 60 | </label><br> |
60 | 61 | ||
61 | <label class="block text-sm"> | 62 | <label class="block text-sm"> |
62 | <span class="text-gray-700 dark:text-gray-400">Email</span> | 63 | <span class="text-gray-700 dark:text-gray-400">Email</span> |
63 | <input name="email" id="email" | 64 | <input name="email" id="email" |
64 | class="block w-full mt-1 text-sm dark:border-gray-600 dark:bg-gray-700 focus:border-purple-400 focus:outline-none focus:shadow-outline-purple dark:text-gray-300 dark:focus:shadow-outline-gray form-input" | 65 | class="block w-full mt-1 text-sm dark:border-gray-600 dark:bg-gray-700 focus:border-purple-400 focus:outline-none focus:shadow-outline-purple dark:text-gray-300 dark:focus:shadow-outline-gray form-input" |
65 | placeholder="Email" value="{{ old('email') ?? $education->email ?? '' }}" | 66 | placeholder="Email" value="{{ old('email') ?? $education->email ?? '' }}" |
66 | /> | 67 | /> |
67 | @error('email') | 68 | @error('email') |
68 | <span class="text-xs text-red-600 dark:text-red-400"> | 69 | <span class="text-xs text-red-600 dark:text-red-400"> |
69 | {{ $message }} | 70 | {{ $message }} |
70 | </span> | 71 | </span> |
71 | @enderror | 72 | @enderror |
72 | </label><br> | 73 | </label><br> |
73 | 74 | ||
74 | <label class="block text-sm"> | 75 | <label class="block text-sm"> |
75 | <span class="text-gray-700 dark:text-gray-400">Телефон</span> | 76 | <span class="text-gray-700 dark:text-gray-400">Телефон</span> |
76 | <input name="telephone" id="telephone" | 77 | <input name="telephone" id="telephone" |
77 | class="block w-full mt-1 text-sm dark:border-gray-600 dark:bg-gray-700 focus:border-purple-400 focus:outline-none focus:shadow-outline-purple dark:text-gray-300 dark:focus:shadow-outline-gray form-input" | 78 | class="block w-full mt-1 text-sm dark:border-gray-600 dark:bg-gray-700 focus:border-purple-400 focus:outline-none focus:shadow-outline-purple dark:text-gray-300 dark:focus:shadow-outline-gray form-input" |
78 | placeholder="Телефон" value="{{ old('telephone') ?? $education->telephone ?? '' }}" | 79 | placeholder="Телефон" value="{{ old('telephone') ?? $education->telephone ?? '' }}" |
79 | /> | 80 | /> |
80 | @error('telephone') | 81 | @error('telephone') |
81 | <span class="text-xs text-red-600 dark:text-red-400"> | 82 | <span class="text-xs text-red-600 dark:text-red-400"> |
82 | {{ $message }} | 83 | {{ $message }} |
83 | </span> | 84 | </span> |
84 | @enderror | 85 | @enderror |
85 | </label><br> | 86 | </label><br> |
86 | 87 | ||
87 | <div class="flex flex-col flex-wrap mb-4 space-y-4 md:flex-row md:items-end md:space-x-4"> | 88 | <div class="flex flex-col flex-wrap mb-4 space-y-4 md:flex-row md:items-end md:space-x-4"> |
88 | <div> | 89 | <div> |
89 | <button type="submit" class="px-3 py-1 text-sm font-medium leading-5 text-white transition-colors duration-150 bg-purple-600 border border-transparent rounded-md active:bg-purple-600 hover:bg-purple-700 focus:outline-none focus:shadow-outline-purple"> | 90 | <button type="submit" class="px-3 py-1 text-sm font-medium leading-5 text-white transition-colors duration-150 bg-purple-600 border border-transparent rounded-md active:bg-purple-600 hover:bg-purple-700 focus:outline-none focus:shadow-outline-purple"> |
90 | Сохранить | 91 | Сохранить |
91 | </button> | 92 | </button> |
92 | <a href="{{ route('admin.education.index') }}" | 93 | <a href="{{ route('admin.education.index') }}" |
93 | class="px-3 py-1 text-sm font-medium leading-5 text-white transition-colors duration-150 bg-purple-600 border border-transparent rounded-md active:bg-purple-600 hover:bg-purple-700 focus:outline-none focus:shadow-outline-purple" | 94 | class="px-3 py-1 text-sm font-medium leading-5 text-white transition-colors duration-150 bg-purple-600 border border-transparent rounded-md active:bg-purple-600 hover:bg-purple-700 focus:outline-none focus:shadow-outline-purple" |
94 | style="display: -webkit-inline-box; height: 30px!important;" | 95 | style="display: -webkit-inline-box; height: 30px!important;" |
95 | >Назад</a> | 96 | >Назад</a> |
96 | </div> | 97 | </div> |
97 | </div> | 98 | </div> |
98 | </form> | 99 | </form> |
99 | 100 | ||
100 | @isset($education) | 101 | @isset($education) |
101 | <div class="tabs_ js_tabs px-4 py-3 bg-white rounded-lg shadow-md dark:bg-gray-800"> | 102 | <div class="tabs_ js_tabs px-4 py-3 bg-white rounded-lg shadow-md dark:bg-gray-800"> |
102 | <h2 class="my-6 text-2xl font-semibold text-gray-700 dark:text-gray-200"> | 103 | <h2 class="my-6 text-2xl font-semibold text-gray-700 dark:text-gray-200"> |
103 | Программы образования | 104 | Программы образования |
104 | </h2> | 105 | </h2> |
105 | <form class="tabs__form js_tabs_form" method="GET" action="{{ route('admin.add-program-education') }}"> | 106 | <form class="tabs__form js_tabs_form" method="GET" action="{{ route('admin.add-program-education') }}"> |
106 | <label class="tabs__label block mt-4 text-sm"> | 107 | <label class="tabs__label block mt-4 text-sm"> |
107 | <div class="relative text-gray-500 focus-within:text-purple-600"> | 108 | <div class="relative text-gray-500 focus-within:text-purple-600"> |
108 | <input type="hidden" name="id" value="{{ $education->id }}"/> | 109 | <input type="hidden" name="id" value="{{ $education->id }}"/> |
109 | <input name="level" class="tabs__input js_tabs_input block w-full pr-20 text-sm text-black dark:text-gray-300 dark:border-gray-600 dark:bg-gray-700 focus:border-purple-400 focus:outline-none focus:shadow-outline-purple dark:focus:shadow-outline-gray form-input" placeholder="Введите название таба"/> | 110 | <input name="level" class="tabs__input js_tabs_input block w-full pr-20 text-sm text-black dark:text-gray-300 dark:border-gray-600 dark:bg-gray-700 focus:border-purple-400 focus:outline-none focus:shadow-outline-purple dark:focus:shadow-outline-gray form-input" placeholder="Введите название таба"/> |
110 | <!-- For disabled buttons ADD these classes: opacity-50 cursor-not-allowed | 111 | <!-- For disabled buttons ADD these classes: opacity-50 cursor-not-allowed |
111 | And REMOVE these classes: active:bg-purple-600 hover:bg-purple-700 focus:shadow-outline-purple --> | 112 | And REMOVE these classes: active:bg-purple-600 hover:bg-purple-700 focus:shadow-outline-purple --> |
112 | <button class="tabs__submit-btn js_tabs_submit_btn absolute inset-y-0 right-0 px-4 text-sm font-medium leading-5 text-white transition-colors duration-150 bg-purple-600 border border-transparent rounded-r-md focus:outline-none opacity-50 cursor-not-allowed" disabled>+</button> | 113 | <button class="tabs__submit-btn js_tabs_submit_btn absolute inset-y-0 right-0 px-4 text-sm font-medium leading-5 text-white transition-colors duration-150 bg-purple-600 border border-transparent rounded-r-md focus:outline-none opacity-50 cursor-not-allowed" disabled>+</button> |
113 | <!-- <button class="tabs__submit-btn js_tabs_submit_btn absolute inset-y-0 right-0 px-4 text-sm font-medium leading-5 text-white transition-colors duration-150 bg-purple-600 border border-transparent rounded-r-md active:bg-purple-600 hover:bg-purple-700 focus:outline-none focus:shadow-outline-purple">+</button> --> | 114 | <!-- <button class="tabs__submit-btn js_tabs_submit_btn absolute inset-y-0 right-0 px-4 text-sm font-medium leading-5 text-white transition-colors duration-150 bg-purple-600 border border-transparent rounded-r-md active:bg-purple-600 hover:bg-purple-700 focus:outline-none focus:shadow-outline-purple">+</button> --> |
114 | </div> | 115 | </div> |
115 | </label> | 116 | </label> |
116 | </form> | 117 | </form> |
117 | <div class="tabs__buttons js_tabs_buttons flex flex-col flex-wrap mb-4 md:flex-row md:space-x-4"> | 118 | <div class="tabs__buttons js_tabs_buttons flex flex-col flex-wrap mb-4 md:flex-row md:space-x-4"> |
118 | @if ($program->count()) | 119 | @if ($program->count()) |
119 | @php $bool = true; | 120 | @php $bool = true; |
120 | $i = 1; | 121 | $i = 1; |
121 | $level = ""; | 122 | $level = ""; |
122 | @endphp | 123 | @endphp |
123 | 124 | ||
124 | @foreach ($program as $pro) | 125 | @foreach ($program as $pro) |
125 | @if ((!empty($level)) && ($level <> $pro->level )) | 126 | @if ((!empty($level)) && ($level <> $pro->level )) |
126 | @php $bool = true; $i++; @endphp | 127 | @php $bool = true; $i++; @endphp |
127 | @endif | 128 | @endif |
128 | @if ($bool == true) | 129 | @if ($bool == true) |
129 | <div> | 130 | <div> |
130 | <button class="tabs__btn js_tabs_btn mt-4 px-4 py-2 text-sm font-medium leading-5 text-white transition-colors duration-150 bg-purple-600 border border-transparent rounded-lg active:bg-purple-600 hover:bg-purple-700 focus:outline-none focus:shadow-outline-purple" data-btn="{{ $pro->level }}" data-id="{{$i}}">{{ $pro->level }}</button> | 131 | <button class="tabs__btn js_tabs_btn mt-4 px-4 py-2 text-sm font-medium leading-5 text-white transition-colors duration-150 bg-purple-600 border border-transparent rounded-lg active:bg-purple-600 hover:bg-purple-700 focus:outline-none focus:shadow-outline-purple" data-btn="{{ $pro->level }}" data-id="{{$i}}">{{ $pro->level }}</button> |
131 | </div> | 132 | </div> |
132 | @php $bool = false; | 133 | @php $bool = false; |
133 | $level = $pro->level; | 134 | $level = $pro->level; |
134 | @endphp | 135 | @endphp |
135 | @endif | 136 | @endif |
136 | @endforeach | 137 | @endforeach |
137 | @endif | 138 | @endif |
138 | </div> | 139 | </div> |
139 | <div class="tabs__content js_tabs_content"> | 140 | <div class="tabs__content js_tabs_content"> |
140 | @if ($program->count()) | 141 | @if ($program->count()) |
141 | @php $bool = true; | 142 | @php $bool = true; |
142 | $i = 1; | 143 | $i = 1; |
143 | $level = ""; | 144 | $level = ""; |
144 | @endphp | 145 | @endphp |
145 | 146 | ||
146 | @foreach ($program as $pro) | 147 | @foreach ($program as $pro) |
147 | @php $name_tab = $pro->level; @endphp | 148 | @php $name_tab = $pro->level; @endphp |
148 | @if ((!empty($level)) && ($level <> $pro->level)) | 149 | @if ((!empty($level)) && ($level <> $pro->level)) |
149 | </tbody> | 150 | </tbody> |
150 | </table> | 151 | </table> |
151 | </div> | 152 | </div> |
152 | @php $bool = true; $i++; @endphp | 153 | @php $bool = true; $i++; @endphp |
153 | @endif | 154 | @endif |
154 | 155 | ||
155 | @if ($bool == true) | 156 | @if ($bool == true) |
156 | <div class="tabs__item js_tabs_item @php echo($i>1) ? 'hidden' : ''; @endphp" data-id="{{$i}}"> | 157 | <div class="tabs__item js_tabs_item @php echo($i>1) ? 'hidden' : ''; @endphp" data-id="{{$i}}"> |
157 | <form action="{{ route('admin.add-program-education') }}" method="GET" class="flex flex-col flex-wrap mb-4 md:flex-row md:space-x-4"> | 158 | <form action="{{ route('admin.add-program-education') }}" method="GET" class="flex flex-col flex-wrap mb-4 md:flex-row md:space-x-4"> |
158 | <div> | 159 | <div> |
159 | <input type="hidden" name="id" value="{{ $education->id }}"/> | 160 | <input type="hidden" name="id" value="{{ $education->id }}"/> |
160 | <input type="hidden" name="level" value="{{$name_tab}}"/> | 161 | <input type="hidden" name="level" value="{{$name_tab}}"/> |
161 | <button type="submit" class="mt-4 px-4 py-2 text-sm font-medium leading-5 text-white transition-colors duration-150 bg-purple-600 border border-transparent rounded-lg active:bg-purple-600 hover:bg-purple-700 focus:outline-none focus:shadow-outline-purple">Добавить</button> | 162 | <button type="submit" class="mt-4 px-4 py-2 text-sm font-medium leading-5 text-white transition-colors duration-150 bg-purple-600 border border-transparent rounded-lg active:bg-purple-600 hover:bg-purple-700 focus:outline-none focus:shadow-outline-purple">Добавить</button> |
162 | </div> | 163 | </div> |
163 | </form> | 164 | </form> |
164 | <table class="mb-4 w-full whitespace-no-wrap"> | 165 | <table class="mb-4 w-full whitespace-no-wrap"> |
165 | <thead> | 166 | <thead> |
166 | <tr | 167 | <tr |
167 | class="text-xs font-semibold tracking-wide text-left text-gray-500 uppercase border-b dark:border-gray-700 bg-gray-50 dark:text-gray-400 dark:bg-gray-800" | 168 | class="text-xs font-semibold tracking-wide text-left text-gray-500 uppercase border-b dark:border-gray-700 bg-gray-50 dark:text-gray-400 dark:bg-gray-800" |
168 | > | 169 | > |
169 | <th class="px-4 py-3">Специализация</th> | 170 | <th class="px-4 py-3">Специализация</th> |
170 | <th class="px-4 py-3">Описание</th> | 171 | <th class="px-4 py-3">Описание</th> |
171 | <th class="px-4 py-3">Редактирование</th> | 172 | <th class="px-4 py-3">Редактирование</th> |
172 | 173 | ||
173 | </tr> | 174 | </tr> |
174 | </thead> | 175 | </thead> |
175 | <tbody | 176 | <tbody |
176 | class="bg-white divide-y dark:divide-gray-700 dark:bg-gray-800" | 177 | class="bg-white divide-y dark:divide-gray-700 dark:bg-gray-800" |
177 | > | 178 | > |
178 | @php $bool = false; | 179 | @php $bool = false; |
179 | $level = $pro->level; | 180 | $level = $pro->level; |
180 | @endphp | 181 | @endphp |
181 | @endif | 182 | @endif |
182 | <tr class="text-gray-700 dark:text-gray-400"> | 183 | <tr class="text-gray-700 dark:text-gray-400"> |
183 | <td class="px-4 py-3"> | 184 | <td class="px-4 py-3"> |
184 | <div class="flex items-center text-sm"> | 185 | <div class="flex items-center text-sm"> |
185 | <div> | 186 | <div> |
186 | <p class="font-semibold">Специальность: </p> | 187 | <p class="font-semibold">Специальность: </p> |
187 | <p class="text-xs text-gray-600 dark:text-gray-400"> | 188 | <p class="text-xs text-gray-600 dark:text-gray-400"> |
188 | {{ mb_strimwidth($pro->name, 0, 50, "...") }} | 189 | {{ mb_strimwidth($pro->name, 0, 50, "...") }} |
189 | </p> | 190 | </p> |
190 | </div> | 191 | </div> |
191 | </div> | 192 | </div> |
192 | </td> | 193 | </td> |
193 | <td class="px-4 py-3 text-sm"> | 194 | <td class="px-4 py-3 text-sm"> |
194 | <span class="text-gray-700 dark:text-gray-400">Описание: {{ mb_strimwidth($pro->text, 0, 100, "...")}}</span> | 195 | <span class="text-gray-700 dark:text-gray-400">Описание: {{ mb_strimwidth($pro->text, 0, 100, "...")}}</span> |
195 | </td> | 196 | </td> |
196 | <td class="px-4 py-3 text-xs"> | 197 | <td class="px-4 py-3 text-xs"> |
197 | <a href="{{ route('admin.edit-program-education', ['program' => $pro->id, 'education' => $education->id]) }}">Изменить</a> | | 198 | <a href="{{ route('admin.edit-program-education', ['program' => $pro->id, 'education' => $education->id]) }}">Изменить</a> | |
198 | <a href="{{ route('admin.delete-program-education', ['program' => $pro->id, 'education' => $education->id]) }}">Удалить</a> | 199 | <a href="{{ route('admin.delete-program-education', ['program' => $pro->id, 'education' => $education->id]) }}">Удалить</a> |
199 | </td> | 200 | </td> |
200 | </tr> | 201 | </tr> |
201 | @endforeach | 202 | @endforeach |
202 | @endif | 203 | @endif |
203 | </div> | 204 | </div> |
204 | </div> | 205 | </div> |
205 | @endisset | 206 | @endisset |
206 | </div> | 207 | </div> |
207 | 208 | ||
208 | <script src="//cdn.ckeditor.com/4.14.0/standard/ckeditor.js"></script> | 209 | <script src="//cdn.ckeditor.com/4.14.0/standard/ckeditor.js"></script> |
209 | 210 | ||
210 | <!--<script src="{{ asset('./ckeditor/ckeditor.js') }}"></script>--> | 211 | <!--<script src="{{ asset('./ckeditor/ckeditor.js') }}"></script>--> |
211 | <script> | 212 | <script> |
212 | CKEDITOR.replace( 'text', { | 213 | CKEDITOR.replace( 'text', { |
213 | filebrowserUploadUrl: "{{route('ckeditor.image-upload', ['_token' => csrf_token() ])}}", | 214 | filebrowserUploadUrl: "{{route('ckeditor.image-upload', ['_token' => csrf_token() ])}}", |
214 | filebrowserImageUploadUrl: "{{ route('ckeditor.image-upload', ['_token' => csrf_token() ])}}", | 215 | filebrowserImageUploadUrl: "{{ route('ckeditor.image-upload', ['_token' => csrf_token() ])}}", |
215 | filebrowserUploadMethod: 'form' | 216 | filebrowserUploadMethod: 'form' |
216 | }); | 217 | }); |
217 | </script> | 218 | </script> |
218 | <script> | 219 | <script> |
219 | window.addEventListener('DOMContentLoaded', () => { | 220 | window.addEventListener('DOMContentLoaded', () => { |
220 | 221 | ||
221 | setTabs(3); | 222 | setTabs(3); |
222 | 223 | ||
223 | function setTabs(qty) { | 224 | function setTabs(qty) { |
224 | 225 | ||
225 | const tabs = document.querySelector('.js_tabs'); | 226 | const tabs = document.querySelector('.js_tabs'); |
226 | const tabsForm = tabs.querySelector('.js_tabs_form'); | 227 | const tabsForm = tabs.querySelector('.js_tabs_form'); |
227 | const tabsInput = tabs.querySelector('.js_tabs_input'); | 228 | const tabsInput = tabs.querySelector('.js_tabs_input'); |
228 | const tabsSubmitBtn = tabs.querySelector('.js_tabs_submit_btn'); | 229 | const tabsSubmitBtn = tabs.querySelector('.js_tabs_submit_btn'); |
229 | const tabsButtons = tabs.querySelector('.js_tabs_buttons'); | 230 | const tabsButtons = tabs.querySelector('.js_tabs_buttons'); |
230 | const tabsContent = tabs.querySelector('.js_tabs_content'); | 231 | const tabsContent = tabs.querySelector('.js_tabs_content'); |
231 | 232 | ||
232 | tabsForm.addEventListener('submit', (e) => { | 233 | tabsForm.addEventListener('submit', (e) => { |
233 | 234 | ||
234 | //e.preventDefault(); | 235 | //e.preventDefault(); |
235 | 236 | ||
236 | const tabsInputValue = tabsInput.value; | 237 | const tabsInputValue = tabsInput.value; |
237 | const tabsBtns = tabsButtons.querySelectorAll('.js_tabs_btn'); | 238 | const tabsBtns = tabsButtons.querySelectorAll('.js_tabs_btn'); |
238 | const id = Date.now(); | 239 | const id = Date.now(); |
239 | 240 | ||
240 | 241 | ||
241 | if (tabsBtns.length >= qty) { | 242 | if (tabsBtns.length >= qty) { |
242 | console.log('Ветка выполнена'); | 243 | console.log('Ветка выполнена'); |
243 | e.preventDefault(); | 244 | e.preventDefault(); |
244 | } | 245 | } |
245 | 246 | ||
246 | if (tabsInput.dataset.edit) { | 247 | if (tabsInput.dataset.edit) { |
247 | 248 | ||
248 | tabsBtns.forEach(btn => { | 249 | tabsBtns.forEach(btn => { |
249 | if (tabsInput.dataset.edit === btn.dataset.id) { | 250 | if (tabsInput.dataset.edit === btn.dataset.id) { |
250 | console.log('oldname: '+btn.textContent+' newname: '+tabsInputValue+' id_education: '+<?=$education->id?>+''); | 251 | console.log('oldname: '+btn.textContent+' newname: '+tabsInputValue+' id_education: '+<?=$education->id?>+''); |
251 | $.ajax({ | 252 | $.ajax({ |
252 | url: '{{ route('admin.rename-program-education') }}', | 253 | url: '{{ route('admin.rename-program-education') }}', |
253 | method: 'get', /* Метод запроса (post или get) */ | 254 | method: 'get', /* Метод запроса (post или get) */ |
254 | dataType: 'html', /* Тип данных в ответе (xml, json, script, html). */ | 255 | dataType: 'html', /* Тип данных в ответе (xml, json, script, html). */ |
255 | data: {oldname: btn.textContent, newname:tabsInputValue, id_education: <?=$education->id?>}, /* Данные передаваемые в массиве */ | 256 | data: {oldname: btn.textContent, newname:tabsInputValue, id_education: <?=$education->id?>}, /* Данные передаваемые в массиве */ |
256 | success: function(data){ /* функция которая будет выполнена после успешного запроса. */ | 257 | success: function(data){ /* функция которая будет выполнена после успешного запроса. */ |
257 | console.log(data); /* В переменной data содержится ответ от index.php. */ | 258 | console.log(data); /* В переменной data содержится ответ от index.php. */ |
258 | } | 259 | } |
259 | }); | 260 | }); |
260 | 261 | ||
261 | btn.textContent = tabsInputValue; | 262 | btn.textContent = tabsInputValue; |
262 | btn.dataset.btn = tabsInputValue; | 263 | btn.dataset.btn = tabsInputValue; |
263 | } | 264 | } |
264 | }); | 265 | }); |
265 | console.log('Эта ветка выполнилась'); | 266 | console.log('Эта ветка выполнилась'); |
266 | tabsInput.removeAttribute('data-edit'); | 267 | tabsInput.removeAttribute('data-edit'); |
267 | 268 | ||
268 | } else { | 269 | } else { |
269 | 270 | ||
270 | if (!tabsBtns.length) { | 271 | if (!tabsBtns.length) { |
271 | tabsButtons.innerHTML += getTabsBtnTemplate(tabsInputValue, id); | 272 | tabsButtons.innerHTML += getTabsBtnTemplate(tabsInputValue, id); |
272 | //tabsContent.innerHTML += getTabsItemTemplate(id); | 273 | //tabsContent.innerHTML += getTabsItemTemplate(id); |
273 | } | 274 | } |
274 | 275 | ||
275 | if (tabsBtns.length && tabsBtns.length < qty) { | 276 | if (tabsBtns.length && tabsBtns.length < qty) { |
276 | 277 | ||
277 | let isMatch = false; | 278 | let isMatch = false; |
278 | 279 | ||
279 | tabsBtns.forEach(btn => { | 280 | tabsBtns.forEach(btn => { |
280 | if (tabsInputValue === btn.dataset.btn) { | 281 | if (tabsInputValue === btn.dataset.btn) { |
281 | isMatch = true; | 282 | isMatch = true; |
282 | } | 283 | } |
283 | }); | 284 | }); |
284 | 285 | ||
285 | console.log('Альтернативная ветка!'); | 286 | console.log('Альтернативная ветка!'); |
286 | if (!isMatch) { | 287 | if (!isMatch) { |
287 | tabsButtons.innerHTML += getTabsBtnTemplate(tabsInputValue, id); | 288 | tabsButtons.innerHTML += getTabsBtnTemplate(tabsInputValue, id); |
288 | tabsContent.innerHTML += getTabsItemTemplate(id, 'hidden'); | 289 | tabsContent.innerHTML += getTabsItemTemplate(id, 'hidden'); |
289 | } | 290 | } |
290 | } | 291 | } |
291 | } | 292 | } |
292 | 293 | ||
293 | //tabsInput.value = ''; | 294 | //tabsInput.value = ''; |
294 | addDisabledBtnStatus(tabsSubmitBtn); | 295 | addDisabledBtnStatus(tabsSubmitBtn); |
295 | 296 | ||
296 | }); | 297 | }); |
297 | 298 | ||
298 | tabsInput.addEventListener('input', () => { | 299 | tabsInput.addEventListener('input', () => { |
299 | if (tabsInput.value !== '') { | 300 | if (tabsInput.value !== '') { |
300 | removeDisabledBtnStatus(tabsSubmitBtn); | 301 | removeDisabledBtnStatus(tabsSubmitBtn); |
301 | } else { | 302 | } else { |
302 | addDisabledBtnStatus(tabsSubmitBtn); | 303 | addDisabledBtnStatus(tabsSubmitBtn); |
303 | } | 304 | } |
304 | }); | 305 | }); |
305 | 306 | ||
306 | tabsButtons.addEventListener('click', (e) => { | 307 | tabsButtons.addEventListener('click', (e) => { |
307 | 308 | ||
308 | const target = e.target.closest('.js_tabs_btn'); | 309 | const target = e.target.closest('.js_tabs_btn'); |
309 | 310 | ||
310 | if (target) { | 311 | if (target) { |
311 | 312 | ||
312 | const tabsItems = tabs.querySelectorAll('.js_tabs_item'); | 313 | const tabsItems = tabs.querySelectorAll('.js_tabs_item'); |
313 | 314 | ||
314 | tabsItems.forEach(item => { | 315 | tabsItems.forEach(item => { |
315 | 316 | ||
316 | item.classList.add('hidden'); | 317 | item.classList.add('hidden'); |
317 | 318 | ||
318 | if (target.dataset.id === item.dataset.id) { | 319 | if (target.dataset.id === item.dataset.id) { |
319 | item.classList.remove('hidden'); | 320 | item.classList.remove('hidden'); |
320 | } | 321 | } |
321 | }); | 322 | }); |
322 | } | 323 | } |
323 | 324 | ||
324 | }); | 325 | }); |
325 | 326 | ||
326 | tabsButtons.addEventListener('dblclick', (e) => { | 327 | tabsButtons.addEventListener('dblclick', (e) => { |
327 | const target = e.target.closest('.js_tabs_btn'); | 328 | const target = e.target.closest('.js_tabs_btn'); |
328 | 329 | ||
329 | if (target) { | 330 | if (target) { |
330 | tabsInput.value = target.dataset.btn; | 331 | tabsInput.value = target.dataset.btn; |
331 | tabsInput.dataset.edit = target.dataset.id; | 332 | tabsInput.dataset.edit = target.dataset.id; |
332 | removeDisabledBtnStatus(tabsSubmitBtn); | 333 | removeDisabledBtnStatus(tabsSubmitBtn); |
333 | } | 334 | } |
334 | }); | 335 | }); |
335 | 336 | ||
336 | function getTabsBtnTemplate(btnName, id) { | 337 | function getTabsBtnTemplate(btnName, id) { |
337 | return ` | 338 | return ` |
338 | <div> | 339 | <div> |
339 | <button class="tabs__btn js_tabs_btn mt-4 px-4 py-2 text-sm font-medium leading-5 text-white transition-colors duration-150 bg-purple-600 border border-transparent rounded-lg active:bg-purple-600 hover:bg-purple-700 focus:outline-none focus:shadow-outline-purple" data-btn="${btnName}" data-id="${id}">${btnName}</button> | 340 | <button class="tabs__btn js_tabs_btn mt-4 px-4 py-2 text-sm font-medium leading-5 text-white transition-colors duration-150 bg-purple-600 border border-transparent rounded-lg active:bg-purple-600 hover:bg-purple-700 focus:outline-none focus:shadow-outline-purple" data-btn="${btnName}" data-id="${id}">${btnName}</button> |
340 | </div> | 341 | </div> |
341 | `; | 342 | `; |
342 | } | 343 | } |
343 | 344 | ||
344 | function getTabsItemTemplate(id, className = '') { | 345 | function getTabsItemTemplate(id, className = '') { |
345 | return ` | 346 | return ` |
346 | <div class="tabs__item js_tabs_item ${className}" data-id="${id}"> | 347 | <div class="tabs__item js_tabs_item ${className}" data-id="${id}"> |
347 | <div class="mb-4">${id}</div> | 348 | <div class="mb-4">${id}</div> |
348 | <table class="mb-4 w-full whitespace-no-wrap"> | 349 | <table class="mb-4 w-full whitespace-no-wrap"> |
349 | <thead> | 350 | <thead> |
350 | <tr | 351 | <tr |
351 | class="text-xs font-semibold tracking-wide text-left text-gray-500 uppercase border-b dark:border-gray-700 bg-gray-50 dark:text-gray-400 dark:bg-gray-800" | 352 | class="text-xs font-semibold tracking-wide text-left text-gray-500 uppercase border-b dark:border-gray-700 bg-gray-50 dark:text-gray-400 dark:bg-gray-800" |
352 | > | 353 | > |
353 | <th class="px-4 py-3">Client</th> | 354 | <th class="px-4 py-3">Client</th> |
354 | <th class="px-4 py-3">Amount</th> | 355 | <th class="px-4 py-3">Amount</th> |
355 | <th class="px-4 py-3">Status</th> | 356 | <th class="px-4 py-3">Status</th> |
356 | <th class="px-4 py-3">Date</th> | 357 | <th class="px-4 py-3">Date</th> |
357 | </tr> | 358 | </tr> |
358 | </thead> | 359 | </thead> |
359 | <tbody | 360 | <tbody |
360 | class="bg-white divide-y dark:divide-gray-700 dark:bg-gray-800" | 361 | class="bg-white divide-y dark:divide-gray-700 dark:bg-gray-800" |
361 | > | 362 | > |
362 | <tr class="text-gray-700 dark:text-gray-400"> | 363 | <tr class="text-gray-700 dark:text-gray-400"> |
363 | <td class="px-4 py-3"> | 364 | <td class="px-4 py-3"> |
364 | <div class="flex items-center text-sm"> | 365 | <div class="flex items-center text-sm"> |
365 | <!-- Avatar with inset shadow --> | 366 | <!-- Avatar with inset shadow --> |
366 | <div | 367 | <div |
367 | class="relative hidden w-8 h-8 mr-3 rounded-full md:block" | 368 | class="relative hidden w-8 h-8 mr-3 rounded-full md:block" |
368 | > | 369 | > |
369 | <img | 370 | <img |
370 | class="object-cover w-full h-full rounded-full" | 371 | class="object-cover w-full h-full rounded-full" |
371 | src="https://images.unsplash.com/flagged/photo-1570612861542-284f4c12e75f?ixlib=rb-1.2.1&q=80&fm=jpg&crop=entropy&cs=tinysrgb&w=200&fit=max&ixid=eyJhcHBfaWQiOjE3Nzg0fQ" | 372 | src="https://images.unsplash.com/flagged/photo-1570612861542-284f4c12e75f?ixlib=rb-1.2.1&q=80&fm=jpg&crop=entropy&cs=tinysrgb&w=200&fit=max&ixid=eyJhcHBfaWQiOjE3Nzg0fQ" |
372 | alt="" | 373 | alt="" |
373 | loading="lazy" | 374 | loading="lazy" |
374 | /> | 375 | /> |
375 | <div | 376 | <div |
376 | class="absolute inset-0 rounded-full shadow-inner" | 377 | class="absolute inset-0 rounded-full shadow-inner" |
377 | aria-hidden="true" | 378 | aria-hidden="true" |
378 | ></div> | 379 | ></div> |
379 | </div> | 380 | </div> |
380 | <div> | 381 | <div> |
381 | <p class="font-semibold">Hans Burger</p> | 382 | <p class="font-semibold">Hans Burger</p> |
382 | <p class="text-xs text-gray-600 dark:text-gray-400"> | 383 | <p class="text-xs text-gray-600 dark:text-gray-400"> |
383 | 10x Developer | 384 | 10x Developer |
384 | </p> | 385 | </p> |
385 | </div> | 386 | </div> |
386 | </div> | 387 | </div> |
387 | </td> | 388 | </td> |
388 | <td class="px-4 py-3 text-sm"> | 389 | <td class="px-4 py-3 text-sm"> |
389 | $ 863.45 | 390 | $ 863.45 |
390 | </td> | 391 | </td> |
391 | <td class="px-4 py-3 text-xs"> | 392 | <td class="px-4 py-3 text-xs"> |
392 | <span | 393 | <span |
393 | class="px-2 py-1 font-semibold leading-tight text-green-700 bg-green-100 rounded-full dark:bg-green-700 dark:text-green-100" | 394 | class="px-2 py-1 font-semibold leading-tight text-green-700 bg-green-100 rounded-full dark:bg-green-700 dark:text-green-100" |
394 | > | 395 | > |
395 | Approved | 396 | Approved |
396 | </span> | 397 | </span> |
397 | </td> | 398 | </td> |
398 | <td class="px-4 py-3 text-sm"> | 399 | <td class="px-4 py-3 text-sm"> |
399 | 6/10/2020 | 400 | 6/10/2020 |
400 | </td> | 401 | </td> |
401 | </tr> | 402 | </tr> |
402 | 403 | ||
403 | <tr class="text-gray-700 dark:text-gray-400"> | 404 | <tr class="text-gray-700 dark:text-gray-400"> |
404 | <td class="px-4 py-3"> | 405 | <td class="px-4 py-3"> |
405 | <div class="flex items-center text-sm"> | 406 | <div class="flex items-center text-sm"> |
406 | <!-- Avatar with inset shadow --> | 407 | <!-- Avatar with inset shadow --> |
407 | <div | 408 | <div |
408 | class="relative hidden w-8 h-8 mr-3 rounded-full md:block" | 409 | class="relative hidden w-8 h-8 mr-3 rounded-full md:block" |
409 | > | 410 | > |
410 | <img | 411 | <img |
411 | class="object-cover w-full h-full rounded-full" | 412 | class="object-cover w-full h-full rounded-full" |
412 | src="https://images.unsplash.com/photo-1494790108377-be9c29b29330?ixlib=rb-0.3.5&q=80&fm=jpg&crop=entropy&cs=tinysrgb&w=200&facepad=3&fit=facearea&s=707b9c33066bf8808c934c8ab394dff6" | 413 | src="https://images.unsplash.com/photo-1494790108377-be9c29b29330?ixlib=rb-0.3.5&q=80&fm=jpg&crop=entropy&cs=tinysrgb&w=200&facepad=3&fit=facearea&s=707b9c33066bf8808c934c8ab394dff6" |
413 | alt="" | 414 | alt="" |
414 | loading="lazy" | 415 | loading="lazy" |
415 | /> | 416 | /> |
416 | <div | 417 | <div |
417 | class="absolute inset-0 rounded-full shadow-inner" | 418 | class="absolute inset-0 rounded-full shadow-inner" |
418 | aria-hidden="true" | 419 | aria-hidden="true" |
419 | ></div> | 420 | ></div> |
420 | </div> | 421 | </div> |
421 | <div> | 422 | <div> |
422 | <p class="font-semibold">Jolina Angelie</p> | 423 | <p class="font-semibold">Jolina Angelie</p> |
423 | <p class="text-xs text-gray-600 dark:text-gray-400"> | 424 | <p class="text-xs text-gray-600 dark:text-gray-400"> |
424 | Unemployed | 425 | Unemployed |
425 | </p> | 426 | </p> |
426 | </div> | 427 | </div> |
427 | </div> | 428 | </div> |
428 | </td> | 429 | </td> |
429 | <td class="px-4 py-3 text-sm"> | 430 | <td class="px-4 py-3 text-sm"> |
430 | $ 369.95 | 431 | $ 369.95 |
431 | </td> | 432 | </td> |
432 | <td class="px-4 py-3 text-xs"> | 433 | <td class="px-4 py-3 text-xs"> |
433 | <span | 434 | <span |
434 | class="px-2 py-1 font-semibold leading-tight text-orange-700 bg-orange-100 rounded-full dark:text-white dark:bg-orange-600" | 435 | class="px-2 py-1 font-semibold leading-tight text-orange-700 bg-orange-100 rounded-full dark:text-white dark:bg-orange-600" |
435 | > | 436 | > |
436 | Pending | 437 | Pending |
437 | </span> | 438 | </span> |
438 | </td> | 439 | </td> |
439 | <td class="px-4 py-3 text-sm"> | 440 | <td class="px-4 py-3 text-sm"> |
440 | 6/10/2020 | 441 | 6/10/2020 |
441 | </td> | 442 | </td> |
442 | </tr> | 443 | </tr> |
443 | </tbody> | 444 | </tbody> |
444 | </table> | 445 | </table> |
445 | 446 | ||
446 | <div class="flex flex-col flex-wrap mb-4 md:flex-row md:space-x-4"> | 447 | <div class="flex flex-col flex-wrap mb-4 md:flex-row md:space-x-4"> |
447 | <div> | 448 | <div> |
448 | <a href="#" class="mt-4 px-4 py-2 text-sm font-medium leading-5 text-white transition-colors duration-150 bg-purple-600 border border-transparent rounded-lg active:bg-purple-600 hover:bg-purple-700 focus:outline-none focus:shadow-outline-purple">Редактировать</a> | 449 | <a href="#" class="mt-4 px-4 py-2 text-sm font-medium leading-5 text-white transition-colors duration-150 bg-purple-600 border border-transparent rounded-lg active:bg-purple-600 hover:bg-purple-700 focus:outline-none focus:shadow-outline-purple">Редактировать</a> |
449 | </div> | 450 | </div> |
450 | <div> | 451 | <div> |
451 | <a href="#" class="mt-4 px-4 py-2 text-sm font-medium leading-5 text-white transition-colors duration-150 bg-purple-600 border border-transparent rounded-lg active:bg-purple-600 hover:bg-purple-700 focus:outline-none focus:shadow-outline-purple">Удалить</a> | 452 | <a href="#" class="mt-4 px-4 py-2 text-sm font-medium leading-5 text-white transition-colors duration-150 bg-purple-600 border border-transparent rounded-lg active:bg-purple-600 hover:bg-purple-700 focus:outline-none focus:shadow-outline-purple">Удалить</a> |
452 | </div> | 453 | </div> |
453 | </div> | 454 | </div> |
454 | </div> | 455 | </div> |
455 | `; | 456 | `; |
456 | } | 457 | } |
457 | 458 | ||
458 | function addDisabledBtnStatus(btn) { | 459 | function addDisabledBtnStatus(btn) { |
459 | btn.disabled = true; | 460 | btn.disabled = true; |
460 | btn.classList.add('opacity-50', 'cursor-not-allowed'); | 461 | btn.classList.add('opacity-50', 'cursor-not-allowed'); |
461 | btn.classList.remove('active:bg-purple-600', 'hover:bg-purple-700', 'focus:shadow-outline-purple'); | 462 | btn.classList.remove('active:bg-purple-600', 'hover:bg-purple-700', 'focus:shadow-outline-purple'); |
462 | } | 463 | } |
463 | 464 | ||
464 | function removeDisabledBtnStatus(btn) { | 465 | function removeDisabledBtnStatus(btn) { |
465 | btn.disabled = false; | 466 | btn.disabled = false; |
466 | btn.classList.remove('opacity-50', 'cursor-not-allowed'); | 467 | btn.classList.remove('opacity-50', 'cursor-not-allowed'); |
467 | btn.classList.add('active:bg-purple-600', 'hover:bg-purple-700', 'focus:shadow-outline-purple'); | 468 | btn.classList.add('active:bg-purple-600', 'hover:bg-purple-700', 'focus:shadow-outline-purple'); |
468 | } | 469 | } |
469 | 470 | ||
470 | } | 471 | } |
471 | console.log('main.js init'); | 472 | console.log('main.js init'); |
472 | 473 | ||
473 | }); | 474 | }); |
474 | 475 | ||
475 | </script> | 476 | </script> |