tuoheng_pilot_mini_move_20240715/package_B/page/changeMessage/index.js

// package_B/page/changeMessage/index.js
import {changeMessage} from '../../../api/mine.js'
import {getOssAuth} from '../../../api/upload.js'
import {Base64} from 'js-base64'
// const Base64 = require('js-base64')
const crypto = require('crypto-js')
import {checkPhoneNumber, checkUserName} from '../../../utils/check.js'
Page({

    /**
     * 页面的初始数据
     */
    data: {
        userInfo: {},
        ossForm: {},
        form: {},
        formRules: {
            avatar: {
                type: 'image',
                title: "用户头像",
                tips: "请输入用户头像",
                validator: function (value) {
                    return value != ''
                },
                placeholder: "请输入用户头像"
            },
            nickname: {
                type: 'input',
                title: "用户昵称",
                tips: "请输入用户昵称(中文、数字、字母)",
                validator: function (value) {
                    return value != "" && checkUserName(value)
                },
                placeholder: "请输入用户昵称(中文、数字、字母)"
            },
            mobile: {
                type: 'input',
                title: "电话号码",
                tips: "请输入正确格式的电话号码",
                validator: function (value) {
                    return value != '' && checkPhoneNumber(value)
                },
                placeholder: "请输入正确格式的电话号码"
            }
        }
    },
    onLoad(e) {
        let userInfo = wx.getStorageSync('userInfo')
        let form = this.data.form
        form = Object.assign({}, userInfo)
        this.setData({form, userInfo})
    },
    onShow() {
        this.getAuth()
    },
    bindValue(e) {
        let name = e.currentTarget.dataset.name;
        let str = "form."+name
        this.setData({
            [str]: e.detail.value,
        })
        this.validate(name, e.detail.value)
    },
    validate(name) {
        let formRules = this.data.formRules;
        let validator = this.data.formRules[name].validator
        let result = false
        if(!this.data.form[name]) {
            result = true
        } else {
            result = validator ? !validator(this.data.form[name]) : false;
        }
        formRules[name].warning = result
        this.setData({
            formRules
        })
        return result
    },
    validateForm() {
        return new Promise((resolve, reject) => {
            try {
                let formRules = this.data.formRules;
                let result = false;
                for (let key in formRules) {
                    let temp = this.validate(key)
                    if (temp) {
                        result = temp
                    }
                }
                resolve(!result)
            } catch (e) {
                reject(e)
            }
        })
    },

    /* 上传图片 */
    uploadImage(){
        wx.chooseImage({
          count: 1, // 最多可以选择的图片张数，默认9
          mediaType: ['image'], // 图片
          sizeType: ['original'], // original 原图，compressed 压缩图，默认二者都有
          sourceType: ['album', 'camera'], // album 从相册选图，camera 使用相机，默认二者都有
          success:(res) =>{
            // success
            let form = this.data.form
            form.avatar = res.tempFilePaths
            this.setData({ form })
            this.validate('avatar')
          },
          fail: (e) => {
            console.log(e);
          }
        })
    },

    getAuth() {
        let that = this
        getOssAuth().then(res=> {
            let client = {
                region: 'oss-cn-shanghai',
                secure: true,
                accessKeyId: res.data.accessKeyId,
                accessKeySecret: res.data.accessKeySecret,
                securityToken: res.data.securityToken,
                bucket: 'ta-tech-image'
            }
            // 计算签名
            function computeSignature(accessKeySecret, canonicalString) {
                return crypto.enc.Base64.stringify(crypto.HmacSHA1(canonicalString, accessKeySecret));
            }
            const date = new Date();
            date.setHours(date.getHours() + 1);
            const policyText = {
                expiration: date.toISOString(), // 设置policy过期时间。
                conditions: [
                    // 限制上传大小。
                    ["content-length-range", 0, 1024 * 1024 * 1024],
                ],
            };
            // 获取签名
            const policy = Base64.encode(JSON.stringify(policyText)) // policy必须为base64的string。
            const signature = computeSignature(client.accessKeySecret, policy)
            let ossForm = that.data.ossForm
            ossForm = {
                OSSAccessKeyId: client.accessKeyId,
                signature,
                policy,
                SecurityToken: client.securityToken 
            }
            that.setData({ossForm})
        }).catch(e=> {
            console.log(e);
        })
    },
    // 提交
    submitForm() {
        let that = this
        this.validateForm().then(res => {
            if(res) {
                let params = {}
                let form = this.data.form
                params.id = form.id
                params.nickname = form.nickname
                params.mobile = form.mobile
                // 需要上传oss
                if(form.avatar instanceof Array) {
                    wx.showLoading({
                      title: '上传中',
                      mask: true
                    })
                    // 设置文件上传路径
                    const randomString = Math.random().toString(36).slice(2)
                    const timestamp = new Date().getTime()
                    const key = `imagedir/${randomString}_${timestamp}.png`
                    wx.uploadFile({
                        url: 'https://ta-tech-image.oss-cn-shanghai.aliyuncs.com',
                        filePath: form.avatar[0],
                        name: 'file',
                        formData: {
                            key,
                            OSSAccessKeyId: that.data.ossForm.OSSAccessKeyId,
                            signature: that.data.ossForm.signature,
                            policy: that.data.ossForm.policy,
                            'x-oss-security-token': that.data.ossForm.SecurityToken 
                        },
                        success: (res)=> {
                            if(res.statusCode === 204) {
                                // 上传成功
                                params.avatar = key
                                changeMessage(params).then(res=> {
                                    wx.hideLoading()
                                    if(res.code === 0) {
                                        wx.setStorageSync('userInfo', res.data)
                                        wx.switchTab({
                                            url: '/pages/mine/mine',
                                        })
                                    }
                                }).catch((e)=> {
                                    wx.hideLoading()
                                    console.log(e);
                                })
                            } else {
                                wx.hideLoading()
                                wx.showToast({
                                    icon: 'error',
                                    title: '图片上传失败',
                                    duration: 2000
                                })
                            }
                        },
                        fail: (e)=> {
                            wx.hideLoading()
                            console.log(e);
                        }
                    })
                } else {
                    changeMessage(params).then(res=> {
                        wx.hideLoading()
                        if(res.code === 0) {
                            wx.setStorageSync('userInfo', res.data)
                            wx.switchTab({
                                url: '/pages/mine/mine',
                            })
                        }
                    }).catch((e)=> {
                        wx.hideLoading()
                        console.log(e);
                    })
                }
               
            } else {
                wx.showToast({
                    icon: 'error',
                    title: '请完善必填信息',
                    duration: 2000
                })
            }
        })
    }
})