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

Merge branch 'dev' of ssh://git.online.zzfzyc.com:10022/mp/spider_cloud_warehouse into 订单页

Browse Source
This commit is contained in:
Haiyi
2022-11-01 17:25:58 +08:00
parent 15dfae35fa 2811f7eb60
commit 7eb3394cd8
16 changed files with 464 additions and 260 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/pages/colorRelated/components/bluetooth/LinkBlueTooth.tsx
+2
View File
@@ -26,6 +26,7 @@ export default memo(() => {
}, [state.available, state.connected])
const linkName = useMemo(() => {
console.log('state linkName', state)
return state.connected?.localName || ''
}, [state.connected])
@@ -37,6 +38,7 @@ export default memo(() => {
const [popupShow, setPopupShow] = useState(false)
//显示设备列表
const onFindDevice = () => {
console.log('linkStatus==>', linkStatus)
if (linkStatus == 1) {
Taro.showToast({
title: '请打开蓝牙',
src/pages/colorRelated/components/css/linkBlueTooth.module.scss
+1
View File
@@ -4,6 +4,7 @@
border-radius: 10px;
.bluetooth_link {
width: 100%;
display: flex;
align-items: center;
src/pages/colorRelated/takeColor/components/Texture/index.tsx
+35 -18
View File
@@ -1,38 +1,55 @@
import { View, Text,Image } from '@tarojs/components'
import { View, Text, Image } from '@tarojs/components'
import styles from './index.module.scss'
import classnames from 'classnames'
import { FC, useRef, useState } from "react"
import { FC, memo, useMemo, useRef, useState } from 'react'
import Upload from '../Upload'
import {screenshot} from '@/common/util'
import { screenshot } from '@/common/util'
import { formatImgUrl, formatUrl } from '@/common/format'
type PropsType = {
onUploadConfirm?: Function
interface TextureEvent {
onUploadConfirm?: (file: string) => void
}
interface PropsType extends TextureEvent {
list: any[]
detail: any
uploadConfirmState: boolean
}
const Texture:FC<PropsType> = (params) => {
const {onUploadConfirm} = params
const handleUploadConfirm = () => {
onUploadConfirm && onUploadConfirm()
const Texture: FC<PropsType> = params => {
const { onUploadConfirm, list, detail, uploadConfirmState } = params
console.log('detail==>', detail)
const handleUploadConfirm = (url) => {
onUploadConfirm && onUploadConfirm(url)
}
const uploadEl = useRef()
const uploadEl = useRef<any>(null)
const handleOpenModal = () => {
uploadEl.current.handleTriggerUploadModal(true)
}
const calcNoSampling = useMemo(() => {
let len = list?.filter(item => {
return item.currentLab?.l == 0 && item.currentLab?.a == 0 && item.currentLab?.b == 0
})
return len?.length ?? 0
}, [list])
return (
<View className={styles['texture-container']}>
<View className={styles['tc-info']}>
<View onClick={uploadEl.handleTriggerUploadModal(true)} className={styles['tc-i-upload']}>
{detail.texture_url && <Image src={screenshot(detail.texture_url)} />}
<View v-else className='tc-i-u-box'>
<View onClick={handleOpenModal} className={styles['tc-i-upload']}>
{detail.texture_url && <Image src={formatUrl(detail.texture_url)} />}
<View v-else className={styles['tc-i-u-box']}>
{/* TODO: 更换iconfont */}
<Text className='iconfont icon-shangchuanzhaopian'></Text>
<View>上传纹理</View>
</View>
</View>
<View className={styles['tc-i-num']}>
<View>
<View className='color-blue'>{(data?.list?.length ?? 0) - calcNoSampling}</View>
<View className='color-blue'>{(list?.length ?? 0) - calcNoSampling}</View>
<Text>已取样</Text>
</View>
<View>
@@ -41,7 +58,7 @@ const Texture:FC<PropsType> = (params) => {
</View>
</View>
</View>
<Upload onUploadConfirm={handleUploadConfirm} ref={uploadEl} />
<Upload uploadConfirmState={uploadConfirmState} onUploadConfirm={handleUploadConfirm} ref={uploadEl} />
</View>
)
}
src/pages/colorRelated/takeColor/components/Upload/index.tsx
+26 -9
View File
@@ -1,16 +1,20 @@
import Popup from "@/components/popup"
import { FC, useState } from "react"
import { View, Text,Image } from '@tarojs/components'
import Popup from '@/components/popup'
import { FC, forwardRef, useEffect, useImperativeHandle, useState } from 'react'
import { View, Text, Image, RootPortal } from '@tarojs/components'
import styles from './index.module.scss'
import classnames from 'classnames'
import Taro from "@tarojs/taro"
import Taro from '@tarojs/taro'
type PropsType = {
interface UploadColorEvent {
onUploadConfirm?: Function
}
const UploadColor: FC<PropsType> = (params) => {
const { onUploadConfirm } = params
interface PropsType extends UploadColorEvent {
uploadConfirmState: boolean
}
const UploadColor = forwardRef((params: PropsType, ref) => {
const { onUploadConfirm, uploadConfirmState } = params
const [showModal, setShowModal] = useState(false)
const [filePath, setFilePath] = useState('')
const [file, setFile] = useState({})
@@ -27,9 +31,23 @@ const UploadColor: FC<PropsType> = (params) => {
})
}
useEffect(() => {
if (uploadConfirmState) {
setFilePath('')
handleTriggerUploadModal(false)
}
}, [uploadConfirmState])
const handleTriggerUploadModal = (bool: boolean) => {
setShowModal(bool)
}
useImperativeHandle(
ref,
() => ({
handleTriggerUploadModal,
}),
[handleTriggerUploadModal],
)
const handleClear = () => {
setFilePath('')
@@ -38,7 +56,6 @@ const UploadColor: FC<PropsType> = (params) => {
onUploadConfirm && onUploadConfirm(file)
}
return (
<View className={styles['upload-container']}>
<Popup title='上传纹理' show={showModal} onClose={() => handleTriggerUploadModal(false)}>
@@ -58,5 +75,5 @@ const UploadColor: FC<PropsType> = (params) => {
</Popup>
</View>
)
}
})
export default UploadColor
src/pages/colorRelated/takeColor/index.module.scss
+8 -6
View File
@@ -21,9 +21,12 @@ page {
padding-bottom: 220px;
}
.lb-title {
position: sticky;
top: 0;
z-index: 1;
font-size: 28px;
font-weight: 400;
line-height: 38px;
background-color: #f3f3f3;
color: #707070;
border-top: 1px dashed #e4e4e4;
padding: 26px 46px;
@@ -34,7 +37,6 @@ page {
}
.lb-t-serach {
@include flex-vertical-center;
height: 100px;
}
.lb-t-serach .icon-a-sousuo1 {
font-size: 38px;
@@ -43,6 +45,7 @@ page {
.lb-t-serach .lb-t-search-content {
display: flex;
justify-content: flex-end;
align-items: center;
}
.lb-t-serach .lb-t-search-content > text {
padding: 10px 0;
@@ -72,10 +75,9 @@ page {
font-size: 30px;
}
.lb-t-sc-clear {
width: 66px;
height: 66px;
text-align: center;
line-height: 66px;
display: flex;
justify-content: center;
align-items: center;
}
.lb-t-sc-clear .icon-a-cuowuwrong {
width: 43px;
src/pages/colorRelated/takeColor/index.tsx
+150 -31
View File
@@ -1,37 +1,51 @@
import { View, Input, Text } from '@tarojs/components'
import { FC, useMemo, useState } from 'react'
import { FC, useMemo, useRef, useState } from 'react'
import LinkBlueTooth from '../components/bluetooth/LinkBlueTooth'
import SelectProduct from '@/components/selectProduct/index'
import styles from './index.module.scss'
import ColorCard from './components/ColorCard'
import IconFont from '@/components/iconfont/iconfont'
import { ColorListApi, ColorDetailedApi, TextureSaveApi, ColorSamplingSaveApi } from '@/api/index'
import { formatHashTag } from '@/common/format'
import { breakupUrl, formatHashTag, formatImgUrl, formatUrl } from '@/common/format'
import { alert } from '@/common/common'
import Texture from './components/Texture'
import useUploadCDNImg from '@/use/useUploadImage'
import { useBluetooth } from '@/use/contextBlueTooth'
import { toRgb } from '@/common/bluetooth/color/colorSpace'
// 颜色取样
const TakeColor: FC = () => {
const { state, fetchData } = ColorListApi()
const { uploadCDNImg } = useUploadCDNImg()
const { state: detail, fetchData: detailFetchData } = ColorDetailedApi()
const { state: textureSaveData, fetchData: textureSaveFetchData } = TextureSaveApi()
const { state: saveData, fetchData: saveFetchData, success: saveSuccess } = ColorSamplingSaveApi()
const { state: saveData, fetchData: saveFetchData } = ColorSamplingSaveApi()
const { measureAndGetLab, state: bluetoothState } = useBluetooth()
const [searchValue, setSearchValue] = useState('')
const [selectedProduct, setSelectedProduct] = useState<Record<string, any>>({})
const selectInput = async (event) => {
// if (event) {
// selectedProduct.value = event
// await fetchData({ id: event.id })
// data.value?.list.map((item, index) => {
// item.currnetRgb = item.rgb
// item.currentLab = item.lab
// item.sampling = !(item.currentLab?.l == 0 && item.currentLab?.a == 0 && item.currentLab?.b == 0)
// item.moveBorder = 0
// item.key = index
// })
// detailFetchData({ id: event.id })
// } else {
// data.value.list = []
// }
const selectInput = async event => {
if (event) {
alert.showLoading('正在加载颜色')
setSelectedProduct(event)
const res = await fetchData({ id: event.id })
if (res.success) {
res.data?.list.map((item, index) => {
item.currnetRgb = item.rgb
item.currentLab = item.lab
item.sampling = !(item.currentLab?.l == 0 && item.currentLab?.a == 0 && item.currentLab?.b == 0)
item.moveBorder = 0
item.key = index
})
// setListData(res.data?.list)
await detailFetchData({ id: event.id })
}
alert.hideLoading()
} else {
state.data.list = []
alert.hideLoading()
}
}
const clearSearchValue = () => {
setSearchValue('')
}
@@ -39,32 +53,102 @@ const TakeColor: FC = () => {
const handleTransfSearch = (bool: boolean) => {
setShowScreen(bool)
}
const handlePrViewRgb = (event) => {
const handlePrViewRgb = event => {
setLabPreview(event)
setShowLabPreview(true)
}
const handleTakeColor = () => {}
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<Record<string, any>[]>([])
const listData = useMemo(() => {
return state.data?.list?.filter((item) => {
return state.data?.list?.filter(item => {
if (searchValue) {
return formatHashTag(item.product_color_name, item.product_color_code)!.includes(searchValue)
}
return true
})
}, [state])
}, [state.data?.list, state])
const [showScreen, setShowScreen] = useState(false)
const onSearchInput = (event) => {
const onSearchInput = event => {
const current = event.detail.value
setSearchValue(current)
}
// 底部提交
const handleSubmit = async () => {
if (selectedProduct.id) {
let params = {
id: selectedProduct.id,
product_color_absorb: state.data.list.map(item => {
return {
product_color_id: item.product_color_id,
l: item.currentLab.l,
a: item.currentLab.a,
b: item.currentLab.b,
// absorb_lab_time: `${dayjs(new Date())
// .add(0, "day")
// .format("YYYY-MM-DD")} 00:00:00`
absorb_lab_time: new Date(),
}
}),
}
alert.showLoading('保存中')
const res = await saveFetchData(params)
if (res.success) {
alert.success('保存成功')
} else {
alert.error('保存失败')
}
} else {
productSelectEl.current.clickEvent()
alert.none('请选择面料')
}
}
// 重置
const handleReset = () => {}
// 提交
const handleSubmit = () => {}
const 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
})
} else {
productSelectEl.current.clickEvent()
alert.none('请选择面料')
}
}
const [labPreview, setLabPreview] = useState({
currnetRgb: {
@@ -76,12 +160,47 @@ const TakeColor: FC = () => {
const [showLabPreview, setShowLabPreview] = useState(false)
const productSelectEl = useRef<any>(null)
const [uploadConfirmState, setUploadConfirmState] = useState(false)
const handleUploadConfirm = async file => {
setUploadConfirmState(false)
if (file) {
if (selectedProduct.id) {
alert.showLoading('上传中')
let res = await uploadCDNImg({ path: file.tempFilePath }, 'product', 'product')
if (res && res?.code == 200) {
//console.log('图片地址真实',`${IMG_CND_Prefix}${res.url}`);
// TODO: 回填到存储的地方
await textureSaveFetchData({
id: selectedProduct.id,
texture_url: breakupUrl(res.url),
upload_texture_time: new Date(),
})
await detailFetchData({ id: selectedProduct.id })
alert.none('上传成功')
setUploadConfirmState(true)
} else {
res && alert.none(`${res.message}`)
}
} else {
productSelectEl.current.clickEvent()
alert.none('请选择面料')
}
} else {
alert.none('请选择图片')
}
}
return (
<>
<View className={styles.card}>
<LinkBlueTooth />
<SelectProduct onSelect={selectInput} />
<SelectProduct selectColorId={selectedProduct?.id} onSelect={selectInput} ref={productSelectEl} />
</View>
<Texture uploadConfirmState={uploadConfirmState} onUploadConfirm={handleUploadConfirm} list={state.data.list} detail={detail.data} />
<View className={styles['list-box']}>
<View className={styles['lb-title']}>
<Text>颜色列表（{listData?.length ?? 0}）</Text>
@@ -91,14 +210,14 @@ const TakeColor: FC = () => {
<View>
<Input value={searchValue} type='text' onInput={onSearchInput} placeholder='筛选颜色或颜色编号' />
<View onClick={clearSearchValue} className={styles['lb-t-sc-clear']}>
{searchValue.length > 0 && <IconFont name='icon-guanbi' size={56}></IconFont>}
{searchValue.length > 0 && <IconFont name='icon-guanbi' size={36}></IconFont>}
</View>
</View>
<Text onClick={() => handleTransfSearch(false)}>取消</Text>
</View>
) : (
<View onClick={() => handleTransfSearch(true)}>
<IconFont name='icon-sousuo' size={56}></IconFont>
<IconFont name='icon-sousuo' size={40}></IconFont>
</View>
)}
</View>
src/pages/shopping/components/shoppingCartItem/index.tsx
+16 -10
View File
@@ -157,6 +157,11 @@ let ShoppingCartItem: FC<PropsType> = props => {
})
console.log('res===>', res)
if (res.success) {
// 转成 对象形式
// 4562: {
// id: 4562,
// ...
// }
const newGoodsKind = Object.fromEntries(
res.data[0]?.[BackEndSaleModeListFieldMap[selected]].map(item => [
item?.id,
@@ -176,17 +181,18 @@ let ShoppingCartItem: FC<PropsType> = props => {
purchaserId: id,
goodsKind: newGoodsKind,
multipleSelection: Object.fromEntries(
Object.keys(multipleSelection!).map(id => [
id,
{
Object.keys(multipleSelection!)
.map(id => [
id,
estimate_amount: newGoodsKind[id].estimate_amount,
product_code: newGoodsKind[id].product_code,
product_color_code: newGoodsKind[id].product_color_code,
sale_mode: newGoodsKind[id].sale_mode,
count: selected === EnumSaleMode.Bulk ? newGoodsKind[id].roll : Number(formatMeterDiv(newGoodsKind[id].length)),
},
]),
{
id,
estimate_amount: newGoodsKind[id].estimate_amount,
product_code: newGoodsKind[id].product_code,
product_color_code: newGoodsKind[id].product_color_code,
sale_mode: newGoodsKind[id].sale_mode,
count: selected === EnumSaleMode.Bulk ? newGoodsKind[id].roll : Number(formatMeterDiv(newGoodsKind[id].length)),
},
]),
),
},
})
src/pages/shopping/index.tsx
+23 -18
View File
@@ -15,7 +15,6 @@ import { dataLoadingStatus, debounce, getFilterData } from '@/common/util'
import { ShoppingProvider } from './components/shoppingCart/index'
import { Goods, ShoppingDispatchType, useShoppingDispatch, useShoppingState } from './context'
import { alert, goLink, isEmptyObject } from '@/common/common'
import LoadingCard from '@/components/loadingCard'
export const Shopping: FC = memo(() => {
// 计算总的预估金额
@@ -126,7 +125,7 @@ const ShoppingCartContainer: FC<InternalContainer> = () => {
useEffect(() => {
if (state.success) {
// startTransition(() => {
setShoppingCartData({ list: state.data, total: state.data.length })
setShoppingCartData({ list: state.data, total: state.data.length })
// })
}
}, [state])
@@ -134,11 +133,11 @@ const ShoppingCartContainer: FC<InternalContainer> = () => {
// 结算
const handleSettleAccount = debounce(() => {
const multipleSelection = colorStore?.[currentCheckedPurchaserId]?.['multipleSelection']
if (!multipleSelection) return Taro.showToast({ title: '请先选择客户', icon: 'error' })
if (!multipleSelection) return alert.error('请先选择客户')
const checkedGoodsKind = Object.values(multipleSelection).reduce((prev, item: Goods) => {
return [...prev, item.id]
}, [])
if (checkedGoodsKind.length === 0) return Taro.showToast({ title: '请先选择商品', icon: 'error' })
if (checkedGoodsKind.length === 0) return alert.error('请先选择商品')
goLink('/pages/submitOrder/index', {
purchaser_id: currentCheckedPurchaserId,
sale_mode: currentCheckedSaleMode,
@@ -151,24 +150,36 @@ const ShoppingCartContainer: FC<InternalContainer> = () => {
// 批量某个客户的删除商品
const handleDelete = async () => {
const multipleSelection = colorStore?.[currentCheckedPurchaserId]?.['multipleSelection']
const multipleSelection = colorStore?.[currentCheckedPurchaserId].multipleSelection
let checked: Goods[] = Object.values(multipleSelection!)
if (checked.length === 0) {
return Taro.showToast({ title: '请选择商品', icon: 'error' })
return alert.error('请选择商品')
}
console.log('checked==>', checked)
Taro.showModal({
title: '要删除这些商品吗？',
success: async function(res) {
if (res.confirm) {
alert.showLoading('删除中')
const res = await deleteApi({
ids: checked.map(item => item.id).join(','),
})
if (res.success) {
alert.hideLoading()
alert.success('删除成功')
// 清空多选
dispatch({
type: ShoppingDispatchType.UPDATE_CHANGED_CHECKBOX,
data: {
purchaserId: currentCheckedPurchaserId,
goodsKind: colorStore?.[currentCheckedPurchaserId].goodsKind,
multipleSelection: {},
},
})
fetchData(searchOptions)
// Observer.notify(currentCheckedPurchaserId)
} else {
alert.hideLoading()
alert.none(res.msg)
}
}
@@ -177,13 +188,10 @@ const ShoppingCartContainer: FC<InternalContainer> = () => {
}
// 全选
const handleSelectAllCheckbox = (isSelectAll: boolean) => {
console.log('handleSelectAllCheckbox', isSelectAll)
const targetGoodsKind = colorStore?.[currentCheckedPurchaserId]?.['goodsKind']
if (!targetGoodsKind) return Taro.showToast({ title: '请先选择客户', icon: 'error' })
console.log('targetGoodsKind==>', targetGoodsKind)
const targetGoodsKind = colorStore?.[currentCheckedPurchaserId].goodsKind
if (!targetGoodsKind) return alert.error('请先选择客户')
const tempObject = { ...targetGoodsKind }
console.log('tempObject==>', tempObject)
dispatch({
type: ShoppingDispatchType.UPDATE_CHANGED_CHECKBOX,
data: {
@@ -201,12 +209,10 @@ const ShoppingCartContainer: FC<InternalContainer> = () => {
setRefreshStatus(true)
const res = await fetchData(searchOptions)
if (res.success) {
console.log('请求 成功')
setRefreshStatus(false)
Taro.showToast({ title: '刷新成功', icon: 'success' })
alert.success('刷新成功')
} else {
console.log('请求 失败')
Taro.showToast({ title: '刷新失败', icon: 'error' })
alert.error('刷新失败')
setRefreshStatus(false)
}
}
@@ -228,11 +234,10 @@ const ShoppingCartContainer: FC<InternalContainer> = () => {
<View className={classnames('flex-item', 'flex-col', styles['shopping--context'])}>
<View id='shoppingListContainer' className={classnames(styles.shopping__list__container, 'flex-item')} style={{ height: listHeightRef.current }}>
<InfiniteScroll statusMore={statusMore} refresherEnabled={true} selfOnRefresherRefresh={handleRefresh} refresherTriggered={refreshStatus}>
{
// isPending ? (
{// isPending ? (
// null
// ) : (
!!shoppingCartData?.list?.length &&
!!shoppingCartData?.list?.length &&
shoppingCartData?.list?.map((item, index) => {
return <ItemList itemData={item} key={index}></ItemList>
})