From 70607468ffc8236aa3c27e46f065f12a3f66992b Mon Sep 17 00:00:00 2001 From: Dragon <13925835632@139.com> Date: Mon, 19 Feb 2024 16:44:39 +0800 Subject: [PATCH] =?UTF-8?q?=E6=96=B0=E5=A2=9E=E5=8F=B0=E6=B9=BE=E5=9C=B0?= =?UTF-8?q?=E5=8C=BA=E9=93=B6=E8=A1=8C=E6=8F=90=E9=A2=86=E7=BB=91=E5=AE=9A?= =?UTF-8?q?=E8=B5=84=E6=96=99?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- view/peko/modules/h5Income/css/taiwan.css | 210 +++++++++++++++++++ view/peko/modules/h5Income/css/taiwan.scss | 210 +++++++++++++++++++ view/peko/modules/h5Income/js/taiwan.js | 220 ++++++++++++++++++++ view/peko/modules/h5Income/js/withdrawal.js | 8 +- view/peko/modules/h5Income/taiwan.html | 117 +++++++++++ 5 files changed, 764 insertions(+), 1 deletion(-) create mode 100644 view/peko/modules/h5Income/css/taiwan.css create mode 100644 view/peko/modules/h5Income/css/taiwan.scss create mode 100644 view/peko/modules/h5Income/js/taiwan.js create mode 100644 view/peko/modules/h5Income/taiwan.html diff --git a/view/peko/modules/h5Income/css/taiwan.css b/view/peko/modules/h5Income/css/taiwan.css new file mode 100644 index 0000000..7ca8f2d --- /dev/null +++ b/view/peko/modules/h5Income/css/taiwan.css @@ -0,0 +1,210 @@ +html, +body { + width: 100%; + background: #F3F5FA; +} + +.back { + position: fixed; + z-index: 9; + width: 0.74667rem; + height: 0.74667rem; + left: 0.53333rem; + top: 0.2rem; +} + +h3 { + width: 100%; + margin-top: 0.53333rem; + margin-bottom: 0.42667rem; + text-align: center; + color: #1F1B4F; + font-size: 0.48rem; + font-weight: bold; +} + +input { + background: transparent; + border: none; + outline: none; + box-sizing: border-box; + font-size: 0.37333rem; +} + +input::placeholder { + font-size: 0.37333rem; + color: #8A8CAB; +} + +.box1 { + width: 9.14667rem; + height: 9.70667rem; + background: #fff; + border-radius: 0.26667rem; + box-sizing: border-box; + padding: 0 0.53333rem; + margin: 0 auto 0.32rem; + overflow: hidden; +} + +.box1 div { + width: 100%; + height: 1.37333rem; + line-height: 1.37333rem; + border-bottom: 0.01333rem solid #EBEEF5; + display: flex; +} + +.box1 div span { + flex: 3; + height: 100%; + font-size: 0.37333rem; + color: #1F1B4F; +} + +.box1 div input { + flex: 7; + height: 100%; + text-align: right; + font-size: 0.37333rem; + color: #1F1B4F; +} + +.box2 { + width: 9.14667rem; + height: 5.54667rem; + background: #fff; + border-radius: 0.26667rem; + box-sizing: border-box; + padding: 0 0.53333rem; + margin: 0 auto 0.32rem; + overflow: hidden; +} + +.box2 div { + width: 100%; + height: 1.37333rem; + line-height: 1.37333rem; + border-bottom: 0.01333rem solid #EBEEF5; + display: flex; +} + +.box2 div span { + flex: 3; + height: 100%; + font-size: 0.37333rem; + color: #1F1B4F; +} + +.box2 div input { + flex: 7; + height: 100%; + text-align: right; + font-size: 0.37333rem; + color: #1F1B4F; +} + +.box3 { + width: 9.14667rem; + height: 5.54667rem; + background: #fff; + border-radius: 0.26667rem; + box-sizing: border-box; + padding: 0 0.53333rem; + margin: 0 auto 0.53333rem; + overflow: hidden; +} + +.box3 p { + font-size: 0.37333rem; + color: #1F1B4F; + margin-top: 0.42667rem; +} + +.box3 .idBox { + width: 100%; + display: flex; + justify-content: space-between; + margin-top: 0.42667rem; +} + +.box3 .idBox .z, +.box3 .idBox .f { + width: 3.84rem; + height: 3.14667rem; + background: #F3F5FA; + border-radius: 0.26667rem; + position: relative; +} + +.box3 .idBox .z .documents, +.box3 .idBox .f .documents { + position: absolute; + width: 3.09333rem; + height: 1.92rem; + left: 50%; + transform: translateX(-50%); + top: 0.37333rem; +} + +.box3 .idBox .z .icon_camera, +.box3 .idBox .f .icon_camera { + position: absolute; + width: 1.06667rem; + height: 1.06667rem; + left: 50%; + top: 0.8rem; + transform: translateX(-50%); + z-index: 2; +} + +.box3 .idBox .z span, +.box3 .idBox .f span { + position: absolute; + color: #8A8CAB; + font-size: 0.32rem; + left: 50%; + top: 2.4rem; + transform: translateX(-50%); + width: 100%; + text-align: center; +} + +.box3 .idBox .z .upload, +.box3 .idBox .f .upload { + position: absolute; + width: 3.09333rem; + height: 1.92rem; + left: 50%; + transform: translateX(-50%); + top: 0.37333rem; + z-index: 2; +} + +.but { + width: 8.08rem; + height: 1.28rem; + line-height: 1.28rem; + border-radius: 1.28rem; + margin: 0 auto 0.64rem; + text-align: center; + font-size: 0.42667rem; + color: #FFFFFF; + background: linear-gradient(90deg, #EEDCFF 0%, #DEE4FF 50%, #CCF8F9 100%); +} + +.active { + background: linear-gradient(90deg, #5AECFA 0%, #9DB4FF 49%, #CF70FF 100%); +} + +.rule { + width: 8.72rem; + margin: 0 auto 0.66667rem; + color: #8A8CAB; + font-size: 0.37333rem; +} + +.rule p { + margin-bottom: 0.13333rem; + line-height: 0.45rem; +} diff --git a/view/peko/modules/h5Income/css/taiwan.scss b/view/peko/modules/h5Income/css/taiwan.scss new file mode 100644 index 0000000..828ef3d --- /dev/null +++ b/view/peko/modules/h5Income/css/taiwan.scss @@ -0,0 +1,210 @@ +@function px2rem($px) { + @return $px / 75+rem; +} + +html, +body { + width: 100%; + background: #F3F5FA; +} + +.back { + position: fixed; + z-index: 9; + width: px2rem(56); + height: px2rem(56); + left: px2rem(40); + top: 0.2rem; + // display: none; +} + +h3 { + width: 100%; + margin-top: px2rem(40); + margin-bottom: px2rem(32); + text-align: center; + color: #1F1B4F; + font-size: px2rem(36); + font-weight: bold; +} + +input { + background: transparent; + border: none; + outline: none; + box-sizing: border-box; + font-size: px2rem(28); + + &::placeholder { + font-size: px2rem(28); + color: #8A8CAB; + } +} + +.box1 { + width: px2rem(686); + height: px2rem(728); + background: #fff; + border-radius: px2rem(20); + box-sizing: border-box; + padding: 0 px2rem(40); + margin: 0 auto px2rem(24); + overflow: hidden; + + div { + width: 100%; + height: px2rem(103); + line-height: px2rem(103); + border-bottom: px2rem(1) solid #EBEEF5; + display: flex; + + span { + flex: 3; + height: 100%; + font-size: px2rem(28); + color: #1F1B4F; + } + + input { + flex: 7; + height: 100%; + text-align: right; + font-size: px2rem(28); + color: #1F1B4F; + } + } +} + +.box2 { + width: px2rem(686); + height: px2rem(416); + background: #fff; + border-radius: px2rem(20); + box-sizing: border-box; + padding: 0 px2rem(40); + margin: 0 auto px2rem(24); + overflow: hidden; + + div { + width: 100%; + height: px2rem(103); + line-height: px2rem(103); + border-bottom: px2rem(1) solid #EBEEF5; + display: flex; + + span { + flex: 3; + height: 100%; + font-size: px2rem(28); + color: #1F1B4F; + } + + input { + flex: 7; + height: 100%; + text-align: right; + font-size: px2rem(28); + color: #1F1B4F; + } + } +} + +.box3 { + width: px2rem(686); + height: px2rem(416); + background: #fff; + border-radius: px2rem(20); + box-sizing: border-box; + padding: 0 px2rem(40); + margin: 0 auto px2rem(40); + overflow: hidden; + + p { + font-size: px2rem(28); + color: #1F1B4F; + margin-top: px2rem(32); + } + + .idBox { + width: 100%; + display: flex; + justify-content: space-between; + margin-top: px2rem(32); + + .z, + .f { + width: px2rem(288); + height: px2rem(236); + background: #F3F5FA; + border-radius: px2rem(20); + position: relative; + + .documents { + position: absolute; + width: px2rem(232); + height: px2rem(144); + left: 50%; + transform: translateX(-50%); + top: px2rem(28); + } + + .icon_camera { + position: absolute; + width: px2rem(80); + height: px2rem(80); + left: 50%; + top: px2rem(60); + transform: translateX(-50%); + z-index: 2; + } + + span { + position: absolute; + color: #8A8CAB; + font-size: px2rem(24); + left: 50%; + top: px2rem(180); + transform: translateX(-50%); + width: 100%; + text-align: center; + } + + .upload { + position: absolute; + width: px2rem(232); + height: px2rem(144); + left: 50%; + transform: translateX(-50%); + top: px2rem(28); + z-index: 2; + } + } + } +} + +.but { + width: px2rem(606); + height: px2rem(96); + line-height: px2rem(96); + border-radius: px2rem(96); + margin: 0 auto px2rem(48); + text-align: center; + font-size: px2rem(32); + color: #FFFFFF; + background: linear-gradient(90deg, #EEDCFF 0%, #DEE4FF 50%, #CCF8F9 100%); +} +.active{ + background: linear-gradient(90deg, #5AECFA 0%, #9DB4FF 49%, #CF70FF 100%); +} + +.rule { + width: px2rem(654); + margin: 0 auto px2rem(50); + color: #8A8CAB; + font-size: px2rem(28); + + p { + margin-bottom: px2rem(10); + line-height: 0.45rem; + } +} \ No newline at end of file diff --git a/view/peko/modules/h5Income/js/taiwan.js b/view/peko/modules/h5Income/js/taiwan.js new file mode 100644 index 0000000..9ac1662 --- /dev/null +++ b/view/peko/modules/h5Income/js/taiwan.js @@ -0,0 +1,220 @@ +let urlPrefix = getUrlPrefix() +let browser = checkVersion() +var url = getQueryString(); +let env = EnvCheck(); +if (env == 'test') { + new VConsole(); +} +// 封裝layer消息提醒框 +let layerIndex +const showLoading = (content = '加載中...') => { + layer.open({ + type: 2, + shadeClose: false, + content, + success (e) { + layerIndex = $(e).attr('index') + } + }) +} +const hideLoading = (index) => { + layer.close(index) +} +const toastMsg = (content = '操作完成', time = 2) => { + layer.open({ + content, + time, + skin: 'msg' + }) +} + +$(function () { + setTimeout(function () { + getInfoFromClient() + if (browser.app) { + $('.back').hide(); + } + setTimeout(function () { + }, 100) + }) +}) +// 返回按鈕 +$('.back').click(function () { + window.history.go(-1) +}) +function fileChangeZ (e) { + var filesList = document.querySelector('#frontImageUpload').files; + if (filesList.length == 0) { + return; + } + getUploadToken(1) +} +function fileChangeF (e) { + var filesList = document.querySelector('#backImageUpload').files; + if (filesList.length == 0) { + return; + } + getUploadToken(2) +} +// 上傳身份證接口 +function getUploadToken (type) { + const frontImage = document.getElementById('frontImageUpload').files[0]; + const backImage = document.getElementById('backImageUpload').files[0]; + showLoading() + networkRequest({ + type: 'GET', + url: urlPrefix + '/qiniu/upload/getUploadToken', + success (res) { + if (res.code === 200) { + var frontImageKey = res.data.key; + var frontImageToken = res.data.token; + showLoading() + const observable = qiniu.upload( + type == 1 ? frontImage : backImage, + frontImageKey, + frontImageToken + ); + observable.subscribe({ + complete: (res) => { + console.log(res); + if (type == 1) { + $('.box3 .idBox .z .documents').attr('src', res.path); + } else { + $('.box3 .idBox .f .documents').attr('src', res.path); + } + hideLoading(layerIndex) + toastMsg("上傳成功") + + }, + }); + } else if (res.code ? res.code == 1444 : JSON.parse(res).code == 401) { + window.location.href = './login.html' + } else { + toastMsg(res.message) + } + // hideLoading(layerIndex) + }, + error (err) { + hideLoading(layerIndex) + toastMsg('網絡錯誤,請退出重進') + } + }) +} +// 確認綁定按鈕 +$('.but').click(function () { + if (listenFun()) { + var filesList = document.querySelector('#frontImageUpload').files; + var backImageUpload = document.querySelector('#backImageUpload').files; + if (filesList.length == 0 || backImageUpload.length == 0) { + toastMsg('請上傳身份證照片') + return; + } + } +}) +//監聽是否完善信息 +function listenFun () { + var num1 = $(".box1 div .name").val(); + var num2 = $(".box1 div .accountName").val(); + var num3 = $(".box1 div .card").val(); + var num4 = $(".box1 div .state").val(); + var num5 = $(".box1 div .city").val(); + var num7 = $(".box1 div .street").val(); + var num8 = $(".box1 div .postalCode").val(); + var num9 = $(".box2 div .bankAccount").val(); + var num10 = $(".box2 div .bankName").val(); + var num11 = $(".box2 div .swiftCode").val(); + var num12 = $(".box2 div .phone").val(); + if (num1 != '' && num2 != '' && num3 != '' && num4 != '' && num5 != '' && num7 != '' && num8 != '' && num9 != '' && num10 != '' && num11 != '' && num12 != '') { + $('.but').addClass('active'); + return true; + } else { + $('.but').removeClass('active'); + return false; + } +} +// 監聽所有輸入框輸入 +$(".box1 div .name,.box1 div .accountName,.box1 div .card,.box1 div .state,.box1 div .city,.box1 div .street,.box1 div .postalCode,.box2 div .bankAccount,.box2 div .bankName,.box2 div .swiftCode,.box2 div .phone").on("keyup", function () { + listenFun() +}); +// 保存绑定 +function withdrawUserAccount ( + surname, + name, + idCardNo, + province, + city, + street, + postCode, + accountNo, + bankName, + swiftCode, + contact, + frontPhoto, + backPhoto,) { + var obj = { + uid: pubInfo.uid, + accountType: url.accountType, + surname, + name, + idCardNo, + province, + city, + street, + postCode, + accountNo, + bankName, + swiftCode, + contact, + frontPhoto, + backPhoto, + }; + showLoading() + networkRequest({ + type: 'POST', + url: urlPrefix + '/withdrawUserAccount/save', + contentType: 'application/json', + data: JSON.stringify(obj), + success (res) { + if (res.code === 200) { + toastMsg('保存成功') + setTimeout(function () { + window.location.href = './withdrawal.html' + }, 500) + } else if (res.code ? res.code == 1444 : JSON.parse(res).code == 401) { + window.location.href = './login.html' + } else { + toastMsg(res.message) + } + hideLoading(layerIndex) + }, + error (err) { + hideLoading(layerIndex) + toastMsg('網絡錯誤,請退出重進') + } + }) +} +$('.but').click(function () { + var frontImageUpload = document.querySelector('#frontImageUpload').files; + var backImageUpload = document.querySelector('#backImageUpload').files; + if (listenFun()) { + if (frontImageUpload.length == 0 || backImageUpload.length == 0) { + toastMsg('請上傳身份證'); + return; + } + withdrawUserAccount( + $('.box1 div .name').val(), + $('.box1 div .accountName').val(), + $('.box1 div .card').val(), + $('.box1 div .state').val(), + $('.box1 div .city').val(), + $('.box1 div .street').val(), + $('.box1 div .postalCode').val(), + $('.box2 div .bankAccount').val(), + $('.box2 div .bankName').val(), + $('.box2 div .swiftCode').val(), + $('.box2 div .phone').val(), + $('.box3 .idBox .z .documents').attr('src'), + $('.box3 .idBox .f .documents').attr('src') + ); + } +}) \ No newline at end of file diff --git a/view/peko/modules/h5Income/js/withdrawal.js b/view/peko/modules/h5Income/js/withdrawal.js index aa45fff..99e8e9d 100644 --- a/view/peko/modules/h5Income/js/withdrawal.js +++ b/view/peko/modules/h5Income/js/withdrawal.js @@ -239,6 +239,8 @@ function getAccounts () { $('.switch .pub_in p').text('是否切換到馬來西亞銀行提領 '); } else if (accountTypes == 8) { $('.switch .pub_in p').text('是否切換到新加坡銀行提領 '); + } else if (accountTypes == 16) { + $('.switch .pub_in p').text('是否切換到臺灣地區銀行提領 '); } $('.switch .pub_in .ok').attr('accounttype', accountTypes); $('.switch .pub_in .ok').attr('text', $(this).attr('accountTypesText')); @@ -253,6 +255,8 @@ function getAccounts () { $('.binding .pub_in p').text('需要先綁定馬來西亞銀行賬戶資料'); } else if (accountTypes == 8) { $('.binding .pub_in p').text('需要先綁定新加坡銀行賬戶資料'); + }else if (accountTypes == 16) { + $('.switch .pub_in p').text('需要先綁定臺灣地區銀行賬戶資料 '); } $('.binding').show(); // 確認跳轉綁定頁面按鈕 @@ -265,6 +269,8 @@ function getAccounts () { window.location.href = `./malaysia.html?accountType=${accountTypes}`; } else if (accountTypes == 8) { window.location.href = `./singapore.html?accountType=${accountTypes}`; + }else if (accountTypes == 16) { + window.location.href = `./taiwan.html?accountType=${accountTypes}`; } return false; }) @@ -395,7 +401,7 @@ $('.butBig').click(function () { if (accountType == 2 && isRealCertifyBool == 0) { toastMsg('請先進行實名認證') return - } + } // console.log(isAdult(idCard)); if (accountType == 2) { birthday = idCard.substring(6, 14); diff --git a/view/peko/modules/h5Income/taiwan.html b/view/peko/modules/h5Income/taiwan.html new file mode 100644 index 0000000..434220f --- /dev/null +++ b/view/peko/modules/h5Income/taiwan.html @@ -0,0 +1,117 @@ + + + +
+ + + + +上傳身份證照片
+註意:
+1.該頁面適用於馬來西亞地區的提領,非馬來西亞地區請切換其他提領方式;
+2.提領資料請勿隨意填寫,需正確填寫以上資料;
+3.銀行賬號與身份證號碼必須與提領實名一致,否則提領不能到賬;
+4.請勿將賬號綁定他人的姓名,提領真實姓名綁定後不能修改,請謹慎操作;
+5.實際提領收益按照轉賬時的匯率之後金額;
+6.首次進行提領流程時,會需要上傳您的身份證相關信息;
+7.申請提領人為未滿二十歲的未成年人,除需提供申請人的身份證相關信息外,另須提供法定代理人(或監護人)的身份證件相關信息;
+8.如有疑問請聯系Wechat:sd245376
+