チェックイン編集画面もタグ登録に対応

This commit is contained in:
shibafu 2018-01-08 08:56:17 +09:00
parent b1dcc36565
commit 24a3b0ebb5
2 changed files with 76 additions and 1 deletions

View File

@ -54,7 +54,6 @@ class EjaculationController extends Controller
$tag = Tag::firstOrCreate(['name' => $tag]); $tag = Tag::firstOrCreate(['name' => $tag]);
$tagIds[] = $tag->id; $tagIds[] = $tag->id;
} }
$ejaculation->tags()->sync($tagIds); $ejaculation->tags()->sync($tagIds);
return redirect()->route('checkin.show', ['id' => $ejaculation->id])->with('status', 'チェックインしました!'); return redirect()->route('checkin.show', ['id' => $ejaculation->id])->with('status', 'チェックインしました!');
@ -102,6 +101,7 @@ class EjaculationController extends Controller
'time' => 'required|date_format:H:i', 'time' => 'required|date_format:H:i',
'note' => 'nullable|string|max:500', 'note' => 'nullable|string|max:500',
'link' => 'nullable|url', 'link' => 'nullable|url',
'tags' => 'nullable|string',
])->after(function ($validator) use ($id, $request, $inputs) { ])->after(function ($validator) use ($id, $request, $inputs) {
// 日時の重複チェック // 日時の重複チェック
if (!$validator->errors()->hasAny(['date', 'time'])) { if (!$validator->errors()->hasAny(['date', 'time'])) {
@ -119,6 +119,14 @@ class EjaculationController extends Controller
'is_private' => $request->has('is_private') ?? false 'is_private' => $request->has('is_private') ?? false
])->save(); ])->save();
$tags = explode(' ', $inputs['tags']);
$tagIds = [];
foreach ($tags as $tag) {
$tag = Tag::firstOrCreate(['name' => $tag]);
$tagIds[] = $tag->id;
}
$ejaculation->tags()->sync($tagIds);
return redirect()->route('checkin.show', ['id' => $ejaculation->id])->with('status', 'チェックインを修正しました!'); return redirect()->route('checkin.show', ['id' => $ejaculation->id])->with('status', 'チェックインを修正しました!');
} }

View File

@ -35,6 +35,23 @@
</div> </div>
@endif @endif
</div> </div>
<div class="form-row">
<div class="form-group col-sm-12">
<input name="tags" type="hidden" value="{{ old('tags') ?? implode(' ', $ejaculation->tags->map(function ($v) { return $v->name; })->all()) }}">
<label for="tagInput"><span class="oi oi-tags"></span> タグ</label>
<div class="form-control {{ $errors->has('tags') ? ' is-invalid' : '' }}">
<ul id="tags" class="list-inline d-inline"></ul>
<input id="tagInput" type="text" style="outline: 0; border: 0;">
</div>
<small class="form-text text-muted">
Tab, Enter, 半角スペースのいずれかで入力確定します。
</small>
@if ($errors->has('tags'))
<div class="invalid-feedback">{{ $errors->first('tags') }}</div>
@endif
</div>
</div>
{{-- {{--
<div class="form-row"> <div class="form-row">
<div class="form-group col-sm-12"> <div class="form-group col-sm-12">
@ -95,4 +112,54 @@
@endsection @endsection
@push('script') @push('script')
<script>
function updateTags() {
$('input[name=tags]').val(
$('#tags')
.find('li')
.map(function () {
return $(this).data('value');
})
.get()
.join(' ')
);
}
function insertTag(value) {
$('#tags').append('<li class="list-inline-item badge badge-primary" style="cursor: pointer;" data-value="' + value + '"><span class="oi oi-tag"></span> ' + value + ' | x</li>');
}
var initTags = $('input[name=tags]').val();
if (initTags.trim() !== '') {
initTags.split(' ').forEach(function (value) {
insertTag(value);
});
}
$('#tagInput').on('keydown', function (ev) {
var $this = $(this);
if ($this.val().trim() !== '') {
switch (ev.key) {
case 'Tab':
case 'Enter':
case ' ':
insertTag($this.val().trim());
$this.val('');
updateTags();
ev.preventDefault();
break;
}
} else if (ev.key === 'Enter') {
// 誤爆防止
ev.preventDefault();
}
});
$('#tags')
.on('click', 'li', function (ev) {
$(this).remove();
updateTags();
})
.parent()
.on('click', function (ev) {
$('#tagInput').focus();
});
</script>
@endpush @endpush