fajri/REG_IBL
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Initial import

Browse Source
This commit is contained in:
sas.fajri
2026-05-25 20:01:37 +07:00
commit 710d7c1b97
10371 changed files with 2381698 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
one-ui/test_x_old/.htaccess Normal file
View File

@@ -0,0 +1 @@
Options +Indexes

95
one-ui/test_x_old/datepicker.html Normal file
View File

@@ -0,0 +1,95 @@
<!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>Test Vue</title>
<link rel="stylesheet" href="../libs/vendor/css/vuetify.min.css">
<link rel="stylesheet" href="../libs/vendor/css/google-fonts.css">
<style>
[v-cloak] {
display: none
}
</style>
</head>
<body>
<div v-cloak id="app">
<v-app id="inspire">
<v-layout row wrap>
<v-flex xs12 sm6 md4>
<v-menu ref="menu" :close-on-content-click="false" v-model="menu" :nudge-right="40" :return-value.sync="date" lazy transition="scale-transition"
offset-y full-width min-width="290px">
<v-text-field slot="activator" v-model="date" label="Picker in menu" prepend-icon="event" readonly></v-text-field>
<v-date-picker v-model="date" no-title scrollable>
<v-spacer></v-spacer>
<v-btn flat color="primary" @click="menu = false">Cancel</v-btn>
<v-btn flat color="primary" @click="$refs.menu.save(date)">OK</v-btn>
</v-date-picker>
</v-menu>
</v-flex>
<v-spacer></v-spacer>
<v-flex xs12 sm6 md4>
<v-dialog ref="dialog" v-model="modal" :return-value.sync="date" persistent lazy full-width width="290px">
<v-text-field slot="activator" v-model="date" label="Picker in dialog" prepend-icon="event" readonly></v-text-field>
<v-date-picker v-model="date" scrollable>
<v-spacer></v-spacer>
<v-btn flat color="primary" @click="modal = false">Cancel</v-btn>
<v-btn flat color="primary" @click="$refs.dialog.save(date)">OK</v-btn>
</v-date-picker>
</v-dialog>
</v-flex>
<v-flex xs12 sm6 md4>
<v-menu ref="menu2" :close-on-content-click="false" v-model="menu2" :nudge-right="40" :return-value.sync="date" lazy transition="scale-transition"
offset-y full-width min-width="290px">
<v-text-field slot="activator" v-model="date" label="Picker without buttons" prepend-icon="event" readonly></v-text-field>
<v-date-picker v-model="date" @input="$refs.menu2.save(date)"></v-date-picker>
</v-menu>
</v-flex>
<v-spacer></v-spacer>
</v-layout>
</v-app>
</div>
<!-- Vendor -->
<script src="../libs/vendor/vue.min.js"></script>
<script src="../libs/vendor/vuetify.js"></script>
<!-- App Script -->
<script>
new Vue({
el: '#app',
data: {
date: null,
menu: false,
modal: false,
menu2: false
},
props: {
source: String
},
created() {
this.$vuetify.theme = {
primary: "#f44336",
secondary: "#e57373",
accent: "#9c27b0",
error: "#f44336",
warning: "#ffeb3b",
info: "#2196f3",
success: "#4caf50"
}
}
})
</script>
</body>
</html>

407
one-ui/test_x_old/homeservice.html Normal file
View File

@@ -0,0 +1,407 @@
<!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>Home Service</title>
<link rel="stylesheet" href="../libs/vendor/css/google-fonts.css">
<link rel="stylesheet" href="../libs/vendor/css/vuetify.min.css">
<style>
[v-cloak] {
display: none
}
</style>
</head>
<body>
<div v-cloak id="app">
<v-app id="inspire">
<v-navigation-drawer v-model="drawer" temporary absolute app>
<div>
<v-menu >
<v-btn slot="activator" fab dark color="purple">
<v-icon >home</v-icon>
</v-btn>
<v-list>
<v-list-tile v-for="(item, i) in items" :key="i" @click="" >
<v-list-tile-title>{{ item.title }}</v-list-tile-title>
</v-list-tile>
</v-list>
</v-menu>
Home
</div>
<div>
<v-menu >
<v-btn slot="activator" fab dark color="lime">
<v-icon >contact_mail</v-icon>
</v-btn>
<v-list>
<v-list-tile v-for="(item, i) in items" :key="i" @click="" >
<v-list-tile-title>{{ item.title }}</v-list-tile-title>
</v-list-tile>
</v-list>
</v-menu>
Front Office
</div>
<div>
<v-menu >
<v-btn slot="activator" fab dark color="indigo">
<v-icon >games</v-icon>
</v-btn>
<v-list>
<v-list-tile v-for="(item, i) in items" :key="i" @click="" >
<v-list-tile-title>{{ item.title }}</v-list-tile-title>
</v-list-tile>
</v-list>
</v-menu>
Process
</div>
<div>
<v-menu >
<v-btn slot="activator" fab dark color="yellow">
<v-icon >folder_special</v-icon>
</v-btn>
<v-list>
<v-list-tile v-for="(item, i) in items" :key="i" @click="" >
<v-list-tile-title>{{ item.title }}</v-list-tile-title>
</v-list-tile>
</v-list>
</v-menu>
Special Order
</div>
<div>
<v-menu >
<v-btn slot="activator" fab dark color="red">
<v-icon >equalizer</v-icon>
</v-btn>
<v-list>
<v-list-tile v-for="(item, i) in items" :key="i" @click="" >
<v-list-tile-title>{{ item.title }}</v-list-tile-title>
</v-list-tile>
</v-list>
</v-menu>
Quality Control
</div>
<div>
<v-menu >
<v-btn slot="activator" fab dark color="green">
<v-icon >library_books</v-icon>
</v-btn>
<v-list>
<v-list-tile v-for="(item, i) in items" :key="i" @click="" >
<v-list-tile-title>{{ item.title }}</v-list-tile-title>
</v-list-tile>
</v-list>
</v-menu>
Report
</div>
<div>
<v-menu >
<v-btn slot="activator" fab dark color="grey">
<v-icon >settings</v-icon>
</v-btn>
<v-list>
<v-list-tile v-for="(item, i) in items" :key="i" @click="" >
<v-list-tile-title>{{ item.title }}</v-list-tile-title>
</v-list-tile>
</v-list>
</v-menu>
settings
</div>
</v-navigation-drawer>
<v-toolbar color="deep-purple" dark fixed app>
<v-toolbar-side-icon @click.stop="drawer = !drawer"></v-toolbar-side-icon>
<v-toolbar-title>Home Service</v-toolbar-title>
<v-spacer></v-spacer>
<img src="../src/assets/logo.png" height="60px">
<div class="text-xs-center">
<v-dialog v-model="dialog" width="500" >
<v-btn flat icon slot="activator" color="white" dark>
<v-badge color="red">
<span slot="badge">3</span>
<v-icon >
mail
</v-icon>
</v-badge>
</v-btn>
<v-card>
<v-card-title
class="headline grey lighten-2"
primary-title
>
Peringatan
</v-card-title>
<v-card-text>
<p>1. Ini Contoh Peringatan</p>
<p>2. Ini Contoh Peringatan</p>
<p>3. Ini Contoh Peringatan</p>
</v-card-text>
<v-divider></v-divider>
</v-card>
</v-dialog>
</div>
</v-toolbar>
<v-content>
<v-layout>
<v-flex>
<v-card color="white">
<v-layout text-xs-center >
<v-flex xs12 sm6 xs3>
<v-card class="mx-2" >
<v-menu ref="menu2" :close-on-content-click="false" v-model="menu2" :nudge-right="40" :return-value.sync="date" lazy transition="scale-transition"
offset-y full-width min-width="290px" >
<v-text-field slot="activator" v-model="date" label="Start Date" prepend-icon="event" readonly></v-text-field>
<v-date-picker v-model="date" @input="$refs.menu2.save(date)"></v-date-picker>
</v-menu>
</v-card>
</v-flex>
<v-flex xs12 sm6 xs3>
<v-card class="mx-2" >
<v-menu ref="menu3" :close-on-content-click="false" v-model="menu3" :nudge-right="40" :return-value.sync="date" lazy transition="scale-transition"
offset-y full-width min-width="290px" >
<v-text-field slot="activator" v-model="date" label="End Date" prepend-icon="event" readonly></v-text-field>
<v-date-picker v-model="date" @input="$refs.menu3.save(date)"></v-date-picker>
</v-menu>
</v-card>
</v-flex>
<v-flex xs12 sm6 xs3>
<v-card class="mx-2" height="68px" >
<v-select :items="dropdown" label="Status" solo ></v-select>
</v-card>
</v-flex>
<v-flex xs12 sm6 xs3>
<v-card class="mx-2" height="68px" >
<v-text-field flat label="Search" prepend-inner-icon="search" solo-inverted ></v-text-field>
</v-card>
</v-flex>
</v-layout>
</v-card>
</v-flex>
</v-layout>
<v-container grid-list-lg >
<v-layout justify-center align-center >
<v-data-table :headers="headers" :items="desserts" hide-actions class="elevation-1" >
<template slot="items" slot-scope="props">
<td>{{ props.item.name }}</td>
<td class="text-xs-left">{{ props.item.calories }}</td>
<td class="text-xs-left">{{ props.item.fat }}</td>
<td class="text-xs-left">{{ props.item.carbs }}</td>
<td class="text-xs-left">{{ props.item.protein }}</td>
<td class="text-xs-left">{{ props.item.iron }}</td>
<td class="text-xs-left">{{ props.item.iron }}</td>
<td class="text-xs-left">{{ props.item.iron }}</td>
<td class="text-xs-left">{{ props.item.iron }}</td>
<td class="text-xs-left">{{ props.item.iron }}</td>
<td class="text-xs-left">{{ props.item.iron }}</td>
<td class="text-xs-left">{{ props.item.iron }}</td>
</template>
</v-data-table>
</v-layout>
</v-container>
</v-content>
<v-footer color="deep-purple" app>
<span class="white--text">&copy; 2018</span>
</v-footer>
</v-app>
</div>
<!-- Vendor -->
<script src="../libs/vendor/vue.min.js"></script>
<script src="../libs/vendor/vuetify.js"></script>
<!-- App Script -->
<script>
new Vue({
el: '#app',
data: {
date: null,
menu2: false,
menu3: false,
dialog: false,
drawer: null,
fav: true,
menu: false,
message: false,
hints: true,
items: [
{ title: 'Click Me' },
{ title: 'Click Me' },
{ title: 'Click Me' },
{ title: 'Click Me 2' }
],
dropdown: ['Foo', 'Bar', 'Fizz', 'Buzz'],
headers: [
{
text: 'Dessert (100g serving)',
align: 'left',
sortable: false,
value: 'name'
},
{ text: 'Calories', value: 'calories' },
{ text: 'Fat (g)', value: 'fat' },
{ text: 'Carbs (g)', value: 'carbs' },
{ text: 'Protein (g)', value: 'protein' },
{ text: 'Iron (%)', value: 'iron' },
{ text: 'Iron (%)', value: 'iron' },
{ text: 'Iron (%)', value: 'iron' },
{ text: 'Iron (%)', value: 'iron' },
{ text: 'Iron (%)', value: 'iron' },
{ text: 'Iron (%)', value: 'iron' },
{ text: 'Iron (%)', value: 'iron' }
] ,
desserts: [
{
value: false,
name: 'Frozen Yogurt',
calories: 159,
fat: 6.0,
carbs: 24,
protein: 4.0,
iron: '1%'
},
{
value: false,
name: 'Ice cream sandwich',
calories: 237,
fat: 9.0,
carbs: 37,
protein: 4.3,
iron: '1%'
},
{
value: false,
name: 'Eclair',
calories: 262,
fat: 16.0,
carbs: 23,
protein: 6.0,
iron: '7%'
},
{
value: false,
name: 'Cupcake',
calories: 305,
fat: 3.7,
carbs: 67,
protein: 4.3,
iron: '8%'
},
{
value: false,
name: 'Gingerbread',
calories: 356,
fat: 16.0,
carbs: 49,
protein: 3.9,
iron: '16%'
},
{
value: false,
name: 'Jelly bean',
calories: 375,
fat: 0.0,
carbs: 94,
protein: 0.0,
iron: '0%'
},
{
value: false,
name: 'Lollipop',
calories: 392,
fat: 0.2,
carbs: 98,
protein: 0,
iron: '2%'
},
{
value: false,
name: 'Honeycomb',
calories: 408,
fat: 3.2,
carbs: 87,
protein: 6.5,
iron: '45%'
},
{
value: false,
name: 'Donut',
calories: 452,
fat: 25.0,
carbs: 51,
protein: 4.9,
iron: '22%'
},
{
value: false,
name: 'KitKat',
calories: 518,
fat: 26.0,
carbs: 65,
protein: 7,
iron: '6%'
}
]
},
props: {
source: String
}
});
</script>
</body>
</html>

93
one-ui/test_x_old/layout-baseline-flip.html Normal file
View File

@@ -0,0 +1,93 @@
<!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>Test Vue</title>
<link rel="stylesheet" href="../libs/vendor/css/google-fonts.css">
<link rel="stylesheet" href="../libs/vendor/css/vuetify.min.css">
<style>
[v-cloak] {
display: none
}
</style>
</head>
<body>
<div v-cloak id="app">
<v-app id="inspire">
<v-navigation-drawer v-model="drawer" fixed right app>
<v-list dense>
<v-list-tile @click="">
<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 @click="">
<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>
<v-toolbar color="cyan" dark fixed app>
<v-spacer></v-spacer>
<v-toolbar-title>Application</v-toolbar-title>
<v-toolbar-side-icon @click.stop="drawer = !drawer"></v-toolbar-side-icon>
</v-toolbar>
<v-content>
<v-container fluid fill-height>
<v-layout justify-center align-center>
<v-flex text-xs-center>
<v-tooltip left>
<v-btn slot="activator" :href="source" icon large target="_blank">
<v-icon large>code</v-icon>
</v-btn>
<span>Source</span>
</v-tooltip>
<v-tooltip right>
<v-btn slot="activator" icon large href="https://codepen.io/johnjleider/pen/BYqXgr" target="_blank">
<v-icon large>mdi-codepen</v-icon>
</v-btn>
<span>Codepen</span>
</v-tooltip>
</v-flex>
</v-layout>
</v-container>
</v-content>
<v-footer color="cyan" app>
<v-spacer></v-spacer>
<span class="white--text">&copy; 2017</span>
</v-footer>
</v-app>
</div>
<!-- Vendor -->
<script src="../libs/vendor/vue.min.js"></script>
<script src="../libs/vendor/vuetify.js"></script>
<!-- App Script -->
<script>
new Vue({
el: '#app',
data: {
drawer: null
},
props: {
source: String
}
})
</script>
</body>
</html>

91
one-ui/test_x_old/layout-baseline.html Normal file
View File

@@ -0,0 +1,91 @@
<!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>Test Vue</title>
<link rel="stylesheet" href="../libs/vendor/css/google-fonts.css">
<link rel="stylesheet" href="../libs/vendor/css/vuetify.min.css">
<style>
[v-cloak] {
display: none
}
</style>
</head>
<body>
<div v-cloak id="app">
<v-app id="inspire">
<v-navigation-drawer v-model="drawer" fixed app>
<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>
<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>
<v-content>
<v-container fluid fill-height>
<v-layout justify-center align-center>
<v-flex text-xs-center>
<v-tooltip left>
<v-btn slot="activator" :href="source" icon large target="_blank">
<v-icon large>code</v-icon>
</v-btn>
<span>Source</span>
</v-tooltip>
<v-tooltip right>
<v-btn slot="activator" icon large href="https://codepen.io/johnjleider/pen/rJdVMq" target="_blank">
<v-icon large>mdi-codepen</v-icon>
</v-btn>
<span>Codepen</span>
</v-tooltip>
</v-flex>
</v-layout>
</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/vue.min.js"></script>
<script src="../libs/vendor/vuetify.js"></script>
<!-- App Script -->
<script>
new Vue({
el: '#app',
data: {
drawer: null
},
props: {
source: String
}
});
</script>
</body>
</html>

