Initial import

one-ui/management/one-sales/api/sales.js

@@ -0,0 +1,401 @@
+const URL = "/one-api/v1/management/";
+
+export async function search(prm) {
+    try {
+        var resp = await axios.post(URL + 'sales/search', 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 searchconfirm(prm) {
+    try {
+        var resp = await axios.post(URL + 'sales/searchconfirm', 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 getsexreg(token) {
+    try {
+        var resp = await axios.post(URL + 'sales/getsexreg',{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
+        };
+    }
+}
+export async function getdatas_riau(prm) {
+    try {
+        var resp = await axios.post('http://riau.aplikasi.web.id/one-api/tools/management/sales/getdatas',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 getdatas_pajajaran(prm) {
+    try {
+        var resp = await axios.post('http://pajajaran.aplikasi.web.id/one-api/tools/management/sales/getdatas',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 getdatas_toha(prm) {
+    try {
+        var resp = await axios.post('http://toha.aplikasi.web.id/one-api/tools/management/sales/getdatas',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 getdatas_cimahi(prm) {
+    try {
+        var resp = await axios.post('http://cimahi.aplikasi.web.id/one-api/tools/management/sales/getdatas',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 removecode(prm) {
+    try {
+        var resp = await axios.post(URL + 'sales/removecode',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 attachdoctor(prm) {
+    try {
+        var resp = await axios.post(URL + 'sales/attachdoctor',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 save(prm) {
+    try {
+        var resp = await axios.post(URL + 'sales/save',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 newdoctor(prm) {
+    try {
+        var resp = await axios.post(URL + 'sales/newdoctor',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 xdelete(prm) {
+    try {
+        var resp = await axios.post(URL + 'sales/deletedoctor',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 getaddress(prm) {
+    try {
+        var resp = await axios.post(URL + 'sales/getaddress',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 searchcity(token,prm) {
+    try {
+       var resp = await axios.post(URL + 'sales/searchcity',{token:token,search: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 searchstaff(token,prm) {
+    try {
+       var resp = await axios.post(URL + 'sales/searchstaff',{token:token,name: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 getdistrict(token,prm) {
+    try {
+       var resp = await axios.post(URL + 'sales/getdistrict',{id:prm.M_CityID,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
+       };
+    }
+ }
+
+ export async function getkelurahan(token,prm) {
+    try {
+       var resp = await axios.post(URL + 'sales/getkelurahan',{token:token,id:prm.M_DistrictID});
+       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 getjpa(token) {
+    try {
+       var resp = await axios.post(URL + 'sales/getjpa',{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
+       };
+    }
+ }
+
+
+
+export async function savenewaddress(prm) {
+    try {
+        var resp = await axios.post(URL + 'sales/savenewaddress',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 saveeditaddress(prm) {
+    try {
+        var resp = await axios.post(URL + 'sales/saveeditaddress',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 deleteaddress(prm) {
+    try {
+        var resp = await axios.post(URL + 'sales/deleteaddress',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
+        };
+    }
+}

one-ui/management/one-sales/components/oneChart.vue

@@ -0,0 +1,32 @@
+<template>
+  <div class="example">
+    <apexcharts width="500" height="350" type="bar" :options="chartOptions" :series="series"></apexcharts>
+  </div>
+</template>
+
+<script>
+import Chart from './components/oneChart.vue'
+
+export default {
+  name: 'Chart',
+  components: {
+    apexcharts: VueApexCharts,
+  },
+  data: function() {
+    return {
+      chartOptions: {
+        chart: {
+          id: 'basic-bar'
+        },
+        xaxis: {
+          categories: [1991, 1992, 1993, 1994, 1995, 1996, 1997, 1998]
+        }
+      },
+      series: [{
+        name: 'series-1',
+        data: [30, 40, 45, 50, 49, 60, 70, 91]
+      }]
+    }
+  },
+}
+</script>

one-ui/management/one-sales/components/oneSales.vue

@@ -0,0 +1,159 @@
+<template>
+    <v-layout wrap>
+        <v-flex xs12 and-down>
+            <v-layout row>
+                <v-flex sm12 and-down>
+                    <v-card color="#C8DFC3">
+                        <v-card-title class="pa-1" style="background:#3F848F" >
+
+                        </v-card-title>
+                        <v-card-text class="pt-1">
+                            <v-layout row>
+                                <v-flex class="text-xs-left" sm6 and-down>
+                                    <p class="mb-0 caption mono" style="color:#616161">PASIEN</p>
+                                    <p class="mb-1 text--primary"><span class="display-1 font-weight-black">3.500</span> <span class="subtitle-2 font-weight-light">org</span></p>
+                                </v-flex>
+                                <v-flex class="text-xs-right" sm6 and-down>
+                                    <p class="mb-0 caption mono" style="color:#616161">PENJUALAN</p>
+                                    <p class="mb-1 text--primary"><span class="display-1 font-weight-black">1.500</span> <span class="subtitle-2 font-weight-light">jt</span></p>
+                                </v-flex>
+                            </v-layout>
+                            <v-divider style="border-color:#0D7F8B"></v-divider>
+                            <v-layout mt-2 align-center row>
+                                <v-flex sm6 d-flex>
+                                    <p class="mb-0">bandung raya</p>
+                                </v-flex>
+                                <v-flex sm6 class="text-xs-right" d-flex>
+                                    <p class="mb-0">april 2020</p>
+                                </v-flex>
+                            </v-layout>
+                        </v-card-text>
+                    </v-card>
+                </v-flex>
+            </v-layout>
+            <v-layout row>
+                <v-flex sm12 and-down>
+                    <v-card color="#C8DFC3">
+                        <v-card-title class="pa-1" style="background:#3F848F" >
+
+                        </v-card-title>
+                        <v-card-text class="pt-1">
+                            <v-layout row>
+                                <v-flex class="text-xs-left" sm12 and-down>
+                                  <div id="chart">
+      <apexchart type="bar" height="350" :options="chartOptions" :series="series"></apexchart>
+    </div>
+                                </v-flex>
+                            </v-layout>
+                            
+                        </v-card-text>
+                    </v-card>
+                </v-flex>
+            </v-layout>
+        </v-flex>
+    </v-layout>
+</template>
+
+<style scoped>
+    .searchbox .v-input.v-text-field .v-input__slot {
+        min-height: 60px;
+    }
+
+    .searchbox .v-btn {
+        min-height: 60px;
+    }
+
+    table.v-table tbody td,
+    table.v-table tbody th {
+        height: 40px;
+    }
+
+    table.v-table thead tr {
+        height: 40px;
+    }
+</style>
+<script>
+      window.Promise ||
+        document.write(
+          '<script src="https://cdn.jsdelivr.net/npm/promise-polyfill@8/dist/polyfill.min.js"><\/script>'
+        )
+      window.Promise ||
+        document.write(
+          '<script src="https://cdn.jsdelivr.net/npm/eligrey-classlist-js-polyfill@1.2.20171210/classList.min.js"><\/script>'
+        )
+      window.Promise ||
+        document.write(
+          '<script src="https://cdn.jsdelivr.net/npm/findindex_polyfill_mdn"><\/script>'
+        )
+    </script>
+
+    
+
+    <script src="https://cdn.jsdelivr.net/npm/apexcharts"></script>
+    <script src="https://cdn.jsdelivr.net/npm/vue-apexcharts"></script>
+<script>
+
+    module.exports = {
+
+        components: {
+            'apexchart': VueApexCharts,
+            'one-dialog-info': httpVueLoader('../../../common/oneDialogInfo.vue'),
+            'one-dialog-alert': httpVueLoader('../../../common/oneDialogAlert.vue')
+        },
+        mounted() {
+            
+        },
+        methods: {
+            reHTMLAddress(xxaddresses){
+                var rtn = ''
+                if(xxaddresses && xxaddresses !== ''){
+                    var peraddress = xxaddresses.split("+")
+                    peraddress.forEach(function(entry) {
+                        var perpart = entry.split("^")
+                        rtn += "<p class='mb-0 font-weight-black' style='font-size:11px'>"+perpart[0].toUpperCase()+"</p>"
+                        rtn += "<p class='mb-1 caption mono'>"+perpart[1]+"</p>"
+                    })
+                }
+                
+                return rtn
+            }
+        },
+        computed: {
+             in_saving: {
+                get() {
+                    return this.$store.state.sales.in_saving
+                },
+                set(val) {
+                    this.$store.commit("sales/update_in_saving", val)
+                }
+            }
+        },
+           data: {
+          
+          series: [{
+            data: [400, 430, 448, 470, 540, 580, 690, 1100, 1200, 1380]
+          }],
+          chartOptions: {
+            chart: {
+              type: 'bar',
+              height: 350
+            },
+            plotOptions: {
+              bar: {
+                horizontal: true,
+              }
+            },
+            dataLabels: {
+              enabled: false
+            },
+            xaxis: {
+              categories: ['South Korea', 'Canada', 'United Kingdom', 'Netherlands', 'Italy', 'France', 'Japan',
+                'United States', 'China', 'Germany'
+              ],
+            }
+          },
+          
+          
+        },
+    }
+</script>

one-ui/management/one-sales/index.php

@@ -0,0 +1,390 @@
+<!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">
+      <link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@900&display=swap" rel="stylesheet">
+      <link href="https://fonts.googleapis.com/css2?family=Days+One&display=swap" rel="stylesheet">
+   </head>
+
+   <body>
+      <div v-cloak id="app">
+         <v-app id="smartApp" >
+            <v-card tile elevation="5" color="#85352e" class="pt-2 pb-2 mb-1">
+               <v-flex class="text-xs-center" xs12>
+                  <h3 style="font-family: 'Days One', sans-serif;color:#FFFFFF">BISONE</h3>
+               </v-flex>
+            </v-card>
+            <v-content 
+               
+               v-touch="{
+                  left: () => getdatasx('Right'),
+                  right: () => getdatasx('Left')
+               }"
+               style="max-height: 1000px;background:#fcfcfc!important" >
+                  <v-layout class="align-center pr-2" row>
+                     <v-flex class="text-xs-left mt-2" xs6>
+                        <p class="pl-2 mb-0 font-weight-black">TOTAL OMSET</p>
+                     </v-flex>
+                     <v-flex class="text-xs-right mt-2" xs6>
+                        <v-btn-toggle v-model="xtype">
+                           <v-btn color="#272324" small flat @click="changeType('day')" value="day">
+                              Harian
+                           </v-btn>
+                           <v-btn color="#272324" small flat @click="changeType('month')" value="month">
+                              Bulanan
+                           </v-btn>
+                        </v-btn-toggle>
+                     </v-flex>
+                  </v-layout>
+               <v-container fluid fill-height  class="pl-1 pr-1 pt-1 pb-2">
+                  <v-layout row wrap >
+                     <v-flex xs12 fill-height pa-1>
+                     <v-layout row>
+                        <v-flex sm12 and-down>
+                           <v-card tile color="#C8DFC3">
+                                 <v-card-title class="pa-1" style="background:#3F848F" >
+                                 </v-card-title>
+                                 <v-card-text class="pt-1">
+                                    <v-layout row>
+                                       <v-flex class="text-xs-left" sm6 and-down>
+                                             <p class="mb-0 caption mono" style="color:#616161">PASIEN</p>
+                                             <p class="mb-1 text--primary"><span class="display-1 font-weight-black">{{total_pasien}}</span> <span class="subtitle-2 font-weight-light">org</span></p>
+                                       </v-flex>
+                                       <v-flex class="text-xs-right" sm6 and-down>
+                                             <p class="mb-0 caption mono" style="color:#616161">PENJUALAN</p>
+                                             <p class="mb-1 text--primary"><span class="display-1 font-weight-black">{{total_penjualan}}</span> <span class="subtitle-2 font-weight-light">jt</span></p>
+                                       </v-flex>
+                                    </v-layout>
+                                    <v-divider style="border-color:#0D7F8B"></v-divider>
+                                    <v-layout mt-2 align-center row>
+                                       <v-flex sm6 d-flex>
+                                             <p class="mb-0">Bandung Raya</p>
+                                       </v-flex>
+                                       <v-flex sm6 class="text-xs-right" d-flex>
+                                             <p v-if="xtype === 'month'" class="mb-0">{{getmonthyear()}}</p>
+                                             <p v-if="xtype === 'day'" class="mb-0">{{getdaymonthyear()}}</p>
+                                       </v-flex>
+                                    </v-layout>
+                                 </v-card-text>
+                           </v-card>
+                        </v-flex>
+                     </v-layout>
+                     <v-layout row>
+                        <v-flex sm12 and-down>
+                           <v-card tile color="#F0EACF">
+                                 <v-card-title class="pa-1" style="background:#3F848F" >
+                                 </v-card-title>
+                                 <v-card-text class="pt-1">
+                                    <v-layout row>
+                                       <v-flex class="text-xs-left" sm12 and-down>
+                                          <div id="chart_pasien">
+                                             <apexchart type="bar" height="210" :options="chartOptions_pasien" :series="series_pasien"></apexchart>
+                                          </div>
+                                       </v-flex>
+                                    </v-layout>
+                                 </v-card-text>
+                           </v-card>
+                        </v-flex>
+                     </v-layout>
+                     <v-layout class="pb-3" row>
+                        <v-flex sm12 and-down>
+                           <v-card tile color="#F0EACF">
+                                 <v-card-title class="pa-1" style="background:#3F848F" >
+                                 </v-card-title>
+                                 <v-card-text class="pt-1">
+                                    <v-layout row>
+                                       <v-flex class="text-xs-left" sm12 and-down>
+                                          <div id="chart_penjualan">
+                                             <apexchart type="bar" height="210" :options="chartOptions_penjualan" :series="series_penjualan"></apexchart>
+                                          </div>
+                                       </v-flex>
+                                    </v-layout>
+                                 </v-card-text>
+                           </v-card>
+                        </v-flex>
+                     </v-layout>
+                        
+                     </v-flex>
+                  </v-layout>
+               </v-container>
+            </v-content>
+         </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/httpVueLoader.js"></script>
+      <script src="../../libs/one_global.js"></script>
+      <script>
+      window.Promise ||
+        document.write(
+          '<script src="../../libs/vendor/polyfill.min.js"><\/script>'
+        )
+      window.Promise ||
+        document.write(
+          '<script src="../../libs/vendor/classList.min.js"><\/script>'
+        )
+      window.Promise ||
+        document.write(
+          '<script src="../../libs/vendor/findindex_polyfill_mdn.js"><\/script>'
+        )
+    </script>
+
+    
+
+    <script src="../../libs/vendor/apexcharts.js"></script>
+    <script src="../../libs/vendor/vue-apexcharts.js"></script>
+      <!-- App Script -->
+<?php
+$ts = "?ts=" . Date("ymdhis");
+?>
+<script type="module">
+
+import { store } from './store.js<?php echo $ts ?>';
+//for testing
+window.store = store;
+new Vue({
+store,
+   el: '#app',
+   methods: {
+   tab_selected : function(tab) {
+      return this.$store.state.tab_selected == tab
+      }
+   },
+   mounted() {
+      let self = this
+      self.$store.dispatch('sales/getdatas_riau',{type:this.xtype})
+      self.$store.dispatch('sales/getdatas_pajajaran',{type:this.xtype})
+      self.$store.dispatch('sales/getdatas_toha',{type:this.xtype})
+      self.$store.dispatch('sales/getdatas_cimahi',{type:this.xtype})
+         },
+         computed: {
+            xloading(){
+               var rtn = false
+               if(this.$store.state.sales.persetase_loading == 100)
+                  rtn = true
+               return rtn
+            },
+            xperseloading(){
+               return this.$store.state.sales.persetase_loading
+            },
+            series_pasien() {
+               var dt_pasien = this.$store.state.sales.data_pasien
+               return [{ name: 'pasien', data: dt_pasien }]
+            },
+            series_penjualan() {
+               var dt_penjualan= this.$store.state.sales.data_penjualan
+               return [{ name: 'penjualan', data: dt_penjualan }]
+            },
+            total_pasien() {
+               var dt_pasien = this.$store.state.sales.data_pasien
+               var tot = 0
+               dt_pasien.forEach(function(entry) {
+                  tot = tot + parseInt(entry)
+               })
+               return Number(tot)
+            },
+            total_penjualan() {
+               var dt_penjualan= this.$store.state.sales.data_penjualan
+               var tot = 0
+               dt_penjualan.forEach(function(entry) {
+                  tot = tot + parseFloat(entry)
+               })
+               return tot.toFixed(2)
+
+            },
+            chartOptions_pasien(){
+                  return  {
+                     colors: ['#33b2df', '#546E7A', '#d4526e', '#13d8aa'],
+                     chart: {
+                     type: 'bar',
+                     height: 200,
+                     stacked: true
+                     },
+                     plotOptions: {
+                     bar: {
+                        horizontal: true,
+                     }
+                     },
+                     dataLabels: {
+                     enabled: true
+                     },
+                     xaxis: {
+                     categories: this.$store.state.sales.data_categories_pasien,
+                     labels: {
+                        formatter: function (val) {
+                           return val
+                        }
+                     },
+                     tooltip: {
+                           y: {
+                              formatter: function (val) {
+                                 return val
+                              }
+                           }
+                        }
+                     },
+                     title: {
+                     text: 'PASIEN PER CABANG'
+                     },
+                  }
+            },
+            chartOptions_penjualan(){
+               return {
+                  colors: ['#33b2df', '#546E7A', '#d4526e', '#13d8aa'],
+                  chart: {
+                  type: 'bar',
+                  height: 200,
+                  stacked: true
+                  },
+                  plotOptions: {
+                  bar: {
+                     horizontal: true,
+                  }
+                  },
+                  dataLabels: {
+                  enabled: true
+                  },
+                  xaxis: {
+                  categories:this.$store.state.sales.data_categories_penjualan,
+                  labels: {
+                     formatter: function (val) {
+                        return val + "jt"
+                     }
+                  },
+                  tooltip: {
+                        y: {
+                           formatter: function (val) {
+                              return val + "jt"
+                           }
+                        }
+                     }
+                  },
+                  title: {
+                  text: 'PENJUALAN PER CABANG'
+                  },
+               }
+            }
+        },
+   data: {
+         xtype:'day',
+         types:['day','month']
+          
+          
+        },
+        methods:{
+           getmonthyear(){
+            var d = new Date();
+            var month = new Array();
+            month[0] = "Januari";
+            month[1] = "Pebruari";
+            month[2] = "Maret";
+            month[3] = "April";
+            month[4] = "Mei";
+            month[5] = "Juni";
+            month[6] = "Juli";
+            month[7] = "Agustus";
+            month[8] = "September";
+            month[9] = "Oktober";
+            month[10] = "Nopember";
+            month[11] = "Desember";
+            var n = month[d.getMonth()]
+            return n+' '+d.getFullYear()
+           },
+           getdaymonthyear(){
+            var d = new Date();
+            var month = new Array();
+            month[0] = "Januari";
+            month[1] = "Pebruari";
+            month[2] = "Maret";
+            month[3] = "April";
+            month[4] = "Mei";
+            month[5] = "Juni";
+            month[6] = "Juli";
+            month[7] = "Agustus";
+            month[8] = "September";
+            month[9] = "Oktober";
+            month[10] = "Nopember";
+            month[11] = "Desember";
+            var n = month[d.getMonth()]
+            return d.getDate()+' '+n+' '+d.getFullYear()
+           },
+           getdatasx(act){
+              console.log(act)
+
+               var old_type = this.xtype
+               console.log(old_type)
+               var idx = this.types.indexOf(old_type)
+               console.log(idx)
+               if(act === 'Left'){
+                  if(idx > 0)
+                     idx = idx - 1
+               }
+               if(act === 'Right'){
+                  if(idx < (this.types.length-1))
+                     idx = idx + 1;console.log(idx)
+               }
+
+               var type = this.types[idx]
+               this.xtype = type
+               console.log(type)
+               this.$store.commit('sales/update_persetase_loading',0)
+               this.$store.commit('sales/update_data_penjualan',[])
+               this.$store.commit('sales/update_data_pasien',[])
+               this.$store.commit('sales/update_data_categories_penjualan',[])
+               this.$store.commit('sales/update_data_categories_pasien',[])
+               this.$store.dispatch('sales/getdatas_riau',{type:type})
+               this.$store.dispatch('sales/getdatas_pajajaran',{type:type})
+               this.$store.dispatch('sales/getdatas_toha',{type:type})
+               this.$store.dispatch('sales/getdatas_cimahi',{type:type})
+            },
+            changeType(type){
+               this.xtype = type
+               console.log(type)
+               this.$store.commit('sales/update_persetase_loading',0)
+               this.$store.commit('sales/update_data_penjualan',[])
+               this.$store.commit('sales/update_data_pasien',[])
+               this.$store.commit('sales/update_data_categories_penjualan',[])
+               this.$store.commit('sales/update_data_categories_pasien',[])
+               this.$store.dispatch('sales/getdatas_riau',{type:type})
+               this.$store.dispatch('sales/getdatas_pajajaran',{type:type})
+               this.$store.dispatch('sales/getdatas_toha',{type:type})
+               this.$store.dispatch('sales/getdatas_cimahi',{type:type})
+            }
+        },
+   components: {
+      apexchart: VueApexCharts
+      }
+    })
+    </script>
+    <style>
+[v-cloak] {
+   display: none
+}
+   .left {
+   }
+   .right {
+   }
+   .v-toolbar__content, .v-toolbar__extension {
+    align-items: center;
+    display: flex;
+    padding: 0 ;
+}
+    </style>
+   </body>
+
+</html>

one-ui/management/one-sales/store.js

@@ -0,0 +1,27 @@
+// State
+//  data ...
+// Mutations
+//
+//
+// Actions
+import sales from "./modules/sales.js";
+import system from "../../apps/modules/system/system.js";
+export const store = new Vuex.Store({
+    modules: {
+        sales: sales,
+        system: system
+    },
+    state: {
+        tab_selected: 'pasien-dokter'
+    },
+    mutations: {
+        change_tab(state, ntab) {
+            state.tab_selected = ntab
+        }
+    },
+    actions: {
+        change_tab(context, ntab) {
+            context.commit('change_tab', ntab)
+        }
+    }
+});