9 changed files with 720 additions and 275 deletions
@ -0,0 +1,348 @@ |
|||||||
|
<template> |
||||||
|
<div class="game-order-container"> |
||||||
|
<el-card shadow="hover"> |
||||||
|
<div class="game-order-search mb15"> |
||||||
|
<el-form label-position="right" :inline="true"> |
||||||
|
<el-form-item label="订单状态"> |
||||||
|
<el-select v-model="tableData.param.type" class="m-2" placeholder="选择订单查询方式"> |
||||||
|
<el-option label="按玩家查询订单" :value="0" /> |
||||||
|
<el-option label="按时间查询订单" :value="1" /> |
||||||
|
</el-select> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item label="商户单号" prop="purchaseOrderId" v-show="tableData.param.type === 0"> |
||||||
|
<el-input size="default" v-model="tableData.param.purchaseOrderId" placeholder="请输入商户单号" clearable /> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item label="起始时间" prop="times"> |
||||||
|
<el-date-picker |
||||||
|
type="datetimerange" |
||||||
|
size="default" |
||||||
|
v-model="tableData.param.times" |
||||||
|
style="width: 400px" |
||||||
|
range-separator="-" |
||||||
|
start-placeholder="开始" |
||||||
|
end-placeholder="结束" |
||||||
|
format="YYYY-MM-DD HH:mm:ss" |
||||||
|
value-format="x" |
||||||
|
/> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item label="商品类型" prop="productType" v-show="tableData.param.type === 0"> |
||||||
|
<el-select v-model="tableData.param.productType" class="m-2" placeholder="选择商品类型"> |
||||||
|
<el-option label="消耗型商品" :value="0" /> |
||||||
|
</el-select> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item label="商品列表" prop="productIdList" v-show="tableData.param.type === 0"> |
||||||
|
<el-select v-model="tableData.param.productIdList" class="m-2" placeholder="选择商品类型" multiple collapse-tags clearable> |
||||||
|
<el-option v-for="item in rechargeInfo" :key="item.Id" :label="item.Name" :value="item.Id" /> |
||||||
|
</el-select> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item v-show="tableData.param.type === 1"> |
||||||
|
<el-button size="default" type="primary" class="ml10" @click="orderList"> |
||||||
|
<el-icon> |
||||||
|
<ele-Search /> |
||||||
|
</el-icon> |
||||||
|
查询 |
||||||
|
<div v-if="!!tableData.param.continuationToken">下一页</div> |
||||||
|
</el-button> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item v-show="tableData.param.type === 0"> |
||||||
|
<el-button size="default" type="primary" class="ml10" @click="getOrder"> |
||||||
|
<el-icon> |
||||||
|
<ele-Search /> |
||||||
|
</el-icon> |
||||||
|
查询订单 |
||||||
|
</el-button> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item v-show="tableData.param.type === 0"> |
||||||
|
<el-button size="default" type="primary" class="ml10" @click="orderUserList"> |
||||||
|
<el-icon> |
||||||
|
<ele-Search /> |
||||||
|
</el-icon> |
||||||
|
查询列表 |
||||||
|
<div v-if="!!tableData.param.continuationToken">下一页</div> |
||||||
|
</el-button> |
||||||
|
</el-form-item> |
||||||
|
</el-form> |
||||||
|
</div> |
||||||
|
<el-table :data="tableData.data" style="width: 100%" stripe border v-show="tableData.param.type==0"> |
||||||
|
<el-table-column prop="purchaseOrderId" label="商户单号" width="300"></el-table-column> |
||||||
|
<el-table-column prop="environment" label="环境类型" width="180"> |
||||||
|
<template #default="scope"> |
||||||
|
<div v-if="scope.row.environment == 'NORMAL'">生产环境</div> |
||||||
|
<div v-if="scope.row.environment == 'SANDBOX'">沙盒环境</div> |
||||||
|
</template> |
||||||
|
</el-table-column> |
||||||
|
<el-table-column prop="productId" label="商品id" width="180"></el-table-column> |
||||||
|
<el-table-column prop="purchaseToken" label="token" width="180"></el-table-column> |
||||||
|
<el-table-column prop="productType" label="商品类型" width="100"> |
||||||
|
<template #default="scope"> |
||||||
|
<div v-if="scope.row.productType == 0">消耗型</div> |
||||||
|
<div v-if="scope.row.productType == 1">非消耗型</div> |
||||||
|
<div v-if="scope.row.productType == 2">自动续期订阅</div> |
||||||
|
<div v-if="scope.row.productType == 3">非续期订阅</div> |
||||||
|
</template> |
||||||
|
</el-table-column> |
||||||
|
<el-table-column prop="finishStatus" label="发货状态" width="100"> |
||||||
|
<template #default="scope"> |
||||||
|
<div v-if="scope.row.finishStatus == 1">已发货</div> |
||||||
|
<div v-else-if="scope.row.finishStatus == 2">未发货</div> |
||||||
|
<div v-else>{{ scope.row.finishStatus }}</div> |
||||||
|
</template> |
||||||
|
</el-table-column> |
||||||
|
<el-table-column prop="price" label="支付金额(元)" width="120"></el-table-column> |
||||||
|
<el-table-column prop="currency" label="币种" width="70"></el-table-column> |
||||||
|
<el-table-column prop="developerPayload" label="商户侧保留信息" width="100"></el-table-column> |
||||||
|
<el-table-column prop="purchaseTime" label="下单时间" show-overflow-tooltip width="200"> |
||||||
|
<template #default="scope"> |
||||||
|
{{ new Date(scope.row.purchaseTime).toLocaleString() }} |
||||||
|
</template> |
||||||
|
</el-table-column> |
||||||
|
<el-table-column prop="revocationTime" label="购买订单撤销时间" show-overflow-tooltip width="200"> |
||||||
|
<template #default="scope"> |
||||||
|
{{ new Date(scope.row.revocationTime).toLocaleString() }} |
||||||
|
</template> |
||||||
|
</el-table-column> |
||||||
|
<el-table-column prop="signedTime" label="签名时间" show-overflow-tooltip width="200"> |
||||||
|
<template #default="scope"> |
||||||
|
{{ new Date(scope.row.signedTime).toLocaleString() }} |
||||||
|
</template> |
||||||
|
</el-table-column> |
||||||
|
</el-table> |
||||||
|
<el-table :data="tableData.data" style="width: 100%" stripe border v-show="tableData.param.type==1"> |
||||||
|
<el-table-column prop="orderNo" label="商户单号" width="300"></el-table-column> |
||||||
|
<el-table-column prop="productName" label="商品名称" width="180"></el-table-column> |
||||||
|
<el-table-column prop="productId" label="商品Id" width="100"></el-table-column> |
||||||
|
<el-table-column prop="tradeType" label="交易类型" width="100"> |
||||||
|
<template #default="scope"> |
||||||
|
<div v-if="scope.row.tradeType">支付</div> |
||||||
|
<div v-else>退款</div> |
||||||
|
</template> |
||||||
|
</el-table-column> |
||||||
|
<el-table-column prop="tradeState" label="订单状态" width="100"> |
||||||
|
<template #default="scope"> |
||||||
|
<div v-if="scope.row.tradeState==0">成功</div> |
||||||
|
<div v-else-if="scope.row.tradeState==2">失败</div> |
||||||
|
<div v-else-if="scope.row.tradeState==4">未支付</div> |
||||||
|
<div v-else>{{scope.row.tradeState}}</div> |
||||||
|
</template> |
||||||
|
</el-table-column> |
||||||
|
<el-table-column prop="payMoney" label="支付金额(元)" width="120"></el-table-column> |
||||||
|
<el-table-column prop="couponAmt" label="优惠券金额(元)" width="130"></el-table-column> |
||||||
|
<el-table-column prop="currency" label="币种" width="70"></el-table-column> |
||||||
|
<el-table-column prop="country" label="country" width="100"></el-table-column> |
||||||
|
<el-table-column prop="orderTime" label="下单时间" show-overflow-tooltip width="200"> |
||||||
|
<template #default="scope"> |
||||||
|
{{new Date(scope.row.orderTime).toLocaleString()}} |
||||||
|
</template> |
||||||
|
</el-table-column> |
||||||
|
<el-table-column prop="tradeTime" label="支付时间" show-overflow-tooltip width="200"> |
||||||
|
<template #default="scope"> |
||||||
|
{{new Date(scope.row.tradeTime).toLocaleString()}} |
||||||
|
</template> |
||||||
|
</el-table-column> |
||||||
|
</el-table> |
||||||
|
</el-card> |
||||||
|
</div> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script lang="ts"> |
||||||
|
import { toRefs, reactive, onMounted, defineComponent } from 'vue'; |
||||||
|
import { allChannelList, ServerCategorize, serverList, ServerList } from '/@/utils/game'; |
||||||
|
import RechargeConfigCategory from '/@/api/config/RechargeConfigCategory.json'; |
||||||
|
import { gSwitchServer } from '/@/utils/utils'; |
||||||
|
import { getHarmonyOrder, getHarmonyOrderList, getHarmonyUserOrderList } from '/@/api/game/order'; |
||||||
|
import { ElMessage } from 'element-plus/es'; |
||||||
|
import { ElLoading } from 'element-plus'; |
||||||
|
|
||||||
|
// 定义接口来定义对象的类型 |
||||||
|
interface TableData { |
||||||
|
id: string; |
||||||
|
CreateTime: string; |
||||||
|
CfgId: number; |
||||||
|
Rmb: number; |
||||||
|
SilverPiece: number; |
||||||
|
Identity: string; |
||||||
|
timeStr: string; |
||||||
|
uid: string; |
||||||
|
RealName: string; |
||||||
|
StringId: string; |
||||||
|
} |
||||||
|
|
||||||
|
interface TableDataState { |
||||||
|
serverSwitch: number; |
||||||
|
serverCategorize: object; |
||||||
|
tableData: { |
||||||
|
data: Array<TableData>; |
||||||
|
total: number; |
||||||
|
param: { |
||||||
|
times: string[]; |
||||||
|
purchaseOrderId: string; |
||||||
|
continuationToken: string; |
||||||
|
productType: string; |
||||||
|
productIdList: string[]; |
||||||
|
type: number; |
||||||
|
}; |
||||||
|
order: object; |
||||||
|
}; |
||||||
|
servers: object; |
||||||
|
channels: object; |
||||||
|
rechargeInfo: object[]; |
||||||
|
} |
||||||
|
|
||||||
|
export default defineComponent({ |
||||||
|
name: 'apiV1GameOrderHarmonyOrder', |
||||||
|
setup() { |
||||||
|
const state = reactive<TableDataState>({ |
||||||
|
serverSwitch: 0, |
||||||
|
serverCategorize: ServerCategorize, |
||||||
|
tableData: { |
||||||
|
data: [], |
||||||
|
total: 0, |
||||||
|
param: { |
||||||
|
times: [], |
||||||
|
continuationToken: '', |
||||||
|
purchaseOrderId: '', |
||||||
|
productType: '', |
||||||
|
productIdList: [], |
||||||
|
type: 0, |
||||||
|
}, |
||||||
|
order: [], |
||||||
|
}, |
||||||
|
servers: ServerList, |
||||||
|
channels: [], |
||||||
|
rechargeInfo: RechargeConfigCategory, |
||||||
|
}); |
||||||
|
|
||||||
|
const getOrder = (reset) => { |
||||||
|
const loading = ElLoading.service({ |
||||||
|
lock: true, |
||||||
|
text: 'Loading', |
||||||
|
background: 'rgba(0, 0, 0, 0.7)', |
||||||
|
}); |
||||||
|
if (state.tableData.param.purchaseOrderId == '') { |
||||||
|
ElMessage.error('订单号未填写!'); |
||||||
|
loading.close(); |
||||||
|
return; |
||||||
|
} |
||||||
|
if (!reset) { |
||||||
|
state.tableData.total = 0; |
||||||
|
} |
||||||
|
state.tableData.data = []; |
||||||
|
getHarmonyOrder(state.tableData.param) |
||||||
|
.then((res) => { |
||||||
|
console.log(res); |
||||||
|
if (!res.data || !res.data.orderStatus) { |
||||||
|
return; |
||||||
|
} |
||||||
|
|
||||||
|
state.tableData.data.push(res.data.purchaseOrderInfo); |
||||||
|
}) |
||||||
|
.finally(() => { |
||||||
|
loading.close(); |
||||||
|
}); |
||||||
|
}; |
||||||
|
const orderUserList = (reset) => { |
||||||
|
const loading = ElLoading.service({ |
||||||
|
lock: true, |
||||||
|
text: 'Loading', |
||||||
|
background: 'rgba(0, 0, 0, 0.7)', |
||||||
|
}); |
||||||
|
if (state.tableData.param.purchaseOrderId == '') { |
||||||
|
ElMessage.error('订单号未填写!'); |
||||||
|
loading.close(); |
||||||
|
return; |
||||||
|
} |
||||||
|
if (!reset) { |
||||||
|
state.tableData.total = 0; |
||||||
|
} |
||||||
|
state.tableData.param.startTime = state.tableData.param.times[0]; |
||||||
|
state.tableData.param.endTime = state.tableData.param.times[1]; |
||||||
|
if (!state.tableData.param.endTime || !state.tableData.param.startTime) { |
||||||
|
ElMessage.error('请填写时间!'); |
||||||
|
loading.close(); |
||||||
|
return; |
||||||
|
} |
||||||
|
if (state.tableData.param.endTime - state.tableData.param.startTime > 365 * 24 * 60 * 60 * 1000) { |
||||||
|
ElMessage.error('时间指定在365天之内!'); |
||||||
|
loading.close(); |
||||||
|
return; |
||||||
|
} |
||||||
|
getHarmonyUserOrderList(state.tableData.param) |
||||||
|
.then((res) => { |
||||||
|
console.log(res); |
||||||
|
if (!res.data || !res.data) { |
||||||
|
return; |
||||||
|
} |
||||||
|
state.tableData.param.continuationToken = res.data.continuationToken; |
||||||
|
state.tableData.data = res.data.orderInfoList || []; |
||||||
|
if ( |
||||||
|
state.tableData.data.length == 0 && |
||||||
|
!!state.tableData.param.continuationToken && |
||||||
|
state.tableData.param.purchaseOrderId.length > 0 && |
||||||
|
state.tableData.total < 5 |
||||||
|
) { |
||||||
|
orderUserList(true); |
||||||
|
state.tableData.total++; |
||||||
|
} |
||||||
|
}) |
||||||
|
.finally(() => { |
||||||
|
loading.close(); |
||||||
|
}); |
||||||
|
}; |
||||||
|
|
||||||
|
const orderList = (reset) => { |
||||||
|
if (!reset) { |
||||||
|
state.tableData.total = 0; |
||||||
|
} |
||||||
|
state.tableData.param.startTime = state.tableData.param.times[0]; |
||||||
|
state.tableData.param.endTime = state.tableData.param.times[1]; |
||||||
|
if (!state.tableData.param.endTime || !state.tableData.param.startTime) { |
||||||
|
ElMessage.error('请填写时间!'); |
||||||
|
return; |
||||||
|
} |
||||||
|
if (state.tableData.param.endTime - state.tableData.param.startTime > 48 * 60 * 60 * 1000) { |
||||||
|
ElMessage.error('时间指定在48小时之内!'); |
||||||
|
return; |
||||||
|
} |
||||||
|
getHarmonyOrderList(state.tableData.param).then((res) => { |
||||||
|
console.log(res); |
||||||
|
if (!res.data || !res.data.order) { |
||||||
|
return; |
||||||
|
} |
||||||
|
state.tableData.param.continuationToken = res.data.order.continuationToken; |
||||||
|
state.tableData.data = res.data.order.orderInfoList || []; |
||||||
|
if (state.tableData.param.purchaseOrderId.length > 0) { |
||||||
|
state.tableData.data = state.tableData.data.filter((item) => { |
||||||
|
return item.requestId == state.tableData.param.purchaseOrderId; |
||||||
|
}); |
||||||
|
if (state.tableData.data.length == 0 && !!state.tableData.param.continuationToken && state.tableData.total < 5) { |
||||||
|
orderList(true); |
||||||
|
state.tableData.total++; |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
}); |
||||||
|
}; |
||||||
|
// 页面加载时 |
||||||
|
onMounted(() => { |
||||||
|
serverList().then((res) => { |
||||||
|
state.servers = res; |
||||||
|
}); |
||||||
|
allChannelList().then((res) => { |
||||||
|
state.channels = res; |
||||||
|
}); |
||||||
|
}); |
||||||
|
|
||||||
|
const switchServer = () => { |
||||||
|
return gSwitchServer(state.serverSwitch, state.servers); |
||||||
|
}; |
||||||
|
|
||||||
|
return { |
||||||
|
switchServer, |
||||||
|
getOrder, |
||||||
|
orderList, |
||||||
|
orderUserList, |
||||||
|
...toRefs(state), |
||||||
|
}; |
||||||
|
}, |
||||||
|
}); |
||||||
|
</script> |
||||||
Loading…
Reference in new issue