<div class="content-wrapper" ng-if="!myAccess.tipList">
  <div class="container-fluid">
    <div class="row">
      <div class="col-sm-6 offset-sm-1 offset-md-2 offset-lg-3 mt-5">
        <div class="alert alert-warning alert-dismissible">
          <h5><i class="icon fas fa-ban"></i> !</h5>
          Unauthorised Access.
        </div>
      </div>
    </div>
  </div>
</div>
<div class="content-wrapper" ng-if="myAccess.tipList">
  <section class="content-header">
    <div class="container-fluid">
      <div class="row mb-2">
        <div class="col-sm-6">
          <h1 class="text-indigo">
            <go-back />
            <i class="fas fa-envelope"></i> {{createButton.heading}}
          </h1>
        </div>
        <div class="col-sm-6">
          <ol class="breadcrumb float-sm-right">
            <li class="breadcrumb-item">
              <a ng-href="{{baseurl}}/dashboard">Home</a>
            </li>
            <li class="breadcrumb-item">
              <a ng-href="{{baseurl}}/tip/list">Invoice</a>
            </li>
            <li class="breadcrumb-item active">Add</li>
          </ol>
        </div>
      </div>
    </div>
    <!-- /.container-fluid -->
  </section>

  <!-- Main content -->
  <section class="content">
    <div class="row">
      <div class="col-sm-12">
        <div class="card card-indigo card-outline">
          <div class="card-body">
            <div class="row">
              <div class="col-sm-12 col-md-6">
                <div class="form-group">
                  <div
                    class="custom-control custom-switch custom-switch-off-danger custom-switch-on-success"
                  ></div>
                </div>
                <div class="form-group">
                  <label for="attn">Attn</label>
                  <input
                    type="text"
                    id="attn"
                    class="form-control"
                    required="required"
                    value="{{invoice.attn}}"
                    ng-model="invoice.attn"
                    placeholder="Attn"
                  />
                </div>

                <div class="form-group">
                  <label for="to">To</label>
                  <input
                    type="text"
                    id="to"
                    class="form-control"
                    required="required"
                    value="{{invoice.invoice_to}}"
                    ng-model="invoice.invoice_to"
                    placeholder="To"
                  />
                </div>
                <div class="form-group">
                  <label for="cc">CC</label>
                  <input
                    type="text"
                    id="cc"
                    class="form-control"
                    required="required"
                    value="{{invoice.invoice_cc}}"
                    ng-model="invoice.invoice_cc"
                    placeholder="CC"
                  />
                </div>
                <div class="form-group">
                  <label for="company_code">Company Code</label>
                  <input
                    type="text"
                    id="company_code"
                    class="form-control"
                    required="required"
                    value="{{invoice.company_code}}"
                    ng-model="invoice.company_code"
                    placeholder="Company Code"
                  />
                </div>
                <div class="form-group">
                  <label for="project_code">Project Name</label>
                  <input
                    type="text"
                    id="project_code"
                    class="form-control"
                    required="required"
                    value="{{invoice.project_code}}"
                    ng-model="invoice.project_code"
                    placeholder="Project Name"
                  />
                </div>
                <div class="form-group">
                  <label for="invoice_approver">Invoice Approver</label>
                  <input
                    type="text"
                    id="invoice_approver"
                    class="form-control"
                    required="required"
                    value="{{invoice.invoice_approvar}}"
                    ng-model="invoice.invoice_approvar"
                    placeholder="Invoice Approver"
                  />
                </div>
                <div class="form-group">
                  <label for="company_name">Company Name</label>
                  <input
                    type="text"
                    id="company_name"
                    class="form-control"
                    required="required"
                    value="{{invoice.company_name}}"
                    ng-model="invoice.company_name"
                    placeholder="Company Name"
                  />
                </div>
              </div>
              <div class="col-sm-12 col-md-6">
                <div class="form-group">
                  <label for="description">Description</label>
                  <textarea
                    id="description"
                    class="form-control"
                    rows="25"
                    required="required"
                    ng-model="invoice.description"
                  >
{{invoice.description}}</textarea
                  >
                </div>
              </div>
            </div>
          </div>
          <div class="card-footer">
            <div class="col-12">
              <button
                type="button"
                class="btn btn-secondary"
                data-toggle="modal"
                data-target="#modal-default"
              >
                Cancel
              </button>
              <button
                type="submit"
                ng-click="createInvoice(invoice)"
                class="btn btn-success float-right"
              >
                <i class="fas {{createButton.icon}}"></i> {{createButton.text}}
              </button>
            </div>
          </div>
        </div>
      </div>
    </div>
  </section>
  <div class="modal fade" id="modal-default">
    <div class="modal-dialog">
      <div class="modal-content">
        <div class="modal-body">
          <p>Are you sure to leave this page!</p>
        </div>
        <div class="modal-footer justify-content-between">
          <button type="button" class="btn btn-default" data-dismiss="modal">
            Close
          </button>
          <button
            type="button"
            class="btn btn-indigo"
            data-dismiss="modal"
            ng-click="goTo($event,'projectList')"
          >
            Proceed
          </button>
        </div>
      </div>
    </div>
  </div>
</div>