79
one-ui/test_x_old/layout-center.html Normal file
View File

@@ -0,0 +1,79 @@
<!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>Test Vue</title>
<link rel="stylesheet" href="../libs/vendor/css/google-fonts.css">
<link rel="stylesheet" href="../libs/vendor/css/vuetify.min.css">
<style>
[v-cloak] {
display: none
}
</style>
</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>Login form</v-toolbar-title>
<v-spacer></v-spacer>
<v-tooltip bottom>
<v-btn slot="activator" :href="source" icon large target="_blank">
<v-icon large>code</v-icon>
</v-btn>
<span>Source</span>
</v-tooltip>
<v-tooltip right>
<v-btn slot="activator" icon large href="https://codepen.io/johnjleider/pen/wyYVVj" target="_blank">
<v-icon large>mdi-codepen</v-icon>
</v-btn>
<span>Codepen</span>
</v-tooltip>
</v-toolbar>
<v-card-text>
<v-form>
<v-text-field prepend-icon="person" name="login" label="Login" type="text"></v-text-field>
<v-text-field id="password" prepend-icon="lock" name="password" label="Password" type="password"></v-text-field>
</v-form>
</v-card-text>
<v-card-actions>
<v-spacer></v-spacer>
<v-btn color="primary">Login</v-btn>
</v-card-actions>
</v-card>
</v-flex>
</v-layout>
</v-container>
</v-content>
</v-app>
</div>
<!-- Vendor -->
<script src="../libs/vendor/vue.min.js"></script>
<script src="../libs/vendor/vuetify.js"></script>
<!-- App Script -->
<script>
new Vue({
el: '#app',
data: {
drawer: null
},
props: {
source: String
}
})
</script>
</body>
</html>

204
one-ui/test_x_old/layout-google-contact.html Normal file
View File

@@ -0,0 +1,204 @@
<!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>Test Vue</title>
<link rel="stylesheet" href="../libs/vendor/css/google-fonts.css">
<link rel="stylesheet" href="../libs/vendor/css/vuetify.min.css">
<style>
[v-cloak] {
display: none
}
</style>
</head>
<body>
<div v-cloak id="app">
<v-app id="inspire">
<v-navigation-drawer :clipped="$vuetify.breakpoint.lgAndUp" v-model="drawer" fixed app>
<v-list dense>
<template v-for="item in items">
<v-layout v-if="item.heading" :key="item.heading" row align-center>
<v-flex xs6>
<v-subheader v-if="item.heading">
{{ item.heading }}
</v-subheader>
</v-flex>
<v-flex xs6 class="text-xs-center">
<a href="#!" class="body-2 black--text">EDIT</a>
</v-flex>
</v-layout>
<v-list-group v-else-if="item.children" v-model="item.model" :key="item.text" :prepend-icon="item.model ? item.icon : item['icon-alt']"
append-icon="">
<v-list-tile slot="activator">
<v-list-tile-content>
<v-list-tile-title>
{{ item.text }}
</v-list-tile-title>
</v-list-tile-content>
</v-list-tile>
<v-list-tile v-for="(child, i) in item.children" :key="i" @click="">
<v-list-tile-action v-if="child.icon">
<v-icon>{{ child.icon }}</v-icon>
</v-list-tile-action>
<v-list-tile-content>
<v-list-tile-title>
{{ child.text }}
</v-list-tile-title>
</v-list-tile-content>
</v-list-tile>
</v-list-group>
<v-list-tile v-else :key="item.text" @click="">
<v-list-tile-action>
<v-icon>{{ item.icon }}</v-icon>
</v-list-tile-action>
<v-list-tile-content>
<v-list-tile-title>
{{ item.text }}
</v-list-tile-title>
</v-list-tile-content>
</v-list-tile>
</template>
</v-list>
</v-navigation-drawer>
<v-toolbar :clipped-left="$vuetify.breakpoint.lgAndUp" color="blue darken-3" dark app fixed>
<v-toolbar-title style="width: 300px" class="ml-0 pl-3">
<v-toolbar-side-icon @click.stop="drawer = !drawer"></v-toolbar-side-icon>
<span class="hidden-sm-and-down">Google Contacts</span>
</v-toolbar-title>
<v-text-field flat solo-inverted hide-details prepend-inner-icon="search" label="Search" class="hidden-sm-and-down"></v-text-field>
<v-spacer></v-spacer>
<v-btn icon>
<v-icon>apps</v-icon>
</v-btn>
<v-btn icon>
<v-icon>notifications</v-icon>
</v-btn>
<v-btn icon large>
<v-avatar size="32px" tile>
<img src="https://cdn.vuetifyjs.com/images/logos/logo.svg" alt="Vuetify">
</v-avatar>
</v-btn>
</v-toolbar>
<v-content>
<v-container fluid fill-height>
<v-layout justify-center align-center>
<v-tooltip right>
<v-btn slot="activator" :href="source" icon large target="_blank">
<v-icon large>code</v-icon>
</v-btn>
<span>Source</span>
</v-tooltip>
<v-tooltip right>
<v-btn slot="activator" icon large href="https://codepen.io/johnjleider/pen/EQOYVV" target="_blank">
<v-icon large>mdi-codepen</v-icon>
</v-btn>
<span>Codepen</span>
</v-tooltip>
</v-layout>
</v-container>
</v-content>
<v-btn fab bottom right color="pink" dark fixed @click.stop="dialog = !dialog">
<v-icon>add</v-icon>
</v-btn>
<v-dialog v-model="dialog" width="800px">
<v-card>
<v-card-title class="grey lighten-4 py-4 title">
Create contact
</v-card-title>
<v-container grid-list-sm class="pa-4">
<v-layout row wrap>
<v-flex xs12 align-center justify-space-between>
<v-layout align-center>
<v-avatar size="40px" class="mr-3">
<img src="//ssl.gstatic.com/s2/oz/images/sge/grey_silhouette.png" alt="">
</v-avatar>
<v-text-field placeholder="Name"></v-text-field>
</v-layout>
</v-flex>
<v-flex xs6>
<v-text-field prepend-icon="business" placeholder="Company"></v-text-field>
</v-flex>
<v-flex xs6>
<v-text-field placeholder="Job title"></v-text-field>
</v-flex>
<v-flex xs12>
<v-text-field prepend-icon="mail" placeholder="Email"></v-text-field>
</v-flex>
<v-flex xs12>
<v-text-field type="tel" prepend-icon="phone" placeholder="(000) 000 - 0000" mask="phone"></v-text-field>
</v-flex>
<v-flex xs12>
<v-text-field prepend-icon="notes" placeholder="Notes"></v-text-field>
</v-flex>
</v-layout>
</v-container>
<v-card-actions>
<v-btn flat color="primary">More</v-btn>
<v-spacer></v-spacer>
<v-btn flat color="primary" @click="dialog = false">Cancel</v-btn>
<v-btn flat @click="dialog = false">Save</v-btn>
</v-card-actions>
</v-card>
</v-dialog>
</v-app>
</div>
<!-- Vendor -->
<script src="../libs/vendor/vue.min.js"></script>
<script src="../libs/vendor/vuetify.js"></script>
<!-- App Script -->
<script>
new Vue({
el: '#app',
data: {
dialog: false,
drawer: null,
items: [
{ icon: 'contacts', text: 'Contacts' },
{ icon: 'history', text: 'Frequently contacted' },
{ icon: 'content_copy', text: 'Duplicates' },
{
icon: 'keyboard_arrow_up',
'icon-alt': 'keyboard_arrow_down',
text: 'Labels',
model: true,
children: [
{ icon: 'add', text: 'Create label' }
]
},
{
icon: 'keyboard_arrow_up',
'icon-alt': 'keyboard_arrow_down',
text: 'More',
model: false,
children: [
{ text: 'Import' },
{ text: 'Export' },
{ text: 'Print' },
{ text: 'Undo changes' },
{ text: 'Other contacts' }
]
},
{ icon: 'settings', text: 'Settings' },
{ icon: 'chat_bubble', text: 'Send feedback' },
{ icon: 'help', text: 'Help' },
{ icon: 'phonelink', text: 'App downloads' },
{ icon: 'keyboard', text: 'Go to the old version' }
]
},
props: {
source: String
}
})
</script>
</body>
</html>

57
one-ui/test_x_old/login.html Normal file
View File

@@ -0,0 +1,57 @@
<!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>Test Vue</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>Login form</v-toolbar-title>
<v-spacer></v-spacer>
</v-toolbar>
<v-card-text>
<v-form>
<v-text-field prepend-icon="person" name="login" label="Login" type="text"></v-text-field>
<v-text-field id="password" prepend-icon="lock" name="password" label="Password" type="password"></v-text-field>
</v-form>
</v-card-text>
<v-card-actions>
<v-spacer></v-spacer>
<v-btn color="primary">Login</v-btn>
</v-card-actions>
</v-card>
</v-flex>
</v-layout>
</v-container>
</v-content>
</v-app>
</div>
<!-- Vendor -->
<script src="../libs/vendor/vue.min.js"></script>
<script src="../libs/vendor/vuetify.js"></script>
<!-- App Script -->
<script>
new Vue({ el: '#app' })
</script>
<style>
[v-cloak] {
display: none
}
</style>
</body>
</html>

102
one-ui/test_x_old/login2.html Normal file
View File

@@ -0,0 +1,102 @@
<!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>Test Vue</title>
<link rel="stylesheet" href="../libs/vendor/css/google-fonts.css">
<link rel="stylesheet" href="../libs/vendor/css/vuetify.min.css">
<style>
[v-cloak] {
display: none
}
</style>
</head>
<body>
<div v-cloak id="app">
<v-app id="inspire">
<v-navigation-drawer v-model="drawerRight" fixed right clipped app>
<v-list dense>
<v-list-tile @click.stop="right = !right">
<v-list-tile-action>
<v-icon>exit_to_app</v-icon>
</v-list-tile-action>
<v-list-tile-content>
<v-list-tile-title>Open Temporary Drawer</v-list-tile-title>
</v-list-tile-content>
</v-list-tile>
</v-list>
</v-navigation-drawer>
<v-toolbar color="blue-grey" dark fixed app clipped-right>
<v-toolbar-side-icon @click.stop="drawer = !drawer"></v-toolbar-side-icon>
<v-toolbar-title>Toolbar</v-toolbar-title>
<v-spacer></v-spacer>
<v-toolbar-side-icon @click.stop="drawerRight = !drawerRight"></v-toolbar-side-icon>
</v-toolbar>
<v-navigation-drawer v-model="drawer" fixed app>
<v-list dense>
<v-list-tile @click.stop="left = !left">
<v-list-tile-action>
<v-icon>exit_to_app</v-icon>
</v-list-tile-action>
<v-list-tile-content>
<v-list-tile-title>Open Temporary Drawer</v-list-tile-title>
</v-list-tile-content>
</v-list-tile>
</v-list>
</v-navigation-drawer>
<v-navigation-drawer v-model="left" temporary fixed></v-navigation-drawer>
<v-content>
<v-container fluid fill-height>
<v-layout justify-center align-center>
<v-flex shrink>
<v-tooltip right>
<v-btn slot="activator" :href="source" icon large target="_blank">
<v-icon large>code</v-icon>
</v-btn>
<span>Source</span>
</v-tooltip>
<v-tooltip right>
<v-btn slot="activator" icon large href="https://codepen.io/johnjleider/pen/KQrPKJ" target="_blank">
<v-icon large>mdi-codepen</v-icon>
</v-btn>
<span>Codepen</span>
</v-tooltip>
</v-flex>
</v-layout>
</v-container>
</v-content>
<v-navigation-drawer v-model="right" right temporary fixed></v-navigation-drawer>
<v-footer color="blue-grey" class="white--text" app>
<span>Vuetify</span>
<v-spacer></v-spacer>
<span>&copy; 2017</span>
</v-footer>
</v-app>
</div>
<!-- Vendor -->
<script src="../libs/vendor/vue.min.js"></script>
<script src="../libs/vendor/vuetify.js"></script>
<!-- App Script -->
<script>
new Vue({
el: '#app',
data: {
drawer: true,
drawerRight: true,
right: null,
left: null
},
props: {
source: String
}
})
</script>
</body>
</html>

419
one-ui/test_x_old/template.html Normal file
View File

