363 lines
9.8 KiB
JavaScript
363 lines
9.8 KiB
JavaScript
import request from '~/api/request';
|
||
Page({
|
||
|
||
/**
|
||
* 页面的初始数据
|
||
*/
|
||
|
||
// 凝血酶原时间(s)/国际标准化比/活化的部分凝血酶时间(s)
|
||
data: {
|
||
style: 'border: 2rpx solid #efefef;border-radius: 12rpx;',
|
||
|
||
form: {
|
||
|
||
},
|
||
key: 'filename.txt', //待上传的文件名称,您也可以指定其存储在某个目录下。例如,将filename.txt文件上传到youfolder文件夹下,此时需填写:/youfolder/filename.txt。
|
||
policy: '',
|
||
xOssSecurityToken: '',
|
||
xOssSignatureVersion: '',
|
||
xOssCredential: '',
|
||
xOssDate: '',
|
||
xOssSignature: '',
|
||
|
||
|
||
|
||
|
||
personInfo: {
|
||
name: '',
|
||
gender: 0,
|
||
birth: '',
|
||
address: [],
|
||
introduction: '',
|
||
yearType: 0,
|
||
|
||
// photos: [],
|
||
},
|
||
mode: '',
|
||
dateVisible: false,
|
||
date: new Date('2021-12-23').getTime(), // 支持时间戳传入
|
||
dateText: '',
|
||
filter(type, options) {
|
||
if (type === 'year') {
|
||
return options.sort((a, b) => b.value - a.value);
|
||
}
|
||
return options;
|
||
},
|
||
popupProps: {
|
||
usingCustomNavbar: true,
|
||
},
|
||
|
||
formatter(item, index) {
|
||
if (index === 1) {
|
||
const label = item.label.slice(0, -1);
|
||
return {
|
||
value: item.value,
|
||
label: calendarMonth[Number(label) - 1],
|
||
};
|
||
}
|
||
if (index === 2) {
|
||
const [dateValue, weekValue] = item.label.split(' ');
|
||
const dateSuffixes = {
|
||
1: 'st',
|
||
2: 'nd',
|
||
3: 'rd',
|
||
};
|
||
const weekMap = {
|
||
周一: 'Mon.',
|
||
周二: 'Tues.',
|
||
周三: 'Wed.',
|
||
周四: 'Thurs.',
|
||
周五: 'Fri.',
|
||
周六: 'Sat.',
|
||
周日: 'Sun.',
|
||
};
|
||
const label = dateValue.slice(0, -1);
|
||
|
||
return {
|
||
value: item.value,
|
||
label: `${label}${dateSuffixes[label] || 'th'} ${weekMap[weekValue]}`,
|
||
};
|
||
}
|
||
|
||
return {
|
||
value: item.value,
|
||
label: item.label.slice(0, -1),
|
||
};
|
||
},
|
||
|
||
originFiles: [
|
||
{
|
||
url: 'https://tdesign.gtimg.com/mobile/demos/example4.png',
|
||
name: 'uploaded1.png',
|
||
type: 'image',
|
||
removeBtn: true,
|
||
},
|
||
{
|
||
url: 'https://tdesign.gtimg.com/mobile/demos/example6.png',
|
||
name: 'uploaded2.png',
|
||
type: 'image',
|
||
removeBtn: true,
|
||
},
|
||
{
|
||
url: 'https://tdesign.gtimg.com/mobile/demos/example5.png',
|
||
name: 'uploaded3.png',
|
||
type: 'image',
|
||
removeBtn: true,
|
||
},
|
||
],
|
||
gridConfig: {
|
||
column: 4,
|
||
width: 160,
|
||
height: 160,
|
||
},
|
||
config: {
|
||
count: 1,
|
||
},
|
||
|
||
|
||
},
|
||
onInput(e) {
|
||
const { key } = e.currentTarget.dataset;
|
||
// this.setData({
|
||
// ['form.key']: e.detail.value,
|
||
// });
|
||
},
|
||
showPicker(e) {
|
||
const { mode } = e.currentTarget.dataset;
|
||
this.setData({
|
||
[`${mode}Visible`]: true,
|
||
});
|
||
|
||
|
||
|
||
},
|
||
onPickerChange(e) {
|
||
console.log(e)
|
||
this.setData({
|
||
['form.follow_date']: e.detail.value
|
||
})
|
||
},
|
||
handleSuccess(e) {
|
||
console.log(e.detail)
|
||
const { files } = e.detail;
|
||
this.setData({
|
||
originFiles: files,
|
||
});
|
||
},
|
||
handleRemove(e) {
|
||
console.log(e.detail.file);
|
||
const { index } = e.detail;
|
||
const { originFiles } = this.data;
|
||
originFiles.splice(index, 1);
|
||
this.setData({
|
||
originFiles,
|
||
});
|
||
},
|
||
handleClick(e) {
|
||
console.log(e.detail.file);
|
||
},
|
||
toQuestionnaire() {
|
||
request('patient/follow_questionnaire', 'post', {
|
||
|
||
})
|
||
},
|
||
handleChangeGroup(e) {
|
||
console.log(e)
|
||
const { mode } = e.currentTarget.dataset
|
||
this.setData({
|
||
[`form.${mode}`]: e.detail.value
|
||
})
|
||
},
|
||
//上传文件方法
|
||
async uploadFileToOSS(filePath, callback) {
|
||
const {
|
||
key,
|
||
policy,
|
||
xOssSecurityToken,
|
||
xOssSignatureVersion,
|
||
xOssCredential,
|
||
xOssDate,
|
||
xOssSignature
|
||
} = this.data;
|
||
|
||
const policyData = await request('admin/policy_token', 'post')
|
||
const res = JSON.parse(policyData.token)
|
||
console.log(res)
|
||
|
||
|
||
const formData = {
|
||
key, //上传文件名称
|
||
policy: res.policy, //表单域
|
||
'x-oss-signature-version': res.x_oss_signature_version, //指定签名的版本和算法
|
||
'x-oss-credential': res.x_oss_credential, //指明派生密钥的参数集
|
||
'x-oss-date': res.x_oss_date, //请求的时间
|
||
'x-oss-signature': res.signature, //签名认证描述信息
|
||
'x-oss-security-token': res.security_token, //安全令牌
|
||
success_action_status: "200" //上传成功后响应状态码
|
||
};
|
||
|
||
// 发送请求上传文件
|
||
wx.uploadFile({
|
||
url: 'https://image-fudan.oss-cn-beijing.aliyuncs.com/', // 此域名仅作示例,实际Bucket域名,请替换为您的目标Bucket域名。
|
||
filePath: filePath,
|
||
name: 'file', //固定值为file
|
||
formData: formData,
|
||
success(res) {
|
||
console.log('上传响应:', res);
|
||
if (res.statusCode === 200) {
|
||
callback(null, res.data); // 上传成功
|
||
} else {
|
||
console.error('上传失败,状态码:', res.statusCode);
|
||
console.error('失败响应:', res);
|
||
callback(res); // 上传失败,返回响应
|
||
}
|
||
},
|
||
fail(err) {
|
||
console.error('上传失败:', err); // 输出错误信息
|
||
wx.showToast({ title: '上传失败,请重试!', icon: 'none' });
|
||
callback(err); // 调用回调处理错误
|
||
}
|
||
});
|
||
return
|
||
|
||
const apiUrl = 'http://<ECS实例公网IP地址>:<port>/generate_signature' //请将IP地址和端口号替换为实际服务器公网IP地址及端口号
|
||
// 发送请求获取签名信息
|
||
wx.request({
|
||
url: apiUrl,
|
||
success: (res) => {
|
||
|
||
this.data.xOssSignatureVersion = res.x_oss_signature_version;
|
||
this.data.xOssCredential = res.x_oss_credential;
|
||
this.data.xOssDate = res.x_oss_date;
|
||
this.data.xOssSignature = res.signature;
|
||
this.data.xOssSecurityToken = res.security_token;
|
||
this.data.policy = res.policy;
|
||
|
||
//此示例上传参数只列举必填字段,如有其他需求可参考:
|
||
//PostObject文档:https://help.aliyun.com/zh/oss/developer-reference/postobject
|
||
//签名版本4文档:https://help.aliyun.com/zh/oss/developer-reference/signature-version-4-recommend
|
||
const formData = {
|
||
key, //上传文件名称
|
||
policy: this.data.policy, //表单域
|
||
'x-oss-signature-version': this.data.xOssSignatureVersion, //指定签名的版本和算法
|
||
'x-oss-credential': this.data.xOssCredential, //指明派生密钥的参数集
|
||
'x-oss-date': this.data.xOssDate, //请求的时间
|
||
'x-oss-signature': this.data.xOssSignature, //签名认证描述信息
|
||
'x-oss-security-token': this.data.xOssSecurityToken, //安全令牌
|
||
success_action_status: "200" //上传成功后响应状态码
|
||
};
|
||
|
||
// 发送请求上传文件
|
||
wx.uploadFile({
|
||
url: 'https://examplebucket.oss-cn-hangzhou.aliyuncs.com', // 此域名仅作示例,实际Bucket域名,请替换为您的目标Bucket域名。
|
||
filePath: filePath,
|
||
name: 'file', //固定值为file
|
||
formData: formData,
|
||
success(res) {
|
||
console.log('上传响应:', res);
|
||
if (res.statusCode === 200) {
|
||
callback(null, res.data); // 上传成功
|
||
} else {
|
||
console.error('上传失败,状态码:', res.statusCode);
|
||
console.error('失败响应:', res);
|
||
callback(res); // 上传失败,返回响应
|
||
}
|
||
},
|
||
fail(err) {
|
||
console.error('上传失败:', err); // 输出错误信息
|
||
wx.showToast({ title: '上传失败,请重试!', icon: 'none' });
|
||
callback(err); // 调用回调处理错误
|
||
}
|
||
});
|
||
},
|
||
fail: (err) => {
|
||
console.error('请求接口失败:', err);
|
||
wx.showToast({ title: '获取上传参数失败,请重试!', icon: 'none' });
|
||
}
|
||
});
|
||
},
|
||
handleUpload() {
|
||
wx.chooseMessageFile({
|
||
count: 1, // 选择一个文件
|
||
type: 'all', // 支持所有类型的文件
|
||
success: (res) => {
|
||
console.log('选择的文件:', res.tempFiles); // 输出选择的文件信息
|
||
if (res.tempFiles.length > 0) {
|
||
const tempFilePath = res.tempFiles[0].path; // 获取选择的文件路径
|
||
console.log('选择的文件路径:', tempFilePath); // 输出文件路径
|
||
this.uploadFileToOSS(tempFilePath, (error, data) => {
|
||
if (error) {
|
||
wx.showToast({ title: '上传失败!', icon: 'none' });
|
||
console.error('上传失败:', error); // 输出具体的错误信息
|
||
} else {
|
||
wx.showToast({ title: '上传成功!', icon: 'success' });
|
||
console.log('上传成功:', data); // 输出上传成功后的数据
|
||
}
|
||
});
|
||
} else {
|
||
wx.showToast({ title: '未选择文件!', icon: 'none' });
|
||
}
|
||
},
|
||
fail: (err) => {
|
||
wx.showToast({ title: '选择文件失败!', icon: 'none' });
|
||
console.error('选择文件失败:', err); // 输出选择文件的错误信息
|
||
}
|
||
});
|
||
},
|
||
|
||
/**
|
||
* 生命周期函数--监听页面加载
|
||
*/
|
||
onLoad(options) {
|
||
|
||
},
|
||
|
||
/**
|
||
* 生命周期函数--监听页面初次渲染完成
|
||
*/
|
||
onReady() {
|
||
|
||
},
|
||
|
||
/**
|
||
* 生命周期函数--监听页面显示
|
||
*/
|
||
onShow() {
|
||
|
||
},
|
||
|
||
/**
|
||
* 生命周期函数--监听页面隐藏
|
||
*/
|
||
onHide() {
|
||
|
||
},
|
||
|
||
/**
|
||
* 生命周期函数--监听页面卸载
|
||
*/
|
||
onUnload() {
|
||
|
||
},
|
||
|
||
/**
|
||
* 页面相关事件处理函数--监听用户下拉动作
|
||
*/
|
||
onPullDownRefresh() {
|
||
|
||
},
|
||
|
||
/**
|
||
* 页面上拉触底事件的处理函数
|
||
*/
|
||
onReachBottom() {
|
||
|
||
},
|
||
|
||
/**
|
||
* 用户点击右上角分享
|
||
*/
|
||
onShareAppMessage() {
|
||
|
||
}
|
||
}) |