访客页面修改
This commit is contained in:
94
common/upload.js
Normal file
94
common/upload.js
Normal file
@@ -0,0 +1,94 @@
|
|||||||
|
// utils/upload.js
|
||||||
|
|
||||||
|
export const uploadFiles = ({
|
||||||
|
files = [],
|
||||||
|
url = '',
|
||||||
|
name = 'file',
|
||||||
|
formData = {},
|
||||||
|
fileType = 'image',
|
||||||
|
vm, // 关键：传入 vm 以便访问 vuex_token、vuex_remember 等
|
||||||
|
}) => {
|
||||||
|
return new Promise(async (resolve, reject) => {
|
||||||
|
if (!url) return reject(new Error('上传地址不能为空'));
|
||||||
|
if (!Array.isArray(files) || files.length === 0) return reject(new Error('文件列表不能为空'));
|
||||||
|
|
||||||
|
const results = [];
|
||||||
|
for (let i = 0; i < files.length; i++) {
|
||||||
|
const filePath = files[i];
|
||||||
|
try {
|
||||||
|
const res = await uploadSingleFile({
|
||||||
|
filePath,
|
||||||
|
url,
|
||||||
|
name,
|
||||||
|
formData,
|
||||||
|
fileType,
|
||||||
|
vm
|
||||||
|
});
|
||||||
|
results.push(res);
|
||||||
|
} catch (err) {
|
||||||
|
reject(err);
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
resolve(results);
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
function uploadSingleFile({
|
||||||
|
filePath,
|
||||||
|
url,
|
||||||
|
name,
|
||||||
|
formData = {},
|
||||||
|
fileType = 'image',
|
||||||
|
vm
|
||||||
|
}) {
|
||||||
|
return new Promise((resolve, reject) => {
|
||||||
|
const headers = {
|
||||||
|
'x-requested-with': 'XMLHttpRequest',
|
||||||
|
source: 'uniapp',
|
||||||
|
clientId: 'dab457a1ea14411787c240db05bb0832',
|
||||||
|
};
|
||||||
|
|
||||||
|
// 手动加上 Token
|
||||||
|
if (vm?.vuex_token) {
|
||||||
|
headers.Authorization = `Bearer ${vm.vuex_token}`;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 加上 rememberMe
|
||||||
|
if (vm?.vuex_remember) {
|
||||||
|
headers['x-remember'] = vm.vuex_remember;
|
||||||
|
}
|
||||||
|
console.log('request', headers);
|
||||||
|
console.log('request:', {
|
||||||
|
url: url,
|
||||||
|
filePath: filePath,
|
||||||
|
name: name,
|
||||||
|
formData: formData
|
||||||
|
});
|
||||||
|
uni.uploadFile({
|
||||||
|
url,
|
||||||
|
filePath,
|
||||||
|
name,
|
||||||
|
formData,
|
||||||
|
header: headers,
|
||||||
|
fileType,
|
||||||
|
success: (res) => {
|
||||||
|
try {
|
||||||
|
const data = JSON.parse(res.data);
|
||||||
|
console.log('request', data);
|
||||||
|
if (res.statusCode === 200) {
|
||||||
|
resolve(data);
|
||||||
|
} else {
|
||||||
|
reject(data);
|
||||||
|
}
|
||||||
|
} catch (e) {
|
||||||
|
reject(e);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
fail: (err) => {
|
||||||
|
reject(err);
|
||||||
|
console.log('request', err);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
});
|
||||||
|
}
|
||||||
@@ -157,6 +157,9 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
|
import {
|
||||||
|
uploadFiles
|
||||||
|
} from '@/common/upload.js';
|
||||||
export default {
|
export default {
|
||||||
data() {
|
data() {
|
||||||
const now = new Date();
|
const now = new Date();
|
||||||
@@ -335,7 +338,7 @@
|
|||||||
},
|
},
|
||||||
|
|
||||||
// 提交表单
|
// 提交表单
|
||||||
submitForm() {
|
async submitForm() {
|
||||||
const errorMsg = this.validateForm();
|
const errorMsg = this.validateForm();
|
||||||
if (errorMsg) {
|
if (errorMsg) {
|
||||||
uni.showToast({
|
uni.showToast({
|
||||||
@@ -346,7 +349,8 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
// 合并日期和时间
|
// 合并日期和时间
|
||||||
this.formData.visitingBeginTime = `${this.formData.visitingBeginDate} ${this.formData.visitingBeginTime}`;
|
this.formData.visitingBeginTime =
|
||||||
|
`${this.formData.visitingBeginDate} ${this.formData.visitingBeginTime}`;
|
||||||
this.formData.visitingEndTime = `${this.formData.visitingEndDate} ${this.formData.visitingEndTime}`;
|
this.formData.visitingEndTime = `${this.formData.visitingEndDate} ${this.formData.visitingEndTime}`;
|
||||||
|
|
||||||
|
|
||||||
@@ -356,128 +360,170 @@
|
|||||||
title: '提交中...',
|
title: '提交中...',
|
||||||
mask: true
|
mask: true
|
||||||
});
|
});
|
||||||
|
const images = [this.formData.facePictures]
|
||||||
|
|
||||||
// 模拟API请求
|
const result = await uploadFiles({
|
||||||
setTimeout(() => {
|
files: images,
|
||||||
uni.request({
|
url: this.vuex_config.baseUrl + '/resource/oss/upload',
|
||||||
url: this.formData.facePictures
|
name: 'file',
|
||||||
})
|
vm: this // 关键：用于注入 token 等
|
||||||
// .then(response => response.blob())
|
});
|
||||||
.then(blob => {
|
let parsedData = result[0]
|
||||||
// 此时得到了原始Blob对象
|
if (parsedData.code == 200) {
|
||||||
console.log(blob);
|
const submitData = {
|
||||||
const file = new File([blob], 'filename.png', {
|
...this.formData,
|
||||||
type: blob.type
|
bookingParkingSpace: this.formData
|
||||||
});
|
.bookingParkingSpace ? 0 : 1
|
||||||
// 构建FormData进行上传
|
};
|
||||||
const formData = new FormData();
|
// 第二步：从解析后的数据中获取ossId
|
||||||
formData.append('file', file);
|
const ossId = parsedData.data.ossId;
|
||||||
console.log(formData)
|
console.log("ossId", ossId)
|
||||||
// 发送上传请求
|
submitData.facePictures = ossId;
|
||||||
// this.$u.api.uploadimg()
|
console.log(submitData)
|
||||||
// 接上面的代码，假设Blob是图片类型
|
this.$u.api.fksub(submitData).then(res => {
|
||||||
uni.uploadFile({
|
console.log(res)
|
||||||
url: 'http://183.230.235.66:11010/api/resource/oss/qrupload', // 后端上传接口地址
|
if (res.code == 200) {
|
||||||
filePath: file.filePath, // 要上传的文件路径
|
this.resetForm();
|
||||||
name: 'file', // 后端接收文件的参数名
|
uni.showToast({
|
||||||
// FormData中的其他参数
|
title: "提交成功，请等待审核！",
|
||||||
formData: {
|
icon: "success"
|
||||||
'code': this.formData.qrCodeId // 示例：其他表单字段
|
})
|
||||||
},
|
}else {
|
||||||
// // 上传进度回调
|
uni.showToast({
|
||||||
// onProgressUpdate: (res) => {
|
title: "提交失败",
|
||||||
// this.progress = res.progress;
|
icon: "none"
|
||||||
// console.log('上传进度:' + res.progress);
|
})
|
||||||
// },
|
}
|
||||||
// 上传成功回调
|
})
|
||||||
success: (res) => {
|
} else {
|
||||||
console.log('上传成功', res);
|
|
||||||
|
|
||||||
// this.formData.facePictures = res.data.ossId;
|
|
||||||
// 准备提交数据
|
|
||||||
const submitData = {
|
|
||||||
...this.formData,
|
|
||||||
bookingParkingSpace: this.formData
|
|
||||||
.bookingParkingSpace ? 0 : 1
|
|
||||||
};
|
|
||||||
|
|
||||||
const parsedData = JSON.parse(res.data);
|
|
||||||
if (parsedData.code == 200) {
|
|
||||||
// 第二步：从解析后的数据中获取ossId
|
|
||||||
const ossId = parsedData.data.ossId;
|
|
||||||
console.log("ossId", ossId)
|
|
||||||
submitData.facePictures = ossId;
|
|
||||||
console.log(submitData)
|
|
||||||
this.$u.api.fksub(submitData).then(res => {
|
|
||||||
console.log(res)
|
|
||||||
if (res.code == 200) {
|
|
||||||
uni.showToast({
|
|
||||||
title: "提交成功，请等待审核！",
|
|
||||||
icon: "success"
|
|
||||||
})
|
|
||||||
}
|
|
||||||
})
|
|
||||||
}else{
|
|
||||||
uni.showToast({
|
|
||||||
title: '上传失败',
|
|
||||||
icon: 'none'
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
// uni.showToast({
|
|
||||||
// title: '上传成功',
|
|
||||||
// icon: 'success'
|
|
||||||
// });
|
|
||||||
},
|
|
||||||
// 上传失败回调
|
|
||||||
fail: (err) => {
|
|
||||||
console.error('上传失败', err);
|
|
||||||
uni.showToast({
|
|
||||||
title: '上传失败',
|
|
||||||
icon: 'none'
|
|
||||||
});
|
|
||||||
},
|
|
||||||
// 无论成功失败都会执行
|
|
||||||
complete: () => {
|
|
||||||
this.progress = 0; // 重置进度
|
|
||||||
}
|
|
||||||
});
|
|
||||||
// this.$u.api.uploadimg(formData).then(res => {
|
|
||||||
// console.log(res)
|
|
||||||
// if (res.code == 200) {
|
|
||||||
// uni.showToast({
|
|
||||||
// title: "提交成功，请等待审核！",
|
|
||||||
// icon: "success"
|
|
||||||
// })
|
|
||||||
// } else {
|
|
||||||
// uni.showToast({
|
|
||||||
// title: "tp提交失败！",
|
|
||||||
// icon: "error"
|
|
||||||
// })
|
|
||||||
// }
|
|
||||||
// })
|
|
||||||
|
|
||||||
});
|
|
||||||
|
|
||||||
|
|
||||||
uni.hideLoading();
|
|
||||||
|
|
||||||
// 显示成功提示
|
|
||||||
uni.showToast({
|
uni.showToast({
|
||||||
title: '提交成功',
|
title: '上传失败',
|
||||||
icon: 'success',
|
icon: 'none'
|
||||||
duration: 2000
|
|
||||||
});
|
});
|
||||||
|
}
|
||||||
|
uni.hideLoading();
|
||||||
|
// return
|
||||||
|
// 模拟API请求
|
||||||
|
// setTimeout(() => {
|
||||||
|
// uni.request({
|
||||||
|
// url: this.formData.facePictures
|
||||||
|
// })
|
||||||
|
// // .then(response => response.blob())
|
||||||
|
// .then(blob => {
|
||||||
|
// // 此时得到了原始Blob对象
|
||||||
|
// console.log(blob);
|
||||||
|
// const file = new File([blob], 'filename.png', {
|
||||||
|
// type: blob.type
|
||||||
|
// });
|
||||||
|
// // 构建FormData进行上传
|
||||||
|
// const formData = new FormData();
|
||||||
|
// formData.append('file', file);
|
||||||
|
// console.log(formData)
|
||||||
|
// 发送上传请求
|
||||||
|
// this.$u.api.uploadimg()
|
||||||
|
// 接上面的代码，假设Blob是图片类型
|
||||||
|
// uni.uploadFile({
|
||||||
|
// url: 'http://183.230.235.66:11010/api/resource/oss/upload', // 后端上传接口地址
|
||||||
|
// filePath: this.formData.facePictures, // 要上传的文件路径
|
||||||
|
// name: 'file', // 后端接收文件的参数名
|
||||||
|
// // FormData中的其他参数
|
||||||
|
// // formData: {
|
||||||
|
// // 'code': this.formData.qrCodeId // 示例：其他表单字段
|
||||||
|
// // },
|
||||||
|
// // // 上传进度回调
|
||||||
|
// // onProgressUpdate: (res) => {
|
||||||
|
// // this.progress = res.progress;
|
||||||
|
// // console.log('上传进度:' + res.progress);
|
||||||
|
// // },
|
||||||
|
// // 上传成功回调
|
||||||
|
// success: (res) => {
|
||||||
|
// console.log('上传成功', res);
|
||||||
|
|
||||||
// 提交成功后，可跳转到成功页面或重置表单
|
// // this.formData.facePictures = res.data.ossId;
|
||||||
setTimeout(() => {
|
// // 准备提交数据
|
||||||
// 重置表单
|
// const submitData = {
|
||||||
this.resetForm();
|
// ...this.formData,
|
||||||
// 返回到上一页或跳转到其他页面
|
// bookingParkingSpace: this.formData
|
||||||
// uni.navigateBack();
|
// .bookingParkingSpace ? 0 : 1
|
||||||
}, 2000);
|
// };
|
||||||
}, 1500);
|
|
||||||
|
// const parsedData = JSON.parse(res.data);
|
||||||
|
// if (parsedData.code == 200) {
|
||||||
|
// // 第二步：从解析后的数据中获取ossId
|
||||||
|
// const ossId = parsedData.data.ossId;
|
||||||
|
// console.log("ossId", ossId)
|
||||||
|
// submitData.facePictures = ossId;
|
||||||
|
// console.log(submitData)
|
||||||
|
// this.$u.api.fksub(submitData).then(res => {
|
||||||
|
// console.log(res)
|
||||||
|
// if (res.code == 200) {
|
||||||
|
// this.resetForm();
|
||||||
|
// uni.showToast({
|
||||||
|
// title: "提交成功，请等待审核！",
|
||||||
|
// icon: "success"
|
||||||
|
// })
|
||||||
|
// }
|
||||||
|
// })
|
||||||
|
// }else{
|
||||||
|
// uni.showToast({
|
||||||
|
// title: '上传失败',
|
||||||
|
// icon: 'none'
|
||||||
|
// });
|
||||||
|
// }
|
||||||
|
|
||||||
|
|
||||||
|
// // uni.showToast({
|
||||||
|
// // title: '上传成功',
|
||||||
|
// // icon: 'success'
|
||||||
|
// // });
|
||||||
|
// },
|
||||||
|
// // 上传失败回调
|
||||||
|
// fail: (err) => {
|
||||||
|
// console.error('上传失败', err);
|
||||||
|
// uni.showToast({
|
||||||
|
// title: '上传失败',
|
||||||
|
// icon: 'none'
|
||||||
|
// });
|
||||||
|
// },
|
||||||
|
// // 无论成功失败都会执行
|
||||||
|
// complete: () => {
|
||||||
|
// this.progress = 0; // 重置进度
|
||||||
|
// }
|
||||||
|
// });
|
||||||
|
// this.$u.api.uploadimg(formData).then(res => {
|
||||||
|
// console.log(res)
|
||||||
|
// if (res.code == 200) {
|
||||||
|
// uni.showToast({
|
||||||
|
// title: "提交成功，请等待审核！",
|
||||||
|
// icon: "success"
|
||||||
|
// })
|
||||||
|
// } else {
|
||||||
|
// uni.showToast({
|
||||||
|
// title: "tp提交失败！",
|
||||||
|
// icon: "error"
|
||||||
|
// })
|
||||||
|
// }
|
||||||
|
// })
|
||||||
|
|
||||||
|
// });
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
// 显示成功提示
|
||||||
|
// uni.showToast({
|
||||||
|
// title: '提交成功',
|
||||||
|
// icon: 'success',
|
||||||
|
// duration: 2000
|
||||||
|
// });
|
||||||
|
|
||||||
|
// // 提交成功后，可跳转到成功页面或重置表单
|
||||||
|
// setTimeout(() => {
|
||||||
|
// // 重置表单
|
||||||
|
// this.resetForm();
|
||||||
|
// // 返回到上一页或跳转到其他页面
|
||||||
|
// // uni.navigateBack();
|
||||||
|
// }, 2000);
|
||||||
|
// }, 1500);
|
||||||
},
|
},
|
||||||
delimg() {
|
delimg() {
|
||||||
this.formData.facePictures = ''
|
this.formData.facePictures = ''
|
||||||
|
|||||||
Reference in New Issue
Block a user