แก้ ui รายการตัวชี้วัดตามแผนฯ

This commit is contained in:
STW_TTTY\stwtt 2024-05-08 15:21:53 +07:00
parent 46f559a328
commit 34afb899e7
2 changed files with 83 additions and 40 deletions

View file

@ -121,7 +121,7 @@ function fetchDataById(id: string) {
.get(config.API.kpiPlanById(id))
.then((res) => {
const data = res.data.result;
year.value = data.year;
year.value = Number(data.year);
planData.period = data.round;
planData.including = data.including;
planData.includingName = data.includingName;
@ -140,6 +140,7 @@ function fetchDataById(id: string) {
planData.orgRevisionId = data.orgRevisionId;
planData.strategy = data.strategy;
planData.strategyId = data.strategyId;
planData.documentInfoEvidence = data.documentInfoEvidence;
// /
const arrayexpandedAgency = [

View file

@ -4,7 +4,7 @@ import { useQuasar, type QTableProps } from "quasar";
import { useRouter } from "vue-router";
import type { DataOption } from "@/modules/14_KPI/interface/index/Main";
import DialogHistory from '@/modules/14_KPI/components/DialogHistory.vue'
import DialogHistory from "@/modules/14_KPI/components/DialogHistory.vue";
/** importStore*/
import { useCounterMixin } from "@/stores/mixin";
@ -12,7 +12,7 @@ import http from "@/plugins/http";
import config from "@/app.config";
/** use*/
const modalHistory = ref<boolean>(false)
const modalHistory = ref<boolean>(false);
const isAll = ref<boolean>(false);
const $q = useQuasar();
const router = useRouter();
@ -53,7 +53,7 @@ const roundOp = ref<DataOption[]>([
const totalList = ref<number>(1);
const year = ref<number|null>(new Date().getFullYear());
const year = ref<number | null>(new Date().getFullYear());
const nodeData = reactive<any>({
page: 1,
pageSize: 10,
@ -66,10 +66,16 @@ const nodeData = reactive<any>({
function fetchList() {
showLoader();
http
.get(
config.API.kpiPlan +
`?page=${nodeData.page}&pageSize=${nodeData.pageSize}&period=${nodeData.round}&nodeId=${nodeData.nodeId}&node=${nodeData.node}&keyword=${nodeData.keyword}&year=${year.value}&isAll=${isAll.value}`
)
.post(config.API.kpiPlan + `/search`, {
isAll: isAll.value,
keyword: nodeData.keyword,
node: nodeData.node ? nodeData.node : 0,
nodeId: nodeData.nodeId,
period: nodeData.round,
year: year.value?.toString(),
pageSize: nodeData.pageSize,
page: nodeData.page,
})
.then((res) => {
const data = res.data.result.data;
totalList.value = Math.ceil(res.data.result.total / nodeData.pageSize);
@ -160,10 +166,10 @@ function clearFilter() {
/**
* เป dialog history
* @param id
* @param id
*/
function onClickHistory(id:string){
modalHistory.value = true
function onClickHistory(id: string) {
modalHistory.value = true;
}
onMounted(async () => {
@ -245,8 +251,24 @@ onMounted(async () => {
</div>
<div class="col-xs-12 col-sm-9 q-pa-md row">
<div class="col-12">
<q-toolbar style="padding: 0">
<div class="row q-gutter-sm">
<div class="row q-col-gutter-sm items-center q-mb-sm">
<div
:class="`${
$q.screen.gt.md ? '' : 'col-12'
} row q-gutter-sm no-wrap`"
>
<q-btn
flat
round
dense
icon="add"
color="primary"
@click="onClickAddOrView()"
v-if="!$q.screen.gt.md"
>
<q-tooltip>เพ</q-tooltip>
</q-btn>
<q-space v-if="!$q.screen.gt.md" />
<datepicker
menu-class-name="modalfix"
v-model="year"
@ -281,7 +303,9 @@ onMounted(async () => {
<q-icon
name="cancel"
@click.stop.prevent="
(year = null), (nodeData.page = 1), fetchListProjectNew()
(year = null),
(nodeData.page = 1),
fetchListProjectNew()
"
class="cursor-pointer"
/>
@ -294,6 +318,7 @@ onMounted(async () => {
dense
outlined
v-model="nodeData.round"
:model-value="nodeData.round === '' ? 'ทั้งหมด' : nodeData.round"
:options="roundOp"
label="รอบการประเมิน"
option-label="name"
@ -301,27 +326,42 @@ onMounted(async () => {
emit-value
map-options
@update:model-value="fetchListProjectNew"
style="min-width: 150px"
/>
<q-toolbar-title>
<q-btn
flat
round
dense
icon="add"
color="primary"
@click="onClickAddOrView()"
>
<q-tooltip>เพ</q-tooltip>
</q-btn>
</q-toolbar-title>
</div>
<q-space />
style="min-width: 120px"
>
<template v-if="nodeData.round" v-slot:append>
<q-icon
name="cancel"
@click.stop.prevent="
(nodeData.round = ''), fetchListProjectNew()
"
class="cursor-pointer"
/>
</template>
</q-select>
<div class="row q-gutter-sm">
<q-btn
flat
round
dense
icon="add"
color="primary"
@click="onClickAddOrView()"
v-if="$q.screen.gt.md"
>
<q-tooltip>เพ</q-tooltip>
</q-btn>
</div>
<q-space />
<div
:class="`${
$q.screen.gt.md ? '' : 'col-12'
} row q-gutter-sm no-wrap`"
>
<q-checkbox
keep-color
v-model="isAll"
label="แสดงตำแหน่งทั้งหมด"
color="primary"
@update:model-value="fetchListProjectNew"
@ -330,7 +370,7 @@ onMounted(async () => {
>แสดงตำแหนงทงหมดภายใตหนวยงาน/วนราชการทเลอก</q-tooltip
>
</q-checkbox>
<q-space v-if="!$q.screen.gt.md" />
<q-input
class="inputgreen"
standout
@ -338,6 +378,7 @@ onMounted(async () => {
v-model="nodeData.keyword"
ref="filterRef"
outlined
style="width:150px"
placeholder="ค้นหา"
@keydown.enter.prevent="fetchListProjectNew"
>
@ -364,10 +405,11 @@ onMounted(async () => {
:options="columns"
option-value="name"
options-cover
style="min-width: 150px"
style="min-width: 120px"
/>
</div>
</q-toolbar>
</div>
<div class="col-12">
<d-table
for="table"
@ -419,7 +461,11 @@ onMounted(async () => {
class="q-py-sm"
>
<q-tooltip>แกไขขอม</q-tooltip>
<q-icon color="primary" size="xs" name="mdi-pencil-outline" />
<q-icon
color="primary"
size="xs"
name="mdi-pencil-outline"
/>
</q-item-section>
<q-item-section>แกไขขอม</q-item-section>
</q-item>
@ -456,7 +502,6 @@ onMounted(async () => {
</q-list>
</q-menu>
</q-btn>
</q-td>
</q-tr>
</template>
@ -466,10 +511,7 @@ onMounted(async () => {
</div>
</q-card>
<DialogHistory
v-model:modal="modalHistory"
/>
<DialogHistory v-model:modal="modalHistory" />
</template>
<style lang="scss" scoped>