chore: format
This commit is contained in:
parent
cdd2a90d06
commit
d0c79673fe
14 changed files with 3946 additions and 1413 deletions
|
|
@ -1,4 +1,5 @@
|
||||||
# EDM Frontend
|
# EDM Frontend
|
||||||
|
|
||||||
Enterprise Document Management (EDM) ส่วน frontend
|
Enterprise Document Management (EDM) ส่วน frontend
|
||||||
|
|
||||||
# ส่วนประกอบ
|
# ส่วนประกอบ
|
||||||
|
|
@ -6,11 +7,11 @@ Enterprise Document Management (EDM) ส่วน frontend
|
||||||
- Vue.js (TypeScript) ใช้ Quasar Framework เป็น UI Framework หลักสำหรับการพัฒนา
|
- Vue.js (TypeScript) ใช้ Quasar Framework เป็น UI Framework หลักสำหรับการพัฒนา
|
||||||
- pnpm เป็น package manager
|
- pnpm เป็น package manager
|
||||||
- Library Document ใช้ typedoc, typedoc-plugin-vue
|
- Library Document ใช้ typedoc, typedoc-plugin-vue
|
||||||
|
|
||||||
```
|
```
|
||||||
pnpm i -D typedoc typedoc-plugin-vue
|
pnpm i -D typedoc typedoc-plugin-vue
|
||||||
```
|
```
|
||||||
|
|
||||||
|
|
||||||
สำหรับ User
|
สำหรับ User
|
||||||
|
|
||||||
## โครงสร้างโฟลเดอร์
|
## โครงสร้างโฟลเดอร์
|
||||||
|
|
|
||||||
|
|
@ -1,4 +1,4 @@
|
||||||
<!DOCTYPE html>
|
<!doctype html>
|
||||||
<html lang="en">
|
<html lang="en">
|
||||||
<head>
|
<head>
|
||||||
<meta charset="UTF-8" />
|
<meta charset="UTF-8" />
|
||||||
|
|
|
||||||
5227
Services/client/pnpm-lock.yaml
generated
5227
Services/client/pnpm-lock.yaml
generated
File diff suppressed because it is too large
Load diff
|
|
@ -1,8 +1,8 @@
|
||||||
{
|
{
|
||||||
"realm": "EDM",
|
"realm": "EDM",
|
||||||
"auth-server-url": "https://edm-id.frappet.synology.me/",
|
"auth-server-url": "https://edm-id.frappet.synology.me/",
|
||||||
"ssl-required": "external",
|
"ssl-required": "external",
|
||||||
"resource": "EDM-V1",
|
"resource": "EDM-V1",
|
||||||
"public-client": true,
|
"public-client": true,
|
||||||
"confidential-port": 0
|
"confidential-port": 0
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -13,11 +13,11 @@ const props = withDefaults(
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<q-dialog
|
<q-dialog
|
||||||
persistent
|
persistent
|
||||||
transition-show="scale"
|
transition-show="scale"
|
||||||
transition-hide="scale"
|
transition-hide="scale"
|
||||||
:model-value="props.open"
|
:model-value="props.open"
|
||||||
@update:model-value="(v) => $emit('update:open', v)"
|
@update:model-value="(v) => $emit('update:open', v)"
|
||||||
>
|
>
|
||||||
<q-card style="width: 400px">
|
<q-card style="width: 400px">
|
||||||
<q-card-section>
|
<q-card-section>
|
||||||
|
|
@ -36,7 +36,7 @@ const props = withDefaults(
|
||||||
label="ยกเลิก"
|
label="ยกเลิก"
|
||||||
flat
|
flat
|
||||||
v-close-popup
|
v-close-popup
|
||||||
@click="() => ($emit('update:open', !open))"
|
@click="() => $emit('update:open', !open)"
|
||||||
id="dialogDeleteClose"
|
id="dialogDeleteClose"
|
||||||
/>
|
/>
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -15,13 +15,12 @@ const props = withDefaults(
|
||||||
defineProps<{ action: boolean; viewMode: 'view_list' | 'view_module' }>(),
|
defineProps<{ action: boolean; viewMode: 'view_list' | 'view_module' }>(),
|
||||||
{
|
{
|
||||||
action: false,
|
action: false,
|
||||||
}
|
},
|
||||||
)
|
)
|
||||||
const DEPT_NAME = ['ตู้เอกสาร', 'ลิ้นชัก', 'แฟ้ม', 'แฟ้มย่อย'] as const
|
const DEPT_NAME = ['ตู้เอกสาร', 'ลิ้นชัก', 'แฟ้ม', 'แฟ้มย่อย'] as const
|
||||||
const { getFileInfo, getFileNameFormat } = useFileInfoStore()
|
const { getFileInfo, getFileNameFormat } = useFileInfoStore()
|
||||||
const { currentFolder, currentFile, currentDept, currentPath } = storeToRefs(
|
const { currentFolder, currentFile, currentDept, currentPath } =
|
||||||
useTreeDataStore()
|
storeToRefs(useTreeDataStore())
|
||||||
)
|
|
||||||
const {
|
const {
|
||||||
createFolder,
|
createFolder,
|
||||||
editFolder,
|
editFolder,
|
||||||
|
|
@ -38,8 +37,8 @@ const currentIcon = computed(() =>
|
||||||
currentDept.value === 0
|
currentDept.value === 0
|
||||||
? 'mdi-file-cabinet'
|
? 'mdi-file-cabinet'
|
||||||
: currentDept.value === 1
|
: currentDept.value === 1
|
||||||
? 'inbox'
|
? 'inbox'
|
||||||
: 'o_folder_open'
|
: 'o_folder_open',
|
||||||
)
|
)
|
||||||
|
|
||||||
const dialogDeleteState = ref<boolean>(false)
|
const dialogDeleteState = ref<boolean>(false)
|
||||||
|
|
@ -114,7 +113,7 @@ function triggerFileEdit(
|
||||||
keyword: string[]
|
keyword: string[]
|
||||||
category: string[]
|
category: string[]
|
||||||
},
|
},
|
||||||
pathname: string
|
pathname: string,
|
||||||
) {
|
) {
|
||||||
fileFormState.value = true
|
fileFormState.value = true
|
||||||
fileFormType.value = 'edit'
|
fileFormType.value = 'edit'
|
||||||
|
|
@ -138,7 +137,7 @@ async function submitFileForm(
|
||||||
keyword: string[]
|
keyword: string[]
|
||||||
category: string[]
|
category: string[]
|
||||||
},
|
},
|
||||||
force = false
|
force = false,
|
||||||
) {
|
) {
|
||||||
currentParam.value = value
|
currentParam.value = value
|
||||||
|
|
||||||
|
|
@ -170,7 +169,7 @@ async function submitFileForm(
|
||||||
keyword: value.keyword,
|
keyword: value.keyword,
|
||||||
category: value.category,
|
category: value.category,
|
||||||
},
|
},
|
||||||
value.file
|
value.file,
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
fileFormData.value = {}
|
fileFormData.value = {}
|
||||||
|
|
@ -325,7 +324,7 @@ async function submitFileForm(
|
||||||
keyword: value.keyword,
|
keyword: value.keyword,
|
||||||
category: value.category,
|
category: value.category,
|
||||||
},
|
},
|
||||||
value.pathname
|
value.pathname,
|
||||||
)
|
)
|
||||||
"
|
"
|
||||||
@delete="() => triggerFileDelete(value.pathname)"
|
@delete="() => triggerFileDelete(value.pathname)"
|
||||||
|
|
|
||||||
|
|
@ -8,15 +8,19 @@ defineEmits(['edit', 'delete'])
|
||||||
<q-list dense>
|
<q-list dense>
|
||||||
<q-item clickable @click="() => $emit('edit')" id="FileltemActionEdit">
|
<q-item clickable @click="() => $emit('edit')" id="FileltemActionEdit">
|
||||||
<q-item-section>
|
<q-item-section>
|
||||||
<div class="row items-center white ">
|
<div class="row items-center white">
|
||||||
<q-icon name="edit" color="positive" />
|
<q-icon name="edit" color="positive" />
|
||||||
<span class="q-ml-sm">แก้ไข</span>
|
<span class="q-ml-sm">แก้ไข</span>
|
||||||
</div>
|
</div>
|
||||||
</q-item-section>
|
</q-item-section>
|
||||||
</q-item>
|
</q-item>
|
||||||
<q-item clickable @click="() => $emit('delete')" id="FileltemActiondelete">
|
<q-item
|
||||||
|
clickable
|
||||||
|
@click="() => $emit('delete')"
|
||||||
|
id="FileltemActiondelete"
|
||||||
|
>
|
||||||
<q-item-section>
|
<q-item-section>
|
||||||
<div class="row items-center white ">
|
<div class="row items-center white">
|
||||||
<q-icon name="delete" color="negative" />
|
<q-icon name="delete" color="negative" />
|
||||||
<span class="q-ml-sm">ลบ</span>
|
<span class="q-ml-sm">ลบ</span>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -27,15 +31,11 @@ defineEmits(['edit', 'delete'])
|
||||||
</q-btn>
|
</q-btn>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
|
||||||
<style scoped>
|
<style scoped>
|
||||||
.white {
|
.white {
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
text-overflow: ellipsis;
|
text-overflow: ellipsis;
|
||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
display: block;
|
display: block;
|
||||||
|
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -10,9 +10,8 @@ import FileForm from './FileForm.vue'
|
||||||
import FolderForm from './FolderForm.vue'
|
import FolderForm from './FolderForm.vue'
|
||||||
|
|
||||||
const { getFormatDate, getSize, getType, getFileInfo } = useFileInfoStore()
|
const { getFormatDate, getSize, getType, getFileInfo } = useFileInfoStore()
|
||||||
const { listDataFile, listDataFolder, currentDept, currentPath } = storeToRefs(
|
const { listDataFile, listDataFolder, currentDept, currentPath } =
|
||||||
useTreeDataStore()
|
storeToRefs(useTreeDataStore())
|
||||||
)
|
|
||||||
const {
|
const {
|
||||||
createFolder,
|
createFolder,
|
||||||
editFolder,
|
editFolder,
|
||||||
|
|
@ -34,18 +33,18 @@ const currentLevel = computed(() =>
|
||||||
currentDept.value === 0
|
currentDept.value === 0
|
||||||
? 'ตู้จัดเก็บเอกสาร'
|
? 'ตู้จัดเก็บเอกสาร'
|
||||||
: currentDept.value === 1
|
: currentDept.value === 1
|
||||||
? 'ลิ้นชัก'
|
? 'ลิ้นชัก'
|
||||||
: currentDept.value === 2
|
: currentDept.value === 2
|
||||||
? 'แฟ้ม'
|
? 'แฟ้ม'
|
||||||
: 'แฟ้มย่อย'
|
: 'แฟ้มย่อย',
|
||||||
)
|
)
|
||||||
|
|
||||||
const currentIcon = computed(() =>
|
const currentIcon = computed(() =>
|
||||||
currentDept.value === 0
|
currentDept.value === 0
|
||||||
? 'mdi-file-cabinet'
|
? 'mdi-file-cabinet'
|
||||||
: currentDept.value === 1
|
: currentDept.value === 1
|
||||||
? 'inbox'
|
? 'inbox'
|
||||||
: 'o_folder_open'
|
: 'o_folder_open',
|
||||||
)
|
)
|
||||||
|
|
||||||
const folderFormState = ref<boolean>(false)
|
const folderFormState = ref<boolean>(false)
|
||||||
|
|
@ -121,7 +120,7 @@ function triggerFileEdit(
|
||||||
keyword: string[]
|
keyword: string[]
|
||||||
category: string[]
|
category: string[]
|
||||||
},
|
},
|
||||||
pathname: string
|
pathname: string,
|
||||||
) {
|
) {
|
||||||
fileFormState.value = true
|
fileFormState.value = true
|
||||||
fileFormType.value = 'edit'
|
fileFormType.value = 'edit'
|
||||||
|
|
@ -145,7 +144,7 @@ async function submitFileForm(
|
||||||
keyword: string[]
|
keyword: string[]
|
||||||
category: string[]
|
category: string[]
|
||||||
},
|
},
|
||||||
force = false
|
force = false,
|
||||||
) {
|
) {
|
||||||
currentParam.value = value
|
currentParam.value = value
|
||||||
|
|
||||||
|
|
@ -170,7 +169,7 @@ async function submitFileForm(
|
||||||
keyword: value.keyword,
|
keyword: value.keyword,
|
||||||
category: value.category,
|
category: value.category,
|
||||||
},
|
},
|
||||||
value.file
|
value.file,
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
fileFormData.value = {}
|
fileFormData.value = {}
|
||||||
|
|
@ -263,14 +262,12 @@ const onRowClick = (evt: Event, row: TreeDataFolder, index: number) => {
|
||||||
<div
|
<div
|
||||||
class="flex flex-break d justify-between space-between"
|
class="flex flex-break d justify-between space-between"
|
||||||
v-if="currentDept >= 1 && props.mode == 'admin' && currentDept != 4"
|
v-if="currentDept >= 1 && props.mode == 'admin' && currentDept != 4"
|
||||||
|
|
||||||
>
|
>
|
||||||
<div>
|
<div>
|
||||||
<span class="text-h6">{{ currentLevel }}</span>
|
<span class="text-h6">{{ currentLevel }}</span>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<q-btn
|
<q-btn
|
||||||
|
|
||||||
outline
|
outline
|
||||||
push
|
push
|
||||||
class="q-px-md q-ml-md q-py-sm"
|
class="q-px-md q-ml-md q-py-sm"
|
||||||
|
|
@ -295,7 +292,7 @@ const onRowClick = (evt: Event, row: TreeDataFolder, index: number) => {
|
||||||
:rows-per-page-options="[0]"
|
:rows-per-page-options="[0]"
|
||||||
@row-click="onRowClick"
|
@row-click="onRowClick"
|
||||||
class="cursor"
|
class="cursor"
|
||||||
v-if=" currentDept != 4 "
|
v-if="currentDept != 4"
|
||||||
>
|
>
|
||||||
<template v-slot:body-cell-name="nameRow">
|
<template v-slot:body-cell-name="nameRow">
|
||||||
<q-td style="width: 50%">
|
<q-td style="width: 50%">
|
||||||
|
|
@ -331,7 +328,7 @@ const onRowClick = (evt: Event, row: TreeDataFolder, index: number) => {
|
||||||
@click.stop="
|
@click.stop="
|
||||||
triggerFolderEdit(
|
triggerFolderEdit(
|
||||||
actionsRow.row.name,
|
actionsRow.row.name,
|
||||||
actionsRow.row.pathname
|
actionsRow.row.pathname,
|
||||||
)
|
)
|
||||||
"
|
"
|
||||||
id="listViewFolderEdit"
|
id="listViewFolderEdit"
|
||||||
|
|
|
||||||
|
|
@ -106,7 +106,6 @@ async function searchSubmit() {
|
||||||
v-model="searchData.value"
|
v-model="searchData.value"
|
||||||
id="inputSearch"
|
id="inputSearch"
|
||||||
@keydown.enter.prevent="searchSubmit"
|
@keydown.enter.prevent="searchSubmit"
|
||||||
|
|
||||||
>
|
>
|
||||||
<template v-slot:append><q-icon name="search" /></template>
|
<template v-slot:append><q-icon name="search" /></template>
|
||||||
</q-input>
|
</q-input>
|
||||||
|
|
|
||||||
|
|
@ -4,6 +4,6 @@ export default [
|
||||||
{
|
{
|
||||||
path: '/',
|
path: '/',
|
||||||
name: 'UserHomePage',
|
name: 'UserHomePage',
|
||||||
component: () => import('@/modules/01_user/views/homePage.vue')
|
component: () => import('@/modules/01_user/views/homePage.vue'),
|
||||||
}
|
},
|
||||||
]
|
]
|
||||||
|
|
|
||||||
|
|
@ -4,6 +4,6 @@ export default [
|
||||||
{
|
{
|
||||||
path: '/admin',
|
path: '/admin',
|
||||||
name: 'AdminHomePage',
|
name: 'AdminHomePage',
|
||||||
component: () => import('@/modules/02_admin/views/homePage.vue')
|
component: () => import('@/modules/02_admin/views/homePage.vue'),
|
||||||
}
|
},
|
||||||
]
|
]
|
||||||
|
|
|
||||||
|
|
@ -93,7 +93,7 @@ export const useTreeDataStore = defineStore('changeCabinet', () => {
|
||||||
currentPath.value = pathname
|
currentPath.value = pathname
|
||||||
|
|
||||||
const res = await axiosClient.get<EhrFolder[]>(
|
const res = await axiosClient.get<EhrFolder[]>(
|
||||||
`${apiEndpoint}${requestPath}`
|
`${apiEndpoint}${requestPath}`,
|
||||||
)
|
)
|
||||||
|
|
||||||
const list = res.data.map((v) => ({
|
const list = res.data.map((v) => ({
|
||||||
|
|
@ -245,7 +245,7 @@ export const useTreeDataStore = defineStore('changeCabinet', () => {
|
||||||
description: string
|
description: string
|
||||||
keyword: string[]
|
keyword: string[]
|
||||||
category: string[]
|
category: string[]
|
||||||
}
|
},
|
||||||
) {
|
) {
|
||||||
loader.show()
|
loader.show()
|
||||||
|
|
||||||
|
|
@ -265,7 +265,7 @@ export const useTreeDataStore = defineStore('changeCabinet', () => {
|
||||||
{
|
{
|
||||||
file: file.name,
|
file: file.name,
|
||||||
...metadata,
|
...metadata,
|
||||||
}
|
},
|
||||||
)
|
)
|
||||||
|
|
||||||
if (res && res.data.upload) {
|
if (res && res.data.upload) {
|
||||||
|
|
@ -294,7 +294,7 @@ export const useTreeDataStore = defineStore('changeCabinet', () => {
|
||||||
keyword: string[]
|
keyword: string[]
|
||||||
category: string[]
|
category: string[]
|
||||||
},
|
},
|
||||||
file?: File
|
file?: File,
|
||||||
) {
|
) {
|
||||||
loader.show()
|
loader.show()
|
||||||
|
|
||||||
|
|
@ -309,7 +309,7 @@ export const useTreeDataStore = defineStore('changeCabinet', () => {
|
||||||
|
|
||||||
const res = await axiosClient.patch<{ upload: string }>(
|
const res = await axiosClient.patch<{ upload: string }>(
|
||||||
`${apiEndpoint}${requestPath}`,
|
`${apiEndpoint}${requestPath}`,
|
||||||
{ file: file?.name, ...metadata }
|
{ file: file?.name, ...metadata },
|
||||||
)
|
)
|
||||||
|
|
||||||
if (res && res.data.upload) {
|
if (res && res.data.upload) {
|
||||||
|
|
|
||||||
|
|
@ -1,9 +1,9 @@
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { defineComponent } from "vue";
|
import { defineComponent } from 'vue'
|
||||||
|
|
||||||
export default defineComponent({
|
export default defineComponent({
|
||||||
name: "Error404NotFound",
|
name: 'Error404NotFound',
|
||||||
});
|
})
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
|
|
|
||||||
|
|
@ -1,5 +1,5 @@
|
||||||
{
|
{
|
||||||
"plugin": ["typedoc-plugin-vue"],
|
"plugin": ["typedoc-plugin-vue"],
|
||||||
"entryPoints": ["src/main.ts","src/**/*.ts"],
|
"entryPoints": ["src/main.ts", "src/**/*.ts"],
|
||||||
"out": "fe-typedoc"
|
"out": "fe-typedoc"
|
||||||
}
|
}
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue