Initial import

apps/api/system/menu-bkp.js

@@ -0,0 +1,39 @@
+const URL = window.BASE_URL + "/one-api/mockup/system/";
+
+export async function get_bread_crumb(token) {
+   try {
+      var resp = await axios.post(URL + 'menu/get_bread_crumb', {token:token,
+      xref:window.location.href});
+      if (resp.status != 200) {
+         return {
+            status: "ERR",
+            message: resp.statusText
+         };
+      }
+      let data = resp.data;
+      return data;
+   } catch(e) {
+      return {
+         status: "ERR",
+         message: e.message
+      };
+   }
+}
+export async function get_menu(token) {
+   try {
+      var resp = await axios.post(URL + 'menu/get_menu', {token:token});
+      if (resp.status != 200) {
+         return {
+            status: "ERR",
+            message: resp.statusText
+         };
+      }
+      let data = resp.data;
+      return data;
+   } catch(e) {
+      return {
+         status: "ERR",
+         message: e.message
+      };
+   }
+}

apps/api/system/menu.js

@@ -0,0 +1,65 @@
+const URL = window.BASE_URL + "/one-api/mockup/system/";
+
+export async function change_password(prm) {
+   try {
+      var resp = await axios.post(URL + 'menu/change_password', prm);
+      if (resp.status != 200) {
+         return {
+            status: "ERR",
+            message: resp.statusText
+         };
+      }
+      let data = resp.data;
+      return data;
+   } catch(e) {
+      return {
+         status: "ERR",
+         message: e.message
+      };
+   }
+}
+
+export async function get_bread_crumb(token) {
+   try {
+      var resp = await axios.post(URL + 'menu/get_bread_crumb', {token:token,
+      xref:window.location.href});
+      if (resp.status != 200) {
+         return {
+            status: "ERR",
+            message: resp.statusText
+         };
+      }
+      let data = resp.data;
+      return data;
+   } catch(e) {
+      return {
+         status: "ERR",
+         message: e.message
+      };
+   }
+}
+export async function get_menu(token) {
+   try {
+      let currentLocation = window.location.pathname;
+      var resp = await axios.post(URL + 'menu/get_menu', {token:token, path:currentLocation});
+      if (resp.status != 200) {
+         return {
+            status: "ERR",
+            message: resp.statusText
+         };
+      }
+      let data = resp.data;
+      if(data.status == "ERRMENU"){
+         window.location.replace("/"+data.menu)
+         console.log("dasdasd")
+      }
+      else
+      return data;
+      
+   } catch(e) {
+      return {
+         status: "ERR",
+         message: e.message
+      };
+   }
+}

apps/components/oneAutoVerifValid.vue

@@ -0,0 +1,106 @@
+<template>
+  <div class="auto-verif-valid">
+    <img :src="verifImg"  class="icon"  :style="styleVerif" @click="showVerif()" />
+    <img :src="validImg" class="icon" :style="styleValid" @click="showValid()" />
+  </div>
+</template>
+<script>
+module.exports = {
+  components : {
+  },
+  data () {
+    return {
+      dialog_autovrvf:false,
+      title:'',
+      isLoading: false
+    }
+  },
+  methods : {
+    showValid() {
+      this.$store.dispatch("autoVerifValid/showValid",{title: "Informasi AutoValid", detailID: this.detailId}); 
+    },
+    showVerif() {
+      this.$store.dispatch("autoVerifValid/showVerif",{title: "Informasi AutoVerif", detailID: this.detailId}); 
+    }
+  },
+  computed: {
+    styleVerif() {
+      let av = this.$store.state.autoVerifValid.autoVerif;
+      let detId = this.detailId;
+      let idx = _.findIndex(av,function(v) { 
+        let xid = parseInt(v.id);
+        return xid == detId;
+      });
+      if (idx > -1) {
+        return {
+          cursor: 'pointer'
+        };
+      }
+      return {};
+    },
+    styleValid() {
+      let av = this.$store.state.autoVerifValid.autoValid;
+      let detId = this.detailId;
+      let idx = _.findIndex(av,function(v) { 
+        let xid = parseInt(v.id);
+        return xid == detId;
+      });
+      if (idx > -1) {
+        return {
+          cursor: 'pointer'
+        };
+      }
+      return {};
+    },
+    verifImg() {
+      let av = this.$store.state.autoVerifValid.autoVerif;
+      let detId = this.detailId;
+      let idx = _.findIndex(av,function(v) { 
+        let xid = parseInt(v.id);
+        return xid == detId;
+      });
+      if (idx > -1) {
+        if (av[idx].status) {
+          return "/one-ui/apps/image/vr-green.png";
+        } else {
+          return "/one-ui/apps/image/vr-red.png";
+        }
+      } else {
+        return "/one-ui/apps/image/vr-grey.png";
+      }
+    },
+    validImg() {
+      let av = this.$store.state.autoVerifValid.autoValid;
+      let detId = this.detailId;
+      let idx = _.findIndex(av,function(v) { 
+        let xid = parseInt(v.id);
+        return xid == detId;
+      });
+      if (idx > -1) {
+        if (av[idx].status) {
+          return "/one-ui/apps/image/vl-green.png";
+        } else {
+          return "/one-ui/apps/image/vl-red.png";
+        }
+      } else {
+        return "/one-ui/apps/image/vl-grey.png";
+      }
+    },
+  },
+  props:["headerId","detailId"],
+}
+</script>
+<style scoped>
+  div.auto-verif-valid  {
+    padding: 0px 5px;
+    padding-top: 4px;
+    border-radius: 5px;
+    border: solid 1px #383838;
+    max-width: 70px;
+  }
+  div.auto-verif-valid  img.icon {
+    width:22px;
+    height:22px;
+    margin-right:5px;
+  }
+</style>

apps/components/oneChangePassword.vue

@@ -0,0 +1,95 @@
+<template>
+      <v-dialog v-model="showdialog" persistent  max-width="400">
+        <v-card>
+            <v-card-title style="color:#fff" class="headline grey darken-1">Ganti Password</v-card-title>
+            <v-card-text>
+               <v-layout pa-2 class="grey lighten-2" row>
+               <v-flex xs12>
+                   <v-text-field :append-icon="show_saat_ini ? 'mdi-eye' : 'mdi-eye-off'"
+                     :type="show_saat_ini ? 'text' : 'password'"
+                     label="Password saat ini :"
+                     v-model="current_password"
+                     class="input-group--focused"
+                     @click:append="show_saat_ini = !show_saat_ini"
+                     ></v-text-field>
+
+                   <v-text-field :append-icon="show_new ? 'mdi-eye' : 'mdi-eye-off'"
+                     :type="show_new ? 'text' : 'password'"
+                     label="Password baru :"
+                     v-model="new_password"
+                     class="input-group--focused"
+                     @click:append="show_new= !show_new"
+                     ></v-text-field>
+                   <v-text-field :append-icon="show_re_new ? 'mdi-eye' : 'mdi-eye-off'"
+                     :type="show_re_new ? 'text' : 'password'"
+                     label="Konfirmasi Password baru :"
+                     v-model="re_new_password"
+                     class="input-group--focused"
+                     @click:append="show_re_new= !show_re_new"
+                     ></v-text-field>
+                  <v-alert v-show="message != ''" :type="type">
+                     {{message}}
+                  </v-alert>
+               </v-flex>
+               </v-layout>
+
+            </v-card-text>
+            <v-card-actions>
+            <v-spacer></v-spacer>
+            <v-btn color="grey darken-1" flat @click="showdialog = false">Tutup</v-btn>
+            <v-btn dark color="grey darken-1"  @click="update_password()">Ganti Password</v-btn>
+            
+            </v-card-actions>
+        </v-card>
+      </v-dialog>
+</template>
+<style scoped>
+</style>
+<script>
+
+module.exports = {
+   data() {
+      return {
+         current_password : ''
+         ,new_password : ''
+         ,re_new_password : ''
+         ,show_saat_ini : false
+         ,show_new: false
+         ,show_re_new: false
+         ,type : 'error'
+      }
+   }
+   ,methods : {
+      async update_password() {
+         if (this.current_password == this.new_password) {
+            this.message = "Password lama dan Password baru masih sama."      
+            return
+         }
+         if (this.re_new_password != this.new_password) {
+            this.message = "Password dan Konfirmasi Password tidak sama."      
+            return
+         }
+         let prm = { token: window.one_token(), old : this.current_password ,new : this.new_password } 
+         await this.$store.dispatch("system/change_password",prm)
+         if (this.message == "" ) {
+            this.type = "success"
+            this.message = "Password berhasil diubah, silahkan login lagi."
+            let self = this
+            setTimeout(function() {
+               window.one_logout('/one-ui/test/vuex/one-login')
+            },1000)
+         }
+      }
+   }
+   ,computed: {
+      message : {
+         get(){ return this.$store.state.system.change_password_error }
+         ,set(v) { this.$store.commit("system/update_change_password_error",v) }
+      }
+      ,showdialog : {
+         get(){ return this.$store.state.system.change_password_dialog }
+         ,set(v) { this.$store.commit("system/update_change_password_dialog",v) }
+      }
+   }
+}
+</script>

apps/components/oneFooter.vue

@@ -0,0 +1,99 @@
+<template>
+  <v-footer color="blue lighten-2" app>
+    <one-clock class="hidden-sm-and-down"></one-clock>
+    <v-spacer></v-spacer>
+    <span class="one-footer white--text">
+      <code class="mb-0">Auto logged out in <span>{{ secondsUntilExpire }}</span> seconds</code>
+    </span>
+  </v-footer>
+</template>
+
+<style>
+span.one-footer {
+  margin-right: 30px;
+}
+</style>
+
+<script>
+module.exports = {
+  data() {
+    return {
+      IDLE_TIMEOUT: 5 * 60, // Waktu idle dalam detik
+      autologoutCounter: 0, // Counter idle dalam localStorage
+      _idleSecondsTimer: null,
+    };
+  },
+
+  computed: {
+    secondsUntilExpire() {
+      return this.IDLE_TIMEOUT - this.autologoutCounter;
+    }
+  },
+
+  mounted() {
+    // Mengambil waktu logout yang disesuaikan jika tersedia
+    if (localStorage.getItem("user")) {
+      var retrievedObject = localStorage.getItem("user");
+      var dtuser = JSON.parse(retrievedObject);
+      if (dtuser.time_autologout && parseInt(dtuser.time_autologout) > 0) {
+        this.IDLE_TIMEOUT = parseInt(dtuser.time_autologout) * 60;
+      }
+    }
+
+    // Inisialisasi autologout di localStorage jika belum ada
+    if (localStorage.getItem("autologout") === null) {
+      localStorage.setItem("autologout", 0);
+    }
+    localStorage.removeItem("logoutTriggered");
+
+    // Event listeners untuk reset idle timer saat ada aktivitas pengguna
+    document.onclick = this.resetIdleTimer;
+    document.onmousemove = this.resetIdleTimer;
+    document.onkeypress = this.resetIdleTimer;
+
+    // Mulai interval untuk memeriksa idle time dan update counter
+    this._idleSecondsTimer = setInterval(this.checkIdleTime, 1000);
+
+    // Event listener untuk perubahan `localStorage` guna sinkronkan logout antar tab
+    window.addEventListener("storage", this.handleStorageChange);
+  },
+
+  methods: {
+    resetIdleTimer() {
+      localStorage.setItem("autologout", 0);
+      this.autologoutCounter = 0; // Reset counter di data reaktif
+    },
+
+    checkIdleTime() {
+      let xcounter = parseInt(localStorage.getItem("autologout"));
+      xcounter++;
+      localStorage.setItem("autologout", xcounter);
+      this.autologoutCounter = xcounter; // Update counter di data reaktif
+
+      // Jika waktu idle telah habis, logout semua tab
+      if (xcounter >= this.IDLE_TIMEOUT) {
+        clearInterval(this._idleSecondsTimer);
+        localStorage.setItem("logoutTriggered", true); // Set trigger logout
+        localStorage.removeItem("autologout"); // Hapus autologout
+        window.one_logout('/one-ui/test/vuex/one-login-v2') // Arahkan ke login
+      }
+    },
+
+    handleStorageChange(event) {
+      if (event.key === "logoutTriggered" && event.newValue === "true") {
+        // Redirect semua tab ke halaman login jika logoutTriggered berubah
+        window.one_logout('/one-ui/test/vuex/one-login-v2')
+      }
+    }
+  },
+
+  beforeDestroy() {
+    clearInterval(this._idleSecondsTimer);
+    window.removeEventListener("storage", this.handleStorageChange);
+  },
+
+  components: {
+    'one-clock': httpVueLoader('./oneTanggal.vue')
+  }
+}
+</script>

apps/components/oneFooter.vue--17724

@@ -0,0 +1,107 @@
+<template>
+   <v-footer color="blue lighten-2" app>
+       <one-clock class="hidden-sm-and-down"></one-clock>
+       <v-spacer></v-spacer>
+       <span class="one-footer white--text"><code class="mb-0">Auto logged out in <span id="SecondsUntilExpire"></span> seconds</code></span>
+
+    </v-footer>
+</template>
+
+<style>
+  span.one-footer {
+     margin-right:30px;
+  }
+</style>
+<script>
+module.exports = {
+  mounted() {
+    var IDLE_TIMEOUT = 5*60; //seconds
+    if(localStorage.getItem("user")){
+            var retrievedObject = localStorage.getItem('user')
+            var dtuser = JSON.parse(retrievedObject)
+            if(dtuser.time_autologout && parseInt(dtuser.time_autologout) > 0)
+            IDLE_TIMEOUT = parseInt(dtuser.time_autologout) * 60
+          }
+          var _idleSecondsTimer = null;
+          if (localStorage.getItem("autologout") === null) {
+            localStorage.setItem("autologout", 0)
+          }
+   
+
+
+document.onclick = function() {
+  localStorage.setItem("autologout", 0)
+};
+
+document.onmousemove = function() {
+  localStorage.setItem("autologout", 0)
+};
+
+document.onkeypress = function() {
+  localStorage.setItem("autologout", 0)
+};
+
+_idleSecondsTimer = window.setInterval(CheckIdleTime, 1000);
+
+function CheckIdleTime() {
+      let xcounter  = parseInt(localStorage.getItem("autologout"))
+      xcounter++
+      localStorage.setItem("autologout", xcounter)
+     //this.show_autologout = false
+
+     var oPanel = document.getElementById("SecondsUntilExpire");
+     if (oPanel)
+         oPanel.innerHTML = (IDLE_TIMEOUT - parseInt(localStorage.getItem("autologout"))) + "";
+    if (parseInt(localStorage.getItem("autologout")) >= IDLE_TIMEOUT) {
+        window.clearInterval(_idleSecondsTimer);
+        localStorage.removeItem("autologout");
+        window.one_logout('/one-ui/test/vuex/one-login')
+    }
+}
+   },
+   components: {
+    'one-clock' : httpVueLoader('./oneTanggal.vue')
+  }
+}
+function one_verif() {
+  let url_redir = "/one-ui/";
+  let verif = async function (token) {
+    try {
+      var resp = await axios.post("/one-api/v1/system/verify/do", {
+        token: token,
+      });
+      if (resp.status != 200) {
+        return {
+          status: "ERR",
+          message: resp.statusText,
+        };
+      }
+      let data = resp.data;
+      return data;
+    } catch (e) {
+      return {
+        status: "ERR",
+        message: e.message,
+      };
+    }
+  };
+
+  let x = async () => {
+    let url_redir = "/one-ui/";
+    try {
+      let resp = await verif(window.one_token());
+      console.log('Response',resp);
+      return;
+
+      if (resp.status != "OK") {
+        window.localStorage.removeItem("token");
+        window.localStorage.removeItem("user");
+        location.replace(url_redir);
+      }
+    } catch (e) {}
+  };
+  x();
+}
+
+//one_verif();
+</script>

apps/components/oneFooter.vue--311024

@@ -0,0 +1,65 @@
+<template>
+   <v-footer color="blue lighten-2" app>
+       <one-clock class="hidden-sm-and-down"></one-clock>
+       <v-spacer></v-spacer>
+       <!--<span class="one-footer white--text"><code class="mb-0">Auto logged out in <span id="SecondsUntilExpire"></span> seconds</code></span>-->
+
+    </v-footer>
+</template>
+
+<style>
+  span.one-footer {
+     margin-right:30px;
+  }
+</style>
+<script>
+module.exports = {
+  mounted() {
+    
+   },
+   components: {
+    'one-clock' : httpVueLoader('./oneTanggal.vue')
+  }
+}
+function one_verif() {
+  let url_redir = "/one-ui/";
+  let verif = async function (token) {
+    try {
+      var resp = await axios.post("/one-api/v1/system/verify/do", {
+        token: token,
+      });
+      if (resp.status != 200) {
+        return {
+          status: "ERR",
+          message: resp.statusText,
+        };
+      }
+      let data = resp.data;
+      return data;
+    } catch (e) {
+      return {
+        status: "ERR",
+        message: e.message,
+      };
+    }
+  };
+
+  let x = async () => {
+    let url_redir = "/one-ui/";
+    try {
+      let resp = await verif(window.one_token());
+      console.log('Response',resp);
+      return;
+
+      if (resp.status != "OK") {
+        window.localStorage.removeItem("token");
+        window.localStorage.removeItem("user");
+        location.replace(url_redir);
+      }
+    } catch (e) {}
+  };
+  x();
+}
+
+//one_verif();
+</script>

apps/components/oneFooter.vue-170123

@@ -0,0 +1,100 @@
+<template>
+   <v-footer color="blue lighten-2" app>
+       <one-clock></one-clock>
+       <v-spacer></v-spacer>
+       <span class="one-footer white--text"><code class="mb-0">Auto logged out in <span id="SecondsUntilExpire"></span> seconds</code></span>
+
+    </v-footer>
+</template>
+
+<style>
+  span.one-footer {
+     margin-right:30px;
+  }
+</style>
+<script>
+module.exports = {
+  mounted() {
+    var IDLE_TIMEOUT = 5*60; //seconds
+    if(localStorage.getItem("user")){
+            var retrievedObject = localStorage.getItem('user')
+            var dtuser = JSON.parse(retrievedObject)
+            if(dtuser.time_autologout && parseInt(dtuser.time_autologout) > 0)
+            IDLE_TIMEOUT = parseInt(dtuser.time_autologout) * 60
+          }
+var _idleSecondsTimer = null;
+var _idleSecondsCounter = 0;
+
+document.onclick = function() {
+    _idleSecondsCounter = 0;
+};
+
+document.onmousemove = function() {
+    _idleSecondsCounter = 0;
+};
+
+document.onkeypress = function() {
+    _idleSecondsCounter = 0;
+};
+
+_idleSecondsTimer = window.setInterval(CheckIdleTime, 1000);
+
+function CheckIdleTime() {
+     _idleSecondsCounter++;
+     //this.show_autologout = false
+
+     var oPanel = document.getElementById("SecondsUntilExpire");
+     if (oPanel)
+         oPanel.innerHTML = (IDLE_TIMEOUT - _idleSecondsCounter) + "";
+    if (_idleSecondsCounter >= IDLE_TIMEOUT) {
+        window.clearInterval(_idleSecondsTimer);
+        window.one_logout('/one-ui/test/vuex/one-login')
+    }
+}
+   },
+   components: {
+    'one-clock' : httpVueLoader('./oneTanggal.vue')
+  }
+}
+function one_verif() {
+  let url_redir = "/one-ui/";
+  let verif = async function (token) {
+    try {
+      var resp = await axios.post("/one-api/v1/system/verify/do", {
+        token: token,
+      });
+      if (resp.status != 200) {
+        return {
+          status: "ERR",
+          message: resp.statusText,
+        };
+      }
+      let data = resp.data;
+      return data;
+    } catch (e) {
+      return {
+        status: "ERR",
+        message: e.message,
+      };
+    }
+  };
+
+  let x = async () => {
+    let url_redir = "/one-ui/";
+    try {
+      let resp = await verif(window.one_token());
+      console.log('Response',resp);
+      return;
+
+      if (resp.status != "OK") {
+        window.localStorage.removeItem("token");
+        window.localStorage.removeItem("user");
+        location.replace(url_redir);
+      }
+    } catch (e) {}
+  };
+  x();
+}
+
+//one_verif();
+</script>

apps/components/oneFooterlogin.vue

@@ -0,0 +1,35 @@
+<template>
+<v-footer color="blue lighten-2" app>
+
+       <span class="one-footer white--text" >
+       SURABAYA -
+       JAKARTA -
+       BANDUNG -
+       CIMAHI -
+       CIREBON -
+       MEDAN -
+       PADANG -
+       PALEMBANG -
+       SEMARANG -
+       YOGYAKARTA -
+       MADIUN -
+       BALIKPAPAN -
+       PEKANBARU -
+       MAGELANG -
+       MAKASSAR -
+       TEGAL -
+       SALATIGA -
+       MANADO</span>
+    </v-footer>
+</template>
+
+<style>
+  span.one-footer {
+  text-align: center;
+   font-size: 12px;
+  }
+</style>
+<script>
+module.exports = {
+}
+</script>

apps/components/oneFpp.vue

@@ -0,0 +1,76 @@
+<template>
+  <div>
+  <v-btn
+    color="primary"
+    :disabled="is_disabled"
+    @click="viewfpp= true"
+  >
+ {{button_title}}
+  </v-btn>
+
+  <one-dialog-print :title="printtitle" :width="printwidth" :height="550" :status="viewfpp" :urlprint="urlfpp" @close-dialog-print="viewfpp = false">
+  </one-dialog-print>
+  </div>
+</template>
+
+<script>
+
+async function checkFpp(param, id) {
+  try {
+      var resp = await axios.get("/one-api/file_upload/get_fpp/" + id);
+      if (resp.status != 200) {
+        param.button_title = "Error Checking Fpp : " + resp.statusText;
+        return;
+      }
+      let data = resp.data;
+      if (data.rows.length > 0) {
+        param.button_title = "Lihat FPP";
+        param.is_disabled = false;
+        param.urlfpp = data.rows[0].fppUrl;
+        return;
+      }
+      param.button_title = "FPP belum di upload";
+  } catch(e) {
+      param.button_title = "Error Checking Fpp : " + e.message;
+  }
+}
+
+module.exports = {
+  components : {
+    'one-dialog-print':httpVueLoader('../../common/oneDialogPrintX.vue')
+  },
+  props: ["id"],
+  data () {
+    return {
+      urlfpp:'',
+      printtitle:'View FPP',
+      printwidth:'60%',
+      isLoading:false,
+      viewfpp: false,
+      button_title: "Checking FPP",
+      is_disabled:true
+    }
+  },
+  mounted() {
+     console.log('Mounted',this.id);
+    let self = this;
+    let n = parseInt(this.id.orderHeaderID.toString());
+    if (n == 0) return;
+    self.urlfpp = '';
+    self.is_disabled = true;
+    self.button_title = "Checking FPP"
+    checkFpp(self,n);
+  },
+  watch: {
+    async id(n,o) {
+      console.log('Watch FPP ID', n );
+      let self = this;
+      if (n == 0) return;
+      self.urlfpp = '';
+      self.is_disabled = true;
+      self.button_title = "Checking FPP"
+      checkFpp(self,n.orderHeaderID);
+    }
+  }
+}
+</script>

