<template>
|
<div class="app-container">
|
<el-form :model="queryParams" ref="queryRef" v-show="showSearch" :inline="true">
|
<el-form-item label="用户" prop="userKey">
|
<el-input v-model="queryParams.userKey" placeholder="请输入用户昵称或手机号" clearable style="width: 200px" @keyup.enter="getDataList"></el-input>
|
</el-form-item>
|
<el-form-item label="级别" prop="levelId">
|
<el-select v-model="queryParams.levelId" placeholder="级别" clearable style="width: 150px">
|
<el-option v-for="dict in level_id" :key="dict.value" :label="dict.label" :value="dict.value" />
|
</el-select>
|
</el-form-item>
|
<el-form-item label="类型" prop="type">
|
<el-select v-model="queryParams.type" placeholder="类型" clearable style="width: 150px">
|
<el-option key="1" label="灵玉" value="灵玉" />
|
<el-option key="2" label="余额" value="余额" />
|
</el-select>
|
</el-form-item>
|
<el-form-item label="收益类型" prop="source">
|
<el-select v-model="queryParams.source" placeholder="收益类型" clearable style="width: 200px">
|
<el-option v-for="dict in source" :key="dict.value" :label="dict.label" :value="dict.value" />
|
</el-select>
|
</el-form-item>
|
<el-form-item label="来源订单" prop="sourceOrder">
|
<el-input v-model="queryParams.sourceOrder" placeholder="来源订单号" clearable style="width: 200px" @keyup.enter="getDataList"></el-input>
|
</el-form-item>
|
<el-form-item label="来源账户" prop="sourceUser">
|
<el-input v-model="queryParams.sourceUser" placeholder="来源账户" clearable style="width: 200px" @keyup.enter="getDataList"></el-input>
|
</el-form-item>
|
<el-form-item label="创建时间">
|
<el-date-picker
|
v-model="queryTimesC"
|
type="daterange"
|
value-format="YYYY-MM-DD"
|
clearable
|
range-separator="至"
|
start-placeholder="开始时间"
|
end-placeholder="结束时间"
|
/></el-form-item>
|
<el-form-item>
|
<el-button type="primary" icon="Search" @click="getDataList">搜索</el-button>
|
<el-button icon="Refresh" @click="resetQuery">重置</el-button>
|
</el-form-item>
|
</el-form>
|
<el-row :gutter="10" class="mb8">
|
<el-col :span="1.5">
|
<el-button type="warning" plain icon="Download" @click="handleExport">导出</el-button>
|
</el-col>
|
<right-toolbar v-model:showSearch="showSearch" @queryTable="getDataList"></right-toolbar>
|
</el-row>
|
<el-table v-loading="tableOption.loading" :data="dataTable">
|
<el-table-column type="index" width="50" align="center" />
|
<el-table-column label="用户昵称" align="center" key="nickName" prop="nickName" />
|
<el-table-column label="用户账号" align="center" key="userName" prop="userName" />
|
<el-table-column label="级别" align="center" key="levelName" prop="levelName" />
|
<el-table-column label="金额" align="center" key="money" prop="money" />
|
<el-table-column label="类型" align="center" key="type" prop="type" />
|
<el-table-column label="来源订单" align="center" key="sourceOrder" prop="sourceOrder" />
|
<el-table-column label="来源账户" align="center" key="sourceUser" prop="sourceUser" />
|
<el-table-column label="收益类型" align="center">
|
<template #default="scope">
|
<span>{{ dispSource(scope.row.source) }}</span>
|
</template>
|
</el-table-column>
|
<el-table-column label="备注" align="center" key="remark" prop="remark" />
|
<el-table-column label="时间" align="center" key="createTime" prop="createTime" />
|
</el-table>
|
<pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize" @pagination="getDataList" />
|
</div>
|
</template>
|
<script setup lang="ts">
|
import { reactive, onMounted, toRefs, ref, getCurrentInstance } from "vue";
|
import { getList } from "@/api/report/userincome";
|
import type { FormInstance } from "element-plus";
|
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
|
const { level_id, source } = proxy.useDict("level_id", "source");
|
const state = reactive({
|
dataTable: [] as any[], //数据列表
|
total: 0, //总条数
|
tableOption: {
|
//表格配置
|
loading: true,
|
},
|
power: {
|
//操作权限
|
add: false,
|
single: false, //
|
multiple: true, //
|
},
|
showSearch: true, //是否显示分类
|
});
|
const { dataTable, total, tableOption, power, showSearch } = toRefs(state);
|
|
onMounted(() => {
|
getDataList();
|
});
|
//#region commonDisp
|
|
/**
|
* 收益类型
|
* @param e
|
*/
|
const dispSource = (e: string) => {
|
return source.value.find((f) => f.value == e)?.label;
|
};
|
|
//#endregion
|
//#region 查询
|
const queryTimesC = ref("");
|
const queryRef = ref<FormInstance>();
|
const queryParams = reactive({
|
//查询配置参数
|
pageNum: 1,
|
pageSize: 10,
|
userKey: "", // 用户名称或手机号
|
beginTime: "",
|
endTime: "",
|
sourceOrder: "",
|
levelId: "",
|
sourceUser: "",
|
source: "",
|
type: "",
|
});
|
|
/**
|
* 获取数据列表
|
*/
|
const getDataList = async () => {
|
queryParams.beginTime = queryTimesC.value[0];
|
queryParams.endTime = queryTimesC.value[1];
|
await getList(queryParams).then((res) => {
|
if (res.code == 200) {
|
state.dataTable = res.rows;
|
state.total = res.total;
|
state.tableOption.loading = false;
|
}
|
});
|
};
|
|
/**
|
* 重置
|
*/
|
const resetQuery = () => {
|
queryRef.value!.resetFields();
|
};
|
|
//#endregion
|
|
const handleExport = () => {
|
queryParams.beginTime = queryTimesC.value[0];
|
queryParams.endTime = queryTimesC.value[1];
|
proxy.download(
|
"/report/wallet/exportAllWalletList",
|
{
|
...queryParams,
|
},
|
`用户收益_${new Date().getTime()}.xlsx`
|
);
|
};
|
</script>
|
|
<style scoped lang="scss">
|
.el-table :deep(.danger-row) {
|
--el-table-tr-bg-color: var(--el-color-danger-light-9);
|
}
|
._el-row {
|
padding: 5px 0px;
|
border-bottom: 1px solid var(--el-border-color);
|
// margin-left: 20px;
|
align-items: center;
|
|
.el-input__wrapper {
|
padding: 0px !important;
|
}
|
}
|
// .td {
|
// overflow: hidden;
|
// }
|
// :deep(.el-descriptions__table) {
|
// table-layout: fixed;
|
// }
|
:deep(.el-descriptions__cell) {
|
padding: 8px 0px !important;
|
}
|
// .custom-item-sty {
|
// color: #333;
|
// padding: 8px 0px;
|
// font-weight: bold;
|
// overflow-x: hidden;
|
// }
|
</style>
|
