<template>
|
<div class="app-container">
|
<el-form :model="queryParams" ref="queryRef" v-show="showSearch" :inline="true">
|
<el-form-item label="用户" prop="userId">
|
<el-select
|
v-model="queryParams.userId"
|
filterable
|
remote
|
reserve-keyword
|
:remote-method="remoteMethod"
|
:loading="selectProps.loading"
|
placeholder="用户名称/手机号"
|
clearable
|
style="width: 200px"
|
>
|
<el-option v-for="item in selectProps.options" :key="item.userId" :label="item.nickName + '/' + item.userName" :value="item.userId" />
|
</el-select>
|
</el-form-item>
|
<el-form-item label="投资周期(月)" prop="month">
|
<el-select v-model="queryParams.month" placeholder="投资周期" clearable style="width: 200px">
|
<el-option v-for="dict in investor_coeff" :key="dict.value" :label="dict.label" :value="dict.label" />
|
</el-select>
|
</el-form-item>
|
<!-- <el-form-item label="状态" prop="investorState">
|
<el-select v-model="queryParams.investorState" placeholder="投资状态" clearable style="width: 200px">
|
<el-option v-for="dict in investorState" :key="dict.value" :label="dict.label" :value="dict.value" />
|
</el-select>
|
</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="primary" plain :disabled="power.add" @click="handleRate">解冻</el-button>
|
</el-col>
|
<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" @cell-dblclick="handleInfo">
|
<el-table-column type="index" width="50" />
|
<el-table-column label="投资人" align="center" key="userName" prop="userName" width="150" />
|
<el-table-column label="投资金额(元)" align="center" key="money" prop="money" width="200" />
|
<el-table-column label="投资周期(月)" align="center" key="month" prop="month" width="150" />
|
<el-table-column label="回报系数" align="center" key="investorCoeff" prop="investorCoeff" width="100" />
|
<el-table-column label="投资状态" align="center" width="120">
|
<template #default="scope">
|
<span>{{ dispinvestorState(scope.row.investorState) }}</span>
|
</template>
|
</el-table-column>
|
<el-table-column label="生效状态" align="center" width="120">
|
<template #default="scope">
|
<span>{{ dispprodState(scope.row.prodState) }}</span>
|
</template>
|
</el-table-column>
|
<!-- <el-table-column label="回报时间" align="center" key="moneyTime" prop="moneyTime" width="200" /> -->
|
<!-- <el-table-column label="取出时间" align="center" key="getTime" prop="getTime" width="200" /> -->
|
<el-table-column label="创建时间" align="center" key="createTime" prop="createTime" width="200" />
|
<el-table-column label="备注" align="center" key="remark" prop="remark" />
|
<el-table-column label="操作" align="center" width="120">
|
<template #default="scope">
|
<el-button type="primary" size="small" @click="handleCheck(scope.row)">审核</el-button>
|
</template>
|
</el-table-column>
|
</el-table>
|
<pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize" @pagination="getDataList" />
|
<el-dialog title="订单详情" v-model="isOpenInfo" width="1000px" draggable :close-on-click-modal="false">
|
<el-descriptions :column="3">
|
<el-descriptions-item label="投资人">{{ dataInfo.userName }}</el-descriptions-item>
|
<el-descriptions-item label="投资金额(元)">{{ dataInfo.money }}</el-descriptions-item>
|
<el-descriptions-item label="投资周期(月)">{{ dataInfo.month }}</el-descriptions-item>
|
<el-descriptions-item label="回报系数">{{ dataInfo.investorCoeff }}</el-descriptions-item>
|
<el-descriptions-item label="投资状态">{{ dispinvestorState(dataInfo.investorState) }}</el-descriptions-item>
|
<el-descriptions-item label="生效状态">{{ dispprodState(dataInfo.prodState) }}</el-descriptions-item>
|
<!-- <el-descriptions-item label="回报时间">{{ dataInfo.moneyTime }}</el-descriptions-item> -->
|
<!-- <el-descriptions-item label="取出时间">{{ dataInfo.getTime }}</el-descriptions-item> -->
|
<el-descriptions-item label="创建时间">{{ dataInfo.createTime }}</el-descriptions-item>
|
<el-descriptions-item label="备注">{{ dataInfo.remark }}</el-descriptions-item>
|
</el-descriptions>
|
<el-row>
|
<el-col :span="2">支付凭证</el-col>
|
<el-col :span="20">
|
<div style="display: flex">
|
<ImagePreview :src="dataInfo.payImg" width="60px" height="60px"></ImagePreview>
|
</div>
|
</el-col>
|
</el-row>
|
</el-dialog>
|
|
<!-- 审核-->
|
<el-dialog title="审核" :close-on-click-modal="false" v-model="isOpenRate" width="400px" top="20vh" draggable>
|
<el-row class="_cu_row">
|
<el-col :span="3"> 审核 </el-col>
|
<el-col :span="18" :offset="1">
|
<el-radio-group v-model="formData.type">
|
<el-radio :label="1">通过</el-radio>
|
<el-radio :label="2">拒绝</el-radio>
|
</el-radio-group>
|
</el-col>
|
</el-row>
|
<template #footer>
|
<el-button @click="state.isOpenRate = false">取消</el-button>
|
<el-button type="primary" @click="sumbitCheckOrder()"> 提交 </el-button>
|
</template>
|
</el-dialog>
|
</div>
|
</template>
|
<script setup lang="ts">
|
import { reactive, onMounted, toRefs, ref, getCurrentInstance } from "vue";
|
import { getList, getInfo, checkData } from "@/api/orders/invest";
|
import { getUserByKeyword } from "@/api/system/user";
|
import type { FormInstance } from "element-plus";
|
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
|
const { investor_coeff } = proxy.useDict("investor_coeff");
|
const state = reactive({
|
dataTable: [] as any[], //数据列表
|
total: 0, //总条数
|
tableOption: {
|
//表格配置
|
loading: true,
|
},
|
power: {
|
//操作权限
|
add: false,
|
single: false, //
|
multiple: true, //
|
},
|
dataInfo: {} as any, //数据详情
|
showSearch: true, //是否显示分类
|
isOpenInfo: false,
|
isOpenRate: false,
|
});
|
const { dataTable, total, tableOption, power, showSearch, isOpenInfo, dataInfo, isOpenRate } = toRefs(state);
|
|
onMounted(() => {
|
getDataList();
|
});
|
|
const investorState = [
|
{ label: "待返还", value: "1" },
|
{ label: "已返还", value: "2" },
|
{ label: "已拒绝", value: "3" },
|
];
|
|
const prodState = [
|
{ label: "待生效", value: "1" },
|
{ label: "已生效", value: "2" },
|
{ label: "拒绝", value: "3" },
|
];
|
|
//#region commonDisp
|
|
/**
|
* 投资状态
|
* @param e
|
*/
|
const dispinvestorState = (e: string) => {
|
return investorState.find((f) => f.value == e)?.label;
|
};
|
|
/**
|
* 生效状态
|
* @param e
|
*/
|
const dispprodState = (e: string) => {
|
let stt = prodState.find((f) => f.value == e);
|
return stt ? stt.label : "";
|
};
|
|
//#endregion
|
|
//#region 查询
|
|
//#region 用户远程搜索
|
const selectProps = reactive({
|
loading: true,
|
options: [] as any[],
|
});
|
const remoteMethod = async (query: string) => {
|
if (query) {
|
selectProps.loading = true;
|
await getUserByKeyword({ keyword: query }).then((res) => {
|
if (res.code == 200) {
|
selectProps.options = res.data;
|
selectProps.loading = false;
|
}
|
});
|
} else {
|
selectProps.options = [];
|
}
|
};
|
|
//#endregion
|
const queryTimesC = ref("");
|
const queryRef = ref<FormInstance>();
|
const queryParams = reactive({
|
//查询配置参数
|
pageNum: 1,
|
pageSize: 10,
|
month: "",
|
investorState: "1",
|
prodState: "1",
|
userId: "",
|
beginTime: "",
|
endTime: "",
|
});
|
/**
|
* 获取数据列表
|
*/
|
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
|
|
//#region 详情
|
|
/**
|
* 查看详情
|
*/
|
const handleInfo = (e: any) => {
|
getDataInfo(e.id, () => {
|
state.isOpenInfo = true;
|
});
|
};
|
|
/**
|
* 查看详情
|
*/
|
const getDataInfo = (e: number, f: () => void) => {
|
getInfo(e).then((res) => {
|
if (res.code == 200) {
|
state.dataInfo = res.data;
|
f();
|
}
|
});
|
};
|
//#endregion
|
|
//#region 审核
|
|
const formData = reactive({
|
id: "",
|
type: 0,
|
});
|
|
/**
|
* 打开审核
|
* @param e
|
*/
|
const handleCheck = (e: any) => {
|
formData.id = e.id;
|
formData.type = 1;
|
state.isOpenRate = true;
|
};
|
|
/**
|
* 提交审核的订单
|
*/
|
const sumbitCheckOrder = () => {
|
checkData(formData).then((res) => {
|
if (res.code == 200) {
|
proxy.$modal.msgSuccess("操作成功");
|
getDataList();
|
state.isOpenRate = false;
|
} else {
|
proxy.$modal.msgError(res.msg);
|
}
|
});
|
};
|
|
//#endregion
|
</script>
|
|
<style scoped lang="scss">
|
._cu_row {
|
padding: 5px 0px;
|
align-items: center;
|
}
|
|
.el-table :deep(.danger-row) {
|
--el-table-tr-bg-color: var(--el-color-danger-light-9);
|
}
|
:deep(.el-descriptions__cell) {
|
padding: 8px 0px !important;
|
}
|
</style>
|
