Merge branch 'dev' of ssh://git.online.zzfzyc.com:10022/mp/spider_cloud_warehouse into 订单页
This commit is contained in:
Haiyi
@@ -0,0 +1,3 @@
|
||||
export default {
|
||||
navigationBarTitleText: '新增地址',
|
||||
}
|
||||
@@ -0,0 +1,207 @@
|
||||
.main {
|
||||
background: #FFFFFF;
|
||||
border-radius: 16px;
|
||||
margin: 24px;
|
||||
padding: 40px 32px 50px 32px;
|
||||
|
||||
|
||||
.itemBox {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding-bottom: 40px;
|
||||
border-bottom: 1px solid #f7f7f7;
|
||||
margin-bottom: 40px;
|
||||
|
||||
|
||||
|
||||
.leftBox {
|
||||
font-size: 28px;
|
||||
font-family: PingFangSC-Medium, PingFang SC;
|
||||
font-weight: 500;
|
||||
color: #000000;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-right: 50px;
|
||||
}
|
||||
|
||||
.inputClass {
|
||||
font-size: 28px;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #000000;
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
.itemBox:first-child {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding-bottom: 40px;
|
||||
border-bottom: 1px solid #f7f7f7;
|
||||
margin-bottom: 40px;
|
||||
|
||||
.leftBox {
|
||||
font-size: 28px;
|
||||
font-family: PingFangSC-Medium, PingFang SC;
|
||||
font-weight: 500;
|
||||
color: #000000;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding-right: 25px;
|
||||
}
|
||||
|
||||
.inputClass {
|
||||
font-size: 28px;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #000000;
|
||||
}
|
||||
}
|
||||
|
||||
.itemBox:last-child {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding-bottom: 40px;
|
||||
margin-bottom: 40px;
|
||||
border-bottom: none;
|
||||
|
||||
|
||||
.leftBox {
|
||||
font-size: 28px;
|
||||
font-family: PingFangSC-Medium, PingFang SC;
|
||||
font-weight: 500;
|
||||
color: #000000;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-right: 50px;
|
||||
}
|
||||
|
||||
.inputClass {
|
||||
font-size: 28px;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #000000;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.checkBox {
|
||||
margin-left: 32px;
|
||||
margin-top: 24px;
|
||||
width: 702px;
|
||||
height: 120px;
|
||||
background: #FFFFFF;
|
||||
border-radius: 16px;
|
||||
overflow: hidden;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
|
||||
.leftCheck {
|
||||
margin-left: 32px;
|
||||
|
||||
.topFont {
|
||||
margin-top: 24px;
|
||||
font-size: 28px;
|
||||
font-family: PingFangSC-Medium, PingFang SC;
|
||||
font-weight: 500;
|
||||
color: #000000;
|
||||
}
|
||||
|
||||
.bottomFont {
|
||||
margin-top: 8px;
|
||||
font-size: 24px;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #000000;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
.bottomBox {
|
||||
width: 750px;
|
||||
height: 160px;
|
||||
background: #FFFFFF;
|
||||
bottom: 0;
|
||||
padding-top: 14px;
|
||||
position: fixed;
|
||||
display: flex;
|
||||
|
||||
.btn {
|
||||
margin-left: 32px;
|
||||
width: 702px;
|
||||
height: 80px;
|
||||
background: #337FFF;
|
||||
border-radius: 44px;
|
||||
opacity: 0.5;
|
||||
font-size: 28px;
|
||||
font-family: PingFangSC-Medium, PingFang SC;
|
||||
font-weight: 500;
|
||||
color: #FFFFFF;
|
||||
text-align: center;
|
||||
line-height: 80px;
|
||||
}
|
||||
|
||||
.adtiveBtns {
|
||||
margin-left: 32px;
|
||||
width: 702px;
|
||||
height: 80px;
|
||||
background: #337FFF;
|
||||
border-radius: 44px;
|
||||
font-size: 28px;
|
||||
font-family: PingFangSC-Medium, PingFang SC;
|
||||
font-weight: 500;
|
||||
color: #FFFFFF;
|
||||
text-align: center;
|
||||
line-height: 80px;
|
||||
}
|
||||
|
||||
.delectBox {
|
||||
width: 311px;
|
||||
height: 80px;
|
||||
border-radius: 44px;
|
||||
border: 1px solid #087EFF;
|
||||
margin-left: 48px;
|
||||
font-size: 28px;
|
||||
font-family: PingFangSC-Medium, PingFang SC;
|
||||
font-weight: 500;
|
||||
color: #337FFF;
|
||||
text-align: center;
|
||||
line-height: 80px;
|
||||
}
|
||||
|
||||
.nobtn {
|
||||
width: 311px;
|
||||
height: 80px;
|
||||
background: #337FFF;
|
||||
border-radius: 44px;
|
||||
opacity: 0.5;
|
||||
margin-left: 32px;
|
||||
text-align: center;
|
||||
line-height: 80px;
|
||||
font-size: 28px;
|
||||
color: FFFFFF;
|
||||
}
|
||||
|
||||
.sureBox {
|
||||
width: 311px;
|
||||
height: 80px;
|
||||
background: #337FFF;
|
||||
border-radius: 44px;
|
||||
font-size: 28px;
|
||||
font-family: PingFangSC-Medium, PingFang SC;
|
||||
font-weight: 500;
|
||||
color: #FFFFFF;
|
||||
margin-left: 32px;
|
||||
text-align: center;
|
||||
line-height: 80px;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,289 @@
|
||||
import { alert, retrieval } from "@/common/common"
|
||||
import Address from "@/components/address"
|
||||
import FromList from "@/components/FromList"
|
||||
import { Button, Input, Text, Textarea, View, Switch } from "@tarojs/components"
|
||||
import Taro, { setNavigationBarTitle, useDidShow, useRouter, showToast } from "@tarojs/taro"
|
||||
import { useEffect, useMemo, useState } from "react"
|
||||
import styles from "./index.module.scss"
|
||||
import classnames from "classnames";
|
||||
import { mppurchaseraddress, mppurchaseraddressget, mppurchaseraddressput } from '@/api/addressList'
|
||||
import { getFilterData } from '@/common/util'
|
||||
import search from "@/components/search"
|
||||
|
||||
export default () => {
|
||||
|
||||
const [itemList, setItemList] = useState<any[]>(
|
||||
[
|
||||
{
|
||||
title: '联系人',
|
||||
require: true,
|
||||
placeholderFont: '请输入收货人姓名',
|
||||
type: 'text',
|
||||
value: '',
|
||||
},
|
||||
{
|
||||
title: '联系方式',
|
||||
require: true,
|
||||
placeholderFont: '请输入联系方式',
|
||||
type: 'number',
|
||||
value: '',
|
||||
maxLength: 11
|
||||
},
|
||||
{
|
||||
title: '收货地址',
|
||||
require: true,
|
||||
placeholderFont: '请选择/省/市/区',
|
||||
type: 'select',
|
||||
disabled: true,
|
||||
value: '',
|
||||
},
|
||||
{
|
||||
title: '详细地址',
|
||||
require: true,
|
||||
placeholderFont: '请输入详细地址（街道、门牌号等）',
|
||||
type: 'text',
|
||||
value: '',
|
||||
}
|
||||
]
|
||||
)
|
||||
|
||||
const [ischecked, setIsChecked] = useState(false)
|
||||
const onChange = (eq) => {
|
||||
setIsChecked(eq.detail.value)
|
||||
setFormData((e) => ({ ...e, is_default: eq.detail.value, address_detail: itemList[3].value }))
|
||||
}
|
||||
|
||||
const router = useRouter()
|
||||
useDidShow(() => {
|
||||
if (router.params.type === 'add') {
|
||||
setNavigationBarTitle({ title: "新增收货地址" })
|
||||
} else {
|
||||
setFormData((e) => ({ ...e, id: router.params.id as any }))
|
||||
getInfo()
|
||||
setNavigationBarTitle({ title: "编辑收货地址" })
|
||||
}
|
||||
})
|
||||
const [formData, setFormData] = useState({
|
||||
name: "",
|
||||
phone: "",
|
||||
site: "",
|
||||
siteArray: [],
|
||||
district_id: "",
|
||||
address_detail: "",
|
||||
is_default: false,
|
||||
id: '',
|
||||
})
|
||||
//获取相应id的信息
|
||||
const { fetchData: infoFetch } = mppurchaseraddressget()
|
||||
const getInfo = async () => {
|
||||
let res = await infoFetch({
|
||||
id: router.params.id,
|
||||
})
|
||||
if (res.data) {
|
||||
let arr: any[] = []
|
||||
arr = [
|
||||
{ id: res.data.province_id, name: res.data.province_name },
|
||||
{ id: res.data.city_id, name: res.data.city_name },
|
||||
{ id: res.data.district_id, name: res.data.district_name }
|
||||
]
|
||||
setFormData({
|
||||
name: res.data.name,
|
||||
phone: res.data.phone,
|
||||
site: res.data.province_name + res.data.city_name + res.data.district_name,
|
||||
siteArray: arr as any,
|
||||
address_detail: res.data.address_detail,
|
||||
district_id: res.data.district_id,
|
||||
is_default: res.data.is_default,
|
||||
id: res.data.id,
|
||||
// purchaser_id: res.data.purchaser_id
|
||||
})
|
||||
|
||||
itemList.map(item => {
|
||||
if (item.title === '联系人') {
|
||||
item.value = res.data.name
|
||||
}
|
||||
if (item.title === '联系方式') {
|
||||
item.value = res.data.phone
|
||||
}
|
||||
if (item.title === '收货地址') {
|
||||
item.value = res.data.province_name, res.data.city_name, res.data.district_name
|
||||
}
|
||||
if (item.title === '详细地址') {
|
||||
item.value = res.data.address_detail
|
||||
}
|
||||
return item
|
||||
})
|
||||
setItemList([...itemList])
|
||||
setIsChecked(res.data.is_default)
|
||||
}
|
||||
|
||||
}
|
||||
// `${res.data.province_name} + ${res.data.city_name} + ${res.data.district_name}`
|
||||
|
||||
|
||||
const btnDisabled = useMemo(() => {
|
||||
let canShow = false
|
||||
const obj = itemList.filter(item => {
|
||||
return item.value !== ''
|
||||
})
|
||||
if (obj.length !== 4) {
|
||||
canShow = true
|
||||
} else {
|
||||
canShow = false
|
||||
}
|
||||
return canShow
|
||||
}, [itemList])
|
||||
|
||||
const [showSiteModal, setShowSiteModal] = useState(false);
|
||||
|
||||
const handleSetSite = (ev: any) => {
|
||||
var addressName: any = []
|
||||
ev.forEach(v => {
|
||||
addressName.push(v.name)
|
||||
})
|
||||
if (ev.length === 3) {
|
||||
itemList.map(it => {
|
||||
if (it.type === 'select') {
|
||||
it.value = addressName
|
||||
}
|
||||
return it
|
||||
})
|
||||
setItemList([...itemList])
|
||||
setShowSiteModal(false)
|
||||
|
||||
}
|
||||
setFormData({
|
||||
name: itemList[0]?.value,
|
||||
phone: itemList[1]?.value,
|
||||
site: addressName.join(' '),
|
||||
district_id: ev[ev.length - 1]?.id,
|
||||
is_default: ischecked,
|
||||
address_detail: itemList[3]?.value,
|
||||
id: router.params.id ? router.params.id : '',
|
||||
siteArray: ev
|
||||
})
|
||||
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
setFormData(formData)
|
||||
}, [formData])
|
||||
|
||||
useEffect(() => {
|
||||
setItemList(itemList)
|
||||
}, [itemList])
|
||||
const onClose = () => {
|
||||
setShowSiteModal(false)
|
||||
}
|
||||
|
||||
const changeInput = (e, item) => {
|
||||
itemList.map(it => {
|
||||
if (it.title === item.title) {
|
||||
it.value = e.detail.value
|
||||
}
|
||||
return it
|
||||
})
|
||||
setItemList([...itemList])
|
||||
setFormData((e) => ({ ...e, name: itemList[0].value, phone: itemList[1].value, address_detail: itemList[3].value }))
|
||||
|
||||
}
|
||||
|
||||
|
||||
const showModal = (item) => {
|
||||
if (item.type === 'select') {
|
||||
setShowSiteModal(true)
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
const navBack = () => {
|
||||
Taro.navigateBack({
|
||||
delta: 1
|
||||
})
|
||||
}
|
||||
//新增地址
|
||||
const { fetchData: addAddressFetch } = mppurchaseraddress()
|
||||
const handAdd = async () => {
|
||||
let res = await addAddressFetch({ ...getFilterData(formData), purchaser_id: Number(router.params.purchaser_id) })
|
||||
if (res.data) {
|
||||
Taro.showToast({
|
||||
title: '成功',
|
||||
icon: "none"
|
||||
})
|
||||
navBack()
|
||||
} else {
|
||||
Taro.showToast({
|
||||
title: res.msg
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
// 编辑地址
|
||||
const { fetchData: putFetch } = mppurchaseraddressput()
|
||||
const handEdit = async () => {
|
||||
let res = await putFetch({ ...getFilterData(formData), purchaser_id: Number(router.params.purchaser_id), id: Number(router.params.purchaser_id) })
|
||||
if (res.msg === 'success') {
|
||||
Taro.showToast({
|
||||
title: '成功',
|
||||
icon: "none"
|
||||
})
|
||||
navBack()
|
||||
} else {
|
||||
Taro.showToast({
|
||||
title: res.msg
|
||||
})
|
||||
}
|
||||
}
|
||||
return (
|
||||
<>
|
||||
<View className={styles.main}>
|
||||
{itemList.map((item, index) => {
|
||||
return (
|
||||
<View className={styles.itemBox} key={index}>
|
||||
<View className={styles.leftBox}>
|
||||
{item.title}<Text style={{ color: 'red' }}>*</Text>
|
||||
</View>
|
||||
<Input
|
||||
maxlength={item.maxLength ? 11 : 100}
|
||||
onInput={(e) => changeInput(e, item)}
|
||||
type={item.type}
|
||||
onClick={() => showModal(item)}
|
||||
style={{ width: '212px' }}
|
||||
disabled={item.disabled}
|
||||
placeholder={item.placeholderFont}
|
||||
value={item.value}
|
||||
className={styles.inputClass}
|
||||
placeholderStyle='font-size: 28rpx;color: #000000;'
|
||||
></Input>
|
||||
</View>
|
||||
)
|
||||
})}
|
||||
|
||||
|
||||
</View>
|
||||
<View className={styles.checkBox}>
|
||||
<View className={styles.leftCheck}>
|
||||
<View className={styles.topFont}>设置默认地址</View>
|
||||
<View className={styles.bottomFont}>提醒：下单会优先使用该地址</View>
|
||||
</View>
|
||||
<Switch checked={ischecked} color={'#337fff'} onChange={(e) => { onChange(e) }} />
|
||||
</View>
|
||||
|
||||
{
|
||||
router.params.type === 'add' &&
|
||||
<View className={styles.bottomBox}>
|
||||
<Button disabled={btnDisabled} onClick={() => handAdd()} className={classnames(btnDisabled ? styles.btn : styles.adtiveBtns)}>保存</Button>
|
||||
</View>
|
||||
}
|
||||
{
|
||||
router.params.type === 'edit' &&
|
||||
<View className={styles.bottomBox}>
|
||||
<Button className={styles.delectBox} >删除</Button>
|
||||
<Button onClick={() => handEdit()} disabled={btnDisabled} className={classnames(btnDisabled ? styles.nobtn : styles.sureBox)} >确认</Button>
|
||||
</View>
|
||||
}
|
||||
<Address addressOnChange={handleSetSite} defaultValue={formData.siteArray} addressOnClose={() => onClose()} show={showSiteModal} />
|
||||
|
||||
</>
|
||||
)
|
||||
}
|
||||
@@ -5,10 +5,10 @@ import { stopPullDownRefresh, usePullDownRefresh } from "@tarojs/taro"
|
||||
import { useState } from "react"
|
||||
import "./index.scss"
|
||||
|
||||
export default ()=>{
|
||||
export default () => {
|
||||
return (
|
||||
<View className="address-manager">
|
||||
{/* <AddressList refresherEnabled={true}/> */}
|
||||
<AddressList refresherEnabled={true} purchaser_id={642} />
|
||||
</View>
|
||||
)
|
||||
}
|
||||
@@ -0,0 +1,3 @@
|
||||
export default {
|
||||
navigationBarTitleText: '登录',
|
||||
}
|
||||
@@ -0,0 +1,93 @@
|
||||
page {
|
||||
height: 100vh;
|
||||
}
|
||||
.login {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-color: white;
|
||||
&-panel {
|
||||
padding: 0 48px;
|
||||
}
|
||||
&-title {
|
||||
margin-left: 11px;
|
||||
Text {
|
||||
display: block;
|
||||
&:first-child {
|
||||
font-size: 70px;
|
||||
font-weight: 500;
|
||||
color: $color_font_one;
|
||||
}
|
||||
&:last-child {
|
||||
font-size: 40px;
|
||||
color: #727272;
|
||||
font-weight: 500;
|
||||
line-height: 2;
|
||||
}
|
||||
}
|
||||
}
|
||||
.input-bar {
|
||||
display: flex;
|
||||
flex-flow: row nowrap;
|
||||
align-items: center;
|
||||
border: 1px solid #c2c2c2;
|
||||
border-radius: 12px;
|
||||
margin-top: 40px;
|
||||
padding: 20px;
|
||||
font-size: 40px;
|
||||
@mixin inputBaseStyle {
|
||||
display: block;
|
||||
width: 100%;
|
||||
flex: 1 1 auto;
|
||||
padding-left: 20px;
|
||||
font-size: 32px;
|
||||
padding-right: 0;
|
||||
}
|
||||
&--account {
|
||||
@include inputBaseStyle;
|
||||
}
|
||||
&--password {
|
||||
@include inputBaseStyle;
|
||||
}
|
||||
}
|
||||
&-options {
|
||||
display: flex;
|
||||
flex-flow: row nowrap;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 0 10px;
|
||||
}
|
||||
&-option {
|
||||
display: flex;
|
||||
flex-flow: row nowrap;
|
||||
align-items: center;
|
||||
margin-top: 40px;
|
||||
font-size: 26px;
|
||||
color: #909090;
|
||||
}
|
||||
&-button {
|
||||
margin-top: 120px;
|
||||
}
|
||||
}
|
||||
.isRememberPwd {
|
||||
display: block;
|
||||
margin-left: 10px;
|
||||
}
|
||||
.isForgetPwd {
|
||||
margin: 0 20px;
|
||||
}
|
||||
.quick-login {
|
||||
margin-top: 85px;
|
||||
&--options {
|
||||
display: flex;
|
||||
flex-flow: row nowrap;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
&--divider{
|
||||
font-size: 25px;
|
||||
color: #acacac;
|
||||
}
|
||||
&--iconCard{
|
||||
color: #acacac;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,141 @@
|
||||
import Divider from '@/components/divider'
|
||||
import IconFont from '@/components/iconfont'
|
||||
import { View, Image, Text, Input } from '@tarojs/components'
|
||||
import { FC, useState } from 'react'
|
||||
import styles from './index.module.scss'
|
||||
import MCheckbox from '@/components/checkbox'
|
||||
import NormalButton from '@/components/normalButton'
|
||||
import IconCard from '@/components/iconCard'
|
||||
import {memo} from 'react'
|
||||
import { LoginApi } from '@/api'
|
||||
import Taro from '@tarojs/taro'
|
||||
import { alert } from '@/common/common'
|
||||
import useUserInfo from '@/use/useUserInfo'
|
||||
|
||||
const Login: FC = () => {
|
||||
const [isRemember, setRemember] = useState(false)
|
||||
|
||||
const [eyesStatus, setEyesStatus] = useState(true)
|
||||
|
||||
const handlePwdVisible = () => {
|
||||
setEyesStatus((value) => !value)
|
||||
}
|
||||
|
||||
const selectCallBack = () => {
|
||||
console.log('selectCallBack')
|
||||
setRemember(true)
|
||||
}
|
||||
const closeCallBack = () => {
|
||||
setRemember(false)
|
||||
console.log('closeCallBack')
|
||||
}
|
||||
|
||||
const [account, setAccount] = useState('')
|
||||
const [password, setPassword] = useState('')
|
||||
|
||||
const formatInput = (value:string) => {
|
||||
return value.trim()
|
||||
}
|
||||
|
||||
const handleInputAccount = (event: any) => {
|
||||
const formated = formatInput(event.detail.value)
|
||||
setAccount(formated)
|
||||
}
|
||||
const handleInputPassword = (event: any) => {
|
||||
const formated = formatInput(event.detail.value)
|
||||
setPassword(formated)
|
||||
}
|
||||
|
||||
const { setToken, setUserInfo } = useUserInfo()
|
||||
|
||||
|
||||
|
||||
const { fetchData } = LoginApi()
|
||||
|
||||
|
||||
|
||||
|
||||
const handleLogin = async () => {
|
||||
if (account === '' || password === '') return alert.error('账号密码不能为空！')
|
||||
console.log('账户密码：', account, password)
|
||||
const res = await fetchData({
|
||||
account,
|
||||
password,
|
||||
})
|
||||
console.log('state===>', res)
|
||||
if (res.success) {
|
||||
alert.success('登陆成功')
|
||||
setToken(res.data.token)
|
||||
setUserInfo({ ...res.data })
|
||||
|
||||
Taro.redirectTo({
|
||||
url: '/pages/index/index',
|
||||
})
|
||||
} else {
|
||||
alert.error('登陆失败')
|
||||
}
|
||||
}
|
||||
|
||||
return (
|
||||
<View className={styles.login}>
|
||||
<Image className='full-100' mode='widthFix' src='https://s1.ax1x.com/2022/09/08/vqiVZF.png'></Image>
|
||||
<View className={styles['login-panel']}>
|
||||
<View className={styles['login-title']}>
|
||||
<Text>您好，</Text>
|
||||
<Text>欢迎来到蜘蛛管家</Text>
|
||||
</View>
|
||||
<View className={styles['input-bar']}>
|
||||
<IconFont name='icon-yonghuming' size={48} color='#999999'></IconFont>
|
||||
<Divider direction='vertical'></Divider>
|
||||
<Input onInput={handleInputAccount} className={styles['input-bar--account']} placeholder='请输入用户名'></Input>
|
||||
</View>
|
||||
<View className={styles['input-bar']}>
|
||||
<IconFont name='icon-mima' size={48} color='#999999'></IconFont>
|
||||
<Divider direction='vertical'></Divider>
|
||||
<Input
|
||||
onInput={handleInputPassword}
|
||||
password={eyesStatus}
|
||||
className={styles['input-bar--password']}
|
||||
type='safe-password'
|
||||
placeholder='请输入密码'></Input>
|
||||
<View onClick={handlePwdVisible}>
|
||||
{!eyesStatus ? (
|
||||
<IconFont name='icon-yanjing' size={48} color='#999999'></IconFont>
|
||||
) : (
|
||||
<IconFont name='icon-biyan' size={48} color='#999999'></IconFont>
|
||||
)}
|
||||
</View>
|
||||
</View>
|
||||
<View className={styles['login-options']}>
|
||||
<View className={styles['login-option']}>
|
||||
<MCheckbox status={isRemember} size='small' circle onSelect={selectCallBack} onClose={closeCallBack}>
|
||||
记住密码
|
||||
</MCheckbox>
|
||||
</View>
|
||||
<View className={styles['login-option']}>
|
||||
<Text className={styles.isForgetPwd}>忘记密码？</Text>
|
||||
</View>
|
||||
</View>
|
||||
<NormalButton circle plain onClick={handleLogin} customClassName={styles['login-button']}>
|
||||
登录
|
||||
</NormalButton>
|
||||
<QuickLogin />
|
||||
</View>
|
||||
</View>
|
||||
)
|
||||
}
|
||||
|
||||
const QuickLogin: FC = memo(() => {
|
||||
return (
|
||||
<View className={styles['quick-login']}>
|
||||
<Divider direction='horizontal' customClassName={styles['quick-login--divider']}>
|
||||
或通过以下方式登录
|
||||
</Divider>
|
||||
<View className={styles['quick-login--options']}>
|
||||
<IconCard iconName='icon-weixindenglu' title='微信登录' customClass={styles['quick-login--iconCard']}></IconCard>
|
||||
</View>
|
||||
</View>
|
||||
)
|
||||
})
|
||||
|
||||
export default Login
|
||||
@@ -135,7 +135,7 @@
|
||||
|
||||
.saomiao {
|
||||
margin-right: 24px;
|
||||
font-size: 26px;
|
||||
font-size: 40px;
|
||||
color: #000;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -86,7 +86,7 @@ page{
|
||||
.layoutTitle {
|
||||
font-size: 32px;
|
||||
font-weight: 600;
|
||||
color: #333;
|
||||
color: $color_font_one;
|
||||
font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
|
||||
margin-bottom: 20px;
|
||||
|
||||
|
||||
+23
-21
@@ -1,6 +1,5 @@
|
||||
import { isEmptyObject } from '@/common/common'
|
||||
import { Button, View, Image, Text } from '@tarojs/components'
|
||||
import { FC, memo, useMemo, useState } from 'react'
|
||||
import { View, Image, Text } from '@tarojs/components'
|
||||
import { FC, useState } from 'react'
|
||||
import styles from './index.module.scss'
|
||||
import defaultAvatar from '../../styles/image/defaultAvatar.png'
|
||||
import NormalButton from '@/components/normalButton'
|
||||
@@ -9,6 +8,8 @@ import Divider from '@/components/Divider'
|
||||
import LayoutBlock from '@/components/layoutBlock'
|
||||
import IconCard from '@/components/iconCard'
|
||||
import IconFont from '@/components/iconfont'
|
||||
import useUserInfo from '@/use/useUserInfo'
|
||||
import { goLink } from '@/common/common'
|
||||
|
||||
type IconfontName = Parameters<typeof IconFont>['0']['name']
|
||||
type IconCardType = {
|
||||
@@ -19,11 +20,13 @@ type IconCardType = {
|
||||
|
||||
// 用户信息
|
||||
const UserInfo: FC = () => {
|
||||
const [userInfo, setUserInfo] = useState({
|
||||
avatarUrl: '',
|
||||
username: '',
|
||||
userno: '',
|
||||
})
|
||||
const { removeToken, removeUserInfo, userInfo } = useUserInfo()
|
||||
console.log('userInfo==>', userInfo)
|
||||
// const [userInfo, setUserInfo] = useState({
|
||||
// avatarUrl: '',
|
||||
// username: '',
|
||||
// userno: '',
|
||||
// })
|
||||
|
||||
|
||||
const feature: IconCardType[] = [
|
||||
@@ -63,7 +66,7 @@ const UserInfo: FC = () => {
|
||||
path: '',
|
||||
},
|
||||
{
|
||||
iconName: 'icon-shoukuanliebiao',
|
||||
iconName: 'icon-kehuxinxi',
|
||||
name: '客户列表',
|
||||
path: '',
|
||||
},
|
||||
@@ -110,21 +113,27 @@ const UserInfo: FC = () => {
|
||||
},
|
||||
]
|
||||
|
||||
const handleLogout = () => {}
|
||||
|
||||
// 退出登录
|
||||
const handleLogout = () => {
|
||||
removeToken()
|
||||
removeUserInfo()
|
||||
goLink('/pages/login/index', {}, 'reLaunch')
|
||||
}
|
||||
|
||||
return (
|
||||
<>
|
||||
<LayoutBlock circle>
|
||||
<View className={styles.topBar}>
|
||||
<View className={styles.left}>
|
||||
<UserAvatar src={userInfo.avatarUrl} />
|
||||
<UserAvatar src={userInfo.userInfo.avatar_url} />
|
||||
</View>
|
||||
<View className={styles.middle}>
|
||||
<Text className={styles.username}>杨子杰</Text>
|
||||
<Text className={styles.userno}>064</Text>
|
||||
<Text className={styles.username}>{userInfo.userInfo.user_name}</Text>
|
||||
<Text className={styles.userno}>{userInfo.userInfo.user_code}</Text>
|
||||
</View>
|
||||
<View className={styles.right}>
|
||||
<NormalButton type='primary' circle size='normal' onClick={handleLogout}>
|
||||
<NormalButton type='primary' round size='normal' onClick={handleLogout}>
|
||||
退出登录
|
||||
</NormalButton>
|
||||
</View>
|
||||
@@ -161,13 +170,6 @@ const UserInfo: FC = () => {
|
||||
})}
|
||||
</View>
|
||||
</LayoutBlock>
|
||||
{/* <LayoutBlock circle>
|
||||
<View className={styles.layoutTabBar}>
|
||||
<View className={styles.layoutTitle}>客户列表</View>
|
||||
<View className={styles.layoutDescription}>查看全部客户 ▶</View>
|
||||
</View>
|
||||
asdfasdfasdfas
|
||||
</LayoutBlock> */}
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user