<template>
|
<div class="app-container">
|
<div
|
style="margin-bottom: 20px; display: flex; flex-direction: row-reverse"
|
>
|
<div>
|
<el-button type="primary" size="small">课程</el-button>
|
<el-button type="primary" size="small">班级</el-button>
|
<el-button type="danger" size="small">续费</el-button>
|
<el-button type="primary" size="small">成长</el-button>
|
<el-button type="primary" size="small">作业</el-button>
|
<el-button type="primary" size="small">停用</el-button>
|
</div>
|
</div>
|
<div>
|
<el-form ref="form" :model="detailsData" label-width="100px">
|
<el-form-item label="姓名" style="width: 400px">
|
<el-input v-model="detailsData.name" size="small"></el-input>
|
</el-form-item>
|
<el-form-item label="性别" style="width: 400px">
|
<el-input v-model="detailsData.gender" size="small"></el-input>
|
</el-form-item>
|
<el-form-item label="生日">
|
<el-date-picker
|
v-model="detailsData.birthday"
|
type="date"
|
placeholder="选择日期"
|
size="small"
|
>
|
</el-date-picker>
|
</el-form-item>
|
<el-form-item label="联系电话" style="width: 400px">
|
<el-input v-model="detailsData.mobile" size="small"></el-input>
|
</el-form-item>
|
<el-form-item label="照片">
|
<el-image
|
fit="cover"
|
v-if="detailsData.avatars && detailsData.avatars.length"
|
style="width: 200px; height: 200px"
|
:src="'https://s.9village.cn/' + detailsData.avatars[0].url2"
|
:preview-src-list="[
|
'https://s.9village.cn/' + detailsData.avatars[0].origin,
|
]"
|
>
|
</el-image>
|
</el-form-item>
|
<el-form-item label="课程顾问">
|
<el-select
|
v-model="detailsData.saleMan.id"
|
filterable
|
clearable
|
placeholder="请选择"
|
size="small"
|
>
|
<el-option
|
v-for="item in saleManList"
|
:key="item.id"
|
:label="item.name"
|
:value="item.id"
|
>
|
</el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item label="备注" style="width: 400px">
|
<el-input
|
type="textarea"
|
:rows="2"
|
placeholder="请输入备注"
|
v-model="detailsData.description"
|
></el-input>
|
</el-form-item>
|
<el-form-item label="账户" style="width: 800px">
|
<el-table :data="detailsData.accs" fit>
|
<el-table-column label="课程" prop="">
|
<template slot-scope="scope">
|
{{ scope.row.voucher.name }}
|
</template>
|
</el-table-column>
|
<el-table-column label="状态" prop="">
|
<template slot-scope="scope">
|
<el-link
|
type="primary"
|
:underline="false"
|
@click="goDetails(scope.row)"
|
>{{ scope.row.name }}</el-link
|
>
|
</template>
|
</el-table-column>
|
<el-table-column label="数量" prop="qty" />
|
<el-table-column label="金额" prop="amt" />
|
<el-table-column label="到期时间" prop="endDate" />
|
<el-table-column label="" prop="">
|
<template slot-scope="scope">
|
<el-link
|
type="primary"
|
:underline="false"
|
@click="goDetails(scope.row)"
|
>查看明细</el-link
|
>
|
</template>
|
</el-table-column>
|
</el-table>
|
</el-form-item>
|
<el-form-item
|
label=""
|
style="width: 500px; display: flex; justify-content: space-around"
|
>
|
<el-button size="small">取消</el-button>
|
<el-button type="primary" size="small">保存</el-button>
|
</el-form-item>
|
</el-form>
|
</div>
|
</div>
|
</template>
|
|
<script>
|
import { getDetails, getSaleMan } from "@/api/student";
|
|
export default {
|
filters: {
|
statusFilter(status) {
|
const statusMap = {
|
published: "success",
|
draft: "gray",
|
deleted: "danger",
|
};
|
return statusMap[status];
|
},
|
},
|
data() {
|
return {
|
detailsData: {
|
saleMan: [{ id: "", name: "" }],
|
},
|
saleManList: [],
|
};
|
},
|
created() {
|
this.getSaleManList();
|
this.fetchData();
|
},
|
methods: {
|
fetchData() {
|
let data = { id: Number(this.$route.query.id) };
|
getDetails(data).then((response) => {
|
this.detailsData = response.data.findPlayerDto;
|
this.detailsData.gender =
|
this.detailsData.gender == "FEMALE" ? "女" : "男";
|
if (
|
response.data.findPlayerDto.saleMan &&
|
response.data.findPlayerDto.saleMan.length !== 0
|
) {
|
this.detailsData.saleMan.id = String(this.detailsData.saleMan.id);
|
}
|
});
|
},
|
getSaleManList() {
|
let data = {
|
staffId: JSON.parse(localStorage.getItem("selectStaff")).id,
|
keyword: "",
|
pageIn: {
|
index: 0,
|
size: 999,
|
sorts: [
|
{
|
name: "name",
|
direction: "ASC",
|
},
|
{
|
name: "createTime",
|
direction: "DESC",
|
},
|
],
|
},
|
};
|
getSaleMan(data).then((response) => {
|
this.saleManList = response.data.findStaff.ls;
|
});
|
},
|
goDetails(row) {
|
this.$router.push("/details");
|
},
|
},
|
};
|
</script>
|
