<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">

          </div>
        </div>
      </div>
    </div>
    <div class="row" v-if="isLoggedIn">
    <div class="col-md-12 col-lg-8">
          <div class="card">
          <!-- Card header -->
          <form @submit.prevent="SaveAcc">
          <div class="card-header border-0">
            <div class="row d-flex justify-content-between px-2">
              <div >
                <h3 class="mb-0">ຜັງບັນຊີ</h3>
              </div>
              <div v-if="$store.getters['getroles'].includes('acc_access_ph_add')">
                  <a href="javascript:void(0)" v-if="FAcc" :class="addAcc" @click="SaveAcc" class="btn btn-sm btn-success btn-round btn-icon"><i class="fas fa-save"></i> ບັນທຶກ </a>
                <a href="javascript:void(0)" v-if="FAcc" @click="BtnCancelAcc" class="btn btn-sm btn-danger btn-round btn-icon"><i class="fas fa-trash"></i > ຍົກເລີກ </a>
                <a href="javascript:void(0)" v-if="!FAcc" @click="BtnAddAcc" class="btn btn-sm btn-info btn-round btn-icon"><i class="fas fa-plus"></i > ເພີ່ມໃໝ່ </a>
              </div>
            </div>
          </div>

            <div  v-if="FAcc">
          <div class="form-cat px-4 row">

                  <div class="form-group col-md-3">
                      <label class="form-control-label">ເລັກບັນຊີ: <span class="text-red">* </span></label>

                  <div class="input-group input-group-merge ">
                      <div class="input-group-prepend">
                          <span class="input-group-text"><i class="fa fa-id-card"></i></span></div>
                          <input type="text" class="form-control" v-model="AccID"  ref="acc_id">
                    </div>

                </div>
                <div class="form-group col-md-9">
                      <label class="form-control-label">ຊື່ບັນຊີ: <span class="text-red">* </span></label>

                  <div class="input-group input-group-merge ">
                      <div class="input-group-prepend">
                          <span class="input-group-text"><i class="fa fa-id-card"></i></span></div>
                          <input type="text" class="form-control" v-model="AccName"  >
                    </div>

                </div>
                <div class="form-group col-md-5">
                      <label class="form-control-label">ໝວດບັນຊີ: <span class="text-red">* </span></label>

                  <div class="input-group input-group-merge ">
                      <div class="input-group-prepend">
                          <span class="input-group-text"><i class="fa fa-id-card"></i></span></div>
                          <select class="form-control" v-model="AccCate" @change="RenderSub($event)" >
                              <option value=""> == ເລືອກ == </option>
                      <option v-for="accat in AccCat" :key="accat.id" :value="accat.id" > {{accat.acc_cat_name}}</option>

                    </select>
                    </div>

                </div>
                <div class="form-group col-md-4">
                      <label class="form-control-label">ໝວດບັນຊີຍ່ອຍ: <span class="text-red">* </span></label>

                  <div class="input-group input-group-merge ">
                      <div class="input-group-prepend">
                          <span class="input-group-text"><i class="fa fa-id-card"></i></span></div>
                          <select class="form-control" v-model="AccSube" >
                      <option value=""> == ເລືອກ == </option>
                      <option v-for="accs in listSub" :key="accs.id" :value="accs.id" > {{accs.acc_cat_sub_name}}</option>
                    </select>
                    </div>

                </div>
                <div class="form-group col-md-3">
                      <label class="form-control-label">ເພີ່ມຂື້ນ: <span class="text-red">* </span></label>

                  <div class="input-group input-group-merge ">
                      <div class="input-group-prepend">
                          <span class="input-group-text"><i class="fa fa-id-card"></i></span></div>
                          <select class="form-control" v-model="AccType" >
                      <option value="">= ເລືອກ =</option>
                      <option value="dr">ໜີ້</option>
                      <option value="cr">ມີ</option>
                    </select>
                    </div>

                </div>

              </div>
              </div>
          </form>
          <div  v-if="!FAcc">
          <div class="px-2 pb-2 row">
            <div class="col-md-4">
                <div class="input-group input-group-merge mb-2">
                      <div class="input-group-prepend">
                          <span class="input-group-text"><i class="fa fa-id-card"></i></span></div>
                          <select class="form-control" v-model="AccCat_select" @change="ReloadSe($event)" >
                              <option value="all"> ທັງໝົດ </option>
                      <option v-for="accat in AccCat" :key="accat.id" :value="accat.id" > {{accat.acc_cat_name}}</option>

                    </select>
                    </div>
            </div>
            <div class="col-md-8">
                <div class="form-group" style="margin-bottom: 0">
                  <div class="input-group input-group-merge">
                      <div class="input-group input-group-merge">
                    <input
                      class="form-control"
                      type="text"
                      placeholder="ຄົ້ນຫາຂໍ້ມູນ..."
                      v-model="searcAcc"
                      v-on:keyup="searchAccUP($event)"
                    />
                    <div class="input-group-append">
                      <span class="input-group-text"
                        ><i class="fas fa-search"></i
                      ></span>
                    </div>
                  </div>
                </div>
          </div>
            </div>

          </div>
          <!-- Light table -->
          <div class="table-responsive">
            <table class="table align-items-center table-flush">
              <thead class="thead-light">
                <tr>
                 <!-- <th width="30">ID</th> -->
                  <th class="text-center" width="80">ເລກບັນຊີ</th>
                  <th class="text-left table-user-info" >ຊື່ບັນຊີ</th>
                  <th class="text-left">ໝວດບັນຊີ</th>
                  <th class="text-center">ໝວດບັນຊີຍ່ອຍ</th>
                  <th class="text-center">ເພີ່ມຂື້ນ</th>
                  <th width="80" class="text-right" v-if="$store.getters['getroles'].includes('acc_access_ph_edit') || $store.getters['getroles'].includes('acc_access_ph_remove')">ຈັດການ</th>
                </tr>
              </thead>
              <tbody>
                <tr v-if="loadinAcc">
                    <td colspan="6" class="text-center">
                      <content-loader viewBox="-10 10 450 110" >
                            <rect x="0" y="0" rx="3" ry="3" width="350" height="5" />
                            <rect x="10" y="20" rx="3" ry="3" width="320" height="5" />
                            <rect x="0" y="40" rx="3" ry="3" width="370" height="5" />
                            <rect x="10" y="60" rx="3" ry="3" width="350" height="5" />
                            <rect x="0" y="80" rx="3" ry="3" width="300" height="5" />
                            <rect x="10" y="100" rx="3" ry="3" width="380" height="5" />
                      </content-loader>
                    </td>
                  </tr>
                  <tr v-if="AllAcc.length<1">
                    <td colspan="6" class="text-center">
                      ບໍ່ມີຂໍ້ມູນ
                    </td>
                  </tr>
                    <tr v-for="acc in AllAcc.data" :key="acc.id">
                      <td>{{acc.acc_id}}</td>
                      <td>{{acc.acc_name}}</td>
                      <td>{{acc.acc_cat_name}}</td>
                      <td>{{acc.acc_cat_sub_name}}</td>
                      <td class="text-center" v-if="acc.acc_type == 'dr'">ໜີ້</td>
                      <td class="text-center" v-if="acc.acc_type == 'cr'">ມີ</td>

                      <td v-if="$store.getters['getroles'].includes('acc_access_ph_edit') || $store.getters['getroles'].includes('acc_access_ph_remove')"><div class="col-auto">
                    <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 v-if="$store.getters['getroles'].includes('acc_access_ph_edit')" class="dropdown-item" href="javascript:void(0)" @click="editAcc($event,acc.id)" ><i class="fas fa-user-edit text-info"></i >ແກ້ໄຂຂໍ້ມູນ</a >
                      <a v-if="$store.getters['getroles'].includes('acc_access_ph_remove')" class="dropdown-item" href="javascript:void(0)" @click="delAcc($event,acc.id)" ><i class="fas fa-trash text-red"></i>ລຶບຂໍ້ມູນ</a >
                    </div></div></td>
                  </tr>
              </tbody>
            </table>

            <vuePagination
              :pagination="AllAcc"
              @paginate="GetAllAcc()"
              :offset="4"
            ></vuePagination>

          </div>
          </div>
        </div>
      </div>
    <div class="col-md-6 col-lg-4 p-0">

       <div class="col-md-12">
        <div class="card">
          <!-- Card header -->
          <div class="card-header border-0">
            <div class="row d-flex justify-content-between px-2">
              <div >
                <h3 class="mb-0">ໝວດບັນຊີ</h3>
              </div>
              <div v-if="$store.getters['getroles'].includes('acc_access_ph_add')" >
                <a href="javascript:void(0)" @click="SaveAccCat" v-if="FAccat" :class="addAcat" class="btn btn-sm btn-success btn-round btn-icon"><i class="fas fa-save"></i> ບັນທຶກ </a>
                <a href="javascript:void(0)" @click="BtnCancelAcat" v-if="FAccat" class="btn btn-sm btn-danger btn-round btn-icon"><i class="fas fa-trash"></i > ຍົກເລີກ </a>
                <a href="javascript:void(0)" @click="BtnAddAcat" v-if="!FAccat" class="btn btn-sm btn-info btn-round btn-icon"><i class="fas fa-plus"></i > ເພີ່ມໃໝ່ </a>
              </div>
            </div>
          </div>
          <!-- Light table -->

          <div class="table-responsive">
              <div class="form-cat px-4" v-if="FAccat">
                  <div class="form-group"><label class="form-control-label">ຊື່ໝວດບັນຊີ: <span class="text-red">* </span></label>
                  <form @submit.prevent="SaveAccCat">
                  <div class="input-group input-group-merge">
                      <div class="input-group-prepend">
                          <span class="input-group-text"><i class="fa fa-id-card"></i></span></div>
                          <input type="text" class="form-control" v-model="AccCatName"  ref="acc_cat_name">
                    </div>
                  </form>
                </div>
              </div>
            <table class="table align-items-center table-flush table-hover" v-if="!FAccat">
              <thead class="thead-light">
                <tr>
                  <!-- <th width="30" class="text-center">ID</th> -->
                  <th class="text-left table-user-info" >ຊື່ໝວດບັນຊີ</th>
                  <th width="80" class="text-center" v-if="$store.getters['getroles'].includes('acc_access_ph_edit') || $store.getters['getroles'].includes('acc_access_ph_remove')">ຈັດການ</th>
                </tr>
              </thead>
              <tbody>
                <tr v-if="loadinAccat">
                    <td colspan="2" class="text-center">
                      <content-loader viewBox="-10 10 450 110" >
                            <rect x="0" y="0" rx="3" ry="3" width="350" height="5" />
                            <rect x="10" y="20" rx="3" ry="3" width="320" height="5" />
                            <rect x="0" y="40" rx="3" ry="3" width="370" height="5" />
                            <rect x="10" y="60" rx="3" ry="3" width="350" height="5" />
                            <rect x="0" y="80" rx="3" ry="3" width="300" height="5" />
                            <rect x="10" y="100" rx="3" ry="3" width="380" height="5" />
                      </content-loader>
                    </td>
                  </tr>
            <tr v-if="AccCat.length<1">
                    <td colspan="2" class="text-center">
                      ບໍ່ມີີຂໍ້ມູນ
                    </td>
                  </tr>
                  <tr v-for="accat in AccCat" :key="accat.id" @click="selectAccCat($event,accat.id)">
                      <td>{{accat.acc_cat_name}}</td>
                      <td v-if="$store.getters['getroles'].includes('acc_access_ph_edit') || $store.getters['getroles'].includes('acc_access_ph_remove')"><div class="col-auto">
                    <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 v-if="$store.getters['getroles'].includes('acc_access_ph_edit')" class="dropdown-item" href="javascript:void(0)" @click="editAccCat($event,accat.id)" ><i class="fas fa-user-edit text-info"></i >ແກ້ໄຂຂໍ້ມູນ</a >
                      <a v-if="$store.getters['getroles'].includes('acc_access_ph_remove')" class="dropdown-item" href="javascript:void(0)" @click="delAccCat($event,accat.id)" ><i class="fas fa-trash text-red"></i>ລຶບຂໍ້ມູນ</a >
                    </div></div></td>
                  </tr>
              </tbody>
            </table>


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

      <div class="col-md-12" v-if="SelectSubCat && $store.getters['getroles'].includes('acc_access_ph_edit') && $store.getters['getroles'].includes('acc_access_ph_remove')">
        <div class="card">
          <!-- Card header -->
          <div class="card-header border-0">
            <div class="row d-flex justify-content-between px-2">
              <div >
                <h3 class="mb-0">ໝວດບັນຊີຍ່ອຍ</h3>
              </div>
              <div >
                   <a href="javascript:void(0)" @click="SaveAccSub" v-if="FAccSub" :class="addAsub" class="btn btn-sm btn-success btn-round btn-icon"><i class="fas fa-save"></i> ບັນທຶກ </a>
                <a href="javascript:void(0)" @click="BtnCancelASub" v-if="FAccSub" class="btn btn-sm btn-danger btn-round btn-icon"><i class="fas fa-trash"></i > ຍົກເລີກ </a>
                <a href="javascript:void(0)" @click="BtnAddASub" v-if="!FAccSub" class="btn btn-sm btn-info btn-round btn-icon"><i class="fas fa-plus"></i > ເພີ່ມໃໝ່ </a>
              </div>
            </div>
          </div>

          <!-- Light table -->
          <div class="table-responsive">
              <div class="p-2"><b>ໝວດບັນຊີ: {{TextAcc}}</b></div>
              <div class="form-cat px-4" v-if="FAccSub">
                  <div class="form-group"><label class="form-control-label">ຊື່ໝວດບັນຊີຍ່ອຍ: <span class="text-red">* </span></label>
                  <form @submit.prevent="SaveAccSub">
                  <div class="input-group input-group-merge">
                      <div class="input-group-prepend">
                          <span class="input-group-text"><i class="fa fa-id-card"></i></span></div>
                          <input type="text" class="form-control" v-model="AccSubName"  ref="acc_sub_name">
                    </div>
                  </form>
                </div>
              </div>


            <table class="table align-items-center table-flush" v-if="!FAccSub">
              <thead class="thead-light">
                <tr>
                 <!-- <th width="30">ID</th> -->
                  <th class="text-left table-user-info" >ຊື່ໝວດບັນຊີຍ່ອຍ</th>
                  <th width="80" class="text-right">ຈັດການ</th>
                </tr>
              </thead>
              <tbody>
                <tr v-if="loadinAccS">
                    <td colspan="2" class="text-center">
                      <content-loader viewBox="-10 10 450 110" >
                            <rect x="0" y="0" rx="3" ry="3" width="350" height="5" />
                            <rect x="10" y="20" rx="3" ry="3" width="320" height="5" />
                            <rect x="0" y="40" rx="3" ry="3" width="370" height="5" />
                            <rect x="10" y="60" rx="3" ry="3" width="350" height="5" />
                            <rect x="0" y="80" rx="3" ry="3" width="300" height="5" />
                            <rect x="10" y="100" rx="3" ry="3" width="380" height="5" />
                      </content-loader>
                    </td>
                  </tr>
                <tr v-if="AccSub.length<1">
                    <td colspan="2" class="text-center">
                      ບໍ່ມີຂໍ້ມູນ
                    </td>
                  </tr>
                <tr v-for="accsub in AccSub" :key="accsub.id" >
                      <td>{{accsub.acc_cat_sub_name}}</td>
                      <td><div class="col-auto">
                    <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="editAccSub($event,accsub.id)" ><i class="fas fa-user-edit text-info"></i >ແກ້ໄຂຂໍ້ມູນ</a >
                      <a class="dropdown-item" href="javascript:void(0)" @click="delAccSub($event,accsub.id)" ><i class="fas fa-trash text-red"></i>ລຶບຂໍ້ມູນ</a >
                    </div></div></td>
                  </tr>
              </tbody>
            </table>
          </div>
        </div>
      </div>
    </div>
    </div>
  </section>
  </div>
