%PDF- %PDF-
Mini Shell

Mini Shell

Direktori : /home/opti/workflow/src/test/views/sadmin/
Upload File :
Create Path :
Current File : /home/opti/workflow/src/test/views/sadmin/index.ejs

<% include partials/header %>

<!-- ////////////////////////////////////////////////////////////////////////////-->

<% include partials/sidebar %>

<div class="app-content content">
  <div class="content-wrapper">
    <div class="content-header row">
    </div>
    <div class="content-body">
      <!-- Breadcrumb starts-->
      <div class="content-header row">
        <div class="content-header-left col-md-6 col-12 mb-1">
          <h2 class="content-header-title">Dashboard</h2>
        </div>
        <div class="content-header-right breadcrumbs-right breadcrumbs-top col-md-6 col-12">
          <div class="breadcrumb-wrapper col-12">
            <ol class="breadcrumb">
              <li class="breadcrumb-item"><a href="/">Home</a>
              </li>
            </ol>
          </div>
        </div>
      </div>
      <!-- Breadcrumb ends-->
      <!-- eCommerce statistic -->
      <div class="row">
        <div class="col-xl-3 col-lg-6 col-12">
          <div class="card pull-up">
            <div class="card-content">
              <div class="card-body">
                <div class="media d-flex">
                  <div class="media-body text-left">
                    <h3 class="info">850</h3>
                    <h6>Products Sold</h6>
                  </div>
                  <div>
                    <i class="icon-basket-loaded info font-large-2 float-right"></i>
                  </div>
                </div>
                <div class="progress progress-sm mt-1 mb-0 box-shadow-2">
                  <div class="progress-bar bg-gradient-x-info" role="progressbar" style="width: 80%" aria-valuenow="80"
                    aria-valuemin="0" aria-valuemax="100"></div>
                </div>
              </div>
            </div>
          </div>
        </div>
        <div class="col-xl-3 col-lg-6 col-12">
          <div class="card pull-up">
            <div class="card-content">
              <div class="card-body">
                <div class="media d-flex">
                  <div class="media-body text-left">
                    <h3 class="warning">$748</h3>
                    <h6>Net Profit</h6>
                  </div>
                  <div>
                    <i class="icon-pie-chart warning font-large-2 float-right"></i>
                  </div>
                </div>
                <div class="progress progress-sm mt-1 mb-0 box-shadow-2">
                  <div class="progress-bar bg-gradient-x-warning" role="progressbar" style="width: 65%" aria-valuenow="65"
                    aria-valuemin="0" aria-valuemax="100"></div>
                </div>
              </div>
            </div>
          </div>
        </div>
        <div class="col-xl-3 col-lg-6 col-12">
          <div class="card pull-up">
            <div class="card-content">
              <div class="card-body">
                <div class="media d-flex">
                  <div class="media-body text-left">
                    <h3 class="success">146</h3>
                    <h6> No Of Employees</h6>
                  </div>
                  <div>
                    <i class="icon-user-follow success font-large-2 float-right"></i>
                  </div>
                </div>
                <div class="progress progress-sm mt-1 mb-0 box-shadow-2">
                  <div class="progress-bar bg-gradient-x-success" role="progressbar" style="width: 75%" aria-valuenow="75"
                    aria-valuemin="0" aria-valuemax="100"></div>
                </div>
              </div>
            </div>
          </div>
        </div>
        <div class="col-xl-3 col-lg-6 col-12">
          <div class="card pull-up">
            <div class="card-content">
              <div class="card-body">
                <div class="media d-flex">
                  <div class="media-body text-left">
                    <h3 class="danger">99.89 %</h3>
                    <h6>Customer Satisfaction</h6>
                  </div>
                  <div>
                    <i class="icon-heart danger font-large-2 float-right"></i>
                  </div>
                </div>
                <div class="progress progress-sm mt-1 mb-0 box-shadow-2">
                  <div class="progress-bar bg-gradient-x-danger" role="progressbar" style="width: 85%" aria-valuenow="85"
                    aria-valuemin="0" aria-valuemax="100"></div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
      <!--/ eCommerce statistic -->

      <div class="col-lg-3 col-6">
        <div class="card pull-up">
          <div class="card-content">
            <% if(!isOrganized){ %>
            <div class="card-body" data-toggle="modal" data-target="#addOrgStructure" onclick="getStructure()">
              <div class="media d-flex" title="Create Organization Structure">
                <div class="media-body text-left">
                  <h6 class="text-muted">Organization</h6>
                  <h3> Structure</h3>
                </div>
                <div class="align-self-center">
                  <i class="icon-plus success font-large-2 float-right"></i>
                </div>
              </div>
            </div>

            <% } else { %>
            <a href="/structure/">
              <div class="card-body" data-toggle="modal" data-target="#addOrgStructure">
                <div class="media d-flex" title="View Organization Structure">
                  <div class="media-body text-left">
                    <h6 class="text-muted">Organization</h6>
                    <h3> Structure</h3>
                  </div>
                  <div class="align-self-center">
                    <i class="icon-eye success font-large-2 float-right"></i>
                  </div>
                </div>
              </div>
            </a>

            <% } %>





          </div>
        </div>
      </div>
    </div>
  </div>
