@extends('pwa.template.app.main')

@section('script')
  <script>
    $('.dropify').dropify({
      tpl: {
        message: '<div class="dropify-message"><span class="file-icon" /></div>',
      }
    });
  </script>
  <script>
    tinymce.init({
      selector: 'textarea#myeditorinstance', // Replace this CSS selector to match the placeholder element for TinyMCE
      plugins: 'code table lists',
      toolbar: 'undo redo | blocks | bold italic | alignleft aligncenter alignright | indent outdent | bullist numlist | code | table'
    });
  </script>
@endsection
@section('app-content')
  <div class="container py-3">
    <form class="card px-3 py-4" method="POST" action="{{ route('produk.update', $produk->id) }}"
      enctype="multipart/form-data">
      @csrf
      <h5 class="mb-4">Setting Produk</h5>
      <div class="mb-3">
        <label for="foto" class="form-label">Foto Produk</label>
        <input type="file" class="dropify" data-height="200" data-allowed-file-extensions="pdf png jpg jpeg"
          name="foto" data-default-file="{{ asset('storage/' . $produk->foto) }}" />
        {{-- data-default-file="{{ asset('storage/' . $produk->foto) }}" --}}
      </div>
      <div class="mb-3">
        <label for="nama" class="form-label">Nama Produk</label>
        <input type="text" class="form-control" name="nama" required id="nama" value="{{ $produk->nama }}">
      </div>
      <div class="mb-3">
        <label for="harga" class="form-label">Harga</label>
        <input type="text" class="form-control" name="harga" required id="harga" placeholder="Example: 50000"
          value="{{ $produk->harga }}">
      </div>
      <div class="mb-3">
        <label for="satuan" class="form-label">Satuan</label>
        <select class="form-select" name="satuan" required>
          <option value="pcs" @if ($produk->satuan == 'pcs') selected @endif>Pieces</option>
          <option value="pck" @if ($produk->satuan == 'pck') selected @endif>Pack</option>
        </select>
      </div>
      <div class="mb-3">
        <label for="stok" class="form-label">Stok</label>
        <input type="number" class="form-control" name="stok" required id="stok"
          placeholder="Masukkan Jumlah Stok" value="{{ $produk->stok }}">
      </div>
      <div class="mb-4">
        <label for="deskripsi" class="form-label">Deskripsi Produk</label>
        <textarea id="myeditorinstance" class="form-control" placeholder="Jelaskan Produk Anda" name="deskripsi">{{ $produk->deskripsi }}</textarea>
        {{-- <textarea class="form-control" placeholder="Jelaskan Produk Anda Disini" id="floatingTextarea" name="deskripsi"
          style="height: 120px" required>{{ $produk->deskripsi }}</textarea> --}}
      </div>
      <button type="submit" class="mb-3 btn btn-primary">Submit</button>
    </form>
  </div>
@endsection