123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391 |
- <!-- -->
- <template>
- <div class="m-container">
- <h2>
- <div class="squrt"></div>
- 乐团会员列表
- </h2>
- <div class="m-core">
- <save-form
- :inline="true"
- :model="searchForm"
- @submit="search"
- @reset="onReSet"
- >
- <el-form-item>
- <el-input
- v-model.trim="searchForm.search"
- clearable
- @keyup.enter.native="search"
- placeholder="乐团/学员名称、编号"
- ></el-input>
- </el-form-item>
- <!-- <el-form-item>
- <el-input
- v-model.trim="searchForm.search"
- @keyup.enter.native="search"
- placeholder="学员姓名、编号"
- ></el-input>
- </el-form-item> -->
- <el-form-item prop="organId">
- <el-select
- class="multiple"
- filterable
- v-model.trim="searchForm.organId"
- clearable
- placeholder="请选择分部"
- >
- <el-option
- v-for="(item, index) in selects.branchs"
- :key="index"
- :label="item.name"
- :value="item.id"
- ></el-option>
- </el-select>
- </el-form-item>
- <el-form-item prop="hasMember">
- <el-select
- class="multiple"
- v-model.trim="searchForm.hasMember"
- clearable
- placeholder="会员是否过期"
- >
- <el-option label="已过期" value="0"></el-option>
- <el-option label="即将过期" value="1"></el-option>
- </el-select>
- </el-form-item>
- <!-- <el-form-item prop="isActive">
- <el-select
- class="multiple"
- v-model.trim="searchForm.isActive"
- clearable
- placeholder="会员是否即将过期"
- >
- <el-option label="是" value="true"></el-option>
- <el-option label="否" value="false"></el-option>
- </el-select>
- </el-form-item> -->
- <el-form-item>
- <el-button native-type="submit" type="primary">搜索</el-button>
- <el-button native-type="reset" type="danger">重置</el-button>
- </el-form-item>
- </save-form>
- <div class="tableWrap">
- <el-table
- style="width: 100%"
- :header-cell-style="{ background: '#EDEEF0', color: '#444' }"
- :data="tableList"
- >
- <el-table-column
- align="center"
- prop="userId"
- label="学员编号"
- ></el-table-column>
- <el-table-column
- align="center"
- prop="username"
- label="学员姓名"
- ></el-table-column>
- <el-table-column
- align="center"
- prop="organName"
- label="所属分部"
- ></el-table-column>
- <el-table-column
- align="center"
- prop="musicGroupName"
- label="所属乐团"
- ></el-table-column>
- <el-table-column align="center" prop="studentId" label="会员是否过期">
- <template slot-scope="scope">
- <div>
- {{ scope.row.memberDay > 0 ? "否" : "是" }}
- </div>
- </template>
- </el-table-column>
- <el-table-column
- align="center"
- prop="memberDay"
- label="会员有效期剩余天数"
- ></el-table-column>
- <el-table-column align="center" prop="studentId" label="操作">
- <template slot-scope="scope">
- <div>
- <!-- addVisit -->
- <auth :auths="'visit/add/4465'">
- <el-button type="text" @click="addVisit(scope.row)"
- >新增回访</el-button
- >
- </auth>
- <auth :auths="'musicGroupQuit/directQuitMusicGroup4463'">
- <el-button type="text" @click="quitTeam(scope.row)"
- >退团退费</el-button
- >
- </auth>
- <auth :auths="'musicGroupQuit/directQuitMusicGroup4462'">
- <el-button type="text" @click="quieTeams(scope.row)"
- >退团</el-button
- >
- </auth>
- </div>
- </template>
- </el-table-column>
- </el-table>
- <pagination
- sync
- :total.sync="rules.total"
- :page.sync="rules.page"
- :limit.sync="rules.limit"
- :page-sizes="rules.page_size"
- @pagination="getList"
- />
- </div>
- </div>
- <!-- 退团弹窗 -->
- <el-dialog title="退团信息确认" width="640px" :visible.sync="quitVisible">
- <quiteTeam :quitForm="quitForm" :activeRow="activeRow" ref="quitForm" />
- <span slot="footer" class="dialog-footer question">
- <div>
- <el-popover placement="right" width="500" trigger="click">
- <div class="popoverWrap">
- <p>乐团退团退费规则:</p>
- <p>退还乐器练习云教练费用:报名缴费时缴费的乐器练习云教练费用</p>
- <p>退还课程费用:缴费总额-已结束课时单价之和</p>
- <p>退还乐器费用:报名缴费时缴纳的乐器费用(团购、租金)</p>
- <p>退还教辅费用:报名缴费时缴费的教辅费用</p>
- <p>退还乐保费用:报名缴费时缴费的乐保费用</p>
- </div>
- <el-button
- type="text"
- icon="el-icon-question"
- slot="reference"
- style="color: red"
- >退团退费说明</el-button
- >
- </el-popover>
- </div>
- <div>
- <el-button @click="quitVisible = false">取 消</el-button>
- <el-button type="primary" @click="chioseType">确 定</el-button>
- </div>
- </span>
- </el-dialog>
- <!-- 新增回访 -->
- <el-dialog
- title="新增回访"
- width="500px"
- :visible.sync="visitVisible"
- append-to-body
- >
- <visit
- v-if="visitVisible && activeRow"
- :detail="activeRow"
- :username="activeRow.username"
- @close="visitVisible = false"
- @submited="getList"
- :useVisitType="['其它', '会员续费']"
- />
- </el-dialog>
- </div>
- </template>
- <script>
- import axios from "axios";
- import { getToken } from "@/utils/auth";
- import pagination from "@/components/Pagination/index";
- import quiteTeam from "@/views/teamDetail/components/modals/quite-team";
- import { StudentQuit } from "@/api/buildTeam";
- import load from "@/utils/loading";
- import { getMusicMemberList } from "./api";
- import visit from "@/views/withdrawal-application/modals/visit";
- export default {
- components: { pagination, quiteTeam,visit },
- data() {
- return {
- searchForm: {
- search: null,
- },
- tableList: [{}],
- organList: [],
- rules: {
- // 分页规则
- limit: 10, // 限制显示条数
- page: 1, // 当前页
- total: 0, // 总条数
- page_size: [10, 20, 40, 50], // 选择限制显示条数
- },
- quitForm: {
- // 退团信息确认
- isRefundCourseFee: null,
- isRefundInstrumentFee: null,
- isRefundTeachingAssistantsFee: null,
- isMaintenanceFee: null,
- cloudTeacherAmount: null,
- isCloudTeacherAmount: null,
- maintenanceFee: 0,
- reason: "",
- },
- quitVisible: false,
- activeRow: null,
- visitVisible:false
- };
- },
- //生命周期 - 创建完成(可以访问当前this实例)
- created() {},
- //生命周期 - 挂载完成(可以访问DOM元素)
- mounted() {
- // 获取分部
- this.$store.dispatch("setBranchs");
- this.init();
- },
- methods: {
- init() {
- if(this.$route.query.hasMember){
- this.$set(this.searchForm,'hasMember',this.$route.query.hasMember)
- }
- this.getList();
- },
- async getList() {
- try {
- const res = await getMusicMemberList({
- ...this.searchForm,
- page: this.rules.page,
- rows: this.rules.limit,
- });
- this.tableList = res.data.rows;
- this.rules.total = res.data.total;
- } catch (e) {
- console.log(e);
- }
- },
- search() {
- this.rules.page = 1;
- this.getList();
- },
- onReSet() {},
- quitTeam(row) {
- this.activeRow = row;
- this.quitVisible = true;
- this.quitForm.cloudTeacherAmount = row.cloudTeacherAmount;
- },
- quieTeams(row) {
- this.$prompt("请输入退团原因", "提示", {
- confirmButtonText: "确定",
- cancelButtonText: "取消",
- inputPattern: /\S/,
- inputErrorMessage: "请输入退团原因",
- type: "warning",
- })
- .then((val) => {
- // 发请求 退团
- StudentQuit({
- musicGroupId: row.musicGroupId,
- userId: row.userId,
- reason: val.value,
- isRefundCourseFee: false,
- isRefundInstrumentFee: false,
- isRefundTeachingAssistantsFee: false,
- }).then((res) => {
- this.quitForm = {
- // 退团信息确认
- isRefundCourseFee: null,
- isRefundInstrumentFee: null,
- isRefundTeachingAssistantsFee: null,
- isMaintenanceFee: null,
- cloudTeacherAmount: null,
- isCloudTeacherAmount: null,
- maintenanceFee: 0,
- reason: "",
- };
- if (res.code == 200) {
- this.$message.success("退团成功");
- this.getList();
- this.quitVisible = false;
- }
- });
- })
- .catch(() => {});
- },
- chioseType() {
- this.$refs["quitForm"].$refs["quitForm"].validate((res) => {
- if (res) {
- this.$confirm("确定退团?", "提示", {
- confirmButtonText: "确定",
- cancelButtonText: "取消",
- type: "warning",
- })
- .then(() => {
- let row = this.activeRow;
- let params = {
- musicGroupId: row.musicGroupId,
- userId: row.userId,
- reason: this.quitForm.reason,
- isRefundCourseFee: this.quitForm.isRefundCourseFee,
- isRefundInstrumentFee: this.quitForm.isRefundInstrumentFee,
- isRefundTeachingAssistantsFee:
- this.quitForm.isRefundTeachingAssistantsFee,
- maintenanceFee: this.quitForm.maintenanceFee,
- };
- // 退还乐器练习云教练费用
- if (this.quitForm.isCloudTeacherAmount) {
- params.cloudTeacherAmount = this.quitForm.cloudTeacherAmount;
- } else {
- params.cloudTeacherAmount = 0;
- }
- // 发请求 退团
- StudentQuit(params).then((res) => {
- this.quitForm = {
- // 退团信息确认
- isRefundCourseFee: null,
- isRefundInstrumentFee: null,
- isRefundTeachingAssistantsFee: null,
- isMaintenanceFee: null,
- cloudTeacherAmount: null,
- isCloudTeacherAmount: null,
- maintenanceFee: 0,
- reason: "",
- };
- if (res.code == 200) {
- this.$message.success("退团成功");
- this.getList();
- this.quitVisible = false;
- }
- });
- })
- .catch(() => {});
- } else {
- }
- });
- // row.typeVisible = false;
- },
- addVisit(row) {
- this.visitVisible = true;
- this.activeRow = row;
- },
- },
- watch:{
- quitVisible(val) {
- if (!val) {
- this.quitForm = {
- // 退团信息确认
- isRefundCourseFee: null,
- isRefundInstrumentFee: null,
- isRefundTeachingAssistantsFee: null,
- isMaintenanceFee: null,
- cloudTeacherAmount: null,
- isCloudTeacherAmount: null,
- maintenanceFee: 0,
- reason: "",
- }
- this.$refs["quitForm"].$refs["quitForm"].resetFields();
- }
- },
- }
- };
- </script>
- <style lang='scss' scoped>
- </style>
|