提交 73818823 authored 作者: 王鹏飞's avatar 王鹏飞

feat: 添加Apple支付图标,优化订单列表视图,更新类型声明文件

上级 088eacea
{
"compilerOptions": {
"target": "ES6",
"jsx": "react",
"baseUrl": "./",
"paths": {
"@/*": ["src/*"]
}
},
"include": ["src/**/*.js", "src/**/*.jsx", "src/**/*.ts", "src/**/*.tsx"],
"exclude": ["node_modules", "dist", "build"]
}
<svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
<circle cx="24" cy="24" r="24" fill="#1F2937"/>
<path transform="translate(1.25 0.75)" fill="#fff" d="M31.4 17.2c-1.1-1.3-2.8-2-4.5-1.9-2.2.2-3.5 1.5-4.8 1.5-1.3 0-2.9-1.5-4.8-1.4-2.5 0-4.8 1.5-6 3.7-2.6 4.5-.7 11.2 1.8 14.9 1.2 1.8 2.7 3.8 4.7 3.7 1.9-.1 2.7-1.2 5.1-1.2 2.4 0 3.1 1.2 5.1 1.2 2.1 0 3.4-1.8 4.6-3.6 1.4-2 2-4 2.1-4.1-.1 0-4-1.5-4-5.8 0-3.6 2.9-5.4 3-5.5-.9-1.3-2.3-1.9-3.4-2.5-.9-.4-2.2-.8-3.8-.9-.6-1.2-.4-2.8.3-4.1-1.5.1-3 .9-4 1.9-.8.9-1.5 2.4-1.3 3.8 1.3.1 2.7-.7 3.5-1.7.1-.1.2-.2.3-.4 1.4-.1 2.9.3 4.1.9Z"/>
</svg>
import { Button, DatePicker, Input, Rate, Select } from 'antd' import { Button, DatePicker, Input, Rate, Select, Tooltip } from 'antd'
import type { ColumnsType } from 'antd/es/table' import type { ColumnsType } from 'antd/es/table'
import { useState } from 'react' import { useState } from 'react'
import wechatIcon from '@/assets/images/vx.png'
import alipayIcon from '@/assets/images/zhifu.png'
import coinIcon from '@/assets/images/money.png'
import appleIcon from '@/assets/images/apple.svg'
import { AppList, type AppListFilterItem } from '@/components/AppList' import { AppList, type AppListFilterItem } from '@/components/AppList'
import { usePermission } from '@/hooks/usePermission' import { usePermission } from '@/hooks/usePermission'
...@@ -11,10 +15,6 @@ import type { OrdersFilters } from '../query' ...@@ -11,10 +15,6 @@ import type { OrdersFilters } from '../query'
import { useOrdersList } from '../useOrdersList' import { useOrdersList } from '../useOrdersList'
const { RangePicker } = DatePicker const { RangePicker } = DatePicker
const wechatIcon = new URL('../../../../assets/images/vx.png', import.meta.url).href
const alipayIcon = new URL('../../../../assets/images/zhifu.png', import.meta.url).href
const coinIcon = new URL('../../../../assets/images/money.png', import.meta.url).href
export default function OrdersListView() { export default function OrdersListView() {
const list = useOrdersList() const list = useOrdersList()
const checkPermission = usePermission() const checkPermission = usePermission()
...@@ -64,16 +64,11 @@ export default function OrdersListView() { ...@@ -64,16 +64,11 @@ export default function OrdersListView() {
align: 'center', align: 'center',
width: 100, width: 100,
render: (_, record) => { render: (_, record) => {
const source = const source = [null, wechatIcon, alipayIcon, coinIcon, appleIcon][Number(record.pay_type)]
record.pay_type_name === '微信'
? wechatIcon
: record.pay_type_name === '支付宝'
? alipayIcon
: record.pay_type_name === '紫荆币'
? coinIcon
: null
return source ? ( return source ? (
<img src={source} width={30} alt={record.pay_type_name ?? '支付方式'} /> <Tooltip title={record.pay_type_name ?? '支付方式'}>
<img src={source} width={30} alt={record.pay_type_name ?? '支付方式'} />
</Tooltip>
) : ( ) : (
record.pay_type_name || '—' record.pay_type_name || '—'
) )
...@@ -85,9 +80,7 @@ export default function OrdersListView() { ...@@ -85,9 +80,7 @@ export default function OrdersListView() {
dataIndex: 'rating', dataIndex: 'rating',
align: 'center', align: 'center',
width: 135, width: 135,
render: (_, record) => ( render: (_, record) => <Rate disabled allowHalf style={{ width: 135 }} value={record.rating} />,
<Rate disabled allowHalf style={{ width: 135 }} value={record.rating} />
),
}, },
{ {
title: '操作', title: '操作',
...@@ -108,9 +101,9 @@ export default function OrdersListView() { ...@@ -108,9 +101,9 @@ export default function OrdersListView() {
render: (field) => ( render: (field) => (
<Input <Input
allowClear allowClear
autoComplete='off' autoComplete="off"
placeholder='请输入书籍名称' placeholder="请输入书籍名称"
id='name' id="name"
value={field.value ?? ''} value={field.value ?? ''}
onChange={(event) => field.onChange(event.target.value)} onChange={(event) => field.onChange(event.target.value)}
/> />
...@@ -122,7 +115,7 @@ export default function OrdersListView() { ...@@ -122,7 +115,7 @@ export default function OrdersListView() {
render: (field) => ( render: (field) => (
<Select <Select
allowClear allowClear
placeholder='请选择支付状态' placeholder="请选择支付状态"
value={field.value} value={field.value}
onChange={(value) => field.onChange(value)} onChange={(value) => field.onChange(value)}
style={{ width: 160 }} style={{ width: 160 }}
...@@ -141,7 +134,7 @@ export default function OrdersListView() { ...@@ -141,7 +134,7 @@ export default function OrdersListView() {
render: (field) => ( render: (field) => (
<Select <Select
allowClear allowClear
placeholder='请选择支付方式' placeholder="请选择支付方式"
value={field.value} value={field.value}
onChange={(value) => field.onChange(value)} onChange={(value) => field.onChange(value)}
style={{ width: 160 }} style={{ width: 160 }}
...@@ -159,9 +152,9 @@ export default function OrdersListView() { ...@@ -159,9 +152,9 @@ export default function OrdersListView() {
label: '支付时间', label: '支付时间',
render: (field) => ( render: (field) => (
<RangePicker <RangePicker
id='createTime' id="createTime"
allowClear allowClear
autoComplete='off' autoComplete="off"
value={field.value} value={field.value}
onChange={(value) => field.onChange(value)} onChange={(value) => field.onChange(value)}
/> />
...@@ -172,7 +165,7 @@ export default function OrdersListView() { ...@@ -172,7 +165,7 @@ export default function OrdersListView() {
return ( return (
<> <>
<AppList<OrderRow, OrdersFilters> <AppList<OrderRow, OrdersFilters>
rowKey='id' rowKey="id"
columns={columns} columns={columns}
data={{ rows: list.rows, total: list.total, loading: list.loading, error: list.error }} data={{ rows: list.rows, total: list.total, loading: list.loading, error: list.error }}
filters={{ filters={{
...@@ -192,11 +185,7 @@ export default function OrdersListView() { ...@@ -192,11 +185,7 @@ export default function OrdersListView() {
}} }}
onRetry={list.retry} onRetry={list.retry}
/> />
<RefundDrawer <RefundDrawer open={refundId !== null} onClose={() => setRefundId(null)} onSubmit={submitRefund} />
open={refundId !== null}
onClose={() => setRefundId(null)}
onSubmit={submitRefund}
/>
</> </>
) )
} }
declare module '*.png' {
const source: string
export default source
}
declare module '*.svg' {
const source: string
export default source
}
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑!
请 注册 或者 后发表评论