✨ feat:菜单组件暴露ref方法出去
This commit is contained in:
parent
a115787a02
commit
09327c7a7c
@ -124,5 +124,9 @@ export default defineAppConfig({
|
|||||||
root: 'pages/collectionDetail',
|
root: 'pages/collectionDetail',
|
||||||
pages: ['index'],
|
pages: ['index'],
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
root: 'pages/customerManagement',
|
||||||
|
pages: ['index'],
|
||||||
|
},
|
||||||
],
|
],
|
||||||
})
|
})
|
||||||
|
|||||||
@ -3,7 +3,7 @@
|
|||||||
*/
|
*/
|
||||||
|
|
||||||
import { View, Text } from '@tarojs/components'
|
import { View, Text } from '@tarojs/components'
|
||||||
import { useEffect, useMemo, useRef, useState } from 'react'
|
import { useEffect, useMemo, useRef, useState, forwardRef, useImperativeHandle } from 'react'
|
||||||
import styles from './index.module.scss'
|
import styles from './index.module.scss'
|
||||||
import Iconfont from '../iconfont/iconfont'
|
import Iconfont from '../iconfont/iconfont'
|
||||||
import Popup from '../popup'
|
import Popup from '../popup'
|
||||||
@ -30,11 +30,19 @@ interface PropsType extends DropDownEvent {
|
|||||||
activeColor?: string
|
activeColor?: string
|
||||||
showOverlay?: boolean
|
showOverlay?: boolean
|
||||||
customClassName?: string
|
customClassName?: string
|
||||||
customStyle?: React.CSSProperties
|
customStyle?: React.CSSProperties,
|
||||||
|
hasBottomBtn?: boolean //底部有按钮不允许点击蒙层关闭
|
||||||
}
|
}
|
||||||
|
|
||||||
export default (props: PropsType) => {
|
export default forwardRef((props: PropsType, ref) => {
|
||||||
const { children, direction = 'down', title = '', value, options = [], change, activeColor, showOverlay = true } = props
|
const { children, direction = 'down', title = '', value, options = [], change, activeColor, showOverlay = true, hasBottomBtn = false } = props
|
||||||
|
|
||||||
|
useImperativeHandle(ref, () => ({
|
||||||
|
//暴露出方法给有需要的用
|
||||||
|
closePopup() {
|
||||||
|
setShowPopup(false)
|
||||||
|
}
|
||||||
|
}))
|
||||||
|
|
||||||
const [showPopup, setShowPopup] = useState(false)
|
const [showPopup, setShowPopup] = useState(false)
|
||||||
|
|
||||||
@ -65,6 +73,7 @@ export default (props: PropsType) => {
|
|||||||
}
|
}
|
||||||
|
|
||||||
const handleClosePopup = () => {
|
const handleClosePopup = () => {
|
||||||
|
if (hasBottomBtn) return false
|
||||||
setShowPopup(false)
|
setShowPopup(false)
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -111,7 +120,7 @@ export default (props: PropsType) => {
|
|||||||
<Iconfont name={getIconName()} size={20} color={showPopup ? activeColor : '#7f7f7f'}></Iconfont>
|
<Iconfont name={getIconName()} size={20} color={showPopup ? activeColor : '#7f7f7f'}></Iconfont>
|
||||||
</View>
|
</View>
|
||||||
<Popup
|
<Popup
|
||||||
onClose={handleClosePopup}
|
onClose={() => handleClosePopup()}
|
||||||
showOverLay={showOverlay}
|
showOverLay={showOverlay}
|
||||||
show={showPopup}
|
show={showPopup}
|
||||||
showTitle={false}
|
showTitle={false}
|
||||||
@ -123,4 +132,4 @@ export default (props: PropsType) => {
|
|||||||
</Popup>
|
</Popup>
|
||||||
</View>
|
</View>
|
||||||
)
|
)
|
||||||
}
|
})
|
||||||
|
|||||||
27
src/pages/customerManagement/components/Tag/index.tsx
Normal file
27
src/pages/customerManagement/components/Tag/index.tsx
Normal file
@ -0,0 +1,27 @@
|
|||||||
|
import { View } from '@tarojs/components'
|
||||||
|
import React, { useCallback, memo, useEffect, useMemo, useRef, useState, ReactNode } from 'react'
|
||||||
|
import styles from "./index.module.scss"
|
||||||
|
import classnames from "classnames";
|
||||||
|
import Taro, { usePullDownRefresh, useRouter, useDidShow } from '@tarojs/taro';
|
||||||
|
import Popup from '@/components/popup'
|
||||||
|
import { debounce } from '@/common/util'
|
||||||
|
import { alert } from '@/common/common'
|
||||||
|
import { formatPriceDiv, formatDateTime, formatWeightDiv } from '@/common/format'
|
||||||
|
import IconFont from '@/components/iconfont/iconfont'
|
||||||
|
import DropDownItem from '@/components/dropDown-item'
|
||||||
|
|
||||||
|
|
||||||
|
export default memo(() => {
|
||||||
|
|
||||||
|
const DropDownItemRef = useRef<any>()
|
||||||
|
const close = () => {
|
||||||
|
DropDownItemRef.current.closePopup()
|
||||||
|
}
|
||||||
|
return (
|
||||||
|
<DropDownItem ref={DropDownItemRef} title={'全部标签'} value={-1} activeColor='#337fff' hasBottomBtn={true}>
|
||||||
|
<View className={styles.mainBox}>
|
||||||
|
<View onClick={() => close()}>111</View>
|
||||||
|
</View>
|
||||||
|
</DropDownItem>
|
||||||
|
)
|
||||||
|
})
|
||||||
3
src/pages/customerManagement/index.config.ts
Normal file
3
src/pages/customerManagement/index.config.ts
Normal file
@ -0,0 +1,3 @@
|
|||||||
|
export default {
|
||||||
|
navigationBarTitleText: '客户列表',
|
||||||
|
}
|
||||||
9
src/pages/customerManagement/index.module.scss
Normal file
9
src/pages/customerManagement/index.module.scss
Normal file
@ -0,0 +1,9 @@
|
|||||||
|
.mainBox {
|
||||||
|
overflow: hidden;
|
||||||
|
|
||||||
|
.menuBox {
|
||||||
|
width: 100%;
|
||||||
|
display: flex;
|
||||||
|
flex: 1;
|
||||||
|
}
|
||||||
|
}
|
||||||
23
src/pages/customerManagement/index.tsx
Normal file
23
src/pages/customerManagement/index.tsx
Normal file
@ -0,0 +1,23 @@
|
|||||||
|
import { View } from '@tarojs/components'
|
||||||
|
import React, { useCallback, memo, useEffect, useMemo, useRef, useState, ReactNode } from 'react'
|
||||||
|
import styles from "./index.module.scss"
|
||||||
|
import classnames from "classnames";
|
||||||
|
import Taro, { usePullDownRefresh, useRouter, useDidShow } from '@tarojs/taro';
|
||||||
|
import Popup from '@/components/popup'
|
||||||
|
import { debounce } from '@/common/util'
|
||||||
|
import { alert } from '@/common/common'
|
||||||
|
import { formatPriceDiv, formatDateTime, formatWeightDiv } from '@/common/format'
|
||||||
|
import IconFont from '@/components/iconfont/iconfont'
|
||||||
|
import Tag from './components/Tag';
|
||||||
|
|
||||||
|
export default () => {
|
||||||
|
return (
|
||||||
|
<View className={styles.mainBox}>
|
||||||
|
<View className={styles.menuBox}>
|
||||||
|
<Tag></Tag>
|
||||||
|
<Tag></Tag>
|
||||||
|
<Tag></Tag>
|
||||||
|
</View>
|
||||||
|
</View>
|
||||||
|
)
|
||||||
|
}
|
||||||
@ -28,7 +28,7 @@ export default memo((props: propsObj) => {
|
|||||||
<IconFont name={'icon-dingwei'} size={26} color={'#ffffff'}></IconFont>
|
<IconFont name={'icon-dingwei'} size={26} color={'#ffffff'}></IconFont>
|
||||||
</View>
|
</View>
|
||||||
{
|
{
|
||||||
receivingStatus == 1 && <View className={styles.address}>{obj.take_goods_address}</View>
|
receivingStatus == 1 && <View className={styles.address}>{obj.take_goods_address || '中华人民共和国广东省佛山市禅城区陆盈纺织仓库'}</View>
|
||||||
}
|
}
|
||||||
{
|
{
|
||||||
(obj?.province_name != '' && receivingStatus == 2) &&
|
(obj?.province_name != '' && receivingStatus == 2) &&
|
||||||
|
|||||||
@ -6,13 +6,14 @@ import styles from './index.module.scss'
|
|||||||
type Param = {
|
type Param = {
|
||||||
onBlur?: (val: any) => void
|
onBlur?: (val: any) => void
|
||||||
onSave?: (val: string) => void
|
onSave?: (val: string) => void
|
||||||
defaultValue?: string
|
defaultValue?: string,
|
||||||
|
showInput: boolean
|
||||||
}
|
}
|
||||||
export default ({ onBlur, onSave, defaultValue = '' }: Param) => {
|
export default ({ onBlur, onSave, defaultValue = '', showInput = false }: Param) => {
|
||||||
const [descData, setDescData] = useState({
|
const [descData, setDescData] = useState({
|
||||||
number: 0,
|
number: 0,
|
||||||
value: '',
|
value: '',
|
||||||
count: 200
|
count: 200,
|
||||||
})
|
})
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
@ -33,10 +34,13 @@ export default ({ onBlur, onSave, defaultValue = '' }: Param) => {
|
|||||||
return (
|
return (
|
||||||
<View className={styles.order_popup}>
|
<View className={styles.order_popup}>
|
||||||
<View className={styles.order_popup_title}>编辑备注</View>
|
<View className={styles.order_popup_title}>编辑备注</View>
|
||||||
<View className={styles.order_popup_input}>
|
{
|
||||||
<Textarea placeholder="请添加备注" value={descData?.value} maxlength={descData.count} cursorSpacing={100} onInput={(e) => getDesc(e.detail.value)} onBlur={(e) => onBlur?.(e)}></Textarea>
|
showInput && <View className={styles.order_popup_input}>
|
||||||
<View className={styles.descDataNum}>{descData.number}/{descData.count}</View>
|
<Textarea placeholder="请添加备注" value={descData?.value} maxlength={descData.count} cursorSpacing={100} onInput={(e) => getDesc(e.detail.value)} onBlur={(e) => onBlur?.(e)}></Textarea>
|
||||||
</View>
|
<View className={styles.descDataNum}>{descData.number}/{descData.count}</View>
|
||||||
|
</View>
|
||||||
|
}
|
||||||
|
|
||||||
<View className={styles.order_save_address} onClick={() => setSave()}>保存</View>
|
<View className={styles.order_save_address} onClick={() => setSave()}>保存</View>
|
||||||
</View>
|
</View>
|
||||||
)
|
)
|
||||||
|
|||||||
@ -94,6 +94,7 @@ export default () => {
|
|||||||
|
|
||||||
|
|
||||||
const handSelect = (obj) => {
|
const handSelect = (obj) => {
|
||||||
|
if (receivingStatus == 1) return false
|
||||||
Taro.navigateTo({
|
Taro.navigateTo({
|
||||||
url: '/pages/addressManager/index?orderId=' + '-100' + '&purchaser_id=' + router.params.purchaser_id
|
url: '/pages/addressManager/index?orderId=' + '-100' + '&purchaser_id=' + router.params.purchaser_id
|
||||||
})
|
})
|
||||||
@ -192,7 +193,7 @@ export default () => {
|
|||||||
<View className={styles.remarkFont}>{infoObj.remark === '' ? '暂无' : infoObj.remark}</View>
|
<View className={styles.remarkFont}>{infoObj.remark === '' ? '暂无' : infoObj.remark}</View>
|
||||||
</DefaultBox>
|
</DefaultBox>
|
||||||
<Popup show={showDesc} showTitle={false} onClose={() => setShowDesc(false)}>
|
<Popup show={showDesc} showTitle={false} onClose={() => setShowDesc(false)}>
|
||||||
<Remark onSave={(e) => getRemark(e)} defaultValue={infoObj.remark} />
|
<Remark onSave={(e) => getRemark(e)} defaultValue={infoObj.remark} showInput={showDesc ? true : false} />
|
||||||
</Popup>
|
</Popup>
|
||||||
<View className={styles.safeBottom}></View>
|
<View className={styles.safeBottom}></View>
|
||||||
<View className={styles.bottomBox}>
|
<View className={styles.bottomBox}>
|
||||||
|
|||||||
@ -67,7 +67,7 @@ let feature: IconCardType[] = [
|
|||||||
{
|
{
|
||||||
iconName: 'icon-kehuxinxi',
|
iconName: 'icon-kehuxinxi',
|
||||||
name: '客户列表',
|
name: '客户列表',
|
||||||
path: '',
|
path: '/pages/customerManagement/index',
|
||||||
jurisdiction: 'customer_list_page'
|
jurisdiction: 'customer_list_page'
|
||||||
},
|
},
|
||||||
]
|
]
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user