<template>
  <v-layout class="fill-height" column>
    <!-- Alert dialog -->
    <v-dialog v-model="dialogForm" persistent max-width="500">
      <v-card>
        <v-card-title class="headline">FORM</v-card-title>
        <v-card-text>
          <v-text-field
            class="xs3 mb-3 mini-select"
            v-model="name"
            :disabled="isLoading"
            style="font-size: 14px;"
            label="Nama"
            placeholder="Masukkan nama"
            outline
            hide-details
          ></v-text-field>
          <v-menu
            v-model="menuFormDateStart"
            :close-on-content-click="false"
            :nudge-right="40"
            :disabled="isLoading"
            lazy
            transition="scale-transition"
            offset-y
            full-width
            max-width="290px"
            min-width="290px"
          >
            <template v-slot:activator="{ on }">
              <v-text-field
                class=""
                v-model="formatedStartDate"
                label="Tanggal Awal"
                outline
                hide-details
                readonly
                v-on="on"
                @blur="deFormatedDate(formatedStartDate)"
              ></v-text-field>
            </template>

            <v-date-picker
              v-model="date"
              no-title
              @input="menuFormDateStart = false"
            ></v-date-picker>
          </v-menu>
          <v-select
            :disabled="isLoading"
            :items="yearList"
            v-model="year"
            class="mini-select mt-3"
            label="Tahun"
            hide-details
            outline
          ></v-select>
          <v-text-field
            :disabled="isLoading"
            class="xs3 mt-3 mini-select"
            v-model="desc"
            style="font-size: 14px;"
            label="Deskripsi"
            outline
            hide-details
          ></v-text-field>
          <v-select
            :disabled="isLoading"
            :items="type"
            v-model="selectedType"
            class="mini-select mt-3"
            label="Tipe"
            hide-details
            outline
          ></v-select>
        </v-card-text>
        <v-card-actions>
          <v-spacer></v-spacer>
          <v-btn
            color=" red darken-1"
            :disabled="isLoading"
            flat
            @click="dialogForm = false"
            >Batal</v-btn
          >
          <v-btn
            color="green darken-1"
            :disabled="isLoading"
            flat
            :loading="isLoading"
            @click="saveHoliday()"
            >Simpan</v-btn
          >
        </v-card-actions>
      </v-card>
    </v-dialog>
    <v-dialog v-model="dialog_delete" persistent max-width="290">
      <v-card>
        <!-- <v-card-title class="headline">Peringatan</v-card-title> -->
        <v-card-text>
          Apakah yakin menghapus libur
          {{ selectedHoliday.holiday_name }} ?</v-card-text
        >
        <v-card-actions>
          <v-spacer></v-spacer>
          <v-btn
            :disabled="isLoading"
            color="green darken-1"
            flat
            @click="dialog_delete = false"
            >tidak</v-btn
          >
          <v-btn
            :loading="isLoading"
            color="red darken-1"
            flat
            @click="deleteHoliday()"
            >Ya</v-btn
          >
        </v-card-actions>
      </v-card>
    </v-dialog>
    <!-- End alert dialog -->

    <!-- Snackbar -->
    <v-snackbar
      v-model="snackbar"
      :timeout="5000"
      :multi-line="false"
      :vertical="false"
      :top="true"
      color="success"
      :value="snackbar"
    >
      {{ snackbar_msg }}
      <v-btn flat @click="snackbar = false"> Tutup </v-btn>
    </v-snackbar>
    <!-- End Snackbar -->

    <!-- ERROR DIALOG -->
    <v-dialog v-model="error_dialog" max-width="500px">
      <v-card>
        <v-card-title>
          <span>ERROR !</span>
          <v-spacer></v-spacer>
        </v-card-title>
        <v-divider></v-divider>
        <div class="ma-3 red--text" v-html="error_message"></div>
        <v-divider></v-divider>
        <v-card-actions>
          <v-spacer></v-spacer>
          <v-btn color="primary" flat @click="error_dialog = false"
            >Close</v-btn
          >
        </v-card-actions>
      </v-card>
    </v-dialog>
    <!-- END ERROR DIALOG -->

    <v-toolbar dark color="primary">
      <v-toolbar-title class="white--text">INJECT HARGA AGREEMENT</v-toolbar-title>

      <v-spacer></v-spacer>

      <!-- <v-btn icon @click="openAdd()">
        <v-icon>add_box</v-icon>
      </v-btn> -->
      <v-btn
        color="warning"
        v-if="data_csv.length > 0"
        :disabled="isLoading"
        @click="inject()"
        >Simpan</v-btn
      >
    </v-toolbar>
    <v-card class="mb-2 pa-2 searchbox">
      <v-layout>
        <v-flex xs4 pa-2>
          <v-autocomplete
            v-model="selectedCompany"
            :items="companyList"
            :loading="isLoading"
            :search-input.sync="searchCompany"
            hide-no-data
            hide-details
            outline
            item-text="M_CompanyName"
            label="Pilih Company"
            placeholder="Start typing to Search"
            return-object
          ></v-autocomplete>
        </v-flex>
        <v-flex xs4 pa-2>
          <v-autocomplete
            v-model="selectedMou"
            :items="mouList"
            :loading="isLoading"
            :search-input.sync="searchMou"
            hide-no-data
            hide-details
            outline
            item-text="M_MouName"
            label="Pilih Agreement"
            placeholder="Start typing to Search"
            return-object
          ></v-autocomplete>
        </v-flex>
      </v-layout>
      <v-layout>
        <v-flex xs4 pa-2>
          <p class="mb-0 mt-3 subheading">
            silahkan download template di
            <span
              @click="downloadcsv()"
              style="cursor: pointer;"
              class="info--text lighten-3--text"
              >sini</span
            >
          </p>
        </v-flex>
        <v-flex xs4 pa-2>
          <v-divider class="my-2"></v-divider>
            <input
              accept=".xlsx"
              type="file"
              id="csv_file"
              :disabled="isLoading"
              name="csv_file"
              class="form-control"
              @change="loadCSV($event)"
            />
            <v-btn @click="resetInputFile()" :disabled="isLoading" icon>
              <v-icon color="red">cancel</v-icon>
            </v-btn>
            <v-progress-circular
              v-if="isLoading"
              :indeterminate="true"
              color="primary"
            ></v-progress-circular>
        </v-flex>
      </v-layout>
    </v-card>
    <v-card>
      <v-layout align-center row>
        <v-flex
          xs12
          pl-2
          style="max-height: 70vh; overflow: auto;"
          pr-2
          pt-2
          pb-2
        >
          <!-- hide-actions -->
          <v-data-table
            :headers="headers"
            :items="data_csv"
            :loading="isLoading"
            class="elevation-1"
          >
            <template v-slot:items="props">
              <td class="text-xs-left pa-2">{{ props.item.TEST_CODE }}</td>
              <td class="text-xs-left pa-2">{{ props.item.TEST_NAME }}</td>
              <td class="text-xs-left pa-2">{{ props.item.HARGA }}</td>
              <td class="text-xs-left pa-2">{{ props.item.DISKON_PERSEN }}</td>
              <td class="text-xs-left pa-2">{{ props.item.DISKON_RUPIAH }}</td>
              <td class="text-xs-left pa-2">{{ props.item.TOTAL }}</td>
            </template>
          </v-data-table>
          <v-divider></v-divider>
          <!-- <v-layout>
            <v-flex>
              <v-pagination
                style="margin-top: 10px; margin-bottom: 10px;"
                v-model="curr_page"
                :length="total_page"
              >
              </v-pagination>
            </v-flex>
          </v-layout> -->
        </v-flex>
      </v-layout>
    </v-card>
  </v-layout>
