小飞侠
2025-12-01 7eca0ab1b6d5142d623efd471985b2a20b559616
AdminwebPages/adminpageView/src/views/cylsgPayrollReport.vue
@@ -3,7 +3,7 @@
 * @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: 写入你的描述
-->
@@ -18,64 +18,74 @@
-->
<!-- -->
<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',
@@ -85,195 +95,279 @@
      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
}
@@ -281,6 +375,5 @@
  pageInfo.value = _pageInfo
  getList()
}
</script>
<style lang='scss' scoped></style>
<style lang="scss" scoped></style>