</template>

<script>
export default {
    name: 'acc',

    components: {  },

    directives: { },

    data() {
        return {
            polling: null,
            AllAcc:[],
            AccCat:[],
            AccSub:[],
            searcAcc:'',
            //cat
            FAccat:false,
            FAccatType:true,
            AccCatName:null,
            AccCatId:'',
            loadinAcc:false,
            loadinAccat:false,
            loadinAccS:false,
            daBtAcccat:true,
            SelectSubCat:null,
            //sub
            FAccSub:false,
            FAccSubType:true,
            AccSubName:null,
            daBtAccsub:true,
            AccSubId:'',
            TextAcc:'',
            /// Acc
            FAcc:false,
            FAccType:true,
            AccUpId:'',
            AccID:'',
            AccName:'',
            AccCate:'',
            AccSube:'',
            AccType:'',
            daBtAcc:true,
            listSub:[],
            AccCat_select:'all',
            isLoggedIn: false,
        };
    },

    mounted() {

    },
    computed:{
        addAcat(){
            if(this.AccCatName == '' || this.AccCatName == null){
                return 'disabled'
            } else {
                    if(this.daBtAcccat){
                        return ''
                    } else { return 'disabled' }
                 }
        },
        addAsub(){
            if(this.AccSubName == '' || this.AccSubName == null){
                return 'disabled'
            } else {
                    if(this.daBtAccsub){
                        return ''
                    } else { return 'disabled' }
                 }
        },
        addAcc(){
            if(this.AccName == '' || this.AccName == null || this.AccCate == '' || this.AccCate == null || this.AccSube == '' || this.AccSube == null || this.AccType == '' || this.AccType == null){
                return 'disabled'
            } else {
                    if(this.daBtAcc){
                        return ''
                    } else { return 'disabled' }
                 }
        }
    },
    methods: {
        GetAllAcc(bpage){
            this.loadinAcc = true
            this.$Progress.start();
             if (typeof bpage == "undefined") {
            this.$axios.get("/sanctum/csrf-cookie").then((response) => {
              axios
                .get(`/api/acc?page=${this.AllAcc.current_page}&acct=${this.AccCat_select}`)
                .then((response) => {
                  this.loadinAcc = false
                  if(response.data.message){
                    this.$Progress.fail();
                      this.$notify({ group: "error", title: "ບໍ່ສຳເລັດ!", text: 'ຜິດຜາດ: '+response.data.message }, 4000)
                  } else {

                      if (response.data.data.length < 1) {
                        const bp = this.AllAcc.current_page - 1;
                        if (bp >= 1) {
                          this.GetAllAcc(bp);
                        } else {
                          this.AllAcc = response.data;
                        }
                      } else {

                        this.AllAcc = response.data;
                        this.$Progress.finish();
                      }
                    }
                })
                .catch((error) => {
                  this.$notify({ group: "error", title: "ບໍ່ສຳເລັດ!", text: 'ຜິດຜາດ: '+error.message }, 4000)
                  this.AllAcc = '';
               //console.error(error);
                  this.$Progress.fail();

                });
            });
          } else {
            this.$axios.get("/sanctum/csrf-cookie").then((response) => {
              axios
                .get(`/api/acc?page=${bpage}&acct=${this.AccCat_select}`)
                .then((response) => {
                  if(response.data.message){
                    this.$Progress.fail();
                      this.$notify({ group: "error", title: "ບໍ່ສຳເລັດ!", text: 'ຜິດຜາດ: '+response.data.message }, 4000)
                  } else {

                  this.AlllAcc = response.data;
                  this.$Progress.finish();
                  }
                })
                .catch((error) => {
                  this.$notify({ group: "error", title: "ບໍ່ສຳເລັດ!", text: 'ຜິດຜາດ: '+error.message }, 4000)
                  //console.error(error);
                  this.$Progress.fail();
                });
            });
          }
        },
        GetAccCat(){
            this.loadinAccat = true
            this.$Progress.start();
            this.$axios.get("/sanctum/csrf-cookie").then((response) => {
              axios.get(`/api/acc_category`).then((response) => {
                  this.loadinAccat = false
                  if(response.data.message){
                    this.$Progress.fail();
                      this.$notify({ group: "error", title: "ບໍ່ສຳເລັດ!", text: 'ຜິດຜາດ: '+response.data.message }, 4000)
                  } else {
                  this.AccCat = response.data;
                  this.$Progress.finish();
                  }
                 // console.log(response.data)
                })
                .catch((error) => {
                  this.$notify({ group: "error", title: "ບໍ່ສຳເລັດ!", text: 'ຜິດຜາດ: '+error.message }, 4000)
                 // console.error(error);
                  this.$Progress.fail();
                });
            });
        },
        GetAccSub(id){
            this.loadinAccS = true
            this.$Progress.start();
            this.$axios.get("/sanctum/csrf-cookie").then((response) => {
              axios.get(`/api/acc_sub?id=${id}`).then((response) => {
                  this.loadinAccS = false
                  if(response.data.message){
                    this.$Progress.fail();
                      this.$notify({ group: "error", title: "ບໍ່ສຳເລັດ!", text: 'ຜິດຜາດ: '+response.data.message }, 4000)
                  } else {
                  this.AccSub = response.data;
                  this.$Progress.finish();
                  }
                 // console.log(response.data)
                })
                .catch((error) => {
                  this.$notify({ group: "error", title: "ບໍ່ສຳເລັດ!", text: 'ຜິດຜາດ: '+error.message }, 4000)
                  //console.error(error);
                  this.$Progress.fail();
                });
            });

        },
        searchAccUP(e){
            if(!this.searcAcc){
                this.doSearch()
           }
         if (e.which == 13) {
            this.doSearch()
            }
        },
        doSearch(){
        this.loadinAcc = true
                this.$axios.get("/sanctum/csrf-cookie").then((response) => {
                    axios.get(`/api/acc?page=1&s=${this.searcAcc}&acct=${this.AccCat_select}`)
                        .then((response) => {
                                this.AllAcc = response.data;
                                this.$Progress.finish()
                                this.loadinAcc = false
                        })
                        .catch((error) => {
                          this.$notify({ group: "error", title: "ບໍ່ສຳເລັດ!", text: 'ຜິດຜາດ: '+error.message }, 4000)
                          //  console.error(error)
                            this.$Progress.fail()
                        })
                    })
        },
        RenderSub(e,idd){
            if(idd == null || idd == ''){
            var id = e.target.value;
            } else { var id = idd }
            this.$Progress.start();
            this.$axios.get("/sanctum/csrf-cookie").then((response) => {
              axios.get(`/api/acc_sub?id=${id}`).then((response) => {
                 // this.loadinAccS = false
                  this.listSub = response.data;
                  this.$Progress.finish();
                 // console.log(response.data)
                })
                .catch((error) => {
                  this.$notify({ group: "error", title: "ບໍ່ສຳເລັດ!", text: 'ຜິດຜາດ: '+error.message }, 4000)
                  //console.error(error);
                  this.$Progress.fail();
                });
            });
        },
        ///Acc Cat
        BtnAddAcat(){
            this.FAccat = true
            this.polling = setInterval(() => {
            this.$refs.acc_cat_name.focus();
            clearInterval(this.polling);
            }, 900);
            this.SelectSubCat = null
            this.daBtAcccat = true
        },
        BtnCancelAcat(){
            this.FAccatType = true
            this.FAccat = false
            this.AccCatName = null
        },
        editAccCat(e,id){

            this.AccCatId = id
            this.FAccatType = false
            this.FAccat = true
            var item = this.AccCat.find(i => i.id === id);
            this.AccCatName = item.acc_cat_name
            this.polling = setInterval(() => {
            this.$refs.acc_cat_name.focus();
            this.SelectSubCat = null
            clearInterval(this.polling);
            }, 900);

        },

        delAccCat(e,id){
            //console.log(id)
             this.$swal.fire({
            title: 'ທ່ານແນ່ໃຈບໍ່?',
            text: "ທີ່ຈະລຶບຂໍ້ມູນນີ້!",
            icon: 'warning',
            showCancelButton: true,
            confirmButtonColor: '#3085d6',
            cancelButtonColor: '#d33',
            confirmButtonText: 'ລຶບເລີຍ!',
            cancelButtonText: 'ຍົກເລີກ'
            }).then((result) => {
            if (result.isConfirmed) {

                this.$Progress.start()
                this.$axios.get('/sanctum/csrf-cookie').then(response => {
                    this.$axios.delete(`/api/acc_category/delete/${id}`)
                        .then(response => {
                             this.GetAccCat()
                            if (response.data.success) {
                              this.$Progress.finish()
                              this.$notify({ group: "sucess", title: "ສຳເລັດ!", text: response.data.message }, 2000)
                           
                            } else {
                              this.$notify({ group: "error", title: "ບໍ່ສຳເລັດ!", text: 'ຜິດຜາດ: '+response.data.message }, 4000)
                              this.$Progress.fail()
                            }
                        })
                        .catch( (error)=> {
                          this.$notify({ group: "error", title: "ບໍ່ສຳເລັດ!", text: 'ຜິດຜາດ: '+error.message }, 4000)
                           // console.error(error)
                            this.$Progress.fail()
                        });
                })
            }
            })
        },
        SaveAccCat(){

            if(this.AccCatName != '' && this.AccCatName != null){
                this.daBtAcccat = false
                 this.$Progress.start();
                 if(this.FAccatType){
                    this.$axios.get("/sanctum/csrf-cookie").then((response) => {
                        this.$axios
                        .post(`/api/acc_category/add`, {
                            acc_cat_name: this.AccCatName
                        })
                        .then((response) => {
                            this.daBtAcccat = true
                            if (response.data.success) {
                            this.FAccatType = true
                            this.FAccat = false
                            this.AccCatName = null
                            this.$Progress.finish()
                            this.GetAccCat()
                            this.$notify({ group: "sucess", title: "ສຳເລັດ!", text: response.data.message }, 2000)
                            } else {
                              this.$Progress.fail();
                              this.$notify({ group: "error", title: "ບໍ່ສຳເລັດ!", text: 'ຜິດຜາດ: '+response.data.message }, 4000)
                            }
                        }) 
                        .catch( (error)=> {
                          this.$notify({ group: "error", title: "ບໍ່ສຳເລັດ!", text: 'ຜິດຜາດ: '+error.message }, 4000)
                           // console.error(error);
                           this.daBtAcccat = true
                            this.$Progress.fail();
                        });
                    });
                 } else { /// update
                    this.$axios.get("/sanctum/csrf-cookie").then((response) => {
                        axios.post(`/api/acc_category/update/${this.AccCatId}`,{
                           acc_cat_name: this.AccCatName
                        })
                        .then((response) => {
                            this.daBtAcccat = true
                            if (response.data.success) {
                                this.$Progress.finish()
                                this.AccCatId = ''
                                this.FAccatType = true
                                this.FAccat = false
                                this.AccCatName = null
                                this.GetAccCat()
                              this.$notify({ group: "sucess", title: "ສຳເລັດ!", text: response.data.message }, 2000)
                            } else {
                            this.$notify({ group: "error", title: "ບໍ່ສຳເລັດ!", text: 'ຜິດຜາດ: '+response.data.message }, 4000)
                            this.$Progress.fail();
                            this.daBtAcccat = true
                            }
                        })
                        .catch((error)=> {
                          this.$notify({ group: "error", title: "ບໍ່ສຳເລັດ!", text: 'ຜິດຜາດ: '+error.message }, 4000)
                            //console.error(error);
                        });
                    });
                 }
            }
        },
        ///CatSub

        BtnAddASub(){
            this.FAccSub = true
            this.polling = setInterval(() => {
            this.$refs.acc_sub_name.focus();
            clearInterval(this.polling);
            }, 900);
            //this.SelectSubCat = null
            this.daBtAccsub = true
        },
        BtnCancelASub(){
            this.FAccSubType = true
            this.FAccSub = false
            this.AccSubName = null
        },
        editAccSub(e,id){

            this.AccSubId = id
            this.FAccSubType = false
            this.FAccSub = true
            var item = this.AccSub.find(i => i.id === id);
            this.AccSubName = item.acc_cat_sub_name
            this.polling = setInterval(() => {
            this.$refs.acc_sub_name.focus();
            //this.SelectSubCat = null
            clearInterval(this.polling);
            }, 900);

        },
        delAccSub(e,id){
            //console.log(id)
             this.$swal.fire({
            title: 'ທ່ານແນ່ໃຈບໍ່?',
            text: "ທີ່ຈະລຶບຂໍ້ມູນນີ້!",
            icon: 'warning',
            showCancelButton: true,
            confirmButtonColor: '#3085d6',
            cancelButtonColor: '#d33',
            confirmButtonText: 'ລຶບເລີຍ!',
            cancelButtonText: 'ຍົກເລີກ'
            }).then((result) => {
            if (result.isConfirmed) {

                this.$Progress.start()
                this.$axios.get('/sanctum/csrf-cookie').then(response => {
                    this.$axios.delete(`/api/acc_sub/delete/${id}`)
                        .then(response => {
                             
                            if (response.data.success) {
                              this.GetAccSub(this.SelectSubCat)
                              this.$Progress.finish()
                              this.$notify({ group: "sucess", title: "ສຳເລັດ!", text: response.data.message }, 2000)
                             
                            } else {
                             this.$notify({ group: "error", title: "ບໍ່ສຳເລັດ!", text: 'ຜິດຜາດ: '+response.data.message }, 4000)
                              this.$Progress.fail()
                            }
                        })
                        .catch( (error)=> {
                          this.$notify({ group: "error", title: "ບໍ່ສຳເລັດ!", text: 'ຜິດຜາດ: '+error.message }, 4000)
                            //console.error(error)
                            this.$Progress.fail()
                        });
                })
            }
            })
        },
        SaveAccSub(){
            if(this.AccSubName != '' && this.AccSubName != null){
                this.daBtAccsub = false
                 this.$Progress.start();
                 if(this.FAccSubType){
                    this.$axios.get("/sanctum/csrf-cookie").then((response) => {
                        this.$axios
                        .post(`/api/acc_sub/add`, {
                            acc_cat_id: this.SelectSubCat,
                            acc_cat_sub_name: this.AccSubName
                        })
                        .then((response) => {
                             this.daBtAccsub = true
                            if (response.data.success) {
                            this.FAccSubType = true
                           
                            this.FAccSub = false
                            this.AccSubName = null
                            this.$Progress.finish()
                            this.GetAccSub(this.SelectSubCat)
                            this.$notify({ group: "sucess", title: "ສຳເລັດ!", text: response.data.message }, 2000)
                            } else {
                              this.$Progress.fail();
                              this.$notify({ group: "error", title: "ບໍ່ສຳເລັດ!", text: 'ຜິດຜາດ: '+response.data.message }, 4000)
                            }
                        })
                        .catch( (error)=> {
                          this.$notify({ group: "error", title: "ບໍ່ສຳເລັດ!", text: 'ຜິດຜາດ: '+error.message }, 4000)
                            //console.error(error);
                            this.$Progress.fail();
                            this.daBtAccsub = true
                        });
                    });
                 } else { /// update
                    this.$axios.get("/sanctum/csrf-cookie").then((response) => {
                        axios.post(`/api/acc_sub/update/${this.AccSubId}`,{
                           acc_cat_id: this.SelectSubCat,
                           acc_cat_sub_name: this.AccSubName
                        })
                        .then((response) => {
                             this.daBtAccsub = true
                            if (response.data.success) {
                                this.$Progress.finish()
                                this.AccSubId = ''
                                this.FAccSubType = true
                               
                                this.FAccSub = false
                                this.AccSubName = null
                                this.GetAccSub(this.SelectSubCat)
                                this.$notify({ group: "sucess", title: "ສຳເລັດ!", text: response.data.message }, 2000)
                            } else {
                            this.$notify({ group: "error", title: "ບໍ່ສຳເລັດ!", text: 'ຜິດຜາດ: '+response.data.message }, 4000)
                            this.$Progress.fail();
                            this.daBtAccsub = true
                            }
                        })
                        .catch((error)=> {
                          this.$notify({ group: "error", title: "ບໍ່ສຳເລັດ!", text: 'ຜິດຜາດ: '+error.message }, 4000)
                            //onsole.error(error);
                        });
                    });
                 }
            }
        },
        // Acc
        BtnAddAcc(){
            this.FAcc = true
            this.polling = setInterval(() => {
            this.$refs.acc_id.focus();
            clearInterval(this.polling);
            }, 900);
            this.daBtAcc = true
        },
        BtnCancelAcc(){
            this.FAccType = true
            this.FAcc = false
            this.AccID = ''
            this.AccName = ''
            this.AccCate = ''
            this.AccSube = ''
            this.AccType=''
        },
         editAcc(e,id){

            this.AccUpId = id
            this.FAccType = false
            this.FAcc = true
            var item = this.AllAcc.data.find(i => i.id === id);
            //this.AccCatName = item.acc_cat_name
            this.AccID = item.acc_id
            this.AccName = item.acc_name
            this.AccCate = item.acc_cat_id
            this.RenderSub(e,item.acc_cat_id)
            this.AccSube = item.acc_cat_sub_id
            this.AccType= item.acc_type
            this.polling = setInterval(() => {
            this.$refs.acc_id.focus();
            clearInterval(this.polling);
            }, 900);

        },
        SaveAcc(){
                //console.log('save')
                this.daBtAcc = false
                 this.$Progress.start();
                 if(this.FAccType){
                    this.$axios.get("/sanctum/csrf-cookie").then((response) => {
                        this.$axios
                        .post(`/api/acc/add`, {
                            acc_id: this.AccID,
                            acc_name: this.AccName,
                            acc_cat_id: this.AccCate,
                            acc_cat_sub_id: this.AccSube,
                            acc_type: this.AccType
                        })
                        .then((response) => {
                          this.daBtAcc = true
                            if (response.data.success) {
                            this.FAccType = true
                            this.FAcc = false
                            this.AccID = ''
                            this.AccName = ''
                            this.AccCate = ''
                            this.AccSube = ''
                            this.AccType=''
                            this.GetAllAcc()
                            this.$Progress.finish()
                            this.$notify({ group: "sucess", title: "ສຳເລັດ!", text: " ຂໍ້ມູນໄດ້ຖຶກບັນທຶກແລ້ວ! " }, 2000)
                            } else {
                              this.$notify({ group: "error", title: "ບໍ່ສຳເລັດ!", text: 'ຜິດຜາດ: '+response.data.message }, 4000)
                              this.$Progress.fail();
                            }
                        })
                        .catch( (error)=> {
                          this.$notify({ group: "error", title: "ບໍ່ສຳເລັດ!", text: 'ຜິດຜາດ: '+error.message }, 4000)
                            this.$Progress.fail();
                            this.daBtAcc = true
                        });
                    });
                 } else { /// update
                    this.$axios.get("/sanctum/csrf-cookie").then((response) => {
                        axios.post(`/api/acc/update/${this.AccUpId}`,{
                            acc_id: this.AccID,
                            acc_name: this.AccName,
                            acc_cat_id: this.AccCate,
                            acc_cat_sub_id: this.AccSube,
                            acc_type: this.AccType
                        })
                        .then((response) => {
                            this.daBtAcc = true
                            if (response.data.success) {
                                 this.AccUpId = ''
                                this.FAccType = true

                                this.FAcc = false
                                this.AccID = ''
                                this.AccName = ''
                                this.AccCate = ''
                                this.AccSube = ''
                                this.AccType=''
                                this.GetAllAcc()
                                this.$Progress.finish()
                                this.$notify({ group: "sucess", title: "ສຳເລັດ!", text: response.data.message }, 2000)
                            } else {
                             this.$notify({ group: "error", title: "ບໍ່ສຳເລັດ!", text: 'ຜິດຜາດ: '+response.data.message }, 4000)
                            this.$Progress.fail();
                            this.daBtAcc = true
                            }
                        })
                        .catch( (error)=> {
                          this.$notify({ group: "error", title: "ບໍ່ສຳເລັດ!", text: 'ຜິດຜາດ: '+error.message }, 4000)
                            //console.error(error);
                            this.$Progress.fail();
                            this.daBtAcc = true
                        });
                    });
                 }
        },

        delAcc(e,id){
            //console.log(id)
             this.$swal.fire({
            title: 'ທ່ານແນ່ໃຈບໍ່?',
            text: "ທີ່ຈະລຶບຂໍ້ມູນນີ້!",
            icon: 'warning',
            showCancelButton: true,
            confirmButtonColor: '#3085d6',
            cancelButtonColor: '#d33',
            confirmButtonText: 'ລຶບເລີຍ!',
            cancelButtonText: 'ຍົກເລີກ'
            }).then((result) => {
            if (result.isConfirmed) {

                this.$Progress.start()
                this.$axios.get('/sanctum/csrf-cookie').then(response => {
                    this.$axios.delete(`/api/acc/delete/${id}`)
                        .then(response => {

                            if (response.data.success) {
                              this.$Progress.finish()
                              this.$notify({ group: "sucess", title: "ສຳເລັດ!", text: " ຂໍ້ມູນໄດ້ຖຶກລຶບແລ້ວ! " }, 2000)
                            this.GetAllAcc()
                            } else {
                              this.$notify({ group: "error", title: "ບໍ່ສຳເລັດ!", text: 'ຜິດຜາດ: '+response.data.message }, 4000)
                              this.$Progress.fail()
                            }
                        })
                        .catch( (error)=> {
                          this.$notify({ group: "error", title: "ບໍ່ສຳເລັດ!", text: 'ຜິດຜາດ: '+error.message }, 4000)
                            this.$Progress.fail()
                        });
                })
            }
            })
        },
        selectAccCat(e,id){
            ///console.log(id)
            if(id!=this.SelectSubCat){
                this.SelectSubCat = id
                this.GetAccSub(id)
            }
            this.FAccSub = false
            var item = this.AccCat.find(i => i.id === id);
            this.TextAcc = item.acc_cat_name
        },
        ReloadSe(e){
            this.AccCat_select = e.target.value;
            this.GetAllAcc()
        },
    },
    created() {
    this.$axios.get(`/api/users/checkauth`).then((response) => {
      if (!response.data.isLogin) {
        window.location.href = "/";
      }
    })

    if(window.Laravel.isLoggedin){
           this.isLoggedIn = true
        }

    this.GetAllAcc()
    this.GetAccCat()
  },
    beforeRouteEnter(to, from, next) {
        if (!window.Laravel.isLoggedin) {
            window.location.href = "/";
        }
        next();
    }
};
</script>

<style lang="scss" scoped>

</style>