Untitled

 avatar
unknown
plain_text
a year ago
18 kB
8
Indexable
<?php include_once 'header.php' ?>
<?php include_once 'navbar.php' ?>
<?php include_once 'sidebar.php' ?>

<!-- Content Wrapper. Contains page content -->
<div class="content-wrapper">

  <!-- Content Header (Page header) -->
  <div class="content-header">
    <div class="container-fluid">
      <div class="row mb-2">
        <div class="col-sm-6">
          <h1 class="m-0">Görevler</h1>
        </div><!-- /.col -->
        <div class="col-sm-6">
        </div><!-- /.col -->
      </div><!-- /.row -->
    </div><!-- /.container-fluid -->
  </div>
  <!-- /.content-header -->

  <!-- Main content -->
  <section class="content">
    <div class="container-fluid">
      <div class="row">
        <div class="col-md-12">
          <div class="card">
            <div class="card-header">
            <button type="button" class="btn btn-success" data-toggle="modal" data-target="#modal-gorevEkle">
              <i class="fas fa-plus-circle"></i>  Görev Ekle</button>
              <div class="card-tools">
                <div class="input-group input-group-sm" style="width: 200px;">
                  <input type="text" name="table_search" class="form-control float-right" placeholder="Search">
                  <div class="input-group-append">
                    <button type="submit" class="btn btn-default">
                      <i class="fas fa-search"></i>
                    </button>
                  </div>
                </div>
              </div>
            </div>
            <!-- /.card-header -->
            <div class="card-body table-responsive p-0">
              <table class="table table-bordered">
                <thead>
                  <tr>
                    <th>ID</th>
                    <th>Görev-Numune Adı</th>
                    <th>Aktif Görev Sayısı</th>
                    <th>Aşama Sayısı</th>
                    <th>En Son Üretim Tamamlaması</th>
                    <th>İşlemler</th>
                  </tr>
                </thead>
                <tbody>
                  <tr>
                    <td>1</td>
                    <td>SD95334</td>
                    <td>2</td>
                    <td>6</td>
                    <td>01-08.2024</td>
                    <td>
                      <button type="button" class="btn btn-info" data-toggle="modal" data-target="#modal-onizleme">
                      <i class="fa fa-bars"></i> Önizleme</button>
                      <button type="button" class="btn btn-warning" data-toggle="modal" data-target="#modal-guncelle">
                      <i class="fa fa-reply"></i> Güncelle</button>
                      <button type="button" class="btn btn-success" data-toggle="modal" data-target="#modal-gorevAta">
                      <i class="fa fa-users"></i> Görev Ata</button>
                    </td>
                  </tr>
                  <tr>
                    <td>2</td>
                    <td>MD9522</td>
                    <td>0</td>
                    <td>4</td>
                    <td>01-08.2024</td>
                    <td>
                      <button type="button" class="btn btn-info" data-toggle="modal" data-target="#modal-onizleme">
                      <i class="fa fa-bars"></i> Önizleme</button>
                      <button type="button" class="btn btn-warning" data-toggle="modal" data-target="#modal-guncelle">
                      <i class="fa fa-reply"></i> Güncelle</button>
                      <button type="button" class="btn btn-success" data-toggle="modal" data-target="#modal-gorevAta">
                      <i class="fa fa-users"></i> Görev Ata</button>
                    </td>
                  </tr>
                </tbody>
              </table>
            </div>
            <!-- /.card-body -->
            <div class="card-footer clearfix">
              <ul class="pagination pagination-sm m-0 float-right">
                <li class="page-item"><a class="page-link" href="#">«</a></li>
                <li class="page-item"><a class="page-link" href="#">1</a></li>
                <li class="page-item"><a class="page-link" href="#">2</a></li>
                <li class="page-item"><a class="page-link" href="#">3</a></li>
                <li class="page-item"><a class="page-link" href="#">»</a></li>
              </ul>
            </div>
          </div>
          <!-- /.card -->
        </div>
      </div>
    </div>
    <!-- /.container-fluid -->



      <!-- Güncelle Modal -->
      <div class="modal fade" id="modal-gorevEkle">
        <div class="modal-dialog">
          <div class="modal-content">
            <div class="modal-header">
              <h4 class="modal-title">Numune - Görev Ekle</h4>
              <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                <span aria-hidden="true">&times;</span>
              </button>
            </div>
            <div class="modal-body"> 
              <div class="card-body">
                  <form>
                    <div class="row">
                      <div class="col-sm-12">
                        <!-- text input -->
                        <div class="form-group">
                          <label>Görev-Numune Adı</label>
                          <input type="text" class="form-control">
                          <label style="margin-top: 10px;">MPS NO</label>
                          <input type="text" class="form-control">
                          <label style="margin-top: 10px;">ÜRÜN NO</label>
                          <input type="text" class="form-control">

                          <label style="margin-top: 10px;">Adım Sayısı</label>
                          <input type="number" class="form-control" id="stepCount" placeholder="Adım sayısını girin">
                      
                          <div id="stepsTableContainer"></div>
                        </div>
                      </div>
                    </div>
                  </form>
                </div>
            </div>
            <div class="modal-footer justify-content-between">
              <button type="button" class="btn btn-default" data-dismiss="modal">Kapat</button>
              <button type="button" class="btn btn-primary">Kaydet</button>
            </div>
          </div>
          <!-- /.modal-content -->
        </div>
        <!-- /.modal-dialog -->
      </div>
      <!-- /.modal -->

      <!-- Güncelle Modal -->
      <div class="modal fade" id="modal-guncelle">
          <div class="modal-dialog" role="document">
              <div class="modal-content">
                  <div class="modal-header">
                      <h5 class="modal-title" id="modalGuncelleLabel">Güncelle</h5>
                      <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                          <span aria-hidden="true">&times;</span>
                      </button>
                  </div>
                  <!-- <div class="modal-body"> 
                        <form id="updateForm">
                          <div class="row">
                            <div class="col-sm-12">
                              <div class="form-group">
                                <label>Görev-Numune Adı</label>
                                <input type="text" class="form-control">
                                <label style="margin-top: 10px;">MPS NO</label>
                                <input type="text" class="form-control">
                                <label style="margin-top: 10px;">ÜRÜN NO</label>
                                <input type="text" class="form-control">

                                <label style="margin-top: 10px;" for="updateStepCount">Adım Sayısı</label>
                                <input type="number" class="form-control" id="updateStepCount" placeholder="Adım sayısını girin">
                              </div>
                            </div>
                          </div>
                        </form>
                  </div> -->
                  <div class="modal-body">
                      <form id="updateForm">
                          <div class="form-group">
                                <label>Görev-Numune Adı</label>
                                <input type="text" class="form-control">
                                <label style="margin-top: 10px;">MPS NO</label>
                                <input type="text" class="form-control">
                                <label style="margin-top: 10px;">ÜRÜN NO</label>
                                <input type="text" class="form-control">

                              <label for="updateStepCount">Adım Sayısı</label>
                              <input type="number" class="form-control" id="updateStepCount" placeholder="Adım sayısını girin">
                          </div>
                          <div id="updateStepsTableContainer"></div>
                      </form>
                  </div>
                  <div class="modal-footer">
                      <button type="button" class="btn btn-secondary" data-dismiss="modal">Kapat</button>
                      <button type="button" class="btn btn-primary">Kaydet</button>
                  </div>
              </div>
          </div>
      </div>
      <!-- /.modal -->
       
      <!-- Önizleme Modal -->
      <div class="modal fade" id="modal-onizleme">
        <div class="modal-dialog">
          <div class="modal-content">
            <div class="modal-header">
              <h4 class="modal-title">Numune - Görev Önizleme</h4>
              <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                <span aria-hidden="true">&times;</span>
              </button>
            </div>
            <div class="modal-body">
              
            <div class="card-body">
                <form>
                  <div class="row">
                    <div class="col-sm-12">
                      <!-- text input -->
                      <div class="form-group">
                        <label>Görev-Numune Adı</label>
                        <input type="text" class="form-control" disabled>
                        <label style="margin-top: 10px;">MPS NO</label>
                        <input type="text" class="form-control" disabled>
                        <label style="margin-top: 10px;">ÜRÜN NO</label>
                        <input type="text" class="form-control" disabled>

                        <label style="margin-top: 10px;">Adım Sayısı</label>
                        <input type="number" class="form-control" id="stepCount" disabled>
                    
                        <div id="stepsTableContainer"></div>
                      </div>
                    </div>
                  </div>
                </form>
              </div>
            </div>
            <div class="modal-footer justify-content-between">
              <button type="button" class="btn btn-default" data-dismiss="modal">Kapat</button>
            </div>
          </div>
          <!-- /.modal-content -->
        </div>
        <!-- /.modal-dialog -->
      </div>
      <!-- /.modal -->
       

      <!-- Güncelle Modal -->
      <div class="modal fade" id="modal-gorevAta">
          <div class="modal-dialog" role="document">
              <div class="modal-content">
                  <div class="modal-header">
                      <h5 class="modal-title" id="modalGuncelleLabel">Görev Ata</h5>
                      <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                          <span aria-hidden="true">&times;</span>
                      </button>
                  </div>
                  <div class="modal-body">
                      <form id="updateForm">
                          <div class="form-group">
                                <label for="searchBox">Search:</label>
                                  <input type="text" id="searchBox" class="form-control" onkeyup="searchOptions()">
                                  <select id="resultBox" class="form-control" size="5" style="display:none;">
                                      <!-- PHP ile dinamik olarak doldurulacak -->
                                  </select>
                                <label style="margin-top: 10px;">MPS NO</label>
                                <input type="text" class="form-control">
                                <label style="margin-top: 10px;">ÜRÜN NO</label>
                                <input type="text" class="form-control">

                              <label for="updateStepCount">Adım Sayısı</label>
                              <input type="number" class="form-control" id="updateStepCount" placeholder="Adım sayısını girin">
                          </div>
                          <div id="updateStepsTableContainer"></div>
                      </form>
                  </div>
                  <div class="modal-footer">
                      <button type="button" class="btn btn-secondary" data-dismiss="modal">Kapat</button>
                      <button type="button" class="btn btn-primary">Kaydet</button>
                  </div>
              </div>
          </div>
      </div>
      <!-- /.modal -->

      
    </section>
  <!-- /.content -->