@@ -0,0 +1,419 @@
<!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>Home Service</title>
<link rel="stylesheet" href="../libs/vendor/css/google-fonts.css">
<link rel="stylesheet" href="../libs/vendor/css/vuetify.min.css">
<style>
[v-cloak] {
display: none
}
</style>
</head>
<body>
<div v-cloak id="app">
<v-app id="inspire">
<v-navigation-drawer v-model="drawer" temporary absolute app>
<v-list dense>
<v-list-tile @click="">
<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 @click="">
<v-list-tile-action>
<v-icon>contact_mail</v-icon>
</v-list-tile-action>
<v-list-tile-content>
<v-list-tile-title>Front Office</v-list-tile-title>
</v-list-tile-content>
</v-list-tile>
<v-list-tile @click="">
<v-list-tile-action>
<v-icon>games</v-icon>
</v-list-tile-action>
<v-list-tile-content>
<v-list-tile-title>Process</v-list-tile-title>
</v-list-tile-content>
</v-list-tile>
<v-list-tile @click="">
<v-list-tile-action>
<v-icon>folder_special</v-icon>
</v-list-tile-action>
<v-list-tile-content>
<v-list-tile-title>Special Order</v-list-tile-title>
</v-list-tile-content>
</v-list-tile>
<v-list-tile @click="">
<v-list-tile-action>
<v-icon>equalizer</v-icon>
</v-list-tile-action>
<v-list-tile-content>
<v-list-tile-title>Quality Control</v-list-tile-title>
</v-list-tile-content>
</v-list-tile>
<v-list-tile @click="">
<v-list-tile-action>
<v-icon>library_books</v-icon>
</v-list-tile-action>
<v-list-tile-content>
<v-list-tile-title>Report</v-list-tile-title>
</v-list-tile-content>
</v-list-tile>
<v-list-tile @click="">
<v-list-tile-action>
<v-icon>settings</v-icon>
</v-list-tile-action>
<v-list-tile-content>
<v-list-tile-title>Settings</v-list-tile-title>
</v-list-tile-content>
</v-list-tile>
</v-list>
<div>
<v-menu >
<v-btn slot="activator" fab dark color="purple">
<v-icon >home</v-icon>
</v-btn>
<v-list>
<v-list-tile v-for="(item, i) in items" :key="i" @click="" >
<v-list-tile-title>{{ item.title }}</v-list-tile-title>
</v-list-tile>
</v-list>
</v-menu>
Home
</div>
<div>
<v-menu >
<v-btn slot="activator" fab dark color="purple">
<v-icon >contact_mail</v-icon>
</v-btn>
<v-list>
<v-list-tile v-for="(item, i) in items" :key="i" @click="" >
<v-list-tile-title>{{ item.title }}</v-list-tile-title>
</v-list-tile>
</v-list>
</v-menu>
Front Office
</div>
<div>
<v-menu >
<v-btn slot="activator" fab dark color="purple">
<v-icon >games</v-icon>
</v-btn>
<v-list>
<v-list-tile v-for="(item, i) in items" :key="i" @click="" >
<v-list-tile-title>{{ item.title }}</v-list-tile-title>
</v-list-tile>
</v-list>
</v-menu>
Process
</div>
<div>
<v-menu >
<v-btn slot="activator" fab dark color="purple">
<v-icon >folder_special</v-icon>
</v-btn>
<v-list>
<v-list-tile v-for="(item, i) in items" :key="i" @click="" >
<v-list-tile-title>{{ item.title }}</v-list-tile-title>
</v-list-tile>
</v-list>
</v-menu>
Special Order
</div>
<div>
<v-menu >
<v-btn slot="activator" fab dark color="purple">
<v-icon >equalizer</v-icon>
</v-btn>
<v-list>
<v-list-tile v-for="(item, i) in items" :key="i" @click="" >
<v-list-tile-title>{{ item.title }}</v-list-tile-title>
</v-list-tile>
</v-list>
</v-menu>
Quality Control
</div>
<div>
<v-menu >
<v-btn slot="activator" fab dark color="purple">
<v-icon >library_books</v-icon>
</v-btn>
<v-list>
<v-list-tile v-for="(item, i) in items" :key="i" @click="" >
<v-list-tile-title>{{ item.title }}</v-list-tile-title>
</v-list-tile>
</v-list>
</v-menu>
Report
</div>
<div>
<v-menu >
<v-btn slot="activator" fab dark color="purple">
<v-icon >settings</v-icon>
</v-btn>
<v-list>
<v-list-tile v-for="(item, i) in items" :key="i" @click="" >
<v-list-tile-title>{{ item.title }}</v-list-tile-title>
</v-list-tile>
</v-list>
</v-menu>
settings
</div>
</v-navigation-drawer>
<v-toolbar color="deep-purple" dark fixed app>
<v-toolbar-side-icon @click.stop="drawer = !drawer"></v-toolbar-side-icon>
<v-toolbar-title>Home Service</v-toolbar-title>
<v-spacer></v-spacer>
<img src="../src/assets/logo.png" height="60px">
<div class="text-xs-center">
<v-dialog v-model="dialog" width="500" >
<v-btn flat icon slot="activator" color="white" dark>
<v-badge color="red">
<span slot="badge">3</span>
<v-icon >
mail
</v-icon>
</v-badge>
</v-btn>
<v-card>
<v-card-title
class="headline grey lighten-2"
primary-title
>
Peringatan
</v-card-title>
<v-card-text>
<p>1. Ini Contoh Peringatan</p>
<p>2. Ini Contoh Peringatan</p>
<p>3. Ini Contoh Peringatan</p>
</v-card-text>
<v-divider></v-divider>
</v-card>
</v-dialog>
</div>
</v-toolbar>
<v-content>
<v-container fluid fill-height>
<v-layout justify-center align-center>
<v-data-table :headers="headers" :items="desserts" hide-actions class="elevation-1">
<template slot="items" slot-scope="props">
<td>{{ props.item.name }}</td>
<td class="text-xs-right">{{ props.item.calories }}</td>
<td class="text-xs-right">{{ props.item.fat }}</td>
<td class="text-xs-right">{{ props.item.carbs }}</td>
<td class="text-xs-right">{{ props.item.protein }}</td>
<td class="text-xs-right">{{ props.item.iron }}</td>
<td class="text-xs-right">{{ props.item.iron }}</td>
<td class="text-xs-right">{{ props.item.iron }}</td>
<td class="text-xs-right">{{ props.item.iron }}</td>
<td class="text-xs-right">{{ props.item.iron }}</td>
<td class="text-xs-right">{{ props.item.iron }}</td>
<td class="text-xs-right">{{ props.item.iron }}</td>
</template>
</v-data-table>
</v-layout>
</v-container>
</v-content>
<v-footer color="deep-purple" app>
<span class="white--text">&copy; 2018</span>
</v-footer>
</v-app>
</div>
<!-- Vendor -->
<script src="../libs/vendor/vue.min.js"></script>
<script src="../libs/vendor/vuetify.js"></script>
<!-- App Script -->
<script>
new Vue({
el: '#app',
data: {
dialog: false,
drawer: null,
fav: true,
menu: false,
message: false,
hints: true,
items: [
{ title: 'Click Me' },
{ title: 'Click Me' },
{ title: 'Click Me' },
{ title: 'Click Me 2' }
],
headers: [
{
text: 'Dessert (100g serving)',
align: 'left',
sortable: false,
value: 'name'
},
{ text: 'Calories', value: 'calories' },
{ text: 'Fat (g)', value: 'fat' },
{ text: 'Carbs (g)', value: 'carbs' },
{ text: 'Protein (g)', value: 'protein' },
{ text: 'Iron (%)', value: 'iron' },
{ text: 'Iron (%)', value: 'iron' },
{ text: 'Iron (%)', value: 'iron' },
{ text: 'Iron (%)', value: 'iron' },
{ text: 'Iron (%)', value: 'iron' },
{ text: 'Iron (%)', value: 'iron' },
{ text: 'Iron (%)', value: 'iron' }
],
desserts: [
{
value: false,
name: 'Frozen Yogurt',
calories: 159,
fat: 6.0,
carbs: 24,
protein: 4.0,
iron: '1%'
},
{
value: false,
name: 'Ice cream sandwich',
calories: 237,
fat: 9.0,
carbs: 37,
protein: 4.3,
iron: '1%'
},
{
value: false,
name: 'Eclair',
calories: 262,
fat: 16.0,
carbs: 23,
protein: 6.0,
iron: '7%'
},
{
value: false,
name: 'Cupcake',
calories: 305,
fat: 3.7,
carbs: 67,
protein: 4.3,
iron: '8%'
},
{
value: false,
name: 'Gingerbread',
calories: 356,
fat: 16.0,
carbs: 49,
protein: 3.9,
iron: '16%'
},
{
value: false,
name: 'Jelly bean',
calories: 375,
fat: 0.0,
carbs: 94,
protein: 0.0,
iron: '0%'
},
{
value: false,
name: 'Lollipop',
calories: 392,
fat: 0.2,
carbs: 98,
protein: 0,
iron: '2%'
},
{
value: false,
name: 'Honeycomb',
calories: 408,
fat: 3.2,
carbs: 87,
protein: 6.5,
iron: '45%'
},
{
value: false,
name: 'Donut',
calories: 452,
fat: 25.0,
carbs: 51,
protein: 4.9,
iron: '22%'
},
{
value: false,
name: 'KitKat',
calories: 518,
fat: 26.0,
carbs: 65,
protein: 7,
iron: '6%'
}
]
},
props: {
source: String
}
});
</script>
</body>
</html>

109
one-ui/test_x_old/tpl-01.html Normal file
View File

@@ -0,0 +1,109 @@
<!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>Home Service</title>
<link rel="stylesheet" href="../libs/vendor/css/google-fonts.css">
<link rel="stylesheet" href="../libs/vendor/css/vuetify.min.css">
<style>
[v-cloak] {
display: none
}
</style>
</head>
<body>
<div v-cloak id="app">
<v-app>
<v-layout row>
<v-flex xs12 sm6 offset-sm3>
<v-card>
<v-toolbar color="cyan" dark>
<v-toolbar-side-icon></v-toolbar-side-icon>
<v-toolbar-title>Inbox</v-toolbar-title>
<v-spacer></v-spacer>
<v-btn icon>
<v-icon>search</v-icon>
</v-btn>
</v-toolbar>
<v-list two-line>
<template v-for="(item, index) in items">
<v-subheader
v-if="item.header"
:key="item.header"
>
{{ item.header }}
</v-subheader>
<v-divider
v-else-if="item.divider"
:key="index"
:inset="item.inset"
></v-divider>
<v-list-tile
v-else
:key="item.title"
avatar
@click=""
>
<v-list-tile-avatar>
<img :src="item.avatar">
</v-list-tile-avatar>
<v-list-tile-content>
<v-list-tile-title v-html="item.title"></v-list-tile-title>
<v-list-tile-sub-title v-html="item.subtitle"></v-list-tile-sub-title>
</v-list-tile-content>
</v-list-tile>
</template>
</v-list>
</v-card>
</v-flex>
</v-layout>
</v-app>
</div>
<!-- Vendor -->
<script src="../libs/vendor/vue.min.js"></script>
<script src="../libs/vendor/vuetify.js"></script>
<!-- App Script -->
<script>
new Vue({
el: '#app',
data: {
items: [
{ header: 'Today' },
{
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?"
},
{ divider: true, inset: true },
{
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."
},
{ divider: true, inset: true },
{
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?"
}
]
}
});
</script>
</body>
</html>

75
one-ui/test_x_old/vuex/common/oneDatePicker.vue Normal file
View File

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

80
one-ui/test_x_old/vuex/common/oneDialogAlert.vue Normal file
View File

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

56
one-ui/test_x_old/vuex/common/oneDialogAlertValidation.vue Normal file
View File

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

49
one-ui/test_x_old/vuex/common/oneDialogConfirm.vue Normal file
View File

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

70
one-ui/test_x_old/vuex/common/oneDialogError.vue Normal file
View File

@@ -0,0 +1,70 @@
<template>
<v-dialog
v-model="dialog"
max-width="30%"
>
<v-card>
<v-card-title
class="headline red white--text lighten-2 pt-2 pb-2"
primary-title
>
ERROR !
</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-spacer></v-spacer>
<v-btn
color="red"
flat
@click="dialog=!dialog"
>
Mengerti
</v-btn>
</v-card-actions>
</v-card>
</v-dialog>
</template>
<style scoped>
</style>
<script>
module.exports = {
props : ['msg'],
data () {
return {
}
},
computed : {
xmsg() {
return this.msg
},
dialog : {
get () { return this.$store.state.dialog_error },
set (v) { this.$store.commit('update_dialog_error', v) }
}
},
methods: {
}
}
</script>

71
one-ui/test_x_old/vuex/common/oneDialogErrorFajri.vue Normal file
View File

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

69
one-ui/test_x_old/vuex/common/oneDialogInfo.vue Normal file
View File

@@ -0,0 +1,69 @@
<template>
<v-dialog
v-model="dialog"
max-width="35%"
>
<v-card>
<v-card-title
class="headline info white--text pt-2 pb-2"
>
Info
</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>

63
one-ui/test_x_old/vuex/common/oneDialogLoading.vue Normal file
View File

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

76
one-ui/test_x_old/vuex/common/oneDialogPrint.vue Normal file
View File

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

72
one-ui/test_x_old/vuex/common/oneDialogPrintX.vue Normal file
View File

@@ -0,0 +1,72 @@
<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>

121
one-ui/test_x_old/vuex/common/oneFieldVerification.1.vue Normal file
View File

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

125
one-ui/test_x_old/vuex/common/oneFieldVerification.vue Normal file
View File

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

126
one-ui/test_x_old/vuex/common/oneFieldVerificationDeliveryPayment.vue Normal file
View File

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

72
one-ui/test_x_old/vuex/common/oneFieldVerificationFalse.vue Normal file
View File

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

84
one-ui/test_x_old/vuex/common/oneFieldVerificationPatientDoctor.vue Normal file
View File

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

82
one-ui/test_x_old/vuex/common/oneFieldVerificationSupply.vue Normal file
View File

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

31
one-ui/test_x_old/vuex/common/oneTestingComponent.vue Normal file
View File

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

80
one-ui/test_x_old/vuex/common/oneTestingComponent2.vue Normal file
View File

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

40
one-ui/test_x_old/vuex/common/onexcheck.vue Normal file
View File

@@ -0,0 +1,40 @@
<template>
<div>
<v-layout align-center row>
<v-flex xs2>
<v-icon @click="changeX('Y')" v-if="xcbx === 'N'" large>radio_button_unchecked</v-icon>
<v-icon @click="changeX('N')" v-if="xcbx === 'Y'" large>highlight_off</v-icon>
</v-flex>
<v-flex xs10 class="v-label theme--light">{{xlabel}}</v-flex>
</v-layout>
</div>
</template>
<script>
module.exports = {
props : ['xdatalabel','xdatacbx'],
computed :{
xcbx: {
get() {
return this.xdatacbx
},
set(val) {
this.$emit('update-data-cbx', val)
}
},
xlabel(){
if (this.xdatalabel)
return this.xdatalabel;
return "";
}
},
methods : {
changeX(value){
this.xcbx = value
this.$emit('update-data-cbx', value)
}
}
}
</script>

BIN
one-ui/test_x_old/vuex/common/under-cons.pdf Normal file
View File

Binary file not shown.

BIN
one-ui/test_x_old/vuex/detailorder/.index.php.swp Normal file
View File

Binary file not shown.

0
one-ui/test_x_old/vuex/detailorder/action.js Normal file
View File

31
one-ui/test_x_old/vuex/detailorder/api.js Normal file
View File

@@ -0,0 +1,31 @@
// API :
// search bank
// paramater : query , page , rowPerPage
const URL =
"http://lebaran.aplikasi.web.id/smartlab_api/vuex/t02/search_bank";
export async function searchBank(query, page, rowPerPage = 15) {
try {
var resp = await axios.post(URL, {
query: query,
page: page,
rowPerPage: rowPerPage
});
if (resp.status != 200) {
return {
status: "ERR",
query: query,
message: resp.statusText
};
}
let data = resp.data;
data.query = query;
return data;
} catch (e) {
return {
status: "ERR",
query: query,
message: e.message
};
}
}

BIN
one-ui/test_x_old/vuex/detailorder/components/.foTestLeft.vue.swp Normal file
View File

Binary file not shown.

19
one-ui/test_x_old/vuex/detailorder/components/foTest.vue Normal file
View File

@@ -0,0 +1,19 @@
<template>
<v-container fluid grid-list-md >
<v-layout row wrap>
<left-box></left-box>
<right-box></right-box>
</v-layout>
</v-container>
</template>
<script>
module.exports = {
components : {
'left-box' : httpVueLoader('./foTestLeft.vue'),
'right-box' : httpVueLoader('./foTestRight.vue'),
}
}
</script>

139
one-ui/test_x_old/vuex/detailorder/components/foTestLeft.vue Normal file
View File

@@ -0,0 +1,139 @@
<template>
<v-flex xs6 class="left">
<v-layout row>
<v-flex pl-2 pr-2 pt-0 pb-2 md12>
<v-card>
<v-layout pl-2 pr-2 row>
<v-flex xs12 sm6 md6>
<v-text-field
label="PERUSAHAAN X"
small
></v-text-field>
</v-flex>
<v-flex xs12 sm6 md6>
<v-select
:mous="mous"
label="MOU X"
small
></v-select>
</v-flex>
</v-layout>
</v-card>
</v-flex>
</v-layout>
<v-layout row>
<v-flex pl-2 pr-2 pt-1 xs12 sm12 md12>
<v-card class="search-test">
<v-card-actions>
<v-btn outline color="orange">Pemeriksaan</v-btn>
<v-btn flat color="orange">Panel</v-btn>
<v-btn flat color="orange">Profile</v-btn>
<v-btn flat color="orange" text-color="red">MOU *</v-btn>
</v-card-actions>
<v-divider></v-divider>
<v-card-text>
<v-layout row pt-0 pb-0>
<v-flex >
<v-text-field
v-model="value"
color="cyan darken"
placeholder="ketikkan pemeriksaan ..."
>
<v-progress-linear
v-if="custom"
slot="progress"
:value="progress"
:color="color"
height="7"
></v-progress-linear>
</v-text-field>
</v-flex>
</v-layout>
<v-layout row>
<v-flex text-md-center >
<v-btn depressed small color="error">TEST 1</v-btn>
<v-btn depressed small color="error">TEST 2</v-btn>
<v-btn depressed small color="error">TEST 3</v-btn>
<v-btn depressed small color="error">TEST 4</v-btn>
<v-btn depressed small color="error">TEST 5</v-btn>
<v-btn depressed small color="error">TEST 6</v-btn>
<v-btn depressed small color="error">TEST 7</v-btn>
<v-btn depressed small color="info">TEST 8</v-btn>
<v-btn depressed small color="info">TEST 9</v-btn>
<v-btn depressed small color="info">TEST 10</v-btn>
<v-btn depressed small color="info">TEST 11</v-btn>
<v-btn depressed small color="info">TEST 12</v-btn>
<v-btn depressed small color="info">TEST 13</v-btn>
<v-btn depressed small color="info">TEST 14</v-btn>
<v-btn depressed small color="warning">TEST 15</v-btn>
<v-btn depressed small color="warning">TEST 16</v-btn>
<v-btn depressed small color="warning">TEST 17</v-btn>
<v-btn depressed small color="warning">TEST 18</v-btn>
<v-btn depressed small color="warning">TEST 19</v-btn>
<v-btn depressed small color="warning">TEST 20</v-btn>
</v-flex>
</v-layout>
</v-card-text>
</v-card>
</v-flex>
</v-layout>
<v-layout row>
<v-flex pl-2 pr-2 pt-2 pb-3 md12>
<v-card class="persyaratan">
<v-layout pl-2 pr-2 row>
<v-flex md12>
<v-list
subheader
three-line
>
<v-subheader red--text text--lighten-1> PERSYARATAN</v-subheader>
<v-divider></v-divider>
<div role="listitem"><a class="v-list__tile v-list__tile--link theme--light"><div class="v-list__tile__action"><div class="v-input v-input--selection-controls v-input--checkbox theme--light"><div class="v-input__control"><div class="v-input__slot"><div class="v-input--selection-controls__input"><input aria-checked="false" role="checkbox" type="checkbox" value=""><div class="v-input--selection-controls__ripple"></div><i aria-hidden="true" class="v-icon material-icons theme--light">check_box_outline_blank</i></div></div><div class="v-messages theme--light"><div class="v-messages__wrapper"></div></div></div></div></div> <div class="v-list__tile__content"><div class="v-list__tile__sub-title pt-3"><div class="flex justify-center md12" style="width: 100%;"><div class="v-input text-list-fhm v-text-field v-text-field--enclosed v-text-field--outline v-text-field--placeholder theme--light"><div class="v-input__control"><div class="v-input__slot"><div class="v-text-field__slot"><label aria-hidden="true" class="v-label v-label--active theme--light" style="left: 0px; right: auto; position: absolute;">Tidak bab satu minggu</label><input aria-label="Tidak bab satu minggu" type="text" placeholder="ketikkan alasan di sini ..."></div></div><div class="v-text-field__details"><div class="v-messages theme--light"><div class="v-messages__wrapper"></div></div></div></div></div></div></div></div></a></div>
</v-list>
</v-flex>
</v-layout>
</v-card>
</v-flex>
</v-layout>
</v-flex>
</template>
<style scoped>
div.search-test .v-text-field {
padding-top: 2px;
margin-top: 4px;
}
div.persyaratan input[type=text]::-webkit-input-placeholder {
font-size: 1em;
}
div.persyaratan input[type=text] {
font-size: .7em;
}
div.persyaratan label {
color: #f44336!important;
font-size: 1.1em;
font-weight:400;
}
</style>
<script>
module.exports = {
data: () => ({
mous: ['Foo', 'Bar', 'Fizz', 'Buzz'],
custom: false,
value: '',
notifications:true
})
}
</script>

