diff --git a/Services/client/package-lock.json b/Services/client/package-lock.json
index ced1699..fba6281 100644
--- a/Services/client/package-lock.json
+++ b/Services/client/package-lock.json
@@ -1,12 +1,12 @@
{
- "name": "ehr_portfolio",
- "version": "0.0.0",
+ "name": "edm-frontend",
+ "version": "0.1.0",
"lockfileVersion": 3,
"requires": true,
"packages": {
"": {
- "name": "ehr_portfolio",
- "version": "0.0.0",
+ "name": "edm-frontend",
+ "version": "0.1.0",
"dependencies": {
"@fullcalendar/core": "^6.1.8",
"@fullcalendar/daygrid": "^6.1.8",
@@ -14,6 +14,8 @@
"@fullcalendar/list": "^6.1.8",
"@fullcalendar/timegrid": "^6.1.8",
"@fullcalendar/vue3": "^6.1.8",
+ "@johmun/vue-tags-input": "^2.1.0",
+ "@mayank1513/vue-tag-input": "^1.2.0",
"@quasar/extras": "^1.15.8",
"@vuepic/vue-datepicker": "^5.2.1",
"axios": "^1.6.2",
@@ -22,7 +24,8 @@
"quasar": "^2.11.1",
"vite-plugin-pwa": "^0.16.7",
"vue": "^3.2.45",
- "vue-router": "^4.1.6"
+ "vue-router": "^4.1.6",
+ "vue3-tags-input": "^1.0.12"
},
"devDependencies": {
"@quasar/vite-plugin": "^1.6.0",
@@ -31,6 +34,7 @@
"@types/node": "^18.11.12",
"@vitejs/plugin-vue": "^4.0.0",
"@vitejs/plugin-vue-jsx": "^3.0.0",
+ "@voerro/vue-tagsinput": "^2.7.1",
"@vue/eslint-config-prettier": "^7.0.0",
"@vue/eslint-config-typescript": "^11.0.0",
"@vue/test-utils": "^2.2.6",
@@ -44,6 +48,8 @@
"prettier": "^2.7.1",
"sass": "^1.32.12",
"start-server-and-test": "^1.15.2",
+ "typedoc": "^0.25.3",
+ "typedoc-plugin-vue": "^1.1.0",
"typescript": "~4.7.4",
"vite": "^4.0.0",
"vitest": "^0.25.6",
@@ -2237,6 +2243,36 @@
"integrity": "sha512-dvuCeX5fC9dXgJn9t+X5atfmgQAzUOWqS1254Gh0m6i8wKd10ebXkfNKiRK+1GWi/yTvvLDHpoxLr0xxxeslWw==",
"dev": true
},
+ "node_modules/@johmun/vue-tags-input": {
+ "version": "2.1.0",
+ "resolved": "https://registry.npmjs.org/@johmun/vue-tags-input/-/vue-tags-input-2.1.0.tgz",
+ "integrity": "sha512-Fdwfss/TqCqMJbGAkmlzKbcG/ia1MstYjhqPBj+zG7h/166tIcE1TIftUxhT9LZ+RWjRSG0EFA1UyaHQSr3k3Q==",
+ "dependencies": {
+ "vue": "^2.6.10"
+ },
+ "peerDependencies": {
+ "vue": "2.x"
+ }
+ },
+ "node_modules/@johmun/vue-tags-input/node_modules/@vue/compiler-sfc": {
+ "version": "2.7.15",
+ "resolved": "https://registry.npmjs.org/@vue/compiler-sfc/-/compiler-sfc-2.7.15.tgz",
+ "integrity": "sha512-FCvIEevPmgCgqFBH7wD+3B97y7u7oj/Wr69zADBf403Tui377bThTjBvekaZvlRr4IwUAu3M6hYZeULZFJbdYg==",
+ "dependencies": {
+ "@babel/parser": "^7.18.4",
+ "postcss": "^8.4.14",
+ "source-map": "^0.6.1"
+ }
+ },
+ "node_modules/@johmun/vue-tags-input/node_modules/vue": {
+ "version": "2.7.15",
+ "resolved": "https://registry.npmjs.org/vue/-/vue-2.7.15.tgz",
+ "integrity": "sha512-a29fsXd2G0KMRqIFTpRgpSbWaNBK3lpCTOLuGLEDnlHWdjB8fwl6zyYZ8xCrqkJdatwZb4mGHiEfJjnw0Q6AwQ==",
+ "dependencies": {
+ "@vue/compiler-sfc": "2.7.15",
+ "csstype": "^3.1.0"
+ }
+ },
"node_modules/@jridgewell/gen-mapping": {
"version": "0.3.3",
"resolved": "https://registry.npmjs.org/@jridgewell/gen-mapping/-/gen-mapping-0.3.3.tgz",
@@ -2289,6 +2325,18 @@
"@jridgewell/sourcemap-codec": "^1.4.14"
}
},
+ "node_modules/@mayank1513/vue-tag-input": {
+ "version": "1.2.0",
+ "resolved": "https://registry.npmjs.org/@mayank1513/vue-tag-input/-/vue-tag-input-1.2.0.tgz",
+ "integrity": "sha512-COWPFJ4MsPVy84Z+RIC2nzu188AwkJZJQ021Jz04uLfgxbmLrCXhrNfCIrjMD7bb6/Fb2kgybQILIiPqcNJc9w==",
+ "funding": {
+ "type": "github",
+ "url": "https://github.com/sponsors/mayank1513"
+ },
+ "peerDependencies": {
+ "vue": "^3"
+ }
+ },
"node_modules/@nodelib/fs.scandir": {
"version": "2.1.5",
"resolved": "https://registry.npmjs.org/@nodelib/fs.scandir/-/fs.scandir-2.1.5.tgz",
@@ -2826,6 +2874,12 @@
"vue": "^3.0.0"
}
},
+ "node_modules/@voerro/vue-tagsinput": {
+ "version": "2.7.1",
+ "resolved": "https://registry.npmjs.org/@voerro/vue-tagsinput/-/vue-tagsinput-2.7.1.tgz",
+ "integrity": "sha512-G7ClILHgtc/D1vEw9qp6dlsAstlhwLDkPvEp6w1iY/dmSzu4hhxaMk8jyahjxQRDgiLlrAikESOsfkVhy18YwQ==",
+ "dev": true
+ },
"node_modules/@volar/language-core": {
"version": "1.10.10",
"resolved": "https://registry.npmjs.org/@volar/language-core/-/language-core-1.10.10.tgz",
@@ -3246,6 +3300,12 @@
"node": ">=8"
}
},
+ "node_modules/ansi-sequence-parser": {
+ "version": "1.1.1",
+ "resolved": "https://registry.npmjs.org/ansi-sequence-parser/-/ansi-sequence-parser-1.1.1.tgz",
+ "integrity": "sha512-vJXt3yiaUL4UU546s3rPXlsry/RnM730G1+HkpKE012AN0sx1eOrxSu95oKDIonskeLTijMgqWZ3uDEe3NFvyg==",
+ "dev": true
+ },
"node_modules/ansi-styles": {
"version": "3.2.1",
"resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.2.1.tgz",
@@ -3873,6 +3933,14 @@
"url": "https://github.com/sponsors/sindresorhus"
}
},
+ "node_modules/click-outside-vue3": {
+ "version": "4.0.1",
+ "resolved": "https://registry.npmjs.org/click-outside-vue3/-/click-outside-vue3-4.0.1.tgz",
+ "integrity": "sha512-sbplNecrup5oGqA3o4bo8XmvHRT6q9fvw21Z67aDbTqB9M6LF7CuYLTlLvNtOgKU6W3zst5H5zJuEh4auqA34g==",
+ "engines": {
+ "node": ">=6"
+ }
+ },
"node_modules/color-convert": {
"version": "1.9.3",
"resolved": "https://registry.npmjs.org/color-convert/-/color-convert-1.9.3.tgz",
@@ -6667,6 +6735,12 @@
"node": ">=6"
}
},
+ "node_modules/jsonc-parser": {
+ "version": "3.2.0",
+ "resolved": "https://registry.npmjs.org/jsonc-parser/-/jsonc-parser-3.2.0.tgz",
+ "integrity": "sha512-gfFQZrcTc8CnKXp6Y4/CBT3fTc0OVuDofpre4aEeEpSBPV5X5v4+Vmx+8snU7RLPrNHPKSgLxGo9YuQzz20o+w==",
+ "dev": true
+ },
"node_modules/jsonfile": {
"version": "6.1.0",
"resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-6.1.0.tgz",
@@ -7039,6 +7113,12 @@
"yallist": "^3.0.2"
}
},
+ "node_modules/lunr": {
+ "version": "2.3.9",
+ "resolved": "https://registry.npmjs.org/lunr/-/lunr-2.3.9.tgz",
+ "integrity": "sha512-zTU3DaZaF3Rt9rhN3uBMGQD3dD2/vFQqnvZCDv4dl5iOzq2IZQqTxu90r4E5J+nP70J3ilqVCrbho2eWaeW8Ow==",
+ "dev": true
+ },
"node_modules/magic-string": {
"version": "0.30.5",
"resolved": "https://registry.npmjs.org/magic-string/-/magic-string-0.30.5.tgz",
@@ -7056,6 +7136,18 @@
"integrity": "sha512-CkYQrPYZfWnu/DAmVCpTSX/xHpKZ80eKh2lAkyA6AJTef6bW+6JpbQZN5rofum7da+SyN1bi5ctTm+lTfcCW3g==",
"dev": true
},
+ "node_modules/marked": {
+ "version": "4.3.0",
+ "resolved": "https://registry.npmjs.org/marked/-/marked-4.3.0.tgz",
+ "integrity": "sha512-PRsaiG84bK+AMvxziE/lCFss8juXjNaWzVbN5tXAm4XjeaS9NAHhop+PjQxz2A9h8Q4M/xGmzP8vqNwy6JeK0A==",
+ "dev": true,
+ "bin": {
+ "marked": "bin/marked.js"
+ },
+ "engines": {
+ "node": ">= 12"
+ }
+ },
"node_modules/memorystream": {
"version": "0.3.1",
"resolved": "https://registry.npmjs.org/memorystream/-/memorystream-0.3.1.tgz",
@@ -8337,6 +8429,18 @@
"url": "https://github.com/sponsors/ljharb"
}
},
+ "node_modules/shiki": {
+ "version": "0.14.5",
+ "resolved": "https://registry.npmjs.org/shiki/-/shiki-0.14.5.tgz",
+ "integrity": "sha512-1gCAYOcmCFONmErGTrS1fjzJLA7MGZmKzrBNX7apqSwhyITJg2O102uFzXUeBxNnEkDA9vHIKLyeKq0V083vIw==",
+ "dev": true,
+ "dependencies": {
+ "ansi-sequence-parser": "^1.1.0",
+ "jsonc-parser": "^3.2.0",
+ "vscode-oniguruma": "^1.7.0",
+ "vscode-textmate": "^8.0.0"
+ }
+ },
"node_modules/side-channel": {
"version": "1.0.4",
"resolved": "https://registry.npmjs.org/side-channel/-/side-channel-1.0.4.tgz",
@@ -9096,6 +9200,60 @@
"url": "https://github.com/sponsors/ljharb"
}
},
+ "node_modules/typedoc": {
+ "version": "0.25.4",
+ "resolved": "https://registry.npmjs.org/typedoc/-/typedoc-0.25.4.tgz",
+ "integrity": "sha512-Du9ImmpBCw54bX275yJrxPVnjdIyJO/84co0/L9mwe0R3G4FSR6rQ09AlXVRvZEGMUg09+z/usc8mgygQ1aidA==",
+ "dev": true,
+ "dependencies": {
+ "lunr": "^2.3.9",
+ "marked": "^4.3.0",
+ "minimatch": "^9.0.3",
+ "shiki": "^0.14.1"
+ },
+ "bin": {
+ "typedoc": "bin/typedoc"
+ },
+ "engines": {
+ "node": ">= 16"
+ },
+ "peerDependencies": {
+ "typescript": "4.6.x || 4.7.x || 4.8.x || 4.9.x || 5.0.x || 5.1.x || 5.2.x || 5.3.x"
+ }
+ },
+ "node_modules/typedoc-plugin-vue": {
+ "version": "1.1.0",
+ "resolved": "https://registry.npmjs.org/typedoc-plugin-vue/-/typedoc-plugin-vue-1.1.0.tgz",
+ "integrity": "sha512-zbc2jFH3K2e/rRerV8crWY16M2MfZAze5bV6s2Ti0c8De+MjBn7K0EuK3eGoJXkY1n22flYgBz65j0pYu+ffmA==",
+ "dev": true,
+ "peerDependencies": {
+ "typedoc": "0.25.x"
+ }
+ },
+ "node_modules/typedoc/node_modules/brace-expansion": {
+ "version": "2.0.1",
+ "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.1.tgz",
+ "integrity": "sha512-XnAIvQ8eM+kC6aULx6wuQiwVsnzsi9d3WxzV3FpWTGA19F621kwdbsAcFKXgKUHZWsy+mY6iL1sHTxWEFCytDA==",
+ "dev": true,
+ "dependencies": {
+ "balanced-match": "^1.0.0"
+ }
+ },
+ "node_modules/typedoc/node_modules/minimatch": {
+ "version": "9.0.3",
+ "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.3.tgz",
+ "integrity": "sha512-RHiac9mvaRw0x3AYRgDC1CxAP7HTcNrrECeA8YYJeWnpo+2Q5CegtZjaotWTWxDG3UeGA1coE05iH1mPjT/2mg==",
+ "dev": true,
+ "dependencies": {
+ "brace-expansion": "^2.0.1"
+ },
+ "engines": {
+ "node": ">=16 || 14 >=14.17"
+ },
+ "funding": {
+ "url": "https://github.com/sponsors/isaacs"
+ }
+ },
"node_modules/typescript": {
"version": "4.7.4",
"resolved": "https://registry.npmjs.org/typescript/-/typescript-4.7.4.tgz",
@@ -9430,6 +9588,18 @@
}
}
},
+ "node_modules/vscode-oniguruma": {
+ "version": "1.7.0",
+ "resolved": "https://registry.npmjs.org/vscode-oniguruma/-/vscode-oniguruma-1.7.0.tgz",
+ "integrity": "sha512-L9WMGRfrjOhgHSdOYgCt/yRMsXzLDJSL7BPrOZt73gU0iWO4mpqzqQzOz5srxqTvMBaR0XZTSrVWo4j55Rc6cA==",
+ "dev": true
+ },
+ "node_modules/vscode-textmate": {
+ "version": "8.0.0",
+ "resolved": "https://registry.npmjs.org/vscode-textmate/-/vscode-textmate-8.0.0.tgz",
+ "integrity": "sha512-AFbieoL7a5LMqcnOF04ji+rpXadgOXnZsxQr//r83kLPr7biP7am3g9zbaZIaBGwBRWeSvoMD4mgPdX3e4NWBg==",
+ "dev": true
+ },
"node_modules/vue": {
"version": "3.3.8",
"resolved": "https://registry.npmjs.org/vue/-/vue-3.3.8.tgz",
@@ -9612,6 +9782,20 @@
"integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==",
"dev": true
},
+ "node_modules/vue3-tags-input": {
+ "version": "1.0.12",
+ "resolved": "https://registry.npmjs.org/vue3-tags-input/-/vue3-tags-input-1.0.12.tgz",
+ "integrity": "sha512-s5rG+1W3M8+be0nd9H1nv/8WLjJOO6pShgVz8ALAqOiz3tDH5QhGrDH6fzD14ZjJNRWSa3bRBSXQwHEXffPQ6g==",
+ "dependencies": {
+ "click-outside-vue3": "^4.0.1"
+ },
+ "engines": {
+ "node": ">=12"
+ },
+ "peerDependencies": {
+ "vue": "^3.0.5"
+ }
+ },
"node_modules/w3c-xmlserializer": {
"version": "4.0.0",
"resolved": "https://registry.npmjs.org/w3c-xmlserializer/-/w3c-xmlserializer-4.0.0.tgz",
diff --git a/Services/client/package.json b/Services/client/package.json
index b8955f5..e560f9e 100644
--- a/Services/client/package.json
+++ b/Services/client/package.json
@@ -23,6 +23,7 @@
"@fullcalendar/list": "^6.1.8",
"@fullcalendar/timegrid": "^6.1.8",
"@fullcalendar/vue3": "^6.1.8",
+ "@mayank1513/vue-tag-input": "^1.2.0",
"@quasar/extras": "^1.15.8",
"@vuepic/vue-datepicker": "^5.2.1",
"axios": "^1.6.2",
diff --git a/Services/client/src/components/FormUpload.vue b/Services/client/src/components/FormUpload.vue
index daff78a..b4be980 100644
--- a/Services/client/src/components/FormUpload.vue
+++ b/Services/client/src/components/FormUpload.vue
@@ -2,7 +2,7 @@
import { ref } from 'vue'
import { storeToRefs } from 'pinia'
import { useTreeDataStore } from '@/stores/tree-data'
-
+import TagInput from '@/components/TagInput.vue'
const { currentPath } = storeToRefs(useTreeDataStore())
const { uploadFile, checkFile } = useTreeDataStore()
@@ -112,57 +112,10 @@ async function handleSubmit(continueUpload: boolean = false) {
placeholder="เลือกกลุ่ม/หมวดหมู่"
dense
/>
- คำสำคัญ
-
- deleteTag()"
- @keydown.space="saveTag"
- label="กด space เพื่อเพิ่ม"
- class="q-mt-md"
- >
-
-
-
-
- {{ tag }}
-
-
-
-
-
-
-
-
-
-
- {
- $emit('update:drawerFile')
- handleSubmit()
- }
- "
- />
+
+
+
diff --git a/Services/client/src/components/TagInput.vue b/Services/client/src/components/TagInput.vue
new file mode 100644
index 0000000..5532f02
--- /dev/null
+++ b/Services/client/src/components/TagInput.vue
@@ -0,0 +1,40 @@
+
+
+
+ {console.log(tags);
+ }">test
+
+
+
\ No newline at end of file