Flatten nested repos
This commit is contained in:
sas.fajri
77
test/vuex/one-process-worklist/components/oneDatePicker2.vue
Normal file
77
test/vuex/one-process-worklist/components/oneDatePicker2.vue
Normal file
@@ -0,0 +1,77 @@
|
||||
<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="MM/DD/YYYY format"
|
||||
persistent-hint
|
||||
readonly
|
||||
browser-autocomplete="off"
|
||||
></v-text-field>
|
||||
<v-date-picker v-model="init_date" no-title @input="menu2 = false" :max="init_max_date"></v-date-picker>
|
||||
</v-menu>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
module.exports = {
|
||||
props : ['label', 'date', 'data', 'max_date'],
|
||||
|
||||
data () {
|
||||
return {
|
||||
init_date: this.date && this.date != "0000-00-00" ? this.date : null, //new Date().toISOString().substr(0, 10),
|
||||
init_max_date: this.max_date ? this.max_date : '2999-09-09',
|
||||
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>
|
||||
@@ -0,0 +1,373 @@
|
||||
<template>
|
||||
<v-layout row justify-center>
|
||||
<v-dialog v-model="dialog" persistent max-width="1000px" fullscreen content-class="pt-2 pb-2 pl-4 pr-4">
|
||||
<!-- <template v-slot:activator="{ on }">
|
||||
<v-btn color="primary" dark v-on="on">Open Dialog</v-btn>
|
||||
</template> -->
|
||||
<v-card class="flexcard">
|
||||
<!-- <v-card-title>
|
||||
<span class="headline">Tambah Worklist</span>
|
||||
</v-card-title> -->
|
||||
<v-card-text class="pt-0 grow">
|
||||
<v-layout row wrap>
|
||||
<v-flex xs12>
|
||||
<v-container grid-list-md class="pt-3 pa-0 ml-0 mr-0">
|
||||
<v-layout wrap>
|
||||
<v-flex xs6 sm6 md6 pr-2>
|
||||
<v-text-field label="Nama Worklist" required v-model="name"></v-text-field>
|
||||
</v-flex>
|
||||
|
||||
<v-flex xs6 sm6 md6 class="text-xs-right">
|
||||
|
||||
<span class="headline d-block mt-3" v-if="!state_edit">Worklist Baru</span>
|
||||
<span class="headline d-block mt-3" v-if="state_edit">Ubah Data Worklist</span>
|
||||
</v-flex>
|
||||
</v-layout>
|
||||
</v-container>
|
||||
</v-flex>
|
||||
|
||||
<v-flex xs3 pt-4>
|
||||
Menampilkan {{ total_px }} hasil dari {{ total_display_px }} total item
|
||||
</v-flex>
|
||||
|
||||
<v-flex xs3 pr-2 pb-2>
|
||||
<v-text-field
|
||||
hide-details
|
||||
solo
|
||||
label="Pencarian"
|
||||
append-icon="search"
|
||||
v-model="query_left"
|
||||
v-on:keyup.enter="search_left"
|
||||
>
|
||||
<v-text-field>
|
||||
|
||||
</v-flex>
|
||||
|
||||
<v-flex xs3 pl-2 pt-4>
|
||||
Menampilkan {{ chosen_total_display_px }} hasil dari {{ chosen_total_px }} total item
|
||||
</v-flex>
|
||||
|
||||
<v-flex xs3>
|
||||
<v-text-field
|
||||
hide-details
|
||||
solo
|
||||
label="Pencarian"
|
||||
append-icon="search"
|
||||
v-model="query_right"
|
||||
v-on:keyup.enter="search_right"
|
||||
:disabled="!state_edit"
|
||||
>
|
||||
<v-text-field>
|
||||
</v-flex>
|
||||
|
||||
<v-flex xs6 pr-2>
|
||||
<v-card class="xs12 md12" >
|
||||
<v-data-table
|
||||
:headers="pxs_headers" :items="pxs"
|
||||
:loading="isLoading"
|
||||
hide-actions class="xelevation-1">
|
||||
<template slot="items" slot-scope="props">
|
||||
<td class="text-xs-left pa-2" style="height:auto"
|
||||
>
|
||||
{{ props.item.T_TestCode }}
|
||||
</td>
|
||||
<td class="text-xs-left pa-2" style="height:auto"
|
||||
>
|
||||
{{ props.item.T_TestName }}
|
||||
</td>
|
||||
<td class="text-xs-left pl-2 pr-2 pt-1 pb-1" style="height:auto"
|
||||
>
|
||||
<v-btn fab dark small color="blue" class="ma-0 b-30" @click="select(props.item)">
|
||||
<v-icon dark>arrow_forward</v-icon>
|
||||
</v-btn>
|
||||
</td>
|
||||
</template>
|
||||
|
||||
</v-data-table>
|
||||
|
||||
</v-card>
|
||||
|
||||
|
||||
</v-flex>
|
||||
|
||||
<v-flex xs6 pl-2>
|
||||
<v-card class="xs12 md12" >
|
||||
<v-data-table
|
||||
:headers="chosen_pxs_headers" :items="chosen_pxs"
|
||||
:loading="isLoading"
|
||||
hide-actions class="xelevation-1">
|
||||
<template slot="items" slot-scope="props">
|
||||
<td class="text-xs-left pl-2 pr-2 pt-1 pb-1" style="height:auto"
|
||||
>
|
||||
<v-btn fab dark small color="red" class="ma-0 b-30" @click="unSelect(props.item)">
|
||||
<v-icon dark>arrow_back</v-icon>
|
||||
</v-btn>
|
||||
</td>
|
||||
<td class="text-xs-left pa-2" style="height:auto"
|
||||
>
|
||||
{{ props.item.T_TestCode }}
|
||||
</td>
|
||||
<td class="text-xs-left pa-2" style="height:auto"
|
||||
>
|
||||
{{ props.item.T_TestName }}
|
||||
</td>
|
||||
|
||||
</template>
|
||||
|
||||
</v-data-table>
|
||||
|
||||
</v-card>
|
||||
|
||||
</v-flex>
|
||||
|
||||
</v-layout>
|
||||
|
||||
<!-- <small>*indicates required field</small> -->
|
||||
</v-card-text>
|
||||
<v-card-actions>
|
||||
<v-btn color="red darken-1" dark @click="del" v-show="state_edit">Hapus Worklist</v-btn>
|
||||
<v-spacer></v-spacer>
|
||||
<v-btn color="blue darken-1" flat @click="dialog = false">Tutup</v-btn>
|
||||
<v-btn color="blue darken-1" :dark="btn_save_enabled" @click="save" :disabled="!btn_save_enabled">Simpan</v-btn>
|
||||
</v-card-actions>
|
||||
</v-card>
|
||||
</v-dialog>
|
||||
</v-layout>
|
||||
</template>
|
||||
|
||||
<style>
|
||||
.flexcard {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.b-30 {
|
||||
height: 30px !important;
|
||||
width: 30px !important;
|
||||
}
|
||||
</style>
|
||||
|
||||
<style scoped>
|
||||
.v-btn--floating.v-btn--small {
|
||||
height: 30px !important;
|
||||
width: 30px !important;
|
||||
}
|
||||
</style>
|
||||
|
||||
<script>
|
||||
module.exports = {
|
||||
data: () => ({
|
||||
|
||||
pxs_headers: [
|
||||
{
|
||||
text: "KODE PEMERIKSAAN",
|
||||
align: "left",
|
||||
sortable: false,
|
||||
width: "15%",
|
||||
class: "pa-2 blue lighten-3 white--text"
|
||||
},
|
||||
{
|
||||
text: "NAMA PEMERIKSAAN",
|
||||
align: "left",
|
||||
sortable: false,
|
||||
width: "70%",
|
||||
class: "pa-2 blue lighten-3 white--text"
|
||||
},
|
||||
{
|
||||
text: "",
|
||||
align: "left",
|
||||
sortable: false,
|
||||
width: "5%",
|
||||
class: "pa-2 blue lighten-3 white--text"
|
||||
}
|
||||
],
|
||||
|
||||
chosen_pxs_headers: [
|
||||
{
|
||||
text: "",
|
||||
align: "left",
|
||||
sortable: false,
|
||||
width: "5%",
|
||||
class: "pa-2 blue lighten-3 white--text"
|
||||
},
|
||||
{
|
||||
text: "KODE PEMERIKSAAN",
|
||||
align: "left",
|
||||
sortable: false,
|
||||
width: "15%",
|
||||
class: "pa-2 blue lighten-3 white--text"
|
||||
},
|
||||
{
|
||||
text: "NAMA PEMERIKSAAN",
|
||||
align: "left",
|
||||
sortable: false,
|
||||
width: "70%",
|
||||
class: "pa-2 blue lighten-3 white--text"
|
||||
}
|
||||
|
||||
],
|
||||
isLoading: false
|
||||
// chosen_pxs: []
|
||||
// dialog: true
|
||||
}),
|
||||
|
||||
computed : {
|
||||
dialog : {
|
||||
get () {
|
||||
return this.$store.state.worklist_patient.dialog_form_new
|
||||
},
|
||||
set (v) {
|
||||
this.$store.commit('worklist_patient/update_dialog_form_new', v)
|
||||
}
|
||||
},
|
||||
|
||||
pxs : {
|
||||
get () {
|
||||
return this.$store.state.worklist_new.pxs
|
||||
},
|
||||
set (v) {
|
||||
this.$store.commit('worklist_new/update_pxs', v)
|
||||
}
|
||||
},
|
||||
|
||||
total_px () {
|
||||
return this.$store.state.worklist_new.total_px
|
||||
},
|
||||
|
||||
total_display_px () {
|
||||
let x = 0
|
||||
try {
|
||||
x = this.$store.state.worklist_new.pxs.length
|
||||
} catch(e) {
|
||||
x = 0
|
||||
}
|
||||
return x
|
||||
},
|
||||
|
||||
chosen_pxs : {
|
||||
get () {
|
||||
return this.$store.state.worklist_new.chosen_pxs
|
||||
},
|
||||
set (v) {
|
||||
this.$store.commit('worklist_new/update_chosen_pxs', {records:v})
|
||||
}
|
||||
},
|
||||
|
||||
chosen_total_px () {
|
||||
return this.$store.state.worklist_new.chosen_total_px
|
||||
},
|
||||
|
||||
chosen_total_display_px () {
|
||||
let x = 0
|
||||
try {
|
||||
x = this.$store.state.worklist_new.chosen_pxs.length
|
||||
} catch(e) {
|
||||
x = 0
|
||||
}
|
||||
return x
|
||||
},
|
||||
|
||||
name : {
|
||||
get () {
|
||||
// if (this.$store.state.worklist_new.state_edit == true)
|
||||
// return this.$store.state.worklist_patient.selected_worklist.T_WorklistName
|
||||
|
||||
return this.$store.state.worklist_new.name
|
||||
},
|
||||
set (v) {
|
||||
this.$store.commit('worklist_new/update_name', v)
|
||||
}
|
||||
|
||||
},
|
||||
|
||||
state_edit () {
|
||||
return this.$store.state.worklist_new.state_edit
|
||||
},
|
||||
|
||||
btn_save_enabled () {
|
||||
if (this.name == "" || this.chosen_pxs.length < 1)
|
||||
return false
|
||||
|
||||
return true
|
||||
},
|
||||
|
||||
query_left : {
|
||||
get () {
|
||||
return this.$store.state.worklist_new.search_left
|
||||
},
|
||||
set (v) {
|
||||
this.$store.commit('worklist_new/update_search_left', v)
|
||||
}
|
||||
},
|
||||
|
||||
query_right : {
|
||||
get () {
|
||||
return this.$store.state.worklist_new.search_right
|
||||
},
|
||||
set (v) {
|
||||
this.$store.commit('worklist_new/update_search_right', v)
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
watch : {
|
||||
dialog : function(n, o) {
|
||||
|
||||
if (n == true) {
|
||||
this.$store.dispatch('worklist_new/search')
|
||||
} else {
|
||||
this.chosen_pxs = []
|
||||
this.name = ""
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
methods : {
|
||||
select : function(a) {
|
||||
let x = this.chosen_pxs
|
||||
// console.log(x)
|
||||
x.push(a)
|
||||
|
||||
this.chosen_pxs = x
|
||||
this.$store.dispatch('worklist_new/search')
|
||||
},
|
||||
|
||||
unSelect : function(a) {
|
||||
let x = this.chosen_pxs
|
||||
let y = x
|
||||
for (let i in x) {
|
||||
if (x[i]['T_TestID'] == a.T_TestID)
|
||||
y.splice(i, 1)
|
||||
}
|
||||
|
||||
this.chosen_pxs = y
|
||||
this.$store.dispatch('worklist_new/search')
|
||||
},
|
||||
|
||||
save : function() {
|
||||
let x = this.chosen_pxs
|
||||
let y = []
|
||||
for (let i in x)
|
||||
y.push(x[i]['T_TestID'])
|
||||
|
||||
if (this.$store.state.worklist_new.state_edit == true) {
|
||||
this.$store.dispatch('worklist_new/save_edit', {id:this.$store.state.worklist_patient.selected_worklist.T_WorklistID, name:this.name, test:y.join(',')})
|
||||
}
|
||||
else
|
||||
this.$store.dispatch('worklist_new/save', {name:this.name, test:y.join(',')})
|
||||
},
|
||||
|
||||
del : function() {
|
||||
this.$store.dispatch('worklist_new/del')
|
||||
},
|
||||
|
||||
search_left : function() {
|
||||
this.$store.dispatch('worklist_new/search')
|
||||
},
|
||||
|
||||
search_right : function() {
|
||||
this.$store.dispatch('worklist_new/search_chosen')
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,214 @@
|
||||
<template>
|
||||
<v-layout class="fill-height" column>
|
||||
<v-card class="mb-2 pa-2 searchbox">
|
||||
<v-layout row>
|
||||
<v-flex xs12>
|
||||
<v-layout>
|
||||
<v-text-field class="flex xs4 ma-1"
|
||||
placeholder="No Lab"
|
||||
single-line
|
||||
outline
|
||||
hide-details
|
||||
v-model="nolab"
|
||||
></v-text-field>
|
||||
<v-text-field class="flex xs8 ma-1"
|
||||
label=""
|
||||
placeholder="Nama"
|
||||
single-line
|
||||
outline
|
||||
hide-details
|
||||
v-model="search"
|
||||
></v-text-field>
|
||||
|
||||
<v-btn class="mr-1 ml-1 one-btn-icon fz-2" color="success" @click="search_patient" large block fill-height>
|
||||
<span class="icon-search"></span>
|
||||
</v-btn>
|
||||
<v-btn class="mr-1 ml-1 one-btn-icon fz-2" color="info" @click="receive" large block fill-height>
|
||||
<v-icon>send</v-icon>
|
||||
</v-btn>
|
||||
</v-layout>
|
||||
</v-flex>
|
||||
<!-- <v-flex xs4>
|
||||
<v-layout>
|
||||
<v-btn class="flex xs6 ma-1" color="success" @click="search_patient" >
|
||||
Search
|
||||
</v-btn>
|
||||
<v-btn class="flex xs6 ma-1" color="info" @click="receive" >
|
||||
Terima
|
||||
</v-btn>
|
||||
</v-layout>
|
||||
</v-flex> -->
|
||||
</v-layout>
|
||||
</v-card>
|
||||
|
||||
|
||||
<v-card class="grow">
|
||||
<v-subheader>
|
||||
<h3 class="title">SAMPLE DARI HANDLING</h3>
|
||||
</v-subheader>
|
||||
<v-data-table
|
||||
:headers="headers" :items="patients"
|
||||
:loading="isLoading"
|
||||
hide-actions class="xelevation-1">
|
||||
<template slot="items" slot-scope="props">
|
||||
<td class="text-xs-left pa-2"
|
||||
@click="select(props.item)">
|
||||
{{ oneMoment(props.item.date)}}
|
||||
</td>
|
||||
<td class="text-xs-left pa-2"
|
||||
@click="select(props.item)">
|
||||
{{ props.item.lab }}
|
||||
</td>
|
||||
<td class="pa-2"
|
||||
@click="select(props.item)">
|
||||
{{ props.item.sid}}
|
||||
</td>
|
||||
<td class="text-xs-left pa-2"
|
||||
@click="select(props.item)">
|
||||
{{ props.item.name }}
|
||||
</td>
|
||||
<td class="text-xs-left pa-2"
|
||||
@click="select(props.item)">
|
||||
<v-checkbox :value="props.item.id" v-model="ids" hide-details></v-checkbox>
|
||||
</td>
|
||||
</template>
|
||||
|
||||
</v-data-table>
|
||||
|
||||
</v-card>
|
||||
</v-layout>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
.fz-2 {
|
||||
font-size: 1.5em
|
||||
}
|
||||
|
||||
.v-btn--large {
|
||||
height: 52px;
|
||||
}
|
||||
|
||||
table.v-table tbody td,xtable.v-table tbody th {
|
||||
height: 40px;
|
||||
}
|
||||
|
||||
table.v-table thead tr {
|
||||
height: 40px;
|
||||
}
|
||||
|
||||
</style>
|
||||
|
||||
<script>
|
||||
module.exports = {
|
||||
data() {
|
||||
return {
|
||||
query: "",
|
||||
items: [],
|
||||
headers: [
|
||||
{
|
||||
text: "SAMPLING",
|
||||
align: "left",
|
||||
sortable: false,
|
||||
value: "mr",
|
||||
width: "15%",
|
||||
class: "pa-2 blue lighten-3 white--text"
|
||||
},
|
||||
{
|
||||
text: "NO LAB",
|
||||
align: "left",
|
||||
sortable: false,
|
||||
value: "mr",
|
||||
width: "15%",
|
||||
class: "pa-2 blue lighten-3 white--text"
|
||||
},
|
||||
{
|
||||
text: "SAMPLE ID",
|
||||
align: "left",
|
||||
sortable: false,
|
||||
value: "lab",
|
||||
width: "15%",
|
||||
class: "pa-2 blue lighten-3 white--text"
|
||||
},
|
||||
{
|
||||
text: "NAMA",
|
||||
align: "left",
|
||||
sortable: false,
|
||||
value: "name",
|
||||
width: "25%",
|
||||
class: "pa-2 blue lighten-3 white--text"
|
||||
},
|
||||
|
||||
{
|
||||
text: "Pilih",
|
||||
align: "left",
|
||||
sortable: false,
|
||||
value: "status",
|
||||
width: "5%",
|
||||
class: "pa-2 blue lighten-3 white--text"
|
||||
}
|
||||
],
|
||||
isLoading: false,
|
||||
// patients: [
|
||||
// {"status":"","date":"2019-02-21 10:00:00",
|
||||
// "lab":"08000198909", "sid": "08000198909-S",
|
||||
// "name": "Pasien Umum", "selected":false},
|
||||
// {"status":"","date":"2019-02-22 06:30:00",
|
||||
// "lab":"08000198111", "sid": "08000198111-2",
|
||||
// "name": "Heri Suryawan", "selected":false},
|
||||
// {"status":"","date":"2019-02-22 06:45:00",
|
||||
// "lab":"08000198222", "sid": "08000198222-U",
|
||||
// "name": "LUKA MODRIC","selected":true},
|
||||
// ]
|
||||
};
|
||||
},
|
||||
methods : {
|
||||
oneMoment : function(d) {
|
||||
return window.oneMoment(d)
|
||||
},
|
||||
|
||||
search_patient () {
|
||||
this.$store.dispatch('receive_patient/search')
|
||||
},
|
||||
|
||||
receive () {
|
||||
this.$store.dispatch('receive_patient/receive')
|
||||
},
|
||||
|
||||
select(item) {
|
||||
this.$store.commit('receive_patient/update_selected_patient', item)
|
||||
}
|
||||
},
|
||||
computed : {
|
||||
patients () {
|
||||
return this.$store.state.receive_patient.patients
|
||||
},
|
||||
|
||||
nolab : {
|
||||
get () {
|
||||
return this.$store.state.receive_patient.nolab
|
||||
},
|
||||
set (v) {
|
||||
this.$store.commit('receive_patient/update_nolab', v)
|
||||
}
|
||||
},
|
||||
|
||||
search : {
|
||||
get () {
|
||||
return this.$store.state.receive_patient.search
|
||||
},
|
||||
set (v) {
|
||||
this.$store.commit('receive_patient/update_search', v)
|
||||
}
|
||||
},
|
||||
|
||||
ids : {
|
||||
get () {
|
||||
return this.$store.state.receive_patient.ids
|
||||
},
|
||||
set (v) {
|
||||
this.$store.commit('receive_patient/update_ids', v)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,344 @@
|
||||
<template>
|
||||
<v-layout class="fill-height" column>
|
||||
<v-card class="mb-2 pa-2 searchbox">
|
||||
<v-layout row>
|
||||
<v-flex xs12>
|
||||
<v-layout>
|
||||
<!-- <v-flex xs3 pr-2>
|
||||
<one-date-picker
|
||||
label="Start Date"
|
||||
:date="null"
|
||||
@change="startDateChange"
|
||||
:data="null"
|
||||
:max_date="null"
|
||||
></one-date-picker>
|
||||
</v-flex>
|
||||
|
||||
<v-flex xs3 pl-2 pr-2>
|
||||
<one-date-picker
|
||||
label="End Date"
|
||||
:date="null"
|
||||
@change="endDateChange"
|
||||
:data="n"
|
||||
:max_date="null"
|
||||
></one-date-picker>
|
||||
</v-flex> -->
|
||||
|
||||
<!-- <v-flex xs3 pl-2>
|
||||
<v-select
|
||||
|
||||
label="Worklist"
|
||||
:items="worklists"
|
||||
item-value="T_WorklistID"
|
||||
item-text="T_WorklistName"
|
||||
return-object
|
||||
v-model="selected_worklist"
|
||||
|
||||
></v-select>
|
||||
|
||||
</v-flex> -->
|
||||
|
||||
<v-flex xs12>
|
||||
<v-toolbar flat light color="white">
|
||||
<one-date-picker
|
||||
label="Start Date"
|
||||
:date="null"
|
||||
@change="startDateChange"
|
||||
:data="null"
|
||||
:max_date="null"
|
||||
class="mr-4"
|
||||
></one-date-picker>
|
||||
|
||||
|
||||
|
||||
<one-date-picker
|
||||
label="End Date"
|
||||
:date="null"
|
||||
@change="endDateChange"
|
||||
:data="null"
|
||||
:max_date="null"
|
||||
class="mr-4"
|
||||
></one-date-picker>
|
||||
|
||||
<v-select
|
||||
|
||||
label="Worklist"
|
||||
:items="worklists"
|
||||
item-value="T_WorklistID"
|
||||
item-text="T_WorklistName"
|
||||
return-object
|
||||
v-model="selected_worklist"
|
||||
|
||||
></v-select>
|
||||
<v-btn fab @click="edit" :disabled="!btnEditEnabled" class="v-btn--floating--special">
|
||||
<v-icon>edit</v-icon>
|
||||
</v-btn>
|
||||
<!-- <v-btn fab dark small color="blue" class="ma-0 b-30">
|
||||
<v-icon dark>arrow_forward</v-icon>
|
||||
</v-btn> -->
|
||||
<v-btn fab @click="addNew" class="v-btn--floating--special">
|
||||
<v-icon>add_circle_outline</v-icon>
|
||||
</v-btn>
|
||||
|
||||
<v-btn fab class="v-btn--floating--special fz-2" color="success" @click="search_px">
|
||||
<span class="icon-search"></span>
|
||||
</v-btn>
|
||||
|
||||
<!-- <v-btn class="mr-1 ml-1 one-btn-icon fz-2" color="success" @click="search_px" large fill-height>
|
||||
<span class="icon-search"></span>
|
||||
</v-btn> -->
|
||||
|
||||
</v-toolbar>
|
||||
|
||||
</v-flex>
|
||||
</v-layout>
|
||||
</v-flex>
|
||||
<!--<v-flex xs2>
|
||||
<v-layout fill-height class="pb-2">
|
||||
<!--<v-btn class="flex xs12 ma-1 fill-height" color="success" @click="search_px" >
|
||||
Search
|
||||
</v-btn>-->
|
||||
|
||||
<!-- <v-btn class="flex xs6 ma-1" color="info" @click="receive" >
|
||||
Terima
|
||||
</v-btn> -->
|
||||
<!--</v-layout>
|
||||
</v-flex>-->
|
||||
</v-layout>
|
||||
</v-card>
|
||||
|
||||
|
||||
<v-card class="grow">
|
||||
<!-- <v-subheader>
|
||||
<h3 class="title">SAMPLE SIAP HANDLING</h3>
|
||||
</v-subheader> -->
|
||||
<v-data-table
|
||||
:headers="headers" :items="pxs"
|
||||
:loading="isLoading"
|
||||
hide-actions class="xelevation-1">
|
||||
<template slot="items" slot-scope="props">
|
||||
<td class="text-xs-left pa-2"
|
||||
@click="select(props.item)">
|
||||
{{ props.item.T_TestName }} <br>
|
||||
{{ props.item.T_TestCode }}
|
||||
</td>
|
||||
<td class="text-xs-left pl-2 pr-2 pt-1 pb-1"
|
||||
@click="select(props.item)">
|
||||
|
||||
<v-layout row wrap>
|
||||
<v-flex xs2
|
||||
v-for="(p, i) in props.item.patients"
|
||||
v-bind:key="i"
|
||||
pb-1 pr-1>
|
||||
<v-card :color="p.has_result == 'Y' ? 'green' : 'blue-grey darken-2'" class="white--text">
|
||||
<v-card-title primary-title class="pl-3 pr-3 pt-1 pb-0 text-xs-center subheading">
|
||||
|
||||
{{ p.number }}
|
||||
<v-icon light right color="white" v-show="p.has_result == 'Y'">check_circle</v-icon>
|
||||
|
||||
</v-card-title>
|
||||
<v-card-actions class="pl-3 pb-1 pt-0 caption">
|
||||
{{ formatName(p.name) }}
|
||||
</v-card-actions>
|
||||
</v-card>
|
||||
</v-flex>
|
||||
</v-layout>
|
||||
|
||||
|
||||
</td>
|
||||
</template>
|
||||
|
||||
</v-data-table>
|
||||
|
||||
</v-card>
|
||||
|
||||
<one-process-worklist-form-new></one-process-worklist-form-new>
|
||||
</v-layout>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
.v-input__slot {
|
||||
margin-bottom: 0px !important;
|
||||
}
|
||||
|
||||
.v-messages {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.searchbox .v-input.v-text-field .v-input__slot{
|
||||
min-height:40px;
|
||||
}
|
||||
.searchbox .v-btn {
|
||||
min-height:40px;
|
||||
}
|
||||
table.v-table tbody td,xtable.v-table tbody th {
|
||||
height: 40px;
|
||||
}
|
||||
|
||||
table.v-table thead tr {
|
||||
height: 40px;
|
||||
}
|
||||
|
||||
.v-btn--floating--special {
|
||||
border-radius: 0% !important;
|
||||
}
|
||||
|
||||
.v-toolbar__content, .v-toolbar__extension {
|
||||
padding-right: 8px !important;
|
||||
}
|
||||
|
||||
.fz-2 {
|
||||
font-size: 1.5em
|
||||
}
|
||||
|
||||
.v-btn--large {
|
||||
height: 52px;
|
||||
}
|
||||
</style>
|
||||
|
||||
<script>
|
||||
module.exports = {
|
||||
components : {
|
||||
'one-date-picker' : httpVueLoader('./oneDatePicker2.vue'),
|
||||
'one-process-worklist-form-new': httpVueLoader('./oneProcessWorklistFormNew.vue')
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
query: "",
|
||||
items: [],
|
||||
headers: [
|
||||
|
||||
{
|
||||
text: "NAMA PEMERIKSAAN",
|
||||
align: "left",
|
||||
sortable: false,
|
||||
width: "15%",
|
||||
class: "pa-2 blue lighten-3 white--text"
|
||||
},
|
||||
{
|
||||
text: "PASIEN",
|
||||
align: "left",
|
||||
sortable: false,
|
||||
width: "75%",
|
||||
class: "pa-2 blue lighten-3 white--text"
|
||||
}
|
||||
],
|
||||
isLoading: false
|
||||
};
|
||||
},
|
||||
|
||||
methods : {
|
||||
oneMoment : function(d) {
|
||||
return window.oneMoment(d)
|
||||
},
|
||||
search_patient () {
|
||||
this.$store.dispatch('worklist_patient/search')
|
||||
},
|
||||
|
||||
verify () {
|
||||
this.$store.dispatch('worklist_patient/verify')
|
||||
},
|
||||
select(item) {
|
||||
this.$store.commit('worklist_patient/update_selected_patient', item)
|
||||
},
|
||||
search_px () {
|
||||
this.$store.dispatch('worklist_patient/search_px')
|
||||
},
|
||||
startDateChange(prm) {
|
||||
this.$store.commit('worklist_patient/update_sdate', prm.new_date)
|
||||
},
|
||||
endDateChange(prm) {
|
||||
this.$store.commit('worklist_patient/update_edate', prm.new_date)
|
||||
},
|
||||
formatName(x) {
|
||||
var n = x.length
|
||||
if (n > 17)
|
||||
return x.substr(0,15) + ' ..'
|
||||
|
||||
return x
|
||||
},
|
||||
|
||||
addNew() {
|
||||
this.$store.commit('worklist_patient/update_dialog_form_new', true)
|
||||
this.$store.commit('worklist_new/update_state_edit', false)
|
||||
},
|
||||
|
||||
edit() {
|
||||
this.$store.commit('worklist_new/update_id', this.selected_worklist.T_WorklistID)
|
||||
this.$store.commit('worklist_new/update_name', this.selected_worklist.T_WorklistName)
|
||||
this.$store.dispatch('worklist_new/search_chosen')
|
||||
this.$store.commit('worklist_new/update_state_edit', true)
|
||||
this.$store.commit('worklist_patient/update_dialog_form_new', true)
|
||||
}
|
||||
},
|
||||
|
||||
computed : {
|
||||
patients () {
|
||||
return this.$store.state.worklist_patient.patients
|
||||
},
|
||||
|
||||
nolab : {
|
||||
get () {
|
||||
return this.$store.state.worklist_patient.nolab
|
||||
},
|
||||
set (v) {
|
||||
this.$store.commit('worklist_patient/update_nolab', v)
|
||||
}
|
||||
},
|
||||
|
||||
search : {
|
||||
get () {
|
||||
return this.$store.state.worklist_patient.search
|
||||
},
|
||||
set (v) {
|
||||
this.$store.commit('worklist_patient/update_search', v)
|
||||
}
|
||||
},
|
||||
|
||||
id : {
|
||||
get () {
|
||||
return this.$store.state.worklist_patient.id
|
||||
},
|
||||
set (v) {
|
||||
this.$store.commit('worklist_patient/update_id', v)
|
||||
}
|
||||
},
|
||||
|
||||
worklists () {
|
||||
return this.$store.state.worklist_patient.worklists
|
||||
},
|
||||
|
||||
selected_worklist : {
|
||||
get () {
|
||||
return this.$store.state.worklist_patient.selected_worklist
|
||||
},
|
||||
set (v) {
|
||||
this.$store.commit('worklist_patient/update_selected_worklist', v)
|
||||
}
|
||||
},
|
||||
|
||||
pxs () {
|
||||
return this.$store.state.worklist_patient.pxs
|
||||
},
|
||||
|
||||
sdate () {
|
||||
return this.$store.state.worklist_patient.sdate
|
||||
},
|
||||
|
||||
edate () {
|
||||
return this.$store.state.worklist_patient.edate
|
||||
},
|
||||
|
||||
btnEditEnabled () {
|
||||
if (!this.$store.state.worklist_patient.selected_worklist.T_WorklistID)
|
||||
return false
|
||||
|
||||
return true
|
||||
}
|
||||
},
|
||||
|
||||
mounted () {
|
||||
this.$store.dispatch('worklist_patient/search')
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,152 @@
|
||||
<template>
|
||||
<v-layout class="fill-height" column>
|
||||
<v-card class="grow">
|
||||
<v-subheader>
|
||||
<h3 class="title">DAFTAR PENERIMAAN SAMPLE PROCESS</h3>
|
||||
</v-subheader>
|
||||
<hr style="border-top:0px solid #c8c8c8;"></hr>
|
||||
<v-data-table
|
||||
:headers="headers" :items="patients"
|
||||
:loading="isLoading"
|
||||
hide-actions class="xelevation-1">
|
||||
<template slot="items" slot-scope="props">
|
||||
<td class="text-xs-left pa-2"
|
||||
@click="select(props.item)">
|
||||
{{ oneMoment(props.item.date) }}
|
||||
</td>
|
||||
<td class="text-xs-left pa-2"
|
||||
@click="select(props.item)">
|
||||
{{ props.item.lab }}
|
||||
</td>
|
||||
<td class="pa-2"
|
||||
@click="select(props.item)">
|
||||
{{ props.item.sid}}
|
||||
</td>
|
||||
<td class="text-xs-left pa-2"
|
||||
@click="select(props.item)">
|
||||
{{ props.item.name }}
|
||||
</td>
|
||||
<td class="text-xs-left pa-2"
|
||||
@click="select(props.item)">
|
||||
<v-btn v-show="props.item.status == 'PROCESS.Process.From.Handling'" block flat>Diterima</v-btn>
|
||||
</td>
|
||||
<td class="text-xs-left pa-2 text-xs-center">
|
||||
<v-btn flat icon color="red"
|
||||
@click="remove(props.item)"
|
||||
v-show="props.item.status == 'PROCESS.Process.From.Handling'">
|
||||
<v-icon>delete</v-icon>
|
||||
</v-btn>
|
||||
|
||||
</td>
|
||||
</template>
|
||||
|
||||
</v-data-table>
|
||||
|
||||
</v-card>
|
||||
</v-layout>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
.searchbox .v-input.v-text-field .v-input__slot{
|
||||
min-height:60px;
|
||||
}
|
||||
.searchbox .v-btn {
|
||||
min-height:60px;
|
||||
}
|
||||
table.v-table tbody td,table.v-table tbody th {
|
||||
height: 40px;
|
||||
}
|
||||
|
||||
table.v-table thead tr {
|
||||
height: 40px;
|
||||
}
|
||||
|
||||
</style>
|
||||
|
||||
<script>
|
||||
module.exports = {
|
||||
data() {
|
||||
return {
|
||||
query: "",
|
||||
items: [],
|
||||
headers: [
|
||||
{
|
||||
text: "KIRIM",
|
||||
align: "left",
|
||||
sortable: false,
|
||||
value: "mr",
|
||||
width: "20%",
|
||||
class: "pa-2 blue lighten-3 white--text"
|
||||
},
|
||||
{
|
||||
text: "NO LAB",
|
||||
align: "left",
|
||||
sortable: false,
|
||||
value: "mr",
|
||||
width: "15%",
|
||||
class: "pa-2 blue lighten-3 white--text"
|
||||
},
|
||||
{
|
||||
text: "SAMPLE ID",
|
||||
align: "left",
|
||||
sortable: false,
|
||||
value: "lab",
|
||||
width: "15%",
|
||||
class: "pa-2 blue lighten-3 white--text"
|
||||
},
|
||||
{
|
||||
text: "NAMA",
|
||||
align: "left",
|
||||
sortable: false,
|
||||
value: "name",
|
||||
width: "25%",
|
||||
class: "pa-2 blue lighten-3 white--text"
|
||||
},
|
||||
|
||||
{
|
||||
text: "STATUS",
|
||||
align: "center",
|
||||
sortable: false,
|
||||
value: "status",
|
||||
width: "15%",
|
||||
class: "pa-2 blue lighten-3 white--text"
|
||||
},
|
||||
|
||||
{
|
||||
text: "ACTION",
|
||||
align: "center",
|
||||
sortable: false,
|
||||
value: "status",
|
||||
width: "10%",
|
||||
class: "pa-2 blue lighten-3 white--text"
|
||||
}
|
||||
],
|
||||
|
||||
|
||||
isLoading: false
|
||||
|
||||
};
|
||||
},
|
||||
|
||||
methods : {
|
||||
oneMoment : function(d) {
|
||||
return window.oneMoment(d)
|
||||
},
|
||||
|
||||
select (item) {
|
||||
// this.$store.commit('ver_verification/update_selected_sent_sample', item)
|
||||
},
|
||||
|
||||
remove (item) {
|
||||
this.$store.commit('receive_patient/update_selected_sent_sample', item)
|
||||
this.$store.dispatch('receive_patient/remove')
|
||||
}
|
||||
},
|
||||
|
||||
computed : {
|
||||
patients () {
|
||||
return this.$store.state.receive_patient.sent_patients
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,65 @@
|
||||
<template>
|
||||
<v-layout>
|
||||
<v-flex xs12 text-xs-center mb-2>
|
||||
<v-card color="blue lighten-4">
|
||||
<v-card-text class="pb-0 pt-1">
|
||||
<v-btn
|
||||
v-for="tab in tabs"
|
||||
:color="tab.code == active ? 'white' : 'grey lighten-5'"
|
||||
class="white--text ma-0 tab-btn"
|
||||
:class="[tab.code == active ? 'active' : '']"
|
||||
@click="changeTab(tab.code)"
|
||||
flat
|
||||
:key="tab.code"
|
||||
:data="tab"
|
||||
>
|
||||
<v-icon left dark>{{ tab.icon }}</v-icon>
|
||||
<h6 class="title">{{ tab.label }}</h6>
|
||||
</v-btn>
|
||||
</v-card-text>
|
||||
</v-card>
|
||||
|
||||
</v-flex>
|
||||
</v-layout>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
.active {
|
||||
border-bottom: solid 3px #ffeb3b!important;
|
||||
}
|
||||
|
||||
.tab-btn {
|
||||
min-width: 400px;
|
||||
}
|
||||
</style>
|
||||
|
||||
<script>
|
||||
module.exports = {
|
||||
data () {
|
||||
return {
|
||||
}
|
||||
},
|
||||
|
||||
methods : {
|
||||
changeTab (x) {
|
||||
// this.active = x;
|
||||
this.$store.commit('change_tab', x);
|
||||
}
|
||||
},
|
||||
|
||||
computed : {
|
||||
tabs : {
|
||||
get () {
|
||||
return this.$store.state.tabs
|
||||
},
|
||||
set (v) {
|
||||
return
|
||||
}
|
||||
},
|
||||
|
||||
active () {
|
||||
return this.$store.state.tab_active
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
Reference in New Issue
Block a user