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

🎈 perf(完成UI界面和逻辑): 完成

Browse Source
This commit is contained in:
xuan 2022-12-27 11:09:04 +08:00
parent 27d75eb3eb
commit 53d6d49d6d
7 changed files with 89 additions and 56 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
src/common/constant.ts
View File

@ -1,11 +1,11 @@
// 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.89:50001/lymarket`
// export const BASE_URL = `http://10.0.0.5:50001/lymarket`
// export const BASE_URL = `http://192.168.0.89:40001/lymarket`
// export const BASE_URL = `http://192.168.1.165:40001/lymarket` // 王霞
// export const BASE_URL = `https://test.zzfzyc.com/lymarket` // 测试环境
export const BASE_URL = 'https://pre.zzfzyc.com/lymarket' // 预发布
// export const BASE_URL = 'https://test.zzfzyc.com/lymarket' // 测试环境
// export const BASE_URL = 'https://pre.zzfzyc.com/lymarket' // 预发布
// export const BASE_URL = `http://192.168.1.9:40001/lymarket` // 发
// export const BASE_URL = `http://192.168.1.9:50005/lymarket` // 发
// export const BASE_URL = `http://192.168.1.30:50001/lymarket` // 发

3
src/components/bindSalesManDialog/index.tsx
View File

@ -8,14 +8,11 @@ import NormalButton from '../normalButton'
import LayoutBlock from '../layoutBlock'
import IconText from '../iconText'
import IconFont from '../iconfont/iconfont'
import InputX from '../InputX'
import Divider from '../divider'
import styles from './index.module.scss'
import { formatImgUrl } from '@/common/fotmat'
import { alert, goLink } from '@/common/common'
import CloseBtn from '@/components/closeBtn'
import { getCDNSource } from '@/common/constant'
import { getFilterData } from '@/common/util'
import { BindInvitationInfoApi, GetInvitationInfoApi } from '@/api/user'
// 获取业务员信息
interface Param { invitation_code: string; name: string; phone: string }

22
src/components/organizationNameModal/index.module.scss
View File

