@extends('layouts.app')
@section('content')
<div>
    <div class="Polaris-Page">
        @if(auth()->user()->store_id == "")
            <div>
                <div class="Polaris-Banner Polaris-Banner--statusCritical Polaris-Banner--withinPage" tabindex="0" role="alert" aria-live="polite" aria-labelledby="PolarisBanner6Heading" aria-describedby="PolarisBanner6Content">
                    <div class="Polaris-Banner__Ribbon"><span class="Polaris-Icon Polaris-Icon--colorCritical Polaris-Icon--applyColor"><span class="Polaris-VisuallyHidden"></span><svg viewBox="0 0 20 20" class="Polaris-Icon__Svg" focusable="false" aria-hidden="true">
                        <path d="M11.768.768a2.5 2.5 0 0 0-3.536 0L.768 8.232a2.5 2.5 0 0 0 0 3.536l7.464 7.464a2.5 2.5 0 0 0 3.536 0l7.464-7.464a2.5 2.5 0 0 0 0-3.536L11.768.768zM9 6a1 1 0 1 1 2 0v4a1 1 0 1 1-2 0V6zm2 8a1 1 0 1 1-2 0 1 1 0 0 1 2 0z"></path>
                        </svg></span></div>
                    <div class="Polaris-Banner__ContentWrapper">
                    <div class="Polaris-Banner__Heading" id="PolarisBanner6Heading">
                        <p class="Polaris-Heading">Store Id Missing</p>
                    </div>
                    <div class="Polaris-Banner__Content" id="PolarisBanner6Content">
                        <p>Store ID Missing - Your Store ID is missing. Please enter your Store ID in the Setup Store ID tab. If you do not have a Store ID please email <a href="mailto:sales@americanprintondemand.com">sales@americanprintondemand.com</a></p>
                        <div class="Polaris-Banner__Actions">
                        <div class="Polaris-ButtonGroup">
                            <div class="Polaris-ButtonGroup__Item">
                            <div class="Polaris-Banner__PrimaryAction"><a class="Polaris-Banner__Button" type="button" href="{{ route('settings') }}">View Settings</a></div>
                            </div>
                        </div>
                        </div>
                    </div>
                    </div>
                </div>
                <div id="PolarisPortalsContainer"></div>
            </div>
        @endif
       <div class="Polaris-Page-Header Polaris-Page-Header--isSingleRow Polaris-Page-Header--mobileView Polaris-Page-Header--noBreadcrumbs Polaris-Page-Header--mediumTitle">
          <div class="Polaris-Page-Header__Row">
             <div class="Polaris-Page-Header__TitleWrapper">
                <div>
                   <div class="Polaris-Header-Title__TitleAndSubtitleWrapper">
                      <h1 class="Polaris-Header-Title">Orders</h1>
                   </div>
                </div>
             </div>
          </div>
       </div>
       <div class="Polaris-Page__Content">
          <div class="Polaris-Card">
             <div class="">
                <div class="Polaris-DataTable__Navigation">
                   <button
                      class="Polaris-Button Polaris-Button--disabled Polaris-Button--plain Polaris-Button--iconOnly"
                      aria-label="Scroll table left one column" type="button" disabled="">
                      <span
                         class="Polaris-Button__Content">
                         <span class="Polaris-Button__Icon">
                            <span
                               class="Polaris-Icon">
                               <span class="Polaris-VisuallyHidden"></span>
                               <svg
                                  viewBox="0 0 20 20" class="Polaris-Icon__Svg" focusable="false"
                                  aria-hidden="true">
                                  <path
                                     d="M12 16a.997.997 0 0 1-.707-.293l-5-5a.999.999 0 0 1 0-1.414l5-5a.999.999 0 1 1 1.414 1.414L8.414 10l4.293 4.293A.999.999 0 0 1 12 16z"></path>
                               </svg>
                            </span>
                         </span>
                      </span>
                   </button>
                   <button class="Polaris-Button Polaris-Button--plain Polaris-Button--iconOnly"
                      aria-label="Scroll table right one column" type="button">
                      <span
                         class="Polaris-Button__Content">
                         <span class="Polaris-Button__Icon">
                            <span
                               class="Polaris-Icon">
                               <span class="Polaris-VisuallyHidden"></span>
                               <svg
                                  viewBox="0 0 20 20" class="Polaris-Icon__Svg" focusable="false"
                                  aria-hidden="true">
                                  <path
                                     d="M8 16a.999.999 0 0 1-.707-1.707L11.586 10 7.293 5.707a.999.999 0 1 1 1.414-1.414l5 5a.999.999 0 0 1 0 1.414l-5 5A.997.997 0 0 1 8 16z"></path>
                               </svg>
                            </span>
                         </span>
                      </span>
                   </button>
                </div>
                <div class="Polaris-DataTable">
                   <div class="Polaris-DataTable__ScrollContainer">
                      <table class="Polaris-DataTable__Table">
                         <thead>
                            <tr>
                                @if(auth()->user()->user_type == "parent")
                                    <th data-polaris-header-cell="true"
                                        class="Polaris-DataTable__Cell Polaris-DataTable__Cell--verticalAlignTop Polaris-DataTable__Cell--header"
                                        scope="col">Store Name
                                    </th>
                                @endif
                                <th data-polaris-header-cell="true"
                                    class="Polaris-DataTable__Cell Polaris-DataTable__Cell--verticalAlignTop Polaris-DataTable__Cell--header"
                                    scope="col">Shopify Order Number
                                </th>
                                <th data-polaris-header-cell="true"
                                    class="Polaris-DataTable__Cell Polaris-DataTable__Cell--verticalAlignTop Polaris-DataTable__Cell--header"
                                    scope="col">Shopify Order Id
                                </th>
                                <th data-polaris-header-cell="true"
                                    class="Polaris-DataTable__Cell Polaris-DataTable__Cell--verticalAlignTop Polaris-DataTable__Cell--header"
                                    scope="col">APOD Order Id
                                </th>
                                <th data-polaris-header-cell="true"
                                    class="Polaris-DataTable__Cell Polaris-DataTable__Cell--verticalAlignTop Polaris-DataTable__Cell--header"
                                    scope="col">Price
                                </th>
                                <th data-polaris-header-cell="true"
                                    class="Polaris-DataTable__Cell Polaris-DataTable__Cell--verticalAlignTop Polaris-DataTable__Cell--header"
                                    scope="col">Status
                                </th>
                            </tr>
                         </thead>
                         <tbody>
                            @foreach ($shipstation_orders as $orders )
                                <tr class="Polaris-DataTable__TableRow Polaris-DataTable--hoverable">
                                    @if(auth()->user()->user_type == "parent")
                                        <th class="Polaris-DataTable__Cell Polaris-DataTable__Cell--verticalAlignTop"
                                        scope="row">{{ $orders->shopify_domain }}
                                        </th>
                                    @endif
                                    <th class="Polaris-DataTable__Cell Polaris-DataTable__Cell--verticalAlignTop"
                                    scope="row">{{ $orders->sh_order_number }}
                                    </th>
                                    <td class="Polaris-DataTable__Cell Polaris-DataTable__Cell--verticalAlignTop">
                                    {{ $orders->sh_order_id }}
                                    </td>
                                    <td class="Polaris-DataTable__Cell Polaris-DataTable__Cell--verticalAlignTop">
                                    {{ $orders->ss_order_id }}
                                    </td>
                                    <td class="Polaris-DataTable__Cell Polaris-DataTable__Cell--verticalAlignTop">
                                    ${{ $orders->sh_order_price }}
                                    </td>
                                    <td class="Polaris-DataTable__Cell Polaris-DataTable__Cell--verticalAlignTop">
                                        @if($orders->ss_api_success == 1)
                                            <div>
                                                <span class="Polaris-Badge Polaris-Badge--statusSuccess">
                                                    <span class="Polaris-VisuallyHidden">Success </span>Success</span>
                                                <div id="PolarisPortalsContainer"></div>
                                            </div>
                                        @else
                                            <div>
                                                <span class="Polaris-Badge Polaris-Badge--statusCritical">
                                                    <span class="Polaris-VisuallyHidden">Failed </span>Failed</span>
                                                <div id="PolarisPortalsContainer"></div>
                                            </div>
                                            <div>
                                                <span class="Polaris-Badge Polaris-Badge--statusCritical">
                                                    <span class="Polaris-VisuallyHidden">Failed </span>{{ $orders->error_msg }}</span>
                                                <div id="PolarisPortalsContainer"></div>
                                            </div>
                                        @endif
                                    </td>
                                </tr>
                            @endforeach
                           
                         </tbody>
                      </table>
                      <div class="pagination_laravel">{{ $shipstation_orders->links() }}</div>
                   </div>
                </div>
             </div>
          </div>
       </div>
    </div>
    <div id="PolarisPortalsContainer"></div>
 </div>
@endsection