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.
223 lines
7.2 KiB
223 lines
7.2 KiB
<template> |
|
<div class="game-order-container"> |
|
<el-card shadow="hover"> |
|
<div class="game-order-search mb15"> |
|
<el-form :inline="true"> |
|
<el-form-item label="渠道" prop="channel"> |
|
<el-select v-model="tableData.param.channel" class="m-2" placeholder="选择渠道"> |
|
<el-option v-for="item in channels" :key="item.value" :label="item.label" :value="item.value" /> |
|
</el-select> |
|
</el-form-item> |
|
<el-form-item label="选择区服" prop="server"> |
|
<el-select v-model="serverSwitch" class="m-2" placeholder="选择服务器" size="large" style="width: 80px"> |
|
<el-option v-for="item in serverCategorize" :key="item.value" :label="item.label" :value="item.value" /> |
|
</el-select> |
|
<el-select v-model="tableData.param.server" class="m-2" placeholder="选择区服" clearable filterable> |
|
<el-option v-for="item in switchServer()" :key="item.id + ''" :label="item.name" :value="item.id + ''" /> |
|
</el-select> |
|
</el-form-item> |
|
<el-form-item label="uid"> |
|
<el-input size="default" v-model="tableData.param.uid" placeholder="请输入uid" class="w-50 m-2" clearable /> |
|
</el-form-item> |
|
<el-form-item label="起始时间" prop="lowTime"> |
|
<el-date-picker |
|
type="datetime" |
|
size="large" |
|
v-model="tableData.param.cTime" |
|
format="YYYY-MM-DD HH:mm:ss" |
|
value-format="YYYY-MM-DD HH:mm:ss" |
|
/> |
|
</el-form-item> |
|
<el-form-item label="终止时间" prop="time"> |
|
<el-date-picker type="datetime" v-model="tableData.param.eTime" format="YYYY-MM-DD HH:mm:ss" value-format="YYYY-MM-DD HH:mm:ss" /> |
|
</el-form-item> |
|
<el-form-item label="订单id"> |
|
<el-input size="default" v-model="tableData.param.tradeNo" placeholder="请输入渠道订单id" class="w-50 m-2" clearable /> |
|
</el-form-item> |
|
<el-form-item label="操作人员"> |
|
<el-input size="default" v-model="tableData.param.config" placeholder="请输入操作人员" class="w-50 m-2" clearable /> |
|
</el-form-item> |
|
<el-form-item label="操作人员"> |
|
<el-input size="default" v-model="tableData.param.user" placeholder="请输入操作人员" class="w-50 m-2" clearable /> |
|
</el-form-item> |
|
<el-form-item> |
|
<el-button size="default" type="primary" class="ml10" @click="orderList"> |
|
<el-icon> |
|
<ele-Search /> |
|
</el-icon> |
|
查询 |
|
</el-button> |
|
</el-form-item> |
|
</el-form> |
|
</div> |
|
<el-table :data="tableData.data" style="width: 100%" border> |
|
<el-table-column prop="tradeNo" label="订单id" show-overflow-tooltip></el-table-column> |
|
<el-table-column prop="unitId" label="id" show-overflow-tooltip></el-table-column> |
|
<el-table-column prop="amount" label="金额（元）" show-overflow-tooltip width="120"></el-table-column> |
|
<el-table-column prop="createTime" label="充值时间" show-overflow-tooltip width="180"></el-table-column> |
|
<el-table-column prop="remark" label="状态" show-overflow-tooltip width="120"> |
|
<template #default="scope"> |
|
<div v-if="scope.row.remark == ''" style="color: #e60000">充值失败</div> |
|
<div v-else-if="scope.row.remark == 'SUCCESS'">充值成功</div> |
|
<div v-else>{{ scope.row.remark }}</div> |
|
</template> |
|
</el-table-column> |
|
<el-table-column prop="channel" label="渠道" show-overflow-tooltip width="120"> |
|
<template #default="scope"> |
|
<span>{{ channels.find((r) => r.value == scope.row.channel)?.label }}</span> |
|
</template> |
|
</el-table-column> |
|
<el-table-column prop="server" label="区服" show-overflow-tooltip width="120"> |
|
<template #default="scope"> |
|
<span>{{ servers.find((r) => r.id == scope.row.server).name }}</span> |
|
</template> |
|
</el-table-column> |
|
</el-table> |
|
<el-row justify="space-evenly"> |
|
<el-pagination |
|
:hide-on-single-page="true" |
|
v-model:page-size="tableData.param.pageSize" |
|
v-model:current-page="tableData.param.pageNum" |
|
:pager-count="5" |
|
@current-change="orderList" |
|
layout="total, prev, pager, next" |
|
:total="tableData.total" |
|
/> |
|
</el-row> |
|
</el-card> |
|
</div> |
|
</template> |
|
|
|
<script lang="ts"> |
|
import { toRefs, reactive, onMounted, defineComponent } from 'vue'; |
|
import { gameRechargeChangeStateDelete, gmOrderList } from '/@/api/game'; |
|
import { allChannelList, ServerCategorize, serverList, ServerList } from '/@/utils/game'; |
|
import RechargeConfigCategory from '/@/api/config/RechargeConfigCategory.json'; |
|
import { ElMessage, ElMessageBox } from 'element-plus/es'; |
|
import { gSwitchServer } from '/@/utils/utils'; |
|
|
|
// 定义接口来定义对象的类型 |
|
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: { |
|
uid: number; |
|
channel: string; |
|
tradeNo: string; |
|
cTime: string; |
|
eTime: string; |
|
server: string; |
|
config: string; |
|
user: string; |
|
pageNum: number; |
|
pageSize: number; |
|
}; |
|
}; |
|
servers: object; |
|
channels: object; |
|
rechargeInfo: object[]; |
|
} |
|
|
|
export default defineComponent({ |
|
name: 'apiV1GameOrderOrderList', |
|
setup() { |
|
// const {proxy} = getCurrentInstance() as any; |
|
|
|
const state = reactive<TableDataState>({ |
|
serverSwitch: 0, |
|
serverCategorize: ServerCategorize, |
|
tableData: { |
|
data: [], |
|
total: 0, |
|
param: { |
|
uid: '', |
|
channel: '', |
|
tradeNo: '', |
|
cTime: '', |
|
eTime: '', |
|
server: '', |
|
config: '', |
|
user: '', |
|
pageSize: 10, |
|
pageNum: 1, |
|
}, |
|
}, |
|
servers: ServerList, |
|
channels: [], |
|
rechargeInfo: RechargeConfigCategory, |
|
}); |
|
|
|
const orderList = () => { |
|
gmOrderList(state.tableData.param).then((res) => { |
|
console.log(res); |
|
state.tableData.total = Number(res.data.total) || 0; |
|
state.tableData.data = res.data.list || []; |
|
}); |
|
}; |
|
// 页面加载时 |
|
onMounted(() => { |
|
serverList().then((res) => { |
|
state.servers = res; |
|
}); |
|
allChannelList().then((res) => { |
|
state.channels = res; |
|
}); |
|
}); |
|
|
|
const switchServer = () => { |
|
return gSwitchServer(state.serverSwitch, state.servers); |
|
}; |
|
const changeState = (order: string, state: number, remark: string) => { |
|
if (state != 3 && state != 2) { |
|
return; |
|
} |
|
if (state == 3) { |
|
let mess = '是否确认订单失效？，点击确认后本条订单失效。'; |
|
ElMessageBox.confirm(mess).then(() => { |
|
gameRechargeChangeStateDelete({ order: order, state: state }).then((res) => { |
|
if (res.data.data == 1) { |
|
ElMessage.success('发送成功'); |
|
} |
|
orderList(); |
|
}); |
|
}); |
|
} else if (state == 2) { |
|
ElMessageBox.prompt('请输入修改成功理由', '提示', { |
|
confirmButtonText: '确认', |
|
cancelButtonText: '取消', |
|
inputErrorMessage: 'Invalid http request', |
|
}).then(({ value }) => { |
|
gameRechargeChangeStateDelete({ order: order, state: state, remark: remark + ', ' + value }).then((res) => { |
|
if (res.data.data == 1) { |
|
ElMessage.success('发送成功'); |
|
} |
|
orderList(); |
|
}); |
|
}); |
|
} |
|
}; |
|
return { |
|
switchServer, |
|
orderList, |
|
changeState, |
|
...toRefs(state), |
|
}; |
|
}, |
|
}); |
|
</script>
|
|
|