119
one-ui/test_x_old/vuex/detailorder/components/foTestRight.vue Normal file
View File

@@ -0,0 +1,119 @@
<template>
<v-flex xs6 class="right">
<v-layout row>
<v-flex pl-2 pr-2 pt-0 pb-2 md12>
<v-card color="blue lighten-3">
<v-layout align-center row>
<v-flex text-md-left justify-start row fill-height pt-2 pb-2>
<div class="flex display-1 font-weight-medium pt-1 pb-1 pl-2"><kbd>TOTAL</kbd></div>
</v-flex>
<v-flex text-md-right justify-start row fill-height pt-2 pb-2>
<div class="flex display-2 font-weight-medium pt-1 pb-1 pr-2"><kbd>1.200.000</kbd></div>
</v-flex>
</v-layout>
</v-card>
</v-flex>
</v-layout>
<v-layout row>
<v-flex pl-2 pt-1 pr-2 xs12 sm12 md12>
<v-card>
<table>
<tr>
<th class="text-md-center pt-2 pb-2"> # </th>
<th class="text-md-center pt-2 pb-2">PEMERIKSAAN</th>
<th class="text-md-center pt-2 pb-2">BRUTO</th>
<th class="text-md-center pt-2 pb-2">DISKON</th>
<th class="text-md-center pt-2 pb-2">TOTAL</th>
</tr>
<tr>
<td class="text-md-center"> <v-icon color = "red" >delete</v-icon> </td>
<td class="text-md-left pl-3">SGOT</td>
<td class="text-md-right pr-2">50.000</td>
<td class="text-md-right pr-2">5.000</td>
<td class="text-md-right pr-2">45.000</td>
</tr>
<tr>
<td class="text-md-center"> <v-icon color = "red" >delete</v-icon> </td>
<td class="text-md-left pl-3">SGPT</td>
<td class="text-md-right pr-2">50.000</td>
<td class="text-md-right pr-2">5.000</td>
<td class="text-md-right pr-2">45.000</td>
</tr>
<tfoot>
<tr>
<th style="background:#03a9f43d" colspan="3" class="text-md-right pr-2 pt-2 pb-2">SUB TOTAL</th>
<th style="background:#03a9f43d" class="text-md-right pr-2 pt-2 pb-2" colspan="2">100.000</th>
</tr>
<tr>
<th colspan="3" class="text-md-right pr-2 pt-1 pb-1">DISKON PEMBULATAN</th>
<th class="text-md-right pr-2 pt-1 pb-1" colspan="2">10.000</th>
</tr>
</tfoot>
</table>
</v-card>
</v-flex>
</v-layout>
</v-flex>
</template>
<style scoped>
.nota {
font-size: 2em;
font-weight: bold;
text-align: left;
}
.total {
font-size: 2em;
font-weight: bold;
text-align: right;
}
table {
font-family: arial, sans-serif;
border-collapse: collapse;
width: 100%;
background:white;
}
table, th, td {
border: 1px solid black;
border-collapse: collapse;
padding-top: 2px;
padding-bottom: 2px;
}
table>tr>td {
padding: 8px;
}
table>tr>td:first {
padding-left:15px!important;
}
.vintage-text{
text-shadow: 0px -2px 0px #fff, 0px 2px 3px #fff;
}
</style>
<script>
module.exports = {
data: () => ({
mous: ['Foo', 'Bar', 'Fizz', 'Buzz'],
custom: false,
value: ''
})
}
</script>

45
one-ui/test_x_old/vuex/detailorder/components/notaBoxV1.vue Normal file
View File

@@ -0,0 +1,45 @@
<template>
<v-layout row >
<v-flex class="searchbox">
<v-card class="blue lighten-3 pa-0">
<v-card-actions >
<v-layout row wrap align-center>
<v-flex >
<div class="nota">TOTAL</div>
</v-flex>
<v-flex >
<div class="total">90.000</div>
</v-flex>
</v-layout>
</v-card-actions>
</v-card>
</v-flex>
</v-layout>
</template>
<style scoped>
.layout {
padding:10px;
}
.nota {
font-size: 2em;
font-weight: bold;
text-align: left;
}
.total {
font-size: 2em;
font-weight: bold;
text-align: right;
}
</style>
<script>
module.exports = {
}
</script>

74
one-ui/test_x_old/vuex/detailorder/components/notadetailBoxV1.vue Normal file
View File

@@ -0,0 +1,74 @@
<template>
<div>
<table>
<tr>
<th>Pemeriksaan</th>
<th>Bruto</th>
<th>Diskon</th>
<th>Total</th>
<th>Action</th>
</tr>
<tr>
<td style = "text-align: left; padding : 5px;">SGOT</td>
<td >50.000</td>
<td >5.000</td>
<td >45.000</td>
<td > <v-icon color = "red" >delete</v-icon> </td>
</tr>
<tr>
<td style = "text-align: left; padding : 5px;">SGPT</td>
<td >50.000</td>
<td >5.000</td>
<td >45.000</td>
<td > <v-icon color = "red" >delete</v-icon> </td>
</tr>
<tfoot>
<tr>
<th colspan="3" style = "text-align: right;">SUB TOTAL</th>
<th >100.000</th>
<th >&nbsp;</th>
</tr>
<tr>
<th colspan="3" style = "text-align: right;">DISKON PEMBULATAN</th>
<th >10.000</th>
<th >&nbsp;</th>
</tr>
</tfoot>
</table>
</div>
</template>
<style scoped>
table {
font-family: arial, sans-serif;
border-collapse: collapse;
width: 100%;
}
table, th {
border: 1px solid #dddddd;
text-align: center;
padding: 8px;
}
tr:nth-child(even) {
background-color: #dddddd;
}
</style>
<script>
module.exports = {
}
</script>

18
one-ui/test_x_old/vuex/detailorder/components/oneFoOrderListV1.vue Normal file
View File

@@ -0,0 +1,18 @@
<template>
<v-flex xs6>
<nota-box> </nota-box>
<v-flex grow >
<notadetail-box> </notadetail-box>
</v-flex>
</v-flex>
</template>
<script>
module.exports = {
components : {
'nota-box' : httpVueLoader('./notaBoxV1.vue'),
'notadetail-box' : httpVueLoader('./notadetailBoxV1.vue'),
}
}
</script>

24
one-ui/test_x_old/vuex/detailorder/components/oneFoPatientV1.vue Normal file
View File

@@ -0,0 +1,24 @@
<template>
<v-layout row wrap>
<v-flex xs6 class="left">
Left
</v-flex>
<v-flex xs6 class="right">
Right
</v-flex>
</v-layout>
</template>
<style scoped>
.left {
background-color:red;
}
.right {
background-color:blue;
}
</style>
<script>
module.exports = {
}
</script>

28
one-ui/test_x_old/vuex/detailorder/components/oneFoPatientV2.vue Normal file
View File

@@ -0,0 +1,28 @@
<template>
<v-layout row wrap>
<v-flex xs6 class="left">
<v-layout column fill-height>
<v-flex shrink class="searchbox">
searchbox
</v-flex>
<v-flex grow class="searchresult">
search result
</v-flex>
</v-layout>
</v-flex>
</v-layout>
</template>
<style scoped>
.searchbox {
background-color:blue;
}
.searchresult {
background-color:red;
}
</style>
<script>
module.exports = {
}
</script>

11
one-ui/test_x_old/vuex/detailorder/components/oneFoPatientV3.vue Normal file
View File

@@ -0,0 +1,11 @@
<template>
<pasien-search> </pasien-search>
</template>
<script>
module.exports = {
components : {
'pasien-search' : httpVueLoader('./pasienSearch.vue')
}
}
</script>

26
one-ui/test_x_old/vuex/detailorder/components/oneFoPatientV4.vue Normal file
View File

@@ -0,0 +1,26 @@
<template>
<v-layout row wrap>
<v-flex xs6 class="left">
<v-layout column wrap fill-height>
<search-box></search-box>
<v-flex grow class="searchresult">
search result
</v-flex>
</v-layout>
</v-flex>
</v-layout>
</template>
<style scoped>
.searchresult {
background-color:white;
}
</style>
<script>
module.exports = {
components : {
'search-box' : httpVueLoader('./searchBoxV3.vue')
}
}
</script>

28
one-ui/test_x_old/vuex/detailorder/components/pasienSearch.vue Normal file
View File

@@ -0,0 +1,28 @@
<template>
<v-layout row wrap>
<v-flex xs6 class="left">
<v-layout column wrap fill-height>
<search-box></search-box>
<v-flex grow class="searchresult">
search result
</v-flex>
</v-layout>
</v-flex>
</v-layout>
</template>
<style scoped>
.searchresult {
background-color:red;
}
</style>
<script>
module.exports = {
components : {
'search-box' : httpVueLoader('./searchBoxV3.vue')
}
}
</script>

11
one-ui/test_x_old/vuex/detailorder/components/searchBox.vue Normal file
View File

@@ -0,0 +1,11 @@
<template>
<v-flex xs2 class="searchbox">
searchbox in component
</v-flex>
</template>
<style scoped>
</style>
<script>
module.exports = {
}
</script>

15
one-ui/test_x_old/vuex/detailorder/components/searchBoxV2.vue Normal file
View File

@@ -0,0 +1,15 @@
<template>
<v-flex shrink class="searchbox">
<v-card >
<v-card-text>
Search Box
</v-card-text>
</v-card>
</v-flex>
</template>
<style scoped>
</style>
<script>
module.exports = {
}
</script>

60
one-ui/test_x_old/vuex/detailorder/components/searchBoxV3.vue Normal file
View File

@@ -0,0 +1,60 @@
<template>
<v-flex shrink wrap class="searchbox">
<v-card class="blue lighten-3">
<v-card-actions >
<v-layout row wrap align-center>
<v-flex xs3>
<input class="noreg" type="text" placeholder="No Reg" ></input>
</v-flex>
<v-flex xs5>
<input class="search" type="text" placeholder="Name+HP+DOB+Alamat" ></input>
</v-flex>
<v-flex >
<v-btn left rounded class="btn-search">
Search
</v-btn>
<v-btn left rounded class="btn-new" >
New
</v-btn>
</v-flex>
</v-layout>
</v-card-actions>
</v-card>
</v-flex>
</template>
<style scoped>
.btn-search{
background-color: #ff8a65!important;
color:white!important;
}
.btn-new {
background-color: #ffd54f!important;
color:white!important;
}
.layout {
padding:10px;
}
::placeholder {
color: #b0b0b0 ;
font-size: 1.1em;
font-style: italic;
font-weight:normal;
}
input.noreg {
font-size: 1.2em;
font-weight: bold;
}
input {
background-color:white;
padding:4px;
font-size: 1.1em;
vertical-align:middle;
border: solid 1px #dedede;
border-radius: 5px;
width:90%;
}
</style>
<script>
module.exports = {
}
</script>

59
one-ui/test_x_old/vuex/detailorder/index.php Normal file
View File

@@ -0,0 +1,59 @@
<!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/vuetify.min.css">
</head>
<body>
<div v-cloak id="app">
<v-app id="smartApp" >
<one-navbar></one-navbar>
<v-content class="blue lighten-5" >
<one-fo-test> </one-fo-test>
</v-content>
<one-footer> </one-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>
<script src="../../../libs/vendor/httpVueLoader.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',
components: {
'one-navbar': httpVueLoader('../../../apps/components/oneNavbarComponent.vue'),
'one-footer': httpVueLoader('../../../apps/components/oneFooter.vue'),
'one-fo-test': httpVueLoader('./components/foTest.vue'),
'one-fo-test-right': httpVueLoader('./components/foTestRight.vue'),
}
})
</script>
<style>
[v-cloak] {
display: none
}
</style>
</body>
</html>

0
one-ui/test_x_old/vuex/detailorder/mutation.js Normal file
View File

71
one-ui/test_x_old/vuex/detailorder/store.js Normal file
View File

@@ -0,0 +1,71 @@
// State
// data ...
// Mutations
//
//
// Actions
import * as api from "./api.js";
export const store = new Vuex.Store({
state: {
rows: [],
midPages: [],
isLoading: false,
isError: false,
errorMessage: "",
query: "",
page: 0,
totalPage: 0,
totalRecord: 0
},
mutations: {
updateBank(state, data) {
// console.log(data);
if (data.status == "ERR") {
state.isError = true;
if (data.db_error) {
state.errorMessage = data.db_error.message;
} else {
state.errorMessage = data.message;
}
state.query = data.query;
state.page = 0;
state.totalPage = 0;
state.totalRecord = 0;
state.rows = [];
state.midPages = [];
} else {
state.isError = false;
state.errorMessage = "";
state.query = data.query;
state.page = data.page;
state.totalPage = data.totalPage;
state.totalRecord = data.totalRecord;
state.rows = data.rows;
state.midPages = data.midPages;
}
},
updateLoading(state, flag) {
state.isLoading = flag;
},
resetError(state) {
state.isError = false;
state.errorMessage = "";
}
},
actions: {
async searchBank(context, data) {
context.commit("updateLoading", true);
let resp = await api.searchBank(
data.query,
data.page,
data.rowPerPage
);
context.commit("updateLoading", false);
context.commit("updateBank", resp);
setTimeout(function() {
context.commit("resetError");
}, 5000);
}
}
});

0
one-ui/test_x_old/vuex/hasil01/action.js Normal file
View File

31
one-ui/test_x_old/vuex/hasil01/api.js Normal file
View File

@@ -0,0 +1,31 @@
// API :
// search bank
// paramater : query , page , rowPerPage
const URL =
"http://lebaran.aplikasi.web.id/smartlab_api/vuex/t02/search_bank";
export async function searchBank(query, page, rowPerPage = 15) {
try {
var resp = await axios.post(URL, {
query: query,
page: page,
rowPerPage: rowPerPage
});
if (resp.status != 200) {
return {
status: "ERR",
query: query,
message: resp.statusText
};
}
let data = resp.data;
data.query = query;
return data;
} catch (e) {
return {
status: "ERR",
query: query,
message: e.message
};
}
}

