✨ feat(ID1000920): 【面料标签】面料打标签分类及排序优化；
【【面料标签】面料打标签分类及排序优化；】 https://www.tapd.cn/53459131/prong/stories/view/1153459131001000920
This commit is contained in:
xuan
parent
02f807824d
commit
5c0564e4a9
@ -1,5 +1,5 @@
|
||||
{
|
||||
"symbol_url": "//at.alicdn.com/t/c/font_3786318_isejgadt4t.js",
|
||||
"symbol_url": "//at.alicdn.com/t/c/font_3786318_sqfeq7399ga.js",
|
||||
"save_dir": "./src/components/iconfont",
|
||||
"use_typescript": false,
|
||||
"use_rpx": true,
|
||||
|
||||
@ -49,7 +49,6 @@ export const GetClassList = () => {
|
||||
*/
|
||||
export const GetProductDetailApi = () => {
|
||||
return useRequest({
|
||||
// url: '/v1/mall/product',
|
||||
url: '/v3/mallCherry/product',
|
||||
method: 'get',
|
||||
})
|
||||
|
||||
@ -28,4 +28,44 @@ export const AddSearchHistoryApi = () => {
|
||||
url: '/v1/mall/searchHistory',
|
||||
method: 'post',
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取标签组列表
|
||||
*/
|
||||
export const GetLabelGroupListApi = () => {
|
||||
return useRequest({
|
||||
url: '/v1/mall/product/label/group/list',
|
||||
method: 'get',
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* 首页跳转入口
|
||||
*/
|
||||
export const HomePageJumpApi = () => {
|
||||
return useRequest({
|
||||
url: '/v1/mall/product/label/page',
|
||||
method: 'get',
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取面料列表（首页进入）
|
||||
*/
|
||||
export const GetLabelProductsApi = () => {
|
||||
return useRequest({
|
||||
url: '/v1/mall/product/label/products',
|
||||
method: 'get',
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* [枚举]首页跳转分类的枚举
|
||||
*/
|
||||
export const EnumLabelPageJumpApi = () => {
|
||||
return useRequest({
|
||||
url: '/v1/mall/product/label/page_jump',
|
||||
method: 'get',
|
||||
})
|
||||
}
|
||||
|
||||
@ -41,6 +41,12 @@ export default {
|
||||
borderStyle: 'white',
|
||||
},
|
||||
subPackages: [
|
||||
{
|
||||
root: 'pages/category',
|
||||
pages: [
|
||||
'index',
|
||||
],
|
||||
},
|
||||
{
|
||||
root: 'pages/search',
|
||||
pages: [
|
||||
|
||||
@ -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://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` // 发
|
||||
@ -13,7 +13,7 @@ export const BASE_URL = 'https://pre.zzfzyc.com/lymarket' // 预发布
|
||||
// export const BASE_URL = 'https://www.zzfzyc.com/lymarket' // 正式环境
|
||||
// export const BASE_URL = `http://192.168.1.5:40001/lymarket` // 王霞
|
||||
// export const BASE_URL = 'http://192.168.1.7:50002/lymarket' // 添
|
||||
// export const BASE_URL = 'http://192.168.1.28:50001/lymarket' // 婷
|
||||
// export const BASE_URL = 'http://192.168.1.28:50002/lymarket' // 婷
|
||||
// export const BASE_URL = 'http://192.168.1.42:50002/lymarket' // 杰
|
||||
|
||||
// CDN
|
||||
@ -49,6 +49,10 @@ export const BANk_WX_APPID = 'wx65934ee32a88d726'
|
||||
|
||||
// 支付码单跳转链接
|
||||
export const PAY_H5_CODE_URL = CURRENT_PAY_H5_CODE_URL
|
||||
// 首页三张图片
|
||||
export const HOME_ITEM1 = getCDNSource('/mall/home_item1.png')
|
||||
export const HOME_ITEM2 = getCDNSource('/mall/home_item2.png')
|
||||
export const HOME_ITEM3 = getCDNSource('/mall/home_item3.png')
|
||||
|
||||
// 场景值
|
||||
export const SCENE = {
|
||||
|
||||
@ -33,7 +33,7 @@ const Banner = (props: params) => {
|
||||
}
|
||||
|
||||
const showDot = useMemo(() => {
|
||||
return list.length > 1
|
||||
return list?.length > 1
|
||||
}, [list])
|
||||
useEffect(() => {
|
||||
getData()
|
||||
|
||||
27
src/components/cell/index.module.scss
Normal file
27
src/components/cell/index.module.scss
Normal file
@ -0,0 +1,27 @@
|
||||
.cell {
|
||||
display: flex;
|
||||
flex-flow: row nowrap;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
font-size: 28px;
|
||||
padding: 12px 0;
|
||||
|
||||
.title {
|
||||
min-width: 140px;
|
||||
flex: none;
|
||||
color: #a9a9a9;
|
||||
}
|
||||
|
||||
.desc {
|
||||
display: flex;
|
||||
flex-flow: row nowrap;
|
||||
align-items: center;
|
||||
justify-content: flex-end;
|
||||
flex: 1 1 auto;
|
||||
color: $color_font_one;
|
||||
}
|
||||
}
|
||||
|
||||
.descText {
|
||||
@include common_ellipsis(2);
|
||||
}
|
||||
46
src/components/cell/index.tsx
Normal file
46
src/components/cell/index.tsx
Normal file
@ -0,0 +1,46 @@
|
||||
import { Text, View } from '@tarojs/components'
|
||||
import classNames from 'classnames'
|
||||
import type { FC } from 'react'
|
||||
import { useCallback, useMemo, useRef } from 'react'
|
||||
import type { IconNames } from '../iconfont/iconfont'
|
||||
import IconFont from '../iconfont/iconfont'
|
||||
import styles from './index.module.scss'
|
||||
|
||||
interface CellPropsType {
|
||||
title: string | React.ReactNode
|
||||
desc: string | React.ReactNode
|
||||
isLink?: boolean
|
||||
onClick?: () => void
|
||||
customStyle?: React.CSSProperties
|
||||
customClassName?: string
|
||||
customDescClassName?: string
|
||||
iconName?: IconNames
|
||||
}
|
||||
const Cell: FC<CellPropsType> = (props) => {
|
||||
const { title, desc, isLink = false, customClassName, customStyle, onClick, iconName, customDescClassName } = props
|
||||
|
||||
const onClickRef = useRef(onClick)
|
||||
onClickRef.current = onClick
|
||||
// 防止函数的引用改变
|
||||
const handleClick = useCallback(() => {
|
||||
return isLink && onClickRef.current?.()
|
||||
}, [isLink])
|
||||
|
||||
const CellElement = useMemo(() => {
|
||||
return (
|
||||
<View className={classNames(styles.cell, customClassName)} style={customStyle} onClick={handleClick}>
|
||||
<View className={styles.title}>
|
||||
{iconName && <IconFont name={iconName} size={46}></IconFont>}
|
||||
<View>{title}</View>
|
||||
</View>
|
||||
<View className={styles.desc}>
|
||||
<Text className={classNames(styles.descText, customDescClassName)}>{desc}</Text>
|
||||
{isLink && <IconFont name="icon-rukou" size={46} color="inherit"></IconFont>}
|
||||
</View>
|
||||
</View>
|
||||
)
|
||||
}, [title, desc, handleClick, customStyle])
|
||||
|
||||
return <>{CellElement}</>
|
||||
}
|
||||
export default Cell
|
||||
22
src/components/dropDown-item/index.module.scss
Normal file
22
src/components/dropDown-item/index.module.scss
Normal file
@ -0,0 +1,22 @@
|
||||
.dropDownItem {
|
||||
width: 100%;
|
||||
|
||||
&--title {
|
||||
position: relative;
|
||||
background-color: white;
|
||||
display: flex;
|
||||
flex-flow: row nowrap;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
padding: 24px 0;
|
||||
color: #8c8c8c;
|
||||
font-size: 28px;
|
||||
&--text {
|
||||
display: block;
|
||||
margin-right: 12px;
|
||||
}
|
||||
}
|
||||
&Options {
|
||||
padding: 24px 40px;
|
||||
}
|
||||
}
|
||||
160
src/components/dropDown-item/index.tsx
Normal file
160
src/components/dropDown-item/index.tsx
Normal file
@ -0,0 +1,160 @@
|
||||
/**
|
||||
* 注意：需要在父节点设置 position: relative;
|
||||
*/
|
||||
|
||||
import { Text, View } from '@tarojs/components'
|
||||
import Taro from '@tarojs/taro'
|
||||
import type { Ref } from 'react'
|
||||
import React, { forwardRef, useEffect, useImperativeHandle, useMemo, useState } from 'react'
|
||||
import classNames from 'classnames'
|
||||
import Iconfont from '../iconfont/iconfont'
|
||||
import Popup from '../popup'
|
||||
import Cell from '../cell'
|
||||
import styles from './index.module.scss'
|
||||
// 弹窗选择向上弹窗还是向下弹窗
|
||||
type Direction = 'up' | 'down'
|
||||
// 配置 菜单可选项
|
||||
export interface DropDownOptions {
|
||||
text: string
|
||||
value: number
|
||||
}
|
||||
|
||||
interface DropDownEvent {
|
||||
change?: (value: DropDownOptions['value']) => void // value 变化时触发
|
||||
onCloseOverlay?: () => void
|
||||
}
|
||||
|
||||
export interface DropDownItemRef {
|
||||
show: boolean
|
||||
closePopup: () => void
|
||||
showPopup: () => void
|
||||
}
|
||||
|
||||
interface PropsType extends DropDownEvent {
|
||||
direction?: Direction
|
||||
options?: DropDownOptions[]
|
||||
title?: string
|
||||
value?: number | string // 当前选中的值
|
||||
children?: React.ReactNode
|
||||
activeColor?: string
|
||||
showOverlay?: boolean
|
||||
customClassName?: string
|
||||
customStyle?: React.CSSProperties
|
||||
hasBottomBtn?: boolean // 底部有按钮不允许点击蒙层关闭
|
||||
titleSlot?: React.ReactNode
|
||||
}
|
||||
const DropDownItem = (props: PropsType, ref: Ref<DropDownItemRef>) => {
|
||||
const { children, titleSlot, direction = 'down', title = '', value, options = [], change, activeColor, showOverlay = true, hasBottomBtn = false, customClassName, customStyle, onCloseOverlay } = props
|
||||
|
||||
const [showPopup, setShowPopup] = useState(false)
|
||||
|
||||
useImperativeHandle(ref, () => ({
|
||||
show: showPopup,
|
||||
// 暴露出方法给有需要的用
|
||||
closePopup() {
|
||||
setShowPopup(false)
|
||||
},
|
||||
showPopup() {
|
||||
setShowPopup(true)
|
||||
},
|
||||
}), [showPopup])
|
||||
|
||||
const handleClickOption = (value: DropDownOptions['value']) => {
|
||||
change?.(value)
|
||||
}
|
||||
|
||||
const [text, setText] = useState(options?.[0]?.text || '')
|
||||
|
||||
const defaultOptions = useMemo(() => {
|
||||
const currentValue = value
|
||||
return options?.map(({ text, value }, key) => {
|
||||
currentValue === value && setText(text)
|
||||
return <Cell key={key} title={text} desc="" isLink onClick={() => handleClickOption(value)}></Cell>
|
||||
})
|
||||
}, [value])
|
||||
|
||||
const getIconName = () => {
|
||||
if (direction === 'up') {
|
||||
return showPopup ? 'icon-zhankai1' : 'icon-shouqi1'
|
||||
}
|
||||
// down
|
||||
return showPopup ? 'icon-shouqi1' : 'icon-zhankai1'
|
||||
}
|
||||
|
||||
const handleClickTitle = () => {
|
||||
console.log('handleClickTitle', showPopup)
|
||||
onCloseOverlay?.()
|
||||
setShowPopup(prev => !prev)
|
||||
}
|
||||
|
||||
const handleClosePopup = () => {
|
||||
if (hasBottomBtn) { return }
|
||||
setShowPopup(false)
|
||||
onCloseOverlay?.()
|
||||
}
|
||||
|
||||
const [overlayOffsetTop, setOverlayOffsetTop] = useState('unset')
|
||||
// 获取遮罩层的样式
|
||||
const getOverlayStyle = (): React.CSSProperties => {
|
||||
return { position: !showOverlay ? 'fixed' : 'absolute', top: 0 }
|
||||
}
|
||||
|
||||
// 获取整个页面的完整高度
|
||||
const [scrollHeight, setScrollHeight] = useState(0)
|
||||
|
||||
useEffect(() => {
|
||||
const query = Taro.createSelectorQuery()
|
||||
query.select('#DropDownItem').boundingClientRect()
|
||||
query.selectViewport().scrollOffset()
|
||||
query.exec((res) => {
|
||||
console.log('res==>', res)
|
||||
setScrollHeight(res[1].scrollHeight)
|
||||
if (direction === 'down') {
|
||||
setOverlayOffsetTop(`${res[0].bottom}px`)
|
||||
}
|
||||
else {
|
||||
setOverlayOffsetTop(`${res[0].top}px`)
|
||||
}
|
||||
})
|
||||
}, [])
|
||||
|
||||
// 获取样式
|
||||
const getCustomStyle: React.CSSProperties = useMemo(() => {
|
||||
if (direction === 'up') {
|
||||
return { position: 'absolute', top: 0, height: overlayOffsetTop }
|
||||
}
|
||||
else {
|
||||
return { position: 'absolute', top: overlayOffsetTop, height: `calc(${`${scrollHeight}px`} - ${overlayOffsetTop})` }
|
||||
}
|
||||
}, [overlayOffsetTop])
|
||||
|
||||
return (
|
||||
<View className={styles.dropDownItem} id="DropDownItem">
|
||||
<View className={classNames(customClassName, styles['dropDownItem--title'])} style={customStyle} onClick={handleClickTitle}>
|
||||
{
|
||||
titleSlot || <>
|
||||
|
||||
<Text className={styles['dropDownItem--title--text']} style={showPopup ? { color: activeColor } : {}}>
|
||||
{title || text}
|
||||
</Text>
|
||||
<Iconfont name={getIconName()} size={20} color={showPopup ? activeColor : '#7f7f7f'}></Iconfont>
|
||||
</>
|
||||
}
|
||||
</View>
|
||||
<Popup
|
||||
onClose={handleClosePopup}
|
||||
showOverLay={showOverlay}
|
||||
show={showPopup}
|
||||
showTitle={false}
|
||||
safeAreaInsetBottom={false}
|
||||
customStyle={getCustomStyle}
|
||||
overlayStyle={getOverlayStyle()}
|
||||
position={direction === 'down' ? 'top' : 'bottom'}
|
||||
>
|
||||
{/* showPopup 为true才显示children 是因为真机环境下 children内的字体有穿透的情况 */}
|
||||
{showPopup && (children || <View className={styles.dropDownItemOptions}>{defaultOptions}</View>)}
|
||||
</Popup>
|
||||
</View>
|
||||
)
|
||||
}
|
||||
export default forwardRef(DropDownItem)
|
||||
@ -1,34 +1,34 @@
|
||||
.popup_main {
|
||||
width: 608px;
|
||||
height: 100vh;
|
||||
height: 70vh;
|
||||
padding: 20px;
|
||||
padding-bottom: 0;
|
||||
box-sizing: border-box;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
flex-flow: column nowrap;
|
||||
overflow: hidden;
|
||||
.popup_title {
|
||||
font-size: $font_size;
|
||||
font-weight: 700;
|
||||
text-align: center;
|
||||
padding: 20px 0;
|
||||
}
|
||||
.scroll {
|
||||
flex: 1;
|
||||
height: 0;
|
||||
}
|
||||
.popup_filter {
|
||||
padding-bottom: 100px;
|
||||
flex: 1 1 auto;
|
||||
overflow: scroll;
|
||||
}
|
||||
.popup_filter_item {
|
||||
margin-bottom: 20px;
|
||||
.title {
|
||||
font-size: $font_size;
|
||||
font-size: 28px;
|
||||
color: $color_font_one;
|
||||
font-weight: 700;
|
||||
padding: 20px 0;
|
||||
}
|
||||
.btn_list {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(3, 165.75px);
|
||||
grid-template-columns: 1fr 1fr 1fr;
|
||||
grid-row-gap: 16px;
|
||||
grid-column-gap: 16px;
|
||||
justify-content: space-between;
|
||||
.btn_item {
|
||||
height: 69.2px;
|
||||
@ -38,7 +38,8 @@
|
||||
text-align: center;
|
||||
font-size: $font_size_medium;
|
||||
color: $color_font_one;
|
||||
margin-bottom: 20px;
|
||||
border: 2px solid transparent;
|
||||
box-sizing: border-box;
|
||||
@include common_ellipsis();
|
||||
}
|
||||
.select_btn_item {
|
||||
@ -65,11 +66,6 @@
|
||||
font-size: $font_size_medium;
|
||||
}
|
||||
}
|
||||
.unit {
|
||||
color: $color_font_one;
|
||||
font-size: $font_size;
|
||||
margin-left: 20px;
|
||||
}
|
||||
text {
|
||||
color: #ccc;
|
||||
padding: 0 20px;
|
||||
@ -82,43 +78,28 @@
|
||||
border-radius: 30px;
|
||||
padding: 20px;
|
||||
box-sizing: border-box;
|
||||
textarea {
|
||||
width: 100%;
|
||||
height: 126px;
|
||||
font-size: $font_size_medium;
|
||||
}
|
||||
}
|
||||
}
|
||||
.btns_con {
|
||||
width: 100%;
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
padding-bottom: constant(safe-area-inset-bottom);
|
||||
padding-bottom: env(safe-area-inset-bottom);
|
||||
.btns_two {
|
||||
display: flex;
|
||||
width: 552px;
|
||||
height: 82px;
|
||||
border: 2px solid #cde5ff;
|
||||
box-sizing: border-box;
|
||||
font-size: $font_size_big;
|
||||
border-radius: 40px;
|
||||
margin-bottom: 20px;
|
||||
.rest_btn {
|
||||
flex: 1;
|
||||
border-radius: 0px 40px 40px 0px;
|
||||
text-align: center;
|
||||
line-height: 82px;
|
||||
color: $color_main;
|
||||
}
|
||||
.verify_btn {
|
||||
flex: 1;
|
||||
border-radius: 0px 40px 40px 0px;
|
||||
background: $color_main;
|
||||
text-align: center;
|
||||
line-height: 82px;
|
||||
color: #fff;
|
||||
}
|
||||
display: flex;
|
||||
flex-flow: row nowrap;
|
||||
justify-content: space-between;
|
||||
padding: 32px 0;
|
||||
// .btns_two {
|
||||
// display: flex;
|
||||
// height: 82px;
|
||||
// border: 2px solid #cde5ff;
|
||||
// box-sizing: border-box;
|
||||
// font-size: $font_size_big;
|
||||
// border-radius: 40px;
|
||||
// margin-bottom: 20px;
|
||||
.rest_btn {
|
||||
width: 48%;
|
||||
}
|
||||
.verify_btn {
|
||||
width: 48%;
|
||||
}
|
||||
// }
|
||||
}
|
||||
}
|
||||
|
||||
@ -1,149 +1,209 @@
|
||||
import { Input, ScrollView, Text, Textarea, View } from '@tarojs/components'
|
||||
import { useDidShow } from '@tarojs/taro'
|
||||
import { useDidShow, useReady, useUnload } from '@tarojs/taro'
|
||||
import classnames from 'classnames'
|
||||
import { memo, useEffect, useRef, useState } from 'react'
|
||||
import type { Ref } from 'react'
|
||||
import { forwardRef, memo, useEffect, useImperativeHandle, useMemo, useRef, useState } from 'react'
|
||||
import { nextTick } from '@tarojs/runtime'
|
||||
import DropDownItem from '../dropDown-item'
|
||||
import type { DropDownItemRef } from '../dropDown-item'
|
||||
import NormalButton from '../normalButton'
|
||||
import IconFont from '../iconfont/iconfont'
|
||||
import styles from './index.module.scss'
|
||||
import Popup from '@/components/popup'
|
||||
import type { Params as PopuParams } from '@/components/popup'
|
||||
import { GetProductKindListApi } from '@/api/material'
|
||||
import type { Params as PopupParams } from '@/components/popup'
|
||||
import { GetLabelGroupListApi } from '@/api/search'
|
||||
|
||||
type params = {
|
||||
onFiltr?: (val: object) => void // 确定搜索
|
||||
onRest?: (val: Object) => void // 重置
|
||||
} & PopuParams
|
||||
const Filter = ({ onClose, onFiltr, show = false, onRest }: params) => {
|
||||
interface params extends PopupParams {
|
||||
defaultValue?: FilterOptions['label_ids']
|
||||
onFilter?: (val: object) => void // 确定搜索
|
||||
onReset?: (val: Object) => void // 重置
|
||||
}
|
||||
|
||||
interface FilterOptions {
|
||||
label_ids: number[]
|
||||
width: string
|
||||
weight_density: string
|
||||
component: string
|
||||
}
|
||||
|
||||
const Filter = (props: params) => {
|
||||
const { onFilter, onReset, defaultValue = [] } = props
|
||||
console.log('rerender')
|
||||
// 搜索条件
|
||||
const [filterObj, setFilterObj] = useState({
|
||||
seriesName: '',
|
||||
seriesId: '',
|
||||
width: '',
|
||||
weight: '',
|
||||
element: '',
|
||||
const [filterObj, setFilterObj] = useState<FilterOptions>({
|
||||
label_ids: defaultValue,
|
||||
width: '', // 幅宽
|
||||
weight_density: '', // 克重
|
||||
component: '', // 成分
|
||||
})
|
||||
|
||||
const selectFieldValue = useRef({ width: '幅宽', weight: '克重', element: '成分', seriesName: '系列' })
|
||||
useEffect(() => {
|
||||
console.log('defaultValue', defaultValue)
|
||||
setFilterObj((prev) => {
|
||||
return {
|
||||
...prev,
|
||||
label_ids: defaultValue,
|
||||
}
|
||||
})
|
||||
}, [defaultValue])
|
||||
|
||||
const dropDownRef = useRef<DropDownItemRef>(null)
|
||||
|
||||
// 获取系列
|
||||
const { fetchData: kindFetchData } = GetProductKindListApi()
|
||||
const { fetchData: kindFetchData } = GetLabelGroupListApi()
|
||||
|
||||
const [kindList, setKindList] = useState<any[]>([])
|
||||
|
||||
const getCategoryList = async() => {
|
||||
const { data } = await kindFetchData()
|
||||
setKindList(data.list)
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
show && getCategoryList()
|
||||
}, [show])
|
||||
getCategoryList()
|
||||
}, [])
|
||||
|
||||
// 切换系列
|
||||
const changeKind = (e) => {
|
||||
setFilterObj({ ...filterObj, seriesId: e.id, seriesName: e.name })
|
||||
}
|
||||
|
||||
const onCloseEven = () => {
|
||||
onClose?.()
|
||||
const changeKind = (id: number) => {
|
||||
setFilterObj((prev) => {
|
||||
return {
|
||||
...prev,
|
||||
label_ids: (() => {
|
||||
if (prev.label_ids.includes(id)) {
|
||||
const index = prev.label_ids.findIndex(item => item === id)
|
||||
prev.label_ids.splice(index, 1)
|
||||
return prev.label_ids
|
||||
}
|
||||
else {
|
||||
return [...prev.label_ids, id]
|
||||
}
|
||||
})(),
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
// 重置数据
|
||||
const onRestEven = () => {
|
||||
const res = {
|
||||
seriesName: '',
|
||||
seriesId: '',
|
||||
label_ids: [],
|
||||
width: '',
|
||||
weight: '',
|
||||
element: '',
|
||||
weight_density: '',
|
||||
component: '',
|
||||
}
|
||||
setFilterObj(res)
|
||||
onFiltr?.(filterObj)
|
||||
onClose?.()
|
||||
onFilter?.(res)
|
||||
onReset?.(res)
|
||||
dropDownRef.current?.closePopup()
|
||||
}
|
||||
|
||||
// 提交搜索
|
||||
const onVerify = () => {
|
||||
onFiltr?.({ data: filterObj, field: selectFieldValue.current })
|
||||
onClose?.()
|
||||
onFilter?.(filterObj)
|
||||
dropDownRef.current?.closePopup()
|
||||
}
|
||||
|
||||
// 获取幅宽或克重输入值或成分
|
||||
const setFieldData = (e, field) => {
|
||||
const setFieldData = (e, field: keyof FilterOptions) => {
|
||||
filterObj[field] = e.detail.value
|
||||
setFilterObj({ ...filterObj })
|
||||
}
|
||||
|
||||
return (
|
||||
<Popup position="right" show={show} showTitle={false} onClose={() => onCloseEven()} showIconButton>
|
||||
<View className={styles.popup_main}>
|
||||
<View className={styles.popup_title}>全部筛选</View>
|
||||
<ScrollView scrollY className={styles.scroll}>
|
||||
<View className={styles.popup_filter}>
|
||||
<View className={styles.popup_filter_item}>
|
||||
<View className={styles.title}>系列</View>
|
||||
<View className={styles.btn_list}>
|
||||
{kindList.map(item => (
|
||||
<View
|
||||
key={item.id}
|
||||
onClick={() => changeKind(item)}
|
||||
className={classnames(styles.btn_item, filterObj.seriesId == item.id && styles.select_btn_item)}
|
||||
>
|
||||
{item.name}
|
||||
</View>
|
||||
))}
|
||||
</View>
|
||||
</View>
|
||||
<View className={styles.popup_filter_item}>
|
||||
<View className={styles.title}>幅宽</View>
|
||||
<View className={styles.btn_list_input}>
|
||||
<View className={styles.btn_width}>
|
||||
<Input
|
||||
alwaysEmbed
|
||||
cursorSpacing={150}
|
||||
value={filterObj.width}
|
||||
onBlur={e => setFieldData(e, 'width')}
|
||||
placeholder="请输入幅宽"
|
||||
placeholderStyle="font-size: 26rpx"
|
||||
/>
|
||||
</View>
|
||||
<View className={styles.unit}>cm</View>
|
||||
</View>
|
||||
</View>
|
||||
<View className={styles.popup_filter_item}>
|
||||
<View className={styles.title}>克重</View>
|
||||
<View className={styles.btn_list_input}>
|
||||
<View className={styles.btn_width}>
|
||||
<Input
|
||||
value={filterObj.weight}
|
||||
alwaysEmbed
|
||||
cursorSpacing={150}
|
||||
onBlur={e => setFieldData(e, 'weight')}
|
||||
placeholder="请输入克重"
|
||||
placeholderStyle="font-size: 26rpx"
|
||||
/>
|
||||
</View>
|
||||
<View className={styles.unit}>kg</View>
|
||||
</View>
|
||||
</View>
|
||||
<View className={styles.popup_filter_item}>
|
||||
<View className={styles.title}>成分</View>
|
||||
<View className={styles.btn_list_element}>
|
||||
<Textarea placeholder="请输入" cursorSpacing={60} value={filterObj.element} onInput={e => setFieldData(e, 'element')} />
|
||||
</View>
|
||||
</View>
|
||||
const isInitial = useMemo(() => {
|
||||
return Object.keys(filterObj).every((key) => {
|
||||
if (Array.isArray(filterObj[key])) {
|
||||
return filterObj[key].length === 0
|
||||
}
|
||||
else {
|
||||
return !filterObj[key]
|
||||
}
|
||||
})
|
||||
}, [filterObj])
|
||||
|
||||
<View className="common_safe_area_y"></View>
|
||||
</View>
|
||||
</ScrollView>
|
||||
<View className={styles.btns_con}>
|
||||
<View className={styles.btns_two}>
|
||||
<View className={styles.rest_btn} onClick={() => onRestEven()}>
|
||||
重置
|
||||
return (
|
||||
<DropDownItem ref={dropDownRef} direction="down" titleSlot={
|
||||
<>
|
||||
<IconFont customStyle={{ marginRight: '10rpx' }} name="icon-shaixuan" color={isInitial ? '#808080' : '#4581ff'} size={40}></IconFont>
|
||||
<Text style={{ color: isInitial ? '#808080' : '#4581ff' }}>筛选</Text>
|
||||
</>
|
||||
}
|
||||
>
|
||||
<View className={styles.popup_main}>
|
||||
<View className={styles.popup_filter}>
|
||||
{
|
||||
kindList?.map((item, key) => {
|
||||
return <View key={key} className={styles.popup_filter_item}>
|
||||
<View className={styles.title}>{item.name}</View>
|
||||
<View className={styles.btn_list}>
|
||||
{
|
||||
item.product_label_data?.map((label: { id: number; name: string }) => {
|
||||
return <View
|
||||
key={label.id}
|
||||
onClick={() => changeKind(label.id)}
|
||||
className={classnames(styles.btn_item, filterObj.label_ids.includes(label.id) && styles.select_btn_item)}
|
||||
>
|
||||
{label.name}
|
||||
</View>
|
||||
})
|
||||
}
|
||||
</View>
|
||||
</View>
|
||||
})
|
||||
}
|
||||
<View className={styles.popup_filter_item}>
|
||||
<View className={styles.title}>幅宽要求</View>
|
||||
<View className={styles.btn_list_input}>
|
||||
<View className={styles.btn_width}>
|
||||
<Input
|
||||
alwaysEmbed
|
||||
cursorSpacing={150}
|
||||
value={filterObj.width}
|
||||
type="digit"
|
||||
onBlur={e => setFieldData(e, 'width')}
|
||||
placeholder="请输入幅宽（cm）"
|
||||
placeholderStyle="font-size: 26rpx"
|
||||
/>
|
||||
</View>
|
||||
</View>
|
||||
<View className={styles.verify_btn} onClick={() => onVerify()}>
|
||||
确认
|
||||
</View>
|
||||
<View className={styles.popup_filter_item}>
|
||||
<View className={styles.title}>克重要求</View>
|
||||
<View className={styles.btn_list_input}>
|
||||
<View className={styles.btn_width}>
|
||||
<Input
|
||||
value={filterObj.weight_density}
|
||||
alwaysEmbed
|
||||
type="digit"
|
||||
cursorSpacing={150}
|
||||
onBlur={e => setFieldData(e, 'weight_density')}
|
||||
placeholder="请输入克重（g）"
|
||||
placeholderStyle="font-size: 26rpx"
|
||||
/>
|
||||
</View>
|
||||
</View>
|
||||
</View>
|
||||
<View className={styles.popup_filter_item}>
|
||||
<View className={styles.title}>成分要求</View>
|
||||
<View className={styles.btn_list_input}>
|
||||
<View className={styles.btn_width}>
|
||||
<Input
|
||||
value={filterObj.component}
|
||||
alwaysEmbed
|
||||
cursorSpacing={150}
|
||||
onBlur={e => setFieldData(e, 'component')}
|
||||
type="text"
|
||||
placeholder="请输入棉、涤纶等"
|
||||
placeholderStyle="font-size: 26rpx"
|
||||
/>
|
||||
</View>
|
||||
</View>
|
||||
</View>
|
||||
</View>
|
||||
<View className={styles.btns_con}>
|
||||
<NormalButton customClassName={styles.rest_btn} type="primary" plain round onClick={() => onRestEven()}>重置</NormalButton>
|
||||
<NormalButton customClassName={styles.verify_btn} type="primary" round onClick={() => onVerify()}>确认</NormalButton>
|
||||
</View>
|
||||
</View>
|
||||
</Popup>
|
||||
|
||||
</DropDownItem>
|
||||
)
|
||||
}
|
||||
export default memo(Filter)
|
||||
export default forwardRef(Filter)
|
||||
|
||||
@ -1,90 +1,99 @@
|
||||
import React, { useState, useEffect, FC } from "react";
|
||||
import { Block, View } from "@tarojs/components";
|
||||
import "./iconfont.scss";
|
||||
import Taro from "@tarojs/taro";
|
||||
import classnames from "classnames";
|
||||
|
||||
const SystemWidth = Taro.getSystemInfoSync().windowWidth
|
||||
const quot = '"'
|
||||
|
||||
function hex2rgb(hex) {
|
||||
const rgb: number[] = [];
|
||||
|
||||
hex = hex.substr(1);
|
||||
|
||||
if (hex.length === 3) {
|
||||
hex = hex.replace(/(.)/g, "$1$1");
|
||||
}
|
||||
|
||||
hex.replace(/../g, function(color: string) {
|
||||
rgb.push(parseInt(color, 0x10));
|
||||
return color;
|
||||
});
|
||||
|
||||
return "rgb(" + rgb.join(",") + ")";
|
||||
}
|
||||
|
||||
export type IconNames = 'icon-weixinyijiandenglu' | 'icon-nanzhuang' | 'icon-zhuanyefenlei' | 'icon-tongzhuang' | 'icon-chaoliumianliao' | 'icon-nvzhuang' | 'icon-dingwei' | 'icon-xuanzhongyanse' | 'icon-sekajianyanglingqu' | 'icon-lingseka' | 'icon-lingjianyang' | 'icon-gerenzhongxin-dianji' | 'icon-shouye-dianji' | 'icon-gouwuche-weidianji' | 'icon-gerenzhongxin-weidianji' | 'icon-gouwuche-dianji' | 'icon-shouye-weidianji' | 'icon-paixu1' | 'icon-zhankai' | 'icon-shouqi' | 'icon-tips' | 'icon-dianhua' | 'icon-paixu' | 'icon-shaixuan' | 'icon-bodakehujingli' | 'icon-guanfangweixinkefu' | 'icon-tuijianbiaoqian' | 'icon-rukou' | 'icon-renzhengchenggong' | 'icon-wodekefu' | 'icon-yanseduibi' | 'icon-dizhiguanli' | 'icon-weixin' | 'icon-riqi' | 'icon-shuru' | 'icon-a-0tianzhangqi' | 'icon-huodaofukuan' | 'icon-huozhuziti' | 'icon-saomazhifu' | 'icon-xianxiahuikuan' | 'icon-yufukuan' | 'icon-xinzengshoucangjia' | 'icon-qingchusousuo' | 'icon-xuanzechenggong' | 'icon-gongnengtubiao-saomiao' | 'icon-bianjizidingyimadan' | 'icon-zidingyimadanyulan' | 'icon-yuanshimadanyulan' | 'icon-xiala' | 'icon-shangla' | 'icon-qingchuxinxi' | 'icon-sousuo' | 'icon-guanli' | 'icon-bianji' | 'icon-shoucangjia' | 'icon-shezhi' | 'icon-tishi' | 'icon-erweima' | 'icon-dianjishoucang' | 'icon-gouwuche' | 'icon-shoucangchenggong' | 'icon-fenxiangshangpin' | 'icon-kefu' | 'icon-xinzenganniu' | 'icon-jianshaoanniu' | 'icon-daifahuo2' | 'icon-daishouhuo2' | 'icon-tuikuan-shouhou' | 'icon-daipeibu2' | 'icon-daifukuan2';
|
||||
|
||||
type PropsType = {
|
||||
name: IconNames;
|
||||
size?: number;
|
||||
color?: string | string[];
|
||||
customStyle?: React.CSSProperties;
|
||||
customClassName?: string;
|
||||
};
|
||||
|
||||
const IconFont:FC<PropsType> = ({
|
||||
name,
|
||||
size = 36,
|
||||
color,
|
||||
customStyle = {},
|
||||
customClassName = ""
|
||||
}) => {
|
||||
const [colors, setColors] = useState<PropsType['color']>()
|
||||
const [isStr, setIsStr] = useState(true)
|
||||
const [svgSize, setSvgSize] = useState(() => (size / 750) * SystemWidth)
|
||||
|
||||
useEffect(() => {
|
||||
setIsStr(typeof color === 'string')
|
||||
if (typeof color === 'string') {
|
||||
setColors(color.indexOf('#') === 0 ? hex2rgb(color) : color)
|
||||
} else {
|
||||
setColors(
|
||||
color?.map(function (item) {
|
||||
return item.indexOf('#') === 0 ? hex2rgb(item) : item
|
||||
})
|
||||
)
|
||||
}
|
||||
return () => {}
|
||||
}, [color])
|
||||
|
||||
useEffect(() => {
|
||||
setSvgSize((size / 750) * SystemWidth)
|
||||
}, [size])
|
||||
|
||||
// 也可以使用 if (name === 'xxx') { return <view> } 来渲染，但是测试发现在ios下会有问题，报错 Maximum call stack啥的。下面这个写法没问题
|
||||
return (
|
||||
<Block>
|
||||
{/* icon-colorCard 本地svg */ }
|
||||
{/* { name === 'icon-colorCard' && (<View style={{backgroundImage: `url(${quot}data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' width='${svgSize}px' height='${svgSize}px' viewBox='0 0 72 72'><defs><linearGradient id='a' x1='56.049%' x2='45.965%' y1='85.384%' y2='36.243%'><stop offset='0%' stop-color='${(isStr ? colors : colors?.[0]) || '%233667EF'}' stop-opacity='.572'/><stop offset='100%' stop-color='${(isStr ? colors : colors?.[1]) || '%233591FD'}' stop-opacity='.551'/></linearGradient><linearGradient id='b' x1='100%' x2='16.645%' y1='85.384%' y2='36.243%'><stop offset='0%' stop-color='${(isStr ? colors : colors?.[2]) || '%233667EF'}' stop-opacity='.572'/><stop offset='100%' stop-color='${(isStr ? colors : colors?.[3]) || '%233591FD'}' stop-opacity='.551'/></linearGradient><linearGradient id='c' x1='18.906%' x2='80.404%' y1='44.444%' y2='55.556%'><stop offset='0%' stop-color='${(isStr ? colors : colors?.[4]) || '%233591FD'}'/><stop offset='100%' stop-color='${(isStr ? colors : colors?.[5]) || '%233667EF'}'/></linearGradient></defs><g fill='none' fill-rule='nonzero'><path fill='url(%23a)' d='M24.75 11.25A2.25 2.25 0 0 1 27 13.5v47.25A2.25 2.25 0 0 1 24.75 63h-13.5A2.25 2.25 0 0 1 9 60.75V13.5a2.25 2.25 0 0 1 2.25-2.25h13.5ZM18 50.625a3.375 3.375 0 1 0 0 6.75 3.375 3.375 0 0 0 0-6.75Z'/><path fill='url(%23b)' d='m45.593 16.216 9.546 9.546a2.25 2.25 0 0 1 0 3.182l-31.82 31.82a2.25 2.25 0 0 1-3.182 0L16.273 56.9a3.375 3.375 0 1 0-1.174-1.174l-4.508-4.508a2.25 2.25 0 0 1 0-3.182l31.82-31.82a2.25 2.25 0 0 1 3.182 0Z'/><path fill='url(%23c)' d='M60.75 45A2.25 2.25 0 0 1 63 47.25v13.5A2.25 2.25 0 0 1 60.75 63h-49.5A2.25 2.25 0 0 1 9 60.75v-13.5A2.25 2.25 0 0 1 11.25 45h49.5ZM18 50.625a3.375 3.375 0 1 0 0 6.75 3.375 3.375 0 0 0 0-6.75Z' opacity='.95'/></g></svg%3E${quot})`, width: `${svgSize}px`, height: `${svgSize}px`, ...customStyle}} className={classnames("icon", customClassName)} />) } */}
|
||||
{/* icon-alipay */}
|
||||
{/* {name === "icon-alipay" && (
|
||||
<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='M192 692.736c0-69.632 51.2-106.496 88.064-111.104 111.104-18.432 264.192 74.24 264.192 74.24-69.632 88.064-166.912 134.144-241.152 134.144-65.024-4.608-111.104-41.472-111.104-97.28z' fill='${(isStr
|
||||
? colors
|
||||
: colors[0]) ||
|
||||
"rgb(91,139,212)"}' /%3E%3Cpath d='M979.456 729.6c-13.824-4.608-329.216-101.888-319.488-111.104 46.592-55.808 78.848-185.344 78.848-185.344v-27.648h-185.344V335.872h226.816v-41.472h-226.816V192.512H460.8v97.28H257.024v41.472H460.8v69.632H298.496v27.648h333.824c0 13.824-23.04 106.496-46.08 148.48-4.608-9.216-153.088-60.416-236.544-65.024-88.064 4.608-157.696 32.256-189.952 97.28-46.592 120.32 27.648 241.152 194.56 241.152 27.648 0 162.304-13.824 264.192-153.088 27.648 13.824 185.344 92.672 282.624 143.872-92.672 111.104-231.936 180.736-389.12 180.736-280.576 1.024-508.928-226.304-509.44-506.88v-3.072C1.024 231.424 227.84 3.072 508.928 2.56h3.072c280.576-1.024 508.928 226.304 509.44 506.88v3.072c4.608 82.944-13.824 152.576-41.984 217.088z' fill='${(isStr
|
||||
? colors
|
||||
: colors[1]) ||
|
||||
"rgb(91,139,212)"}' /%3E%3C/svg%3E${quot})`, width: `${svgSize}px`, height: `${svgSize}px`,
|
||||
...customStyle
|
||||
}}
|
||||
className={classnames(icon, customClassName)}
|
||||
/>
|
||||
)} */}
|
||||
{/* icon-weixinyijiandenglu */}
|
||||
import React, { useState, useEffect, FC } from "react";
|
||||
import { Block, View } from "@tarojs/components";
|
||||
import "./iconfont.scss";
|
||||
import Taro from "@tarojs/taro";
|
||||
import classnames from "classnames";
|
||||
|
||||
const SystemWidth = Taro.getSystemInfoSync().windowWidth
|
||||
const quot = '"'
|
||||
|
||||
function hex2rgb(hex) {
|
||||
const rgb: number[] = [];
|
||||
|
||||
hex = hex.substr(1);
|
||||
|
||||
if (hex.length === 3) {
|
||||
hex = hex.replace(/(.)/g, "$1$1");
|
||||
}
|
||||
|
||||
hex.replace(/../g, function(color: string) {
|
||||
rgb.push(parseInt(color, 0x10));
|
||||
return color;
|
||||
});
|
||||
|
||||
return "rgb(" + rgb.join(",") + ")";
|
||||
}
|
||||
|
||||
export type IconNames = 'icon-zhankai1' | 'icon-shouqi1' | 'icon-shoucang1' | 'icon-weixinyijiandenglu' | 'icon-nanzhuang' | 'icon-zhuanyefenlei' | 'icon-tongzhuang' | 'icon-chaoliumianliao' | 'icon-nvzhuang' | 'icon-dingwei' | 'icon-xuanzhongyanse' | 'icon-sekajianyanglingqu' | 'icon-lingseka' | 'icon-lingjianyang' | 'icon-gerenzhongxin-dianji' | 'icon-shouye-dianji' | 'icon-gouwuche-weidianji' | 'icon-gerenzhongxin-weidianji' | 'icon-gouwuche-dianji' | 'icon-shouye-weidianji' | 'icon-paixu1' | 'icon-zhankai' | 'icon-shouqi' | 'icon-tips' | 'icon-dianhua' | 'icon-paixu' | 'icon-shaixuan' | 'icon-bodakehujingli' | 'icon-guanfangweixinkefu' | 'icon-tuijianbiaoqian' | 'icon-rukou' | 'icon-renzhengchenggong' | 'icon-wodekefu' | 'icon-yanseduibi' | 'icon-dizhiguanli' | 'icon-weixin' | 'icon-riqi' | 'icon-shuru' | 'icon-a-0tianzhangqi' | 'icon-huodaofukuan' | 'icon-huozhuziti' | 'icon-saomazhifu' | 'icon-xianxiahuikuan' | 'icon-yufukuan' | 'icon-xinzengshoucangjia' | 'icon-qingchusousuo' | 'icon-xuanzechenggong' | 'icon-gongnengtubiao-saomiao' | 'icon-bianjizidingyimadan' | 'icon-zidingyimadanyulan' | 'icon-yuanshimadanyulan' | 'icon-xiala' | 'icon-shangla' | 'icon-qingchuxinxi' | 'icon-sousuo' | 'icon-guanli' | 'icon-bianji' | 'icon-shoucangjia' | 'icon-shezhi' | 'icon-tishi' | 'icon-erweima' | 'icon-dianjishoucang' | 'icon-gouwuche' | 'icon-shoucangchenggong' | 'icon-fenxiangshangpin' | 'icon-kefu' | 'icon-xinzenganniu' | 'icon-jianshaoanniu' | 'icon-daifahuo2' | 'icon-daishouhuo2' | 'icon-tuikuan-shouhou' | 'icon-daipeibu2' | 'icon-daifukuan2';
|
||||
|
||||
type PropsType = {
|
||||
name: IconNames;
|
||||
size?: number;
|
||||
color?: string | string[];
|
||||
customStyle?: React.CSSProperties;
|
||||
customClassName?: string;
|
||||
};
|
||||
|
||||
const IconFont:FC<PropsType> = ({
|
||||
name,
|
||||
size = 36,
|
||||
color,
|
||||
customStyle = {},
|
||||
customClassName = ""
|
||||
}) => {
|
||||
const [colors, setColors] = useState<PropsType['color']>()
|
||||
const [isStr, setIsStr] = useState(true)
|
||||
const [svgSize, setSvgSize] = useState(() => (size / 750) * SystemWidth)
|
||||
|
||||
useEffect(() => {
|
||||
setIsStr(typeof color === 'string')
|
||||
if (typeof color === 'string') {
|
||||
setColors(color.indexOf('#') === 0 ? hex2rgb(color) : color)
|
||||
} else {
|
||||
setColors(
|
||||
color?.map(function (item) {
|
||||
return item.indexOf('#') === 0 ? hex2rgb(item) : item
|
||||
})
|
||||
)
|
||||
}
|
||||
return () => {}
|
||||
}, [color])
|
||||
|
||||
useEffect(() => {
|
||||
setSvgSize((size / 750) * SystemWidth)
|
||||
}, [size])
|
||||
|
||||
// 也可以使用 if (name === 'xxx') { return <view> } 来渲染，但是测试发现在ios下会有问题，报错 Maximum call stack啥的。下面这个写法没问题
|
||||
return (
|
||||
<Block>
|
||||
{/* icon-colorCard 本地svg */ }
|
||||
{/* { name === 'icon-colorCard' && (<View style={{backgroundImage: `url(${quot}data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' width='${svgSize}px' height='${svgSize}px' viewBox='0 0 72 72'><defs><linearGradient id='a' x1='56.049%' x2='45.965%' y1='85.384%' y2='36.243%'><stop offset='0%' stop-color='${(isStr ? colors : colors?.[0]) || '%233667EF'}' stop-opacity='.572'/><stop offset='100%' stop-color='${(isStr ? colors : colors?.[1]) || '%233591FD'}' stop-opacity='.551'/></linearGradient><linearGradient id='b' x1='100%' x2='16.645%' y1='85.384%' y2='36.243%'><stop offset='0%' stop-color='${(isStr ? colors : colors?.[2]) || '%233667EF'}' stop-opacity='.572'/><stop offset='100%' stop-color='${(isStr ? colors : colors?.[3]) || '%233591FD'}' stop-opacity='.551'/></linearGradient><linearGradient id='c' x1='18.906%' x2='80.404%' y1='44.444%' y2='55.556%'><stop offset='0%' stop-color='${(isStr ? colors : colors?.[4]) || '%233591FD'}'/><stop offset='100%' stop-color='${(isStr ? colors : colors?.[5]) || '%233667EF'}'/></linearGradient></defs><g fill='none' fill-rule='nonzero'><path fill='url(%23a)' d='M24.75 11.25A2.25 2.25 0 0 1 27 13.5v47.25A2.25 2.25 0 0 1 24.75 63h-13.5A2.25 2.25 0 0 1 9 60.75V13.5a2.25 2.25 0 0 1 2.25-2.25h13.5ZM18 50.625a3.375 3.375 0 1 0 0 6.75 3.375 3.375 0 0 0 0-6.75Z'/><path fill='url(%23b)' d='m45.593 16.216 9.546 9.546a2.25 2.25 0 0 1 0 3.182l-31.82 31.82a2.25 2.25 0 0 1-3.182 0L16.273 56.9a3.375 3.375 0 1 0-1.174-1.174l-4.508-4.508a2.25 2.25 0 0 1 0-3.182l31.82-31.82a2.25 2.25 0 0 1 3.182 0Z'/><path fill='url(%23c)' d='M60.75 45A2.25 2.25 0 0 1 63 47.25v13.5A2.25 2.25 0 0 1 60.75 63h-49.5A2.25 2.25 0 0 1 9 60.75v-13.5A2.25 2.25 0 0 1 11.25 45h49.5ZM18 50.625a3.375 3.375 0 1 0 0 6.75 3.375 3.375 0 0 0 0-6.75Z' opacity='.95'/></g></svg%3E${quot})`, width: `${svgSize}px`, height: `${svgSize}px`, ...customStyle}} className={classnames("icon", customClassName)} />) } */}
|
||||
{/* icon-alipay */}
|
||||
{/* {name === "icon-alipay" && (
|
||||
<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='M192 692.736c0-69.632 51.2-106.496 88.064-111.104 111.104-18.432 264.192 74.24 264.192 74.24-69.632 88.064-166.912 134.144-241.152 134.144-65.024-4.608-111.104-41.472-111.104-97.28z' fill='${(isStr
|
||||
? colors
|
||||
: colors[0]) ||
|
||||
"rgb(91,139,212)"}' /%3E%3Cpath d='M979.456 729.6c-13.824-4.608-329.216-101.888-319.488-111.104 46.592-55.808 78.848-185.344 78.848-185.344v-27.648h-185.344V335.872h226.816v-41.472h-226.816V192.512H460.8v97.28H257.024v41.472H460.8v69.632H298.496v27.648h333.824c0 13.824-23.04 106.496-46.08 148.48-4.608-9.216-153.088-60.416-236.544-65.024-88.064 4.608-157.696 32.256-189.952 97.28-46.592 120.32 27.648 241.152 194.56 241.152 27.648 0 162.304-13.824 264.192-153.088 27.648 13.824 185.344 92.672 282.624 143.872-92.672 111.104-231.936 180.736-389.12 180.736-280.576 1.024-508.928-226.304-509.44-506.88v-3.072C1.024 231.424 227.84 3.072 508.928 2.56h3.072c280.576-1.024 508.928 226.304 509.44 506.88v3.072c4.608 82.944-13.824 152.576-41.984 217.088z' fill='${(isStr
|
||||
? colors
|
||||
: colors[1]) ||
|
||||
"rgb(91,139,212)"}' /%3E%3C/svg%3E${quot})`, width: `${svgSize}px`, height: `${svgSize}px`,
|
||||
...customStyle
|
||||
}}
|
||||
className={classnames(icon, customClassName)}
|
||||
/>
|
||||
)} */}
|
||||
{/* 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-shoucang1 */}
|
||||
|
||||
{ name === 'icon-shoucang1' && (<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='M440.170667 119.616c18.922667-38.016 65.344-53.632 103.68-34.88 15.274667 7.466667 27.626667 19.733333 35.157333 34.88l93.397333 187.690667c3.754667 7.552 11.008 12.8 19.413334 13.994666l208.832 30.101334c42.304 6.101333 71.616 45.077333 65.472 87.04a76.586667 76.586667 0 0 1-22.570667 43.946666l-34.325333 33.152-235.541334 213.482667-91.093333-88.042667a51.413333 51.413333 0 0 0-70.954667 0 47.36 47.36 0 0 0 0 68.586667l125.44 121.258667a51.413333 51.413333 0 0 0 69.781334 1.088l94.592-85.738667 19.242666 111.253333c6.997333 40.448-19.285333 78.933333-59.178666 87.850667l-4.032 0.789333a77.973333 77.973333 0 0 1-49.109334-7.701333L521.6 840.96a25.984 25.984 0 0 0-24.021333 0l-186.752 97.408c-37.845333 19.733333-84.650667 5.290667-104.533334-32.234667-7.936-14.933333-10.666667-32.064-7.808-48.704l35.690667-206.293333a25.472 25.472 0 0 0-7.424-22.656l-151.104-146.090667a76.352 76.352 0 0 1-1.408-108.586666 77.653333 77.653333 0 0 1 44.309333-22.4l208.810667-30.08c8.405333-1.216 15.68-6.464 19.413333-14.016l93.397334-187.690667z' fill='${(isStr ? colors : colors?.[0]) || 'rgb(247,195,88)'}'/%3E%3Cpath d='M393.386667 96.341333l-87.189334 175.210667-195.114666 28.117333a129.92 129.92 0 0 0-74.112 37.504l-3.754667 3.968a128.618667 128.618667 0 0 0 6.101333 178.816l140.928 136.256-33.258666 192.298667a128.512 128.512 0 0 0 13.098666 82.090667l2.410667 4.330666c34.602667 59.733333 110.698667 82.005333 172.48 49.770667l174.613333-91.072 174.613334 91.093333a130.24 130.24 0 0 0 82.048 12.885334l5.354666-1.045334c68.458667-15.317333 112.32-80.170667 100.586667-148.053333L837.973333 650.666667l106.368-96.384 35.541334-34.304a128.853333 128.853333 0 0 0 37.973333-73.941334l0.618667-4.821333c7.466667-68.8-41.130667-131.541333-110.357334-141.525333l-195.114666-28.117334-87.168-175.210666a129.365333 129.365333 0 0 0-58.986667-58.538667c-64.085333-31.36-141.696-5.269333-173.44 58.538667z m150.464-11.605333c15.274667 7.466667 27.626667 19.733333 35.157333 34.88l93.397333 187.690667c3.754667 7.552 11.008 12.8 19.413334 13.994666l208.832 30.101334c42.304 6.101333 71.616 45.077333 65.472 87.04a76.586667 76.586667 0 0 1-22.570667 43.946666l-34.325333 33.152-235.541334 213.482667-91.093333-88.042667a51.413333 51.413333 0 0 0-70.954667 0 47.36 47.36 0 0 0 0 68.586667l125.44 121.258667a51.413333 51.413333 0 0 0 69.781334 1.088l94.592-85.738667 19.242666 111.253333c6.997333 40.448-19.285333 78.933333-59.178666 87.850667l-4.032 0.789333a77.973333 77.973333 0 0 1-49.109334-7.701333L521.6 840.96a25.984 25.984 0 0 0-24.021333 0l-186.752 97.408c-37.845333 19.733333-84.650667 5.290667-104.533334-32.234667-7.936-14.933333-10.666667-32.064-7.808-48.704l35.690667-206.293333a25.472 25.472 0 0 0-7.424-22.656l-151.104-146.090667a76.352 76.352 0 0 1-1.408-108.586666 77.653333 77.653333 0 0 1 44.309333-22.4l208.810667-30.08c8.405333-1.216 15.68-6.464 19.413333-14.016l93.397334-187.690667c18.922667-38.016 65.344-53.632 103.68-34.88z' fill='${(isStr ? colors : colors?.[1]) || 'rgb(255,255,255)'}' fill-opacity='.802'/%3E%3C/svg%3E${quot})`, width: `${svgSize}px`, height: `${svgSize}px`, ...customStyle}} className={classnames("icon", customClassName)} />) }
|
||||
{/* icon-weixinyijiandenglu */}
|
||||
|
||||
{ name === 'icon-weixinyijiandenglu' && (<View style={{backgroundImage: `url(${quot}data:image/svg+xml, %3Csvg viewBox='0 0 1144 1024' xmlns='http://www.w3.org/2000/svg' width='${svgSize}px' height='${svgSize}px'%3E%3Cpath d='M774.656 309.76c13.161412 0 26.112 1.084235 39.152941 2.650353C778.721882 133.150118 604.250353 0 405.082353 0 182.392471 0 0 166.610824 0 378.337882c0 122.157176 60.656941 222.479059 162.093176 300.393412l-40.508235 133.782588 141.643294-77.914353c50.627765 10.902588 91.256471 22.226824 141.854118 22.226824 12.709647 0 25.298824-0.602353 37.767529-1.656471a363.941647 363.941647 0 0 1-12.528941-93.334588c0.060235-194.349176 152.003765-352.075294 344.335059-352.075294z m-217.750588-120.591059c30.629647 0 50.748235 22.076235 50.748235 55.536941 0 33.310118-20.118588 55.627294-50.718118 55.627294-30.268235 0-60.747294-22.317176-60.747294-55.627294 0-33.551059 30.418824-55.536941 60.747294-55.536941zM273.468235 300.272941c-30.418824 0-61.018353-22.287059-61.018353-55.597176 0-33.460706 30.599529-55.536941 61.018353-55.536941 30.388706 0 50.567529 21.985882 50.56753 55.536941 0 33.310118-20.178824 55.627294-50.597647 55.627294zM1144.470588 656.534588c0-177.844706-162.093176-322.800941-344.124235-322.800941-192.752941 0-344.485647 145.016471-344.485647 322.800941 0 178.326588 151.792941 322.800941 344.485647 322.800941 40.357647 0 81.016471-11.083294 121.524706-22.226823L1032.944941 1024l-30.448941-111.224471c81.317647-67.102118 141.974588-155.949176 141.974588-256.271058z m-455.860706-55.717647c-20.088471 0-40.478118-21.985882-40.478117-44.453647 0-22.136471 20.389647-44.453647 40.478117-44.453647 30.750118 0 50.718118 22.287059 50.718118 44.453647 0 22.467765-19.968 44.483765-50.718118 44.483765z m222.810353 0c-19.937882 0-40.267294-21.985882-40.267294-44.453647 0-22.136471 20.239059-44.453647 40.267294-44.453647 30.479059 0 50.718118 22.287059 50.718118 44.453647 0 22.467765-20.239059 44.483765-50.718118 44.483765z' fill='${(isStr ? colors : colors?.[0]) || 'rgb(255,255,255)'}'/%3E%3C/svg%3E${quot})`, width: `${svgSize}px`, height: `${svgSize}px`, ...customStyle}} className={classnames("icon", customClassName)} />) }
|
||||
{/* icon-nanzhuang */}
|
||||
@ -294,9 +303,9 @@ const IconFont:FC<PropsType> = ({
|
||||
{/* icon-daifukuan2 */}
|
||||
|
||||
{ name === 'icon-daifukuan2' && (<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='M848 368a32 32 0 0 1 32 32v448a32 32 0 0 1-32 32H176a32 32 0 0 1-32-32V400a32 32 0 0 1 32-32h672zM512 688H240a16 16 0 0 0-16 16v32a16 16 0 0 0 16 16h272a16 16 0 0 0 16-16v-32a16 16 0 0 0-16-16z' fill='${(isStr ? colors : colors?.[0]) || 'rgb(64,123,244)'}'/%3E%3Cpath d='M765.664 216.496L812 368H160.688l565.024-172.736a32 32 0 0 1 39.952 21.248z' fill='${(isStr ? colors : colors?.[1]) || 'rgb(142,186,251)'}'/%3E%3C/svg%3E${quot})`, width: `${svgSize}px`, height: `${svgSize}px`, ...customStyle}} className={classnames("icon", customClassName)} />) }
|
||||
|
||||
</Block>
|
||||
)
|
||||
}
|
||||
|
||||
export default IconFont
|
||||
|
||||
</Block>
|
||||
)
|
||||
}
|
||||
|
||||
export default IconFont
|
||||
|
||||
@ -1,4 +1,25 @@
|
||||
$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;
|
||||
}
|
||||
&--hidden {
|
||||
background: transparent;
|
||||
}
|
||||
}
|
||||
|
||||
.drawer_main {
|
||||
.drawer {
|
||||
position: fixed;
|
||||
@ -9,51 +30,37 @@ $am-ms: 200ms;
|
||||
justify-content: center;
|
||||
flex-direction: column;
|
||||
width: 100%;
|
||||
height: 100vh;
|
||||
height: 100%;
|
||||
margin: 0 auto;
|
||||
z-index: 1000;
|
||||
z-index: 10000;
|
||||
visibility: hidden;
|
||||
transition: visibility $am-ms ease-in-out;
|
||||
.drawer_mask {
|
||||
overflow: hidden;
|
||||
.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: 10001;
|
||||
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;
|
||||
z-index: 1000;
|
||||
}
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
height: 80px;
|
||||
font-size: 29px;
|
||||
font-weight: bold;
|
||||
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 {
|
||||
@ -64,26 +71,35 @@ $am-ms: 200ms;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
min-height: 200px;
|
||||
width: 100vw;
|
||||
width: 100%;
|
||||
border-radius: 20px 20px 0px 0px;
|
||||
transform: translate3d(0, 100%, 0);
|
||||
&-withShadow {
|
||||
box-shadow: 0 -2px 11px -3px #333;
|
||||
}
|
||||
}
|
||||
|
||||
.drawer_container_top {
|
||||
top: 0;
|
||||
left: 0;
|
||||
min-height: 200px;
|
||||
width: 100vw;
|
||||
width: 100%;
|
||||
border-radius: 0 0 20px 20px;
|
||||
transform: translate3d(0, -100%, 0);
|
||||
&-withShadow {
|
||||
box-shadow: 0 2px 5px -3px #333;
|
||||
}
|
||||
}
|
||||
|
||||
.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);
|
||||
&-withShadow {
|
||||
box-shadow: -2 0px 11px -3px #333;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -1,37 +1,51 @@
|
||||
import { View } from '@tarojs/components'
|
||||
import { RootPortal, View } from '@tarojs/components'
|
||||
import Taro from '@tarojs/taro'
|
||||
import classnames from 'classnames'
|
||||
import type { ReactNode } from 'react'
|
||||
import { memo, useEffect, useMemo, useRef } from 'react'
|
||||
import { memo, useEffect, useMemo, useRef, useState } from 'react'
|
||||
import style from './index.module.scss'
|
||||
import CloseBtnIcon from '@/components/closeBtn'
|
||||
|
||||
export interface Params {
|
||||
export interface PopupEvent {
|
||||
onClose?: () => void // 关闭事件
|
||||
animationEnd?: () => void // 弹出动画结束
|
||||
}
|
||||
|
||||
export interface Params extends PopupEvent {
|
||||
title?: string // 标题
|
||||
show?: boolean // 显示显示弹窗
|
||||
showTitle?: boolean // 是否显示标题
|
||||
onClose?: () => void // 关闭事件
|
||||
isFixed?: boolean // 二次弹窗触发
|
||||
children?: ReactNode // 插槽内容
|
||||
// IconButton?: ReactNode, //
|
||||
showIconButton?: boolean // 是否显示关闭按钮
|
||||
position?: 'bottom'|'top'|'right' // 弹出位置
|
||||
animationEnd?: () => void // 弹出动画结束
|
||||
position?: 'bottom' | 'top' | 'right' // 弹出位置
|
||||
customStyle?: React.CSSProperties
|
||||
overlayStyle?: React.CSSProperties
|
||||
safeAreaInsetBottom?: boolean // 是否为iphoneX提供小黑条适配
|
||||
showOverLay?: boolean // 是否显示遮罩层
|
||||
}
|
||||
const Popup = (
|
||||
{
|
||||
title = '标题',
|
||||
show = false,
|
||||
showTitle = true,
|
||||
onClose,
|
||||
showIconButton = false,
|
||||
children,
|
||||
position = 'bottom',
|
||||
animationEnd,
|
||||
}: Params) => {
|
||||
const Popup = ({
|
||||
title = '标题',
|
||||
show = false,
|
||||
showTitle = true,
|
||||
onClose,
|
||||
isFixed = false,
|
||||
showIconButton = false,
|
||||
children,
|
||||
position = 'bottom',
|
||||
animationEnd,
|
||||
customStyle = {},
|
||||
safeAreaInsetBottom = true,
|
||||
showOverLay = true,
|
||||
overlayStyle,
|
||||
}: Params) => {
|
||||
const animationTime = useRef<any>(null)
|
||||
useEffect(() => {
|
||||
if (show) {
|
||||
animationTime.current = setTimeout(() => {
|
||||
animationEnd?.()
|
||||
customStyle.overflow = 'unset'
|
||||
}, 260)
|
||||
}
|
||||
else {
|
||||
@ -46,31 +60,38 @@ const Popup = (
|
||||
}, [])
|
||||
|
||||
return (
|
||||
<>
|
||||
<View className={style.drawer_main}>
|
||||
<View catchMove className={`${style.drawer} ${show ? style.drawer_active : ''}`}>
|
||||
<View
|
||||
className={classnames(style.drawer_mask, { [style.drawer_mask_active]: show })}
|
||||
onClick={() => onClose?.()}
|
||||
>
|
||||
<View
|
||||
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}>
|
||||
{show && children}
|
||||
</View>
|
||||
<View className="common_safe_area_y"></View>
|
||||
<View className={style.drawer_main}>
|
||||
<View catchMove className={classnames(style.drawer, show ? style.drawer_active : '')} style={customStyle}>
|
||||
{/* 遮罩层 start */}
|
||||
<View
|
||||
className={classnames(style.drawer_mask, { [style.drawer_mask_active]: show, [style['drawer_mask--hidden']]: !showOverLay })}
|
||||
onClick={onClose}
|
||||
style={overlayStyle}
|
||||
></View>
|
||||
{/* 遮罩层 end */}
|
||||
<View
|
||||
style={{ position: `${isFixed == true ? 'fixed' : 'absolute'}` }}
|
||||
className={classnames(style.drawer_container, style[`drawer_container_${position}`], {
|
||||
[style.drawer_container_active]: show,
|
||||
[style[`drawer_container_${position}-withShadow`]]: !showOverLay,
|
||||
})}
|
||||
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>
|
||||
)
|
||||
}
|
||||
|
||||
export default memo(Popup)
|
||||
|
||||
@ -3,27 +3,27 @@
|
||||
box-sizing: border-box;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.products_item {
|
||||
width: 100%;
|
||||
background-color: #fff;
|
||||
border-radius: 20px;
|
||||
padding: 10px;
|
||||
box-sizing: border-box;
|
||||
border-radius: 16px;
|
||||
display: flex;
|
||||
// height: 160px;
|
||||
box-sizing: border-box;
|
||||
justify-content: space-between;
|
||||
overflow: hidden;
|
||||
box-shadow: 0px 0px 36px -7px rgba(0, 0, 0, 0.08);
|
||||
&:nth-child(n + 2) {
|
||||
margin-top: 16px;
|
||||
}
|
||||
.item_img {
|
||||
width: 160px;
|
||||
height: 160px;
|
||||
width: 188px;
|
||||
height: 188px;
|
||||
position: relative;
|
||||
image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 10px;
|
||||
border-radius: 0;
|
||||
}
|
||||
.num {
|
||||
padding: 5px 10px 5px 20px;
|
||||
@ -32,13 +32,22 @@
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
background: rgba($color: #000, $alpha: 0.3);
|
||||
border-radius: 36px 0px 20px 0px;
|
||||
border-radius: 36px 0px 0px 0px;
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
}
|
||||
.collection_icon {
|
||||
position: absolute;
|
||||
left: 12px;
|
||||
top: 13px;
|
||||
filter: drop-shadow(0 0 10px -1px white);
|
||||
}
|
||||
}
|
||||
.item_con {
|
||||
padding-left: 20px;
|
||||
display: flex;
|
||||
flex-flow: column nowrap;
|
||||
justify-content: space-between;
|
||||
padding: 16px 20px;
|
||||
font-size: $font_size;
|
||||
flex: 1;
|
||||
.title {
|
||||
@ -52,7 +61,6 @@
|
||||
}
|
||||
.tag_list {
|
||||
display: flex;
|
||||
margin-top: 16px;
|
||||
flex-wrap: wrap;
|
||||
.tag,
|
||||
.tag_g {
|
||||
@ -78,8 +86,12 @@
|
||||
.des {
|
||||
font-size: $font_size_medium;
|
||||
color: #707070;
|
||||
margin-top: 16px;
|
||||
@include common_ellipsis($params: 2);
|
||||
@include common_ellipsis;
|
||||
}
|
||||
.bottom{
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
.header_con {
|
||||
display: flex;
|
||||
@ -87,8 +99,6 @@
|
||||
align-items: center;
|
||||
}
|
||||
.header_label {
|
||||
width: 212px;
|
||||
height: 40px;
|
||||
background: #fcf4e9;
|
||||
border-radius: 5px;
|
||||
font-size: 24px;
|
||||
@ -99,19 +109,24 @@
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
&:nth-child(1) {
|
||||
width: 80px;
|
||||
height: 40px;
|
||||
background: #fee5cd;
|
||||
border-radius: 5px 0px 0px 5px;
|
||||
color: #522b0fff;
|
||||
}
|
||||
&:nth-child(2) {
|
||||
flex: 1;
|
||||
background: #fcf4e9ff;
|
||||
border-radius: 0px 5px 5px 0px;
|
||||
color: #c57c26ff;
|
||||
}
|
||||
flex: 1;
|
||||
background: #fcf4e9ff;
|
||||
border-radius: 0px 5px 5px 0px;
|
||||
color: #c57c26ff;
|
||||
}
|
||||
}
|
||||
.price{
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
color: $color_money;
|
||||
align-items: baseline;
|
||||
margin-top: 8px;
|
||||
font-weight: 550;
|
||||
&_unit {
|
||||
font-size: 18px;
|
||||
}
|
||||
&_num {
|
||||
font-size: $font_size_medium;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -27,25 +27,35 @@ const Product = ({ desStatus = true, productList = [] }: Params) => {
|
||||
<View className={styles.item_img}>
|
||||
<LabAndImg value={labAndImgObj(item)} />
|
||||
<View className={styles.num}>{item.product_color_count}色</View>
|
||||
{item.is_favorite && <IconFont customClassName={styles.collection_icon} name="icon-shoucang1" size={40} />}
|
||||
</View>
|
||||
<View className={styles.item_con}>
|
||||
<View className={styles.title}>
|
||||
<text>{formatHashTag(item.code, '')} </text>
|
||||
<Text>{formatHashTag(item.code, '')} </Text>
|
||||
{item.name}
|
||||
</View>
|
||||
<View className={styles.tag_list}>
|
||||
<View className={styles.tag}>{item.width}</View>
|
||||
<View className={styles.tag_g}>{item.weight_density}</View>
|
||||
</View>
|
||||
<View className={styles.header_con}>
|
||||
<View>
|
||||
{!!item.product_screw_id
|
||||
&& <View className={styles.header_label}>
|
||||
<Text>推荐</Text>
|
||||
<Text>配套螺纹</Text>
|
||||
</View>}
|
||||
<View className={styles.des}>
|
||||
染色；67.19%棉 28%涤纶 染色；67.19%棉 28%涤纶
|
||||
</View>
|
||||
<View className={styles.bottom}>
|
||||
<View className={styles.header_con}>
|
||||
<View>
|
||||
{
|
||||
!!item.product_screw_id
|
||||
&& <View className={styles.header_label}>
|
||||
<Text>配套螺纹</Text>
|
||||
</View>
|
||||
}
|
||||
</View>
|
||||
</View>
|
||||
<View className={styles.price}>
|
||||
<View className={styles.price_unit}>¥</View>
|
||||
<View className={styles.price_num}>50.00起</View>
|
||||
</View>
|
||||
{item.is_favorite && <IconFont name="icon-shoucangchenggong" size={50} />}
|
||||
</View>
|
||||
</View>
|
||||
</View>
|
||||
|
||||
@ -7,13 +7,13 @@ import { debounce } from '@/common/util'
|
||||
|
||||
interface Params {
|
||||
clickOnSearch?: (val: string) => void
|
||||
disabled?: false | true
|
||||
disabled?: boolean
|
||||
placeholder?: string
|
||||
changeOnSearch?: (any) => void
|
||||
showIcon?: false | true
|
||||
showIcon?: boolean
|
||||
placeIcon?: 'out' | 'inner'
|
||||
style?: Object
|
||||
showBtn?: false | true
|
||||
showBtn?: boolean
|
||||
btnStyle?: Object
|
||||
btnTitle?: string
|
||||
debounceTime?: number // 防抖时间，不设默认为零
|
||||
|
||||
@ -20,7 +20,6 @@ interface Params {
|
||||
refresherTriggered?: true | false
|
||||
selfOnRefresherRefresh?: () => void
|
||||
selfOnScrolltolower?: () => void
|
||||
hasMore?: true | false
|
||||
statusMore?: StatusParam
|
||||
selectClass?: (val: number) => void
|
||||
}
|
||||
@ -34,7 +33,6 @@ const SideBar = ({
|
||||
refresherTriggered = false,
|
||||
selfOnRefresherRefresh,
|
||||
selfOnScrolltolower,
|
||||
hasMore = true,
|
||||
statusMore = 0,
|
||||
selectClass,
|
||||
}: Params) => {
|
||||
@ -138,7 +136,6 @@ const SideBar = ({
|
||||
)}
|
||||
<InfiniteScroll
|
||||
statusMore={statusMore}
|
||||
hasMore={hasMore}
|
||||
selfonScrollToLower={() => selfOnScrolltolower?.()}
|
||||
refresherTriggered={refresherTriggered}
|
||||
refresherEnabled
|
||||
|
||||
@ -1,21 +1,30 @@
|
||||
import { View } from '@tarojs/components'
|
||||
import classnames from 'classnames'
|
||||
import type { Ref } from 'react'
|
||||
import { forwardRef, useEffect, useImperativeHandle, useState } from 'react'
|
||||
import styles from './index.module.scss'
|
||||
|
||||
export type SortParam = 'none' | 'top' | 'bottom'
|
||||
|
||||
interface params {
|
||||
status?: 'top'|'bottom'|'none'
|
||||
status?: SortParam
|
||||
onChange?: (val: { status: string; value: string }) => void
|
||||
sortValue?: { desc: string; asc: string } // 排序规则，后端制定
|
||||
sortValue?: { desc: string|number; asc: string|number } // 排序规则，后端制定 desc 降序 asc 升序
|
||||
}
|
||||
type sortParam = 'none'|'top'|'bottom'
|
||||
const SortBtn = ({ status = 'none', onChange, sortValue }: params, ref) => {
|
||||
const [sortStatus, setSortStatus] = useState<sortParam>()
|
||||
|
||||
export interface SortBtnRef {
|
||||
changeSort: () => { status: SortParam; value: string|number }
|
||||
}
|
||||
|
||||
const SortBtn = ({ status = 'none', onChange, sortValue }: params, ref: Ref<SortBtnRef>) => {
|
||||
const [sortStatus, setSortStatus] = useState<SortParam>()
|
||||
|
||||
useEffect(() => {
|
||||
setSortStatus(() => status)
|
||||
}, [status])
|
||||
const changeSort = (): { status: sortParam; value: string } => {
|
||||
let status: sortParam = 'none'
|
||||
|
||||
const changeSort = (): { status: SortParam; value: string|number } => {
|
||||
let status: SortParam = 'none'
|
||||
let value = ''
|
||||
if (sortStatus == 'none') {
|
||||
status = 'top'
|
||||
|
||||
101
src/components/tag/index.module.scss
Normal file
101
src/components/tag/index.module.scss
Normal file
@ -0,0 +1,101 @@
|
||||
.tag {
|
||||
display: inline-flex;
|
||||
flex-flow: row nowrap;
|
||||
padding: 0 20px;
|
||||
height: 60px;
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
box-sizing: border-box;
|
||||
&--text {
|
||||
@include common_ellipsis;
|
||||
}
|
||||
&--normal {
|
||||
font-size: $font_size_medium;
|
||||
height: 40px;
|
||||
}
|
||||
&--small {
|
||||
font-size: $font_size_min;
|
||||
height: 30px;
|
||||
}
|
||||
&--circle {
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
&--danger {
|
||||
border: 1px solid $color_danger;
|
||||
background-color: $color_danger;
|
||||
color: white;
|
||||
}
|
||||
&--primary {
|
||||
border: 1px solid $color_main;
|
||||
background-color: $color_main;
|
||||
color: white;
|
||||
}
|
||||
&--warning {
|
||||
border: 1px solid $color_warning;
|
||||
background-color: $color_warning;
|
||||
color: white;
|
||||
}
|
||||
// 大货
|
||||
&--bulk {
|
||||
border: 1px solid $color_bulk;
|
||||
background-color: $color_bulk;
|
||||
color: white;
|
||||
}
|
||||
// 剪板
|
||||
&--plate {
|
||||
border: 1px solid $color_plate;
|
||||
background-color: $color_plate;
|
||||
color: white;
|
||||
}
|
||||
// 散剪
|
||||
&--bulkCut {
|
||||
border: 1px solid $color_bulkCut;
|
||||
background-color: $color_bulkCut;
|
||||
color: white;
|
||||
}
|
||||
&--info {
|
||||
border: 1px solid $color_info;
|
||||
background-color: $color_info;
|
||||
color: white;
|
||||
}
|
||||
&--plain {
|
||||
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--bulk {
|
||||
border: 1px solid $color_bulk;
|
||||
color: $color_bulk;
|
||||
}
|
||||
&.tag--plate {
|
||||
border: 1px solid $color_plate;
|
||||
color: $color_plate;
|
||||
}
|
||||
&.tag--bulkCut {
|
||||
border: 1px solid $color_bulkCut;
|
||||
color: $color_bulkCut;
|
||||
}
|
||||
&.tag--info {
|
||||
border: 1px solid $color_info;
|
||||
color: $color_info;
|
||||
.tag--text {
|
||||
color: rgba($color: #333333, $alpha: 0.8) !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
&--disabled {
|
||||
opacity: $opacity-disabled;
|
||||
}
|
||||
}
|
||||
56
src/components/tag/index.tsx
Normal file
56
src/components/tag/index.tsx
Normal file
@ -0,0 +1,56 @@
|
||||
import { Text, View } from '@tarojs/components'
|
||||
import type { FC, ReactNode } from 'react'
|
||||
import classnames from 'classnames'
|
||||
import styles from './index.module.scss'
|
||||
|
||||
export type TagSize = 'small' | 'normal'
|
||||
type TagType = 'primary' | 'danger' | 'warning' | 'info' | 'bulk' | 'plate' | 'bulkCut'
|
||||
|
||||
interface PropsType {
|
||||
type?: TagType
|
||||
plain?: boolean
|
||||
disabled?: boolean
|
||||
size?: TagSize
|
||||
children?: ReactNode
|
||||
onClick?: Function
|
||||
circle?: boolean
|
||||
customStyle?: React.CSSProperties
|
||||
customClassName?: string
|
||||
}
|
||||
|
||||
const Tag: FC<PropsType> = (props) => {
|
||||
const {
|
||||
type = 'primary',
|
||||
size = 'normal',
|
||||
disabled = false,
|
||||
children,
|
||||
onClick,
|
||||
circle = false,
|
||||
customStyle = {},
|
||||
plain = false, // 朴素
|
||||
customClassName = '',
|
||||
} = props
|
||||
const handleClick = (event) => {
|
||||
if (disabled) {
|
||||
return
|
||||
}
|
||||
onClick && onClick(event)
|
||||
}
|
||||
|
||||
const getClassName = () => {
|
||||
const classObject = {
|
||||
[styles['tag--disabled']]: disabled,
|
||||
[styles[`tag--${size}`]]: size,
|
||||
[styles[`tag--${type}`]]: type,
|
||||
[styles['tag--plain']]: plain,
|
||||
[styles['tag--circle']]: circle,
|
||||
}
|
||||
return classObject
|
||||
}
|
||||
return (
|
||||
<View className={classnames(styles.tag, getClassName(), customClassName)} style={customStyle} onClick={handleClick}>
|
||||
<Text className={styles['tag--text']}>{children}</Text>
|
||||
</View>
|
||||
)
|
||||
}
|
||||
export default Tag
|
||||
3
src/pages/category/index.config.ts
Normal file
3
src/pages/category/index.config.ts
Normal file
@ -0,0 +1,3 @@
|
||||
export default {
|
||||
navigationBarTitleText: '分类',
|
||||
}
|
||||
42
src/pages/category/index.module.scss
Normal file
42
src/pages/category/index.module.scss
Normal file
@ -0,0 +1,42 @@
|
||||
.main {
|
||||
background-color: #fff;
|
||||
height: 100vh;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
.header {
|
||||
background-color: #fff;
|
||||
}
|
||||
.search {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
padding: 20px;
|
||||
box-sizing: border-box;
|
||||
align-items: center;
|
||||
.search_collect {
|
||||
font-size: 26px;
|
||||
border: 2px solid $color_main;
|
||||
color: $color_main;
|
||||
border-radius: 50px;
|
||||
width: 132px;
|
||||
height: 44px;
|
||||
text-align: center;
|
||||
line-height: 44px;
|
||||
}
|
||||
.search_input {
|
||||
flex: 1;
|
||||
// margin-left: 20px;
|
||||
}
|
||||
}
|
||||
.products {
|
||||
flex: 1;
|
||||
height: 0;
|
||||
.product_right_con {
|
||||
position: relative;
|
||||
.product_class {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
114
src/pages/category/index.tsx
Normal file
114
src/pages/category/index.tsx
Normal file
@ -0,0 +1,114 @@
|
||||
import { View } from '@tarojs/components'
|
||||
import { useCallback, useEffect, useMemo, useRef, useState } from 'react'
|
||||
import styles from './index.module.scss'
|
||||
import Search from '@/components/search'
|
||||
import { goLink } from '@/common/common'
|
||||
import SideBar from '@/components/sideBar'
|
||||
import { GetProductKindListApi, GetProductListApi } from '@/api/material'
|
||||
import { dataLoadingStatus } from '@/common/util'
|
||||
import Product from '@/components/product'
|
||||
import useLogin from '@/use/useLogin'
|
||||
// 分类
|
||||
const Category = () => {
|
||||
useLogin()
|
||||
|
||||
const product_kind_id_ref = useRef(0)
|
||||
const product_kind_id_next_ref = useRef(0)
|
||||
const [productData, setProductData] = useState<{ list: any; total: number }>({ list: [], total: 0 })
|
||||
const [filtrate, setFiltrate] = useState({ product_kind_id: 0, size: 5, page: 1 })
|
||||
const pageNum = useRef({ size: filtrate.size, page: filtrate.page })
|
||||
const { fetchData: productFetchData, state: productState } = GetProductListApi()
|
||||
// 点击面料类型
|
||||
const getProductKindId = useCallback((e) => {
|
||||
pageNum.current.page = 1
|
||||
setProductData({ list: [], total: 0 })
|
||||
setFiltrate(list => ({ ...list, size: 5, product_kind_id: e.id }))
|
||||
product_kind_id_ref.current = e.id
|
||||
}, [])
|
||||
|
||||
// 上拉加载数据
|
||||
const getScrolltolower = useCallback(() => {
|
||||
pageNum.current.page++
|
||||
const newSize = pageNum.current.size * pageNum.current.page
|
||||
setFiltrate(e => ({ ...e, size: newSize }))
|
||||
}, [productData])
|
||||
|
||||
const [kindData, setKindData] = useState<any>({ list: [], defaultId: 0 })
|
||||
|
||||
// 列表下拉刷新
|
||||
const [refresherTriggeredStatus, setRefresherTriggeredStatus] = useState(false)
|
||||
const getRefresherRefresh = async() => {
|
||||
pageNum.current.page = 1
|
||||
setFiltrate({ ...filtrate, size: 5 })
|
||||
setRefresherTriggeredStatus(true)
|
||||
}
|
||||
|
||||
// 数据加载状态
|
||||
const statusMore = useMemo(() => {
|
||||
return dataLoadingStatus({ list: productData.list, total: productData.total, status: productState.loading })
|
||||
}, [productData, productState.loading])
|
||||
|
||||
// 获取二级分类
|
||||
|
||||
const getSelectClassId = useCallback((id) => {
|
||||
pageNum.current.page = 1
|
||||
setProductData({ list: [], total: 0 })
|
||||
const kind_id = id == -1 ? product_kind_id_ref.current : id
|
||||
product_kind_id_next_ref.current = id
|
||||
setFiltrate(list => ({ ...list, size: 5, product_kind_id: kind_id }))
|
||||
}, [])
|
||||
|
||||
const { fetchData } = GetProductKindListApi()
|
||||
|
||||
const categoryList = async() => {
|
||||
const res = await fetchData()
|
||||
if (res.data?.list) {
|
||||
setKindData({ ...kindData, list: res.data.list, defaultId: res.data.list[0].id })
|
||||
setFiltrate({ ...filtrate, product_kind_id: res.data.list[0].id })
|
||||
product_kind_id_ref.current = res.data.list[0].id
|
||||
}
|
||||
}
|
||||
|
||||
// 获取数据方法
|
||||
const getProductList = async() => {
|
||||
const { data, total } = await productFetchData(filtrate)
|
||||
setProductData({ ...productData, list: data.list, total })
|
||||
setRefresherTriggeredStatus(() => false)
|
||||
}
|
||||
|
||||
// 监听查询条件
|
||||
useEffect(() => {
|
||||
if (filtrate.product_kind_id) { getProductList() }
|
||||
}, [filtrate])
|
||||
|
||||
useEffect(() => {
|
||||
categoryList()
|
||||
}, [])
|
||||
|
||||
return <View className={styles.main}>
|
||||
<View className={styles.header}>
|
||||
<View className={styles.search}>
|
||||
<View className={styles.search_input} onClick={() => goLink('/pages/searchList/search')}>
|
||||
<Search disabled style={{ width: '263rpx' }} borderRadius="16rpx" placeholder="请输入搜索布料" />
|
||||
</View>
|
||||
</View>
|
||||
</View>
|
||||
<View className={styles.products}>
|
||||
<SideBar
|
||||
list={kindData.list}
|
||||
height="100%"
|
||||
defaultValue={kindData.defaultId}
|
||||
statusMore={statusMore}
|
||||
selfOnScrolltolower={getScrolltolower}
|
||||
sideBarOnClick={getProductKindId}
|
||||
heightItem={82}
|
||||
refresherTriggered={refresherTriggeredStatus}
|
||||
selectClass={getSelectClassId}
|
||||
selfOnRefresherRefresh={() => getRefresherRefresh()}
|
||||
>
|
||||
<Product productList={productData.list} />
|
||||
</SideBar>
|
||||
</View>
|
||||
</View>
|
||||
}
|
||||
export default Category
|
||||
@ -9,7 +9,6 @@ import SearchPopup from './components/searchPopup'
|
||||
import Search from '@/components/search'
|
||||
import Product from '@/components/product'
|
||||
import InfiniteScroll from '@/components/infiniteScroll'
|
||||
import Filter from '@/components/filter'
|
||||
import SortBtn from '@/components/sortBtn'
|
||||
import { GetProductListApi } from '@/api/material'
|
||||
import { dataLoadingStatus, getFilterData } from '@/common/util'
|
||||
|
||||
107
src/pages/index/components/guessULikeList/index.module.scss
Normal file
107
src/pages/index/components/guessULikeList/index.module.scss
Normal file
@ -0,0 +1,107 @@
|
||||
.products_list {
|
||||
padding-bottom: 20px;
|
||||
box-sizing: border-box;
|
||||
height: 100%;
|
||||
}
|
||||
.products_item {
|
||||
width: 100%;
|
||||
background-color: #fff;
|
||||
border-radius: 20px;
|
||||
box-sizing: border-box;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
box-shadow: 0px 0px 36px -7px rgba(0, 0, 0, 0.08);
|
||||
overflow: hidden;
|
||||
&:nth-child(n + 2) {
|
||||
margin-top: 16px;
|
||||
}
|
||||
.item_img {
|
||||
width: 188px;
|
||||
height: 188px;
|
||||
position: relative;
|
||||
image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 0;
|
||||
}
|
||||
.num {
|
||||
padding: 5px 10px 5px 20px;
|
||||
font-size: $font_size_min;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
background: rgba($color: #000, $alpha: 0.3);
|
||||
border-radius: 36px 0px 0px 0px;
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
}
|
||||
.collection_icon {
|
||||
position: absolute;
|
||||
left: 12px;
|
||||
top: 13px;
|
||||
}
|
||||
}
|
||||
.item_con {
|
||||
display: flex;
|
||||
flex-flow: column nowrap;
|
||||
justify-content: space-between;
|
||||
padding: 16px 20px;
|
||||
font-size: $font_size;
|
||||
flex: 1;
|
||||
.title {
|
||||
font-size: $font_size;
|
||||
color: #707070;
|
||||
@include common_ellipsis(2);
|
||||
text {
|
||||
color: $color_font_one;
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
.tag_list {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
.tag,
|
||||
.tag_g {
|
||||
max-width: 260rpx;
|
||||
padding: 3px 10px;
|
||||
background-color: #cde5ff;
|
||||
font-size: $font_size_min;
|
||||
border-radius: 5px;
|
||||
border: 0;
|
||||
color: $color_main;
|
||||
margin-right: 10px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
.tag_g {
|
||||
background-color: #ffe6ce;
|
||||
color: #ee7500;
|
||||
}
|
||||
}
|
||||
.bottom {
|
||||
display: flex;
|
||||
flex-flow: row nowrap;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.des {
|
||||
width: 60%;
|
||||
font-size: $font_size_medium;
|
||||
color: #707070;
|
||||
@include common_ellipsis;
|
||||
}
|
||||
.price {
|
||||
display: flex;
|
||||
width: 40%;
|
||||
justify-content: flex-end;
|
||||
color: $color_money;
|
||||
align-items: baseline;
|
||||
margin-top: 8px;
|
||||
font-weight: 550;
|
||||
&_unit {
|
||||
font-size: 18px;
|
||||
}
|
||||
&_num {
|
||||
font-size: 28px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
56
src/pages/index/components/guessULikeList/index.tsx
Normal file
56
src/pages/index/components/guessULikeList/index.tsx
Normal file
@ -0,0 +1,56 @@
|
||||
import { Text, View } from '@tarojs/components'
|
||||
import { useCallback } from 'react'
|
||||
import styles from './index.module.scss'
|
||||
import LabAndImg from '@/components/LabAndImg'
|
||||
import { formatHashTag, formatPriceDiv } from '@/common/fotmat'
|
||||
import { goLink } from '@/common/common'
|
||||
import Tag from '@/components/tag'
|
||||
import IconFont from '@/components/iconfont/iconfont'
|
||||
|
||||
interface PropsType {
|
||||
uLikeList: any[]
|
||||
}
|
||||
// 猜你喜欢商品
|
||||
const GuessULikeList = (props: PropsType) => {
|
||||
const { uLikeList = [] } = props
|
||||
const labAndImgObj = useCallback(
|
||||
(item) => {
|
||||
return { lab: item.lab, rgb: item.rgb, texture_url: item.texture_url }
|
||||
},
|
||||
[uLikeList],
|
||||
)
|
||||
return (
|
||||
<View className={styles.products_list}>
|
||||
{uLikeList?.map((item) => {
|
||||
return (
|
||||
<View key={item.id} className={styles.products_item} onClick={() => goLink(`/pages/details/index?id=${item.id}`)}>
|
||||
<View className={styles.item_img}>
|
||||
<LabAndImg value={labAndImgObj(item)} />
|
||||
<View className={styles.num}>{item.product_color_count}色</View>
|
||||
{item.is_favorite && <IconFont customClassName={styles.collection_icon} name="icon-shoucang1" size={40} />}
|
||||
</View>
|
||||
<View className={styles.item_con}>
|
||||
<View className={styles.title}>{formatHashTag(item.code, item.name)}</View>
|
||||
<View className={styles.tag_list}>
|
||||
<Tag customClassName={styles.tag} circle type="primary" size="small">{item.width}</Tag>
|
||||
<Tag customClassName={styles.tag_g} circle type="primary" size="small">{item.weight_density}</Tag>
|
||||
{
|
||||
!!item.product_screw_id
|
||||
&& <Tag customClassName={styles.tag_g} circle type="primary" size="small">配套螺纹</Tag>
|
||||
}
|
||||
</View>
|
||||
<View className={styles.bottom}>
|
||||
<View className={styles.des}>{item.component}</View>
|
||||
<View className={styles.price}>
|
||||
<Text className={styles.price_unit}>¥</Text>
|
||||
<Text className={styles.price_num}>{formatPriceDiv(item.lowest_price).toLocaleString()}起</Text>
|
||||
</View>
|
||||
</View>
|
||||
</View>
|
||||
</View>
|
||||
)
|
||||
})}
|
||||
</View>
|
||||
)
|
||||
}
|
||||
export default GuessULikeList
|
||||
@ -66,6 +66,7 @@ const ProductClassLine = memo((option: ParamProduct) => {
|
||||
<View className={styles.product_class_list}>
|
||||
{list?.map((item, index) => (
|
||||
<View
|
||||
key={index}
|
||||
id={`tabs_${item.id}`}
|
||||
className={classnames(styles.product_class_item, item.id == selectInfo.selected ? styles.product_class_item_selected : '')}
|
||||
onClick={() => clickEvent({ item, index })}
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
export default {
|
||||
navigationBarTitleText: '首页',
|
||||
navigationBarTitleText: '面料优选A+',
|
||||
enableShareAppMessage: true,
|
||||
}
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
.main {
|
||||
background-color: #f6f6f6;
|
||||
background-color: #fff;
|
||||
height: 100vh;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
@ -29,15 +29,95 @@
|
||||
// margin-left: 20px;
|
||||
}
|
||||
}
|
||||
.products {
|
||||
flex: 1;
|
||||
height: 0;
|
||||
.product_right_con {
|
||||
position: relative;
|
||||
.product_class {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
.category {
|
||||
.flex_container {
|
||||
padding: 36px 20px;
|
||||
display: flex;
|
||||
justify-content: space-evenly;
|
||||
.flex_item {
|
||||
flex: 1;
|
||||
&_text {
|
||||
text-align: center;
|
||||
margin-top: 10px;
|
||||
font-size: 24px;
|
||||
color: #676767;
|
||||
}
|
||||
}
|
||||
}
|
||||
.grid_container {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr;
|
||||
grid-template-rows: 1fr 1fr;
|
||||
grid-row-gap: 16px;
|
||||
grid-column-gap: 16px;
|
||||
padding: 0 24px;
|
||||
.grid_item {
|
||||
// background-color: red;
|
||||
}
|
||||
.grid_left {
|
||||
grid-column-start: 1;
|
||||
grid-column-end: 2;
|
||||
grid-row-start: 1;
|
||||
grid-row-end: 3;
|
||||
&_image {
|
||||
height: 250px;
|
||||
}
|
||||
}
|
||||
.grid_top {
|
||||
grid-column-start: 2;
|
||||
grid-column-end: 3;
|
||||
grid-row-start: 1;
|
||||
grid-row-end: 2;
|
||||
&_image {
|
||||
height: 117px;
|
||||
}
|
||||
}
|
||||
.grid_bottom {
|
||||
grid-column-start: 2;
|
||||
grid-column-end: 3;
|
||||
grid-row-start: 2;
|
||||
grid-row-end: 3;
|
||||
&_image {
|
||||
height: 117px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
// .products {
|
||||
// flex: 1;
|
||||
// height: 0;
|
||||
// .product_right_con {
|
||||
// position: relative;
|
||||
// .product_class {
|
||||
// position: absolute;
|
||||
// top: 0;
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
.extended_module{
|
||||
margin-top: 16px;
|
||||
padding: 0 24px;
|
||||
.module_header{
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
padding: 16px 0;
|
||||
&_title{
|
||||
color: #4e4e4e;
|
||||
font-size: 32px;
|
||||
font-weight: bold;
|
||||
}
|
||||
&_more{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: 28px;
|
||||
color: $color_main;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.more_recommend{
|
||||
color: $color_main;
|
||||
text-align: center;
|
||||
font-size: 28px;
|
||||
padding: 20px 0;
|
||||
}
|
||||
|
||||
@ -1,18 +1,19 @@
|
||||
import { View } from '@tarojs/components'
|
||||
import { Image, Text, View } from '@tarojs/components'
|
||||
import Taro, { Events, useDidShow, usePullDownRefresh } from '@tarojs/taro'
|
||||
import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react'
|
||||
import classNames from 'classnames'
|
||||
import styles from './index.module.scss'
|
||||
import ProductClass from './components/productClass'
|
||||
import GuessULikeList from './components/guessULikeList'
|
||||
import Banner from '@/components/banner'
|
||||
import Search from '@/components/search'
|
||||
import SideBar from '@/components/sideBar'
|
||||
import Product from '@/components/product'
|
||||
import MoveBtn from '@/components/moveBtn'
|
||||
import ShopCart from '@/components/shopCart'
|
||||
import { goLink } from '@/common/common'
|
||||
import { GetProductKindListApi, GetProductListApi } from '@/api/material'
|
||||
import useLogin from '@/use/useLogin'
|
||||
import { dataLoadingStatus } from '@/common/util'
|
||||
import IconFont from '@/components/iconfont/iconfont'
|
||||
import IconText from '@/components/iconText'
|
||||
import { HOME_ITEM1, HOME_ITEM2, HOME_ITEM3 } from '@/common/constant'
|
||||
import { EnumLabelPageJumpApi, GetLabelProductsApi } from '@/api/search'
|
||||
|
||||
const Index = () => {
|
||||
useLogin()
|
||||
@ -91,11 +92,48 @@ const Index = () => {
|
||||
useEffect(() => {
|
||||
if (filtrate.product_kind_id) { getProductList() }
|
||||
}, [filtrate])
|
||||
|
||||
useEffect(() => {
|
||||
categoryList()
|
||||
getLabelEnum()
|
||||
getGuessULike()
|
||||
}, [])
|
||||
|
||||
const handleClickCategory = () => {
|
||||
goLink('/pages/category/index')
|
||||
}
|
||||
|
||||
const handleClickHomeItem = (labelName: string) => {
|
||||
// 默认 1 女装面料
|
||||
const id = labelEnum.find(item => item.name === labelName)?.id || 1
|
||||
Taro.navigateTo({
|
||||
url: `/pages/searchList/searchList?pageJump=${id}`,
|
||||
})
|
||||
}
|
||||
|
||||
const handleMoreRecommend = () => {
|
||||
Taro.navigateTo({
|
||||
url: '/pages/searchList/searchList',
|
||||
})
|
||||
}
|
||||
|
||||
const { fetchData: getLabelPageJumpEnum } = EnumLabelPageJumpApi()
|
||||
const [labelEnum, setLabelEnum] = useState<any[]>([])
|
||||
const getLabelEnum = async() => {
|
||||
const res = await getLabelPageJumpEnum()
|
||||
setLabelEnum(res.data.list)
|
||||
}
|
||||
|
||||
const { fetchData: guessULike } = GetLabelProductsApi()
|
||||
const [guessULikeList, setGuessULikeList] = useState<any[]>([])
|
||||
const getGuessULike = async() => {
|
||||
const res = await guessULike()
|
||||
if (res.success) {
|
||||
setGuessULikeList(res.data.list)
|
||||
}
|
||||
}
|
||||
|
||||
return (
|
||||
// <MoveBtn showList={['shop']} onShopClick={() => setShowShopCart(!showShopCart)}>
|
||||
<View className={styles.main}>
|
||||
<View className={styles.header}>
|
||||
<View className={styles.search}>
|
||||
@ -105,27 +143,65 @@ const Index = () => {
|
||||
</View>
|
||||
<Banner />
|
||||
</View>
|
||||
<View className={styles.products}>
|
||||
<SideBar
|
||||
list={kindData.list}
|
||||
height="100%"
|
||||
defaultValue={kindData.defaultId}
|
||||
hasMore={hasMore}
|
||||
statusMore={statusMore}
|
||||
selfOnScrolltolower={getScrolltolower}
|
||||
sideBarOnClick={getProductKindId}
|
||||
heightItem={82}
|
||||
refresherTriggered={refresherTriggeredStatus}
|
||||
selectClass={getSelectClassId}
|
||||
selfOnRefresherRefresh={() => getRefresherRefresh()}
|
||||
>
|
||||
<Product productList={productData.list} />
|
||||
</SideBar>
|
||||
<View className={styles.category}>
|
||||
<View className={styles.flex_container}>
|
||||
<View className={styles.flex_item} onClick={() => handleClickHomeItem('女装面料')}>
|
||||
{/* 女装面料 */}
|
||||
<IconText iconName="icon-nvzhuang" textClassName={styles.flex_item_text} iconSize={70} svg direction="top" text="女装面料"></IconText>
|
||||
</View>
|
||||
<View className={styles.flex_item} onClick={() => handleClickHomeItem('男装面料')}>
|
||||
{/* 男装面料 */}
|
||||
<IconText iconName="icon-nanzhuang" textClassName={styles.flex_item_text} iconSize={70} svg direction="top" text="男装面料"></IconText>
|
||||
</View>
|
||||
<View className={styles.flex_item} onClick={() => handleClickHomeItem('童装面料')}>
|
||||
{/* 童装面料 */}
|
||||
<IconText iconName="icon-tongzhuang" textClassName={styles.flex_item_text} iconSize={70} svg direction="top" text="童装面料"></IconText>
|
||||
</View>
|
||||
<View className={styles.flex_item} onClick={() => handleClickHomeItem('潮流面料')}>
|
||||
{/* 潮流面料 */}
|
||||
<IconText iconName="icon-chaoliumianliao" textClassName={styles.flex_item_text} iconSize={70} svg direction="top" text="潮流面料"></IconText>
|
||||
</View>
|
||||
<View className={styles.flex_item} onClick={handleClickCategory}>
|
||||
<IconText iconName="icon-zhuanyefenlei" textClassName={styles.flex_item_text} iconSize={70} svg direction="top" text="专业分类"></IconText>
|
||||
</View>
|
||||
</View>
|
||||
<View className={styles.grid_container}>
|
||||
<View className={classNames(styles.grid_item, styles.grid_left)} onClick={() => handleClickHomeItem('高端奢侈')}>
|
||||
{/* 高端奢侈 */}
|
||||
<View className={styles.grid_left_image}>
|
||||
<Image className="full-100" src={HOME_ITEM1} mode="aspectFit" />
|
||||
</View>
|
||||
</View>
|
||||
<View className={classNames(styles.grid_item, styles.grid_top)} onClick={() => handleClickHomeItem('热销走量')}>
|
||||
{/* 热销走量 */}
|
||||
<View className={styles.grid_top_image}>
|
||||
<Image className="full-100" src={HOME_ITEM2} mode="aspectFit" />
|
||||
</View>
|
||||
</View>
|
||||
<View className={classNames(styles.grid_item, styles.grid_bottom)} onClick={() => handleClickHomeItem('性价比')}>
|
||||
{/* 性价比 */}
|
||||
<View className={styles.grid_bottom_image}>
|
||||
<Image className="full-100" src={HOME_ITEM3} mode="aspectFit" />
|
||||
</View>
|
||||
</View>
|
||||
</View>
|
||||
</View>
|
||||
<View className="common_safe_area_y"></View>
|
||||
{/* <ShopCart show={showShopCart} onClose={() => setShowShopCart(false)} /> */}
|
||||
<View className={styles.extended_module}>
|
||||
<View className={styles.module_header}>
|
||||
<View className={styles.module_header_title}>猜你喜欢</View>
|
||||
<View className={styles.module_header_more} onClick={handleMoreRecommend}>
|
||||
<Text>更多推荐</Text>
|
||||
<IconFont name="icon-rukou" size={34} color="#337fff"></IconFont>
|
||||
</View>
|
||||
</View>
|
||||
<View className={styles.module_container}>
|
||||
<GuessULikeList uLikeList={guessULikeList}></GuessULikeList>
|
||||
<View className={styles.more_recommend} onClick={handleMoreRecommend}>{'更多推荐 >'}</View>
|
||||
</View>
|
||||
</View>
|
||||
{/* 真机测试：注释了以下这段也没有布局问题 */}
|
||||
{/* <View className="common_safe_area_y"></View> */}
|
||||
</View>
|
||||
// </MoveBtn>
|
||||
)
|
||||
}
|
||||
|
||||
|
||||
@ -1,51 +1,46 @@
|
||||
.tabs_main{
|
||||
display: flex;
|
||||
.tabs_main {
|
||||
display: flex;
|
||||
width: 100%;
|
||||
.tabs_scroll {
|
||||
width: 100%;
|
||||
.tabs_scroll{
|
||||
width: 100%;
|
||||
// display: flex;
|
||||
white-space: nowrap;
|
||||
::-webkit-scrollbar {
|
||||
display:none;
|
||||
width:0;
|
||||
height:0;
|
||||
color:transparent;
|
||||
}
|
||||
.tabs_item{
|
||||
min-width: 130px;
|
||||
padding: 0 10px;
|
||||
display: inline-block;
|
||||
font-size: 24px;
|
||||
background-color: #ecf5ff;
|
||||
border-radius: 24rpx;
|
||||
height: 46.93rpx;
|
||||
text-align: center;
|
||||
line-height: 46.93rpx;
|
||||
color: #707070;
|
||||
margin-right: 20px;
|
||||
border: 2px solid #cde5ff;
|
||||
.tabs_item_con{
|
||||
height: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: $font_size_medium;
|
||||
@include common_ellipsis();
|
||||
}
|
||||
.tabs_index{
|
||||
height: 5px;
|
||||
width: 100%;
|
||||
background-color:$color_main;
|
||||
position:absolute;
|
||||
bottom: 0;
|
||||
left:0;
|
||||
border-radius: 50px;
|
||||
}
|
||||
.tabs_item_select{
|
||||
color: $color_main;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
white-space: nowrap;
|
||||
::-webkit-scrollbar {
|
||||
display: none;
|
||||
width: 0;
|
||||
height: 0;
|
||||
color: transparent;
|
||||
}
|
||||
}
|
||||
.tabs_item {
|
||||
display: inline-block;
|
||||
margin-right: 20px;
|
||||
.tabs_item_con {
|
||||
height: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 28px;
|
||||
@include common_ellipsis();
|
||||
padding: 4px 26px;
|
||||
border-radius: 24rpx;
|
||||
background-color: #f6f6f6;
|
||||
box-sizing: border-box;
|
||||
border: 1px solid transparent;
|
||||
color: #8a8a8a;
|
||||
}
|
||||
.tabs_index {
|
||||
height: 5px;
|
||||
width: 100%;
|
||||
background-color: $color_main;
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
border-radius: 50px;
|
||||
}
|
||||
.tabs_item_select {
|
||||
color: $color_main;
|
||||
background-color: #eaf2ff;
|
||||
border: 1px solid $color_main;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -1,38 +1,44 @@
|
||||
import { ScrollView, View } from '@tarojs/components'
|
||||
import type { ReactNode } from 'react'
|
||||
import { memo, useEffect, useState } from 'react'
|
||||
import type { ReactNode } from 'react'
|
||||
import { memo, useEffect, useRef, useState } from 'react'
|
||||
import classnames from 'classnames'
|
||||
import styles from './index.module.scss'
|
||||
|
||||
export interface ListProps {
|
||||
title: string
|
||||
value: number
|
||||
id: number
|
||||
name: string
|
||||
}
|
||||
|
||||
interface Params {
|
||||
list?: ListProps[]
|
||||
defaultValue?: number|string
|
||||
defaultValue?: number[]
|
||||
children?: ReactNode
|
||||
tabsOnClick?: (ListProps) => void
|
||||
onClickTag?: (ids: number[]) => void
|
||||
|
||||
}
|
||||
|
||||
export default memo(({ list = [], defaultValue = 0, tabsOnClick }: Params) => {
|
||||
const [tabId, setTabId] = useState('')
|
||||
export default ({ list = [], defaultValue = [], onClickTag }: Params) => {
|
||||
const [tabId, setTabId] = useState(defaultValue[0])
|
||||
|
||||
useEffect(() => {
|
||||
const index = list?.findIndex((item) => {
|
||||
return item.value == defaultValue
|
||||
})
|
||||
if (index !== -1) {
|
||||
const num = index > 0 ? (index - 1) : 0
|
||||
setTabId(list[num].value.toString())
|
||||
}
|
||||
}, [])
|
||||
console.log('selectData defaultValue', defaultValue)
|
||||
multipleSelection.current = defaultValue
|
||||
setTabId(defaultValue[0])
|
||||
}, [defaultValue])
|
||||
|
||||
const clickEvent = ({ item, index }: { item: ListProps; index: number }) => {
|
||||
tabsOnClick?.(item)
|
||||
setTabId(index.toString())
|
||||
const multipleSelection = useRef<number[]>([])
|
||||
|
||||
const clickEvent = (item: ListProps) => {
|
||||
if (multipleSelection.current.includes(item.id)) {
|
||||
const index = multipleSelection.current.findIndex(id => id === item.id)
|
||||
multipleSelection.current.splice(index, 1)
|
||||
}
|
||||
else {
|
||||
multipleSelection.current.push(item.id)
|
||||
}
|
||||
console.log(item, multipleSelection.current)
|
||||
onClickTag?.(multipleSelection.current)
|
||||
setTabId(item.id)
|
||||
}
|
||||
return (
|
||||
<>
|
||||
@ -42,8 +48,8 @@ export default memo(({ list = [], defaultValue = 0, tabsOnClick }: Params) => {
|
||||
{
|
||||
list.map((item, index) => {
|
||||
return (
|
||||
<View key={index} id={`tabs_${index}`} className={styles.tabs_item} onClick={() => clickEvent({ item, index })}>
|
||||
<View className={classnames(styles.tabs_item_con)}>{`${item.title}: ${item.value}`}</View>
|
||||
<View key={index} id={`tabs_${index}`} className={styles.tabs_item} onClick={() => clickEvent(item)}>
|
||||
<View className={classnames(styles.tabs_item_con, multipleSelection.current.includes(item.id) ? styles.tabs_item_select : '')}>{item.name}</View>
|
||||
</View>
|
||||
)
|
||||
})
|
||||
@ -53,4 +59,4 @@ export default memo(({ list = [], defaultValue = 0, tabsOnClick }: Params) => {
|
||||
</View>
|
||||
</>
|
||||
)
|
||||
})
|
||||
}
|
||||
|
||||
@ -7,7 +7,6 @@ import type { ListProps } from './components/selectData'
|
||||
import SelectData from './components/selectData'
|
||||
import Goods from './components/heightSearchGoods'
|
||||
import SearchPopup from './components/searchPopup'
|
||||
import Filter from '@/components/filter'
|
||||
import InfiniteScroll from '@/components/infiniteScroll'
|
||||
import SortBtn from '@/components/sortBtn'
|
||||
import SearchInput from '@/components/searchInput'
|
||||
|
||||
@ -7,7 +7,7 @@
|
||||
padding-bottom: 50px;
|
||||
align-items: center;
|
||||
.searchBox {
|
||||
width: 606px;
|
||||
width: 100%;
|
||||
}
|
||||
.cancelFont {
|
||||
font-size: 28px;
|
||||
|
||||
@ -13,6 +13,7 @@ import Empty from '@/components/empty'
|
||||
import { dataLoadingStatus, debounce, getFilterData } from '@/common/util'
|
||||
import InfiniteScroll from '@/components/infiniteScroll'
|
||||
import { GetProductListApi, mallsearchHistorydelete } from '@/api/material'
|
||||
import IconFont from '@/components/iconfont/iconfont'
|
||||
|
||||
interface searchDataParam { search_key: '' }
|
||||
export default () => {
|
||||
@ -21,14 +22,12 @@ export default () => {
|
||||
const [searchData, setSearchData] = useState<{
|
||||
hotField: searchDataParam[]
|
||||
historyField: searchDataParam[]
|
||||
showIndex: number
|
||||
code_or_name: string
|
||||
page: number
|
||||
size: number
|
||||
}>({
|
||||
hotField: [],
|
||||
historyField: [],
|
||||
showIndex: 1, // 1代表输入框没内容搜索 2是有
|
||||
code_or_name: '',
|
||||
page: 1,
|
||||
size: 10,
|
||||
@ -73,17 +72,17 @@ export default () => {
|
||||
// return false
|
||||
// }
|
||||
// addSearchField.current.key = e
|
||||
// status && addSearchHistory()
|
||||
// Taro.navigateTo({
|
||||
// url: `/pages/searchList/searchList?key=${addSearchField.current.key}`,
|
||||
// })
|
||||
|
||||
addSearchHistory()
|
||||
setSearchData(val => ({ ...val, showIndex: 2, page: 1, size: 10, code_or_name: e }))
|
||||
// status && addSearchHistory()
|
||||
Taro.navigateTo({
|
||||
url: `/pages/searchList/searchList?key=${addSearchField.current.key}`,
|
||||
})
|
||||
|
||||
// setSearchData(val => ({ ...val, page: 1, size: 10, code_or_name: e }))
|
||||
// getProductList()
|
||||
}
|
||||
|
||||
const changeSearch = useCallback(debounce((e) => {
|
||||
const changeSearch = useCallback((e) => {
|
||||
if (e.trim().length == 0 && e != '') {
|
||||
alert.error('请输入关键词')
|
||||
}
|
||||
@ -91,52 +90,51 @@ export default () => {
|
||||
addSearchField.current.key = e
|
||||
addSearchHistory()
|
||||
getSearchHistory()
|
||||
setSearchData(val => ({ ...val, showIndex: 2, page: 1, size: 10, code_or_name: e }))
|
||||
// setSearchData(val => ({ ...val, showIndex: 2, page: 1, size: 10, code_or_name: e }))
|
||||
// getProductList()
|
||||
Taro.navigateTo({
|
||||
url: `/pages/searchList/searchList?key=${addSearchField.current.key}`,
|
||||
})
|
||||
}
|
||||
}, [])
|
||||
|
||||
const handleInput = (e) => {
|
||||
if (e == '') {
|
||||
getSearchHistory()
|
||||
setSearchData(val => ({ ...val, showIndex: 1 }))
|
||||
}
|
||||
}, 300), [])
|
||||
|
||||
// 返回
|
||||
const handCancel = () => {
|
||||
Taro.navigateBack({
|
||||
delta: 1,
|
||||
})
|
||||
}
|
||||
|
||||
// 获取面料列表
|
||||
const [materialList, setMaterialList] = useState<{ list: any[]; total: number }>({ list: [], total: 0 })
|
||||
const { fetchData: materialFetchData, state: materialState } = GetProductListApi()
|
||||
const getProductList = async() => {
|
||||
const { data } = await materialFetchData(getFilterData(searchData))
|
||||
setMaterialList({ list: data.list, total: data.total })
|
||||
Taro.stopPullDownRefresh()
|
||||
}
|
||||
// const [materialList, setMaterialList] = useState<{ list: any[]; total: number }>({ list: [], total: 0 })
|
||||
// const { fetchData: materialFetchData, state: materialState } = GetProductListApi()
|
||||
// const getProductList = async() => {
|
||||
// const { data } = await materialFetchData(getFilterData(searchData))
|
||||
// setMaterialList({ list: data.list, total: data.total })
|
||||
// Taro.stopPullDownRefresh()
|
||||
// }
|
||||
|
||||
// 上拉加载数据
|
||||
const pageNum = useRef({ size: searchData.size, page: searchData.page })
|
||||
const getScrolltolower = () => {
|
||||
if (materialList.list.length < materialList.total) {
|
||||
pageNum.current.page++
|
||||
const size = pageNum.current.size * pageNum.current.page
|
||||
setSearchData({ ...searchData, size })
|
||||
}
|
||||
}
|
||||
// const getScrolltolower = () => {
|
||||
// if (materialList.list.length < materialList.total) {
|
||||
// pageNum.current.page++
|
||||
// const size = pageNum.current.size * pageNum.current.page
|
||||
// setSearchData({ ...searchData, size })
|
||||
// }
|
||||
// }
|
||||
|
||||
// 监听筛选条件变化
|
||||
useEffect(() => {
|
||||
if (searchData.code_or_name !== '') {
|
||||
getProductList()
|
||||
}
|
||||
}, [searchData.code_or_name])
|
||||
// useEffect(() => {
|
||||
// if (searchData.code_or_name !== '') {
|
||||
// getProductList()
|
||||
// }
|
||||
// }, [searchData.code_or_name])
|
||||
|
||||
// 数据加载状态
|
||||
const statusMore = useMemo(() => {
|
||||
return dataLoadingStatus({ list: materialList.list, total: materialList.total, status: materialState.loading })
|
||||
}, [materialList, materialState])
|
||||
// const statusMore = useMemo(() => {
|
||||
// return dataLoadingStatus({ list: materialList.list, total: materialList.total, status: materialState.loading })
|
||||
// }, [materialList, materialState])
|
||||
|
||||
// 删除历史搜索
|
||||
const { fetchData: deleteFetch } = mallsearchHistorydelete()
|
||||
@ -152,7 +150,7 @@ export default () => {
|
||||
})
|
||||
alert.success('删除成功')
|
||||
getSearchHistory()
|
||||
setSearchData(val => ({ ...val, showIndex: 1 }))
|
||||
// setSearchData(val => ({ ...val, showIndex: 1 }))
|
||||
Taro.hideLoading()
|
||||
}
|
||||
else {
|
||||
@ -167,72 +165,74 @@ export default () => {
|
||||
})
|
||||
}
|
||||
|
||||
const advancedSearchComponent = () => <View className={styles.up_search} onClick={() => goLink('/pages/searchList/hightSearchList')}>
|
||||
{'高级搜索 >'}
|
||||
</View>
|
||||
|
||||
return (
|
||||
<View className={styles.main}>
|
||||
<View className={styles.search}>
|
||||
<View className={styles.searchBox}>
|
||||
<Search
|
||||
changeOnSearch={changeSearch}
|
||||
clickOnSearch={changeSearch}
|
||||
changeOnSearch={handleInput}
|
||||
placeholder="请输入面料关键词"
|
||||
showBtn
|
||||
defaultValue={defaultValue}
|
||||
/>
|
||||
</View>
|
||||
<View className={styles.cancelFont} onClick={() => handCancel()}>取消</View>
|
||||
</View>
|
||||
{
|
||||
searchData.showIndex === 1 && <>
|
||||
{
|
||||
searchData?.historyField.length === 0
|
||||
<>
|
||||
{
|
||||
searchData?.historyField.length === 0
|
||||
&& <View className={styles.topFlex}>
|
||||
<View className={styles.historyFont}>历史搜索</View>
|
||||
<View className={styles.up_search} onClick={() => goLink('/pages/searchList/hightSearchList')}>
|
||||
{'高级搜索 >'}
|
||||
</View>
|
||||
{advancedSearchComponent()}
|
||||
</View>
|
||||
}
|
||||
{searchData?.hotField.length > 0 && (
|
||||
<View className={styles.hot}>
|
||||
<View className={styles.hot_header}>
|
||||
<View className={styles.hot_header_title}>热门面料</View>
|
||||
</View>
|
||||
<View className={styles.list}>
|
||||
{searchData.hotField.map((item, index) => {
|
||||
return (
|
||||
<View className={styles.item} onClick={() => searchEvent(item.search_key, false)} key={index}>
|
||||
{item.search_key}
|
||||
</View>
|
||||
)
|
||||
})}
|
||||
</View>
|
||||
}
|
||||
{searchData?.hotField.length > 0 && (
|
||||
<View className={styles.hot}>
|
||||
<View className={styles.hot_header}>
|
||||
<View className={styles.hot_header_title}>热门面料</View>
|
||||
</View>
|
||||
)}
|
||||
{searchData?.historyField.length > 0 && (
|
||||
<View className={styles.history}>
|
||||
<View className={styles.history_header}>
|
||||
<View className={styles.history_header_title}>历史搜索</View>
|
||||
{
|
||||
searchData?.historyField.length > 0 && <View className={classnames('iconfont icon-shanchu', styles.miconfont)} onClick={() => handDelete()}></View>
|
||||
}
|
||||
|
||||
</View>
|
||||
<View className={styles.list}>
|
||||
{searchData?.historyField?.map((item, index) => (
|
||||
<View className={styles.list}>
|
||||
{searchData.hotField.map((item, index) => {
|
||||
return (
|
||||
<View className={styles.item} onClick={() => searchEvent(item.search_key, false)} key={index}>
|
||||
{item.search_key}
|
||||
</View>
|
||||
))}
|
||||
</View>
|
||||
<View className={styles.up_search} onClick={() => goLink('/pages/searchList/hightSearchList')}>
|
||||
{'高级搜索 >'}
|
||||
</View>
|
||||
)
|
||||
})}
|
||||
</View>
|
||||
)}
|
||||
{
|
||||
searchData?.historyField.length === 0 && <Empty picUrl={SEARCH_EMPTY_IMAGE} text="无搜索历史"></Empty>
|
||||
}
|
||||
</>
|
||||
}
|
||||
{
|
||||
</View>
|
||||
)}
|
||||
{searchData?.historyField.length > 0 && (
|
||||
<View className={styles.history}>
|
||||
<View className={styles.history_header}>
|
||||
<View className={styles.history_header_title}>历史搜索</View>
|
||||
{
|
||||
searchData?.historyField.length > 0
|
||||
? <View onClick={() => handDelete()}><IconFont name="icon-qingchusousuo" size={40}></IconFont></View>
|
||||
: advancedSearchComponent()
|
||||
}
|
||||
</View>
|
||||
<View className={styles.list}>
|
||||
{searchData?.historyField?.map((item, index) => (
|
||||
<View className={styles.item} onClick={() => searchEvent(item.search_key, false)} key={index}>
|
||||
{item.search_key}
|
||||
</View>
|
||||
))}
|
||||
</View>
|
||||
{
|
||||
searchData?.historyField.length > 0 && advancedSearchComponent()
|
||||
}
|
||||
</View>
|
||||
)}
|
||||
{
|
||||
searchData?.historyField.length === 0 && <Empty picUrl={SEARCH_EMPTY_IMAGE} text="无搜索历史"></Empty>
|
||||
}
|
||||
</>
|
||||
{/* {
|
||||
searchData.showIndex === 2 && <View className={styles.reslutBox}>
|
||||
<View className={styles.reslutTitle}>搜索结果</View>
|
||||
<View className={styles.scrollBox}>
|
||||
@ -247,7 +247,7 @@ export default () => {
|
||||
</InfiniteScroll>
|
||||
</View>
|
||||
</View>
|
||||
}
|
||||
} */}
|
||||
</View>
|
||||
)
|
||||
}
|
||||
|
||||
@ -1,24 +1,32 @@
|
||||
page {
|
||||
display: flex;
|
||||
flex-flow: column nowrap;
|
||||
height: 100vh;
|
||||
overflow: hidden;
|
||||
}
|
||||
.main {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: 100vh;
|
||||
height: 100%;
|
||||
background-color: #fff;
|
||||
.search {
|
||||
padding: 20px;
|
||||
}
|
||||
.filter {
|
||||
border-top: 1px solid #f8f8f8;
|
||||
.filter_all {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 20px 50px;
|
||||
padding: 0px 35px;
|
||||
font-size: $font_size_medium;
|
||||
color: $color_font_three;
|
||||
border-bottom: 1px solid #f8f8f8;
|
||||
.text_zh,
|
||||
.text_sc {
|
||||
color: $color_main;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: 28px;
|
||||
.sortIcon {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
@ -52,7 +60,7 @@
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
height: 86px;
|
||||
padding-top: 25px;
|
||||
}
|
||||
.filter_scroll {
|
||||
flex: 1;
|
||||
@ -102,23 +110,11 @@
|
||||
position: relative;
|
||||
height: 100%;
|
||||
line-height: 86px;
|
||||
// &::before {
|
||||
// content: '';
|
||||
// opacity: 1;
|
||||
// width: 30px;
|
||||
// height: 100%;
|
||||
// position: absolute;
|
||||
// left: -15px;
|
||||
// background-image: linear-gradient(to right, rgba(255, 255, 255), rgba(248, 248, 248, 1) 60%);
|
||||
// // z-index: 99;
|
||||
// }
|
||||
.miconfont {
|
||||
font-size: 27px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.list {
|
||||
height: calc(100vh - 330px);
|
||||
flex: 1 1 auto;
|
||||
overflow: hidden;
|
||||
.list_num {
|
||||
font-size: $font_size_min;
|
||||
color: $color_font_two;
|
||||
@ -131,21 +127,19 @@
|
||||
padding-top: 3px;
|
||||
}
|
||||
.product_list {
|
||||
padding: 38px;
|
||||
display: grid;
|
||||
grid-template-columns: 321px 321px;
|
||||
justify-content: space-between;
|
||||
.product_item {
|
||||
width: 321px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
background-color: #fff;
|
||||
border-radius: 20px;
|
||||
margin-bottom: 20px;
|
||||
box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1);
|
||||
padding: 24px 0;
|
||||
margin: 0 32px;
|
||||
border-bottom: 1px solid #e7e7e7;
|
||||
.product_img {
|
||||
width: 100%;
|
||||
height: 224px;
|
||||
width: 152px;
|
||||
height: 152px;
|
||||
border-radius: 20px 20px 0px 0px;
|
||||
position: relative;
|
||||
margin-right: 24px;
|
||||
image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
@ -153,7 +147,7 @@
|
||||
}
|
||||
.color_num {
|
||||
background: rgba(0, 0, 0, 0.5);
|
||||
border-radius: 50px 0px 0px 0px;
|
||||
border-radius: 50px 0px 20px 0px;
|
||||
font-size: $font_size_min;
|
||||
color: #fff;
|
||||
position: absolute;
|
||||
@ -162,10 +156,18 @@
|
||||
padding: 5px 20px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.collection_icon {
|
||||
position: absolute;
|
||||
left: 12px;
|
||||
top: 13px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.product_info {
|
||||
padding: 20px;
|
||||
flex: 1 1 auto;
|
||||
display: flex;
|
||||
flex-flow: column nowrap;
|
||||
justify-content: space-between;
|
||||
.title {
|
||||
font-size: $font_size;
|
||||
color: $color_font_three;
|
||||
@ -173,26 +175,54 @@
|
||||
}
|
||||
.tag_list {
|
||||
display: flex;
|
||||
margin-top: 16px;
|
||||
.tag {
|
||||
.tag,
|
||||
.tag_g {
|
||||
max-width: 260rpx;
|
||||
@include common_ellipsis();
|
||||
padding: 3px 10px;
|
||||
background-color: #cde5ff;
|
||||
font-size: $font_size_min;
|
||||
border-radius: 5px;
|
||||
border: 0;
|
||||
color: $color_main;
|
||||
@include common_ellipsis();
|
||||
&:nth-child(2) {
|
||||
margin-left: 10px;
|
||||
}
|
||||
margin-right: 10px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
.tag_g {
|
||||
background-color: #ffe6ce;
|
||||
color: #ee7500;
|
||||
}
|
||||
}
|
||||
.bottom {
|
||||
display: flex;
|
||||
flex-flow: row nowrap;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.introduce {
|
||||
width: 60%;
|
||||
font-size: $font_size_medium;
|
||||
color: $color_font_two;
|
||||
margin-top: 16px;
|
||||
@include common_ellipsis();
|
||||
}
|
||||
.price {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
color: $color_money;
|
||||
align-items: baseline;
|
||||
width: 40%;
|
||||
margin-top: 8px;
|
||||
font-weight: 550;
|
||||
&_unit {
|
||||
font-size: 18px;
|
||||
}
|
||||
&_num {
|
||||
font-size: 28px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.filter_active {
|
||||
color: $color_main;
|
||||
}
|
||||
|
||||
@ -1,48 +1,67 @@
|
||||
import { Image, ScrollView, Text, View } from '@tarojs/components'
|
||||
import Taro, { useDidShow, usePullDownRefresh, useRouter } from '@tarojs/taro'
|
||||
import classnames from 'classnames'
|
||||
import { Text, View } from '@tarojs/components'
|
||||
import Taro, { usePullDownRefresh, useRouter } from '@tarojs/taro'
|
||||
import { useCallback, useEffect, useMemo, useRef, useState } from 'react'
|
||||
import type { ListProps } from './components/selectData'
|
||||
import SelectData from './components/selectData'
|
||||
import styles from './searchList.module.scss'
|
||||
import Search from '@/components/search'
|
||||
import Filter from '@/components/filter'
|
||||
import InfiniteScroll from '@/components/infiniteScroll'
|
||||
import type { SortBtnRef, SortParam } from '@/components/sortBtn'
|
||||
import SortBtn from '@/components/sortBtn'
|
||||
import { goLink } from '@/common/common'
|
||||
import { GetProductListApi } from '@/api/material'
|
||||
import { formatHashTag, formatImgUrl } from '@/common/fotmat'
|
||||
import { formatHashTag, formatPriceDiv } from '@/common/fotmat'
|
||||
import { dataLoadingStatus, getFilterData } from '@/common/util'
|
||||
import useLogin from '@/use/useLogin'
|
||||
import LabAndImg from '@/components/LabAndImg'
|
||||
import IconFont from '@/components/iconfont/iconfont'
|
||||
import Tag from '@/components/tag'
|
||||
import { GetLabelProductsApi, HomePageJumpApi } from '@/api/search'
|
||||
|
||||
enum FilterOptions {
|
||||
RECOMMEND = 1,
|
||||
SALES = 2,
|
||||
PRICE = 3,
|
||||
}
|
||||
|
||||
export default () => {
|
||||
useLogin()
|
||||
|
||||
const [showFilter, setShowFilter] = useState(false)
|
||||
const router = useRouter()
|
||||
|
||||
const { fetchData } = HomePageJumpApi()
|
||||
// 获取标签列表
|
||||
const getLabels = async() => {
|
||||
const res = await fetchData({ page_jump: router.params.pageJump || 1 })
|
||||
|
||||
setLabelList(res.data.list.map(item => ({ id: item.product_label_id, name: item.product_label_name })))
|
||||
}
|
||||
|
||||
// 搜索参数
|
||||
const [searchField, setSearchField] = useState({
|
||||
code_or_name: router.params.key,
|
||||
page: 1,
|
||||
size: 10,
|
||||
filter_type: 1, // 综合推荐
|
||||
width: '',
|
||||
weight_density: '',
|
||||
product_kind_id: '',
|
||||
component: '',
|
||||
label_ids: router.params?.label_ids || '',
|
||||
component: '', // 成分
|
||||
abstract_sort_key: '',
|
||||
})
|
||||
|
||||
// 获取面料列表
|
||||
const [materialList, setMaterialList] = useState<{ list: any[]; total: number }>({ list: [], total: 0 })
|
||||
const { fetchData: materialFetchData, state: materialState } = GetProductListApi()
|
||||
const { fetchData: materialFetchData, state: materialState } = GetLabelProductsApi()
|
||||
const getProductList = async() => {
|
||||
const { data } = await materialFetchData(getFilterData(searchField))
|
||||
setMaterialList({ list: data.list, total: data.total })
|
||||
Taro.stopPullDownRefresh()
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
getLabels()
|
||||
}, [])
|
||||
|
||||
// 监听筛选条件变化
|
||||
useEffect(() => {
|
||||
getProductList()
|
||||
@ -65,8 +84,8 @@ export default () => {
|
||||
|
||||
// 输入了搜索关键字
|
||||
const getSearchData = useCallback((e) => {
|
||||
console.log('e', e)
|
||||
pageNum.current.page = 1
|
||||
setMaterialList(() => ({ list: [], total: 0 }))
|
||||
setSearchField(val => ({ ...val, code_or_name: e, size: 10 }))
|
||||
pageNum.current = { size: 10, page: 1 }
|
||||
}, [])
|
||||
@ -80,52 +99,41 @@ export default () => {
|
||||
setSearchField({ ...searchField, size: 10 })
|
||||
})
|
||||
|
||||
// 获取筛选条件
|
||||
const getFiltr = (e) => {
|
||||
pageNum.current.page = 1
|
||||
setMaterialList(() => ({ list: [], total: 0 }))
|
||||
const { data } = e
|
||||
setSearchField({
|
||||
...searchField,
|
||||
width: data?.width,
|
||||
weight_density: data?.weight,
|
||||
size: 10,
|
||||
component: data?.element,
|
||||
product_kind_id: data?.seriesId,
|
||||
})
|
||||
formatSelectList(e)
|
||||
}
|
||||
const [labelIds, setLabelIds] = useState<number[]>([])
|
||||
|
||||
// 筛选条件格式化
|
||||
const [selectList, setSelectList] = useState<ListProps[]>()
|
||||
const formatSelectList = (val = { data: {}, field: {} }) => {
|
||||
const data: ListProps[] = []
|
||||
for (const key in val.data) {
|
||||
if (key !== 'seriesId' && val.data[key] != '') {
|
||||
data.push({ title: val.field[key], value: val.data[key] })
|
||||
}
|
||||
}
|
||||
setSelectList([...data])
|
||||
// 获取筛选条件
|
||||
const getFilter = (e) => {
|
||||
console.log('e', e)
|
||||
pageNum.current.page = 1
|
||||
setSearchField(prev => ({
|
||||
...prev,
|
||||
width: e?.width,
|
||||
weight_density: e?.weight_density,
|
||||
size: 10,
|
||||
component: e?.component,
|
||||
label_ids: e?.label_ids.join(','),
|
||||
}))
|
||||
setLabelIds([...e?.label_ids])
|
||||
}
|
||||
|
||||
// 排序
|
||||
type sortParam = 'none' | 'top' | 'bottom'
|
||||
const sortComprehensiveRef = useRef<any>(null)
|
||||
const sortCollectionRef = useRef<any>(null)
|
||||
const [sortStatus, setSortStatus] = useState<{ comprehensive: sortParam; collection: sortParam }>({
|
||||
comprehensive: 'none',
|
||||
collection: 'none',
|
||||
})
|
||||
const changeSort = (val) => {
|
||||
if (val == 1) {
|
||||
const { status, value } = sortComprehensiveRef.current.changeSort()
|
||||
setSortStatus(e => ({ ...e, comprehensive: status, collection: 'none' }))
|
||||
setSearchField(e => ({ ...e, abstract_sort_key: value, size: 10, page: 1 }))
|
||||
}
|
||||
else {
|
||||
const sortCollectionRef = useRef<SortBtnRef>(null)
|
||||
|
||||
const [sortStatus, setSortStatus] = useState<SortParam>('none')
|
||||
|
||||
const changeSort = () => {
|
||||
setCurrentOption(FilterOptions.PRICE)
|
||||
if (sortCollectionRef.current) {
|
||||
const { status, value } = sortCollectionRef.current.changeSort()
|
||||
setSortStatus(e => ({ ...e, collection: status, comprehensive: 'none' }))
|
||||
setSearchField(e => ({ ...e, abstract_sort_key: value, size: 10, page: 1 }))
|
||||
setSortStatus(status)
|
||||
// 如果状态为none，就是综合推荐
|
||||
if (status === 'none') {
|
||||
setSearchField(e => ({ ...e, filter_type: FilterOptions.RECOMMEND, size: 10, page: 1 }))
|
||||
setCurrentOption(FilterOptions.RECOMMEND)
|
||||
}
|
||||
else {
|
||||
setSearchField(e => ({ ...e, filter_type: value as number, size: 10, page: 1 }))
|
||||
}
|
||||
}
|
||||
pageNum.current = { size: 10, page: 1 }
|
||||
}
|
||||
@ -137,56 +145,94 @@ export default () => {
|
||||
},
|
||||
[materialList],
|
||||
)
|
||||
|
||||
// 返回
|
||||
const handCancel = () => {
|
||||
Taro.navigateBack({
|
||||
delta: 1,
|
||||
})
|
||||
}
|
||||
|
||||
const [currentOption, setCurrentOption] = useState(FilterOptions.RECOMMEND)
|
||||
|
||||
const handleSelectFilterOptions = (key: FilterOptions) => {
|
||||
if (key === currentOption) { return }
|
||||
setSearchField(e => ({ ...e, filter_type: key, size: 10, page: 1 }))
|
||||
setSortStatus('none')
|
||||
setCurrentOption(key)
|
||||
}
|
||||
|
||||
const [labelList, setLabelList] = useState<any[]>([])
|
||||
|
||||
const [selected, setSelected] = useState<number[]>([])
|
||||
|
||||
const handleClickTag = (ids: number[]) => {
|
||||
console.log('ids', ids)
|
||||
setSelected([...ids])
|
||||
setSearchField(prev => ({
|
||||
...prev,
|
||||
label_ids: ids.join(','),
|
||||
}))
|
||||
}
|
||||
|
||||
return (
|
||||
<View className={styles.main}>
|
||||
<View className={styles.search}>
|
||||
<Search placeIcon="out" placeholder="请输入面料关键词" defaultValue={router.params.key} changeOnSearch={getSearchData} debounceTime={300} />
|
||||
<Search placeholder="请输入搜索面料" showBtn btnTitle="取消" clickOnSearch={handCancel} defaultValue={router.params.key} changeOnSearch={getSearchData} debounceTime={300} />
|
||||
</View>
|
||||
<View className={styles.filter}>
|
||||
<View className={styles.filter_all}>
|
||||
<View className={styles.text_zh} onClick={() => changeSort(1)}>
|
||||
<Text>综合</Text>
|
||||
<SortBtn status={sortStatus.comprehensive} ref={sortComprehensiveRef} sortValue={{ desc: '1', asc: '-1' }} />
|
||||
<View className={styles.text_zh} onClick={() => handleSelectFilterOptions(FilterOptions.RECOMMEND)}>
|
||||
<Text className={currentOption === FilterOptions.RECOMMEND ? styles.filter_active : ''}>综合推荐</Text>
|
||||
</View>
|
||||
<View className={styles.text_sc} onClick={() => changeSort(2)}>
|
||||
<Text>收藏</Text>
|
||||
<SortBtn status={sortStatus.collection} ref={sortCollectionRef} sortValue={{ desc: '2', asc: '-2' }} />
|
||||
<View className={styles.text_sc} onClick={() => handleSelectFilterOptions(FilterOptions.SALES)}>
|
||||
<Text className={currentOption === FilterOptions.SALES ? styles.filter_active : ''}>销量</Text>
|
||||
</View>
|
||||
<View className={styles.text_ss} onClick={() => goLink('/pages/searchList/hightSearchList')}>
|
||||
<Text>高级搜索</Text>
|
||||
<Text className={classnames('iconfont icon-sousuo', styles.miconfont)}></Text>
|
||||
<View className={styles.text_sc} onClick={changeSort}>
|
||||
<Text className={currentOption === FilterOptions.PRICE ? styles.filter_active : ''} style={{ marginRight: '8rpx' }}>价格</Text>
|
||||
<SortBtn status={sortStatus} ref={sortCollectionRef} sortValue={{ desc: 3, asc: 4 }} />
|
||||
</View>
|
||||
<View className={styles.text_sc}>
|
||||
<Filter defaultValue={selected} onFilter={e => getFilter(e)} />
|
||||
</View>
|
||||
</View>
|
||||
|
||||
<View className={styles.filter_btn_con}>
|
||||
<View className={styles.filter_scroll}>
|
||||
<SelectData list={selectList} />
|
||||
{
|
||||
!!labelList.length && <View className={styles.filter_btn_con}>
|
||||
<View className={styles.filter_scroll}>
|
||||
<SelectData defaultValue={labelIds} list={labelList} onClickTag={handleClickTag} />
|
||||
</View>
|
||||
</View>
|
||||
<View className={styles.filter_more} onClick={() => setShowFilter(true)}>
|
||||
<Text>筛选</Text>
|
||||
<Text className={classnames('iconfont icon-shaixuan', styles.miconfont)}></Text>
|
||||
</View>
|
||||
</View>
|
||||
}
|
||||
</View>
|
||||
<View className={styles.list}>
|
||||
<View className={classnames(styles.list_num, styles.list_num_shadow)}>搜索结果 ({materialList.total}条记录)</View>
|
||||
<View className={styles.scroll}>
|
||||
<InfiniteScroll selfonScrollToLower={getScrolltolower} statusMore={statusMore}>
|
||||
<InfiniteScroll safeAreaInsetBottom={false} selfonScrollToLower={getScrolltolower} statusMore={statusMore}>
|
||||
<View className={styles.product_list}>
|
||||
{materialList.list.map((item) => {
|
||||
{materialList.list?.map((item) => {
|
||||
return (
|
||||
<View key={item.id} className={styles.product_item} onClick={() => goLinkPage(item)}>
|
||||
<View className={styles.product_img}>
|
||||
<LabAndImg value={labAndImgObj(item)} />
|
||||
<View className={styles.color_num}>{item.product_color_count}色</View>
|
||||
{item.is_favorite && <IconFont customClassName={styles.collection_icon} name="icon-shoucang1" size={40} />}
|
||||
</View>
|
||||
<View className={styles.product_info}>
|
||||
<View className={styles.title}>{formatHashTag(item.code, item.name)}</View>
|
||||
<View className={styles.tag_list}>
|
||||
<View className={styles.tag}>{item.width}</View>
|
||||
<View className={styles.tag}>{item.weight_density}</View>
|
||||
<Tag customClassName={styles.tag} type="primary" size="small" circle>{item.width}</Tag>
|
||||
<Tag customClassName={styles.tag} type="primary" size="small" circle>{item.weight_density}</Tag>
|
||||
{
|
||||
!!item.product_screw_id
|
||||
&& <Tag customClassName={styles.tag_g} circle type="primary" size="small">配套螺纹</Tag>
|
||||
}
|
||||
</View>
|
||||
<View className={styles.bottom}>
|
||||
<View className={styles.introduce}>{item.component}</View>
|
||||
<View className={styles.price}>
|
||||
<View className={styles.price_unit}>¥</View>
|
||||
<View className={styles.price_num}>{formatPriceDiv(item.lowest_price).toLocaleString()}起</View>
|
||||
</View>
|
||||
</View>
|
||||
<View className={styles.introduce}>{item.component}</View>
|
||||
</View>
|
||||
</View>
|
||||
)
|
||||
@ -195,7 +241,6 @@ export default () => {
|
||||
</InfiniteScroll>
|
||||
</View>
|
||||
</View>
|
||||
<Filter show={showFilter} onClose={() => setShowFilter(false)} onFiltr={e => getFiltr(e)} />
|
||||
</View>
|
||||
)
|
||||
}
|
||||
|
||||
@ -2,13 +2,13 @@ import { Input, ScrollView, Text, Textarea, View } from '@tarojs/components'
|
||||
import Taro, { useRouter } from '@tarojs/taro'
|
||||
import classnames from 'classnames'
|
||||
import { useCallback, useEffect, useMemo, useRef, useState } from 'react'
|
||||
import type { ListProps } from '../searchList/components/selectData'
|
||||
import type { ListProps } from '../searchList/components/selectData'
|
||||
import SelectData from '../searchList/components/selectData'
|
||||
import styles from './index.module.scss'
|
||||
import Search from '@/components/search'
|
||||
import Product from '@/components/product'
|
||||
import InfiniteScroll from '@/components/infiniteScroll'
|
||||
import Filter from '@/components/filter'
|
||||
import Filter from '@/components/filterV2'
|
||||
import SortBtn from '@/components/sortBtn'
|
||||
import { GetProductListApi } from '@/api/material'
|
||||
import { dataLoadingStatus, getFilterData } from '@/common/util'
|
||||
@ -130,4 +130,4 @@ export default () => {
|
||||
<Filter show={showPopup} onClose={() => setShowPopup(false)} onFiltr={getFiltr} />
|
||||
</View>
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
@ -46,3 +46,8 @@ $opacity-active: 0.6 !default;
|
||||
-webkit-box-orient: vertical;
|
||||
-webkit-line-clamp: $params;
|
||||
}
|
||||
|
||||
.full-100 {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
169
yarn.lock
169
yarn.lock
@ -1347,13 +1347,20 @@
|
||||
dependencies:
|
||||
regenerator-runtime "^0.13.4"
|
||||
|
||||
"@babel/runtime@^7.12.1", "@babel/runtime@^7.14.5", "@babel/runtime@^7.20.6", "@babel/runtime@^7.7.2", "@babel/runtime@^7.7.6", "@babel/runtime@^7.8.4", "@babel/runtime@^7.9.2":
|
||||
"@babel/runtime@^7.12.1", "@babel/runtime@^7.20.6", "@babel/runtime@^7.7.2", "@babel/runtime@^7.7.6", "@babel/runtime@^7.8.4", "@babel/runtime@^7.9.2":
|
||||
version "7.20.6"
|
||||
resolved "https://registry.npmmirror.com/@babel/runtime/-/runtime-7.20.6.tgz"
|
||||
integrity sha512-Q+8MqP7TiHMWzSfwiJwXCjyf4GYA4Dgw3emg/7xmwsdLJOZUp+nMqcOwOzzYheuM1rhDu8FSj2l0aoMygEuXuA==
|
||||
dependencies:
|
||||
regenerator-runtime "^0.13.11"
|
||||
|
||||
"@babel/runtime@^7.14.5":
|
||||
version "7.21.0"
|
||||
resolved "https://registry.npmjs.org/@babel/runtime/-/runtime-7.21.0.tgz#5b55c9d394e5fcf304909a8b00c07dc217b56673"
|
||||
integrity sha512-xwII0//EObnq89Ji5AKYQaRYiW/nZ3llSv29d49IuxPhKbtJoLP+9QUUZ4nVragQVtaVGeZrpB+ZtG/Pdy/POw==
|
||||
dependencies:
|
||||
regenerator-runtime "^0.13.11"
|
||||
|
||||
"@babel/template@7.16.7":
|
||||
version "7.16.7"
|
||||
resolved "https://registry.npmjs.org/@babel/template/-/template-7.16.7.tgz"
|
||||
@ -1431,7 +1438,7 @@
|
||||
|
||||
"@cspotcode/source-map-support@^0.8.0":
|
||||
version "0.8.1"
|
||||
resolved "https://registry.npmmirror.com/@cspotcode/source-map-support/-/source-map-support-0.8.1.tgz#00629c35a688e05a88b1cda684fb9d5e73f000a1"
|
||||
resolved "https://registry.npmjs.org/@cspotcode/source-map-support/-/source-map-support-0.8.1.tgz#00629c35a688e05a88b1cda684fb9d5e73f000a1"
|
||||
integrity sha512-IchNf6dN4tHoMFIn/7OE8LWZ19Y6q/67Bmf6vnGREv8RSbBVb9LPJxEcnwrcwX6ixSvaiGoomAUvu4YSxXrVgw==
|
||||
dependencies:
|
||||
"@jridgewell/trace-mapping" "0.3.9"
|
||||
@ -1858,7 +1865,7 @@
|
||||
|
||||
"@jridgewell/resolve-uri@^3.0.3":
|
||||
version "3.1.0"
|
||||
resolved "https://registry.npmjs.org/@jridgewell/resolve-uri/-/resolve-uri-3.1.0.tgz"
|
||||
resolved "https://registry.npmjs.org/@jridgewell/resolve-uri/-/resolve-uri-3.1.0.tgz#2203b118c157721addfe69d47b70465463066d78"
|
||||
integrity sha512-F2msla3tad+Mfht5cJq7LSXcdudKTWCVYUgw6pLFOOHSTtZlj6SWNYAp+AhuqLmWdBO2X5hPrLcu8cVP8fy28w==
|
||||
|
||||
"@jridgewell/set-array@^1.0.0", "@jridgewell/set-array@^1.0.1":
|
||||
@ -1876,12 +1883,12 @@
|
||||
|
||||
"@jridgewell/sourcemap-codec@^1.4.10":
|
||||
version "1.4.14"
|
||||
resolved "https://registry.npmjs.org/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.4.14.tgz"
|
||||
resolved "https://registry.npmjs.org/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.4.14.tgz#add4c98d341472a289190b424efbdb096991bb24"
|
||||
integrity sha512-XPSJHWmi394fuUuzDnGz1wiKqWfo1yXecHQMRf2l6hztTO+nPru658AyDngaBe7isIxEkRsPR3FZh+s7iVa4Uw==
|
||||
|
||||
"@jridgewell/trace-mapping@0.3.9":
|
||||
version "0.3.9"
|
||||
resolved "https://registry.npmmirror.com/@jridgewell/trace-mapping/-/trace-mapping-0.3.9.tgz#6534fd5933a53ba7cbf3a17615e273a0d1273ff9"
|
||||
resolved "https://registry.npmjs.org/@jridgewell/trace-mapping/-/trace-mapping-0.3.9.tgz#6534fd5933a53ba7cbf3a17615e273a0d1273ff9"
|
||||
integrity sha512-3Belt6tdc8bPgAtbcmdtNJlirVoTmEb5e2gC94PnkwEW9jI6CAHUeoG85tjWP5WquqfavoMtMwiG4P926ZKKuQ==
|
||||
dependencies:
|
||||
"@jridgewell/resolve-uri" "^3.0.3"
|
||||
@ -2112,14 +2119,6 @@
|
||||
dependencies:
|
||||
defer-to-connect "^1.0.1"
|
||||
|
||||
"@tarojs/api@3.5.10":
|
||||
version "3.5.10"
|
||||
resolved "https://registry.npmmirror.com/@tarojs/api/-/api-3.5.10.tgz#5291ba02dde0a8efa77df25bd98f6aeda322520c"
|
||||
integrity sha512-xyAz6X3rwHlwfTXQaqDBisu+hfncZDbN7ViTPbdOwcbOt6crguvTpdycvxLqDQmXZj5XdKx8c+eGMBZ7Ya0x0g==
|
||||
dependencies:
|
||||
"@babel/runtime" "^7.14.5"
|
||||
"@tarojs/runtime" "3.5.10"
|
||||
|
||||
"@tarojs/api@3.5.8":
|
||||
version "3.5.8"
|
||||
resolved "https://registry.npmmirror.com/@tarojs/api/-/api-3.5.8.tgz"
|
||||
@ -2128,6 +2127,14 @@
|
||||
"@babel/runtime" "^7.14.5"
|
||||
"@tarojs/runtime" "3.5.8"
|
||||
|
||||
"@tarojs/api@3.6.1":
|
||||
version "3.6.1"
|
||||
resolved "https://registry.npmjs.org/@tarojs/api/-/api-3.6.1.tgz#a25323a50764522b290a32b4c52695caa21142d8"
|
||||
integrity sha512-pxHo/LKeHDnzU88mBX8TzsWcmNaYO+6cgFWMRb1+OZPVdq+JatJr3KextWvDqUmrT6HowHAjGFDqm33FqWVdDQ==
|
||||
dependencies:
|
||||
"@babel/runtime" "^7.14.5"
|
||||
"@tarojs/runtime" "3.6.1"
|
||||
|
||||
"@tarojs/components@3.5.8":
|
||||
version "3.5.8"
|
||||
resolved "https://registry.npmmirror.com/@tarojs/components/-/components-3.5.8.tgz"
|
||||
@ -2353,14 +2360,6 @@
|
||||
"@tarojs/helper" "3.5.8"
|
||||
scss-bundle "^3.0.2"
|
||||
|
||||
"@tarojs/runtime@3.5.10":
|
||||
version "3.5.10"
|
||||
resolved "https://registry.npmmirror.com/@tarojs/runtime/-/runtime-3.5.10.tgz#c1168ed1c4dc812cdcca850d36678a52c8f57c76"
|
||||
integrity sha512-zlDVnFAf3sE8Vs1IyT1dpUDiFlmyWpGsAjjc2i7kn/A/1LC8q6NwbOeCb/DuF7B3aT3mVNXkw9NFsggi8yDI6A==
|
||||
dependencies:
|
||||
"@tarojs/shared" "3.5.10"
|
||||
lodash-es "4.17.21"
|
||||
|
||||
"@tarojs/runtime@3.5.8":
|
||||
version "3.5.8"
|
||||
resolved "https://registry.npmmirror.com/@tarojs/runtime/-/runtime-3.5.8.tgz"
|
||||
@ -2369,6 +2368,14 @@
|
||||
"@tarojs/shared" "3.5.8"
|
||||
lodash-es "4.17.21"
|
||||
|
||||
"@tarojs/runtime@3.6.1":
|
||||
version "3.6.1"
|
||||
resolved "https://registry.npmjs.org/@tarojs/runtime/-/runtime-3.6.1.tgz#44d794c0ed8e293de45ddab6765e62868572b12e"
|
||||
integrity sha512-MuDSDLKymUC5dLQJTdJZwea6ucF3EROIKoyPQM1aL/h/CiEU87R1Y9hH+tx18rfjvgNSbfSGXEuZ25J/3i3p3g==
|
||||
dependencies:
|
||||
"@tarojs/shared" "3.6.1"
|
||||
lodash-es "4.17.21"
|
||||
|
||||
"@tarojs/service@3.5.8":
|
||||
version "3.5.8"
|
||||
resolved "https://registry.npmmirror.com/@tarojs/service/-/service-3.5.8.tgz"
|
||||
@ -2384,16 +2391,16 @@
|
||||
tapable "^1.1.3"
|
||||
webpack-merge "^4.2.2"
|
||||
|
||||
"@tarojs/shared@3.5.10":
|
||||
version "3.5.10"
|
||||
resolved "https://registry.npmmirror.com/@tarojs/shared/-/shared-3.5.10.tgz#b46630620fb2a82ccb3393b47f6d4f181dd43ed0"
|
||||
integrity sha512-RN2e0fJfYEIofOnhha5CiGN4JtIS2ZU9lRuzASxb1BOdq/cxp+Om2rqATHL0D3Q1jBkf8xMVOZ77BoT0R/pIIw==
|
||||
|
||||
"@tarojs/shared@3.5.8":
|
||||
version "3.5.8"
|
||||
resolved "https://registry.npmmirror.com/@tarojs/shared/-/shared-3.5.8.tgz"
|
||||
integrity sha512-37SzGoZZhOBod9/Va13h8d1qIvU10t4kbKRf0TGZQ6tmGxLljSgP4zZFcuHoF5l/yId4IGgf7rN9asJ3K7z4Rg==
|
||||
|
||||
"@tarojs/shared@3.6.1":
|
||||
version "3.6.1"
|
||||
resolved "https://registry.npmjs.org/@tarojs/shared/-/shared-3.6.1.tgz#f830c44c98382707f5f056e445c9f47446938921"
|
||||
integrity sha512-Omdv48YaT3Uyz99SNvr4dtNG0j3Feq9ZNtCinULbNX3a5ApKTgQFBurzqe3ngPy/Lg51InKODsGpbkpRdRHY3Q==
|
||||
|
||||
"@tarojs/taro-h5@3.5.8":
|
||||
version "3.5.8"
|
||||
resolved "https://registry.npmmirror.com/@tarojs/taro-h5/-/taro-h5-3.5.8.tgz"
|
||||
@ -2425,12 +2432,12 @@
|
||||
"@tarojs/runtime" "3.5.8"
|
||||
|
||||
"@tarojs/taro@^3.5.10":
|
||||
version "3.5.10"
|
||||
resolved "https://registry.npmjs.org/@tarojs/taro/-/taro-3.5.10.tgz#004b161099b89e0ca29311394694784445934a40"
|
||||
integrity sha512-WU+y8AAdbSZS9Oexz34irKkVxRkGkTpu70mDxYenfrrkgY6tOuQ/EmHavuxmQ7aEoFIjgm6s6pW91jd2AyOh+w==
|
||||
version "3.6.1"
|
||||
resolved "https://registry.npmjs.org/@tarojs/taro/-/taro-3.6.1.tgz#87903ef11d05119821391c8a0e523510e7ba19e1"
|
||||
integrity sha512-BV1K3E94Pr3VxFKah+kt1C1qk2x37RJ7zScHsAiIMHZxgi4IX1leJOg1iFfSUbXo7lD7IQch+UOelHHEa9OLpA==
|
||||
dependencies:
|
||||
"@tarojs/api" "3.5.10"
|
||||
"@tarojs/runtime" "3.5.10"
|
||||
"@tarojs/api" "3.6.1"
|
||||
"@tarojs/runtime" "3.6.1"
|
||||
|
||||
"@tarojs/webpack5-prebundle@3.5.8":
|
||||
version "3.5.8"
|
||||
@ -2524,27 +2531,27 @@
|
||||
|
||||
"@trysound/sax@0.2.0":
|
||||
version "0.2.0"
|
||||
resolved "https://registry.npmjs.org/@trysound/sax/-/sax-0.2.0.tgz"
|
||||
resolved "https://registry.npmjs.org/@trysound/sax/-/sax-0.2.0.tgz#cccaab758af56761eb7bf37af6f03f326dd798ad"
|
||||
integrity sha512-L7z9BgrNEcYyUYtF+HaEfiS5ebkh9jXqbszz7pC0hRBPaatV0XjSD3+eHrpqFemQfgwiFF0QPIarnIihIDn7OA==
|
||||
|
||||
"@tsconfig/node10@^1.0.7":
|
||||
version "1.0.9"
|
||||
resolved "https://registry.npmmirror.com/@tsconfig/node10/-/node10-1.0.9.tgz#df4907fc07a886922637b15e02d4cebc4c0021b2"
|
||||
resolved "https://registry.npmjs.org/@tsconfig/node10/-/node10-1.0.9.tgz#df4907fc07a886922637b15e02d4cebc4c0021b2"
|
||||
integrity sha512-jNsYVVxU8v5g43Erja32laIDHXeoNvFEpX33OK4d6hljo3jDhCBDhx5dhCCTMWUojscpAagGiRkBKxpdl9fxqA==
|
||||
|
||||
"@tsconfig/node12@^1.0.7":
|
||||
version "1.0.11"
|
||||
resolved "https://registry.npmmirror.com/@tsconfig/node12/-/node12-1.0.11.tgz#ee3def1f27d9ed66dac6e46a295cffb0152e058d"
|
||||
resolved "https://registry.npmjs.org/@tsconfig/node12/-/node12-1.0.11.tgz#ee3def1f27d9ed66dac6e46a295cffb0152e058d"
|
||||
integrity sha512-cqefuRsh12pWyGsIoBKJA9luFu3mRxCA+ORZvA4ktLSzIuCUtWVxGIuXigEwO5/ywWFMZ2QEGKWvkZG1zDMTag==
|
||||
|
||||
"@tsconfig/node14@^1.0.0":
|
||||
version "1.0.3"
|
||||
resolved "https://registry.npmmirror.com/@tsconfig/node14/-/node14-1.0.3.tgz#e4386316284f00b98435bf40f72f75a09dabf6c1"
|
||||
resolved "https://registry.npmjs.org/@tsconfig/node14/-/node14-1.0.3.tgz#e4386316284f00b98435bf40f72f75a09dabf6c1"
|
||||
integrity sha512-ysT8mhdixWK6Hw3i1V2AeRqZ5WfXg1G43mqoYlM2nc6388Fq5jcXyr5mRsqViLx/GJYdoL0bfXD8nmF+Zn/Iow==
|
||||
|
||||
"@tsconfig/node16@^1.0.2":
|
||||
version "1.0.3"
|
||||
resolved "https://registry.npmmirror.com/@tsconfig/node16/-/node16-1.0.3.tgz#472eaab5f15c1ffdd7f8628bd4c4f753995ec79e"
|
||||
resolved "https://registry.npmjs.org/@tsconfig/node16/-/node16-1.0.3.tgz#472eaab5f15c1ffdd7f8628bd4c4f753995ec79e"
|
||||
integrity sha512-yOlFc+7UtL/89t2ZhjPvvB/DeAr3r+Dq58IgzsFkOAvVC6NMJXmCGjbptdXdR9qsX7pKcTL+s87FtYREi2dEEQ==
|
||||
|
||||
"@types/archy@^0.0.31":
|
||||
@ -3313,9 +3320,9 @@ acorn@^8.0.4, acorn@^8.2.4, acorn@^8.5.0, acorn@^8.7.0, acorn@^8.7.1, acorn@^8.8
|
||||
integrity sha512-QOxyigPVrpZ2GXT+PFyZTl6TtOFc5egxHIP9IlQ+RbupQuX4RkT/Bee4/kQuC02Xkzg84JcT7oLYtDIQxp+v7w==
|
||||
|
||||
acorn@^8.4.1:
|
||||
version "8.8.1"
|
||||
resolved "https://registry.npmmirror.com/acorn/-/acorn-8.8.1.tgz#0a3f9cbecc4ec3bea6f0a80b66ae8dd2da250b73"
|
||||
integrity sha512-7zFpHzhnqYKrkYdUjF1HI1bzd0VygEGX8lFk4k5zVMqHEoES+P+7TKI+EvLO9WVMJ8eekdO0aDEK044xTXwPPA==
|
||||
version "8.8.2"
|
||||
resolved "https://registry.npmjs.org/acorn/-/acorn-8.8.2.tgz#1b2f25db02af965399b9776b0c2c391276d37c4a"
|
||||
integrity sha512-xjIYgE8HBrkpd/sJqOGNspf8uHG+NOHGOw6a/Urj8taM2EXfdNAH2oFcPeIFfsv3+kz/mJrS5VuMqbNLjCa2vw==
|
||||
|
||||
address@^1.0.1:
|
||||
version "1.2.0"
|
||||
@ -3512,7 +3519,7 @@ archy@^1.0.0:
|
||||
|
||||
arg@^4.1.0:
|
||||
version "4.1.3"
|
||||
resolved "https://registry.npmmirror.com/arg/-/arg-4.1.3.tgz#269fc7ad5b8e42cb63c896d5666017261c144089"
|
||||
resolved "https://registry.npmjs.org/arg/-/arg-4.1.3.tgz#269fc7ad5b8e42cb63c896d5666017261c144089"
|
||||
integrity sha512-58S9QDqG0Xx27YwPSt9fJxivjYl432YCwfDMfZ+71RAqUrZef7LrKQZ3LHLOwCS4FLNBplP533Zx895SeOCHvA==
|
||||
|
||||
argparse@^2.0.1:
|
||||
@ -3733,7 +3740,7 @@ aws4@^1.8.0:
|
||||
|
||||
axios@^0.19.0:
|
||||
version "0.19.2"
|
||||
resolved "https://registry.npmmirror.com/axios/-/axios-0.19.2.tgz#3ea36c5d8818d0d5f8a8a97a6d36b86cdc00cb27"
|
||||
resolved "https://registry.npmjs.org/axios/-/axios-0.19.2.tgz#3ea36c5d8818d0d5f8a8a97a6d36b86cdc00cb27"
|
||||
integrity sha512-fjgm5MvRHLhx+osE2xoekY70AhARk3a6hkN+3Io1jc00jtquGvxYlKlsFUhmUET0V5te6CcZI7lcv2Ym61mjHA==
|
||||
dependencies:
|
||||
follow-redirects "1.5.10"
|
||||
@ -4567,7 +4574,7 @@ babylon@^6.18.0:
|
||||
|
||||
balanced-match@^1.0.0:
|
||||
version "1.0.2"
|
||||
resolved "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.2.tgz"
|
||||
resolved "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.2.tgz#e83e3a7e3f300b34cb9d87f615fa0cbf357690ee"
|
||||
integrity sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==
|
||||
|
||||
balanced-match@^2.0.0:
|
||||
@ -4684,7 +4691,7 @@ bonjour@^3.5.0:
|
||||
|
||||
boolbase@^1.0.0:
|
||||
version "1.0.0"
|
||||
resolved "https://registry.npmjs.org/boolbase/-/boolbase-1.0.0.tgz"
|
||||
resolved "https://registry.npmjs.org/boolbase/-/boolbase-1.0.0.tgz#68dff5fbe60c51eb37725ea9e3ed310dcc1e776e"
|
||||
integrity sha512-JZOSA7Mo9sNGB8+UjSgzdLtokWAky1zbztM3WRLCbZ70/3cTANmQmOdR7y2g+J0e2WXywy1yS468tY+IruqEww==
|
||||
|
||||
boolean@^3.0.1:
|
||||
@ -4715,7 +4722,7 @@ brace-expansion@^1.1.7:
|
||||
|
||||
brace-expansion@^2.0.1:
|
||||
version "2.0.1"
|
||||
resolved "https://registry.npmmirror.com/brace-expansion/-/brace-expansion-2.0.1.tgz#1edc459e0f0c548486ecf9fc99f2221364b9a0ae"
|
||||
resolved "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.1.tgz#1edc459e0f0c548486ecf9fc99f2221364b9a0ae"
|
||||
integrity sha512-XnAIvQ8eM+kC6aULx6wuQiwVsnzsi9d3WxzV3FpWTGA19F621kwdbsAcFKXgKUHZWsy+mY6iL1sHTxWEFCytDA==
|
||||
dependencies:
|
||||
balanced-match "^1.0.0"
|
||||
@ -5304,7 +5311,7 @@ colorette@^2.0.10:
|
||||
|
||||
colors@^1.4.0:
|
||||
version "1.4.0"
|
||||
resolved "https://registry.npmmirror.com/colors/-/colors-1.4.0.tgz#c50491479d4c1bdaed2c9ced32cf7c7dc2360f78"
|
||||
resolved "https://registry.npmjs.org/colors/-/colors-1.4.0.tgz#c50491479d4c1bdaed2c9ced32cf7c7dc2360f78"
|
||||
integrity sha512-a+UqTh4kgZg/SlGvfbzDHpgRu7AAQOmmqRHJnxhRZICKFUT91brVhNNt58CMWU9PsBbv3PDCZUHbVxuDiH2mtA==
|
||||
|
||||
combined-stream@^1.0.6, combined-stream@^1.0.8, combined-stream@~1.0.6:
|
||||
@ -5326,7 +5333,7 @@ commander@^4.0.1:
|
||||
|
||||
commander@^7.2.0:
|
||||
version "7.2.0"
|
||||
resolved "https://registry.npmjs.org/commander/-/commander-7.2.0.tgz"
|
||||
resolved "https://registry.npmjs.org/commander/-/commander-7.2.0.tgz#a36cb57d0b501ce108e4d20559a150a391d97ab7"
|
||||
integrity sha512-QrWXB+ZQSVPmIWIhtEO9H+gwHaMGYiF5ChvoJ+K9ZGHG/sVsa6yiesAD1GC/x46sET00Xlwo1u49RVVVzvcSkw==
|
||||
|
||||
commander@^8.3.0:
|
||||
@ -5622,7 +5629,7 @@ create-hmac@^1.1.0, create-hmac@^1.1.4, create-hmac@^1.1.7:
|
||||
|
||||
create-require@^1.1.0:
|
||||
version "1.1.1"
|
||||
resolved "https://registry.npmmirror.com/create-require/-/create-require-1.1.1.tgz#c1d7e8f1e5f6cfc9ff65f9cd352d37348756c333"
|
||||
resolved "https://registry.npmjs.org/create-require/-/create-require-1.1.1.tgz#c1d7e8f1e5f6cfc9ff65f9cd352d37348756c333"
|
||||
integrity sha512-dcKFX3jn0MpIaXjisoRvexIJVEKzaq7z2rZKxf+MSr9TkdmHmsU4m2lcLojrj/FHl8mk5VxMmYA+ftRkP/3oKQ==
|
||||
|
||||
cross-env@^7.0.3:
|
||||
@ -5789,7 +5796,7 @@ css-tree@^2.2.1:
|
||||
|
||||
css-tree@~2.2.0:
|
||||
version "2.2.1"
|
||||
resolved "https://registry.npmjs.org/css-tree/-/css-tree-2.2.1.tgz"
|
||||
resolved "https://registry.npmjs.org/css-tree/-/css-tree-2.2.1.tgz#36115d382d60afd271e377f9c5f67d02bd48c032"
|
||||
integrity sha512-OA0mILzGc1kCOCSJerOeqDxDQ4HOh+G8NbOJFOTgOCzpw7fCBubk0fEyxp8AgOL/jvLgYA/uV0cMbe43ElF1JA==
|
||||
dependencies:
|
||||
mdn-data "2.0.28"
|
||||
@ -6188,7 +6195,7 @@ dezalgo@^1.0.0:
|
||||
|
||||
diff@^4.0.1:
|
||||
version "4.0.2"
|
||||
resolved "https://registry.npmmirror.com/diff/-/diff-4.0.2.tgz#60f3aecb89d5fae520c11aa19efc2bb982aade7d"
|
||||
resolved "https://registry.npmjs.org/diff/-/diff-4.0.2.tgz#60f3aecb89d5fae520c11aa19efc2bb982aade7d"
|
||||
integrity sha512-58lmxKSA4BNyLz+HHMUzlOEpg09FV+ev6ZMe3vJihgdxzgcwZ8VoEEPmALCZG9LmqfVoNMMKpttIYTVG6uDY7A==
|
||||
|
||||
diffie-hellman@^5.0.0:
|
||||
@ -6273,7 +6280,7 @@ dom-serializer@^1.0.1:
|
||||
|
||||
dom-serializer@^2.0.0:
|
||||
version "2.0.0"
|
||||
resolved "https://registry.npmmirror.com/dom-serializer/-/dom-serializer-2.0.0.tgz"
|
||||
resolved "https://registry.npmjs.org/dom-serializer/-/dom-serializer-2.0.0.tgz#e41b802e1eedf9f6cae183ce5e622d789d7d8e53"
|
||||
integrity sha512-wIkAryiqt/nV5EQKqQpo3SToSOV9J0DnbJqwK7Wv/Trc92zIAYZ4FlMu+JPFW1DfGFt81ZTCGgDEabffXeLyJg==
|
||||
dependencies:
|
||||
domelementtype "^2.3.0"
|
||||
@ -6299,7 +6306,7 @@ domain-browser@^1.1.1:
|
||||
|
||||
domelementtype@^2.0.1, domelementtype@^2.2.0, domelementtype@^2.3.0:
|
||||
version "2.3.0"
|
||||
resolved "https://registry.npmjs.org/domelementtype/-/domelementtype-2.3.0.tgz"
|
||||
resolved "https://registry.npmjs.org/domelementtype/-/domelementtype-2.3.0.tgz#5c45e8e869952626331d7aab326d01daf65d589d"
|
||||
integrity sha512-OLETBj6w0OsagBwdXnPdN0cnMfF9opN69co+7ZrbfPGrdpPVNBUj02spi6B1N7wChLQiPn4CSH/zJvXw56gmHw==
|
||||
|
||||
domexception@^1.0.1:
|
||||
@ -6325,7 +6332,7 @@ domhandler@^4.0.0, domhandler@^4.2.0, domhandler@^4.3.1:
|
||||
|
||||
domhandler@^5.0.1, domhandler@^5.0.2:
|
||||
version "5.0.3"
|
||||
resolved "https://registry.npmmirror.com/domhandler/-/domhandler-5.0.3.tgz"
|
||||
resolved "https://registry.npmjs.org/domhandler/-/domhandler-5.0.3.tgz#cc385f7f751f1d1fc650c21374804254538c7d31"
|
||||
integrity sha512-cgwlv/1iFQiFnU96XXgROh8xTeetsnJiDsTc7TYCLFd9+/WNkIqPTxiM/8pSd8VIrhXGTf1Ny1q1hquVqDJB5w==
|
||||
dependencies:
|
||||
domelementtype "^2.3.0"
|
||||
@ -6341,7 +6348,7 @@ domutils@^2.5.2, domutils@^2.8.0:
|
||||
|
||||
domutils@^3.0.1:
|
||||
version "3.0.1"
|
||||
resolved "https://registry.npmmirror.com/domutils/-/domutils-3.0.1.tgz"
|
||||
resolved "https://registry.npmjs.org/domutils/-/domutils-3.0.1.tgz#696b3875238338cb186b6c0612bd4901c89a4f1c"
|
||||
integrity sha512-z08c1l761iKhDFtfXO04C7kTdPBLi41zwOZl00WS8b5eiaebNpY00HKbztwBq+e3vyqWNwWF3mP9YLUeqIrF+Q==
|
||||
dependencies:
|
||||
dom-serializer "^2.0.0"
|
||||
@ -7410,7 +7417,7 @@ flush-write-stream@^1.0.0:
|
||||
|
||||
follow-redirects@1.5.10:
|
||||
version "1.5.10"
|
||||
resolved "https://registry.npmmirror.com/follow-redirects/-/follow-redirects-1.5.10.tgz#7b7a9f9aea2fdff36786a94ff643ed07f4ff5e2a"
|
||||
resolved "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.5.10.tgz#7b7a9f9aea2fdff36786a94ff643ed07f4ff5e2a"
|
||||
integrity sha512-0V5l4Cizzvqt5D44aTXbFZz+FtyXV1vrDN6qrelxtfYQKW0KO0W2T/hkE8xvGa/540LkZlkaUjO4ailYTFtHVQ==
|
||||
dependencies:
|
||||
debug "=3.1.0"
|
||||
@ -7520,7 +7527,7 @@ fs-write-stream-atomic@^1.0.8:
|
||||
|
||||
fs.realpath@^1.0.0:
|
||||
version "1.0.0"
|
||||
resolved "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz"
|
||||
resolved "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz#1504ad2523158caa40db4a2787cb01411994ea4f"
|
||||
integrity sha512-OO0pH2lK6a0hZnAdau5ItzHPI6pUlvI7jMVnxUQRtw4owF2wk8lOSabtGDCTP4Ggrg2MbGnWO9X8K1t4+fGMDw==
|
||||
|
||||
fsevents@^1.2.7:
|
||||
@ -7678,9 +7685,9 @@ glob@^7.0.0, glob@^7.1.1, glob@^7.1.2, glob@^7.1.3, glob@^7.1.4, glob@^7.1.6:
|
||||
path-is-absolute "^1.0.0"
|
||||
|
||||
glob@^8.0.3:
|
||||
version "8.0.3"
|
||||
resolved "https://registry.npmmirror.com/glob/-/glob-8.0.3.tgz#415c6eb2deed9e502c68fa44a272e6da6eeca42e"
|
||||
integrity sha512-ull455NHSHI/Y1FqGaaYFaLGkNMMJbavMrEGFXG/PGrg6y7sutWHUHrz6gy6WEBH6akM1M414dWKCNs+IhKdiQ==
|
||||
version "8.1.0"
|
||||
resolved "https://registry.npmjs.org/glob/-/glob-8.1.0.tgz#d388f656593ef708ee3e34640fdfb99a9fd1c33e"
|
||||
integrity sha512-r8hpEjiQEYlF2QU0df3dS+nxxSIreXQS1qRhMJM0Q5NDdR386C7jb7Hwwod8Fgiuex+k0GFjgft18yvxm5XoCQ==
|
||||
dependencies:
|
||||
fs.realpath "^1.0.0"
|
||||
inflight "^1.0.4"
|
||||
@ -8221,7 +8228,7 @@ human-signals@^2.1.0:
|
||||
|
||||
iconfont-parser@^1.0.0:
|
||||
version "1.0.0"
|
||||
resolved "https://registry.npmmirror.com/iconfont-parser/-/iconfont-parser-1.0.0.tgz#1fa61be02677005a9a014653ef2eeb7503c3538a"
|
||||
resolved "https://registry.npmjs.org/iconfont-parser/-/iconfont-parser-1.0.0.tgz#1fa61be02677005a9a014653ef2eeb7503c3538a"
|
||||
integrity sha512-3RJceYHEjaqYyeDdfSAb1vP1x1Eb7ZtC9Xwetj+axm85sBlJU7HMvdNLVpwm/3g5eghYOdkQK+epUITZGAIqKQ==
|
||||
dependencies:
|
||||
axios "^0.19.0"
|
||||
@ -8330,7 +8337,7 @@ infer-owner@^1.0.3, infer-owner@^1.0.4:
|
||||
|
||||
inflight@^1.0.4:
|
||||
version "1.0.6"
|
||||
resolved "https://registry.npmjs.org/inflight/-/inflight-1.0.6.tgz"
|
||||
resolved "https://registry.npmjs.org/inflight/-/inflight-1.0.6.tgz#49bd6331d7d02d0c09bc910a1075ba8165b56df9"
|
||||
integrity sha512-k92I/b08q4wvFscXCLvqfsHCrjrF7yiXsQuIVvVE7N82W3+aqpzuUdBbfhWcy/FZR3/4IgflMgKLOsvPDrGCJA==
|
||||
dependencies:
|
||||
once "^1.3.0"
|
||||
@ -9081,7 +9088,7 @@ jsonfile@^4.0.0:
|
||||
|
||||
jsonfile@^6.0.1:
|
||||
version "6.1.0"
|
||||
resolved "https://registry.npmmirror.com/jsonfile/-/jsonfile-6.1.0.tgz#bc55b2634793c679ec6403094eb13698a6ec0aae"
|
||||
resolved "https://registry.npmjs.org/jsonfile/-/jsonfile-6.1.0.tgz#bc55b2634793c679ec6403094eb13698a6ec0aae"
|
||||
integrity sha512-5dgndWOriYSm5cnYaJNhalLNDKOqFwyDB/rr1E9ZsGciGvKPs8R2xYGCacuf3z6K1YKDz182fd+fY3cn3pMqXQ==
|
||||
dependencies:
|
||||
universalify "^2.0.0"
|
||||
@ -9334,7 +9341,7 @@ locate-path@^6.0.0:
|
||||
|
||||
lodash-es@4.17.21:
|
||||
version "4.17.21"
|
||||
resolved "https://registry.npmjs.org/lodash-es/-/lodash-es-4.17.21.tgz"
|
||||
resolved "https://registry.npmjs.org/lodash-es/-/lodash-es-4.17.21.tgz#43e626c46e6591b7750beb2b50117390c609e3ee"
|
||||
integrity sha512-mKnC+QJ9pWVzv+C4/U3rRsHapFfHvQFoFB92e52xeyGMcX6/OlIl78je1u8vePzYZSkkogMPJ2yjxxsb89cxyw==
|
||||
|
||||
lodash.clonedeep@^4.5.0:
|
||||
@ -9469,7 +9476,7 @@ make-dir@^3.0.2, make-dir@^3.1.0:
|
||||
|
||||
make-error@^1.1.1:
|
||||
version "1.3.6"
|
||||
resolved "https://registry.npmmirror.com/make-error/-/make-error-1.3.6.tgz#2eb2e37ea9b67c4891f684a1394799af484cf7a2"
|
||||
resolved "https://registry.npmjs.org/make-error/-/make-error-1.3.6.tgz#2eb2e37ea9b67c4891f684a1394799af484cf7a2"
|
||||
integrity sha512-s8UhlNe7vPKomQhC1qFelMokr/Sc3AgNbso3n74mVPA5LTZwkB9NlXf4XPamLxJE8h0gh73rM94xvwRT2CVInw==
|
||||
|
||||
map-cache@^0.2.2:
|
||||
@ -9547,7 +9554,7 @@ mdn-data@2.0.14:
|
||||
|
||||
mdn-data@2.0.28:
|
||||
version "2.0.28"
|
||||
resolved "https://registry.npmjs.org/mdn-data/-/mdn-data-2.0.28.tgz"
|
||||
resolved "https://registry.npmjs.org/mdn-data/-/mdn-data-2.0.28.tgz#5ec48e7bef120654539069e1ae4ddc81ca490eba"
|
||||
integrity sha512-aylIc7Z9y4yzHYAJNuESG3hfhC+0Ibp/MAMiaOZgNv4pmEdFyfZhhhny4MNiAfWdBQ1RQ2mfDWmM1x8SvGyp8g==
|
||||
|
||||
mdn-data@2.0.30:
|
||||
@ -9805,9 +9812,9 @@ minimatch@^3.0.4, minimatch@^3.0.5, minimatch@^3.1.1, minimatch@^3.1.2:
|
||||
brace-expansion "^1.1.7"
|
||||
|
||||
minimatch@^5.0.1:
|
||||
version "5.1.1"
|
||||
resolved "https://registry.npmmirror.com/minimatch/-/minimatch-5.1.1.tgz#6c9dffcf9927ff2a31e74b5af11adf8b9604b022"
|
||||
integrity sha512-362NP+zlprccbEt/SkxKfRMHnNY85V74mVnpUpNyr3F35covl09Kec7/sEFLt3RA4oXmewtoaanoIf67SE5Y5g==
|
||||
version "5.1.6"
|
||||
resolved "https://registry.npmjs.org/minimatch/-/minimatch-5.1.6.tgz#1cfcb8cf5522ea69952cd2af95ae09477f122a96"
|
||||
integrity sha512-lKwV/1brpG6mBUFHtb7NUmtABCb2WZZmm2wNiOA5hAb8VdCS4B3dtMWyvcoViccwAW/COERjXLt0zP1zXUN26g==
|
||||
dependencies:
|
||||
brace-expansion "^2.0.1"
|
||||
|
||||
@ -9826,9 +9833,9 @@ minimist@^1.2.0, minimist@^1.2.3, minimist@^1.2.5, minimist@^1.2.6:
|
||||
integrity sha512-Jsjnk4bw3YJqYzbdyBiNsPWHPfO++UGG749Cxs6peCu5Xg4nrena6OVxOYxrQTqww0Jmwt+Ref8rggumkTLz9Q==
|
||||
|
||||
minimist@^1.2.7:
|
||||
version "1.2.7"
|
||||
resolved "https://registry.npmmirror.com/minimist/-/minimist-1.2.7.tgz#daa1c4d91f507390437c6a8bc01078e7000c4d18"
|
||||
integrity sha512-bzfL1YUZsP41gmu/qjrEk0Q6i2ix/cVeAhbCbqH9u3zYutS1cLg00qhrD0M2MVdCcx4Sc0UpP2eBWo9rotpq6g==
|
||||
version "1.2.8"
|
||||
resolved "https://registry.npmjs.org/minimist/-/minimist-1.2.8.tgz#c1a464e7693302e082a075cee0c057741ac4772c"
|
||||
integrity sha512-2yyAR8qBkN3YuheJanUpWC5U3bb5osDywNB8RzDVlDwDHbocAJveqqj1u8+SVD7jkWT4yvsHCpWqqWqAxb0zCA==
|
||||
|
||||
minipass-collect@^1.0.2:
|
||||
version "1.0.2"
|
||||
@ -10027,7 +10034,7 @@ move-concurrently@^1.0.1:
|
||||
|
||||
ms@2.0.0:
|
||||
version "2.0.0"
|
||||
resolved "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz"
|
||||
resolved "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz#5608aeadfc00be6c2901df5f9861788de0d597c8"
|
||||
integrity sha512-Tpp60P6IUJDTuOq/5Z8cdskzJujfwqfOTkrwIwj7IRISpnkJnT6SyJ4PCPnGMoFjC9ddhal5KVIYtAt97ix05A==
|
||||
|
||||
ms@2.1.2:
|
||||
@ -10259,7 +10266,7 @@ npm-run-path@^4.0.1:
|
||||
|
||||
nth-check@^2.0.1:
|
||||
version "2.1.1"
|
||||
resolved "https://registry.npmjs.org/nth-check/-/nth-check-2.1.1.tgz"
|
||||
resolved "https://registry.npmjs.org/nth-check/-/nth-check-2.1.1.tgz#c9eab428effce36cd6b92c924bdb000ef1f1ed1d"
|
||||
integrity sha512-lqjrjmaOoAnWfMmBPL+XNnynZh2+swxiX3WUE0s4yEHI6m+AwrK2UZOimIRl3X/4QctVqS8AiZjFqyOGrMXb/w==
|
||||
dependencies:
|
||||
boolbase "^1.0.0"
|
||||
@ -10768,7 +10775,7 @@ picocolors@^0.2.1:
|
||||
|
||||
picocolors@^1.0.0:
|
||||
version "1.0.0"
|
||||
resolved "https://registry.npmjs.org/picocolors/-/picocolors-1.0.0.tgz"
|
||||
resolved "https://registry.npmjs.org/picocolors/-/picocolors-1.0.0.tgz#cb5bdc74ff3f51892236eaf79d68bc44564ab81c"
|
||||
integrity sha512-1fygroTLlHu66zi26VoTDv8yRgm0Fccecssto+MhsZ0D/DGW2sm8E8AjW7NU5VVTRt5GxbeZ5qBuJr+HyLYkjQ==
|
||||
|
||||
picomatch@^2.0.4, picomatch@^2.2.1, picomatch@^2.3.1:
|
||||
@ -11738,7 +11745,7 @@ regenerator-runtime@0.11, regenerator-runtime@^0.11.0:
|
||||
|
||||
regenerator-runtime@^0.13.11, regenerator-runtime@^0.13.3, regenerator-runtime@^0.13.4:
|
||||
version "0.13.11"
|
||||
resolved "https://registry.npmmirror.com/regenerator-runtime/-/regenerator-runtime-0.13.11.tgz"
|
||||
resolved "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.13.11.tgz#f6dca3e7ceec20590d07ada785636a90cdca17f9"
|
||||
integrity sha512-kY1AZVr2Ra+t+piVaJ4gxaFaReZVH40AKNo7UCX6W+dEwBo/2oZJzqfuN1qLq1oL45o56cPaTXELwrTh8Fpggg==
|
||||
|
||||
regenerator-transform@^0.10.0:
|
||||
@ -13388,7 +13395,7 @@ trim-right@^1.0.1:
|
||||
|
||||
ts-node@^10.9.1:
|
||||
version "10.9.1"
|
||||
resolved "https://registry.npmmirror.com/ts-node/-/ts-node-10.9.1.tgz#e73de9102958af9e1f0b168a6ff320e25adcff4b"
|
||||
resolved "https://registry.npmjs.org/ts-node/-/ts-node-10.9.1.tgz#e73de9102958af9e1f0b168a6ff320e25adcff4b"
|
||||
integrity sha512-NtVysVPkxxrwFGUUxGYhfux8k78pQB3JqYBXlLRZgdGUqTO5wU/UyHop5p70iEbGhB7q5KmiZiU0Y3KlJrScEw==
|
||||
dependencies:
|
||||
"@cspotcode/source-map-support" "^0.8.0"
|
||||
@ -13422,7 +13429,7 @@ tslib@1.10.0:
|
||||
|
||||
tslib@^1.10.0, tslib@^1.8.1:
|
||||
version "1.14.1"
|
||||
resolved "https://registry.npmmirror.com/tslib/-/tslib-1.14.1.tgz"
|
||||
resolved "https://registry.npmjs.org/tslib/-/tslib-1.14.1.tgz#cf2d38bdc34a134bcaf1091c41f6619e2f672d00"
|
||||
integrity sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg==
|
||||
|
||||
tslib@^2.0.3, tslib@^2.3.0:
|
||||
@ -13631,7 +13638,7 @@ universalify@^0.2.0:
|
||||
|
||||
universalify@^2.0.0:
|
||||
version "2.0.0"
|
||||
resolved "https://registry.npmmirror.com/universalify/-/universalify-2.0.0.tgz#75a4984efedc4b08975c5aeb73f530d02df25717"
|
||||
resolved "https://registry.npmjs.org/universalify/-/universalify-2.0.0.tgz#75a4984efedc4b08975c5aeb73f530d02df25717"
|
||||
integrity sha512-hAZsKq7Yy11Zu1DE0OzWjw7nnLZmJZYTDZZyEFHZdUhV8FkH5MCfoU1XMaxXovpyW5nq5scPqq0ZDP9Zyl04oQ==
|
||||
|
||||
unpipe@1.0.0, unpipe@~1.0.0:
|
||||
@ -13804,7 +13811,7 @@ uuid@^8.3.2:
|
||||
|
||||
v8-compile-cache-lib@^3.0.1:
|
||||
version "3.0.1"
|
||||
resolved "https://registry.npmmirror.com/v8-compile-cache-lib/-/v8-compile-cache-lib-3.0.1.tgz#6336e8d71965cb3d35a1bbb7868445a7c05264bf"
|
||||
resolved "https://registry.npmjs.org/v8-compile-cache-lib/-/v8-compile-cache-lib-3.0.1.tgz#6336e8d71965cb3d35a1bbb7868445a7c05264bf"
|
||||
integrity sha512-wa7YjyUGfNZngI/vtK0UHAN+lgDCxBPCylVXGp0zu59Fz5aiGtNXaq3DhIov063MorB+VfufLh3JlF2KdTK3xg==
|
||||
|
||||
v8-compile-cache@^2.3.0:
|
||||
@ -14224,7 +14231,7 @@ wrap-ansi@^6.2.0:
|
||||
|
||||
wrappy@1:
|
||||
version "1.0.2"
|
||||
resolved "https://registry.npmjs.org/wrappy/-/wrappy-1.0.2.tgz"
|
||||
resolved "https://registry.npmjs.org/wrappy/-/wrappy-1.0.2.tgz#b5243d8f3ec1aa35f1364605bc0d1036e30ab69f"
|
||||
integrity sha512-l4Sp/DRseor9wL6EvV2+TuQn63dMkPjZ/sp9XkghTEbV9KlPS1xUsZ3u7/IQO4wxtcFB4bgpQPRcR3QCvezPcQ==
|
||||
|
||||
write-file-atomic@^2.0.0:
|
||||
@ -14296,7 +14303,7 @@ xml2js@^0.4.19, xml2js@^0.4.22, xml2js@^0.4.23, xml2js@^0.4.5:
|
||||
|
||||
xmlbuilder@~11.0.0:
|
||||
version "11.0.1"
|
||||
resolved "https://registry.npmjs.org/xmlbuilder/-/xmlbuilder-11.0.1.tgz"
|
||||
resolved "https://registry.npmjs.org/xmlbuilder/-/xmlbuilder-11.0.1.tgz#be9bae1c8a046e76b31127726347d0ad7002beb3"
|
||||
integrity sha512-fDlsI/kFEx7gLvbecc0/ohLG50fugQp8ryHzMTuW9vSa1GJ0XYWKnhsUx7oie3G98+r56aTQIUB4kht42R3JvA==
|
||||
|
||||
xmlchars@^2.1.1, xmlchars@^2.2.0:
|
||||
@ -14395,7 +14402,7 @@ yauzl@2.10.0, yauzl@^2.10.0:
|
||||
|
||||
yn@3.1.1:
|
||||
version "3.1.1"
|
||||
resolved "https://registry.npmmirror.com/yn/-/yn-3.1.1.tgz#1e87401a09d767c1d5eab26a6e4c185182d2eb50"
|
||||
resolved "https://registry.npmjs.org/yn/-/yn-3.1.1.tgz#1e87401a09d767c1d5eab26a6e4c185182d2eb50"
|
||||
integrity sha512-Ux4ygGWsu2c7isFWe8Yu1YluJmqVhxqK2cLXNQA5AcC3QfbGNpM7fu0Y8b/z16pXLnFxZYvWhd3fhBY9DLmC6Q==
|
||||
|
||||
yocto-queue@^0.1.0:
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user