xuan/TestEShopDist
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

🎈 perf(支付弹窗优化):

Browse Source
This commit is contained in:
czm 2022-12-13 14:53:54 +08:00
parent 23a6c22045
commit c7da1a1b25
4 changed files with 84 additions and 85 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/common/constant.ts
View File

@ -1,4 +1,4 @@
export const BASE_URL = CURRENT_BASE_URL // export const BASE_URL = CURRENT_BASE_URL
// export const BASE_URL = `http://192.168.0.75:50001/lymarket` // export const BASE_URL = `http://192.168.0.75:50001/lymarket`
// export const BASE_URL = `http://192.168.0.89:50001/lymarket` // export const BASE_URL = `http://192.168.0.89:50001/lymarket`
// export const BASE_URL = `http://10.0.0.5:50001/lymarket` // export const BASE_URL = `http://10.0.0.5:50001/lymarket`
@ -12,7 +12,7 @@ export const BASE_URL = CURRENT_BASE_URL
// export const BASE_URL = `https://dev.zzfzyc.com/lymarket` // 开发环境 // export const BASE_URL = `https://dev.zzfzyc.com/lymarket` // 开发环境
// export const BASE_URL = 'https://www.zzfzyc.com/lymarket' // 正式环境 // export const BASE_URL = 'https://www.zzfzyc.com/lymarket' // 正式环境
// export const BASE_URL = `http://192.168.1.5:40001/lymarket` // 王霞 // export const BASE_URL = `http://192.168.1.5:40001/lymarket` // 王霞
// export const BASE_URL = 'http://192.168.1.7:50002/lymarket' // 添 export const BASE_URL = 'http://192.168.1.7:50002/lymarket' // 添
// export const BASE_URL = 'http://192.168.1.28:50002/lymarket' // 婷 // export const BASE_URL = 'http://192.168.1.28:50002/lymarket' // 婷
// export const BASE_URL = `http://192.168.1.42:50002/lymarket` // 杰 // export const BASE_URL = `http://192.168.1.42:50002/lymarket` // 杰

2
src/components/closeBtn/index.tsx
View File

@ -12,7 +12,7 @@ const CloseBtn = ({ onClose, styleObj = {} }: Params) => {
<View <View
style={styleObj} style={styleObj}
className={style.icon_a_cuowuwrong_self} className={style.icon_a_cuowuwrong_self}
onClick={onClose} onClick={() => onClose?.()}
> >
<View className={style.icon_a_btn}> <View className={style.icon_a_btn}>
<IconFont name="icon-qingchuxinxi" size={40} color="#acacac"></IconFont> <IconFont name="icon-qingchuxinxi" size={40} color="#acacac"></IconFont>

158
src/components/popup/index.module.scss
View File

@ -1,91 +1,89 @@
$am-ms: 200ms; $am-ms: 200ms;
.drawer_main{ .drawer_main {
.drawer { .drawer {
position:fixed; position: fixed;
left: 0; left: 0;
top:0; top: 0;
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
width: 100%;
height: 100vh;
margin: 0 auto;
z-index: 1000;
visibility: hidden;
transition: visibility $am-ms ease-in-out;
.drawer_mask {
display: flex;
position: absolute;
top: 0;
left: 0;
width: 100vw;
height: 100vh;
background: rgba(0, 0, 0, 0.6);
z-index: 1011;
opacity: 0;
transition: opacity $am-ms ease-in;
.drawer_container {
display: flex; display: flex;
align-items: center;
justify-content: center;
flex-direction: column; flex-direction: column;
width: 100%; position: absolute;
height: 100vh; background-color: #fff;
margin: 0 auto; z-index: 1012;
z-index: 1000; transition: transform $am-ms ease-in-out;
visibility: hidden; .drawer_container_title {
transition: visibility $am-ms ease-in-out; display: flex;
.drawer_mask{ align-items: center;
display: flex; justify-content: center;
position: absolute; height: 80px;
top: 0; font-size: 29px;
left: 0; color: #000000;
width: 100vw; padding-top: 10px;
height: 100vh;
background: rgba(0, 0, 0, 0.6);
z-index: 1011;
opacity: 0;
transition: opacity $am-ms ease-in;
.drawer_container{
display: flex;
flex-direction: column;
position: absolute;
background-color: #fff;
z-index: 1012;
transition: transform $am-ms ease-in-out;
.drawer_container_title {
display: flex;
align-items: center;
justify-content: center;
height: 80px;
font-size: 29px;
color: #000000;
padding-top: 10px;
}
.common_close_btn_icon{
position: absolute;
top: 10px;
left: 10px;
}
}
.drawer_container_active{
transform: translate3d(0, 0, 0);
}
} }
.drawer_mask_active{ .common_close_btn_icon {
opacity: 1; position: absolute;
top: 10px;
left: 10px;
z-index: 1000;
} }
}
.drawer_container_active {
transform: translate3d(0, 0, 0);
}
} }
.drawer_active { .drawer_mask_active {
visibility:visible; opacity: 1;
} }
}
.drawer_active {
visibility: visible;
}
.drawer_container_bottom{ .drawer_container_bottom {
bottom: 0; bottom: 0;
left: 0; left: 0;
min-height: 200px; min-height: 200px;
width: 100vw; width: 100vw;
border-radius: 20px 20px 0px 0px; border-radius: 20px 20px 0px 0px;
transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0);
} }
.drawer_container_top{ .drawer_container_top {
top: 0; top: 0;
left: 0; left: 0;
min-height: 200px; min-height: 200px;
width: 100vw; width: 100vw;
border-radius: 0 0 20px 20px; border-radius: 0 0 20px 20px;
transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0);
} }
.drawer_container_right{ .drawer_container_right {
bottom: 0; bottom: 0;
right: 0; right: 0;
height: 100vh; height: 100vh;
min-width: 300px; min-width: 300px;
border-radius: 20px 0 0 20px; border-radius: 20px 0 0 20px;
transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0);
} }
} }