71
one-ui/test_x_old/vuex/hasil01/components/hasilBoxV1.vue Normal file
View File

@@ -0,0 +1,71 @@
<template>
<v-card class="fill-height" >
<v-card-text >
<v-autocomplete
cache-items
hide-no-data
hide-details
label="Nama Dokter"
solo-inverted
></v-autocomplete>
<v-select label="Alamat Dokter" ></v-select>
<v-select label="Bahasa" ></v-select>
<table>
<tr>
<th>Tanggal</th>
<th>Jam</th>
<th>Pemeriksaan</th>
</tr>
<tr>
<td style = "text-align: left; padding : 5px;">12/12/2019</td>
<td >13.30</td>
<td >SGOT,SGPT</td>
</tr>
<tr>
<td style = "text-align: left; padding : 5px;">15/12/2019</td>
<td >16.00</td>
<td > Urine Lengkap</td>
</tr>
</table>
<v-spacer></v-spacer>
</v-card-text>
</v-card>
</template>
<style scoped>
.myclass {
height:100%;
}
table {
font-family: arial, sans-serif;
border-collapse: collapse;
width: 100%;
}
table, th {
border: 1px solid #dddddd;
text-align: center;
padding: 8px;
}
tr:nth-child(even) {
background-color: #dddddd;
}
</style>
<script>
module.exports = {
}
</script>

71
one-ui/test_x_old/vuex/hasil01/components/kirimBoxV1.vue Normal file
View File

@@ -0,0 +1,71 @@
<template>
<v-card class="my-right fill-height">
<v-card-text>
<v-layout>
<v-flex xs12 md3>
<v-checkbox v-model="checkbox" :error-messages="checkboxErrors" label="Email Pasien" @change="$v.checkbox.$touch()" @blur="$v.checkbox.$touch()" ></v-checkbox>
</v-flex>
<v-flex xs12 md9 >
<v-text-field v-model="email" :error-messages="emailErrors" label="E-mail" @input="$v.email.$touch()" @blur="$v.email.$touch()" ></v-text-field>
</v-flex>
</v-layout>
<v-layout>
<v-flex xs12 md3>
<v-checkbox v-model="checkbox" :error-messages="checkboxErrors" label="Email Dokter " @change="$v.checkbox.$touch()" @blur="$v.checkbox.$touch()" ></v-checkbox>
</v-flex>
<v-flex xs12 md9 >
<v-text-field v-model="email" :error-messages="emailErrors" label="E-mail" @input="$v.email.$touch()" @blur="$v.email.$touch()" ></v-text-field>
</v-flex>
</v-layout>
<v-layout>
<v-flex xs12 md3>
<v-checkbox v-model="checkbox" :error-messages="checkboxErrors" label="Email Rekanan " @change="$v.checkbox.$touch()" @blur="$v.checkbox.$touch()" ></v-checkbox>
</v-flex>
<v-flex xs12 md9 >
<v-text-field v-model="email" :error-messages="emailErrors" label="E-mail" @input="$v.email.$touch()" @blur="$v.email.$touch()" ></v-text-field>
</v-flex>
</v-layout>
<v-layout>
<v-flex xs12 md3>
<v-checkbox v-model="checkbox" :error-messages="checkboxErrors" label="Kirim Rekanan" @change="$v.checkbox.$touch()" @blur="$v.checkbox.$touch()" ></v-checkbox>
</v-flex>
<v-flex xs12 md9 >
<v-text-field v-model="email" :error-messages="emailErrors" label="Alamat Rekanan" @input="$v.email.$touch()" @blur="$v.email.$touch()" ></v-text-field>
</v-flex>
</v-layout>
<v-layout>
<v-flex xs12 md3>
<v-checkbox v-model="checkbox" :error-messages="checkboxErrors" label="Kirim Dokter" @change="$v.checkbox.$touch()" @blur="$v.checkbox.$touch()" ></v-checkbox>
</v-flex>
<v-flex xs12 md9 >
<v-text-field v-model="email" :error-messages="emailErrors" label="Alamat Dokter" @input="$v.email.$touch()" @blur="$v.email.$touch()" ></v-text-field>
</v-flex>
</v-layout>
<v-layout>
<v-flex xs12 md3>
<v-checkbox v-model="checkbox" :error-messages="checkboxErrors" label="Ambil Sendiri " @change="$v.checkbox.$touch()" @blur="$v.checkbox.$touch()" ></v-checkbox>
</v-flex>
</v-card-text>
</v-card>
</template>
<style scoped>
.my-right {
margin-left:10px;
}
</style>
<script>
module.exports = {
}
</script>

33
one-ui/test_x_old/vuex/hasil01/components/oneFoHasilV1.vue Normal file
View File

@@ -0,0 +1,33 @@
<template>
<v-layout row wrap>
<v-flex xs6 fill-height class="left">
<hasil-box> </hasil-box>
</v-flex>
<v-flex xs6 class="right" fill-height>
<kirim-box> </kirim-box>
</v-flex>
</v-layout>
</template>
<style scoped>
.judul {
font-size: 2em;
font-weight: bold;
text-align: left;
}
</style>
<script>
module.exports = {
components : {
'hasil-box' : httpVueLoader('./hasilBoxV1.vue'),
'kirim-box' : httpVueLoader('./kirimBoxV1.vue'),
}
}
</script>

59
one-ui/test_x_old/vuex/hasil01/index.php Normal file
View File

@@ -0,0 +1,59 @@
<!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/vuetify.min.css">
</head>
<body>
<div v-cloak id="app">
<v-app id="smartApp" >
<one-navbar></one-navbar>
<v-content class="blue lighten-5" >
<v-container fluid fill-height>
<one-fo-hasil> </one-fo-hasil>
</v-container>
</v-content>
<one-footer> </one-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>
<script src="../../../libs/vendor/httpVueLoader.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',
components: {
'one-navbar': httpVueLoader('../../../apps/components/oneNavbarComponent.vue'),
'one-footer': httpVueLoader('../../../apps/components/oneFooter.vue'),
'one-fo-hasil': httpVueLoader('./components/oneFoHasilV1.vue'),
}
})
</script>
<style>
[v-cloak] {
display: none
}
</style>
</body>
</html>

0
one-ui/test_x_old/vuex/hasil01/mutation.js Normal file
View File

71
one-ui/test_x_old/vuex/hasil01/store.js Normal file
View File

@@ -0,0 +1,71 @@
// State
// data ...
// Mutations
//
//
// Actions
import * as api from "./api.js";
export const store = new Vuex.Store({
state: {
rows: [],
midPages: [],
isLoading: false,
isError: false,
errorMessage: "",
query: "",
page: 0,
totalPage: 0,
totalRecord: 0
},
mutations: {
updateBank(state, data) {
// console.log(data);
if (data.status == "ERR") {
state.isError = true;
if (data.db_error) {
state.errorMessage = data.db_error.message;
} else {
state.errorMessage = data.message;
}
state.query = data.query;
state.page = 0;
state.totalPage = 0;
state.totalRecord = 0;
state.rows = [];
state.midPages = [];
} else {
state.isError = false;
state.errorMessage = "";
state.query = data.query;
state.page = data.page;
state.totalPage = data.totalPage;
state.totalRecord = data.totalRecord;
state.rows = data.rows;
state.midPages = data.midPages;
}
},
updateLoading(state, flag) {
state.isLoading = flag;
},
resetError(state) {
state.isError = false;
state.errorMessage = "";
}
},
actions: {
async searchBank(context, data) {
context.commit("updateLoading", true);
let resp = await api.searchBank(
data.query,
data.page,
data.rowPerPage
);
context.commit("updateLoading", false);
context.commit("updateBank", resp);
setTimeout(function() {
context.commit("resetError");
}, 5000);
}
}
});

0
one-ui/test_x_old/vuex/lama/adhi/action.js Normal file
View File

31
one-ui/test_x_old/vuex/lama/adhi/api.js Normal file
View File

@@ -0,0 +1,31 @@
// API :
// search bank
// paramater : query , page , rowPerPage
const URL =
"http://lebaran.aplikasi.web.id/smartlab_api/vuex/t02/search_bank";
export async function searchBank(query, page, rowPerPage = 15) {
try {
var resp = await axios.post(URL, {
query: query,
page: page,
rowPerPage: rowPerPage
});
if (resp.status != 200) {
return {
status: "ERR",
query: query,
message: resp.statusText
};
}
let data = resp.data;
data.query = query;
return data;
} catch (e) {
return {
status: "ERR",
query: query,
message: e.message
};
}
}

69
one-ui/test_x_old/vuex/lama/adhi/components/dialogFormComponent.js Normal file
View File

@@ -0,0 +1,69 @@
var dialogFormComponent = {
template: `
<template>
<v-layout row justify-center>
<v-dialog v-model="dialog" persistent max-width="500px">
<v-btn slot="activator" color="primary" dark>Open Dialog</v-btn>
<v-card>
<v-card-title>
<span class="headline">User Profile</span>
</v-card-title>
<v-card-text>
<v-container grid-list-md>
<v-layout wrap>
<v-flex xs12 sm6 md4>
<v-text-field label="Legal first name" required></v-text-field>
</v-flex>
<v-flex xs12 sm6 md4>
<v-text-field label="Legal middle name" hint="example of helper text only on focus"></v-text-field>
</v-flex>
<v-flex xs12 sm6 md4>
<v-text-field
label="Legal last name"
hint="example of persistent helper text"
persistent-hint
required
></v-text-field>
</v-flex>
<v-flex xs12>
<v-text-field label="Email" required></v-text-field>
</v-flex>
<v-flex xs12>
<v-text-field label="Password" type="password" required></v-text-field>
</v-flex>
<v-flex xs12 sm6>
<v-select
:items="['0-17', '18-29', '30-54', '54+']"
label="Age"
required
></v-select>
</v-flex>
<v-flex xs12 sm6>
<v-autocomplete
:items="['Skiing', 'Ice hockey', 'Soccer', 'Basketball', 'Hockey', 'Reading', 'Writing', 'Coding', 'Basejump']"
label="Interests"
multiple
chips
></v-autocomplete>
</v-flex>
</v-layout>
</v-container>
<small>*indicates required field</small>
</v-card-text>
<v-card-actions>
<v-spacer></v-spacer>
<v-btn color="blue darken-1" flat @click.native="dialog = false">Close</v-btn>
<v-btn color="blue darken-1" flat @click.native="dialog = false">Save</v-btn>
</v-card-actions>
</v-card>
</v-dialog>
</v-layout>
</template>
`,
data: () => ({
dialog: false
})
};
export { dialogFormComponent };

71
one-ui/test_x_old/vuex/lama/adhi/components/ioAlatComponent.js Normal file
View File

@@ -0,0 +1,71 @@
var ioAlatComponent = {
template: `
<v-flex md3 xs6 class='p-io-alat'>
<v-card
class="mx-auto io-alat light-green lighten-4"
light
max-width="400"
>
<v-card-title >
<span class="title font-weight-light"> Title </span>
</v-card-title>
<v-card-text>
<div>
<span class="label">Port</span>
<span class="label-sep">:</span>
<span class="label-val">123</span>
</div>
<div>
<span class="label">Glu</span>
<span class="label-sep">:</span>
<span class="label-val">1023</span>
</div>
<div>
<span class="label">DB</span>
<span class="label-sep">:</span>
<span class="label-val">pdb</span>
</div>
<div>
<span class="label">LIS</span>
<span class="label-sep">:</span>
<span class="label-val">Enabled</span>
</div>
</v-card-text>
<v-card-actions class="action light-green lighten-1">
<v-spacer></v-spacer>
<v-icon color="#EFFCED" v-bind:class="true" >get_app</v-icon>
</v-card-actions>
</v-card>
</v-flex>
`,
data: function() {
return {}
},
methods: {},
components: {
SheetFooter: {
functional: true,
render(h, {
children
}) {
return h('v-sheet', {
staticClass: 'mt-auto align-center justify-center d-flex',
props: {
color: 'rgba(0, 0, 0, .36)',
dark: true,
height: 50
}
}, children)
}
}
}
}
export {
ioAlatComponent
};

139
one-ui/test_x_old/vuex/lama/adhi/components/listBankComponent.js Normal file
View File

@@ -0,0 +1,139 @@
var listBankComponent = {
template: `
<v-card class="xs12 md12" >
<v-card-title>
<v-layout>
<v-flex xs12 sm8>
<v-toolbar-title>Bank Listing <v-btn depressed small color="primary">New Data</v-btn></v-toolbar-title>
</v-flex>
<v-flex xs12 sm4>
<v-spacer></v-spacer>
<v-text-field
v-model="query"
append-icon="search"
@click:clear="clearSearch"
@keydown.enter="doSearch"
@click:append="doSearch"
label="Search"
single-line
hide-details
clearable
class="xs12 md3"
></v-text-field>
</v-flex>
</v-layout>
</v-card-title>
<v-data-table :headers="headers" :items="banks"
:loading="isLoading"
hide-actions class="elevation-1">
<template slot="items" slot-scope="props">
<td class="text-xs-center">{{ props.item.M_BankCode }}</td>
<td>{{ props.item.M_BankName }}</td>
<td>{{ props.item.M_BankAddress }}</td>
<td>{{ props.item.M_BankBranch }}</td>
<td><v-btn depressed small color="info">Edit</v-btn> <v-btn depressed small color="error">Delete</v-btn></td>
</template>
<template slot="no-data">
<v-alert :value="isError" color="error" icon="warning">
{{errorMessage}}
</v-alert>
<v-spacer></v-spacer>
</template>
<template slot="footer">
<td colspan="2" class="text-xs-left">
Total Records : {{totalRecord}}, page {{page}} of {{totalPage}}.
</td>
<td colspan="3" class="text-xs-right">
<v-pagination :length="totalPage" :value="page" :total-visible="10"
@next="nextPage" @prev="prevPage"
@input="gotoPage" >
</v-pagination>
</td>
</template>
</v-data-table>
</v-card>
`,
mounted() {
this.doSearch();
},
data() {
return {
query: "",
headers: [{
text: "Code",
align: "left",
sortable: false,
value: "M_BankCode"
},
{
text: "Name",
align: "left",
sortable: false,
value: "M_BankName"
},
{
text: "Address",
value: "M_BankAddress",
sortable: false,
align: "left",
width: "30%"
},
{
text: "Branch",
value: "M_BankBranch",
sortable: false,
align: "left"
},
{
text: "Action",
value: "action",
sortable: false,
align: "center",
width: "20%"
}
]
};
},
methods: {
clearSearch() {
this.query = "";
this.doSearch();
},
doSearch(page = 1, rowPerPage = 8) {
if (this.query == null) this.query = "";
this.$store.dispatch("searchBank", {
query: this.query,
page,
rowPerPage
});
},
prevPage() {
let c_page = this.page - 1;
this.doSearch(c_page);
},
nextPage() {
let c_page = this.page + 1;
this.doSearch(c_page);
},
gotoPage(e) {
let c_page = e;
this.doSearch(c_page);
}
},
computed: {
...Vuex.mapState({
isLoading: state => state.isLoading,
isError: state => state.isError,
errorMessage: state => state.errorMessage,
banks: state => state.rows,
totalRecord: state => state.totalRecord,
page: state => state.page,
totalPage: state => state.totalPage
})
},
updated() {
console.log("Component Updated");
}
};
export { listBankComponent };

138
one-ui/test_x_old/vuex/lama/adhi/components/listPatientComponent.js Normal file
View File

