商城测试版v7
This commit is contained in:
parent
2b4017274a
commit
c646bac0a4
@ -1,9 +1,10 @@
|
|||||||
import { formatImgUrl } from "@/common/fotmat";
|
import { formatImgUrl, formatRemoveHashTag } from "@/common/fotmat";
|
||||||
import Preview from "@/pages/details/components/preview";
|
import Preview from "@/pages/details/components/preview";
|
||||||
import { Image, View } from "@tarojs/components";
|
import { Image, View } from "@tarojs/components";
|
||||||
import { memo, useMemo, useState } from "react";
|
import { memo, useCallback, useEffect, useMemo, useState } from "react";
|
||||||
import styles from './index.module.scss'
|
import styles from './index.module.scss'
|
||||||
import Taro from "@tarojs/taro";
|
import Taro from "@tarojs/taro";
|
||||||
|
import LabAndImgShow from "../LabAndImgShow";
|
||||||
|
|
||||||
//该组件宽高为100%需调整外层元素宽高
|
//该组件宽高为100%需调整外层元素宽高
|
||||||
type Param = {
|
type Param = {
|
||||||
@ -11,10 +12,14 @@ type Param = {
|
|||||||
texture_url?: string, //纹理图路径
|
texture_url?: string, //纹理图路径
|
||||||
lab?: {l:number, a:number, b:number}, //lab
|
lab?: {l:number, a:number, b:number}, //lab
|
||||||
rgb?: {r:number, g:number, b:number} //rgb
|
rgb?: {r:number, g:number, b:number} //rgb
|
||||||
|
title?: string
|
||||||
},
|
},
|
||||||
checkStatus: false|true
|
showStatus?: true|false,
|
||||||
|
onClick?: (val: Param['value']) => void
|
||||||
}
|
}
|
||||||
export default memo(({value, checkStatus = false}:Param) => {
|
export default memo(({value, onClick, showStatus = false}:Param) => {
|
||||||
|
const [imgs, setImgs] = useState<string[]>([])
|
||||||
|
|
||||||
//lab是否都是0
|
//lab是否都是0
|
||||||
const rgbStyle = useMemo(() => {
|
const rgbStyle = useMemo(() => {
|
||||||
if(value?.lab&&(value.lab.l||value.lab.a||value.lab.b)) {
|
if(value?.lab&&(value.lab.l||value.lab.a||value.lab.b)) {
|
||||||
@ -24,27 +29,32 @@ export default memo(({value, checkStatus = false}:Param) => {
|
|||||||
}
|
}
|
||||||
}, [value])
|
}, [value])
|
||||||
|
|
||||||
const [showPreview, setShowPreview] = useState(false)
|
useEffect(() => {
|
||||||
const onClickShow = () => {
|
if(value?.texture_url) {
|
||||||
setShowPreview(() => true)
|
let res = value.texture_url.split(',').map(item => {
|
||||||
}
|
return formatImgUrl(item)
|
||||||
|
})
|
||||||
|
setImgs(() => res)
|
||||||
|
}
|
||||||
|
}, [value])
|
||||||
|
|
||||||
const onShowImage = () => {
|
const [labAndImgShow, setLabAndImgShow] = useState(false)
|
||||||
if(!checkStatus) return false
|
const closeLabAndImgShow = useCallback(() => {
|
||||||
Taro.previewImage({
|
setLabAndImgShow(false)
|
||||||
current: formatImgUrl(value?.texture_url, '!w800'), // 当前显示
|
}, [])
|
||||||
urls: [formatImgUrl(value?.texture_url, '!w800')] // 需要预览的图片http链接列表
|
const onShowLabAndImg = () => {
|
||||||
})
|
if(!showStatus) return false
|
||||||
|
setLabAndImgShow(true)
|
||||||
}
|
}
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<View className={styles.labAndImg_main}>
|
<View className={styles.labAndImg_main} onClick={() => onShowLabAndImg()}>
|
||||||
{value?.texture_url&&<Image mode="aspectFill" onClick={() => onShowImage()} src={formatImgUrl(value?.texture_url)}></Image>}
|
{imgs?.length > 0&&<Image mode="aspectFill" src={imgs[0]}></Image>}
|
||||||
{(!value?.texture_url&&rgbStyle)&&<View className={styles.boxColor} onClick={() => onClickShow()} style={{...rgbStyle}}></View>}
|
{(!imgs?.length&&rgbStyle)&&<View className={styles.boxColor} style={{...rgbStyle}}></View>}
|
||||||
{(!value?.texture_url&&!rgbStyle)&&<Image mode="aspectFill" src={formatImgUrl('')}></Image>}
|
{(!imgs?.length&&!rgbStyle)&&<Image mode="aspectFill" src={formatImgUrl('')}></Image>}
|
||||||
</View>
|
</View>
|
||||||
<Preview value={rgbStyle} show={showPreview} onClose={() => setShowPreview(false)}/>
|
<LabAndImgShow value={value} show={labAndImgShow} onClose={closeLabAndImgShow}/>
|
||||||
</>
|
</>
|
||||||
)
|
)
|
||||||
})
|
})
|
45
src/components/LabAndImgShow/index.module.scss
Normal file
45
src/components/LabAndImgShow/index.module.scss
Normal file
@ -0,0 +1,45 @@
|
|||||||
|
.main{
|
||||||
|
position: fixed;
|
||||||
|
width: 100vw;
|
||||||
|
height: 100vh;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
background-color: rgba(0,0,0, 0.8);
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: flex-start;
|
||||||
|
z-index: 9999;
|
||||||
|
.con{
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
flex-direction: column;
|
||||||
|
width: 100%;
|
||||||
|
height: 60vh;
|
||||||
|
margin-top: 100px;
|
||||||
|
padding: 20px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
.rgb{
|
||||||
|
width: 600px;
|
||||||
|
height: 600px;
|
||||||
|
border-radius: 20px;
|
||||||
|
}
|
||||||
|
image{
|
||||||
|
width:100%;
|
||||||
|
border-radius: 10px;
|
||||||
|
}
|
||||||
|
.name {
|
||||||
|
width: 488px;
|
||||||
|
height: 72px;
|
||||||
|
color: #fff;
|
||||||
|
text-align: center;
|
||||||
|
font-size: 26px;
|
||||||
|
border-radius: 20px;
|
||||||
|
line-height: 72px;
|
||||||
|
margin-top: 10px;
|
||||||
|
background-color: rgba(0,0,0, 0.5);
|
||||||
|
padding: 0 10px;
|
||||||
|
@include common_ellipsis(1);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
65
src/components/LabAndImgShow/index.tsx
Normal file
65
src/components/LabAndImgShow/index.tsx
Normal file
@ -0,0 +1,65 @@
|
|||||||
|
import { formatImgUrl } from "@/common/fotmat"
|
||||||
|
import { View } from "@tarojs/components"
|
||||||
|
import { useEffect, useMemo, useState } from "react"
|
||||||
|
import styles from './index.module.scss'
|
||||||
|
import Taro from '@tarojs/taro'
|
||||||
|
|
||||||
|
|
||||||
|
export type colorParams = {
|
||||||
|
value?: {
|
||||||
|
texture_url?: string, //纹理图路径
|
||||||
|
lab?: {l:number, a:number, b:number}, //lab
|
||||||
|
rgb?: {r:number, g:number, b:number} //rgb
|
||||||
|
title?: string //标题
|
||||||
|
},
|
||||||
|
show?: false|true
|
||||||
|
onClose?: () => void,
|
||||||
|
showNumber?: number, //图片显示张数,0不限制
|
||||||
|
}
|
||||||
|
export default ({value, show = false, onClose, showNumber = 1}: colorParams) => {
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
if(show&&rgbStyle) setLabShow(() => true)
|
||||||
|
if(show&&value?.texture_url) onShowImage()
|
||||||
|
if(!show) setLabShow(() => false)
|
||||||
|
}, [show])
|
||||||
|
|
||||||
|
//显示颜色
|
||||||
|
const [labShow, setLabShow] = useState(false)
|
||||||
|
//lab是否都是0
|
||||||
|
const rgbStyle = useMemo(() => {
|
||||||
|
if(value?.lab&&(value.lab.l||value.lab.a||value.lab.b)) {
|
||||||
|
return {'backgroundColor':`rgb(${value.rgb?.r} ${value.rgb?.g} ${value.rgb?.b})`}
|
||||||
|
} else {
|
||||||
|
return null
|
||||||
|
}
|
||||||
|
}, [value])
|
||||||
|
|
||||||
|
|
||||||
|
//显示图片
|
||||||
|
const onShowImage = () => {
|
||||||
|
onClose?.()
|
||||||
|
let res: string[] = []
|
||||||
|
if(value?.texture_url) {
|
||||||
|
res = value?.texture_url?.split(',').map(item => {
|
||||||
|
return formatImgUrl(item)
|
||||||
|
})
|
||||||
|
}
|
||||||
|
let n_res = showNumber == 0? res : res?.splice(0, showNumber)
|
||||||
|
Taro.previewImage({
|
||||||
|
current: n_res[0],
|
||||||
|
urls: n_res
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
{labShow&&<View className={styles.main} catch-move="true" onClick={() => onClose?.()}>
|
||||||
|
<View className={styles.con}>
|
||||||
|
<View className={styles.rgb} style={rgbStyle!}></View>
|
||||||
|
<View className={styles.name}>{value?.title}</View>
|
||||||
|
</View>
|
||||||
|
</View>}
|
||||||
|
</>
|
||||||
|
)
|
||||||
|
}
|
@ -4,7 +4,6 @@
|
|||||||
.address_title{
|
.address_title{
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
color:$color_font_two;
|
|
||||||
font-size: $font_size;
|
font-size: $font_size;
|
||||||
padding: 20px;
|
padding: 20px;
|
||||||
padding-bottom: 0;
|
padding-bottom: 0;
|
||||||
|
@ -12,6 +12,7 @@ type DefaultValueParm = {name: string, id:string|number, level?: number|string}
|
|||||||
|
|
||||||
type Params = {
|
type Params = {
|
||||||
addressOnSelect?: (val:DefaultValueParm[]) => void,
|
addressOnSelect?: (val:DefaultValueParm[]) => void,
|
||||||
|
addressOnChange?: (val:DefaultValueParm[]) => void,
|
||||||
addressOnClose?: () => void,
|
addressOnClose?: () => void,
|
||||||
show?: true|false,
|
show?: true|false,
|
||||||
defaultValue?:DefaultValueParm[]
|
defaultValue?:DefaultValueParm[]
|
||||||
@ -31,6 +32,7 @@ type AddresParam = {
|
|||||||
|
|
||||||
export default memo(({
|
export default memo(({
|
||||||
addressOnSelect,
|
addressOnSelect,
|
||||||
|
addressOnChange,
|
||||||
addressOnClose,
|
addressOnClose,
|
||||||
show = false,
|
show = false,
|
||||||
defaultValue = [],
|
defaultValue = [],
|
||||||
@ -84,8 +86,15 @@ export default memo(({
|
|||||||
setSelectArr([selectArr[0], selectArr[1], {name:item.name, id:item.id, level:item.level}])
|
setSelectArr([selectArr[0], selectArr[1], {name:item.name, id:item.id, level:item.level}])
|
||||||
getDomDes('#address_tab_2')
|
getDomDes('#address_tab_2')
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
//地址数据
|
||||||
|
useEffect(() => {
|
||||||
|
if(selectArr && selectArr.length > 0)
|
||||||
|
addressOnChange?.(selectArr)
|
||||||
|
}, [selectArr])
|
||||||
|
|
||||||
//选中标题
|
//选中标题
|
||||||
const onSelectIndex = (index) => {
|
const onSelectIndex = (index) => {
|
||||||
setSelectIndex(index)
|
setSelectIndex(index)
|
||||||
@ -148,20 +157,8 @@ export default memo(({
|
|||||||
|
|
||||||
//确定按钮
|
//确定按钮
|
||||||
const submitSelect = () => {
|
const submitSelect = () => {
|
||||||
if(selectStatus) {
|
addressOnClose?.()
|
||||||
if(confirmBtnStatus || selectArr.length == 3) {
|
addressOnSelect?.(selectArr)
|
||||||
addressOnClose?.()
|
|
||||||
addressOnSelect?.(selectArr)
|
|
||||||
} else {
|
|
||||||
alert.error("请选择完整地址");
|
|
||||||
}
|
|
||||||
} else {
|
|
||||||
addressOnClose?.()
|
|
||||||
addressOnSelect?.(selectArr)
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
//获取省市区宽度
|
//获取省市区宽度
|
||||||
@ -188,7 +185,7 @@ export default memo(({
|
|||||||
|
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<Drawer showTitle={false} show={show} onClose={() => addressOnClose?.()}>
|
<Drawer showTitle={false} show={show} onClose={submitSelect}>
|
||||||
<View className={styles.address_main}>
|
<View className={styles.address_main}>
|
||||||
<View className={styles.address_title}>
|
<View className={styles.address_title}>
|
||||||
<View onClick={() => addressOnClose?.()}>取消</View>
|
<View onClick={() => addressOnClose?.()}>取消</View>
|
||||||
|
@ -65,6 +65,13 @@ export default memo(({orderInfo, onClick, fixedBottom = true}:Param) => {
|
|||||||
return false
|
return false
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
id: 5,
|
||||||
|
label: '上传物流',
|
||||||
|
validatarFunc: (orderInfo) => {
|
||||||
|
return orderInfo?.stage == ReturnStageWaitCheck.value
|
||||||
|
}
|
||||||
|
},
|
||||||
{
|
{
|
||||||
id: 6,
|
id: 6,
|
||||||
label: '取消退款',
|
label: '取消退款',
|
||||||
|
@ -13,8 +13,7 @@ type Params = {
|
|||||||
export default ({desStatus = true, productList = []}:Params) => {
|
export default ({desStatus = true, productList = []}:Params) => {
|
||||||
|
|
||||||
const labAndImgObj = useCallback((item) => {
|
const labAndImgObj = useCallback((item) => {
|
||||||
const img = item?item.texture_url.split(',')[0]:''
|
return {lab:item.lab,rgb:item.rgb,texture_url:item.texture_url}
|
||||||
return {lab:item.lab,rgb:item.rgb,texture_url:img}
|
|
||||||
}, [productList])
|
}, [productList])
|
||||||
return (
|
return (
|
||||||
<View className={styles.products_list}>
|
<View className={styles.products_list}>
|
||||||
|
@ -16,6 +16,8 @@ import Counter from "../counter";
|
|||||||
import { ApplyOrderAccessApi, GetAdminUserInfoApi, SubscriptionMessageApi } from "@/api/user";
|
import { ApplyOrderAccessApi, GetAdminUserInfoApi, SubscriptionMessageApi } from "@/api/user";
|
||||||
import useCommonData from "@/use/useCommonData";
|
import useCommonData from "@/use/useCommonData";
|
||||||
import BindSalesmanPopup from "../bindSalesmanPopup";
|
import BindSalesmanPopup from "../bindSalesmanPopup";
|
||||||
|
import LabAndImgShow from "../LabAndImgShow";
|
||||||
|
import LabAndImg from "../LabAndImg";
|
||||||
|
|
||||||
type param = {
|
type param = {
|
||||||
show?: true|false,
|
show?: true|false,
|
||||||
@ -298,7 +300,7 @@ export default ({show = false, onClose, intoStatus='shop'}: param) => {
|
|||||||
<MCheckbox disabled={selectIndex!=-1&&selectIndex!=item.sale_mode} status={!!checkboxData[item.id]} onSelect={() => selectCallBack(item)} onClose={() => colseCallBack(item)}/>
|
<MCheckbox disabled={selectIndex!=-1&&selectIndex!=item.sale_mode} status={!!checkboxData[item.id]} onSelect={() => selectCallBack(item)} onClose={() => colseCallBack(item)}/>
|
||||||
</View>
|
</View>
|
||||||
<View className={styles.img}>
|
<View className={styles.img}>
|
||||||
<Image mode="aspectFill" src={formatImgUrl(item.texture_url)}/>
|
<LabAndImg value={{lab:item.lab,rgb:item.rgb,texture_url:item.texture_url, title:item.product_color_code}}/>
|
||||||
</View>
|
</View>
|
||||||
<View className={styles.product_item_name}>
|
<View className={styles.product_item_name}>
|
||||||
<View className={styles.product_item_name_header}>
|
<View className={styles.product_item_name_header}>
|
||||||
|
@ -107,7 +107,7 @@ export default ()=>{
|
|||||||
},[formData])
|
},[formData])
|
||||||
// 设置选择地址
|
// 设置选择地址
|
||||||
const handleSetSite = (ev:any)=>{
|
const handleSetSite = (ev:any)=>{
|
||||||
if(ev.length>=3){
|
if(ev.length > 0){
|
||||||
setFormData({
|
setFormData({
|
||||||
...formData,
|
...formData,
|
||||||
siteArray: ev,
|
siteArray: ev,
|
||||||
@ -115,7 +115,7 @@ export default ()=>{
|
|||||||
district_id: ev[ev.length-1]?.id
|
district_id: ev[ev.length-1]?.id
|
||||||
})
|
})
|
||||||
}else{
|
}else{
|
||||||
alert.error("请选择完整地址");
|
alert.error("请选择地址");
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -138,7 +138,7 @@ export default ()=>{
|
|||||||
<Button style={{"background": hozon?'#007aff':''}} hoverClass="none" className={`add-address-save`} onClick={handleSave}>
|
<Button style={{"background": hozon?'#007aff':''}} hoverClass="none" className={`add-address-save`} onClick={handleSave}>
|
||||||
保存
|
保存
|
||||||
</Button>
|
</Button>
|
||||||
<Address addressOnSelect={handleSetSite} defaultValue={formData.siteArray} addressOnClose={()=>setShowSiteModal(false)} show={showSiteModal}/>
|
<Address addressOnChange={handleSetSite} defaultValue={formData.siteArray} addressOnClose={()=>setShowSiteModal(false)} show={showSiteModal}/>
|
||||||
</View>
|
</View>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
@ -13,11 +13,12 @@ import {GetColorList} from "@/api/materialColor"
|
|||||||
import {AddShoppingCartApi} from "@/api/shopCart"
|
import {AddShoppingCartApi} from "@/api/shopCart"
|
||||||
import Taro, { useRouter } from "@tarojs/taro";
|
import Taro, { useRouter } from "@tarojs/taro";
|
||||||
import UseLogin from "@/use/useLogin"
|
import UseLogin from "@/use/useLogin"
|
||||||
import { formatHashTag, formatPriceDiv } from "@/common/fotmat";
|
import { formatHashTag, formatPriceDiv, formatRemoveHashTag } from "@/common/fotmat";
|
||||||
import { debounce, getFilterData } from "@/common/util";
|
import { debounce, getFilterData } from "@/common/util";
|
||||||
import LabAndImg from "@/components/LabAndImg";
|
import LabAndImg from "@/components/LabAndImg";
|
||||||
import VirtualList from '@tarojs/components/virtual-list'
|
import VirtualList from '@tarojs/components/virtual-list'
|
||||||
import useCommonData from "@/use/useCommonData";
|
import useCommonData from "@/use/useCommonData";
|
||||||
|
import LabAndImgShow from "@/components/LabAndImgShow";
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
@ -200,12 +201,11 @@ export default memo(({show = false, onClose, title = '', productId = 0}: param)
|
|||||||
//虚拟滚动
|
//虚拟滚动
|
||||||
const Rows = useCallback(({id, index, style, data}:any) => {
|
const Rows = useCallback(({id, index, style, data}:any) => {
|
||||||
let item = data[index]
|
let item = data[index]
|
||||||
console.log('123456')
|
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
{item&&<View className={styles.item} key={item.id}>
|
{item&&<View className={styles.item} key={item.id}>
|
||||||
<View className={styles.item_color}>
|
<View className={styles.item_color}>
|
||||||
<LabAndImg value={{lab:item.lab,rgb:item.rgb,texture_url:item.texture_url}}/>
|
<LabAndImg value={{lab:item.lab,rgb:item.rgb,texture_url:item.texture_url, title:item.code}} showStatus={false}/>
|
||||||
</View>
|
</View>
|
||||||
<View className={styles.item_con}>
|
<View className={styles.item_con}>
|
||||||
<View className={styles.title}>{formatHashTag(item.code, item.name)}</View>
|
<View className={styles.title}>{formatHashTag(item.code, item.name)}</View>
|
||||||
|
@ -8,6 +8,7 @@
|
|||||||
display: flex;
|
display: flex;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
align-items: flex-start;
|
align-items: flex-start;
|
||||||
|
z-index: 999;
|
||||||
.con{
|
.con{
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
|
@ -1,6 +1,7 @@
|
|||||||
import { formatImgUrl } from "@/common/fotmat"
|
import { formatImgUrl } from "@/common/fotmat"
|
||||||
import { Image, Swiper, SwiperItem, View } from "@tarojs/components"
|
import { Image, Swiper, SwiperItem, View } from "@tarojs/components"
|
||||||
import { useMemo, useRef, useState } from "react"
|
import { useMemo, useRef, useState } from "react"
|
||||||
|
import Taro from '@tarojs/taro'
|
||||||
import styles from './index.module.scss'
|
import styles from './index.module.scss'
|
||||||
|
|
||||||
type item = {title:string, img:string, url:string, id:number}
|
type item = {title:string, img:string, url:string, id:number}
|
||||||
@ -16,21 +17,32 @@ export default ({list = []}: params) => {
|
|||||||
return list.length
|
return list.length
|
||||||
},[list])
|
},[list])
|
||||||
|
|
||||||
|
const formatImages = useMemo(() => {
|
||||||
|
return list?.map(item => formatImgUrl(item, '!w800'))
|
||||||
|
}, [list])
|
||||||
|
|
||||||
const swiperChange = (e) => {
|
const swiperChange = (e) => {
|
||||||
setPageIndex(e.detail.current + 1)
|
setPageIndex(e.detail.current + 1)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const onShowImage = () => {
|
||||||
|
Taro.previewImage({
|
||||||
|
current: formatImages[0],
|
||||||
|
urls: formatImages
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<View className={styles.swiper}>
|
<View className={styles.swiper}>
|
||||||
<Swiper className={styles.swiper_item} circular={true} onAnimationFinish={(e) => swiperChange(e)}>
|
{list.length > 0 && <Swiper className={styles.swiper_item} circular={true} onAnimationFinish={(e) => swiperChange(e)}>
|
||||||
{list?.map((item) => {
|
{list?.map((item) => {
|
||||||
return <SwiperItem key={item.id}>
|
return <SwiperItem >
|
||||||
<View className={styles.image_item} >
|
<View className={styles.image_item} onClick={onShowImage}>
|
||||||
<Image mode="aspectFill" src={formatImgUrl(item)}></Image>
|
<Image mode="aspectFill" src={formatImgUrl(item, '!w400')}></Image>
|
||||||
</View>
|
</View>
|
||||||
</SwiperItem>
|
</SwiperItem>
|
||||||
})}
|
})}
|
||||||
</Swiper>
|
</Swiper>}
|
||||||
{(list.length > 0)&&<View className={styles.page} ref={pageRef}>{pageIndex+'/'+pageCount}</View>}
|
{(list.length > 0)&&<View className={styles.page} ref={pageRef}>{pageIndex+'/'+pageCount}</View>}
|
||||||
</View>
|
</View>
|
||||||
)
|
)
|
||||||
|
@ -5,7 +5,6 @@ import classnames from "classnames";
|
|||||||
import DesSwiper from './components/swiper';
|
import DesSwiper from './components/swiper';
|
||||||
import OrderCount from './components/orderCount';
|
import OrderCount from './components/orderCount';
|
||||||
import ShopCart from '@/components/shopCart';
|
import ShopCart from '@/components/shopCart';
|
||||||
import Preview,{colorItem} from './components/preview';
|
|
||||||
import styles from './index.module.scss'
|
import styles from './index.module.scss'
|
||||||
import { useCallback, useEffect, useMemo, useState } from 'react';
|
import { useCallback, useEffect, useMemo, useState } from 'react';
|
||||||
import {formatHashTag} from '@/common/fotmat'
|
import {formatHashTag} from '@/common/fotmat'
|
||||||
@ -20,6 +19,7 @@ import AddCollection from '@/components/addCollection';
|
|||||||
import { AddFavoriteApi, DelFavoriteProductApi } from '@/api/favorite';
|
import { AddFavoriteApi, DelFavoriteProductApi } from '@/api/favorite';
|
||||||
import useCommonData from '@/use/useCommonData';
|
import useCommonData from '@/use/useCommonData';
|
||||||
import { IMG_CND_Prefix } from '@/common/constant';
|
import { IMG_CND_Prefix } from '@/common/constant';
|
||||||
|
import LabAndImgShow from '@/components/LabAndImgShow';
|
||||||
|
|
||||||
type item = {title:string, img:string, url:string, id:number}
|
type item = {title:string, img:string, url:string, id:number}
|
||||||
|
|
||||||
@ -95,19 +95,6 @@ export default (props:Params) => {
|
|||||||
// `
|
// `
|
||||||
const html = ``
|
const html = ``
|
||||||
|
|
||||||
//弹窗提示
|
|
||||||
const [colorInfo, setColorInfo] = useState<colorItem>()
|
|
||||||
const [showPreview, setShowPreview] = useState(false)
|
|
||||||
const getColorItem = (item) => {
|
|
||||||
setColorInfo({
|
|
||||||
title: item.code,
|
|
||||||
texture_url: item.texture_url,
|
|
||||||
lab: item.lab,
|
|
||||||
rgb: item.rgb
|
|
||||||
})
|
|
||||||
setShowPreview(true)
|
|
||||||
}
|
|
||||||
|
|
||||||
const {setSortCode, userInfo : userObj } = useUserInfo()
|
const {setSortCode, userInfo : userObj } = useUserInfo()
|
||||||
//详情页获取分享短码
|
//详情页获取分享短码
|
||||||
const {ShareDetail} = SHARE_SCENE
|
const {ShareDetail} = SHARE_SCENE
|
||||||
@ -209,9 +196,9 @@ export default (props:Params) => {
|
|||||||
<View className={styles.title}>色号 ({productInfo?.product_color_list?.length})</View>
|
<View className={styles.title}>色号 ({productInfo?.product_color_list?.length})</View>
|
||||||
<View className={styles.list}>
|
<View className={styles.list}>
|
||||||
{productInfo?.product_color_list?.map(item => {
|
{productInfo?.product_color_list?.map(item => {
|
||||||
return <View className={styles.item} onClick={() => getColorItem(item)}>
|
return <View key={item.id} className={styles.item}>
|
||||||
<View className={styles.item_color}>
|
<View className={styles.item_color}>
|
||||||
<LabAndImg value={{lab:item.lab,rgb:item.rgb,texture_url:item.texture_url}}/>
|
<LabAndImg value={{lab:item.lab,rgb:item.rgb,texture_url:item.texture_url, title: item.code}} showStatus={true}/>
|
||||||
</View>
|
</View>
|
||||||
<View className={styles.item_name}>{item.code}</View>
|
<View className={styles.item_name}>{item.code}</View>
|
||||||
</View>
|
</View>
|
||||||
|
@ -151,7 +151,8 @@ import { throttle } from "@/common/util";
|
|||||||
return false
|
return false
|
||||||
}
|
}
|
||||||
let showModalRes = await Taro.showModal({
|
let showModalRes = await Taro.showModal({
|
||||||
content: '确定提交订单?',
|
title: '确定提交订单?',
|
||||||
|
content: `发货方式为${submitOrderData?.shipment_mode == 1?'自提':'物流'}`,
|
||||||
confirmText: '确定',
|
confirmText: '确定',
|
||||||
cancelText: '取消',
|
cancelText: '取消',
|
||||||
})
|
})
|
||||||
|
@ -1,10 +1,7 @@
|
|||||||
.returnRecord_main{
|
.returnRecord_main{
|
||||||
height: 70vh;
|
height: 70vh;
|
||||||
.returnRecord_con{
|
.returnRecord_con{
|
||||||
padding: 0 20px;
|
padding: 20px;
|
||||||
}
|
|
||||||
.returnRecord_con{
|
|
||||||
padding-top: 20px;
|
|
||||||
}
|
}
|
||||||
.order_item{
|
.order_item{
|
||||||
background-color: #fff;
|
background-color: #fff;
|
||||||
@ -12,6 +9,7 @@
|
|||||||
padding: 20px;
|
padding: 20px;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
box-shadow: 0px 0px 12px 0px rgba(0,0,0,0.16);
|
box-shadow: 0px 0px 12px 0px rgba(0,0,0,0.16);
|
||||||
|
margin-bottom: 20px;;
|
||||||
.header{
|
.header{
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
|
@ -36,11 +36,10 @@ export default memo(({show, onClose, onSubmit, id}:Param) => {
|
|||||||
|
|
||||||
const userInfo = useSelector(state => state.userInfo)
|
const userInfo = useSelector(state => state.userInfo)
|
||||||
|
|
||||||
//获取订单列表
|
//获取售后订单列表
|
||||||
const {fetchData: listFetchData, state:orderState} = ReturnRecordApi()
|
const {fetchData: listFetchData, state:orderState} = ReturnRecordApi()
|
||||||
const [orderData, setOrderData] = useState<{list:any[], total:number}>({list:[], total:0})
|
const [orderData, setOrderData] = useState<{list:any[], total:number}>({list:[], total:0})
|
||||||
const getOrderList = async () => {
|
const getOrderList = async () => {
|
||||||
console.log('ida::', id)
|
|
||||||
let res = await listFetchData(getFilterData(searchField.current))
|
let res = await listFetchData(getFilterData(searchField.current))
|
||||||
setOrderData({list: res.data.list, total: res.data.total})
|
setOrderData({list: res.data.list, total: res.data.total})
|
||||||
}
|
}
|
||||||
@ -134,19 +133,19 @@ export default memo(({show, onClose, onSubmit, id}:Param) => {
|
|||||||
<View className={styles.color_list}>
|
<View className={styles.color_list}>
|
||||||
{item?.product_list?.[0].product_colors?.map((itemColor, index) => {
|
{item?.product_list?.[0].product_colors?.map((itemColor, index) => {
|
||||||
return (
|
return (
|
||||||
(index <= 1)&&<View className={styles.color_item}>
|
(index <= 1)&&<View key={itemColor.id} className={styles.color_item}>
|
||||||
<View className={styles.color_title}>{formatHashTag(itemColor.code, itemColor.name)}</View>
|
<View className={styles.color_title}>{formatHashTag(itemColor.code, itemColor.name)}</View>
|
||||||
<View className={styles.color_price}>{standardPrice(itemColor.sale_price, item.sale_mode)}</View>
|
<View className={styles.color_price}>{standardPrice(itemColor.sale_price, item.sale_mode)}</View>
|
||||||
<View className={styles.color_num}>×{formatCount(itemColor, itemColor.sale_mode)}</View>
|
<View className={styles.color_num}>×{formatCount(itemColor, item.sale_mode)}</View>
|
||||||
</View>
|
</View>
|
||||||
)
|
)
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
<View className={styles.color_item}>
|
{(item?.product_list?.[0].product_colors.length > 2) && <View className={styles.color_item}>
|
||||||
<View className={styles.color_more}>……</View>
|
<View className={styles.color_more}>……</View>
|
||||||
<View className={styles.color_more}>……</View>
|
<View className={styles.color_more}>……</View>
|
||||||
<View className={styles.color_more}>……</View>
|
<View className={styles.color_more}>……</View>
|
||||||
</View>
|
</View>}
|
||||||
</View>
|
</View>
|
||||||
</View>
|
</View>
|
||||||
<View className={styles.color_count_num}>{numText(item)}</View>
|
<View className={styles.color_count_num}>{numText(item)}</View>
|
||||||
|
@ -74,7 +74,8 @@ export default memo(({show = true, onClose, company, orderInfo}:Param) => {
|
|||||||
order_total_num: (orderInfo.total_number) + '',
|
order_total_num: (orderInfo.total_number) + '',
|
||||||
qrcode:"", //跳转链接
|
qrcode:"", //跳转链接
|
||||||
order_total_weight: formatWeightDiv(orderInfo.total_estimate_weight).toString(), //订单布匹重量
|
order_total_weight: formatWeightDiv(orderInfo.total_estimate_weight).toString(), //订单布匹重量
|
||||||
list: lists
|
list: lists ,
|
||||||
|
show_qrcode: true //是否显示码单
|
||||||
}))
|
}))
|
||||||
}
|
}
|
||||||
}, [orderInfo])
|
}, [orderInfo])
|
||||||
@ -171,7 +172,7 @@ export default memo(({show = true, onClose, company, orderInfo}:Param) => {
|
|||||||
<View className={styles.scanPay_list}>
|
<View className={styles.scanPay_list}>
|
||||||
{(state.loading)&&<LoadingCard/>||
|
{(state.loading)&&<LoadingCard/>||
|
||||||
<ScrollView scrollY className={styles.scanPay_list}>
|
<ScrollView scrollY className={styles.scanPay_list}>
|
||||||
<Image mode="widthFix" src={payCodeImage} onClick={showImage}></Image>
|
<Image mode="widthFix" src={payCodeImage} showMenuByLongpress={true} onClick={showImage}></Image>
|
||||||
</ScrollView>}
|
</ScrollView>}
|
||||||
</View>
|
</View>
|
||||||
<View className={styles.btns} onClick={saveImageCheck}>保存电子确认单</View>
|
<View className={styles.btns} onClick={saveImageCheck}>保存电子确认单</View>
|
||||||
|
@ -17,6 +17,7 @@ type Param = {
|
|||||||
sale_mode: number,
|
sale_mode: number,
|
||||||
sale_mode_name: string,
|
sale_mode_name: string,
|
||||||
status_name: string,
|
status_name: string,
|
||||||
|
shipment_mode: number,
|
||||||
shipment_mode_name: string,
|
shipment_mode_name: string,
|
||||||
product_list: any[],
|
product_list: any[],
|
||||||
total_fabrics: number,
|
total_fabrics: number,
|
||||||
@ -55,7 +56,7 @@ export default memo(({value, onClickBtn}: Param) => {
|
|||||||
onClickBtn?.({status, orderInfo:value})
|
onClickBtn?.({status, orderInfo:value})
|
||||||
}, [value])
|
}, [value])
|
||||||
|
|
||||||
let {SaleOrderStatusTaking} = ORDER_STATUS
|
let {SaleOrderStatusTaking, SaleOrderStatusWaitingReceipt} = ORDER_STATUS
|
||||||
|
|
||||||
//订单状态
|
//订单状态
|
||||||
// const orderStatus = useCallback((item) => {
|
// const orderStatus = useCallback((item) => {
|
||||||
@ -76,6 +77,14 @@ export default memo(({value, onClickBtn}: Param) => {
|
|||||||
return `${value?.total_fabrics} 种面料,${value?.total_colors} 种颜色,共 ${total_number_new}${value?.sale_mode == 0? ' 条':' 米'}`
|
return `${value?.total_fabrics} 种面料,${value?.total_colors} 种颜色,共 ${total_number_new}${value?.sale_mode == 0? ' 条':' 米'}`
|
||||||
}, [value])
|
}, [value])
|
||||||
|
|
||||||
|
//订单状态
|
||||||
|
const orderStatus = useMemo(() => {
|
||||||
|
if(value.status == SaleOrderStatusWaitingReceipt.value && value.shipment_mode == 1) {
|
||||||
|
return '待提货'
|
||||||
|
} else {
|
||||||
|
return value?.status_name
|
||||||
|
}
|
||||||
|
}, [value])
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<View className={styles.order_item}>
|
<View className={styles.order_item}>
|
||||||
@ -90,7 +99,7 @@ export default memo(({value, onClickBtn}: Param) => {
|
|||||||
<Text className={styles.order_no}>订单号:{value?.order_no}</Text>
|
<Text className={styles.order_no}>订单号:{value?.order_no}</Text>
|
||||||
<Text className={classnames(styles.miconfont, 'iconfont, icon-a-moreback')}></Text>
|
<Text className={classnames(styles.miconfont, 'iconfont, icon-a-moreback')}></Text>
|
||||||
</View>
|
</View>
|
||||||
<View className={styles.product_status}>{value?.status_name}</View>
|
<View className={styles.product_status}>{orderStatus}</View>
|
||||||
</View>
|
</View>
|
||||||
</View>
|
</View>
|
||||||
|
|
||||||
|
@ -86,6 +86,8 @@ import styles from './index.module.scss'
|
|||||||
} else if(val == 8) {
|
} else if(val == 8) {
|
||||||
//申请记录
|
//申请记录
|
||||||
setApplyRecord(true)
|
setApplyRecord(true)
|
||||||
|
} else if (val == 5) {
|
||||||
|
onShowLogistics(1)
|
||||||
}
|
}
|
||||||
}, [orderDetail])
|
}, [orderDetail])
|
||||||
|
|
||||||
@ -94,7 +96,6 @@ import styles from './index.module.scss'
|
|||||||
getSaleOrderPreView()
|
getSaleOrderPreView()
|
||||||
})
|
})
|
||||||
|
|
||||||
|
|
||||||
//按钮所需数据
|
//按钮所需数据
|
||||||
const orderInfo = useMemo(() => {
|
const orderInfo = useMemo(() => {
|
||||||
return {
|
return {
|
||||||
|
@ -131,6 +131,17 @@
|
|||||||
border-radius: 10px;
|
border-radius: 10px;
|
||||||
padding: 10px 22px;
|
padding: 10px 22px;
|
||||||
margin-top: 20px;
|
margin-top: 20px;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
.refund_amount{
|
||||||
|
font-size: 30rpx;
|
||||||
|
color: #007AFF;
|
||||||
|
text{
|
||||||
|
&:nth-child(1) {
|
||||||
|
font-size: 23px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
.order_number{
|
.order_number{
|
||||||
display: flex;
|
display: flex;
|
||||||
|
@ -30,6 +30,7 @@ type Param = {
|
|||||||
texturl_url: string,
|
texturl_url: string,
|
||||||
type: number //2 退货 1 预收退款 3 销售
|
type: number //2 退货 1 预收退款 3 销售
|
||||||
return_apply_order_id: number //退款申请单
|
return_apply_order_id: number //退款申请单
|
||||||
|
refund_amount: number // 退款金额
|
||||||
},
|
},
|
||||||
onClickBtn?: (val:{status:number, orderInfo:Param['value']}) => void
|
onClickBtn?: (val:{status:number, orderInfo:Param['value']}) => void
|
||||||
}
|
}
|
||||||
@ -75,7 +76,7 @@ export default memo(({value, onClickBtn}: Param) => {
|
|||||||
}, [value])
|
}, [value])
|
||||||
|
|
||||||
//售后单状态
|
//售后单状态
|
||||||
const {ReturnStageQualityCheckPendingRefund, ReturnStageServiceOrderPendingRefund} = AFTER_ORDER_STATUS
|
const {ReturnStageQualityCheckPendingRefund, ReturnStageServiceOrderPendingRefund, ReturnStageReturned} = AFTER_ORDER_STATUS
|
||||||
const stage_name = useMemo(() => {
|
const stage_name = useMemo(() => {
|
||||||
return [ReturnStageQualityCheckPendingRefund.value, ReturnStageServiceOrderPendingRefund.value].includes(value?.stage)?'待退款':value?.stage_name
|
return [ReturnStageQualityCheckPendingRefund.value, ReturnStageServiceOrderPendingRefund.value].includes(value?.stage)?'待退款':value?.stage_name
|
||||||
}, [value])
|
}, [value])
|
||||||
@ -126,7 +127,10 @@ export default memo(({value, onClickBtn}: Param) => {
|
|||||||
</View>}
|
</View>}
|
||||||
</View>
|
</View>
|
||||||
</View>
|
</View>
|
||||||
<View className={styles.color_count_num}>{numText}</View>
|
<View className={styles.color_count_num}>
|
||||||
|
<Text>{numText}</Text>
|
||||||
|
{ReturnStageReturned.value == value?.stage && <Text className={styles.refund_amount}><Text>¥</Text>{formatPriceDiv(value?.refund_amount, 100, true)}</Text>}
|
||||||
|
</View>
|
||||||
<View className={styles.order_number}>
|
<View className={styles.order_number}>
|
||||||
<Text>{value?.type == ReturnApplyOrderTypeReturnForRefund.value?'已申请退货':'已申请退款'}</Text>
|
<Text>{value?.type == ReturnApplyOrderTypeReturnForRefund.value?'已申请退货':'已申请退款'}</Text>
|
||||||
<Text>订单号:{value?.order_no}</Text>
|
<Text>订单号:{value?.order_no}</Text>
|
||||||
|
Loading…
x
Reference in New Issue
Block a user