</div>
<!-- /.content-wrapper -->

<?php include_once 'footer.php' ?>

<script>
  document.getElementById('stepCount').addEventListener('input', function() {
    let stepCount = parseInt(this.value);
    let container = document.getElementById('stepsTableContainer');

    // Clear previous table if it exists
    container.innerHTML = '';

    if (!isNaN(stepCount) && stepCount > 0) {
        // Create the table element
        let table = document.createElement('table');
        table.className = 'table table-bordered';

        // Add table header
        let thead = document.createElement('thead');
        let headerRow = document.createElement('tr');
        let th1 = document.createElement('th');
        th1.innerText = 'Adım Adı';
        let th2 = document.createElement('th');
        th2.innerText = 'Süre(sn/adet)';
        headerRow.appendChild(th1);
        headerRow.appendChild(th2);
        thead.appendChild(headerRow);
        table.appendChild(thead);

        // Add table body
        let tbody = document.createElement('tbody');
        for (let i = 1; i <= stepCount; i++) {
            let row = document.createElement('tr');
            let cell1 = document.createElement('td');
            let input1 = document.createElement('input');
            input1.type = 'text';
            input1.className = 'form-control';
            cell1.appendChild(input1);
            let cell2 = document.createElement('td');
            let input2 = document.createElement('input');
            input2.type = 'number';
            input2.className = 'form-control';
            cell2.appendChild(input2);
            row.appendChild(cell1);
            row.appendChild(cell2);
            tbody.appendChild(row);
        }
        table.appendChild(tbody);
        container.appendChild(table);
    }
});

