Merge branch 'dev' of ssh://git.online.zzfzyc.com:10022/mp/spider_cloud_warehouse into 订单页
This commit is contained in:
Haiyi
+14
-20
@@ -36,6 +36,10 @@ export default defineAppConfig({
|
||||
'custom-wrapper': '/custom-wrapper',
|
||||
},
|
||||
subPackages: [
|
||||
{
|
||||
root: 'pages/saleStatistic',
|
||||
pages: ['index'],
|
||||
},
|
||||
{
|
||||
root: 'pages/takeDelivery',
|
||||
pages: ['index'],
|
||||
@@ -101,34 +105,24 @@ export default defineAppConfig({
|
||||
pages: ['index'],
|
||||
},
|
||||
{
|
||||
root: "pages/applyMoney",
|
||||
pages: [
|
||||
"index"
|
||||
]
|
||||
root: 'pages/applyMoney',
|
||||
pages: ['index'],
|
||||
},
|
||||
{
|
||||
root: "pages/newCollection",
|
||||
pages: [
|
||||
"index"
|
||||
]
|
||||
root: 'pages/newCollection',
|
||||
pages: ['index'],
|
||||
},
|
||||
{
|
||||
root: "pages/addCollection",
|
||||
pages: [
|
||||
"index"
|
||||
]
|
||||
root: 'pages/addCollection',
|
||||
pages: ['index'],
|
||||
},
|
||||
{
|
||||
root: "pages/accountPage",
|
||||
pages: [
|
||||
"index"
|
||||
]
|
||||
root: 'pages/accountPage',
|
||||
pages: ['index'],
|
||||
},
|
||||
{
|
||||
root: "pages/collectionDetail",
|
||||
pages: [
|
||||
"index"
|
||||
]
|
||||
root: 'pages/collectionDetail',
|
||||
pages: ['index'],
|
||||
},
|
||||
],
|
||||
})
|
||||
|
||||
@@ -0,0 +1,18 @@
|
||||
.dropDownItem{
|
||||
width: 100%;
|
||||
|
||||
&--title{
|
||||
position: relative;
|
||||
z-index: 2000;
|
||||
background-color: white;
|
||||
display: flex;
|
||||
flex-flow: row nowrap;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
padding: 24px 0;
|
||||
&--text{
|
||||
display: block;
|
||||
margin-right: 12px;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,87 @@
|
||||
import { View, Text } from '@tarojs/components'
|
||||
import { useCallback, useEffect, useMemo, useRef, useState, memo } from 'react'
|
||||
import styles from './index.module.scss'
|
||||
import classnames from 'classnames'
|
||||
import Iconfont, { IconNames } from '../iconfont/iconfont'
|
||||
import Popup from '../popup'
|
||||
import FilterButton from '../filterButton'
|
||||
// 弹窗选择向上弹窗还是向下弹窗
|
||||
type Direction = 'up' | 'down'
|
||||
// 配置 菜单可选项
|
||||
export type DropDownOptions = {
|
||||
text: string
|
||||
value: number
|
||||
}
|
||||
|
||||
interface DropDownEvent {
|
||||
change?: (value: DropDownOptions['value']) => void // value 变化时触发
|
||||
}
|
||||
|
||||
interface PropsType extends DropDownEvent{
|
||||
direction?: Direction
|
||||
title: string // 已选中的菜单标题
|
||||
options?: DropDownOptions[]
|
||||
value?: number | string // 当前选中的值
|
||||
children?: React.ReactNode
|
||||
activeColor?: string
|
||||
}
|
||||
|
||||
export default (props: PropsType) => {
|
||||
const { children, direction = 'down', title, value, options, change, activeColor } = props
|
||||
|
||||
const [showPopup, setShowPopup] = useState(false)
|
||||
|
||||
const handleClickOption = (value: DropDownOptions['value']) => {
|
||||
|
||||
change?.(value)
|
||||
}
|
||||
|
||||
const defaultOptions = useMemo(() => {
|
||||
const currentValue = value
|
||||
return options?.map(({text, value})=>{
|
||||
return (
|
||||
<FilterButton isActive={currentValue === value} onClick={() => handleClickOption(value)}>
|
||||
{text}
|
||||
</FilterButton>
|
||||
)
|
||||
|
||||
})
|
||||
}, [value])
|
||||
|
||||
const getIconName = () => {
|
||||
if(direction === 'up'){
|
||||
return showPopup ? 'icon-zhankai1' : 'icon-shouqi1'
|
||||
}
|
||||
// down
|
||||
return showPopup ? 'icon-shouqi1' : 'icon-zhankai1'
|
||||
}
|
||||
|
||||
const handleClickTitle = () => {
|
||||
setShowPopup(true)
|
||||
}
|
||||
|
||||
const handleClosePopup = () => {
|
||||
setShowPopup(false)
|
||||
}
|
||||
|
||||
return (
|
||||
<View className={styles.dropDownItem}>
|
||||
<View className={styles['dropDownItem--title']} onClick={handleClickTitle}>
|
||||
<Text className={styles['dropDownItem--title--text']} style={{ color: activeColor }}>
|
||||
{title}
|
||||
</Text>
|
||||
<Iconfont name={getIconName()} size={20} color={value !== options![0].value ? activeColor : '#333'}></Iconfont>
|
||||
</View>
|
||||
<Popup
|
||||
onClose={handleClosePopup}
|
||||
show={showPopup}
|
||||
showTitle={false}
|
||||
safeAreaInsetBottom={false}
|
||||
customStyle={{ position: 'absolute', top: 'unset' }}
|
||||
overlayStyle={{ position: 'absolute', top: 'unset' }}
|
||||
position={direction === 'down' ? 'top' : 'bottom'}>
|
||||
{children ? children : defaultOptions}
|
||||
</Popup>
|
||||
</View>
|
||||
)
|
||||
}
|
||||
@@ -0,0 +1,31 @@
|
||||
|
||||
.filterButton {
|
||||
display: flex;
|
||||
flex-flow: row nowrap;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0 20px;
|
||||
box-sizing: border-box;
|
||||
border: 0 solid transparent;
|
||||
background-color: #f6f6f6;
|
||||
border-radius: 8px;
|
||||
font-size: 28px;
|
||||
height: 72px;
|
||||
&--text {
|
||||
color: #909090;
|
||||
display: flex;
|
||||
flex-flow: row nowrap;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
&:hover {
|
||||
opacity: 0.7;
|
||||
}
|
||||
&--active {
|
||||
border: 1px solid $color_main;
|
||||
background-color: #eaf2ff;
|
||||
.filterButton--text {
|
||||
color: $color_main;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,27 @@
|
||||
import classnames from "classnames"
|
||||
import { FC } from "react"
|
||||
import NormalButton from "../normalButton"
|
||||
import styles from './index.module.scss'
|
||||
|
||||
interface ButtonPropsType {
|
||||
isActive: boolean
|
||||
onClick?: Function
|
||||
children?: React.ReactNode
|
||||
customClassName?: string
|
||||
}
|
||||
|
||||
const FilterButton: FC<ButtonPropsType> = props => {
|
||||
const { onClick, children, isActive = false, customClassName } = props
|
||||
const handleClick = () => {
|
||||
onClick?.()
|
||||
}
|
||||
return (
|
||||
<NormalButton
|
||||
customTextClassName={styles['filterButton--text']}
|
||||
customClassName={classnames(styles.filterButton, isActive && styles['filterButton--active'], customClassName)}
|
||||
onClick={handleClick}>
|
||||
{children}
|
||||
</NormalButton>
|
||||
)
|
||||
}
|
||||
export default FilterButton
|
||||
@@ -24,7 +24,7 @@ function hex2rgb(hex) {
|
||||
return "rgb(" + rgb.join(",") + ")";
|
||||
}
|
||||
|
||||
export type IconNames = 'icon-zhankai' | 'icon-shouqi' | 'icon-lujing' | 'icon-jizhumima' | 'icon-a-jizhumima' | 'icon-weixindenglu' | 'icon-kehuxinxi' | 'icon-yewuyuanqizi' | 'icon-chakanquanbukehu' | 'icon-biyan' | 'icon-bianji' | 'icon-daikuan' | 'icon-cangku' | 'icon-guanlidingdan' | 'icon-mima' | 'icon-guanbi' | 'icon-jianshao' | 'icon-dingwei' | 'icon-saomiao' | 'icon-peihuo' | 'icon-shaixuan' | 'icon-paiming' | 'icon-shanchusousuoxinxi' | 'icon-shijian' | 'icon-sousuo' | 'icon-shouhou' | 'icon-sousuofanhui' | 'icon-sousuoshanchu' | 'icon-tuikuan' | 'icon-tishi' | 'icon-xianxiahuizong' | 'icon-xinzeng' | 'icon-yonghuming' | 'icon-yanjing' | 'icon-yufukuan' | 'icon-wodekefu' | 'icon-dizhi' | 'icon-shouhouzhongxin' | 'icon-wodeshoucang' | 'icon-shoukuanliebiao' | 'icon-madanguanli' | 'icon-qusechazhao' | 'icon-pandiansaoma' | 'icon-yaoqingma' | 'icon-duizhang' | 'icon-tihuoliebiao' | 'icon-yangpinduibi' | 'icon-yansequyang' | 'icon-fahuoliebiao' | 'icon-yuncangkucun' | 'icon-xiaoshou' | 'icon-qianzhicangkucun' | 'icon-lingquseka' | 'icon-gouwu1' | 'icon-dingdan1' | 'icon-gerenzhongxin1' | 'icon-shouye1' | 'icon-gerenzhongxin' | 'icon-dingdan' | 'icon-shouye' | 'icon-gouwu';
|
||||
export type IconNames = 'icon-zhankai1' | 'icon-shouqi1' | 'icon-shouhou1' | 'icon-cangku1' | 'icon-saoma' | 'icon-dizhi1' | 'icon-huodaofukuan' | 'icon-yufukuan1' | 'icon-yue' | 'icon-zidingyi' | 'icon-jinetiaozheng' | 'icon-tuikuan1' | 'icon-zhankai' | 'icon-shouqi' | 'icon-lujing' | 'icon-jizhumima' | 'icon-a-jizhumima' | 'icon-weixindenglu' | 'icon-kehuxinxi' | 'icon-yewuyuanqizi' | 'icon-chakanquanbukehu' | 'icon-biyan' | 'icon-bianji' | 'icon-daikuan' | 'icon-cangku' | 'icon-guanlidingdan' | 'icon-mima' | 'icon-guanbi' | 'icon-jianshao' | 'icon-dingwei' | 'icon-saomiao' | 'icon-peihuo' | 'icon-shaixuan' | 'icon-paiming' | 'icon-shanchusousuoxinxi' | 'icon-shijian' | 'icon-sousuo' | 'icon-shouhou' | 'icon-sousuofanhui' | 'icon-sousuoshanchu' | 'icon-tuikuan' | 'icon-tishi' | 'icon-xianxiahuizong' | 'icon-xinzeng' | 'icon-yonghuming' | 'icon-yanjing' | 'icon-yufukuan' | 'icon-wodekefu' | 'icon-dizhi' | 'icon-shouhouzhongxin' | 'icon-wodeshoucang' | 'icon-shoukuanliebiao' | 'icon-madanguanli' | 'icon-qusechazhao' | 'icon-pandiansaoma' | 'icon-yaoqingma' | 'icon-duizhang' | 'icon-tihuoliebiao' | 'icon-yangpinduibi' | 'icon-yansequyang' | 'icon-fahuoliebiao' | 'icon-yuncangkucun' | 'icon-xiaoshou' | 'icon-qianzhicangkucun' | 'icon-lingquseka' | 'icon-gouwu1' | 'icon-dingdan1' | 'icon-gerenzhongxin1' | 'icon-shouye1' | 'icon-gerenzhongxin' | 'icon-dingdan' | 'icon-shouye' | 'icon-gouwu';
|
||||
|
||||
type PropsType = {
|
||||
name: IconNames;
|
||||
@@ -36,7 +36,7 @@ type PropsType = {
|
||||
|
||||
const IconFont:FC<PropsType> = ({
|
||||
name,
|
||||
size = 18,
|
||||
size = 36,
|
||||
color,
|
||||
customStyle = {},
|
||||
customClassName = ""
|
||||
@@ -82,7 +82,43 @@ const IconFont:FC<PropsType> = ({
|
||||
className={classnames(icon, customClassName)}
|
||||
/>
|
||||
)} */}
|
||||
{/* icon-zhankai */}
|
||||
{/* icon-zhankai1 */}
|
||||
|
||||
{ name === 'icon-zhankai1' && (<View style={{backgroundImage: `url(${quot}data:image/svg+xml, %3Csvg viewBox='0 0 1489 1024' xmlns='http://www.w3.org/2000/svg' width='${svgSize}px' height='${svgSize}px'%3E%3Cpath d='M744.727273 954.181818L1442.909091 46.545455H46.545455z' fill='${(isStr ? colors : colors?.[0]) || 'rgb(51,51,51)'}' /%3E%3C/svg%3E${quot}); width: ${svgSize}px; height: ${svgSize}px; `, ...customStyle}} className={classnames("icon", customClassName)} />) }
|
||||
{/* icon-shouqi1 */}
|
||||
|
||||
{ name === 'icon-shouqi1' && (<View style={{backgroundImage: `url(${quot}data:image/svg+xml, %3Csvg viewBox='0 0 1489 1024' xmlns='http://www.w3.org/2000/svg' width='${svgSize}px' height='${svgSize}px'%3E%3Cpath d='M744.727273 69.818182l698.181818 907.636363H46.545455z' fill='${(isStr ? colors : colors?.[0]) || 'rgb(51,51,51)'}' /%3E%3C/svg%3E${quot}); width: ${svgSize}px; height: ${svgSize}px; `, ...customStyle}} className={classnames("icon", customClassName)} />) }
|
||||
{/* icon-shouhou1 */}
|
||||
|
||||
{ name === 'icon-shouhou1' && (<View style={{backgroundImage: `url(${quot}data:image/svg+xml, %3Csvg viewBox='0 0 1024 1024' xmlns='http://www.w3.org/2000/svg' width='${svgSize}px' height='${svgSize}px'%3E%3Cpath d='M512 512m-512 0a512 512 0 1 0 1024 0 512 512 0 1 0-1024 0Z' fill='${(isStr ? colors : colors?.[0]) || 'rgb(74,127,255)'}' /%3E%3Cpath d='M563.584 256C694.144 256 800 361.84 800 492.416v23.168C800 646.144 694.16 752 563.584 752H256l72.64-65.92A235.728 235.728 0 0 1 256 515.6v-23.168C256 361.856 361.84 256 492.416 256h71.168z m-109.76 198.4a49.52 49.52 0 0 0-49.456 49.6c0 27.392 22.144 49.6 49.44 49.6a49.52 49.52 0 0 0 49.472-49.6c0-27.392-22.144-49.6-49.456-49.6z m148.352 0a49.52 49.52 0 0 0-49.44 49.6c0 27.392 22.128 49.6 49.44 49.6a49.52 49.52 0 0 0 49.456-49.6c0-27.392-22.144-49.6-49.44-49.6z' fill='${(isStr ? colors : colors?.[1]) || 'rgb(255,255,255)'}' opacity='.95' /%3E%3C/svg%3E${quot}); width: ${svgSize}px; height: ${svgSize}px; `, ...customStyle}} className={classnames("icon", customClassName)} />) }
|
||||
{/* icon-cangku1 */}
|
||||
|
||||
{ name === 'icon-cangku1' && (<View style={{backgroundImage: `url(${quot}data:image/svg+xml, %3Csvg viewBox='0 0 1024 1024' xmlns='http://www.w3.org/2000/svg' width='${svgSize}px' height='${svgSize}px'%3E%3Cpath d='M512 512m-512 0a512 512 0 1 0 1024 0 512 512 0 1 0-1024 0Z' fill='${(isStr ? colors : colors?.[0]) || 'rgb(74,127,255)'}' /%3E%3Cpath d='M565.6 251.968l2.96 2.64 2.432 2.352 231.664 233.248c11.632 11.712 11.68 27.536 3.952 43.904a20 20 0 0 1-16 11.344l-2.08 0.112H754.4V738.56a43.424 43.424 0 0 1-38.56 43.152l-2.72 0.224-2.096 0.048H313.2a43.408 43.408 0 0 1-43.312-40.784l-0.08-2.64-0.016-193.024h-34.032a20 20 0 0 1-16.208-8.256l-1.152-1.792-0.752-1.456c-7.024-14.992-8.176-28.96 0.24-41.056l1.824-2.4 1.792-1.936 230.368-231.952a83.824 83.824 0 0 1 113.712-4.736zM576.976 592h-129.984a25.008 25.008 0 0 0 0 50h130a25.008 25.008 0 0 0 0-50z' fill='${(isStr ? colors : colors?.[1]) || 'rgb(255,255,255)'}' /%3E%3C/svg%3E${quot}); width: ${svgSize}px; height: ${svgSize}px; `, ...customStyle}} className={classnames("icon", customClassName)} />) }
|
||||
{/* icon-saoma */}
|
||||
|
||||
{ name === 'icon-saoma' && (<View style={{backgroundImage: `url(${quot}data:image/svg+xml, %3Csvg viewBox='0 0 1024 1024' xmlns='http://www.w3.org/2000/svg' width='${svgSize}px' height='${svgSize}px'%3E%3Cpath d='M512 512m-512 0a512 512 0 1 0 1024 0 512 512 0 1 0-1024 0Z' fill='${(isStr ? colors : colors?.[0]) || 'rgb(89,102,247)'}' /%3E%3Cpath d='M302 592v130h129.984l0.016 40h-150c-11.04 0-20-8.96-20-20V592h40z m460 0v150c0 11.04-8.96 20-20 20H592v-40h130V592h40z m0-100v40h-500v-40h500z m-20-230c11.04 0 20 8.96 20 20V432h-40v-130H592v-40h150z m-310 0v40h-130V432h-40v-150c0-11.04 8.96-20 20-20H432z' fill='${(isStr ? colors : colors?.[1]) || 'rgb(255,255,255)'}' /%3E%3C/svg%3E${quot}); width: ${svgSize}px; height: ${svgSize}px; `, ...customStyle}} className={classnames("icon", customClassName)} />) }
|
||||
{/* icon-dizhi1 */}
|
||||
|
||||
{ name === 'icon-dizhi1' && (<View style={{backgroundImage: `url(${quot}data:image/svg+xml, %3Csvg viewBox='0 0 1024 1024' xmlns='http://www.w3.org/2000/svg' width='${svgSize}px' height='${svgSize}px'%3E%3Cpath d='M512 512m-512 0a512 512 0 1 0 1024 0 512 512 0 1 0-1024 0Z' fill='${(isStr ? colors : colors?.[0]) || 'rgb(74,127,255)'}' /%3E%3Cpath d='M512 222c127.04 0 230 102.976 230 230 0 51.2-25.28 110.896-75.328 180.928l-3.536 4.896-3.648 4.976-6.512 8.704-6.816 8.912-7.04 8.96-7.28 9.056-7.52 9.152-7.728 9.216-4.016 4.736-10.176 11.744-2.128 2.432-8.512 9.584-8.736 9.696-9.008 9.792-9.232 9.92-9.488 10.016-9.28 9.648-19.232 21.12a20 20 0 0 1-28.4 1.168l-1.168-1.184-18.88-20.72-9.728-10.144-9.488-10.016-9.248-9.92-8.992-9.808-8.72-9.648-4.32-4.864-8.4-9.536-10.08-11.712-9.808-11.68-7.52-9.168-7.296-9.056-6.992-8.928-3.44-4.448-3.392-4.464-6.48-8.656c-54.768-74.24-82.432-137.12-82.432-190.704 0-127.04 102.976-230 230-230z m0 140a90 90 0 1 0 0 180 90 90 0 0 0 0-180z' fill='${(isStr ? colors : colors?.[1]) || 'rgb(255,255,255)'}' /%3E%3C/svg%3E${quot}); width: ${svgSize}px; height: ${svgSize}px; `, ...customStyle}} className={classnames("icon", customClassName)} />) }
|
||||
{/* icon-huodaofukuan */}
|
||||
|
||||
{ name === 'icon-huodaofukuan' && (<View style={{backgroundImage: `url(${quot}data:image/svg+xml, %3Csvg viewBox='0 0 1024 1024' xmlns='http://www.w3.org/2000/svg' width='${svgSize}px' height='${svgSize}px'%3E%3Cpath d='M512 512m-512 0a512 512 0 1 0 1024 0 512 512 0 1 0-1024 0Z' fill='${(isStr ? colors : colors?.[0]) || 'rgb(74,127,255)'}' /%3E%3Cpath d='M224 400m32 0l512 0q32 0 32 32l0 304q0 32-32 32l-512 0q-32 0-32-32l0-304q0-32 32-32Z' fill='${(isStr ? colors : colors?.[1]) || 'rgb(255,255,255)'}' /%3E%3Cpath d='M320.48 240h383.04a32 32 0 0 1 26.048 13.408l52.368 73.28A16 16 0 0 1 768.912 352H255.088a16 16 0 0 1-13.024-25.296l52.368-73.296A32 32 0 0 1 320.464 240z' fill='${(isStr ? colors : colors?.[2]) || 'rgb(255,255,255)'}' /%3E%3Cpath d='M461.728 485.008l1.36 1.248L512 535.168l48.912-48.912a21.328 21.328 0 0 1 31.424 28.8l-1.248 1.36L563.488 544h23.184a21.328 21.328 0 0 1 0 42.672l-53.344-0.016v32h53.344a21.328 21.328 0 1 1 0 42.672h-53.344v21.344a21.328 21.328 0 1 1-42.656 0l-0.016-21.344h-53.328a21.328 21.328 0 1 1 0-42.656l53.328-0.016v-32h-53.328a21.328 21.328 0 0 1 0-42.656h23.168l-27.584-27.584a21.328 21.328 0 0 1 28.816-31.408z' fill='${(isStr ? colors : colors?.[3]) || 'rgb(74,127,255)'}' /%3E%3C/svg%3E${quot}); width: ${svgSize}px; height: ${svgSize}px; `, ...customStyle}} className={classnames("icon", customClassName)} />) }
|
||||
{/* icon-yufukuan1 */}
|
||||
|
||||
{ name === 'icon-yufukuan1' && (<View style={{backgroundImage: `url(${quot}data:image/svg+xml, %3Csvg viewBox='0 0 1024 1024' xmlns='http://www.w3.org/2000/svg' width='${svgSize}px' height='${svgSize}px'%3E%3Cpath d='M512 512m-512 0a512 512 0 1 0 1024 0 512 512 0 1 0-1024 0Z' fill='${(isStr ? colors : colors?.[0]) || 'rgb(74,127,255)'}' /%3E%3Cpath d='M762 422c11.04 0 20 8.96 20 20v300c0 11.04-8.96 20-20 20h-500c-11.04 0-20-8.96-20-20v-300c0-11.04 8.96-20 20-20h500zM512 622H352a10 10 0 0 0-10 10v20c0 5.52 4.48 10 10 10h160c5.52 0 10-4.48 10-10V632a10 10 0 0 0-10-10z' fill='${(isStr ? colors : colors?.[1]) || 'rgb(255,255,255)'}' /%3E%3Cpath d='M404.96 223.872l322.384 119.36a20 20 0 0 1-6.944 38.768H325.392a20 20 0 0 1-17.632-29.44l63.04-117.792c5.808-10.848 21.12-15.728 34.16-10.896z' fill='${(isStr ? colors : colors?.[2]) || 'rgb(255,255,255)'}' opacity='.7' /%3E%3C/svg%3E${quot}); width: ${svgSize}px; height: ${svgSize}px; `, ...customStyle}} className={classnames("icon", customClassName)} />) }
|
||||
{/* icon-yue */}
|
||||
|
||||
{ name === 'icon-yue' && (<View style={{backgroundImage: `url(${quot}data:image/svg+xml, %3Csvg viewBox='0 0 1024 1024' xmlns='http://www.w3.org/2000/svg' width='${svgSize}px' height='${svgSize}px'%3E%3Cpath d='M512 512m-512 0a512 512 0 1 0 1024 0 512 512 0 1 0-1024 0Z' fill='${(isStr ? colors : colors?.[0]) || 'rgb(252,168,70)'}' /%3E%3Cpath d='M772 402c5.52 0 10 4.48 10 10V752c0 5.52-4.48 10-10 10H252A10 10 0 0 1 242 752V412c0-5.52 4.48-10 10-10h520z m-185.856 85.856a20 20 0 0 0-28.288 0L512 533.728l-45.856-45.872-1.28-1.168a20 20 0 0 0-27.008 29.44l25.872 25.872h-21.728a20 20 0 0 0 0 40h50v30h-50a20 20 0 0 0 0 40h50V672a20 20 0 0 0 40 0v-20h50a20 20 0 0 0 0-40H532v-30h50a20 20 0 0 0 0-40h-21.744l25.888-25.856 1.168-1.28a20 20 0 0 0-1.168-27.008z' fill='${(isStr ? colors : colors?.[1]) || 'rgb(255,255,255)'}' /%3E%3Cpath d='M262 292m10 0l480 0q10 0 10 10l0 40q0 10-10 10l-480 0q-10 0-10-10l0-40q0-10 10-10Z' fill='${(isStr ? colors : colors?.[2]) || 'rgb(255,255,255)'}' /%3E%3C/svg%3E${quot}); width: ${svgSize}px; height: ${svgSize}px; `, ...customStyle}} className={classnames("icon", customClassName)} />) }
|
||||
{/* icon-zidingyi */}
|
||||
|
||||
{ name === 'icon-zidingyi' && (<View style={{backgroundImage: `url(${quot}data:image/svg+xml, %3Csvg viewBox='0 0 1024 1024' xmlns='http://www.w3.org/2000/svg' width='${svgSize}px' height='${svgSize}px'%3E%3Cpath d='M512 512m-512 0a512 512 0 1 0 1024 0 512 512 0 1 0-1024 0Z' fill='${(isStr ? colors : colors?.[0]) || 'rgb(74,127,255)'}' /%3E%3Cpath d='M497.12 695.84l-115.824 60.88a32 32 0 0 1-46.432-33.744l22.128-128.96a32 32 0 0 0-9.216-28.32l-93.68-91.328a32 32 0 0 1 17.728-54.576l129.488-18.816a32 32 0 0 0 24.08-17.504l57.92-117.328a32 32 0 0 1 57.376 0l57.92 117.328a32 32 0 0 0 24.08 17.504l129.488 18.816a32 32 0 0 1 17.728 54.576l-93.68 91.328a32 32 0 0 0-9.216 28.32l22.128 128.96a32 32 0 0 1-46.432 33.744l-115.808-60.896a32 32 0 0 0-29.792 0z' fill='${(isStr ? colors : colors?.[1]) || 'rgb(255,255,255)'}' /%3E%3C/svg%3E${quot}); width: ${svgSize}px; height: ${svgSize}px; `, ...customStyle}} className={classnames("icon", customClassName)} />) }
|
||||
{/* icon-jinetiaozheng */}
|
||||
|
||||
{ name === 'icon-jinetiaozheng' && (<View style={{backgroundImage: `url(${quot}data:image/svg+xml, %3Csvg viewBox='0 0 1024 1024' xmlns='http://www.w3.org/2000/svg' width='${svgSize}px' height='${svgSize}px'%3E%3Cpath d='M512 512m-512 0a512 512 0 1 0 1024 0 512 512 0 1 0-1024 0Z' fill='${(isStr ? colors : colors?.[0]) || 'rgb(74,127,255)'}' /%3E%3Cpath d='M768 304a32 32 0 0 1 32 32v352a32 32 0 0 1-32 32H256a32 32 0 0 1-32-32V336a32 32 0 0 1 32-32h512z m-309.856 119.856a20 20 0 0 0-28.288 0L384 469.728l-45.856-45.872-1.28-1.168a20 20 0 0 0-27.008 29.44l25.872 25.872h-21.728a20 20 0 0 0 0 40h50v30h-50a20 20 0 0 0 0 40h50V608a20 20 0 0 0 40 0v-20h50a20 20 0 0 0 0-40H404v-30h50a20 20 0 0 0 0-40h-21.744l25.888-25.856 1.168-1.28a20 20 0 0 0-1.168-27.008zM560 448h160a16 16 0 0 1 16 16v16a16 16 0 0 1-16 16H560a16 16 0 0 1-16-16v-16a16 16 0 0 1 16-16z m0 112h160a16 16 0 0 1 16 16v16a16 16 0 0 1-16 16H560a16 16 0 0 1-16-16v-16a16 16 0 0 1 16-16z' fill='${(isStr ? colors : colors?.[1]) || 'rgb(255,255,255)'}' /%3E%3C/svg%3E${quot}); width: ${svgSize}px; height: ${svgSize}px; `, ...customStyle}} className={classnames("icon", customClassName)} />) }
|
||||
{/* icon-tuikuan1 */}
|
||||
|
||||
{ name === 'icon-tuikuan1' && (<View style={{backgroundImage: `url(${quot}data:image/svg+xml, %3Csvg viewBox='0 0 1024 1024' xmlns='http://www.w3.org/2000/svg' width='${svgSize}px' height='${svgSize}px'%3E%3Cpath d='M512 512m-512 0a512 512 0 1 0 1024 0 512 512 0 1 0-1024 0Z' fill='${(isStr ? colors : colors?.[0]) || 'rgb(74,127,255)'}' /%3E%3Cpath d='M752 416a32 32 0 0 1 32 32v288a32 32 0 0 1-32 32H272a32 32 0 0 1-32-32V448a32 32 0 0 1 32-32h480z m-165.856 87.856a20 20 0 0 0-28.288 0L512 549.728l-45.856-45.872-1.28-1.168a20 20 0 0 0-27.008 29.44l25.872 25.872h-21.728a20 20 0 0 0 0 40h50v30h-50a20 20 0 0 0 0 40h50V688a20 20 0 1 0 40 0v-20h50a20 20 0 1 0 0-40H532v-30h50a20 20 0 1 0 0-40h-21.744l25.888-25.856 1.168-1.28a20 20 0 0 0-1.168-27.008z' fill='${(isStr ? colors : colors?.[1]) || 'rgb(255,255,255)'}' /%3E%3Cpath d='M354.128 253.168a24 24 0 0 1 31.6 36.048l-1.856 1.616-26.816 21.168H720a24 24 0 0 1 23.888 21.696L744 336a24 24 0 0 1-21.696 23.888L720 360H288c-22.032 0-32.08-26.896-16.528-41.424l1.648-1.408 81.008-64z' fill='${(isStr ? colors : colors?.[2]) || 'rgb(255,255,255)'}' /%3E%3C/svg%3E${quot}); width: ${svgSize}px; height: ${svgSize}px; `, ...customStyle}} className={classnames("icon", customClassName)} />) }
|
||||
{/* icon-zhankai */}
|
||||
|
||||
{ name === 'icon-zhankai' && (<View style={{backgroundImage: `url(${quot}data:image/svg+xml, %3Csvg viewBox='0 0 1024 1024' xmlns='http://www.w3.org/2000/svg' width='${svgSize}px' height='${svgSize}px'%3E%3Cpath d='M492.586667 668.138667c9.962667 9.941333 25.642667 10.666667 36.416 2.133333l2.389333-2.133333 232.746667-232.746667a27.434667 27.434667 0 0 0-36.394667-40.917333l-2.389333 2.133333-213.397334 213.333333-213.312-213.333333a27.434667 27.434667 0 0 0-36.394666-2.133333l-2.389334 2.133333a27.434667 27.434667 0 0 0-2.133333 36.394667l2.133333 2.389333 232.746667 232.746667z' fill='${(isStr ? colors : colors?.[0]) || 'rgb(0,0,0)'}' opacity='.8' /%3E%3C/svg%3E${quot}); width: ${svgSize}px; height: ${svgSize}px; `, ...customStyle}} className={classnames("icon", customClassName)} />) }
|
||||
{/* icon-shouqi */}
|
||||
|
||||
@@ -1,5 +1,4 @@
|
||||
.button {
|
||||
$current_color: #fff;
|
||||
display: flex;
|
||||
flex-flow: row nowrap;
|
||||
justify-content: center;
|
||||
@@ -10,6 +9,7 @@
|
||||
background-color: #fff;
|
||||
text-align: center;
|
||||
color: #fff;
|
||||
box-sizing: border-box;
|
||||
&--normal {
|
||||
height: 72px;
|
||||
font-size: $font_size_medium;
|
||||
@@ -24,24 +24,23 @@
|
||||
// 按钮类型
|
||||
&--primary {
|
||||
border: 1px solid $color_main;
|
||||
color: $color_main;
|
||||
$current_color: $color_main;
|
||||
background-color: $color_main;
|
||||
color: white;
|
||||
}
|
||||
&--danger {
|
||||
border: 1px solid $color_danger;
|
||||
color: $color_danger;
|
||||
$current_color: $color_danger;
|
||||
background-color: $color_danger;
|
||||
color: white;
|
||||
}
|
||||
&--warning {
|
||||
border: 1px solid $color_warning;
|
||||
color: $color_warning;
|
||||
$current_color: $color_warning;
|
||||
background-color: $color_warning;
|
||||
color: white;
|
||||
}
|
||||
&--info {
|
||||
border: 1px solid $color_info;
|
||||
color: $color_info;
|
||||
$current_color: $color_info;
|
||||
|
||||
background-color: $color_info;
|
||||
color: white;
|
||||
}
|
||||
&--round {
|
||||
border-radius: 50px;
|
||||
@@ -49,11 +48,24 @@
|
||||
&--circle {
|
||||
border-radius: 16px;
|
||||
}
|
||||
// 朴素按钮
|
||||
&--plain {
|
||||
background-color: currentColor;
|
||||
border-color: currentColor;
|
||||
.button--text {
|
||||
color: #fff;
|
||||
background-color: white;
|
||||
&.button--primary {
|
||||
border: 1px solid $color_main;
|
||||
color: $color_main;
|
||||
}
|
||||
&.button--danger {
|
||||
border: 1px solid $color_danger;
|
||||
color: $color_danger;
|
||||
}
|
||||
&.button--warning {
|
||||
border: 1px solid $color_warning;
|
||||
color: $color_warning;
|
||||
}
|
||||
&.button--info {
|
||||
border: 1px solid $color_info;
|
||||
color: $color_info;
|
||||
}
|
||||
}
|
||||
&--text {
|
||||
|
||||
@@ -11,7 +11,7 @@ interface PropsType {
|
||||
type?: ButtonType
|
||||
round?: boolean // 大圆角
|
||||
disabled?: boolean
|
||||
plain?: boolean // 填满背景颜色
|
||||
plain?: boolean // plain
|
||||
circle?: boolean // 小圆角
|
||||
children?: ReactNode
|
||||
onClick?: Function
|
||||
|
||||
@@ -1,58 +1,62 @@
|
||||
$am-ms: 200ms;
|
||||
|
||||
.drawer_mask {
|
||||
flex: 1 1 auto;
|
||||
display: flex;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: rgba(0, 0, 0, 0.6);
|
||||
z-index: 1011;
|
||||
opacity: 0;
|
||||
transition: opacity $am-ms ease-in;
|
||||
&_active {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
.drawer_main {
|
||||
.drawer {
|
||||
position: fixed;
|
||||
left: 0;
|
||||
top: 0;
|
||||
left: 0;
|
||||
top: 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex-direction: column;
|
||||
width: 100%;
|
||||
height: 100vh;
|
||||
height: 100%;
|
||||
margin: 0 auto;
|
||||
z-index: 1000;
|
||||
visibility: hidden;
|
||||
transition: visibility $am-ms ease-in-out;
|
||||
.drawer_mask {
|
||||
|
||||
.drawer_container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
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 {
|
||||
background-color: #fff;
|
||||
z-index: 1012;
|
||||
transition: transform $am-ms ease-in-out;
|
||||
.drawer_container_title {
|
||||
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;
|
||||
}
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
height: 80px;
|
||||
font-size: 29px;
|
||||
color: #000000;
|
||||
padding-top: 10px;
|
||||
}
|
||||
.drawer_container_active {
|
||||
transform: translate3d(0, 0, 0);
|
||||
.common_close_btn_icon {
|
||||
position: absolute;
|
||||
top: 10px;
|
||||
left: 10px;
|
||||
}
|
||||
}
|
||||
.drawer_mask_active {
|
||||
opacity: 1;
|
||||
.drawer_container_active {
|
||||
transform: translate3d(0, 0, 0);
|
||||
}
|
||||
}
|
||||
.drawer_active {
|
||||
@@ -80,7 +84,7 @@ $am-ms: 200ms;
|
||||
.drawer_container_right {
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
height: 100vh;
|
||||
height: 100%;
|
||||
min-width: 300px;
|
||||
border-radius: 20px 0 0 20px;
|
||||
transform: translate3d(100%, 0, 0);
|
||||
|
||||
@@ -3,21 +3,41 @@ import style from './index.module.scss'
|
||||
import classnames from 'classnames'
|
||||
import { memo, ReactNode, useEffect, useMemo, useRef, useState } from 'react'
|
||||
import CloseBtnIcon from '@/components/closeBtn'
|
||||
import Taro from '@tarojs/taro'
|
||||
|
||||
export interface Params {
|
||||
title?: string //标题
|
||||
show?: false | true //显示显示弹窗
|
||||
showTitle?: false | true //是否显示标题
|
||||
export interface PopupEvent {
|
||||
onClose?: () => void //关闭事件
|
||||
animationEnd?: () => void //弹出动画结束
|
||||
}
|
||||
|
||||
export interface Params extends PopupEvent {
|
||||
title?: string //标题
|
||||
show?: boolean //显示显示弹窗
|
||||
showTitle?: boolean //是否显示标题
|
||||
isFixed?: boolean //二次弹窗触发
|
||||
children?: ReactNode //插槽内容
|
||||
// IconButton?: ReactNode, //
|
||||
showIconButton?: false | true //是否显示关闭按钮
|
||||
showIconButton?: boolean //是否显示关闭按钮
|
||||
position?: 'bottom' | 'top' | 'right' //弹出位置
|
||||
animationEnd?: () => void, //弹出动画结束
|
||||
isFixed?: boolean //二次弹窗触发
|
||||
customStyle?: React.CSSProperties
|
||||
overlayStyle?: React.CSSProperties
|
||||
safeAreaInsetBottom?: boolean // 是否为iphoneX提供小黑条适配
|
||||
}
|
||||
export default memo(
|
||||
({ title = '标题', show = false, showTitle = true, isFixed = false, onClose, showIconButton = false, children, position = 'bottom', animationEnd }: Params) => {
|
||||
({
|
||||
title = '标题',
|
||||
show = false,
|
||||
showTitle = true,
|
||||
onClose,
|
||||
isFixed = false,
|
||||
showIconButton = false,
|
||||
children,
|
||||
position = 'bottom',
|
||||
animationEnd,
|
||||
customStyle,
|
||||
safeAreaInsetBottom = true,
|
||||
overlayStyle,
|
||||
}: Params) => {
|
||||
const animationTime = useRef<any>(null)
|
||||
useEffect(() => {
|
||||
if (show) {
|
||||
@@ -36,25 +56,26 @@ export default memo(
|
||||
}
|
||||
}, [])
|
||||
|
||||
const [ShowContext, setShowContext] = useState(false)
|
||||
return (
|
||||
<>
|
||||
<View className={style.drawer_main}>
|
||||
<View catchMove={true} className={`${style.drawer} ${show ? style.drawer_active : ''}`}>
|
||||
<View className={classnames(style.drawer_mask, { [style.drawer_mask_active]: show })} onClick={() => onClose?.()}>
|
||||
<View
|
||||
style={{ position: `${isFixed == true ? 'fixed' : 'absolute'}`, }}
|
||||
className={classnames(style.drawer_container, style['drawer_container_' + position], { [style.drawer_container_active]: show })}
|
||||
onClick={(e) => e.stopPropagation()}>
|
||||
{showTitle && <View className={style.drawer_container_title}>{title}</View>}
|
||||
{showIconButton && (
|
||||
<View className={style.common_close_btn_icon}>
|
||||
<CloseBtnIcon onClose={() => onClose?.()} />
|
||||
</View>
|
||||
)}
|
||||
<View className={style.drawer_container_context}>{children}</View>
|
||||
<View className='common_safe_area_y'></View>
|
||||
<View catchMove={true} className={classnames(style.drawer, show ? style.drawer_active : '')} style={customStyle}>
|
||||
<View className={classnames(style.drawer_mask, { [style.drawer_mask_active]: show })} onClick={onClose} style={overlayStyle}></View>
|
||||
<View
|
||||
style={{ position: `${isFixed == true ? 'fixed' : 'absolute'}`, }}
|
||||
className={classnames(style.drawer_container, style['drawer_container_' + position], { [style.drawer_container_active]: show })}
|
||||
onClick={e => e.stopPropagation()}>
|
||||
{showTitle && <View className={style.drawer_container_title}>{title}</View>}
|
||||
{showIconButton && (
|
||||
<View className={style.common_close_btn_icon}>
|
||||
<CloseBtnIcon onClose={onClose} />
|
||||
</View>
|
||||
)}
|
||||
|
||||
<View id='drawerContainerContext' className={style.drawer_container_context}>
|
||||
{children}
|
||||
</View>
|
||||
{safeAreaInsetBottom && <View className='common_safe_area_y'></View>}
|
||||
</View>
|
||||
</View>
|
||||
</View>
|
||||
|
||||
@@ -14,17 +14,17 @@ const SaleModeTag: FC<SaleModeProps> = (props) => {
|
||||
return (
|
||||
<>
|
||||
{saleMode === EnumSaleMode.Bulk && (
|
||||
<Tag circle type='primary' plain size={size} customClassName={customClassName}>
|
||||
<Tag circle type='primary' size={size} customClassName={customClassName}>
|
||||
大货
|
||||
</Tag>
|
||||
)}
|
||||
{saleMode === EnumSaleMode.Plate && (
|
||||
<Tag circle type='danger' plain size={size} customClassName={customClassName}>
|
||||
<Tag circle type='danger' size={size} customClassName={customClassName}>
|
||||
剪板
|
||||
</Tag>
|
||||
)}
|
||||
{saleMode === EnumSaleMode.BulkCut && (
|
||||
<Tag circle type='warning' plain size={size} customClassName={customClassName}>
|
||||
<Tag circle type='warning' size={size} customClassName={customClassName}>
|
||||
散剪
|
||||
</Tag>
|
||||
)}
|
||||
|
||||
@@ -73,3 +73,6 @@
|
||||
padding-left: 20px !important;
|
||||
}
|
||||
}
|
||||
.customRightSlot{
|
||||
margin-right: 20px;
|
||||
}
|
||||
|
||||
@@ -104,22 +104,21 @@ export default memo(
|
||||
disabled={disabled}
|
||||
value={inputCon}
|
||||
placeholder={placeholder}
|
||||
onInput={(e) => onInputEven(e)}
|
||||
onInput={e => onInputEven(e)}
|
||||
/>
|
||||
<View className={styles.search_closeBtn}>
|
||||
{!!inputCon && <CloseBtn onClose={() => clearInput()} styleObj={{ width: '20rpx', height: '20rpx', backgroundColor: '#fff', border: '0' }} />}
|
||||
</View>
|
||||
{
|
||||
showScan && <View onClick={() => {
|
||||
handScan?.()
|
||||
}}>
|
||||
<IconFont
|
||||
name={'icon-saomiao'} size={40} color={'#337FFF'}
|
||||
></IconFont>
|
||||
{showScan && (
|
||||
<View
|
||||
onClick={() => {
|
||||
handScan?.()
|
||||
}}>
|
||||
<IconFont name={'icon-saomiao'} size={40} color={'#337FFF'}></IconFont>
|
||||
</View>
|
||||
}
|
||||
)}
|
||||
|
||||
<View>{customRightSlot}</View>
|
||||
<View className={styles.customRightSlot}>{customRightSlot}</View>
|
||||
</View>
|
||||
</View>
|
||||
{showBtn && (
|
||||
|
||||
@@ -12,39 +12,54 @@
|
||||
font-size: $font_size_medium;
|
||||
height: 40px;
|
||||
}
|
||||
&--small{
|
||||
&--small {
|
||||
font-size: $font_size_min;
|
||||
height: 30px;
|
||||
}
|
||||
&--circle{
|
||||
&--circle {
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
&--danger {
|
||||
border: 1px solid $color_danger;
|
||||
color: $color_danger;
|
||||
background-color: $color_danger;
|
||||
color: white;
|
||||
}
|
||||
&--primary{
|
||||
&--primary {
|
||||
border: 1px solid $color_main;
|
||||
color: $color_main;
|
||||
background-color: $color_main;
|
||||
color: white;
|
||||
}
|
||||
&--warning{
|
||||
&--warning {
|
||||
border: 1px solid $color_warning;
|
||||
color: $color_warning;
|
||||
background-color: $color_warning;
|
||||
color: white;
|
||||
}
|
||||
&--info{
|
||||
&--info {
|
||||
border: 1px solid $color_info;
|
||||
color: $color_info;
|
||||
.tag--text {
|
||||
color: rgba($color: #333333, $alpha: 0.8) !important;
|
||||
}
|
||||
background-color: $color_info;
|
||||
color: white;
|
||||
}
|
||||
&--plain {
|
||||
background-color: currentColor;
|
||||
border-color: currentColor;
|
||||
border: unset;
|
||||
.tag--text {
|
||||
color: #ffffff;
|
||||
background-color: white;
|
||||
&.tag--danger {
|
||||
border: 1px solid $color_danger;
|
||||
color: $color_danger;
|
||||
}
|
||||
&.tag--primary {
|
||||
border: 1px solid $color_main;
|
||||
color: $color_main;
|
||||
}
|
||||
&.tag--warning {
|
||||
border: 1px solid $color_warning;
|
||||
color: $color_warning;
|
||||
}
|
||||
&.tag--info {
|
||||
border: 1px solid $color_info;
|
||||
color: $color_info;
|
||||
.tag--text {
|
||||
color: rgba($color: #333333, $alpha: 0.8) !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
&--disabled {
|
||||
|
||||
@@ -27,7 +27,7 @@ const Tag: FC<PropsType> = (props) => {
|
||||
onClick,
|
||||
circle = false,
|
||||
customStyle = {},
|
||||
plain = false,
|
||||
plain = false, // 朴素
|
||||
customClassName = '',
|
||||
} = props
|
||||
const handleClick = (event) => {
|
||||
|
||||
@@ -145,7 +145,7 @@ const DeliveryFilter = memo<DeliveryPropsType>((props) => {
|
||||
不限
|
||||
</FilterButton>
|
||||
{!!typeList?.length &&
|
||||
typeList?.map((item) => {
|
||||
typeList?.map(item => {
|
||||
return (
|
||||
<FilterButton isActive={searchFilter.type === item?.id} onClick={() => handleSelectedType(item?.id)}>
|
||||
{item.name}
|
||||
@@ -171,10 +171,10 @@ const DeliveryFilter = memo<DeliveryPropsType>((props) => {
|
||||
</View>
|
||||
</View>
|
||||
<View className={styles.filterController}>
|
||||
<NormalButton type='primary' round customClassName={classnames(styles.btn, styles.rest_btn)} onClick={handleReset}>
|
||||
<NormalButton plain type='primary' round customClassName={classnames(styles.btn, styles.rest_btn)} onClick={handleReset}>
|
||||
重置
|
||||
</NormalButton>
|
||||
<NormalButton type='primary' plain round customClassName={classnames(styles.btn, styles.verify_btn)} onClick={handleConfirm}>
|
||||
<NormalButton type='primary' round customClassName={classnames(styles.btn, styles.verify_btn)} onClick={handleConfirm}>
|
||||
确认
|
||||
</NormalButton>
|
||||
</View>
|
||||
|
||||
@@ -81,6 +81,7 @@ const ItemList:FC<PropsType> = (props) => {
|
||||
<View className={styles.bottomBar}>
|
||||
<NormalButton
|
||||
customClassName={styles.bottomBar__button}
|
||||
plain
|
||||
type='info'
|
||||
customStyles={{ color: '#8e8e8e', borderColor: '#8e8e8e' }}
|
||||
round
|
||||
@@ -88,7 +89,7 @@ const ItemList:FC<PropsType> = (props) => {
|
||||
查看详情
|
||||
</NormalButton>
|
||||
{itemData?.status === 0 && (
|
||||
<NormalButton customClassName={styles.bottomBar__button} type='primary' round onClick={() => handleAudit(itemData?.id)}>
|
||||
<NormalButton customClassName={styles.bottomBar__button} type='primary' plain round onClick={() => handleAudit(itemData?.id)}>
|
||||
确认审核
|
||||
</NormalButton>
|
||||
)}
|
||||
|
||||
@@ -120,10 +120,10 @@ const DeliveryDetail: FC = () => {
|
||||
const BottomBar = useMemo(() => {
|
||||
return (
|
||||
<View className={styles.bottomBar}>
|
||||
<NormalButton type='primary' round onClick={handleUploadPic}>
|
||||
<NormalButton plain type='primary' round onClick={handleUploadPic}>
|
||||
上传附件
|
||||
</NormalButton>
|
||||
<NormalButton type='primary' plain round onClick={handleAudit}>
|
||||
<NormalButton type='primary' round onClick={handleAudit}>
|
||||
确认审核
|
||||
</NormalButton>
|
||||
</View>
|
||||
|
||||
@@ -115,7 +115,7 @@ const Login: FC = () => {
|
||||
<Text className={styles.isForgetPwd}>忘记密码？</Text>
|
||||
</View>
|
||||
</View>
|
||||
<NormalButton circle plain onClick={handleLogin} customClassName={styles['login-button']}>
|
||||
<NormalButton circle onClick={handleLogin} customClassName={styles['login-button']}>
|
||||
登录
|
||||
</NormalButton>
|
||||
<QuickLogin />
|
||||
|
||||
@@ -0,0 +1,4 @@
|
||||
export default {
|
||||
navigationBarTitleText: '销售统计',
|
||||
enablePullDownRefresh: true,
|
||||
}
|
||||
@@ -0,0 +1,10 @@
|
||||
.saleStatistic {
|
||||
&--filterBar {
|
||||
display: flex;
|
||||
flex-flow: row nowrap;
|
||||
justify-content: space-evenly;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
background-color: white;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,31 @@
|
||||
import DropDownItem, { DropDownOptions } from '@/components/dropDown-item'
|
||||
import { View } from '@tarojs/components'
|
||||
import { useState } from 'react'
|
||||
import styles from './index.module.scss'
|
||||
|
||||
const saleStatistic = () => {
|
||||
const [options, setOptions] = useState<DropDownOptions[]>([
|
||||
{
|
||||
text: 'name',
|
||||
value: 0,
|
||||
},
|
||||
{
|
||||
text: 'name1',
|
||||
value: 1,
|
||||
},
|
||||
{
|
||||
text: 'name2',
|
||||
value: 2,
|
||||
},
|
||||
])
|
||||
|
||||
return (
|
||||
<View className={styles.saleStatistic}>
|
||||
<View className={styles['saleStatistic--filterBar']}>
|
||||
<View>sdflkajsfdlk</View>
|
||||
<DropDownItem title='name' activeColor='#337fff' options={options}></DropDownItem>
|
||||
</View>
|
||||
</View>
|
||||
)
|
||||
}
|
||||
export default saleStatistic
|
||||
@@ -43,7 +43,7 @@ export default memo<PropsType>((props) => {
|
||||
</MCheckbox>
|
||||
</View>
|
||||
<View className={styles.bottomRight}>
|
||||
<NormalButton plain round type='danger' size='normal' onClick={handleSettle} customStyles={{ backgroundColor: '#F44761' }}>
|
||||
<NormalButton round type='danger' size='normal' onClick={handleSettle} customStyles={{ backgroundColor: '#F44761' }}>
|
||||
<Text style={{ fontSize: '32rpx' }}>删除</Text>
|
||||
</NormalButton>
|
||||
</View>
|
||||
|
||||
@@ -26,7 +26,7 @@ export default memo<PropsType>((props) => {
|
||||
</Text>
|
||||
</View>
|
||||
<View className={styles.bottomRight}>
|
||||
<NormalButton plain type='primary' round size='normal' onClick={handleSettle}>
|
||||
<NormalButton type='primary' round size='normal' onClick={handleSettle}>
|
||||
<Text style={{fontSize: '32rpx'}}>结算</Text>
|
||||
</NormalButton>
|
||||
</View>
|
||||
|
||||
@@ -185,7 +185,7 @@ export default memo<PropsType>(props => {
|
||||
<View className={styles.topItem}>
|
||||
<View className='flex-row items-center'>
|
||||
<View className={styles.topTitle}>{itemData?.purchaser_name}</View>
|
||||
<Tag type='info' size='normal' circle plain>
|
||||
<Tag type='info' size='normal' circle customStyle={{ backgroundColor: '#f0f0f0',borderColor: 'transparent' }} plain>
|
||||
{itemData?.sale_user_name}
|
||||
</Tag>
|
||||
</View>
|
||||
@@ -194,10 +194,6 @@ export default memo<PropsType>(props => {
|
||||
已选 {materialChecked} 种面料，{colorChecked} 个颜色，共{' '}
|
||||
{selected === EnumSaleMode.Bulk ? `${lengthOrRollChecked} 条` : `${lengthOrRollChecked} 米`}
|
||||
</Text>
|
||||
{/* <Text>
|
||||
已选 {0} 种面料，{0} 个颜色，共{' '}
|
||||
{selected === EnumSaleMode.Bulk ? `${0} 条` : `${0} 米`}
|
||||
</Text> */}
|
||||
</View>
|
||||
</View>
|
||||
<DrawerButton isOpen={openDetail} />
|
||||
@@ -234,7 +230,7 @@ export default memo<PropsType>(props => {
|
||||
<Divider customClassName={styles.line}></Divider>
|
||||
<View className={classnames(styles.orderTitle, 'justify-between')}>
|
||||
<Text>布料颜色</Text>
|
||||
<Tag type='danger' size='normal' circle plain={false}>
|
||||
<Tag type='danger' size='normal' circle plain>
|
||||
{selectList[selected].title}单位：{selectList[selected].unit}
|
||||
</Tag>
|
||||
</View>
|
||||
|
||||
@@ -21,13 +21,7 @@
|
||||
grid-template-columns: 1fr 1fr;
|
||||
}
|
||||
}
|
||||
.filterTypeButton {
|
||||
padding: 0 24px;
|
||||
font-size: 28px;
|
||||
}
|
||||
.filterTypeText {
|
||||
color: #6e6e6e !important;
|
||||
}
|
||||
|
||||
.filterTimeButton {
|
||||
grid-column-start: span 2;
|
||||
}
|
||||
@@ -35,36 +29,6 @@
|
||||
background-color: #eaf2ff;
|
||||
}
|
||||
|
||||
.filterButton {
|
||||
display: flex;
|
||||
flex-flow: row nowrap;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0 20px;
|
||||
box-sizing: border-box;
|
||||
border: 0 solid transparent;
|
||||
background-color: #f6f6f6;
|
||||
border-radius: 8px;
|
||||
font-size: 28px;
|
||||
height: 72px;
|
||||
&--text {
|
||||
color: #909090;
|
||||
display: flex;
|
||||
flex-flow: row nowrap;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
&:hover {
|
||||
opacity: 0.7;
|
||||
}
|
||||
&--active {
|
||||
border: 1px solid $color_main;
|
||||
background-color: #eaf2ff;
|
||||
.filterButton--text {
|
||||
color: $color_main;
|
||||
}
|
||||
}
|
||||
}
|
||||
.filterController {
|
||||
margin-top: 60px;
|
||||
width: 100%;
|
||||
|
||||
@@ -1,5 +1,4 @@
|
||||
import NormalButton from '@/components/normalButton'
|
||||
import Popup from '@/components/popup'
|
||||
import { View } from '@tarojs/components'
|
||||
import classnames from 'classnames'
|
||||
import styles from './index.module.scss'
|
||||
@@ -9,7 +8,7 @@ import IconFont from '@/components/iconfont/iconfont'
|
||||
import { EnumTakeGoodsOrderTypeList } from '@/api/index'
|
||||
import dayjs from 'dayjs'
|
||||
import { getFilterData } from '@/common/util'
|
||||
import Taro from '@tarojs/taro'
|
||||
import FilterButton from '@/components/filterButton'
|
||||
|
||||
interface SearchFilter {
|
||||
take_goods_order_type?: number
|
||||
@@ -28,13 +27,6 @@ interface DeliveryPropsType {
|
||||
onReset?: () => void
|
||||
}
|
||||
|
||||
interface ButtonPropsType {
|
||||
isActive: boolean
|
||||
onClick?: Function
|
||||
children?: React.ReactNode
|
||||
customClassName?: string
|
||||
}
|
||||
|
||||
export const filterTimeOptions = {
|
||||
0: {
|
||||
name: '不限',
|
||||
@@ -147,11 +139,14 @@ const DeliveryFilter = memo<DeliveryPropsType>((props) => {
|
||||
不限
|
||||
</FilterButton>
|
||||
{!!typeList?.length &&
|
||||
typeList?.map((item) => {
|
||||
typeList?.map(item => {
|
||||
return (
|
||||
<FilterButton isActive={searchFilter.take_goods_order_type === item?.id} onClick={() => handleSelectedType(item?.id)}>
|
||||
{item.name}
|
||||
</FilterButton>
|
||||
// <NormalButton type='info' circle onClick={() => handleSelectedType(item?.id)}>
|
||||
// {item.name}
|
||||
// </NormalButton>
|
||||
)
|
||||
})}
|
||||
</View>
|
||||
@@ -173,10 +168,10 @@ const DeliveryFilter = memo<DeliveryPropsType>((props) => {
|
||||
</View>
|
||||
</View>
|
||||
<View className={styles.filterController}>
|
||||
<NormalButton type='primary' round customClassName={classnames(styles.btn, styles.rest_btn)} onClick={handleReset}>
|
||||
<NormalButton type='primary' plain round customClassName={classnames(styles.btn, styles.rest_btn)} onClick={handleReset}>
|
||||
重置
|
||||
</NormalButton>
|
||||
<NormalButton type='primary' plain round customClassName={classnames(styles.btn, styles.verify_btn)} onClick={handleConfirm}>
|
||||
<NormalButton type='primary' round customClassName={classnames(styles.btn, styles.verify_btn)} onClick={handleConfirm}>
|
||||
确认
|
||||
</NormalButton>
|
||||
</View>
|
||||
@@ -184,16 +179,5 @@ const DeliveryFilter = memo<DeliveryPropsType>((props) => {
|
||||
)
|
||||
})
|
||||
|
||||
const FilterButton: FC<ButtonPropsType> = (props) => {
|
||||
const { onClick, children, isActive = false, customClassName } = props
|
||||
const handleClick = () => {
|
||||
onClick?.()
|
||||
}
|
||||
return (
|
||||
<View className={classnames(styles.filterButton, isActive && styles['filterButton--active'], customClassName)} onClick={handleClick}>
|
||||
<View className={classnames(styles['filterButton--text'])}>{children}</View>
|
||||
</View>
|
||||
)
|
||||
}
|
||||
|
||||
export default DeliveryFilter
|
||||
|
||||
@@ -84,13 +84,14 @@ const ItemList:FC<PropsType> = (props) => {
|
||||
<NormalButton
|
||||
customClassName={styles.bottomBar__button}
|
||||
type='info'
|
||||
plain
|
||||
customStyles={{ color: '#8e8e8e', borderColor: '#8e8e8e' }}
|
||||
round
|
||||
onClick={() => handleDetail(itemData)}>
|
||||
查看详情
|
||||
</NormalButton>
|
||||
{itemData?.status === 0 && (
|
||||
<NormalButton customClassName={styles.bottomBar__button} type='primary' round onClick={() => handleAudit(itemData?.id)}>
|
||||
<NormalButton plain customClassName={styles.bottomBar__button} type='primary' round onClick={() => handleAudit(itemData?.id)}>
|
||||
确认审核
|
||||
</NormalButton>
|
||||
)}
|
||||
|
||||
@@ -138,7 +138,7 @@ const TakeDeliveryDetail: FC = () => {
|
||||
// 采购提货
|
||||
return (
|
||||
<View className={styles.bottomBar}>
|
||||
<NormalButton type='primary' plain round onClick={handleAudit} customStyles={{ width: '100%' }}>
|
||||
<NormalButton type='primary' round onClick={handleAudit} customStyles={{ width: '100%' }}>
|
||||
确认提货
|
||||
</NormalButton>
|
||||
</View>
|
||||
@@ -147,10 +147,10 @@ const TakeDeliveryDetail: FC = () => {
|
||||
// 退货提货
|
||||
return (
|
||||
<View className={styles.bottomBar} style={{ justifyContent: 'space-between' }}>
|
||||
<NormalButton type='primary' round onClick={handleRefuse} customStyles={{ width: '25%' }}>
|
||||
<NormalButton type='primary' plain round onClick={handleRefuse} customStyles={{ width: '25%' }}>
|
||||
拒收
|
||||
</NormalButton>
|
||||
<NormalButton type='primary' plain round onClick={handleAudit} customStyles={{ width: '25%' }}>
|
||||
<NormalButton type='primary' round onClick={handleAudit} customStyles={{ width: '25%' }}>
|
||||
确认提货
|
||||
</NormalButton>
|
||||
</View>
|
||||
|
||||
@@ -82,7 +82,7 @@ const statisticAnalysis: IconCardType[] = [
|
||||
{
|
||||
iconName: 'icon-xiaoshou',
|
||||
name: '销售',
|
||||
path: '',
|
||||
path: '/pages/saleStatistic/index',
|
||||
},
|
||||
{
|
||||
iconName: 'icon-duizhang',
|
||||
@@ -135,13 +135,13 @@ const UserInfo: FC = () => {
|
||||
<Text className={styles.userno}>{userInfo.userInfo.user_code}</Text>
|
||||
</View>
|
||||
<View className={styles.right}>
|
||||
<NormalButton type='primary' round size='normal' onClick={handleLogout}>
|
||||
<NormalButton plain type='primary' round size='normal' onClick={handleLogout}>
|
||||
退出登录
|
||||
</NormalButton>
|
||||
</View>
|
||||
</View>
|
||||
<View className={styles.bottomBar}>
|
||||
<Tag type='primary' size='normal' circle customStyle={{ marginRight: '10px' }}>
|
||||
<Tag type='primary' size='normal' circle plain customStyle={{ marginRight: '10px' }}>
|
||||
{userInfo.userInfo.department_name}
|
||||
</Tag>
|
||||
<Divider direction='vertical'></Divider>
|
||||
@@ -151,7 +151,7 @@ const UserInfo: FC = () => {
|
||||
<LayoutBlock circle>
|
||||
<View className={styles.layoutTitle}>功能特色</View>
|
||||
<View className={styles['grid-container']}>
|
||||
{feature.map((item) => {
|
||||
{feature.map(item => {
|
||||
return <IconCard iconName={item.iconName} title={item.name} onClick={() => handleClickIconCard(item)}></IconCard>
|
||||
})}
|
||||
</View>
|
||||
@@ -159,7 +159,7 @@ const UserInfo: FC = () => {
|
||||
<LayoutBlock circle>
|
||||
<View className={styles.layoutTitle}>布料取色</View>
|
||||
<View className={styles['grid-container']}>
|
||||
{fabric.map((item) => {
|
||||
{fabric.map(item => {
|
||||
return <IconCard iconName={item.iconName} title={item.name} onClick={() => handleClickIconCard(item)}></IconCard>
|
||||
})}
|
||||
</View>
|
||||
@@ -167,7 +167,7 @@ const UserInfo: FC = () => {
|
||||
<LayoutBlock circle>
|
||||
<View className={styles.layoutTitle}>统计分析</View>
|
||||
<View className={styles['grid-container']}>
|
||||
{statisticAnalysis.map((item) => {
|
||||
{statisticAnalysis.map(item => {
|
||||
return <IconCard iconName={item.iconName} title={item.name} onClick={() => handleClickIconCard(item)}></IconCard>
|
||||
})}
|
||||
</View>
|
||||
|
||||
@@ -2,12 +2,12 @@ $color_bg_one: #f8f8f8;
|
||||
$color_font_one: rgba($color: #000000, $alpha: 0.8);
|
||||
$color_font_two: #ababab;
|
||||
$color_font_three: #707070;
|
||||
$color_main: #4581ff;
|
||||
|
||||
$color_main: #4581ff;
|
||||
$color_danger: #e64340;
|
||||
$color_warning: #e6a23c;
|
||||
$color_money: #F64861;
|
||||
$color_info: rgba($color: #B3B3B3, $alpha: 0.2);
|
||||
$color_info: #909090;
|
||||
|
||||
$opacity-disabled: 0.3;
|
||||
$borderStyle: solid;
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
/* Project id 3619513 */
|
||||
// url('/src/styles/iconfont.ttf') format('truetype');
|
||||
src:
|
||||
url('iconfont.ttf?t=1663556335905') format('truetype');
|
||||
url('/src/styles/iconfont.ttf?t=1663556335905') format('truetype');
|
||||
}
|
||||
|
||||
.iconfont {
|
||||
@@ -296,4 +296,4 @@
|
||||
|
||||
.icon-gouwu:before {
|
||||
content: "\e607";
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user