248 lines
8.8 KiB
Vue
248 lines
8.8 KiB
Vue
<template>
|
|
<div>
|
|
|
|
<v-layout column pb-2>
|
|
<v-card class="one-fo-requirement">
|
|
<v-subheader red--text text--lighten-1>
|
|
<v-layout row wrap>
|
|
<v-flex xs3>
|
|
<span>JANJI HASIL :</span>
|
|
</v-flex>
|
|
<v-flex xs3>
|
|
<span v-show="!cito_show && is_cito == 'Y'" class="mr-4 blue--text"><a href="javascript:;" class=" blue--text" @click="cito_show=!cito_show"><v-icon small>priority_high</v-icon> {{ selected_cito ? selected_cito.Nat_CitoName : '' }}</a></span>
|
|
<v-select
|
|
:items="citos"
|
|
item-text="Nat_CitoName"
|
|
item-value="Nat_CitoID"
|
|
return-object
|
|
|
|
hide-details
|
|
dense
|
|
v-model="selected_cito"
|
|
height="30"
|
|
v-show="cito_show && is_cito == 'Y'"
|
|
class="mt-0 pt-0"
|
|
append-icon="clear"
|
|
@click:append="selected_cito = null"
|
|
></v-select>
|
|
</v-flex>
|
|
<v-flex xs6 class="text-xs-right">
|
|
<span class="red--text">Perkiraan Janji Hasil : {{ appx_schedule }}</span>
|
|
</v-flex>
|
|
</v-layout>
|
|
</v-subheader>
|
|
<!-- <v-layout row wrap v-show="cito_show">
|
|
<v-flex xs3>
|
|
|
|
</v-flex>
|
|
<v-flex xs4>
|
|
|
|
</v-flex>
|
|
</v-layout> -->
|
|
<v-divider></v-divider>
|
|
|
|
<v-layout row wrap>
|
|
<v-flex xs12 pt-2>
|
|
<v-card color="blue lighten-3 white--text" outlined flat >
|
|
<v-card-text class="pt-2 pb-2">
|
|
<v-layout row wrap>
|
|
<v-flex xs6>
|
|
<p class="title">Persyaratan terpenuhi ?</p>
|
|
</v-flex>
|
|
<v-flex xs6 class="text-xs-right">
|
|
<v-btn
|
|
:color="req_status == 'N' ? 'red' : 'white'"
|
|
class="one-btn-icon mr-1 ma-0"
|
|
:dark="req_status == 'N'"
|
|
@click="reqMeNot">
|
|
<v-icon>clear</v-icon>
|
|
</v-btn>
|
|
|
|
<v-btn
|
|
:color="req_status == 'Y' ? 'green' : 'white'"
|
|
class="one-btn-icon mr-1 ma-0"
|
|
:dark="req_status == 'Y'"
|
|
|
|
@click="reqMe">
|
|
<v-icon>done</v-icon>
|
|
</v-btn>
|
|
<!-- <v-btn color="red" class="one-btn-icon mr-1 ma-0" @click="sampleReq"
|
|
v-show="req_status == 'X' || req_status == 'N'"
|
|
:disabled="req_status != 'X'"
|
|
:dark="req_status == 'X'">
|
|
<v-icon>clear</v-icon>
|
|
</v-btn>
|
|
|
|
<v-btn color="green" class="one-btn-icon ma-0" @click="sampleReqOK"
|
|
v-show="req_status == 'X' || req_status == 'Y'"
|
|
:disabled="req_status != 'X'"
|
|
:dark="req_status == 'X'">
|
|
<v-icon>done</v-icon>
|
|
</v-btn> -->
|
|
</v-flex>
|
|
</v-layout>
|
|
</v-card-text>
|
|
</v-card>
|
|
</v-flex>
|
|
|
|
|
|
</v-layout>
|
|
|
|
<v-layout row wrap v-if="req_status != 'N'">
|
|
<v-card flat>
|
|
<v-card-text class="pl-3 pr-3 pt-2 pb-2">
|
|
<v-btn color="black" small outline v-for="(req, i) in requirements" v-bind:key="i" class="mt-1 mr-1 ma-0">{{req.label}}</v-btn>
|
|
</v-card-text>
|
|
</v-card>
|
|
</v-layout>
|
|
|
|
<v-container fluid v-if="req_status == 'N'" class="pl-2 pr-2 pt-2 pb-2">
|
|
<v-layout row wrap>
|
|
<!-- <one-field-verification v-for="req in requirements" :key="req.idx"
|
|
@input="update_req"
|
|
:value="req" class="xs12 sm10" >
|
|
</one-field-verification> -->
|
|
<v-flex xs12
|
|
v-for="(req, i) in requirements"
|
|
v-bind:key="i">
|
|
|
|
<v-checkbox
|
|
:value="req.req_id"
|
|
:label="req.label"
|
|
v-model="reqs"
|
|
hide-details
|
|
class="mt-0"
|
|
></v-checkbox>
|
|
</v-flex>
|
|
|
|
</v-layout>
|
|
</v-container>
|
|
<v-divider></v-divider>
|
|
<v-layout>
|
|
<v-flex xs12 pa-2>
|
|
<v-checkbox
|
|
v-model="received_sample"
|
|
value="Y"
|
|
label="Received Sample Only"
|
|
></v-checkbox>
|
|
|
|
</v-flex>
|
|
</v-layout>
|
|
</v-card>
|
|
</v-layout>
|
|
</div>
|
|
</template>
|
|
|
|
<style scoped>
|
|
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 = {
|
|
components: {
|
|
"one-field-verification" : httpVueLoader("./oneFieldVerification.vue")
|
|
},
|
|
|
|
data () {
|
|
return {
|
|
cito_show : true
|
|
}
|
|
},
|
|
|
|
computed: {
|
|
requirements(){
|
|
return this.$store.state.px.requirement
|
|
},
|
|
|
|
received_sample : {
|
|
get () {
|
|
return this.$store.state.order.received_sample
|
|
},
|
|
|
|
set (v) {
|
|
if (v == null)
|
|
v = "N";
|
|
|
|
this.$store.commit("order/update_received_sample", v)
|
|
return
|
|
}
|
|
},
|
|
|
|
appx_schedule() {
|
|
return this.$store.state.px.appx_schedule
|
|
},
|
|
|
|
req_status() {
|
|
return this.$store.state.px.req_status
|
|
},
|
|
|
|
req_text() {
|
|
let x = []
|
|
for (let i in this.requirements)
|
|
x.push(this.requirements[i].label);
|
|
|
|
return x.join(', ')
|
|
},
|
|
|
|
reqs : {
|
|
get () { return this.$store.state.px.reqs },
|
|
set (v) { this.$store.commit('px/update_reqs', v) }
|
|
},
|
|
|
|
citos () {
|
|
return this.$store.state.px.citos
|
|
},
|
|
|
|
selected_cito : {
|
|
get () { return this.$store.state.px.selected_cito },
|
|
set (v) { this.$store.commit('px/update_selected_cito', v) }
|
|
},
|
|
|
|
is_cito () {
|
|
return this.$store.state.px.is_cito
|
|
}
|
|
},
|
|
|
|
methods: {
|
|
update_req(val) {
|
|
|
|
let reqs = this.$store.state.px.requirement
|
|
reqs.forEach(function(r,idx) {
|
|
if ( val.idx = r.idx ) {
|
|
reqs[idx] = val
|
|
}
|
|
})
|
|
this.$store.commit("px/update_requirement", reqs)
|
|
},
|
|
|
|
reqMe() {
|
|
this.$store.commit('px/update_req_status', 'Y')
|
|
},
|
|
|
|
reqMeNot() {
|
|
this.$store.commit('px/update_req_status', 'N')
|
|
}
|
|
},
|
|
|
|
mounted () {
|
|
this.$store.dispatch('px/search_cito')
|
|
},
|
|
|
|
watch : {
|
|
is_cito(val, old) {
|
|
// if (val == "Y" && old == "N")
|
|
// this.cito_show = false
|
|
}
|
|
}
|
|
}
|
|
</script>
|