| | |
| | | * @Author: 小飞侠 |
| | | * @Date: 2025-03-17 09:45:10 |
| | | * @LastEditors: Please set LastEditors |
| | | * @LastEditTime: 2025-03-27 13:24:58 |
| | | * @LastEditTime: 2025-10-24 17:12:56 |
| | | * Copyright: 2025 MinTinge CO.,LTD. All Rights Reserved. |
| | | * @Descripttion: 写入你的描述 |
| | | --> |
| | |
| | | --> |
| | | <!-- --> |
| | | <template> |
| | | <div style="max-width: 1440px; margin: 0 auto"> |
| | | |
| | | <div style=" margin: 0 auto"> |
| | | <el-card> |
| | | <PlusForm v-model="formdata" :columns="FromColumns" :row-props="{ gutter: 100 }" :col-props="{ |
| | | span: 5 |
| | | span: 5, |
| | | }" @submit="mysubmit"> |
| | | <template #footer="{ handleSubmit }"> |
| | | <div style="margin: 0 auto"> |
| | | <el-button type="primary" @click="handleSubmit">搜索</el-button> |
| | | |
| | | <el-button type="error" @click="RePayFun" :disabled="!canRePay">重新支付</el-button> |
| | | </div> |
| | | </template> |
| | | </PlusForm> |
| | | </el-card> |
| | | <PlusTable ref="plusTableInstance" :columns="tableConfig" :table-data="tableData" table-title="表格" show-summary |
| | | :summary-method="getSummaries" :pagination="{ total, modelValue: pageInfo }" |
| | | @paginationChange="handlePaginationChange" adaptive /> |
| | | :summary-method="getSummaries" |
| | | :pagination="{ total, modelValue: pageInfo, pageSizeList: [30, 40, 50, 100, 200, 300, 400, 500] }" |
| | | @paginationChange="handlePaginationChange" adaptive :is-selection="true" has-index-column |
| | | @selection-change="handleSelectionChange" row-key="id" /> |
| | | |
| | | </div> |
| | | </template> |
| | | <script setup lang='tsx'> |
| | | import { GetTransferOrder, OrderByType, type WeChatTransferOrder } from '@/Api/apis'; |
| | | import moment from 'moment'; |
| | | import type { PlusColumn, PlusTableInstance, PageInfo } from 'plus-pro-components' |
| | | <script setup lang="tsx"> |
| | | import { |
| | | GetTransferOderOfMain, |
| | | GetTransferOrder, |
| | | OrderByType, |
| | | ReSendCreadTransferMoney, |
| | | type WeChatTransferOrder, |
| | | } from '@/Api/apis' |
| | | import { ElMessage } from 'element-plus' |
| | | import moment from 'moment' |
| | | import type { PageInfo, PlusColumn } from 'plus-pro-components' |
| | | import { useTable } from 'plus-pro-components' |
| | | import { h, onMounted, ref, type VNode } from 'vue' |
| | | import { computed, h, onMounted, ref, watch, type VNode } from 'vue' |
| | | const formdata = ref<WeChatTransferOrder>({ |
| | | userName: null, |
| | | userIDCode: null, |
| | | DataTime: [], |
| | | itCode: null |
| | | |
| | | itCode: null, |
| | | isSetOK: null, |
| | | hasSendOk: null, |
| | | createDataTime: [], |
| | | }) |
| | | |
| | | const multipleSelection = ref<WeChatTransferOrder[]>([]) |
| | | const FromColumns: PlusColumn[] = [ |
| | | { |
| | | label: '姓名', |
| | | prop: 'userName', |
| | | labelWidth: 60, |
| | | |
| | | }, |
| | | { |
| | | label: '身份证号码', |
| | | labelWidth: 100, |
| | | |
| | | prop: 'userIDCode' |
| | | } |
| | | , |
| | | prop: 'userIDCode', |
| | | }, |
| | | { |
| | | label: '电话号码', |
| | | labelWidth: 100, |
| | | |
| | | prop: 'itCode' |
| | | prop: 'itCode', |
| | | }, |
| | | { |
| | | label: '支付时间', |
| | | label: '更新时间', |
| | | labelWidth: 100, |
| | | width: 400, |
| | | colProps: { |
| | | span: 8 |
| | | span: 8, |
| | | }, |
| | | prop: 'DataTime', |
| | | valueType: 'date-picker', |
| | |
| | | endPlaceholder: '请选择结束时间', |
| | | rangeSeparator: '-', |
| | | valueFormat: 'YYYY-MM-DDTHH:mm:ss', |
| | | |
| | | }, |
| | | |
| | | |
| | | |
| | | } |
| | | }, |
| | | { |
| | | label: '创建时间', |
| | | labelWidth: 100, |
| | | width: 400, |
| | | colProps: { |
| | | span: 8, |
| | | }, |
| | | prop: 'createDataTime', |
| | | valueType: 'date-picker', |
| | | fieldProps: { |
| | | type: 'datetimerange', |
| | | startPlaceholder: '请选择开始时间', |
| | | endPlaceholder: '请选择结束时间', |
| | | rangeSeparator: '-', |
| | | valueFormat: 'YYYY-MM-DDTHH:mm:ss', |
| | | }, |
| | | }, |
| | | { |
| | | label: '支付失败', |
| | | labelWidth: 100, |
| | | prop: 'hasSendOk', |
| | | valueType: 'switch', |
| | | }, |
| | | ] |
| | | |
| | | const tableConfig = ref<PlusColumn[]>( |
| | | [ |
| | | { |
| | | label: '姓名', |
| | | prop: 'userName', |
| | | width: 80 |
| | | const canRePay = computed(() => { |
| | | // 必须有选中项,且所有选中项的hasSendOk都为true(支付失败) |
| | | return multipleSelection.value.length > 0 && |
| | | formdata.value.hasSendOk == true |
| | | }) |
| | | const tableConfig = ref<PlusColumn[]>([ |
| | | { |
| | | label: '姓名', |
| | | prop: 'userName', |
| | | width: 70, |
| | | }, |
| | | { |
| | | label: '身份证', |
| | | prop: 'userIDCode', |
| | | width: 162, |
| | | }, |
| | | { |
| | | label: '电话号码', |
| | | prop: 'itCode', |
| | | width: 110, |
| | | }, |
| | | |
| | | { |
| | | width: 100, |
| | | label: '总额度', |
| | | prop: 'totalAmount', |
| | | render: (value) => { |
| | | let formattedAmount = ((value ?? 0) / 100).toLocaleString('zh-CN', { |
| | | style: 'currency', |
| | | currency: 'CNY', |
| | | }) |
| | | |
| | | return <span>{formattedAmount}元 </span> |
| | | }, |
| | | { |
| | | label: '身份证', |
| | | prop: 'userIDCode', |
| | | width: 170 |
| | | }, |
| | | |
| | | { |
| | | width: 100, |
| | | label: '成功额度', |
| | | prop: 'successAmount', |
| | | sortable: true, |
| | | render: (value) => { |
| | | let formattedAmount = ((value ?? 0) / 100).toLocaleString('zh-CN', { |
| | | style: 'currency', |
| | | currency: 'CNY', |
| | | }) |
| | | |
| | | return <span>{formattedAmount}元 </span> |
| | | }, |
| | | { |
| | | label: '电话号码', |
| | | prop: 'itCode', |
| | | width: 120 |
| | | }, |
| | | { |
| | | width: 100, |
| | | label: '失败额度', |
| | | prop: 'failAmount', |
| | | sortable: true, |
| | | render: (value) => { |
| | | let formattedAmount = ((value ?? 0) / 100).toLocaleString('zh-CN', { |
| | | style: 'currency', |
| | | currency: 'CNY', |
| | | }) |
| | | |
| | | return <span>{formattedAmount}元 </span> |
| | | }, |
| | | }, |
| | | |
| | | |
| | | { |
| | | width: 100, |
| | | label: '总额度', |
| | | prop: 'totalAmount', |
| | | render: (value) => { |
| | | |
| | | let formattedAmount = ((value ?? 0) / 100).toLocaleString('zh-CN', { style: 'currency', currency: 'CNY' }); |
| | | |
| | | return <span>{formattedAmount}元</span> |
| | | } |
| | | |
| | | |
| | | { |
| | | width: 160, |
| | | label: '更新时间', |
| | | prop: 'upDataTime', |
| | | render: (value) => { |
| | | return <span>{moment(value).format('YYYY-MM-DD HH:mm:ss')} </span> |
| | | }, |
| | | |
| | | { |
| | | width: 100, |
| | | label: '成功额度', |
| | | prop: 'successAmount', |
| | | sortable: true, |
| | | render: (value) => { |
| | | |
| | | let formattedAmount = ((value ?? 0) / 100).toLocaleString('zh-CN', { style: 'currency', currency: 'CNY' }); |
| | | |
| | | return <span>{formattedAmount}元</span> |
| | | } |
| | | |
| | | }, |
| | | { |
| | | width: 160, |
| | | label: '创建时间', |
| | | prop: 'createTime', |
| | | render: (value) => { |
| | | return <span>{moment(value).format('YYYY-MM-DD HH:mm:ss')} </span> |
| | | }, |
| | | { |
| | | width: 100, |
| | | label: '失败额度', |
| | | prop: 'failAmount', |
| | | sortable: true, |
| | | render: (value) => { |
| | | }, |
| | | |
| | | let formattedAmount = ((value ?? 0) / 100).toLocaleString('zh-CN', { style: 'currency', currency: 'CNY' }); |
| | | |
| | | return <span>{formattedAmount}元</span> |
| | | } |
| | | |
| | | { |
| | | width: 80, |
| | | label: '补发单', |
| | | prop: 'weChatTransferOrderPrId', |
| | | render: (value) => { |
| | | const color = value > 0 ? 'red' : 'green'; |
| | | return <span style={{ color }}>{value ? `是${value}` : '否'} </span> |
| | | }, |
| | | }, |
| | | { |
| | | label: '腾讯单号', |
| | | prop: 'batchId', |
| | | }, |
| | | { |
| | | label: '客户单号', |
| | | prop: 'outBatchNumber', |
| | | }, |
| | | { |
| | | width: 160, |
| | | label: '总工资', |
| | | prop: 'zhongGz', |
| | | render: (value) => { |
| | | let formattedAmount = (value ?? 0).toLocaleString('zh-CN', { |
| | | style: 'currency', |
| | | currency: 'CNY', |
| | | }) |
| | | |
| | | { |
| | | width: 180, |
| | | label: '提现时间', |
| | | prop: 'upDataTime', |
| | | render: (value) => { |
| | | return <span>{moment(value).format('YYYY-MM-DD HH:mm:ss')}</span> |
| | | } |
| | | |
| | | return <span>{formattedAmount}元 </span> |
| | | }, |
| | | { |
| | | }, |
| | | { |
| | | width: 160, |
| | | label: '已提工资', |
| | | prop: 'yiTiXianGz', |
| | | render: (value) => { |
| | | let formattedAmount = (value ?? 0).toLocaleString('zh-CN', { |
| | | style: 'currency', |
| | | currency: 'CNY', |
| | | }) |
| | | |
| | | label: '腾讯单号', |
| | | prop: 'batchId' |
| | | |
| | | return <span>{formattedAmount}元 </span> |
| | | }, |
| | | { |
| | | |
| | | label: '客户单号', |
| | | prop: 'outBatchNumber' |
| | | |
| | | }, |
| | | { |
| | | width: 100, |
| | | label: '总工资', |
| | | prop: 'zhongGz', |
| | | render: (value) => { |
| | | |
| | | let formattedAmount = ((value ?? 0)).toLocaleString('zh-CN', { style: 'currency', currency: 'CNY' }); |
| | | |
| | | return <span>{formattedAmount}元</span> |
| | | } |
| | | |
| | | }, |
| | | { |
| | | width: 100, |
| | | label: '已提工资', |
| | | prop: 'yiTiXianGz', |
| | | render: (value) => { |
| | | let formattedAmount = ((value ?? 0)).toLocaleString('zh-CN', { style: 'currency', currency: 'CNY' }); |
| | | |
| | | return <span>{formattedAmount}元</span> |
| | | } |
| | | |
| | | } |
| | | |
| | | ] |
| | | ); |
| | | |
| | | }, |
| | | ]) |
| | | const handleSelectionChange = (val: WeChatTransferOrder[]) => { |
| | | multipleSelection.value = val |
| | | } |
| | | const { tableData, pageInfo, total, loadingStatus } = useTable<WeChatTransferOrder[]>() |
| | | pageInfo.value.page = 1; |
| | | pageInfo.value.pageSize = 40; |
| | | |
| | | onMounted(() => { |
| | | getList(); |
| | | getList() |
| | | }) |
| | | const getList = async () => { |
| | | loadingStatus.value = true |
| | | if (formdata.value.DataTime && Array.isArray(formdata.value.DataTime) && formdata.value.DataTime.length === 2) { |
| | | debugger |
| | | formdata.value.upDataTime = `${formdata.value.DataTime[0]}~${formdata.value.DataTime[1].toString()}`; |
| | | } else { |
| | | |
| | | if ( |
| | | formdata.value.DataTime && |
| | | Array.isArray(formdata.value.DataTime) && |
| | | formdata.value.DataTime.length === 2 |
| | | ) { |
| | | formdata.value.upDataTime = `${formdata.value.DataTime[0]}~${formdata.value.DataTime[1].toString()}` |
| | | } else { |
| | | } |
| | | if ( |
| | | formdata.value.createDataTime && |
| | | Array.isArray(formdata.value.createDataTime) && |
| | | formdata.value.createDataTime.length === 2 |
| | | ) { |
| | | formdata.value.createTime = `${formdata.value.createDataTime[0]}~${formdata.value.createDataTime[1].toString()}` |
| | | } else { |
| | | } |
| | | if (formdata.value.hasSendOk == true) { |
| | | // 支付失败的表 |
| | | GetTransferOderOfMain({ |
| | | |
| | | pageIndex: pageInfo.value.page, |
| | | pageSize: pageInfo.value.pageSize, |
| | | hasSendOk: false, |
| | | isSetOK: false |
| | | }) |
| | | .then((res) => { |
| | | if (res.data.code == 1) { |
| | | tableData.value = (res.data?.data?.listdata ?? []) as WeChatTransferOrder[] |
| | | |
| | | total.value = res.data.data?.page?.totalCount as number |
| | | } |
| | | }) |
| | | .finally(() => { |
| | | loadingStatus.value = false |
| | | }) |
| | | return |
| | | } |
| | | GetTransferOrder({ |
| | | page: { pageIndex: pageInfo.value.page, pageSize: pageInfo.value.pageSize }, |
| | | where: JSON.stringify(formdata.value), |
| | | order:{ |
| | | name:"upDataTime", |
| | | des:OrderByType.Desc |
| | | } |
| | | |
| | | }).then((res) => { |
| | | |
| | | if (res.data.code == 1) { |
| | | tableData.value = res.data.data?.data as WeChatTransferOrder[]; |
| | | |
| | | total.value = res.data.data?.page?.totalCount as number; |
| | | } |
| | | }).finally(() => { |
| | | loadingStatus.value = false |
| | | where: JSON.stringify(formdata.value), |
| | | order: { |
| | | name: 'upDataTime', |
| | | des: OrderByType.Desc, |
| | | }, |
| | | }) |
| | | .then((res) => { |
| | | if (res.data.code == 1) { |
| | | tableData.value = res.data.data?.data as WeChatTransferOrder[] |
| | | |
| | | total.value = res.data.data?.page?.totalCount as number |
| | | } |
| | | }) |
| | | .finally(() => { |
| | | loadingStatus.value = false |
| | | }) |
| | | } |
| | | const RePayFun = async () => { |
| | | if (multipleSelection.value.length == 0) { |
| | | ElMessage.error('请选择要重新支付的记录') |
| | | return |
| | | } |
| | | let ids = multipleSelection.value.map((x) => x.id) |
| | | for (let index = 0; index < ids.length; index++) { |
| | | const element = ids[index] |
| | | await ReSendCreadTransferMoney(element as number) |
| | | } |
| | | ElMessage.success('支付完毕刷新列表') |
| | | loadingStatus.value = false |
| | | } |
| | | |
| | | |
| | | const mysubmit = () => { |
| | | getList(); |
| | | getList() |
| | | } |
| | | const getSummaries = (param: any) => { |
| | | const { columns, data } = param |
| | | const sums: (string | VNode)[] = [] |
| | | columns.forEach((column: { property: string | number; }, index: number) => { |
| | | columns.forEach((column: { property: string | number }, index: number) => { |
| | | if (index === 0) { |
| | | sums[index] = h('div', { style: { textDecoration: 'underline' } }, [ |
| | | '统计', |
| | | ]) |
| | | sums[index] = h('div', { style: { textDecoration: 'underline' } }, ['统计']) |
| | | return |
| | | } |
| | | if (column.property == "totalAmount") { |
| | | const values = data.map((x:any) => x.totalAmount); |
| | | let formattedAmount = (values.reduce((prev: any, cur: any) => prev + cur) / 100).toLocaleString('zh-CN', { style: 'currency', currency: 'CNY' }); |
| | | if (column.property == 'totalAmount') { |
| | | const values = data.map((x: any) => x.totalAmount ?? 0) |
| | | let formattedAmount = ( |
| | | values.reduce((prev: any, cur: any) => prev + cur) / 100 |
| | | ).toLocaleString('zh-CN', { style: 'currency', currency: 'CNY' }) |
| | | sums[index] = formattedAmount |
| | | return |
| | | } |
| | | |
| | | |
| | | if (column.property == "successAmount") { |
| | | const values = data.map((x: { successAmount: any; }) => x.successAmount); |
| | | let formattedAmount = (values.reduce((prev: any, cur: any) => prev + cur) / 100).toLocaleString('zh-CN', { style: 'currency', currency: 'CNY' }); |
| | | if (column.property == 'successAmount') { |
| | | const values = data.map((x: { successAmount: any }) => x.successAmount ?? 0) |
| | | let formattedAmount = ( |
| | | values.reduce((prev: any, cur: any) => prev + cur) / 100 |
| | | ).toLocaleString('zh-CN', { style: 'currency', currency: 'CNY' }) |
| | | sums[index] = formattedAmount |
| | | return |
| | | } |
| | | if (column.property == "failAmount") { |
| | | const values = data.map((x: { failAmount: any; }) => x.failAmount); |
| | | let formattedAmount = (values.reduce((prev: any, cur: any) => prev + cur) / 100).toLocaleString('zh-CN', { style: 'currency', currency: 'CNY' }); |
| | | if (column.property == 'failAmount') { |
| | | const values = data.map((x: { failAmount: any }) => x.failAmount ?? 0) |
| | | let formattedAmount = ( |
| | | values.reduce((prev: any, cur: any) => prev + cur) / 100 |
| | | ).toLocaleString('zh-CN', { style: 'currency', currency: 'CNY' }) |
| | | sums[index] = formattedAmount |
| | | return |
| | | } |
| | | }) |
| | | |
| | | |
| | | |
| | | return sums |
| | | } |
| | |
| | | pageInfo.value = _pageInfo |
| | | getList() |
| | | } |
| | | |
| | | </script> |
| | | <style lang='scss' scoped></style> |
| | | <style lang="scss" scoped></style> |