document.getElementById('updateStepCount').addEventListener('input', function() {
    let stepCount = parseInt(this.value);
    let container = document.getElementById('updateStepsTableContainer');

    // Clear previous table if it exists
    container.innerHTML = '';

    if (!isNaN(stepCount) && stepCount > 0) {
        // Create the table element
        let table = document.createElement('table');
        table.className = 'table table-bordered';

        // Add table header
        let thead = document.createElement('thead');
        let headerRow = document.createElement('tr');
        let th1 = document.createElement('th');
        th1.innerText = 'Adım Adı';
        let th2 = document.createElement('th');
        th2.innerText = 'Süre(sn/adet)';
        headerRow.appendChild(th1);
        headerRow.appendChild(th2);
        thead.appendChild(headerRow);
        table.appendChild(thead);

        // Add table body
        let tbody = document.createElement('tbody');
        for (let i = 1; i <= stepCount; i++) {
            let row = document.createElement('tr');
            let cell1 = document.createElement('td');
            let input1 = document.createElement('input');
            input1.type = 'text';
            input1.className = 'form-control';
            cell1.appendChild(input1);
            let cell2 = document.createElement('td');
            let input2 = document.createElement('input');
            input2.type = 'number';
            input2.className = 'form-control';
            cell2.appendChild(input2);
            row.appendChild(cell1);
            row.appendChild(cell2);
            tbody.appendChild(row);
        }
        table.appendChild(tbody);
        container.appendChild(table);
    }
});

function searchOptions() {
        let input = document.getElementById('searchBox').value;
        let resultBox = document.getElementById('resultBox');
        
        if (input.length >= 3) {
            fetch(`search.php?query=${input}`)
                .then(response => response.json())
                .then(data => {
                    resultBox.innerHTML = '';
                    if (data.length > 0) {
                        resultBox.style.display = 'block';
                        data.forEach(item => {
                            let option = document.createElement('option');
                            option.value = item;
                            option.textContent = item;
                            resultBox.appendChild(option);
                        });
                    } else {
                        resultBox.style.display = 'none';
                    }
                })
                .catch(error => console.error('Error:', error));
        } else {
            resultBox.style.display = 'none';
        }
    }
</script>
Editor is loading...
Leave a Comment