From f30e174e3e1951eefc36bf32500bebb04a651e49 Mon Sep 17 00:00:00 2001 From: czm <2192718639@qq.com> Date: Thu, 19 May 2022 20:31:53 +0800 Subject: [PATCH] =?UTF-8?q?=E8=AE=A2=E5=8D=95=E5=88=97=E8=A1=A8=E9=A1=B5?= =?UTF-8?q?=E9=9D=A2=E5=AE=8C=E6=88=90?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- config/index.js | 1 + src/app.config.ts | 12 ++ src/common/constant.js | 4 +- src/common/enum.ts | 7 + src/common/fotmat.js | 4 +- .../{filter copy => filterV2}/index copy.tsx | 0 .../index.module.scss | 0 .../{filter copy => filterV2}/index.tsx | 0 .../infiniteScroll/index.module.scss | 4 +- src/components/infiniteScroll/index.tsx | 12 +- src/components/product/index.module.scss | 8 +- src/components/product/index.tsx | 7 +- src/components/shopCart/index.tsx | 2 +- src/components/sideBar/index.tsx | 2 + src/pages/classList/index.tsx | 117 ++++++++++---- src/pages/editOrder/index.module.scss | 2 +- src/pages/index/index.tsx | 3 +- .../estimatedAmount/index.module.scss | 3 +- .../components/estimatedAmount/index.tsx | 6 +- .../components/orderState/index.module.scss | 19 ++- .../order/components/orderState/index.tsx | 8 +- src/pages/order/index.module.scss | 9 +- src/pages/order/index.tsx | 5 +- .../components/order/index.module.scss | 143 +++++++++++++++++ .../orderList/components/order/index.tsx | 60 +++++++ src/pages/orderList/index.config.ts | 3 + src/pages/orderList/index.module.scss | 36 +++++ src/pages/orderList/index.tsx | 66 ++++++++ src/pages/searchList/searchList.tsx | 2 + .../components/filter/index.module.scss | 126 +++++++++++++++ .../subjectList/components/filter/index.tsx | 115 ++++++++++++++ src/pages/subjectList/index.config.ts | 3 + src/pages/subjectList/index.module.scss | 150 ++++++++++++++++++ src/pages/subjectList/index.tsx | 130 +++++++++++++++ src/styles/common.scss | 1 - 35 files changed, 1008 insertions(+), 62 deletions(-) create mode 100644 src/common/enum.ts rename src/components/{filter copy => filterV2}/index copy.tsx (100%) rename src/components/{filter copy => filterV2}/index.module.scss (100%) rename src/components/{filter copy => filterV2}/index.tsx (100%) create mode 100644 src/pages/orderList/components/order/index.module.scss create mode 100644 src/pages/orderList/components/order/index.tsx create mode 100644 src/pages/orderList/index.config.ts create mode 100644 src/pages/orderList/index.module.scss create mode 100644 src/pages/orderList/index.tsx create mode 100644 src/pages/subjectList/components/filter/index.module.scss create mode 100644 src/pages/subjectList/components/filter/index.tsx create mode 100644 src/pages/subjectList/index.config.ts create mode 100644 src/pages/subjectList/index.module.scss create mode 100644 src/pages/subjectList/index.tsx diff --git a/config/index.js b/config/index.js index eeaacd9..d68f13d 100644 --- a/config/index.js +++ b/config/index.js @@ -11,6 +11,7 @@ const config = { outputRoot: 'dist', plugins: [], defineConstants: { + CURRENT_ENV: JSON.stringify(process.env.NODE_ENV) }, copy: { patterns: [ diff --git a/src/app.config.ts b/src/app.config.ts index dd04399..9c67410 100644 --- a/src/app.config.ts +++ b/src/app.config.ts @@ -104,6 +104,18 @@ export default { pages: [ "index", ] + }, + { + root: "pages/orderList", + pages: [ + "index", + ] + }, + { + root: "pages/subjectList", + pages: [ + "index", + ] } ] } diff --git a/src/common/constant.js b/src/common/constant.js index 0e939bb..ff94106 100644 --- a/src/common/constant.js +++ b/src/common/constant.js @@ -16,8 +16,8 @@ export const BASE_URL = `http://192.168.1.30:40001/lymarket` // 发 export const GET_UPLOAD_SIGN = `/upyun/getsign` // 请求签名 url export const UPLOAD_CDN_URL = `https://v0.api.upyun.com/` -// 前缀 -export const IMG_CND_Prefix = "http://test.cdn.zzfzyc.com" +// cdn +export const IMG_CND_Prefix = CURRENT_ENV.includes('development')? "https://test.cdn.zzfzyc.com":"https://cdn.zzfzyc.com" // 上传图片视频 diff --git a/src/common/enum.ts b/src/common/enum.ts new file mode 100644 index 0000000..df57d45 --- /dev/null +++ b/src/common/enum.ts @@ -0,0 +1,7 @@ +export const ORDER_STATUS = { + 0:{value:0, label:'申请中'}, + 1:{value:1, label:'配布中'}, + 2:{value:2, label:'待发货'}, + 3:{value:3, label:'已发货'}, + 4:{value:4, label:'已完成'} +} \ No newline at end of file diff --git a/src/common/fotmat.js b/src/common/fotmat.js index 1877f76..2176a51 100644 --- a/src/common/fotmat.js +++ b/src/common/fotmat.js @@ -141,6 +141,6 @@ export const toDecimal2 = (x) => { * @param {*} url * @returns */ -export const formatImgUrl = (url) => { - return url?IMG_CND_Prefix + url:'https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fimg.jj20.com%2Fup%2Fallimg%2F811%2F021315104H2%2F150213104H2-3-1200.jpg&refer=http%3A%2F%2Fimg.jj20.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1651817947&t=5467a207f845ddfc7737d55934e6b26d' +export const formatImgUrl = (url, suffix="!w200") => { + return url?IMG_CND_Prefix + url + suffix:'https://cdn.zzfzyc.com/mall/no_img.png' } \ No newline at end of file diff --git a/src/components/filter copy/index copy.tsx b/src/components/filterV2/index copy.tsx similarity index 100% rename from src/components/filter copy/index copy.tsx rename to src/components/filterV2/index copy.tsx diff --git a/src/components/filter copy/index.module.scss b/src/components/filterV2/index.module.scss similarity index 100% rename from src/components/filter copy/index.module.scss rename to src/components/filterV2/index.module.scss diff --git a/src/components/filter copy/index.tsx b/src/components/filterV2/index.tsx similarity index 100% rename from src/components/filter copy/index.tsx rename to src/components/filterV2/index.tsx diff --git a/src/components/infiniteScroll/index.module.scss b/src/components/infiniteScroll/index.module.scss index d72d954..c92bd1f 100644 --- a/src/components/infiniteScroll/index.module.scss +++ b/src/components/infiniteScroll/index.module.scss @@ -1,7 +1,6 @@ .scroll_main{ height: 100%; - .infinite_scroll{ font-size: $font_size_medium; color: $color_font_two; @@ -13,4 +12,7 @@ align-items: center; } } + .scrollViewCon { + // height: 100%; + } } \ No newline at end of file diff --git a/src/components/infiniteScroll/index.tsx b/src/components/infiniteScroll/index.tsx index 4dc2197..99dbbaf 100644 --- a/src/components/infiniteScroll/index.tsx +++ b/src/components/infiniteScroll/index.tsx @@ -2,12 +2,14 @@ import { ScrollView, View } from "@tarojs/components" import { memo, ReactNode, useState } from "react" import style from "./index.module.scss" import DotLoading from "@/components/dotLoading" +import LoadingCard from "../loadingCard" type Params = { styleObj?: Object, selfonScrollToLower?: () => void, hasMore?: false|true, moreStatus?: false|true, + statusMore?: 0|1|2, //0:没数据加载，1：下拉加载，2：没有数据 children?: ReactNode, lowerThresholdNum?: number, selfOnScrollToUpper?:() => void @@ -35,7 +37,8 @@ export default memo(({ paddingBottom = 0, refresherTriggered = false, refresherEnabled = false, - moreStatus = true + moreStatus = true, + statusMore = 0 }: Params) => { const scrollToLower = () => { selfonScrollToLower?.() @@ -77,7 +80,7 @@ export default memo(({ onRefresherAbort = {() => refresherAbort()} refresherBackground ='#F8F8F8' > - + {(statusMore != 0)&& {children} {moreStatus&& { @@ -85,8 +88,9 @@ export default memo(({ 没有更多数据了 } } - - + || + + } diff --git a/src/components/product/index.module.scss b/src/components/product/index.module.scss index 865b112..6543b25 100644 --- a/src/components/product/index.module.scss +++ b/src/components/product/index.module.scss @@ -25,21 +25,19 @@ border-radius: 10px; } .num{ - width: 100px; - height: 36px; + padding: 5px 10px; font-size: $font_size_min; position: absolute; right:0; bottom: 0; - background: rgba($color: #fff, $alpha: 0.3); + background: rgba($color: #000, $alpha: 0.3); border-radius: 36px 0px 10px 0px; color: #fff; text-align: center; - line-height: 36px; } } .item_con{ - padding-left: 15px; + padding-left: 20px; font-size: $font_size; flex:1; .title{ diff --git a/src/components/product/index.tsx b/src/components/product/index.tsx index 64a951f..7a14628 100644 --- a/src/components/product/index.tsx +++ b/src/components/product/index.tsx @@ -2,6 +2,7 @@ import { Image, View } from "@tarojs/components" import Taro from "@tarojs/taro" import { goLink } from "@/common/common" import styles from './index.module.scss' +import { formatHashTag, formatImgUrl } from "@/common/fotmat" type Params = { desStatus?: true|false, @@ -13,17 +14,17 @@ export default ({desStatus = true, productList = []}:Params) => { {productList?.map(item => { return goLink(`/pages/details/index?id=${item.id}`)}> - + {item.product_color_count}色 - {item.code}#{item.name} + {formatHashTag(item.code, '')} {item.name} {item.width} {item.weight_density} {item.component} - {desStatus&&{item.describe}} + {desStatus&&{item.describe}} })} diff --git a/src/components/shopCart/index.tsx b/src/components/shopCart/index.tsx index 7f90162..3caff3d 100644 --- a/src/components/shopCart/index.tsx +++ b/src/components/shopCart/index.tsx @@ -189,7 +189,7 @@ export default ({show = false, onClose}: param) => { const estimatePrice = useMemo(() => { let count = 0 list.map(item => { - if(item.select) count += item.sale_price + if(item.select) count += item.estimate_amount }) return Number(formatPriceDiv(count)) },[list]) diff --git a/src/components/sideBar/index.tsx b/src/components/sideBar/index.tsx index 2729e92..8245770 100644 --- a/src/components/sideBar/index.tsx +++ b/src/components/sideBar/index.tsx @@ -4,6 +4,7 @@ import styles from "./index.module.scss" import classnames from "classnames"; import Taro, { useReady } from "@tarojs/taro"; import InfiniteScroll from "../infiniteScroll"; +import LoadingCard from "../loadingCard"; @@ -107,6 +108,7 @@ export default memo(({list = [], + selfOnScrolltolower?.()} refresherTriggered={refresherTriggered} refresherEnabled={true} selfOnRefresherRefresh={() => selfOnRefresherRefresh?.()}> {children} diff --git a/src/pages/classList/index.tsx b/src/pages/classList/index.tsx index 302ce6a..5d79601 100644 --- a/src/pages/classList/index.tsx +++ b/src/pages/classList/index.tsx @@ -4,42 +4,103 @@ import Search from '@/components/search' import Product from '@/components/product' import InfiniteScroll from '@/components/infiniteScroll' import styles from './index.module.scss' -import { useEffect, useState } from "react"; -import Filter from "./components/filter"; +import { useCallback, useEffect, useRef, useState } from "react"; +import Filter from "@/components/filter"; import SortBtn from "@/components/sortBtn"; -import SelectData from "../searchList/components/selectData"; -import {GetSubjectList} from '@/api/subjectMaterial' +import SelectData, {ListProps} from "../searchList/components/selectData"; +import {GetProductListApi} from '@/api/material' +import { useRouter } from "@tarojs/taro"; +import { getFilterData } from "@/common/util"; +import LoadingCard from "@/components/loadingCard"; export default () => { const [showPopup, setShowPopup] = useState(false) - const [selectList, setSelectList] = useState([ - {title: '系列', value:1}, - {title: '系列', value:2}, - {title: '系列', value:3}, - {title: '系列', value:4}, - {title: '系列', value:6}, - {title: '系列', value:7}, - {title: '系列', value:8}, - {title: '系列', value:9}, - {title: '系列', value:10}, - ]) + const router = useRouter() + //搜索参数 + const [searchField, setSearchField] = useState({ + code_or_name: '', + product_category_id: router.params.id, + page : 1, + size : 10, + width: '', + weight_density: '', + product_kind_id: '', + component: '' + }) + + //获取列表 + const [categoryList, setCategoryList] = useState<{list:any[], total:number}>({ + list:[], + total:0 + }) + const {fetchData, state} = GetProductListApi() + const getSubjectList = async () => { + let res = await fetchData(getFilterData(searchField)) + setCategoryList({...categoryList, list:res.data.list, total: res.data.total}) + } + + //监听筛选数据变化 useEffect(() => { getSubjectList() + }, [searchField]) + + //上拉加载数据 + const pageNum = useRef({size: searchField.size, page: searchField.page}) + const [hasMore, setHasMore] = useState(true) + const getScrolltolower = () => { + if(categoryList.list.length < categoryList.total) { + pageNum.current.page++ + const size = pageNum.current.size * pageNum.current.page + setSearchField({...searchField, size }) + } + } + + //监听获得的数据变化 + useEffect(() => { + (categoryList.list.length < categoryList.total)?setHasMore(true):setHasMore(false) + }, [categoryList]) + + //获取筛选条件 + const getFiltr = (e) => { + pageNum.current.page = 1 + 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 [selectList , setSelectList] = useState() + const formatSelectList = (val = {data:{}, field:{}}) => { + let data:ListProps[] = [] + for(let key in val.data) { + if(key !== 'seriesId'&& val.data[key] != '') { + data.push({title:val.field[key], value:val.data[key]}) + } + } + setSelectList([...data]) + } + + //输入了搜索关键字 + const getSearchData = useCallback((e) => { + pageNum.current.page = 1 + setCategoryList(() => ({list:[], total:0})) + setSearchField((val) => ({...val, code_or_name:e, size:10})) }, []) - //获取专题 - const [list, setList] = useState([]) - const {fetchData} = GetSubjectList() - const getSubjectList = async () => { - let res = await fetchData() - console.log('res::', res) - } + return ( - + @@ -57,11 +118,13 @@ export default () => { - console.log('123123')}> - - + {(categoryList.list.length == 0&&state.loading)&&} + {(categoryList.list.length == 0 && !state.loading)&&} + {(categoryList.list.length > 0)&& getScrolltolower()} hasMore={hasMore}> + + } - setShowPopup(false)} onFiltr={(e) => console.log('e:::',e)}/> + setShowPopup(false)} onFiltr={getFiltr}/> ) } \ No newline at end of file diff --git a/src/pages/editOrder/index.module.scss b/src/pages/editOrder/index.module.scss index c6e2906..043d149 100644 --- a/src/pages/editOrder/index.module.scss +++ b/src/pages/editOrder/index.module.scss @@ -101,7 +101,7 @@ align-items: center; } .addAddress{ - border-left: 0; + border-right: 0; display: flex; border-radius: 50px 0px 0px 50px; color: $color_main; diff --git a/src/pages/index/index.tsx b/src/pages/index/index.tsx index 8926571..5653f8d 100644 --- a/src/pages/index/index.tsx +++ b/src/pages/index/index.tsx @@ -11,6 +11,7 @@ import { useEffect, useRef, useState } from 'react' import Taro, { Events, useDidShow, usePullDownRefresh, useRouter } from '@tarojs/taro' import {GetProductKindListApi, GetProductListApi} from '@/api/material' import useLogin from '@/use/useLogin' +import LoadingCard from '@/components/loadingCard' export default () => { @@ -102,7 +103,7 @@ export default () => { getScrolltolower()} sideBarOnClick={(e) => getProductKindId(e)} heightItem={150} refresherTriggered={refresherTriggeredStatus} selfOnRefresherRefresh={() => getRefresherRefresh()}> - + diff --git a/src/pages/order/components/estimatedAmount/index.module.scss b/src/pages/order/components/estimatedAmount/index.module.scss index c5ac9ed..4b4a958 100644 --- a/src/pages/order/components/estimatedAmount/index.module.scss +++ b/src/pages/order/components/estimatedAmount/index.module.scss @@ -14,8 +14,9 @@ position: relative; } .miconfont{ - font-size: 30px; + font-size: 26px; font-weight: normal; + margin-left: 5px; } .message{ position: absolute; diff --git a/src/pages/order/components/estimatedAmount/index.tsx b/src/pages/order/components/estimatedAmount/index.tsx index 804e095..c1f360d 100644 --- a/src/pages/order/components/estimatedAmount/index.tsx +++ b/src/pages/order/components/estimatedAmount/index.tsx @@ -26,7 +26,7 @@ export default memo(({style, number = 0}:Param) => { 合计金额 - + {/* 123123123121212312312312312 */} @@ -38,7 +38,7 @@ export default memo(({style, number = 0}:Param) => { 空差优惠 - + {/* 123123123121212312312312312 */} @@ -50,7 +50,7 @@ export default memo(({style, number = 0}:Param) => { 应付金额 - + {/* 123123123121212312312312312 */} diff --git a/src/pages/order/components/orderState/index.module.scss b/src/pages/order/components/orderState/index.module.scss index 1b67b56..9101c29 100644 --- a/src/pages/order/components/orderState/index.module.scss +++ b/src/pages/order/components/orderState/index.module.scss @@ -3,6 +3,8 @@ border-radius: 20px; padding: 20px; box-sizing:border-box; + position: relative; + overflow: hidden; .order_status_list{ max-height: 250px; overflow: hidden; @@ -16,8 +18,8 @@ padding-left: 50px; min-height: 120px; .order_status_tail_end, .order_status_tail{ - width: 20px; - height: 20px; + width: 15px; + height: 15px; border: 2px solid $color_main; background-color: #fff; border-radius: 50%; @@ -33,7 +35,7 @@ border-left: 2px solid $color_main; height: 100%; top: 10px; - left: 13px; + left: 8px; position: absolute; z-index: 1; } @@ -87,4 +89,15 @@ transform:rotate(-90deg); } } + .image_tag{ + width: 140px; + height: 144px; + .image{ + width: 140px; + height: 144px; + } + position: absolute; + top: -10px; + right: -10px; + } } \ No newline at end of file diff --git a/src/pages/order/components/orderState/index.tsx b/src/pages/order/components/orderState/index.tsx index e5a4d61..7592c74 100644 --- a/src/pages/order/components/orderState/index.tsx +++ b/src/pages/order/components/orderState/index.tsx @@ -2,6 +2,7 @@ import { Image, Text, View } from "@tarojs/components" import { memo, useState } from "react" import styles from './index.module.scss' import classnames from "classnames"; +import { formatImgUrl } from "@/common/fotmat"; type Param = { title: string, time: string, @@ -18,6 +19,7 @@ export default memo(({list = []}:{list?:Param[]}) => { {title:'待配布', time:'2022-04-24 09:08', tag:'已接单', desc:'仓库正在为你配布...'}, {title:'待接单', time:'2022-04-24 09:08', tag:'已提交', desc:''}, ] + return ( @@ -36,9 +38,9 @@ export default memo(({list = []}:{list?:Param[]}) => { {showMore&&'收起物流详情'||'点击查看更多物流详情'} } - {/* - - */} + + + ) }) \ No newline at end of file diff --git a/src/pages/order/index.module.scss b/src/pages/order/index.module.scss index bc7da0e..e965350 100644 --- a/src/pages/order/index.module.scss +++ b/src/pages/order/index.module.scss @@ -72,19 +72,22 @@ align-items: center; background-color: #fff; box-shadow: 6px 0px 12px 0px rgba(0,0,0,0.16); - padding: 20px 50px; + padding: 20px 20px; box-sizing: border-box; padding-bottom: constant(safe-area-inset-bottom); padding-bottom: env(safe-area-inset-bottom); .order_btn { - width: 250px; - height: 90px; + width: 152px; + height: 72px; border: 2px solid #dddddd; border-radius: 46px; display: flex; justify-content: center; align-items: center; color: $color_font_three; + &:nth-child(n+2) { + margin-left: 34px; + } } .order_number_desc{ font-size: $font_size_medium; diff --git a/src/pages/order/index.tsx b/src/pages/order/index.tsx index 2d743a0..a2aee83 100644 --- a/src/pages/order/index.tsx +++ b/src/pages/order/index.tsx @@ -149,7 +149,10 @@ import styles from './index.module.scss' - 取消订单 + 申请退货 + 查看物流 + 确认收货 + 再次购买 setShowDesc(false)} > getRemark(e)}/> diff --git a/src/pages/orderList/components/order/index.module.scss b/src/pages/orderList/components/order/index.module.scss new file mode 100644 index 0000000..4bba847 --- /dev/null +++ b/src/pages/orderList/components/order/index.module.scss @@ -0,0 +1,143 @@ +.order_item{ + background-color: #fff; + border-radius: 20px; + padding: 20px; + box-sizing: border-box; + .header{ + display: flex; + align-items: center; + .user{ + display: flex; + align-items: center; + .name { + color: #000; + font-weight: 700; + margin-left: 15px; + font-size: $font_size; + } + image{ + width: 70px; + height: 70px; + border-radius: 50%; + } + } + .order_num { + flex: 1; + font-size: $font_size_medium; + color: $color_font_one; + text-align: right; + padding-right: 30px; + display: flex; + justify-content: flex-end; + align-items: center; + .miconfont { + font-size: 20px; + } + } + .tag{ + font-size: $font_size_min; + padding: 5px 15px; + background-color: $color_main; + color: #fff; + border-radius: 0px 20px 0px 20px; + } + } + .product_title{ + display: flex; + align-items: center; + padding: 35px 0; + .product_tag{ + background-color: #CDE5FF; + font-size: $font_size_min; + padding: 5px 10px; + color: $color_main; + border-radius: 6px; + } + .product_name{ + flex:1; + font-size: $font_size; + font-weight: 700; + padding-left: 20px; + } + .product_status{ + font-size: $font_size; + color: $color_main; + } + } + .product_list{ + display: flex; + .image{ + width: 126px; + height: 126px; + background: #e5ad3a; + border-radius: 20px 20px 0px 0px; + position: relative; + image{ + width: 100%; + height: 100%; + border-radius: 20px 20px 0px 0px; + } + .color_num { + background: rgba(0,0,0, 0.5); + border-radius: 50px 0px 0px 0px; + font-size: $font_size_min; + color: #fff; + position: absolute; + right:0; + bottom:0; + padding: 5px 10px; + box-sizing: border-box; + } + } + .color_list{ + flex:1; + padding-left: 30px; + .color_item{ + display: flex; + justify-content: space-between; + font-size: $font_size_min; + color: $color_font_three; + align-items: center; + margin-bottom: 20px; + .color_title{ + font-weight: 700; + font-size: $font_size; + color: #000; + } + .color_more{ + color: $color_font_three; + } + } + } + + } + .color_count_num{ + font-size: $font_size_min; + color: $color_font_two; + background-color: #F6F6F6; + border-radius: 10px; + padding: 10px 22px; + } + .btns_list{ + display: flex; + justify-content: flex-end; + margin-top: 30px; + .btns_item{ + width: 152px; + height: 72px; + border: 2px solid #dddddd; + border-radius: 38px; + text-align: center; + line-height: 72px; + font-size: $font_size; + color: $color_font_three; + &:nth-child(n+2) { + margin-left: 32px; + } + } + .end_btn{ + border: 2px solid $color_main; + color: $color_main; + } + } +} \ No newline at end of file diff --git a/src/pages/orderList/components/order/index.tsx b/src/pages/orderList/components/order/index.tsx new file mode 100644 index 0000000..6fe747c --- /dev/null +++ b/src/pages/orderList/components/order/index.tsx @@ -0,0 +1,60 @@ +import { formatImgUrl } from "@/common/fotmat"; +import { useSelector } from "@/reducers/hooks"; +import { Image, Text, View } from "@tarojs/components" +import classnames from "classnames"; +import { memo } from "react"; +import styles from './index.module.scss' +export default memo(() => { + const userInfo = useSelector(state => state.userInfo) + return ( + + + + + {userInfo.adminUserInfo.user_name} + + + 订单号：LY2278204399678 + + + 自提 + + + 大货 + 0770# 21S单面平纹(食毛) + 待接单 + + + + + 24色 + + + + 1# 薄荷绿 + ¥40/kg + ×2条 + + + 1# 薄荷绿 + ¥40/kg + ×2条 + + + …… + …… + …… + + + + + 2种面料，3种颜色，共6条 + + 取消订单 + 修改地址 + 修改地址 + 去付款 + + + ) +}) \ No newline at end of file diff --git a/src/pages/orderList/index.config.ts b/src/pages/orderList/index.config.ts new file mode 100644 index 0000000..c47055c --- /dev/null +++ b/src/pages/orderList/index.config.ts @@ -0,0 +1,3 @@ +export default { + navigationBarTitleText: '订单列表', +} diff --git a/src/pages/orderList/index.module.scss b/src/pages/orderList/index.module.scss new file mode 100644 index 0000000..1a68dbc --- /dev/null +++ b/src/pages/orderList/index.module.scss @@ -0,0 +1,36 @@ +.order_list_main{ + min-height: 100vh; + background-color: $color_bg_one; + display: flex; + flex-direction: column; + .title{ + padding: 0 20px; + background-color: #fff; + box-shadow: 0px 0px 4px 0px rgba(0,0,0,0.16); + border-bottom: 2px solid #e2e2e2; + .order_status_list{ + display: flex; + justify-content: space-between; + font-size: $font_size; + color: #9E9E9E; + margin-top: 20px; + .order_status_item{ + padding: 20px 10px; + box-sizing: border-box; + } + .selected{ + font-weight: 700; + color: #000; + border-bottom: 4px solid #707070; + // border-radius: 4px; + } + } + } + .order_list{ + flex:1; + height: 0; + .order_item{ + margin-top: 20px; + } + } +} \ No newline at end of file diff --git a/src/pages/orderList/index.tsx b/src/pages/orderList/index.tsx new file mode 100644 index 0000000..4741c48 --- /dev/null +++ b/src/pages/orderList/index.tsx @@ -0,0 +1,66 @@ +import Search from "@/components/search" +import useLogin from "@/use/useLogin" +import { Image, Text, View } from "@tarojs/components" +import { useDidShow, useRouter } from "@tarojs/taro" +import { useCallback, useState } from "react" +import {ORDER_STATUS} from '@/common/enum' +import styles from './index.module.scss' +import classnames from "classnames"; +import { useSelector } from "@/reducers/hooks" +import { formatImgUrl } from "@/common/fotmat" +import Order from "./components/order" +import InfiniteScroll from "@/components/infiniteScroll" + +export default () => { + const {checkLogin} = useLogin() + useDidShow(async () => { + await checkLogin() + }) + + const router = useRouter() + //搜索参数 + const [searchField, setSearchField] = useState({ + shipment_mode:'', + page : 1, + size : 10, + key:'' + }) + + //订单状态 + type orderStatusParam = {value:number, label:string}[] + const order_status: orderStatusParam = [{value:-1, label:'全部'}, ...Object.values(ORDER_STATUS)] + const [selectStatus, setSelectStatus] = useState(-1) + const changeStatus = useCallback((e) => { + setSelectStatus(() => e) + }, []) + + //输入了搜索关键字 + const getSearchData = useCallback((e) => { + // setMaterialList(() => ({list:[], total:0})) + setSearchField((val) => ({...val, code_or_name:e, size:10})) + }, []) + + + + return ( + + + + + {order_status.map(item => { + return changeStatus(item.value)} className={classnames(styles.order_status_item, (selectStatus==item.value)&&styles.selected)}>{item.label} + })} + + + + + {new Array(10).fill('').map(item => { + return + + })} + + + + + ) +} diff --git a/src/pages/searchList/searchList.tsx b/src/pages/searchList/searchList.tsx index 04db319..9eee0c0 100644 --- a/src/pages/searchList/searchList.tsx +++ b/src/pages/searchList/searchList.tsx @@ -69,6 +69,7 @@ export default () => { //输入了搜索关键字 const getSearchData = useCallback((e) => { + pageNum.current.page = 1 setMaterialList(() => ({list:[], total:0})) setSearchField((val) => ({...val, code_or_name:e, size:10})) }, []) @@ -94,6 +95,7 @@ export default () => { //获取筛选条件 const getFiltr = (e) => { + pageNum.current.page = 1 const {data} = e setSearchField({ ...searchField, diff --git a/src/pages/subjectList/components/filter/index.module.scss b/src/pages/subjectList/components/filter/index.module.scss new file mode 100644 index 0000000..599cdd0 --- /dev/null +++ b/src/pages/subjectList/components/filter/index.module.scss @@ -0,0 +1,126 @@ +.popup_main{ + width: 608px; + height: 100vh; + padding: 20px; + box-sizing: border-box; + display: flex; + flex-direction: column; + .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; + } + .popup_filter_item{ + margin-bottom: 20px; + .title{ + font-size: $font_size; + color: $color_font_one; + font-weight: 700; + padding: 20px 0; + } + .btn_list{ + display: grid; + grid-template-columns: repeat(3, 165.75px); + justify-content: space-between; + .btn_item{ + width: 165.75px; + height: 69.2px; + background: #f0f0f0; + border-radius: 34px; + text-align: center; + line-height: 69.2px; + font-size: $font_size_medium; + color: $color_font_one; + margin-bottom: 20px; + } + .select_btn_item{ + color: $color_main; + background: #ecf5ff; + border: 2px solid #007aff; + width: 161.75px; + height: 65.2px; + } + } + .btn_list_input{ + display: flex; + // justify-content: space-between; + align-items: center; + .btn_width { + width: 220px; + height: 70px; + background: #f0f0f0; + border-radius: 50px; + padding: 10px 20px; + box-sizing: border-box; + input{ + width: 100%; + height: 100%; + font-size: $font_size_medium; + } + } + .unit{ + color: $color_font_one; + font-size: $font_size; + margin-left: 20px; + } + text{ + color: #ccc; + padding: 0 20px; + } + .width_main{ + + } + } + .btn_list_element{ + background-color: #F0F0F0; + 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; + 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: #007aff; + text-align: center; + line-height: 82px; + color: #fff; + } + } + } +} \ No newline at end of file diff --git a/src/pages/subjectList/components/filter/index.tsx b/src/pages/subjectList/components/filter/index.tsx new file mode 100644 index 0000000..d64ab87 --- /dev/null +++ b/src/pages/subjectList/components/filter/index.tsx @@ -0,0 +1,115 @@ +import Popup, {Params as PopuParams} from "@/components/popup" +import { Input, ScrollView, Text, Textarea, View } from "@tarojs/components" +import classnames from "classnames"; +import { useEffect, useState } from "react"; +import styles from './index.module.scss' + +type params = { + onFiltr?: (val:object) => void +} & PopuParams +export default ({onClose, onFiltr, show = false}:params) => { + const [filterObj, setFilterObj] = useState({ + series: '', + minWidth: '', + maxWidth: '', + minWeight: '', + maxWeight: '', + element: '' + + }) + const onCloseEven = () => { + onClose?.() + } + const onRest = () => { + console.log('12123') + setFilterObj({ + series: '', + minWidth: '', + maxWidth: '', + minWeight: '', + maxWeight: '', + element: '' + }) + } + useEffect(() => { + console.log(filterObj) + }, [filterObj]) + + const onVerify = () => { + console.log(filterObj) + onFiltr?.(filterObj) + } + + const setNumber = (e, field) => { + console.log(e) + let num = parseFloat(e.detail.value) + if(isNaN(num)) { + filterObj[field] = null + } else { + filterObj[field] = parseFloat(num.toFixed(2)) + } + setFilterObj({...filterObj}) + } + + const setElement = (e) => { + let res = e.detail.value + setFilterObj({...filterObj, element:res}) + } + return ( + + onCloseEven()} showIconButton={true}> + + 全部筛选 + + + + + 系列 + + 不限 + 不限 + 不限 + 不限 + 不限 + 不限 + + + + 幅宽 + + setNumber(e,'minWidth')} placeholder="自定义最低值" placeholderStyle="font-size: 26rpx"/> + — + setNumber(e,'maxWidth')} placeholder="自定义最高值" placeholderStyle="font-size: 26rpx"/> + cm + + + + 克重 + + setNumber(e,'minWeight')} placeholder="自定义最低值" placeholderStyle="font-size: 26rpx"/> + — + setNumber(e,'maxWeight')} placeholder="自定义最高值" placeholderStyle="font-size: 26rpx"/> + g + + + + 成分 + +