From df2b423830f2dae145a3204e3e36a0330e9b9087 Mon Sep 17 00:00:00 2001 From: XiaoXinPro 14 IAH5R <568170040@qq.com> Date: Sat, 23 Sep 2023 18:04:55 +0800 Subject: [PATCH] upload --- miniprogram/app.json | 3 +- miniprogram/pages/checkImg/checkImg.js | 51 ++++++++ miniprogram/pages/checkImg/checkImg.json | 6 + miniprogram/pages/checkImg/checkImg.less | 4 + miniprogram/pages/checkImg/checkImg.wxml | 19 +++ miniprogram/pages/index/index.js | 30 ++--- miniprogram/pages/index/index.less | 8 ++ miniprogram/pages/index/index.wxml | 6 +- miniprogram/pages/upload/upload.js | 145 ++++++++++++++++++++++- miniprogram/pages/upload/upload.less | 42 ++++++- miniprogram/pages/upload/upload.wxml | 12 +- miniprogram/utils/request.js | 11 +- project.private.config.json | 9 +- tsconfig.json | 1 + 14 files changed, 315 insertions(+), 32 deletions(-) create mode 100644 miniprogram/pages/checkImg/checkImg.js create mode 100644 miniprogram/pages/checkImg/checkImg.json create mode 100644 miniprogram/pages/checkImg/checkImg.less create mode 100644 miniprogram/pages/checkImg/checkImg.wxml diff --git a/miniprogram/app.json b/miniprogram/app.json index abcd93e..01d6d13 100644 --- a/miniprogram/app.json +++ b/miniprogram/app.json @@ -4,7 +4,8 @@ "pages/payOrder/payOrder", "pages/login/login", "pages/userProtocol/userProtocol", - "pages/upload/upload" + "pages/upload/upload", + "pages/checkImg/checkImg" ], "window": { "backgroundTextStyle": "light", diff --git a/miniprogram/pages/checkImg/checkImg.js b/miniprogram/pages/checkImg/checkImg.js new file mode 100644 index 0000000..1ae8e4b --- /dev/null +++ b/miniprogram/pages/checkImg/checkImg.js @@ -0,0 +1,51 @@ +// pages/checkImg/checkImg.ts +Page({ + + /** + * 页面的初始数据 + */ + data: { + + }, + + /** + * 生命周期函数--监听页面加载 + */ + onLoad(options) { + console.log(options); + }, + + /** + * 生命周期函数--监听页面显示 + */ + onShow() { + + }, + + previewImage() { + wx.previewImage({ + + }) + }, + + /** + * 页面相关事件处理函数--监听用户下拉动作 + */ + onPullDownRefresh() { + + }, + + /** + * 页面上拉触底事件的处理函数 + */ + onReachBottom() { + + }, + + /** + * 用户点击右上角分享 + */ + onShareAppMessage() { + + } +}) \ No newline at end of file diff --git a/miniprogram/pages/checkImg/checkImg.json b/miniprogram/pages/checkImg/checkImg.json new file mode 100644 index 0000000..e311917 --- /dev/null +++ b/miniprogram/pages/checkImg/checkImg.json @@ -0,0 +1,6 @@ +{ + "navigationBarTitleText": "我的写真", + "navigationBarBackgroundColor": "#333333", + "navigationBarTextStyle": "white", + "usingComponents": {} +} \ No newline at end of file diff --git a/miniprogram/pages/checkImg/checkImg.less b/miniprogram/pages/checkImg/checkImg.less new file mode 100644 index 0000000..b865c4a --- /dev/null +++ b/miniprogram/pages/checkImg/checkImg.less @@ -0,0 +1,4 @@ +/* pages/checkImg/checkImg.wxss */ +page { + background-color: #333333; +} \ No newline at end of file diff --git a/miniprogram/pages/checkImg/checkImg.wxml b/miniprogram/pages/checkImg/checkImg.wxml new file mode 100644 index 0000000..874e988 --- /dev/null +++ b/miniprogram/pages/checkImg/checkImg.wxml @@ -0,0 +1,19 @@ + +pages/checkImg/checkImg.wxml + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/miniprogram/pages/index/index.js b/miniprogram/pages/index/index.js index 1e22df2..6fd6195 100644 --- a/miniprogram/pages/index/index.js +++ b/miniprogram/pages/index/index.js @@ -6,8 +6,16 @@ import Dialog from '@vant/weapp/dialog/dialog'; Page({ data: { isLogin: false, - itemList: [1, 1, 1, 1, 1, 1], - showPrivacy: false + itemList: [ + { id: 1 }, + { id: 2 }, + { id: 3 }, + { id: 4 }, + { id: 5 }, + { id: 6 }, + ], + showPrivacy: false, + avatarUrl: "../../asset/icon/logo-5.png" }, // 事件处理函数 @@ -94,16 +102,6 @@ Page({ } }, - getUserProfile() { - // 推荐使用wx.getUserProfile获取用户信息,开发者每次通过该接口获取用户个人信息均需用户确认,开发者妥善保管用户快速填写的头像昵称,避免重复弹窗 - wx.getUserProfile({ - desc: '展示用户信息', // 声明获取用户个人信息后的用途,后续会展示在弹窗中,请谨慎填写 - success: (res) => { - console.log(res, 'getUserProfile') - } - }) - }, - getUserPhone(e) { const sessionKey = wx.getStorageSync('sessionKey') this.doGetUserPhone(e.detail.encryptedData, e.detail.iv, sessionKey, request.appId) @@ -150,8 +148,12 @@ Page({ }) }, - goCheckImage(){ - + goCheckImage(e) { + console.log(e, 'e'); + const id = e.currentTarget.dataset.id + wx.navigateTo({ + url: `/pages/checkImg/checkImg?id=${id}`, + }) }, onShareAppMessage() { diff --git a/miniprogram/pages/index/index.less b/miniprogram/pages/index/index.less index 39dc85c..80ba33b 100644 --- a/miniprogram/pages/index/index.less +++ b/miniprogram/pages/index/index.less @@ -26,6 +26,14 @@ page { padding-top: 60rpx; z-index: -8; + .getUserinfo { + background-color: #ffffff00; + + &::after { + border: none; + } + } + .avatar { width: 220rpx; height: 220rpx; diff --git a/miniprogram/pages/index/index.wxml b/miniprogram/pages/index/index.wxml index 8d293b9..2e33e59 100644 --- a/miniprogram/pages/index/index.wxml +++ b/miniprogram/pages/index/index.wxml @@ -5,9 +5,9 @@ - + - + 微信用户 用户名 @@ -25,7 +25,7 @@ - + diff --git a/miniprogram/pages/upload/upload.js b/miniprogram/pages/upload/upload.js index 9caa921..a2bc38e 100644 --- a/miniprogram/pages/upload/upload.js +++ b/miniprogram/pages/upload/upload.js @@ -7,15 +7,24 @@ Page({ * 页面的初始数据 */ data: { + topTitle: "请添加一张正面照片", + showScanLine: false, isUploaded: false, - tempFilePath: "" + isSuccess: false, + tempFilePath: "", + onlineFilePath: "", + id: "" }, /** * 生命周期函数--监听页面加载 */ - onLoad() { - + onLoad(options) { + if (options.id) { + this.setData({ + id: options.id + }) + } }, @@ -23,7 +32,6 @@ Page({ * 生命周期函数--监听页面显示 */ onShow() { - wx.hideHomeButton() app.tokenCallBack = res => { this.setData({ isLogin: res @@ -41,12 +49,139 @@ Page({ success: res => { that.setData({ tempFilePath: res.tempFiles[0].tempFilePath, - isUploaded: true + showScanLine: true, + isUploaded: true, + isSuccess: false + }) + that.imgCheckByFace() + } + }) + }, + + // 检查图片是否符合人脸规范 + imgCheckByFace() { + const that = this + const filePath = that.data.tempFilePath + const BaseUrl = request.baseUrl + + wx.uploadFile({ + filePath, + url: BaseUrl + "/api/userDigital/checkPhoto", + name: 'file', + formData: { + user: "test", + }, + success: res => { + const code = JSON.parse(res.data).code + if (code == 200) { + that.imgCheckByBaidu() + } else { + that.setData({ + showScanLine: false + }) + wx.showToast({ + title: '图片不合规范,请重新上传', + icon: "none" + }) + } + }, + fail: err => { + wx.showToast({ + title: '上传失败,请稍后再试', + icon: "none" }) } }) }, + // 检查图片合法性 + imgCheckByBaidu() { + const that = this + const filePath = that.data.tempFilePath + const BaseUrl = request.baseUrl + + wx.uploadFile({ + filePath, + url: BaseUrl + "/api/baidu/checkPhoto", + name: 'file', + formData: { + user: "test", + }, + success: res => { + const code = JSON.parse(res.data).code + if (code == 200) { + that.doUploadImg() + } else { + that.setData({ + showScanLine: false + }) + wx.showToast({ + title: '图片不合规范,请重新上传', + icon: "none" + }) + } + }, + fail: err => { + wx.showToast({ + title: '上传失败,请稍后再试', + icon: "none" + }) + } + }) + }, + + // 上传图片 + doUploadImg() { + const that = this + const filePath = that.data.tempFilePath + const BaseUrl = request.baseUrl + + wx.uploadFile({ + filePath, + url: BaseUrl + "/api/upload/awsImgUpload", + name: 'file', + formData: { + user: "test", + }, + header: { + "Content-Type": "multipart/form-data" + }, + success: res => { + console.log(res, 'res'); + const code = JSON.parse(res.data).code + if (code == 200) { + that.setData({ + showScanLine: false, + isSuccess: true + }) + wx.showToast({ + title: '上传成功!', + icon: "success" + }) + } else { + wx.showToast({ + title: '服务器繁忙,请稍后再试', + icon: "none" + }) + that.setData({ + showScanLine: false + }) + } + }, + fail: err => { + wx.showToast({ + title: '上传失败,请稍后再试', + icon: "none" + }) + } + }) + }, + + // 确认照片 + confirmImage() { + + }, + /** * 页面相关事件处理函数--监听用户下拉动作 */ diff --git a/miniprogram/pages/upload/upload.less b/miniprogram/pages/upload/upload.less index cea3089..865d5cf 100644 --- a/miniprogram/pages/upload/upload.less +++ b/miniprogram/pages/upload/upload.less @@ -15,11 +15,33 @@ page { .uploadArea { position: relative; width: 60%; - height: 700rpx; + height: 600rpx; background-color: #393b3d; margin: 50rpx auto; border-radius: 40rpx; + @keyframes scanAnimation { + 0% { + transform: translateY(-100%); + } + + 100% { + transform: translateY(150%); + } + } + + .scanLine { + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 40%; + background: linear-gradient(180deg, rgba(0, 255, 51, 0) 50%, #00ff33 300%); + border-bottom: 2px solid #00ff33; + animation: scanAnimation 2s linear infinite; + z-index: 9; + } + .scanBorder { position: absolute; top: 50%; @@ -42,7 +64,7 @@ page { top: 50%; left: 50%; transform: translate(-50%, -50%); - width: 78%; + width: 70%; } } @@ -59,6 +81,22 @@ page { margin: auto; } + .reUpload { + width: 70%; + height: 100rpx; + line-height: 100rpx; + font-weight: 600; + background-color: #292929; + color: #ff4f00; + font-size: 32rpx; + text-align: center; + border-radius: 50rpx; + margin: auto; + border: 1px solid #ff4f00; + box-sizing: border-box; + margin-top: 30rpx; + } + .notice { margin-top: 50rpx; diff --git a/miniprogram/pages/upload/upload.wxml b/miniprogram/pages/upload/upload.wxml index 64386f3..fb6ca84 100644 --- a/miniprogram/pages/upload/upload.wxml +++ b/miniprogram/pages/upload/upload.wxml @@ -1,15 +1,21 @@ - 请添加一整正脸照片 + {{ topTitle }} + - + - + + + + + + 请参考范例上传五官清晰的照片 diff --git a/miniprogram/utils/request.js b/miniprogram/utils/request.js index 7e04e24..5221369 100644 --- a/miniprogram/utils/request.js +++ b/miniprogram/utils/request.js @@ -1,5 +1,3 @@ -const url = 'https://zhixiangtest.malls.iformall.com/C' - class request { constructor(address) { if (address) { @@ -9,10 +7,17 @@ class request { /** * 配置 */ + + /** + * @description 基地址 + * @returns {string} https://zhixiangtest.malls.iformall.com/C + */ + baseUrl = 'https://zhixiangtest.malls.iformall.com/C' + /** * 请求路径前缀 */ - address = url; + address = 'https://zhixiangtest.malls.iformall.com/C'; /** * 请求头 */ diff --git a/project.private.config.json b/project.private.config.json index 00aab3c..8c9672f 100644 --- a/project.private.config.json +++ b/project.private.config.json @@ -19,7 +19,14 @@ { "name": "", "pathName": "pages/upload/upload", - "query": "", + "query": "id=123456", + "launchMode": "default", + "scene": null + }, + { + "name": "", + "pathName": "pages/checkImg/checkImg", + "query": "id=1", "launchMode": "default", "scene": null } diff --git a/tsconfig.json b/tsconfig.json index 8b1d300..f7ee269 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -33,6 +33,7 @@ "miniprogram/pages/payOrder/payOrder.js", "miniprogram/pages/login/login.js", "miniprogram/pages/upload/upload.js", + "miniprogram/pages/checkImg/checkImg.js", ], "exclude": [ "node_modules"