|
|
@@ -42,7 +42,8 @@ const checkIfFilesAreCorrectType = (files) => {
|
|
|
};
|
|
|
|
|
|
const docSchema = Yup.object().shape({
|
|
|
- dokumen: Yup.array().max(2, "Maximal 2 dokumen").required("Required").test("filesize", "Maksimal ukuran dokumen 15mb", checkIfFilesAreTooBig),
|
|
|
+ dokumen: Yup.array().max(1, "Maximal 1 dokumen").required("Required").test("filesize", "Maksimal ukuran dokumen 15mb", checkIfFilesAreTooBig),
|
|
|
+ dokumenRekom: Yup.array().max(1, "Maximal 1 dokumen").required("Required").test("filesize", "Maksimal ukuran dokumen 15mb", checkIfFilesAreTooBig),
|
|
|
});
|
|
|
let Dropzone = null;
|
|
|
class DropzoneWrapper extends Component {
|
|
|
@@ -63,6 +64,7 @@ class DetailPencabutanSanksi extends Component {
|
|
|
super(props);
|
|
|
this.state = {
|
|
|
files: [],
|
|
|
+ filesRekom: [],
|
|
|
sanksi: {},
|
|
|
pt: null,
|
|
|
error: null,
|
|
|
@@ -90,19 +92,29 @@ class DetailPencabutanSanksi extends Component {
|
|
|
stat: "Added " + selectedFile.length + " file(s)",
|
|
|
});
|
|
|
const selectFile = this.state.selectedFile
|
|
|
- this.setState(prevState => ({
|
|
|
- files: [...prevState.files, ...selectFile]
|
|
|
- }))
|
|
|
+ // this.setState(prevState => ({
|
|
|
+ // files: [...prevState.files, ...selectFile]
|
|
|
+ // }))
|
|
|
+ this.setState({ files: selectFile })
|
|
|
};
|
|
|
-
|
|
|
- uploadFiles = (e) => {
|
|
|
- e.preventDefault();
|
|
|
- e.stopPropagation();
|
|
|
+ onDropRekom = (selectedFile) => {
|
|
|
this.setState({
|
|
|
- stat: this.state.files.length ? "Dropzone ready to upload " + this.state.files.length + " file(s)" : "No files added.",
|
|
|
+ selectedFile: selectedFile.map((file) =>
|
|
|
+ Object.assign(file, {
|
|
|
+ preview: URL.createObjectURL(file),
|
|
|
+ })
|
|
|
+ ),
|
|
|
+ stat: "Added " + selectedFile.length + " file(s)",
|
|
|
});
|
|
|
+ const selectFile = this.state.selectedFile
|
|
|
+ // this.setState(prevState => ({
|
|
|
+ // filesRekom: [...prevState.filesRekom, ...selectFile]
|
|
|
+ // }))
|
|
|
+ this.setState({ filesRekom: selectFile })
|
|
|
};
|
|
|
|
|
|
+
|
|
|
+
|
|
|
clearFiles = (e) => {
|
|
|
e.preventDefault();
|
|
|
e.stopPropagation();
|
|
|
@@ -113,7 +125,16 @@ class DetailPencabutanSanksi extends Component {
|
|
|
files: [],
|
|
|
});
|
|
|
};
|
|
|
-
|
|
|
+ clearFilesRekom = (e) => {
|
|
|
+ e.preventDefault();
|
|
|
+ e.stopPropagation();
|
|
|
+ this.setState({
|
|
|
+ stat: this.state.filesRekom.length ? this.state.filesRekom.length + " file(s) cleared." : "No files to clear.",
|
|
|
+ });
|
|
|
+ this.setState({
|
|
|
+ filesRekom: [],
|
|
|
+ });
|
|
|
+ };
|
|
|
handleKirim = async (data) => {
|
|
|
const getToken = await getCsrf();
|
|
|
const _csrf = getToken.token;
|
|
|
@@ -122,6 +143,9 @@ class DetailPencabutanSanksi extends Component {
|
|
|
data.dokumen.forEach((e) => {
|
|
|
formdata.append("dokumen", e);
|
|
|
});
|
|
|
+ data.dokumenRekom.forEach((e) => {
|
|
|
+ formdata.append("dokumen_rekomendasi", e);
|
|
|
+ });
|
|
|
const id = toast.loading("Please wait...");
|
|
|
// await FinalisasiPerbaikan(token, query.id, { is_finalisasi: "true" }, _csrf)
|
|
|
const added = await addCabutSanksi(token, query.id, formdata, _csrf);
|
|
|
@@ -134,11 +158,16 @@ class DetailPencabutanSanksi extends Component {
|
|
|
});
|
|
|
}
|
|
|
};
|
|
|
-
|
|
|
|
|
|
- render() {
|
|
|
- const { files, sanksi, pt } = this.state;
|
|
|
|
|
|
+ render() {
|
|
|
+ const { files, sanksi, pt, filesRekom } = this.state;
|
|
|
+ const thumbsRekom = filesRekom.map((file, index) => (
|
|
|
+ <div md={3} key={index}>
|
|
|
+ {/* <img className="img-fluid mb-2" src={file.preview} alt="Item" /> */}
|
|
|
+ <span className="text-left">{index + 1}.{file.name}</span>
|
|
|
+ </div>
|
|
|
+ ));
|
|
|
const thumbs = files.map((file, index) => (
|
|
|
<div md={3} key={index}>
|
|
|
{/* <img className="img-fluid mb-2" src={file.preview} alt="Item" /> */}
|
|
|
@@ -177,6 +206,7 @@ class DetailPencabutanSanksi extends Component {
|
|
|
<Formik
|
|
|
initialValues={{
|
|
|
dokumen: [],
|
|
|
+ dokumenRekom: []
|
|
|
}}
|
|
|
validationSchema={docSchema}
|
|
|
onSubmit={this.handleKirim}
|
|
|
@@ -184,7 +214,7 @@ class DetailPencabutanSanksi extends Component {
|
|
|
{() => (
|
|
|
<Form className="form-horizontal">
|
|
|
<FormGroup>
|
|
|
- <label className="row-form-label">Upload Dokumen:</label>
|
|
|
+ <label className="row-form-label"><span className=" font-12 font-weight-bold">Surat permohonan pencabutan sanksi :</span></label>
|
|
|
<div className=" font-color-black block">Note : Dokumen perbaikan akan diperiksa setelah surat permohonan pencabutan sanksi diunggah</div>
|
|
|
<div className="row-md-10">
|
|
|
<Field name="dokumen">
|
|
|
@@ -225,9 +255,51 @@ class DetailPencabutanSanksi extends Component {
|
|
|
<ErrorMessage name="dokumen" component="div" className="form-text text-danger" />
|
|
|
</div>
|
|
|
</FormGroup>
|
|
|
+ <FormGroup>
|
|
|
+ <label className="row-form-label"><span className=" font-12 font-weight-bold">Rekomendasi pencabutan sanksi dari LLDIKTI :</span></label>
|
|
|
+ <div className="row-md-10">
|
|
|
+ <Field name="dokumenRekom">
|
|
|
+ {({ field, form }) => (
|
|
|
+ <DropzoneWrapper
|
|
|
+ className=""
|
|
|
+ onDrop={(e) => {
|
|
|
+ this.onDropRekom(e);
|
|
|
+ form.setFieldValue(field.name, e);
|
|
|
+ }}
|
|
|
+ >
|
|
|
+ {({ getRootProps, getInputProps, isDragActive }) => {
|
|
|
+ return (
|
|
|
+ <div {...getRootProps()} className={"dropzone card" + (isDragActive ? "dropzone-drag-active" : "")}>
|
|
|
+ <input {...getInputProps()} />
|
|
|
+ <div className="dropzone-previews flex">
|
|
|
+ <div className="dropzone-style-1">
|
|
|
+ <div className="center-ver-hor dropzone-previews flex">{this.state.filesRekom.length > 0 ? <Row><span className="text-left">{thumbsRekom
|
|
|
+ }</span></Row> :
|
|
|
+ <div className="text-center fa-2x icon-cloud-upload mr-2 ">
|
|
|
+ <h5 className="text-center dz-default dz-message">Klik untuk upload dokumen</h5>
|
|
|
+ </div>
|
|
|
+ }
|
|
|
+ </div>
|
|
|
+ </div> </div>
|
|
|
+ <div className="d-flex align-items-center">
|
|
|
+ <small className="ml-auto">
|
|
|
+ <button type="button" className="btn btn-link" onClick={this.clearFilesRekom}>
|
|
|
+ Clear files
|
|
|
+ </button>
|
|
|
+ </small>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ );
|
|
|
+ }}
|
|
|
+ </DropzoneWrapper>
|
|
|
+ )}
|
|
|
+ </Field>
|
|
|
+ <ErrorMessage name="dokumenRekom" component="div" className="form-text text-danger" />
|
|
|
+ </div>
|
|
|
+ </FormGroup>
|
|
|
<FormGroup>
|
|
|
<div className="row-xl-10">
|
|
|
- <Button color className="color-3e3a8e" disabled={ sanksi.data.is_finalisasi === false || false||lastPengajuan?.index + 1 === sanksi?.data?.index_perbaikan} type="submit">
|
|
|
+ <Button color className="color-3e3a8e" disabled={sanksi.data.is_finalisasi === false || false || lastPengajuan?.index + 1 === sanksi?.data?.index_perbaikan} type="submit">
|
|
|
<span className="font-color-white">
|
|
|
Kirim
|
|
|
</span>
|
|
|
@@ -250,7 +322,7 @@ class DetailPencabutanSanksi extends Component {
|
|
|
{sanksi.data && (
|
|
|
<Row>
|
|
|
<Col>
|
|
|
- <Riwayat data={sanksi.data?.riwayat_pengajuan_cabut_sanksi } />
|
|
|
+ <Riwayat data={sanksi.data?.riwayat_pengajuan_cabut_sanksi} />
|
|
|
</Col>
|
|
|
</Row>
|
|
|
)}
|