dikplhd/resources/views/modules/opendata/dataset/form.blade.php

186 lines
10 KiB
PHP
Raw Blame History

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

@extends('layouts.master')
@section('content')
<div class="flex flex-col gap-6">
<div class="card">
<div class="card-header">
<div class="flex justify-between items-center">
<h4 class="card-title">{{$title}}</h4>
</div>
</div>
<form action="{{route($route.'.store')}}" method="POST" class="" enctype="multipart/form-data">
{{csrf_field()}}
<input type="hidden" name="secure_id" value="{{@$keyId}}">
<div class="p-6">
<div class="card border rounded mb-5">
<div class="card-header">
<h5 class="font-bold text-md">Informasi Instansi Dataset</h5>
</div>
<div class="card-body p-5">
<div class="grid lg:grid-cols-2 gap-3">
<div class="">
<label class="mb-3 required">Instansi</label>
<select name="instansi_id" required class="form-input instansi_id select2 @error('instansi_id') is-invalid @enderror" id="">
<option value="">-</option>
@foreach($instansi as $dataInstansi)
<option value="{{encode_id($dataInstansi->MsInstansiId)}}">{{$dataInstansi->name}}</option>
@endforeach
</select>
@error('instansi_id')
<span class="invalid-feedback" style="display: block!important;"><strong>{{$message}}</strong></span>
@enderror
</div>
<div class="mb-3">
<label class="mb-3 required">Menggunakan Apakah Template Yang Disediakan ?</label>
<select name="template" class="form-input @error('template') is-invalid @enderror" id="template" required>
<option value="">-</option>
<option value="1">Ya</option>
<option value="0">Tidak</option>
</select>
@error('template')
<span class="invalid-feedback" style="display: block!important;"><strong>{{$message}}</strong></span>
@enderror
</div>
</div>
<a href="#" class="btn bg-success btnDownload hidden text-white btn-md"><i class="ri-download-2-line"></i>&nbsp;Download Template Excel</a>
</div>
</div>
<div class="grid lg:grid-cols-2 gap-3">
<div class="mb-3">
<label class="mb-3 required">Nama Dataset</label>
<input type="text" value="{{@$item->name ? @$item->name : old('name')}}" name="name" class="form-input @error('name') is-invalid @enderror" placeholder="Masukan Nama Dataset" required>
<small><i>*Harap perhatikan nama dataset yang Anda buat. Pastikan tidak ada duplikasi dataset dengan menekan tombol Cek Data.</i></small>
@error('name')
<span class="invalid-feedback" style="display: block!important;"><strong>{{$message}}</strong></span>
@enderror
</div>
<div class="mb-3">
<label class="mb-3 required">Sifat Dataset</label>
<select name="publik" required class="form-input @error('publik') is-invalid @enderror" id="">
<option value="1">Terbuka/Publik</option>
<option value="0">Rahasia/Private</option>
</select>
@error('publik')
<span class="invalid-feedback" style="display: block!important;"><strong>{{$message}}</strong></span>
@enderror
</div>
<div class="mb-3">
<label class="mb-3 required">Tags / Kata Kunci</label>
<div id="tag-container" class="flex flex-wrap gap-2 p-2 form-input rounded bg-white focus-within:ring-2 ring-blue-500">
<input id="tag-input" type="text" value="{{@$item->tags ? @$item->tags : old('tags')}}" name="tags[]" placeholder="Tambah tag..." class="flex-grow border-none p-1 text-sm" />
</div>
<small><i>*Sesuaikan kata kunci dengan dataset Anda</i></small>
@error('tags')
<span class="invalid-feedback" style="display: block!important;"><strong>{{$message}}</strong></span>
@enderror
</div>
<div class="mb-3">
<label class="mb-3 required">Upload File</label>
<input type="file" accept=".xls,.xlsx" value="{{@$item->file ? @$item->file : old('file')}}" name="file" class="form-input @error('file') is-invalid @enderror" placeholder="Masukan File Dataset" required>
<small><i>Masukan Ekstensi File : .xls,.xlsx</i></small>
@error('file')
<span class="invalid-feedback" style="display: block!important;"><strong>{{$message}}</strong></span>
@enderror
</div>
</div>
<div class="mb-3">
<label class="mb-3 required">Topik</label>
<select required name="topik[]" class="form-input select2 @error('topik') is-invalid @enderror" multiple>
@foreach($topik as $dataTopik)
<option value="{{encode_id($dataTopik->MsTopikId)}}">{{$dataTopik->name}}</option>
@endforeach
</select>
@error('topik')
<span class="invalid-feedback" style="display: block!important;"><strong>{{$message}}</strong></span>
@enderror
</div>
<div class="mb-3">
<label class="mb-3 required">Deskripsi Dataset</label>
<textarea name="deskripsi" required class="form-input @error('deskripsi') is-invalid @enderror" id="">{{@$item->deskripsi}}</textarea>
@error('deskripsi')
<span class="invalid-feedback" style="display: block!important;"><strong>{{$message}}</strong></span>
@enderror
</div>
</div>
<div class="p-6">
<a href="{{route($route.'.index')}}" class="btn bg-danger text-white"><i class="ri-close-line"></i>&nbsp;Batal</a>
<button type="submit" class="btn bg-success text-white"><i class="ri-save-line"></i> Simpan</button>
</div>
</form>
</div>
</div>
@endsection
@section('js')
<script>
const input = document.getElementById('tag-input');
const container = document.getElementById('tag-container');
input.addEventListener('keydown', function (e) {
if (e.key === 'Enter' && this.value.trim() !== '') {
e.preventDefault();
const tagText = this.value.trim();
// Buat tag baru
const tag = document.createElement('span');
tag.className = 'inline-flex items-center px-2 py-1 bg-primary text-white text-sm rounded';
tag.innerHTML = `${tagText} <button type="button" class="ml-1 text-blue-500 hover:text-red-600">&times;</button>`;
// Hidden input untuk dikirim ke server
const hiddenInput = document.createElement('input');
hiddenInput.type = 'hidden';
hiddenInput.name = 'tags[]';
hiddenInput.value = tagText;
// Tempelkan ke tag
tag.appendChild(hiddenInput);
// Tambahkan tag ke container sebelum input
container.insertBefore(tag, input);
// Reset input
this.value = '';
// Hapus tag saat tombol × ditekan
tag.querySelector('button').addEventListener('click', () => tag.remove());
}
});
</script>
<script type="text/javascript">
$('#template').on('change',function(){
var instansi_id = $('.instansi_id').find(':selected').val();
var val = $(this).find(':selected').val();
if(instansi_id == ''){
toastr.error("Data instansi_id Belum Dipilih", 'Error!', {positionClass: 'toast-bottom-right', containerId: 'toast-bottom-right'});
$('#template').val('');
}else{
if(val == 1){
$('.btnDownload').attr('href',"{{url('test')}}");
$('.btnDownload').removeClass('hidden');
}else{
$('.btnDownload').attr('href',"#");
$('.btnDownload').addClass('hidden');
}
}
});
$(document).ready(function() {
$('.numberInput').on('input', function() {
this.value = this.value.replace(/[^0-9]/g, ''); // Hanya angka 0-9
});
$('#togglePassword').on('click', function() {
let passwordField = $('#password');
let icon = $(this).find('i');
// Cek apakah input saat ini bertipe password
if (passwordField.attr('type') === 'password') {
passwordField.attr('type', 'text'); // Ubah ke teks
icon.removeClass('fa-eye').addClass('fa-eye-slash'); // Ganti ikon
} else {
passwordField.attr('type', 'password'); // Ubah ke password
icon.removeClass('fa-eye-slash').addClass('fa-eye'); // Kembalikan ikon
}
});
});
</script>
@endsection