Files
FE_CPONE/test/vuex/one-process-ref-internal/components/oneProcessRefInternalNewDialog.vue
2026-04-27 10:13:31 +07:00

307 lines
10 KiB
Vue

<template>
<v-dialog
v-model="dialog"
width="1000"
>
<v-btn
slot="activator"
color="primary"
class="ma-1 one-btn-icon"
>
<span class="icon-add"></span>
</v-btn>
<v-card>
<v-card-title
class="headline grey lighten-2 pt-2 pb-2"
primary-title
>
Rujukan Baru
</v-card-title>
<v-card-text class="pt-2 pb-2">
<v-layout row style="height: 60vh">
<v-flex xs4>
<v-layout row wrap>
<v-flex xs12>
<v-text-field
label="Cabang Asal"
:value="default_branch.M_BranchName"
readonly
></v-text-field>
</v-flex>
<v-flex xs12>
<v-select
:items="branches"
item-value="M_BranchID"
item-text="M_BranchName"
return-object
v-model="selected_branch"
label="Cabang Tujuan Rujukan"
></v-select>
</v-flex>
<v-flex xs12>
<v-select
:items="worklists"
item-value="T_WorklistID"
item-text="T_WorklistName"
return-object
v-model="selected_worklist"
label="Worklist"
></v-select>
</v-flex>
<v-flex xs12 class="container_pxs">
<v-layout row wrap v-if="selected_worklist">
<v-flex xs12 v-for="(px, n) in selected_worklist.tests" v-bind:key="px.test_id" pt-1 pr-1>
<v-btn :color="is_selected_px(px) ? 'success':'red'" dark class="ma-0"
small block
@click="select_px(px)">{{px.test_name}}</v-btn>
</v-flex>
</v-layout>
</v-flex>
</v-layout>
</v-flex>
<v-flex xs8 pl-4 style="overflow: auto">
<v-data-table
:headers="headers" :items="patients"
:loading="isLoading"
hide-actions class="xelevation-1"
fixed-header>
<template slot="items" slot-scope="props">
<td class="text-xs-center pa-2 green--text" v-bind:class="is_selected(props.item)"
@click="select(props.item)">
<v-checkbox v-model="selected_patients" :value="props.item.T_OrderDetailID" hide-details :label="props.item.T_OrderDetailID"></v-checkbox>
</td>
<td class="text-xs-center pa-2 green--text" v-bind:class="is_selected(props.item)"
@click="select(props.item)">
{{props.item.T_OrderHeaderDate.substr(0,10)}}
</td>
<td class="text-xs-left pa-2 green--text" v-bind:class="is_selected(props.item)"
@click="select(props.item)">
{{props.item.T_OrderHeaderLabNumber}}
</td>
<td class="text-xs-left pa-2 green--text" v-bind:class="is_selected(props.item)"
@click="select(props.item)">
{{props.item.patient_name}}
</td>
<td class="text-xs-left pa-2" v-bind:class="is_selected(props.item)"
@click="select(props.item)">
{{props.item.T_OrderDetailT_TestName}}
</td>
</template>
</v-data-table>
</v-flex>
</v-layout>
</v-card-text>
<v-card-actions>
<v-spacer></v-spacer>
<v-btn
color="primary"
flat
@click="dialog = false"
>
Tutup
</v-btn>
<v-btn
color="primary"
@click="save"
:disabled="!btn_save_enabled"
>
Simpan
</v-btn>
</v-card-actions>
</v-card>
</v-dialog>
</template>
<style>
.container_pxs {
height: 300px;
overflow-y: scroll;
}
</style>
<script>
module.exports = {
data () {
return {
headers: [
{
text: "",
align: "left",
sortable: false,
value: "mr",
width: "5%",
class: "pa-2 blue lighten-3 white--text"
},
{
text: "TANGGAL",
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: "NAMA PASIEN",
align: "left",
sortable: false,
value: "mr",
width: "35%",
class: "pa-2 blue lighten-3 white--text"
},
{
text: "PEMERIKSAAN",
align: "left",
sortable: false,
value: "mr",
width: "30%",
class: "pa-2 blue lighten-3 white--text"
}
],
sx : []
}
},
computed : {
btn_save_enabled () {
if (!this.selected_branch) return false
if (!this.selected_worklist) return false
if (this.selected_px.length < 1)
return false
if (this.selected_patients.length < 1)
return false
return true
},
dialog : {
get () { return this.$store.state.dialog_new },
set (v) {
this.$store.commit('update_dialog_new', v)
if (v) {
this.selected_patients = []
this.selected_px = []
this.selected_branch = null
this.selected_worklist = null
this.$store.dispatch('newx/search_patient')
}
}
},
branches () {
return this.$store.state.newx.branches
},
selected_branch : {
get () { return this.$store.state.newx.selected_branch },
set (v) { this.$store.commit('newx/update_selected_branch', v) }
},
default_branch () {
return this.$store.state.newx.default_branch
},
worklists () {
return this.$store.state.newx.worklists
},
selected_worklist : {
get () { return this.$store.state.newx.selected_worklist },
set (v) {
this.$store.commit('newx/update_selected_worklist', v)
this.selected_patients = []
this.selected_px = []
}
},
patients () {
return this.$store.state.newx.patients
},
total_patient () {
return this.patients.length
},
selected_patients : {
get () { return this.$store.state.newx.selected_patients },
set (v) { this.$store.commit('newx/update_selected_patients', v) }
},
selected_px : {
get () { return this.$store.state.newx.selected_px },
set (v) { this.$store.commit('newx/update_selected_px', v) }
},
isLoading () {
return false
}
},
methods : {
add_new() {
return
},
new_order() {
this.$store.commit('update_dialog_new', true)
},
select_px(x) {
let y = this.selected_px
let z = y.indexOf(x.test_id)
if (z < 0)
y.push(x.test_id)
else
y.splice(z, 1)
this.selected_px = y
this.$store.dispatch('newx/search_patient')
},
is_selected_px(x) {
let y = this.selected_px
if (y.indexOf(x.test_id) < 0)
return false
return true
},
select(x) {
return
},
is_selected(x) {
return
},
save() {
this.$store.dispatch('newx/save')
}
},
mounted () {
this.$store.dispatch('newx/search_branch')
this.$store.dispatch('newx/search_worklist')
}
}
</script>