diff --git a/iconfont.json b/iconfont.json index d0e744f..ac9a6ae 100644 --- a/iconfont.json +++ b/iconfont.json @@ -1,5 +1,5 @@ { - "symbol_url": "//at.alicdn.com/t/c/font_3786318_sqfeq7399ga.js", + "symbol_url": "//at.alicdn.com/t/c/font_3786318_zkugv9z8j0e.js", "save_dir": "./src/components/iconfont", "use_typescript": false, "use_rpx": true, diff --git a/src/app.config.ts b/src/app.config.ts index 22920f0..fefcef8 100644 --- a/src/app.config.ts +++ b/src/app.config.ts @@ -266,5 +266,11 @@ export default { 'index', ], }, + { + root: 'pages/activityIncome', + pages: [ + 'index', + ], + }, ], } diff --git a/src/components/codeSelect/index.module.scss b/src/components/codeSelect/index.module.scss index 305fc2e..1be6589 100644 --- a/src/components/codeSelect/index.module.scss +++ b/src/components/codeSelect/index.module.scss @@ -45,4 +45,5 @@ opacity: 0.08; width: 100vw; height: 100vh; + z-index: 1000; } diff --git a/src/components/codeSelect/index.tsx b/src/components/codeSelect/index.tsx index 6243e0c..ef69f6f 100644 --- a/src/components/codeSelect/index.tsx +++ b/src/components/codeSelect/index.tsx @@ -72,14 +72,14 @@ export default ({ y, orderObj = {} }: param) => { 原始码单预览 - {!!orderObj?.custom_print_id && + {/* {!!orderObj?.custom_print_id && 自定义码单预览 - } - + } */} + {/* {orderObj?.custom_print_id ? '编辑自定义码单' : '新建自定义码单'} - + */} } setShowCode(!showCode)}>码单 diff --git a/src/components/iconfont/iconfont.tsx b/src/components/iconfont/iconfont.tsx index 2e2ae56..368eee2 100644 --- a/src/components/iconfont/iconfont.tsx +++ b/src/components/iconfont/iconfont.tsx @@ -1,90 +1,99 @@ -import React, { useState, useEffect, FC } from "react"; -import { Block, View } from "@tarojs/components"; -import "./iconfont.scss"; -import Taro from "@tarojs/taro"; -import classnames from "classnames"; +import React, { useState, useEffect, FC } from "react"; +import { Block, View } from "@tarojs/components"; +import "./iconfont.scss"; +import Taro from "@tarojs/taro"; +import classnames from "classnames"; + +const SystemWidth = Taro.getSystemInfoSync().windowWidth +const quot = '"' + +function hex2rgb(hex) { + const rgb: number[] = []; + + hex = hex.substr(1); + + if (hex.length === 3) { + hex = hex.replace(/(.)/g, "$1$1"); + } + + hex.replace(/../g, function(color: string) { + rgb.push(parseInt(color, 0x10)); + return color; + }); + + return "rgb(" + rgb.join(",") + ")"; +} + +export type IconNames = 'icon-lijitixian' | 'icon-hongbao' | 'icon-xuanzhongshijian' | 'icon-zhankai1' | 'icon-shouqi1' | 'icon-shoucang1' | 'icon-weixinyijiandenglu' | 'icon-nanzhuang' | 'icon-zhuanyefenlei' | 'icon-tongzhuang' | 'icon-chaoliumianliao' | 'icon-nvzhuang' | 'icon-dingwei' | 'icon-xuanzhongyanse' | 'icon-sekajianyanglingqu' | 'icon-lingseka' | 'icon-lingjianyang' | 'icon-gerenzhongxin-dianji' | 'icon-shouye-dianji' | 'icon-gouwuche-weidianji' | 'icon-gerenzhongxin-weidianji' | 'icon-gouwuche-dianji' | 'icon-shouye-weidianji' | 'icon-paixu1' | 'icon-zhankai' | 'icon-shouqi' | 'icon-tips' | 'icon-dianhua' | 'icon-paixu' | 'icon-shaixuan' | 'icon-bodakehujingli' | 'icon-guanfangweixinkefu' | 'icon-tuijianbiaoqian' | 'icon-rukou' | 'icon-renzhengchenggong' | 'icon-wodekefu' | 'icon-yanseduibi' | 'icon-dizhiguanli' | 'icon-weixin' | 'icon-riqi' | 'icon-shuru' | 'icon-a-0tianzhangqi' | 'icon-huodaofukuan' | 'icon-huozhuziti' | 'icon-saomazhifu' | 'icon-xianxiahuikuan' | 'icon-yufukuan' | 'icon-xinzengshoucangjia' | 'icon-qingchusousuo' | 'icon-xuanzechenggong' | 'icon-gongnengtubiao-saomiao' | 'icon-bianjizidingyimadan' | 'icon-zidingyimadanyulan' | 'icon-yuanshimadanyulan' | 'icon-xiala' | 'icon-shangla' | 'icon-qingchuxinxi' | 'icon-sousuo' | 'icon-guanli' | 'icon-bianji' | 'icon-shoucangjia' | 'icon-shezhi' | 'icon-tishi' | 'icon-erweima' | 'icon-dianjishoucang' | 'icon-gouwuche' | 'icon-shoucangchenggong' | 'icon-fenxiangshangpin' | 'icon-kefu' | 'icon-xinzenganniu' | 'icon-jianshaoanniu' | 'icon-daifahuo2' | 'icon-daishouhuo2' | 'icon-tuikuan-shouhou' | 'icon-daipeibu2' | 'icon-daifukuan2'; + +type PropsType = { + name: IconNames; + size?: number; + color?: string | string[]; + customStyle?: React.CSSProperties; + customClassName?: string; +}; + +const IconFont:FC = ({ + name, + size = 36, + color, + customStyle = {}, + customClassName = "" +}) => { + const [colors, setColors] = useState() + const [isStr, setIsStr] = useState(true) + const [svgSize, setSvgSize] = useState(() => (size / 750) * SystemWidth) + + useEffect(() => { + setIsStr(typeof color === 'string') + if (typeof color === 'string') { + setColors(color.indexOf('#') === 0 ? hex2rgb(color) : color) + } else { + setColors( + color?.map(function (item) { + return item.indexOf('#') === 0 ? hex2rgb(item) : item + }) + ) + } + return () => {} + }, [color]) + + useEffect(() => { + setSvgSize((size / 750) * SystemWidth) + }, [size]) + + // 也可以使用 if (name === 'xxx') { return } 来渲染,但是测试发现在ios下会有问题,报错 Maximum call stack啥的。下面这个写法没问题 + return ( + + {/* icon-colorCard 本地svg */ } + {/* { name === 'icon-colorCard' && () } */} + {/* icon-alipay */} + {/* {name === "icon-alipay" && ( + + )} */} + {/* icon-lijitixian */} -const SystemWidth = Taro.getSystemInfoSync().windowWidth -const quot = '"' + { name === 'icon-lijitixian' && () } +{/* icon-hongbao */} -function hex2rgb(hex) { - const rgb: number[] = []; + { name === 'icon-hongbao' && () } +{/* icon-xuanzhongshijian */} - hex = hex.substr(1); - - if (hex.length === 3) { - hex = hex.replace(/(.)/g, "$1$1"); - } - - hex.replace(/../g, function(color: string) { - rgb.push(parseInt(color, 0x10)); - return color; - }); - - return "rgb(" + rgb.join(",") + ")"; -} - -export type IconNames = 'icon-zhankai1' | 'icon-shouqi1' | 'icon-shoucang1' | 'icon-weixinyijiandenglu' | 'icon-nanzhuang' | 'icon-zhuanyefenlei' | 'icon-tongzhuang' | 'icon-chaoliumianliao' | 'icon-nvzhuang' | 'icon-dingwei' | 'icon-xuanzhongyanse' | 'icon-sekajianyanglingqu' | 'icon-lingseka' | 'icon-lingjianyang' | 'icon-gerenzhongxin-dianji' | 'icon-shouye-dianji' | 'icon-gouwuche-weidianji' | 'icon-gerenzhongxin-weidianji' | 'icon-gouwuche-dianji' | 'icon-shouye-weidianji' | 'icon-paixu1' | 'icon-zhankai' | 'icon-shouqi' | 'icon-tips' | 'icon-dianhua' | 'icon-paixu' | 'icon-shaixuan' | 'icon-bodakehujingli' | 'icon-guanfangweixinkefu' | 'icon-tuijianbiaoqian' | 'icon-rukou' | 'icon-renzhengchenggong' | 'icon-wodekefu' | 'icon-yanseduibi' | 'icon-dizhiguanli' | 'icon-weixin' | 'icon-riqi' | 'icon-shuru' | 'icon-a-0tianzhangqi' | 'icon-huodaofukuan' | 'icon-huozhuziti' | 'icon-saomazhifu' | 'icon-xianxiahuikuan' | 'icon-yufukuan' | 'icon-xinzengshoucangjia' | 'icon-qingchusousuo' | 'icon-xuanzechenggong' | 'icon-gongnengtubiao-saomiao' | 'icon-bianjizidingyimadan' | 'icon-zidingyimadanyulan' | 'icon-yuanshimadanyulan' | 'icon-xiala' | 'icon-shangla' | 'icon-qingchuxinxi' | 'icon-sousuo' | 'icon-guanli' | 'icon-bianji' | 'icon-shoucangjia' | 'icon-shezhi' | 'icon-tishi' | 'icon-erweima' | 'icon-dianjishoucang' | 'icon-gouwuche' | 'icon-shoucangchenggong' | 'icon-fenxiangshangpin' | 'icon-kefu' | 'icon-xinzenganniu' | 'icon-jianshaoanniu' | 'icon-daifahuo2' | 'icon-daishouhuo2' | 'icon-tuikuan-shouhou' | 'icon-daipeibu2' | 'icon-daifukuan2'; - -type PropsType = { - name: IconNames; - size?: number; - color?: string | string[]; - customStyle?: React.CSSProperties; - customClassName?: string; -}; - -const IconFont:FC = ({ - name, - size = 36, - color, - customStyle = {}, - customClassName = "" -}) => { - const [colors, setColors] = useState() - const [isStr, setIsStr] = useState(true) - const [svgSize, setSvgSize] = useState(() => (size / 750) * SystemWidth) - - useEffect(() => { - setIsStr(typeof color === 'string') - if (typeof color === 'string') { - setColors(color.indexOf('#') === 0 ? hex2rgb(color) : color) - } else { - setColors( - color?.map(function (item) { - return item.indexOf('#') === 0 ? hex2rgb(item) : item - }) - ) - } - return () => {} - }, [color]) - - useEffect(() => { - setSvgSize((size / 750) * SystemWidth) - }, [size]) - - // 也可以使用 if (name === 'xxx') { return } 来渲染,但是测试发现在ios下会有问题,报错 Maximum call stack啥的。下面这个写法没问题 - return ( - - {/* icon-colorCard 本地svg */ } - {/* { name === 'icon-colorCard' && () } */} - {/* icon-alipay */} - {/* {name === "icon-alipay" && ( - - )} */} - {/* icon-zhankai1 */} + { name === 'icon-xuanzhongshijian' && () } +{/* icon-zhankai1 */} { name === 'icon-zhankai1' && () } {/* icon-shouqi1 */} @@ -303,9 +312,9 @@ const IconFont:FC = ({ {/* icon-daifukuan2 */} { name === 'icon-daifukuan2' && () } - - - ) -} - -export default IconFont + + + ) +} + +export default IconFont diff --git a/src/components/returnCashModal/index.module.scss b/src/components/returnCashModal/index.module.scss new file mode 100644 index 0000000..07b0a14 --- /dev/null +++ b/src/components/returnCashModal/index.module.scss @@ -0,0 +1,102 @@ +.organizationNameModal { + width: 75vw; + background-color: #fff; + border-radius: 20px; + padding-top: 20px; + overflow: hidden; + .inputBar { + border: 1px solid transparent; + background-color: #f5f5f5; + border-radius: 20px; + padding: 20px 42px; + margin: 32px 40px; + margin-bottom: 0; + font-size: 26px; + color: #333; + &_focus { + border: 1px solid #337fff; + } + &_error { + border: 1px solid #f64861; + color: #f64861; + } + } + + &_title { + padding: 10px; + text-align: center; + margin-bottom: 15px; + font-weight: 700; + color: rgba(0, 0, 0, 0.8); + } + &_content { + margin-bottom: 20px; + display: flex; + flex-flow: column nowrap; + justify-content: center; + font-size: 32px; + + .text { + text-align: center; + margin-bottom: 10px; + } + .activity_rules { + font-size: 24px; + color: rgba(0, 0, 0, 0.6); + padding: 0 20px; + margin-top: 15px; + } + } + &_bottomBar { + display: flex; + flex-flow: row nowrap; + align-items: center; + justify-content: space-between; + border-top: 1px solid #eee; + margin-top: 30px; + display: flex; + justify-content: center; + align-items: center; + height: 112px; + .button { + display: flex; + align-items: center; + justify-content: center; + text-align: center; + box-sizing: border-box; + width: 50%; + height: 100%; + font-size: 32px; + font-weight: 550; + padding: 30px 0; + border: 0; + background-color: #fff; + } + &_left { + border-right: 1px solid #eee; + color: #333; + } + &_right { + color: #337fff; + } + text { + font-size: 36px; + color: #337fff; + font-weight: 500; + text-align: center; + } + } + .tips { + display: flex; + background-color: #fef9f4; + font-size: 24px; + color: #ff9b33; + line-height: 1.5; + padding: 20px; + } +} +.error_tips { + color: #f64861; + padding: 10px 42px; + font-size: 20px; +} diff --git a/src/components/returnCashModal/index.tsx b/src/components/returnCashModal/index.tsx new file mode 100644 index 0000000..2ecf27c --- /dev/null +++ b/src/components/returnCashModal/index.tsx @@ -0,0 +1,46 @@ +import type { CommonEventFunction, InputProps } from '@tarojs/components' +import { Input, Text, View } from '@tarojs/components' +import React, { useMemo, useState } from 'react' +import classNames from 'classnames' +import Dialog from '../Dialog' +import IconFont from '../iconfont/iconfont' +import NormalButton from '../normalButton' +import styles from './index.module.scss' + +interface PropsType { + showModal: boolean + onClose?: () => void + onShowModalChange?: (val: boolean) => void + onCancel?: () => void + onConfirm?: (val: string) => void + zIndex?: number +} +const OrganizationNameModal = (props: PropsType) => { + const { + showModal = false, + onClose, + onShowModalChange, + onCancel, + onConfirm, + zIndex = 9999, + } = props + + const handleClose = () => { + onClose?.() + } + + return + + 下单活动返现 + + 下大货订单,每条布返现12元 + 邀请好友下单,每条布返现6元 + 活动规则:每笔订单产生的返佣,在已收货14天后会自动到账账户余额中,期间中途产生的退货条数会自动扣除,每天22:00自动更新收益。 + + + 我知道了 + + + +} +export default OrganizationNameModal diff --git a/src/components/tagMsg/index.module.scss b/src/components/tagMsg/index.module.scss new file mode 100644 index 0000000..3bd308c --- /dev/null +++ b/src/components/tagMsg/index.module.scss @@ -0,0 +1,88 @@ +.order_price{ + display: flex; + align-items: center; + justify-content: space-between; + width: 100%; + .close{ + width: 100vw; + height: 100vh; + position: fixed; + z-index: 999; + top: 0; + left: 0; + + } + &:nth-last-child(n+2) { + margin-bottom: 30px; + } + .order_price_text{ + font-size: $font_size_medium; + // margin-right: 10px; + display: flex; + .iconfont_msg{ + position: relative; + + } + .miconfont{ + font-size: 26px; + font-weight: normal; + margin-left: 5px; + } + .message{ + position: absolute; + top: 0; + background: rgba(168, 179, 189, 0.9); + z-index: 9; + min-height: 0; + padding: 20px; + box-sizing: border-box; + border-radius: 10px; + box-sizing: border-box; + word-break: break-all; + color: #fff; + // transition: top 0.2s ease-in-out; + transition: opacity 0.5s ease-in-out; + opacity: 0; + &::after{ + z-index: 99; + position: absolute; + width: 0; + height: 0; + content: " "; + left: 10px; + bottom: -28px; + border: 15px solid transparent; + border-top-color: rgba(168, 179, 189, 0.8); + } + } + } + .emphasis{ + font-weight: 700; + } + .order_price_num{ + color: $color_main; + font-weight: 700; + text{ + &:nth-child(1) { + font-size: $font_size_min; + } + &:nth-child(2) { + font-size: 26px; + } + &:nth-child(3) { + font-size: $font_size_medium; + } + } + } + .emphasis_num{ + text{ + &:nth-child(2) { + font-size: $font_size_big; + } + } + } + .refund_destination{ + font-size: 28px; + } + +} \ No newline at end of file diff --git a/src/components/tagMsg/index.tsx b/src/components/tagMsg/index.tsx new file mode 100644 index 0000000..c2306d8 --- /dev/null +++ b/src/components/tagMsg/index.tsx @@ -0,0 +1,59 @@ +import { Text, View } from '@tarojs/components' +import Taro from '@tarojs/taro' +import { memo, useCallback, useEffect, useLayoutEffect, useMemo, useState } from 'react' +import classnames from 'classnames' +import AmountShow from '../amountShow' +import styles from './index.module.scss' +import { formatKbPrice } from '@/common/common' + +interface Param { + style?: Object + titleStatus?: true|false // true 标题加大加深 + messageTitle?: string + messageWidth?: number + messageShow?: true|false +} +const EstimeatedAmount = ({ titleStatus = true, messageTitle = '', messageWidth = 430, messageShow = false }: Param) => { + const [show, setShow] = useState(messageShow) + const onClose = () => { + setShow(false) + } + const openShow = () => [ + setShow(true), + ] + + const [style, setStyle] = useState<{ top: string }>() + + // 设置弹出层高度 + const getDomDes = (id) => { + setTimeout(() => { + const query = Taro.createSelectorQuery() + query.select(id).boundingClientRect((rect) => { + const height = rect.height * 2 + 15 + setStyle(e => ({ ...e, top: `-${height}rpx`, opacity: 1 })) + }).exec() + }, 0) + } + useEffect(() => { + if (show) { + getDomDes('#message') + } + else { + setStyle(() => ({ top: '0' })) + } + }, [show]) + return ( + <> + + openShow()}> + + {show && {messageTitle}} + + + + {show && } + + + ) +} +export default memo(EstimeatedAmount) diff --git a/src/pages/activityIncome/index.config.ts b/src/pages/activityIncome/index.config.ts new file mode 100644 index 0000000..0a1b9c3 --- /dev/null +++ b/src/pages/activityIncome/index.config.ts @@ -0,0 +1,7 @@ +export default { + navigationBarTitleText: '活动收益', + navigationBarTextStyle: 'white', + enableShareAppMessage: true, + navigationBarBackgroundColor: '#4A7FFF', + backgroundColorTop: '#4A7FFF', +} diff --git a/src/pages/activityIncome/index.module.scss b/src/pages/activityIncome/index.module.scss new file mode 100644 index 0000000..9566e69 --- /dev/null +++ b/src/pages/activityIncome/index.module.scss @@ -0,0 +1,144 @@ +.main { + background-color: #f7f7f7ff; + min-height: 100vh; + .header { + background-color: #4a7fffff; + color: #fff; + .header_balance_total { + display: flex; + justify-content: space-between; + height: 242px; + align-items: center; + .balance { + margin-left: 48px; + font-size: 24px; + .balance_num { + font-size: 70px; + font-weight: bold; + } + .accumulative_count { + text { + font-size: 28px; + font-weight: 500; + display: inline-block; + padding: 0 8px; + } + } + } + .withdraw { + display: flex; + align-items: center; + justify-content: center; + background: linear-gradient(264deg, #4e82ff 0%, #719aff 100%); + box-shadow: -3px 0px 10px -2px rgba(51, 106, 240, 1); + border-radius: 100px 0px 0px 100px; + width: 200px; + height: 60px; + font-size: 24px; + padding-left: 10px; + box-sizing: border-box; + text { + margin-left: 10px; + } + } + } + .price_list { + display: flex; + .price_list_item { + flex: 1; + height: 100px; + font-size: 22px; + display: flex; + flex-direction: column; + justify-content: center; + border-top: 1px #fff solid; + padding-left: 48px; + box-sizing: border-box; + &:nth-child(1) { + border-right: 1px #fff solid; + } + text { + display: block; + &:nth-child(2) { + font-size: 28px; + margin-top: 6px; + font-weight: bold; + } + } + } + } + } + .con { + background: #ffffff; + border-radius: 16px; + margin: 24px; + .toBeSettled { + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + font-weight: 500; + padding-top: 40px; + .text { + font-size: 28px; + font-weight: 500; + } + .miconfont { + font-size: 30px; + } + .price { + font-size: 66px; + margin-top: 16px; + font-weight: bold; + } + } + .card { + padding: 0 24px 32px 24px; + box-sizing: border-box; + .title { + display: flex; + align-items: center; + text { + &:nth-child(1) { + width: 6px; + height: 24px; + background: #4a7fff; + } + &:nth-child(2) { + font-size: 28px; + font-weight: 700; + margin-left: 7px; + } + } + } + .card_list { + display: grid; + grid-template-columns: repeat(2, 1fr); + justify-content: space-between; + grid-gap: 24px; + margin-top: 24px; + .card_item { + background: #f6f7fb; + border-radius: 8px; + width: 100%; + height: 112px; + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + text { + &:nth-child(1) { + font-size: 32px; + color: rgba(0, 0, 0, 0.8); + } + &:nth-child(2) { + font-size: 28px; + color: rgba(0, 0, 0, 0.4); + margin-top: 8px; + } + } + } + } + } + } +} diff --git a/src/pages/activityIncome/index.tsx b/src/pages/activityIncome/index.tsx new file mode 100644 index 0000000..4b4c573 --- /dev/null +++ b/src/pages/activityIncome/index.tsx @@ -0,0 +1,99 @@ + +import { Icon, Text, View } from '@tarojs/components' +import Taro from '@tarojs/taro' +import classNames from 'classnames' +import { useState } from 'react' +import styles from './index.module.scss' +import IconFont from '@/components/iconfont/iconfont' +import { alert } from '@/common/common' + +export default () => { + const openMsg = () => { + Taro.showModal({ + title: '提示', + showCancel: false, + content: '每笔订单产生的返佣,在已收货14天后会自动到账账户余额中,期间中途产生的退货条数会自动扣除,每天9:00自动更新收益。', + success(res) { + }, + }) + } + + const openWithdraw = () => { + alert.none('若需提现,请联系线上客服进行处理') + } + return ( + + + + + 账户余额(元) + 20,330.00 + 累计收益20,330.00 + + + + 立即提现 + + + + + + 今日收益(元) + 5,000.00 + + + 近14日收益(元) + 5,000.00 + + + + + + 待结算收益(元) + 180.00 + + + + + 主动收益 + + + + 10条 + 大货条数 + + + 120元 + 大货收益 + + + + + + + 被动收益 + + + + 10条 + 大货条数 + + + 120元 + 大货收益 + + + 120元 + 大货收益 + + + 120元 + 大货收益 + + + + + + + ) +} diff --git a/src/pages/order/comfirm.tsx b/src/pages/order/comfirm.tsx index f525c5f..e5bbe61 100644 --- a/src/pages/order/comfirm.tsx +++ b/src/pages/order/comfirm.tsx @@ -1,4 +1,4 @@ -import { View } from '@tarojs/components' +import { Text, View } from '@tarojs/components' import Taro, { useDidShow, usePullDownRefresh } from '@tarojs/taro' import classnames from 'classnames' import { useCallback, useEffect, useMemo, useRef, useState } from 'react' @@ -17,6 +17,7 @@ import { SUBSCRIPTION_MESSAGE_SCENE } from '@/common/enum' import { UseSubscriptionMessage } from '@/use/useCommon' import { throttle } from '@/common/util' import MoveBtn from '@/components/moveBtn' +import IconFont from '@/components/iconfont/iconfont' const Comfirm = () => { const [showDesc, setShowDesc] = useState(false) diff --git a/src/pages/order/components/kindList/index.module.scss b/src/pages/order/components/kindList/index.module.scss index b452580..66c2e6d 100644 --- a/src/pages/order/components/kindList/index.module.scss +++ b/src/pages/order/components/kindList/index.module.scss @@ -3,10 +3,16 @@ color: $color_font_two; font-size: $font_size_medium; } +.order_con { + position: relative; + margin-top: 70px; +} .orders_list_con { background-color: #fff; border-radius: 20px; padding: 20px; + z-index: 999; + position: relative; .order_list { &:nth-child(n + 2) { margin-top: 30px; @@ -142,3 +148,33 @@ } } } +.return_money { + font-size: 24px; + font-weight: 500; + display: flex; + justify-content: center; + width: 702px; + height: 92px; + background: #e7f1ff; + border-radius: 16px 16px 0px 0px; + color: #337fff; + padding-top: 10px; + position: absolute; + bottom: 0px; + z-index: 99; + width: 100%; + left: 0; + top: -60px; + .rukou { + position: absolute; + right: 20px; + } + .money_line { + height: 40px; + display: flex; + align-items: center; + text { + margin-left: 8px; + } + } +} diff --git a/src/pages/order/components/kindList/index.tsx b/src/pages/order/components/kindList/index.tsx index f0e716c..e67fdfa 100644 --- a/src/pages/order/components/kindList/index.tsx +++ b/src/pages/order/components/kindList/index.tsx @@ -5,6 +5,10 @@ import { ORDER_STATUS } from '@/common/enum' import { formatHashTag, formatPriceDiv, formatWeightDiv } from '@/common/fotmat' import EstimatedAmount from '@/components/estimatedAmount' import LabAndImg from '@/components/LabAndImg' +import IconFont from '@/components/iconfont/iconfont' +import ReturnCashModal from '@/components/returnCashModal' +import Popup from '@/components/popup' +import Dialog from '@/components/Dialog' interface OrderParam { estimate_amount: number // 预估金额 @@ -185,64 +189,72 @@ const KindList = ({ order, comfirm = false }: Param) => { [order], ) + const [returnCashShow, setReturnCashShow] = useState(false) + return ( <> {numText} - - {order?.list?.map((item) => { - return ( - - - {order.sale_mode_name} - {formatHashTag(item.code, item.name)} - {!item.is_screw_recommend - ? 共{item?.product_colors.length}种 - : 配套螺纹} - - - {item?.product_colors?.map((colorItem) => { - return ( - - - - - - - - {`${colorItem.code} ${colorItem.name}`} - {colorItem?.return_roll > 0 && {`已退${colorItem?.return_roll}条`}} - {colorItem?.apply_return_roll > 0 && {`待退${colorItem?.apply_return_roll}条`}} - - - {/* { + + setReturnCashShow(true)}> + 大货订单,此单预估返现 48 元 + + + {order?.list?.map((item) => { + return ( + + + {order.sale_mode_name} + {formatHashTag(item.code, item.name)} + {!item.is_screw_recommend + ? 共{item?.product_colors.length}种 + : 配套螺纹} + + + {item?.product_colors?.map((colorItem) => { + return ( + + + + + + + + {`${colorItem.code} ${colorItem.name}`} + {colorItem?.return_roll > 0 && {`已退${colorItem?.return_roll}条`}} + {colorItem?.apply_return_roll > 0 && {`待退${colorItem?.apply_return_roll}条`}} + + + {/* { order?.sale_mode === 0 && colorItem?.standard_sale_price > colorItem.sale_price && ¥{standardPrice(colorItem.standard_sale_price)} } */} - <> + <> ¥{standardPrice(colorItem.sale_price)} - {aboutWeight(colorItem.estimate_weight)} - + {aboutWeight(colorItem.estimate_weight)} + + - - - + + ×{formatCount(colorItem)} - {order.unit} - - - ¥ - {colorPrice(colorItem)} + {order.unit} + + + ¥ + {colorPrice(colorItem)} + - - ) - })} + ) + })} + - - ) - })} - {showPriceConDom} + ) + })} + {showPriceConDom} + + setReturnCashShow(false)}> ) } diff --git a/src/pages/user/index.module.scss b/src/pages/user/index.module.scss index 41250f3..8a4db06 100644 --- a/src/pages/user/index.module.scss +++ b/src/pages/user/index.module.scss @@ -298,4 +298,51 @@ align-items: center; color: #ccc; } + .earnings_list { + padding-bottom: 24px; + } + .earnings_con { + margin: 0 24px; + padding: 0 24px; + display: flex; + justify-content: space-between; + align-items: center; + height: 136px; + box-shadow: 0px 0px 9px 0px rgba(202, 214, 255, 0.49); + box-sizing: border-box; + .earnings_price { + .earnings_title { + font-size: 24px; + color: rgba(0, 0, 0, 0.6); + } + .earnings_total { + font-size: 24px; + color: #4581ffff; + display: flex; + margin-top: 8px; + align-items: center; + .all_earnings { + font-size: 39px; + font-weight: bold; + } + .today_earnings { + width: 159px; + height: 38px; + font-size: 22px; + background: linear-gradient(270deg, #6798ff 0%, #4581ff 100%); + border-radius: 8px; + color: #fff; + text-align: center; + line-height: 38px; + margin-left: 8px; + } + } + } + .more { + color: #4581ff; + font-size: 28px; + display: flex; + align-items: center; + } + } } diff --git a/src/pages/user/index.tsx b/src/pages/user/index.tsx index 4a8b1d0..366f63d 100644 --- a/src/pages/user/index.tsx +++ b/src/pages/user/index.tsx @@ -161,6 +161,18 @@ export default () => { + + + 下单返现活动 + + + + 活动返现收益(元) + ¥ 20330.00 今日收益 5000 + + goLink('/pages/activityIncome/index')}>查看收益 + + 我的服务