ui รายการโครงการ/หลักสูตรการฝึกอบรมที่หน่วยงานของกรุงเทพมหานครเป็นผู้จัด

This commit is contained in:
DESKTOP-1R2VSQH\Lenovo ThinkPad E490 2024-03-25 18:01:33 +07:00
parent 179a2b395e
commit c084262a40
9 changed files with 1072 additions and 93 deletions

View file

@ -1,14 +1,11 @@
<script setup lang="ts">
import { ref, reactive, watch } from "vue";
import { ref, reactive, watch } from "vue";
import { useQuasar } from "quasar";
import axios from "axios";
import http from "@/plugins/http";
import config from "@/app.config";
import type {
ObjectSalaryRef,
} from "@/modules/13_salary/interface/index/Main";
import type { ObjectSalaryRef } from "@/modules/13_salary/interface/index/Main";
import Header from "@/components/DialogHeader.vue";
@ -32,7 +29,7 @@ const props = defineProps({
},
id: {
type: String,
defult: '',
defult: "",
},
isActive: {
type: Boolean,
@ -74,13 +71,9 @@ const ObjectRef: ObjectSalaryRef = {
endDate: endDateRef,
};
const documentFile = ref<any>(null);
const itemsDocument = ref<any>([]);
async function fetchDocumentFile(id: string) {
await http
.get(config.API.salaryChartFile(id))
@ -89,9 +82,9 @@ async function fetchDocumentFile(id: string) {
itemsDocument.value = list;
})
.catch((err) => {})
.finally(()=>{
hideLoader()
})
.finally(() => {
hideLoader();
});
}
watch(
@ -291,12 +284,9 @@ async function downloadFile(url: string, type: string, fileName: string) {
<div class="row col-12 q-col-gutter-sm">
<div class="col-md-12">
<div class="col-xs-12 col-md-3">
<div class="row col-12 q-col-gutter-y-sm">
<div class="col-12 row">
<div v-if="!props.isActive" class="full-width">
<div class="row col-12 q-col-gutter-y-sm">
<div class="col-12 row">
<div v-if="!props.isActive" class="full-width">
<q-file
v-if="props.typeAction === 'edit'"
class="col-12"
@ -324,68 +314,58 @@ async function downloadFile(url: string, type: string, fileName: string) {
</template>
</q-file>
</div>
</div>
<div v-if="itemsDocument.length > 0" class="col-xs-12 row">
<q-list
class="full-width rounded-borders"
bordered
separator
>
<q-item
v-for="file in itemsDocument"
:key="file.id"
clickable
v-ripple
>
<q-item-section>{{ file.name }}</q-item-section>
<q-item-section avatar>
<div class="row q-col-gutter-md">
<div>
<q-btn
dense
flat
round
size="12px"
color="blue"
icon="mdi-download-outline"
@click="onClickDonwload(file.name)"
>
<q-tooltip>ดาวนโหลดไฟล</q-tooltip>
</q-btn>
</div>
<div v-if="!props.isActive">
<q-btn
dense
flat
round
size="12px"
color="red"
icon="mdi-delete-outline"
@click="onClickDeleteFile(file.name)"
><q-tooltip>ลบไฟล</q-tooltip></q-btn
>
</div>
</div>
</q-item-section>
</q-item>
</q-list>
</div>
<div class="col-12" v-else>
<q-card class="q-pa-md" bordered>
ไมรายการเอกสาร
</q-card>
</div>
</div>
<div v-if="itemsDocument.length > 0" class="col-xs-12 row">
<q-list class="full-width rounded-borders" bordered separator>
<q-item
v-for="file in itemsDocument"
:key="file.id"
clickable
v-ripple
>
<q-item-section>{{ file.name }}</q-item-section>
<q-item-section avatar>
<div class="row q-col-gutter-md">
<div>
<q-btn
dense
flat
round
size="12px"
color="blue"
icon="mdi-download-outline"
@click="onClickDonwload(file.name)"
>
<q-tooltip>ดาวนโหลดไฟล</q-tooltip>
</q-btn>
</div>
<div v-if="!props.isActive">
<q-btn
dense
flat
round
size="12px"
color="red"
icon="mdi-delete-outline"
@click="onClickDeleteFile(file.name)"
><q-tooltip>ลบไฟล</q-tooltip></q-btn
>
</div>
</div>
</q-item-section>
</q-item>
</q-list>
</div>
<div class="col-12" v-else>
<q-card class="q-pa-md" bordered> ไมรายการเอกสาร </q-card>
</div>
</div>
</div>
</div>
</div>
</q-card-section>
</q-card>
</q-dialog>
</template>