Squashed commit of the following:
commit eb6c7b164a9f182f8d1ce73cc5354866c6d6b10e
Author: puriphatt <puriphat@frappet.com>
Date: Wed Sep 11 11:29:44 2024 +0700
refactor: no img close to default on create
commit eae9eb26071cc2985624bb1c6ce551bf5eb6eb8b
Author: puriphatt <puriphat@frappet.com>
Date: Wed Sep 11 11:04:04 2024 +0700
refactor/feat: save => apply, disabled selected img, no img close to default
commit ccbf80fc53db3144873c049bd6dbd37b4e2e9ff3
Author: puriphatt <puriphat@frappet.com>
Date: Wed Sep 11 09:31:32 2024 +0700
fix(01): use submit function
commit 36b4f6ca15e5966f37dfefc9fdb744feec60dd27
Author: puriphatt <puriphat@frappet.com>
Date: Tue Sep 10 17:45:19 2024 +0700
fix: imgList error
commit bac0eaf3ab955672ae0c78d3295b4a839827c5f2
Author: puriphatt <puriphat@frappet.com>
Date: Tue Sep 10 17:18:03 2024 +0700
refactor(03): customer new upload img dialog
commit 9d7398e9613a738c33e265482cdb7d7bb250ea9f
Author: puriphatt <puriphat@frappet.com>
Date: Tue Sep 10 15:40:39 2024 +0700
refactor(02): new upload dialog
commit 8b91d43f41eae3ba2442f6c742d617c25ee180cb
Author: puriphatt <puriphat@frappet.com>
Date: Tue Sep 10 15:25:21 2024 +0700
refactor(01): new upload dialog, confirm remove, individual action
commit 61caf1919168bc5635568d7ca246574fdc43cd04
Author: puriphatt <puriphat@frappet.com>
Date: Mon Sep 9 17:08:42 2024 +0700
refactor(01): branch new img upload
commit e791b7316d001d839c8afb1950f7331c62d9e81a
Author: puriphatt <puriphat@frappet.com>
Date: Mon Sep 9 17:08:42 2024 +0700
refactor(02): personnel new img upload
commit af4d11312b9cb666338901efa9971117cb7738c4
Author: puriphatt <puriphat@frappet.com>
Date: Mon Sep 9 17:08:42 2024 +0700
feat(02): new image upload
commit e4d7afdb8c74d65a550644f2c60f70909d51d4a8
Author: puriphatt <puriphat@frappet.com>
Date: Mon Sep 9 17:08:41 2024 +0700
refactor: mock select image function
commit 5ab3f045b9c7d2c821920c12114da15eed09655a
Author: puriphatt <puriphat@frappet.com>
Date: Mon Sep 9 17:08:41 2024 +0700
refactor: mock new image preview
This commit is contained in:
parent
ab0b3bb4f3
commit
62fc7055dd
13 changed files with 925 additions and 254 deletions
|
|
@ -87,15 +87,80 @@ const useBranchStore = defineStore('api-branch', () => {
|
|||
return false;
|
||||
}
|
||||
|
||||
async function create(branch: BranchCreate, bank?: BankBook[]) {
|
||||
const { qrCodeImage, imageUrl, zipCode, ...payload } = branch;
|
||||
async function fetchImageListById(
|
||||
id: string,
|
||||
flow?: {
|
||||
sessionId?: string;
|
||||
refTransactionId?: string;
|
||||
transactionId?: string;
|
||||
},
|
||||
) {
|
||||
const res = await api.get(`/branch/${id}/image`, {
|
||||
headers: {
|
||||
'X-Session-Id': flow?.sessionId,
|
||||
'X-Rtid': flow?.refTransactionId || flowStore.rtid,
|
||||
'X-Tid': flow?.transactionId,
|
||||
},
|
||||
});
|
||||
|
||||
if (!res) return false;
|
||||
if (res.status === 200) return res.data;
|
||||
if (res.status === 204) return null;
|
||||
|
||||
return false;
|
||||
}
|
||||
|
||||
async function addImageList(file: File, branchId: string, name: string) {
|
||||
await api
|
||||
.put(`/branch/${branchId}/image/${name}`, file, {
|
||||
headers: { 'Content-Type': file.type },
|
||||
onUploadProgress: (e) => console.log(e),
|
||||
})
|
||||
.catch((e) => console.error(e));
|
||||
|
||||
return name;
|
||||
}
|
||||
|
||||
async function deleteImageByName(
|
||||
id: string,
|
||||
name: string,
|
||||
flow?: {
|
||||
sessionId?: string;
|
||||
refTransactionId?: string;
|
||||
transactionId?: string;
|
||||
},
|
||||
) {
|
||||
const res = await api.delete(`/branch/${id}/image/${name}`, {
|
||||
headers: {
|
||||
'X-Session-Id': flow?.sessionId,
|
||||
'X-Rtid': flow?.refTransactionId || flowStore.rtid,
|
||||
'X-Tid': flow?.transactionId,
|
||||
},
|
||||
});
|
||||
|
||||
if (!res) return false;
|
||||
}
|
||||
|
||||
async function create(
|
||||
branch: BranchCreate,
|
||||
bank?: BankBook[],
|
||||
imgList?: {
|
||||
selectedImage: string;
|
||||
list: { url: string; imgFile: File | null; name: string }[];
|
||||
},
|
||||
) {
|
||||
const { qrCodeImage, zipCode, ...payload } = branch;
|
||||
const bankPayload = bank?.map(({ bankUrl, bankQr, ...rest }) => ({
|
||||
...rest,
|
||||
}));
|
||||
|
||||
const res = await api.post<Branch>(
|
||||
'/branch',
|
||||
{ ...payload, bank: bankPayload },
|
||||
{
|
||||
...payload,
|
||||
selectedImage: (imgList && imgList.selectedImage) || '',
|
||||
bank: bankPayload,
|
||||
},
|
||||
{ headers: { 'X-Rtid': flowStore.rtid } },
|
||||
);
|
||||
|
||||
|
|
@ -108,15 +173,6 @@ const useBranchStore = defineStore('api-branch', () => {
|
|||
.catch((e) => console.error(e));
|
||||
}
|
||||
|
||||
if (imageUrl) {
|
||||
await api
|
||||
.put(`/branch/${res.data.id}/branch-image`, imageUrl, {
|
||||
headers: { 'Content-Type': imageUrl.type },
|
||||
onUploadProgress: (e) => console.log(e),
|
||||
})
|
||||
.catch((e) => console.error(e));
|
||||
}
|
||||
|
||||
if (res.data.bank && bank) {
|
||||
for (let i = 0; i < bank?.length; i++) {
|
||||
if (bank[i].bankQr) {
|
||||
|
|
@ -134,6 +190,14 @@ const useBranchStore = defineStore('api-branch', () => {
|
|||
}
|
||||
}
|
||||
|
||||
if (imgList && imgList.list.length > 0 && res.data.id) {
|
||||
for (let index = 0; index < imgList.list.length; index++) {
|
||||
const imgFile = imgList.list[index].imgFile;
|
||||
if (imgFile)
|
||||
await addImageList(imgFile, res.data.id, imgList.list[index].name);
|
||||
}
|
||||
}
|
||||
|
||||
if (!res) return false;
|
||||
|
||||
return res.data;
|
||||
|
|
@ -143,7 +207,6 @@ const useBranchStore = defineStore('api-branch', () => {
|
|||
id: string,
|
||||
data: Partial<BranchCreate & { status: 'ACTIVE' | 'INACTIVE' | 'CREATED' }>,
|
||||
qrCodeImage?: File | undefined,
|
||||
imageHq?: File | undefined,
|
||||
bank?: BankBook[],
|
||||
opts?: {
|
||||
deleteQrCodeImage?: boolean;
|
||||
|
|
@ -178,15 +241,6 @@ const useBranchStore = defineStore('api-branch', () => {
|
|||
.catch((e) => console.error(e));
|
||||
}
|
||||
|
||||
if (imageHq) {
|
||||
await api
|
||||
.put(`/branch/${res.data.id}/branch-image`, imageHq, {
|
||||
headers: { 'Content-Type': imageHq.type },
|
||||
onUploadProgress: (e) => console.log(e),
|
||||
})
|
||||
.catch((e) => console.error(e));
|
||||
}
|
||||
|
||||
if (!!res.data.bank && !!bank) {
|
||||
for (let i = 0; i < bank?.length; i++) {
|
||||
if (bank?.[i].bankQr) {
|
||||
|
|
@ -339,6 +393,10 @@ const useBranchStore = defineStore('api-branch', () => {
|
|||
fetchList,
|
||||
fetchById,
|
||||
|
||||
fetchImageListById,
|
||||
addImageList,
|
||||
deleteImageByName,
|
||||
|
||||
create,
|
||||
editById,
|
||||
deleteById,
|
||||
|
|
|
|||
|
|
@ -16,6 +16,7 @@ export type BankBook = {
|
|||
};
|
||||
|
||||
export type Branch = {
|
||||
selectedImage?: string;
|
||||
subDistrict: SubDistrict | null;
|
||||
district: District | null;
|
||||
province: Province | null;
|
||||
|
|
@ -30,7 +31,6 @@ export type Branch = {
|
|||
latitude: string;
|
||||
contactName: string;
|
||||
qrCodeImageUrl: string;
|
||||
imageUrl: string;
|
||||
email: string;
|
||||
zipCode: string;
|
||||
subDistrictId: string | null;
|
||||
|
|
@ -57,6 +57,7 @@ export type Branch = {
|
|||
export type BranchWithChildren = Branch & { branch: Branch[] };
|
||||
|
||||
export type BranchCreate = {
|
||||
selectedImage?: string;
|
||||
code?: string;
|
||||
taxNo: string;
|
||||
nameEN: string;
|
||||
|
|
@ -76,7 +77,6 @@ export type BranchCreate = {
|
|||
contactName: string;
|
||||
contact: string;
|
||||
qrCodeImage?: File;
|
||||
imageUrl?: File;
|
||||
lineId: string;
|
||||
webUrl?: string;
|
||||
virtual: boolean;
|
||||
|
|
|
|||
|
|
@ -256,7 +256,7 @@ const useCustomerStore = defineStore('api-customer', () => {
|
|||
fetch(res.data)
|
||||
.then(async (res) => await res.blob())
|
||||
.then((blob) => {
|
||||
let a = document.createElement('a');
|
||||
const a = document.createElement('a');
|
||||
a.download = filename;
|
||||
a.href = window.URL.createObjectURL(blob);
|
||||
a.click();
|
||||
|
|
@ -267,8 +267,66 @@ const useCustomerStore = defineStore('api-customer', () => {
|
|||
return res.data;
|
||||
}
|
||||
|
||||
async function fetchImageListById(
|
||||
id: string,
|
||||
flow?: {
|
||||
sessionId?: string;
|
||||
refTransactionId?: string;
|
||||
transactionId?: string;
|
||||
},
|
||||
) {
|
||||
const res = await api.get(`/customer/${id}/image`, {
|
||||
headers: {
|
||||
'X-Session-Id': flow?.sessionId,
|
||||
'X-Rtid': flow?.refTransactionId || flowStore.rtid,
|
||||
'X-Tid': flow?.transactionId,
|
||||
},
|
||||
});
|
||||
|
||||
if (!res) return false;
|
||||
if (res.status === 200) return res.data;
|
||||
if (res.status === 204) return null;
|
||||
|
||||
return false;
|
||||
}
|
||||
|
||||
async function addImageList(file: File, customerId: string, name: string) {
|
||||
await api
|
||||
.put(`/customer/${customerId}/image/${name}`, file, {
|
||||
headers: { 'Content-Type': file.type },
|
||||
onUploadProgress: (e) => console.log(e),
|
||||
})
|
||||
.catch((e) => console.error(e));
|
||||
|
||||
return name;
|
||||
}
|
||||
|
||||
async function deleteImageByName(
|
||||
id: string,
|
||||
name: string,
|
||||
flow?: {
|
||||
sessionId?: string;
|
||||
refTransactionId?: string;
|
||||
transactionId?: string;
|
||||
},
|
||||
) {
|
||||
const res = await api.delete(`/customer/${id}/image/${name}`, {
|
||||
headers: {
|
||||
'X-Session-Id': flow?.sessionId,
|
||||
'X-Rtid': flow?.refTransactionId || flowStore.rtid,
|
||||
'X-Tid': flow?.transactionId,
|
||||
},
|
||||
});
|
||||
|
||||
if (!res) return false;
|
||||
}
|
||||
|
||||
async function create(
|
||||
data: CustomerCreate,
|
||||
imgList: {
|
||||
selectedImage: string;
|
||||
list: { url: string; imgFile: File | null; name: string }[];
|
||||
},
|
||||
flow?: {
|
||||
sessionId?: string;
|
||||
refTransactionId?: string;
|
||||
|
|
@ -291,13 +349,17 @@ const useCustomerStore = defineStore('api-customer', () => {
|
|||
imageUrl: string;
|
||||
imageUploadUrl: string;
|
||||
}
|
||||
>('/customer', payload, {
|
||||
headers: {
|
||||
'X-Session-Id': flow?.sessionId,
|
||||
'X-Rtid': flow?.refTransactionId || flowStore.rtid,
|
||||
'X-Tid': flow?.transactionId,
|
||||
>(
|
||||
'/customer',
|
||||
{ ...payload, selectedImage: imgList.selectedImage },
|
||||
{
|
||||
headers: {
|
||||
'X-Session-Id': flow?.sessionId,
|
||||
'X-Rtid': flow?.refTransactionId || flowStore.rtid,
|
||||
'X-Tid': flow?.transactionId,
|
||||
},
|
||||
},
|
||||
});
|
||||
);
|
||||
|
||||
// await Promise.allSettled([
|
||||
// ...res.data.branch.map(async (v, i) => {
|
||||
|
|
@ -305,15 +367,23 @@ const useCustomerStore = defineStore('api-customer', () => {
|
|||
// if (fileList)
|
||||
// return await addBranchAttachment(v.id, { file: fileList });
|
||||
// }),
|
||||
image &&
|
||||
(await api
|
||||
.put(`/customer/${res.data.id}/image`, image, {
|
||||
headers: { 'Content-Type': image?.type },
|
||||
onUploadProgress: (e) => console.log(e),
|
||||
})
|
||||
.catch((e) => console.error(e)));
|
||||
// image &&
|
||||
// (await api
|
||||
// .put(`/customer/${res.data.id}/image`, image, {
|
||||
// headers: { 'Content-Type': image?.type },
|
||||
// onUploadProgress: (e) => console.log(e),
|
||||
// })
|
||||
// .catch((e) => console.error(e)));
|
||||
// ]);
|
||||
|
||||
if (imgList.list.length > 0 && res.data.id) {
|
||||
for (let index = 0; index < imgList.list.length; index++) {
|
||||
const imgFile = imgList.list[index].imgFile;
|
||||
if (imgFile)
|
||||
await addImageList(imgFile, res.data.id, imgList.list[index].name);
|
||||
}
|
||||
}
|
||||
|
||||
if (!res) return false;
|
||||
|
||||
return res.data;
|
||||
|
|
@ -362,13 +432,13 @@ const useCustomerStore = defineStore('api-customer', () => {
|
|||
// if (fileList)
|
||||
// return await addBranchAttachment(v.id, { file: fileList });
|
||||
// }),
|
||||
image &&
|
||||
(await axios
|
||||
.put(res.data.imageUploadUrl, image, {
|
||||
headers: { 'Content-Type': image.type },
|
||||
onUploadProgress: (e) => console.log(e),
|
||||
})
|
||||
.catch((e) => console.error(e)));
|
||||
// image &&
|
||||
// (await axios
|
||||
// .put(res.data.imageUploadUrl, image, {
|
||||
// headers: { 'Content-Type': image.type },
|
||||
// onUploadProgress: (e) => console.log(e),
|
||||
// })
|
||||
// .catch((e) => console.error(e)));
|
||||
// ]);
|
||||
|
||||
if (!res) return false;
|
||||
|
|
@ -563,6 +633,11 @@ const useCustomerStore = defineStore('api-customer', () => {
|
|||
fetchListCustomeBranch,
|
||||
fetchById,
|
||||
fetchList,
|
||||
|
||||
fetchImageListById,
|
||||
addImageList,
|
||||
deleteImageByName,
|
||||
|
||||
create,
|
||||
editById,
|
||||
deleteById,
|
||||
|
|
|
|||
|
|
@ -150,6 +150,7 @@ export type CustomerBranchCreate = {
|
|||
};
|
||||
|
||||
export type CustomerCreate = {
|
||||
selectedImage?: string;
|
||||
code: string;
|
||||
customerBranch?: (CustomerBranchCreate & { id?: string })[];
|
||||
customerType: CustomerType;
|
||||
|
|
@ -166,6 +167,7 @@ export type CustomerCreate = {
|
|||
};
|
||||
|
||||
export type CustomerUpdate = {
|
||||
selectedImage?: string;
|
||||
status?: Status;
|
||||
customerType?: CustomerType;
|
||||
customerBranch?: (CustomerBranchCreate & { id?: string })[];
|
||||
|
|
|
|||
|
|
@ -2,6 +2,7 @@ import { ref } from 'vue';
|
|||
import { defineStore } from 'pinia';
|
||||
import { Pagination, Status } from '../types';
|
||||
import { api } from 'src/boot/axios';
|
||||
|
||||
import {
|
||||
RoleData,
|
||||
User,
|
||||
|
|
@ -266,18 +267,83 @@ const useUserStore = defineStore('api-user', () => {
|
|||
return false;
|
||||
}
|
||||
|
||||
async function create(
|
||||
data: UserCreate,
|
||||
async function fetchImageListById(
|
||||
id: string,
|
||||
flow?: {
|
||||
sessionId?: string;
|
||||
refTransactionId?: string;
|
||||
transactionId?: string;
|
||||
},
|
||||
) {
|
||||
<<<<<<< HEAD
|
||||
const { profileImage, zipCode, ...payload } = data;
|
||||
const res = await api.post<User & { profileImageUploadUrl: string }>(
|
||||
=======
|
||||
const res = await api.get(`/user/${id}/profile-image`, {
|
||||
headers: {
|
||||
'X-Session-Id': flow?.sessionId,
|
||||
'X-Rtid': flow?.refTransactionId || flowStore.rtid,
|
||||
'X-Tid': flow?.transactionId,
|
||||
},
|
||||
});
|
||||
|
||||
if (!res) return false;
|
||||
if (res.status === 200) return res.data;
|
||||
if (res.status === 204) return null;
|
||||
|
||||
return false;
|
||||
}
|
||||
|
||||
async function addImageList(file: File, userId: string, name: string) {
|
||||
await api
|
||||
.put(`/user/${userId}/profile-image/${name}`, file, {
|
||||
headers: { 'Content-Type': file.type },
|
||||
onUploadProgress: (e) => console.log(e),
|
||||
})
|
||||
.catch((e) => console.error(e));
|
||||
|
||||
return name;
|
||||
}
|
||||
|
||||
async function deleteImageByName(
|
||||
id: string,
|
||||
name: string,
|
||||
flow?: {
|
||||
sessionId?: string;
|
||||
refTransactionId?: string;
|
||||
transactionId?: string;
|
||||
},
|
||||
) {
|
||||
const res = await api.delete(`/user/${id}/profile-image/${name}`, {
|
||||
headers: {
|
||||
'X-Session-Id': flow?.sessionId,
|
||||
'X-Rtid': flow?.refTransactionId || flowStore.rtid,
|
||||
'X-Tid': flow?.transactionId,
|
||||
},
|
||||
});
|
||||
|
||||
if (!res) return false;
|
||||
}
|
||||
|
||||
async function create(
|
||||
data: UserCreate,
|
||||
imgList: {
|
||||
selectedImage: string;
|
||||
list: { url: string; imgFile: File | null; name: string }[];
|
||||
},
|
||||
flow?: {
|
||||
sessionId?: string;
|
||||
refTransactionId?: string;
|
||||
transactionId?: string;
|
||||
},
|
||||
) {
|
||||
const { zipCode, ...payload } = data;
|
||||
const res = await api.post<User & { profileImageUploadUrl: string }>(
|
||||
'/user',
|
||||
payload,
|
||||
{
|
||||
...payload,
|
||||
selectedImage: imgList.selectedImage || '',
|
||||
},
|
||||
{
|
||||
headers: {
|
||||
'X-Session-Id': flow?.sessionId,
|
||||
|
|
@ -287,13 +353,12 @@ const useUserStore = defineStore('api-user', () => {
|
|||
},
|
||||
);
|
||||
|
||||
if (profileImage && res.data.id) {
|
||||
await api
|
||||
.put(`/user/${res.data.id}/image`, profileImage, {
|
||||
headers: { 'Content-Type': profileImage.type },
|
||||
onUploadProgress: (e) => console.log(e),
|
||||
})
|
||||
.catch((e) => console.error(e));
|
||||
if (imgList.list.length > 0 && res.data.id) {
|
||||
for (let index = 0; index < imgList.list.length; index++) {
|
||||
const imgFile = imgList.list[index].imgFile;
|
||||
if (imgFile)
|
||||
await addImageList(imgFile, res.data.id, imgList.list[index].name);
|
||||
}
|
||||
}
|
||||
|
||||
if (!res) return false;
|
||||
|
|
@ -310,26 +375,13 @@ const useUserStore = defineStore('api-user', () => {
|
|||
transactionId?: string;
|
||||
},
|
||||
) {
|
||||
const { profileImage, ...payload } = data;
|
||||
const res = await api.put<User & { profileImageUploadUrl: string }>(
|
||||
`/user/${id}`,
|
||||
payload,
|
||||
{
|
||||
headers: {
|
||||
'X-Session-Id': flow?.sessionId,
|
||||
'X-Rtid': flow?.refTransactionId || flowStore.rtid,
|
||||
'X-Tid': flow?.transactionId,
|
||||
},
|
||||
const res = await api.put<User>(`/user/${id}`, data, {
|
||||
headers: {
|
||||
'X-Session-Id': flow?.sessionId,
|
||||
'X-Rtid': flow?.refTransactionId || flowStore.rtid,
|
||||
'X-Tid': flow?.transactionId,
|
||||
},
|
||||
);
|
||||
|
||||
if (profileImage)
|
||||
await axios
|
||||
.put(res.data.profileImageUploadUrl, profileImage, {
|
||||
headers: { 'Content-Type': profileImage.type },
|
||||
onUploadProgress: (e) => console.log(e),
|
||||
})
|
||||
.catch((e) => console.error(e));
|
||||
});
|
||||
|
||||
if (!res) return false;
|
||||
|
||||
|
|
@ -460,6 +512,10 @@ const useUserStore = defineStore('api-user', () => {
|
|||
fetchList,
|
||||
fetchById,
|
||||
|
||||
fetchImageListById,
|
||||
addImageList,
|
||||
deleteImageByName,
|
||||
|
||||
create,
|
||||
editById,
|
||||
deleteById,
|
||||
|
|
|
|||
|
|
@ -3,6 +3,7 @@ import { Branch } from '../branch/types';
|
|||
import { Status } from '../types';
|
||||
|
||||
export type User = {
|
||||
selectedImage?: string;
|
||||
subDistrict: SubDistrict | null;
|
||||
district: District | null;
|
||||
province: Province | null;
|
||||
|
|
@ -41,7 +42,6 @@ export type User = {
|
|||
firstName: string;
|
||||
namePrefix?: string | null;
|
||||
id: string;
|
||||
profileImageUrl: string;
|
||||
code: string;
|
||||
birthDate?: Date | null;
|
||||
responsibleArea: string;
|
||||
|
|
@ -51,6 +51,7 @@ export type User = {
|
|||
};
|
||||
|
||||
export type UserCreate = {
|
||||
selectedImage?: string;
|
||||
branchId: string;
|
||||
provinceId?: string | null;
|
||||
districtId?: string | null;
|
||||
|
|
@ -82,7 +83,6 @@ export type UserCreate = {
|
|||
userType: string;
|
||||
username: string;
|
||||
status?: Status;
|
||||
profileImage?: File | null; // required but not strict
|
||||
birthDate?: Date | null;
|
||||
responsibleArea?: string | null;
|
||||
checkpoint?: string | null;
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue