diff --git a/README.md b/README.md new file mode 100644 index 0000000..9ff1f52 --- /dev/null +++ b/README.md @@ -0,0 +1,24 @@ +# maptest + +## Project setup +``` +npm install +``` + +### Compiles and hot-reloads for development +``` +npm run dev +``` + +### Compiles and minifies for production +``` +npm run build +``` + +### Lints and fixes files +``` +npm run lint +``` + +### Customize configuration +See [Configuration Reference](https://cli.vuejs.org/config/). diff --git a/babel.config.js b/babel.config.js new file mode 100644 index 0000000..e955840 --- /dev/null +++ b/babel.config.js @@ -0,0 +1,5 @@ +module.exports = { + presets: [ + '@vue/cli-plugin-babel/preset' + ] +} diff --git a/package.json b/package.json new file mode 100644 index 0000000..ec9bc10 --- /dev/null +++ b/package.json @@ -0,0 +1,40 @@ +{ + "name": "maptest", + "version": "0.1.0", + "private": true, + "scripts": { + "dev": "vue-cli-service serve", + "build": "vue-cli-service build", + "lint": "vue-cli-service lint" + }, + "dependencies": { + "@googlemaps/js-api-loader": "^1.16.2", + "@quasar/cli": "^2.3.0", + "@quasar/extras": "^1.0.0", + "@vuepic/vue-datepicker": "^7.2.1", + "core-js": "^3.8.3", + "moment": "^2.29.4", + "pinia": "^2.1.7", + "quasar": "^2.0.0", + "register-service-worker": "^1.7.2", + "vue": "^3.2.13", + "vue-router": "^4.0.3", + "vue3-google-map": "^0.18.0" + }, + "devDependencies": { + "@typescript-eslint/eslint-plugin": "^5.4.0", + "@typescript-eslint/parser": "^5.4.0", + "@vue/cli-plugin-babel": "~5.0.0", + "@vue/cli-plugin-eslint": "~5.0.0", + "@vue/cli-plugin-pwa": "~5.0.0", + "@vue/cli-plugin-router": "~5.0.0", + "@vue/cli-plugin-typescript": "~5.0.0", + "@vue/cli-service": "~5.0.0", + "@vue/eslint-config-typescript": "^9.1.0", + "eslint": "^8.53.0", + "sass": "1.32.12", + "sass-loader": "^12.0.0", + "typescript": "~4.5.5", + "vue-cli-plugin-quasar": "~5.0.2" + } +} diff --git a/public/favicon.ico b/public/favicon.ico new file mode 100644 index 0000000..ae7bbdb Binary files /dev/null and b/public/favicon.ico differ diff --git a/public/img/icons/android-chrome-192x192.png b/public/img/icons/android-chrome-192x192.png new file mode 100644 index 0000000..b02aa64 Binary files /dev/null and b/public/img/icons/android-chrome-192x192.png differ diff --git a/public/img/icons/android-chrome-512x512.png b/public/img/icons/android-chrome-512x512.png new file mode 100644 index 0000000..06088b0 Binary files /dev/null and b/public/img/icons/android-chrome-512x512.png differ diff --git a/public/img/icons/android-chrome-maskable-192x192.png b/public/img/icons/android-chrome-maskable-192x192.png new file mode 100644 index 0000000..791e9c8 Binary files /dev/null and b/public/img/icons/android-chrome-maskable-192x192.png differ diff --git a/public/img/icons/android-chrome-maskable-512x512.png b/public/img/icons/android-chrome-maskable-512x512.png new file mode 100644 index 0000000..5f2098e Binary files /dev/null and b/public/img/icons/android-chrome-maskable-512x512.png differ diff --git a/public/img/icons/apple-touch-icon-120x120.png b/public/img/icons/apple-touch-icon-120x120.png new file mode 100644 index 0000000..1427cf6 Binary files /dev/null and b/public/img/icons/apple-touch-icon-120x120.png differ diff --git a/public/img/icons/apple-touch-icon-152x152.png b/public/img/icons/apple-touch-icon-152x152.png new file mode 100644 index 0000000..f24d454 Binary files /dev/null and b/public/img/icons/apple-touch-icon-152x152.png differ diff --git a/public/img/icons/apple-touch-icon-180x180.png b/public/img/icons/apple-touch-icon-180x180.png new file mode 100644 index 0000000..404e192 Binary files /dev/null and b/public/img/icons/apple-touch-icon-180x180.png differ diff --git a/public/img/icons/apple-touch-icon-60x60.png b/public/img/icons/apple-touch-icon-60x60.png new file mode 100644 index 0000000..cf10a56 Binary files /dev/null and b/public/img/icons/apple-touch-icon-60x60.png differ diff --git a/public/img/icons/apple-touch-icon-76x76.png b/public/img/icons/apple-touch-icon-76x76.png new file mode 100644 index 0000000..c500769 Binary files /dev/null and b/public/img/icons/apple-touch-icon-76x76.png differ diff --git a/public/img/icons/apple-touch-icon.png b/public/img/icons/apple-touch-icon.png new file mode 100644 index 0000000..03c0c5d Binary files /dev/null and b/public/img/icons/apple-touch-icon.png differ diff --git a/public/img/icons/favicon-16x16.png b/public/img/icons/favicon-16x16.png new file mode 100644 index 0000000..42af009 Binary files /dev/null and b/public/img/icons/favicon-16x16.png differ diff --git a/public/img/icons/favicon-32x32.png b/public/img/icons/favicon-32x32.png new file mode 100644 index 0000000..46ca04d Binary files /dev/null and b/public/img/icons/favicon-32x32.png differ diff --git a/public/img/icons/msapplication-icon-144x144.png b/public/img/icons/msapplication-icon-144x144.png new file mode 100644 index 0000000..7808237 Binary files /dev/null and b/public/img/icons/msapplication-icon-144x144.png differ diff --git a/public/img/icons/mstile-150x150.png b/public/img/icons/mstile-150x150.png new file mode 100644 index 0000000..3b37a43 Binary files /dev/null and b/public/img/icons/mstile-150x150.png differ diff --git a/public/img/icons/safari-pinned-tab.svg b/public/img/icons/safari-pinned-tab.svg new file mode 100644 index 0000000..e44c0d5 --- /dev/null +++ b/public/img/icons/safari-pinned-tab.svg @@ -0,0 +1,3 @@ + + + diff --git a/public/index.html b/public/index.html new file mode 100644 index 0000000..c570a09 --- /dev/null +++ b/public/index.html @@ -0,0 +1,23 @@ + + + + + + + + <%= htmlWebpackPlugin.options.title %> + + + +
+ +
+ + + diff --git a/public/robots.txt b/public/robots.txt new file mode 100644 index 0000000..eb05362 --- /dev/null +++ b/public/robots.txt @@ -0,0 +1,2 @@ +User-agent: * +Disallow: diff --git a/src/App.vue b/src/App.vue new file mode 100644 index 0000000..1643ebf --- /dev/null +++ b/src/App.vue @@ -0,0 +1,30 @@ + + + diff --git a/src/assets/logo.png b/src/assets/logo.png new file mode 100644 index 0000000..f3d2503 Binary files /dev/null and b/src/assets/logo.png differ diff --git a/src/assets/logo.svg b/src/assets/logo.svg new file mode 100644 index 0000000..87a1eee --- /dev/null +++ b/src/assets/logo.svg @@ -0,0 +1,15 @@ + + + + + + + + + diff --git a/src/assets/map1.png b/src/assets/map1.png new file mode 100644 index 0000000..34d643d Binary files /dev/null and b/src/assets/map1.png differ diff --git a/src/components/FormTime.vue b/src/components/FormTime.vue new file mode 100644 index 0000000..defb283 --- /dev/null +++ b/src/components/FormTime.vue @@ -0,0 +1,146 @@ + + + + diff --git a/src/components/HeaderPopup.vue b/src/components/HeaderPopup.vue new file mode 100644 index 0000000..0db45d4 --- /dev/null +++ b/src/components/HeaderPopup.vue @@ -0,0 +1,35 @@ + + + + diff --git a/src/components/MapCheckin.vue b/src/components/MapCheckin.vue new file mode 100644 index 0000000..4b08f97 --- /dev/null +++ b/src/components/MapCheckin.vue @@ -0,0 +1,94 @@ + + + + + diff --git a/src/components/PopUp.vue b/src/components/PopUp.vue new file mode 100644 index 0000000..ff12dd6 --- /dev/null +++ b/src/components/PopUp.vue @@ -0,0 +1,52 @@ + + + + diff --git a/src/components/TableHistory.vue b/src/components/TableHistory.vue new file mode 100644 index 0000000..41d8798 --- /dev/null +++ b/src/components/TableHistory.vue @@ -0,0 +1,267 @@ + + + + diff --git a/src/components/ToolBar.vue b/src/components/ToolBar.vue new file mode 100644 index 0000000..2eb6946 --- /dev/null +++ b/src/components/ToolBar.vue @@ -0,0 +1,49 @@ + + + + diff --git a/src/interface/index/Main.ts b/src/interface/index/Main.ts new file mode 100644 index 0000000..08effb0 --- /dev/null +++ b/src/interface/index/Main.ts @@ -0,0 +1,5 @@ +interface DataOption { + id: string; + name: string; +} +export type { DataOption }; diff --git a/src/interface/response/checkin.ts b/src/interface/response/checkin.ts new file mode 100644 index 0000000..5745b88 --- /dev/null +++ b/src/interface/response/checkin.ts @@ -0,0 +1,7 @@ +interface FormRef { + model: object | null; + useLocation: object | null; + [key: string]: any; +} + +export type { FormRef }; diff --git a/src/main.ts b/src/main.ts new file mode 100644 index 0000000..c37899f --- /dev/null +++ b/src/main.ts @@ -0,0 +1,20 @@ +import { createApp } from "vue"; +import App from "./App.vue"; +import "./registerServiceWorker"; +import router from "./router"; +import { createPinia } from "pinia"; + +import { Quasar } from "quasar"; +import quasarUserOptions from "./quasar-user-options"; +import VueDatePicker from "@vuepic/vue-datepicker"; +import "@vuepic/vue-datepicker/dist/main.css"; + +const app = createApp(App); +const pinia = createPinia(); + +app.use(router); +app.use(Quasar, quasarUserOptions); +app.use(pinia); +app.component("VueDatePicker", VueDatePicker); + +app.mount("#app"); diff --git a/src/quasar-user-options.ts b/src/quasar-user-options.ts new file mode 100644 index 0000000..f19fe69 --- /dev/null +++ b/src/quasar-user-options.ts @@ -0,0 +1,9 @@ +import './styles/quasar.sass' +// import "quasar/dist/quasar.css"; +import "@quasar/extras/material-icons/material-icons.css"; + +// To be used on app.use(Quasar, { ... }) +export default { + config: {}, + plugins: {}, +}; diff --git a/src/registerServiceWorker.ts b/src/registerServiceWorker.ts new file mode 100644 index 0000000..76cede0 --- /dev/null +++ b/src/registerServiceWorker.ts @@ -0,0 +1,32 @@ +/* eslint-disable no-console */ + +import { register } from 'register-service-worker' + +if (process.env.NODE_ENV === 'production') { + register(`${process.env.BASE_URL}service-worker.js`, { + ready () { + console.log( + 'App is being served from cache by a service worker.\n' + + 'For more details, visit https://goo.gl/AFskqB' + ) + }, + registered () { + console.log('Service worker has been registered.') + }, + cached () { + console.log('Content has been cached for offline use.') + }, + updatefound () { + console.log('New content is downloading.') + }, + updated () { + console.log('New content is available; please refresh.') + }, + offline () { + console.log('No internet connection found. App is running in offline mode.') + }, + error (error) { + console.error('Error during service worker registration:', error) + } + }) +} diff --git a/src/router/index.ts b/src/router/index.ts new file mode 100644 index 0000000..8a59ac2 --- /dev/null +++ b/src/router/index.ts @@ -0,0 +1,32 @@ +import { createRouter, createWebHistory, RouteRecordRaw } from "vue-router"; +import HomeView from "../views/HomeView.vue"; +import HistoryView from "@/views/HistoryView.vue"; + +const routes: Array = [ + { + path: "/", + name: "home", + component: HomeView, + }, + { + path: "/about", + name: "about", + // route level code-splitting + // this generates a separate chunk (about.[hash].js) for this route + // which is lazy-loaded when the route is visited. + component: () => + import(/* webpackChunkName: "about" */ "../views/AboutView.vue"), + }, + { + path: "/history", + name: "history", + component: HistoryView, + }, +]; + +const router = createRouter({ + history: createWebHistory(process.env.BASE_URL), + routes, +}); + +export default router; diff --git a/src/shims-vue.d.ts b/src/shims-vue.d.ts new file mode 100644 index 0000000..3804a43 --- /dev/null +++ b/src/shims-vue.d.ts @@ -0,0 +1,6 @@ +/* eslint-disable */ +declare module '*.vue' { + import type { DefineComponent } from 'vue' + const component: DefineComponent<{}, {}, any> + export default component +} diff --git a/src/stores/chekin.ts b/src/stores/chekin.ts new file mode 100644 index 0000000..92d24c5 --- /dev/null +++ b/src/stores/chekin.ts @@ -0,0 +1,40 @@ +import { defineStore } from "pinia"; +import { ref } from "vue"; + +export const useChekIn = defineStore("checkin", () => { + const rows = ref(); + + function fetchHistoryList(data: any) { + console.log(data); + const datalist = data.map((e: any) => ({ + no: e.no, + date: e.date, + in: e.in, + loIn: e.loIn, + out: e.out, + loOut: e.loOut, + status: e.status, + Morningstatus: convertStatus(e.Morningstatus), + AfternoonStatus: convertStatus(e.AfternoonStatus), + })); + rows.value = datalist; + } + + function convertStatus(status: string) { + switch (status) { + case "1": + return "ขาดราชการ"; + case "2": + return "ปกติ"; + case "3": + return "สาย"; + default: + return ""; + } + } + + return { + rows, + fetchHistoryList, + }; +}); diff --git a/src/stores/mixin.ts b/src/stores/mixin.ts new file mode 100644 index 0000000..e029b24 --- /dev/null +++ b/src/stores/mixin.ts @@ -0,0 +1,75 @@ +import { defineStore } from "pinia"; + +export const useCounterMixin = defineStore("mixin", () => { + function date2Thai(srcDate: Date, isFullMonth = false, isTime = false) { + if (srcDate == null) { + return null; + ` + `; + } + const date = new Date(srcDate); + const isValidDate = Boolean(+date); + if (!isValidDate) return srcDate.toString(); + if (isValidDate && date.getFullYear() < 1000) return srcDate.toString(); + const fullMonthThai = [ + "มกราคม", + "กุมภาพันธ์", + "มีนาคม", + "เมษายน", + "พฤษภาคม", + "มิถุนายน", + "กรกฎาคม", + "สิงหาคม", + "กันยายน", + "ตุลาคม", + "พฤศจิกายน", + "ธันวาคม", + ]; + const abbrMonthThai = [ + "ม.ค.", + "ก.พ.", + "มี.ค.", + "เม.ย.", + "พ.ค.", + "มิ.ย.", + "ก.ค.", + "ส.ค.", + "ก.ย.", + "ต.ค.", + "พ.ย.", + "ธ.ค.", + ]; + let dstYear = 0; + if (date.getFullYear() > 2500) { + dstYear = date.getFullYear(); + } else { + dstYear = date.getFullYear() + 543; + } + let dstMonth = ""; + if (isFullMonth) { + dstMonth = fullMonthThai[date.getMonth()]; + } else { + dstMonth = abbrMonthThai[date.getMonth()]; + } + let dstTime = ""; + if (isTime) { + const H = date.getHours().toString().padStart(2, "0"); + const M = date.getMinutes().toString().padStart(2, "0"); + // const S = date.getSeconds().toString().padStart(2, "0") + // dstTime = " " + H + ":" + M + ":" + S + " น." + dstTime = " " + H + ":" + M + " น."; + } + return ( + date.getDate().toString().padStart(2, "0") + + " " + + dstMonth + + " " + + dstYear + + dstTime + ); + } + + return { + date2Thai, + }; +}); diff --git a/src/styles/quasar.sass b/src/styles/quasar.sass new file mode 100644 index 0000000..1ba19fe --- /dev/null +++ b/src/styles/quasar.sass @@ -0,0 +1,3 @@ +@import './quasar.variables.sass' +@import '~quasar-styl' +// @import '~quasar-addon-styl' diff --git a/src/styles/quasar.variables.sass b/src/styles/quasar.variables.sass new file mode 100644 index 0000000..f2c3dc4 --- /dev/null +++ b/src/styles/quasar.variables.sass @@ -0,0 +1,139 @@ +// FILE (create it): src/quasar-variables.sass + +$primary: #02A998 +$secondary: #016987 +$accent: #9C27B0 + +// $dark: #1D1D1D +$dark: #35473C + +$positive: #21BA45 +$negative: #C10015 +$info: #31CCEC +$warning: #F2C037 + +$add: #00aa86 +.text-add + color: $add !important +.bg-add + background: $add !important + +$edit: #019fc4 +.text-edit + color: $edit !important +.bg-edit + background: $edit !important + +$public: #016987 +.text-public + color: $public !important +.bg-public + background: $public !important + +$save: #4154b3 +.text-save + color: $save !important +.bg-save + background: $save !important + +$nativetab: #c8d3db +.text-nativetab + color: $nativetab !important +.bg-nativetab + background: $nativetab !important + +$activetab: #4a5568 +.text-activetab + color: $activetab !important +.bg-activetab + background: $activetab !important + +.inputgreen .q-field__prefix, +.inputgreen .q-field__suffix, +.inputgreen .q-field__input, +.inputgreen .q-field__native + + color: rgb(6, 136, 77) + +@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+Thai:wght@100;200;300;400;500;600;700;800;900&display=swap') + +$noto-thai: 'Noto Sans Thai', sans-serif + +#azay-app, +div + font-family: $noto-thai !important + text-rendering: optimizeLegibility + -webkit-font-smoothing: antialiased + -moz-osx-font-smoothing: grayscale + +$separator-color: #EDEDED !default + +.bg-teal-1 + background: #e0f2f1a6 !important + +.table_ellipsis + max-width: 200px + white-space: nowrap + overflow: hidden + text-overflow: ellipsis + +.table_ellipsis:hover + word-wrap: break-word + overflow: visible + white-space: normal + +.table_ellipsis2 + max-width: 25vw + white-space: nowrap + overflow: hidden + text-overflow: ellipsis + +.table_ellipsis2:hover + word-wrap: break-word + overflow: visible + white-space: normal + transition: width 2s + +$muti-tab: #87d4cc +.text-muti-tab + color: $muti-tab !important +.bg-muti-tab + background: $muti-tab !important + + +/* editor */ + +.q-editor + font-size: 1rem + line-height: 1.5rem + font-weight: 400 + +.q-editor h1, .q-menu h1 + font-size: 1.5rem + line-height: 2rem + font-weight: 400 + margin-block-start: 0em + margin-block-end: 0em + +.q-editor h2, .q-menu h2 + font-size: 1.25rem + line-height: 1.5rem + font-weight: 400 + margin-block-start: 0em + margin-block-end: 0em + + +.q-editor h3, .q-menu h3 + font-size: 1.1rem + line-height: 1.5rem + font-weight: 400 + margin-block-start: 0em + margin-block-end: 0em + +.q-editor p, .q-menu p + margin: 0 + +/* q-tree */ + +.q-tree + color: #c8d3db diff --git a/src/views/AboutView.vue b/src/views/AboutView.vue new file mode 100644 index 0000000..e603b0e --- /dev/null +++ b/src/views/AboutView.vue @@ -0,0 +1,15 @@ + diff --git a/src/views/HistoryView.vue b/src/views/HistoryView.vue new file mode 100644 index 0000000..ce7db4c --- /dev/null +++ b/src/views/HistoryView.vue @@ -0,0 +1,177 @@ + + diff --git a/src/views/HomeView.vue b/src/views/HomeView.vue new file mode 100644 index 0000000..b10305b --- /dev/null +++ b/src/views/HomeView.vue @@ -0,0 +1,494 @@ + + + + diff --git a/tsconfig.json b/tsconfig.json new file mode 100644 index 0000000..afaf18a --- /dev/null +++ b/tsconfig.json @@ -0,0 +1,29 @@ +{ + "compilerOptions": { + "target": "es5", + "module": "esnext", + "strict": true, + "jsx": "preserve", + "moduleResolution": "node", + "skipLibCheck": true, + "esModuleInterop": true, + "allowSyntheticDefaultImports": true, + "forceConsistentCasingInFileNames": true, + "useDefineForClassFields": true, + "sourceMap": true, + "baseUrl": ".", + "types": ["webpack-env"], + "paths": { + "@/*": ["src/*"] + }, + "lib": ["esnext", "dom", "dom.iterable", "scripthost"] + }, + "include": [ + "src/**/*.ts", + "src/**/*.tsx", + "src/**/*.vue", + "tests/**/*.ts", + "tests/**/*.tsx" + ], + "exclude": ["node_modules"] +} diff --git a/vue.config.js b/vue.config.js new file mode 100644 index 0000000..679b4b9 --- /dev/null +++ b/vue.config.js @@ -0,0 +1,13 @@ +const { defineConfig } = require('@vue/cli-service') +module.exports = defineConfig({ + transpileDependencies: [ + 'quasar' + ], + + pluginOptions: { + quasar: { + importStrategy: 'kebab', + rtlSupport: false + } + } +})