Socialify

Folder ..

Viewing citizens.js
147 lines (137 loc) • 4.5 KB

  1
  2
  3
  4
  5
  6
  7
  8
  9
 10
 11
 12
 13
 14
 15
 16
 17
 18
 19
 20
 21
 22
 23
 24
 25
 26
 27
 28
 29
 30
 31
 32
 33
 34
 35
 36
 37
 38
 39
 40
 41
 42
 43
 44
 45
 46
 47
 48
 49
 50
 51
 52
 53
 54
 55
 56
 57
 58
 59
 60
 61
 62
 63
 64
 65
 66
 67
 68
 69
 70
 71
 72
 73
 74
 75
 76
 77
 78
 79
 80
 81
 82
 83
 84
 85
 86
 87
 88
 89
 90
 91
 92
 93
 94
 95
 96
 97
 98
 99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
$(".ui.form").form({
  fields: {
    address: "empty",
    mobile_number: "empty",
    dob: "empty",
    marital_status: "empty",
  },
});

// Get current page and limit query parameter
const queryString = window.location.search;
const urlParams = new URLSearchParams(queryString);
const page = urlParams.get("page") || 1;
const limit = urlParams.get("limit") || 10;
const query = urlParams.get("query") || "";
const numberOfPages = Math.ceil(count / limit);
const pagination = $(".pagination");
const pageLeft = $('#pageLeft');
const pageRight = $('#pageRight');
if (page > 1) {
  pageLeft.removeClass("disabled");
  pageLeft.attr("href", `/citizens?page=${parseInt(page) - 1}&limit=${limit}&query=${query}`);
} else {
  pageLeft.addClass("disabled");
}
if (page < numberOfPages) {
  pageRight.removeClass("disabled");
  pageRight.attr("href", `/citizens?page=${parseInt(page) + 1}&limit=${limit}&query=${query}`);
} else {
  pageRight.addClass("disabled");
}

function redirectToLimit(limit) {
  window.location.href = `/citizens?page=1&limit=${limit}&query=${query}`;
}

addPageNumbers(numberOfPages);

function addPageNumbers(numberOfPages) {
  // Add page numbers from current page to 2 pages before and 2 pages after, if there are more than 5 pages
  if (numberOfPages > 5) {
    let startingPoint = page - 2;
    if (page < 3) {
      startingPoint = 1;
    } else if (page > numberOfPages - 2) {
      startingPoint = numberOfPages - 4;
    } else {
      startingPoint = page - 2;
    }
    for (let i = startingPoint; i < startingPoint + 5; i++) {
      const linkElement = document.createElement("a");
      linkElement.innerHTML = i;
      linkElement.setAttribute("href", `/citizens?page=${i}&limit=${limit}&query=${query}`);
      linkElement.setAttribute("id", `page${i}`);
      linkElement.classList.add("item");
      pageRight.before(linkElement);
    }
      // add dots
    const dots = document.createElement("a");
    dots.innerHTML = "...";
    dots.classList.add("item");
    pageRight.before(dots);

    // add first page if page > 3
    if (page > 3) {
      const firstPage = document.createElement("a");
      firstPage.innerHTML = 1;
      firstPage.setAttribute("href", `/citizens?page=1&limit=${limit}&query=${query}`);
      firstPage.setAttribute("id", `page1`);
      firstPage.classList.add("item");
      pageLeft.after(dots);
      pageLeft.after(firstPage);
    }

    // add last page
    if (page != numberOfPages) {
      const lastPage = document.createElement("a");
      lastPage.innerHTML = numberOfPages;
      lastPage.setAttribute("href", `/citizens?page=${numberOfPages}&limit=${limit}&query=${query}`);
      lastPage.classList.add("item");
      pageRight.before(lastPage);
    }
  } else {
    // add page numbers
    for (let i = 1; i <= numberOfPages; i++) {
      // Insert before pageRight
      const linkElement = document.createElement("a");
      linkElement.innerHTML = i;
      linkElement.setAttribute("href", `/citizens?page=${i}&limit=${limit}&query=${query}`);
      linkElement.setAttribute("id", `page${i}`);
      linkElement.classList.add("item");
      pageRight.before(linkElement);
    }
  }
  const currentPageElement = document.getElementById(`page${page}&query=${query}`);
  try {
    currentPageElement.classList.add("active");
  } catch (error) {}
}

function editCitizensRecord(citizen) {
  citizen = JSON.parse(citizen);
  $(".edit.modal").modal("show");
  $("#address").val(citizen.address);
  $("#mobile_number").val(citizen.mobile_num);
  $("#dob").val(citizen.dob);
  $("#marital_status").val(citizen.marital_status);
  $("#marital_status").dropdown("set selected", citizen.marital_status);
  $("#citizen_id").html(citizen.citizen_id);
}

const editCitizenButton = document.getElementById("editCitizen");
editCitizenButton.addEventListener("click", editCitizen);

function editCitizen(event) {
  event.preventDefault();
  var data = {
    address: $("#address").val(),
    mobile_num: $("#mobile_number").val(),
    dob: $("#dob").val(),
    marital_status: $("#marital_status").val(),
    citizen_id: $("#citizen_id").html(),
  };
  $.ajax({
    url: "/api/citizens/edit",
    type: "POST",
    data: data,
    success: function (response) {
      console.log(response);
      $(".edit.modal").modal("hide");
      location.reload();
    },
  });
}

function deleteCitizenRecord(citizen) {
  citizen_id = JSON.parse(citizen).citizen_id;
  $.ajax({
    url: "/api/citizens/delete",
    type: "POST",
    data: { citizen_id },
    success: function (response) {
      console.log(response);
      location.reload();
    },
  });
}