From b5de3a031be2e72151a9260809f417fbbc1dfb27 Mon Sep 17 00:00:00 2001 From: xuan Date: Wed, 2 Nov 2022 17:53:13 +0800 Subject: [PATCH] =?UTF-8?q?=E2=9C=A8=20feat(=E9=A2=9C=E8=89=B2=E5=8F=96?= =?UTF-8?q?=E6=A0=B7|=E5=8F=96=E8=89=B2=E6=9F=A5=E6=89=BE|=E6=A0=B7?= =?UTF-8?q?=E5=93=81=E5=AF=B9=E6=AF=94):=20=E5=B7=B2=E5=AE=8C=E6=88=90?= =?UTF-8?q?=E9=A2=9C=E8=89=B2=E5=AF=B9=E6=AF=94|=E5=8F=96=E8=89=B2?= =?UTF-8?q?=E6=9F=A5=E6=89=BE|=E6=A0=B7=E5=93=81=E5=AF=B9=E6=AF=94100%?= =?UTF-8?q?=E3=80=91?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- project.private.config.json | 14 ++ src/api/product/findColor.ts | 1 + src/api/product/product.ts | 2 +- .../components/HistoryColor/index.tsx | 100 ++++++++----- .../findColor/components/LabColor/index.tsx | 2 +- .../RecommendColor/index.module.scss | 6 +- src/pages/colorRelated/findColor/index.tsx | 67 ++++----- .../colorRelated/sampleComparison/index.tsx | 21 +-- .../takeColor/components/ColorCard/index.tsx | 82 ++++++++--- .../colorRelated/takeColor/index.module.scss | 65 ++++----- src/pages/colorRelated/takeColor/index.tsx | 136 ++++++++---------- src/styles/common.scss | 3 + src/use/contextBlueTooth.tsx | 4 +- src/use/useHttp.ts | 14 +- 14 files changed, 299 insertions(+), 218 deletions(-) diff --git a/project.private.config.json b/project.private.config.json index af25df0..1da5fee 100644 --- a/project.private.config.json +++ b/project.private.config.json @@ -197,6 +197,20 @@ "query": "", "launchMode": "default", "scene": null + }, + { + "name": "", + "pathName": "pages/colorRelated/findColor/index", + "query": "", + "launchMode": "default", + "scene": null + }, + { + "name": "", + "pathName": "pages/colorRelated/sampleComparison/index", + "query": "", + "launchMode": "default", + "scene": null } ] } diff --git a/src/api/product/findColor.ts b/src/api/product/findColor.ts index 19b3386..5cdcd4b 100644 --- a/src/api/product/findColor.ts +++ b/src/api/product/findColor.ts @@ -7,5 +7,6 @@ export const FindColorListApi = () => { return useRequest({ url: `/v1/mp/product/color/absorb/match`, method: 'get', + pagination: true }) } diff --git a/src/api/product/product.ts b/src/api/product/product.ts index 2e1e927..e559de7 100644 --- a/src/api/product/product.ts +++ b/src/api/product/product.ts @@ -3,7 +3,7 @@ import { useRequest } from '@/use/useHttp' //取色对比 export const productabsorbcontrast = () => { return useRequest({ - url: `/v1/mall/product/color/absorb/contrast`, + url: `/v1/mp/product/color/absorb/contrast`, method: 'get', }) } diff --git a/src/pages/colorRelated/findColor/components/HistoryColor/index.tsx b/src/pages/colorRelated/findColor/components/HistoryColor/index.tsx index 1335fcb..4a579aa 100644 --- a/src/pages/colorRelated/findColor/components/HistoryColor/index.tsx +++ b/src/pages/colorRelated/findColor/components/HistoryColor/index.tsx @@ -1,69 +1,97 @@ -import Popup from "@/components/popup" -import { ScrollView, View } from "@tarojs/components" -import { FC, useEffect, useState } from "react" +import Popup from '@/components/popup' +import { ScrollView, View } from '@tarojs/components' +import { FC, forwardRef, useEffect, useImperativeHandle, useState } from 'react' import styles from './index.module.scss' -import { formatDateTime} from "@/common/format"; -import {toRgb} from '@/common/bluetooth/color/colorSpace' -import Taro from "@tarojs/taro"; +import { formatDateTime, formatHashTag } from '@/common/format' +import { toRgb } from '@/common/bluetooth/color/colorSpace' +import Taro from '@tarojs/taro' +import { usePropsValue } from '@/use/useCommon' type PropsType = { showModal: boolean - onColor?:Function + onVisibleChange?: (visible: boolean) => void + onColor?: Function } +type HistoryListItem = { + p_time: number + lab: number[] + code: string + name: string +} +const HistoryColor: FC = forwardRef((props, ref) => { + const { onColor, showModal, onVisibleChange } = props -const HistoryColor: FC = (props) => { - - - const { onColor, showModal } = props - const [show, setShow] = useState(false) - + const [visible, setVisible] = usePropsValue({ + value: showModal, + defaultValue: showModal, + onChange: onVisibleChange, + }) useEffect(() => { - setShow(showModal) - }, [showModal]) - + if (visible) { + getList() + } + }, [visible]) + + useImperativeHandle( + ref, + () => { + return { + show: () => setVisible(true), + hide: () => setVisible(false), + visible, + } + }, + [visible], + ) const closeEven = () => { - setShow(false) + console.log('closeEven') + setVisible(false) } - const [list, setList] = useState([ - { - p_time: 0, - lab: [], - code: '', - name: '' - } - ]) + //获取本地列表（无差别存储版本） + const getList = () => { + let historyColorList = Taro.getStorageSync('historyColor') + console.log('historyColorList==>', historyColorList) + setList(historyColorList || []) + } + + const [list, setList] = useState([]) //保留1位小数 const noScale = (val, num = 1) => { return val?.toFixed(num) } //rgb转换字符串 - const labRoRgb = (val) => { + const labRoRgb = val => { const rgb = toRgb(val) return `rgb(${rgb[0]},${rgb[1]},${rgb[2]})` } - const getInfo = (item) => { - onColor && onColor(item) + const getInfo = val => { + const index = list.findIndex(item => item.p_time == val.p_time) + let tempList = JSON.parse(JSON.stringify(list)) + tempList.splice(index, 1) + tempList.unshift(val) + setList(tempList) + Taro.setStorageSync('historyColor', tempList) + onColor && onColor(val) + setVisible(false) } - - return ( - + - {!!list?.length ? ( + {list?.length ? ( list.map((item, index) => { return ( - getInfo(item)}> + getInfo(item)}> - {item.code + ' ' + item.name} + {formatHashTag(item.code, item.name)} {formatDateTime(item.p_time)} @@ -78,12 +106,12 @@ const HistoryColor: FC = (props) => { ) }) ) : ( - 暂无数据 + 暂无数据 )} ) -} +}) export default HistoryColor diff --git a/src/pages/colorRelated/findColor/components/LabColor/index.tsx b/src/pages/colorRelated/findColor/components/LabColor/index.tsx index 077fc22..cc56910 100644 --- a/src/pages/colorRelated/findColor/components/LabColor/index.tsx +++ b/src/pages/colorRelated/findColor/components/LabColor/index.tsx @@ -37,7 +37,7 @@ const LabColor: FC = (props) => { return ( - {!!labObj.lab.length ? '' : '点击取色'} + {labObj.lab.length ? '' : '点击取色'} diff --git a/src/pages/colorRelated/findColor/components/RecommendColor/index.module.scss b/src/pages/colorRelated/findColor/components/RecommendColor/index.module.scss index 0b1633a..a994187 100644 --- a/src/pages/colorRelated/findColor/components/RecommendColor/index.module.scss +++ b/src/pages/colorRelated/findColor/components/RecommendColor/index.module.scss @@ -53,8 +53,9 @@ .product_title { display: flex; justify-content: space-between; + align-items: center; .product_name { - @include common_ellipsis(); + @include common_ellipsis(2); color: #0c68c5; font-weight: 700; font-size: 28px; @@ -62,6 +63,9 @@ margin-right: 10px; } .product_num { + display: flex; + justify-content: center; + align-items: center; background: #c9e4ff; color: #00499f; padding: 3px 6px; diff --git a/src/pages/colorRelated/findColor/index.tsx b/src/pages/colorRelated/findColor/index.tsx index 344022a..a49e2f1 100644 --- a/src/pages/colorRelated/findColor/index.tsx +++ b/src/pages/colorRelated/findColor/index.tsx @@ -1,5 +1,5 @@ import { View, Text } from '@tarojs/components' -import { FC, useEffect, useState } from 'react' +import { FC, useEffect, useMemo, useState } from 'react' import styles from './index.module.scss' import LineBluetooth from '../components/bluetooth/LinkBlueTooth' import HistoryColor from './components/HistoryColor' @@ -13,29 +13,30 @@ import Taro from '@tarojs/taro' import { throttle } from '@/common/util' const FindColor: FC = () => { - const { measureAndGetLab, disconnect, connected, deviceLab } = useBluetooth() + const { measureAndGetLab, disconnect, state: bluetoothState } = useBluetooth() const { state: colorState, fetchData: ApiFindColorList } = FindColorListApi() const [list, setList] = useState([]) const [product, setProduct] = useState>({}) //获取数据 - const getData = async () => { - setList([]) - await ApiFindColorList({ + const getData = async lab => { + const res = await ApiFindColorList({ product_id: product.id, - l: labArray[0], - a: labArray[1], - b: labArray[2], + l: lab[0], + a: lab[1], + b: lab[2], }) - setList(colorState.data.list) + if (res.success) { + setList(res.data.list) + } } const [labArray, setlabArray] = useState>([]) const [labtime, setLabtime] = useState(+new Date()) //点击获取lab按钮 const labEven = throttle(async () => { - if (!connected) { + if (!bluetoothState.connected) { Taro.showToast({ title: '请先链接设备', icon: 'none' }) return } @@ -45,6 +46,7 @@ const FindColor: FC = () => { } await measureAndGetLab() }, 500) + const selectInput = (val) => { setProduct(val) setLabtime('') @@ -53,6 +55,7 @@ const FindColor: FC = () => { } const getColor = (val) => { + console.log('val===>', val) setList([]) setlabArray(val.lab) setLabtime(val.p_time) @@ -62,28 +65,26 @@ const FindColor: FC = () => { id: val.id, name: val.name, }) - getData() + getData(val.lab) } - const [listLoading, setListLoading] = useState(false) - - useEffect(() => { - setListLoading(colorState.loading) - }, [colorState]) + const handleVisibleChange = (visible) => { + setShowHistory(visible) + } const [showHistory, setShowHistory] = useState(false) - const ResultContainer = () => { - if (!listLoading && list?.length > 0) { + const ResultContainer = useMemo(() => { + if (!colorState.loading && list?.length > 0) { return - } else if (!listLoading && labArray.length == 0) { + } else if (!colorState.loading && labArray.length == 0) { return -请取色- - } else if (!listLoading && labArray.length > 0 && list?.length == 0) { + } else if (!colorState.loading && labArray.length > 0 && list?.length == 0) { return -暂无数据- - } else if (listLoading) { + } else if (colorState.loading) { return } - } + }, [colorState, list]) //历史取样 const historyShowEven = () => { @@ -95,22 +96,22 @@ const FindColor: FC = () => { Taro.showToast({ title: '请选择面料', icon: 'none' }) return } - if (deviceLab) { + if (bluetoothState.deviceLab) { setLabtime(+new Date()) - setlabArray([deviceLab.L, deviceLab.a, deviceLab.b]) + setlabArray([bluetoothState.deviceLab.L, bluetoothState.deviceLab.a, bluetoothState.deviceLab.b]) // console.log('state.labArray::',state.labArray) - localSave() - getData() + localSave([bluetoothState.deviceLab.L, bluetoothState.deviceLab.a, bluetoothState.deviceLab.b]) + getData([bluetoothState.deviceLab.L, bluetoothState.deviceLab.a, bluetoothState.deviceLab.b]) } - }, [deviceLab]) + }, [bluetoothState.deviceLab]) //本地存储取色记录(无差别存储版本) - const localSave = () => { + const localSave = lab => { let historyColorList = Taro.getStorageSync('historyColor') || [] let obj = { ...product, - p_time: labtime, - lab: labArray, + p_time: +new Date(), + lab, } historyColorList.unshift(obj) if (historyColorList.length > 30) historyColorList.pop() @@ -121,7 +122,7 @@ const FindColor: FC = () => { - + @@ -130,8 +131,8 @@ const FindColor: FC = () => { 历史取样 - - {ResultContainer()} + + {ResultContainer} ) diff --git a/src/pages/colorRelated/sampleComparison/index.tsx b/src/pages/colorRelated/sampleComparison/index.tsx index 471c377..9c033ad 100644 --- a/src/pages/colorRelated/sampleComparison/index.tsx +++ b/src/pages/colorRelated/sampleComparison/index.tsx @@ -7,6 +7,7 @@ import LinkBlueTooth from '../components/bluetooth/LinkBlueTooth' import { toRgb } from '@/common/bluetooth/color/colorSpace' import styles from './index.module.scss' import { productabsorbcontrast } from '@/api/index' +import { isObject } from '@tarojs/shared' export default () => { //搜索参数 const [searchField, setSearchField] = useState({ @@ -18,8 +19,8 @@ export default () => { b2: '', }) type ColorList = { - one?: any - two?: any + one?: Record | null + two?: Record | null } const [colorList, setColorList] = useState({ one: null, @@ -27,7 +28,7 @@ export default () => { }) const { state: colorState, measureAndGetLab } = useBluetooth() - const getLab = async (val) => { + const getLab = async val => { if (colorState.connected) { let res = await measureAndGetLab() if (val === 1) { @@ -58,14 +59,16 @@ export default () => { const [timeTwo, setTimeTwo] = useState('') useEffect(() => { if (colorState.deviceLab) { - if ((colorList as any).one?.constructor === Object) { - const rgb = toRgb([(colorList as any).one?.L, (colorList as any).one?.a, (colorList as any).one?.b]) + const one = colorList.one + const two = colorList.two + if (isObject(one)) { + const rgb = toRgb([one?.L, one?.a, one?.b]) setBlueToothColor(`rgb(${rgb[0]}, ${rgb[1]}, ${rgb[2]})`) setTime(getNowTime()) setSearchField({ ...searchField, l1: rgb[0], a1: rgb[1], b1: rgb[2] }) } - if ((colorList as any).two?.constructor === Object) { - const rgb = toRgb([(colorList as any).two?.L, (colorList as any).two?.a, (colorList as any).two?.b]) + if (isObject(two)) { + const rgb = toRgb([two?.L, two?.a, two?.b]) setBlueToothColorTwo(`rgb(${rgb[0]}, ${rgb[1]}, ${rgb[2]})`) setTimeTwo(getNowTime()) setSearchField({ ...searchField, l2: rgb[0], a2: rgb[1], b2: rgb[2] }) @@ -103,7 +106,7 @@ export default () => { ...searchField, } const res = await fetchData(query) - if (res.data) { + if (res.success) { setData(res.data) let diffarray = [ res.data.reddish && '偏红', @@ -113,7 +116,7 @@ export default () => { res.data.whitish && '偏亮', res.data.darker && '偏暗', ] - let resCont = diffarray.filter((item) => item).join(',') + let resCont = diffarray.filter(item => item).join(',') setResult(resCont) } } diff --git a/src/pages/colorRelated/takeColor/components/ColorCard/index.tsx b/src/pages/colorRelated/takeColor/components/ColorCard/index.tsx index 0a18dbd..bfc00e1 100644 --- a/src/pages/colorRelated/takeColor/components/ColorCard/index.tsx +++ b/src/pages/colorRelated/takeColor/components/ColorCard/index.tsx @@ -1,22 +1,28 @@ import { View, Text } from '@tarojs/components' -import React, { FC } from 'react' +import React, { FC, memo, useEffect, useRef, useState, useTransition } from 'react' import classnames from 'classnames' import styles from './index.module.scss' import { formatHashTag } from '@/common/format' import dayjs from 'dayjs' +import { alert } from '@/common/common' +import { BluetoothStateType } from '@/use/contextBlueTooth' +import { toRgb } from '@/common/bluetooth/color/colorSpace' type PropsType = { + currentTakeColorIndex?: number | null item?: Record - key?: any index?: number onPreviewRgb?: Function onTakeColor?: Function + measureAndGetLab: Function + bluetoothState: BluetoothStateType } -const ColorCard: FC = (params) => { - const { item = {}, index, onTakeColor, onPreviewRgb, key } = params - - const truncation = (ev) => { +const ColorCard: FC = params => { + const { item = {}, index, onTakeColor, onPreviewRgb, currentTakeColorIndex, measureAndGetLab, bluetoothState } = params + console.log('Rerender component: ColorCard', params) + console.log('item===>', item) + const truncation = ev => { if (ev) { ev += '' let index = ev.lastIndexOf('.') @@ -30,9 +36,45 @@ const ColorCard: FC = (params) => { return 0 } } + const [moveBorder, setMoveBorder] = useState(0) + const [color, setColor] = useState({ + currnetRgb: item.rgb, + currentLab: item.lab, + }) - const handleTakeColor = () => { - onTakeColor && onTakeColor(index) + useEffect(() => { + console.log('lastTakeColorIndex,index', currentTakeColorIndex, index) + if (currentTakeColorIndex != null && currentTakeColorIndex !== index) { + setMoveBorder(0) + } + }, [currentTakeColorIndex, index]) + + const handleTakeColor = async () => { + if (bluetoothState.connected) { + onTakeColor?.(index) + + setMoveBorder(1) + console.log('moveBorder==> start measure', moveBorder) + let lab = await measureAndGetLab() + //转rgb + const rgb = toRgb([lab.L, lab.a, lab.b]) + setColor({ + currnetRgb: { + r: rgb[0], + g: rgb[1], + b: rgb[2], + }, + currentLab: { + l: lab.L, + a: lab.a, + b: lab.b, + }, + }) + setMoveBorder(2) + console.log('moveBorder==> end measure', moveBorder) + } else { + alert.none('请连接蓝牙') + } } const handlePreviewRgb = () => { @@ -40,26 +82,28 @@ const ColorCard: FC = (params) => { } return ( - - + + - + - {!item.sampling && 末取样} + {color.currentLab?.l == 0 && color.currentLab?.a == 0 && color.currentLab?.b == 0 && 末取样} {formatHashTag(item.product_code, item.product_name)} - {formatHashTag(item.product_color_code, item.product_color_name)} + + {formatHashTag(item.product_color_code, item.product_color_name)}({moveBorder}) + {item.absorb_lab_time && dayjs(item.absorb_lab_time).format('YYYY-MM-DD HH:mm:ss')} @@ -67,9 +111,9 @@ const ColorCard: FC = (params) => { {item.sampling ? '重新取样' : '取样'} - L*: {truncation(item?.currentLab?.l)} - a*: {truncation(item?.currentLab?.a)} - b*: {truncation(item?.currentLab?.b)} + L*: {truncation(color?.currentLab?.l)} + a*: {truncation(color?.currentLab?.a)} + b*: {truncation(color?.currentLab?.b)} diff --git a/src/pages/colorRelated/takeColor/index.module.scss b/src/pages/colorRelated/takeColor/index.module.scss index 6bdce04..d843e6c 100644 --- a/src/pages/colorRelated/takeColor/index.module.scss +++ b/src/pages/colorRelated/takeColor/index.module.scss @@ -36,36 +36,42 @@ page { align-items: center; } .lb-t-serach { + flex: 0 1 60%; @include flex-vertical-center; -} -.lb-t-serach .icon-a-sousuo1 { - font-size: 38px; - color: #cccccc; -} -.lb-t-serach .lb-t-search-content { - display: flex; - justify-content: flex-end; - align-items: center; + .lb-t-search-content { + position: relative; + width: 100%; + display: flex; + .input-bar { + width: 100%; + box-sizing: border-box; + padding-left: 36px; + border-radius: 100px; + padding-right: 100px; + } + .lb-t-sc-clear { + position: absolute; + right: 36px; + top: 50%; + transform: translateY(-50%); + display: flex; + justify-content: center; + align-items: center; + @include flex-vertical-center; + height: 66px; + width: 66px; + border-radius: 50%; + background-color: #e7e7e7; + font-size: 28px; + } + } } .lb-t-serach .lb-t-search-content > text { padding: 10px 0; color: #707070; font-size: 24px; } -.lb-t-search-content > view { - @include flex-vertical-center; - width: 280px; - height: 66px; - background-color: #e7e7e7; - border-radius: 30px; - margin-right: 10px; - font-size: 28px; - padding-left: 20px; - padding-right: 10px; - overflow: hidden; -} .lb-title input { - width: 80%; height: 66px; background-color: #e7e7e7; font-size: 26px; @@ -74,20 +80,7 @@ page { color: #fff; font-size: 30px; } -.lb-t-sc-clear { - display: flex; - justify-content: center; - align-items: center; -} -.lb-t-sc-clear .icon-a-cuowuwrong { - width: 43px; - height: 43px; - text-align: center; - line-height: 43px; - border-radius: 50%; - background: #c7c7c7; - display: inline-block; -} + .not-list { font-size: 28px; font-weight: 400; diff --git a/src/pages/colorRelated/takeColor/index.tsx b/src/pages/colorRelated/takeColor/index.tsx index dc43b24..7f4cf91 100644 --- a/src/pages/colorRelated/takeColor/index.tsx +++ b/src/pages/colorRelated/takeColor/index.tsx @@ -1,5 +1,5 @@ import { View, Input, Text } from '@tarojs/components' -import { FC, useMemo, useRef, useState } from 'react' +import { FC, useCallback, useMemo, useRef, useState } from 'react' import LinkBlueTooth from '../components/bluetooth/LinkBlueTooth' import SelectProduct from '@/components/selectProduct/index' import styles from './index.module.scss' @@ -36,73 +36,54 @@ const TakeColor: FC = () => { item.moveBorder = 0 item.key = index }) - // setListData(res.data?.list) + setListData(res.data?.list) await detailFetchData({ id: event.id }) } alert.hideLoading() } else { - state.data.list = [] + setListData([]) alert.hideLoading() } } const clearSearchValue = () => { + console.log('asdfasdf') setSearchValue('') } - const handleTransfSearch = (bool: boolean) => { - setShowScreen(bool) - } - const handlePrViewRgb = event => { + const handlePrViewRgb = useCallback(event => { setLabPreview(event) setShowLabPreview(true) + }, []) + + const [currentTakeColorIndex, setCurrentTakeColorIndex] = useState(null) + + const handleTakeColor = (index: number) => { + + setCurrentTakeColorIndex(index) } - const lastTakeColorIndex = useRef(null) - - const handleTakeColor = async index => { - if (bluetoothState.connected) { - if (lastTakeColorIndex.current != null) { - state.data.list[lastTakeColorIndex.current].moveBorder = 0 - } - lastTakeColorIndex.current = index - let item = state.data.list[index] - item.moveBorder = 1 - let lab = await measureAndGetLab() - //转rgb - const rgb = toRgb([lab.L, lab.a, lab.b]) - - item.sampling = true - item.currnetRgb = { - r: rgb[0], - g: rgb[1], - b: rgb[2], - } - item.currentLab = { - l: lab.L, - a: lab.a, - b: lab.b, - } - item.moveBorder = 2 - } else { - alert.none('请连接蓝牙') - } - } - // const [listData, setListData] = useState[]>([]) - const listData = useMemo(() => { - return state.data?.list?.filter(item => { - if (searchValue) { - return formatHashTag(item.product_color_name, item.product_color_code)!.includes(searchValue) - } - return true - }) - }, [state.data?.list, state]) - - const [showScreen, setShowScreen] = useState(false) + const [listData, setListData] = useState[]>([]) + // const listData = useMemo(() => { + // return state.data?.list?.filter(item => { + // if (searchValue) { + // return formatHashTag(item.product_color_name, item.product_color_code)!.includes(searchValue) + // } + // return true + // }) + // }, [state.data?.list, state]) const onSearchInput = event => { const current = event.detail.value - setSearchValue(current) + if (current === '') { + setListData(state.data.list) + } else { + setListData( + state.data?.list?.filter(item => { + return formatHashTag(item.product_color_name, item.product_color_code)!.includes(current) + }), + ) + } } // 底部提交 const handleSubmit = async () => { @@ -136,14 +117,17 @@ const TakeColor: FC = () => { } // 重置 const handleReset = () => { + console.log('handleReset') if (selectedProduct.id) { - state.data.list.map(item => { - item.moveBorder = 0 - item.currnetRgb = item.rgb - item.currentLab = item.lab - item.sampling = !(item.currentLab?.l == 0 && item.currentLab?.a == 0 && item.currentLab?.b == 0) - return item - }) + setListData( + state.data.list.map(item => { + item.moveBorder = 0 + item.currnetRgb = item.rgb + item.currentLab = item.lab + item.sampling = !(item.currentLab?.l == 0 && item.currentLab?.a == 0 && item.currentLab?.b == 0) + return item + }), + ) } else { productSelectEl.current.clickEvent() alert.none('请选择面料') @@ -200,38 +184,42 @@ const TakeColor: FC = () => { - + 颜色列表（{listData?.length ?? 0}） - {showScreen ? ( - - - - - {searchValue.length > 0 && } - - - handleTransfSearch(false)}>取消 + + + + {searchValue.length > 0 && } - ) : ( - handleTransfSearch(true)}> - - - )} + - {listData ? ( + {listData.length ? ( listData.map((item, index) => { - return + return ( + + ) }) ) : ( -请取色- )} - 重置 + + 重置 + 提交 diff --git a/src/styles/common.scss b/src/styles/common.scss index 7298a10..39e7cb0 100644 --- a/src/styles/common.scss +++ b/src/styles/common.scss @@ -92,3 +92,6 @@ $customTabBarHeight: 100px; content: 'E'; font-size: $font_size; } +.filter{ + filter: blur(1); +} diff --git a/src/use/contextBlueTooth.tsx b/src/use/contextBlueTooth.tsx index 7fb43ce..ce97242 100644 --- a/src/use/contextBlueTooth.tsx +++ b/src/use/contextBlueTooth.tsx @@ -14,7 +14,7 @@ interface params { } const Context = React.createContext(null) -interface stateStype { +export interface BluetoothStateType { listeners: any discovering: boolean available: boolean @@ -39,7 +39,7 @@ interface stateStype { deviceLab: any } -let stateObj: stateStype = { +let stateObj: BluetoothStateType = { /** 事件监听器 */ listeners: new Set(), /** 正在扫描设备 */ diff --git a/src/use/useHttp.ts b/src/use/useHttp.ts index 3373d8e..3d3cde6 100644 --- a/src/use/useHttp.ts +++ b/src/use/useHttp.ts @@ -8,16 +8,16 @@ import useLoginRequest from './useLoginRequest' type Params = { code: string | null - success: true | false + success: boolean data: any msg: string - loading: true | false + loading: boolean | null error: any query: any filter: any sort: any total: number - multiple: true | false // 请求多次 + multiple: boolean // 请求多次 count: number // 第几次请求 token: string // token page?: number @@ -31,9 +31,9 @@ type option = { data?: OptionData page?: number pageSize?: number - pagination?: true | false + pagination?: boolean base_url?: string - apiMsgStatus?: true | false + apiMsgStatus?: boolean } /** @@ -110,11 +110,13 @@ export const useRequest = ( success: false, // 请求是否成功 data: {}, msg: '', - loading: true, + loading: null, error: null, query: {}, filter: null, sort: '', + page: options.page || 1, + pageSize: options.pageSize || 24, total: 0, multiple: true, // 请求多次 count: 0, // 第几次请求