|  | @@ -3,7 +3,7 @@ import ContentWrapper from "@/components/Layout/ContentWrapper";
 | 
	
		
			
				|  |  |  import Header from "@/components/Main/Header";
 | 
	
		
			
				|  |  |  import { getLogPT } from "@/actions/log";
 | 
	
		
			
				|  |  |  import { getPT } from "@/actions/PT";
 | 
	
		
			
				|  |  | -import { Row, Col, ModalHeader, ModalBody, ModalFooter, Modal, FormFeedback, Button } from "reactstrap";
 | 
	
		
			
				|  |  | +import { Row, Col, ModalHeader, ModalBody, ModalFooter, Modal, FormFeedback, Button, Alert } from "reactstrap";
 | 
	
		
			
				|  |  |  import Timeline from "@/components/Main/Timeline";
 | 
	
		
			
				|  |  |  import { connect } from "react-redux";
 | 
	
		
			
				|  |  |  import Loader from "@/components/Common/Loader";
 | 
	
	
		
			
				|  | @@ -21,7 +21,10 @@ class DetailPT extends Component {
 | 
	
		
			
				|  |  |  		ddselected: false,
 | 
	
		
			
				|  |  |  		modalOTP: false,
 | 
	
		
			
				|  |  |  		loadingProses: false,
 | 
	
		
			
				|  |  | -		otp: ""
 | 
	
		
			
				|  |  | +		otp: "",
 | 
	
		
			
				|  |  | +		sendingOTP: false,
 | 
	
		
			
				|  |  | +		newphone: "",
 | 
	
		
			
				|  |  | +
 | 
	
		
			
				|  |  |  	}
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  |  
 | 
	
	
		
			
				|  | @@ -41,18 +44,34 @@ class DetailPT extends Component {
 | 
	
		
			
				|  |  |  	handleSubmitTelepon = async () => {
 | 
	
		
			
				|  |  |  		this.setState({ loadingProses: true })
 | 
	
		
			
				|  |  |  		const { token } = this.props
 | 
	
		
			
				|  |  | -		await createotp({ no_hp: this.state.phone }, token)
 | 
	
		
			
				|  |  | +
 | 
	
		
			
				|  |  | +		if (this.state.newphone.length) {
 | 
	
		
			
				|  |  | +			await createotp({ no_hp: this.state.newphone }, token)
 | 
	
		
			
				|  |  | +		} else {
 | 
	
		
			
				|  |  | +			await createotp({ no_hp: this.state.phone }, token)
 | 
	
		
			
				|  |  | +		}
 | 
	
		
			
				|  |  | +
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  |  		this.setState({ modalPhone: false, modalOTP: true })
 | 
	
		
			
				|  |  |  	}
 | 
	
		
			
				|  |  | +	handleOTPagain = async () => {
 | 
	
		
			
				|  |  | +		this.setState({ sendingOTP: true })
 | 
	
		
			
				|  |  | +		const { token } = this.props
 | 
	
		
			
				|  |  | +		await createotp({ no_hp: this.state.newphone }, token)
 | 
	
		
			
				|  |  | +		this.setState({ modalPhone: false, modalOTP: true })
 | 
	
		
			
				|  |  | +		setTimeout(() => {
 | 
	
		
			
				|  |  | +			this.setState({
 | 
	
		
			
				|  |  | +				sendingOTP: !this.state.sendingOTP
 | 
	
		
			
				|  |  | +			});
 | 
	
		
			
				|  |  | +		}, 5000);
 | 
	
		
			
				|  |  | +	}
 | 
	
		
			
				|  |  |  	otpClose = () => {
 | 
	
		
			
				|  |  |  		this.setState({ modalOTP: false, ddselected: false, loadingProses: false, otp: "" })
 | 
	
		
			
				|  |  | -		// localStorage.setItem("closeverif", "true");
 | 
	
		
			
				|  |  |  	}
 | 
	
		
			
				|  |  |  	handleSubmitOtp = async () => {
 | 
	
		
			
				|  |  |  		const { token } = this.props
 | 
	
		
			
				|  |  | -		const create = await createkontak({ otp: this.state.otp, no_hp: this.state.phone }, token)
 | 
	
		
			
				|  |  | +		const create = await createkontak({ otp: this.state.otp, no_hp: this.state.newphone }, token)
 | 
	
		
			
				|  |  |  		if (create.error) {
 | 
	
		
			
				|  |  |  			swal.fire({
 | 
	
		
			
				|  |  |  				title: create.error.message,
 | 
	
	
		
			
				|  | @@ -66,7 +85,9 @@ class DetailPT extends Component {
 | 
	
		
			
				|  |  |  				icon: "success",
 | 
	
		
			
				|  |  |  				confirmButtonColor: "#3e3a8e",
 | 
	
		
			
				|  |  |  			});
 | 
	
		
			
				|  |  | +
 | 
	
		
			
				|  |  |  			this.setState({ ddselected: false, modalOTP: false, loadingProses: false, otp: "" })
 | 
	
		
			
				|  |  | +			window.location.reload(false);
 | 
	
		
			
				|  |  |  		}
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  |  	}
 | 
	
	
		
			
				|  | @@ -92,8 +113,8 @@ class DetailPT extends Component {
 | 
	
		
			
				|  |  |  							<div className="border-2">
 | 
	
		
			
				|  |  |  								<PhoneInput
 | 
	
		
			
				|  |  |  									country={'id'}
 | 
	
		
			
				|  |  | -									value={this.state.kontakPT?.data.map((data) => (data.no_hp)) || this.state.phone}
 | 
	
		
			
				|  |  | -									onChange={phone => this.setState({ phone })} />
 | 
	
		
			
				|  |  | +									value={this.state.phone || this.state.newphone}
 | 
	
		
			
				|  |  | +									onChange={newphone => this.setState({ newphone })} />
 | 
	
		
			
				|  |  |  							</div>
 | 
	
		
			
				|  |  |  						</div>
 | 
	
		
			
				|  |  |  						<div className="">
 | 
	
	
		
			
				|  | @@ -125,6 +146,7 @@ class DetailPT extends Component {
 | 
	
		
			
				|  |  |  				</Modal>
 | 
	
		
			
				|  |  |  				<Modal isOpen={this.state.modalOTP} style={{ width: '400px' }} >
 | 
	
		
			
				|  |  |  					<ModalBody>
 | 
	
		
			
				|  |  | +
 | 
	
		
			
				|  |  |  						<div className="modalLoginPT-a">
 | 
	
		
			
				|  |  |  							<img
 | 
	
		
			
				|  |  |  								className="icon-triangle-onModalPT mt-auto mb-auto"
 | 
	
	
		
			
				|  | @@ -133,6 +155,13 @@ class DetailPT extends Component {
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  |  							<h3 className=" font-color-black">Masukan Kode OTP</h3>
 | 
	
		
			
				|  |  |  						</div>
 | 
	
		
			
				|  |  | +						{this.state.sendingOTP === true &&
 | 
	
		
			
				|  |  | +							<div>
 | 
	
		
			
				|  |  | +								<Alert color="warning">
 | 
	
		
			
				|  |  | +									Berhasil Kirim Kode OTP
 | 
	
		
			
				|  |  | +								</Alert>
 | 
	
		
			
				|  |  | +							</div>
 | 
	
		
			
				|  |  | +						}
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  |  						{/* <div className="modalLoginPT-b"> */}
 | 
	
		
			
				|  |  |  
 | 
	
	
		
			
				|  | @@ -145,8 +174,12 @@ class DetailPT extends Component {
 | 
	
		
			
				|  |  |  								renderSeparator={<span className=" font-color-black font-weight-bold mr-2 ml-2">-</span>}
 | 
	
		
			
				|  |  |  								renderInput={(props) => <input {...props} style={{ width: "50px", height: "50px", textAlign: "center", marginLeft: "auto", marginRight: "auto", borderRadius: "7px", fontSize: "30px" }} />}
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  | -							/>   <p className="  mt-3">
 | 
	
		
			
				|  |  | -								*Kode OTP terkirim ke nomor WA {this.state.phone}
 | 
	
		
			
				|  |  | +							/>
 | 
	
		
			
				|  |  | +							<p className="  mt-3">
 | 
	
		
			
				|  |  | +								*Kode OTP terkirim ke nomor WA {this.state.newphone || this.state.phone}
 | 
	
		
			
				|  |  | +							</p>
 | 
	
		
			
				|  |  | +							<p className="  mt-3 ">
 | 
	
		
			
				|  |  | +								Jika Anda belum menerima kode OTP, <span className=" btn-link" onClick={this.handleOTPagain}>kirimkan ulang kode OTP</span>
 | 
	
		
			
				|  |  |  							</p>
 | 
	
		
			
				|  |  |  							<FormFeedback invalid={this.state.error}>
 | 
	
		
			
				|  |  |  								Kode verifikasi harus diisi
 | 
	
	
		
			
				|  | @@ -162,7 +195,7 @@ class DetailPT extends Component {
 | 
	
		
			
				|  |  |  							<Button className="btn-login float-right mr-4" style={{ width: "40%" }} color onClick={this.handleSubmitOtp}
 | 
	
		
			
				|  |  |  							>
 | 
	
		
			
				|  |  |  								<span className=" font-color-white">
 | 
	
		
			
				|  |  | -									Kirim
 | 
	
		
			
				|  |  | +									Simpan
 | 
	
		
			
				|  |  |  								</span>
 | 
	
		
			
				|  |  |  							</Button>
 | 
	
		
			
				|  |  |  						</div>
 |