PPOB/ppob-frontend
4
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge branch 'develop' into 'devops-staging'

Browse Source 
Draft: Develop

See merge request empatnusabangsa/ppob/ppob-frontend!64
This commit is contained in:
ilham dwi pratama 2022-01-12 10:10:57 +00:00
commit 238c2f31f3
5 changed files with 301 additions and 30 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

208
src/pages/Membership/DetailUser.js
View File

@ -275,6 +275,10 @@ export const DetailUser = observer(() => {
store.authentication.dataProfit.userDetail?.image_identity, store.authentication.dataProfit.userDetail?.image_identity,
"detail" "detail"
); );
console.log(
store.authentication.listImage,
"detail gambar"
);
return ( return (
<div className={["ppob-container"].join(" ")}> <div className={["ppob-container"].join(" ")}>
<BreadcumbComponent data={routeData} /> <BreadcumbComponent data={routeData} />
@ -283,8 +287,9 @@ export const DetailUser = observer(() => {
<Title strong level={2}> <Title strong level={2}>
Detail User Detail User
</Title> </Title>
<Col lg={20} xs={20} style={{ textAlign: "right" }}>
{store.authentication.userData.role === "Admin" && ( {store.authentication.userData.role === "Admin" && (
<Col lg={18} xs={18} style={{ textAlign: "right" }}>
<Space <Space
size="middle" size="middle"
align={"center"} align={"center"}
@ -365,8 +370,157 @@ export const DetailUser = observer(() => {
Withdraw Profit Withdraw Profit
</Button> </Button>
</Space> </Space>
)}
</Col> </Col>
)}
{store.authentication.userData.role === "Supervisor" && (
<Col lg={16} xs={16} style={{ textAlign: "right" }}>
<Space
size="middle"
align={"center"}
wrap={true}
style={{ textAlign: "center" }}
>
<Button
type={
store.membership.dataDetail.isActive === true
? "danger"
: "primary"
}
onClick={() =>
changeStatus(
store.membership.dataDetail.id,
store.membership.dataDetail.isActive
)
}
>
{store.membership.dataDetail.isActive === true
? "Inactive"
: "Active"}
</Button>
<Button
onClick={() => {
setInitialData({
id: store.membership.dataDetail.id,
name: store.membership.dataDetail.userDetail.name,
username: store.membership.dataDetail.username,
identity_number:
store.membership.dataDetail.userDetail.identity_number,
image_identity:
store.membership.dataDetail?.userDetail.image_identity,
image_store:
store.membership.dataDetail?.userDetail.image_store,
phone_number:
store.membership.dataDetail.userDetail.phone_number,
roleId: store.membership.dataDetail.roles.id,
isChangePassword: false,
});
console.log(
store.membership.dataDetail.userDetail.identity_number
);
console.log(store.membership.dataDetail.userDetail.id);
console.log(
store.membership.dataDetail.userDetail.image_identity
);
console.log(store.membership.dataDetail.username);
setVisibleModal(true);
}}
>
Edit
</Button>
<Button
onClick={() => {
setInitialData({
id: store.membership.dataDetail.id,
name: store.membership.dataDetail.userDetail.name,
username: store.membership.dataDetail.username,
phone_number:
store.membership.dataDetail.userDetail.phone_number,
roleId: store.membership.dataDetail.roles.id,
isChangePassword: true,
});
setVisibleModal(true);
}}
>
Ganti Password
</Button>
</Space>
</Col>
)}
{store.authentication.userData.role === "Sales" && (
<Col lg={16} xs={16} style={{ textAlign: "right" }}>
<Space
size="middle"
align={"center"}
wrap={true}
style={{ textAlign: "center" }}
>
<Button
type={
store.membership.dataDetail.isActive === true
? "danger"
: "primary"
}
onClick={() =>
changeStatus(
store.membership.dataDetail.id,
store.membership.dataDetail.isActive
)
}
>
{store.membership.dataDetail.isActive === true
? "Inactive"
: "Active"}
</Button>
<Button
onClick={() => {
setInitialData({
id: store.membership.dataDetail.id,
name: store.membership.dataDetail.userDetail.name,
username: store.membership.dataDetail.username,
identity_number:
store.membership.dataDetail.userDetail.identity_number,
image_identity:
store.membership.dataDetail?.userDetail.image_identity,
image_store:
store.membership.dataDetail?.userDetail.image_store,
phone_number:
store.membership.dataDetail.userDetail.phone_number,
roleId: store.membership.dataDetail.roles.id,
isChangePassword: false,
});
console.log(
store.membership.dataDetail.userDetail.identity_number
);
console.log(store.membership.dataDetail.userDetail.id);
console.log(
store.membership.dataDetail.userDetail.image_identity
);
console.log(store.membership.dataDetail.username);
setVisibleModal(true);
}}
>
Edit
</Button>
<Button
onClick={() => {
setInitialData({
id: store.membership.dataDetail.id,
name: store.membership.dataDetail.userDetail.name,
username: store.membership.dataDetail.username,
phone_number:
store.membership.dataDetail.userDetail.phone_number,
roleId: store.membership.dataDetail.roles.id,
isChangePassword: true,
});
setVisibleModal(true);
}}
>
Ganti Password
</Button>
</Space>
</Col>
)}
</Row> </Row>
<Row style={{ marginBottom: 20 }}> <Row style={{ marginBottom: 20 }}>
@ -416,7 +570,7 @@ export const DetailUser = observer(() => {
: "Inaktif"} : "Inaktif"}
</Text> </Text>
</Col> </Col>
{store.authentication.userData.role === "Sales" && ( {/* {store.authentication.userData.role === "Sales" && (
<Row> <Row>
<Col span={12}> <Col span={12}>
<Text strong>Foto Identitas</Text> <Text strong>Foto Identitas</Text>
@ -439,11 +593,10 @@ export const DetailUser = observer(() => {
<Text strong>Foto Toko</Text> <Text strong>Foto Toko</Text>
<Text> <Text>
<Row> <Row>
{data.map((item) => ( {store.authentication.listImage.map((item) => (
<Image <Image
src={ src={
store.authentication.dataProfit.userDetail item
?.image_store
? `${appConfig.apiUrl}/config/image/${item}` ? `${appConfig.apiUrl}/config/image/${item}`
: "https://st4.depositphotos.com/14953852/24787/v/600/depositphotos_247872612-stock-illustration-no-image-available-icon-vector.jpg" : "https://st4.depositphotos.com/14953852/24787/v/600/depositphotos_247872612-stock-illustration-no-image-available-icon-vector.jpg"
} }
@ -454,7 +607,7 @@ export const DetailUser = observer(() => {
</Text> </Text>
</Col> </Col>
</Row> </Row>
)} )} */}
{store.authentication.userData.role === "Admin" && ( {store.authentication.userData.role === "Admin" && (
<Row> <Row>
<Col span={12}> <Col span={12}>
@ -478,11 +631,48 @@ export const DetailUser = observer(() => {
<Text strong>Foto Toko</Text> <Text strong>Foto Toko</Text>
<Text> <Text>
<Row> <Row>
{data.map((item) => ( {store.authentication.listImage.map((item) => (
<Image
src={
item
? `${appConfig.apiUrl}/config/image/${item}`
: "https://st4.depositphotos.com/14953852/24787/v/600/depositphotos_247872612-stock-illustration-no-image-available-icon-vector.jpg"
}
style={{ width: "10vw",marginRight:15 }}
/>
))}
</Row>
</Text>
</Col>
</Row>
)}
{store.authentication.userData.role === "Sales" && (
<Row>
<Col span={12}>
<Text strong>Foto Identitas</Text>
</Col>
<Col span={12}></Col>
<Col span={12}>
<Text>
<Image <Image
src={ src={
store.authentication.dataProfit.userDetail store.authentication.dataProfit.userDetail
?.image_store ?.image_identity
? `${appConfig.apiUrl}/config/image/${store.authentication.dataProfit.userDetail?.image_identity}`
: "https://st4.depositphotos.com/14953852/24787/v/600/depositphotos_247872612-stock-illustration-no-image-available-icon-vector.jpg"
}
style={{ width: "10vw" }}
/>
</Text>
</Col>
<Col span={24}>
<Text strong>Foto Toko</Text>
<Text>
<Row>
{store.authentication.listImage.map((item) => (
<Image
src={
item
? `${appConfig.apiUrl}/config/image/${item}` ? `${appConfig.apiUrl}/config/image/${item}`
: "https://st4.depositphotos.com/14953852/24787/v/600/depositphotos_247872612-stock-illustration-no-image-available-icon-vector.jpg" : "https://st4.depositphotos.com/14953852/24787/v/600/depositphotos_247872612-stock-illustration-no-image-available-icon-vector.jpg"
} }

11
src/pages/Membership/Membership.js
View File

@ -255,6 +255,16 @@ export const Membership = observer(() => {
]; ];
const onSubmit = async (data, image, imageStore) => { const onSubmit = async (data, image, imageStore) => {
data.superior = true; data.superior = true;
console.log(imageStore, "Apa imageStore")
if(!imageStore){
imageStore = []
}
if (initialData.id) {
data.image_identity = image;
data.image_store = imageStore;
}
if (initialData.id) { if (initialData.id) {
setConfirmLoading(true); setConfirmLoading(true);
@ -267,6 +277,7 @@ export const Membership = observer(() => {
image_store: imageStore, image_store: imageStore,
}; };
await store.membership.update(initialData.id, request); await store.membership.update(initialData.id, request);
console.log(data, "edit data");
message.success( message.success(
initialData.isChangePassword initialData.isChangePassword
? "Success Change Member Password" ? "Success Change Member Password"

41
src/pages/Membership/MembershipModal.js
View File

@ -1,4 +1,4 @@
import React, { useState } from "react"; import React, { useState, useEffect } from "react";
import { import {
Form, Form,
Input, Input,
@ -37,6 +37,28 @@ export const MembershipModal = ({
const [loading, setLoading] = useState(false); const [loading, setLoading] = useState(false);
const [loadingStore, setLoadingStore] = useState(false); const [loadingStore, setLoadingStore] = useState(false);
useEffect(() => {
if (initialData.id) {
setFileList([
{
url: `${appConfig.apiUrl}/config/image/${initialData.image_identity}`,
},
]);
setFileStore([
{
url: `${appConfig.apiUrl}/config/image/${initialData.image_store}`,
},
]);
setImage(
`${appConfig.apiUrl}/config/image/${initialData.image_identity}`
);
setImageStore(
`${appConfig.apiUrl}/config/image/${initialData.image_store}`
);
}
return () => {};
}, [initialData]);
const beforeUpload = (file) => { const beforeUpload = (file) => {
let isLt2M; let isLt2M;
let allowedFile = ["image/jpeg", "image/png"]; let allowedFile = ["image/jpeg", "image/png"];
@ -88,12 +110,15 @@ export const MembershipModal = ({
console.log(res, "ini respon 2"); console.log(res, "ini respon 2");
setImageStore(`${appConfig.apiUrl}/config/image/${res.body.filename}`); setImageStore(`${appConfig.apiUrl}/config/image/${res.body.filename}`);
setResponseFilenameStore([...responseFilenameStore, res.body.filename]); setResponseFilenameStore([...responseFilenameStore, res.body.filename]);
setFileStore([...fileStore, { setFileStore([
...fileStore,
{
uid: "-1", uid: "-1",
name: res.body.filename, name: res.body.filename,
status: "done", status: "done",
url: `${appConfig.apiUrl}/config/image/${res.body.filename}`, url: `${appConfig.apiUrl}/config/image/${res.body.filename}`,
} ]); },
]);
setLoadingStore(false); setLoadingStore(false);
}; };
@ -156,9 +181,12 @@ export const MembershipModal = ({
form form
.validateFields() .validateFields()
.then((values) => { .then((values) => {
onCreate(values,responseFilename,responseFilenameStore); console.log(values, "apa valuesanya");
values.image_identity = responseFilename;
values.image_store = responseFilenameStore;
onCreate(values, responseFilename, responseFilenameStore);
form.resetFields(); form.resetFields();
setFileStore([]) setFileStore([]);
setImage(""); setImage("");
setFileList([]); setFileList([]);
setPreviewImage(""); setPreviewImage("");
@ -272,6 +300,7 @@ export const MembershipModal = ({
onChange={handleChange} onChange={handleChange}
beforeUpload={(file) => beforeUpload(file)} beforeUpload={(file) => beforeUpload(file)}
customRequest={(args) => uploadHandler(args)} customRequest={(args) => uploadHandler(args)}
maxCount={1}
onRemove={(file) => { onRemove={(file) => {
setImage(""); setImage("");
setLoading(false); setLoading(false);
@ -450,7 +479,7 @@ export const MembershipModal = ({
setFileStore([]); setFileStore([]);
}} }}
> >
{fileStore.length >= 3 ? null:uploadButtonStore } {fileStore.length >= 3 ? null : uploadButtonStore}
</Upload> </Upload>
<h5 <h5
style={{ style={{

50
src/pages/Profile/Profile.js
View File

@ -293,6 +293,46 @@ export const Profile = observer(() => {
</Row> </Row>
)} */} )} */}
{store.authentication.userData.role === "Retail" && ( {store.authentication.userData.role === "Retail" && (
// <Row>
// <Col span={12}>
// <Text strong>Foto Identitas</Text>
// </Col>
// <Col span={12}></Col>
// <Col span={12}>
// <Text>
// <Image
// src={
// store.authentication.profileData.userDetail
// ?.image_identity
// ? `${appConfig.apiUrl}/config/image/${store.authentication.profileData.userDetail?.image_identity}`
// : "https://st4.depositphotos.com/14953852/24787/v/600/depositphotos_247872612-stock-illustration-no-image-available-icon-vector.jpg"
// }
// style={{ width: "10vw" }}
// />
// </Text>
// </Col>
// <Col span={24}>
// <Text strong>Foto Toko</Text>
// <Text>
// <Row>
// {JSON.parse(
// store.authentication.profileData.userDetail
// ?.image_store
// ).map((item) => (
// <Image
// src={
// store.authentication.profileData.userDetail
// ?.image_store
// ? `${appConfig.apiUrl}/config/image/${item}`
// : "https://st4.depositphotos.com/14953852/24787/v/600/depositphotos_247872612-stock-illustration-no-image-available-icon-vector.jpg"
// }
// style={{ width: "10vw", marginRight: 15 }}
// />
// ))}
// </Row>
// </Text>
// </Col>
// </Row>
<Row> <Row>
<Col span={12}> <Col span={12}>
<Text strong>Foto Identitas</Text> <Text strong>Foto Identitas</Text>
@ -315,18 +355,14 @@ export const Profile = observer(() => {
<Text strong>Foto Toko</Text> <Text strong>Foto Toko</Text>
<Text> <Text>
<Row> <Row>
{JSON.parse( {store.authentication.imageProfil.map((item) => (
store.authentication.profileData.userDetail
?.image_store
).map((item) => (
<Image <Image
src={ src={
store.authentication.profileData.userDetail item
?.image_store
? `${appConfig.apiUrl}/config/image/${item}` ? `${appConfig.apiUrl}/config/image/${item}`
: "https://st4.depositphotos.com/14953852/24787/v/600/depositphotos_247872612-stock-illustration-no-image-available-icon-vector.jpg" : "https://st4.depositphotos.com/14953852/24787/v/600/depositphotos_247872612-stock-illustration-no-image-available-icon-vector.jpg"
} }
style={{ width: "10vw", marginRight: 15 }} style={{ width: "10vw",marginRight:15 }}
/> />
))} ))}
</Row> </Row>

7
src/store/authentication.js
View File

@ -10,6 +10,7 @@ export class Authentication {
profileData = {}; profileData = {};
dataProfit=[]; dataProfit=[];
listImage=[]; listImage=[];
imageProfil=[];
constructor(ctx) { constructor(ctx) {
this.ctx = ctx; this.ctx = ctx;
@ -58,7 +59,8 @@ export class Authentication {
const response = await http.get(`/auth/profile/${id}`); const response = await http.get(`/auth/profile/${id}`);
console.log(response) console.log(response)
this.dataProfit = response.body ?? []; this.dataProfit = response.body ?? [];
this.listImage = this.dataProfit.userDetail ? JSON.parse(this.dataProfit.userDetail?.image_store) : []; this.listImage = this.dataProfit.userDetail?.image_store ? JSON.parse(this.dataProfit.userDetail?.image_store) : [];
this.total_data = response?.body?.count ?? 0; this.total_data = response?.body?.count ?? 0;
} catch (e) { } catch (e) {
console.error(e); console.error(e);
@ -70,6 +72,9 @@ export class Authentication {
const response = await http.get('/auth/profile'); const response = await http.get('/auth/profile');
console.log(response) console.log(response)
this.profileData = response.body; this.profileData = response.body;
this.imageProfil = this.profileData.userDetail?.image_store ? JSON.parse(this.profileData.userDetail?.image_store) : [];
//this.imageProfil = this.profileData.userDetail?.image_store ? JSON.parse(this.profileData.userDetail?.image_store) : [];
} catch (e) { } catch (e) {
console.error(e); console.error(e);
} }