KoPKB/lelong-web-pembida
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Limit upload size to 2.2MB

Browse Source
This commit is contained in:
Amir
2023-01-25 06:55:15 +08:00
parent b8290eec88
commit eb3c889862
1 changed files with 75 additions and 45 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/result/ResultDetail.vue
+75 -45
View File
@@ -195,9 +195,19 @@
<input
class="form-control"
type="file"
accept="image/*"
accept="image/png, image/jpg, image/jpeg"
v-on:change="selectPhoto"
/>
<div
style="font-size: 13px"
class="fst-italic text-danger row"
v-if="v$.fileSize.$error"
>
<div>Gambar mesti tidak melebihi 2MB.</div>
<div>
Jenis gambar yang diterima adalah PNG dan JPG.
</div>
</div>
</div>
<template #footer>
<Button
@@ -210,6 +220,7 @@
label="Simpan"
icon="pi pi-check"
iconPos="right"
:loading="isLoadingButton"
@click="addPhotoResit()"
/>
</template>
@@ -509,6 +520,8 @@ import VueHtml2pdf from "vue-html2pdf";
import axios from "axios";
import ItemMasterImageModal from "../list/ItemMasterImageModal.vue";
import ReceiptImage from "../pay/ReceiptImage.vue";
import { required, integer, between } from "@vuelidate/validators";
import useVuelidate from "@vuelidate/core";
export default {
components: {
@@ -517,6 +530,8 @@ export default {
},
data() {
return {
v$: useVuelidate(),
isLoadingButton: false,
lists: [],
tarikhLelong: "",
loading: false,
@@ -530,6 +545,7 @@ export default {
suratHak: "",
isSuccessHak: false,
isDisplayFileUpload: false,
fileSize: 0,
formResit: {
user_id: localStorage.getItem("id"),
lelong_id: this.$route.params.lelongId,
@@ -538,6 +554,11 @@ export default {
},
};
},
validations() {
return {
fileSize: { required, integer, betweenValue: between(1, 2200000) },
};
},
created() {
this.lelongId = this.$route.params.lelongId;
this.statusPayment = this.$route.params.statusPayment;
@@ -592,53 +613,62 @@ export default {
this.reloadImageComponent += 1;
},
selectPhoto(e) {
console.log(e);
console.log(e.target.files[0].size);
this.fileSize = e.target.files[0].size;
this.formResit.gambarResit = e.target.files[0];
},
addPhotoResit() {
var resitFormData = new FormData();
resitFormData.append("gambarResit", this.formResit.gambarResit);
resitFormData.append("lelong_id", this.formResit.lelong_id);
resitFormData.append("user_id", this.formResit.user_id);
resitFormData.append("kodcaw", this.formResit.kodcaw);
console.log(this.formResit);
axios
.post("/addPhotoResit", resitFormData, {
headers: {
Authorization: "Bearer " + localStorage.getItem("token"),
},
})
.then((response) => {
this.liveData();
this.isDisplayFileUpload = false;
if (response.data.success == true) {
this.$swal.fire({
icon: "success",
title: "Gambar Resit Berjaya Di Muat Naik",
confirmButtonColor: "#344871",
confirmButtonText: "OK",
allowOutsideClick: false,
allowEscapeKey: false,
});
this.componentKey += 1;
} else if (response.data.success == false) {
console.log(response);
this.$swal.fire({
toast: true,
icon: "error",
title: "Gagal! Sila refresh page semula.",
animation: false,
position: "bottom",
showConfirmButton: false,
timer: 5000,
timerProgressBar: true,
});
this.componentKey += 1;
}
})
.catch((error) => {
alert(error);
});
this.v$.$validate();
if (!this.v$.$error) {
this.isLoadingButton = true;
var resitFormData = new FormData();
resitFormData.append("gambarResit", this.formResit.gambarResit);
resitFormData.append("lelong_id", this.formResit.lelong_id);
resitFormData.append("user_id", this.formResit.user_id);
resitFormData.append("kodcaw", this.formResit.kodcaw);
console.log(this.formResit);
axios
.post("/addPhotoResit", resitFormData, {
headers: {
Authorization: "Bearer " + localStorage.getItem("token"),
},
})
.then((response) => {
this.isLoadingButton = false;
this.fileSize = 0;
this.liveData();
this.isDisplayFileUpload = false;
if (response.data.success == true) {
this.$swal.fire({
icon: "success",
title: "Gambar Resit Berjaya Di Muat Naik",
confirmButtonColor: "#344871",
confirmButtonText: "OK",
allowOutsideClick: false,
allowEscapeKey: false,
});
this.componentKey += 1;
} else if (response.data.success == false) {
this.isLoadingButton = false;
console.log(response);
this.$swal.fire({
toast: true,
icon: "error",
title: "Gagal! Sila refresh page semula.",
animation: false,
position: "bottom",
showConfirmButton: false,
timer: 5000,
timerProgressBar: true,
});
this.componentKey += 1;
}
})
.catch((error) => {
alert(error);
this.isLoadingButton = false;
});
}
},
openModalFileUpload(e) {
this.isDisplayFileUpload = true;