<template>
  <div class="container-fluid">
    <section class="content">
      <div class="header pb-2">
        <div class="header-body">
          <div class="row align-items-center py-4">
            <div class="col-lg-6 col-7">
              <nav
                aria-label="breadcrumb"
                class="d-none d-md-inline-block ml-md-4"
              >
                <ol class="breadcrumb breadcrumb-links">
                  <li class="breadcrumb-item">
                    <a href="#"><i class="fas fa-home"></i></a>
                  </li>
                  <li class="breadcrumb-item">
                    <a href="#">Dashboards</a>
                  </li>
                  <li class="breadcrumb-item active" aria-current="page">
                    ຮັບສັ່ງເຄື່ອງ
                  </li>
                  
                </ol>
                
              </nav>
            </div>
            <div class="col-lg-6 col-5 text-right">
              <a @click="$router.go(-1)" aria-current="page" href="javascript:void(0)" class=" router-link-active router-link-exact-active btn btn-sm btn-info btn-round btn-icon mb-2 " ><span class="btn-inner--icon" ><i class="fas fa-chevron-left"></i> ກັບຄືນ</span ></a >
            </div>
          </div>
        </div>
      </div>
      <div class="row" v-if="isLoggedIn">
        <div class="col-md-12">
          <div class="card">
            <div class="card-header d-flex justify-content-between">
              <div>ເມນູການສັ່ງເຄື່ອງ ເລກທີ່: {{ PreOrderID }}</div>
              <div>
                <a aria-current="page" href="javascript:void(0)" class=" router-link-active router-link-exact-active btn btn-sm btn-danger btn-round btn-icon mb-2 " ><span class="btn-inner--icon" ><i class="fas fa-print"></i> ພິມ</span ></a >
                <a aria-current="page" href="javascript:void(0)" @click="SavePreorder" class=" router-link-active router-link-exact-active btn btn-sm btn-success btn-round btn-icon mb-2 " :class="check_form_add"><span class="btn-inner--icon" ><i class="fas fa-save"></i> ບັນທຶກ</span ></a >
                
              </div>
            </div>
          </div>

          <div class="row">
            <div class="col-md-4">
              <div class="card">
                <div class="card-header">ຜູ້ສະໜອງສິນຄ້າ</div>
                <div class="card-body"> 
                  <supplier :supplierData="SupplierData" />
                </div>
              </div>
            </div>

            <div class="col-md-4">
              <div class="card">
                <div class="card-header">ຜູ້ຮັບສິນຄ້າ</div>

                <div class="card-body"> 
                  <getcustomer :CustomerData="CustomerData" />
                </div>
              </div>
            </div>
            <div class="col-md-4">
              <tranprice :tranData="tranData" @TranDay="getDate($event)" />
            </div>
          </div>
          <div class="row">
            <div class="col-md-8">
              <div class="card">
                <div class="card-header d-flex justify-content-between">
                  <span>ລາຍກນສິນຄ້າ</span>

                  <span>
                    <a
                      aria-current="page"
                      href="javascript:void(0)"
                      @click="AddPre"
                      class="btn btn-sm btn-info btn-round btn-icon mb-2"
                    >
                      <span class="btn-inner--icon"
                        ><i class="fas fa-plus-circle"></i> ເພີ່ມລາຍການ
                      </span></a
                    >
                    <!-- <a aria-current="page" href="javascript:void(0)" @click="SavePre" class=" btn btn-sm btn-success btn-round btn-icon mb-2 " > <span class="btn-inner--icon" ><i class="fas fa-save"></i> ບັນທຶກ </span ></a > 
                  <a aria-current="page" href="javascript:void(0)" @click="CancelPre" class=" btn btn-sm btn-warning btn-round btn-icon mb-2 " > <span class="btn-inner--icon" ><i class="fas fa-times"></i> ຍົກເລີກ </span ></a >  -->
                  </span>
                </div>

                <div class="card-body">
                  <div class="row">
                    <div class="col-md-6"></div>
                    <div class="col-md-6">
                      <div class="form-group mb-2">
                        <div class="input-group input-group-merge">
                          <div class="input-group-prepend">
                            <span class="input-group-text"
                              ><i class="fas fa-barcode"></i
                            ></span>
                          </div>
                          <input
                            type="text"
                            class="form-control"
                            name="barcode"
                            v-model="barcode"
                            @keyup.enter="GetProduct()"
                            placeholder="ສະແກນ Barcode..."
                          />
                        </div>
                      </div>
                    </div>
                  </div>

                  <div class="table-responsive border">
                    <table class="table align-items-center table-flush">
                      <thead class="thead-light">
                        <tr>
                          <!-- <th width="30">ID</th> -->
                          <th class="text-center" width="120">ຮູບ</th>
                          <th class="text-left">ຊື່ລາຍການ</th>
                          <th class="text-center" width="110">ລາຄາຊື້</th>
                          <th class="text-center" width="90">ຈຳນວນ</th>
                          <th class="text-right" width="110">ລວມ</th>
                          <th width="80" class="text-center">ຈັດການ</th>
                        </tr>
                      </thead>
                      <tbody>
                        <tr v-for="list in ListPreorder" :key="list.id">
                          <td>
                            <span class="avatar avatar-xl border-radius-lg">
                              <img v-if="list.images" alt="Image" class=" cursor-pointer" @click="imgbox(localtionURL + '/images/product/' + list.images)" :src=" localtionURL + '/images/product/' + list.images " />
                              <img v-else alt="Image" :src="localtionURL + '/images/add_img_bt.png'" />
                            </span>
                          </td>
                          <td>
                            {{ list.name }}<br />
                            <small >{{ list.detail }} </small>
                          </td>
                          <td class="text-right">
                            {{ formatPrice(list.price_buy) }} ກີບ
                          </td>
                          <td class="text-center">
                            <i
                              class="
                                fa-lg
                                fas
                                fa-minus-circle
                                cursor-pointer
                                text-success
                              "
                              v-if="list.product_id"
                              @click="RemoveNumPro(list.product_id)"
                            ></i>
                            {{ list.amount }}
                            <i
                              class="
                                fa-lg
                                fas
                                fa-plus-circle
                                cursor-pointer
                                text-success
                              "
                              v-if="list.product_id"
                              @click="AddNumPro(list.product_id)"
                            ></i>
                          </td>
                          <td class="text-right">
                            {{ formatPrice(list.amount * list.price_buy) }} ກີບ
                          </td>

                          <td class="table-action text-center" v-if="!PayStatus">
                            <span
                              v-if="list.product_id"
                              @click="RemovePro(list.product_id)"
                              ><i
                                class="fas fa-trash-alt cursor-pointer text-red"
                              ></i
                            ></span>

                            <div class="col-auto" v-if="!list.product_id">
                              <button
                                type="button"
                                class="btn btn-sm btn-neutral mr-0"
                                data-toggle="dropdown"
                                aria-haspopup="true"
                                aria-expanded="false"
                              >
                                <i class="fas fa-ellipsis-h"></i>
                              </button>
                              <div
                                class="dropdown-menu dropdown-menu-right"
                                style=""
                              >
                                <a
                                  class="dropdown-item"
                                  href="javascript:void(0)"
                                  @click="EditPre(list.id)"
                                >
                                  <i class="fas fa-user-edit text-info"></i
                                  >ແກ້ໄຂຂໍ້ມູນ
                                </a>
                                <a
                                  class="dropdown-item"
                                  href="javascript:void(0)"
                                  @click="DelPre(list.id)"
                                  ><i class="fas fa-trash text-red"></i
                                  >ລຶບຂໍ້ມູນ</a
                                >
                              </div>
                            </div>
                          </td>
                        </tr>
                      </tbody>
                      <thead class="thead-light">
                        <tr>
                          <th class="text-center" width="120"></th>
                          <th class="text-left"></th>
                          <th class="text-center" width="110">ລວມທັງໝົດ</th>
                          <th class="text-center" width="90"></th>
                          <th class="text-right" colspan="2" width="110">
                            {{ formatPrice(AmountPreorder) }} ກີບ
                          </th>
                        </tr>
                      </thead>
                    </table>
                  </div>
                </div>
              </div>
            </div>

            <div class="col-md-4">
              <div class="card">
                <div class="card-header border-0">
                  <div class="row">
                    <div class="col-12">
                      <h3 class="mb-0">
                        <i class="fas fa-donate"></i> ຄິດໄລ່ຍອດເງິນຊຳລ່ະ
                      </h3>
                    </div>
                  </div>
                </div>
                <div class="card-body">
                  <div v-if="PayStatus" class="text-success">
                    <i class="fas fa-check-circle"></i> ຊຳລ່ະສຳເລັດແລ້ວ!
                  </div>
                  <div v-if="!PayStatus">
                    <div
                      class="
                        d-flex
                        justify-content-between
                        border
                        rounded
                        p-3
                        border-warning
                        mt--4
                        mb-2
                      "
                    >
                      <div class="custom-control custom-radio">
                        <input
                          name="cash_pay_pre"
                          class="custom-control-input"
                          id="RadioCashA_pre"
                          value="true"
                          type="radio"
                          v-model="CashType_pre"
                        />
                        <label class="custom-control-label" for="RadioCashA_pre"
                          ><i class="fas fa-money-bill-alt"></i> ເງິນສົດ</label
                        >
                      </div>
                      <div class="custom-control custom-radio">
                        <input
                          name="cash_pay_pre"
                          class="custom-control-input"
                          id="RadioCashB_pre"
                          value="false"
                          type="radio"
                          v-model="CashType_pre"
                        />
                        <label class="custom-control-label" for="RadioCashB_pre"
                          ><i class="fas fa-money-check-alt"></i> ທະນາຄານ</label
                        >
                      </div>
                    </div>
                    <div class="d-flex justify-content-between">
                      <h2>ຍອດເງິນ:</h2>
                      <h2>{{ formatPrice(AmountPreorder) }} ກີບ</h2>
                    </div>
                    <div class="d-flex justify-content-between">
                      <h2>ຈຳນວນເງິນທີ່ຊຳລ່ະ:</h2>
                      <h2>{{ formatPrice(CashAmount) }} ກີບ</h2>
                    </div>
                    <div
                      class="d-flex justify-content-between"
                      v-if="CashAmount - AmountPreorder > 0"
                    >
                      <h2 class="text-danger">ເງິນທອນ:</h2>
                      <h2 class="text-danger">
                        {{ formatPrice(CashAmount - AmountPreorder) }} ກີບ
                      </h2>
                    </div>
                    <div class="input-group input-group-merge">
                      <input
                        class="form-control"
                        placeholder="..."
                        type="number"
                        style="text-align: right"
                        v-model="CashAmount"
                      />
                      <div class="input-group-append">
                        <span class="input-group-text"
                          ><i class="fas fa-donate"></i
                        ></span>
                      </div>
                    </div>

                    <div class="p-2 justify-content-center d-flex">
                      <div class="row" style="width: 250px">
                        <div class="col-4 text-center mt-2">
                          <button
                            type="button"
                            class="btn btn-primary btn-lg"
                            @click="AddAm(1)"
                            style="width: 60px"
                          >
                            1
                          </button>
                        </div>
                        <div class="col-4 text-center mt-2">
                          <button
                            type="button"
                            class="btn btn-primary btn-lg"
                            @click="AddAm(2)"
                            style="width: 60px"
                          >
                            2
                          </button>
                        </div>
                        <div class="col-4 text-center mt-2">
                          <button
                            type="button"
                            class="btn btn-primary btn-lg"
                            @click="AddAm(3)"
                            style="width: 60px"
                          >
                            3
                          </button>
                        </div>
                        <div class="col-4 text-center mt-2">
                          <button
                            type="button"
                            class="btn btn-primary btn-lg"
                            @click="AddAm(4)"
                            style="width: 60px"
                          >
                            4
                          </button>
                        </div>
                        <div class="col-4 text-center mt-2">
                          <button
                            type="button"
                            class="btn btn-primary btn-lg"
                            @click="AddAm(5)"
                            style="width: 60px"
                          >
                            5
                          </button>
                        </div>
                        <div class="col-4 text-center mt-2">
                          <button
                            type="button"
                            class="btn btn-primary btn-lg"
                            @click="AddAm(6)"
                            style="width: 60px"
                          >
                            6
                          </button>
                        </div>
                        <div class="col-4 text-center mt-2">
                          <button
                            type="button"
                            class="btn btn-primary btn-lg"
                            @click="AddAm(7)"
                            style="width: 60px"
                          >
                            7
                          </button>
                        </div>
                        <div class="col-4 text-center mt-2">
                          <button
                            type="button"
                            class="btn btn-primary btn-lg"
                            @click="AddAm(8)"
                            style="width: 60px"
                          >
                            8
                          </button>
                        </div>
                        <div class="col-4 text-center mt-2">
                          <button
                            type="button"
                            class="btn btn-primary btn-lg"
                            @click="AddAm(9)"
                            style="width: 60px"
                          >
                            9
                          </button>
                        </div>
                        <div class="col-4 text-center mt-2">
                          <button
                            type="button"
                            class="btn btn-primary btn-lg"
                            @click="AddAm('00')"
                            style="width: 60px"
                          >
                            00
                          </button>
                        </div>
                        <div class="col-4 text-center mt-2">
                          <button
                            type="button"
                            class="btn btn-primary btn-lg"
                            @click="AddAm(0)"
                            style="width: 60px"
                          >
                            0
                          </button>
                        </div>
                        <div class="col-4 text-center mt-2">
                          <button
                            type="button"
                            class="btn btn-danger btn-lg"
                            @click="AddAm('-')"
                            style="width: 60px"
                          >
                            <i class="fas fa-long-arrow-alt-left"></i>
                          </button>
                        </div>
                      </div>
                    </div>
                    <div class="row justify-content-center d-flex mt-2">
                      <button
                        type="button"
                        class="btn btn-success"
                        @click="CashPayBT"
                        style="width: 180px"
                        :disabled="CheckCashBT"
                      >
                        <i class="fas fa-coins"></i> ຊຳລ່ະເງິນ
                      </button>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </section>
    <div
      class="modal fade"
      id="add_list_preorder"
      tabindex="-1"
      role="dialog"
      aria-labelledby="add_custom"
      data-keyboard="false"
      data-backdrop="static"
      aria-hidden="true"
    >
      <div class="modal-dialog" role="document">
        <div class="modal-content">
          <div class="modal-header">
            <h5 class="modal-title" id="exampleModalLongTitle">
              <i class="fas fa-list-ul"></i> ເພີ່ມລາຍການສິນຄ້າ
            </h5>
            <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="row">
              <div class="col-md-12">
                <uploadimgoneproduct :imagesBack="FormPreData" />
              </div>

              <div class="col-md-6">
                <div class="form-group">
                  <div class="input-group input-group-merge">
                    <div class="input-group-prepend">
                      <span class="input-group-text"
                        ><i class="fas fa-stream"></i
                      ></span>
                    </div>

                    <input
                      type="text"
                      class="form-control"
                      name="name"
                      placeholder="ຊື່ສິນຄ້າ"
                      v-model="FormPreData.name"
                      ref="namepre"
                    />
                  </div>
                </div>
              </div>
              <div class="col-md-6">
                <div class="form-group">
                  <div class="input-group input-group-merge">
                    <cleave
                      :options="option"
                      class="form-control"
                      placeholder="ລາຄາຊື້"
                      v-model="FormPreData.price_buy"
                    />
                    <div class="input-group-append">
                      <span class="input-group-text"
                        ><i class="fas fa-donate"></i
                      ></span>
                    </div>
                  </div>
                </div>
              </div>
              <div class="col-md-6">
                <div class="form-group">
                  <div class="input-group input-group-merge">
                    <div class="input-group-prepend">
                      <span class="input-group-text"
                        ><i class="ni ni-fat-add"></i
                      ></span>
                    </div>
                    <input
                      class="form-control"
                      placeholder="ຈຳນວນ"
                      type="number"
                      pattern="[1-99]"
                      style="width: 80px"
                      v-model="FormPreData.amount"
                    />
                  </div>
                </div>
              </div>
              <div class="col-md-6">
                <div class="form-group">
                  <div class="input-group input-group-merge">
                    <cleave
                      :options="option"
                      class="form-control"
                      placeholder="ລາຄາຂາຍ"
                      v-model="FormPreData.price_sell"
                    />
                    <div class="input-group-append">
                      <span class="input-group-text"
                        ><i class="fas fa-donate"></i
                      ></span>
                    </div>
                  </div>
                </div>
              </div>

              <div class="col-md-12">
                <label class="form-control-label">ລາຍລະອຽດ:</label>
                <textarea
                  class="form-control mb-4"
                  rows="3"
                  v-model="FormPreData.detail"
                ></textarea>
              </div>
            </div>
          </div>
          <div class="modal-footer">
            <button
              type="button"
              class="btn btn-primary"
              :disabled="check"
              @click="SavePre"
            >
              ບັນທຶກ
            </button>
            <button
              type="button"
              class="btn btn-secondary"
              data-dismiss="modal"
            >
              ຍົກເລີກ
            </button>
          </div>
        </div>
      </div>
    </div>
    <vue-easy-lightbox
                            scrollDisabled
                            escDisabled
                            moveDisabled
                            :visible="visible"
                            :imgs="images_show"
                            :index="index"
                            @hide="handleHide"
                          >
                          </vue-easy-lightbox>
  </div>
