搜索框添加一键清除功能

This commit is contained in:
Eamon
2026-05-14 16:04:35 +08:00
parent 284b0d6afe
commit 616901acdd
12 changed files with 263 additions and 118 deletions

View File

@@ -81,7 +81,8 @@ type FilterSchema = z.infer<typeof filterSchema>
export default function BillingPage() {
const searchParams = useSearchParams()
const innerNo = searchParams.get("inner_no")
console.log(innerNo, "innerNo")
const billNo = searchParams.get("bill_no")
const resourceNo = searchParams.get("resource_no")
const [skuOptions, setSkuOptions] = useState<SkuOption[]>([])
const [loading, setLoading] = useState(true)
const [skuProductCode, setSkuProductCode] = useState<ProductCode>(
@@ -92,12 +93,12 @@ export default function BillingPage() {
const { control, handleSubmit, reset, getValues } = useForm<FilterSchema>({
resolver: zodResolver(filterSchema),
defaultValues: {
bill_no: "",
bill_no: billNo || "",
inner_no: innerNo || "",
created_at_start: "",
created_at_end: "",
phone: "",
resource_no: "",
resource_no: resourceNo || "",
sku_code: "all",
product_code: "",
},
@@ -133,28 +134,23 @@ export default function BillingPage() {
const loadData = (page: number, size: number) => {
const result: FilterValues = {}
if (innerNo) {
result.trade_inner_no = innerNo
} else {
const filters = getValues()
if (filters.phone?.trim()) result.user_phone = filters.phone.trim()
if (filters.inner_no?.trim())
result.trade_inner_no = filters.inner_no.trim()
if (filters.bill_no?.trim()) result.bill_no = filters.bill_no.trim()
if (filters.resource_no?.trim())
result.resource_no = filters.resource_no.trim()
if (filters.product_code && filters.product_code !== ProductCode.All) {
result.product_code = filters.product_code
}
if (filters.sku_code && filters.sku_code !== "all") {
result.sku_code = filters.sku_code
}
if (filters.created_at_start)
result.created_at_start = new Date(filters.created_at_start)
if (filters.created_at_end)
result.created_at_end = new Date(filters.created_at_end)
const filters = getValues()
if (filters.phone?.trim()) result.user_phone = filters.phone.trim()
if (filters.inner_no?.trim())
result.trade_inner_no = filters.inner_no.trim()
if (filters.bill_no?.trim()) result.bill_no = filters.bill_no.trim()
if (filters.resource_no?.trim())
result.resource_no = filters.resource_no.trim()
if (filters.product_code && filters.product_code !== ProductCode.All) {
result.product_code = filters.product_code
}
if (filters.sku_code && filters.sku_code !== "all") {
result.sku_code = filters.sku_code
}
if (filters.created_at_start)
result.created_at_start = new Date(filters.created_at_start)
if (filters.created_at_end)
result.created_at_end = new Date(filters.created_at_end)
return getPageBill({
page,
size,
@@ -196,7 +192,7 @@ export default function BillingPage() {
className="w-40 flex-none"
>
<FieldLabel></FieldLabel>
<Input {...field} placeholder="请输入会员号" />
<Input {...field} placeholder="请输入会员号" clearable />
<FieldError>{fieldState.error?.message}</FieldError>
</Field>
)}
@@ -210,7 +206,7 @@ export default function BillingPage() {
className="w-40 flex-none"
>
<FieldLabel></FieldLabel>
<Input {...field} placeholder="请输入套餐号" />
<Input {...field} placeholder="请输入套餐号" clearable />
<FieldError>{fieldState.error?.message}</FieldError>
</Field>
)}
@@ -224,7 +220,7 @@ export default function BillingPage() {
className="w-40 flex-none"
>
<FieldLabel></FieldLabel>
<Input {...field} placeholder="请输入账单号" />
<Input {...field} placeholder="请输入账单号" clearable />
<FieldError>{fieldState.error?.message}</FieldError>
</Field>
)}
@@ -238,7 +234,7 @@ export default function BillingPage() {
className="w-40 flex-none"
>
<FieldLabel></FieldLabel>
<Input {...field} placeholder="请输入订单号" />
<Input {...field} placeholder="请输入订单号" clearable />
<FieldError>{fieldState.error?.message}</FieldError>
</Field>
)}
@@ -319,7 +315,7 @@ export default function BillingPage() {
className="w-40 flex-none"
>
<FieldLabel></FieldLabel>
<Input type="date" {...field} />
<Input type="date" {...field} clearable />
<FieldError>{fieldState.error?.message}</FieldError>
</Field>
)}
@@ -334,7 +330,7 @@ export default function BillingPage() {
className="w-40 flex-none"
>
<FieldLabel></FieldLabel>
<Input type="date" {...field} />
<Input type="date" {...field} clearable />
<FieldError>{fieldState.error?.message}</FieldError>
</Field>
)}
@@ -373,7 +369,7 @@ export default function BillingPage() {
href={`/resources?resource_no=${resource_no}`}
target="_blank"
rel="noopener noreferrer"
className="text-blue-600 hover:underline cursor-pointer"
className="text-blue-600"
>
{resource_no}
</Link>
@@ -468,7 +464,7 @@ export default function BillingPage() {
href={`./balance?bill_no=${billNo}`}
target="_blank"
rel="noopener noreferrer"
className="text-blue-600 hover:underline cursor-pointer"
className="text-blue-600"
>
{billNo}
</Link>
@@ -509,7 +505,16 @@ export default function BillingPage() {
</div>
)}
</div>
<div className="text-sm">{bill.trade?.inner_no}</div>
<div className="text-sm">
<Link
href={`/trade?inner_no=${bill.trade?.inner_no}`}
target="_blak"
rel="noopener noreferrer"
className="text-blue-600"
>
{bill.trade?.inner_no}
</Link>
</div>
</div>
)
},