@extends('layouts.simpleLayoutMaster')

@section('title', 'العقد الساري')

@section('page-style')
    {{-- Page Css files --}}
    <link rel="stylesheet" href="{{ asset('css/custom/children/applicableContract.css') }}">
@endsection

@section('breadcrumb')
<div class="content-header row">
  <div class="content-header-left col-12 mb-2">
    <div class="row breadcrumbs-top">
      <div class="col-12">
        <h2 class="content-header-title float-start mb-0">معلومات الطالب</h2>
        <div class="breadcrumb-wrapper">
          <ol class="breadcrumb">
            <li class="breadcrumb-item">
              <a href="#"> الرئيسية</a>
            </li>
            <li class="breadcrumb-item">
              <a href="#"> الابناء</a>
            </li>
            <li class="breadcrumb-item">
                <a href="#"> مهره بنت عبد الرحمن بن محمد الحسيني</a>
            </li>
            <li class="breadcrumb-item">
              <span> العقد الساري</span>
            </li>

          </ol>
        </div>
      </div>
    </div>
  </div>
</div>
@endsection

@section('content')
<div class="page">
  <div class="applicable-contract-page-wrapper">
    <div class="top-card-wrapper card">
        <div class="row header">
          <div class="col-12">
            <div class="header-wrapper">
                <div class="icon-text-wrapper">
                    <img src="{{ asset('assets/contract.svg') }}" alt="" srcset="">
                    <h2 class="header-text">العقد الساري</h2>
                </div>
              <h3 class="text-main">الطالبه : مهره بنت عبد الرحمن بن محمد الحسيني</h3>
              <h3 class="text-info">تفاصيل الطالب</h3>
            </div>
          </div>
        </div>
        <div class="row">
            <div class="col-12">
            <div class="table-responsive">
            <table class="table">
                <thead>
                <tr>
                    <th>كود الطالب</th>
                    <th>السنه الدراسيه</th>
                    <th>الصف الدراسي</th>
                    <th>الفصول</th>
                    <th>النتيجه</th>

                </tr>
                </thead>
                <tbody>
                <tr>
                    <td>11560102</td>
                    <td>2022/2023</td>
                    <td>الرابع الابتدائي</td>
                    <td>3 فصول</td>
                    <td>غير محدد</td>
                </tr>

                </tbody>
            </table>
            </div>

            </div>
        </div>
    </div>
    <div class="card-wrapper card">
        <div class="row header">
          <div class="col-12">
            <h3 class="text-info">تفاصيل الدفع</h3>
          </div>
        </div>
        <div class="row">
            <div class="col-12">
            <div class="table-responsive">
            <table class="table">
                <thead>
                <tr>
                    <th>خطة الدفع</th>
                    <th>فترات القسط</th>
                    <th>الرسوم</th>
                    <th>خصم الفتره</th>
                    <th>كوبون</th>
                    <th>النقل</th>
                    <th>الضرائب</th>
                    <th>الاجمالي</th>

                </tr>
                </thead>
                <tbody>
                <tr>
                    <td>تقسيط</td>
                    <td>1 فتره</td>
                    <td>1100 ر.س</td>
                    <td>1100 ر.س</td>
                    <td>0</td>
                    <td>0</td>
                    <td>0</td>
                    <td>1100 ر.س</td>
                </tr>

                </tbody>
            </table>
            </div>

            </div>
        </div>
    </div>
    <div class="card-wrapper card">
        <div class="row header">
          <div class="col-12">
            <h3 class="text-info">تفاصيل السداد</h3>
          </div>
        </div>
        <div class="row">
            <div class="col-12">
            <div class="table-responsive">
            <table class="table">
                <thead>
                <tr>
                    <th>مسدد</th>
                    <th>حالة السداد</th>
                    <th>نسبة السداد</th>
                    <th>حالة التعاقد</th>
                </tr>
                </thead>
                <tbody>
                <tr>
                    <td>9405</td>
                    <td class="text-success">تم السداد</td>
                    <td>100%</td>
                    <td class="text-success">تم التعاقد</td>
                </tr>

                </tbody>
            </table>
            </div>

            </div>
        </div>
    </div>
    <div class="footer-page-wapper">
        <div class="row">
            <div class="col-12">
                <a href="{{ route('showExpiredContractPage') }}" class="text-lead">العقود المنتهيه</a>
            </div>
        </div>
        <div class="row mt-2 mb-2">
            <div class="col-12 d-flex justify-content-center">
            <a class="btn btn-primary btn-link" href="{{ route('showPaymentsPage') }}"role="button">
                <span class="link-text">قم بالدفع</span>
            </a>
            </div>
        </div>
    </div>

  </div>
</div>

@endsection

@section('page-script')
    <script>

    </script>
@endsection