@ -4,13 +4,23 @@
border-radius: 20px;
padding-top: 20px;
overflow: hidden;
.input {
border: 1px solid #eee;
margin: 20px 40px;
padding: 8px;
border-radius: 8px;
.inputBar {
border: 1px solid transparent;
background-color: #f5f5f5;
border-radius: 20px;
padding: 20px 42px;
margin: 32px 40px;
font-size: 26px;
color: #333;
&_focus {
border: 1px solid #337fff;
}
&_error {
border: 1px solid #f64861;
color: #f64861;
}
}
&_title {
padding: 10px;
text-align: center;
@ -44,7 +54,7 @@
color: #333;
}
&_right {
color: #606f97;
color: #337fff;
}
}
.tips {

31
src/components/organizationNameModal/index.tsx
View File

@ -1,6 +1,6 @@
import type { CommonEventFunction, InputProps } from '@tarojs/components'
import { Input, View } from '@tarojs/components'
import { useState } from 'react'
import React, { useState } from 'react'
import classNames from 'classnames'
import Dialog from '../Dialog'
import InputX from '../InputX'
@ -23,16 +23,7 @@ const OrganizationNameModal = (props: PropsType) => {
onConfirm,
} = props
const [_show, setShow] = usePropsValue({
value: showModal,
defaultValue: false,
onChange: (value) => {
onShowModalChange?.(value)
},
})
const handleClose = () => {
setShow(false)
onClose?.()
}
@ -45,16 +36,34 @@ const OrganizationNameModal = (props: PropsType) => {
const handleConfirm = () => {
onConfirm?.(text)
}
const [inputStyles, setInputStyles] = useState<string[]>([])
const Reg = /^[a-zA-Z0-9\u4E00-\u9FA5]+$/
const handleIntput: CommonEventFunction<InputProps.inputEventDetail> = (e) => {
if (!Reg.test(e.detail.value)) {
setInputStyles(() => [styles.inputBar_error])
setText(e.detail.value)
return
}
setText(e.detail.value)
}
const handleFocus = () => {
if (text && !Reg.test(text)) {
setInputStyles(() => [styles.inputBar_error])
return
}
setInputStyles(() => [styles.inputBar_focus])
}
const handleBlur = () => {
setInputStyles(() => [])
}
return <Dialog show={showModal} onClose={handleClose} onChange={onShowModalChange}>
<View className={styles.organizationNameModal}>
<View className={styles.organizationNameModal_title}>请设置您的组织昵称</View>
<View className={styles.organizationNameModal_content}>
<View className={styles.tips}>公司名称是辨识您身份的重要依据，请谨慎修改。（仅支持修改一次）</View>
<InputX customClassName={styles.input} onInput={handleIntput} value={text} type="text" placeholder="请输入 组织/公司/码单昵称" />
<Input className={classNames(styles.inputBar, [...inputStyles])} onFocus={handleFocus} onBlur={handleBlur} onInput={handleIntput} value={text} type="text" placeholder="请输入 组织/公司/码单昵称" />
</View>
<View className={styles.organizationNameModal_bottomBar}>
<View hoverClass="hoverClass" className={classNames(styles.button, styles.organizationNameModal_bottomBar_left)} onClick={handleCancel}>下次更改</View>

55
src/pages/userEdit/components/ModifyModal/index.module.scss
View File

@ -1,8 +1,11 @@
.modify-ickname-content {
margin: 0 auto;
padding: 40px 50px;
padding: 40px 0;
.modify-ickname-input {
margin-top: 30px;
margin-left: 48px;
margin-right: 48px;
height: 182px;
background: #f3f3f3;
border: 2px solid #e6e6e6;
@ -26,6 +29,7 @@
}
.modify-ickname-tips {
padding: 0 48px;
font-size: 22px;
font-weight: 400;
color: #ababab;
@ -34,24 +38,28 @@
.modify-ickname-operation {
background: #ffffff;
border: 2px solid #cde5ff;
border-radius: 40px;
display: flex;
overflow: hidden;
flex-flow: row nowrap;
justify-content: space-around;
align-items: center;
padding: 0 48px;
margin-top: 80px;
display: flex;
}
.modify-ickname-operation .button {
width: 50%;
font-size: 32px;
padding: 20px 0;
font-weight: 400;
color: #007aff;
background-color: white;
border: none;
outline: none;
border-radius: 0;
.button {
width: 45%;
font-size: 32px;
padding: 20px 0;
font-weight: 400;
&::after {
border-radius: 0;
}
}
.modify-ickname-operation-save {
background: #007aff;
color: #ffffff;
}
.modify-ickname-operation-IKnown {
width: 100%;
}
}
.modify-ickname-operation .button::after,
@ -59,19 +67,12 @@
border-radius: 0;
border: none;
}
.modify-ickname-operation .modify-ickname-operation-save {
background: #007aff;
color: #ffffff;
}
.modify-ickname-operation .button::after {
border-radius: 0;
}
}
.warn-tips {
background-color: #fef9f4;
line-height: 1.5;
padding: 15px 48px;
font-size: 22px;
font-weight: 400;
color: #ff9b33;
margin-top: 30px;
}

14
src/pages/userEdit/components/ModifyModal/index.tsx
View File

@ -85,15 +85,23 @@ const ModifyModal = (props: Params, ref: Ref<ModifyModalRef>) => {
return (
<Popup onClose={() => setModalShow(false)} title={title} show={modalShow}>
<View style={{ marginBottom: `${textareaBottom}px` }} className={styles['modify-ickname-content']}>
{tipsComp}
<View className={styles['modify-ickname-input']}>
<Textarea showConfirmBar={false} auto-focus adjustPosition={false} value={value} onBlur={handleBlur} onFocus={handleFocus} onInput={handleTextareaInput} maxlength={20} />
<Text>{value?.length}/20</Text>
</View>
<View className={styles['modify-ickname-tips']}>请设置2-20个字符，可由中文、英文、数字组成</View>
{tipsComp}
<View className={styles['modify-ickname-operation']}>
<NormalButton onClick={handleTextareaReset} type="info" customClassName={classNames(styles.button, styles['modify-ickname-operation-reset'])}>重置</NormalButton>
<NormalButton disabled={isInvalidate} onClick={() => props.save(value)} type="primary" customClassName={classNames(styles.button, styles['modify-ickname-operation-save'])}>保存</NormalButton>
{
// TODO 检测是否没机会修改
true
? <>
<NormalButton round type="primary" plain onClick={handleTextareaReset} customClassName={classNames(styles.button, styles['modify-ickname-operation-reset'])}>重置</NormalButton>
<NormalButton round disabled={isInvalidate} onClick={() => props.save(value)} type="primary" customClassName={classNames(styles.button, styles['modify-ickname-operation-save'])}>保存</NormalButton>
</>
: <NormalButton round onClick={() => setModalShow(false)} type="primary" customClassName={classNames(styles.button, styles['modify-ickname-operation-IKnown'])}>知道了</NormalButton>
}
</View>
</View>
</Popup>

14
src/pages/userEdit/index.tsx
View File

@ -199,9 +199,17 @@ export default () => {
}
const [showModal, setShowModal] = useState(false)
const handleClose = () => {
setShowModal(false)
}
const handleShowChange = (val: boolean) => {
setShowModal(val)
}
const handleClickNickname = () => {
setShowModal(true)
// ModifyNicknameEl.current?.setModalShow(true)
// setShowModal(true)
ModifyNicknameEl.current?.setModalShow(true)
}
const handleClickCompanyName = () => {
ModifyCompanyNameEl.current?.setModalShow(true)
@ -270,7 +278,7 @@ export default () => {
value={formData?.company_name}
save={value => handleTextareaSave(value, 'companyName')}
/>
<OrganizationNameModal showModal={showModal} />
<OrganizationNameModal showModal={showModal} onClose={handleClose} onShowModalChange={handleShowChange} />
</View>
)
}