From e5683c7f2b0fd22e36f5bfbc300b3784d1cd2be1 Mon Sep 17 00:00:00 2001 From: Jarinya Date: Tue, 23 Apr 2024 18:57:44 +0700 Subject: [PATCH] update edit / login / responsive --- .vscode/settings.json | 3 + public/index.html | 2 +- public/logo.png | Bin 0 -> 6541 bytes src/App.vue | 51 +- src/assets/Group 195.png | Bin 0 -> 35535 bytes src/assets/Group 196.png | Bin 0 -> 3284 bytes src/assets/Group 197.png | Bin 0 -> 2418 bytes src/assets/Group 198.png | Bin 0 -> 1421 bytes src/assets/Group 199.png | Bin 0 -> 1240 bytes src/components/HeaderHome.vue | 15 +- src/components/Section2Green.vue | 17 +- src/components/Section3Base.vue | 2 +- src/components/Section7GreenTab.vue | 4 +- src/components/Section8Base.vue | 22 +- src/components/check/CheckList.vue | 7 +- src/components/check/QuestionList.vue | 87 +- src/components/edit/FormMainEdit.vue | 33 + src/components/edit/FormSteperEdit.vue | 1057 ++++++++++++++++++++++++ src/components/form/FormSteper.vue | 144 +++- src/components/search/SearchMain.vue | 78 +- src/config.js | 2 +- src/router/index.js | 16 + src/store/index.js | 26 +- src/views/CheckDetail.vue | 259 ++++++ src/views/LoginForm.vue | 134 +++ src/views/ProfileUser.vue | 13 + 26 files changed, 1884 insertions(+), 88 deletions(-) create mode 100644 .vscode/settings.json create mode 100644 public/logo.png create mode 100644 src/assets/Group 195.png create mode 100644 src/assets/Group 196.png create mode 100644 src/assets/Group 197.png create mode 100644 src/assets/Group 198.png create mode 100644 src/assets/Group 199.png create mode 100644 src/components/edit/FormMainEdit.vue create mode 100644 src/components/edit/FormSteperEdit.vue create mode 100644 src/views/CheckDetail.vue create mode 100644 src/views/LoginForm.vue create mode 100644 src/views/ProfileUser.vue diff --git a/.vscode/settings.json b/.vscode/settings.json new file mode 100644 index 0000000..367d206 --- /dev/null +++ b/.vscode/settings.json @@ -0,0 +1,3 @@ +{ + "nuxt.isNuxtApp": false +} \ No newline at end of file diff --git a/public/index.html b/public/index.html index 6910ef8..68ffc7d 100644 --- a/public/index.html +++ b/public/index.html @@ -5,7 +5,7 @@ - + <%= htmlWebpackPlugin.options.title %> diff --git a/public/logo.png b/public/logo.png new file mode 100644 index 0000000000000000000000000000000000000000..bda12e7b5db852b9f10b599ea12eb15d1acdddb5 GIT binary patch literal 6541 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 -
+
+ + - Sign In - Get Started + {{ getUsername }} + Logout + Log In + + Get Started
@@ -31,17 +37,40 @@ import { client } from "./utils/trpc"; client.info.getAllZones.query({}).then(console.log); // import MainVote from "./components/MainVote.vue"; - +import { mapGetters } from "vuex"; export default { name: "App", - + computed: { + ...mapGetters(["getUsername"]), + }, components: { // MainVote, }, data: () => ({ - // + username: "", }), + methods: { + logout() { + localStorage.clear(); + // location.reload(); + this.$store.commit("setUsername", ""); + this.$router.push("/"); + }, + }, + mounted() { + // this.$emitter.on("loginUser", (val) => { + // console.log("user", val); + // if (val) { + // this.username = localStorage.getItem("username"); + // } + // }); + this.username = localStorage.getItem("username"); + if(this.getUsername==""){ + this.$store.commit("setUsername", this.username); + } + + }, }; diff --git a/src/components/Section3Base.vue b/src/components/Section3Base.vue index 42a5eba..2ef4187 100644 --- a/src/components/Section3Base.vue +++ b/src/components/Section3Base.vue @@ -7,7 +7,7 @@ โดยมีคุณสมบัติดังนี้
เช็คคุณสมบัติกันเลย !
- + ตรวจสอบคุณสมบัติการเป็น สว. diff --git a/src/components/Section7GreenTab.vue b/src/components/Section7GreenTab.vue index 98b5f12..40a47f6 100644 --- a/src/components/Section7GreenTab.vue +++ b/src/components/Section7GreenTab.vue @@ -1,7 +1,7 @@ diff --git a/src/components/edit/FormMainEdit.vue b/src/components/edit/FormMainEdit.vue new file mode 100644 index 0000000..b17d161 --- /dev/null +++ b/src/components/edit/FormMainEdit.vue @@ -0,0 +1,33 @@ + + + diff --git a/src/components/edit/FormSteperEdit.vue b/src/components/edit/FormSteperEdit.vue new file mode 100644 index 0000000..81da8bb --- /dev/null +++ b/src/components/edit/FormSteperEdit.vue @@ -0,0 +1,1057 @@ + + + diff --git a/src/components/form/FormSteper.vue b/src/components/form/FormSteper.vue index b0a4024..e8e9e89 100644 --- a/src/components/form/FormSteper.vue +++ b/src/components/form/FormSteper.vue @@ -34,7 +34,7 @@ - + @@ -99,7 +100,7 @@ > - + @@ -387,6 +389,25 @@ bg-color="#F2EBD1" v-model="payload.vision" > + +
+ Previous + + + next +
+ @@ -427,6 +448,7 @@ label="โทรศัพท์" v-model="payload.public_phone" :rules="rules.tel" + class="d-none" > @@ -522,9 +544,9 @@ - + // import Provinces from "./provinces.json"; // import Districts from "./districts.json"; + import { client } from "@/utils/trpc"; +import { createFormData } from "@/utils/fileUpload"; import validateThaiID from "thai-id-validator"; // client.info.getAllGroups.query({}).then(console.log); export default { @@ -563,13 +587,14 @@ export default { ? "next" : undefined; }, - // isIdCardValid() { - // return this.$refs.form.validate(); - // }, - // // ถ้าเลขบัตรประชาชนไม่ถูกต้องให้ปุ่ม Next ถูก disable - // isNextDisabled() { - // return !this.isIdCardValid; - // } + checkOpt1() { + let dataOption = [...this.option1, ...this.option2]; + const filteredItems = dataOption.filter( + (item) => item.choice !== null && item.choice !== undefined + ); + + return { count: dataOption.length, checkcount: filteredItems.length }; + }, }, data() { @@ -580,6 +605,12 @@ export default { form3: false, form4: false, rules: { + files: [ + (files) => + !files || + !files.some((file) => file.size > 3_097_152) || + "Avatar size should be less than 3 MB!", + ], // ^[a-zA-Z0-9?><;,{}[\]\-_+=!@#$%\^&*|']*$ space: (v) => /^[^ ]+$/.test(v) || "must not contain spaces.", username: (v) => @@ -621,6 +652,7 @@ export default { (parseInt(v) == v && v.length == 13 && validateThaiID(v)) || "Invalid ID card number", ], + age: [(v) => parseInt(v) >= 40 || "Age must be over 40"], email: [ (value) => { const pattern = @@ -660,6 +692,7 @@ export default { url: null, image: null, + file: null, province: null, district: null, districtItems: [], @@ -730,6 +763,40 @@ export default { }; }, methods: { + onFileChanged(event) { + const file = event.target.files[0]; + this.file = file; + if (this.file && this.file !== null) { + const reader = new FileReader(); + reader.onload = (event) => { + console.log(event.target.result); + this.url = event.target.result; + }; + reader.readAsDataURL(this.file); + console.log(); + } else { + this.url = null; + } + }, + + async uploadImage() { + if (!this.file) { + return; + } + let request = await client.user.requestChangeImage.mutate({ + imageName: this.file.name, + contentType: this.file.type, + }); + let formData = createFormData(request, this.file); + await fetch(request.postURL, { + method: "POST", + body: formData, + }).then(() => { + client.user.confirmChangeImage.mutate(); + alert("บันทึกข้อมูลสำเร็จ"); + }); + console.log("done"); + }, submit() { let dataOption = [...this.option1, ...this.option2]; const filterOpt = dataOption.map((item) => { @@ -745,10 +812,10 @@ export default { // console.log("opppp", filterOpt, filterOpt2); // let payload = { - // firstName: "ธรรมนูญ", + // firstName: "ธรรมนูญ2", // lastName: "สังขวรรณ", // title: "", - // cid: "1189900247580", + // cid: "3180600024176", // age: 60, // phone: "0819444825", // public_phone: "0819444885", @@ -772,18 +839,53 @@ export default { // // }, // // ], // }; - + // console.log("this.payload", this.payload); client.user.createUser .mutate(this.payload) .then((data) => { console.log("data", data); - alert("บันทึกข้อมูลสำเร็จ"); - this.$router.push("/upload"); + + localStorage.setItem("token", data.token); + if (this.file) { + this.uploadImage(); + } else { + alert("บันทึกข้อมูลสำเร็จ"); + } + this.getUser(); + // this.$router.push("/upload"); // this.provinceItems = data; }) .catch((error) => { - alert("ไม่สามารถอัปโหลดข้อมูลได้"); + alert("ไม่สามารถบันทึกข้อมูลได้: " + error.message); + console.error("เกิดข้อผิดพลาดในการโหลดข้อมูล:", error); + }); + }, + login(payload) { + client.user.login + .mutate(payload) + .then((data) => { + console.log("data", data); + + localStorage.setItem("token", data.token); + this.$router.push("/"); + }) + .catch((error) => { + alert("ไม่สามารถบันทึกข้อมูลได้: " + error.message); + console.error("เกิดข้อผิดพลาดในการโหลดข้อมูล:", error); + }); + }, + getUser() { + client.user.getSelf + .mutate({}) + .then((data) => { + this.login({ cid: data.cid, phone: data.phone }); + localStorage.setItem("username", data.firstName); + this.$store.commit("setUsername", data.firstName); + // this.$store.dispatch('setLocalStorageValue',data.firstName) + }) + .catch((error) => { + alert("ไม่สามารถโหลดข้อมูลได้"); console.error("เกิดข้อผิดพลาดในการโหลดข้อมูล:", error); }); }, @@ -802,12 +904,6 @@ export default { } }, filterData() { - // กรองข้อมูลอันที่สองโดยใช้ข้อมูลจากอันแรก - // if (this.province && this.province.provinceCode) { - // this.districtItems = [...Districts].filter( - // (item) => item.provinceCode === this.province.provinceCode - // ); - // } this.payload.zone = null; client.info.getAllZones .query({ provice_id: this.payload.province }) diff --git a/src/components/search/SearchMain.vue b/src/components/search/SearchMain.vue index f4251b6..43a88cd 100644 --- a/src/components/search/SearchMain.vue +++ b/src/components/search/SearchMain.vue @@ -10,7 +10,7 @@
ค้นหาผู้สมัครสว.
- + - + - + - + ค้นหา @@ -79,12 +79,15 @@ > ไม่พบข้อมูล + +
@@ -113,6 +116,7 @@ export default { items: [], group: null, offset: 0, + count:0, }; }, methods: { @@ -125,10 +129,13 @@ export default { // this.offset = (this.page - 1) * 10; let data = { offset: offset, - limit: 10, + limit: 10, // group: this.group, // zone: this.district, }; + if (this.province) { + data.province = this.province; + } if (this.group) { data.group = this.group; } @@ -160,6 +167,59 @@ export default { console.error("เกิดข้อผิดพลาดในการโหลดข้อมูล:", error); }); }, + searchUserApi(offset) { + this.show = false; + this.load = true; + if (offset == 0) { + this.page = 1; + } + // this.offset = (this.page - 1) * 10; + let data = { + offset: offset, + limit: 10, + // group: this.group, + // zone: this.district, + }; + if (this.province) { + data.province = this.province; + } + if (this.group) { + data.group = this.group; + } + if (this.district) { + data.zone = this.district; + } + + console.log(data); + client.user.getAllUserCount + .query(data) + .then((rs) => { + this.count = rs; + }) + .catch((error) => { + alert("ไม่สามารถโหลดข้อมูลได้"); + console.error("เกิดข้อผิดพลาดในการโหลดข้อมูล:", error); + }); + + client.user.getAllUser + .query(data) + .then((rs) => { + this.result = rs; + console.log(rs); + this.load = false; + if (rs.length == 0) { + this.show = true; + } + + // this.districtItems = rs; + }) + .catch((error) => { + this.load = false; + + alert("ไม่สามารถโหลดข้อมูลได้"); + console.error("เกิดข้อผิดพลาดในการโหลดข้อมูล:", error); + }); + }, filterData() { // กรองข้อมูลอันที่สองโดยใช้ข้อมูลจากอันแรก this.district = null; diff --git a/src/config.js b/src/config.js index 53492b2..7b781ca 100644 --- a/src/config.js +++ b/src/config.js @@ -1,4 +1,4 @@ export const CONFIG = { - // api_url: "http://178.128.18.156:3000", + // api_url: "http://178.128.18.156:3000", api_url: process.env.VUE_APP_API_URL || "http://localhost:3000", }; diff --git a/src/router/index.js b/src/router/index.js index 6c22073..cdc5949 100644 --- a/src/router/index.js +++ b/src/router/index.js @@ -5,12 +5,20 @@ import QuestionList from "@/views/QuestionList.vue"; import RegisterForm from "@/views/RegisterForm.vue"; import SearchUser from "@/views/SearchUser.vue"; import UploadImage from "@/views/UploadImage.vue"; +import LoginForm from "@/views/LoginForm.vue"; +import ProfileUser from "@/views/ProfileUser.vue"; +import CheckDetail from "@/views/CheckDetail.vue"; const routes = [ { path: "/", name: "HomePage", component: HomePage, }, + { + path: "/login", + name: "LoginForm", + component: LoginForm, + }, { path: "/check", component: CheckSurvey, @@ -31,6 +39,14 @@ const routes = [ path: "/upload", component: UploadImage, }, + { + path: "/profile", + component: ProfileUser, + }, + { + path: "/detail", + component: CheckDetail, + }, ]; const router = createRouter({ diff --git a/src/store/index.js b/src/store/index.js index 2a25fb0..6727218 100644 --- a/src/store/index.js +++ b/src/store/index.js @@ -1,11 +1,27 @@ import { createStore } from "vuex"; export default createStore({ - state: {}, - getters: {}, - mutations: {}, - actions: { - + state: { + username:"" }, + getters: { + getUsername: (state) => { + return state.username + }, + }, + mutations: { + setUsername: (state, payload) => { + state.username = payload; + }, + }, + actions: { + setLocalStorageValue(data) { + localStorage.setItem("username", data); + }, + // getLocalStorageValue() { + // const username = localStorage.getItem("username"); + // // ทำสิ่งที่คุณต้องการกับค่าที่ได้จาก Local Storage + // }, + }, modules: {}, }); diff --git a/src/views/CheckDetail.vue b/src/views/CheckDetail.vue new file mode 100644 index 0000000..243dd1b --- /dev/null +++ b/src/views/CheckDetail.vue @@ -0,0 +1,259 @@ + + + diff --git a/src/views/LoginForm.vue b/src/views/LoginForm.vue new file mode 100644 index 0000000..d5dd157 --- /dev/null +++ b/src/views/LoginForm.vue @@ -0,0 +1,134 @@ + + diff --git a/src/views/ProfileUser.vue b/src/views/ProfileUser.vue new file mode 100644 index 0000000..1bf7f3b --- /dev/null +++ b/src/views/ProfileUser.vue @@ -0,0 +1,13 @@ + + + + \ No newline at end of file