</div>
<!-- ////////////////////////////////////////////////////////////////////////////-->

<!---////////////////////////////////////////-->
<!-----Modal for creating Organ-->
<div class="modal fade text-left" id="addOrgStructure" tabindex="-1" role="dialog" aria-labelledby="myModalLabel16"
  style="display: none;" aria-hidden="true">
  <div class="modal-dialog modal-xl" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h4 class="modal-title" id="myModalLabel16">Add Organization Structure</h4>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">×</span>
        </button>
      </div>
      <div class="modal-body">
        <h5>
          <div class="alert alert-warning mb-2" role="alert">
            <strong>Warning!</strong> Please, be careful with this form, it cannot be edited after submission
          </div>
        </h5>
        <div class="row col-12">
          <div class="card col-lg-6 col-6 col-md-6">
            <fieldset>
              <hr>
              <div class="mb-1 pt-2 text-left">
                <h4 class="col-sm-10 offset-1">Structure Name:</h4>
                <div class="form-group">
                  <input type="text" id="new_structure" for="name" class="col-sm-10 offset-1 form-control dropped " id="maxlength-featured"
                    placeholder="Enter New Structure Name" maxlength="60" />

                </div>
              </div>

            </fieldset>
            <fieldset>
              <div class="mb-1 pt-2 text-left">
                <div class="form-group">
                  <button class="col-sm-5 offset-3 form-control btn btn-primary" onclick="addNewStructure()"> Save
                  </button>

                </div>
              </div>

            </fieldset>
            <!-- <input class="" id="new_structure" name="new_structure" for="name" class="col-sm-10 offset-1 form-control "/> -->

          </div>
          <div class="card col-12 col-md-6">
            <div class="alert alert-info" role="alert">
              Organization Hierarchy
            </div>

            <div class="tools" id="tools">
              <form action="structure/save_organization_structure" method="POST">

                <div class="col-lg-12">
                  <div class="mb-1">
                    <!-- <h5 class="mb-0">Basic List Group</h5> -->
                    <small class="text-muted">Carefully arrange Structure in their Hierarchical order, remove the
                      structures that are not applicable to you organization.</small>
                  </div>
                  <div class="card" id="Structure_list">
                    <ul class="list-group row" id="basic-list-group">
                      <!-- <li class="list-group-item col-12">
                                        Dapibus ac facilisis in
                                    <span class="offset-6">
                                        <span aria-hidden="true" class="btn btn-danger">×</span><input type="hidden" name="Structures[]" value="1">
                                        <i class="icon-cursor-move btn btn-success font-medium-1"></i>
                                    </span>
                                  </li> -->

                    </ul>
                  </div>
                </div>

            </div>
          </div>
        </div>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn grey btn-secondary" data-dismiss="modal">Close</button>
        <input type="submit" class="btn btn-primary" value="Save Structure" />
      </div>
    </div>
    </form>

  </div>
</div>


<% include partials/footer %>

<script>

  let counter = 0; //hold d last id
  let name_list = [];
  function getStructure() {

    jQuery.ajax({
      type: "POST", // Post / Get method
      url: "structure/get", //Where form data is sent on submission
      dataType: "text", // Data type, HTML, json etc.
      data: { "_token": "{{ csrf_token() }}" }, //Form variables
      success: function (response) {

        var data = JSON.parse(response);
        // console.log((data))

        $("#basic-list-group").html('');
        data.forEach(structure => {
          // console.log(structure);
          $("#basic-list-group").append(
            `<li class="list-group-item col-12">
                    ${structure.name}
                <span class=" pull-right">
                    <span aria-hidden="true" class="btn btn-danger" onclick="removeStructure(this)">×</span>
                    <input type="hidden" class="structures" name="structure_ids" value="${structure.id}">
              <input type="hidden" class="" name="structure_names" value="${structure.name}">
                    <i class="icon-cursor-move btn btn-success font-medium-1"></i>
                </span>
              </li>`
          )

          counter = structure.id;
        });

      },
      error: function (xhr, ajaxOptions, thrownError) {
        //$("#loading").hide();
        Swal.fire("Error!", "An error occurred!", "error");

      }
    });
  }

  // function showList(){
  //   var list = $(".structures");
  //   for (let i = 0; i < list.length; i++) {
  //     const element = list[i];
  //     console.log(element)
  //   }
  //   console.log(counter);
  // }

  //add new structur to list
  function addNewStructure() {
    let name = $("#new_structure").val();
    if (name == "")
      return alert("Structure name cannot be empty");
    if ($.inArray(name, name_list) !== -1)
      return alert("You've already added '" + name + "'");

    $("#basic-list-group").append(
      `<li class="list-group-item col-12">
              ${name}
          <span class="pull-right">
              <span aria-hidden="true" class="btn btn-danger" onclick="removeStructure(this)">×</span>
              <input type="hidden" class="structures" name="structure_ids" value="${++counter}">
              <input type="hidden" class="" name="structure_names" value="${name}">
              <i class="icon-cursor-move btn btn-success font-medium-1"></i>
          </span>
        </li>`
    )

    $("#new_structure").val('');
    name_list.push(name);
  }

  function removeStructure(element) {
    $(element).parent().parent().remove();
  }


</script>

Zerion Mini Shell 1.0