@@ -0,0 +1,138 @@
var listPatientComponent = {
template: `
<v-card class="xs12 md12" >
<v-card-title>
<v-layout>
<v-flex xs12 sm8>
<v-toolbar-title>Patient Listing</v-toolbar-title>
</v-flex>
<v-flex xs12 sm4>
<v-spacer></v-spacer>
<v-text-field
v-model="query"
append-icon="search"
@click:clear="clearSearch"
@keydown.enter="doSearch"
@click:append="doSearch"
label="Search"
single-line
hide-details
clearable
class="xs12 md3"
></v-text-field>
</v-flex>
</v-layout>
</v-card-title>
<v-data-table :headers="headers" :items="patients"
:loading="isLoading"
hide-actions class="elevation-1">
<template slot="items" slot-scope="props">
<td>{{ props.item.M_PatientNoReg }}</td>
<td>{{ props.item.M_PatientName }}</td>
<td class="text-xs-center">{{ props.item.M_PatientDOB }}</td>
<td>{{ props.item.M_PatientHP }}</td>
<td>{{ props.item.M_PatientAddress }}</td>
</template>
<template slot="no-data">
<v-alert :value="isError" color="error" icon="warning">
{{errorMessage}}
</v-alert>
<v-spacer></v-spacer>
</template>
<template slot="footer">
<td colspan="2" class="text-xs-left">
Total Records : {{totalRecord}}, page {{page}} of {{totalPage}}.
</td>
<td colspan="3" class="text-xs-right">
<v-pagination :length="totalPage" :value="page" :total-visible="10"
@next="nextPage" @prev="prevPage"
@input="gotoPage" >
</v-pagination>
</td>
</template>
</v-data-table>
</v-card>
`,
mounted() {
this.doSearch();
},
data() {
return {
query: "",
headers: [
{
text: "No. Reg",
align: "left",
sortable: false,
value: "M_PatientNoReg"
},
{
text: "Name",
align: "left",
sortable: false,
value: "M_PatientName"
},
{
text: "DOB",
align: "center",
sortable: false,
value: "M_PatientDOB"
},
{
text: "HP",
value: "M_PatientHP",
sortable: false,
align: "left"
},
{
text: "Address",
value: "M_PatientAddress",
sortable: false,
align: "left"
}
]
};
},
methods: {
clearSearch() {
this.query = "";
this.doSearch();
},
doSearch(page = 1, rowPerPage = 8) {
if (this.query == null) this.query = "";
this.$store.dispatch("searchPatient", {
query: this.query,
page,
rowPerPage
});
},
prevPage() {
let c_page = this.page - 1;
this.doSearch(c_page);
},
nextPage() {
let c_page = this.page + 1;
this.doSearch(c_page);
},
gotoPage(e) {
let c_page = e;
this.doSearch(c_page);
}
},
computed: {
...Vuex.mapState({
isLoading: state => state.isLoading,
isError: state => state.isError,
errorMessage: state => state.errorMessage,
patients: state => state.rows,
totalRecord: state => state.totalRecord,
page: state => state.page,
totalPage: state => state.totalPage
})
},
updated() {
console.log("Component Updated");
}
};
export { listPatientComponent };

266
one-ui/test_x_old/vuex/lama/adhi/components/oneFormPatientComponent.js Normal file
View File

@@ -0,0 +1,266 @@
var oneFormPatientComponent= {
template: `
<v-form ref="form" v-model="valid" lazy-validation >
<v-container>
<v-layout>
<v-flex xs12 >
<v-text-field
v-model="Nama"
:rules="namaRules"
label="Nama"
required
></v-text-field>
<v-text-field
v-model="Alamat"
:rules="alamatRules"
label="Alamat"
required
></v-text-field>
<v-text-field
v-model="Umur"
:rules="umurRules"
label="Umur"
required
></v-text-field>
<v-text-field
v-model="Riwayat"
:rules="riwayatRules"
label="Riwayat Pemeriksaan"
></v-text-field>
<v-select
v-model="select"
:items="items"
:rules="[v => !!v || 'Item is required']"
label="Item"
required
></v-select>
<v-checkbox
v-model="checkbox"
:rules="[v => !!v || 'You must agree to continue!']"
label="Do you agree?"
required
></v-checkbox>
<v-btn
:disabled="!valid"
color="success"
@click="validate"
>
Tambah Pasien
</v-btn>
<v-btn
color="error"
@click="reset"
>
Save
</v-btn>
<v-btn
color="warning"
@click="resetValidation"
>
Test
</v-btn>
<v-btn
:disabled="!valid"
color="success"
@click="validate"
>
Test
</v-btn>
<v-btn
color="error"
@click="reset"
>
Test
</v-btn>
<v-btn
color="warning"
@click="resetValidation"
>
Test
</v-btn>
<v-btn
color="warning"
@click="resetValidation"
>
Test
</v-btn>
<v-btn
:disabled="!valid"
color="success"
@click="validate"
>
Test
</v-btn>
<v-btn
color="error"
@click="reset"
>
Test
</v-btn>
<v-btn
color="warning"
@click="resetValidation"
>
Test
</v-btn>
<v-btn
color="warning"
@click="resetValidation"
>
Test
</v-btn>
<v-btn
:disabled="!valid"
color="success"
@click="validate"
>
Test
</v-btn>
<v-btn
color="error"
@click="reset"
>
Test
</v-btn>
<v-btn
color="warning"
@click="resetValidation"
>
Test
</v-btn>
<v-btn
color="warning"
@click="resetValidation"
>
Test
</v-btn>
<v-btn
:disabled="!valid"
color="success"
@click="validate"
>
Test
</v-btn>
<v-btn
color="error"
@click="reset"
>
Test
</v-btn>
<v-btn
color="warning"
@click="resetValidation"
>
Test
</v-btn>
<v-btn
color="warning"
@click="resetValidation"
>
Test
</v-btn>
<v-btn
:disabled="!valid"
color="success"
@click="validate"
>
Test
</v-btn>
<v-btn
color="error"
@click="reset"
>
Test
</v-btn>
<v-btn
color="warning"
@click="resetValidation"
>
Test
</v-btn>
</v-layout>
</v-container>
</v-form>
`,
data: function() {
return {
valid: true,
name: '',
nameRules: [
v => !!v || 'Name is required',
v => (v && v.length <= 10) || 'Name must be less than 10 characters'
],
email: '',
emailRules: [
v => !!v || 'E-mail is required',
v => /.+@.+/.test(v) || 'E-mail must be valid'
],
select: null,
items: [
'Item 1',
'Item 2',
'Item 3',
'Item 4'
],
checkbox: false
};
},
methods: {
validate () {
if (this.$refs.form.validate()) {
this.snackbar = true
}
},
reset () {
this.$refs.form.reset()
},
resetValidation () {
this.$refs.form.resetValidation()
}
}
};
export { oneFormPatientComponent };

165
one-ui/test_x_old/vuex/lama/adhi/components/oneListPatientComponent.js Normal file
View File

@@ -0,0 +1,165 @@
var oneListPatientComponent= {
template: `
<v-container>
<v-layout>
<v-data-table
v-model="selected"
:headers="headers"
:items="desserts"
:pagination.sync="pagination"
select-all
item-key="name"
class="elevation-1"
>
<template slot="headers" slot-scope="props">
<tr>
<th>
<v-checkbox
:input-value="props.all"
:indeterminate="props.indeterminate"
primary
hide-details
@click.stop="toggleAll"
></v-checkbox>
</th>
<th
v-for="header in props.headers"
:key="header.text"
:class="['column sortable', pagination.descending ? 'desc' : 'asc', header.value === pagination.sortBy ? 'active' : '']"
@click="changeSort(header.value)"
>
<v-icon small>arrow_upward</v-icon>
{{ header.text }}
</th>
</tr>
</template>
<template slot="items" slot-scope="props">
<tr :active="props.selected" @click="props.selected = !props.selected">
<td>
<v-checkbox
:input-value="props.selected"
primary
hide-details
></v-checkbox>
</td>
<td>{{ props.item.name }}</td>
<td class="text-xs-right">{{ props.item.calories }}</td>
<td class="text-xs-right">{{ props.item.fat }}</td>
<td class="text-xs-right">{{ props.item.carbs }}</td>
</tr>
</template>
</v-data-table>
</v-layout>
</v-container>
`,
data: function() {
return {
pagination: {
sortBy: 'name'
},
selected: [],
headers: [
{
text: 'Pemeriksaan',
align: 'left',
value: 'name'
},
{ text: 'Harga', value: 'calories' },
{ text: 'Diskon', value: 'fat' },
{ text: 'Total (g)', value: 'carbs' },
],
desserts: [
{
name: 'Frozen Yogurt',
calories: 159,
fat: 6.0,
carbs: 24,
},
{
name: 'Ice cream sandwich',
calories: 237,
fat: 9.0,
carbs: 37,
},
{
name: 'Eclair',
calories: 262,
fat: 16.0,
carbs: 23,
},
{
name: 'Cupcake',
calories: 305,
fat: 3.7,
carbs: 67,
},
{
name: 'Gingerbread',
calories: 356,
fat: 16.0,
carbs: 49,
},
{
name: 'Jelly bean',
calories: 375,
fat: 0.0,
carbs: 94,
},
{
name: 'Lollipop',
calories: 392,
fat: 0.2,
carbs: 98,
},
{
name: 'Honeycomb',
calories: 408,
fat: 3.2,
carbs: 87,
},
{
name: 'Donut',
calories: 452,
fat: 25.0,
carbs: 51,
},
{
name: 'KitKat',
calories: 518,
fat: 26.0,
carbs: 65,
}
]
};
},
methods: {
validate () {
if (this.$refs.form.validate()) {
this.snackbar = true
}
},
reset () {
this.$refs.form.reset()
},
resetValidation () {
this.$refs.form.resetValidation()
}
}
};
export { oneListPatientComponent };

12
one-ui/test_x_old/vuex/lama/adhi/components/searchComponent.js Normal file
View File

@@ -0,0 +1,12 @@
var searchComponent = {
template: `
<div>
<h1>Search Component</h1>
</div>
`,
data() {
return {};
},
methods: {}
};
export { searchComponent };

38
one-ui/test_x_old/vuex/lama/adhi/components/smartNavbarComponent.js Normal file
View File

@@ -0,0 +1,38 @@
var smartNavbarComponent = {
template: `
<span>
<v-navigation-drawer v-model="drawer" fixed app>
<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>
<v-toolbar color="blue lighten-2" dark fixed app>
<v-toolbar-side-icon @click.stop="drawer = !drawer"></v-toolbar-side-icon>
<img src="/one-ui/libs/image/onetext.png" alt="image" height = 15px>
</v-toolbar>
</span>
`,
data: function() {
return {
drawer: false
};
},
methods: {}
};
export { smartNavbarComponent };

76
one-ui/test_x_old/vuex/lama/adhi/index.php Normal file
View File

@@ -0,0 +1,76 @@
<!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>SmartOne</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 class="blue lighten-5" >
<v-container fluid fill-height>
<v-layout fill-height row wrap>
<v-flex xs6 style="background-color:white">
<one-form-pasien></one-form-pasien>
</v-flex>
<v-flex xs6 style="background-color:white">
<one-list-pasien></one-list-pasien>
</v-flex>
</v-layout>
</v-container>
</v-content>
<v-footer color="blue lighten-2" 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 { store } from './store.js<?php echo $ts ?>';
import { smartNavbarComponent } from './components/smartNavbarComponent.js<?php echo $ts ?>';
import { oneFormPatientComponent } from './components/oneFormPatientComponent.js<?php echo $ts ?>';
import { oneListPatientComponent } from './components/oneListPatientComponent.js<?php echo $ts ?>';
//for testing
// window.store = store;
new Vue({
store,
el: '#app',
components: {
'smart-navbar': smartNavbarComponent,
'one-form-pasien': oneFormPatientComponent,
'one-list-pasien': oneListPatientComponent,
},
data: {
drawer: false,
}
})
</script>
<style>
[v-cloak] {
display: none
}
</style>
</body>
</html>

0
one-ui/test_x_old/vuex/lama/adhi/mutation.js Normal file
View File

71
one-ui/test_x_old/vuex/lama/adhi/store.js Normal file
View File

@@ -0,0 +1,71 @@
// State
// data ...
// Mutations
//
//
// Actions
import * as api from "./api.js";
export const store = new Vuex.Store({
state: {
rows: [],
midPages: [],
isLoading: false,
isError: false,
errorMessage: "",
query: "",
page: 0,
totalPage: 0,
totalRecord: 0
},
mutations: {
updateBank(state, data) {
// console.log(data);
if (data.status == "ERR") {
state.isError = true;
if (data.db_error) {
state.errorMessage = data.db_error.message;
} else {
state.errorMessage = data.message;
}
state.query = data.query;
state.page = 0;
state.totalPage = 0;
state.totalRecord = 0;
state.rows = [];
state.midPages = [];
} else {
state.isError = false;
state.errorMessage = "";
state.query = data.query;
state.page = data.page;
state.totalPage = data.totalPage;
state.totalRecord = data.totalRecord;
state.rows = data.rows;
state.midPages = data.midPages;
}
},
updateLoading(state, flag) {
state.isLoading = flag;
},
resetError(state) {
state.isError = false;
state.errorMessage = "";
}
},
actions: {
async searchBank(context, data) {
context.commit("updateLoading", true);
let resp = await api.searchBank(
data.query,
data.page,
data.rowPerPage
);
context.commit("updateLoading", false);
context.commit("updateBank", resp);
setTimeout(function() {
context.commit("resetError");
}, 5000);
}
}
});

0
one-ui/test_x_old/vuex/lama/adhi1/action.js Normal file
View File

31
one-ui/test_x_old/vuex/lama/adhi1/api.js Normal file
View File

@@ -0,0 +1,31 @@
// API :
// search bank
// paramater : query , page , rowPerPage
const URL =
"http://lebaran.aplikasi.web.id/smartlab_api/vuex/t02/search_bank";
export async function searchBank(query, page, rowPerPage = 15) {
try {
var resp = await axios.post(URL, {
query: query,
page: page,
rowPerPage: rowPerPage
});
if (resp.status != 200) {
return {
status: "ERR",
query: query,
message: resp.statusText
};
}
let data = resp.data;
data.query = query;
return data;
} catch (e) {
return {
status: "ERR",
query: query,
message: e.message
};
}
}

69
one-ui/test_x_old/vuex/lama/adhi1/components/dialogFormComponent.js Normal file
View File

@@ -0,0 +1,69 @@
var dialogFormComponent = {
template: `
<template>
<v-layout row justify-center>
<v-dialog v-model="dialog" persistent max-width="500px">
<v-btn slot="activator" color="primary" dark>Open Dialog</v-btn>
<v-card>
<v-card-title>
<span class="headline">User Profile</span>
</v-card-title>
<v-card-text>
<v-container grid-list-md>
<v-layout wrap>
<v-flex xs12 sm6 md4>
<v-text-field label="Legal first name" required></v-text-field>
</v-flex>
<v-flex xs12 sm6 md4>
<v-text-field label="Legal middle name" hint="example of helper text only on focus"></v-text-field>
</v-flex>
<v-flex xs12 sm6 md4>
<v-text-field
label="Legal last name"
hint="example of persistent helper text"
persistent-hint
required
></v-text-field>
</v-flex>
<v-flex xs12>
<v-text-field label="Email" required></v-text-field>
</v-flex>
<v-flex xs12>
<v-text-field label="Password" type="password" required></v-text-field>
</v-flex>
<v-flex xs12 sm6>
<v-select
:items="['0-17', '18-29', '30-54', '54+']"
label="Age"
required
></v-select>
</v-flex>
<v-flex xs12 sm6>
<v-autocomplete
:items="['Skiing', 'Ice hockey', 'Soccer', 'Basketball', 'Hockey', 'Reading', 'Writing', 'Coding', 'Basejump']"
label="Interests"
multiple
chips
></v-autocomplete>
</v-flex>
</v-layout>
</v-container>
<small>*indicates required field</small>
</v-card-text>
<v-card-actions>
<v-spacer></v-spacer>
<v-btn color="blue darken-1" flat @click.native="dialog = false">Close</v-btn>
<v-btn color="blue darken-1" flat @click.native="dialog = false">Save</v-btn>
</v-card-actions>
</v-card>
</v-dialog>
</v-layout>
</template>
`,
data: () => ({
dialog: false
})
};
export { dialogFormComponent };

139
one-ui/test_x_old/vuex/lama/adhi1/components/listBankComponent.js Normal file
View File