apps/components/oneMenuDrawer-bkp.vue

@@ -0,0 +1,212 @@
+<template>
+  <v-navigation-drawer v-model="drawer" fixed app>
+    <v-list>
+      <!-- IF NO CHILD -->
+      <template
+        v-for="(lev_0, i) in level_0"
+      >
+        <v-list-tile
+          :key="i"
+          v-show="!level_1['p_'+lev_0.id] && lev_0.is_parent=='N'"
+          @click="goTo(lev_0.url)">
+          <v-list-tile-action>
+            <v-icon>home</v-icon>
+          </v-list-tile-action>
+          <v-list-tile-title>{{ lev_0.name }}</v-list-tile-title>
+        </v-list-tile>
+
+      </template>
+      
+
+      <!-- HAVING CHILDREN -->
+      <template
+        v-for="(lev_0, i) in level_0"
+      >
+        <v-list-group
+          v-bind:key="i"
+          prepend-icon="account_circle"
+          :value="lev_0.state"
+          v-show="level_1['p_'+lev_0.id]"
+        >
+          <template v-slot:activator>
+            <v-list-tile>
+              <v-list-tile-title>{{ lev_0.name }}</v-list-tile-title>
+            </v-list-tile>
+          </template>
+
+          <!-- LEVEL 1 STARTS HERE -->
+          <!-- NOT HAVING CHILD -->
+          <template
+            v-for="(lev_1, j) in level_1['p_'+lev_0.id]"
+          >
+              <v-list-tile
+                v-bind:key="j"
+                v-show="!level_2['p_'+lev_1.id] && lev_1.is_parent=='N'"
+                sub-group
+                no-action
+                @click="goTo(lev_1.url)"
+                >
+                <v-list-tile-action>
+                  <!-- <v-icon>home</v-icon> -->
+                </v-list-tile-action>
+                <v-list-tile-title>{{ lev_1.name }}</v-list-tile-title>
+              </v-list-tile>
+          </template>
+
+          <!-- HAVING CHILD -->
+          <template
+            v-for="(lev_1, j) in level_1['p_'+lev_0.id]"
+          >
+            
+              <v-list-group
+                v-bind:key="j"
+                :value="lev_1.state"
+                v-show="level_2['p_'+lev_1.id]"
+                sub-group
+                no-action
+              >
+                <template v-slot:activator>
+                  <v-list-tile>
+                    <v-list-tile-title>{{ lev_1.name }}</v-list-tile-title>
+                  </v-list-tile>
+                </template>
+
+                <!-- LEVEL 2 STARTS HERE -->
+                <template
+                  v-for="(lev_2, k) in level_2['p_'+lev_1.id]"
+                >
+                  <v-list-tile
+                    :key="k"
+                    @click="goTo(lev_2.url)">
+                    <!-- <v-list-tile-action>
+                      <v-icon>home</v-icon>
+                    </v-list-tile-action> -->
+                    <v-list-tile-title>{{ lev_2.name }}</v-list-tile-title>
+                  </v-list-tile>
+
+                </template>
+                <!-- END OF LEVEL 2 -->
+
+              </v-list-group>
+          </template>
+          <!-- END OF LEVEL 1 -->
+
+        </v-list-group>
+      </template>
+    </v-list>
+
+    <!-- <v-list>
+      <v-list-tile>
+        <v-list-tile-action>
+          <v-icon>home</v-icon>
+        </v-list-tile-action>
+        <v-list-tile-title>Home</v-list-tile-title>
+      </v-list-tile>
+
+      <v-list-group
+        prepend-icon="account_circle"
+        value="true"
+      >
+        <template v-slot:activator>
+          <v-list-tile>
+            <v-list-tile-title>Users</v-list-tile-title>
+          </v-list-tile>
+        </template>
+        <v-list-group
+          no-action
+          sub-group
+          value="true"
+        >
+          <template v-slot:activator>
+            <v-list-tile>
+              <v-list-tile-title>Admin</v-list-tile-title>
+            </v-list-tile>
+          </template>
+
+          <v-list-tile
+            v-for="(admin, i) in admins"
+            :key="i"
+            @click=""
+          >
+            <v-list-tile-title v-text="admin[0]"></v-list-tile-title>
+            <v-list-tile-action>
+              <v-icon v-text="admin[1]"></v-icon>
+            </v-list-tile-action>
+          </v-list-tile>
+        </v-list-group>
+
+        <v-list-group
+          sub-group
+          no-action
+        >
+          <template v-slot:activator>
+            <v-list-tile>
+              <v-list-tile-title>Actions</v-list-tile-title>
+            </v-list-tile>
+          </template>
+          <v-list-tile
+            v-for="(crud, i) in cruds"
+            :key="i"
+            @click=""
+          >
+            <v-list-tile-title v-text="crud[0]"></v-list-tile-title>
+            <v-list-tile-action>
+              <v-icon v-text="crud[1]"></v-icon>
+            </v-list-tile-action>
+          </v-list-tile>
+        </v-list-group>
+      </v-list-group>
+    </v-list> -->
+    <!-- <v-list dense>
+      <v-list-tile>
+        <v-list-tile-action>
+          <v-icon>home</v-icon>
+        </v-list-tile-action>
+        <v-list-tile-content>
+          <v-list-tile-title>Home</v-list-tile-title>
+        </v-list-tile-content>
+      </v-list-tile>
+      <v-list-tile>
+        <v-list-tile-action>
+          <v-icon>contact_mail</v-icon>
+        </v-list-tile-action>
+        <v-list-tile-content>
+          <v-list-tile-title>Contact</v-list-tile-title>
+        </v-list-tile-content>
+      </v-list-tile>
+    </v-list> -->
+  </v-navigation-drawer>
+</template>
+
+
+<script>
+module.exports = {
+  props: {
+    drawer: Boolean
+  },
+
+  computed : {
+    level_0 () {
+      return this.$store.state.system.menu_level_0
+    },
+
+    level_1 () {
+      return this.$store.state.system.menu_level_1
+    },
+
+    level_2 () {
+      return this.$store.state.system.menu_level_2
+    }
+  },
+
+  mounted () {
+    this.$store.dispatch('system/get_menu')
+  },
+
+  methods : {
+    goTo (url) {
+      window.location = BASE_URL + '/one-ui/' + url
+    }
+  }
+}
+</script>

apps/components/oneMenuDrawer.vue

@@ -0,0 +1,154 @@
+<template>
+  <v-navigation-drawer  temporary class="blue lighten-2" v-model="xdrawer" dark  fixed app>
+    <v-list>
+
+    <!-- LEVEL 0 -->
+      <template
+        v-for="(lev_0, i) in level_0"
+      >
+        <v-list-tile class="tile"
+          :key="lev_0.id + 10000"
+          v-if="!level_1['p_'+lev_0.id] && lev_0.is_parent=='N'"
+          @click="goTo(lev_0.url)">
+          <v-list-tile-action>
+            <v-icon>{{ lev_0.icon }}</v-icon>
+          </v-list-tile-action>
+          <v-list-tile-title>{{ lev_0.name }}</v-list-tile-title>
+        </v-list-tile>
+
+        <v-list-group
+          :key="lev_0.id"
+          :prepend-icon="lev_0.icon"
+          :value="lev_0.state"
+          v-if="level_1['p_'+lev_0.id]"
+        >
+          <template v-slot:activator>
+            <v-list-tile class="tile">
+              <v-list-tile-title>{{ lev_0.name }}</v-list-tile-title>
+            </v-list-tile>
+          </template>
+
+            <!-- LEVEL 1 -->
+            <template
+                v-for="(lev_1, j) in level_1['p_'+lev_0.id]"
+            >
+                <v-list-tile class="tile"
+                    :key="lev_1.id + 10000"
+                    v-if="!level_2['p_'+lev_1.id] && lev_1.is_parent=='N'"
+                    sub-group
+                    no-action
+                    @click="goTo(lev_1.url)"
+                    >
+                    <v-list-tile-action>
+                    <!-- <v-icon>home</v-icon> -->
+                    </v-list-tile-action>
+                    <v-list-tile-title>{{ lev_1.name }}</v-list-tile-title>
+                </v-list-tile>
+
+                <v-list-group
+                    :key="lev_1.id"
+                    :value="lev_1.state"
+                    v-show="level_2['p_'+lev_1.id]"
+                    sub-group
+                    no-action
+                >
+                    <template v-slot:activator>
+                        <v-list-tile>
+                            <v-list-tile-title>{{ lev_1.name }}</v-list-tile-title>
+                        </v-list-tile>
+                    </template>
+
+                    <!-- LEVEL 2 -->
+                    <template
+                        v-for="(lev_2, k) in level_2['p_'+lev_1.id]"
+                        >
+                        <v-list-tile class="tile"
+                            :key="lev_2.id"
+                            @click="goTo(lev_2.url)">
+                            <!-- <v-list-tile-action>
+                            <v-icon>home</v-icon>
+                            </v-list-tile-action> -->
+                            <v-list-tile-title>{{ lev_2.name }}</v-list-tile-title>
+                        </v-list-tile>
+
+                    </template>
+                </v-list-group>
+
+            </template>
+
+        </v-list-group>
+
+      </template>
+    </v-list>
+  </v-navigation-drawer>
+</template>
+
+<style scoped>
+   .tile {
+    margin: 5px;
+    border-radius: 4px;
+  }
+  .tile:hover {
+    background-color: #1E88E5;
+  }
+  .tile:active {
+    background: #bec5b7;
+  }
+  .v-list__group__header__prepend-icon .v-icon {
+    color: white;
+}
+.v-list__tile__title:hover {
+    color: #BBDEFB;
+}
+
+.v-navigation-drawer {
+    z-index: 1003;
+}
+
+
+</style>
+
+<style>
+.v-overlay--active {
+    z-index: 1002;
+}
+</style>
+<script>
+module.exports = {
+  props: {
+    drawer: Boolean
+  },
+
+  computed : {
+    xdrawer: {
+       get() {
+          return this.drawer
+       },
+       set(v) {
+          this.$emit("togleDrawer")
+       }
+    },
+    level_0 () {
+      return this.$store.state.system.menu_level_0
+    },
+
+    level_1 () {
+      return this.$store.state.system.menu_level_1
+    },
+
+    level_2 () {
+      return this.$store.state.system.menu_level_2
+    }
+  },
+
+  mounted () {
+    this.$store.dispatch('system/get_menu')
+  },
+
+  methods : {
+    goTo (url) {
+      window.location = BASE_URL + '/one-ui/' + url
+    }
+  }
+}
+</script>

apps/components/oneMenuDrawer2.vue

@@ -0,0 +1,134 @@
+<template>
+  <v-navigation-drawer  temporary class="blue lighten-2" v-model="drawer" dark  fixed app>
+    <v-list>
+
+    <!-- LEVEL 0 -->
+      <template
+        v-for="(lev_0, i) in level_0"
+      >
+        <v-list-tile class="tile"
+          :key="i"
+          v-if="!level_1['p_'+lev_0.id] && lev_0.is_parent=='N'"
+          @click="goTo(lev_0.url)">
+          <v-list-tile-action>
+            <v-icon>home</v-icon>
+          </v-list-tile-action>
+          <v-list-tile-title>{{ lev_0.name }}</v-list-tile-title>
+        </v-list-tile>
+
+        <v-list-group
+          v-bind:key="i"
+          :prepend-icon="lev_0.icon"
+          :value="lev_0.state"
+          v-if="level_1['p_'+lev_0.id]"
+        >
+          <template v-slot:activator>
+            <v-list-tile class="tile">
+              <v-list-tile-title>{{ lev_0.name }}</v-list-tile-title>
+            </v-list-tile>
+          </template>
+
+            <!-- LEVEL 1 -->
+            <template
+                v-for="(lev_1, j) in level_1['p_'+lev_0.id]"
+            >
+                <v-list-tile class="tile"
+                    v-bind:key="j"
+                    v-if="!level_2['p_'+lev_1.id] && lev_1.is_parent=='N'"
+                    sub-group
+                    no-action
+                    @click="goTo(lev_1.url)"
+                    >
+                    <v-list-tile-action>
+                    <!-- <v-icon>home</v-icon> -->
+                    </v-list-tile-action>
+                    <v-list-tile-title>{{ lev_1.name }}</v-list-tile-title>
+                </v-list-tile>
+
+                <v-list-group
+                    v-bind:key="j"
+                    :value="lev_1.state"
+                    v-show="level_2['p_'+lev_1.id]"
+                    sub-group
+                    no-action
+                >
+                    <template v-slot:activator>
+                        <v-list-tile>
+                            <v-list-tile-title>{{ lev_1.name }}</v-list-tile-title>
+                        </v-list-tile>
+                    </template>
+
+                    <!-- LEVEL 2 -->
+                    <template
+                        v-for="(lev_2, k) in level_2['p_'+lev_1.id]"
+                        >
+                        <v-list-tile class="tile"
+                            :key="k"
+                            @click="goTo(lev_2.url)">
+                            <!-- <v-list-tile-action>
+                            <v-icon>home</v-icon>
+                            </v-list-tile-action> -->
+                            <v-list-tile-title>{{ lev_2.name }}</v-list-tile-title>
+                        </v-list-tile>
+
+                    </template>
+                </v-list-group>
+
+            </template>
+
+        </v-list-group>
+
+      </template>
+    </v-list>
+  </v-navigation-drawer>
+</template>
+
+<style scoped>
+   .tile {
+    margin: 5px;
+    border-radius: 4px;
+  }
+  .tile:hover {
+    background-color: #1E88E5;
+  }
+  .tile:active {
+    background: #bec5b7;
+  }
+  .v-list__group__header__prepend-icon .v-icon {
+    color: white;
+}
+.v-list__tile__title:hover {
+    color: #BBDEFB;
+}
+</style>
+<script>
+module.exports = {
+  props: {
+    drawer: Boolean
+  },
+
+  computed : {
+    level_0 () {
+      return this.$store.state.system.menu_level_0
+    },
+
+    level_1 () {
+      return this.$store.state.system.menu_level_1
+    },
+
+    level_2 () {
+      return this.$store.state.system.menu_level_2
+    }
+  },
+
+  mounted () {
+    this.$store.dispatch('system/get_menu')
+  },
+
+  methods : {
+    goTo (url) {
+      window.location = BASE_URL + '/one-ui/' + url
+    }
+  }
+}
+</script>

apps/components/oneMenuDrawerGlobal.vue

@@ -0,0 +1,229 @@
+<template>
+  <v-navigation-drawer  temporary class="blue lighten-2" v-model="drawer" dark  fixed app>
+    <v-list>
+      <!-- IF NO CHILD -->
+      <template
+        v-for="(lev_0, i) in level_0"
+      >
+        <v-list-tile  class="tile"
+          :key="i"
+          v-show="!level_1['p_'+lev_0.id]"
+          @click="goTo(lev_0.url)">
+          <v-list-tile-action>
+            <v-icon>home</v-icon>
+          </v-list-tile-action>
+          <v-list-tile-title >{{ lev_0.name }}</v-list-tile-title>
+        </v-list-tile>
+
+      </template>
+
+
+      <!-- HAVING CHILDREN -->
+      <template
+        v-for="(lev_0, i) in level_0"
+      >
+        <v-list-group
+          v-bind:key="i"
+          prepend-icon="account_circle"
+          :value="lev_0.state"
+          v-show="level_1['p_'+lev_0.id]"
+        >
+          <template v-slot:activator>
+            <v-list-tile  class="tile">
+              <v-list-tile-title>{{ lev_0.name }}</v-list-tile-title>
+            </v-list-tile>
+          </template>
+
+          <!-- LEVEL 1 STARTS HERE -->
+          <!-- NOT HAVING CHILD -->
+          <template
+            v-for="(lev_1, j) in level_1['p_'+lev_0.id]"
+          >
+              <v-list-tile  class="tile"
+                v-bind:key="j"
+                v-show="!level_2['p_'+lev_1.id]"
+                sub-group
+                no-action
+                @click="goTo(lev_1.url)"
+                >
+                <v-list-tile-action>
+                  <!-- <v-icon>home</v-icon> -->
+                </v-list-tile-action>
+                <v-list-tile-title>{{ lev_1.name }}</v-list-tile-title>
+              </v-list-tile>
+          </template>
+
+          <!-- HAVING CHILD -->
+          <template
+            v-for="(lev_1, j) in level_1['p_'+lev_0.id]"
+          >
+
+              <v-list-group
+                v-bind:key="j"
+                :value="lev_1.state"
+                v-show="level_2['p_'+lev_1.id]"
+                sub-group
+                no-action
+              >
+                <template v-slot:activator>
+                  <v-list-tile  class="tile">
+                    <v-list-tile-title>{{ lev_1.name }}</v-list-tile-title>
+                  </v-list-tile>
+                </template>
+
+                <!-- LEVEL 2 STARTS HERE -->
+                <template
+                  v-for="(lev_2, k) in level_2['p_'+lev_1.id]"
+                >
+                  <v-list-tile  class="tile"
+                    :key="k"
+                    @click="goTo(lev_2.url)">
+                    <!-- <v-list-tile-action>
+                      <v-icon>home</v-icon>
+                    </v-list-tile-action> -->
+                    <v-list-tile-title>{{ lev_2.name }}</v-list-tile-title>
+                  </v-list-tile>
+
+                </template>
+                <!-- END OF LEVEL 2 -->
+
+              </v-list-group>
+          </template>
+          <!-- END OF LEVEL 1 -->
+
+        </v-list-group>
+      </template>
+    </v-list>
+
+    <!-- <v-list>
+      <v-list-tile  class="tile">
+        <v-list-tile-action>
+          <v-icon>home</v-icon>
+        </v-list-tile-action>
+        <v-list-tile-title>Home</v-list-tile-title>
+      </v-list-tile>
+
+      <v-list-group
+        prepend-icon="account_circle"
+        value="true"
+      >
+        <template v-slot:activator>
+          <v-list-tile  class="tile">
+            <v-list-tile-title>Users</v-list-tile-title>
+          </v-list-tile>
+        </template>
+        <v-list-group
+          no-action
+          sub-group
+          value="true"
+        >
+          <template v-slot:activator>
+            <v-list-tile  class="tile">
+              <v-list-tile-title>Admin</v-list-tile-title>
+            </v-list-tile>
+          </template>
+
+          <v-list-tile
+            v-for="(admin, i) in admins"
+            :key="i"
+            @click=""
+          >
+            <v-list-tile-title v-text="admin[0]"></v-list-tile-title>
+            <v-list-tile-action>
+              <v-icon v-text="admin[1]"></v-icon>
+            </v-list-tile-action>
+          </v-list-tile>
+        </v-list-group>
+
+        <v-list-group
+          sub-group
+          no-action
+        >
+          <template v-slot:activator>
+            <v-list-tile  class="tile">
+              <v-list-tile-title>Actions</v-list-tile-title>
+            </v-list-tile>
+          </template>
+          <v-list-tile
+            v-for="(crud, i) in cruds"
+            :key="i"
+            @click=""
+          >
+            <v-list-tile-title v-text="crud[0]"></v-list-tile-title>
+            <v-list-tile-action>
+              <v-icon v-text="crud[1]"></v-icon>
+            </v-list-tile-action>
+          </v-list-tile  class="tile">
+        </v-list-group>
+      </v-list-group>
+    </v-list> -->
+    <!-- <v-list dense>
+      <v-list-tile  class="tile">
+        <v-list-tile-action>
+          <v-icon>home</v-icon>
+        </v-list-tile-action>
+        <v-list-tile-content>
+          <v-list-tile-title>Home</v-list-tile-title>
+        </v-list-tile-content>
+      </v-list-tile>
+      <v-list-tile  class="tile">
+        <v-list-tile-action>
+          <v-icon>contact_mail</v-icon>
+        </v-list-tile-action>
+        <v-list-tile-content>
+          <v-list-tile-title>Contact</v-list-tile-title>
+        </v-list-tile-content>
+      </v-list-tile>
+    </v-list> -->
+  </v-navigation-drawer>
+</template>
+
+<style scoped>
+  .tile {
+    margin: 5px;
+    border-radius: 4px;
+  }
+  .tile:hover {
+    background-color: #1E88E5;
+  }
+  .tile:active {
+    background: #bec5b7;
+  }
+  .v-list__group__header__prepend-icon .v-icon {
+    color: #3b60f2;
+}
+.v-list__tile__title:hover {
+    color: #BBDEFB;
+}
+</style>
+<script>
+module.exports = {
+  props: {
+    drawer: Boolean
+  },
+
+  computed : {
+    level_0 () {
+      return this.$store.state.menu.menu_level_0
+    },
+
+    level_1 () {
+      return this.$store.state.menu.menu_level_1
+    },
+
+    level_2 () {
+      return this.$store.state.menu.menu_level_2
+    }
+  },
+
+  mounted () {
+    this.$store.dispatch('menu/get_menu')
+  },
+
+  methods : {
+    goTo (url) {
+      window.location = BASE_URL + '/one-ui/' + url
+    }
+  }
+}
+</script>

apps/components/oneMergeReport.vue

