You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
1491 lines
54 KiB
1491 lines
54 KiB
<script setup>
|
|
import { ref, reactive, onMounted, nextTick, toRaw } from 'vue'
|
|
import { useRoute } from 'vue-router'
|
|
import { ElMessage, ElMessageBox } from 'element-plus'
|
|
import request from '@/util/http.js'
|
|
import dayjs from 'dayjs'
|
|
import { useI18n } from 'vue-i18n'
|
|
import { Moneyfunds, refundOnline, exportFunds } from '@/api/cash/financialAccount.js'
|
|
import { useAdminStore } from '@/store/index.js'
|
|
import { storeToRefs } from 'pinia'
|
|
import _ from 'lodash';
|
|
import { normalizePayType,MarketNameForId, CurrencyForId, } from '@/views/moneyManage/receiveDetail/utils/staticData.js'
|
|
import { isTemplate } from 'element-plus/es/utils/index.mjs'
|
|
import { Row } from 'vxe-pc-ui'
|
|
import CashManagement from '@/components/workspace/CashManagement.vue'
|
|
import { permissionMapping, hasMenuPermission } from "@/utils/menuTreePermission.js"
|
|
|
|
const adminStore = useAdminStore()
|
|
const { adminData, menuTree,flag } = storeToRefs(adminStore)
|
|
|
|
const { t } = useI18n()
|
|
const route = useRoute()
|
|
|
|
const paytypeList = [
|
|
t('cash.payMethods.stripe'), // Stripe
|
|
t('cash.payMethods.paymentAsia'), // PaymentAsia
|
|
t('cash.payMethods.stripe2'), // Stripe2
|
|
t('cash.payMethods.ipay88'), // Ipay88
|
|
t('cash.payMethods.grabpay'), // Grabpay
|
|
t('cash.payMethods.nets'), // Nets
|
|
t('cash.payMethods.transfer'), // E-Transfer
|
|
t('cash.payMethods.iotPay'), // IOT Pay
|
|
t('cash.payMethods.stripe3'), // Stripe3
|
|
t('cash.payMethods.paypal'), // PayPal
|
|
t('cash.payMethods.paysolution'), // Paysolution
|
|
t('cash.payMethods.bankTransfer'),// 银行转账
|
|
t('cash.payMethods.card'), // 刷卡
|
|
t('cash.payMethods.cash'), // 现金
|
|
t('cash.payMethods.check'), // 支票
|
|
]
|
|
|
|
// 新增流水权限
|
|
const hasNewTransactionFlow = ref(false)
|
|
|
|
// 初始化权限状态
|
|
const initPermissions = async () => {
|
|
if (!menuTree.value || !menuTree.value.length) return;
|
|
// 新增流水权限
|
|
hasNewTransactionFlow.value = hasMenuPermission(menuTree.value, permissionMapping.new_transaction_flow);
|
|
};
|
|
|
|
const payPlatformOptions = ref([...paytypeList])
|
|
|
|
const marketFilter = (value) => {
|
|
const map = {
|
|
4: t('cash.markets.Singapore'),
|
|
5: t('cash.markets.Malaysia'),
|
|
13:t('cash.markets.HongKong'),
|
|
24016: t('cash.markets.Canada'),
|
|
24018:t('cash.markets.Thailand'),
|
|
24022:t('cash.markets.VietnamHCM'),
|
|
24033:t('cash.markets.Beijing'),
|
|
};
|
|
return map[value] || '-';
|
|
};
|
|
|
|
// 地区树
|
|
const marketOptions = ref([])
|
|
|
|
// 查询参数
|
|
const queryParams = reactive({
|
|
jwcode: '',
|
|
markets: [], // 下拉多选
|
|
performanceMarkets:[],
|
|
timeRange: [], // [startTime, endTime]
|
|
payType: '',
|
|
orderCode: '',
|
|
pageNum: 1,
|
|
pageSize: 20,
|
|
platformSelection: []
|
|
})
|
|
|
|
const total = ref(0)
|
|
const tableData = ref([])
|
|
const tableRef = ref(null)
|
|
const scrollTableTop = () => {
|
|
tableRef.value?.setScrollTop?.(0)
|
|
}
|
|
const loading = ref(false)
|
|
|
|
// 转换树形结构（参考 coinConsumeDetail.vue）
|
|
const transformTree = (nodes) => {
|
|
const allChildren = nodes.flatMap(node => node.children || []);
|
|
return allChildren.map(child => {
|
|
const grandchildren = child.children && child.children.length
|
|
? transformTree([child])
|
|
: null;
|
|
return {
|
|
value: child.id,
|
|
label: child.name,
|
|
children: grandchildren
|
|
};
|
|
});
|
|
};
|
|
|
|
// 获取地区数据
|
|
const getMarket = async () => {
|
|
try {
|
|
const result = await request({ url: '/market/selectMarket' });
|
|
if (result && result.data) {
|
|
marketOptions.value = transformTree(result.data)
|
|
}
|
|
} catch (error) {
|
|
console.error('获取地区失败', error)
|
|
}
|
|
}
|
|
|
|
const formatStatuses = (statuses) => {
|
|
// 情况1：非数组/空值 → 返回空数组
|
|
if (!Array.isArray(statuses)) {
|
|
return [];
|
|
}
|
|
// 情况2：数组中包含 null 或 undefined → 返回空数组
|
|
if (statuses.some(item => item === null || item === undefined)) {
|
|
return [];
|
|
}
|
|
// 情况3：正常数组 → 返回原数组
|
|
return statuses;
|
|
};
|
|
const performanceMarket = ref([
|
|
t('cash.markets.Malaysia'), // 马来西亚
|
|
t('cash.markets.HongKong'), // 香港
|
|
t('cash.markets.Singapore'), // 新加坡
|
|
t('cash.markets.Thailand'), // 泰国
|
|
t('cash.markets.VietnamHCM'), // 越南HCM
|
|
t('cash.markets.Canada'), // 加拿大
|
|
t('cash.markets.Beijing') // 北京
|
|
])
|
|
const getPayPlatformOptions = async () => {
|
|
try {
|
|
const res = await request({
|
|
url: '/market/getAreaPayTypeTree',
|
|
method: 'POST'
|
|
})
|
|
if (res.code === 200) {
|
|
payPlatformOptionsList.value = res.data
|
|
console.log('支付平台数据加载成功:', payPlatformOptionsList.value)
|
|
} else {
|
|
ElMessage.error(res.msg || t('elmessage.getDataFailed'))
|
|
}
|
|
} catch (error) {
|
|
console.error('请求支付平台数据出错:', error)
|
|
ElMessage.error(t('elmessage.networkError'))
|
|
}
|
|
}
|
|
// 查询列表
|
|
const fetchData = async () => {
|
|
loading.value = true
|
|
try {
|
|
//转换areaPayTypeList参数结构
|
|
const areaPayTypeList = [];
|
|
const options = toRaw(payPlatformOptionsList.value);
|
|
const selectedPaths = queryParams.platformSelection;
|
|
if (selectedPaths.length > 0 && options.length > 0) {
|
|
selectedPaths.forEach(path => {
|
|
const areaId = path[0];
|
|
const payMethodId = path[path.length - 1];
|
|
if (path.length === 1) {
|
|
const countryNode = options.find(c => c.id === areaId);
|
|
if (countryNode && countryNode.children) {
|
|
countryNode.children.forEach(child => {
|
|
areaPayTypeList.push({
|
|
areaId: areaId,
|
|
payType: child.name
|
|
});
|
|
});
|
|
}
|
|
}
|
|
else {
|
|
const countryNode = options.find(c => c.id === areaId);
|
|
if (countryNode && countryNode.children) {
|
|
const methodNode = countryNode.children.find(m => m.id === payMethodId);
|
|
if (methodNode) {
|
|
areaPayTypeList.push({
|
|
areaId: areaId,
|
|
payType: methodNode.name
|
|
});
|
|
}
|
|
}
|
|
}
|
|
});
|
|
}
|
|
//转换performanceMarket参数结构
|
|
let performanceMarkets = [];
|
|
const selectedNames = queryParams.performanceMarket;
|
|
if (Array.isArray(selectedNames) && selectedNames.length > 0) {
|
|
performanceMarkets = selectedNames
|
|
.map(name => {
|
|
if (!name) return null;
|
|
const id = MarketNameForId(name);
|
|
return id;
|
|
})
|
|
.filter(id => id !== null && id !== 'null'); // 过滤无效值
|
|
}
|
|
const params = {
|
|
pageNum: queryParams.pageNum,
|
|
pageSize: queryParams.pageSize,
|
|
fundsDTO: {
|
|
jwcode: queryParams.jwcode,
|
|
localMarket: queryParams.markets,
|
|
performanceMarkets:performanceMarkets,
|
|
areaPayTypeList: areaPayTypeList,
|
|
startTime: queryParams.timeRange?.[0] ? dayjs(queryParams.timeRange[0]).format('YYYY-MM-DD HH:mm:ss') : '',
|
|
endTime: queryParams.timeRange?.[1] ? dayjs(queryParams.timeRange[1]).format('YYYY-MM-DD HH:mm:ss') : '',
|
|
payType: normalizePayType(queryParams.payType || ''),
|
|
orderCode: queryParams.orderCode,
|
|
markets: [],
|
|
}
|
|
}
|
|
console.log('查询参数:', params)
|
|
const res = await Moneyfunds(params)
|
|
if (res.code == 200) {
|
|
tableData.value = res.data.list || []
|
|
await nextTick()
|
|
scrollTableTop()
|
|
total.value = res.data.total || 0
|
|
loading.value = false
|
|
} else {
|
|
ElMessage.error(res.msg || t('elmessage.getDataFailed'))
|
|
loading.value = false
|
|
}
|
|
} catch (error) {
|
|
console.error(error)
|
|
loading.value = false
|
|
ElMessage.error(t('elmessage.getDataFailed'))
|
|
}
|
|
}
|
|
|
|
const handleSearch = () => {
|
|
queryParams.pageNum = 1
|
|
fetchData()
|
|
}
|
|
|
|
const handleReset = () => {
|
|
queryParams.jwcode = ''
|
|
queryParams.performanceMarket = ''
|
|
queryParams.timeRange = null
|
|
queryParams.payType = ''
|
|
queryParams.orderCode = ''
|
|
queryParams.platformSelection=[]
|
|
handleSearch()
|
|
}
|
|
|
|
const handlePageSizeChange = (val) => {
|
|
queryParams.pageSize = val
|
|
fetchData()
|
|
}
|
|
|
|
const handleCurrentChange = (val) => {
|
|
queryParams.pageNum = val
|
|
fetchData()
|
|
}
|
|
|
|
// 退款操作
|
|
const openRefundConfirm = () => {
|
|
showDetail.value=false
|
|
textContent.value = t('common.willRefundOrder') + '?'
|
|
refundConfirmDialog.value = true
|
|
refundFormData.value = {
|
|
...formDataRow.value,
|
|
oldpermanentGold: formDataRow.value.permanentGold || formDataRow.value.gold || 0,//退款永久金币
|
|
oldfreeGold: formDataRow.value.freeGold || formDataRow.value.free || 0,//退款免费金币
|
|
permanentGold: null,
|
|
freeGold: null,
|
|
}
|
|
|
|
}
|
|
const openRefundDialog = () => {
|
|
refundDialog.value = true
|
|
closeConfirmRefund()
|
|
}
|
|
|
|
const closeConfirmRefund = () => {
|
|
refundConfirmDialog.value = false
|
|
textContent.value = ''
|
|
}
|
|
const refundConfirmDialog = ref(false)
|
|
const textContent = ref('')
|
|
const refundDialog = ref(false)
|
|
const refundFormData = ref({})
|
|
const resetRefund = () => {
|
|
refundFormData.value.refundModel = ''
|
|
refundFormData.value.refundReason = ''
|
|
refundFormData.value.permanentGold = null
|
|
refundFormData.value.freeGold = null
|
|
|
|
}
|
|
const handleRefund = async () => {
|
|
try {
|
|
if (refundFormData.value.refundModel == 1) {
|
|
if (Number(refundFormData.value.permanentGold || 0) > Number(refundFormData.value.oldpermanentGold || 0)) {
|
|
ElMessage.error(t('elmessage.limitRefundGoldNotExceedOriginal'))
|
|
return
|
|
}
|
|
if (Number(refundFormData.value.freeGold || 0) > Number(refundFormData.value.oldfreeGold || 0)) {
|
|
ElMessage.error(t('elmessage.limitRefundGoldNotExceedOriginal'))
|
|
return
|
|
}
|
|
}
|
|
if (refundFormData.value.refundModel == 0) {
|
|
refundFormData.value.permanentGold = refundFormData.value.oldpermanentGold
|
|
refundFormData.value.freeGold = refundFormData.value.oldfreeGold
|
|
}
|
|
let params = {
|
|
jwcode: refundFormData.value.jwcode,
|
|
name: refundFormData.value.name,
|
|
market: refundFormData.value.marketName,
|
|
submitterMarket: adminData.value.markets,
|
|
remark: refundFormData.value.remark,
|
|
originalOrderId: refundFormData.value.id,
|
|
refundReason: refundFormData.value.refundReason,
|
|
refundModel: refundFormData.value.refundModel,
|
|
orderCode: refundFormData.value.orderCode,
|
|
submitterId: adminData.value.id,
|
|
permanentGold: (refundFormData.value.permanentGold) * 100 || 0,
|
|
handlingCharge: refundFormData.value.handlingCharge == null ? null : refundFormData.value.handlingCharge * 100,
|
|
freeGold: (refundFormData.value.freeGold) * 100 || 0,
|
|
partRefundGold: (refundFormData.value.permanentGold * 100 || 0),
|
|
partRefundFree: (refundFormData.value.freeGold * 100 || 0),
|
|
payType: refundFormData.value.payType,
|
|
}
|
|
console.log('这是退款参数：', params);
|
|
|
|
const res = await refundOnline(params)
|
|
if (res.code == 200) {
|
|
ElMessage.success(t('elmessage.submitSuccess'))
|
|
refundDialog.value = false
|
|
fetchData()
|
|
} else {
|
|
ElMessage.error(res.msg || t('refund.refundFailed'))
|
|
}
|
|
} catch (error) {
|
|
console.error(error)
|
|
}
|
|
}
|
|
|
|
const payPlatformOptionsList = ref([])
|
|
|
|
|
|
|
|
// ==================== 导出相关逻辑 ====================
|
|
|
|
const exportListVisible = ref(false)
|
|
const exportList = ref([])
|
|
const exportListLoading = ref(false)
|
|
|
|
// 导出Excel
|
|
const handleExport = async () => {
|
|
|
|
const formatStatuses = (statuses) => {
|
|
// 情况1：非数组/空值 → 返回空数组
|
|
if (!Array.isArray(statuses)) {
|
|
return [];
|
|
}
|
|
// 情况2：数组中包含 null 或 undefined → 返回空数组
|
|
if (statuses.some(item => item === null || item === undefined)) {
|
|
return [];
|
|
}
|
|
// 情况3：正常数组 → 返回原数组
|
|
return statuses;
|
|
};
|
|
try {
|
|
const params = {
|
|
pageNum: queryParams.pageNum,
|
|
pageSize: queryParams.pageSize,
|
|
fundsDTO: {
|
|
jwcode: queryParams.jwcode,
|
|
localMarket: queryParams.markets,
|
|
startTime: queryParams.timeRange?.[0] ? dayjs(queryParams.timeRange[0]).format('YYYY-MM-DD HH:mm:ss') : '',
|
|
endTime: queryParams.timeRange?.[1] ? dayjs(queryParams.timeRange[1]).format('YYYY-MM-DD HH:mm:ss') : '',
|
|
payType: normalizePayType(queryParams.payType || ''),
|
|
orderCode: queryParams.orderCode,
|
|
statuses: formatStatuses(queryParams.statuses),
|
|
markets: [],
|
|
}
|
|
}
|
|
// TODO: 确认导出接口 URL
|
|
const res = await exportFunds(params)
|
|
if (res.code == 200) {
|
|
|
|
console.log('导出参数', params)
|
|
ElMessage.success(t('elmessage.exportSuccess'))
|
|
}
|
|
|
|
} catch (error) {
|
|
console.error(error)
|
|
ElMessage.error(t('elmessage.exportError'))
|
|
}
|
|
}
|
|
|
|
// 打开导出列表弹窗
|
|
const openExportList = () => {
|
|
getExportList()
|
|
exportListVisible.value = true
|
|
}
|
|
|
|
// 获取导出列表
|
|
const getExportList = async () => {
|
|
exportListLoading.value = true
|
|
try {
|
|
const result = await request({ url: '/export/export' })
|
|
if (result.code === 200) {
|
|
const filteredData = result.data.filter(item => item.type == 15);
|
|
exportList.value = filteredData || []
|
|
} else {
|
|
ElMessage.error(result.msg || t('elmessage.getExportListError'))
|
|
}
|
|
} catch (error) {
|
|
console.error('获取导出列表出错:', error)
|
|
ElMessage.error(t('elmessage.getExportListError'))
|
|
} finally {
|
|
exportListLoading.value = false
|
|
}
|
|
}
|
|
|
|
// 下载导出文件
|
|
const downloadExportFile = (item) => {
|
|
if (item.state === 2) {
|
|
const link = document.createElement('a')
|
|
link.href = item.url
|
|
link.download = item.fileName
|
|
link.click()
|
|
} else {
|
|
ElMessage.warning(t('elmessage.exportingInProgress'))
|
|
}
|
|
}
|
|
|
|
// 根据状态返回对应的标签类型
|
|
const getTagType = (state) => {
|
|
switch (state) {
|
|
case 0: return 'info';
|
|
case 1: return 'primary';
|
|
case 2: return 'success';
|
|
case 3: return 'danger';
|
|
default: return 'info';
|
|
}
|
|
}
|
|
|
|
// 根据状态返回对应的标签文案
|
|
const getTagText = (state) => {
|
|
switch (state) {
|
|
case 0: return t('elmessage.pendingExecution');
|
|
case 1: return t('elmessage.executing');
|
|
case 2: return t('elmessage.executed');
|
|
case 3: return t('elmessage.errorExecution');
|
|
default: return t('elmessage.unknownStatus');
|
|
}
|
|
}
|
|
const throttledsubmitRefund = _.throttle(handleRefund, 5000, {
|
|
trailing: false
|
|
})
|
|
// 递归查找地区ID
|
|
// normalizeMarketLabel 标准化地区名称，用于对比匹配
|
|
const normalizeMarketLabel = (value) => {
|
|
return String(value ?? '')
|
|
.trim()
|
|
.toLowerCase()
|
|
.replace(/[\s_-]+/g, '')
|
|
}
|
|
// 传入的这两个参数对比，是否有匹配的地区ID
|
|
const findValueByLabel = (options, label) => {
|
|
// option和label都调用normalizeMarketLabel函数
|
|
const normalizedLabel = normalizeMarketLabel(label)
|
|
for (const option of options) {
|
|
if (normalizeMarketLabel(option.label) === normalizedLabel) {
|
|
return option.value
|
|
}
|
|
if (option.children && option.children.length) {
|
|
const found = findValueByLabel(option.children, label)
|
|
if (found) return found
|
|
}
|
|
}
|
|
return null
|
|
}
|
|
|
|
//记录详情表单
|
|
const formDataRow = ref({
|
|
jwcode:'',
|
|
marketName:'',
|
|
goodsName:'',
|
|
paymentCurrencyName:'',
|
|
paymentAmount:'',
|
|
payTime:'',
|
|
voucher:'',
|
|
name:'',
|
|
activity:'',
|
|
payType:'',
|
|
receivedCurrencyName:'',
|
|
receivedAmount:'',
|
|
receivedTime:'',
|
|
handlingCharge:'',
|
|
remark:'',
|
|
});
|
|
//记录点击函数
|
|
const showDetail=ref(false)
|
|
const showRecordDetail = async (row) => {
|
|
showDetail.value=true
|
|
formDataRow.value=row
|
|
}
|
|
const paymentCurrency = ref([
|
|
t('cash.currency.usd'), // 美元(USD)
|
|
t('cash.currency.hkd'), // 港币(HKD)
|
|
t('cash.currency.sgd'), // 新币(SGD)
|
|
t('cash.currency.myr'), // 马币(MYR)
|
|
t('cash.currency.thb'), // 泰铢(THB)
|
|
t('cash.currency.cad'), // 加币(CAD)
|
|
t('cash.currency.vnd'), // 越南盾(VND)
|
|
t('cash.currency.krw'), // 韩元(KRW)
|
|
t('cash.currency.rmb'), // 人民币(CNY)
|
|
])
|
|
|
|
//新增流水
|
|
const showAddDetail=ref(false)
|
|
const type = ref('other')
|
|
const addCashFlow=(s)=>{
|
|
showAddDetail.value=true
|
|
type.value=s
|
|
}
|
|
const selectAddType= (s) => {
|
|
otherFormRef.value?.resetFields?.();
|
|
ipay88FormRef.value?.resetFields?.();
|
|
type.value=s
|
|
}
|
|
const otherFormRef = ref(null);
|
|
const addOtherForm=ref({
|
|
performanceMarket:"", //业绩归属地
|
|
goodsName:"", //收入类别
|
|
goodNum:"", //个数
|
|
payType:"", //支付方式
|
|
paymentCurrency:"", //付款币种
|
|
paymentAmount:"", //付款金额
|
|
payTime:"", //支付时间
|
|
handlingCharge:"", //手续费
|
|
remark:"", //备注
|
|
isPerformance:'',
|
|
submitterId: adminData.value?.id || '', // 直接初始化为用户ID
|
|
submitterMarket: adminData.value?.markets || [] // 直接初始化为用户地区（通常是数组）
|
|
})
|
|
const otherRules = {
|
|
performanceMarket: [
|
|
{ required: true, message: t('common.performanceByRegionPlaceholder'), trigger: 'change' }
|
|
],
|
|
goodsName: [
|
|
{ required: true, message: t('cash.cashFlow.incomeCategoryPlaceholder'), trigger: 'change' }
|
|
],
|
|
goodNum: [
|
|
{ type: 'number', message: t('cash.cashFlow.quantityMustBeNumber'), trigger: 'blur' }
|
|
],
|
|
payType: [
|
|
{ required: true, message: t('elmessage.checkPayModel'), trigger: 'change' }
|
|
],
|
|
paymentCurrency: [
|
|
{ required: true, message: t('common.payCurrencyPlaceholder'), trigger: 'change' }
|
|
],
|
|
paymentAmount: [
|
|
{ required: true, message: t('common_add.payAmountPlaceholder'), trigger: 'blur' },
|
|
{ pattern: /^[0-9]+(\.[0-9]{1,2})?$/, message: t('cash.cashFlow.invalidFormat'), trigger: 'blur' }
|
|
],
|
|
payTime: [
|
|
{ required: true, message: t('common_add.payTimePlaceholder'), trigger: 'change' }
|
|
],
|
|
handlingCharge: [
|
|
{ pattern: /^[0-9]+(\.[0-9]{1,2})?$/, message: t('cash.cashFlow.invalidFormat'), trigger: 'blur' }
|
|
]
|
|
};
|
|
const handleOther=async ()=>{
|
|
if (!otherFormRef.value) return;
|
|
try {
|
|
await otherFormRef.value.validate();
|
|
if(addOtherForm.value.goodsName=== t('cash.cashFlow.localIntercompany') ||
|
|
addOtherForm.value.goodsName=== t('cash.cashFlow.corporateIntercompany') ||
|
|
addOtherForm.value.goodsName=== t('cash.cashFlow.otherIncomeNon') ){
|
|
addOtherForm.value.isPerformance='0'
|
|
}else{
|
|
addOtherForm.value.isPerformance='1'
|
|
}
|
|
const submitData={
|
|
performanceMarket:String(MarketNameForId(addOtherForm.value.performanceMarket)),
|
|
goodsName:addOtherForm.value.goodsName,
|
|
goodNum:String(addOtherForm.value.goodNum),
|
|
payType:addOtherForm.value.payType,
|
|
paymentCurrency:String(CurrencyForId(addOtherForm.value.paymentCurrency)),
|
|
paymentAmount:addOtherForm.value.paymentAmount,
|
|
payTime:addOtherForm.value.payTime,
|
|
handlingCharge:addOtherForm.value.handlingCharge,
|
|
remark:addOtherForm.value.remark,
|
|
isPerformance:addOtherForm.value.isPerformance,
|
|
submitterId: addOtherForm.value.submitterId,
|
|
submitterMarket: addOtherForm.value.submitterMarket,
|
|
}
|
|
const handle =await request({
|
|
url:'/cashCollection/addExFund',
|
|
data:submitData
|
|
})
|
|
console.log('提交的数据:', submitData);
|
|
if (handle.code == 200 || handle.status == 200) {
|
|
ElMessage.success(t('elmessage.submitSuccess'));
|
|
otherFormRef.value?.resetFields?.();
|
|
showAddDetail.value = false;
|
|
}
|
|
} catch (error) {
|
|
console.log('校验失败', error);
|
|
}
|
|
};
|
|
const ipay88FormRef = ref(null);
|
|
const addIpay88Form=ref({
|
|
performanceMarket:"", //业绩归属地
|
|
payType:"", //支付方式
|
|
paymentCurrency:"", //付款币种
|
|
handlingCharge:"", //手续费
|
|
remark:"", //备注
|
|
submitterId: adminData.value?.id || '', // 直接初始化为用户ID
|
|
submitterMarket: adminData.value?.markets || [] // 直接初始化为用户地区（通常是数组）
|
|
})
|
|
const ipay88Rules = {
|
|
performanceMarket: [{ required: true, message: t('common.performanceByRegionPlaceholder'), trigger: 'change' } ],
|
|
goodsName: [{ required: true, message: t('cash.cashFlow.incomeCategoryPlaceholder'), trigger: 'change' }],
|
|
// 付款金额固定为0（根据表格要求）
|
|
paymentAmount: [
|
|
{ required: true, message: t('cash.cashFlow.paymentMust'), trigger: 'change',
|
|
validator: (rule, value, callback) => {
|
|
const numValue = Number(value);
|
|
if (numValue !== 0 && numValue !== 0.0) {
|
|
callback(new Error(t('cash.cashFlow.paymentMust')));
|
|
} else {
|
|
callback();
|
|
}
|
|
}
|
|
}
|
|
],
|
|
payType: [ { required: true, message: t('common.payModelPlaceholder'), trigger: 'change' } ],
|
|
paymentCurrency: [{ required: true, message: t('common.payCurrencyPlaceholder'), trigger: 'change' }],
|
|
payTime: [{ required: true, message: t('common_add.payTimePlaceholder'), trigger: 'change' }],
|
|
handlingCharge: [
|
|
{ required: true, message: t("common_add.feePlaceholder"),trigger: 'change'},
|
|
{ pattern: /^[0-9]+(\.[0-9]{1,2})?$/, message: t('cash.cashFlow.invalidFormat'),trigger: 'change' } ],
|
|
remark: [{ max: 100, message: t('cash.cashFlow.remarksexceed'), trigger: 'change' }]
|
|
};
|
|
const handleIpay88 =async () =>{
|
|
if (!ipay88FormRef.value) return;
|
|
try {
|
|
await ipay88FormRef.value.validate();
|
|
const Data={
|
|
performanceMarket:String(MarketNameForId(addIpay88Form.value.performanceMarket)),
|
|
payType:addIpay88Form.value.payType,
|
|
paymentCurrency:String(CurrencyForId(addIpay88Form.value.paymentCurrency)),
|
|
handlingCharge:addIpay88Form.value.handlingCharge,
|
|
remark:addIpay88Form.value.remark,
|
|
submitterId: addIpay88Form.value.submitterId,
|
|
submitterMarket: addIpay88Form.value.submitterMarket,
|
|
}
|
|
const handle =await request({
|
|
url:'/cashCollection/addiPay88Fee',
|
|
data:Data
|
|
})
|
|
console.log('提交的数据:', Data);
|
|
if (handle.code == 200 || handle.status == 200) {
|
|
ElMessage.success(t('elmessage.submitSuccess'));
|
|
ipay88FormRef.value?.resetFields?.();
|
|
showAddDetail.value = false;
|
|
}
|
|
} catch (error) {
|
|
console.log('校验失败', error);
|
|
}
|
|
}
|
|
// 修改 handleCancel 方法
|
|
const handleCancel = () => {
|
|
otherFormRef.value?.resetFields?.();
|
|
ipay88FormRef.value?.resetFields?.();
|
|
showAddDetail.value = false;
|
|
};
|
|
const previewVisible=ref(false)
|
|
const handlePreviewClick=()=>{
|
|
if(previewVisible.value){
|
|
previewVisible.value=false
|
|
}
|
|
}
|
|
onMounted(async () => {
|
|
await initPermissions()
|
|
await getMarket()
|
|
await getPayPlatformOptions()
|
|
// 处理从工作台跳转过来的地区参数
|
|
// 如果出现URL中的?region=a®ion=b 这种重复key，router会解析为['a','b'], 取第一个地区ID
|
|
const regionName = Array.isArray(route.query.region) ? route.query.region[0] : route.query.region
|
|
if (regionName && marketOptions.value.length) {
|
|
const matchedId = findValueByLabel(marketOptions.value, regionName)
|
|
if (matchedId) {
|
|
// el-cascader 绑定的 markets 是数组
|
|
queryParams.markets = [matchedId]
|
|
}
|
|
}
|
|
|
|
fetchData()
|
|
})
|
|
</script>
|
|
|
|
<template>
|
|
<div class="cash-flow-container">
|
|
<!-- 搜索区域 -->
|
|
<el-card class="search-card">
|
|
<div class="search-bar">
|
|
<!-- 第一行 -->
|
|
<div class="search-row">
|
|
<div class="search-item">
|
|
<span class="label">{{ t('common.jwcode') }}：</span>
|
|
<el-input v-model="queryParams.jwcode" :placeholder="t('common.jwcodePlaceholder')" clearable />
|
|
</div>
|
|
<div class="search-item">
|
|
<span class="label">{{ t('cash.cashFlow.performanceMarket') }}</span>
|
|
<el-select v-model="queryParams.performanceMarket"
|
|
:placeholder="t('cash.cashFlow.performanceMarketPlaceholder')"
|
|
clearable :multiple="true"
|
|
style="width: 220px;"
|
|
:prop="performanceMarket"
|
|
collapse-tags >
|
|
<el-option v-for="item in performanceMarket" :key="item" :label="item" :value="item" />
|
|
</el-select>
|
|
<!-- <span class="label">{{ t('common.performanceByRegion') }}：</span> -->
|
|
<!-- 下拉多选，使用 el-cascader 匹配地区树结构 -->
|
|
<!-- <el-cascader v-model="queryParams.markets" :options="marketOptions"
|
|
:props="{ multiple: true, emitPath: false }" collapse-tags collapse-tags-tooltip
|
|
:placeholder="t('common.performanceByRegionPlaceholder')" clearable style="width: 240px;" /> -->
|
|
</div>
|
|
|
|
<!-- 选择平台二级表单 -->
|
|
<div class="search-item">
|
|
<span class="label">{{ t('common.payPlatform1') }}：</span>
|
|
<el-cascader v-model="queryParams.platformSelection" :options="payPlatformOptionsList"
|
|
:props="{ multiple: true ,value:'id',label:'name'}"
|
|
collapse-tags collapse-tags-tooltip :placeholder="t('common.payPlatformPlaceholder1')" clearable
|
|
style="width: 220px;"
|
|
/>
|
|
</div>
|
|
<div class="search-item">
|
|
<span class="label">{{ t('common.orderNo') }}：</span>
|
|
<el-input v-model="queryParams.orderCode" :placeholder="t('common.orderNoPlaceholder')" clearable />
|
|
</div>
|
|
<div class="search-item" style="width: auto;">
|
|
<span class="label">{{ t('common.payTime2') }}：</span>
|
|
<el-date-picker v-model="queryParams.timeRange" type="datetimerange" :range-separator="t('common.to')"
|
|
:start-placeholder="t('common.startTime')" :end-placeholder="t('common.endTime')"
|
|
:default-time="[new Date(2000, 1, 1, 0, 0, 0), new Date(2000, 1, 1, 23, 59, 59)]" style="width: 350px;" />
|
|
</div>
|
|
<div class="search-btn-group">
|
|
<el-button type="primary" @click="handleSearch">{{ t('common.search') }}</el-button>
|
|
<el-button type="primary" @click="handleExport">{{ t('common.exportExcel') }}</el-button>
|
|
<el-button type="primary" @click="openExportList">{{ t('common.viewExportList') }}</el-button>
|
|
<el-button type="success" @click="handleReset">{{ t('common.reset') }}</el-button>
|
|
</div>
|
|
<div class="newAdd">
|
|
<el-button v-if="hasNewTransactionFlow" class="newAdd_btn" @click="addCashFlow('other')">{{ t('common.addCashFlow') }}</el-button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</el-card>
|
|
<!-- 表格区域 -->
|
|
<el-card class="table-card" >
|
|
<el-table ref="tableRef" :data="tableData" v-loading="loading" style="width: 100%; flex: 1;"
|
|
:cell-style="{ textAlign: 'center' }"
|
|
:header-cell-style="{ background: '#F3FAFE', color: '#333', textAlign: 'center' }"
|
|
@row-click="showRecordDetail" >
|
|
<el-table-column type="index" :label="t('common_list.id')" width="60" align="center" fixed="left">
|
|
<template #default="scope">
|
|
<span>{{ scope.$index + 1 + (queryParams.pageNum - 1) * queryParams.pageSize }}</span>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column prop="payTime" :label="t('common_list.payTime2')" width="180" align="center" />
|
|
<el-table-column prop="orderCode" :label="t('common_list.orderCode')" width="280" show-overflow-tooltip />
|
|
<el-table-column prop="receivedMarket" :label="t('common_list.receiveArea')" width="280" show-overflow-tooltip >
|
|
<template #default="{ row }">
|
|
{{ marketFilter(row.receivedMarket) }}
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column prop="performanceMarket" :label="t('common_list.performanceMarket')" width="120" show-overflow-tooltip >
|
|
<template #default="{ row }">
|
|
{{ marketFilter(row.performanceMarket) }}
|
|
</template></el-table-column>
|
|
<el-table-column prop="name" :label="t('common_list.name')" width="150" show-overflow-tooltip />
|
|
<el-table-column prop="jwcode" :label="t('common_list.jwcode')" width="120" />
|
|
<el-table-column prop="goodsName" :label="t('common_list.receiveType')" width="120" />
|
|
<el-table-column prop="remark" :label="t('common_list.remark')" width="120" />
|
|
<el-table-column prop="goodNum" :label="t('common_list.nums')" width="120" />
|
|
<el-table-column prop="payType" :label="t('common_list.paymentMethod')" width="120" />
|
|
<el-table-column prop="receivedCurrencyName" :label="t('common_list.receiveCurrency')" width="120"
|
|
show-overflow-tooltip />
|
|
<el-table-column prop="paymentAmount" :label="t('common_list.payAmount')" width="150" align="right">
|
|
</el-table-column>
|
|
<el-table-column prop="handlingCharge" :label="t('common_list.fee')" width="100" align="right" />
|
|
<el-table-column prop="receivedAmount" :label="t('common_list.receiveAmount')" width="150" align="right">
|
|
</el-table-column>
|
|
<!-- <el-table-column :label="t('common_list.operation')" width="100" fixed="right" align="center">
|
|
<template #default="{ row }">
|
|
<el-button v-if="row.orderCode.slice(0, 4) == 'GOLD' && row.status === 4" type="danger" link size="small"
|
|
@click="openRefundConfirm(row)">
|
|
{{ t('common_list.refund') }}
|
|
</el-button>
|
|
</template>
|
|
</el-table-column> -->
|
|
</el-table>
|
|
|
|
<!-- 分页 -->
|
|
<div class="pagination-container">
|
|
<el-pagination background layout="total, sizes, prev, pager, next, jumper" :total="total"
|
|
:current-page="queryParams.pageNum" :page-size="queryParams.pageSize" :page-sizes="[10, 20, 50, 100]"
|
|
@size-change="handlePageSizeChange" @current-change="handleCurrentChange" />
|
|
</div>
|
|
</el-card>
|
|
|
|
<!-- 详情显示页 -->
|
|
<el-dialog class="detailDialog" v-model="showDetail" :title="t('common_add.originalOrderInfo')" width="700px" destroy-on-close>
|
|
<el-form :model="formDataRow" label-width="100px" class="detail-form" disabled>
|
|
<div style="display: flex;">
|
|
<div class="left">
|
|
<div class="add-item">
|
|
<el-form-item :label="t('common_list.jwcode')">
|
|
<el-input v-model="formDataRow.jwcode" />
|
|
</el-form-item>
|
|
</div>
|
|
<div class="add-item">
|
|
<el-form-item :label="t('common_list.market')">
|
|
<el-input v-model="formDataRow.marketName" />
|
|
</el-form-item>
|
|
</div>
|
|
<div class="add-item">
|
|
<el-form-item :label="t('common_list.productName')">
|
|
<el-input v-model="formDataRow.goodsName" />
|
|
</el-form-item>
|
|
</div>
|
|
<div class="add-item">
|
|
<el-form-item :label="t('common_list.payCurrency')">
|
|
<el-input v-model="formDataRow.paymentCurrencyName" />
|
|
</el-form-item>
|
|
</div>
|
|
<div class="add-item">
|
|
<el-form-item :label="t('common_list.payAmount')">
|
|
<el-input v-model="formDataRow.paymentAmount" />
|
|
</el-form-item>
|
|
</div>
|
|
<div class="add-item">
|
|
<el-form-item :label="t('common_list.payTime2')">
|
|
<el-input v-model="formDataRow.payTime" />
|
|
</el-form-item>
|
|
</div>
|
|
<div class="add-item">
|
|
<el-form-item :label="t('common_list.transferVoucher')">
|
|
<div v-if="formDataRow.voucher" class="voucher-container">
|
|
<el-image :src="formDataRow.voucher" :preview-src-list="[formDataRow.voucher]"
|
|
fit="cover" class="voucher-img" v-model:preview-visible="previewVisible"
|
|
@click="handlePreviewClick"/>
|
|
</div>
|
|
<div v-else class="no-voucher">{{ t('common_list.noTransferVoucher') }}</div>
|
|
</el-form-item>
|
|
</div>
|
|
</div>
|
|
<div class="right">
|
|
<div class="add-item">
|
|
<el-form-item :label="t('common_list.customerName')">
|
|
<el-input v-model="formDataRow.name" />
|
|
</el-form-item>
|
|
</div>
|
|
<div class="add-item">
|
|
<el-form-item :label="t('common_list.activity')">
|
|
<el-input v-model="formDataRow.activityName" />
|
|
</el-form-item>
|
|
</div>
|
|
<div class="add-item">
|
|
<el-form-item :label="t('common_list.payModel')">
|
|
<el-input v-model="formDataRow.payType" />
|
|
</el-form-item>
|
|
</div>
|
|
<div class="add-item">
|
|
<el-form-item :label="t('common_list.receiveCurrency')">
|
|
<el-input v-model="formDataRow.receiveCurrency" />
|
|
</el-form-item>
|
|
</div>
|
|
<div class="add-item">
|
|
<el-form-item :label="t('common_list.receiveAmount')">
|
|
<el-input v-model="formDataRow.receivedAmount" />
|
|
</el-form-item>
|
|
</div>
|
|
<div class="add-item">
|
|
<el-form-item :label="t('common_list.receiveTime')">
|
|
<el-input v-model="formDataRow.receivedTime" />
|
|
</el-form-item>
|
|
</div>
|
|
<div class="add-item">
|
|
<el-form-item :label="t('common_list.fee')">
|
|
<el-input v-model="formDataRow.handlingCharge" />
|
|
</el-form-item>
|
|
</div>
|
|
<div class="add-item">
|
|
<el-form-item :label="t('common_list.submitter')">
|
|
<el-input v-model="adminData.adminName" />
|
|
</el-form-item>
|
|
</div>
|
|
<div class="add-item">
|
|
<el-form-item :label="t('common_list.remark')">
|
|
<el-input v-model="formDataRow.remark" type="textarea" :rows="2" />
|
|
</el-form-item>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</el-form>
|
|
<div style="display:flex;justify-content: center;margin-top: 5vh;" class="btnDiv">
|
|
<el-button type="default" style="background-color: #7E91FF;" @click="showDetail = false">{{t('common.cancel')}}</el-button>
|
|
<el-button type="primary" style="background-color: #2741DE; margin-left: 2.5vw;" @click="openRefundConfirm">{{ t('common.refund') }}</el-button>
|
|
</div>
|
|
</el-dialog>
|
|
|
|
<!-- 新增流水页面 -->
|
|
<el-dialog class="adddialog" v-model="showAddDetail" style="width: 400px;">
|
|
<div style="width: fit-content; height: fit-content;margin-bottom: 20px; ">
|
|
<el-button
|
|
class="btnItem"
|
|
:style="{backgroundColor: type === 'other' ? '#2741DE' : '#E5EBFE', color: type === 'other' ? 'white' : '#666' }"
|
|
@click="selectAddType('other')" >{{ t('cash.cashFlow.otherIncome') }}</el-button>
|
|
<el-button
|
|
class="btnItem"
|
|
:style="{ backgroundColor: type === 'ipay88' ? '#2741DE' : '#E5EBFE', color: type === 'ipay88' ? 'white' : '#666' }"
|
|
@click="selectAddType('ipay88')" >{{ t('cash.cashFlow.addFee') }}</el-button>
|
|
</div>
|
|
<!-- 其他收入填写表单 -->
|
|
<div v-if="type === 'other'" >
|
|
<el-form :model="addOtherForm" :rules="otherRules" ref="otherFormRef" label-width="120px" label-position="left">
|
|
<el-form-item :label=" t('cash.cashFlow.performanceMarket')" prop="performanceMarket">
|
|
<el-select v-model="addOtherForm.performanceMarket" :placeholder="t('cash.cashFlow.performanceMarketPlaceholder')" >
|
|
<el-option v-for="item in performanceMarket" :key="item" :label="item" :value="item" />
|
|
</el-select>
|
|
</el-form-item>
|
|
<el-form-item :label="t('cash.cashFlow.incomeCategory')" prop="goodsName">
|
|
<el-select v-model="addOtherForm.goodsName" :placeholder="t('cash.cashFlow.incomeCategoryPlaceholder')" >
|
|
<el-option :value="t('cash.cashFlow.investmentIncome')" />
|
|
<el-option :value="t('cash.cashFlow.taxRefund')" />
|
|
<el-option :value="t('cash.cashFlow.governmentSubsidy')" />
|
|
<el-option :value="t('cash.cashFlow.localIntercompany')" />
|
|
<el-option :value="t('cash.cashFlow.corporateIntercompany')" />
|
|
<el-option :value="t('cash.cashFlow.otherIncomeNon')" />
|
|
<el-option :value="t('cash.cashFlow.otherIncomeYes')" />
|
|
</el-select>
|
|
</el-form-item>
|
|
<el-form-item :label="t('cash.cashFlow.quantity')" prop="goodNum">
|
|
<el-input v-model.number="addOtherForm.goodNum" :placeholder="t('cash.cashFlow.quantityPlaceholder')" />
|
|
</el-form-item>
|
|
<el-form-item :label="t('cash.cashFlow.payType')" prop="payType">
|
|
<el-select v-model="addOtherForm.payType" :placeholder="t('cash.cashFlow.payTypePlaceholder')" >
|
|
<el-option v-for="item in paytypeList" :key="item" :value="item" :label="item"/>
|
|
</el-select>
|
|
</el-form-item>
|
|
<el-form-item :label="t('cash.cashFlow.paymentCurrency')" prop="paymentCurrency">
|
|
<el-select v-model="addOtherForm.paymentCurrency" :placeholder="t('cash.cashFlow.paymentCurrencyPlaceholder')" >
|
|
<el-option v-for="item in paymentCurrency" :key="item" :label="item" :value="item"/>
|
|
</el-select>
|
|
</el-form-item>
|
|
<el-form-item :label="t('cash.cashFlow.paymentAmount')" prop="paymentAmount">
|
|
<el-input v-model="addOtherForm.paymentAmount" :placeholder="t('cash.cashFlow.paymentAmountPlaceholder')" />
|
|
</el-form-item>
|
|
<el-form-item :label="t('cash.cashFlow.paymentTime')" prop="payTime">
|
|
<el-date-picker v-model="addOtherForm.payTime" type="datetime" :placeholder="t('cash.cashFlow.paymentTimePlaceholder')" value-format="YYYY-MM-DD HH:mm:ss"/>
|
|
</el-form-item>
|
|
<el-form-item :label="t('cash.cashFlow.bankHandlingFee')" prop="handlingCharge">
|
|
<el-input v-model="addOtherForm.handlingCharge" :placeholder="t('cash.cashFlow.bankHandlingFeePlaceholder')" />
|
|
</el-form-item>
|
|
<el-form-item :label="t('cash.cashFlow.remarks')" prop="remark">
|
|
<el-input v-model="addOtherForm.remark" type="textarea" :rows="3" :placeholder="t('cash.cashFlow.remarksPlaceholder')" :maxlength="100" show-word-limit />
|
|
</el-form-item>
|
|
</el-form>
|
|
<div class="btnDiv" >
|
|
<el-button type="default" style="background-color: #7E91FF;" @click="handleCancel">{{t('cash.cashFlow.cancel')}}</el-button>
|
|
<el-button type="primary" style="background-color: #2741DE; margin-left: 2.5vw;" @click="handleOther">{{t('cash.cashFlow.submit')}}</el-button>
|
|
</div>
|
|
</div>
|
|
<!-- ipay88手续费填写表单 -->
|
|
<div v-if="type === 'ipay88'" >
|
|
<el-form :model="addIpay88Form" :rules="ipay88Rules" ref="ipay88FormRef" label-width="120px" label-position="left">
|
|
<el-form-item :label="t('cash.cashFlow.payType')" prop="payType">
|
|
<el-select v-model="addIpay88Form.payType" :placeholder="t('cash.cashFlow.payTypePlaceholder')" >
|
|
<el-option :value="t('cash.cashFlow.ipay88')" :label="t('cash.cashFlow.ipay88')"/>
|
|
<el-option :value="t('cash.cashFlow.cardPayment')" :label="t('cash.cashFlow.cardPayment')"/>
|
|
</el-select>
|
|
</el-form-item>
|
|
<el-form-item :label="t('cash.cashFlow.performanceMarket')" prop="performanceMarket">
|
|
<el-select v-model="addIpay88Form.performanceMarket" :placeholder="t('cash.cashFlow.performanceMarketPlaceholder')" >
|
|
<el-option v-for="item in performanceMarket" :key="item" :label="item" :value="item" />
|
|
</el-select>
|
|
</el-form-item>
|
|
<el-form-item :label="t('cash.cashFlow.incomeCategory')">
|
|
<el-input disabled :value="t('cash.cashFlow.fixedProcessingFee')"></el-input>
|
|
</el-form-item>
|
|
<el-form-item :label="t('cash.cashFlow.settlementRegion')">
|
|
<el-input disabled :value="t('cash.cashFlow.Malaysia')"></el-input>
|
|
</el-form-item>
|
|
<el-form-item :label="t('cash.cashFlow.paymentCurrency')" prop="paymentCurrency">
|
|
<el-select v-model="addIpay88Form.paymentCurrency" :placeholder="t('cash.cashFlow.paymentCurrencyPlaceholder')">
|
|
<el-option v-for="item in paymentCurrency" :key="item" :label="item" :value="item"/>
|
|
</el-select>
|
|
</el-form-item>
|
|
<el-form-item :label="t('cash.cashFlow.paymentAmount')" prop="paymentAmount">
|
|
<el-input v-model="addIpay88Form.paymentAmount" :placeholder="t('cash.cashFlow.paymentAmountPlaceholder')"/>
|
|
</el-form-item>
|
|
<el-form-item :label="t('cash.cashFlow.processingFee')" prop="handlingCharge">
|
|
<el-input v-model="addIpay88Form.handlingCharge" :placeholder="t('cash.cashFlow.processingFeePlaceholder')" />
|
|
</el-form-item>
|
|
<el-form-item :label="t('cash.cashFlow.remarks')" prop="remark">
|
|
<el-input v-model="addIpay88Form.remark" type="textarea" :rows="3" :placeholder="t('cash.cashFlow.remarksPlaceholder')" :maxlength="100" show-word-limit/>
|
|
</el-form-item>
|
|
</el-form>
|
|
<div class="btnDiv">
|
|
<el-button type="default" style="background-color: #7E91FF;" @click="handleCancel">{{t('cash.cashFlow.cancel')}}</el-button>
|
|
<el-button type="primary" style="background-color: #2741DE; margin-left: 2.5vw;" @click="handleIpay88">{{t('cash.cashFlow.submit')}}</el-button>
|
|
</div>
|
|
</div>
|
|
</el-dialog>
|
|
|
|
<!-- 导出列表弹窗 -->
|
|
<el-dialog v-model="exportListVisible" :title="t('common_export.exportList')" width="80%">
|
|
<el-table :data="exportList" style="width: 100% ;height: 60vh;" :loading="exportListLoading">
|
|
<el-table-column prop="fileName" :label="t('common_export.fileName')" />
|
|
<el-table-column prop="state" :label="t('common_export.status')">
|
|
<template #default="scope">
|
|
<el-tag :type="getTagType(scope.row.state)" :effect="scope.row.state === 3 ? 'light' : 'plain'">
|
|
{{ getTagText(scope.row.state) }}
|
|
</el-tag>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column prop="createTime" :label="t('common_export.createTime')">
|
|
<template #default="scope">
|
|
{{ dayjs(scope.row.createTime).format('YYYY-MM-DD HH:mm:ss') }}
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column :label="t('common_export.operation')">
|
|
<template #default="scope">
|
|
<el-button type="primary" size="small" @click="downloadExportFile(scope.row)"
|
|
:disabled="scope.row.state !== 2">
|
|
{{ t('common_export.download') }}
|
|
</el-button>
|
|
</template>
|
|
</el-table-column>
|
|
</el-table>
|
|
<template #footer>
|
|
<div class="dialog-footer">
|
|
<el-button text @click="exportListVisible = false">{{ t('common_export.close') }}</el-button>
|
|
</div>
|
|
</template>
|
|
</el-dialog>
|
|
|
|
<div class="recallDialog" v-show="refundConfirmDialog">
|
|
<div class="close">
|
|
<button @click="closeConfirmRefund" class="Btn">{{ t('common.close') }}</button>
|
|
</div>
|
|
<div class="text">
|
|
<text class="txt">{{ textContent }}</text>
|
|
</div>
|
|
<div class="cancle">
|
|
<button @click="closeConfirmRefund" class="Btn">{{ t('common.cancel') }}</button>
|
|
</div>
|
|
<div class="confirm">
|
|
<button @click="openRefundDialog" class="Btn">{{ t('common.confirm') }}</button>
|
|
</div>
|
|
</div>
|
|
|
|
<el-dialog v-model="refundDialog" :title="t('common_add.refund')" class="refundDialog" overflow draggable
|
|
style="width: 40vw;" :before-close="closeRefundForm">
|
|
<div style="display: flex;">
|
|
<div class="left">
|
|
<div class="add-item">
|
|
<el-text style="width:4vw;">{{ t('common_add.jwcode') }}</el-text>
|
|
<el-input v-model="refundFormData.jwcode" style="width:10vw;" disabled />
|
|
</div>
|
|
<div class="add-item">
|
|
<el-text style="width:4vw;">{{ t('common_add.customerName') }}</el-text>
|
|
<el-input v-model="refundFormData.name" style="width:10vw;" disabled />
|
|
</div>
|
|
<div class="add-item">
|
|
<el-text style="width:4vw;">{{ t('common_add.market') }}</el-text>
|
|
<el-input v-model="refundFormData.marketName" style="width:10vw;" disabled />
|
|
</div>
|
|
<div class="add-item">
|
|
<el-text style="width:4vw;">{{ t('common_add.activity') }}</el-text>
|
|
<el-input v-model="refundFormData.activityName" style="width:10vw;" disabled />
|
|
</div>
|
|
<div class="add-item">
|
|
<el-text style="width:4vw;">{{ t('common_add.productName') }}</el-text>
|
|
<el-input v-model="refundFormData.goodsName" style="width:10vw;" disabled />
|
|
</div>
|
|
<div style="display: flex; margin-bottom: 10px;">
|
|
<div style=" display: flex; align-items: center;justify-content: center; ">
|
|
<span style="color: #999999; white-space: nowrap;">{{ t('common_add.permanentGold')
|
|
}}：</span>
|
|
<el-input style="padding-right: 10px; height: 30px; width: 70px;"
|
|
v-model="refundFormData.oldpermanentGold" disabled />
|
|
</div>
|
|
<div style=" display: flex; align-items: center;justify-content: center; ">
|
|
<span style="color: #999999; white-space: nowrap;">{{ t('common_add.freeGold') }}：</span>
|
|
<el-input style="padding-right: 10px; height: 30px; width: 70px;" v-model="refundFormData.oldfreeGold"
|
|
disabled />
|
|
</div>
|
|
</div>
|
|
<div class="add-item">
|
|
<el-text style="width:4vw;">{{ t('common_add.payCurrency') }}</el-text>
|
|
<el-input v-model="refundFormData.paymentCurrency" style="width:10vw;" disabled />
|
|
</div>
|
|
<div class="add-item">
|
|
<el-text style="width:4vw;">{{ t('common_add.payAmount') }}</el-text>
|
|
<el-input v-model="refundFormData.paymentAmount" style="width:10vw;" disabled />
|
|
</div>
|
|
<div class="add-item">
|
|
<el-text style="width:4vw;">{{ t('common_add.payMethod') }}</el-text>
|
|
<el-input v-model="refundFormData.payType" style="width:10vw;" disabled />
|
|
</div>
|
|
<div class="add-item">
|
|
<el-text style="width:4vw;">{{ t('common_add.payTime') }}</el-text>
|
|
<el-date-picker v-model="refundFormData.payTime" type="datetime" style="width:10vw;" disabled />
|
|
</div>
|
|
<div class="add-item">
|
|
<el-text style="width:4vw;" size="small">{{ t('common_add.transferVoucher') }}</el-text>
|
|
<el-form-item :rules="{ required: true, message: t('common_add.uploadPhoto'), trigger: 'change' }">
|
|
<el-upload ref="uploadRef" :auto-upload="false" list-type="picture-card" :show-file-list="false">
|
|
<template #default>
|
|
<img v-if="refundFormData.voucher" :src="refundFormData.voucher"
|
|
style="width: 100%; height: 100%; object-fit: cover;">
|
|
<el-icon v-else>
|
|
<Plus />
|
|
</el-icon>
|
|
</template>
|
|
</el-upload>
|
|
</el-form-item>
|
|
</div>
|
|
<div class="add-item">
|
|
<el-text style="width:4vw;">{{ t('common_add.remark') }}</el-text>
|
|
<el-input v-model="refundFormData.remark" style="width:10vw;" :rows="2" type="textarea" maxLength="100"
|
|
disabled show-word-limit />
|
|
</div>
|
|
</div>
|
|
<div class="right">
|
|
<div class="add-item">
|
|
<el-text style="width:4vw;">{{ t('common_add.refundModel') }}</el-text>
|
|
<el-radio-group v-model="refundFormData.refundModel">
|
|
<el-radio value="0">{{ t('common_add.refundModelAll') }}</el-radio>
|
|
<el-radio value="1">{{ t('common_add.refundModelPart') }}</el-radio>
|
|
</el-radio-group>
|
|
</div>
|
|
<div v-show="refundFormData.refundModel == '1'" style="display: flex; margin-bottom: 10px;">
|
|
<div style=" display: flex; align-items: center;justify-content: center; ">
|
|
<span style="color: #999999; white-space: nowrap;">{{ t('common_add.permanentGold')
|
|
}}：</span>
|
|
<el-input style="padding-right: 10px; height: 30px; width: 70px;"
|
|
v-model="refundFormData.permanentGold" />
|
|
</div>
|
|
<div style=" display: flex; align-items: center;justify-content: center; ">
|
|
<span style="color: #999999; white-space: nowrap;">{{ t('common_add.freeGold') }}：</span>
|
|
<el-input style="padding-right: 10px; height: 30px; width: 70px;" v-model="refundFormData.freeGold" />
|
|
</div>
|
|
</div>
|
|
<div class="add-item">
|
|
<el-text style="width:4vw;">{{ t('common_add.refundReason') }}</el-text>
|
|
<el-input v-model="refundFormData.refundReason" style="width:10vw;" :rows="5" maxlength="150"
|
|
show-word-limit type="textarea" />
|
|
</div>
|
|
<div>{{ t('common_add.tip') }}</div>
|
|
<div style="display:flex;justify-content: center;margin-top: 5vh;">
|
|
<el-button type="default" @click="resetRefund">{{ t('common.reset') }}</el-button>
|
|
<el-button type="primary" @click="throttledsubmitRefund">{{ t('common.submit') }}</el-button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</el-dialog>
|
|
</div>
|
|
</template>
|
|
|
|
<style lang="scss">
|
|
.refund-popover {
|
|
background-color: #EEF5FE !important;
|
|
border: none !important;
|
|
padding: 12px !important;
|
|
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
|
|
width: 100px;
|
|
min-width: none;
|
|
|
|
.el-popper__arrow::before {
|
|
background-color: #EEF5FE !important;
|
|
border-color: #EEF5FE !important;
|
|
}
|
|
}
|
|
</style>
|
|
<style scoped lang="scss">
|
|
:deep(.detailDialog) {
|
|
background: #F3FAFE !important;
|
|
.left {
|
|
width: 50%;
|
|
height: 60vh;
|
|
min-height: 400px;
|
|
|
|
.add-item {
|
|
display: flex;
|
|
align-items: center;
|
|
margin-bottom: 1vh;
|
|
}
|
|
|
|
.image {
|
|
width: 4vw !important;
|
|
height: 4vw !important;
|
|
}
|
|
}
|
|
|
|
.right {
|
|
width: 50%;
|
|
height: 60vh;
|
|
|
|
.add-item {
|
|
display: flex;
|
|
align-items: center;
|
|
margin-bottom: 1vh;
|
|
}
|
|
}
|
|
.voucher-img {
|
|
width: 100px; /* 限制宽度 */
|
|
height: 100px; /* 限制高度 */
|
|
border-radius: 4px;
|
|
cursor: pointer; /* 鼠标放上去显示手型，提示可点击预览 */
|
|
}
|
|
.no-voucher {
|
|
color: #909399;
|
|
font-size: 14px;
|
|
}
|
|
}
|
|
|
|
:deep(.adddialog .el-form-item__label) {
|
|
min-width: 120px;
|
|
width: auto;
|
|
font-weight: 800;
|
|
padding-bottom: 15px;
|
|
}
|
|
|
|
.btnItem {
|
|
margin-left: 10px;
|
|
border-radius: 5px;
|
|
}
|
|
.btnDiv{
|
|
text-align: center;
|
|
margin-top: 30px;
|
|
}
|
|
:deep(.adddialog) {
|
|
min-width: 400px;
|
|
background-color: #F3FAFE !important;
|
|
margin-top: 8vh;
|
|
border-radius: 8px;
|
|
}
|
|
.popover-content {
|
|
.popover-title {
|
|
color: #409EFF;
|
|
font-weight: bold;
|
|
font-size: 14px;
|
|
margin-bottom: 8px;
|
|
}
|
|
|
|
.popover-item {
|
|
display: flex;
|
|
font-size: 13px;
|
|
color: #606266;
|
|
margin-bottom: 4px;
|
|
|
|
&:last-child {
|
|
margin-bottom: 0;
|
|
}
|
|
|
|
.label {
|
|
color: #606266;
|
|
}
|
|
|
|
.value {
|
|
color: #606266;
|
|
margin-left: 4px;
|
|
}
|
|
}
|
|
}
|
|
|
|
.cash-flow-container {
|
|
display: flex;
|
|
flex-direction: column;
|
|
height: 100%;
|
|
}
|
|
|
|
.search-card {
|
|
margin-bottom: 10px;
|
|
background: #F3FAFE; // 浅蓝背景
|
|
border: none;
|
|
|
|
:deep(.el-card__body) {
|
|
padding: 15px;
|
|
}
|
|
}
|
|
|
|
.search-bar {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 15px;
|
|
}
|
|
|
|
.search-row {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
gap: 20px;
|
|
align-items: center;
|
|
}
|
|
|
|
.search-item {
|
|
display: flex;
|
|
align-items: center;
|
|
|
|
.label {
|
|
font-size: 15px; // 参考 coinConsumeDetail 的 .text size="large"
|
|
color: #000; // 或 #606266
|
|
white-space: nowrap;
|
|
margin-right: 8px;
|
|
min-width: 60px;
|
|
text-align: right;
|
|
}
|
|
|
|
.el-input,
|
|
.el-select {
|
|
width: 200px;
|
|
}
|
|
}
|
|
|
|
.search-btn-group {
|
|
margin-left: 20px; // 靠右对齐
|
|
display: flex;
|
|
gap: 10px;
|
|
}
|
|
|
|
.newAdd {
|
|
display: flex;
|
|
width: 240px;
|
|
justify-content: flex-end;
|
|
}
|
|
.newAdd_btn{
|
|
background-color: blueviolet;
|
|
color: white;
|
|
}
|
|
|
|
.table-card {
|
|
background: #E7F4FD;
|
|
flex: 1;
|
|
border: none;
|
|
display: flex;
|
|
flex-direction: column;
|
|
|
|
:deep(.el-card__body) {
|
|
padding: 20px;
|
|
flex: 1;
|
|
display: flex;
|
|
flex-direction: column;
|
|
overflow: hidden;
|
|
}
|
|
}
|
|
|
|
.pagination-container {
|
|
margin-top: 15px;
|
|
display: flex;
|
|
justify-content: flex-start;
|
|
}
|
|
|
|
// 表格样式覆盖 (参考 coinConsumeDetail)
|
|
:deep(.el-table__header-wrapper),
|
|
:deep(.el-table__body-wrapper),
|
|
:deep(.el-table__cell),
|
|
:deep(.el-table__body td) {
|
|
background-color: #F3FAFE !important;
|
|
}
|
|
|
|
:deep(.el-table__row:hover > .el-table__cell) {
|
|
background-color: #E5EBFE !important;
|
|
}
|
|
|
|
.refundDialog {
|
|
.left {
|
|
width: 50%;
|
|
height: 70vh;
|
|
min-height: 700px;
|
|
padding: 0 2vw;
|
|
|
|
.add-item {
|
|
display: flex;
|
|
align-items: center;
|
|
margin-bottom: 1vh;
|
|
}
|
|
|
|
.image {
|
|
width: 4vw !important;
|
|
height: 4vw !important;
|
|
}
|
|
}
|
|
|
|
.right {
|
|
width: 50%;
|
|
height: 50vh;
|
|
|
|
.add-item {
|
|
display: flex;
|
|
align-items: center;
|
|
margin-bottom: 1vh;
|
|
}
|
|
}
|
|
}
|
|
|
|
.recallDialog {
|
|
//撤回弹窗提示
|
|
height: 392px;
|
|
width: 700px;
|
|
background-image: url('/src/assets/receive-recall.png');
|
|
position: fixed; // 固定定位，相对于浏览器窗口
|
|
top: 50%; // 距离顶部50%
|
|
left: 50%; // 距离左侧50%
|
|
transform: translate(-50%, -50%); // 向左、向上平移自身宽高的50%，实现居中
|
|
z-index: 1000; // 确保在其他元素上层显示
|
|
|
|
.close {
|
|
position: absolute;
|
|
left: 625px;
|
|
top: 20px;
|
|
height: 38px;
|
|
width: 38px;
|
|
opacity: 0;
|
|
|
|
.Btn {
|
|
height: 100%;
|
|
width: 100%;
|
|
border-radius: 10px;
|
|
}
|
|
}
|
|
|
|
.text {
|
|
position: absolute;
|
|
left: 185px;
|
|
top: 190px;
|
|
height: 67px;
|
|
width: 500px;
|
|
|
|
.txt {
|
|
height: 100%;
|
|
width: 100%;
|
|
color: #001a42;
|
|
font-family: "PingFang SC";
|
|
font-size: 38px;
|
|
font-style: normal;
|
|
font-weight: 900;
|
|
line-height: normal;
|
|
}
|
|
}
|
|
|
|
.cancle {
|
|
position: absolute;
|
|
left: 185px;
|
|
top: 304px;
|
|
height: 55px;
|
|
width: 150px;
|
|
opacity: 0;
|
|
|
|
.Btn {
|
|
height: 100%;
|
|
width: 100%;
|
|
border-radius: 20px;
|
|
}
|
|
}
|
|
|
|
.confirm {
|
|
position: absolute;
|
|
left: 375px;
|
|
top: 304px;
|
|
height: 55px;
|
|
width: 150px;
|
|
opacity: 0;
|
|
|
|
.Btn {
|
|
height: 100%;
|
|
width: 100%;
|
|
border-radius: 20px;
|
|
}
|
|
}
|
|
}
|
|
</style>
|