@php
    /*
     * 商品金額変更予約（待機中）のバッジ
     * ｜金額系6項目は3ブロックに分散しているため、項目キーで引ける形で受け取る
     * ｜（アイテム詳細＝付属原価/粗利算出用単価/標準仕入単価、購入価格＝価格、
     * 　 大箱サイズ末尾＝参考売価/上代価格）
     * ｜登録・取消の導線は編集画面のヘッダ（edit.blade.php）に置く
     */
    $priceScheduleBadges = ($mode == 'edit' && isset($priceSchedule)) ? $priceSchedule->badges : [];
@endphp
<div class="flex-col-gap" >

    <x-box.entry class="entry-base-2">
        <div class="entry-base-2">
            <div class="entry">
                <!-- box-1 -->
                <div class="flex flex-col gap-3">
                    <x-box.block title="主要情報">
                        <div>
                            <label class="required">商品コード</label>
                            <div>
                                <x-input.text name="product_code" class="w-full" 
                                    value="{{old('product_code', $product->product_code)}}" />
                                <x-input.error item="product_code" />
                            </div>
                        </div>
                        <div>
                            <label>品番/規格</label>
                            <div>
                                <x-input.text name="product_spec" class="w-full" 
                                    value="{{old('product_spec', $product->product_spec)}}" />
                                <x-input.error item="product_spec" />
                            </div>
                        </div>
                        <div>
                            <label class="required">商品名</label>
                            <div>
                                <x-input.text name="product_name" class="w-full" 
                                    value="{{old('product_name', $product->product_name)}}" />
                                <x-input.error item="product_name" />
                            </div>
                        </div>
                        <div>
                            <label>商品名索引</label>
                            <div>
                                <x-input.text name="product_name_index" class="w-full" 
                                    value="{{old('product_name_index', $product->product_name_index)}}" />
                                <x-input.error item="product_name_index" />
                            </div>
                        </div>
                        <div>
                            <label>商品名略称</label>
                            <div>
                                <x-input.text name="product_name_abbr" class="w-full" 
                                    value="{{old('product_name_abbr', $product->product_name_abbr)}}" />
                                <x-input.error item="product_name_abbr" />
                            </div>
                        </div>
                        <div>
                            <label>英語商品名</label>
                            <div>
                                <x-input.text name="product_name_en" class="w-full" 
                                    value="{{old('product_name_en', $product->product_name_en)}}" />
                                <x-input.error item="product_name_en" />
                            </div>
                        </div>
                        <div>
                            <label>JANコード</label>
                            <div>
                                <x-input.text name="jan_code" class="w-full" 
                                    value="{{old('jan_code', $product->jan_code)}}" />
                                <x-input.error item="jan_code" />
                            </div>
                        </div>
                        <div>
                            <label class="required">商品区分</label>
                            <div>
                                <x-input.enum-select key="ProductType" name="product_type" class="w-full" required  
                                    value="{{old('product_type', $product->product_type)}}" />
                                <x-input.error item="product_type" />
                            </div>
                        </div>
                        <div>
                            <label class="required">セット品区分</label>
                            <div>
                                <x-input.enum-select key="SetType" name="set_type" class="w-full" required  
                                    value="{{old('set_type', $product->set_type)}}" />
                                <x-input.error item="set_type" />
                            </div>
                        </div>
                        <div>
                            <label class="required">諸口区分</label>
                            <div>
                                <x-input.enum-select key="CustomNameAllowed" name="is_custom_name_allowed" class="w-full" required 
                                    value="{{old('is_custom_name_allowed', $product->is_custom_name_allowed)}}" />
                                <x-input.error item="is_custom_name_allowed" />
                            </div>
                        </div>
                        <div>
                            <label class="required">オープンフラグ</label>
                            <div>
                                <x-input.enum-select key="OpenPriceFlag" name="open_price_flag" class="w-full" required 
                                    value="{{old('open_price_flag', $product->open_price_flag)}}" />
                                <x-input.error item="open_price_flag" />
                            </div>
                        </div>
                        <div>
                            <label>粗利計算用単価変更可能</label>
                            <div class="check-flag">
                                <x-input.check name="is_shipping_fee_editable" text="粗利計算用単価変更可能" 
                                    on="{{Enum::value('IsShippingFeeEditable.Changeable')}}"
                                    off="{{Enum::value('IsShippingFeeEditable.Unchangeable')}}"
                                    value="{{old('is_shipping_fee_editable', $product->is_shipping_fee_editable)}}" />
                                <x-input.error item="is_shipping_fee_editable" />
                            </div>
                        </div>
                        <div>
                            <label>在庫表出力</label>
                            <div class="check-flag">
                                <x-input.check name="stock_output_type" text="在庫表出力" 
                                    on="{{Enum::value('StockOutputType.Output')}}"
                                    off="{{Enum::value('StockOutputType.NotOutput')}}"
                                    value="{{old('stock_output_type', $product->stock_output_type)}}" />
                                <x-input.error item="stock_output_type" />
                            </div>
                        </div>
                        <div>
                            <label>無効</label>
                            <div class="check-flag">
                                <x-input.is-active name="is_active" value="{{old('is_active', $product->is_active)}}" />
                                <x-input.error item="is_active" />
                            </div>
                        </div>
                        <div>
                            <label>終了商品</label>
                            <div class="check-flag">
                                <x-input.check name="is_end_of_sale" text="{{Enum::xname('IsEndOfSale.EndOfSale')}}"
                                    on="{{Enum::value('IsEndOfSale.EndOfSale')}}"
                                    off="{{Enum::value('IsEndOfSale.Normal')}}"
                                    value="{{old('is_end_of_sale', $product->is_end_of_sale)}}" />
                                <x-input.error item="is_end_of_sale" />
                            </div>
                        </div>
                    </x-box.block>

                    <x-box.block title="分類">
                        <div>
                            <label>デフォルト在庫場所</label>
                            <div>
                                <x-parts.select-warehouse name="default_warehouse_id"
                                    value="{{old('default_warehouse_id', $product->default_warehouse_id)}}" />
                                    <x-input.error item="default_warehouse_id" />
                            </div>
                        </div>
                        <div>
                            <label>販路</label>
                            <div>
                                <x-parts.select-business_type name="business_type_id" class="w-full"
                                    value="{{old('business_type_id', $product->business_type_id)}}" />
                                <x-input.error item="business_type_id" />
                            </div>
                        </div>
                    </x-box.block>

                    <x-box.block title="アイテム詳細">
                        <div>
                            <label>付属原価</label>
                            <div>
                                <x-input.number name="accessory_cost_price" class="w-full" digit="2"
                                    value="{{old('accessory_cost_price', $product->accessory_cost_price)}}" />
                                <x-input.error item="accessory_cost_price" />
                                <x-schedule.pending-badge class="mt-1"
                                    :schedule="$priceScheduleBadges['accessory_cost_price'] ?? null" />
                            </div>
                        </div>
                        <div>
                            <label>粗利算出用単価</label>
                            <div>
                                <x-input.number name="profit_calc_price" class="w-full" digit="2"
                                    value="{{old('profit_calc_price', $product->profit_calc_price)}}" />
                                <x-input.error item="profit_calc_price" />
                                <x-schedule.pending-badge class="mt-1"
                                    :schedule="$priceScheduleBadges['profit_calc_price'] ?? null" />
                            </div>
                        </div>
                        <div>
                            <label>標準仕入単価</label>
                            <div>
                                <x-input.number name="cost_price" class="w-full" digit="2"
                                    value="{{old('cost_price', $product->cost_price)}}" />
                                <x-input.error item="cost_price" />
                                <x-schedule.pending-badge class="mt-1"
                                    :schedule="$priceScheduleBadges['cost_price'] ?? null" />
                            </div>
                        </div>
                        <div>
                            <label>移動平均単価</label>
                            <div>
                                <x-input.number name="avg_cost" class="w-full" digit="2"
                                    value="{{old('avg_cost', $product->avg_cost)}}" />
                                <x-input.error item="avg_cost" />
                            </div>
                        </div>
                    </x-box.block>

                    <x-box.block title="在庫管理">
                        <div>
                            <label>適正在庫水準</label>
                            <div>
                                <x-input.number name="proper_stock_quantity" class="w-full" digit="0"
                                    value="{{old('proper_stock_quantity', $product->proper_stock_quantity)}}" />
                                <x-input.error item="proper_stock_quantity" />
                            </div>
                        </div>
                        <div>
                            <label>再オーダーポイント</label>
                            <div>
                                <x-input.number name="reorder_point" class="w-full" digit="0"
                                    value="{{old('reorder_point', $product->reorder_point)}}" />
                                <x-input.error item="reorder_point" />
                           </div>
                        </div>
                        <div>
                            <label>仕入先</label>
                            <div style="min-height:40px;">
                                <livewire:parts.input-supplier name="supplier_id"
                                    value="{{old('supplier_id', $product->supplier_id)}}" >
                                <x-input.error item="supplier_id" />
                            </div>
                        </div>
                    </x-box.block>

                    <x-box.block title="購入価格">
                        <div>
                            <label>通貨</label>
                            <div>
                                <x-input.text readonly id="supplier_currency_display" value="{{$product->supplier_currency}}" />
                            </div>
                        </div>
                        <div>
                            <label>価格</label>
                            <div>
                                <x-input.number name="supplier_price" class="w-full" digit="2" value="{{old('supplier_price', $product->supplier_price)}}" />
                                <x-input.error item="supplier_price" />
                                {{-- 予約の適用先は product_suppliers の最優先1件（priority昇順→id昇順） --}}
                                <x-schedule.pending-badge class="mt-1"
                                    :schedule="$priceScheduleBadges['default_cost_price'] ?? null" />
                            </div>
                        </div>
                    </x-box.block>

                    <!--在庫場所一覧-->
                    <x-box.block title="在庫一覧">
                        <div class="py-2">
                            <div x-data="Parts.entrySub" data-id="inventory"
                                x-init="def({{json_encode($inventory->toArray())}})" >
                            
                                <div  class="mt-1.5">
                                <table class="entry-list-table">
                                    <colgroup>
                                    <col class="min-w-24">
                                    <col class="w-24">
                                    <col class="w-24">
                                    <col class="w-24">
                                    <col class="w-24">
                                    </colgroup>
                                    <thead>
                                        <tr>
                                        <th>場所</th>
                                        <th>手持数量</th>
                                        <th>注文済数量</th>
                                        <th>確保済数量</th>                                          
                                        <th>使用可能数量</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                    <template x-for="row in rows" :key="row.id"> 
                                        <tr>
                                        <td x-text="row.warehouse_name"></td>
                                        <td x-text="Editor.numberFormat(row.qty)" class="text-right"></td>
                                        <td x-text="Editor.numberFormat(row.order_qty)" class="text-right"></td>
                                        <td x-text="Editor.numberFormat(row.allocated_qty)" class="text-right"></td>
                                        <td x-text="Editor.numberFormat(row.available_qty)" class="text-right"></td>
                                        </tr>
                                    </template>
                                    </tbody>
                                    
                                </table>
                                </div>
                            </div>
                        </div>
                    </x-box.block>

                   <x-box.block title="販売">
                        <div>
                            <label>販売の説明</label>
                            <div>
                                <x-input.textarea name="note" class="w-full" 
                                    value="{{old('note', $product->note)}}" />
                                <x-input.error item="note" />
                            </div>
                        </div>
                   </x-box.block>
                    
                    <x-box.block title="販売／価格設定">
                        @if($mode == 'edit')
                            <livewire:partials.user.product.entry-product-price-detail 
                                mode="edit" :productId="$product->id" />
                        @endif

                        <div>
                            <label class="required">消費税区分(販売)</label> 
                            <div>
                                <x-input.enum-select key="RateTaxType" name="sales_tax_type" class="w-full" required 
                                    value="{{old('sales_tax_type', $product->sales_tax_type ?? \Enum::value('RateTaxType.Taxable'))}}" />
                                <x-input.error item="sales_tax_type" />
                            </div>
                        </div>
                        <div>
                            <label class="required">消費税区分(購買)</label>
                            <div>
                                <x-input.enum-select key="RateTaxType" name="purchase_tax_type" class="w-full" required 
                                    value="{{old('purchase_tax_type', $product->purchase_tax_type ?? \Enum::value('RateTaxType.Taxable'))}}" />
                                <x-input.error item="purchase_tax_type" />
                            </div>
                        </div>
                        <div>
                            <label class="required">税率カテゴリ</label>
                            <div>
                                <x-input.enum-select key="RateCategoryForProduct" name="rate_category" class="w-full" required 
                                    value="{{old('rate_category', $product->rate_category)}}" />
                                <x-input.error item="rate_category" />
                            </div>
                        </div>
                    </x-box.block>

                    @if($product->set_type == Enum::value('SetType.Set'))
                    <div id="setComponent">
                    @else
                    <div id="setComponent" style="display: none">
                    @endif
                        <x-box.block title="セット構成商品">
                            <div class="flex items-center justify-between ">
                                <div class="flex-1 flex items-center justify-between gap-3"> 
                                    <div class="flex items-center gap-3">
                                    </div>
                                    <div class="flex items-right gap-3 mt-2">
                                        <x-button.linkage id="btn_set_addrow" text="行追加" icon="fa-solid fa-plus text-xs" />
                                    </div>
                                </div>
                            </div>
                            <div @load.window="fixed()" @resize.window="fixed()" @toggle-open.window="fix()">
                                    <div class="scroll-wrap thin-scroll" x-ref="wrap" style="min-height:120px;">
                                        <livewire:partials.user.product.entry-set-component-detail mode="{{$mode}}" 
                                            :details="$setComponent" :header="$product" />
                                    </div>
                                </div>
                            
                        </x-box.block>
                    </div>
                    @if( $product->set_type==Enum::value('SetType.Single') && $product->product_type!=Enum::value('ProductType.Parts'))
                    <div id="partComponent">
                    @else
                    <div id="partComponent" style="display: none">
                    @endif
                        <x-box.block title="パーツ構成">
                            <div class="flex items-center justify-between ">
                                <div class="flex-1 flex items-center justify-between gap-3"> 
                                    <div class="flex items-center gap-3">
                                    </div>
                                    <div class="flex items-right gap-3 mt-2">
                                        <x-button.linkage id="btn_parts_addrow" text="行追加" icon="fa-solid fa-plus text-xs" />
                                    </div>
                                </div>
                            </div>
                            <div @load.window="fixed()" @resize.window="fixed()" @toggle-open.window="fix()">
                                <div class="scroll-wrap thin-scroll" x-ref="wrap" style="min-height:120px;">
                                    <livewire:partials.user.product.entry-parts-component-detail 
                                       :details="$partComponent" :header="$product" />
                                </div>
                            </div>
                        </x-box.block>
                    </div>
                    @if($product->product_type==Enum::value('ProductType.Parts'))
                        <x-box.block title="パーツ親商品">
                            <div class="py-2">
                                <div x-data="Parts.entrySub" data-id="partComponent"
                                    x-init="def({{json_encode($parentPartComponent->toArray())}})" >
                                    <div class="mt-1.5">
                                        <table class="entry-list-table">
                                            <colgroup>
                                                <col class="min-w-24">
                                            </colgroup>
                                            <thead>
                                                <tr>
                                                    <th>商品</th>
                                                </tr>
                                            </thead>
                                            <tbody>
                                            @foreach($parentPartComponent as $row)
                                            @php($url = route('products.modal', ['product'=>$row->parent_product_id]))
                                                <tr>
                                                    <td>
                                                        @php($canView = (App\Services\Logic\Assist::getCurrentRoutePermissions()->canView))
                                                        @if($canView)
                                                        <x-button.link-a id="link_product" text="{{$row->product_name}}" @click="show('{{$url}}', '7xl')" />
                                                        @else
                                                        {{$row->product_name}}
                                                        @endif
                                                    </td>
                                                </tr>
                                            @endforeach
                                            </tbody>
                                        </table>
                                    </div>
                                </div>
                            </div>
                        </x-box.block>
                    @endif

                </div>
                <!-- box-2 -->
                <div class="flex flex-col gap-3">
                    
                <!-- 使用からは削除 START-->
{{--
                <x-box.block title="仕入先">
                    <div class="py-2">
                        @if($mode == 'create')
                        <x-input.caution-box>仕入先は商品の登録後に入力できます。</x-input.caution-box></div>
                        @elseif($mode == 'edit' || $mode == 'copy')
                        <div x-data="Parts.entrySub" data-id="suppliers"
                            x-init="def({{json_encode($suppliers->toArray())}})" >
                            @if($mode == 'edit')
                                @php($url = route('product-suppliers.index', ['product'=>$product->id]))
                                <x-button.entry-sub text="仕入先入力" @click="show('{{$url}}', '5xl')" />
                            @endif
                            @if($mode == 'copy')
                            <x-input.caution-box>仕入先は商品の登録後に修正できます。</x-input.caution-box>
                            @endif
                            <div  class="mt-1.5">
                            <table class="entry-list-table">
                                <colgroup>
                                    <col class="w-24">
                                    <col class="max-w-24">
                                    <col class="w-24">
                                    <col class="w-28">
                                </colgroup>
                                <thead>
                                    <tr>
                                        <th>仕入先コード</th>
                                        <th>仕入先名</th>
                                        <th>通貨</th>
                                        <th>価格</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    <template x-for="row in rows" :key="row.id"> 
                                    <tr>
                                        <td x-text="row.supplier_code"></td>
                                        <td x-text="row.supplier_name"></td>
                                        <td x-text="row.currency_name"></td>
                                        <td x-text="Editor.numberFormat(row.default_cost_price)" class="text-right"></td>
                                    </tr>
                                    </template>
                                </tbody>
                            </table>
                            </div>
                        </div>
                        @endif
                    </div>
                    </x-box.block>
<!-- 使用からは削除 END-->
 --}}



 
                    <x-box.block title="詳細情報">
                        <div>
                            <label>大分類</label>
                            <div>
                                <livewire:parts.select-category-for-product 
                                    :level="1" :notify="true" suffix=".lv1"
                                    name="category_lv1_id" 
                                    value="{{old('category_lv1_id', $product->category_lv1_id)}}" />
                                <x-input.error item="category_lv1_id" />
                            </div>
                        </div>
                        <div>
                            <label>中分類</label>
                            <div>
                                <livewire:parts.select-category-for-product 
                                    :level="2" :notify="true" suffix=".lv2"
                                    name="category_lv2_id" 
                                    parentId="{{old('category_lv1_id', $product->category_lv1_id)}}"
                                    value="{{old('category_lv2_id', $product->category_lv2_id)}}" />
                                <x-input.error item="category_lv2_id" />
                            </div>
                        </div>
                        <div>
                            <label>小分類</label>
                            <div>
                                <livewire:parts.select-category-for-product 
                                    :level="3" :notify="true" suffix=".lv3"
                                    name="category_lv3_id" 
                                    parentId="{{old('category_lv2_id', $product->category_lv2_id)}}"
                                    value="{{old('category_lv3_id', $product->category_lv3_id)}}" />
                                <x-input.error item="category_lv3_id" />
                            </div>
                        </div>
                        <div>
                            <label>細分類</label>
                            <div>
                                <livewire:parts.select-category-for-product 
                                    :level="4" :notify="true" suffix=".lv4"
                                    name="category_lv4_id" 
                                    parentId="{{old('category_lv3_id', $product->category_lv3_id)}}"
                                    value="{{old('category_lv4_id', $product->category_lv4_id)}}" />
                                <x-input.error item="category_lv4_id" />
                            </div>
                        </div>
                    </x-box.block>

                    <x-box.block title="本体サイズ">
                        <div>
                            <label>（横・W）</label>
                            <div>
                                <x-input.number name="body_width" class="w-full" digit="2"
                                    value="{{old('body_width', $product->body_width)}}" />
                                <x-input.error item="body_width" />
                            </div>
                        </div>
                        <div>
                            <label>（高さ・H）</label>
                            <div>
                                <x-input.number name="body_height" class="w-full" digit="2"
                                    value="{{old('body_height', $product->body_height)}}" />
                                <x-input.error item="body_height" />
                            </div>
                        </div>
                        <div>
                            <label>（奥行・D）</label>
                            <div>
                                <x-input.number name="body_depth" class="w-full" digit="2"
                                    value="{{old('body_depth', $product->body_depth)}}" />
                                <x-input.error item="body_depth" />
                            </div>
                        </div>
                        <div>
                            <label>（重量・g）</label>
                            <div>
                                <x-input.number name="body_weight" class="w-full" digit="2"
                                    value="{{old('body_weight', $product->body_weight)}}" />
                                <x-input.error item="body_weight" />
                            </div>
                        </div>
                    </x-box.block>

                    <x-box.block title="PKGサイズ">
                        <div>
                            <label>（横・W）</label>
                            <div>
                                <x-input.number name="pkg_width" class="w-full" digit="2" value="{{old('pkg_width', $product->pkg_width)}}" />
                                <x-input.error item="pkg_width" />
                            </div>
                        </div>
                        <div>
                            <label>（高さ・H）</label>
                            <div>
                                <x-input.number name="pkg_height" class="w-full" digit="2" value="{{old('pkg_height', $product->pkg_height)}}" />
                                <x-input.error item="pkg_height" />
                            </div>
                        </div>
                        <div>
                            <label>（奥行・D）</label>
                            <div>
                                <x-input.number name="pkg_depth" class="w-full" digit="2" value="{{old('pkg_depth', $product->pkg_depth)}}" />
                                <x-input.error item="pkg_depth" />
                            </div>
                        </div>
                        <div>
                            <label>（重量・g）</label>
                            <div>
                                <x-input.number name="pkg_weight" class="w-full" digit="2" value="{{old('pkg_weight', $product->pkg_weight)}}" />
                                <x-input.error item="pkg_weight" />
                            </div>
                        </div>
                    </x-box.block>

                    <x-box.block title="小箱サイズ">
                        <div>
                            <label>（横・W）</label>
                            <div>
                                <x-input.number name="inner_case_width" class="w-full" digit="2" value="{{old('inner_case_width', $product->inner_case_width)}}" />
                                <x-input.error item="inner_case_width" />
                            </div>
                        </div>
                        <div>
                            <label>（高さ・H）</label>
                            <div>
                                <x-input.number name="inner_case_height" class="w-full" digit="2" value="{{old('inner_case_height', $product->inner_case_height)}}" />
                                <x-input.error item="inner_case_height" />
                            </div>
                        </div>
                        <div>
                            <label>（奥行・D）</label>
                            <div>
                                <x-input.number name="inner_case_depth" class="w-full" digit="2" value="{{old('inner_case_depth', $product->inner_case_depth)}}" />
                                <x-input.error item="inner_case_depth" />
                            </div>
                        </div>
                        <div>
                            <label>（重量・g）</label>
                            <div>
                                <x-input.number name="inner_case_weight" class="w-full" digit="2" value="{{old('inner_case_weight', $product->inner_case_weight)}}" />
                                <x-input.error item="inner_case_weight" />
                            </div>
                        </div>
                    </x-box.block>

                    <x-box.block title="大箱サイズ">
                        <div>
                            <label>（横・W）</label>
                            <div>
                                <x-input.number name="outer_case_width" class="w-full" digit="2" value="{{old('outer_case_width', $product->outer_case_width)}}" />
                                <x-input.error item="outer_case_width" />
                            </div>
                        </div>
                        <div>
                            <label>（高さ・H）</label>
                            <div>
                                <x-input.number name="outer_case_height" class="w-full" digit="2" value="{{old('outer_case_height', $product->outer_case_height)}}" />
                                <x-input.error item="outer_case_height" />
                            </div>
                        </div>
                        <div>
                            <label>（奥行・D）</label>
                            <div>
                                <x-input.number name="outer_case_depth" class="w-full" digit="2" value="{{old('outer_case_depth', $product->outer_case_depth)}}" />
                                <x-input.error item="outer_case_depth" />
                            </div>
                        </div>
                        <div>
                            <label>（重量・g）</label>
                            <div>
                                <x-input.number name="outer_case_weight" class="w-full" digit="2" value="{{old('outer_case_weight', $product->outer_case_weight)}}" />
                                <x-input.error item="outer_case_weight" />
                            </div>
                        </div>
                        <div>
                            <label>容器包装_紙重量</label>
                            <div>
                                <x-input.number name="package_weight_paper" class="w-full" digit="2" value="{{old('package_weight_paper', $product->package_weight_paper)}}" />
                                <x-input.error item="package_weight_paper" />
                            </div>
                        </div>
                        <div>
                            <label>容器包装_プラ重量</label>
                            <div>
                                <x-input.number name="package_weight_plastic" class="w-full" digit="2"
                                    value="{{old('package_weight_plastic', $product->package_weight_plastic)}}" />
                                <x-input.error item="package_weight_plastic" />
                            </div>
                        </div>
                        <div>
                            <label>後継品商品名</label>
                            <div>
                                <x-input.text name="successor_product_name" class="w-full"
                                    value="{{old('successor_product_name', $product->successor_product_name)}}" />
                                <x-input.error item="successor_product_name" />
                            </div>
                        </div>
                        <div>
                            <label>参考売価</label>
                            <div>
                                <x-input.number name="reference_price" class="w-full" digit="0"
                                    value="{{old('reference_price', $product->reference_price)}}" />
                                <x-input.error item="reference_price" />
                                <x-schedule.pending-badge class="mt-1"
                                    :schedule="$priceScheduleBadges['reference_price'] ?? null" />
                            </div>
                        </div>
                        <div>
                            <label>上代価格</label>
                            <div>
                                <x-input.number name="list_price" class="w-full" digit="0"
                                    value="{{old('list_price', $product->list_price)}}" />
                                <x-input.error item="list_price" />
                                {{-- オープンプライス商品でも上代の予約は許容する（REQ-1.9） --}}
                                <x-schedule.pending-badge class="mt-1"
                                    :schedule="$priceScheduleBadges['list_price'] ?? null" />
                            </div>
                        </div>
                    
                    </x-box.block>

                    <x-box.block title="商品管理">

                        <div>
                            <label>商品性格</label>
                            <div>
                                <x-input.text name="product_character" class="w-full" 
                                    value="{{old('product_character', $product->product_character)}}" />
                                <x-input.error item="product_character" />
                            </div>
                        </div>
                        <div>
                            <label>販売予定日</label>
                            <div>
                                <x-input.date name="sales_start_date" class="w-full" value="{{old('sales_start_date', $product->sales_start_date)}}" />
                                <x-input.error item="sales_start_date" />
                            </div>
                        </div>
                        <div>
                            <label>廃番日</label>
                            <div>
                                <x-input.date name="discontinued_date" class="w-full" value="{{old('discontinued_date', $product->discontinued_date)}}" />
                                <x-input.error item="discontinued_date" />
                            </div>
                        </div>
                        <div>
                            <label>ロケーション(1F)</label>
                            <div>
                                <x-input.text name="location_1f" class="w-full" value="{{old('location_1f', $product->location_1f)}}" />
                                <x-input.error item="location_1f" />
                            </div>
                        </div>
                        <div>
                            <label>ロケーション(3Fバラ)</label>
                            <div>
                                <x-input.text name="location_3f_unit" class="w-full" value="{{old('location_3f_unit', $product->location_3f_unit)}}" />
                                <x-input.error item="location_3f_unit" />
                            </div>
                        </div>
                        <div>
                            <label>ロケーション(3Fカートン)</label>
                            <div>
                                <x-input.text name="location_3f_carton" class="w-full" value="{{old('location_3f_carton', $product->location_3f_carton)}}" />
                                <x-input.error item="location_3f_carton" />
                            </div>
                        </div>
                        <div>
                            <label>小箱入数</label>
                            <div>
                                <x-input.number name="inner_case_quantity" class="w-full" value="{{old('inner_case_quantity', $product->inner_case_quantity)}}" />
                                <x-input.error item="inner_case_quantity" />
                            </div>
                        </div>
                        <div>
                            <label>大箱入数</label>
                            <div>
                                <x-input.number name="outer_case_quantity" class="w-full" value="{{old('outer_case_quantity', $product->outer_case_quantity)}}" />
                                <x-input.error item="outer_case_quantity" />
                            </div>
                        </div>
                        <div>
                            <label>カートン入数</label>
                            <div>
                                <x-input.number name="carton_quantity" class="w-full" value="{{old('carton_quantity', $product->carton_quantity)}}" />
                                <x-input.error item="carton_quantity" />
                            </div>
                        </div>
                        <div>
                            <label class="required">在庫管理区分</label>
                            <div>
                                <x-input.enum-select key="StockControlType" name="stock_control_type" class="w-full" required  
                                    value="{{old('stock_control_type', $product->stock_control_type)}}" />
                                <x-input.error item="stock_control_type" />
                            </div>
                        </div>
                        <div>
                            <label>サービス項目</label>
                            <div class="check-flag">
                                <x-input.check name="is_service_item" text="サービス項目" 
                                    on="{{Enum::value('IsServiceItem.On')}}"
                                    off="{{Enum::value('IsServiceItem.Off')}}"
                                    value="{{old('is_service_item', $product->is_service_item)}}" />
                                <x-input.error item="is_service_item" />
                            </div>
                        </div>
                        <div>
                            <label>GTカタログ掲載</label>
                            <div class="check-flag">
                                <x-input.check name="is_gt_catalog" text="{{Enum::xname('IsGtCatalog.Listed')}}" 
                                    on="{{Enum::value('IsGtCatalog.Listed')}}"
                                    off="{{Enum::value('IsGtCatalog.NotListed')}}"
                                    value="{{old('is_gt_catalog', $product->is_gt_catalog)}}" />
                                <x-input.error item="is_gt_catalog" />
                            </div>
                        </div>
                        <div>
                            <label>欠品入荷処理中</label>
                            <div class="check-flag">
                                <x-input.check name="is_backorder_processing" text="{{Enum::xname('IsBackorderProcessing.AwaitingStock')}}" 
                                    on="{{Enum::value('IsBackorderProcessing.AwaitingStock')}}"
                                    off="{{Enum::value('IsBackorderProcessing.Normal')}}"
                                    value="{{old('is_backorder_processing', $product->is_backorder_processing)}}" />
                                <x-input.error item="is_backorder_processing" />
                            </div>
                        </div>
                        <div>
                            <label>賞味期限期間(月数)</label>
                            <div>
                                <x-input.number name="expiration_months" class="w-full" 
                                    value="{{old('expiration_months', $product->expiration_months)}}" />
                                <x-input.error item="expiration_months" />
                            </div>
                        </div>
                        <div>
                            <label>アイテム・オプション</label>
                            <div>
                                <x-input.textarea name="item_options" class="w-full" value="{{old('item_options', $product->item_options)}}" />
                                <x-input.error item="item_options" />
                            </div>
                        </div>
                    </x-box.block>
                </div>
                
                
                </div>
            </div>
        </div>
    </x-box.entry>
    
    {{-- modal --}}
    <x-modal.search key="search" id="search" />
    <x-modal.frame key="frame" id="frame" />
    <x-modal.frame key="entry-sub" id="entry_sub" />

    {{-- script --}}
    <script>
        window.addEventListener('load', () => {
            // モーダルからメッセージを受信したとき
            /*
            window.addEventListener("message", (event) => {
                const modal = document.querySelector('div[data-key="frame"]');
                //const type = modal.dataset.rtntype;
                // メッセージを送信する
                //this.sendMessage(modal.id, event.data, type);
                console.log(modal.id, event.data);
                // モーダルを閉じる
                MicroModal.close();
            });
            */

            /* ｜行追加ボタンの押下時 */
            const setrow = 'partials.user.product.entry-set-component-detail';
            const btnSetAddrow = document.querySelector('#btn_set_addrow');
            if (btnSetAddrow) {
                btnSetAddrow.addEventListener('click', (event) => {
                    // 入力内容（商品)を保持する
                    const componentProductIds = [...document.querySelectorAll('#setComponent [id^="component_product_id_"]')].map(element => element.value);

                    Livewire.dispatch(setrow + '.add', { componentProductIds: componentProductIds });
                });
            }
            const partsrow = 'partials.user.product.entry-parts-component-detail';
            const btnPartsAddrow = document.querySelector('#btn_parts_addrow');
            if (btnPartsAddrow) {
                btnPartsAddrow.addEventListener('click', (event) => {
                    // 入力内容（商品)を保持する
                    const componentProductIds = [...document.querySelectorAll('#partComponent [id^="component_product_id_"]')].map(element => element.value);

                    Livewire.dispatch(partsrow + '.add', { componentProductIds: componentProductIds });
                });
            }
        });

        document.addEventListener('DOMContentLoaded', function() {
            // 仕入先選択時に通貨を更新
            Livewire.on('supplier-currency-updated', (event) => {
                const currencyInput = document.getElementById('supplier_currency_display');
                if (currencyInput && event.currencyName) {
                    currencyInput.value = event.currencyName;
                }
            });

            // セット品区分は商品区分が通常商品(1)かBE品(2)の場合のみ入力できるようにする
            /*const productTypeSelect = document.querySelector('select[name="product_type"]');
            const setTypeSelect = document.querySelector('select[name="set_type"]');
            productTypeSelect.addEventListener('change', function() {
                const selectedValue = productTypeSelect.value;
                if (selectedValue == {{ \Enum::value('ProductType.Normal') }} ||
                    selectedValue == {{ \Enum::value('ProductType.Be') }}) {
                    setTypeSelect.removeAttribute('disabled');
                } else {
                    setTypeSelect.setAttribute('disabled', 'disabled');
                }
            });
            const initialValue = productTypeSelect.value;
            if (initialValue == {{ \Enum::value('ProductType.Normal') }} ||
                initialValue == {{ \Enum::value('ProductType.Be') }}) {
                setTypeSelect.removeAttribute('disabled');
            } else {
                setTypeSelect.setAttribute('disabled', 'disabled');
            }*/

            // 単価登録画面を閉じた後、変更内容を反映させる
            const closeButtons = document.querySelectorAll('[data-micromodal-close]');
            closeButtons.forEach(button => {
                button.addEventListener('click', () => {
                    Livewire.dispatchTo('partials.user.product.entry-product-price-detail', 'refreshComponent');
                });
            });

            /* ｜行削除ボタンの押下時 */
            const setrow = 'partials.user.product.entry-set-component-detail';
            window.deleteSetRow = (index) => {
                // 入力内容（商品)を保持する
                const componentProductIds = [...document.querySelectorAll('[id^="component_product_id_"]')].map(element => element.value);

                Livewire.dispatch(setrow + '.delete', { index: index, componentProductIds: componentProductIds });
            }
            const partsrow = 'partials.user.product.entry-parts-component-detail';
            window.deletePartsRow = (index) => {
                // 入力内容（商品)を保持する
                const componentProductIds = [...document.querySelectorAll('[id^="component_product_id_"]')].map(element => element.value);

                Livewire.dispatch(partsrow + '.delete', { index: index, componentProductIds: componentProductIds });
            }

            /* ｜バリデーションをAPIで先に行う(Livewireの項目を動かすと正しく動作しないことがあるため) */
            window.verify = (callback=null) => {
                EntryAction.disableAction();
                Action.onLoading();

                const form = document.getElementById('entry');
                let data = EntryAction.getData(form);
                EntryAction.resetError(form);

                const errorElement = document.querySelector('#message_error');
                const nextElement = errorElement ? errorElement.nextElementSibling : null;
                if (nextElement && nextElement.tagName === 'DIV') {
                    nextElement.remove();
                }

                const axiosPost = EntryAction.getPost();
                const url = new URL(form.dataset.verify);
                axiosPost
                .post(url, data, {
                    headers: {
                        'content-type': 'multipart/form-data',
                    }
                })
                .then(function (res) {
                    console.log(res);

                    const status = setResult(res, form);
                    if (status) form.submit();
                    if (callback) callback(form, res);
                    if (!status) Action.onLoading(false);
                    if (!status) EntryAction.disableAction(false);
                })
                .catch(function (err) {
                    console.log(err);
                    Action.onLoading(false);
                    EntryAction.disableAction(false);
                });
            }

            const setResult = (res, obj, fnc = null) => {
                const def = item => item;
                if (fnc===null) fnc = def;
                if (res.data['status'] == 'NG') {
                    for(let item in res.data.errors) {
                        const name = item.replaceAll('.', '_').replaceAll('%', "\\%");
                        const ui = obj.querySelector('#input_error_' + fnc(name));
                        if (ui) {
                            const li = document.createElement("li");
                            li.innerHTML = res.data.errors[item][0];
                            ui.appendChild(li);
                            ui.classList.remove('hidden');
                        }
                    }
                    if (Object.keys(res.data.errors).length > 0) {
                        const messageError = document.getElementById('message_error');
                        messageError.classList.remove('hidden');

                        const message = messageError.children[1];
                        while (message.firstChild) {
                            message.removeChild(message.firstChild);
                        }
                        const inputError = document.createTextNode('