diff --git a/src/views/admin/meeting/modules/RoomContentModal.vue b/src/views/admin/meeting/modules/RoomContentModal.vue index 3701710..9c032e9 100644 --- a/src/views/admin/meeting/modules/RoomContentModal.vue +++ b/src/views/admin/meeting/modules/RoomContentModal.vue @@ -265,26 +265,28 @@ - - -
- +
+
上传
+ + + + @@ -336,7 +338,10 @@ export default { buildingDetailList: [], // 楼层 roomList: [], // 房间 tenantEnable: false, - parkEnable: false + parkEnable: false, + previewVisible: false, + previewImage: '', + fileList: [] } }, beforeCreate() { @@ -494,38 +499,19 @@ export default { }, moment, // - beforeUpload(file) { - const isJpgOrPng = file.type === 'image/jpeg' || file.type === 'image/png' - if (!isJpgOrPng) { - this.$message.error('You can only upload JPG file!') + async handlePreview(file) { + if (!file.url && !file.preview) { + file.preview = await getBase64FileList(file.originFileObj) } - const isLt2M = file.size / 1024 < 5000 - if (!isLt2M) { - this.$message.error('图片必须小于 5M!') - } - return isJpgOrPng && isLt2M + this.previewImage = file.url || file.preview + this.previewVisible = true }, - handleChange(info) { - if (info.file.status === 'uploading') { - this.loading = true - return - } - if (info.file.status === 'done') { - const { form: { setFieldsValue } } = this - const result = info.file.response - // 设置值 - this.$nextTick(() => { - setFieldsValue({ - // 设置相对路径 - indoorPicUrl: result.fileName - }) - }) - // Get this url from response in real world. - getBase64(info.file.originFileObj, imageUrl => { - this.imageUrl = imageUrl - this.loading = false - }) - } + handleCancel() { + this.previewVisible = false + }, + // 上传banner + handleChangeFileList({ fileList }) { + this.fileList = fileList }, add() { this.form.resetFields() @@ -566,11 +552,15 @@ export default { } // 获取用户信息 this.getUserDetail() - // + // 图片 if (this.mdl.indoorPicUrl) { - this.imageUrl = process.env.VUE_APP_API_BASE_URL + this.mdl.indoorPicUrl + this.mdl.indoorPicUrl = JSON.parse(this.mdl.indoorPicUrl) + this.mdl.indoorPicUrl.forEach((item, i) => { + item.url = process.env.VUE_APP_API_BASE_URL + item.url + }) + this.fileList = this.mdl.indoorPicUrl } else { - this.imageUrl = '' + this.fileList = [] } // this.visible = true @@ -614,6 +604,19 @@ export default { if (!err) { console.log('Received values of form: ', values) this.confirmLoading = true + const indoorPicUrl = [] + this.fileList.forEach((file, index) => { + // 添加原来的 + if (file.hasOwnProperty('name') && file.hasOwnProperty('url') && file.hasOwnProperty('uid')) { + indoorPicUrl.push({ 'name': file.name, 'url': file.name, 'uid': index }) + } + if (file.status === 'done' && file.response.code === 0) { + const data = file.response + indoorPicUrl.push({ 'name': data.fileName, 'url': data.fileName, 'uid': index }) + } + }) + // 多个图片 + values.indoorPicUrl = JSON.stringify(indoorPicUrl) saveRoomContent(values) .then((res) => { if (res.code === 0) { diff --git a/src/views/admin/meeting/modules/ShowroomModal.vue b/src/views/admin/meeting/modules/ShowroomModal.vue index 77ead62..583c442 100644 --- a/src/views/admin/meeting/modules/ShowroomModal.vue +++ b/src/views/admin/meeting/modules/ShowroomModal.vue @@ -165,23 +165,24 @@ - - -
- +
+
上传
+ + + @@ -236,7 +237,10 @@ export default { buildingDetailList: [], // 楼层 roomList: [], // 房间 tenantEnable: false, - parkEnable: false + parkEnable: false, + previewVisible: false, + previewImage: '', + fileList: [] } }, beforeCreate() { @@ -386,39 +390,20 @@ export default { }) }, moment, - - beforeUpload(file) { - const isJpgOrPng = file.type === 'image/jpeg' || file.type === 'image/png' - if (!isJpgOrPng) { - this.$message.error('You can only upload JPG file!') + // + async handlePreview(file) { + if (!file.url && !file.preview) { + file.preview = await getBase64FileList(file.originFileObj) } - const isLt2M = file.size / 1024 < 5000 - if (!isLt2M) { - this.$message.error('图片必须小于 5M!') - } - return isJpgOrPng && isLt2M + this.previewImage = file.url || file.preview + this.previewVisible = true }, - handleChange(info) { - if (info.file.status === 'uploading') { - this.loading = true - return - } - if (info.file.status === 'done') { - const { form: { setFieldsValue } } = this - const result = info.file.response - // 设置值 - this.$nextTick(() => { - setFieldsValue({ - // 设置相对路径 - indoorPicUrl: result.fileName - }) - }) - // Get this url from response in real world. - getBase64(info.file.originFileObj, imageUrl => { - this.imageUrl = imageUrl - this.loading = false - }) - } + handleCancel() { + this.previewVisible = false + }, + // 上传banner + handleChangeFileList({ fileList }) { + this.fileList = fileList }, add() { this.form.resetFields() @@ -459,11 +444,15 @@ export default { } // 获取用户信息 this.getUserDetail() - // + // 图片 if (this.mdl.indoorPicUrl) { - this.imageUrl = process.env.VUE_APP_API_BASE_URL + this.mdl.indoorPicUrl + this.mdl.indoorPicUrl = JSON.parse(this.mdl.indoorPicUrl) + this.mdl.indoorPicUrl.forEach((item, i) => { + item.url = process.env.VUE_APP_API_BASE_URL + item.url + }) + this.fileList = this.mdl.indoorPicUrl } else { - this.imageUrl = '' + this.fileList = [] } this.visible = true this.$nextTick(() => { @@ -480,6 +469,19 @@ export default { if (!err) { console.log('Received values of form: ', values) this.confirmLoading = true + const indoorPicUrl = [] + this.fileList.forEach((file, index) => { + // 添加原来的 + if (file.hasOwnProperty('name') && file.hasOwnProperty('url') && file.hasOwnProperty('uid')) { + indoorPicUrl.push({ 'name': file.name, 'url': file.name, 'uid': index }) + } + if (file.status === 'done' && file.response.code === 0) { + const data = file.response + indoorPicUrl.push({ 'name': data.fileName, 'url': data.fileName, 'uid': index }) + } + }) + // 多个图片 + values.indoorPicUrl = JSON.stringify(indoorPicUrl) saveShowroom(values).then(res => { if (res.code === 0) { this.$message.success('保存成功')