From 96a64f48927586e322e7baa695163e8331d634db Mon Sep 17 00:00:00 2001 From: Haiyi <1021441632@qq.com> Date: Mon, 19 Sep 2022 18:01:27 +0800 Subject: [PATCH] =?UTF-8?q?=E2=9C=A8=20feat:=E5=94=AE=E5=90=8E=E6=A8=A1?= =?UTF-8?q?=E5=9D=97?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- project.private.config.json | 7 + src/api/refound.ts | 23 ++ src/app.config.ts | 6 + src/pages/index/index.tsx | 4 +- .../components/itemList/index.module.scss | 219 +++++++++++ .../refundPage/components/itemList/index.tsx | 104 ++++++ .../components/tabs/index.module.scss | 42 +++ .../refundPage/components/tabs/index.tsx | 32 ++ .../components/timePicker/index.scss | 64 ++++ .../components/timePicker/index.tsx | 146 ++++++++ src/pages/refundPage/index.config.ts | 5 + src/pages/refundPage/index.module.scss | 168 +++++++++ src/pages/refundPage/index.tsx | 343 ++++++++++++++++++ src/pages/searchPage/index.tsx | 3 +- 14 files changed, 1164 insertions(+), 2 deletions(-) create mode 100644 src/api/refound.ts create mode 100644 src/pages/refundPage/components/itemList/index.module.scss create mode 100644 src/pages/refundPage/components/itemList/index.tsx create mode 100644 src/pages/refundPage/components/tabs/index.module.scss create mode 100644 src/pages/refundPage/components/tabs/index.tsx create mode 100644 src/pages/refundPage/components/timePicker/index.scss create mode 100644 src/pages/refundPage/components/timePicker/index.tsx create mode 100644 src/pages/refundPage/index.config.ts create mode 100644 src/pages/refundPage/index.module.scss create mode 100644 src/pages/refundPage/index.tsx diff --git a/project.private.config.json b/project.private.config.json index b612694..cbf8954 100644 --- a/project.private.config.json +++ b/project.private.config.json @@ -85,6 +85,13 @@ "query": "", "launchMode": "default", "scene": null + }, + { + "name": "", + "pathName": "pages/refundPage/index", + "query": "", + "launchMode": "default", + "scene": null } ] } diff --git a/src/api/refound.ts b/src/api/refound.ts new file mode 100644 index 0000000..e0823eb --- /dev/null +++ b/src/api/refound.ts @@ -0,0 +1,23 @@ +import { useRequest } from "@/use/useHttp" + +//售后订单列表 +export const mpreturnApplyOrderlist = () => { + return useRequest({ + url: `/v1/mp/returnApplyOrder/list`, + method: "get", + }) +} +//售后状态枚举 +export const mpenumreturnStage = () => { + return useRequest({ + url: `/v1/mp/enum/returnStage`, + method: "get", + }) +} +//退款类型枚举 +export const mpenumreturnType = () => { + return useRequest({ + url: `/v1/mp/enum/returnType`, + method: "get", + }) +} diff --git a/src/app.config.ts b/src/app.config.ts index eedc141..fd2bdb1 100644 --- a/src/app.config.ts +++ b/src/app.config.ts @@ -94,5 +94,11 @@ export default defineAppConfig({ "index" ] }, + { + root: "pages/refundPage", + pages: [ + "index" + ] + } ], }) diff --git a/src/pages/index/index.tsx b/src/pages/index/index.tsx index c0e2911..f32362a 100644 --- a/src/pages/index/index.tsx +++ b/src/pages/index/index.tsx @@ -13,6 +13,7 @@ import { mpproductcolorlist, mpshoppingCartproductColorlist } from "@/api/order" import { dataLoadingStatus } from '@/common/util' import Taro, { useDidShow } from '@tarojs/taro' import { getFilterData } from '@/common/util' +import userInfo from '@/reducers/userInfo' export default () => { useEffect(() => { categoryList() @@ -75,11 +76,12 @@ export default () => { setRefresherTriggeredStatus(true) } + const onj = JSON.parse(Taro.getStorageSync('userInfo')) const [search, setSearchObj] = useState({ modeId: 0, goodsId: null, code_or_name: '', - physical_warehouse: 1 + physical_warehouse: onj.physical_warehouse }) //选择的类型 diff --git a/src/pages/refundPage/components/itemList/index.module.scss b/src/pages/refundPage/components/itemList/index.module.scss new file mode 100644 index 0000000..8695091 --- /dev/null +++ b/src/pages/refundPage/components/itemList/index.module.scss @@ -0,0 +1,219 @@ +.itemBox { + margin-top: 38px; + overflow: hidden; + width: 702px; + height: 560px; + background: #FFFFFF; + border-radius: 16px; + margin-left: 24px; + + .topItem { + display: flex; + align-items: center; + justify-content: space-between; + margin-top: 24px; + + .orderNo { + + font-size: 28px; + font-family: PingFangSC-Medium, PingFang SC; + font-weight: 500; + color: #000000; + margin-left: 32px; + + } + + .status { + margin-right: 32px; + font-size: 28px; + font-family: PingFangSC-Medium, PingFang SC; + font-weight: 500; + color: #0D7CFF; + } + } + + .pussName { + margin-left: 32px; + font-size: 28px; + font-family: PingFangSC-Medium, PingFang SC; + font-weight: 500; + color: #000000; + } + + .line { + margin-left: 32px; + width: 638px; + height: 1px; + background: #000000; + opacity: 0.1; + margin-top: 16px; + margin-bottom: 24px; + } + + .contBox { + width: 638px; + margin-left: 32px; + display: flex; + justify-content: space-between; + + .leftCont { + width: 134px; + height: 134px; + // background: #000000; + border-radius: 8px; + position: relative; + + .leftContNums { + width: 134px; + height: 39px; + background: #000000; + border-radius: 0px 0px 8px 8px; + opacity: 0.5; + position: absolute; + bottom: 0; + font-size: 20px; + font-family: PingFangSC-Regular, PingFang SC; + font-weight: 400; + color: #FFFFFF; + text-align: center; + line-height: 39px; + } + } + + .rightCont { + margin-left: 24px; + + .rightTop { + display: flex; + align-items: center; + justify-content: space-between; + width: 480px; + margin-bottom: 32px; + + .productBox { + display: flex; + align-items: center; + + .productName { + width: 285px; + height: 34px; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + margin-right: 8px; + font-size: 28px; + font-family: PingFangSC-Regular, PingFang SC; + font-weight: 400; + color: #000000; + } + + .productMode { + width: 60px; + height: 28px; + background: #337FFF; + border-radius: 8px; + font-size: 20px; + font-family: PingFangSC-Medium, PingFang SC; + font-weight: 500; + color: #FFFFFF; + text-align: center; + line-height: 28px; + } + } + + .shipMode { + font-size: 28px; + font-family: PingFangSC-Regular, PingFang SC; + font-weight: 400; + color: #000000; + } + } + + .colorsBox { + display: flex; + align-items: center; + width: 480px; + margin-bottom: 8px; + + .colorNameOne { + flex: 1; + font-size: 24px; + font-family: PingFangSC-Regular, PingFang SC; + font-weight: 400; + color: #000000; + width: 133px; + height: 30px; + text-align: left; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + } + + .colorName { + flex: 1; + font-size: 24px; + font-family: PingFangSC-Regular, PingFang SC; + font-weight: 400; + color: #000000; + text-align: center; + } + + .colorNameTwo { + flex: 1; + font-size: 24px; + font-family: PingFangSC-Regular, PingFang SC; + font-weight: 400; + color: #000000; + text-align: right; + } + } + } + + + } + + .lineOne { + width: 638px; + height: 1px; + background: #000000; + opacity: 0.1; + margin-left: 32px; + margin-top: 24px; + } + + .bottomMsg { + + margin-top: 16px; + display: flex; + align-items: center; + justify-content: space-between; + + .msgLeft { + margin-left: 32px; + font-size: 24px; + font-family: PingFangSC-Regular, PingFang SC; + font-weight: 400; + color: #000000; + } + + .msgRight { + margin-right: 32px; + font-size: 24px; + font-family: PingFangSC-Regular, PingFang SC; + font-weight: 400; + color: #000000; + } + + .msgRightOne { + margin-right: 32px; + font-size: 28px; + font-family: PingFangSC-Medium, PingFang SC; + font-weight: 500; + color: #F64861; + } + } + + .bottomBox { + margin-top: 40px; + } +} \ No newline at end of file diff --git a/src/pages/refundPage/components/itemList/index.tsx b/src/pages/refundPage/components/itemList/index.tsx new file mode 100644 index 0000000..2d29df6 --- /dev/null +++ b/src/pages/refundPage/components/itemList/index.tsx @@ -0,0 +1,104 @@ +import { ScrollView, View } from '@tarojs/components' +import { memo, useCallback, useEffect, useMemo, useState } from 'react' +import styles from './index.module.scss' +import classnames from 'classnames' +// import BottomBtns from '@/components/BottomBtns' +import { formatPriceDiv } from '@/common/format' +import Taro from '@tarojs/taro' + +interface propsObj { + obj: any, + cancle?: (arg: any, obj: any) => void, + nextBuy?: (arg: any, obj: any) => void, + toPay?: (arg: any, obj: any) => void +} + + +export default memo((props: propsObj) => { + const navTo = (e) => { + Taro.navigateTo({ + url: '/pages/orderDetails/index?id=' + props?.obj?.id + }) + } + + + return ( + navTo(e)}> + + 单号：{props?.obj?.order_no} + {props?.obj?.stage_name} + + {props?.obj?.purchaser_name} + + + + 颜色 ({props?.obj?.total_colors}) + + + + + {props?.obj?.product_list[0]?.code} {props?.obj?.product_list[0]?.name} + {props?.obj?.sale_mode === 0 ? '大货' : props?.obj?.sale_mode === 1 ? '剪版' : '散剪'} + + {props?.obj?.shipment_mode_name} + + + {props?.obj?.product_list[0]?.product_colors[0]?.code} {props?.obj?.product_list[0]?.product_colors[0]?.name} + x{ + props?.obj?.product_list && props?.obj.sale_mode === 0 + ? (props?.obj?.product_list && props?.obj.stage == 0) || + props?.obj.stage == 1 || + props?.obj.stage == 2 + ? props?.obj?.product_list[0]?.product_colors[0]?.roll + : props?.obj.stage == 5 || props?.obj.stage == 6 || props?.obj.stage == 3 + ? props?.obj?.product_list[0]?.product_colors[0]?.return_roll + : props?.obj?.product_list[0]?.product_colors[0]?.roll + : props?.obj?.product_list && + props?.obj?.product_list[0]?.product_colors[0]?.length / 100 + } {props?.obj?.sale_mode === 0 ? '条' : 'm'} + ¥ {props?.obj?.product_list[0]?.product_colors[0]?.sale_price / 100}/kg + + { + props?.obj?.product_list[0]?.product_colors?.length > 1 && <> + + {props?.obj?.product_list[0]?.product_colors[1]?.code} {props?.obj?.product_list[0]?.product_colors[1]?.name} + x{ + props?.obj?.product_list && props?.obj.sale_mode === 0 + ? (props?.obj?.product_list && props?.obj.stage == 0) || + props?.obj.stage == 1 || + props?.obj.stage == 2 + ? props?.obj?.product_list[0]?.product_colors[1]?.roll + : props?.obj.stage == 5 || props?.obj.stage == 6 || props?.obj.stage == 3 + ? props?.obj?.product_list[0]?.product_colors[1]?.return_roll + : props?.obj?.product_list[0]?.product_colors[1]?.roll + : props?.obj?.product_list && + props?.obj?.product_list[0]?.product_colors[1]?.length / 100 + } {props?.obj?.sale_mode === 0 ? '条' : 'm'} + ¥ {props?.obj?.product_list[0]?.product_colors[1]?.sale_price / 100}/kg + + + } + + + + + 布料信息： + {props?.obj?.total_fabrics} 种面料，{props?.obj?.total_colors} 种颜色，共 {props?.obj?.sale_mode === 0 ? props?.obj?.total_number : props?.obj?.total_number / 100} {props?.obj?.sale_mode === 0 ? '条' : 'm'} + + + 退款金额： + { + (props?.obj.stage == 5 || props?.obj.stage == 6 || props?.obj.stage == 3) && ¥{formatPriceDiv(props?.obj?.refundable_amount)} + } + + {/* + props?.cancle?.(e, props?.obj)} + nextBuy={(e) => props?.nextBuy?.(e, props?.obj)} + toPay={(e) => props?.toPay?.(e, props?.obj)} + > + */} + + ) +}) \ No newline at end of file diff --git a/src/pages/refundPage/components/tabs/index.module.scss b/src/pages/refundPage/components/tabs/index.module.scss new file mode 100644 index 0000000..fa9ec85 --- /dev/null +++ b/src/pages/refundPage/components/tabs/index.module.scss @@ -0,0 +1,42 @@ +.flexBox { + width: 100%; + height: 102px; + background: #ffffff; + display: flex; + position: sticky; + top: 80px; + .itemBox { + position: relative; + flex: 1; + min-width: 138px; + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + text-align: center; + height: 102px; + + .itemFont { + font-size: 28px; + font-family: Microsoft YaHei, Microsoft YaHei-Bold; + font-weight: 700; + color: #000000; + } + + .activeItems { + font-size: 28px; + font-family: Microsoft YaHei, Microsoft YaHei-Regular; + font-weight: 400; + color: #337FFF; + } + + .borderBox { + position: absolute; + bottom: 0; + width: 138px; + height: 6px; + background: #337FFF; + border-radius: 4px; + } + } +} \ No newline at end of file diff --git a/src/pages/refundPage/components/tabs/index.tsx b/src/pages/refundPage/components/tabs/index.tsx new file mode 100644 index 0000000..6ed5f40 --- /dev/null +++ b/src/pages/refundPage/components/tabs/index.tsx @@ -0,0 +1,32 @@ +import { View, Input, Button } from '@tarojs/components' +import { useCallback, useEffect, useMemo, useRef, useState, memo } from 'react' +import styles from "./index.module.scss" +import classnames from "classnames"; + +interface Props { + list: any[], + handChose?: (any) => void +} +export default memo((props: Props) => { + const { list = [], handChose } = props + + return ( + + { + list.map((item, index) => { + return ( + handChose?.(item)}> + {item?.name} + { + item.showBorder && + } + + ) + }) + } + + ) +}) \ No newline at end of file diff --git a/src/pages/refundPage/components/timePicker/index.scss b/src/pages/refundPage/components/timePicker/index.scss new file mode 100644 index 0000000..fd9a07a --- /dev/null +++ b/src/pages/refundPage/components/timePicker/index.scss @@ -0,0 +1,64 @@ +.loins-calendar { + + background-color: #ffffff; + + &-tabbar { + padding: 43px 100px 30px 100px; + display: flex; + flex-direction: row; + justify-content: space-between; + align-items: center; + } + + &-title { + font-size: 36px; + font-family: Helvetica; + color: #333333; + line-height: 48px; + } + + .title-c { + display: inline-block; + width: calc(100% / 7); + text-align: center; + font-size: 30px; + font-weight: 400; + color: #606060; + line-height: 40px; + margin-bottom: 25px; + } + + width: 662rpx; + margin-left: 44rpx; + + .day-content { + text-align: center; + + .day-c { + display: inline-block; + width: calc(100% / 7); + text-align: center; + margin-bottom: 30px; + + .day { + width: 80px; + height: 80px; + // background: #337FFF; + // border-radius: 16px; + line-height: 80px; + font-size: 32px; + font-weight: 500; + color: #000; + text-align: center; + } + + .desc { + height: 28px; + font-size: 20px; + font-weight: 400; + color: #202020; + text-align: center; + } + } + } +} \ No newline at end of file diff --git a/src/pages/refundPage/components/timePicker/index.tsx b/src/pages/refundPage/components/timePicker/index.tsx new file mode 100644 index 0000000..b8ff636 --- /dev/null +++ b/src/pages/refundPage/components/timePicker/index.tsx @@ -0,0 +1,146 @@ +import Popup from '@/components/popup' +import React, { useState, memo, useEffect } from "react"; +import Taro from "@tarojs/taro"; +import { View } from "@tarojs/components"; +// import { AtIcon } from 'taro-ui' +import './index.scss' + + + + +interface Props { + showTime: true | false, + closePopup?: () => void +} +export default memo((props: Props) => { + const { + showTime = false, + closePopup + } = props + //每月多少天 + let MONTH_DAYS = [31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31]; + const WEEK_NAMES = ['日', '一', '二', '三', '四', '五', '六']; + const LINES = [1, 2, 3, 4, 5, 6]; + const [year, setLoinsYear] = useState(0); + let nowTime = new Date(Date.parse(new Date().toString())); + const [month, seLoinstMonth] = useState(nowTime.getMonth()); + const [currentDate, setcurrentDate] = useState(new Date()); + const [tag, setTag] = useState(false); + //获取当前月份 + const getMonth = (date: Date): number => { + return date.getMonth(); + } + //获取当前年份 + const getFullYear = (date: Date): number => { + // console.log(date.getFullYear()) + return date.getFullYear(); + } + + const getCurrentMonthDays = (month: number, year: number): number => { + let _year = year + currentDate.getFullYear(); + if (_year % 100 != 0 && _year % 4 == 0 || _year % 400 == 0) { + MONTH_DAYS = [31, 29, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31]; + } + return MONTH_DAYS[month] + } + //当前月第一天是周几 + const getDateByYearMonth = (year: number, month: number, day: number = 1): Date => { + var date = new Date() + date.setFullYear(year) + date.setMonth(month, day) + return date + } + const getWeeksByFirstDay = (year: number, month: number): number => { + var date = getDateByYearMonth(year, month) + return date.getDay() + } + const getDayText = (line: number, weekIndex: number, weekDay: number, monthDays: number): any => { + var number = line * 7 + weekIndex - weekDay + 1 + if (number <= 0 || number > monthDays) { + return   + } + return + clickItem(line)}>{number} + + } + + const setCurrentYearMonth = (date) => { + var month = getMonth(date) + var year = getFullYear(date) + setLoinsYear(year); + seLoinstMonth(month) + setTag(false) + } + + const monthChange = (monthChanged: number) => { + if (tag) { + return; + } else { + setTag(true) + } + + var monthAfter = month + monthChanged + var date = getDateByYearMonth(year, monthAfter) + setCurrentYearMonth(date) + } + const formatNumber = (num: number): string => { + var _num = num + 1 + return _num < 10 ? `0${_num}` : `${_num}` + } + + // let monthDays = getCurrentMonthDays(month); + let weekDay = getWeeksByFirstDay(year, month); + + let _startX = 0; + const clickItem = (item) => { + console.log(item, 666) + } + return ( + closePopup?.()}> + { + if (_startX > val.changedTouches[0]['clientX'] + 30) { + monthChange(1); + } + if (_startX < val.changedTouches[0]['clientX'] - 30) { + monthChange(-1); + } + }} onTouchStart={(val) => { + _startX = val.changedTouches[0]['clientX'] + + }} + > + + + {/* { + monthChange(-1); + }}> + */} + + {year + currentDate.getFullYear()} 年 {formatNumber(month)}月 + + {/* { + monthChange(1); + }}> */} + + + { + WEEK_NAMES.map((week, key) => { + return {week} + }) + } + { + LINES.map((l, key) => { + return + { + WEEK_NAMES.map((week, index) => { + return getDayText(key, index, weekDay, getCurrentMonthDays(month, year)) + }) + } + + }) + } + + + ) +}) \ No newline at end of file diff --git a/src/pages/refundPage/index.config.ts b/src/pages/refundPage/index.config.ts new file mode 100644 index 0000000..cb0dbd7 --- /dev/null +++ b/src/pages/refundPage/index.config.ts @@ -0,0 +1,5 @@ +export default { + navigationBarTitleText: '退款/售后', + // enablePullDownRefresh: true, + // "backgroundTextStyle": "dark" +} diff --git a/src/pages/refundPage/index.module.scss b/src/pages/refundPage/index.module.scss new file mode 100644 index 0000000..ff17f2c --- /dev/null +++ b/src/pages/refundPage/index.module.scss @@ -0,0 +1,168 @@ +.flexBox { + display: flex; + width: 200px; + align-items: center; + justify-content: flex-end; +} + +.icon_shaixuan { + color: #0D7CFF; + font-size: 35px; + margin-right: 10px; +} + +.activeshaixuan { + color: #000; + font-size: 35px; + margin-right: 10px; +} + +.shaixuan { + margin-right: 32px; + font-size: 28px; + font-family: PingFangSC-Regular, PingFang SC; + font-weight: 400; + color: #000000; +} + +.activeshai { + color: #0D7CFF; + margin-right: 32px; + font-size: 28px; + font-family: PingFangSC-Regular, PingFang SC; + font-weight: 400; +} + +.order_list { + height: calc(100vh - 300px); + background: #f7f7f7; + + .bigBpx { + height: 200px; + } + + .kongboxTwo { + height: 100px; + } +} + +.popupBox { + padding-bottom: env(safe-area-inset-bottom); + + + + + .thirdBox { + margin-top: 20px; + padding-left: 48px; + + .thirdTopfont { + font-size: 28px; + font-family: PingFangSC-Medium, PingFang SC; + font-weight: 500; + color: #000000; + } + + .flexModebox { + margin-top: 24px; + display: flex; + flex-wrap: wrap; + + .activemodeBox { + margin-bottom: 16px; + margin-right: 16px; + // width: 152px; + // height: 68px; + padding: 17px 34px 17px 34px; + background: rgba(51, 127, 255, 0.1); + border-radius: 8px; + font-size: 28px; + font-family: PingFangSC-Regular, PingFang SC; + font-weight: 400; + color: #337FFF; + text-align: center; + // line-height: 68px; + border: 1px solid #337FFF; + box-sizing: border-box; + } + + .modeBox { + margin-bottom: 16px; + margin-right: 16px; + padding: 17px 34px 17px 34px; + // width: 152px; + // height: 68px; + background: #f6f6f6; + border-radius: 8px; + font-size: 28px; + font-family: PingFangSC-Regular, PingFang SC; + font-weight: 400; + color: #000000; + border: 1px solid #f6f6f6; + text-align: center; + // line-height: 68px; + box-sizing: border-box; + // opacity: 0.4; + } + } + } + + .bottomBox { + width: 750px; + height: 160px; + background: #FFFFFF; + position: fixed; + bottom: 0; + z-index: 99; + display: flex; + padding-top: 16px; + justify-content: space-between; + + .resetBox { + margin-left: 48px; + width: 311px; + height: 80px; + border-radius: 44px; + border: 1px solid #087EFF; + font-size: 28px; + font-family: PingFangSC-Medium, PingFang SC; + font-weight: 500; + color: #337FFF; + text-align: center; + line-height: 80px; + } + + .button { + margin-right: 32px; + width: 311px; + height: 80px; + background: #68b4ff; + border-radius: 44px; + font-size: 32px; + font-family: PingFangSC-Medium, PingFang SC; + font-weight: 500; + color: #FFFFFF; + text-align: center; + line-height: 80px; + } + + .activeButton { + margin-right: 32px; + width: 311px; + height: 80px; + background: #337FFF; + border-radius: 44px; + font-size: 32px; + font-family: PingFangSC-Medium, PingFang SC; + font-weight: 500; + color: #fff; + text-align: center; + line-height: 80px; + } + } + + // .areaBox { + // height: calc($customTabBarHeight + env(safe-area-inset-bottom)); + // width: 100%; + // } +} \ No newline at end of file diff --git a/src/pages/refundPage/index.tsx b/src/pages/refundPage/index.tsx new file mode 100644 index 0000000..90cf728 --- /dev/null +++ b/src/pages/refundPage/index.tsx @@ -0,0 +1,343 @@ +import { View, Input, Button } from '@tarojs/components' +import { useCallback, useEffect, useMemo, useRef, useState, } from 'react' +import Search from '@/components/search' +import { dataLoadingStatus, getFilterData } from '@/common/util' +import styles from "./index.module.scss" +import classnames from "classnames"; +import Popup from '@/components/popup' +import InfiniteScroll from '@/components/infiniteScroll' +import Taro, { faceVerifyForPay, useDidShow } from '@tarojs/taro' +import ItemList from './components/itemList' +import { formatDateTime, formatHashTag, formatImgUrl, formatPriceDiv, formatWeightDiv } from '@/common/format' +import { + mpreturnApplyOrderlist, + mpenumreturnStage, + mpenumreturnType +} from "@/api/refound" +import Tabs from "./components/tabs" +import TimePicker from "./components/timePicker" +export default () => { + + + + //获取订单列表 + const { fetchData: listFetchData, state: orderState } = mpreturnApplyOrderlist() + const [orderData, setOrderData] = useState<{ list: any[]; total: number }>({ list: [], total: 0 }) + const getOrderList = async () => { + let res = await listFetchData({ + ...searchField + // ...getFilterData(searchField), + // ...getFilterData(searchObj) + }) + setOrderData((e) => ({ ...e, list: res.data?.list, total: res.data?.total })) + // setshowPopup(false) + setRefresherTriggeredStatus(() => false) + } + + //页码和页数 + + const [searchField, setSearchField] = useState< + { + status: number | unknown; + page: number; + size: number; + name: string; + sale_mode: number | string; + stage: number | string; + return_type: number | string; + saleStartTime: number | string; + saleEndTime: number | string; + }>({ + status: 1, + page: 1, + size: 10, + name: '', + sale_mode: '', + stage: '', + return_type: '', + saleStartTime: '', + saleEndTime: '' + }) + const pageNum = useRef({ size: searchField.size, page: searchField.page }) + + //监听筛选条件变化 + useEffect(() => { + getOrderList() + }, [searchField]) + + //输入了搜索关键字 + const getSearchData = useCallback((e) => { + pageNum.current.page = 1 + setOrderData(() => ({ list: [], total: 0 })) + setSearchField((val) => ({ ...val, name: e, size: 10 })) + }, []) + + //列表下拉刷新 + const [refresherTriggeredStatus, setRefresherTriggeredStatus] = useState(false) + const getRefresherRefresh = async () => { + pageNum.current.size = 1 + setRefresherTriggeredStatus(true) + setSearchField((val) => ({ ...val, size: 10 })) + } + //数据加载状态 + const statusMore = useMemo(() => { + return dataLoadingStatus({ list: orderData.list, total: orderData.total, status: orderState.loading }) + }, [orderData, orderState]) + + //上拉加载数据 + const getScrolltolower = useCallback(() => { + if (orderData.list.length < orderData.total) { + pageNum.current.page++ + const size = pageNum.current.size * pageNum.current.page + setSearchField({ ...searchField, size }) + } + }, [orderData]) + + + //顶部栏 + const [TarBarList, setTarBarList] = useState([{ id: 1, name: '售后申请', showBorder: true }, { id: 2, name: '申请记录', showBorder: false }]) + const handChose = (item) => { + if (item.id === searchField.status) return + TarBarList.map(it => { + if (it.id === item.id) { + it.showBorder = true + } else { + it.showBorder = false + } + setTarBarList([...TarBarList]) + pageNum.current.page = 1 + setOrderData(() => ({ list: [], total: 0 })) + setSearchField((val) => ({ ...val, size: 10, status: item.id })) + }) + } + + //筛选内容展示 + const [showPopup, setshowPopup] = useState(false) + const showSelctPopup = () => { + setshowPopup(true) + } + + //关闭筛选内容展示 + const closePopup = () => { + setshowPopup(false) + } + + //订单类型 + const [modeList, setModeList] = useState([{ id: -1, name: '不限' }, { id: 0, name: '大货' }, { id: 1, name: '剪版' }, { id: 2, name: '散剪' }]) + //选择订单类型 + const handCheckMode = (item) => { + modeList.map(it => { + if (it.id === item.id) { + it.checked = true + } else { + it.checked = false + } + return it + }) + setModeList([...modeList]) + setSearchField((e) => ({ ...e, sale_mode: item.id })) + } + useEffect(() => { + getStagelist() + getTypeList() + }, []) + + + + //售后状态 + const [stageList, setStageList] = useState([]) + const { fetchData: stageFetch } = mpenumreturnStage() + const getStagelist = async () => { + const res = await stageFetch() + if (res.data) { + res.data.list.unshift({ id: '', name: '不限', checked: false }) + res.data.list.map(it => { + it.checked = false + return it + }) + setStageList([...res.data.list]) + + } + } + + //选择售后状态 + const handCheckStange = (item) => { + stageList.map(it => { + if (it.id === item.id) { + it.checked = true + } else { + it.checked = false + } + return it + }) + setStageList([...stageList]) + setSearchField((val) => ({ ...val, size: 10, stage: item.id })) + } + + + + //退款类型 + const [typeList, setTypeList] = useState([]) + const { fetchData: typeFetch } = mpenumreturnType() + const getTypeList = async () => { + const res = await typeFetch() + if (res.data) { + res.data.list.unshift({ id: '', name: '不限', checked: false }) + res.data.list.map(it => { + it.checked = false + return it + }) + setTypeList([...res.data.list]) + } + } + + //选择售后类型 + const handType = (item) => { + typeList.map(it => { + if (it.id === item.id) { + it.checked = true + } else { + it.checked = false + } + return it + }) + setTypeList([...typeList]) + setSearchField((val) => ({ ...val, size: 10, return_type: item.id })) + } + + //是否不允许确认筛选 + const isDisabled = useMemo(() => { + if (searchField.stage !== '' || + searchField.sale_mode !== '' || + searchField.return_type !== '' || + searchField.sale_mode !== '' || + searchField.saleStartTime !== '' || + searchField.saleEndTime !== '' + ) { + return false + } else { + return true + } + }, [searchField]) + + + //重置 + const handReset = () => { + const arrOne = resetArr(modeList) + setModeList([...arrOne]) + const arrTwo = resetArr(typeList) + setTypeList([...arrTwo]) + const arrThree = resetArr(stageList) + setStageList([...arrThree]) + setSearchField((e) => ({ + ...e, + sale_mode: '', + stage: '', + return_type: '', + saleStartTime: '', + saleEndTime: '' + })) + } + + //数组重置 + const resetArr = (arr) => { + arr.map(it => { + it.checked = false + return it + }) + return arr + } + + + //关闭时间筛选 + const handClose = () => { + + } + + return ( + <> + + + showSelctPopup()}> + + 筛选 + + + + handChose?.(item)}> + + + {orderData?.list?.map((item, index) => { + return ( + + + + ) + })} + + + + closePopup()}> + + + 售后状态 + + { + stageList.map((item, index) => { + return ( + { handCheckStange(item) }} className={classnames(item.checked ? styles.activemodeBox : styles.modeBox)} key={index}>{item.name} + ) + }) + } + + + + 订单类型 + + { + modeList.map((item, index) => { + return ( + { handCheckMode(item) }} className={classnames(item.checked ? styles.activemodeBox : styles.modeBox)} key={index}>{item.name} + ) + }) + } + + + + 退款类型 + + { + typeList.map((item, index) => { + return ( + { handType(item) }} className={classnames(item.checked ? styles.activemodeBox : styles.modeBox)} key={index}>{item.name} + ) + }) + } + + + {isDisabled} + + + + + + + + {/* */} + + + + + ) +} \ No newline at end of file diff --git a/src/pages/searchPage/index.tsx b/src/pages/searchPage/index.tsx index 3da27db..a4afdd4 100644 --- a/src/pages/searchPage/index.tsx +++ b/src/pages/searchPage/index.tsx @@ -41,11 +41,12 @@ export default memo(() => { //选择的类型 const [typeList, setTypeList] = useState([{ id: 0, name: '大货', checked: true }, { id: 1, name: '剪版', checked: false }, { id: 2, name: '散剪', checked: false }]) const [goodList, setGoodlist] = useState([]) + const onj = JSON.parse(Taro.getStorageSync('userInfo')) const [search, setSearchObj] = useState({ modeId: 0, goodsId: null, code_or_name: '', - physical_warehouse: 1 + physical_warehouse: onj.physical_warehouse }) const [showShopCart, setShowShopCart] = useState(false)