285 lines
9.1 KiB
JavaScript
Executable File
285 lines
9.1 KiB
JavaScript
Executable File
import Taro from '@tarojs/taro'
|
||
import React, { useEffect, useState, useCallback, useRef, useImperativeHandle } from 'react'
|
||
import { View, Text, Button, ScrollView } from '@tarojs/components'
|
||
import { AtButton, AtCurtain } from 'taro-ui'
|
||
import { useImmer } from 'use-immer'
|
||
import S from '@/spx'
|
||
import api from '@/api'
|
||
import { isWeixin, isAlipay, classNames, showToast, entryLaunch } from '@/utils'
|
||
import { SG_SHARER_UID, SG_TRACK_PARAMS, SG_ROUTER_PARAMS, SG_GUIDE_PARAMS } from '@/consts'
|
||
import { Tracker } from '@/service'
|
||
import { SpPrivacyModal, SpImage, SpCheckbox } from '@/components'
|
||
import { useLogin } from '@/hooks'
|
||
import './index.scss'
|
||
|
||
|
||
const initialState = {
|
||
logo: '',
|
||
registerName: '',
|
||
privacyName: '',
|
||
agreeMentChecked: false
|
||
}
|
||
function SpLogin (props, ref) {
|
||
const { children, className, onChange, newUser = false } = props
|
||
const { isLogin, login, setToken, checkPolicyChange } = useLogin({
|
||
policyUpdateHook: (isUpdate) => {
|
||
// isUpdate && setPolicyModal(true)
|
||
}
|
||
})
|
||
const [isNewUser, setIsNewUser] = useState(false)
|
||
const [policyModal, setPolicyModal] = useState(false)
|
||
const [loginModal, setLoginModal] = useState(false)
|
||
const [state, setState] = useImmer(initialState)
|
||
const { logo, registerName, privacyName, agreeMentChecked } = state
|
||
const codeRef = useRef()
|
||
|
||
useEffect(() => {
|
||
if (newUser) {
|
||
setIsNewUser(true)
|
||
}
|
||
}, [newUser])
|
||
|
||
useEffect(() => {
|
||
if (loginModal) {
|
||
fetchPrivacyData()
|
||
Taro.login({
|
||
success: ({ code }) => {
|
||
codeRef.current = code
|
||
},
|
||
fail: (e) => {
|
||
console.error('[sp-login] taro login fail:', e)
|
||
}
|
||
})
|
||
}
|
||
}, [loginModal])
|
||
|
||
const fetchPrivacyData = async () => {
|
||
const { logo, protocol } = await api.shop.getStoreBaseInfo()
|
||
const { member_register, privacy } = protocol
|
||
setState(draft => {
|
||
draft.logo = logo
|
||
draft.registerName = member_register
|
||
draft.privacyName = privacy
|
||
})
|
||
|
||
}
|
||
|
||
const handleBindPhone = async (e) => {
|
||
setLoginModal(false)
|
||
const { encryptedData, iv, cloudID } = e.detail
|
||
if (encryptedData && iv) {
|
||
const code = codeRef.current
|
||
let params = {
|
||
code,
|
||
encryptedData,
|
||
iv,
|
||
cloudID,
|
||
user_type: 'wechat',
|
||
auth_type: 'wxapp'
|
||
}
|
||
// 内购分享码
|
||
const { code: purchaseCode } = Taro.getStorageSync(SG_ROUTER_PARAMS)
|
||
if (purchaseCode) {
|
||
params = {
|
||
...params,
|
||
purchanse_share_code: purchaseCode
|
||
}
|
||
}
|
||
Taro.showLoading({ title: '' })
|
||
|
||
// const { uid } = entryLaunch.getLaunchParams()
|
||
const { uid, dtid } = Taro.getStorageSync(SG_ROUTER_PARAMS)
|
||
const { gu_user_id } = Taro.getStorageSync(SG_GUIDE_PARAMS)
|
||
if (uid) {
|
||
// 分销绑定
|
||
params['uid'] = uid
|
||
}
|
||
if (dtid) {
|
||
params['distributor_id'] = dtid
|
||
}
|
||
// gu_user_id: 欢迎语上带过来的员工编号, 同work_user_id
|
||
if (gu_user_id) {
|
||
params['channel'] = 1
|
||
params['work_userid'] = gu_user_id
|
||
}
|
||
|
||
try {
|
||
const { token, is_new } = await api.wx.newlogin(params)
|
||
if (token) {
|
||
setToken(token)
|
||
Taro.hideLoading()
|
||
setLoginModal(false)
|
||
showToast('恭喜您，注册成功')
|
||
onChange && onChange()
|
||
} else {
|
||
showToast('注册失败')
|
||
}
|
||
} catch (error) {
|
||
Taro.hideLoading()
|
||
}
|
||
}
|
||
}
|
||
|
||
const handleCloseModal = useCallback(() => {
|
||
setPolicyModal(false)
|
||
}, [])
|
||
|
||
// 同意隐私协议
|
||
const handleConfirmModal = useCallback(async () => {
|
||
setPolicyModal(false)
|
||
handleUserLogin()
|
||
// if (isNewUser) {
|
||
// return setLoginModal(true)
|
||
// } else {
|
||
// try {
|
||
// await login()
|
||
// } catch (e) {
|
||
// setLoginModal(true)
|
||
// }
|
||
// }
|
||
}, [])
|
||
|
||
// 登录
|
||
const handleClickLogin = async (e) => {
|
||
e.stopPropagation()
|
||
const { scene } = Taro.getLaunchOptionsSync()
|
||
// 微信朋友圈打开场景
|
||
if (scene == 1154) {
|
||
return showToast('请前往小程序使用完整服务')
|
||
}
|
||
// const checkRes = await checkPolicyChange()
|
||
// if (!checkRes) {
|
||
// setPolicyModal(true)
|
||
// return
|
||
// }
|
||
if (isLogin) {
|
||
onChange && onChange()
|
||
} else {
|
||
setLoginModal(true)
|
||
}
|
||
}
|
||
|
||
// 已注册会员登录
|
||
const handleUserLogin = async () => {
|
||
try {
|
||
await login()
|
||
setLoginModal(false)
|
||
onChange && onChange()
|
||
} catch (e) {
|
||
setIsNewUser(true)
|
||
}
|
||
}
|
||
|
||
useImperativeHandle(ref, () => ({
|
||
_setPolicyModal: () => {
|
||
setPolicyModal(true)
|
||
}
|
||
}))
|
||
|
||
const handleClickPrivacy = (type) => {
|
||
Taro.navigateTo({
|
||
url: `/subpages/auth/reg-rule?type=${type}`
|
||
})
|
||
}
|
||
|
||
const onChangePayment = (e) => {
|
||
setState(draft => {
|
||
draft.agreeMentChecked = e
|
||
})
|
||
}
|
||
|
||
// eslint-disable-next-line no-undef
|
||
const { icon, nickname } = __wxConfig.accountInfo
|
||
|
||
return (
|
||
<View className={classNames('sp-login', className)}>
|
||
<View onClick={handleClickLogin}>{children}</View>
|
||
|
||
{/* 隐私协议 */}
|
||
{/* <SpPrivacyModal
|
||
open={policyModal}
|
||
onCancel={handleCloseModal}
|
||
onConfirm={handleConfirmModal}
|
||
/> */}
|
||
|
||
{/* 授权登录 */}
|
||
<AtCurtain
|
||
className='curtain'
|
||
isOpened={loginModal}
|
||
onClose={() => {
|
||
setLoginModal(false)
|
||
}}
|
||
>
|
||
{/* <View className='login-modal'>
|
||
<View className='login-modal__hd'>
|
||
<SpImage circle src={icon} width={120} height={120} />
|
||
<View className='nick-name'>{nickname}</View>
|
||
</View>
|
||
<View className='login-modal__bd'>登录手机号，查看全部订单和优惠券</View>
|
||
<View className='agreement-content'>
|
||
<SpCheckbox
|
||
checked={agreeMentChecked}
|
||
onChange={onChangePayment}
|
||
/>
|
||
<View className="agreement-list">
|
||
<Text className='agreement-name' onClick={handleClickPrivacy.bind(this, 'member_register')}>《{registerName}》</Text>和
|
||
<Text className='agreement-name' onClick={handleClickPrivacy.bind(this, 'privacy')}>《{privacyName}》</Text>
|
||
</View>
|
||
</View>
|
||
<View className='login-modal__ft'>
|
||
{isNewUser && <AtButton type='primary' disabled={!agreeMentChecked} openType='getPhoneNumber' onGetPhoneNumber={handleBindPhone}>
|
||
登录
|
||
</AtButton>}
|
||
{!isNewUser && <AtButton type='primary' disabled={!agreeMentChecked} onClick={handleUserLogin}>
|
||
登录
|
||
</AtButton>}
|
||
</View>
|
||
</View> */}
|
||
{<View className="curtain_content">
|
||
<View className="curtain_content_title">
|
||
<SpImage src={`member/logo-black.png`} height={32} mode='heightFix' isNew />
|
||
<View className="">隐私政策</View>
|
||
</View>
|
||
<ScrollView scrollY
|
||
scrollWithAnimation className="curtain_content_text" showScrollbar={false} enhanced>
|
||
亲爱的用户,感谢您使用Birkenstock微信小程序!为了加强对您个人信息的保护,我们根据最新法律的要求制定/更新了
|
||
<View className="agreement-list">
|
||
<Text className='agreement-name' onClick={handleClickPrivacy.bind(this, 'member_register')}>《{registerName}》</Text>和
|
||
<Text className='agreement-name' onClick={handleClickPrivacy.bind(this, 'privacy')}>《{privacyName}》</Text>
|
||
</View>,我们将基于合法以及正当必要的原则,按照本政策的规定向您提供各项服务
|
||
<View>
|
||
本政策旨在向您说明休迪贸易 (上海)有限公司及其在中国大陆境内的线上线下门店如何收集、使用、传输和保护您的个人信息
|
||
通过《隐私政策》,我们向您主要说明:
|
||
</View>
|
||
<View className="">
|
||
1.您在使用Birkenstock微信小程序时,可以选择浏览模式,也可以选择注册/登录成为Birkenstock微信小程序用户
|
||
</View>
|
||
<View className="">
|
||
2为了向你提供Birkenstock微信小程序的其本服条,我们将基于合法以及正当必要的原则,按照本政策的规定向您提供各项服务
|
||
</View>
|
||
</ScrollView>
|
||
<View className='btn-wrap'>
|
||
{isNewUser && <AtButton className='btn' type='primary' openType="getPhoneNumber" onGetPhoneNumber={handleBindPhone
|
||
}>
|
||
同意并继续
|
||
</AtButton>}
|
||
{!isNewUser && <AtButton className='btn' type='primary' onClick={handleUserLogin}>
|
||
同意并继续
|
||
</AtButton>}
|
||
</View>
|
||
<View className="no-btn" onClick={() => setLoginModal(false)}>不同意</View>
|
||
<View className="no-text">
|
||
*如果您不同意Birkenstock隐私政策，您可继续浏览小程序，但您无法使用购物结算功能
|
||
</View>
|
||
</View>}
|
||
</AtCurtain>
|
||
</View>
|
||
)
|
||
}
|
||
|
||
SpLogin.options = {
|
||
addGlobalClass: true
|
||
}
|
||
|
||
export default React.forwardRef(SpLogin)
|