@extends('admin.layouts.master')
@section('title', '編輯加值頻道 - 管理員')
@section('body')

<section class="content">
    @include('admin.message')
    
    <div class="row">
        <!-- left column -->
        <div class="col-xs-12">
            <div class="box box-primary">
                <!-- general form elements -->
                <div class="box-header with-border">
                  <div class="row">
                    <div class="col-md-10">
                      <h3 class="box-title"> {{ __('adminstaticword.Edit') }} {{ __('adminstaticword.Channel') }}</h3>
                    </div>
                    <div class="col-md-2">
                      <div>
                        <h4 class="admin-form-text"><a href="{{url('plus_channels')}}" data-toggle="tooltip"
                            data-original-title="Go back" class="btn-floating"><i class="material-icons"><button
                                class="btn btn-xs btn-success abc">
                                << {{ __('adminstaticword.Back') }}</button> </i></a></h4>
                      </div>
                    </div>
                  </div>
                </div>
                <br>
                <!-- /.box-header -->
                <div class="box-body">
                    <div class="form-group">
                        <form action="{{ route('plus_channels.update', $plusChannel->id) }}" method="post"
                            enctype="multipart/form-data">
                            {{ csrf_field() }}
                            {{ method_field('PUT') }}

                            <div class="row">

                              <div class="col-md-6">
                                <label for="name">{{ __('adminstaticword.Channel') }}名稱:<sup
                                        class="redstar">*</sup></label>
                                <input type="text" class="form-control" name="name" id="name"
                                    value="{{ $plusChannel->name }}" maxlength="11">
                              </div>

                              <div class="col-md-6 form-group">
                                <label for="parent">上層{{ __('adminstaticword.Channel') }}: <sup class="redstar">*</sup></label>
                                <select disabled name="parent" class="form-control" id="parent">
                                    @if ($mainChannel->isEmpty())
                                    <option value="0">無任何上層</option>
                                    @else
                                    <option value="0">無任何上層</option>
                                    @foreach ($mainChannel as $item)
                                        <option value="{{ $item->id }}" @if ($item->id == $plusChannel->parent) selected @endif>{{ $item->name }}</option>
                                    @endforeach
                                    @endif
                                </select>
                                <input type="hidden" name="parent" value="{{ $plusChannel->parent }}">
                              </div>

                              <div class="col-md-3 price-area">
                                <label for="price">{{ __('adminstaticword.SalePrice') }}: <sup class="redstar">*</sup></label>
                                <input type="number" name="price" class="form-control" id="price" value="{{ $plusChannel->price }}" min="0">
                              </div>

                              <div class="col-sm-3 product-cate-area">
                                <label for="product_cate_id">{{ __('adminstaticword.ProductCate') }}:</label><sup class="redstar">*</sup>
                                <select name="product_cate_id" class="form-control" id="product_cate_id" @if($item->id == $plusChannel->parent) required @endif>
                                  @foreach ($productCategory as $item)
                                    <option value="{{ $item->id }}" @if($item->id == $plusChannel->product_cate_id) selected @endif>{{ $item->cate_name }}</option>
                                  @endforeach
                                </select>
                              </div>
                              <div class="col-sm-3 product-code-area">
                                <label for="product_code">{{ __('adminstaticword.ProductCode') }}:</label><sup class="redstar">*</sup>
                                <input type="text" id="product_code" class="form-control" name="product_code" value="{{ $plusChannel->product_code }}"  @if($item->id == $plusChannel->parent) required @endif>
                              </div>
                                
                              <br>
                              {{-- <div class="col-md-6 price-Area">
                                <label for="offer_price">{{ __('adminstaticword.SpecialPrice') }}: </label>
                                <input type="number" name="offer_price" class="form-control" id="offer_price" value="{{ $plusChannel->offer_price }}" min="0">
                              </div> --}}

                              <div class="col-md-12 introduce">
                                <label for="introduce">{{ __('adminstaticword.Channel') }}簡介: </label>
                                <br>
                                <textarea name="detail" id="introduce" cols="30" rows="5" style="width: 100%; margin-bottom:36px">{{$plusChannel->detail}}</textarea>
                              </div>
                                
                  
                              <div class="col-md-6 image-area">
                                <label>{{ __('adminstaticword.PreviewImage') }}:</label> - <p class="inline info">size: 250x150</p>
                                <input type="file" name="image" id="image" class="inputfile inputfile-1" accept=".jpeg,.png,.jpg,.gif,.svg">
                                <label for="image"><svg xmlns="http://www.w3.org/2000/svg" width="20" height="17" viewBox="0 0 20 17">
                                    <path
                                      d="M10 0l-5.2 4.9h3.3v5.1h3.8v-5.1h3.3l-5.2-4.9zm9.3 11.5l-3.2-2.1h-2l3.4 2.6h-3.5c-.1 0-.2.1-.2.1l-.8 2.3h-6l-.8-2.2c-.1-.1-.1-.2-.2-.2h-3.6l3.4-2.6h-2l-3.2 2.1c-.4.3-.7 1-.6 1.5l.6 3.1c.1.5.7.9 1.2.9h16.3c.6 0 1.1-.4 1.3-.9l.6-3.1c.1-.5-.2-1.2-.7-1.5z" />
                                  </svg> <span>{{ __('adminstaticword.Chooseafile') }}&hellip;</span></label>
                                    @if(isset($plusChannel->image))
                                        <img src="{{ gc_asset( 'images/pluschannel/' . $plusChannel->image )   }}">
                                    @endif 
                              </div>

                            </div>

                            <br>

                            <!--Stripe Subscription-->
                            <div class="box-footer">
                                <button type="submit" class="btn btn-lg col-md-3 btn-primary">{{
                                    __('adminstaticword.Save') }}</button>
                            </div>

                        </form>
                    </div>
                </div>
                <!-- /.box -->
            </div>
        </div>
        <!--/.col (right) -->
    </div>
    <!-- /.row -->
</section>

@endsection



@section('script')


{{-- 上層頻道選項下面呈現 --}}
<script>
  var parent = document.querySelector('#parent')
  var priceArea = document.querySelector('.price-area')
  var price = document.querySelector('#price')
  var detail = document.querySelector('.introduce')
  var imageArea = document.querySelector('.image-area')
  var productCate = document.querySelector('.product-cate-area')
  var productCode = document.querySelector('.product-code-area')

  if (parent.value != 0) {
    detail.style.display = 'none'
    priceArea.style.display = 'none'
    price.required = false
    imageArea.style.display = 'none'
    productCate.style.display = 'none'
    productCode.style.display = 'none'
  }else if(parent.value != 0){
    priceArea.style.display = 'block'
    price.required = true
    detail.style.display = 'block'
    imageArea.style.display = 'block'
    productCate.style.display = 'block'
    productCode.style.display = 'block'
  }
  
  parent.addEventListener('change',  () => {
    if (parent.value != 0) {
      detail.style.display = 'none'
      priceArea.style.display = 'none'
      price.required = false
      imageArea.style.display = 'none'
      productCate.style.display = 'none'
      productCode.style.display = 'none'
    }else if(parent.value == 0){
      priceArea.style.display = 'block'
      price.required = true
      detail.style.display = 'block'
      imageArea.style.display = 'block'
      productCate.style.display = 'block'
      productCode.style.display = 'block'
    }
  })

</script>

@endsection