</template>

<script>
export default {
  name: "order",
  components: {},
  data() {
    return {
      visible: false,
      index:0,
      images_show:'',
      PreOrderID: "",
      isLoggedIn: false,
      Repaires: [],
      searchOrder: null,
      loading: false,
      CustomerData: {
        Size: "S",
        CustomerSe: "",
        Customer_id: "",
        Customer_name: "",
        Customer_tel: "",
        Customer_address: "",
      },
      SupplierData: {
        SupplierID: "",
      },
      tranData: {
        ListTran: [],
      },
      FormPreType: true,
      FormPreShow: false,
      FormPreID: "",
      FormPreData: {
        product_id: "",
        name: "",
        amount: 1,
        price_buy: "",
        price_sell: "",
        detail: "",
        images: "",
      },
      ListPreorder: [],
      option: {
        // prefix: '$ ',
        numeral: true,
        numeralPositiveOnly: true,
        noImmediatePrefix: true,
        rawValueTrimPrefix: true,
        numeralIntegerScale: 10,
        numeralDecimalScale: 2,
        numeralDecimalMark: ".",
        delimiter: ",",
      },
      localtionURL: window.location.origin,
      config: {
        mode: "range",
        wrap: true, // set wrap to true only when using 'input-group'
        altFormat: "d/m/Y",
        altInput: true,
        dateFormat: "Y-m-d",
        allowInput: true,
      },

      TranDay: "",
      TranDaycom: "",
      barcode: "",
      CashType_pre: true,
      CashAmount: 0,
      PayStatus: false,
      EditForm_pre:true,
    };
  },

  computed: {
    check_form_add(){
      //console.log(this.ListPreorder.length);
      if (this.SupplierData.SupplierID=='' || this.TranDay=='' || this.TranDay == null || this.ListPreorder.length==0) {
        return 'disabled';
      } else {
        return '';
      }
    },
    CheckCashBT(){
      if(parseInt(this.CashAmount) == 0){
        return true
      } else {
        if(parseInt(this.CashAmount) < parseInt(this.AmountPreorder)) {
          return true
          } else {
            return false
            }
        }
    },
    check() {
      if (this.FormPreData.name == "" || this.FormPreData.price == "") {
        return true;
      } else {
        return false;
      }
    },
    AmountPreorder() {
      return this.ListPreorder.reduce(
        (price_buy, item) => parseInt(price_buy) + parseInt(item.price_buy * item.amount),
        0
      );
    },
    AmountTran() {
      return this.tranData.ListTran.reduce(
        (price, item) => parseInt(price) + parseInt(item.price),
        0
      );
    },
    // AlltotalListAmount(){
    //   return this.ListPreorder.reduce(
    //     (price, item) => parseInt(price) + parseInt(item.amount*item.price),
    //     0
    //   );
    // },
  },
watch: {
    CashType_pre(){
      if(this.CashType_pre=='false'){ this.CashAmount = this.AmountPreorder } else { this.CashAmount = 0 }
    },

  },
  methods: {
    imgbox(img){
       // alert(img);
        this.images_show = img;
        this.show()
    },
    show() {
        this.visible = true
      },
      handleHide() {
        this.visible = false
      },
    CashPayBT(){
      this.PayStatus = true
      this.SavePreorder()
    },
    AddAm(vl) {
      if (vl == "-") {
        //str.substring(0, str.length - 1)
        let pr = this.CashAmount.toString().slice(0, -1);
        if (pr == "") {
          this.CashAmount = 0;
        } else {
          this.CashAmount = pr;
        }
      } else {
        let pa = "";
        if (this.CashAmount == 0) {
          pa = "";
        } else {
          pa = this.CashAmount.toString();
        }
        this.CashAmount = pa + vl;
      }
    },
    RemoveNumPro(id) {
      if (this.ListPreorder.find((i) => i.product_id == id)) {
        this.ListPreorder.find((i) => i.product_id == id).amount =
          this.ListPreorder.find((i) => i.product_id == id).amount - 1;
        if (this.ListPreorder.find((i) => i.product_id == id).amount < 1) {
          this.$notify( { group: "sucess", title: "ສຳເລັດ!", text: " ຂໍ້ມູນໄດ້ຖຶກລຶບແລ້ວ! ", }, 2000 );
          this.ListPreorder.splice(
            this.ListPreorder.map((i) => i.product_id).indexOf(id),
            1
          );
        }
      }
      this.EditForm_pre = true
    },
    AddNumPro(id) {
      if (this.ListPreorder.find((i) => i.product_id == id)) {
        this.ListPreorder.find((i) => i.product_id == id).amount =
          this.ListPreorder.find((i) => i.product_id == id).amount + 1;
      }
      this.EditForm_pre = true
    },
    RemovePro(id) {
      this.$notify(
        { group: "sucess", title: "ສຳເລັດ!", text: " ຂໍ້ມູນໄດ້ຖຶກລຶບແລ້ວ! " },
        2000
      );
      this.ListPreorder.splice(
        this.ListPreorder.map((i) => i.product_id).indexOf(id),
        1
      );
      this.EditForm_pre = true
    },
    playSound (sound) {
      if(sound) {
        var audio = new Audio(sound);
        audio.play();
      }
    },
    getDate(e) {
      this.TranDay = e;
    },
    GetProduct() {
      // console.log(this.barcode)
      this.$Progress.start();
      this.$axios.get("/sanctum/csrf-cookie").then((response) => {
        axios
          .get(`/api/store/product/sbarcode/${this.barcode}`)
          .then((response) => {
            if (response.data.success) {
              let db_product = response.data.product;
              let product_options = response.data.product_options;
              let product_prices = response.data.product_prices;

              //console.log(db_product[0]);

              //this.BarcodeAdd(this.barcode, db_product, product_options, product_prices)

              if ( this.ListPreorder.find( (i) => i.product_id == db_product[0].product_id ) ) {
                this.ListPreorder.find( (i) => i.product_id == db_product[0].product_id ).amount = this.ListPreorder.find( (i) => i.product_id == db_product[0].product_id ).amount + 1;
                //console.log(this.ListPreorder.find((i)=>i.product_id==db_product[0].product_id).amount+1)
              } else {
                let product_img = "";
                if ( db_product[0].product_images != null || db_product[0].product_images != "" ) {
                  product_img = JSON.parse(db_product[0].product_images)[0];
                }
                //console.log(product_img.img);
                //console.log(product_prices.find((i) => i.default == 'true').price);


                this.ListPreorder.push({
                  id: Math.floor(Math.random() * 10000),
                  product_id: db_product[0].product_id,
                  name: db_product[0].product_name,
                  amount: 1,
                  price_buy: db_product[0].product_price_buy,
                  price_sell: product_prices.find((i) => i.default == 'true').price,
                  detail: db_product[0].product_model,
                  images: product_img.img,
                });
              }
              this.playSound ('/sound/mixkit-quick-win-video-game-notification-269.wav') 
              this.$Progress.finish();
              this.barcode = null;
               this.EditForm_pre = true;
            } else {
              this.$Progress.fail();
              this.barcode = null;
              this.$notify( { group: "error", title: "ບໍ່ສຳເລັດ!", text: response.data.message, }, 4000 );
            }
          })
          .catch((error) => {
            this.$Progress.fail();
            this.dable_add = false;
            this.$notify( { group: "error", title: "ບໍ່ສຳເລັດ!", text: "ຜິດຜາດ: " + error.message, }, 4000 );
          });
      });
    },
    formatPrice(value) {
      let val = (value / 1).toFixed(0).replace(".", ",");
      return val.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
    },
    searchOrder_up(e) {},
    AddPre() {
      $("#add_list_preorder").modal("show");
      this.FormPreData.product_id = "";
      this.FormPreData.name = "";
      this.FormPreData.amount = 1;
      this.FormPreData.detail = "";
      this.FormPreData.price_buy = "";
      this.FormPreData.price_sell = "";
      this.FormPreData.images = "";

      this.polling = setInterval(() => {
        this.$refs.namepre.focus();
        clearInterval(this.polling);
      }, 500);
    },
    SavePre() {
      if (this.FormPreType) {
        this.ListPreorder.push({
          id: Math.floor(Math.random() * 10000),
          product_id: this.FormPreData.product_id,
          name: this.FormPreData.name,
          amount: this.FormPreData.amount,
          price_buy: this.FormPreData.price_buy,
          price_sell: this.FormPreData.price_sell,
          detail: this.FormPreData.detail,
          images: this.FormPreData.images,
        });
      } else {
        this.ListPreorder.find((i) => i.id == this.FormPreID).name =
          this.FormPreData.name;
        this.ListPreorder.find((i) => i.id == this.FormPreID).amount =
          this.FormPreData.amount;
        this.ListPreorder.find((i) => i.id == this.FormPreID).product_id =
          this.FormPreData.product_id;
        this.ListPreorder.find((i) => i.id == this.FormPreID).price_buy =
          this.FormPreData.price_buy;
          this.ListPreorder.find((i) => i.id == this.FormPreID).price_sell =
          this.FormPreData.price_sell;
        this.ListPreorder.find((i) => i.id == this.FormPreID).detail =
          this.FormPreData.detail;
        this.ListPreorder.find((i) => i.id == this.FormPreID).images =
          this.FormPreData.images;
      }
      $("#add_list_preorder").modal("hide");
      this.FormPreType = true;
      this.FormPreData.product_id = "";
      this.FormPreData.name = "";
      this.FormPreData.amount = 1;
      this.FormPreData.detail = "";
      this.FormPreData.price_buy = "";
      this.FormPreData.price_sell = "";
      this.FormPreData.images = "";
      this.FormPreID = "";
    },
    EditPre(id) {
      let item = this.ListPreorder.find((i) => i.id == id);
      $("#add_list_preorder").modal("show");
      this.FormPreID = id;
      this.FormPreType = false;
      this.FormPreData.product_id = item.product_id;
      this.FormPreData.name = item.name;
      this.FormPreData.amount = item.amount;
      this.FormPreData.detail = item.detail;
      this.FormPreData.price_buy = item.price_buy;
      this.FormPreData.price_sell = item.price_sell;
      this.FormPreData.images = item.images;
    },
    DelPre(id) {
      this.$swal
        .fire({
          title: "ທ່ານແນ່ໃຈບໍ່?",
          text: "ທີ່ຈະລຶບຂໍ້ມູນນີ້!",
          icon: "warning",
          showCancelButton: true,
          confirmButtonColor: "#3085d6",
          cancelButtonColor: "#d33",
          confirmButtonText: "ລຶບເລີຍ!",
          cancelButtonText: "ຍົກເລີກ",
        })
        .then((result) => {
          if (result.isConfirmed) {
            let item = this.ListPreorder.find((i) => i.id == id);
            if (item.product_id) {
              this.$notify(
                {
                  group: "sucess",
                  title: "ສຳເລັດ!",
                  text: " ຂໍ້ມູນໄດ້ຖຶກລຶບແລ້ວ! ",
                },
                2000
              );
              this.ListPreorder.splice(
                this.ListPreorder.map((i) => i.id).indexOf(id),
                1
              );
            } else {
              if (item.images) {
                this.$Progress.start();
                this.$axios.get("/sanctum/csrf-cookie").then((response) => {
                  axios
                    .post("/api/img/del_img_product", {
                      image_del: item.images,
                    })
                    .then((response) => {
                      if (response.data.success) {
                        this.$Progress.finish();
                        this.$notify(
                          {
                            group: "sucess",
                            title: "ສຳເລັດ!",
                            text: " ຮູບໄດ້ຖຶກລຶບແລ້ວ! ",
                          },
                          2000
                        );
                        this.ListPreorder.splice(
                          this.ListPreorder.map((i) => i.id).indexOf(id),
                          1
                        );
                      } else {
                        this.error = response.data.message;
                        this.$Progress.fail();
                      }
                    })
                    .catch((error) => {
                      this.$notify(
                        {
                          group: "error",
                          title: "ບໍ່ສຳເລັດ!",
                          text: "ຜິດຜາດ: " + error.message,
                        },
                        4000
                      );
                    });
                });
              } else {
                this.$notify(
                  {
                    group: "sucess",
                    title: "ສຳເລັດ!",
                    text: " ຂໍ້ມູນໄດ້ຖຶກລຶບແລ້ວ! ",
                  },
                  2000
                );
                this.ListPreorder.splice(
                  this.ListPreorder.map((i) => i.id).indexOf(id),
                  1
                );
              }
            }

            //
          }
        });
    },
    CreatePreOrder() {
      this.$Progress.start();
      this.$axios.get("/sanctum/csrf-cookie").then((response) => {
        axios.post(`/api/preorder/add`)
          .then((response) => {
            if (response.data.success) {
              this.$Progress.finish();
              this.PreOrderID = response.data.preorder_id;
            } else {
              this.daSave = true;
              this.$notify( { group: "error", title: "ບໍ່ສຳເລັດ!", text: "ຜິດຜາດ: " + response.data.message, }, 4000 );
              this.$Progress.fail();
            }
          })
          .catch((error) => {
            this.$notify( { group: "error", title: "ບໍ່ສຳເລັດ!", text: "ຜິດຜາດ: " + error.message, }, 4000 );
          });
      });
    },
    SavePreorder() {
      this.$Progress.start();
      this.$axios.get("/sanctum/csrf-cookie").then((response) => {
        axios
          .post(`/api/preorder/update/${this.PreOrderID}`, {
            supplier_id: this.SupplierData.SupplierID,
            customer_id: this.CustomerData.Customer_id,
            customer_type: this.CustomerData.CustomerSe,
            customer_name: this.CustomerData.Customer_name,
            customer_tel: this.CustomerData.Customer_tel,
            customer_address: this.CustomerData.Customer_address,
            tran_price: this.tranData.ListTran,
            preoder_item: this.ListPreorder,
            amount: this.AmountPreorder,
            amountTran: this.AmountTran,
            transport_day: this.TranDay,
            transport_status:'pending',
            transport_day_come: "",
            user_id: window.Laravel.user.id,
            CashType_pre: this.CashType_pre,
            PayStatus: this.PayStatus,
            EditForm_pre: this.EditForm_pre,
          })
          .then((response) => {
            if (response.data.success) {
             
              this.$Progress.finish();
              this.$notify(
                {
                  group: "sucess",
                  title: "ສຳເລັດ!",
                  text: response.data.message,
                },
                2000
              );
              this.EditForm_pre = false
              this.$router.push('/service/preorder')
            } else {
              this.daSave = true;
              this.$notify(
                {
                  group: "error",
                  title: "ບໍ່ສຳເລັດ!",
                  text: "ຜິດຜາດ: " + response.data.message,
                },
                4000
              );
              this.$Progress.fail();
            }
          })
          .catch((error) => {
            this.$notify(
              {
                group: "error",
                title: "ບໍ່ສຳເລັດ!",
                text: "ຜິດຜາດ: " + error.message,
              },
              4000
            );
          });
      });
    },
  },
  created() {
    this.CreatePreOrder();
    this.$axios.get(`/api/users/checkauth`).then((response) => {
      if (!response.data.isLogin) {
        window.location.href = "/";
      }
    });

    if (window.Laravel.isLoggedin) {
      this.isLoggedIn = true;
    }
  },
};
</script>

<style lang="scss" scoped></style>
