ordo
/
surveyor_indonesia_frontend
2
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

Merge pull request 'refferal code' (#55) from dev-wahyun into staging 

Reviewed-on: ibnu/generic-ospro-frontend#55
pull/1/head
farhantock 10 months ago
parent
25d719edef 47bd5ca01b
commit
307c125a8e
6 changed files with 322 additions and 210 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 12
      src/const/ApiConst.js
  2. 6
      src/views/SimproV2/Profile/index.js
  3. 278
      src/views/SimproV2/Satuan/DialogForm.js
  4. 2
      src/views/SimproV2/Satuan/index.js
  5. 148
      src/views/SimproV2/Settings/DialogForm.js
  6. 86
      src/views/SimproV2/Settings/index.js

12
src/const/ApiConst.js
Unescape View File

@ -280,6 +280,9 @@ export const USER_SYNC = `${BASE_SIMPRO_LUMEN}/human-resource/sync`;
export const USER_EDIT = (id) => {
return `${BASE_SIMPRO_LUMEN}/human-resource/update/${id}`;
};
export const USER_GET_ID = (id) => {
return `${BASE_SIMPRO_LUMEN}/human-resource/edit/${id}`;
};
export const USER_DELETE = (id) => {
return `${BASE_SIMPRO_LUMEN}/human-resource/delete/${id}`;
};
@ -288,6 +291,15 @@ export const HUMAN_RESOURCE_LIST = `${BASE_SIMPRO_LUMEN}/human-resource`
export const USER_TO_ACTIVITY_ADD = `${BASE_SIMPRO_LUMEN}/user-to-activity/add`
export const USER_TO_ACTIVITY_DELETE = (id) => { return `${BASE_SIMPRO_LUMEN}/user-to-activity/delete/${id}` }
export const REFFERAL_ADD = `${BASE_SIMPRO_LUMEN}/refferal-code/add`;
export const REFFERAL_SEARCH = `${BASE_SIMPRO_LUMEN}/refferal-code/search`;
export const REFFERAL_GET_ID = (id) => {
return `${BASE_SIMPRO_LUMEN}/refferal-code/edit/${id}`;
};
export const REFFERAL_EDIT = (id) => {
return `${BASE_SIMPRO_LUMEN}/refferal-code/update/${id}`;
};
export const ABSENSI_ADD = `${BASE_SIMPRO_LUMEN}/permit/add`;
export const ABSENSI_SEARCH = `${BASE_SIMPRO_LUMEN}/permit/search`;
export const ABSENSI_EDIT = (id) => {

6
src/views/SimproV2/Profile/index.js
Unescape View File

@ -8,7 +8,7 @@ import { Pagination, Tooltip } from 'antd';
import { USER_EDIT, SATUAN_ADD, SATUAN_EDIT, SATUAN_DELETE, SATUAN_SEARCH } from '../../../const/ApiConst';
import profile from '../../../assets/img/profile.png'
import DialogForm from './DialogForm'
import { ROLE_SEARCH, BASE_OSPRO } from '../../../const/ApiConst'
import { ROLE_SEARCH, USER_GET_ID } from '../../../const/ApiConst'
@ -120,9 +120,7 @@ const Profile = ({ params }) => {
const getDataProfileUser = async () => {
const id = localStorage.getItem("user_id")
const url = `${BASE_OSPRO}/api/human-resource/edit/${id}`
const url = USER_GET_ID(id);
const result = await axios
.get(url, config)
.then((res) => res)

278
src/views/SimproV2/Satuan/DialogForm.js
Unescape View File

@ -1,139 +1,139 @@
import React, { useEffect, useState } from 'react'
import {
Modal, ModalHeader, ModalBody, ModalFooter,
Button, Form, FormGroup, Label, Input, Col, Row
} from 'reactstrap';
import { Select } from 'antd';
import 'antd/dist/antd.css';
import { useTranslation } from 'react-i18next';
const { Option } = Select;
const DialogForm = ({ openDialog, closeDialog, toggleDialog, typeDialog, dataEdit, company_id, listCompany, role_name }) => {
const [id, setId] = useState(0)
const [name, setName] = useState('')
const [description, setDescription] = useState('')
const [selectedCompany, setSelectedCompany] = useState(null)
const { t } = useTranslation()
useEffect(() => {
if (typeDialog === "Edit") {
setId(dataEdit.id)
setDescription(dataEdit.description)
setName(dataEdit.name)
setSelectedCompany(dataEdit.company_id);
} else {
setId(0)
}
}, [dataEdit, openDialog])
const handleSave = () => {
let data = '';
if (typeDialog === "Save") {
if (role_name === 'Super Admin') {
company_id = selectedCompany
}
data = {
name: name,
description: description,
company_id: company_id
}
closeDialog('save', data);
} else {
if (role_name === 'Super Admin') {
company_id = selectedCompany
}
data = {
id,
name: name,
description: description,
company_id: company_id
}
closeDialog('edit', data);
}
setId(0)
setDescription('')
setSelectedCompany(null)
}
const handleCancel = () => {
closeDialog('cancel', 'none')
setId(0)
setDescription('')
setSelectedCompany(null)
}
const onChangeCompany = (val) => {
setSelectedCompany(val);
};
const renderForm = () => {
return (
<Form>
<Row>
<Col md={6}>
<FormGroup>
<Label className="capitalize">{t('name')}</Label>
<Input type="text" value={name} onChange={(e) => setName(e.target.value)} placeholder={t('inputName')} />
</FormGroup>
</Col>
<Col md={6}>
<FormGroup>
<Label className="capitalize">Description</Label>
<Input row="4" type="textarea" value={description} onChange={(e) => setDescription(e.target.value)} placeholder={t('inputDescription')} />
</FormGroup>
</Col>
</Row>
{role_name === 'Super Admin' &&
<Row>
<Col md={6}>
<FormGroup>
<Label className="capitalize">
{t('company')}<span style={{ color: "red" }}>*</span>
</Label>
<Select
showSearch
filterOption={(inputValue, option) =>
option.children.toLowerCase().includes(inputValue.toLowerCase())
}
value={selectedCompany}
defaultValue={selectedCompany}
onChange={onChangeCompany}
style={{ width: "100%" }}
>
{listCompany.map((res) => (
<Option key={res.id} value={res.id}>
{res.company_name}
</Option>
))}
</Select>
</FormGroup>
</Col>
</Row>
}
</Form>
)
}
return (
<>
<Modal size="lg" isOpen={openDialog} toggle={toggleDialog}>
<ModalHeader className="capitalize" toggle={closeDialog}>{typeDialog == "Save" ? `Add` : "Edit"} {'uom'}</ModalHeader>
<ModalBody>
{renderForm()}
</ModalBody>
<ModalFooter>
<Button color="primary" onClick={() => handleSave()}>{typeDialog}</Button>{' '}
<Button className="capitalize" color="secondary" onClick={() => handleCancel()}>{t('cancel')}</Button>
</ModalFooter>
</Modal>
</>
)
}
export default DialogForm;
import React, { useEffect, useState } from 'react'
import {
Modal, ModalHeader, ModalBody, ModalFooter,
Button, Form, FormGroup, Label, Input, Col, Row
} from 'reactstrap';
import { Select } from 'antd';
import 'antd/dist/antd.css';
import { useTranslation } from 'react-i18next';
const { Option } = Select;
const DialogForm = ({ openDialog, closeDialog, toggleDialog, typeDialog, dataEdit, company_id, listCompany, role_name }) => {
const [id, setId] = useState(0)
const [name, setName] = useState('')
const [description, setDescription] = useState('')
const [selectedCompany, setSelectedCompany] = useState(null)
const { t } = useTranslation()
useEffect(() => {
if (typeDialog === "Edit") {
setId(dataEdit.id)
setDescription(dataEdit.description)
setName(dataEdit.name)
setSelectedCompany(dataEdit.company_id);
} else {
setId(0)
}
}, [dataEdit, openDialog])
const handleSave = () => {
let data = '';
if (typeDialog === "Save") {
if (role_name === 'Super Admin') {
company_id = parseInt(selectedCompany)
}
data = {
name: name,
description: description,
company_id: parseInt(company_id)
}
closeDialog('save', data);
} else {
if (role_name === 'Super Admin') {
company_id = parseInt(selectedCompany)
}
data = {
id,
name: name,
description: description,
company_id: parseInt(company_id)
}
closeDialog('edit', data);
}
setId(0)
setDescription('')
setSelectedCompany(null)
}
const handleCancel = () => {
closeDialog('cancel', 'none')
setId(0)
setDescription('')
setSelectedCompany(null)
}
const onChangeCompany = (val) => {
setSelectedCompany(val);
};
const renderForm = () => {
return (
<Form>
<Row>
<Col md={6}>
<FormGroup>
<Label className="capitalize">{t('name')}</Label>
<Input type="text" value={name} onChange={(e) => setName(e.target.value)} placeholder={t('inputName')} />
</FormGroup>
</Col>
<Col md={6}>
<FormGroup>
<Label className="capitalize">Description</Label>
<Input row="4" type="textarea" value={description} onChange={(e) => setDescription(e.target.value)} placeholder={t('inputDescription')} />
</FormGroup>
</Col>
</Row>
{role_name === 'Super Admin' &&
<Row>
<Col md={6}>
<FormGroup>
<Label className="capitalize">
{t('company')}<span style={{ color: "red" }}>*</span>
</Label>
<Select
showSearch
filterOption={(inputValue, option) =>
option.children.toLowerCase().includes(inputValue.toLowerCase())
}
value={selectedCompany}
defaultValue={selectedCompany}
onChange={onChangeCompany}
style={{ width: "100%" }}
>
{listCompany.map((res) => (
<Option key={res.id} value={res.id}>
{res.company_name}
</Option>
))}
</Select>
</FormGroup>
</Col>
</Row>
}
</Form>
)
}
return (
<>
<Modal size="lg" isOpen={openDialog} toggle={toggleDialog}>
<ModalHeader className="capitalize" toggle={closeDialog}>{typeDialog == "Save" ? `Add` : "Edit"} {'uom'}</ModalHeader>
<ModalBody>
{renderForm()}
</ModalBody>
<ModalFooter>
<Button color="primary" onClick={() => handleSave()}>{typeDialog}</Button>{' '}
<Button className="capitalize" color="secondary" onClick={() => handleCancel()}>{t('cancel')}</Button>
</ModalFooter>
</Modal>
</>
)
}
export default DialogForm;

2
src/views/SimproV2/Satuan/index.js
Unescape View File

@ -116,7 +116,7 @@ const Satuan = ({ params, ...props }) => {
if (role_name !== "Super Admin") {
payload.columns.push(
{ "name": "company_id", "logic_operator": "=", "value": company_id, "operator": "AND" },
{ "name": "company_id", "logic_operator": "=", "value": parseInt(company_id), "operator": "AND" },
)
} else {
payload.columns.push(

148
src/views/SimproV2/Settings/DialogForm.js
Unescape View File

@ -26,6 +26,8 @@ const DialogForm = ({
addressProp,
emailProp,
userNameProp,
refferalCode,
userProfile
}) => {
const token = window.localStorage.getItem('token');
const [typeDialog, setTypeDialog] = useState(typeDialogProp)
@ -38,15 +40,15 @@ const DialogForm = ({
const [birthdayDate, setBirthdaydate] = useState(birthdayDateProp)
const [idNumber, setIdnumber] = useState(idNumberProp)
const [email, setEmail] = useState(emailProp)
const [password, setPassword] = useState('')
const [refferal, setRefferalCode] = useState('')
const [oldPassword, setOldPassword] = useState('')
const [newPassword, setNewPassword] = useState('')
const [newPasswordConfirm, setNewPasswordConfirm] = useState('')
const [activeTab, setActiveTab] = useState('tab1')
console.log('typeDialogProp',typeDialogProp)
const handleSave = () => {
let data = '';
if (typeDialog === "Personal") {
if (typeDialog === "Personal" && typeDialogProp !== "Refferal") {
data = {
name: name,
phone_number: noHp,
@ -59,14 +61,22 @@ const DialogForm = ({
data.birth_date = birthdayDate;
}
closeDialog('profile', data)
} else if (typeDialog === "Account") {
} else if (typeDialog === "Account" && typeDialogProp !== "Refferal") {
data = {
username: userName,
email: email,
password: newPassword,
}
closeDialog('profile', data)
}
} else {
data = {
code: refferal,
user_id: userProfile.id,
username: userProfile.username,
ktp_number: userProfile.ktp_number
}
closeDialog('refferal_code', data)
}
}
const handleCancel = () => {
@ -85,6 +95,19 @@ const DialogForm = ({
)
}
function generateRandomString(length) {
const characters = 'ABCDEFGHIJKLMNOPQRSTUVWXYZ';
let result = '';
for (let i = 0; i < length; i++) {
result += characters.charAt(Math.floor(Math.random() * characters.length));
}
return result;
}
function generateReferralCode() {
const newReferralCode = generateRandomString(6);
setRefferalCode(newReferralCode);
}
const renderForm = () => {
return (
@ -197,45 +220,46 @@ const DialogForm = ({
}
return (
<>
<Modal size="lg" isOpen={openDialog} toggle={toggleDialog}>
<ModalHeader className="capitalize" toggle={closeDialog}>
Update {typeDialog == "Personal" ? `Personal` : "Account"} Data
</ModalHeader>
<ModalBody>
<Modal size="lg" isOpen={openDialog} toggle={toggleDialog}>
<ModalHeader className="capitalize" toggle={closeDialog}>
Update {typeDialog == "Personal" ? `Personal` : "Account"} Data
</ModalHeader>
<ModalBody>
{typeDialogProp !== 'Refferal' ? (
<>
<Nav tabs>
<NavItem>
<NavLink
onClick={() => {
setActiveTab("tab1");
setTypeDialog("Personal");
}}
active={activeTab === "tab1"}
>
Personal
</NavLink>
</NavItem>
<NavItem>
<NavLink
onClick={() => {
setActiveTab("tab2");
setTypeDialog("Account");
}}
active={activeTab === "tab2"}
>
Account
</NavLink>
</NavItem>
<NavItem>
<NavLink
onClick={() => {
setActiveTab("tab3");
setTypeDialog("Setting");
}}
active={activeTab === "tab3"}
>
Setting
</NavLink>
<NavItem>
<NavLink
onClick={() => {
setActiveTab("tab1");
setTypeDialog("Personal");
}}
active={activeTab === "tab1"}
>
Personal
</NavLink>
</NavItem>
<NavItem>
<NavLink
onClick={() => {
setActiveTab("tab2");
setTypeDialog("Account");
}}
active={activeTab === "tab2"}
>
Account
</NavLink>
</NavItem>
<NavItem>
<NavLink
onClick={() => {
setActiveTab("tab3");
setTypeDialog("Setting");
}}
active={activeTab === "tab3"}
>
Setting
</NavLink>
</NavItem>
</Nav>
<TabContent activeTab={activeTab}>
@ -249,13 +273,37 @@ const DialogForm = ({
{renderFormSetting()}
</TabPane>
</TabContent>
</ModalBody>
<ModalFooter>
<Button color="primary" onClick={() => handleSave()}>{typeDialog == "Profile" ? `Profile` : "Save"}</Button> {' '}
<Button className="capitalize" color="secondary" onClick={() => handleCancel()}>Batal</Button>
</ModalFooter>
</Modal>
</>
</>
):(
<Form>
<Row>
<Col md={12}>
<span style={{ color: "red" }}>*</span> Wajib diisi.
</Col>
</Row>
<Row>
<Col md={12}>
<FormGroup>
<Label className="capitalize">Refferal Code</Label>
<Row>
<Col md={8}>
<Input maxLength={16} type="text" value={refferal || refferalCode} onChange={(e) => setRefferalCode(e.target.value)} placeholder={'Input refferal code'} />
</Col>
<Col md={4}>
<Button color="primary" onClick={generateReferralCode}>Generate</Button>
</Col>
</Row>
</FormGroup>
</Col>
</Row>
</Form >
)}
</ModalBody>
<ModalFooter>
<Button color="primary" onClick={() => handleSave()}>{typeDialogProp !== 'Refferal' ? typeDialog == "Profile" ? `Profile` : "Save" : "Generate Code"}</Button> {' '}
<Button className="capitalize" color="secondary" onClick={() => handleCancel()}>Batal</Button>
</ModalFooter>
</Modal>
)

86
src/views/SimproV2/Settings/index.js
Unescape View File

@ -5,14 +5,11 @@ import axios from "../../../const/interceptorApi"
import { Card, CardBody, CardHeader, Col, Row, Input, Table, Button } from 'reactstrap';
import { NotificationContainer, NotificationManager } from 'react-notifications';
import { Pagination, Tooltip } from 'antd';
import { USER_EDIT, SATUAN_ADD, SATUAN_EDIT, SATUAN_DELETE, SATUAN_SEARCH } from '../../../const/ApiConst';
import { USER_EDIT, USER_GET_ID, REFFERAL_GET_ID, REFFERAL_ADD, REFFERAL_EDIT } from '../../../const/ApiConst';
import profile from '../../../assets/img/profile.png'
import DialogForm from './DialogForm'
import { ROLE_SEARCH, BASE_OSPRO } from '../../../const/ApiConst'
const Setting = ({ params }) => {
const token = localStorage.getItem("token")
const config = {
@ -21,17 +18,13 @@ const Setting = ({ params }) => {
"Authorization": `Bearer ${token}`
}
}
const pageName = params.name;
const [openDialog, setOpenDialog] = useState(false)
const [typeDialog, setTypeDialog] = useState('Personal')
const [id, setId] = useState(0)
const [roleList, setRoleList] = useState([])
const [userProfile, setUserprofile] = useState(null)
const [refferal, setReferralCode] = useState(null)
const [userName, setUserName] = useState("")
const [name, setName] = useState('')
const [noHp, setNohp] = useState("")
@ -44,7 +37,7 @@ const Setting = ({ params }) => {
const [role, setRole] = useState("")
const [email, setEmail] = useState("")
const [employeeType, setEmployeeType] = useState("")
const [isCopied, setIsCopied] = useState(false);
useEffect(() => {
getDataProfileUser();
@ -68,7 +61,7 @@ const Setting = ({ params }) => {
setEmployeeType(userProfile?.employee_type);
}
}, [userProfile])
}, [userProfile, typeDialog])
const handleOpenDialog = (type) => {
setOpenDialog(true)
@ -78,12 +71,13 @@ const Setting = ({ params }) => {
const handleCloseDialog = (type, data) => {
if (type === "profile") {
saveProfile(data);
} else if(type === "refferal_code") {
updateRefferal(data);
}
setOpenDialog(false)
}
const saveProfile = async (data) => {
let urlEdit = USER_EDIT(id)
const formData = data
@ -99,6 +93,20 @@ const Setting = ({ params }) => {
}
}
const updateRefferal = async (data) => {
let urlEdit = REFFERAL_EDIT(id)
const formData = data
const result = await axios.put(urlEdit, formData, config)
.then(res => res)
.catch((error) => error.response);
if (result && result.data && result.data.code === 200) {
getDataRefferal(data.user_id, data.username, data.ktp_number);
NotificationManager.success(`Code refferal berhasil diedit`, 'Success!!');
} else {
NotificationManager.error(`Code refferal gagal di edit`, `Failed!!`);
}
}
const toggleAddDialog = () => {
setOpenDialog(!openDialog)
}
@ -121,10 +129,7 @@ const Setting = ({ params }) => {
const getDataProfileUser = async () => {
const id = localStorage.getItem("user_id")
const url = `${BASE_OSPRO}/api/human-resource/edit/${id}`
const url = USER_GET_ID(id);
const result = await axios
.get(url, config)
.then((res) => res)
@ -132,11 +137,49 @@ const Setting = ({ params }) => {
if (result && result.data && result.data.code == 200) {
let dataRes = result.data.data;
setUserprofile(dataRes);
await getDataRefferal(id, dataRes.username, dataRes.ktp_number);
} else {
NotificationManager.error("Gagal Mengambil Data!!", "Failed");
}
};
const getDataRefferal = async (user_id, username, ktp_number) => {
const url = REFFERAL_GET_ID(user_id);
const result = await axios
.get(url, config)
.then((res) => res)
.catch((error) => error.response);
if (result && result.data && result.data.code == 200) {
let dataRes = result.data.data;
setReferralCode(dataRes);
} else {
saveRefferalCode(user_id, username, ktp_number);
};
}
const saveRefferalCode = async (user_id, username, ktp_number) => {
const formData = {
'id': parseInt(user_id),
'code': username + ktp_number.substring(0, 4),
'amount': 0
}
const result = await axios
.post(REFFERAL_ADD, formData, config)
.then((res) => res)
.catch((error) => error.response);
if (result && result.data && result.data.code == 200) {
await getDataRefferal(user_id, username, ktp_number);
}
}
function copyToClipboard(text) {
navigator.clipboard.writeText(text).then(() => {
setIsCopied(true);
setTimeout(() => setIsCopied(false), 2000);
}, (err) => {
console.error('Gagal menyalin teks ke clipboard: ', err);
});
}
return (
@ -158,6 +201,8 @@ const Setting = ({ params }) => {
addressProp={address}
emailProp={email}
userNameProp={userName}
refferalCode={refferal?.code}
userProfile={userProfile}
/>
<Card>
@ -233,6 +278,15 @@ const Setting = ({ params }) => {
<td><b>Tanggal Lahir &nbsp; </b></td>
<td>: &nbsp; {birthdayDate}</td>
</tr>
<tr>
<td><b>Referral Code &nbsp; </b></td>
<td>: &nbsp; {refferal?.code} <small style={{ color:'blue', cursor: 'pointer' }} onClick={() => copyToClipboard(refferal?.code)}>{isCopied ? 'Copied' : 'Copy'}</small></td>
<td>
<Tooltip title='Custom Refferal Code'>
<Button color="success" onClick={() => handleOpenDialog('Refferal')}>Custom Refferal Code</Button>
</Tooltip>
</td>
</tr>
</tbody>
<br />
</Col>

Write Preview
Loading…
Cancel
Save