364 lines
16 KiB
Vue
364 lines
16 KiB
Vue
<template>
|
|
|
|
<v-card flat class="transparent">
|
|
<v-layout row wrap>
|
|
<v-flex xs12>
|
|
<v-layout row wrap>
|
|
|
|
<v-flex
|
|
v-for="(tube, n) in tubes"
|
|
xs4
|
|
:class="['pr-'+ (n % 3 == 2 ? '0' : '2'), 'pt-2']"
|
|
v-bind:key="n">
|
|
<v-card
|
|
elevation-2
|
|
color=""
|
|
class="pa-1">
|
|
|
|
<v-layout>
|
|
<v-flex xs5>
|
|
<v-card class="card-tube pt-1 mr-1 flexcard" height="100%">
|
|
<v-img
|
|
class="white--text ma-3"
|
|
|
|
:src="tube.sample_img"
|
|
>
|
|
</v-img>
|
|
|
|
<v-card-text class="grow"></v-card-text>
|
|
<v-card-actions class="pa-0">
|
|
<v-layout row wrap>
|
|
<v-flex xs12 pl-1 pr-1>
|
|
<v-btn color="green" class="xs12" block depressed @click="barcodeAdd(tube)" :disabled="!btn_sampling_enabled" :dark="btn_sampling_enabled">
|
|
<span class="icon-add"></span>
|
|
</v-btn>
|
|
</v-flex>
|
|
<v-flex xs12 pa-1>
|
|
<v-btn color="orange" class="xs12" block dark outline depressed>{{ tube.status }}</v-btn>
|
|
</v-flex>
|
|
|
|
|
|
</v-layout>
|
|
|
|
</v-card-actions>
|
|
</v-card>
|
|
|
|
</v-flex>
|
|
<v-flex xs7>
|
|
<v-card class="card-tube flexcard transparent" height="100%" flat>
|
|
<v-card-text class="pa-1 grow">
|
|
<v-layout column wrap>
|
|
|
|
<v-flex xs12 mb-2>
|
|
<h6 class="title">{{ tube.sample_name }}</h6>
|
|
<h6 class="body-2 orange--text">{{ tube.barcode_id }}</h6>
|
|
</v-flex>
|
|
|
|
<v-layout row wrap>
|
|
<v-flex xs7 mb-3>
|
|
<!-- <one-date-picker
|
|
label="Sampling Date"
|
|
:date="tube.sampling_date == '0000-00-00' ? null : tube.sampling_date"
|
|
@change="samplingDateChange"
|
|
:data="n"
|
|
:max_date="max_sampling_date"
|
|
></one-date-picker> -->
|
|
<one-date-picker-3
|
|
label="Sampling Date"
|
|
:date="tube.sampling_date == '0000-00-00' ? null : tube.sampling_date"
|
|
@change="samplingDateChange"
|
|
:data="n"
|
|
:max_date="max_sampling_date">
|
|
</one-date-picker-3>
|
|
|
|
</v-flex>
|
|
<v-flex xs5 pl-1 mb-3>
|
|
<v-text-field
|
|
hide-details
|
|
mask="##:##"
|
|
:value="tube.sampling_time == '00:00' ? null : tube.sampling_time"
|
|
@change="samplingTimeChange(n, $event)"
|
|
return-masked-value
|
|
label="Time"
|
|
></v-text-field>
|
|
<!-- <one-time-picker
|
|
label="Time"
|
|
:time="tube.sampling_time == '00:00:00' ? null : tube.sampling_time"
|
|
:data="n"
|
|
@change="samplingTimeChange"
|
|
:max_time="max_sampling_time"
|
|
>
|
|
</one-time-picker> -->
|
|
|
|
</v-flex>
|
|
|
|
<v-flex xs7>
|
|
<v-text-field
|
|
v-model="tube.receive_date"
|
|
label="Receive Date"
|
|
readonly
|
|
browser-autocomplete="off"
|
|
></v-text-field>
|
|
<!-- <one-date-picker
|
|
label="Receive Date"
|
|
:date="tube.receive_date == '0000-00-00' ? null : tube.receive_date"
|
|
@change="receiveDateChange"
|
|
:data="n"
|
|
:disabled="!dateEnabled(tube)"
|
|
></one-date-picker> -->
|
|
</v-flex>
|
|
<v-flex xs5 pl-1>
|
|
<v-text-field
|
|
v-model="tube.receive_time"
|
|
label="Time"
|
|
readonly
|
|
browser-autocomplete="off"
|
|
></v-text-field>
|
|
<!-- <one-time-picker
|
|
label="Time"
|
|
:time="tube.receive_time == '00:00:00' ? null : tube.receive_time"
|
|
:data="n"
|
|
@change="receiveTimeChange"
|
|
:disabled="!dateEnabled(tube)"
|
|
> -->
|
|
<!-- </one-time-picker> -->
|
|
</v-flex>
|
|
</v-layout>
|
|
|
|
</v-layout>
|
|
</v-card-text>
|
|
|
|
<v-card-actions class="pa-0">
|
|
<v-btn
|
|
block
|
|
:dark="tube.status_name != 'SAMPLING.Sampling.Sampled' && btn_sampling_enabled && tube.sampling_date != null && tube.sampling_time != null"
|
|
color="green"
|
|
@click="sampling(tube)"
|
|
:disabled="tube.status_name == 'SAMPLING.Sampling.Sampled' || !btn_sampling_enabled || tube.sampling_date == null || tube.sampling_time == null">
|
|
Simpan
|
|
|
|
|
|
</v-btn>
|
|
</v-card-actions>
|
|
</v-card>
|
|
|
|
</v-flex>
|
|
</v-layout>
|
|
</v-card>
|
|
</v-flex>
|
|
</v-layout>
|
|
</v-flex>
|
|
|
|
</v-layout>
|
|
|
|
<v-snackbar
|
|
v-model="snackbar.status"
|
|
top
|
|
right
|
|
:timeout="snackbar.timeout"
|
|
>
|
|
{{ snackbar.text }}
|
|
<v-btn
|
|
color="pink"
|
|
flat
|
|
@click="snackbar.status = false"
|
|
>
|
|
Close
|
|
</v-btn>
|
|
</v-snackbar>
|
|
<one-dialog-confirm
|
|
:text="'Anda akan menambah jumlah Sampel : ' + selected_sample_name"
|
|
button_confirm="OK"
|
|
@confirm="getMe"
|
|
v-if="dialog_confirm"
|
|
></one-dialog-confirm>
|
|
</v-card>
|
|
|
|
|
|
</template>
|
|
|
|
<style scoped>
|
|
.v-input__slot {
|
|
margin-bottom: 0px !important;
|
|
}
|
|
|
|
.v-messages {
|
|
display: none;
|
|
}
|
|
|
|
.v-text-field--box>.v-input__control>.v-input__slot,.v-text-field--full-width>.v-input__control>.v-input__slot,.v-text-field--outline>.v-input__control>.v-input__slot {
|
|
min-height: 38px;
|
|
}
|
|
|
|
.v-text-field--box.v-text-field--single-line input,.v-text-field--full-width.v-text-field--single-line input,.v-text-field--outline.v-text-field--single-line input {
|
|
margin-top: 0px;
|
|
font-size: .9em;
|
|
}
|
|
|
|
.card-tube {
|
|
min-height: 225px;
|
|
}
|
|
|
|
.v-btn {
|
|
min-width: 0px;
|
|
}
|
|
|
|
.flexcard {
|
|
display: flex;
|
|
flex-direction: column;
|
|
}
|
|
</style>
|
|
|
|
<script>
|
|
module.exports = {
|
|
components : {
|
|
'one-date-picker' : httpVueLoader('./oneDatePicker2.vue'),
|
|
'one-date-picker-3' : httpVueLoader('./oneDatePicker3.vue'),
|
|
'one-time-picker' : httpVueLoader('./oneTimePicker.vue'),
|
|
'one-dialog-confirm': httpVueLoader('../../common/oneDialogConfirm.vue')
|
|
},
|
|
|
|
data () {
|
|
return {
|
|
// tubes : [
|
|
// {"menu_date":false, "status":"REJECTED", "sampling_date":"", "sampling_time":"", "receive_date":"", "receive_time":""},
|
|
// {"menu_date":false, "status":"SAMPLED", "sampling_date":"2019-09-02", "sampling_time":"08:00", "receive_date":"2019-09-02", "receive_time":"09:00"},
|
|
// {"menu_date":false, "status":"SAMPLED", "sampling_date":"2019-09-02", "sampling_time":"08:00", "receive_date":"2019-09-02", "receive_time":"09:00"},
|
|
// {"menu_date":false, "status":"NEW", "sampling_date":"2019-09-02", "sampling_time":"08:00", "receive_date":"2019-09-02", "receive_time":"09:00"},
|
|
// {"menu_date":false, "status":"NEW", "sampling_date":"2019-09-02", "sampling_time":"08:00", "receive_date":"2019-09-02", "receive_time":"09:00"}
|
|
// ],
|
|
menu: false,
|
|
modal: false,
|
|
selected_sample_name: "",
|
|
selected_sample_id: 0,
|
|
selected_order_id: 0
|
|
}
|
|
},
|
|
|
|
computed : {
|
|
sampling_btn_disabled () {
|
|
|
|
return true;
|
|
|
|
},
|
|
tubes : {
|
|
get() {
|
|
return this.$store.state.sampling.samples
|
|
},
|
|
|
|
set(v) {
|
|
this.$store.commit('sampling/update_samples', {records:v})
|
|
return
|
|
}
|
|
},
|
|
|
|
snackbar : {
|
|
get () {
|
|
return this.$store.state.sampling.snackbar
|
|
},
|
|
|
|
set(v) {
|
|
this.$store.commit('sampling/update/snackbar', v)
|
|
return
|
|
}
|
|
},
|
|
|
|
max_sampling_date () {
|
|
let today = new Date();
|
|
let date = today.getFullYear()+'-'+("0" + (today.getMonth()+1)).slice(-2)+'-'+("0" + today.getDate()).slice(-2);
|
|
|
|
return date
|
|
},
|
|
|
|
max_sampling_time () {
|
|
let today = new Date();
|
|
let time = today.getHours() + ":" + today.getMinutes() + ":" + today.getSeconds();
|
|
|
|
return time
|
|
},
|
|
|
|
btn_sampling_enabled () {
|
|
let x = this.$store.state.queue.call_status
|
|
if ((x == "QUE.Sampling.Process" || x == "QUE.Sampling.Partial") &&
|
|
this.$store.state.sampling.ver_photo.error == false)
|
|
return true
|
|
|
|
return false
|
|
},
|
|
|
|
dialog_confirm () {
|
|
return this.$store.state.dialog_confirm
|
|
}
|
|
},
|
|
|
|
methods : {
|
|
samplingDateChange (prm) {
|
|
|
|
let tbs = this.tubes;
|
|
|
|
if (prm.data == "") prm.data = "0"
|
|
tbs[prm.data].sampling_date = prm.new_date;
|
|
|
|
this.tubes = tbs;
|
|
},
|
|
|
|
samplingTimeChange (n, data) {
|
|
let tbs = this.tubes;
|
|
|
|
if (n == "") n = "0"
|
|
tbs[n].sampling_time = data;
|
|
|
|
this.tubes = tbs;
|
|
},
|
|
|
|
receiveDateChange (prm) {
|
|
|
|
let tbs = this.tubes;
|
|
|
|
if (prm.data == "") prm.data = "0"
|
|
tbs[prm.data].receive_date = prm.new_date;
|
|
|
|
this.tubes = tbs;
|
|
},
|
|
|
|
receiveTimeChange (prm) {
|
|
|
|
let tbs = this.tubes;
|
|
|
|
if (prm.data == "") prm.data = "0"
|
|
tbs[prm.data].receive_time = prm.new_time;
|
|
|
|
this.tubes = tbs;
|
|
},
|
|
|
|
sampling (tube) {
|
|
this.$store.commit('sampling/update_selected_sample', tube)
|
|
this.$store.dispatch('sampling/save')
|
|
},
|
|
|
|
dateEnabled (tube) {
|
|
if (tube.status_name == 'SAMPLING.Sampling.Sampled')
|
|
return false
|
|
|
|
return true
|
|
},
|
|
|
|
barcodeAdd(t) {
|
|
|
|
|
|
|
|
this.selected_sample_name = t.sample_name
|
|
this.selected_sample_id = t.sample_id
|
|
this.selected_order_id = t.order_id
|
|
|
|
this.$store.commit('update_dialog_confirm', true)
|
|
|
|
},
|
|
|
|
getMe() {
|
|
this.$store.dispatch('sampling/barcode_add', {order_id:this.selected_order_id, sample_id:this.selected_sample_id})
|
|
}
|
|
}
|
|
}
|
|
</script>
|