@@ -0,0 +1,139 @@
var listBankComponent = {
template: `
<v-card class="xs12 md12" >
<v-card-title>
<v-layout>
<v-flex xs12 sm8>
<v-toolbar-title>Bank Listing <v-btn depressed small color="primary">New Data</v-btn></v-toolbar-title>
</v-flex>
<v-flex xs12 sm4>
<v-spacer></v-spacer>
<v-text-field
v-model="query"
append-icon="search"
@click:clear="clearSearch"
@keydown.enter="doSearch"
@click:append="doSearch"
label="Search"
single-line
hide-details
clearable
class="xs12 md3"
></v-text-field>
</v-flex>
</v-layout>
</v-card-title>
<v-data-table :headers="headers" :items="banks"
:loading="isLoading"
hide-actions class="elevation-1">
<template slot="items" slot-scope="props">
<td class="text-xs-center">{{ props.item.M_BankCode }}</td>
<td>{{ props.item.M_BankName }}</td>
<td>{{ props.item.M_BankAddress }}</td>
<td>{{ props.item.M_BankBranch }}</td>
<td><v-btn depressed small color="info">Edit</v-btn> <v-btn depressed small color="error">Delete</v-btn></td>
</template>
<template slot="no-data">
<v-alert :value="isError" color="error" icon="warning">
{{errorMessage}}
</v-alert>
<v-spacer></v-spacer>
</template>
<template slot="footer">
<td colspan="2" class="text-xs-left">
Total Records : {{totalRecord}}, page {{page}} of {{totalPage}}.
</td>
<td colspan="3" class="text-xs-right">
<v-pagination :length="totalPage" :value="page" :total-visible="10"
@next="nextPage" @prev="prevPage"
@input="gotoPage" >
</v-pagination>
</td>
</template>
</v-data-table>
</v-card>
`,
mounted() {
this.doSearch();
},
data() {
return {
query: "",
headers: [{
text: "Code",
align: "left",
sortable: false,
value: "M_BankCode"
},
{
text: "Name",
align: "left",
sortable: false,
value: "M_BankName"
},
{
text: "Address",
value: "M_BankAddress",
sortable: false,
align: "left",
width: "30%"
},
{
text: "Branch",
value: "M_BankBranch",
sortable: false,
align: "left"
},
{
text: "Action",
value: "action",
sortable: false,
align: "center",
width: "20%"
}
]
};
},
methods: {
clearSearch() {
this.query = "";
this.doSearch();
},
doSearch(page = 1, rowPerPage = 8) {
if (this.query == null) this.query = "";
this.$store.dispatch("searchBank", {
query: this.query,
page,
rowPerPage
});
},
prevPage() {
let c_page = this.page - 1;
this.doSearch(c_page);
},
nextPage() {
let c_page = this.page + 1;
this.doSearch(c_page);
},
gotoPage(e) {
let c_page = e;
this.doSearch(c_page);
}
},
computed: {
...Vuex.mapState({
isLoading: state => state.isLoading,
isError: state => state.isError,
errorMessage: state => state.errorMessage,
banks: state => state.rows,
totalRecord: state => state.totalRecord,
page: state => state.page,
totalPage: state => state.totalPage
})
},
updated() {
console.log("Component Updated");
}
};
export { listBankComponent };

138
one-ui/test_x_old/vuex/lama/adhi1/components/listPatientComponent.js Normal file
View File

@@ -0,0 +1,138 @@
var listPatientComponent = {
template: `
<v-card class="xs12 md12" >
<v-card-title>
<v-layout>
<v-flex xs12 sm8>
<v-toolbar-title>Patient Listing</v-toolbar-title>
</v-flex>
<v-flex xs12 sm4>
<v-spacer></v-spacer>
<v-text-field
v-model="query"
append-icon="search"
@click:clear="clearSearch"
@keydown.enter="doSearch"
@click:append="doSearch"
label="Search"
single-line
hide-details
clearable
class="xs12 md3"
></v-text-field>
</v-flex>
</v-layout>
</v-card-title>
<v-data-table :headers="headers" :items="patients"
:loading="isLoading"
hide-actions class="elevation-1">
<template slot="items" slot-scope="props">
<td>{{ props.item.M_PatientNoReg }}</td>
<td>{{ props.item.M_PatientName }}</td>
<td class="text-xs-center">{{ props.item.M_PatientDOB }}</td>
<td>{{ props.item.M_PatientHP }}</td>
<td>{{ props.item.M_PatientAddress }}</td>
</template>
<template slot="no-data">
<v-alert :value="isError" color="error" icon="warning">
{{errorMessage}}
</v-alert>
<v-spacer></v-spacer>
</template>
<template slot="footer">
<td colspan="2" class="text-xs-left">
Total Records : {{totalRecord}}, page {{page}} of {{totalPage}}.
</td>
<td colspan="3" class="text-xs-right">
<v-pagination :length="totalPage" :value="page" :total-visible="10"
@next="nextPage" @prev="prevPage"
@input="gotoPage" >
</v-pagination>
</td>
</template>
</v-data-table>
</v-card>
`,
mounted() {
this.doSearch();
},
data() {
return {
query: "",
headers: [
{
text: "No. Reg",
align: "left",
sortable: false,
value: "M_PatientNoReg"
},
{
text: "Name",
align: "left",
sortable: false,
value: "M_PatientName"
},
{
text: "DOB",
align: "center",
sortable: false,
value: "M_PatientDOB"
},
{
text: "HP",
value: "M_PatientHP",
sortable: false,
align: "left"
},
{
text: "Address",
value: "M_PatientAddress",
sortable: false,
align: "left"
}
]
};
},
methods: {
clearSearch() {
this.query = "";
this.doSearch();
},
doSearch(page = 1, rowPerPage = 8) {
if (this.query == null) this.query = "";
this.$store.dispatch("searchPatient", {
query: this.query,
page,
rowPerPage
});
},
prevPage() {
let c_page = this.page - 1;
this.doSearch(c_page);
},
nextPage() {
let c_page = this.page + 1;
this.doSearch(c_page);
},
gotoPage(e) {
let c_page = e;
this.doSearch(c_page);
}
},
computed: {
...Vuex.mapState({
isLoading: state => state.isLoading,
isError: state => state.isError,
errorMessage: state => state.errorMessage,
patients: state => state.rows,
totalRecord: state => state.totalRecord,
page: state => state.page,
totalPage: state => state.totalPage
})
},
updated() {
console.log("Component Updated");
}
};
export { listPatientComponent };

12
one-ui/test_x_old/vuex/lama/adhi1/components/searchComponent.js Normal file
View File

@@ -0,0 +1,12 @@
var searchComponent = {
template: `
<div>
<h1>Search Component</h1>
</div>
`,
data() {
return {};
},
methods: {}
};
export { searchComponent };

44
one-ui/test_x_old/vuex/lama/adhi1/components/smartNavbarComponent.js Normal file
View File

@@ -0,0 +1,44 @@
var smartNavbarComponent = {
template: `
<span>
<v-navigation-drawer class="light-green lighten-4" v-model="drawer" fixed app>
<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>
<v-toolbar color="light-green" dark fixed app>
<v-toolbar-side-icon @click.stop="drawer = !drawer"></v-toolbar-side-icon>
<v-spacer></v-spacer>
<img src="/one-ui/libs/image/logoone.png" alt="image" height = 50px>
</v-toolbar>
</span>
`,
data: function() {
return {
drawer: false
};
},
methods: {}
};
export { smartNavbarComponent };

47
one-ui/test_x_old/vuex/lama/adhi1/components/tabComponent.js Normal file
View File

@@ -0,0 +1,47 @@
var tabComponent = {
template: `
<v-tabs
centered
color="cyan"
dark
icons-and-text
>
<v-tabs-slider color="yellow"></v-tabs-slider>
<v-tab href="#tab-1">
Recents
<v-icon>phone</v-icon>
</v-tab>
<v-tab href="#tab-2">
Favorites
<v-icon>favorite</v-icon>
</v-tab>
<v-tab href="#tab-3">
Nearby
<v-icon>account_box</v-icon>
</v-tab>
<v-tab-item
v-for="i in 3"
:key="i"
:value="'tab-' + i"
>
<v-card flat>
<v-card-text>{{ text }}</v-card-text>
</v-card>
</v-tab-item>
</v-tabs>
`,
data: function() {
return {
drawer: false
};
},
methods: {}
};
export { tabComponent };

113
one-ui/test_x_old/vuex/lama/adhi1/index.php Normal file
View File

@@ -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>Adhi</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 >
<v-tabs
centered
color="light-green lighten-2
"
dark
icons-and-text
>
<v-tabs-slider color="light-green"></v-tabs-slider>
<v-tab ripple>
Recents
<v-icon>phone</v-icon>
</v-tab>
<v-tab ripple>
Favorites
<v-icon>favorite</v-icon>
</v-tab>
<v-tab ripple>
Nearby
<v-icon>account_box</v-icon>
</v-tab>
<v-tab-item>
<v-card flat>
<v-card-text>Contents for Item 1 go here</v-card-text>
</v-card>
</v-tab-item>
<v-tab-item>
<v-card flat>
<v-card-text>Contents for Item 2 go here</v-card-text>
</v-card>
</v-tab-item>
</v-tabs>
</v-container>
</v-content>
<v-footer color="light-green" app>
<span class="white--text">PT. SAS &copy; 2019</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 { store } from './store.js<?php echo $ts ?>';
import { smartNavbarComponent } from './components/smartNavbarComponent.js<?php echo $ts ?>';
// import { tabComponent } from './components/tabComponent.js<?php echo $ts ?>';
// import { dialogFormComponent } from './components/dialogFormComponent.js<?php echo $ts ?>';
//for testing
// window.store = store;
new Vue({
store,
el: '#app',
components: {
'smart-navbar': smartNavbarComponent,
// 'tab': tabComponent
// 'dialog-form':dialogFormComponent
},
data: {
drawer: false,
},
data: {
text: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed',
}
})
</script>
<style>
[v-cloak] {
display: none
}
</style>
</body>
</html>

0
one-ui/test_x_old/vuex/lama/adhi1/mutation.js Normal file
View File

71
one-ui/test_x_old/vuex/lama/adhi1/store.js Normal file
View File

@@ -0,0 +1,71 @@
// State
// data ...
// Mutations
//
//
// Actions
import * as api from "./api.js";
export const store = new Vuex.Store({
state: {
rows: [],
midPages: [],
isLoading: false,
isError: false,
errorMessage: "",
query: "",
page: 0,
totalPage: 0,
totalRecord: 0
},
mutations: {
updateBank(state, data) {
// console.log(data);
if (data.status == "ERR") {
state.isError = true;
if (data.db_error) {
state.errorMessage = data.db_error.message;
} else {
state.errorMessage = data.message;
}
state.query = data.query;
state.page = 0;
state.totalPage = 0;
state.totalRecord = 0;
state.rows = [];
state.midPages = [];
} else {
state.isError = false;
state.errorMessage = "";
state.query = data.query;
state.page = data.page;
state.totalPage = data.totalPage;
state.totalRecord = data.totalRecord;
state.rows = data.rows;
state.midPages = data.midPages;
}
},
updateLoading(state, flag) {
state.isLoading = flag;
},
resetError(state) {
state.isError = false;
state.errorMessage = "";
}
},
actions: {
async searchBank(context, data) {
context.commit("updateLoading", true);
let resp = await api.searchBank(
data.query,
data.page,
data.rowPerPage
);
context.commit("updateLoading", false);
context.commit("updateBank", resp);
setTimeout(function() {
context.commit("resetError");
}, 5000);
}
}
});

31
one-ui/test_x_old/vuex/lama/doctor/api.js Normal file
View File

@@ -0,0 +1,31 @@
// API :
// search patient
// paramater : query , page , rowPerPage
const URL =
"http://lebaran.aplikasi.web.id/smartlab_api/vuex/t01/search_patient";
export async function searchPatient(query, page, rowPerPage = 15) {
try {
var resp = await axios.post(URL, {
query: query,
page: page,
rowPerPage: rowPerPage
});
if (resp.status != 200) {
return {
status: "ERR",
query: query,
message: resp.statusText
};
}
let data = resp.data;
data.query = query;
return data;
} catch (e) {
return {
status: "ERR",
query: query,
message: e.message
};
}
}

12
one-ui/test_x_old/vuex/lama/doctor/components/searchComponent.js Normal file
View File

@@ -0,0 +1,12 @@
var searchComponent = {
template: `
<div>
<h1>Search Component</h1>
</div>
`,
data() {
return {};
},
methods: {}
};
export { searchComponent };

38
one-ui/test_x_old/vuex/lama/doctor/components/smartNavbarComponent.js Normal file
View File