5
src/pages/order/components/payment/index.tsx
View File

@ -153,6 +153,7 @@ const Payment = ({ show = false, onClose, orderInfo, onSubmitSuccess }: Param) =
// 是否显示七天账期 // 是否显示七天账期
const show_account_payment = useMemo(() => { const show_account_payment = useMemo(() => {
if (!payInfo?.account_period) { return false }
// 剪板和散剪不显示 // 剪板和散剪不显示
if (orderInfo?.sale_mode != 0) { return false } if (orderInfo?.sale_mode != 0) { return false }
// 支付方式是账期支付,不显示 // 支付方式是账期支付,不显示
@ -189,7 +190,7 @@ const Payment = ({ show = false, onClose, orderInfo, onSubmitSuccess }: Param) =
return ( return (
<View className={styles.payment_main}> <View className={styles.payment_main}>
<Popup show={show} showTitle={false} onClose={onClose}> <Popup show={show} showTitle={false} onClose={onClose} showIconButton>
<View className={styles.payment_con}> <View className={styles.payment_con}>
{/* <View className={classnames('iconfont icon-a-moreback', styles.miconfont_title)} onClick={onClose}></View> */} {/* <View className={classnames('iconfont icon-a-moreback', styles.miconfont_title)} onClick={onClose}></View> */}
<View className={styles.title}>待支付款项</View> <View className={styles.title}>待支付款项</View>
@ -218,7 +219,7 @@ const Payment = ({ show = false, onClose, orderInfo, onSubmitSuccess }: Param) =
<View className={styles.payment_list_item_left}> <View className={styles.payment_list_item_left}>
<View className={classnames(styles.miconfont)}><IconFont name="icon-yufukuan" size={70} /></View> <View className={classnames(styles.miconfont)}><IconFont name="icon-yufukuan" size={70} /></View>
<View className={styles.payment_list_item_left_name}> <View className={styles.payment_list_item_left_name}>
<View className={styles.payment_list_item_left_text}>预存款</View> <View className={styles.payment_list_item_left_text}>预存货款</View>
{advance_payment} {advance_payment}
</View> </View>
</View> </View>