Files
FE_CPONE/test/vuex/one-admin-mcu/components/oneAdminMcuRight.vue
2026-04-27 10:13:31 +07:00

509 lines
18 KiB
Vue

<template>
<v-layout class="fill-height" column>
<v-dialog v-model="dialog_data_empty" width="500">
<v-card>
<v-card-title class="headline grey lighten-2 pt-2 pb-2" primary-title>
Perhatian
</v-card-title>
<v-card-text class="pt-2 pb-2">
<h6 class="display-1 text-center"><span class="blue--text">{{ text_data_empty }}</span></h6>
</v-card-text>
<v-divider></v-divider>
<v-card-actions>
<v-spacer></v-spacer>
<v-btn color="primary" flat @click="dialog_data_empty = false">
Tutup
</v-btn>
</v-card-actions>
</v-card>
</v-dialog>
<!-- ERROR DIALOG -->
<v-dialog v-model="dialog_error" max-width="500px">
<v-card>
<v-card-title>
<span>ERROR !</span>
<v-spacer></v-spacer>
</v-card-title>
<v-divider></v-divider>
<div class="ma-3 red--text">{{ msgError }}</div>
<v-divider></v-divider>
<v-card-actions>
<v-spacer></v-spacer>
<v-btn color="primary" flat @click="dialog_error = false">Close</v-btn>
</v-card-actions>
</v-card>
</v-dialog>
<!-- END ERROR DIALOG -->
<!-- Snackbar -->
<v-snackbar v-show="this.total_order === 0 ? false : true" v-model="snackbar" :timeout="5000"
:multi-line="false" :vertical="false" :top="true" :color="clr" :value="snackbar">
{{ msgsnackbar }}
<v-btn flat @click="snackbar = false"> Tutup </v-btn>
</v-snackbar>
<!-- End Snackbar -->
<!-- Alert dialog -->
<v-dialog v-model="dialogalert" 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>
{{ msgalert }}
</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="dialogalert = false">
Tutup
</v-btn>
<v-btn color="primary" flat @click="saveGenerate()">
Yakin lah
</v-btn>
</v-card-actions>
</v-card>
</v-dialog>
<!-- End alert dialog -->
<!-- Alert dialog -->
<v-dialog v-model="dialogalertconfirm" max-width="30%">
<v-card>
<v-card-title class="headline green lighten-2 pt-2 pb-2" primary-title>
Konfirmasi
</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>
{{ msgalertconfirm }}
</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="dialogalertconfirm = false">
Tutup
</v-btn>
<v-btn color="primary" flat @click="saveConfirm()">
Yakin lah
</v-btn>
</v-card-actions>
</v-card>
</v-dialog>
<!-- End alert dialog -->
<v-card class="mb-2 pa-2 ">
<v-layout align-center row>
<v-flex xs4>
<v-text-field style="font-size:14px" label="No Lab / Nama" class="mr-1" v-model="xsearch"
hide-details></v-text-field>
</v-flex>
<v-flex v-show="Object.keys(this.$store.state.admin.selected_mcu).length != 0 ? true : false"
text-md-right>
<v-btn @click="doPrintPersentase()" color="primary" dark>Persentase <v-icon right
dark>print</v-icon></v-btn>
</v-flex>
<v-flex v-show="Object.keys(this.$store.state.admin.selected_mcu).length != 0 ? true : false"
text-md-right>
<v-btn @click="doPrintExecutive()" color="orange" dark>Executive <v-icon right
dark>print</v-icon></v-btn>
</v-flex>
<v-flex
v-show="Object.keys(this.$store.state.admin.selected_mcu).length != 0 && this.$store.state.order.mcuorder.length === 0 ? true : false"
text-md-right>
<v-btn class="ma-2" color="secondary" @click="openOrder()">
Generate Order
</v-btn>
</v-flex>
<v-flex
v-show="this.$store.state.order.readyconfirm == 'Y' ? true : false"
text-md-right>
<v-btn class="ma-2" color="success" @click="confirmOrder()">
Konfirmasi
</v-btn>
</v-flex>
</v-layout>
</v-card>
<v-card class="mb-2" color="white">
<v-layout align-center row>
<v-flex xs12 pl-2 pr-2 pt-2 pb-2>
<v-data-table :headers="headers" :items="vmcuorder" :loading="isLoading" hide-actions
class="elevation-1">
<template slot="items" slot-scope="props">
<td class="text-xs-left pa-2" @click="selectMe(props.item)"
v-html="props.item.T_OrderHeaderLabNumber">
</td>
<td class="text-xs-left pa-2" @click="selectMe(props.item)"
v-html="props.item.M_PatientName">
</td>
<td class="text-xs-center pa-2" @click="selectMe(props.item)">
<v-chip v-if="props.item.Mcu_OrderStatus === 'N'" color="blue" text-color="white" small
dark>NEW
</v-chip>
<v-chip v-if="props.item.Mcu_OrderStatus === 'S'" color="green" text-color="white" small
dark>SENT
</v-chip>
<v-chip v-if="props.item.Mcu_OrderStatus === 'C'" color="orange" text-color="white"
small dark>CONFIRM
</v-chip>
<v-chip v-if="props.item.Mcu_OrderStatus === 'P'" color="teal" text-color="white" small
dark>PROCESSING
</v-chip>
<v-chip v-if="props.item.Mcu_OrderStatus === 'D'" color="secondary" text-color="white"
small dark>PROCESSING LAB DONE
</v-chip>
<v-chip v-if="props.item.Mcu_OrderStatus === 'E'" color="red" text-color="white" small
dark>ERROR
</v-chip>
<v-chip v-if="props.item.Mcu_OrderStatus === 'R'" color="primary" text-color="white"
small dark>RE-SEND
</v-chip>
<v-chip v-if="props.item.Mcu_OrderStatus === 'F'" color="secondary" text-color="white"
small dark>DONE NONLAB
</v-chip>
</td>
</template>
</v-data-table>
<v-divider></v-divider>
<v-layout>
<v-flex>
<v-pagination style="margin-top:10px;margin-bottom:10px" v-model="curr_page"
:length="xtotal_page">
</v-pagination>
</v-flex>
</v-layout>
</v-flex>
</v-layout>
</v-card>
<one-dialog-print :title="printtitle" :width="printwidth" :height="550" :status="openprintpersentase"
:urlprint="urlprintpersentase" @close-dialog-print="openprintpersentase = false"></one-dialog-print>
<one-dialog-print :title="printtitle" :width="printwidth" :height="550" :status="openprintexecutive"
:urlprint="urlprintexecutive" @close-dialog-print="openprintexecutive = false"></one-dialog-print>
</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;
}
.textinput {
-webkit-transition: width 0.4s ease-in-out;
transition: width 0.4s ease-in-out;
background-color: white;
background-position: 10px 10px;
background-repeat: no-repeat;
padding-left: 40px;
width: 100%;
padding: 8px 10px;
margin-bottom: 5px;
box-sizing: border-box;
border: 1px solid #607d8b;
}
.textinput:focus {
width: 100%;
}
.textinput:focus::-webkit-input-placeholder {
color: transparent;
}
.textinput:focus::-moz-placeholder {
color: transparent;
}
.textinput:-moz-placeholder {
color: transparent;
}
.scroll-container {
scroll-padding: 50px 0 0 50px;
}
::-webkit-scrollbar {
width: 7px;
}
/* this targets the default scrollbar (compulsory) */
::-webkit-scrollbar-track {
background-color: #73baf3;
}
/* the new scrollbar will have a flat appearance with the set background color */
::-webkit-scrollbar-thumb {
background-color: #2196f3;
}
/* this will style the thumb, ignoring the track */
::-webkit-scrollbar-button {
background-color: #0079da;
}
/* optionally, you can style the top and the bottom buttons (left and right for horizontal bars) */
::-webkit-scrollbar-corner {
background-color: black;
}
</style>
<script>
module.exports = {
components: {
'one-dialog-print': httpVueLoader('../../common/oneDialogPrintX.vue')
},
data() {
return {
msgalert: "",
msgalertconfirm: "",
clr: "success",
urlprintpersentase: "",
printtitle: '',
printwidth: '80%',
urlprintexecutive: "",
headers: [{
text: "NOMOR LAB",
align: "left",
sortable: false,
value: "mr",
width: "20%",
class: "pa-2 blue lighten-3 white--text"
},
{
text: "PASIEN",
align: "left",
sortable: false,
value: "mr",
width: "15%",
class: "pa-2 blue lighten-3 white--text"
},
{
text: "STATUS",
align: "Center",
sortable: false,
value: "mr",
width: "20%",
class: "pa-2 blue lighten-3 white--text"
}]
};
},
mounted() {
},
computed: {
vmcuorder() {
return this.$store.state.order.mcuorder
},
isLoading() {
return this.$store.state.order.search_status == 1
},
curr_page: {
get() {
return this.$store.state.order.current_page
},
set(val) {
this.$store.commit("order/update_current_page", val)
this.$store.commit("order/update_last_id", -1)
this.$store.dispatch("order/list_mcu_order")
}
},
xtotal_page: {
get() {
return this.$store.state.order.total_mcuorder_page
},
set(val) {
this.$store.commit("order/update_total_mcuorder_page", val)
}
},
xsearch: {
get() {
return this.$store.state.order.x_search
},
set(val) {
this.$store.commit("order/update_x_search", val)
}
},
selected_mcu_id() {
return this.$store.state.order.selected_mcu_id
},
dialogalert: {
get() {
return this.$store.state.order.dialogalert
},
set(val) {
this.$store.commit("order/update_dialogalert", val)
},
},
dialogalertconfirm: {
get() {
return this.$store.state.order.dialogalertconfirm
},
set(val) {
this.$store.commit("order/update_dialogalertconfirm", val)
},
},
snackbar: {
get() {
return this.$store.state.order.alert_success
},
set(val) {
this.$store.commit("order/update_alert_success", val)
}
},
msgsnackbar() {
return this.$store.state.order.msg_success
},
dialog_error: {
get() {
return this.$store.state.order.alert_error
},
set(val) {
this.$store.commit("order/update_alert_error", val)
},
},
msgError() {
return this.$store.state.order.error_message
},
text_data_empty() {
return this.$store.state.order.text_empty
},
dialog_data_empty: {
get() {
return this.$store.state.order.dialog_is_active
},
set(val) {
this.$store.commit("order/update_dialog_is_active", val)
}
},
total_order: {
get() {
return this.$store.state.order.total_order
},
set(val) {
this.$store.commit("order/update_total_order", val)
}
},
openprintpersentase: {
get() {
return this.$store.state.order.open_print_persentase
},
set(val) {
this.$store.commit("order/update_open_print_persentase", false)
}
},
openprintexecutive: {
get() {
return this.$store.state.order.open_print_executive
},
set(val) {
this.$store.commit("order/update_open_print_executive", false)
}
}
},
methods: {
selectMe(selected) {
this.$store.commit("order/update_selected_mcuorder", selected)
this.$store.commit("order/update_last_id", selected.Mcu_OrderID)
},
thr_search: _.debounce(function () {
this.$store.dispatch("order/list_mcu_order")
}, 1000),
thr_search_mcu_order: _.debounce(function () {
this.$store.dispatch("order/list_mcu_order")
}, 1000),
openOrder() {
this.msgalert = "Yakin, Mau Generate Order ?"
this.dialogalert = true
},
saveGenerate() {
let prm = {
mgmmcuid: this.$store.state.admin.selected_mcu.Mgm_McuID
}
// console.log(mgmmcuid)
this.$store.dispatch('order/insert_mcu_order', prm)
},
confirmOrder() {
this.msgalertconfirm = "Yakin, Mau Dikonfirmasi ? Pastikan semua hasil resume individu sudah divalidasi."
this.dialogalertconfirm = true
},
saveConfirm() {
let prm = {
mgmmcuid: this.$store.state.admin.selected_mcu.Mgm_McuID
}
// console.log(mgmmcuid)
this.$store.dispatch('order/confirm_mcu_order', prm)
},
doPrintPersentase() {
id = this.$store.state.admin.selected_mcu.Mgm_McuID
let user = one_user()
this.printwidth = 1200
this.printtitle = ""
let rpt = 'pola_kelainan_mcu_001'
this.urlprintpersentase = "/birt/run?__report=report/one/rekap/" + rpt + ".rptdesign&__format=pdf&PID=" + id + "&username=" + user.M_StaffName
this.$store.commit("order/update_open_print_persentase", true)
},
doPrintExecutive() {
id = this.$store.state.admin.selected_mcu.Mgm_McuID
let user = one_user()
this.printwidth = 1200
this.printtitle = ""
let rpt = 'executive_summary_mcu_001'
this.urlprintexecutive = "/birt/run?__report=report/one/rekap/" + rpt + ".rptdesign&__format=pdf&PID=" + id + "&username=" + user.M_StaffName
this.$store.commit("order/update_open_print_executive", true)
}
},
watch: {
xsearch(val, old) {
this.xsearch = val
this.thr_search()
},
selected_mcu_id(val, old) {
this.thr_search_mcu_order()
}
}
}
</script>