@@ -0,0 +1,38 @@
var smartNavbarComponent = {
template: `
<span>
<v-navigation-drawer v-model="drawer" fixed app>
<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>
<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: false
};
},
methods: {}
};
export { smartNavbarComponent };

139
one-ui/test_x_old/vuex/lama/doctor/index.html Normal file
View File

@@ -0,0 +1,139 @@
<!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>Doctor</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">
<v-navigation-drawer v-model="drawer" fixed app>
<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>
<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>
<v-content>
<v-container fluid fill-height>
<v-layout >
<v-flex text-xs-center>
<v-data-table :headers="headers" :items="doctor" hide-actions class="elevation-1" >
<template slot="items" slot-scope="props">
<td >{{ props.item.M_DoctorName}}</td>
<td >{{ props.item.M_DoctorHomeAddress}}</td>
<td >{{ props.item.M_DoctorHomeAddress}}</td>
<td >{{ props.item.M_DoctorHP}}</td>
<td >{{ props.item.M_DoctorPhone}}</td>
</template>
</v-data-table>
</v-flex>
</v-layout>
</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 -->
<script type="module">
import { store } from './store.js?x=3';
import { smartNavbarComponent } from './components/smartNavbarComponent.js?x=5';
//for testing
// window.store = store;
new Vue({
store,
el: '#app',
components: {
'smart-navbar': smartNavbarComponent
},
data: {
drawer: false,
headers: [
{
text: 'Nama',
align: 'center',
sortable: false,
value: 'M_DoctorName'
},
{
text: 'Home Address',
align: 'center',
sortable: false,
value: 'M_DoctorHomeAddress'
},
{
text: 'Practice Address',
align: 'center',
sortable: false,
value: 'M_DoctorPracticeAddress'
},
{
text: 'HP',
value: 'M_DoctorHP',
sortable: false,
align: 'center',
},
{
text: 'Phone',
value: 'M_DoctorPhone',
sortable: false,
align: 'center',
}
],
doctor: [
{
M_DoctorName : 'Dr. Suzana T,M.Kes',
M_DoctorHomeAddress: "Jl.Kopo No 161",
M_DoctorPracticeAddress: "Jl. Protokol V / 4 Cijerah",
M_DoctorHP: '022-2506337',
M_DoctorPhone: '081321329126'
},
]
}
})
</script>
<style>
[v-cloak] {
display: none
}
</style>
</body>
</html>

64
one-ui/test_x_old/vuex/lama/doctor/store.js Normal file
View File

@@ -0,0 +1,64 @@
// State
// data ...
// Mutations
//
//
// Actions
import * as api from "./api.js";
export const store = new Vuex.Store({
state: {
rows: [],
midPages: [],
isLoading: false,
isError: false,
errorMessage: "",
query: "",
page: 0,
totalPage: 0,
totalRecord: 0
},
mutations: {
updatePatient(state, data) {
console.log(data);
if (data.status == "ERR") {
state.isError = true;
if (data.dbError) {
state.errorMessage = data.dbError;
} else {
state.errorMessage = data.message;
}
state.query = data.query;
state.page = 0;
state.totalPage = 0;
state.totalRecord = 0;
state.rows = [];
state.midPages = [];
} else {
state.isError = false;
state.errorMessage = "";
state.query = data.query;
state.page = data.page;
state.totalPage = data.totalPage;
state.totalRecord = data.totalRecord;
state.rows = data.rows;
state.midPages = data.midPages;
}
},
updateLoading(state, flag) {
state.isLoading = flag;
}
},
actions: {
async searchPatient(context, data) {
context.commit("updateLoading", true);
let resp = await api.searchPatient(
data.query,
data.page,
data.rowPerPage
);
context.commit("updateLoading", false);
context.commit("updatePatient", resp);
}
}
});

0
one-ui/test_x_old/vuex/lama/fajri-ui/action.js Normal file
View File

31
one-ui/test_x_old/vuex/lama/fajri-ui/api.js Normal file
View File

@@ -0,0 +1,31 @@
// API :
// search patient
// paramater : query , page , rowPerPage
const URL =
"http://lebaran.aplikasi.web.id/smartlab_api/vuex/t05/search_patienttype";
export async function searchPatientType(query, page, rowPerPage = 15) {
try {
var resp = await axios.post(URL, {
query: query,
page: page,
rowPerPage: rowPerPage
});
if (resp.status != 200) {
return {
status: "ERR",
query: query,
message: resp.statusText
};
}
let data = resp.data;
data.query = query;
return data;
} catch (e) {
return {
status: "ERR",
query: query,
message: e.message
};
}
}

5
one-ui/test_x_old/vuex/lama/fajri-ui/components/bar.js Normal file
View File

@@ -0,0 +1,5 @@
var barComponent = {
template: `<div> text bar</div>`
};
export { barComponent };

228
one-ui/test_x_old/vuex/lama/fajri-ui/components/barComponent.js Normal file
View File

@@ -0,0 +1,228 @@
var barComponent = {
template: `<v-layout>
<v-flex
md6="md6"
class="mr-2"
>
<v-card
ref="form"
flat="flat"
light="light"
color="amber lighten-2"
>
<v-card-text>
<v-layout row="row">
<v-flex
d-flex="d-flex"
md12="md12"
>
<v-flex
md6="md6"
ma-2="ma-2"
>
<v-text-field
label="Nama Pasien"
outline="outline"
></v-text-field>
</v-flex>
<v-flex
md3="md3"
ma-2="ma-2"
>
<v-text-field
label="DOB"
outline="outline"
></v-text-field>
</v-flex>
<v-flex
md3="md3"
ma-2="ma-2"
>
<v-text-field
label="HP"
outline="outline"
></v-text-field>
</v-flex>
</v-flex>
</v-layout>
<v-layout
fluid="fluid"
wrap="wrap"
row="row"
>
<v-chip>
<v-avatar>
<img src="https://randomuser.me/api/portraits/men/35.jpg" alt="trevor">
</v-avatar>
Trevor Hansen (M)
</v-chip>
<v-chip>
<v-avatar>
<img src="https://randomuser.me/api/portraits/men/35.jpg" alt="trevor">
</v-avatar>
Fajri hardhita M (M)
</v-chip>
<v-chip>
<v-avatar>
<img src="https://randomuser.me/api/portraits/men/35.jpg" alt="trevor">
</v-avatar>
Jhonny Andrean (M)
</v-chip>
<v-chip>
<v-avatar>
<img src="https://randomuser.me/api/portraits/men/35.jpg" alt="trevor">
</v-avatar>
Dave Emanuel (M)
</v-chip>
<v-chip>
<v-avatar>
<img src="https://randomuser.me/api/portraits/men/35.jpg" alt="trevor">
</v-avatar>
Fian Taruna (M)
</v-chip>
<v-chip>
<v-avatar>
<img src="https://randomuser.me/api/portraits/men/35.jpg" alt="trevor">
</v-avatar>
Andik Hermawan (M)
</v-chip>
<v-chip>
<v-avatar>
<img src="https://randomuser.me/api/portraits/men/35.jpg" alt="trevor">
</v-avatar>
Sugeng (M)
</v-chip>
<v-chip>
<v-avatar>
<img src="https://randomuser.me/api/portraits/men/35.jpg" alt="trevor">
</v-avatar>
Kerta Sanjaya (M)
</v-chip>
<v-chip>
<v-avatar>
<img src="https://randomuser.me/api/portraits/men/35.jpg" alt="trevor">
</v-avatar>
Denis Anggara (M)
</v-chip>
<v-chip>
<v-avatar>
<img src="https://randomuser.me/api/portraits/men/35.jpg" alt="trevor">
</v-avatar>
Mustafa (M)
</v-chip>
<v-chip>
<v-avatar>
<img src="https://randomuser.me/api/portraits/men/35.jpg" alt="trevor">
</v-avatar>
Ribut Sentosa Tanuraga (M)
</v-chip>
<v-chip>
<v-avatar>
<img src="https://randomuser.me/api/portraits/men/35.jpg" alt="trevor">
</v-avatar>
Lilipan Anggara (M)
</v-chip>
</v-layout>
</v-card-text>
</v-card>
</v-flex>
<v-flex
md6="md6"
class="mr-2"
>
<v-card
ref="form"
flat="flat"
light="light"
color="amber lighten-2"
>
<v-layout>
<v-flex md5 align-self-center d-flex >
<img
style="text-align:center"
class="white--text"
height="192px"
src="https://cdn.vuetifyjs.com/images/cards/docks.jpg"
></img>
</v-flex>
<v-flex md7>
<v-data-table
:items="patient"
class="elevation-1"
hide-actions
hide-headers
>
<template slot="items" slot-scope="props">
<td>{{ props.item.label }}</td>
<td align="right">{{ props.item.value }}</td>
</template>
</v-data-table>
</v-flex>
</v-layout>
<v-divider light="light"></v-divider>
<v-layout
fluid="fluid"
wrap="wrap"
row="row"
>
<v-flex md6 pa-2
>
<v-text-field
label="DOKTER"
outline="outline"
></v-text-field>
</v-flex>
<v-flex pa-2 md6>
<v-select
v-model="select"
:items="items"
item-text="state"
item-value="abbr"
return-object
label="Alamat Dokter"
outline
></v-select>
</v-flex>
</v-layout>
</v-card-text>
</v-card>
</v-flex>
</v-layout>`,
data: function() {
return {
patient: [
{ label: 'No Reg', value: 'ABT565651551' },
{ label: 'Nama', value: ' Lilipan Anggara' },
{ label: 'DOB', value: '22-01-1995' },
{ label: 'Alamat', value: 'Desa Kauman Tegal' },
],
select: { state: 'Georgia', abbr: 'GA' },
items: [
{ state: 'Florida', abbr: 'FL' },
{ state: 'Georgia', abbr: 'GA' },
{ state: 'Nebraska', abbr: 'NE' },
{ state: 'California', abbr: 'CA' },
{ state: 'New York', abbr: 'NY' }
]
};
},
methods: {}
};
export {
barComponent
};

5
one-ui/test_x_old/vuex/lama/fajri-ui/components/fooComponent.js Normal file
View File

@@ -0,0 +1,5 @@
var fooComponent = {
template: `<div> text foo</div>`
};
export { fooComponent };

138
one-ui/test_x_old/vuex/lama/fajri-ui/components/listPatientTypeComponent.js Normal file
View File

@@ -0,0 +1,138 @@
var listPatientTypeComponent = {
template: `
<v-card class="xs12 md12" >
<v-card-title>
<v-layout>
<v-flex xs12 sm8>
<v-toolbar-title>Patient Type Listing</v-toolbar-title>
</v-flex>
<v-flex xs12 sm4>
<v-spacer></v-spacer>
<v-text-field
v-model="query"
append-icon="search"
@click:clear="clearSearch"
@keydown.enter="doSearch"
@click:append="doSearch"
label="Search"
single-line
hide-details
clearable
class="xs12 md3"
></v-text-field>
</v-flex>
</v-layout>
</v-card-title>
<v-data-table :headers="headers" :items="patienttypes"
:loading="isLoading"
hide-actions class="elevation-1">
<template slot="items" slot-scope="props">
<td>{{ props.item.M_PatientTypeName }}</td>
<td>{{ props.item.M_PatientTypeAddress }}</td>
<td>{{ props.item.M_PatientTypeMOUPIC }}</td>
<td>{{ props.item.M_PatientTypePhone }}</td>
<td>{{ props.item.M_PatientTypeEmail }}</td>
</template>
<template slot="no-data">
<v-alert :value="isError" color="error" icon="warning">
{{errorMessage}}
</v-alert>
<v-spacer></v-spacer>
</template>
<template slot="footer">
<td colspan="2" class="text-xs-left">
Total Records : {{totalRecord}}, page {{page}} of {{totalPage}}.
</td>
<td colspan="3" class="text-xs-right">
<v-pagination :length="totalPage" :value="page" :total-visible="10"
@next="nextPage" @prev="prevPage"
@input="gotoPage" >
</v-pagination>
</td>
</template>
</v-data-table>
</v-card>
`,
mounted() {
this.doSearch();
},
data() {
return {
query: "",
headers: [
{
text: "Name",
align: "left",
sortable: false,
value: "M_PatientTypeName"
},
{
text: "Addres",
align: "left",
sortable: false,
value: "M_PatientTypeAddress"
},
{
text: "PIC",
value: "M_PatientTypeMOUPIC",
sortable: false,
align: "left"
},
{
text: "Phone",
value: "M_PatientTypePhone",
sortable: false,
align: "left"
},
{
text: "Email",
value: "M_PatientTypeEmail",
sortable: false,
align: "left"
}
]
};
},
methods: {
clearSearch() {
this.query = "";
this.doSearch();
},
doSearch(page = 1, rowPerPage = 8) {
if (this.query == null) this.query = "";
this.$store.dispatch("searchPatientType", {
query: this.query,
page,
rowPerPage
});
},
prevPage() {
let c_page = this.page - 1;
this.doSearch(c_page);
},
nextPage() {
let c_page = this.page + 1;
this.doSearch(c_page);
},
gotoPage(e) {
let c_page = e;
this.doSearch(c_page);
}
},
computed: {
...Vuex.mapState({
isLoading: state => state.isLoading,
isError: state => state.isError,
errorMessage: state => state.errorMessage,
patienttypes: state => state.rows,
totalRecord: state => state.totalRecord,
page: state => state.page,
totalPage: state => state.totalPage
})
},
updated() {
console.log("Component Updated");
}
};
export { listPatientTypeComponent };

92
one-ui/test_x_old/vuex/lama/fajri-ui/components/smartNavbarComponent.js Normal file
View File

@@ -0,0 +1,92 @@
var smartNavbarComponent = {
template: `
<span>
<v-navigation-drawer
v-model="drawer"
fixed
clipped
class="grey lighten-4"
app
>
<v-list
dense
class="grey lighten-4"
>
<template v-for="(item, i) in items">
<v-layout
v-if="item.heading"
:key="i"
row
align-center
>
<v-flex xs6>
<v-subheader v-if="item.heading">
{{ item.heading }}
</v-subheader>
</v-flex>
<v-flex xs6 class="text-xs-right">
<v-btn small flat>edit</v-btn>
</v-flex>
</v-layout>
<v-divider
v-else-if="item.divider"
:key="i"
dark
class="my-3"
></v-divider>
<v-list-tile
v-else
:key="i"
@click=""
>
<v-list-tile-action>
<v-icon>{{ item.icon }}</v-icon>
</v-list-tile-action>
<v-list-tile-content>
<v-list-tile-title class="grey--text">
{{ item.text }}
</v-list-tile-title>
</v-list-tile-content>
</v-list-tile>
</template>
</v-list>
</v-navigation-drawer>
<v-toolbar color="amber" app absolute clipped-left>
<v-toolbar-side-icon @click.native="drawer = !drawer"></v-toolbar-side-icon>
<span class="title ml-3 mr-5">Google&nbsp;<span class="font-weight-light">Keep</span></span>
<v-text-field
solo-inverted
flat
hide-details
label="Search"
prepend-inner-icon="search"
></v-text-field>
<v-spacer></v-spacer>
</v-toolbar>
</span>
`,
data: function() {
return {
drawer: false,
items: [
{ icon: 'lightbulb_outline', text: 'Notes' },
{ icon: 'touch_app', text: 'Reminders' },
{ divider: true },
{ heading: 'Labels' },
{ icon: 'add', text: 'Create new label' },
{ divider: true },
{ icon: 'archive', text: 'Archive' },
{ icon: 'delete', text: 'Trash' },
{ divider: true },
{ icon: 'settings', text: 'Settings' },
{ icon: 'chat_bubble', text: 'Trash' },
{ icon: 'help', text: 'Help' },
{ icon: 'phonelink', text: 'App downloads' },
{ icon: 'keyboard', text: 'Keyboard shortcuts' }
]
};
},
methods: {}
};
export { smartNavbarComponent };

113
one-ui/test_x_old/vuex/lama/fajri-ui/index.php Normal file
View File

@@ -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>Test 05 Vuex (Fitri)</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">
<div>
<v-toolbar color="indigo accent-1" dark>
<v-btn icon class="hidden-xs-only">
<v-icon large>format_indent_increase</v-icon>
</v-btn>
<v-toolbar-title><div class="flex display-3 font-weight-bold">One</div></v-toolbar-title>
<v-spacer></v-spacer>
<v-toolbar-items class="hidden-sm-and-down">
<v-icon large>notifications_none</v-icon>
</v-toolbar-items>
</v-toolbar>
<v-tabs light
v-model="active"
color="green darken-2"
dark
slider-color="amber lighten-2"
fixed-tabs
>
<v-tab
v-for="item in items"
:key="item.id"
ripple
>
{{item.label}}
</v-tab>
<v-tab-item id="1"
>
<v-card color="blue-grey lighten-5" flat>
<v-card-text><bar></bar></v-card-text>
</v-card>
</v-tab-item>
<v-tab-item id="2"
>
<v-card flat>
<v-card-text><foo></foo></v-card-text>
</v-card>
</v-tab-item>
</v-tabs>
<div class="text-xs-center mt-3">
<v-btn @click="next">next tab</v-btn>
</div>
</div>
</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 ?>';
import { barComponent } from './components/barComponent.js<?php echo $ts ?>';
import { fooComponent } from './components/fooComponent.js<?php echo $ts ?>';
//for testing
// window.store = store;
new Vue({
el: '#app',
components: {
'bar': barComponent,
'foo': fooComponent,
},
data () {
return {
active: null,
items: [
{id:1,'label':'PASIEN','url':'#bar'},
{id:2,'label':'foo','url':'#foo'}
],
}
},
methods: {
next () {
const active = parseInt(this.active)
this.active = (active < 2 ? active + 1 : 0)
}
}
})
</script>
<style>
[v-cloak] {
display: none
}
</style>
</body>
</html>

0
one-ui/test_x_old/vuex/lama/fajri-ui/mutation.js Normal file
View File

71
one-ui/test_x_old/vuex/lama/fajri-ui/store.js Normal file
View File

@@ -0,0 +1,71 @@
// State
// data ...
// Mutations
//
//
// Actions
import * as api from "./api.js";
export const store = new Vuex.Store({
state: {
rows: [],
midPages: [],
isLoading: false,
isError: false,
errorMessage: "",
query: "",
page: 0,
totalPage: 0,
totalRecord: 0
},
mutations: {
updatePatientType(state, data) {
// console.log(data);
if (data.status == "ERR") {
state.isError = true;
if (data.db_error) {
state.errorMessage = data.db_error.message;
} else {
state.errorMessage = data.message;
}
state.query = data.query;
state.page = 0;
state.totalPage = 0;
state.totalRecord = 0;
state.rows = [];
state.midPages = [];
} else {
state.isError = false;
state.errorMessage = "";
state.query = data.query;
state.page = data.page;
state.totalPage = data.totalPage;
state.totalRecord = data.totalRecord;
state.rows = data.rows;
state.midPages = data.midPages;
}
},
updateLoading(state, flag) {
state.isLoading = flag;
},
resetError(state) {
state.isError = false;
state.errorMessage = "";
}
},
actions: {
async searchPatientType(context, data) {
context.commit("updateLoading", true);
let resp = await api.searchPatientType(
data.query,
data.page,
data.rowPerPage
);
context.commit("updateLoading", false);
context.commit("updatePatientType", resp);
setTimeout(function() {
context.commit("resetError");
}, 5000);
}
}
});

0
one-ui/test_x_old/vuex/lama/t01/action.js Normal file
View File

Some files were not shown because too many files have changed in this diff Show More