add barebone dialog
This commit is contained in:
@@ -6,11 +6,12 @@
|
||||
<h3>{{ $t('message.table.title') }}</h3>
|
||||
</v-col>
|
||||
<v-col cols="1" align="end">
|
||||
<h3>6</h3>
|
||||
<h3>{{ datax.length }}</h3>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</div>
|
||||
<v-data-table
|
||||
:items="datax"
|
||||
:headers="headers"
|
||||
hide-default-footer
|
||||
>
|
||||
@@ -23,14 +24,86 @@
|
||||
</template>
|
||||
</tr>
|
||||
</template>
|
||||
<template v-slot:item="{ item }">
|
||||
<tr>
|
||||
<td align="center" class="pa-2">
|
||||
<p class="font-weight-medium">{{ item.xno }}</p>
|
||||
</td>
|
||||
<td align="center" class="pa-2">
|
||||
<p class="font-weight-medium">{{ item.order_date }}</p>
|
||||
<p class="font-weight-medium rounded-lg bg-grey-lighten-2 px-4" style="display: inline-block;">{{ item.order_promise }}</p>
|
||||
</td>
|
||||
<td align="start" class="pa-2">
|
||||
<v-row>
|
||||
<v-col cols="5" align="start">
|
||||
<p class="font-weight-medium">{{ item.no_reg }}</p>
|
||||
</v-col>
|
||||
<v-col cols="7" align="end">
|
||||
<p class="font-weight-bold text-blue">{{ item.no_reg_ext }}</p>
|
||||
</v-col>
|
||||
</v-row>
|
||||
<p class="font-weight-bold">{{ item.patient_name }}</p>
|
||||
<v-row>
|
||||
<v-col cols="5" align="start">
|
||||
<p class="font-weight-medium">{{ item.company_name }}</p>
|
||||
</v-col>
|
||||
<v-col cols="7" align="end">
|
||||
<p class="font-weight-medium text-grey">{{ item.mou_name }}</p>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</td>
|
||||
<td align="center" class="pa-2">
|
||||
<p
|
||||
:class="['font-weight-medium rounded-lg pointer', item.details_order[0].status === 'Y' ? 'bg-success' : 'bg-grey-lighten-2']"
|
||||
style=" width: 80%; height: 60%; align-content: center;"
|
||||
@click="dialog=true"
|
||||
>{{ item.details_order[0].group_name }}</p>
|
||||
</td>
|
||||
<td align="center" class="pa-2">
|
||||
<p
|
||||
:class="['font-weight-medium rounded-lg pointer', item.details_sampling[0].status === 'Y' ? 'bg-success' : 'bg-grey-lighten-2']"
|
||||
style=" width: 80%; height: 60%; align-content: center;"
|
||||
>{{ item.details_sampling[0].group_name }}</p>
|
||||
</td>
|
||||
<td align="center" class="pa-2">
|
||||
<p
|
||||
:class="['font-weight-medium rounded-lg pointer', item.details_process[0].status === 'Y' ? 'bg-success' : 'bg-grey-lighten-2']"
|
||||
style=" width: 80%; height: 60%; align-content: center;"
|
||||
>{{ item.details_process[0].group_name }}</p>
|
||||
</td>
|
||||
<td align="center" class="pa-2">
|
||||
<p
|
||||
:class="['font-weight-medium rounded-lg pointer', item.details_result_verification[0].status === 'Y' ? 'bg-success' : 'bg-grey-lighten-2']"
|
||||
style=" width: 80%; height: 60%; align-content: center;"
|
||||
>{{ item.details_result_verification[0].group_name }}</p>
|
||||
</td>
|
||||
<td align="center" class="pa-2">
|
||||
<p
|
||||
:class="['font-weight-medium rounded-lg pointer', item.details_result_validation[0].status === 'Y' ? 'bg-success' : 'bg-grey-lighten-2']"
|
||||
style=" width: 80%; height: 60%; align-content: center;"
|
||||
>{{ item.details_result_validation[0].group_name }}</p>
|
||||
</td>
|
||||
<td align="center" class="pa-2">
|
||||
<p
|
||||
:class="['font-weight-medium rounded-lg pointer', item.details_print[0].status === 'Y' ? 'bg-success' : 'bg-grey-lighten-2']"
|
||||
style=" width: 80%; height: 60%; align-content: center;"
|
||||
>{{ item.details_print[0].group_name }}</p>
|
||||
</td>
|
||||
</tr>
|
||||
</template>
|
||||
</v-data-table>
|
||||
<v-pagination :length="total_page"></v-pagination>
|
||||
<sp-dialog></sp-dialog>
|
||||
</v-container>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Sp_dialog from './sp_dialog.vue';
|
||||
export default {
|
||||
name: "contentcomp",
|
||||
components: {},
|
||||
components: {
|
||||
"sp-dialog": Sp_dialog
|
||||
},
|
||||
mounted() {},
|
||||
data() {
|
||||
return {
|
||||
@@ -39,7 +112,7 @@
|
||||
headers : [
|
||||
{
|
||||
title: this.$t('message.table.h_no'),
|
||||
align: "start",
|
||||
align: "center",
|
||||
sortable: false,
|
||||
key: "name",
|
||||
width: "5%",
|
||||
@@ -112,5 +185,31 @@
|
||||
]
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
datax: {
|
||||
get() {
|
||||
return this.$store.state.stored.data;
|
||||
}
|
||||
},
|
||||
total_page: {
|
||||
get() {
|
||||
return this.$store.state.stored.total_page;
|
||||
}
|
||||
},
|
||||
dialog: {
|
||||
get() {
|
||||
return this.$store.state.stored.sp_dialog;
|
||||
},
|
||||
set(bool) {
|
||||
this.$store.commit("setDialog", bool);
|
||||
}
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.pointer {
|
||||
cursor: pointer;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user