ปรับ responsive
This commit is contained in:
parent
650948d68a
commit
542b830a91
8 changed files with 611 additions and 560 deletions
|
|
@ -312,251 +312,260 @@ function requireEdit() {
|
|||
onMounted(async () => {
|
||||
showLoader();
|
||||
await getAll();
|
||||
console.log(store.dataEvaluation.avartar);
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="col-12 row justify-center">
|
||||
<div class="col-xs-12 col-sm-12 col-md-11">
|
||||
<div class="toptitle text-white col-12 row items-center">
|
||||
<q-btn
|
||||
icon="mdi-arrow-left"
|
||||
unelevated
|
||||
round
|
||||
dense
|
||||
flat
|
||||
color="primary"
|
||||
class="q-mr-sm"
|
||||
@click="
|
||||
isReadonly ? router.push(`/KPI-evaluator`) : router.push(`/KPI`)
|
||||
"
|
||||
/>
|
||||
{{
|
||||
isReadonly
|
||||
? "รายละเอียดการประเมินผลการปฏิบัติราชการระดับบุคคล"
|
||||
: id
|
||||
? `แก้ไขแบบประเมิน`
|
||||
: `เพิ่มแบบประเมิน`
|
||||
}}
|
||||
<q-space />
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<q-card bordered flat class="relative-position">
|
||||
<div
|
||||
class="absolute-center-left"
|
||||
style="left: 2%; top: 50%; transform: translateY(-50%)"
|
||||
>
|
||||
<q-avatar size="95px">
|
||||
<q-img :src="store.dataEvaluation.avartar" />
|
||||
</q-avatar>
|
||||
</div>
|
||||
<div class="row col-12">
|
||||
<div class="row items-center col-12 q-pa-sm">
|
||||
<div class="col-12" style="padding-left: 12%">
|
||||
<div class="row col-12 items-center">
|
||||
<span class="text-h6 text-weight-medium text-primary">{{
|
||||
`${store.dataEvaluation.prefix}${store.dataEvaluation.firstName} ${store.dataEvaluation.lastName}`
|
||||
}}</span>
|
||||
<q-space />
|
||||
<div class="q-gutter-x-sm">
|
||||
<span
|
||||
v-if="
|
||||
(store.dataEvaluation.posExecutiveName == null &&
|
||||
store.indicatorWeightTotal != 100) ||
|
||||
(store.dataEvaluation.posExecutiveName != null &&
|
||||
(store.indicatorWeight1Total != 100 ||
|
||||
store.indicatorWeight2Total != 20))
|
||||
"
|
||||
class="text-red"
|
||||
>*น้ำหนัก(ร้อยละ) ผลสัมฤทธิ์ของงานไม่ถูกต้อง</span
|
||||
>
|
||||
<q-btn
|
||||
v-if="
|
||||
store.rolePerson == 'USER' &&
|
||||
store.dataEvaluation.evaluationStatus == 'NEW'
|
||||
"
|
||||
:disabled="
|
||||
(store.dataEvaluation.posExecutiveName == null &&
|
||||
store.indicatorWeightTotal != 100) ||
|
||||
(store.dataEvaluation.posExecutiveName != null &&
|
||||
(store.indicatorWeight1Total != 100 ||
|
||||
store.indicatorWeight2Total != 20))
|
||||
"
|
||||
unelevated
|
||||
round
|
||||
icon="mdi-send"
|
||||
color="grey-2"
|
||||
text-color="blue-6"
|
||||
size="md"
|
||||
@click="sendToEvaluatore('NEW_EVALUATOR')"
|
||||
>
|
||||
<q-tooltip>ส่งให้ผู้ประเมินอนุมัติ</q-tooltip>
|
||||
</q-btn>
|
||||
|
||||
<q-btn
|
||||
v-if="
|
||||
store.rolePerson == 'USER' &&
|
||||
store.dataEvaluation.evaluationStatus == 'EVALUATING'
|
||||
"
|
||||
unelevated
|
||||
round
|
||||
icon="mdi-send"
|
||||
color="grey-2"
|
||||
text-color="blue-6"
|
||||
size="md"
|
||||
@click="sendToEvaluatore('EVALUATING_EVALUATOR')"
|
||||
>
|
||||
<q-tooltip>ส่งให้ผู้ประเมินอนุมัติผลการประเมิน</q-tooltip>
|
||||
</q-btn>
|
||||
<div class="col-12 row justify-center">
|
||||
<div class="col-xs-12 col-sm-12 col-md-11">
|
||||
<div class="toptitle text-white col-12 row items-center">
|
||||
<q-btn
|
||||
icon="mdi-arrow-left"
|
||||
unelevated
|
||||
round
|
||||
dense
|
||||
flat
|
||||
color="primary"
|
||||
class="q-mr-sm"
|
||||
@click="
|
||||
isReadonly ? router.push(`/KPI-evaluator`) : router.push(`/KPI`)
|
||||
"
|
||||
/>
|
||||
{{
|
||||
isReadonly
|
||||
? "รายละเอียดการประเมินผลการปฏิบัติราชการระดับบุคคล"
|
||||
: id
|
||||
? `แก้ไขแบบประเมิน`
|
||||
: `เพิ่มแบบประเมิน`
|
||||
}}
|
||||
<q-space />
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<q-card bordered flat class="relative-position">
|
||||
<div
|
||||
class="absolute-center-left"
|
||||
style="left: 2%; top: 50%; transform: translateY(-50%)"
|
||||
>
|
||||
<q-avatar size="95px">
|
||||
<q-img
|
||||
:src="store.dataEvaluation.avartar"
|
||||
v-if="store.dataEvaluation.avartar !== undefined"
|
||||
/>
|
||||
<q-img src="@/assets/avatar_user.jpg" v-else />
|
||||
</q-avatar>
|
||||
</div>
|
||||
<div class="row col-12">
|
||||
<div class="row items-center col-12 q-pa-sm">
|
||||
<div class="col-12" style="padding-left: 12%">
|
||||
<div class="row col-12 items-center">
|
||||
<span class="text-h6 text-weight-medium text-primary">{{
|
||||
`${store.dataEvaluation.prefix}${store.dataEvaluation.firstName} ${store.dataEvaluation.lastName}`
|
||||
}}</span>
|
||||
<q-space />
|
||||
<div class="q-gutter-x-sm">
|
||||
<span
|
||||
v-if="
|
||||
(store.dataEvaluation.posExecutiveName == null &&
|
||||
store.indicatorWeightTotal != 100) ||
|
||||
(store.dataEvaluation.posExecutiveName != null &&
|
||||
(store.indicatorWeight1Total != 100 ||
|
||||
store.indicatorWeight2Total != 20))
|
||||
"
|
||||
class="text-red"
|
||||
>*น้ำหนัก(ร้อยละ) ผลสัมฤทธิ์ของงานไม่ถูกต้อง</span
|
||||
>
|
||||
<q-btn
|
||||
v-if="
|
||||
store.rolePerson == 'USER' &&
|
||||
store.dataEvaluation.evaluationStatus == 'NEW'
|
||||
"
|
||||
:disabled="
|
||||
(store.dataEvaluation.posExecutiveName == null &&
|
||||
store.indicatorWeightTotal != 100) ||
|
||||
(store.dataEvaluation.posExecutiveName != null &&
|
||||
(store.indicatorWeight1Total != 100 ||
|
||||
store.indicatorWeight2Total != 20))
|
||||
"
|
||||
unelevated
|
||||
round
|
||||
icon="mdi-send"
|
||||
color="grey-2"
|
||||
text-color="blue-6"
|
||||
size="md"
|
||||
@click="sendToEvaluatore('NEW_EVALUATOR')"
|
||||
>
|
||||
<q-tooltip>ส่งให้ผู้ประเมินอนุมัติ</q-tooltip>
|
||||
</q-btn>
|
||||
|
||||
<q-btn
|
||||
v-if="
|
||||
store.rolePerson == 'USER' &&
|
||||
store.tabOpen < 3 &&
|
||||
store.dataEvaluation.evaluationStatus != 'NEW' &&
|
||||
(store.dataEvaluation.evaluationReqEdit == null ||
|
||||
store.dataEvaluation.evaluationReqEdit == 'DONE')
|
||||
"
|
||||
:disabled="store.dataEvaluation.evaluatorId == null"
|
||||
unelevated
|
||||
round
|
||||
icon="mdi-file-edit"
|
||||
color="grey-2"
|
||||
text-color="red-6"
|
||||
size="md"
|
||||
@click="requireEdit()"
|
||||
>
|
||||
<q-tooltip>ขอแก้ไขข้อตกลง</q-tooltip>
|
||||
</q-btn>
|
||||
<q-btn
|
||||
v-if="
|
||||
store.rolePerson == 'USER' &&
|
||||
store.dataEvaluation.evaluationStatus == 'EVALUATING'
|
||||
"
|
||||
unelevated
|
||||
round
|
||||
icon="mdi-send"
|
||||
color="grey-2"
|
||||
text-color="blue-6"
|
||||
size="md"
|
||||
@click="sendToEvaluatore('EVALUATING_EVALUATOR')"
|
||||
>
|
||||
<q-tooltip
|
||||
>ส่งให้ผู้ประเมินอนุมัติผลการประเมิน</q-tooltip
|
||||
>
|
||||
</q-btn>
|
||||
|
||||
<!-- <q-btn
|
||||
v-if="!isReadonly"
|
||||
unelevated
|
||||
round
|
||||
icon="mdi-format-list-bulleted-square"
|
||||
color="grey-2"
|
||||
text-color="amber-10"
|
||||
size="md"
|
||||
@click="modalScore = true"
|
||||
>
|
||||
<q-tooltip>แก้ไขคะแนนเต็ม</q-tooltip>
|
||||
</q-btn> -->
|
||||
<q-btn
|
||||
unelevated
|
||||
round
|
||||
icon="mdi-account"
|
||||
color="grey-2"
|
||||
text-color="edit"
|
||||
size="md"
|
||||
@click="modalEdit = true"
|
||||
>
|
||||
<q-tooltip>{{
|
||||
store.dataEvaluation.evaluationStatus === "NEW" &&
|
||||
store.rolePerson === "USER"
|
||||
? "แก้ไขผู้ประเมิน"
|
||||
: "ข้อมูลผู้ประเมิน"
|
||||
}}</q-tooltip>
|
||||
</q-btn>
|
||||
<q-btn
|
||||
unelevated
|
||||
round
|
||||
icon="mdi-file-eye-outline"
|
||||
color="grey-2"
|
||||
text-color="primary"
|
||||
size="md"
|
||||
>
|
||||
<q-tooltip>ดูข้อมูลการช่วยราชการ</q-tooltip>
|
||||
</q-btn>
|
||||
<q-btn
|
||||
unelevated
|
||||
round
|
||||
color="grey-2"
|
||||
text-color="blue-5"
|
||||
icon="mdi-file-eye-outline"
|
||||
size="md"
|
||||
>
|
||||
<q-tooltip>ดูข้อมูลการทดลองงาน</q-tooltip>
|
||||
</q-btn>
|
||||
<q-btn
|
||||
v-if="
|
||||
store.rolePerson == 'USER' &&
|
||||
store.tabOpen < 3 &&
|
||||
store.dataEvaluation.evaluationStatus != 'NEW' &&
|
||||
(store.dataEvaluation.evaluationReqEdit == null ||
|
||||
store.dataEvaluation.evaluationReqEdit == 'DONE')
|
||||
"
|
||||
:disabled="store.dataEvaluation.evaluatorId == null"
|
||||
unelevated
|
||||
round
|
||||
icon="mdi-file-edit"
|
||||
color="grey-2"
|
||||
text-color="red-6"
|
||||
size="md"
|
||||
@click="requireEdit()"
|
||||
>
|
||||
<q-tooltip>ขอแก้ไขข้อตกลง</q-tooltip>
|
||||
</q-btn>
|
||||
|
||||
<!-- <q-btn
|
||||
v-if="!isReadonly"
|
||||
unelevated
|
||||
round
|
||||
icon="mdi-format-list-bulleted-square"
|
||||
color="grey-2"
|
||||
text-color="amber-10"
|
||||
size="md"
|
||||
@click="modalScore = true"
|
||||
>
|
||||
<q-tooltip>แก้ไขคะแนนเต็ม</q-tooltip>
|
||||
</q-btn> -->
|
||||
<q-btn
|
||||
unelevated
|
||||
round
|
||||
icon="mdi-account"
|
||||
color="grey-2"
|
||||
text-color="edit"
|
||||
size="md"
|
||||
@click="modalEdit = true"
|
||||
>
|
||||
<q-tooltip>{{
|
||||
store.dataEvaluation.evaluationStatus === "NEW" &&
|
||||
store.rolePerson === "USER"
|
||||
? "แก้ไขผู้ประเมิน"
|
||||
: "ข้อมูลผู้ประเมิน"
|
||||
}}</q-tooltip>
|
||||
</q-btn>
|
||||
<q-btn
|
||||
unelevated
|
||||
round
|
||||
icon="mdi-file-eye-outline"
|
||||
color="grey-2"
|
||||
text-color="primary"
|
||||
size="md"
|
||||
>
|
||||
<q-tooltip>ดูข้อมูลการช่วยราชการ</q-tooltip>
|
||||
</q-btn>
|
||||
<q-btn
|
||||
unelevated
|
||||
round
|
||||
color="grey-2"
|
||||
text-color="blue-5"
|
||||
icon="mdi-file-eye-outline"
|
||||
size="md"
|
||||
>
|
||||
<q-tooltip>ดูข้อมูลการทดลองงาน</q-tooltip>
|
||||
</q-btn>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row items-center bg-toolbar col-12 q-pa-sm">
|
||||
<div class="col-12 q-py-xs" style="padding-left: 12%">
|
||||
<div class="row no-wrap">
|
||||
<div class="col-2">
|
||||
<div class="column">
|
||||
<span class="text-grey-6">ตำแหน่งในสายงาน</span>
|
||||
<span class="text-weight-medium text-dark">{{
|
||||
store.dataEvaluation.position
|
||||
}}</span>
|
||||
<div class="row items-center bg-toolbar col-12 q-pa-sm">
|
||||
<div class="col-12 q-py-xs" style="padding-left: 12%">
|
||||
<div class="row no-wrap">
|
||||
<div class="col-2">
|
||||
<div class="column">
|
||||
<span class="text-grey-6">ตำแหน่งในสายงาน</span>
|
||||
<span class="text-weight-medium text-dark">{{
|
||||
store.dataEvaluation.position
|
||||
}}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-2">
|
||||
<div class="column">
|
||||
<span class="text-grey-6">ประเภทตำแหน่ง</span>
|
||||
<span class="text-weight-medium text-dark">{{
|
||||
store.dataEvaluation.posTypeName
|
||||
}}</span>
|
||||
<div class="col-2">
|
||||
<div class="column">
|
||||
<span class="text-grey-6">ประเภทตำแหน่ง</span>
|
||||
<span class="text-weight-medium text-dark">{{
|
||||
store.dataEvaluation.posTypeName
|
||||
}}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-2">
|
||||
<div class="column">
|
||||
<span class="text-grey-6">ระดับตำแหน่ง</span>
|
||||
<span class="text-weight-medium text-dark">{{
|
||||
store.dataEvaluation.posLevelName
|
||||
}}</span>
|
||||
<div class="col-2">
|
||||
<div class="column">
|
||||
<span class="text-grey-6">ระดับตำแหน่ง</span>
|
||||
<span class="text-weight-medium text-dark">{{
|
||||
store.dataEvaluation.posLevelName
|
||||
}}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-2">
|
||||
<div class="column">
|
||||
<span class="text-grey-6">สถานะการประเมิน</span>
|
||||
<span class="text-weight-medium text-dark">{{
|
||||
formProfile.status
|
||||
}}</span>
|
||||
<div class="col-2">
|
||||
<div class="column">
|
||||
<span class="text-grey-6">สถานะการประเมิน</span>
|
||||
<span class="text-weight-medium text-dark">{{
|
||||
formProfile.status
|
||||
}}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-2">
|
||||
<div class="column">
|
||||
<span class="text-grey-6">ผลการประเมิน</span>
|
||||
<span class="text-weight-medium text-dark">{{
|
||||
formProfile.result
|
||||
}}</span>
|
||||
<div class="col-2">
|
||||
<div class="column">
|
||||
<span class="text-grey-6">ผลการประเมิน</span>
|
||||
<span class="text-weight-medium text-dark">{{
|
||||
formProfile.result
|
||||
}}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-2">
|
||||
<div class="column">
|
||||
<span class="text-grey-6">คะแนนประเมิน</span>
|
||||
<span class="text-weight-medium text-primary">
|
||||
{{
|
||||
store.dataEvaluation.posExecutiveName == null
|
||||
? (
|
||||
store.indicatorScoreVal +
|
||||
store.competencyScoreVal +
|
||||
store.devScoreVal
|
||||
).toFixed(2)
|
||||
: (
|
||||
store.excusiveIndicator1ScoreVal +
|
||||
store.excusiveIndicator2ScoreVal +
|
||||
store.competencyScoreVal
|
||||
).toFixed(2)
|
||||
}}
|
||||
</span>
|
||||
<div class="col-2">
|
||||
<div class="column">
|
||||
<span class="text-grey-6">คะแนนประเมิน</span>
|
||||
<span class="text-weight-medium text-primary">
|
||||
{{
|
||||
store.dataEvaluation.posExecutiveName == null
|
||||
? (
|
||||
store.indicatorScoreVal +
|
||||
store.competencyScoreVal +
|
||||
store.devScoreVal
|
||||
).toFixed(2)
|
||||
: (
|
||||
store.excusiveIndicator1ScoreVal +
|
||||
store.excusiveIndicator2ScoreVal +
|
||||
store.competencyScoreVal
|
||||
).toFixed(2)
|
||||
}}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</q-card>
|
||||
</q-card>
|
||||
|
||||
<q-card class="q-mt-md rounded">
|
||||
<TabMain />
|
||||
</q-card>
|
||||
<q-card class="q-mt-md rounded">
|
||||
<TabMain />
|
||||
</q-card>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<q-dialog v-model="modalEdit" persistent>
|
||||
<q-card bordered style="width: 50vh">
|
||||
|
|
|
|||
|
|
@ -213,94 +213,93 @@ onMounted(async () => {
|
|||
</div>
|
||||
<div class="col-12">
|
||||
<q-card bordered class="q-pa-md">
|
||||
<q-toolbar style="padding: 0">
|
||||
<div class="row q-gutter-sm">
|
||||
<datepicker
|
||||
menu-class-name="modalfix"
|
||||
v-model="store.yearRound"
|
||||
:locale="'th'"
|
||||
autoApply
|
||||
year-picker
|
||||
:enableTimePicker="false"
|
||||
@update:model-value="fetchRoundOption(true)"
|
||||
>
|
||||
<template #year="{ year }">{{ year + 543 }}</template>
|
||||
<template #year-overlay-value="{ value }">{{
|
||||
parseInt(value + 543)
|
||||
}}</template>
|
||||
<template #trigger>
|
||||
<q-input
|
||||
dense
|
||||
lazy-rules
|
||||
outlined
|
||||
hide-bottom-space
|
||||
:model-value="
|
||||
!!store.yearRound ? store.yearRound + 543 : null
|
||||
"
|
||||
:label="`${'ปีงบประมาณ'}`"
|
||||
>
|
||||
<template v-slot:prepend>
|
||||
<q-icon
|
||||
name="event"
|
||||
class="cursor-pointer"
|
||||
style="color: var(--q-primary)"
|
||||
>
|
||||
</q-icon>
|
||||
</template>
|
||||
</q-input>
|
||||
</template>
|
||||
</datepicker>
|
||||
|
||||
<q-select
|
||||
v-model="store.formQuery.round"
|
||||
outlined
|
||||
label="รอบการประเมิน"
|
||||
dense
|
||||
option-label="name"
|
||||
option-value="id"
|
||||
:options="roundOp"
|
||||
style="min-width: 200px"
|
||||
emit-value
|
||||
map-options
|
||||
@update:model-value="changRound"
|
||||
/>
|
||||
</div>
|
||||
<div class="items-center col-12 row q-col-gutter-sm q-mb-sm">
|
||||
<datepicker
|
||||
class="col-md-1 col-xs-12"
|
||||
menu-class-name="modalfix"
|
||||
v-model="store.yearRound"
|
||||
:locale="'th'"
|
||||
autoApply
|
||||
year-picker
|
||||
:enableTimePicker="false"
|
||||
@update:model-value="fetchRoundOption(true)"
|
||||
>
|
||||
<template #year="{ year }">{{ year + 543 }}</template>
|
||||
<template #year-overlay-value="{ value }">{{
|
||||
parseInt(value + 543)
|
||||
}}</template>
|
||||
<template #trigger>
|
||||
<q-input
|
||||
dense
|
||||
lazy-rules
|
||||
outlined
|
||||
hide-bottom-space
|
||||
:model-value="
|
||||
!!store.yearRound ? store.yearRound + 543 : null
|
||||
"
|
||||
:label="`${'ปีงบประมาณ'}`"
|
||||
>
|
||||
<template v-slot:prepend>
|
||||
<q-icon
|
||||
name="event"
|
||||
class="cursor-pointer"
|
||||
style="color: var(--q-primary)"
|
||||
>
|
||||
</q-icon>
|
||||
</template>
|
||||
</q-input>
|
||||
</template>
|
||||
</datepicker>
|
||||
<q-select
|
||||
class="col-md-2 col-xs-12"
|
||||
v-model="store.formQuery.round"
|
||||
outlined
|
||||
label="รอบการประเมิน"
|
||||
dense
|
||||
option-label="name"
|
||||
option-value="id"
|
||||
:options="roundOp"
|
||||
emit-value
|
||||
map-options
|
||||
@update:model-value="changRound"
|
||||
/>
|
||||
|
||||
<q-space />
|
||||
<div class="row q-gutter-sm">
|
||||
<q-input
|
||||
outlined
|
||||
dense
|
||||
v-model="store.formQuery.keyword"
|
||||
label="ค้นหาผู้ขอรับการประเมิน"
|
||||
@keydown.enter.prevent="changRound"
|
||||
>
|
||||
<template v-slot:append>
|
||||
<q-icon
|
||||
v-if="store.formQuery.keyword !== ''"
|
||||
name="clear"
|
||||
class="cursor-pointer"
|
||||
@click="(store.formQuery.keyword = ''), changRound()"
|
||||
/>
|
||||
<q-icon v-else name="search" color="grey-5" />
|
||||
</template>
|
||||
</q-input>
|
||||
<q-select
|
||||
v-model="visibleColumns"
|
||||
multiple
|
||||
outlined
|
||||
dense
|
||||
options-dense
|
||||
:display-value="$q.lang.table.columns"
|
||||
emit-value
|
||||
map-options
|
||||
:options="columns"
|
||||
option-value="name"
|
||||
options-cover
|
||||
style="min-width: 150px"
|
||||
/>
|
||||
</div>
|
||||
</q-toolbar>
|
||||
|
||||
<q-input
|
||||
class="col-md-2 col-xs-12"
|
||||
outlined
|
||||
dense
|
||||
v-model="store.formQuery.keyword"
|
||||
label="ค้นหาผู้ขอรับการประเมิน"
|
||||
@keydown.enter.prevent="changRound"
|
||||
>
|
||||
<template v-slot:append>
|
||||
<q-icon
|
||||
v-if="store.formQuery.keyword !== ''"
|
||||
name="clear"
|
||||
class="cursor-pointer"
|
||||
@click="(store.formQuery.keyword = ''), changRound()"
|
||||
/>
|
||||
<q-icon v-else name="search" color="grey-5" />
|
||||
</template>
|
||||
</q-input>
|
||||
<q-select
|
||||
class="col-md-1 col-xs-12"
|
||||
v-model="visibleColumns"
|
||||
multiple
|
||||
outlined
|
||||
dense
|
||||
options-dense
|
||||
:display-value="$q.lang.table.columns"
|
||||
emit-value
|
||||
map-options
|
||||
:options="columns"
|
||||
option-value="name"
|
||||
options-cover
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="col-12">
|
||||
<q-card bordered class="q-mt-sm">
|
||||
<q-tabs
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue