Flatten nested repos
This commit is contained in:
@@ -0,0 +1,209 @@
|
||||
<template>
|
||||
<v-dialog
|
||||
v-model="dialog"
|
||||
persistent
|
||||
max-width="1000px"
|
||||
min-height="600px"
|
||||
transition="dialog-transition"
|
||||
>
|
||||
|
||||
<v-layout class="fill-height" column>
|
||||
<v-card class="grow" color="blue-grey lighten-2">
|
||||
<v-card-title primary-title class="title white--text pb-2">
|
||||
HISTORI PEMERIKSAAN
|
||||
<v-spacer></v-spacer>
|
||||
<v-btn color="white" flat @click="filter_test()">{{text_filter_test}}</v-btn>
|
||||
<v-btn color="white" flat @click="uncheck_all()">Clear Test</v-btn>
|
||||
<v-btn color="white" flat @click="dialog = false">Tutup</v-btn>
|
||||
</v-card-title>
|
||||
|
||||
<v-card-text class="pt-2 pb-2">
|
||||
|
||||
<v-layout v-if="show_filter_test" xs12 row wrap style="background-color:white;padding-top:10px;border-radius:10px 10px 0px 0px;padding-left:10px;">
|
||||
<v-flex xs3 v-for="(p, i) in pxs" v-bind:key="p.code" class="pr-2 pb-1">
|
||||
<v-layout row>
|
||||
<v-flex class="boxoutline" class="text-left" style="padding-top:10px" pl-2 pr-2 xs2>
|
||||
<v-layout row align-left justify-space-between>
|
||||
<v-icon v-if="! px_selected(p.code)" @click="selectPx(p.code)" style="color:red">clear</v-icon>
|
||||
<v-icon v-if="px_selected(p.code)" @click="unSelectPx(p.code)" style="color:green">check</v-icon>
|
||||
</v-layout>
|
||||
</v-flex>
|
||||
<v-flex class="boxoutline " style="text-overflow:ellipsis;overflow:hidden;padding-top:10px;" xs11>
|
||||
<span >{{p.name}}</span>
|
||||
</v-flex>
|
||||
</v-layout>
|
||||
</v-flex>
|
||||
</v-layout>
|
||||
|
||||
|
||||
<v-layout row wrap>
|
||||
<v-flex xs12 >
|
||||
<v-card>
|
||||
<v-card-text class="pt-1 pb-1 pl-1 pr-1">
|
||||
<v-data-table
|
||||
:headers="new_headers" :items="result"
|
||||
:loading="isLoading"
|
||||
hide-actions class="elevation-1 table-history"
|
||||
>
|
||||
<template slot="items" slot-scope="props">
|
||||
<td class="text-xs-left pl-2 pr-2 pa-1 green--text" >
|
||||
{{ props.item.px_name }}
|
||||
</td>
|
||||
<td class="text-xs-left pl-2 pr-2 pa-1" >
|
||||
{{ props.item.unit}}
|
||||
</td>
|
||||
|
||||
<td class="text-xs-left pl-2 pr-2 pa-1" v-for="xdate in dates" >
|
||||
{{ props.item.result[xdate] }}
|
||||
</td>
|
||||
</template>
|
||||
</v-data-table>
|
||||
</v-card-text>
|
||||
</v-card>
|
||||
</v-flex>
|
||||
</v-layout>
|
||||
|
||||
</v-card-text>
|
||||
<v-card-actions>
|
||||
<v-spacer></v-spacer>
|
||||
<v-btn color="white" flat @click="dialog = false">Tutup</v-btn>
|
||||
</v-card-actions>
|
||||
|
||||
|
||||
</v-card>
|
||||
</v-layout>
|
||||
</v-dialog>
|
||||
</template>
|
||||
|
||||
<style>
|
||||
|
||||
.table-history table td {
|
||||
height: 40px !important
|
||||
}
|
||||
|
||||
.boxoutline {
|
||||
color: #000099;
|
||||
border: 1px solid #e6f7ff;
|
||||
justify-content: center;
|
||||
height: 55px;
|
||||
line-height: 25px;
|
||||
padding-left: 5px;
|
||||
background: #b3e7ff;
|
||||
font-size: 14px;
|
||||
border-radius: 1px;
|
||||
font-weight: 200;
|
||||
}
|
||||
|
||||
.boxoutline:hover {
|
||||
background: #e6f7ff!important;
|
||||
font-size: 14px;
|
||||
font-weight: 300;
|
||||
}
|
||||
|
||||
</style>
|
||||
|
||||
<script>
|
||||
module.exports = {
|
||||
data() {
|
||||
return {
|
||||
query: "",
|
||||
items: [],
|
||||
|
||||
isLoading: false,
|
||||
show_filter_test: false
|
||||
};
|
||||
},
|
||||
|
||||
methods : {
|
||||
filter_test() {
|
||||
this.show_filter_test = !this.show_filter_test
|
||||
},
|
||||
oneMoment : function(d) {
|
||||
return window.oneMoment(d)
|
||||
},
|
||||
uncheck_all() {
|
||||
this.$store.commit('re_history/update_selected_px',[])
|
||||
},
|
||||
selectPx(code) {
|
||||
console.log('Select ' + code )
|
||||
let pxs = this.$store.state.re_history.pxs
|
||||
let obj = _.filter(pxs,function(o){ return o.code == code})
|
||||
let spx = this.$store.state.re_history.selected_px
|
||||
let n_spx = _.concat(spx,obj)
|
||||
this.$store.commit('re_history/update_selected_px',n_spx)
|
||||
},
|
||||
unSelectPx(code) {
|
||||
let spx = this.$store.state.re_history.selected_px
|
||||
let new_spx = _.filter(spx,function(o){ return o.code != code })
|
||||
this.$store.commit('re_history/update_selected_px',new_spx)
|
||||
},
|
||||
px_selected(code) {
|
||||
let spx = this.$store.state.re_history.selected_px
|
||||
let rst = _.findIndex(spx,{'code':code})
|
||||
if (rst == -1 ) return false
|
||||
return true
|
||||
},
|
||||
},
|
||||
|
||||
computed : {
|
||||
dates() {
|
||||
return this.$store.state.re_history.dates
|
||||
},
|
||||
text_filter_test() {
|
||||
if (this.show_filter_test) return "Hide Test"
|
||||
return "Show Test"
|
||||
},
|
||||
new_headers() {
|
||||
let headers = [
|
||||
{
|
||||
text: "PEMERIKSAAN",
|
||||
align: "left",
|
||||
sortable: false,
|
||||
width: "45%",
|
||||
class: "pa-2 blue lighten-3 white--text"
|
||||
},
|
||||
{
|
||||
text: "Unit",
|
||||
align: "left",
|
||||
sortable: false,
|
||||
value: "mr",
|
||||
width: "16%",
|
||||
class: "pa-2 blue lighten-3 white--text"
|
||||
} ]
|
||||
|
||||
for(let i =0; i< this.dates.length ; i++ ) {
|
||||
headers.push({
|
||||
text: this.dates[i],
|
||||
align: "left",
|
||||
sortable: false,
|
||||
value: "mr",
|
||||
width: "15%",
|
||||
class: "pa-2 blue lighten-3 white--text"
|
||||
})
|
||||
}
|
||||
|
||||
return headers
|
||||
},
|
||||
result () {
|
||||
let spx = this.$store.state.re_history.selected_px
|
||||
let rst = this.$store.state.re_history.result
|
||||
let new_rst = _.filter(rst, function(r) {
|
||||
return _.findIndex(spx,{'code':r.code}) > -1
|
||||
})
|
||||
return new_rst
|
||||
},
|
||||
pxs () {
|
||||
return this.$store.state.re_history.pxs
|
||||
},
|
||||
dialog : {
|
||||
get () { return this.$store.state.re_history.dialog_history },
|
||||
set (v) { this.$store.commit('re_history/update_dialog_history', v) }
|
||||
},
|
||||
selected_px: {
|
||||
get () { return this.$store.state.re_history.selected_px }
|
||||
}
|
||||
|
||||
},
|
||||
|
||||
}
|
||||
</script>
|
||||
Reference in New Issue
Block a user