@@ -0,0 +1,67 @@
+<tmplate>
+  <v-dialog v-model="dialog_choose" width="350px">
+      <v-layout row>
+          <v-flex xs12>
+              <v-card>
+                  <v-card-text>
+                    Test Card 
+                  </v-card-text>
+                  <v-card-actions>
+                  <v-spacer></v-spacer>
+                  <v-btn
+                      color="info"
+                      flat
+                      @click="selectReport()"
+                  >
+                  Pilih
+                  </v-btn>
+              </v-card-actions>
+              </v-card>
+          </v-flex>
+      </v-layout>
+  </v-dialog>
+  <v-btn
+      color="info"
+      flat
+      @click="dialog_choose = true"
+  >
+ Gabung Laporan 
+  </v-btn>
+  <one-dialog-print :title="printtitle" :width="printwidth" :height="550" :status="openprint" :urlprint="urlprint" @close-dialog-print="openprint= false">
+  </one-dialog-print>
+</template>
+
+<script>
+module.exports = {
+  components : {
+    'one-dialog-print':httpVueLoader('../../common/oneDialogPrintX.vue'),
+  },
+  data () {
+    return {
+      dialog_choose:false,
+      urlprint:'',
+      printtitle:'Merge Report',
+      printwidth:'60%',
+      isLoading:false,
+      openprint: false,
+      orderHeaderID: 0,
+      selectedReport: [],
+      reports : [ {id:'lab',name:'Hasil Lab'}, {id:'xray',name:'Hasil Rontgent'}, {id:'ecg',name:'Hasil Ecg'} ]
+    }
+  },
+  props:["id"],
+  mounted() {
+    checkReport()//this.$store.dispatch("paymentnew/lookup_type")
+  },
+  methods : {
+    selectReport() {
+      console.log('SelectedReport', selectedReport);
+    }
+  },
+  watch : {
+    async id(n,o) {
+      if (n == 0) return;
+      console.log('Check Report');
+    }
+  } 
+</script>

apps/components/oneNavbarComponent-bkp.vue

@@ -0,0 +1,131 @@
+<template>
+  <span>
+  <one-menu-drawer :drawer="drawer" > </one-menu-drawer>	
+  <one-menu-notification :drawer="drawer_notification" > </one-menu-notification>	
+  <v-toolbar color="blue lighten-2" dark fixed app>
+    <v-toolbar-side-icon @click.stop="drawer = !drawer"></v-toolbar-side-icon>
+    <h1>ONE</h1>
+     <v-spacer></v-spacer>
+
+    <a href="#" style="text-decoration:none;color:#fff;font-size:22px; margin-right:15px">{{ xusername }}</a>
+    <v-badge color="red">
+      <template v-slot:badge>
+        <span>9</span>
+      </template>
+      <v-btn icon @click="drawer_notification = !drawer_notification" flat>
+        
+        <v-icon
+          medium
+          
+        >
+          notifications
+        </v-icon>
+      </v-btn>
+    </v-badge>
+
+    
+
+     <!-- <v-btn class="ml-4" icon>
+      <v-icon>apps</v-icon>
+    </v-btn> -->
+
+    <!-- PROFILE MENU -->
+    <v-menu
+      v-model="menu"
+      :close-on-content-click="true"
+      :nudge-width="200"
+      offset-overflow
+      left
+      bottom
+    >
+      <template v-slot:activator="{ on }">
+        <v-btn
+          class="ml-4" icon
+          v-on="on"
+        >
+          <v-icon>apps</v-icon>
+        </v-btn>
+      </template>
+
+      <v-card>
+        <v-list>
+          <v-list-tile avatar>
+            <v-list-tile-avatar>
+              <img src="https://cdn.vuetifyjs.com/images/john.jpg" alt="John">
+            </v-list-tile-avatar>
+
+            <v-list-tile-content>
+              <v-list-tile-title>{{ xusername }}</v-list-tile-title>
+              <v-list-tile-sub-title>Founder of Vuetify.js</v-list-tile-sub-title>
+            </v-list-tile-content>
+
+            
+          </v-list-tile>
+        </v-list>
+
+        <v-divider></v-divider>
+
+        <v-list>
+          <v-list-tile
+            @click="logout"
+          >
+            <v-list-tile-action>
+              <v-icon>no_meeting_room</v-icon>
+            </v-list-tile-action>
+            <v-list-tile-title>Log Out</v-list-tile-title>
+          </v-list-tile>
+
+          <!-- <v-list-tile>
+            <v-list-tile-action>
+              <v-switch v-model="hints" color="purple"></v-switch>
+            </v-list-tile-action>
+            <v-list-tile-title>Enable hints</v-list-tile-title>
+          </v-list-tile> -->
+        </v-list>
+
+        
+      </v-card>
+    </v-menu>
+    <!-- End of PROFILE MENU -->
+
+  </v-toolbar>
+</template>
+<style scoped>
+.v-badge__badge{
+  top:0px;
+  right:0px;
+}
+</style>
+<script>
+module.exports = {
+  components: {
+    'one-menu-drawer' : httpVueLoader('./oneMenuDrawer.vue'),
+    'one-menu-notification' : httpVueLoader('./oneNotificationDrawer.vue')
+  },
+  data: function() {
+	return {
+    drawer: false,
+    drawer_notification: false	
+    }
+  },
+  computed: {
+      xusername() {
+          var un = ''
+          if(localStorage.getItem("user")){
+            var retrievedObject = localStorage.getItem('user')
+            var dtuser = JSON.parse(retrievedObject)
+            
+            un = dtuser.M_UserUsername
+          }
+          return un
+      }
+  },
+
+  methods : {
+    logout () {
+      window.one_logout('/one-ui/test/vuex/one-login')
+    }
+  }
+}
+</script>
+

apps/components/oneNavbarComponent.vue

@@ -0,0 +1,177 @@
+<template>
+<div>
+  <one-menu-drawer :drawer="drawer" > </one-menu-drawer>	
+  <one-menu-notification :drawer="drawer_notification" > </one-menu-notification>	
+  <v-toolbar color="blue lighten-2" dark fixed app>
+    <v-toolbar-side-icon  @click.stop="togleDrawer()"></v-toolbar-side-icon>
+    <v-layout row  >
+        <v-flex class="pt-2" xs8>
+           <p class="mb-0"><a href="#" style="padding-bottom:0px;margin-bottom:0px;text-decoration:none;color:#fff;font-size:18px; font-weight:bold;">CPONE</a> </p>
+           <p class="hidden-sm-and-down mb-0"><span style="text-decoration:none;color:#fff;font-size:12px;" class="ml-0 mt-0 bread-crumb">{{bread_crumb}}</span></p>
+          
+
+        </v-flex>
+        <v-flex xs4 class="mt-2 text-xs-right align-right">
+
+           
+     
+    
+    <a href="#" class="mt-3 hidden-sm-and-down" style="min-height:10px;text-decoration:none;color:#fff;font-size:22px; margin-right:15px">{{ xusername }}</a>
+    <v-badge color="red">
+  
+  
+</v-badge>
+        </v-flex>
+    </v-layout>
+    
+
+    
+   
+   
+
+
+     <!-- <v-btn class="ml-4" icon>
+      <v-icon>apps</v-icon>
+    </v-btn> -->
+
+    <!-- PROFILE MENU -->
+    <v-menu
+      :close-on-content-click="true"
+      :nudge-width="200"
+      offset-overflow
+      left
+      bottom
+    >
+      <template v-slot:activator="{ on }">
+        <v-btn
+          class="" icon
+          v-on="on"
+        >
+          <v-icon>apps</v-icon>
+        </v-btn>
+      </template>
+
+      <v-card>
+        <v-list>
+          <v-list-tile avatar>
+
+            <v-list-tile-content>
+              <v-list-tile-title>{{ xusername }}</v-list-tile-title>
+              <v-list-tile-sub-title>{{xstaffname}}</v-list-tile-sub-title>
+            </v-list-tile-content>
+            
+          </v-list-tile>
+        </v-list>
+
+        <v-divider></v-divider>
+
+        <v-list>
+          <v-list-tile @click="change_password" >
+             <v-list-tile-action>
+                 <v-icon>security</v-icon>
+             </v-list-tile-action>
+             <v-list-tile-title>Change Password</v-list-tile-title>
+          </v-list-tile>
+
+        </v-list>
+        <v-list>
+          <v-list-tile @click="logout" >
+             <v-list-tile-action>
+                 <v-icon>no_meeting_room</v-icon>
+             </v-list-tile-action>
+             <v-list-tile-title>Log Out</v-list-tile-title>
+          </v-list-tile>
+
+        </v-list>
+
+        
+      </v-card>
+    </v-menu>
+    <!-- End of PROFILE MENU -->
+
+   <one-cp></one-cp> 
+  </v-toolbar>
+  </div>
+
+</template>
+<style scoped>
+.bread-crumb {
+   margin-left:20px;
+   font-weight:normal!important;
+}
+.v-badge__badge{
+  top:0px;
+  right:0px;
+}
+</style>
+<script>
+module.exports = {
+  components: {
+    'one-menu-drawer' : httpVueLoader('./oneMenuDrawer.vue'),
+    'one-cp' : httpVueLoader('./oneChangePassword.vue'),
+    'one-menu-notification' : httpVueLoader('./oneNotificationDrawer.vue')
+  },
+  
+  data: function() {
+    return {
+    drawer: false,
+    drawer_notification: false	
+    }
+  },
+  watch : {
+     is_page_allowed : function(new_ipa, old_ipa) {
+        if(! new_ipa ) {
+           var dashboard = this.$store.state.system.dashboard
+           if (dashboard == "") {
+              //this.logout()
+              console.log('go-to','logout')
+           } else {
+              //window.location.href = '/' + dashboard
+              console.log('go-to dashboard',dashboard)
+           }
+        }
+     }
+  },
+  computed: {
+     is_page_allowed() {
+        return this.$store.state.system.is_page_allowed
+     },
+     bread_crumb() {
+        return this.$store.state.system.bread_crumb
+     },
+     xusername() {
+          var un = ''
+          if(localStorage.getItem("user")){
+            var retrievedObject = localStorage.getItem('user')
+            var dtuser = JSON.parse(retrievedObject)
+            
+            un = dtuser.M_UserUsername
+          }
+          return un
+      },
+     xstaffname() {
+          var un = ''
+          if(localStorage.getItem("user")){
+            var retrievedObject = localStorage.getItem('user')
+            var dtuser = JSON.parse(retrievedObject)
+            
+            un = dtuser.M_StaffName
+          }
+          return un
+      }
+  },
+
+  methods : {
+    togleDrawer() {
+      this.drawer = ! this.drawer 
+    },
+    change_password() {
+       this.$store.commit("system/update_change_password_dialog",true)
+    },
+    logout () {
+      window.one_logout('/home')
+    }
+  }
+}
+</script>
+

apps/components/oneNavbarComponent.vue-010320

@@ -0,0 +1,168 @@
+<template>
+  <span>
+  <one-menu-drawer :drawer="drawer" > </one-menu-drawer>	
+  <one-menu-notification :drawer="drawer_notification" > </one-menu-notification>	
+  <v-toolbar color="blue lighten-2" dark fixed app>
+    <v-toolbar-side-icon @click.stop="togleDrawer()"></v-toolbar-side-icon>
+    <h1>ONE</h1>
+    <h2 class="bread-crumb">{{bread_crumb}}</h2>
+    <v-spacer></v-spacer>
+    <a href="#" style="text-decoration:none;color:#fff;font-size:22px; margin-right:15px">{{ xusername }}</a>
+    <v-badge color="red">
+      <!--
+      <template v-slot:badge>
+        <span>9</span>
+      </template>
+      -->
+      <v-btn icon @click.stop="drawer_notification = !drawer_notification" flat>
+        <v-icon
+          medium
+        >
+          notifications
+        </v-icon>
+      </v-btn>
+    </v-badge>
+
+
+     <!-- <v-btn class="ml-4" icon>
+      <v-icon>apps</v-icon>
+    </v-btn> -->
+
+    <!-- PROFILE MENU -->
+    <v-menu
+      :close-on-content-click="true"
+      :nudge-width="200"
+      offset-overflow
+      left
+      bottom
+    >
+      <template v-slot:activator="{ on }">
+        <v-btn
+          class="ml-4" icon
+          v-on="on"
+        >
+          <v-icon>apps</v-icon>
+        </v-btn>
+      </template>
+
+      <v-card>
+        <v-list>
+          <v-list-tile avatar>
+
+            <v-list-tile-content>
+              <v-list-tile-title>{{ xusername }}</v-list-tile-title>
+              <v-list-tile-sub-title>{{xstaffname}}</v-list-tile-sub-title>
+            </v-list-tile-content>
+            
+          </v-list-tile>
+        </v-list>
+
+        <v-divider></v-divider>
+
+        <v-list>
+          <v-list-tile @click="change_password" >
+             <v-list-tile-action>
+                 <v-icon>security</v-icon>
+             </v-list-tile-action>
+             <v-list-tile-title>Change Password</v-list-tile-title>
+          </v-list-tile>
+
+        </v-list>
+        <v-list>
+          <v-list-tile @click="logout" >
+             <v-list-tile-action>
+                 <v-icon>no_meeting_room</v-icon>
+             </v-list-tile-action>
+             <v-list-tile-title>Log Out</v-list-tile-title>
+          </v-list-tile>
+
+        </v-list>
+
+        
+      </v-card>
+    </v-menu>
+    <!-- End of PROFILE MENU -->
+
+   <one-cp></one-cp> 
+  </v-toolbar>
+</template>
+<style scoped>
+.bread-crumb {
+   margin-left:20px;
+   font-weight:normal!important;
+}
+.v-badge__badge{
+  top:0px;
+  right:0px;
+}
+</style>
+<script>
+module.exports = {
+  components: {
+    'one-menu-drawer' : httpVueLoader('./oneMenuDrawer.vue'),
+    'one-cp' : httpVueLoader('./oneChangePassword.vue'),
+    'one-menu-notification' : httpVueLoader('./oneNotificationDrawer.vue')
+  },
+  data: function() {
+    return {
+    drawer: false,
+    drawer_notification: false	
+    }
+  },
+  watch : {
+     is_page_allowed : function(new_ipa, old_ipa) {
+        if(! new_ipa ) {
+           var dashboard = this.$store.state.system.dashboard
+           if (dashboard == "") {
+              //this.logout()
+              console.log('go-to','logout')
+           } else {
+              //window.location.href = '/' + dashboard
+              console.log('go-to dashboard',dashboard)
+           }
+        }
+     }
+  },
+  computed: {
+     is_page_allowed() {
+        return this.$store.state.system.is_page_allowed
+     },
+     bread_crumb() {
+        return this.$store.state.system.bread_crumb
+     },
+     xusername() {
+          var un = ''
+          if(localStorage.getItem("user")){
+            var retrievedObject = localStorage.getItem('user')
+            var dtuser = JSON.parse(retrievedObject)
+            
+            un = dtuser.M_UserUsername
+          }
+          return un
+      },
+     xstaffname() {
+          var un = ''
+          if(localStorage.getItem("user")){
+            var retrievedObject = localStorage.getItem('user')
+            var dtuser = JSON.parse(retrievedObject)
+            
+            un = dtuser.M_StaffName
+          }
+          return un
+      }
+  },
+
+  methods : {
+    togleDrawer() {
+      this.drawer = ! this.drawer 
+    },
+    change_password() {
+       this.$store.commit("system/update_change_password_dialog",true)
+    },
+    logout () {
+      window.one_logout('/one-ui/test/vuex/one-login')
+    }
+  }
+}
+</script>
+

apps/components/oneNavbarComponent.vue070524

@@ -0,0 +1,182 @@
+<template>
+<div>
+  <one-menu-drawer :drawer="drawer" > </one-menu-drawer>	
+  <one-menu-notification :drawer="drawer_notification" > </one-menu-notification>	
+  <v-toolbar color="blue lighten-2" dark fixed app>
+    <v-toolbar-side-icon class="hidden-sm-and-down" @click.stop="togleDrawer()"></v-toolbar-side-icon>
+    <v-layout row  >
+        <v-flex class="pt-2" xs8>
+           <p class="mb-0"><a href="#" style="padding-bottom:0px;margin-bottom:0px;text-decoration:none;color:#fff;font-size:18px; font-weight:bold;">CPONE</a> </p>
+           <p class="mb-0"><span style="text-decoration:none;color:#fff;font-size:12px;" class="ml-0 mt-0 bread-crumb">{{bread_crumb}}</span></p>
+
+        </v-flex>
+        <v-flex xs4 class="mt-2 text-xs-right align-right">
+
+           
+     
+    
+    <a href="#" class="mt-3" style="min-height:10px;text-decoration:none;color:#fff;font-size:22px; margin-right:15px">{{ xusername }}</a>
+    <v-badge color="red">
+  
+  <v-btn class="pt-0 pb-2" icon @click.stop="drawer_notification = !drawer_notification" flat>
+    <v-icon
+      medium
+    >
+      notifications
+    </v-icon>
+  </v-btn>
+</v-badge>
+        </v-flex>
+    </v-layout>
+    
+
+    
+   
+   
+
+
+     <!-- <v-btn class="ml-4" icon>
+      <v-icon>apps</v-icon>
+    </v-btn> -->
+
+    <!-- PROFILE MENU -->
+    <v-menu
+      :close-on-content-click="true"
+      :nudge-width="200"
+      offset-overflow
+      left
+      bottom
+    >
+      <template v-slot:activator="{ on }">
+        <v-btn
+          class="" icon
+          v-on="on"
+        >
+          <v-icon>apps</v-icon>
+        </v-btn>
+      </template>
+
+      <v-card>
+        <v-list>
+          <v-list-tile avatar>
+
+            <v-list-tile-content>
+              <v-list-tile-title>{{ xusername }}</v-list-tile-title>
+              <v-list-tile-sub-title>{{xstaffname}}</v-list-tile-sub-title>
+            </v-list-tile-content>
+            
+          </v-list-tile>
+        </v-list>
+
+        <v-divider></v-divider>
+
+        <v-list>
+          <v-list-tile @click="change_password" >
+             <v-list-tile-action>
+                 <v-icon>security</v-icon>
+             </v-list-tile-action>
+             <v-list-tile-title>Change Password</v-list-tile-title>
+          </v-list-tile>
+
+        </v-list>
+        <v-list>
+          <v-list-tile @click="logout" >
+             <v-list-tile-action>
+                 <v-icon>no_meeting_room</v-icon>
+             </v-list-tile-action>
+             <v-list-tile-title>Log Out</v-list-tile-title>
+          </v-list-tile>
+
+        </v-list>
+
+        
+      </v-card>
+    </v-menu>
+    <!-- End of PROFILE MENU -->
+
+   <one-cp></one-cp> 
+  </v-toolbar>
+  </div>
+
+</template>
+<style scoped>
+.bread-crumb {
+   margin-left:20px;
+   font-weight:normal!important;
+}
+.v-badge__badge{
+  top:0px;
+  right:0px;
+}
+</style>
+<script>
+module.exports = {
+  components: {
+    'one-menu-drawer' : httpVueLoader('./oneMenuDrawer.vue'),
+    'one-cp' : httpVueLoader('./oneChangePassword.vue'),
+    'one-menu-notification' : httpVueLoader('./oneNotificationDrawer.vue')
+  },
+  
+  data: function() {
+    return {
+    drawer: false,
+    drawer_notification: false	
+    }
+  },
+  watch : {
+     is_page_allowed : function(new_ipa, old_ipa) {
+        if(! new_ipa ) {
+           var dashboard = this.$store.state.system.dashboard
+           if (dashboard == "") {
+              //this.logout()
+              console.log('go-to','logout')
+           } else {
+              //window.location.href = '/' + dashboard
+              console.log('go-to dashboard',dashboard)
+           }
+        }
+     }
+  },
+  computed: {
+     is_page_allowed() {
+        return this.$store.state.system.is_page_allowed
+     },
+     bread_crumb() {
+        return this.$store.state.system.bread_crumb
+     },
+     xusername() {
+          var un = ''
+          if(localStorage.getItem("user")){
+            var retrievedObject = localStorage.getItem('user')
+            var dtuser = JSON.parse(retrievedObject)
+            
+            un = dtuser.M_UserUsername
+          }
+          return un
+      },
+     xstaffname() {
+          var un = ''
+          if(localStorage.getItem("user")){
+            var retrievedObject = localStorage.getItem('user')
+            var dtuser = JSON.parse(retrievedObject)
+            
+            un = dtuser.M_StaffName
+          }
+          return un
+      }
+  },
+
+  methods : {
+    togleDrawer() {
+      this.drawer = ! this.drawer 
+    },
+    change_password() {
+       this.$store.commit("system/update_change_password_dialog",true)
+    },
+    logout () {
+      window.one_logout('/one-ui/test/vuex/one-login')
+    }
+  }
+}
+</script>
+

apps/components/oneNavbarComponentGlobal.vue

@@ -0,0 +1,54 @@
+<template>
+  <span>
+  <one-menu-drawer :drawer="drawer" > </one-menu-drawer>
+  <v-toolbar color="blue lighten-2" dark fixed app>
+    <v-toolbar-side-icon @click.stop="drawer = !drawer"></v-toolbar-side-icon>
+    <h1>ONE</h1>
+     <v-spacer></v-spacer>
+
+    <a href="#" style="text-decoration:none;color:#fff;font-size:22px; margin-right:15px">{{xusername}}</a>
+    <v-badge color="red">
+      <template v-slot:badge>
+        <span>9</span>
+      </template>
+      <v-icon
+        medium
+
+      >
+        notifications
+      </v-icon>
+    </v-badge>
+     <v-btn class="ml-4" icon>
+      <v-icon>apps</v-icon>
+    </v-btn>
+  </v-toolbar>
+</template>
+<style scoped>
+.v-badge__badge{
+  top:-9px;
+  right:-9px;
+}
+</style>
+<script>
+module.exports = {
+  components: {
+    'one-menu-drawer' : httpVueLoader('./oneMenuDrawerGlobal.vue')
+  },
+  data: function() {
+	return {
+		drawer: false
+	}
+  },
+  computed: {
+      xusername() {
+          var un = ''
+          if(localStorage.getItem("user")){
+            var retrievedObject = localStorage.getItem('user')
+            var dtuser = JSON.parse(retrievedObject)
+            un = dtuser.M_UserUsername
+          }
+          return un
+      }
+  }
+}
+</script>

apps/components/oneNavbarComponentNoMenu.vue

@@ -0,0 +1,168 @@
+<template>
+  <span>
+  <!--<one-menu-drawer :drawer="drawer" > </one-menu-drawer>	-->
+  <one-menu-notification :drawer="drawer_notification" > </one-menu-notification>	
+  <v-toolbar color="blue lighten-2" dark fixed app>
+    <v-toolbar-side-icon @click.stop="togleDrawer()"></v-toolbar-side-icon>
+    <h1>CPONE</h1>
+    <h2 class="bread-crumb">{{bread_crumb}}</h2>
+    <v-spacer></v-spacer>
+    <a href="#" style="text-decoration:none;color:#fff;font-size:22px; margin-right:15px">{{ xusername }}</a>
+    <v-badge color="red">
+      <!--
+      <template v-slot:badge>
+        <span>9</span>
+      </template>
+      -->
+      <v-btn icon @click.stop="drawer_notification = !drawer_notification" flat>
+        <v-icon
+          medium
+        >
+          notifications
+        </v-icon>
+      </v-btn>
+    </v-badge>
+
+
+     <!-- <v-btn class="ml-4" icon>
+      <v-icon>apps</v-icon>
+    </v-btn> -->
+
+    <!-- PROFILE MENU -->
+    <v-menu
+      :close-on-content-click="true"
+      :nudge-width="200"
+      offset-overflow
+      left
+      bottom
+    >
+      <template v-slot:activator="{ on }">
+        <v-btn
+          class="ml-4" icon
+          v-on="on"
+        >
+          <v-icon>apps</v-icon>
+        </v-btn>
+      </template>
+
+      <v-card>
+        <v-list>
+          <v-list-tile avatar>
+
+            <v-list-tile-content>
+              <v-list-tile-title>{{ xusername }}</v-list-tile-title>
+              <v-list-tile-sub-title>{{xstaffname}}</v-list-tile-sub-title>
+            </v-list-tile-content>
+            
+          </v-list-tile>
+        </v-list>
+
+        <v-divider></v-divider>
+
+        <v-list>
+          <v-list-tile @click="change_password" >
+             <v-list-tile-action>
+                 <v-icon>security</v-icon>
+             </v-list-tile-action>
+             <v-list-tile-title>Change Password</v-list-tile-title>
+          </v-list-tile>
+
+        </v-list>
+        <v-list>
+          <v-list-tile @click="logout" >
+             <v-list-tile-action>
+                 <v-icon>no_meeting_room</v-icon>
+             </v-list-tile-action>
+             <v-list-tile-title>Log Out</v-list-tile-title>
+          </v-list-tile>
+
+        </v-list>
+
+        
+      </v-card>
+    </v-menu>
+    <!-- End of PROFILE MENU -->
+
+   <one-cp></one-cp> 
+  </v-toolbar>
+</template>
+<style scoped>
+.bread-crumb {
+   margin-left:20px;
+   font-weight:normal!important;
+}
+.v-badge__badge{
+  top:0px;
+  right:0px;
+}
+</style>
+<script>
+module.exports = {
+  components: {
+    'one-menu-drawer' : httpVueLoader('./oneMenuDrawer.vue'),
+    'one-cp' : httpVueLoader('./oneChangePassword.vue'),
+    'one-menu-notification' : httpVueLoader('./oneNotificationDrawer.vue')
+  },
+  data: function() {
+    return {
+    drawer: false,
+    drawer_notification: false	
+    }
+  },
+  watch : {
+     is_page_allowed : function(new_ipa, old_ipa) {
+        if(! new_ipa ) {
+           var dashboard = this.$store.state.system.dashboard
+           if (dashboard == "") {
+              //this.logout()
+              console.log('go-to','logout')
+           } else {
+              //window.location.href = '/' + dashboard
+              console.log('go-to dashboard',dashboard)
+           }
+        }
+     }
+  },
+  computed: {
+     is_page_allowed() {
+        return this.$store.state.system.is_page_allowed
+     },
+     bread_crumb() {
+        return this.$store.state.system.bread_crumb
+     },
+     xusername() {
+          var un = ''
+          if(localStorage.getItem("user")){
+            var retrievedObject = localStorage.getItem('user')
+            var dtuser = JSON.parse(retrievedObject)
+            
+            un = dtuser.M_UserUsername
+          }
+          return un
+      },
+     xstaffname() {
+          var un = ''
+          if(localStorage.getItem("user")){
+            var retrievedObject = localStorage.getItem('user')
+            var dtuser = JSON.parse(retrievedObject)
+            
+            un = dtuser.M_StaffName
+          }
+          return un
+      }
+  },
+
+  methods : {
+    togleDrawer() {
+      window.location.href = "/one-ui/system/one-md-menu/"
+    },
+    change_password() {
+       this.$store.commit("system/update_change_password_dialog",true)
+    },
+    logout () {
+      window.one_logout('/one-ui/one-login')
+    }
+  }
+}
+</script>
+

apps/components/oneNavbarComponent_auto.vue

@@ -0,0 +1,151 @@
+<template>
+  <span>
+    <one-menu-drawer :drawer="drawer"> </one-menu-drawer>
+    <one-menu-notification :drawer="drawer_notification"> </one-menu-notification>
+    <v-toolbar color="blue lighten-2" dark fixed app>
+      <v-toolbar-side-icon class="hidden-sm-and-down" @click.stop="togleDrawer()"></v-toolbar-side-icon>
+      <h1>ONE</h1>
+      <h2 class="bread-crumb">{{ bread_crumb }}</h2>
+      <v-spacer></v-spacer>
+      <div style="margin-top:14px;margin-bottom:auto;">
+        <span :class="auto_class" style='display:inline-block;margin-right:15px;font-size:16px;color:#ffffff;'>
+          Auto Verifikasi
+        </span>
+        <v-switch v-model="flagAutoRun" style="margin-right:15px;display:inline-block;" color="#00ff00"></v-switch>
+        <a href="#" style="text-decoration:none;color:#fff;font-size:22px; margin-right:15px">{{ xusername }}</a>
+
+      </div>
+      <!-- PROFILE MENU -->
+      <v-menu :close-on-content-click="true" :nudge-width="200" offset-overflow left bottom>
+        <template v-slot:activator="{ on }">
+          <v-btn class="ml-4" icon v-on="on">
+            <v-icon>apps</v-icon>
+          </v-btn>
+        </template>
+
+        <v-card>
+          <v-list>
+            <v-list-tile avatar>
+
+              <v-list-tile-content>
+                <v-list-tile-title>{{ xusername }}</v-list-tile-title>
+                <v-list-tile-sub-title>{{ xstaffname }}</v-list-tile-sub-title>
+              </v-list-tile-content>
+
+            </v-list-tile>
+          </v-list>
+
+          <v-divider></v-divider>
+
+          <v-list>
+            <v-list-tile @click="change_password">
+              <v-list-tile-action>
+                <v-icon>security</v-icon>
+              </v-list-tile-action>
+              <v-list-tile-title>Change Password</v-list-tile-title>
+            </v-list-tile>
+
+          </v-list>
+          <v-list>
+            <v-list-tile @click="logout">
+              <v-list-tile-action>
+                <v-icon>no_meeting_room</v-icon>
+              </v-list-tile-action>
+              <v-list-tile-title>Log Out</v-list-tile-title>
+            </v-list-tile>
+
+          </v-list>
+
+
+        </v-card>
+      </v-menu>
+      <!-- End of PROFILE MENU -->
+
+      <one-cp></one-cp>
+    </v-toolbar>
+</template>
+<style scoped>
+.bread-crumb {
+  margin-left: 20px;
+  font-weight: normal !important;
+}
+
+.v-badge__badge {
+  top: 0px;
+  right: 0px;
+}
+</style>
+<script>
+module.exports = {
+  components: {
+    'one-menu-drawer': httpVueLoader('./oneMenuDrawer.vue'),
+    'one-cp': httpVueLoader('./oneChangePassword.vue'),
+    'one-menu-notification': httpVueLoader('./oneNotificationDrawer.vue')
+  },
+  data: function () {
+    return {
+      drawer: false,
+      drawer_notification: false,
+      flagAutoRun: false
+    }
+  },
+  watch: {
+    is_page_allowed: function (new_ipa, old_ipa) {
+      if (!new_ipa) {
+        var dashboard = this.$store.state.system.dashboard
+        if (dashboard == "") {
+          //this.logout()
+          console.log('go-to', 'logout')
+        } else {
+          //window.location.href = '/' + dashboard
+          console.log('go-to dashboard', dashboard)
+        }
+      }
+    }
+  },
+  computed: {
+    is_page_allowed() {
+      return this.$store.state.system.is_page_allowed
+    },
+    bread_crumb() {
+      return this.$store.state.system.bread_crumb
+    },
+    xusername() {
+      var un = ''
+      if (localStorage.getItem("user")) {
+        var retrievedObject = localStorage.getItem('user')
+        var dtuser = JSON.parse(retrievedObject)
+
+        un = dtuser.M_UserUsername
+      }
+      return un
+    },
+    xstaffname() {
+      var un = ''
+      if (localStorage.getItem("user")) {
+        var retrievedObject = localStorage.getItem('user')
+        var dtuser = JSON.parse(retrievedObject)
+
+        un = dtuser.M_StaffName
+      }
+      return un
+    },
+    auto_label() {
+      console.log('Auto', this.flagAutoRun);
+      if (this.flagAutoRun) return 'Auto Verif Is Running';
+      return 'Auto Verif Is Stopped';
+    }
+  },
+  methods: {
+    togleDrawer() {
+      this.drawer = !this.drawer
+    },
+    change_password() {
+      this.$store.commit("system/update_change_password_dialog", true)
+    },
+    logout() {
+      window.one_logout('/one-ui/test/vuex/one-login-v2')
+    }
+  }
+}
+</script>

apps/components/oneNotificationDrawer.vue

@@ -0,0 +1,138 @@
+<template>
+  <v-navigation-drawer v-model="xdrawer" fixed app right temporary :width="drawerHeight">
+    
+      <v-list two-line>
+          <template v-for="(item, index) in items">
+            <v-subheader
+                v-bind:key="item.id"
+                v-if="item.header"
+            >
+              {{ item.header }}
+            </v-subheader>
+
+            
+
+            <template v-for="(itm, idx) in item.items">
+                <v-list-tile
+                    :key="itm.id"
+                    avatar
+                    >
+                    <v-list-tile-avatar>
+                        <img :src="itm.avatar">
+                    </v-list-tile-avatar>
+
+                    <v-list-tile-content>
+                        <v-list-tile-title v-html="itm.title"></v-list-tile-title>
+                        
+                        <v-list-tile-sub-title v-html="itm.subtitle"></v-list-tile-sub-title>
+                    </v-list-tile-content>
+
+                    <v-list-tile-action v-if="itm.date">
+                        
+                            {{ itm.date }}
+                        
+                    </v-list-tile-action>
+
+                    
+                </v-list-tile>
+                <v-divider
+                    :key="itm.id+50000"
+                    :inset="true"
+                    ></v-divider>
+            </template>
+            
+          </template>
+        </v-list>
+    
+  </v-navigation-drawer>
+</template>
+
+
+<script>
+module.exports = {
+    data () {
+        return {
+            items: 
+            [
+                { 
+                    // header: 'Today' ,
+                    items : [
+                        {
+                            avatar: 'https://cdn.vuetifyjs.com/images/lists/1.jpg',
+                            title: 'Brunch this weekend?',
+                            subtitle: "<span class='text--primary'>Ali Connors</span> &mdash; I'll be in your neighborhood doing errands this weekend. Do you want to hang out?",
+                            date: '15 mins'
+                            ,id : 0 
+                        },
+                        
+                        {
+                            avatar: 'https://cdn.vuetifyjs.com/images/lists/2.jpg',
+                            title: 'Summer BBQ <span class="grey--text text--lighten-1">4</span>',
+                            subtitle: "<span class='text--primary'>to Alex, Scott, Jennifer</span> &mdash; Wish I could come, but I'm out of town this weekend.",
+                            date: '30 mins'
+                            ,id : 1 
+                        },
+                        
+                        {
+                            avatar: 'https://cdn.vuetifyjs.com/images/lists/3.jpg',
+                            title: 'Oui oui',
+                            subtitle: "<span class='text--primary'>Sandra Adams</span> &mdash; Do you have Paris recommendations? Have you ever been?",
+                            date: '45 mins'
+                            ,id : 2 
+                        }
+                    ]   
+                },
+
+                { 
+                    // header: 'Yesterday' ,
+                    items : [
+                        {
+                            avatar: 'https://cdn.vuetifyjs.com/images/lists/1.jpg',
+                            title: 'Brunch this weekend?',
+                            subtitle: "<span class='text--primary'>Ali Connors</span> &mdash; I'll be in your neighborhood doing errands this weekend. Do you want to hang out?",
+                            date: '1 day'
+                            ,id : 3 
+                        },
+                        
+                        {
+                            avatar: 'https://cdn.vuetifyjs.com/images/lists/2.jpg',
+                            title: 'Summer BBQ <span class="grey--text text--lighten-1">4</span>',
+                            subtitle: "<span class='text--primary'>to Alex, Scott, Jennifer</span> &mdash; Wish I could come, but I'm out of town this weekend.",
+                            date: '2 day'
+                            ,id : 4 
+                        }
+                    ]   
+                }
+            ]
+        }
+    },
+  props: {
+    drawer: Boolean
+  },
+
+  computed : {
+     drawerHeight() {
+        if (this.$vuetify.breakpoint.smAndDown) {
+           return "300px"
+        }
+        return "500px"
+     },
+     xdrawer: {
+        get() {
+           return this.drawer
+        },
+        set(v) {
+           this.$emit("togleDrawer")
+        }
+     }
+  },
+
+  mounted () {
+    
+  },
+
+  methods : {
+    
+  }
+}
+</script>

apps/components/oneTanggal-bkp.vue

@@ -0,0 +1,62 @@
+<template>
+   <div class="tanggal">
+      {{f_tanggal}}
+   </div>
+</template>
+<style scoped>
+  div.tanggal {
+    text-decoration: none;
+    color: rgb(255, 255, 255);
+    font-size: 14px;
+    display:inline-block; 
+    margin-left:10px;
+  }
+</style>
+<script>
+let hari = ['Minggu','Senin','Selasa', 'Rabu', 'Kamis',"Jum'at","Sabtu"]
+let bulan = ["Jan","Feb","Mar","Apr","Mei","Jun","Jul","Agu","Sep","Okt","Nov","Des"]
+
+module.exports = {
+   data() {
+      return {
+         tanggal: new Date()
+         ,timepool : 0
+      }
+   }
+   ,computed: {
+      f_tanggal() {
+         try {
+            let tgl = this.tanggal.getDate()
+            let bln = bulan[this.tanggal.getMonth()]
+            let day = hari[this.tanggal.getDay()]
+            let result = day + ', ' + tgl + ' ' + bln + ' ' + this.tanggal.getFullYear() 
+            let hour = this.tanggal.getHours()
+            let minute = this.tanggal.getMinutes()
+            let second = this.tanggal.getSeconds() 
+            let jam = ' '
+            if ( hour < 10 ) jam = jam + '0'
+            jam = jam + hour.toString() + ':'
+            if ( minute < 10 ) jam = jam + '0'
+            jam = jam + minute.toString() + ':'
+            if ( second< 10 ) jam = jam + + '0'
+            jam = jam + second.toString()
+         
+            result = result + ' ' +  jam
+            return result 
+         } catch(e) {
+            return ''
+         }
+      }
+   }
+   , mounted() {
+      let self = this
+      this.timepool = setInterval(function() {
+         self.tanggal = new Date()
+      },1000)
+   }
+   ,beforeDestroy() {
+      if (this.timepool > 0 ) clearInterval(this.timepool)
+
+   }
+}
+</script>

apps/components/oneTanggal-new.vue

@@ -0,0 +1,70 @@
+<template>
+   <div class="tanggal">
+      {{f_tanggal}}
+      <span style="color:brown; margin-left:20px;font-weight:bold;font-size:16px;">
+         {{branch_name}}
+      </span>
+   </div>
+</template>
+<style scoped>
+  div.tanggal {
+    text-decoration: none;
+    color: rgb(255, 255, 255);
+    font-size: 14px;
+    display:inline-block; 
+    margin-left:10px;
+  }
+</style>
+<script>
+let hari = ['Minggu','Senin','Selasa', 'Rabu', 'Kamis',"Jum'at","Sabtu"]
+let bulan = ["Jan","Feb","Mar","Apr","Mei","Jun","Jul","Agu","Sep","Okt","Nov","Des"]
+
+module.exports = {
+   data() {
+      return {
+         tanggal: new Date()
+         ,timepool : 0
+      }
+   }
+   ,computed: {
+      branch_name() {
+         let branch = this.$store.state.system.branch 
+         if (branch.M_BranchName == undefined) return ''
+         return branch.M_BranchName + ', ' + branch.M_BranchAddress
+      },
+      f_tanggal() {
+         try {
+            let tgl = this.tanggal.getDate()
+            let bln = bulan[this.tanggal.getMonth()]
+            let day = hari[this.tanggal.getDay()]
+            let result = day + ', ' + tgl + ' ' + bln + ' ' + this.tanggal.getFullYear() 
+            let hour = this.tanggal.getHours()
+            let minute = this.tanggal.getMinutes()
+            let second = this.tanggal.getSeconds() 
+            let jam = ' '
+            if ( hour < 10 ) jam = jam + '0'
+            jam = jam + hour.toString() + ':'
+            if ( minute < 10 ) jam = jam + '0'
+            jam = jam + minute.toString() + ':'
+            if ( second< 10 ) jam = jam + + '0'
+            jam = jam + second.toString()
+         
+            result = result + ' ' +  jam
+            return result 
+         } catch(e) {
+            return ''
+         }
+      }
+   }
+   , mounted() {
+      let self = this
+      this.timepool = setInterval(function() {
+         self.tanggal = new Date()
+      },1000)
+   }
+   ,beforeDestroy() {
+      if (this.timepool > 0 ) clearInterval(this.timepool)
+
+   }
+}
+</script>

apps/components/oneTanggal.vue

@@ -0,0 +1,74 @@
+<template>
+   <div class="tanggal">
+      {{f_tanggal}}
+      <span class="hidden-sm-and-down" style="color:brown; margin-left:20px;font-weight:bold;font-size:16px;">
+         {{branch_name}}
+      </span>
+      <div class="visible-sm-and-down hidden-md-and-up" style="color:brown; font-weight:bold;font-size:10px;">
+         Devone <!-- {{branch_name}} -->
+      </div>
+   </div>
+</template>
+<style scoped>
+  div.tanggal {
+    text-decoration: none;
+    vertical-align:top;
+    color: rgb(255, 255, 255);
+    font-size: 14px;
+    display:inline-block; 
+    margin-left:10px;
+  }
+</style>
+<script>
+let hari = ['Minggu','Senin','Selasa', 'Rabu', 'Kamis',"Jum'at","Sabtu"]
+let bulan = ["Jan","Feb","Mar","Apr","Mei","Jun","Jul","Agu","Sep","Okt","Nov","Des"]
+
+module.exports = {
+   data() {
+      return {
+         tanggal: new Date()
+         ,timepool : 0
+      }
+   }
+   ,computed: {
+      branch_name() {
+         let branch = this.$store.state.system.branch 
+         if (branch.M_BranchName == undefined) return ''
+         return branch.M_BranchName 
+      },
+      f_tanggal() {
+         try {
+            let tgl = this.tanggal.getDate()
+            let bln = bulan[this.tanggal.getMonth()]
+            let day = hari[this.tanggal.getDay()]
+            let result = day + ', ' + tgl + ' ' + bln + ' ' + this.tanggal.getFullYear() 
+            let hour = this.tanggal.getHours()
+            let minute = this.tanggal.getMinutes()
+            let second = this.tanggal.getSeconds() 
+            let jam = ' '
+            if ( hour < 10 ) jam = jam + '0'
+            jam = jam + hour.toString() + ':'
+            if ( minute < 10 ) jam = jam + '0'
+            jam = jam + minute.toString() + ':'
+            if ( second< 10 ) jam = jam + + '0'
+            jam = jam + second.toString()
+         
+            result = result + ' ' +  jam
+            return result 
+         } catch(e) {
+            return ''
+         }
+      }
+   }
+   , mounted() {
+      let self = this
+      this.timepool = setInterval(function() {
+         self.tanggal = new Date()
+      },1000)
+   }
+   ,beforeDestroy() {
+      if (this.timepool > 0 ) clearInterval(this.timepool)
+
+   }
+}
+</script>

apps/components/oneTanggal.vue-010320

@@ -0,0 +1,70 @@
+<template>
+   <div class="tanggal">
+      {{f_tanggal}}
+      <span style="color:brown; margin-left:20px;font-weight:bold;font-size:16px;">
+         {{branch_name}}
+      </span>
+   </div>
+</template>
+<style scoped>
+  div.tanggal {
+    text-decoration: none;
+    color: rgb(255, 255, 255);
+    font-size: 14px;
+    display:inline-block; 
+    margin-left:10px;
+  }
+</style>
+<script>
+let hari = ['Minggu','Senin','Selasa', 'Rabu', 'Kamis',"Jum'at","Sabtu"]
+let bulan = ["Jan","Feb","Mar","Apr","Mei","Jun","Jul","Agu","Sep","Okt","Nov","Des"]
+
+module.exports = {
+   data() {
+      return {
+         tanggal: new Date()
+         ,timepool : 0
+      }
+   }
+   ,computed: {
+      branch_name() {
+         let branch = this.$store.state.system.branch 
+         if (branch.M_BranchName == undefined) return ''
+         return branch.M_BranchName 
+      },
+      f_tanggal() {
+         try {
+            let tgl = this.tanggal.getDate()
+            let bln = bulan[this.tanggal.getMonth()]
+            let day = hari[this.tanggal.getDay()]
+            let result = day + ', ' + tgl + ' ' + bln + ' ' + this.tanggal.getFullYear() 
+            let hour = this.tanggal.getHours()
+            let minute = this.tanggal.getMinutes()
+            let second = this.tanggal.getSeconds() 
+            let jam = ' '
+            if ( hour < 10 ) jam = jam + '0'
+            jam = jam + hour.toString() + ':'
+            if ( minute < 10 ) jam = jam + '0'
+            jam = jam + minute.toString() + ':'
+            if ( second< 10 ) jam = jam + + '0'
+            jam = jam + second.toString()
+         
+            result = result + ' ' +  jam
+            return result 
+         } catch(e) {
+            return ''
+         }
+      }
+   }
+   , mounted() {
+      let self = this
+      this.timepool = setInterval(function() {
+         self.tanggal = new Date()
+      },1000)
+   }
+   ,beforeDestroy() {
+      if (this.timepool > 0 ) clearInterval(this.timepool)
+
+   }
+}
+</script>

apps/login/api.js

@@ -0,0 +1,51 @@
+const URL_LOGIN =
+  "/one-api/v1/system/auth/login";
+const URL_IS_LOGIN =
+  "/one-api/v1/system/auth/isLogin";
+
+const ONE_TOKEN = "oneTokenId";
+
+export async function login(userName, userPassword) {
+  try {
+    var resp = await axios.post(URL_LOGIN, {
+      userName: userName,
+      userPassword: userPassword
+    });
+    if (resp.status != 200) {
+      return { status: "ERR", message: resp.statusText };
+    }
+    let data = resp.data;
+    //Hardcoded 1st
+    data.nextPage = "/one-ui/apps/main/";
+    return data;
+  } catch (e) {
+    return { status: "ERR", message: e.message };
+  }
+}
+
+export async function isLogin(token) {
+  try {
+    var resp = await axios.post(URL_IS_LOGIN, {
+      token: token
+    });
+    if (resp.status != 200) {
+      return { status: "ERR", message: resp.statusText };
+    }
+    let data = resp.data;
+    //Hardcoded 1st
+    data.nextPage = "/one-ui/apps/main/";
+    return data;
+  } catch (e) {
+    return { status: "ERR", message: e.message };
+  }
+}
+
+export function loadOneToken() {
+  return localStorage.getItem(ONE_TOKEN);
+}
+export function saveOneToken(token) {
+  localStorage.setItem(ONE_TOKEN, token);
+}
+export function removeOneToken() {
+  localStorage.removeItem(ONE_TOKEN);
+}

apps/login/index.php

@@ -0,0 +1,113 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <meta http-equiv="X-UA-Compatible" content="ie=edge">
+  <title>Login</title>
+  <link rel="stylesheet" href="../../libs/vendor/css/google-fonts.css">
+  <link rel="stylesheet" href="../../libs/vendor/css/vuetify.min.css">
+</head>
+
+<body>
+  <div v-cloak id="app">
+    <v-app id="inspire">
+      <v-content>
+        <v-container fluid fill-height>
+          <v-layout align-center justify-center>
+            <v-flex xs12 sm8 md4>
+              <v-card class="elevation-12">
+                <v-toolbar dark color="primary">
+                  <v-toolbar-title>One UI</v-toolbar-title>
+                  <v-spacer></v-spacer>
+                </v-toolbar>
+                  <v-alert
+                    :value="isError"
+                    type="warning"
+                  >
+                    {{errorMessage}}
+                  </v-alert>
+                  <v-progress-circular 
+                    indeterminate
+                    v-show="isLoading"
+                  >
+
+                  </v-progress-circular>
+
+                <v-card-text>
+                  <v-form>
+                    <v-text-field v-model="userName" prepend-icon="person" label="Login" type="text"></v-text-field>
+                    <v-text-field  @keydown.enter="doLogin" v-model="userPassword" prepend-icon="lock"  label="Password" type="password"></v-text-field>
+                  </v-form>
+                </v-card-text>
+                <v-card-actions>
+                  <v-spacer></v-spacer>
+                  <v-btn @click="doLogin" color="primary">Login</v-btn>
+                </v-card-actions>
+                {{afterLogin}}
+              </v-card>
+            </v-flex>
+          </v-layout>
+        </v-container>
+      </v-content>
+    </v-app>
+  </div>
+
+  <!-- Vendor -->
+  <script src="../../libs/vendor/axios.min.js"></script>
+  <script src="../../libs/vendor/vue.js"></script>
+  <script src="../../libs/vendor/vuex.js"></script>
+  <script src="../../libs/vendor/vuetify.js"></script>
+  <!-- App Script -->
+  <?php
+  $ts = "?ts=" . Date("ymdhis");
+  ?>
+  <script type="module">
+  import { store } from './store.js<?php echo $ts ?>';
+  //window.store = store;
+
+  new Vue({
+    store,
+    el: '#app',
+    data: {
+      userName: "",
+      userPassword: ""
+    },
+    methods : {
+      doLogin() {
+        this.$store.dispatch("login",{
+          "userName": this.userName,
+          "userPassword": this.userPassword
+        });
+      }
+    }, 
+    computed: {
+      ...Vuex.mapState({
+        errorMessage: state => state.errorMessage,
+        isLoading: state => state.isLoading,
+        isLogin: state => state.isLogin,
+        nextPage: state => state.nextPage
+      }),
+      isError: function() {
+        return this.errorMessage != "";
+      },
+      afterLogin: function() {
+        if (this.isLogin) {
+          document.location.href = this.nextPage;
+        };
+      }
+    },
+    created: function(){
+      this.$store.dispatch("loadToken");
+    }
+  });
+  </script>
+  <style>
+    [v-cloak] {
+      display: none
+    }
+  </style>
+</body>
+
+</html>

apps/login/store.js

@@ -0,0 +1,61 @@
+//import dari api
+import * as api from "./api.js";
+
+export const store = new Vuex.Store({
+  state: {
+    isLogin: false,
+    token: "",
+    isLoading: false,
+    errorMessage: "",
+    nextPage: ""
+  },
+  mutations: {
+    updateLoading(state, flag) {
+      state.isLoading = flag;
+    },
+    updateIsLogin(state, flag) {
+      state.isLogin = flag;
+    },
+    updateToken(state, resp) {
+      state.token = resp.data.token;
+      state.nextPage = resp.nextPage;
+    },
+    updateErrorMessage(state, msg) {
+      state.errorMessage = msg;
+    }
+  },
+  actions: {
+    async login(context, data) {
+      context.commit("updateLoading", true);
+      let resp = await api.login(data.userName, data.userPassword);
+      if (resp.status == "OK") {
+        context.commit("updateIsLogin", true);
+        api.saveOneToken(resp.data.token);
+        context.commit("updateToken", resp);
+        context.commit("updateErrorMessage", "");
+      } else {
+        context.commit("updateIsLogin", false);
+        context.commit("updateErrorMessage", resp.message);
+        api.removeOneToken();
+        setTimeout(() => {
+          context.commit("updateErrorMessage", "");
+        }, 3000);
+      }
+      context.commit("updateLoading", false);
+    },
+    async loadToken(context) {
+      context.commit("updateLoading", true);
+      let token = api.loadOneToken();
+      if (token == "") {
+        context.commit("updateIsLogin", false);
+      } else {
+        let resp = await api.isLogin(token);
+        if (resp.status == "OK") {
+          context.commit("updateToken", resp);
+          context.commit("updateIsLogin", true);
+        }
+      }
+      context.commit("updateLoading", false);
+    }
+  }
+});

apps/main/components/smartNavbarComponent.js

@@ -0,0 +1,108 @@
+var smartNavbarComponent = {
+  template: `
+  <span>
+  <v-navigation-drawer v-model="drawer" fixed app>
+    <v-list>
+      <v-list-group no-action group="l1home">
+        <v-list-tile slot="activator">
+          <v-list-tile-content>
+            <v-list-tile-title>
+              L1 Home
+            </v-list-tile-title>
+          </v-list-tile-content>
+        </v-list-tile>
+
+        <v-list-tile>
+          <v-list-tile-action>
+            <v-icon>restaurant</v-icon>
+          </v-list-tile-action>
+          <v-list-tile-content>
+            <v-list-tile-title>
+              Sub of Home
+            </v-list-tile-title>
+          </v-list-tile-content>
+        </v-list-tile>
+
+        <v-list-group no-action sub-group group="l2home" >
+          <v-list-tile slot="activator">
+            <v-list-tile-content>
+              <v-list-tile-title>
+                L2 Home
+              </v-list-tile-title>
+            </v-list-tile-content>
+          </v-list-tile>
+          <v-list-tile>
+            <v-list-tile-action>
+              <v-icon>restaurant</v-icon>
+            </v-list-tile-action>
+            <v-list-tile-content>
+              <v-list-tile-title>
+                Sub of L2 Home
+              </v-list-tile-title>
+            </v-list-tile-content>
+          </v-list-tile>
+
+          <v-list-group no-action sub-group  group="l2home.l3home" >
+            <v-list-tile slot="activator">
+              <v-list-tile-content>
+                <v-list-tile-title>
+                  L3 Home
+                </v-list-tile-title>
+              </v-list-tile-content>
+            </v-list-tile>
+            <v-list-tile>
+              <v-list-tile-action>
+                <v-icon>restaurant</v-icon>
+              </v-list-tile-action>
+              <v-list-tile-content>
+                <v-list-tile-title>
+                  Sub of L3 Home
+                </v-list-tile-title>
+              </v-list-tile-content>
+            </v-list-tile>
+          </v-list-group>
+
+        </v-list-group>
+        
+      </v-list-group>
+      
+      <v-list-group no-action >
+        <v-list-tile slot="activator">
+          <v-list-tile-content>
+            <v-list-tile-title>
+              L1 School
+            </v-list-tile-title>
+          </v-list-tile-content>
+        </v-list-tile>
+
+        <v-list-tile>
+          <v-list-tile-content>
+            <v-list-tile-title>
+              Sub of School
+            </v-list-tile-title>
+          </v-list-tile-content>
+          <v-list-tile-action>
+            <v-icon>school</v-icon>
+          </v-list-tile-action>          
+        </v-list-tile>
+      </v-list-group>
+      
+
+        
+    </v-list>
+  </v-navigation-drawer>
+  <v-toolbar color="indigo" dark fixed app>
+    <v-toolbar-side-icon @click.stop="drawer = !drawer"></v-toolbar-side-icon>
+    <v-toolbar-title>Application</v-toolbar-title>
+  </v-toolbar>
+  </span>
+  `,
+  data: function() {
+    return {
+      drawer: true
+    };
+  },
+  methods: {}
+};
+
+export { smartNavbarComponent };

apps/main/index.php

@@ -0,0 +1,62 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <meta http-equiv="X-UA-Compatible" content="ie=edge">
+  <title>One::Main</title>
+  <link rel="stylesheet" href="../../libs/vendor/css/google-fonts.css">
+  <link rel="stylesheet" href="../../libs/vendor/css/vuetify.min.css">
+</head>
+
+<body>
+  <div v-cloak id="app">
+    <v-app id="smartApp">
+      <smart-navbar></smart-navbar>
+      <v-content>
+        <v-container fluid fill-height style="height:inherit">
+          <v-flex size="xs12">
+            Welcome to ONE
+          </v-flex>
+        </v-container>
+      </v-content>
+      <v-footer color="indigo" app>
+        <span class="white--text">&copy; 2017</span>
+      </v-footer>
+    </v-app>
+  </div>
+
+  <!-- Vendor -->
+  <script src="../../libs/vendor/axios.min.js"></script>
+  <script src="../../libs/vendor/vue.js"></script>
+  <script src="../../libs/vendor/vuex.js"></script>
+  <script src="../../libs/vendor/vuetify.js"></script>
+  <!-- App Script -->
+  <?php
+  $ts = "?ts=" . Date("ymdhis");
+  ?>
+  <script type="module">
+    import { smartNavbarComponent } from './components/smartNavbarComponent.js<?php echo $ts ?>';
+    //for testing
+    // window.store = store;
+
+    new Vue({
+      el: '#app',
+      components: {
+        'smart-navbar': smartNavbarComponent
+      },
+      data: {
+        drawer: false,
+
+      }
+    })
+  </script>
+  <style>
+    [v-cloak] {
+      display: none
+    }
+  </style>
+</body>
+
+</html>

apps/modules/system/menu.js

@@ -0,0 +1,101 @@
+// 1 => LOADING
+// 2 => DONE
+// 3 => ERROR
+import * as menu_api from "../../api/system/menu.js?x=1"
+
+export default  {
+   namespaced: true,
+   state: {
+      search : '',
+      search_status: 0,
+      search_error_message: "",
+      menu_level_0: [],
+      menu_level_1: [],
+      menu_level_2: [],
+      total_menu: 0,
+      //sipe add breadcrumb dan hak akses
+      bread_crumb : "",
+      is_page_allowed : true,
+      dashboard:""
+   },
+
+   mutations: {
+      update_bread_crumb(state,val) {
+         state.bread_crumb= val
+      },
+      update_dashboard(state,val) {
+         state.dashboard= val
+      },
+      update_is_page_allowed(state,val) {
+         state.is_page_allowed = val
+      },
+      update_search(state,val) {
+         state.search=val 
+      },
+      update_search_error_message(state,status) {
+         state.search_error_message = status
+      },
+      update_search_status(state,status) {
+         state.search_status = status
+      },
+
+    update_menu_level_0 (state, data) {
+        state.menu_level_0 = data
+    },
+
+    update_menu_level_1 (state, data) {
+    state.menu_level_1 = data
+    },
+
+    update_menu_level_2 (state, data) {
+        state.menu_level_2 = data
+    }
+   },
+   actions: {
+      async get_menu(context) {
+         context.commit("update_search_status",1)
+         try {
+            let resp= await menu_api.get_menu()
+            if (resp.status != "OK") {
+               context.commit("update_search_status",3)
+               context.commit("update_search_error_message",resp.message)
+            } else {
+               context.commit("update_search_status",2)
+               context.commit("update_search_error_message","")
+
+               let x = resp.data
+                if (x[0])
+                    context.commit("update_menu_level_0", x[0]['p_0'])
+
+                if (x[1])
+                    context.commit("update_menu_level_1", x[1])
+
+                if (x[2])
+                    context.commit("update_menu_level_2", x[2])
+            //    let data = {
+            //       total : resp.data.total,
+            //       records : resp.data.records
+            //    }
+               
+            //    context.commit("update_status", data)
+            }
+            //sipe :
+            // tambahan get bread_crumb
+            resp = await menu_api.get_bread_crumb() 
+            if (resp.status != "OK") {
+               context.commit("update_search_status",3)
+               context.commit("update_search_error_message",resp.message)
+            } else {
+               context.commit("update_search_status",2)
+               context.commit("update_search_error_message","")
+               context.commit("update_bread_crumb",resp.data.bread_crumb)
+               context.commit("update_page_allowed",resp.data.is_page_allowed)
+               context.commit("update_dashboard",resp.data.dashboard)
+            }
+         } catch(e) {
+            context.commit("update_search_status",3)
+            context.commit("update_search_error_message", e.message )
+         }
+      }
+   }
+}

apps/modules/system/system-bkp.js

@@ -0,0 +1,123 @@
+// 1 => LOADING
+// 2 => DONE
+// 3 => ERROR
+import * as menu_api from "../../api/system/menu.js"
+
+export default  {
+   namespaced: true,
+   state: {
+      search : '',
+      search_status: 0,
+      search_error_message: "",
+      menu_level_0: [],
+      menu_level_1: [],
+      menu_level_2: [],
+      total_menu: 0,
+      //sipe add breadcrumb dan hak akses
+      bread_crumb : "",
+      is_page_allowed : true,
+      dashboard: "",
+      //tambahan jumlah notification
+      notification_count: 0,
+      change_password_dialog: false,
+      change_password_error: ""
+   },
+
+   mutations: {
+      update_change_password_dialog(state,val) {
+         state.change_password_dialog = val
+      },
+      update_change_password_error(state,val) {
+         state.change_password_error= val
+      },
+      update_bread_crumb(state,val) {
+         state.bread_crumb = val
+      },
+      update_dashboard(state,val) {
+         state.dashboard= val
+      },
+      update_page_allowed(state,val) {
+         state.is_page_allowed = val
+      },
+      update_search(state,val) {
+         state.search=val 
+      },
+      update_search_error_message(state,status) {
+         state.search_error_message = status
+      },
+      update_search_status(state,status) {
+         state.search_status = status
+      },
+
+      update_menu_level_0 (state, data) {
+         state.menu_level_0 = data
+      },
+
+      update_menu_level_1 (state, data) {
+         state.menu_level_1 = data
+      },
+
+      update_menu_level_2 (state, data) {
+         state.menu_level_2 = data
+      }
+   },
+   actions: {
+      async get_menu(context) {
+         context.commit("update_search_status",1)
+         try {
+            let resp= await menu_api.get_menu(one_token())
+            if (resp.status != "OK") {
+               context.commit("update_search_status",3)
+               context.commit("update_search_error_message",resp.message)
+            } else {
+               context.commit("update_search_status",2)
+               context.commit("update_search_error_message","")
+
+               let x = resp.data
+               if (x[0])
+                  context.commit("update_menu_level_0", x[0]['p_0'])
+
+               if (x[1])
+                  context.commit("update_menu_level_1", x[1])
+
+               if (x[2])
+                  context.commit("update_menu_level_2", x[2])
+               //    let data = {
+               //       total : resp.data.total,
+               //       records : resp.data.records
+               //    }
+
+               //    context.commit("update_status", data)
+            }
+            //sipe :
+            // tambahan get bread_crumb
+            resp = await menu_api.get_bread_crumb(one_token()) 
+            if (resp.status != "OK") {
+               context.commit("update_search_status",3)
+               context.commit("update_search_error_message",resp.message)
+            } else {
+               context.commit("update_search_status",2)
+               context.commit("update_search_error_message","")
+               context.commit("update_bread_crumb",resp.data.bread_crumb)
+               context.commit("update_page_allowed",resp.data.is_page_allowed)
+               context.commit("update_dashboard",resp.data.dashboard)
+            }
+         } catch(e) {
+            context.commit("update_search_status",3)
+            context.commit("update_search_error_message", e.message )
+         }
+      },
+      async change_password(context,prm) {
+         try {
+            let resp = await menu_api.change_password(prm)
+            if (resp.status != "OK") {
+               context.commit("update_change_password_error",resp.message)
+            } else {
+               context.commit("update_change_password_error","")
+            }
+         } catch(e) {
+            console.log(e)
+         } 
+      }
+   }
+}

apps/modules/system/system-new.js

@@ -0,0 +1,122 @@
+// 1 => LOADING
+// 2 => DONE
+// 3 => ERROR
+import * as menu_api from "../../api/system/menu.js"
+
+export default  {
+   namespaced: true,
+   state: {
+      search : '',
+      search_status: 0,
+      search_error_message: "",
+      menu_level_0: [],
+      menu_level_1: [],
+      menu_level_2: [],
+      total_menu: 0,
+      //sipe add breadcrumb dan hak akses
+      bread_crumb : "",
+      is_page_allowed : true,
+      dashboard: "",
+      //tambahan jumlah notification
+      notification_count: 0,
+      change_password_dialog: false,
+      change_password_error: "",
+      branch: {}
+   },
+
+   mutations: {
+      update_branch(state,val) {
+         state.branch = val
+      },
+      update_change_password_dialog(state,val) {
+         state.change_password_dialog = val
+      },
+      update_change_password_error(state,val) {
+         state.change_password_error= val
+      },
+      update_bread_crumb(state,val) {
+         state.bread_crumb = val
+      },
+      update_dashboard(state,val) {
+         state.dashboard= val
+      },
+      update_page_allowed(state,val) {
+         state.is_page_allowed = val
+      },
+      update_search(state,val) {
+         state.search=val 
+      },
+      update_search_error_message(state,status) {
+         state.search_error_message = status
+      },
+      update_search_status(state,status) {
+         state.search_status = status
+      },
+
+      update_menu_level_0 (state, data) {
+         state.menu_level_0 = data
+      },
+
+      update_menu_level_1 (state, data) {
+         state.menu_level_1 = data
+      },
+
+      update_menu_level_2 (state, data) {
+         state.menu_level_2 = data
+      }
+   },
+   actions: {
+      async get_menu(context) {
+         context.commit("update_search_status",1)
+         try {
+            let resp= await menu_api.get_menu(one_token())
+            if (resp.status != "OK") {
+               context.commit("update_search_status",3)
+               context.commit("update_search_error_message",resp.message)
+            } else {
+               context.commit("update_search_status",2)
+               context.commit("update_search_error_message","")
+
+               let x = resp.data
+               if (x[0])
+                  context.commit("update_menu_level_0", x[0]['p_0'])
+
+               if (x[1])
+                  context.commit("update_menu_level_1", x[1])
+
+               if (x[2])
+                  context.commit("update_menu_level_2", x[2])
+            }
+            //sipe :
+            // tambahan get bread_crumb
+            resp = await menu_api.get_bread_crumb(one_token()) 
+            if (resp.status != "OK") {
+               context.commit("update_search_status",3)
+               context.commit("update_search_error_message",resp.message)
+            } else {
+               context.commit("update_search_status",2)
+               context.commit("update_search_error_message","")
+               context.commit("update_bread_crumb",resp.data.bread_crumb)
+               context.commit("update_branch",resp.data.branch)
+               context.commit("update_page_allowed",resp.data.is_page_allowed)
+               context.commit("update_dashboard",resp.data.dashboard)
+            }
+         } catch(e) {
+            context.commit("update_search_status",3)
+            context.commit("update_search_error_message", e.message )
+         }
+      },
+      async change_password(context,prm) {
+         try {
+            let resp = await menu_api.change_password(prm)
+            if (resp.status != "OK") {
+               context.commit("update_change_password_error",resp.message)
+            } else {
+               context.commit("update_change_password_error","")
+            }
+         } catch(e) {
+            console.log(e)
+         } 
+      }
+   }
+}

apps/modules/system/system.js

@@ -0,0 +1,122 @@
+// 1 => LOADING
+// 2 => DONE
+// 3 => ERROR
+import * as menu_api from "../../api/system/menu.js"
+
+export default  {
+   namespaced: true,
+   state: {
+      search : '',
+      search_status: 0,
+      search_error_message: "",
+      menu_level_0: [],
+      menu_level_1: [],
+      menu_level_2: [],
+      total_menu: 0,
+      //sipe add breadcrumb dan hak akses
+      bread_crumb : "",
+      is_page_allowed : true,
+      dashboard: "",
+      //tambahan jumlah notification
+      notification_count: 0,
+      change_password_dialog: false,
+      change_password_error: "",
+      branch: {}
+   },
+
+   mutations: {
+      update_branch(state,val) {
+         state.branch = val
+      },
+      update_change_password_dialog(state,val) {
+         state.change_password_dialog = val
+      },
+      update_change_password_error(state,val) {
+         state.change_password_error= val
+      },
+      update_bread_crumb(state,val) {
+         state.bread_crumb = val
+      },
+      update_dashboard(state,val) {
+         state.dashboard= val
+      },
+      update_page_allowed(state,val) {
+         state.is_page_allowed = val
+      },
+      update_search(state,val) {
+         state.search=val 
+      },
+      update_search_error_message(state,status) {
+         state.search_error_message = status
+      },
+      update_search_status(state,status) {
+         state.search_status = status
+      },
+
+      update_menu_level_0 (state, data) {
+         state.menu_level_0 = data
+      },
+
+      update_menu_level_1 (state, data) {
+         state.menu_level_1 = data
+      },
+
+      update_menu_level_2 (state, data) {
+         state.menu_level_2 = data
+      }
+   },
+   actions: {
+      async get_menu(context) {
+         context.commit("update_search_status",1)
+         try {
+            let resp= await menu_api.get_menu(one_token())
+            if (resp.status != "OK") {
+               context.commit("update_search_status",3)
+               context.commit("update_search_error_message",resp.message)
+            } else {
+               context.commit("update_search_status",2)
+               context.commit("update_search_error_message","")
+
+               let x = resp.data
+               if (x[0])
+                  context.commit("update_menu_level_0", x[0]['p_0'])
+
+               if (x[1])
+                  context.commit("update_menu_level_1", x[1])
+
+               if (x[2])
+                  context.commit("update_menu_level_2", x[2])
+            }
+            //sipe :
+            // tambahan get bread_crumb
+            resp = await menu_api.get_bread_crumb(one_token()) 
+            if (resp.status != "OK") {
+               context.commit("update_search_status",3)
+               context.commit("update_search_error_message",resp.message)
+            } else {
+               context.commit("update_search_status",2)
+               context.commit("update_search_error_message","")
+               context.commit("update_bread_crumb",resp.data.bread_crumb)
+               context.commit("update_branch",resp.data.branch)
+               context.commit("update_page_allowed",resp.data.is_page_allowed)
+               context.commit("update_dashboard",resp.data.dashboard)
+            }
+         } catch(e) {
+            context.commit("update_search_status",3)
+            context.commit("update_search_error_message", e.message )
+         }
+      },
+      async change_password(context,prm) {
+         try {
+            let resp = await menu_api.change_password(prm)
+            if (resp.status != "OK") {
+               context.commit("update_change_password_error",resp.message)
+            } else {
+               context.commit("update_change_password_error","")
+            }
+         } catch(e) {
+            console.log(e)
+         } 
+      }
+   }
+}

common/oneDatePicker.vue

@@ -0,0 +1,75 @@
+<template>
+    <v-menu
+          v-model="menu2"
+          :close-on-content-click="false"
+          :nudge-right="40"
+          lazy
+          transition="scale-transition"
+          offset-y
+          full-width
+          max-width="290px"
+          min-width="290px"
+        >
+          <v-text-field
+            slot="activator"
+            v-model="computedDateFormatted"
+            :label=init_label
+            hint="DD-MM-YYYY format"
+            persistent-hint
+            readonly
+          ></v-text-field>
+          <v-date-picker v-model="init_date" no-title @input="menu2 = false"></v-date-picker>
+    </v-menu>
+ </template>
+
+ <script>
+ module.exports = {
+     props : ['label', 'date', 'data'],
+
+     data () {
+        return {
+            init_date: this.date ? this.date : new Date().toISOString().substr(0, 10),
+            dateFormatted: this.formatDate(new Date().toISOString().substr(0, 10)),
+            menu1: false,
+            menu2: false,
+
+            init_label: this.label ? this.label : 'Date',
+            init_data: this.data ? this.data : ''
+        }
+     },
+
+    computed: {
+      computedDateFormatted () {
+        return this.formatDate(this.init_date)
+      }
+    },
+
+    watch: {
+      init_date (n, o) {
+        this.dateFormatted = this.formatDate(this.init_date)
+        
+        this.$emit('change', {"old_date":o, "new_date":n, "data":this.init_data});
+      }
+    },
+
+    methods: {
+      formatDate (date) {
+        if (!date) return null
+
+        const [year, month, day] = date.split('-')
+        return `${day}-${month}-${year}`
+      },
+      parseDate (date) {
+        if (!date) return null
+
+        const [month, day, year] = date.split('/')
+        return `${year}-${month.padStart(2, '0')}-${day.padStart(2, '0')}`
+      },
+
+      emitChange (n, o) {
+          console.log("old:"+o)
+          console.log("new:"+n)
+      }
+    }
+ }
+</script>

common/oneDialogAlert.vue

@@ -0,0 +1,80 @@
+<template>
+  
+    <v-dialog
+      v-model="dialog"
+      max-width="30%"
+    >
+        <v-card>
+            <v-card-title
+                class="headline grey lighten-2 pt-2 pb-2"
+                primary-title
+            >
+            Peringatan !
+            </v-card-title>
+            <v-card-text class="pt-2 pb-2">
+                <v-layout row>
+                    <v-flex xs12 d-flex>
+                        <v-layout row>
+                            <v-flex pb-1 xs12>
+                                <v-layout row>
+                                    <v-flex pt-2 pr-2 xs12>
+                                        {{xmsg}}
+                                    </v-flex>
+                                </v-layout>
+                            </v-flex>
+                        </v-layout>
+                    </v-flex>
+                </v-layout> 
+            </v-card-text>
+            <v-divider></v-divider>
+            <v-card-actions>
+                <v-btn
+                    color="error"
+                    flat
+                    @click="forgetAlert()"
+                >
+                Abaikan
+                </v-btn>
+                <v-spacer></v-spacer>
+                <v-btn
+                    color="primary"
+                    flat
+                    @click="closeAlert()"
+                >
+                OK
+                </v-btn>
+            </v-card-actions>
+        </v-card>
+    </v-dialog>
+  
+</template>
+
+<style scoped>
+</style>
+
+<script>
+module.exports = {
+    props : ['status', 'msg'],
+    computed : {
+        xmsg() {
+            return this.msg
+        },
+        dialog: {
+            get() {
+                return this.status
+            },
+            set(val) {
+                 this.$emit('close-dialog-alert')
+            }
+        }
+    },
+    methods: {
+        closeAlert() {
+            this.$emit('close-dialog-alert')
+        },
+        forgetAlert() {
+            this.$emit('forget-dialog-alert')
+        }
+    }
+}
+</script>

common/oneDialogAlertValidation.vue

@@ -0,0 +1,56 @@
+<template>
+  
+    <v-dialog
+      v-model="dialog"
+      max-width="30%"
+    >
+        <v-card>
+            <v-card-title
+                class="headline grey lighten-2 pt-2 pb-2"
+                primary-title
+            >
+            Peringatan !
+            </v-card-title>
+            <v-card-text class="pt-2 pb-2" v-html="xmsg">
+            </v-card-text>
+            <v-divider></v-divider>
+            <v-card-actions>
+                <v-btn
+                    color="primary"
+                    flat
+                    @click="closeAlertValidation()"
+                >
+                Tutup
+                </v-btn>
+            </v-card-actions>
+        </v-card>
+    </v-dialog>
+  
+</template>
+
+<style scoped>
+</style>
+
+<script>
+module.exports = {
+    props : ['status', 'msg'],
+    computed : {
+        xmsg() {
+            return this.msg
+        },
+        dialog: {
+            get() {
+                return this.status
+            },
+            set(val) {
+                 this.$emit('close-dialog-alert-validation')
+            }
+        }
+    },
+    methods: {
+        closeAlertValidation() {
+            this.$emit('close-dialog-alert-validation')
+        }
+    }
+}
+</script>

common/oneDialogConfirm.vue

@@ -0,0 +1,49 @@
+<template>
+  <v-layout row justify-center>
+    <v-dialog v-model="dialog" persistent max-width="290">
+      <v-card>
+        <v-card-title class="headline">Konfirmasi</v-card-title>
+        <v-card-text>{{ init_text }}</v-card-text>
+        <v-card-actions>
+          <v-spacer></v-spacer>
+          <v-btn color="green darken-1" flat @click="dialog = false">Batal</v-btn>
+          <v-btn color="green darken-1" dark @click="confirm">{{ init_button_confirm }}</v-btn>
+        </v-card-actions>
+      </v-card>
+    </v-dialog>
+  </v-layout>
+</template>
+
+<script>
+module.exports = {
+    props : ['text', 'data', 'button_confirm'],
+
+    data () {
+        return {
+            init_text : this.text ? this.text : 'Apakah anda akan menghapus data tersebut ?',
+            init_data : this.data ? this.data : null,
+            init_button_confirm : this.button_confirm ? this.button_confirm : 'Hapus'
+        }
+    },
+
+    computed : {
+        dialog : {
+            get () {
+                return this.$store.state.dialog_confirm
+            },
+            set (v) {
+                this.$store.commit('update_dialog_confirm', v)
+            }
+            
+        }
+    },
+
+    methods : {
+        confirm : function() {
+            this.dialog = false
+            console.log('Confirm dialog : confirmed')
+            this.$emit('confirm', {data: this.init_data});
+        }
+    }
+}
+</script>

common/oneDialogErrorFajri.vue

@@ -0,0 +1,71 @@
+<template>
+  
+    <v-dialog
+      v-model="dialog"
+      max-width="30%"
+    >
+        <v-card>
+            <v-card-title
+                class="headline error pt-2 pb-2"
+                primary-title
+                dark
+            >
+            Peringatan !
+            </v-card-title>
+            <v-card-text class="pt-2 pb-2">
+                <v-layout row>
+                    <v-flex xs12 d-flex>
+                        <v-layout row>
+                            <v-flex pb-1 xs12>
+                                <v-layout row>
+                                    <v-flex v-html="xmsg" pt-2 pr-2 xs12>
+                                       
+                                    </v-flex>
+                                </v-layout>
+                            </v-flex>
+                        </v-layout>
+                    </v-flex>
+                </v-layout> 
+            </v-card-text>
+            <v-divider></v-divider>
+            <v-card-actions>
+                <v-spacer></v-spacer>
+                <v-btn
+                    color="primary"
+                    flat
+                    @click="closeError()"
+                >
+                OK
+                </v-btn>
+            </v-card-actions>
+        </v-card>
+    </v-dialog>
+  
+</template>
+
+<style scoped>
+</style>
+
+<script>
+module.exports = {
+    props : ['status', 'msg'],
+    computed : {
+        xmsg() {
+            return this.msg
+        },
+        dialog: {
+            get() {
+                return this.status
+            },
+            set(val) {
+                 this.$emit('close-dialog-error')
+            }
+        }
+    },
+    methods: {
+        closeError() {
+            this.$emit('close-dialog-error')
+        }
+    }
+}
+</script>

common/oneDialogInfo.vue

@@ -0,0 +1,70 @@
+<template>
+  
+    <v-dialog
+      v-model="dialog"
+      max-width="30%"
+    >
+        <v-card>
+            <v-card-title
+                class="headline info pt-2 pb-2"
+                primary-title
+            >
+            Informasi
+            </v-card-title>
+            <v-card-text class="pt-2 pb-2">
+                <v-layout row>
+                    <v-flex xs12 d-flex>
+                        <v-layout row>
+                            <v-flex pb-1 xs12>
+                                <v-layout row>
+                                    <v-flex v-html="xmsg" pt-2 pr-2 xs12>
+                                       
+                                    </v-flex>
+                                </v-layout>
+                            </v-flex>
+                        </v-layout>
+                    </v-flex>
+                </v-layout> 
+            </v-card-text>
+            <v-divider></v-divider>
+            <v-card-actions>
+                <v-spacer></v-spacer>
+                <v-btn
+                    color="primary"
+                    flat
+                    @click="closeInfo()"
+                >
+                OK
+                </v-btn>
+            </v-card-actions>
+        </v-card>
+    </v-dialog>
+  
+</template>
+
+<style scoped>
+</style>
+
+<script>
+module.exports = {
+    props : ['status', 'msg'],
+    computed : {
+        xmsg() {
+            return this.msg
+        },
+        dialog: {
+            get() {
+                return this.status
+            },
+            set(val) {
+                 this.$emit('close-dialog-info')
+            }
+        }
+    },
+    methods: {
+        closeInfo() {
+            this.$emit('close-dialog-info')
+        }
+    }
+}
+</script>

common/oneDialogLoading.vue

@@ -0,0 +1,63 @@
+<template>
+<v-dialog
+    v-model="dialog"
+    scrollable fullscreen 
+    persistent
+    transition="dialog-transition"
+>
+    <v-card
+        color="transparent"
+        dark
+      >
+        <v-card-text>
+
+            <v-layout row wrap class="vertical-center">
+                <v-flex xs4>&nbsp;</v-flex>
+                <v-flex xs4>
+                    <v-card color="primary">
+                        <v-card-text>
+                            Mohon tunggu sebentar ...
+                            <v-progress-linear
+                                indeterminate
+                                color="white"
+                                class="mb-0"
+                            ></v-progress-linear>        
+                        </v-card-text>
+                    </v-card>
+                    
+                </v-flex>
+                <v-flex xs4>&nbsp;</v-flex>
+            </v-layout>
+          
+        </v-card-text>
+      </v-card>
+</v-dialog>
+</template>
+
+<style>
+.transparent {
+   background-color: rgba(255, 255, 255, 0.35) !important;
+   border-color: transparent!important;
+ }
+
+ .vertical-center {
+  margin-top: 20%
+}
+</style>
+
+<script>
+module.exports = {
+    data () {
+        return {
+            
+        }
+    },
+
+    computed : {
+        dialog : {
+            get () { return this.$store.state.dialog_loading },
+            set (v) { this.$store.commit('update_dialog_loading', v) }
+        }
+    }   
+}
+</script>

common/oneDialogPrint.vue

@@ -0,0 +1,76 @@
+<template>
+  
+    <v-dialog
+      v-model="dialog"
+      width="1000px"
+    >
+      
+
+      <v-card>
+        <v-card-title
+          class="headline grey lighten-2 pt-2 pb-2"
+          primary-title
+        >
+          Laporan
+        </v-card-title>
+        <v-card-text class="pt-2 pb-2">
+
+          <v-layout>
+              <v-flex xs12>
+                  <object data="https://anggrek.aplikasi.web.id/one-ui/test/vuex/common/under-cons.pdf"
+                    width="100%"></object>
+              </v-flex>
+          </v-layout>
+          
+        </v-card-text>
+        <v-divider></v-divider>
+
+        <v-card-actions>
+          <v-spacer></v-spacer>
+
+          <v-btn
+            color="primary"
+            @click="dialog = false"
+            flat
+          >
+            Tutup
+          </v-btn>
+
+        </v-card-actions>
+      </v-card>
+    </v-dialog>
+  
+</template>
+
+<style scoped>
+</style>
+
+<script>
+module.exports = {
+    components : {
+    },
+    methods : {
+       tuing: function() {
+          alert('x')
+       },
+
+        processMee () {
+            this.$store.dispatch('order/process')
+        }
+    },
+    computed : {
+       dialog: {
+          get() {
+             return this.$store.state.order.confirm_process_dialog_is_active;
+          },
+          set(val) {
+             this.$store.commit('order/update_confirm_process_dialog_is_active', val);
+          }
+       },
+
+       queue_number () {
+         return this.$store.state.order.queue_number
+       }
+    }
+}
+</script>

common/oneDialogPrintX.vue

@@ -0,0 +1,71 @@
+<template>
+                <div class="text-xs-center">
+                    <v-dialog
+                    v-model="dialog"
+                    :width="xwidth"
+                    persistent 
+                    >
+                    <v-card >
+                        <v-card-title
+                        class="headline grey lighten-2"
+                        primary-title
+                        >
+                        {{xtitle}}
+                        </v-card-title>
+
+                        <v-card-text >
+                        <object  style="overflow: hidden;" width="100%" :height="xheight" :data="xurl"></object>
+                        </v-card-text>
+
+                        <v-divider></v-divider>
+
+                        <v-card-actions>
+                        <v-spacer></v-spacer>
+                        <v-btn
+                            color="primary"
+                            flat
+                            @click="closeDialog()"
+                        >
+                            Tutup
+                        </v-btn>
+                        </v-card-actions>
+                    </v-card>
+                    </v-dialog>
+                </div>
+            </template>
+
+<style scoped>
+</style>
+
+<script>
+module.exports = {
+    props : ['title','width','height','status','urlprint'],
+    computed : {
+        dialog: {
+            get() {
+                return this.status
+            },
+            set(val) {
+                this.status = val
+            }
+        },
+        xurl(){
+            return this.urlprint
+        },
+        xwidth(){
+            return this.width
+        },
+        xheight(){
+            return this.height
+        },
+        xtitle(){
+            return this.title
+        }
+    },
+    methods: {
+        closeDialog() {
+            this.$emit('close-dialog-print')
+        }
+    }
+}
+</script>

common/oneFieldVerification.1.vue

@@ -0,0 +1,121 @@
+<template>
+    <v-layout>
+        
+            <v-checkbox
+                v-model="init_value"
+                @change="changeLahBrooo"
+                
+                hide-details class="shrink mr-2"
+            ></v-checkbox>
+        
+        
+            <v-text-field
+                :label="__label"
+                placeholder="Alasan"
+                outline
+                :disabled=x_disabled
+                :error-messages="init_error ? x_error_messages : ''"
+                :error_count="init_error ? x_error_count : 0 "
+                :error=init_error
+                :hide-details=!init_error
+                v-model=init_note
+            ></v-text-field>
+
+            
+        
+    </v-layout>
+</template>
+
+<script>
+module.exports = {
+    props : ['label', 'value', 'is_error', 'note'],
+    mounted: function() {
+      this.$nextTick( function() {
+         this.init_note = this.note ? this.note : "";
+         this.init_value = this.value;
+      })
+   },
+
+    data () {
+        return {
+            init_value : false,
+            init_note : ""
+        }
+        
+    },
+
+    methods : {
+        changeLahBrooo (n, o) {
+            if (n)  {
+                this.init_note = "";
+                // this.init_error = false;
+            } /* else {
+                if (this.init_note.length < 1)
+                    this.init_error = true;
+                else
+                    this.init_error = false;
+            }*/
+
+            var prm = {checked: n, note: this.init_note, error: this.init_error};
+            this.$emit('x_change',prm);
+            console.log('emit change');
+            
+            // this.x_note = "aaaaaaaaaaaaaaaaaaa"
+            // alert(this.x_note)
+        }
+    },
+    computed : {
+        __label () {
+            if (this.label)
+                return this.label;
+
+            return "";
+        },
+
+        x_disabled () {
+            // return false;
+            if (this.init_value === "true" || this.init_value === true)
+                return true;
+            return false;
+
+        },
+
+        init_error () {
+            
+            if ((this.init_value === "false" || this.init_value === false) && this.init_note.length < 1)
+                return true;
+
+            else {
+                // this.x_note = "";
+                return false;
+            }
+
+
+        },
+
+        x_error_count () {
+            // return 0;
+            if (this.init_error)
+                return 1;
+
+            return 0;
+        },
+
+        x_error_messages () {
+            if (this.init_error)
+                return ["Kolom ini harus diisi !"];
+
+            return [];
+        },
+        
+        x_note () {
+            
+            if (this.note)
+            return this.note;
+
+            return "";
+            
+        }
+    }
+}
+</script>

common/oneFieldVerification.vue

@@ -0,0 +1,125 @@
+<template>
+    <v-layout>
+        
+            <v-checkbox
+                v-model="init_value"
+                @change="checkbox_change"
+                
+                hide-details class="shrink mr-2"
+                :disabled="init_disabled"
+            ></v-checkbox>
+        
+        
+            <v-text-field
+                :label="__label"
+                placeholder="Alasan"
+                outline
+                :disabled="x_disabled || init_disabled"
+                :error-messages="init_error && !init_disabled ? x_error_messages : ''"
+                :error_count="init_error && !init_disabled ? x_error_count : 0 "
+                :error="init_error && !init_disabled"
+                :hide-details=!init_error
+                v-model=init_note
+                @input="note_change"
+            ></v-text-field>
+
+            
+        
+    </v-layout>
+</template>
+
+<script>
+module.exports = {
+    props : ['label', 'value', 'is_error', 'note', 'disabled'],
+    mounted: function() {
+      this.$nextTick( function() {
+         this.init_note = this.note ? this.note : "";
+         this.init_value = this.value;
+      })
+   },
+
+    data () {
+        return {
+            init_value : false,
+            init_note : ""
+        }
+        
+    },
+
+    methods : {
+        checkbox_change (n, o) {
+            if (n)  {
+                this.init_note = "";
+            }
+
+            var prm = {checked: n, note: this.init_note, error: this.init_error};
+            this.$emit('x_change', prm);
+            this.$emit('change', prm);
+            // console.log('"' + this.label + '" changed value to : ' + n);
+        },
+
+        note_change (n) {
+            let prm = { checked: this.init_value, note: n, error: this.init_error };
+            this.$emit('change', prm);
+            this.$emit('input', n);
+        }
+    },
+    computed : {
+        __label () {
+            if (this.label)
+                return this.label;
+
+            return "";
+        },
+
+        x_disabled () {
+            // return false;
+            if (this.init_value === "true" || this.init_value === true)
+                return true;
+            return false;
+
+        },
+
+        init_error () {
+            
+            if ((this.init_value === "false" || this.init_value === false) && this.init_note.length < 1)
+                return true;
+
+            else {
+                // this.x_note = "";
+                return false;
+            }
+
+
+        },
+
+        x_error_count () {
+            // return 0;
+            if (this.init_error)
+                return 1;
+
+            return 0;
+        },
+
+        x_error_messages () {
+            if (this.init_error)
+                return ["Kolom ini harus diisi !"];
+
+            return [];
+        },
+        
+        x_note () {
+            
+            if (this.note)
+            return this.note;
+
+            return "";
+            
+        },
+
+        init_disabled () {
+            return this.disabled ? this.disabled : false
+        }
+    }
+}
+</script>

common/oneFieldVerificationDeliveryPayment.vue

@@ -0,0 +1,126 @@
+<template>
+     <div>
+        <v-layout row v-if="xtype == 'reguler'">
+            <v-flex pb-1 xs12>
+                <v-layout row>
+                    <v-flex pl-3 pt-2  xs1>
+                        <v-checkbox
+                            v-model="xcbx"
+                            hide-details 
+                        ></v-checkbox>
+                    </v-flex>
+                    <v-flex pt-2  xs8 >
+                        <v-text-field
+                            :label="xlabel"
+                            :disabled="xdisabled"
+                            :error="xerror"
+                            :error-messages="xerror ? xerrormessages : ''"
+                            :error_count="xerror ? xerrorcount : 0 "
+                            :hide-details=!xerror
+                            placeholder="Alasan"
+                            outline
+                            v-model="xtxt"
+                        ></v-text-field>
+                    </v-flex>
+                </v-layout>
+            </v-flex>
+        </v-layout>
+   
+        <v-layout v-else-if="xtype == 'indigo'">
+            <v-flex pb-1 xs12>
+                <v-layout row>
+                    <v-flex pl-3 pt-2  xs1 class="indigo lighten-5">
+                        <v-checkbox
+                            v-model="xcbx"
+                            hide-details 
+                        ></v-checkbox>
+                    </v-flex>
+                    <v-flex pt-2 pb-2 xs8 class="indigo lighten-5">
+                        <v-text-field
+                            :label="xlabel"
+                            :disabled="xdisabled"
+                            :error="xerror"
+                            :error-messages="xerror ? xerrormessages : ''"
+                            :error_count="xerror ? xerrorcount : 0 "
+                            :hide-details=!xerror
+                            placeholder="Alasan"
+                            outline
+                            v-model="xtxt"
+                        ></v-text-field>
+                    </v-flex>
+                    <v-flex class="indigo lighten-5" pt-3  xs3>
+                        <v-layout align-center justify-center row>
+                                    <v-icon large @click="deleteData()" color="red">delete</v-icon>
+                                
+                        </v-layout>
+                    </v-flex>
+                </v-layout>
+            </v-flex>
+        </v-layout>
+        </div>
+</template>
+
+<script>
+module.exports = {
+    props : ['xdatalabel','xdatacbx','xdatatxt','xdatatype'],
+    computed :{
+        xtype : function(type) {
+            return this.xdatatype 
+        },
+        xcbx: {
+            get() {
+                return this.xdatacbx
+            },
+            set(val) {
+                if(val == true && this.xdatatxt !== "")
+                    this.$emit('update-data-txt', "")
+                this.$emit('update-data-cbx', val)
+            }
+        },
+        xtxt: {
+            get() {
+                return this.xdatatxt
+            },
+            set(val) {
+                this.$emit('update-data-txt', val)
+            }
+        },
+        xlabel(){
+            if (this.xdatalabel)
+                return this.xdatalabel;
+
+            return "";
+        },
+        xdisabled () {
+            if (this.xcbx === "true" || this.xcbx === true)
+                return true;
+            return false;
+
+        },
+        xerror () {
+             if ((this.xcbx === "false" || this.xcbx === false) && this.xtxt.length < 1)
+                return true;
+            else {
+                return false;
+            }
+        },
+        xerrormessages () {
+            if (this.xerror)
+                return ["Alasan harus diisi !"];
+
+            return [];
+        },
+        xerrorcount () {
+            if (this.xerror)
+                return 1;
+
+            return 0;
+        }
+    },
+    methods: {
+        deleteData() {
+            this.$emit('update-data-delete', true)
+        }
+    }
+}
+</script>

common/oneFieldVerificationFalse.vue

@@ -0,0 +1,72 @@
+<template>
+    <v-layout>     
+            <v-checkbox
+                v-model="init_value"
+                @change="changeCbx"
+                hide-details class="shrink mr-2"
+            ></v-checkbox>
+        
+            <v-text-field
+                :label="__label"
+                outline
+                v-model=init_note
+            ></v-text-field>
+    </v-layout>
+</template>
+
+<script>
+module.exports = {
+    props : ['label', 'value', 'note'],
+    mounted: function() {
+      this.$nextTick( function() {
+         this.init_note = this.note ? this.note : "";
+         this.init_value = this.value;
+      })
+   },
+
+    data () {
+        return {
+            init_value : false,
+            init_note : ""
+        }
+        
+    },
+
+    methods : {
+        changeCbx (n, o) {
+        /*    if (n)  {
+                this.init_note = "";
+            } 
+         */
+            var prm = {checked: n, note: this.init_note};
+            this.$emit('x_change',prm);
+         
+        }
+    },
+    computed : {
+        __label () {
+            if (this.label)
+                return this.label;
+
+            return "";
+        },
+        __placeholder () {
+            if (this.placeholder)
+                return this.placeholder;
+
+            return "";
+        },
+        x_disabled () {
+            if (this.init_value === "true" || this.init_value === true)
+                return true;
+            return false;
+        },
+        x_note () {
+            if (this.note)
+                return this.note;
+
+            return "";
+        }
+    }
+}
+</script>

common/oneFieldVerificationPatientDoctor.vue

@@ -0,0 +1,84 @@
+<template>
+    <div>
+    <v-layout>
+        
+            <v-checkbox
+                v-model="xcbx"
+                hide-details class="shrink mr-2"
+            ></v-checkbox>
+        
+            <v-text-field
+                :label="xlabel"
+                :disabled="xdisabled"
+                :error="xerror"
+                :error-messages="xerror ? xerrormessages : ''"
+                :error_count="xerror ? xerrorcount : 0 "
+                :hide-details=!xerror
+                placeholder="Alasan"
+                outline
+                v-model="xtxt"
+            ></v-text-field>
+
+            
+        
+    </v-layout>
+    </div>
+</template>
+
+<script>
+module.exports = {
+    props : ['xdatalabel','xdatacbx','xdatatxt'],
+    computed :{
+        xcbx: {
+            get() {
+                return this.xdatacbx
+            },
+            set(val) {
+                if(val == true && this.xdatatxt !== "")
+                    this.$emit('update-data-txt', "")
+                this.$emit('update-data-cbx', val)
+            }
+        },
+        xtxt: {
+            get() {
+                return this.xdatatxt
+            },
+            set(val) {
+                this.$emit('update-data-txt', val)
+            }
+        },
+        xlabel(){
+            if (this.xdatalabel)
+                return this.xdatalabel;
+
+            return "";
+        },
+        xdisabled () {
+            if (this.xcbx === "true" || this.xcbx === true)
+                return true;
+            return false;
+
+        },
+        xerror () {
+             if ((this.xcbx === "false" || this.xcbx === false) && this.xtxt.length < 1)
+                return true;
+            else {
+                return false;
+            }
+        },
+        xerrormessages () {
+            if (this.xerror)
+                return ["Alasan harus diisi !"];
+
+            return [];
+        },
+        xerrorcount () {
+            if (this.xerror)
+                return 1;
+
+            return 0;
+        }
+        
+    }
+}
+</script>

common/oneFieldVerificationSupply.vue

@@ -0,0 +1,82 @@
+<template>
+    <div>
+    <v-layout>
+        
+            <v-checkbox
+                v-model="xcbx"
+                hide-details class="shrink mr-2"
+            ></v-checkbox>
+        
+            <v-text-field
+                :label="xlabel"
+                :disabled="xdisabled"
+                :error="xerror"
+                :error-messages="xerror ? xerrormessages : ''"
+                :error_count="xerror ? xerrorcount : 0 "
+                :hide-details=!xerror
+                placeholder="Alasan"
+                outline
+                v-model="xtxt"
+            ></v-text-field>
+
+            
+        
+    </v-layout>
+    </div>
+</template>
+
+<script>
+module.exports = {
+    props : ['xdatalabel','xdatacbx','xdatatxt'],
+    computed :{
+        xcbx: {
+            get() {
+                return this.xdatacbx
+            },
+            set(val) {
+                this.$emit('update-data-cbx', val)
+            }
+        },
+        xtxt: {
+            get() {
+                return this.xdatatxt
+            },
+            set(val) {
+                this.$emit('update-data-txt', val)
+            }
+        },
+        xlabel(){
+            if (this.xdatalabel)
+                return this.xdatalabel;
+
+            return "";
+        },
+        xdisabled () {
+            if (this.xcbx === "true" || this.xcbx === true)
+                return true;
+            return false;
+
+        },
+        xerror () {
+             if ((this.xcbx === "false" || this.xcbx === false) && this.xtxt.length < 1)
+                return true;
+            else {
+                return false;
+            }
+        },
+        xerrormessages () {
+            if (this.xerror)
+                return ["Alasan harus diisi !"];
+
+            return [];
+        },
+        xerrorcount () {
+            if (this.xerror)
+                return 1;
+
+            return 0;
+        }
+        
+    }
+}
+</script>

common/oneTestingComponent.vue

@@ -0,0 +1,31 @@
+<template>
+    <v-layout>
+        
+            <input type="text"  v-model="xdata" />
+
+            
+        
+    </v-layout>
+</template>
+
+<script>
+module.exports = {
+    props : ['textdata'],
+    methods: {
+      changeDataX(item) {
+        this.$emit('update-data-x', item)
+      }
+    },
+    computed :{
+        xdata: {
+            get() {
+                return this.textdata
+            },
+            set(val) {
+                this.$emit('update-data-x', val)
+            }
+      }
+        
+    }
+}
+</script>

common/oneTestingComponent2.vue

@@ -0,0 +1,80 @@
+<template>
+    <v-layout>
+        
+            <v-checkbox
+                v-model="xcbx"
+                hide-details class="shrink mr-2"
+            ></v-checkbox>
+        
+            <v-text-field
+                :label="xlabel"
+                :disabled="xdisabled"
+                :error="xerror"
+                :error-messages="xerror ? xerrormessages : ''"
+                :error_count="xerror ? xerrorcount : 0 "
+                :hide-details=!xerror
+                placeholder="Alasan"
+                outline
+                v-model="xtxt"
+            ></v-text-field>
+
+            
+        
+    </v-layout>
+</template>
+
+<script>
+module.exports = {
+    props : ['xdatalabel','xdatacbx','xdatatxt'],
+    computed :{
+        xcbx: {
+            get() {
+                return this.xdatacbx
+            },
+            set(val) {
+                this.$emit('update-data-cbx', val)
+            }
+        },
+        xtxt: {
+            get() {
+                return this.xdatatxt
+            },
+            set(val) {
+                this.$emit('update-data-txt', val)
+            }
+        },
+        xlabel(){
+            if (this.xdatalabel)
+                return this.xdatalabel;
+
+            return "";
+        },
+        xdisabled () {
+            if (this.xcbx === "true" || this.xcbx === true)
+                return true;
+            return false;
+
+        },
+        xerror () {
+             if ((this.xcbx === "false" || this.xcbx === false) && this.xtxt.length < 1)
+                return true;
+            else {
+                return false;
+            }
+        },
+        xerrormessages () {
+            if (this.xerror)
+                return ["Alasan harus diisi !"];
+
+            return [];
+        },
+        xerrorcount () {
+            if (this.xerror)
+                return 1;
+
+            return 0;
+        }
+        
+    }
+}
+</script>

fo/one-dashboard-que/api/queue.js

@@ -0,0 +1,39 @@
+const URL = "/one-api/v1/su/queue/";
+
+export async function now() {
+   try {
+      var resp = await axios.post(URL + 'now');
+      if (resp.status != 200) {
+         return {
+            status: "ERR",
+            message: resp.statusText
+         };
+      }
+      let data = resp.data;
+      return data;
+   } catch(e) {
+      return {
+         status: "ERR",
+         message: e.message
+      };
+   }
+}
+
+export async function status() {
+   try {
+      var resp = await axios.post(URL + 'status');
+      if (resp.status != 200) {
+         return {
+            status: "ERR",
+            message: resp.statusText
+         };
+      }
+      let data = resp.data;
+      return data;
+   } catch(e) {
+      return {
+         status: "ERR",
+         message: e.message
+      };
+   }
+}

fo/one-dashboard-que/components/Antrian.js

@@ -0,0 +1,28 @@
+
+export default {
+   extends: VueChartJs.Bar,
+   mixins: [VueChartJs.mixins.reactiveProp],
+   mounted () {
+      this.renderChart(this.chartData, 
+      {
+         responsive: true, 
+         maintainAspectRatio: false,
+         scales: {
+            yAxes : [{
+               ticks: {
+                  beginAtZero : true
+               }
+            }]
+         },
+         events: ['click','mousemove','touchstart'],
+         tooltips: {
+            mode:'index',
+         },
+         title : {
+            display: true,
+            text: ['Antrian']
+         }
+      })
+   }
+}
+

fo/one-dashboard-que/components/Line.js

@@ -0,0 +1,27 @@
+export default {
+   extends: VueChartJs.Line,
+   mixins: [VueChartJs.mixins.reactiveProp],
+   mounted () {
+      this.renderChart(this.chartData, 
+      {
+         responsive: true, 
+         maintainAspectRatio: false,
+         scales: {
+            yAxes : [{
+               ticks: {
+                  beginAtZero : true
+               }
+            }]
+         },
+         events: ['click','mousemove','touchstart'],
+         tooltips: {
+            mode:'index',
+         },
+         title : {
+            display: true,
+            text: ['Antrian Status']
+         }
+      })
+   }
+}
+

fo/one-dashboard-que/components/SaatIni.js

@@ -0,0 +1,13 @@
+
+const reactiveProp = VueChartJs.mixins.reactiveProp
+export default {
+   mixins: [reactiveProp],
+   props: ['options'],
+   extends: VueChartJs.Pie,
+   mounted () {
+      this.renderChart(
+         this.chartData, this.options
+      )
+   }
+}
+

fo/one-dashboard-que/index.php

@@ -0,0 +1,178 @@
+<!DOCTYPE html>
+<html lang="en">
+   <head>
+      <meta charset="UTF-8">
+      <meta name="viewport" content="width=device-width, initial-scale=1.0">
+      <meta http-equiv="X-UA-Compatible" content="ie=edge">
+      <title>One</title>
+      <link rel="stylesheet" href="../../libs/vendor/css/google-fonts.css">
+      <link rel="stylesheet" href="../../libs/vendor/css/icomoon-fonts.css">
+      <link rel="stylesheet" href="../../libs/vendor/css/vuetify.min.css">
+   </head>
+   <body>
+      <div v-cloak id="app">
+         <v-app id="smartApp" >
+            <one-navbar></one-navbar>
+            <v-content style="background:#F5E8DF!important" >
+               <v-container fluid fill-height class="pl-1 pr-1 pt-2 pb-2">
+                  <v-layout row wrap >
+                     <v-flex xs12 class="one" fill-height pa-1>
+                        <v-container>
+                        <v-layout row wrap>
+                           <v-flex xs12 md6 style="text-align:center">
+                           Antrian Saat Ini {{totalAntrian}}
+                           <one-now :chart-data="chartQueueNow" :options="chartOption" ></one-now>
+                           </v-flex>
+                           <v-flex xs12 md6>
+                              <one-antrian :chart-data="chartAntrian"></one-antrian>
+                           </v-flex>
+                           <v-flex xs12 md6>
+                              <one-line :chart-data="chartLine"></one-line>
+                           </v-flex>
+                        </v-layout>
+                        </v-container>
+                     </v-flex>
+                  </v-layout>
+               </v-container>
+            </v-content>
+            <one-footer> </one-footer>
+         </v-app>
+      </div>
+
+      <!-- Vendor -->
+      <script src="../../libs/vendor/moment.min.js"></script>
+      <script src="../../libs/vendor/numeral.min.js"></script>
+      <script src="../../libs/vendor/moment-locale-id.js"></script>
+      <script src="../../libs/vendor/lodash.js"></script>
+      <script src="../../libs/vendor/axios.min.js"></script>
+      <script src="../../libs/vendor/vue.js"></script>
+      <script src="../../libs/vendor/vuex.js"></script>
+      <script src="../../libs/vendor/vuetify.js"></script>
+      <script src="../../libs/vendor/Chart.min.js"></script>
+      <script src="../../libs/vendor/vue-chartjs.min.js"></script>
+      <script src="../../libs/vendor/httpVueLoader.js"></script>
+      <script src="../../libs/one_global.js"></script>
+      <script src="../../libs/vendor/socket.io.js"></script>
+      <!-- App Script -->
+<?php
+$ts = "?ts=" . Date("ymdhis");
+?>
+<script type="module">
+
+
+import { store } from './store.js<?php echo $ts ?>';
+import LineChart from './components/Antrian.js';
+import SaatIni from './components/SaatIni.js';
+import Line from './components/Line.js';
+
+//for testing
+var socketIoUrl = "http://" + window.location.host + ":9090/";
+
+new Vue({
+store,
+   el: '#app',
+   methods: {
+   },
+   data : {
+      tsInterval:0,
+      socket : io.connect(socketIoUrl,{forceNew:false})
+   },
+   components: {
+      'one-navbar': httpVueLoader('../../apps/components/oneNavbarComponent.vue'),
+      'one-footer': httpVueLoader('../../apps/components/oneFooter.vue'),
+      'one-antrian': LineChart,
+      'one-line': Line,
+      'one-now': SaatIni
+   },
+   computed: {
+      totalAntrian() {
+         let c_data = this.$store.state.queue.queue_now
+         return c_data[0] + c_data[1]
+      },
+      chartAntrian() {
+         let data = this.$store.state.queue.status
+         let c_data = {
+               labels: [ ],
+               datasets: [
+               ]
+         }
+         if (data.length > 0 ) {
+            c_data = {
+               labels: [ data[0].Hour , data[1].Hour, data[2].Hour ],
+               datasets: [
+                  {
+                     label: 'Total',
+                     data: [ data[0].Total , data[1].Total, data[2].Total ],
+                     fill: false,
+                     borderColor: "rgb(51, 153, 51)",
+                     backgroundColor: "rgb(51, 153, 51)"
+                  },
+                  {
+                     label: '< 5 menit',
+                     data: [ data[0].Done , data[1].Done, data[2].Done ],
+                     fill: false,
+                     borderColor: "rgba(0, 153, 255,0.4)",
+                     backgroundColor: "rgba(0, 153, 255,0.6)"
+                  },
+                  {
+                     label: '> 5 menit',
+                     data: [ data[0].More5Min , data[1].More5Min, data[2].More5Min ], 
+                     fill: false,
+                     borderColor: "rgb(204, 0, 153)",
+                     backgroundColor: "rgb(204, 0, 153)"
+                  }
+               ]
+            }
+         } 
+         return c_data
+      },
+      chartQueueNow() {
+         let c_data = this.$store.state.queue.queue_now
+         let data = {
+            labels: ['< 5 menit', '> 5 menit'],
+            datasets: [{
+                  data: c_data,
+                  borderColor: ["rgb(51, 204, 51)","rgb(255, 51, 0)"],
+                  backgroundColor: ["rgb(51, 204, 51)","rgb(255, 51, 0)"],
+            }]
+         }
+         return data
+      },
+      chartOption() {
+         return {
+            responsive: true, 
+            maintainAspectRatio: false,
+            tooltips: {
+               mode:'index',
+            },
+            cutoutPercentage: 50,
+            title : {
+               display: false,
+               text: 'Antrian Saat Ini'
+            }
+         }
+      }
+   },
+   mounted(){
+      let self =this
+      this.socket.on("notification", function(msg) {
+           switch(msg.type) {
+              case "reload-fo" :
+                  self.$store.dispatch("queue/update")
+              break;
+           }
+      });
+      this.$store.dispatch("queue/update")
+   },
+   beforeDestroy() {
+      if (this.tsInterval > 0 ) clearTimeout(this.tsInterval)
+   }
+})
+</script>
+<style>
+[v-cloak] {
+   display: none
+}
+</style>
+</body>
+</html>

fo/one-dashboard-que/modules/queue.js

@@ -0,0 +1,28 @@
+import * as api from "../api/queue.js"
+
+export default  {
+   namespaced: true,
+   state: {
+      queue_now : [0,0],
+      status: []
+   },
+   mutations: {
+      update_queue_now(state,status) {
+         state.queue_now= status
+      },
+      update_status(state,status) {
+         state.status = status
+      },
+   },
+   actions: {
+      update: async function(context) {
+         let data = await api.now()
+         let q_now = [ parseInt(data.data.Less5Min), parseInt(data.data.More5Min) ]
+         context.commit("update_queue_now", q_now) 
+
+         data = await api.status()
+         let last3 = data.data
+         context.commit("update_status", last3) 
+      }
+   }
+}

fo/one-dashboard-que/store.js

@@ -0,0 +1,20 @@
+// State
+//  data ...
+// Mutations
+//
+//
+// Actions
+import system from "../../apps/modules/system/system.js"
+import queue from "./modules/queue.js"
+export const store = new Vuex.Store({
+    modules: {
+        system:system,
+        queue: queue
+    },
+    state: {
+    },
+    mutations: {
+    },
+    actions: {
+    }
+});

index.php

@@ -0,0 +1,3 @@
+<?php
+header('Location: /one-ui/test/vuex/one-login/');
+?>

libs/fonts-icon-adhi/icomoon.svg

@@ -0,0 +1,27 @@
+<?xml version="1.0" standalone="no"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" >
+<svg xmlns="http://www.w3.org/2000/svg">
+<metadata>Generated by IcoMoon</metadata>
+<defs>
+<font id="icomoon" horiz-adv-x="1024">
+<font-face units-per-em="1024" ascent="960" descent="-64" />
+<missing-glyph horiz-adv-x="1024" />
+<glyph unicode="&#x20;" horiz-adv-x="512" d="" />
+<glyph unicode="&#xe900;" glyph-name="check" d="M954.857 636.571q0-22.857-16-38.857l-491.429-491.429q-16-16-38.857-16t-38.857 16l-284.571 284.571q-16 16-16 38.857t16 38.857l77.714 77.714q16 16 38.857 16t38.857-16l168-168.571 374.857 375.429q16 16 38.857 16t38.857-16l77.714-77.714q16-16 16-38.857z" />
+<glyph unicode="&#xe901;" glyph-name="note" d="M204 958.2c-9-2.8-18-8.2-40.6-24.6-30-21.8-36.8-28.4-43.6-42.6-4.8-10-5.8-14.6-5.8-27.2 0-8.4 1.4-19 3-23.6 2.6-7.6 18.2-32.2 20.4-32.2s147.2 107.2 148 109.4c1.4 3.4-16.4 25.4-25.2 31.2-15.2 10-40.4 14.4-56.2 9.6zM278.2 899c-8-5.8-15.6-11.6-16.6-12.6-1.4-1.4 13.6-23.2 42.6-62.6 27.8-37.8 44.6-62.6 44.8-65.6 0-6.8-13.4-17.6-18.8-15-3.2 1.4-85 110.4-92 122.6-1.2 2-5.4-0.2-17.8-9-9-6.6-16-13-15.8-14.4 0.2-1.2 20.4-29.8 45-63.2 24.4-33.4 44.4-62.2 44.4-63.8 0-4.2-15.2-15.8-19.4-15-2 0.4-23.2 27.8-47.6 61-24.2 33.2-45 61.4-46 62.4-1.6 1.6-7.4-1.6-19.6-10.4-9.6-6.8-17.4-12.8-17.2-13.4 0-0.6 22.6-32 50.4-69.8l50.6-69 72.8-26.6c40-14.6 73.8-26.6 75.4-26.6 1.4 0 3.8 2 5.4 4.6 2.4 3.8 2.2 15-0.8 80.6-2.4 51.8-4.2 77.6-6 80.8-2.2 4-94.2 130.6-97.6 134.4-0.8 0.8-8-3.4-16.2-9.4zM382 742c3.4-3.4 4-6.6 4-19.4 0-8.6 0.6-26.8 1.2-40.6l1.2-25-16.4-11.6-16.2-11.6-36.4 12.4c-36.6 12.4-46 17.6-45 24.2 0.6 3.6 96.6 75.4 101.2 75.6 1.2 0 4.2-1.8 6.4-4zM358 872.6c0-0.6 17-24 38-51.8l37.8-50.6 154.6-0.6c154.4-0.6 154.6-0.6 166.4-5.2 32.8-12.4 54.6-35.2 64.6-67.4 3.4-11.4 3.6-26 3.6-295v-283l-4.4-14c-2.4-7.6-7.2-18.4-10.6-23.6-14.6-23-42-41.2-68-45.4-8.2-1.2-91.6-2-225-2-233.4 0-227.8-0.2-251.6 12.4-26 13.8-46.8 42.8-51.4 71.6-1.2 8.2-2 108.8-2 277.6v264.6l-39.4 52c-29.4 39-39.8 51.4-41 49-1-1.6-1.4-165.2-1.2-363.6l0.6-360.6 5.4-14.6c14.4-39.6 44.4-68.8 82.6-81l14-4.4h289c277.2 0 289.4 0.2 300 3.8 44.2 15 76.6 48.6 87 90.4 2.6 10.6 3 56.6 2.6 378l-0.6 365.8-4.6 13c-11.4 31.2-34.8 58-63 72-29.4 14.4-19 14-263.8 14-120.8 0-219.6-0.6-219.6-1.4zM441.6 662.2c-5.8-5.2-6.6-7-6.6-16.2s0.8-11 6.6-16.2l6.4-5.8h144c107.2 0 145.2 0.6 149 2.4 14.4 6.6 14.4 32.6 0 39.2-3.8 1.8-41.8 2.4-149 2.4h-144l-6.4-5.8zM294.8 542.4c-5.8-4.6-8.8-10.8-8.8-18.4s3-13.8 8.8-18.4c4-3.2 18.6-3.6 222.8-3.6 237.6 0 226.8-0.6 232 11 5.2 11.4 1.6 25.2-7.8 30.2-4.8 2.4-38.8 2.8-224.2 2.8-204.2 0-218.8-0.4-222.8-3.6zM294.8 420.4c-5.8-4.6-8.8-10.8-8.8-18.4s3-13.8 8.8-18.4c4-3.2 18.6-3.6 222.8-3.6 237.6 0 226.8-0.6 232 11 5.2 11.4 1.6 25.2-7.8 30.2-4.8 2.4-38.8 2.8-224.2 2.8-204.2 0-218.8-0.4-222.8-3.6zM296.2 299.2c-13-7.2-13.2-32.2-0.4-39.2 2.6-1.4 76.6-2 223.6-2 205 0 219.8 0.4 223.8 3.6 6 4.8 8.8 11 8.8 19.4 0 5.8-1.6 9-6.8 14.2l-6.8 6.8h-218.6c-177.8-0.2-219.6-0.6-223.6-2.8zM296.2 177.2c-13-7.2-13.2-32.2-0.4-39.2 2.6-1.4 76.6-2 223.6-2 205 0 219.8 0.4 223.8 3.6 6 4.8 8.8 11 8.8 19.4 0 5.8-1.6 9-6.8 14.2l-6.8 6.8h-218.6c-177.8-0.2-219.6-0.6-223.6-2.8z" />
+<glyph unicode="&#xe902;" glyph-name="speaker" d="M630.432 630.432c-11.488 8.8-27.968 6.528-36.672-4.992-8.832-11.552-6.56-27.968 4.928-36.704 34.944-26.304 61.728-80.704 61.536-144.48 0.256-70.976-33.024-129.952-73.376-152.288-12.64-7.104-17.056-23.168-9.952-35.776 4.832-8.48 13.728-13.248 22.848-13.248 4.384 0 8.832 1.088 12.928 3.36 61.504 35.424 99.744 111.52 100 197.92-0.16 77.888-31.328 147.040-82.24 186.208zM822.496 872.864c-11.52 8.768-27.936 6.56-36.736-4.928-8.768-11.52-6.592-27.968 5.024-36.736h-0.064c96.096-72.864 164.128-215.264 163.968-379.936 0.192-183.104-84-338.4-196.96-401.792-12.672-7.104-17.088-23.136-9.952-35.712 4.832-8.576 13.76-13.248 22.912-13.248 4.352 0 8.8 1.024 12.896 3.296 134.016 76.544 223.264 248.896 223.52 447.456-0.192 178.784-72.544 335.904-184.608 421.6zM858.144 447.36c-0.16 122.88-49.664 231.264-127.872 291.168-11.488 8.832-27.968 6.528-36.704-4.992-8.768-11.488-6.528-27.968 4.992-36.736v0.064c62.208-47.040 107.36-140.768 107.232-249.504 0.192-120.992-55.808-222.848-128.544-263.52-12.64-7.136-17.056-23.104-9.92-35.744 4.832-8.512 13.76-13.312 22.88-13.312 4.384 0 8.832 1.088 12.896 3.36 93.856 53.76 154.848 172.768 155.040 309.216zM-58.24 622.656v-390.016h236.992l337.408-281.184v960l-341.44-289.184-232.96 0.384z" />
+<glyph unicode="&#xe903;" glyph-name="edit" horiz-adv-x="960" d="M102.318 960h529.356c52.068 0 104.136-43.39 104.136-104.136v-138.847l-43.39-112.814v60.746h-633.492v-60.746h633.492l-60.746-138.847h-572.746v-60.746h546.712l-60.746-138.847h-485.966v-69.424h477.288l-17.356-234.305 199.593 208.271 17.356 34.712v-164.881c0-52.068-43.39-104.136-104.136-104.136h-529.356c-52.068 0-104.136 43.39-104.136 104.136v824.407c0 52.068 43.39 104.136 104.136 104.136zM536.216 14.102l17.356 234.305 260.339 607.458c60.746 17.356 112.814-8.678 147.525-60.746l-260.339-607.458-164.881-164.881zM779.199 725.695c43.39 0 78.102-17.356 112.814-52.068l52.068 112.814c-34.712 34.712-69.424 52.068-112.814 52.068l-52.068-112.814zM588.284 274.441c0 0 8.678 8.678 8.678 8.678 8.678 8.678 17.356 0 17.356-8.678v0l156.203 373.153c-8.678 0-17.356 0-26.034 0l-156.203-364.475zM631.674 265.763c8.678 0 17.356 0 26.034-8.678l156.203 373.153c-8.678 8.678-17.356 8.678-26.034 8.678l-156.203-373.153zM675.064 248.407c8.678 0 8.678 0 8.678 0s8.678 0 8.678-8.678c0 0 0-8.678 0-17.356l156.203 364.475c-8.678 8.678-17.356 17.356-26.034 17.356l-156.203-364.475zM562.25 109.559l34.712-17.356 86.78 86.78c8.678 26.034 8.678 34.712 8.678 43.39 0 0 0 0-8.678 8.678 0 0-8.678 0-8.678 0-8.678 0-17.356-17.356-26.034-26.034 8.678 17.356 8.678 34.712 0 43.39 0 0-8.678 8.678-8.678 8.678s-8.678 0-8.678 0-17.356-8.678-26.034-26.034c8.678 17.356 8.678 34.712 0 43.39 0 0 0 0-8.678 0 0 0-8.678 0-8.678 0-8.678-8.678-17.356-17.356-26.034-34.712l-8.678-121.492zM622.996 196.339h-34.712v-69.424h8.678l17.356 17.356 17.356 52.068z" />
+<glyph unicode="&#xe904;" glyph-name="add" d="M512 940.679c-289.391 0-512-222.609-512-512s222.609-512 512-512c289.391 0 512 222.609 512 512s-222.609 512-512 512zM912.696 428.679v0c0-44.522-44.522-89.043-89.043-89.043h-244.87v-244.87c0-44.522-44.522-89.043-89.043-89.043v0c-44.522 0-89.043 44.522-89.043 89.043v244.87h-244.87c-44.522 0-89.043 44.522-89.043 89.043v0c0 44.522 44.522 89.043 89.043 89.043h244.87v244.87c0 44.522 44.522 89.043 89.043 89.043v0c44.522 0 89.043-44.522 89.043-89.043v-244.87h244.87c44.522 0 89.043-44.522 89.043-89.043z" />
+<glyph unicode="&#xe905;" glyph-name="del" horiz-adv-x="816" d="M743.367 717.261h-707.491v-670.255c0-93.091 74.473-148.945 148.945-148.945h428.218c93.091 0 148.945 74.473 148.945 148.945v670.255zM54.495 866.206h316.509v37.236c0 18.618 18.618 37.236 37.236 37.236v0c18.618 0 37.236-18.618 37.236-37.236v-37.236h316.509c37.236 0 55.855-18.618 55.855-55.855v0c0-37.236-18.618-55.855-55.855-55.855h-707.491c-37.236 0-55.855 18.618-55.855 55.855v0c0 37.236 18.618 55.855 55.855 55.855zM203.44 605.552v0c18.618 0 18.618-18.618 18.618-18.618v-539.927c0-18.618-18.618-18.618-18.618-18.618v0c-18.618 0-18.618 18.618-18.618 18.618v539.927c0 18.618 18.618 18.618 18.618 18.618zM333.767 605.552v0c18.618 0 18.618-18.618 18.618-18.618v-539.927c0-18.618-18.618-18.618-18.618-18.618v0c-18.618 0-18.618 18.618-18.618 18.618v539.927c0 18.618 18.618 18.618 18.618 18.618zM482.713 605.552v0c18.618 0 18.618-18.618 18.618-18.618v-539.927c0-18.618-18.618-18.618-18.618-18.618v0c-18.618 0-18.618 18.618-18.618 18.618v539.927c0 18.618 18.618 18.618 18.618 18.618zM613.040 605.552v0c18.618 0 18.618-18.618 18.618-18.618v-539.927c0-18.618-18.618-18.618-18.618-18.618v0c-18.618 0-18.618 18.618-18.618 18.618v539.927c0 18.618 18.618 18.618 18.618 18.618zM687.513 661.406v-614.4c0-37.236-37.236-74.473-74.473-74.473h-428.218c-37.236 0-74.473 37.236-74.473 74.473v614.4h577.164z" />
+<glyph unicode="&#xe906;" glyph-name="print" horiz-adv-x="1028" d="M70.117 814.323c-23.372 0-70.117-23.372-70.117-70.117v-327.213c0-23.372 23.372-70.117 70.117-70.117h116.862v93.489c0 46.745 46.745 93.489 93.489 93.489h444.075c46.745 0 93.489-46.745 93.489-93.489v-93.489h116.862c23.372 0 70.117 23.372 70.117 70.117v327.213c0 23.372-23.372 70.117-70.117 70.117h-864.777zM93.489 767.578c23.372 0 46.745-23.372 46.745-46.745s-23.372-46.745-46.745-46.745c-23.372 0-46.745 23.372-46.745 46.745s23.372 46.745 46.745 46.745zM233.723 767.578c23.372 0 46.745-23.372 46.745-46.745s-23.372-46.745-46.745-46.745c-23.372 0-46.745 23.372-46.745 46.745s23.372 46.745 46.745 46.745zM233.723 931.184h537.564c46.745 0 70.117-23.372 70.117-70.117h-677.798c0 46.745 23.372 70.117 70.117 70.117zM303.84 487.11c-46.745 0-70.117-23.372-70.117-70.117v-420.702c0-46.745 23.372-70.117 70.117-70.117h420.702c46.745 0 70.117 23.372 70.117 70.117v420.702c0 46.745-23.372 70.117-70.117 70.117h-420.702zM280.468 416.993h467.447c0 0 23.372 0 23.372-23.372v0c0 0 0-23.372-23.372-23.372h-467.447c0 0-23.372 0-23.372 23.372v0c0 0 0 23.372 23.372 23.372zM280.468 346.876h467.447c0 0 23.372 0 23.372-23.372v0c0 0 0-23.372-23.372-23.372h-467.447c0 0-23.372 0-23.372 23.372v0c0 0 0 23.372 23.372 23.372zM280.468 276.759h467.447c0 0 23.372 0 23.372-23.372v0c0 0 0-23.372-23.372-23.372h-467.447c0 0-23.372 0-23.372 23.372v0c0 0 0 23.372 23.372 23.372zM280.468 206.642h467.447c0 0 23.372 0 23.372-23.372v0c0 0 0-23.372-23.372-23.372h-467.447c0 0-23.372 0-23.372 23.372v0c0 0 0 23.372 23.372 23.372zM280.468 136.525h467.447c0 0 23.372 0 23.372-23.372v0c0 0 0-23.372-23.372-23.372h-467.447c0 0-23.372 0-23.372 23.372v0c0 0 0 23.372 23.372 23.372zM280.468 66.408h467.447c0 0 23.372 0 23.372-23.372v0c0 0 0-23.372-23.372-23.372h-467.447c0 0-23.372 0-23.372 23.372v0c0 0 0 23.372 23.372 23.372z" />
+<glyph unicode="&#xe907;" glyph-name="save" horiz-adv-x="1027" d="M54.028-84.586h918.475c27.014 0 54.028 27.014 54.028 54.028v837.433c0 0 0 27.014 0 27.014l-108.056 108.056c0 0-27.014 0-27.014 0h-54.028v-378.195c0-27.014-27.014-27.014-27.014-27.014h-648.335c-27.014 0-27.014 27.014-27.014 27.014v378.195h-54.028c-27.014 0-54.028-27.014-54.028-54.028v-918.475c0-27.014 27.014-54.028 54.028-54.028zM216.112 158.539h594.307c27.014 0 27.014 0 27.014-27.014v-27.014c0-27.014 0-27.014-27.014-27.014h-594.307c-27.014 0-27.014 0-27.014 27.014v27.014c0 27.014 0 27.014 27.014 27.014zM216.112 320.623h594.307c27.014 0 27.014 0 27.014-27.014v-27.014c0-27.014 0-27.014-27.014-27.014h-594.307c-27.014 0-27.014 0-27.014 27.014v27.014c0 27.014 0 27.014 27.014 27.014zM432.223 941.944h297.154v-324.168h-297.154v324.168zM189.098 941.944h162.084v-324.168h-162.084v324.168zM162.084 428.679h702.363c27.014 0 54.028-27.014 54.028-54.028v-351.181h-810.419v351.181c0 27.014 27.014 54.028 54.028 54.028z" />
+<glyph unicode="&#xe908;" glyph-name="unvalidasi" d="M307.2 906.546l238.933-238.933 238.933 238.933c68.267 68.267 170.667 68.267 238.933 0v0c68.267-68.267 68.267-170.667 0-238.933l-238.933-238.933 238.933-238.933c68.267-68.267 68.267-170.667 0-238.933v0c-68.267-68.267-170.667-68.267-238.933 0l-238.933 238.933-238.933-238.933c-68.267-68.267-170.667-68.267-238.933 0v0c-68.267 68.267-68.267 170.667 0 238.933l238.933 238.933-238.933 238.933c-68.267 68.267-68.267 170.667 0 238.933v0c68.267 68.267 170.667 68.267 238.933 0z" />
+<glyph unicode="&#xe909;" glyph-name="v1" horiz-adv-x="989" d="M1.919 341.736c115.925-77.283 193.208-173.887 212.528-289.811 154.566 270.491 328.453 463.698 521.66 521.66-57.962 77.283-19.321 231.849 19.321 386.415-231.849-154.566-425.057-367.094-560.302-656.906 0 154.566-77.283 270.491-173.887 367.094 38.642-115.925 38.642-231.849-19.321-309.132zM832.712-64v502.34l-115.925-19.321v57.962l270.491 38.642v-579.623h-154.566z" />
+<glyph unicode="&#xe90a;" glyph-name="v2" horiz-adv-x="1007" d="M0 335.466c111.856-74.571 186.427-167.784 223.712-279.64 149.141 279.64 316.925 466.067 521.995 503.352-55.928 74.571-18.643 223.712 18.643 372.853-223.712-149.141-410.139-372.853-559.28-652.493-18.643 149.141-74.571 260.997-186.427 372.853 37.285-130.499 37.285-223.712-18.643-316.925zM577.923-74.673v74.571l74.571 93.213c0 0 18.643 18.643 37.285 37.285 93.213 111.856 149.141 186.427 149.141 223.712 0 18.643 0 37.285-18.643 55.928s-37.285 18.643-55.928 18.643-55.928-18.643-74.571-37.285c-18.643-18.643-18.643-55.928-18.643-74.571v0h-74.571c0 55.928 18.643 93.213 55.928 130.499s74.571 55.928 149.141 55.928c55.928 0 111.856-18.643 149.141-55.928s55.928-74.571 55.928-130.499c0-18.643 0-37.285 0-55.928s-18.643-37.285-18.643-55.928c-18.643-18.643-37.285-55.928-55.928-74.571-18.643-37.285-55.928-74.571-111.856-111.856h223.712v-74.571h-410.139z" />
+<glyph unicode="&#xe90b;" glyph-name="skip" d="M510.080 457.728l456.128-500.448v956.608l-456.128-456.16zM462.336-42.72v956.608l-456.16-456.16 456.16-500.448z" />
+<glyph unicode="&#xe90c;" glyph-name="process" d="M212.526 597.172l1.176-0.22c15.656 30.924 36.178 60.184 62.152 86.168 112.016 111.968 283.562 127.584 412.544 47.236l-108.34-108.3 422.642-89.18-46.536 225.602-42.338 197.39-100.688-100.772c-198.178 147.31-479.242 131.702-659.050-48.024-88.528-88.524-136.944-201.68-146.13-317.276l170.314-35.952c0.792 49.244 11.988 98.188 34.254 143.328zM845.764 441.072c-0.828-48.812-12.026-97.496-34.198-142.328l-1.184 0.306c-15.702-31.054-36.168-60.314-62.104-86.206-112.016-112.064-283.646-127.546-412.586-47.37l107.466 107.512-422.256 89.226 29.964-145.432 59.44-276.648 100.64 100.644c198.136-147.312 479.202-131.698 659.010 48.112 88.31 88.264 136.724 200.93 146.086 316.232l-170.278 35.952z" />
+<glyph unicode="&#xe90d;" glyph-name="import" horiz-adv-x="1200" d="M496.064 956.018c-10.092-6.869-9.135 8.772-9.495-154.729l-0.321-145.057h-96.562c-119.726 0-113.205 2.161-81.89-27.171 58.405-54.71 279.575-259.1 282.357-260.936 5.495-3.622 15.959-2.977 21.796 1.344 4.129 3.055 237.736 219.124 283.131 261.876 28.308 26.658 34.337 24.887-84.597 24.887h-96.349l-0.321 145.057c-0.36 163.501 0.597 147.86-9.495 154.729l-4.048 2.758h-200.158l-4.048-2.758zM126.712 325.481c-112.521-77.989-112.872-78.295-122.421-106.951-6.5-19.503-6.68-17.799 13.426-127.946 9.873-54.095 18.765-100.655 19.755-103.464 7.796-22.099 30.826-42.034 55.431-47.985 7.433-1.798 52.295-1.942 510.349-1.636l502.201 0.339 7.962 2.839c24.917 8.883 44.975 29.052 50.776 51.055 1.065 4.042 9.699 50.068 19.185 102.279 19.314 106.318 19.191 105.094 12.715 124.519-9.618 28.869-10.506 29.643-122.967 107.497l-94.8 65.628h-65.355c-35.942 0-65.316-0.414-65.274-0.918s46.596-35.093 103.449-76.861l103.374-75.942-13.117-0.39c-7.211-0.216-54.593 0.207-105.289 0.942-102.348 1.479-96.46 1.843-104.409-6.419-1.663-1.726-14.99-32.32-31.921-73.265l-29.064-70.303h-341.053l-29.064 70.303c-16.859 40.771-30.262 71.543-31.909 73.256-7.211 7.49-0.447 7.043-116.116 7.712l-105.7 0.612 102.873 74.718c56.58 41.095 102.906 75.132 102.945 75.636s-29.307 0.918-65.217 0.918h-65.289l-95.475-66.174z" />
+<glyph unicode="&#xe937;" glyph-name="barcode" d="M0 832h128v-640h-128zM192 832h64v-640h-64zM320 832h64v-640h-64zM512 832h64v-640h-64zM768 832h64v-640h-64zM960 832h64v-640h-64zM640 832h32v-640h-32zM448 832h32v-640h-32zM864 832h32v-640h-32zM0 128h64v-64h-64zM192 128h64v-64h-64zM320 128h64v-64h-64zM640 128h64v-64h-64zM960 128h64v-64h-64zM768 128h128v-64h-128zM448 128h128v-64h-128z" />
+<glyph unicode="&#xe985;" glyph-name="searchh" d="M64 960h384v-64h-384zM576 960h384v-64h-384zM952 640h-56v256h-256v-256h-256v256h-256v-256h-56c-39.6 0-72-32.4-72-72v-560c0-39.6 32.4-72 72-72h304c39.6 0 72 32.4 72 72v376h128v-376c0-39.6 32.4-72 72-72h304c39.6 0 72 32.4 72 72v560c0 39.6-32.4 72-72 72zM348 0h-248c-19.8 0-36 14.4-36 32s16.2 32 36 32h248c19.8 0 36-14.4 36-32s-16.2-32-36-32zM544 448h-64c-17.6 0-32 14.4-32 32s14.4 32 32 32h64c17.6 0 32-14.4 32-32s-14.4-32-32-32zM924 0h-248c-19.8 0-36 14.4-36 32s16.2 32 36 32h248c19.8 0 36-14.4 36-32s-16.2-32-36-32z" />
+<glyph unicode="&#xe986;" glyph-name="search" d="M992.262 88.604l-242.552 206.294c-25.074 22.566-51.89 32.926-73.552 31.926 57.256 67.068 91.842 154.078 91.842 249.176 0 212.078-171.922 384-384 384-212.076 0-384-171.922-384-384s171.922-384 384-384c95.098 0 182.108 34.586 249.176 91.844-1-21.662 9.36-48.478 31.926-73.552l206.294-242.552c35.322-39.246 93.022-42.554 128.22-7.356s31.892 92.898-7.354 128.22zM384 320c-141.384 0-256 114.616-256 256s114.616 256 256 256 256-114.616 256-256-114.614-256-256-256z" />
+</font></defs></svg>

libs/fonts/icomoon.svg

@@ -0,0 +1,11 @@
+<?xml version="1.0" standalone="no"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" >
+<svg xmlns="http://www.w3.org/2000/svg">
+<metadata>Generated by IcoMoon</metadata>
+<defs>
+<font id="icomoon" horiz-adv-x="1024">
+<font-face units-per-em="1024" ascent="960" descent="-64" />
+<missing-glyph horiz-adv-x="1024" />
+<glyph unicode="&#x20;" horiz-adv-x="512" d="" />
+<glyph unicode="&#xe900;" glyph-name="delta" d="M515.072 849.408l-386.048-765.952h795.648l-409.6 765.952zM490.496 734.72l290.816-576.512h-579.584l288.768 576.512z" />
+</font></defs></svg>