diff --git a/src/components/upload/index.vue b/src/components/upload/index.vue
index 3654125..eca6571 100644
--- a/src/components/upload/index.vue
+++ b/src/components/upload/index.vue
@@ -2,54 +2,59 @@
<div>
<a-upload
:action="`${$upload}`"
- accept='.jpg,.JPG,.png,.PNG,.jpeg,.JPEG'
+ accept=".jpg,.JPG,.png,.PNG,.jpeg,.JPEG"
list-type="picture-card"
:headers="uploadHeaders"
:file-list="fileList"
@preview="handlePreview"
@change="handleChange"
+ :beforeUpload="beforeUpload"
>
<div v-if="fileList.length < limit">
<a-icon type="plus" />
<div class="ant-upload-text">上传图片</div>
</div>
</a-upload>
- <imgModal :previewVisible='previewVisible' :previewImage='previewImage' @handleCancel='handleCancel'/>
+ <imgModal
+ :previewVisible="previewVisible"
+ :previewImage="previewImage"
+ @handleCancel="handleCancel"
+ />
</div>
</template>
<script>
-import imgModal from "./imgModal.vue"
+import imgModal from "./imgModal.vue";
function getBase64(file) {
return new Promise((resolve, reject) => {
const reader = new FileReader();
reader.readAsDataURL(file);
reader.onload = () => resolve(reader.result);
- reader.onerror = error => reject(error);
+ reader.onerror = (error) => reject(error);
});
}
import store from "@/store";
export default {
- components:{
- imgModal
+ components: {
+ imgModal,
},
- props:{
- fileList:Array,
- limit:{
- type:Number,
- default:1
- }
+ props: {
+ fileList: Array,
+ limit: {
+ type: Number,
+ default: 1,
+ },
},
data() {
- return{
+ return {
previewVisible: false,
- previewImage: '',
+ previewImage: "",
uploadHeaders: {
- "manage-login-token": store.getters.getToken
- }
- }
+ "manage-login-token": store.getters.getToken,
+ },
+ };
},
- methods:{
+ methods: {
async handlePreview(file) {
if (!file.url && !file.preview) {
file.preview = await getBase64(file.originFileObj);
@@ -57,15 +62,24 @@ export default {
this.previewImage = file.url || file.preview;
this.previewVisible = true;
},
- handleCancel(){
+ handleCancel() {
this.previewVisible = false;
},
handleChange({ fileList }) {
- this.$emit('handleChange',fileList)
+ this.$emit("handleChange", fileList);
},
- }
+ // 限制50mb
+ beforeUpload(f, l) {
+ const isLt50M = f.size / 1024 / 1024 < 50;
+ if (!isLt50M) {
+ this.$message.error(f.name + "文件大小超出限制，请修改后重新上传");
+ return false;
+ } else {
+ return true;
+ }
+ },
+ },
};
</script>
-<style>
-</style>
\ No newline at end of file
+<style></style>
diff --git a/src/views/Basic/Employee/depend/form.vue b/src/views/Basic/Employee/depend/form.vue
index ab03540..e061194 100644
--- a/src/views/Basic/Employee/depend/form.vue
+++ b/src/views/Basic/Employee/depend/form.vue
@@ -77,6 +77,7 @@
:file-list="idcardfileList"
@preview="handlePreview"
@change="idcardhandleChange"
+ :beforeUpload='beforeUpload'
>
<div v-if="idcardfileList.length < 2">
<!-- <a-icon type="plus" /> -->
@@ -133,6 +134,7 @@
:file-list="fileList"
@preview="handlePreview"
@change="fileChange"
+ :beforeUpload='beforeUpload'
>
<a-button> <a-icon type="upload"/> 点击上传 </a-button>
</a-upload>
@@ -379,6 +381,15 @@ export default {
fileChange(info) {
this.fileList = info.fileList
},
+ beforeUpload(f, l) {
+ const isLt50M = f.size / 1024 / 1024 < 50;
+ if (!isLt50M) {
+ this.$message.error(f.name + "文件大小超出限制，请修改后重新上传");
+ return false;
+ } else {
+ return true;
+ }
+ },
},
watch: {
editId: {
diff --git a/src/views/Basic/EstateInfo/_buildingManage/depend/form.vue b/src/views/Basic/EstateInfo/_buildingManage/depend/form.vue
index 1762372..dfa3234 100644
--- a/src/views/Basic/EstateInfo/_buildingManage/depend/form.vue
+++ b/src/views/Basic/EstateInfo/_buildingManage/depend/form.vue
@@ -36,6 +36,7 @@
:file-list="fileList"
@preview="handlePreview"
@change="fileChange"
+ :beforeUpload='beforeUpload'
>
<a-button> <a-icon type="upload" /> 点击上传 </a-button>
</a-upload>
@@ -62,6 +63,7 @@
:file-list="fileList"
@preview="handlePreview"
@change="fileChange"
+ :beforeUpload='beforeUpload'
>
</a-upload>
<a-modal :visible="previewVisible" :footer="null" @cancel="handleCancel">
@@ -210,6 +212,15 @@ export default {
edit(){// 楼栋修改
this.formType = 2;
},
+ beforeUpload(f, l) {
+ const isLt50M = f.size / 1024 / 1024 < 50;
+ if (!isLt50M) {
+ this.$message.error(f.name + "文件大小超出限制，请修改后重新上传");
+ return false;
+ } else {
+ return true;
+ }
+ },
submit(){// 楼栋提交
let file = []
for(let item of this.fileList){
diff --git a/src/views/Basic/EstateInfo/_houseHoldInfo/depend/addForm.vue b/src/views/Basic/EstateInfo/_houseHoldInfo/depend/addForm.vue
index 452bc8c..5e19d18 100644
--- a/src/views/Basic/EstateInfo/_houseHoldInfo/depend/addForm.vue
+++ b/src/views/Basic/EstateInfo/_houseHoldInfo/depend/addForm.vue
@@ -90,6 +90,7 @@
@preview="handlePreview"
@change="headChange"
:file-list="headList"
+ :beforeUpload="beforeUpload"
>
<div v-if="headList.length < 1">
<a-icon type="plus" />
@@ -110,6 +111,7 @@
@preview="handlePreview"
@change="backChange"
:file-list="backList"
+ :beforeUpload="beforeUpload"
>
<div v-if="backList.length < 1">
<a-icon type="plus" />
@@ -219,6 +221,7 @@
accept='.jpg,.JPG,.png,.PNG,.jpeg,.JPEG'
@preview="handlePreview"
@change="picChange"
+ :beforeUpload="beforeUpload"
:file-list="picList"
>
<div v-if="picList.length < 4">
@@ -372,6 +375,15 @@ export default {
}
})
},
+ beforeUpload(f, l) {
+ const isLt50M = f.size / 1024 / 1024 < 50;
+ if (!isLt50M) {
+ this.$message.error(f.name + "文件大小超出限制，请修改后重新上传");
+ return false;
+ } else {
+ return true;
+ }
+ },
addClose(){
this.$refs.ruleForm.resetFields();
this.$emit('close')
@@ -402,17 +414,6 @@ export default {
handleCancel() {
this.previewVisible = false;
},
- beforeUpload(file) {
- const isJpgOrPng = file.type === 'image/jpeg' || file.type === 'image/png';
- if (!isJpgOrPng) {
- this.$message.error('You can only upload JPG file!');
- }
- const isLt2M = file.size / 1024 / 1024 < 2;
- if (!isLt2M) {
- this.$message.error('Image must smaller than 2MB!');
- }
- return isJpgOrPng && isLt2M;
- },
onChange(value, selectedOptions){
if(value.length > 0){
this.form.manageEstateId = value[value.length - 1];
diff --git a/src/views/Basic/EstateInfo/_houseManage/depend/form.vue b/src/views/Basic/EstateInfo/_houseManage/depend/form.vue
index 6b0f540..7de47ef 100644
--- a/src/views/Basic/EstateInfo/_houseManage/depend/form.vue
+++ b/src/views/Basic/EstateInfo/_houseManage/depend/form.vue
@@ -103,6 +103,7 @@
:file-list="fileList"
@preview="handlePreview"
@change="fileChange"
+ :beforeUpload="beforeUpload"
>
<div v-if="fileList.length < 2">
<!-- <a-icon type="plus" /> -->
@@ -293,6 +294,15 @@ export default {
this.fileList = fileList;
console.log(this.fileList);
},
+ beforeUpload(f, l) {
+ const isLt50M = f.size / 1024 / 1024 < 50;
+ if (!isLt50M) {
+ this.$message.error(f.name + "文件大小超出限制，请修改后重新上传");
+ return false;
+ } else {
+ return true;
+ }
+ },
},
watch: {
editId(val){
diff --git a/src/views/Operation/Announcement/depend/form.vue b/src/views/Operation/Announcement/depend/form.vue
index 31783cf..adbe323 100644
--- a/src/views/Operation/Announcement/depend/form.vue
+++ b/src/views/Operation/Announcement/depend/form.vue
@@ -72,6 +72,7 @@
accept=".doc,.DOC,.xls,.XLS,.xlsx,.XLSX,.pdf,.PDF"
:headers="uploadHeaders"
@change="changeFile"
+ :beforeUpload='beforeUpload'
>
<a-button> <a-icon type="upload" /> 上传附件</a-button>
</a-upload>
@@ -129,6 +130,15 @@ export default {
this.$emit("success");
this.addClose();
},
+ beforeUpload(f, l) {
+ const isLt50M = f.size / 1024 / 1024 < 50;
+ if (!isLt50M) {
+ this.$message.error(f.name + "文件大小超出限制，请修改后重新上传");
+ return false;
+ } else {
+ return true;
+ }
+ },
submit() {
console.log(this.documentList);
// 附件