</template>

<style scoped>
  .searchbox .v-input.v-text-field .v-input__slot {
    min-height: 60px;
  }

  .searchbox .v-btn {
    min-height: 60px;
  }

  table.v-table tbody td,
  table.v-table tbody th {
    height: 40px;
  }

  table.v-table thead tr {
    height: 40px;
  }
</style>

<script>
  module.exports = {
    data() {
      return {
        //dropdown holiday
        action: "add",
        yearList: [],
        menu: false,
        yearTEST_NAME: new Date().getFullYear().toString(), // Set the initial year to current year
        activePicker: "YEAR", // Display year picker directly
        minYear: "1900", // Minimum selectable year
        maxYear: new Date().getFullYear().toString(),
        menuFormDateStart: false,
        menuFormDateFilter: false,
        menuFormDate: false,

        selected: {},
        headers: [
          {
            text: "TEST CODE",
            align: "left",
            sortable: false,
            value: "mr",
            width: "20%",
            class: "text-xs-left pa-2 blue-grey white--text",
          },
          {
            text: "TEST NAME",
            align: "left",
            sortable: false,
            value: "mr",
            width: "30%",
            class: "text-xs-left pa-2 blue-grey white--text",
          },
          {
            text: "HARGA",
            align: "left",
            sortable: false,
            value: "lab",
            width: "10%",
            class: "text-xs-left pa-2 blue-grey white--text",
          },
          {
            text: "DISKON PERSEN",
            align: "left",
            sortable: false,
            value: "lab",
            width: "10%",
            class: "text-xs-left pa-2 blue-grey white--text",
          },
          {
            text: "DISKON RUPIAH",
            align: "left",
            sortable: false,
            value: "lab",
            width: "10%",
            class: "text-xs-left pa-2 blue-grey white--text",
          },
          {
            text: "TOTAL",
            align: "left",
            sortable: false,
            value: "lab",
            width: "10%",
            class: "text-xs-left pa-2 blue-grey white--text",
          }
        ],
      };
    },
    mounted() {
      // this.generateYear();
      // console.log(this.yearList);
      // this.$store.dispatch("patient/gettype");
      // this.$store.dispatch("patient/search");
    },
    computed: {
      formatedStartDate() {
        return this.formatDate(this.date);
      },
      formatedEndDate() {
        return this.formatDate(this.date);
      },
      data_csv: {
        get() {
          return this.$store.state.patient.data_csv;
        },
        set(val) {
          this.$store.commit("patient/update_data_csv", val);
        },
      },
      companyList: {
        get() {
          return this.$store.state.patient.companyList;
        },
        set(val) {
          this.$store.commit("patient/update_companyList", val);
        },
      },
      selectedCompany: {
        get() {
          return this.$store.state.patient.selectedCompany;
        },
        set(val) {
          this.$store.commit("patient/update_selectedCompany", val);
        },
      },
      searchCompany: {
        get() {
          return this.$store.state.patient.searchCompany;
        },
        set(val) {
          this.$store.commit("patient/update_searchCompany", val);
        },
      },
      mouList: {
        get() {
          return this.$store.state.patient.mouList;
        },
        set(val) {
          this.$store.commit("patient/update_mouList", val);
        },
      },
      selectedMou: {
        get() {
          return this.$store.state.patient.selectedMou;
        },
        set(val) {
          this.$store.commit("patient/update_selectedMou", val);
        },
      },
      searchMou: {
        get() {
          return this.$store.state.patient.searchMou;
        },
        set(val) {
          this.$store.commit("patient/update_searchMou", val);
        },
      },
      isLoading: {
        get() {
          return this.$store.state.patient.isLoading;
        },
        set(val) {
          this.$store.commit("patient/update_isLoading", val);
        },
      },
      dialogForm: {
        get() {
          return this.$store.state.patient.dialogForm;
        },
        set(val) {
          this.$store.commit("patient/update_dialogForm", val);
        },
      },
      dialog_delete: {
        get() {
          return this.$store.state.patient.dialog_delete;
        },
        set(val) {
          this.$store.commit("patient/update_dialog_delete", val);
        },
      },
      year: {
        get() {
          return this.$store.state.patient.year;
        },
        set(val) {
          this.$store.commit("patient/update_year", val);
        },
      },
      yearFilter: {
        get() {
          return this.$store.state.patient.yearFilter;
        },
        set(val) {
          this.$store.commit("patient/update_yearFilter", val);
          this.$store.dispatch("patient/search");
        },
      },
      date: {
        get() {
          return this.$store.state.patient.date;
        },
        set(val) {
          this.$store.commit("patient/update_date", val);
        },
      },
      type: {
        get() {
          return this.$store.state.patient.type;
        },
        set(val) {
          this.$store.commit("patient/update_type", val);
        },
      },
      selectedType: {
        get() {
          return this.$store.state.patient.selectedType;
        },
        set(val) {
          this.$store.commit("patient/update_selectedType", val);
        },
      },
      name: {
        get() {
          return this.$store.state.patient.name;
        },
        set(val) {
          this.$store.commit("patient/update_name", val);
        },
      },
      curr_page: {
        get() {
          return this.$store.state.patient.curr_page;
        },
        set(val) {
          this.$store.commit("patient/update_curr_page", val);
          this.$store.dispatch("patient/search");
        },
      },
      isholiday: {
        get() {
          return this.$store.state.patient.is_holiday;
        },
        // set(val) {
        //     console.log("valllll :" + val)
        //     // this.$store.commit("patient/update_is_holiday", val)

        // }
      },
      holidays() {
        return this.$store.state.patient.holidays;
      },
      total_page: {
        get() {
          return this.$store.state.patient.TOTAL;
        },
        set(val) {
          this.$store.commit("patient/update_total", val);
        },
      },
      snackbar: {
        get() {
          return this.$store.state.patient.snackbar;
        },
        set(val) {
          this.$store.commit("patient/update_snackbar", val);
        },
      },
      error_dialog: {
        get() {
          return this.$store.state.patient.error_dialog;
        },
        set(val) {
          this.$store.commit("patient/update_error_dialog", val);
        },
      },
      name: {
        get() {
          return this.$store.state.patient.name;
        },
        set(val) {
          this.$store.commit("patient/update_name", val);
        },
      },
      desc: {
        get() {
          return this.$store.state.patient.desc;
        },
        set(val) {
          this.$store.commit("patient/update_desc", val);
        },
      },
      selectedHoliday: {
        get() {
          return this.$store.state.patient.selectedHoliday;
        },
        set(val) {
          this.$store.commit("patient/update_selectedHoliday", val);
        },
      },
      error_message: {
        get() {
          return this.$store.state.patient.error_message;
        },
        set(val) {
          this.$store.commit("patient/update_error_message", val);
        },
      },
      snackbar_msg() {
        return this.$store.state.patient.snackbar_msg;
      },
      formatedYearFilter() {
        return this.formatDate(this.yearFilter);
      },
    },
    methods: {
      inject() {
        this.$store.dispatch("patient/inject");
      },
      downloadcsvold() {
        let url = "./Template_user_mitra.xlsx";
        fetch(url)
          .then((response) => response.blob())
          .then((blob) => {
            const url = window.URL.createObjectURL(blob);
            const link = document.createElement("a");
            link.href = url;
            link.setAttribute("download", "Template_user_mitra.xlsx");
            document.body.appendChild(link);
            link.click();
            link.parentNode.removeChild(link);
            window.URL.revokeObjectURL(url);
          });
      },
      downloadcsv() {
    this.$store.dispatch("patient/downloadcsv")
  },
      resetInputFile() {
        this.data_csv = [];
        document.getElementById("csv_file").value = null;
      },
      cekKTP(nik, tanggal, bulan, tahun) {
        console.log("nik", nik);
        console.log("tanggal", tanggal);
        console.log("bulan", bulan);
        console.log("tahun", tahun);
        return true;
        if (nik.length !== 16) {
          console.log("nik length tidak valid");
          return false;
        }

        let d = parseInt(nik.substr(6, 2));
        let m = parseInt(nik.substr(8, 2));
        let y = parseInt(nik.substr(10, 2));
        console.log("d", d);
        console.log("m", m);
        console.log("y", y);

        // Jika tahun full, ambil 2 digit terakhir
        if (tahun.toString().length === 4) {
          tahun = tahun.toString().substr(2, 2);
        }

        if (d > 40) {
          // Wanita
          d = d + 40;
        }

        if (parseInt(tanggal) !== d) {
          console.log("tanggal tidak valid");
          return false;
        }

        if (parseInt(bulan) !== m) {
          console.log("bulan tidak valid");
          return false;
        }

        if (parseInt(tahun) !== y) {
          console.log("tahun tidak valid");
          return false;
        }

        // Setelah berhasil melewati rintangan, berarti nomornya valid (tidak 100% valid)
        return true;
      },
      cekDataJSON(data) {
        console.log("data cek json", data);
        let message = "";
        // console.log("data json");
        // console.log(data);

        // NAMA
        //TANGGAL_LAHIR
        //KTP
        // JENIS_KELAMIN
        // JABATAN
        //KEDUDUKAN
        //LOKASI
        // PEKERJAAN
        var day = moment(data.TANGGAL_LAHIR, "DD-MM-YYYY").format("DD");
        var month = moment(data.TANGGAL_LAHIR, "DD-MM-YYYY").format("MM");
        var year = moment(data.TANGGAL_LAHIR, "DD-MM-YYYY").format("YYYY");
        console.log("tanggal lahir", data.TANGGAL_LAHIR);
        console.log("day", day);
        console.log("month", month);
        console.log("year", year);
        // entry.KTP = .KTP;

        if (data.NAMA === "" || data.NAMA === null || data.NAMA === undefined) {
          console.log("NAMA Tidak boleh kosong " + data.NAMA);
          message += "NAMA Tidak boleh kosong <br>";
        }
        if (
          data.TANGGAL_LAHIR === "" ||
          data.TANGGAL_LAHIR === null ||
          data.TANGGAL_LAHIR === undefined
        ) {
          console.log("TANGGAL LAHIR Tidak boleh kosong " + data.TANGGAL_LAHIR);
          message += "TANGGAL LAHIR Tidak boleh kosong <br>";
        }
        if (data.NIK !== "" && data.NIK !== null && data.NIK !== undefined) {
          if (!this.cekKTP(data.NIK, day, month, year)) {
            console.log("NIK '" + data.NIK + "'' Tidak Valid");
            message += "NIK '" + data.NIK + "'' Tidak Valid <br>";
          }
        }
        if (
          data.JENIS_KELAMIN === "" ||
          data.JENIS_KELAMIN === null ||
          data.JENIS_KELAMIN === undefined
        ) {
          console.log("JENIS KELAMIN Tidak boleh kosong " + data.JENIS_KELAMIN);
          message += "JENIS KELAMIN Tidak boleh kosong <br>";
        } else {
          const validGender = ["L", "P"];
          if (!validGender.includes(data.JENIS_KELAMIN)) {
            console.log("JENIS KELAMIN Tidak Valid " + data.JENIS_KELAMIN);
            message += "JENIS KELAMIN Tidak Valid <br>";
          }
        }
        if (
          data.JABATAN === "" ||
          data.JABATAN === null ||
          data.JABATAN === undefined
        ) {
          console.log("JABATAN Tidak boleh kosong " + data.JABATAN);
          message += "JABATAN Tidak boleh kosong <br>";
        }
        if (
          data.KEDUDUKAN === "" ||
          data.KEDUDUKAN === null ||
          data.KEDUDUKAN === undefined
        ) {
          console.log("KEDUDUKAN Tidak boleh kosong " + data.KEDUDUKAN);
          message += "KEDUDUKAN Tidak boleh kosong <br>";
        }
        if (
          data.LOKASI === "" ||
          data.LOKASI === null ||
          data.LOKASI === undefined
        ) {
          console.log("LOKASI Tidak boleh kosong " + data.LOKASI);
          message += "LOKASI Tidak boleh kosong <br>";
        }
        if (
          data.PEKERJAAN === "" ||
          data.PEKERJAAN === null ||
          data.PEKERJAAN === undefined
        ) {
          console.log("PEKERJAAN Tidak boleh kosong " + data.PEKERJAAN);
          message += "PEKERJAAN Tidak boleh kosong <br>";
        }
        if (message === "") {
          return [true, message];
        } else {
          message += "Nama : " + data.NAMA + "<br>";
          message += "Tanggal Lahir : " + data.TANGGAL_LAHIR + "<br>";
          message += "NIK : " + data.NIK + "<br>";
          message += "Jenis Kelamin : " + data.JENIS_KELAMIN + "<br>";
          message += "Jabatan : " + data.JABATAN + "<br>";
          message += "Kedudukan : " + data.KEDUDUKAN + "<br>";
          message += "Lokasi : " + data.LOKASI + "<br>";
          message += "Pekerjaan : " + data.PEKERJAAN + "<br>";
          message += "NIP : " + data.NIP + "<br>";
          message += "HP : " + data.HP + "<br>";
          message += "Alamat : " + data.ALAMAT + "<br>";
          message += "No RM : " + data.NO_RM + "<br>";
          return [false, message];
        }
      },
      loadCSV(e) {
        var vm = this;
        this.isLoading = true;
        var files = e.target.files,
          f = files[0];
        var reader = new FileReader();
        reader.onload = function (e) {
          var data = new Uint8Array(e.target.result);
          var workbook = XLSX.read(data, {
            type: "array",
            cellText: true,
            cellDates: true,
          });
          let sheetName = workbook.SheetNames[0];
          console.log(workbook);
          let worksheet = workbook.Sheets[sheetName];
          // console.log(XLSX.utils.sheet_to_json(worksheet));
          //var xdata = XLSX.utils.sheet_to_json(worksheet,{ raw:false,  dateNF: 'FMT 22'})
          var data_json = [];
          // console.log(xdata)
          var date_data = XLSX.utils.sheet_to_json(worksheet, {
            raw: false,
            dateNF: "22",
          });
          var data_harga = XLSX.utils.sheet_to_json(worksheet, {
            cellText: true,
          });
          var error = [];
          // console.log("data_harga", data_harga)
          date_data.forEach(function (entry, iidx) {
            if (iidx > 0) {
              console.log("entry", entry);
              entry.TEST_CODE = data_harga[iidx].TEST_CODE ?? "";
              entry.TEST_NAME = data_harga[iidx].TEST_NAME ?? "";
              entry.HARGA = data_harga[iidx].HARGA ?? "";
              entry.DISKON_PERSEN = data_harga[iidx].DISKON_PERSEN ?? "";
              entry.DISKON_RUPIAH = data_harga[iidx].DISKON_RUPIAH ?? "";
              entry.TOTAL = data_harga[iidx].TOTAL ?? "";
              
              
                if (entry.HARGA !== "" && entry.HARGA !== null && entry.HARGA !== undefined) {
  data_json.push(entry);
}
              
            }
          });
          // var prm = {
          //   xid: vm.selected_mgmmcu.Mgm_McuID,
          //   corporateID: vm.selected_mgmmcu.Mgm_McuCorporateID,
          //   data: data_json,
          // };
          console.log("data json");
          console.log(data_json);
          // console.log("data prm",prm)
          //XLSX.utils.sheet_to_json(ws, {dateNF:"YYYY-MM-DD"})
          // if (error.length != 0) {
          //   // console.log("error", error)
          //   vm.$store.commit("patient/update_error_identifier", error);
          //   vm.dialog_identifier = true;
          // } else {
          //   // console.log("prm",prm)
          //   vm.$store.dispatch("patient/savecsv", prm);
          // }
          vm.data_csv = data_json;
        };

        this.isLoading = false;

        reader.readAsArrayBuffer(f);
      },
      checkSelectedCompany() {
        console.log(
          "cek selected company",
          Object.keys(this.selectedCompany || {}).length
        );
        if (Object.keys(this.selectedCompany || {}).length === 0) {
          console.log("false");
          return false;
        }
        if (!this.selectedCompany || this.selectedCompany === null) {
          console.log("false");
          return false;
        }
        console.log("true");
        return true;
      },
      openAdd() {
        this.action = "add";
        this.name = "";
        this.date = moment(new Date()).format("YYYY-MM-DD");
        this.year = moment(new Date()).format("YYYY");
        this.desc = "";
        this.selectedType = "";
        this.dialogForm = true;
      },
      openEdit(data) {
        this.action = "edit";
        this.name = data.holiday_name;
        this.date = data.holiday_date;
        this.year = data.holiday_year;
        this.desc = data.description;
        this.selectedType = data.holiday_type;
        this.selectedHoliday = data;
        this.dialogForm = true;
      },
      openDelete(data) {
        this.action = "delete";
        this.selectedHoliday = data;
        this.dialog_delete = true;
      },
      saveHoliday() {
        if (this.action == "add") {
          this.$store.dispatch("patient/add");
        }
        if (this.action == "edit") {
          this.$store.dispatch("patient/edit");
        }
      },
      deleteHoliday() {
        this.$store.dispatch("patient/deleteData");
      },
      generateYear() {
        const currentYear = new Date().getFullYear();
        const startYear = currentYear - 5; // 5 tahun sebelum tahun ini
        const endYear = currentYear + 10; // 10 tahun setelah tahun ini
        let years = [];

        for (let year = startYear; year <= endYear; year++) {
          years.push(year.toString());
        }

        this.yearList = years;
      },
      save(selectedYear) {
        this.menu = false;
        this.yearTEST_NAME = selectedYear;
      },
      formatDate(date) {
        if (!date) return null;

        const [year, month, day] = date.split("-");
        return `${day}-${month}-${year}`;
      },
      deFormatedDate(date) {
        if (!date) return null;

        const [day, month, year] = date.split("-");
        return `${year}-${month.padStart(2, "0")}-${day.padStart(2, "0")}`;
      },
      changeCourir(userID, staffID, type, data) {
        this.selected = data;
        console.log("change holiday" + userID + " " + staffID);
        var tempCourrier = JSON.stringify(this.isholiday);
        var arrholiday = JSON.parse(tempCourrier);
        console.log(type);
        if (type !== "new") {
          this.dialog_delete = true;
          // console.log("hapus kurir");
          // this.$store.dispatch("patient/deleteData", {
          //     "holidayID": type
          // });
          // arrholiday.filter((e) => e === type);
        } else {
          var validation = arrholiday.includes(userID);
          if (!validation) {
            this.$store.dispatch("patient/add", {
              staffID: staffID,
              userID: userID,
            });
            console.log("add kurir");
            arrholiday.push(userID);
          }
        }
        console.log(arrholiday);
        this.$store.commit("patient/update_is_holiday", arrholiday);
        this.$store.dispatch("patient/search");
      },
      delete_kurir() {
        console.log("hapus kurir");
        this.$store.dispatch("patient/deleteData", {
          holidayID: this.selected.holidayID,
        });
        this.dialog_delete = false;
      },

      thr_search: _.debounce(function () {
        this.$store.dispatch("patient/search");
      }, 1000),
    },

    watch: {
      // menuFormDateStart(val) {
      //   val && setTimeout(() => (this.$refs.picker.activePicker = "YEAR"));
      // },
      searchCompany(val, old) {
        if (val === "") return;
        if (val === null) return;
        if (val === old) return;
        if (val.length < 2) return;
        this.$store.dispatch("patient/getCompany", val);
      },
      searchMou(val, old) {
        if (val === "") return;
        if (val === null) return;
        if (val === old) return;
        if (val.length < 2) return;
        this.$store.dispatch("patient/getMou", {search : val, companyid : this.selectedCompany.M_CompanyID});
      },
      name(val, old) {
        this.name = val;
        this.thr_search();
      },
    },
  };
</script>
