剪板流程

This commit is contained in:
2022-06-14 19:42:48 +08:00
14 changed files with 285 additions and 202 deletions
+18 -12
View File
@@ -3,6 +3,7 @@
min-height: 100vh;
display: flex;
flex-direction: column;
position: relative;
.header{
background: #68b4ff;
background-size: cover;
@@ -12,6 +13,10 @@
margin-top: 10px;
}
}
.auth-suspension{
position: absolute;
z-index: 1;inset: 0;
}
.header-card{
position: absolute;left: 50%;bottom: -18%;
transform: translateX(-50%);
@@ -239,12 +244,13 @@
display: flex;align-items: center;justify-content: center;
}
.modal{
.tips-modal{
background: rgba(0,0,0,0.6);
position: fixed;inset: 0;
display: flex;justify-content: center;align-items: center;
z-index: 2;
}
.modal-content{
.tips-modal-content{
width: 598px;
background: #ffffff;
border-radius: 10px;
@@ -259,7 +265,7 @@
transform: scale(1);
}
}
.modal-title{
.tips-modal-title{
font-size: 32px;
font-weight: 700;
text-align: center;
@@ -267,51 +273,51 @@
margin-bottom: 58px;
padding-top: 48px;
}
.modal-letter{
.tips-modal-letter{
font-size: 26px;
font-weight: 400;
color: #707070;
padding: 0 30px;
line-height: 50px;
}
.modal-letter-text{
.tips-modal-letter-text{
text-indent: 60px;
}
.modal-letter-beginn{
.tips-modal-letter-beginn{
font-size: 28px;
font-weight: 400;
color: #000000;
margin-bottom: 25px;
}
.modal-letter-end{
.tips-modal-letter-end{
font-size: 26px;
font-weight: 400;
text-align: right;
margin-top: 61px;
}
.modal-button{
.tips-modal-button{
display: flex;
border-top: 1px solid #DDDDDD;
margin-top: 45px;
}
.modal-button button, .modal-button view{
.tips-modal-button button, .tips-modal-button view{
display: flex;align-items: center;justify-content: center;
width: 50%;
height: 90px;
background-color: white;
}
.modal-button button{
.tips-modal-button button{
font-size: 26px;
font-weight: 400;
color: #707070;
border-radius: 0;
border-right: 1px solid #DDDDDD;
}
.modal-button button::after{
.tips-modal-button button::after{
border: 0;
border-radius: 0;
}
.modal-button view{
.tips-modal-button view{
font-size: 26px;
font-weight: 400;
color: #007aff;
+31 -35
View File
@@ -3,40 +3,38 @@ import { memo, useEffect, useState } from "react"
import styles from './index.module.scss'
import classnames from "classnames";
import { useSelector } from "@/reducers/hooks";
import { GetAdminUserInfoApi } from "@/api/user";
import { alert, goLink } from "@/common/common";
import useLogin from '@/use/useLogin'
import {BASE_URL} from '@/common/constant'
export default () => {
// 用户信息
const { fetchData, state } = GetAdminUserInfoApi();
const {adminUserInfo, userInfo} = useSelector(state => state.userInfo);
const [mUserInfo, setMUserInfo] = useState({
phone: ""
});
const getData = ()=>{
fetchData();
}
const { getSelfUserInfo } = useLogin();
const {adminUserInfo} = useSelector(state => state.userInfo);
useEffect(()=>{
setMUserInfo({
...mUserInfo,
// phone: userInfo?.phone?.replace(userInfo?.phone?.substring(3,7), "****") as string
})
getData();
getSelfUserInfo().then().catch(()=>{
alert.none("授权失败,请授权后再使用");
});
},[]);
const handleAuth = async ()=>{
getSelfUserInfo().then().catch(()=>{
alert.none("授权失败,请授权后再使用");
});
}
return (
<View className={styles.main}>
<Header data={adminUserInfo} userInfo={userInfo} />
<Header data={adminUserInfo} />
<Assets />
<Main />
<Modal data={adminUserInfo}/>
{/* 测试暂时添加 */}
<View style={{fontSize:'26rpx', textAlign:'center'}}>{BASE_URL}</View>
{!adminUserInfo.is_authorize_name&&<View onClick={handleAuth} className={styles["auth-suspension"]}></View>}
</View>
)
}
// 提示弹窗
const Modal = memo((props:any)=>{
const {data} = props;
const [modalShow, setModalShow]=useState(true);
@@ -45,16 +43,16 @@ const Modal = memo((props:any)=>{
return(
<>
{!data?.is_authorize_phone&&modalShow&&
<View onClick={handleouter} catchMove className={styles['modal']}>
<View className={styles['modal-content']} onClick={e=>e.stopPropagation()}>
<View className={styles['modal-title']}>首次登录提醒</View>
<View className={styles['modal-letter']}>
<View className={styles['modal-letter-beginn']}>To: 万丰园纺织科技</View>
<View className={styles['modal-letter-text']}>尊敬的老朋友,欢迎你使用小程序商城;由于您是我们长期合作的伙伴,你的组织已自动为你生成,关联后可查看历史订单哟。</View>
<View className={styles['modal-letter-end']}>信息错误请联系客服</View>
<View onClick={handleouter} catchMove className={styles['tips-modal']}>
<View className={styles['tips-modal-content']} onClick={e=>e.stopPropagation()}>
<View className={styles['tips-modal-title']}>首次登录提醒</View>
<View className={styles['tips-modal-letter']}>
<View className={styles['tips-modal-letter-beginn']}>To: 万丰园纺织科技</View>
<View className={styles['tips-modal-letter-text']}>尊敬的老朋友,欢迎你使用小程序商城;由于您是我们长期合作的伙伴,你的组织已自动为你生成,关联后可查看历史订单哟。</View>
<View className={styles['tips-modal-letter-end']}>信息错误请联系客服</View>
</View>
<View className={styles['modal-button']}>
<Button hoverClass="none" openType="concat">联系客服</Button>
<View className={styles['tips-modal-button']}>
<Button hoverClass="none" openType="contact">联系客服</Button>
<View onClick={()=>setModalShow(false)}>我知道</View>
</View>
</View>
@@ -66,19 +64,18 @@ const Modal = memo((props:any)=>{
// 头部 | 订单
const Header = memo((props:any) => {
const {data, userInfo} = props;
let menu = [{ text: "待配布", icon: "icon-daipeibu" }, { text: "待付款", icon: "icon-daifukuan" },
{ text: "待发货", icon: "icon-daifahuo" }, { text: "已发货", icon: "icon-yifahuo" },
{ text: "退款/售后", icon: "icon-a-tuikuanshouhou" }];
const {data} = props;
let menu = [{ text: "待配布", icon: "icon-daipeibu", url: "/pages/orderList/index" }, { text: "待付款", icon: "icon-daifukuan", url: "/pages/orderList/index" },
{ text: "待发货", icon: "icon-daifahuo", url: "/pages/orderList/index" }, { text: "已发货", icon: "icon-yifahuo", url: "/pages/orderList/index" },
{ text: "退款/售后", icon: "icon-a-tuikuanshouhou", url: "/pages/orderList/index" }];
const { getPhoneNumber } = useLogin();
const mGetPhoneNumber = (ev)=>{
try {
if(ev.detail?.code){
getPhoneNumber(ev.detail.code);
} catch (error) {
}else{
alert.none("绑定失败!");
}
}
return (
<View className={styles.header}>
<View className={`${styles.crad} ${styles['header-card']}`}>
@@ -93,7 +90,7 @@ const Header = memo((props:any) => {
{data?.user_name}
</View>
<View className={styles['arcd-info-left-phone']}>
{userInfo?.phone?.replace(userInfo?.phone?.substring(3,7), "****")||<Button openType="getPhoneNumber" onGetPhoneNumber={mGetPhoneNumber}>绑定手机号码</Button>}
{data?.phone?data?.phone?.replace(data?.phone?.substring(3,7), "****"):<Button openType="getPhoneNumber" onGetPhoneNumber={mGetPhoneNumber}>绑定手机号码</Button>}
</View>
</View>
</View>
@@ -129,15 +126,14 @@ const Header = memo((props:any) => {
{
menu.map((item, index) => {
return (
<View className={styles['card-main-title-content-item']}>
<Navigator hoverClass="none" url={item.url} className={styles['card-main-title-content-item']}>
<Text className={`iconfont ${item.icon}`}></Text>
<View>{item.text}</View>
<View className={styles['card-main-title-content-item-badge']}>{index==2?"99+":10}</View>
</View>
</Navigator>
)
})
}
</View>
</View>
</View>