สิทธิ์ / rating เปลี่ยนเป็น btn group

This commit is contained in:
STW_TTTY\stwtt 2024-08-01 15:38:46 +07:00
parent c6d4f5f0e3
commit 006a492834
22 changed files with 2248 additions and 2718 deletions

View file

@ -1,56 +1,46 @@
<template>
<div class="col-12 row q-pb-sm">
<div class="col-12 text-top0 items-center q-pa-md">
เกณฑการประเมนความคาดหว
</div>
<div class="q-gutter-sm row">
<div class="col-12 row">
<div class="col-2 row justify-center">
<i class="q-icon notranslate material-icons q-rating__icon q-rating__icon--active text-light-blue-3" aria-hidden="true" role="presentation">grade</i>
</div>
<div class="q-pl-md col-3">ำกวาความคาดหวงมาก</div>
<div class="q-pl-md">หมายถ คะแนนเฉลยทระด 1</div>
</div>
<div class="col-12 row">
<div class="col-2 row justify-center">
<i class="q-icon notranslate material-icons q-rating__icon q-rating__icon--active text-light-blue-3" aria-hidden="true" role="presentation">grade</i>
<i class="q-icon notranslate material-icons q-rating__icon q-rating__icon--active text-light-blue-6" aria-hidden="true" role="presentation">grade</i>
</div>
<div class="q-pl-md col-3">ำกวาความคาดหวงคอนขางมาก</div>
<div class="q-pl-md">หมายถ คะแนนเฉลยทระด 2</div>
</div>
<div class="col-12 row">
<div class="col-2 row justify-center">
<i class="q-icon notranslate material-icons q-rating__icon q-rating__icon--active text-light-blue-3" aria-hidden="true" role="presentation">grade</i>
<i class="q-icon notranslate material-icons q-rating__icon q-rating__icon--active text-light-blue-6" aria-hidden="true" role="presentation">grade</i>
<i class="q-icon notranslate material-icons q-rating__icon q-rating__icon--active text-blue" aria-hidden="true" role="presentation">grade</i>
</div>
<div class="q-pl-md col-3">เปนไปตามความคาดหว</div>
<div class="q-pl-md">หมายถ คะแนนเฉลยทระด 3</div>
</div>
<div class="col-12 row">
<div class="col-2 row justify-center">
<i class="q-icon notranslate material-icons q-rating__icon q-rating__icon--active text-light-blue-3" aria-hidden="true" role="presentation">grade</i>
<i class="q-icon notranslate material-icons q-rating__icon q-rating__icon--active text-light-blue-6" aria-hidden="true" role="presentation">grade</i>
<i class="q-icon notranslate material-icons q-rating__icon q-rating__icon--active text-blue" aria-hidden="true" role="presentation">grade</i>
<i class="q-icon notranslate material-icons q-rating__icon q-rating__icon--active text-blue-9" aria-hidden="true" role="presentation">grade</i>
</div>
<div class="q-pl-md col-3">งวาความคาดหวงคอนขางมาก</div>
<div class="q-pl-md">หมายถ คะแนนเฉลยทระด 4</div>
</div>
<div class="col-12 row">
<div class="col-2 row justify-center">
<i class="q-icon notranslate material-icons q-rating__icon q-rating__icon--active text-light-blue-3" aria-hidden="true" role="presentation">grade</i>
<i class="q-icon notranslate material-icons q-rating__icon q-rating__icon--active text-light-blue-6" aria-hidden="true" role="presentation">grade</i>
<i class="q-icon notranslate material-icons q-rating__icon q-rating__icon--active text-blue" aria-hidden="true" role="presentation">grade</i>
<i class="q-icon notranslate material-icons q-rating__icon q-rating__icon--active text-blue-9" aria-hidden="true" role="presentation">grade</i>
<i class="q-icon notranslate material-icons q-rating__icon q-rating__icon--active text-blue-10" aria-hidden="true" role="presentation">grade</i>
</div>
<div class="q-pl-md col-3">งกวาความคาดหวงมาก</div>
<div class="q-pl-md">หมายถ คะแนนเฉลยทระด 5</div>
</div>
</div>
<div class="col-12 row q-pb-sm">
<div class="col-12 text-top0 items-center q-pa-md">
เกณฑการประเมนความคาดหว
</div>
<div class="q-gutter-sm row">
<div class="col-12 row items-center">
<div class="col-2 row justify-center">
<q-btn outline color="grey-6" :label="'1'"> </q-btn>
</div>
<div class="q-pl-md col-3">ำกวาความคาดหวงมาก</div>
<div class="q-pl-md">หมายถ คะแนนเฉลยทระด 1</div>
</div>
<div class="col-12 row items-center">
<div class="col-2 row justify-center">
<q-btn outline color="grey-6" :label="'2'"> </q-btn>
</div>
<div class="q-pl-md col-3">ำกวาความคาดหวงคอนขางมาก</div>
<div class="q-pl-md">หมายถ คะแนนเฉลยทระด 2</div>
</div>
<div class="col-12 row items-center">
<div class="col-2 row justify-center">
<q-btn outline color="grey-6" :label="'3'"> </q-btn>
</div>
<div class="q-pl-md col-3">เปนไปตามความคาดหว</div>
<div class="q-pl-md">หมายถ คะแนนเฉลยทระด 3</div>
</div>
<div class="col-12 row items-center">
<div class="col-2 row justify-center">
<q-btn outline color="grey-6" :label="'4'"> </q-btn>
</div>
<div class="q-pl-md col-3">งวาความคาดหวงคอนขางมาก</div>
<div class="q-pl-md">หมายถ คะแนนเฉลยทระด 4</div>
</div>
<div class="col-12 row items-center">
<div class="col-2 row justify-center">
<q-btn outline color="grey-6" :label="'5'"> </q-btn>
</div>
<div class="q-pl-md col-3">งกวาความคาดหวงมาก</div>
<div class="q-pl-md">หมายถ คะแนนเฉลยทระด 5</div>
</div>
</div>
</div>
</template>
<style lang="scss" scoped>
.text-top0 {
@ -58,4 +48,4 @@
padding-bottom: 8px;
color: rgb(70, 68, 68);
}
</style>
</style>