|  | @@ -2,24 +2,28 @@
 | 
	
		
			
				|  |  |    <div class='container'>
 | 
	
		
			
				|  |  |      <el-form :inline="true"
 | 
	
		
			
				|  |  |               v-model="topForm">
 | 
	
		
			
				|  |  | -      <el-form-item label="乐团"
 | 
	
		
			
				|  |  | -                    v-if='brancheList.length >0'>
 | 
	
		
			
				|  |  | -        <!-- <el-select v-model="topForm.team"
 | 
	
		
			
				|  |  | -                   placeholder="请选择乐团名称">
 | 
	
		
			
				|  |  | -          <el-option v-for='(item,index) in brancheList'
 | 
	
		
			
				|  |  | +      <el-form-item label="乐团" v-if='brancheList.length > 0'>
 | 
	
		
			
				|  |  | +        <el-select v-model="topForm.team" @change="handleItemChange"  placeholder="请选择分部名称">
 | 
	
		
			
				|  |  | +            <el-option v-for='(item,index) in brancheList'
 | 
	
		
			
				|  |  |                       :key='index'
 | 
	
		
			
				|  |  | -                     :label="item.branchName"
 | 
	
		
			
				|  |  | -                     :value="item.branchId"></el-option>
 | 
	
		
			
				|  |  | -        </el-select> -->
 | 
	
		
			
				|  |  | +                     :label="item.label"
 | 
	
		
			
				|  |  | +                     :value="item.value"></el-option>
 | 
	
		
			
				|  |  | +        </el-select>
 | 
	
		
			
				|  |  | +        <el-select v-model="topForm.instruments"  placeholder="请选择乐团名称">
 | 
	
		
			
				|  |  | +            <el-option v-for='(item,index) in instrumentList'
 | 
	
		
			
				|  |  | +                     :key='index'
 | 
	
		
			
				|  |  | +                     :label="item.label"
 | 
	
		
			
				|  |  | +                     :value="item.value"></el-option>
 | 
	
		
			
				|  |  | +        </el-select>
 | 
	
		
			
				|  |  |          <!-- :props='props' -->
 | 
	
		
			
				|  |  | -        <el-cascader :options="brancheList"
 | 
	
		
			
				|  |  | +        <!-- <el-cascader :options="brancheList"
 | 
	
		
			
				|  |  |                       clearable
 | 
	
		
			
				|  |  |                       placeholder="请选择分部已经乐团"
 | 
	
		
			
				|  |  |                       v-model="topForm.team"
 | 
	
		
			
				|  |  |                       :props='props'
 | 
	
		
			
				|  |  |                       @active-item-change="handleItemChange"
 | 
	
		
			
				|  |  |                       @change="handleChange">
 | 
	
		
			
				|  |  | -        </el-cascader>
 | 
	
		
			
				|  |  | +        </el-cascader> -->
 | 
	
		
			
				|  |  |        </el-form-item>
 | 
	
		
			
				|  |  |        <el-form-item label="收费类型">
 | 
	
		
			
				|  |  |          <el-select v-model="topForm.money"
 | 
	
	
		
			
				|  | @@ -46,12 +50,18 @@
 | 
	
		
			
				|  |  |      </el-form>
 | 
	
		
			
				|  |  |      <div class="tableWrap">
 | 
	
		
			
				|  |  |        <el-table :data='tableList'
 | 
	
		
			
				|  |  | -                id='tableid'>
 | 
	
		
			
				|  |  | +                id='tableid'
 | 
	
		
			
				|  |  | +                height="calc(100vh - 122px)"
 | 
	
		
			
				|  |  | +                show-summary
 | 
	
		
			
				|  |  | +                :summary-method="getSummaries">
 | 
	
		
			
				|  |  | +        <el-table-column type="index"
 | 
	
		
			
				|  |  | +                           width="55"></el-table-column>
 | 
	
		
			
				|  |  |          <el-table-column align="center"
 | 
	
		
			
				|  |  |                           label="学生姓名"
 | 
	
		
			
				|  |  |                           prop='userName'></el-table-column>
 | 
	
		
			
				|  |  |          <el-table-column align="center"
 | 
	
		
			
				|  |  |                           label="订单编号"
 | 
	
		
			
				|  |  | +                         width="200"
 | 
	
		
			
				|  |  |                           prop='orderNo'></el-table-column>
 | 
	
		
			
				|  |  |          <el-table-column align="center"
 | 
	
		
			
				|  |  |                           label="收款账户"
 | 
	
	
		
			
				|  | @@ -63,10 +73,6 @@
 | 
	
		
			
				|  |  |                           label="到账时间"
 | 
	
		
			
				|  |  |                           prop='payTime'></el-table-column>
 | 
	
		
			
				|  |  |          <el-table-column align="center"
 | 
	
		
			
				|  |  | -                         label="备注"
 | 
	
		
			
				|  |  | -                         :formatter="filterRemark">
 | 
	
		
			
				|  |  | -        </el-table-column>
 | 
	
		
			
				|  |  | -        <el-table-column align="center"
 | 
	
		
			
				|  |  |                           label="课程费用"
 | 
	
		
			
				|  |  |                           prop='tuiFee'></el-table-column>
 | 
	
		
			
				|  |  |          <el-table-column align="center"
 | 
	
	
		
			
				|  | @@ -75,6 +81,11 @@
 | 
	
		
			
				|  |  |          <el-table-column align="center"
 | 
	
		
			
				|  |  |                           label="教辅费用"
 | 
	
		
			
				|  |  |                           prop="sdFee"></el-table-column>
 | 
	
		
			
				|  |  | +        <el-table-column align="left"
 | 
	
		
			
				|  |  | +                         label="备注"
 | 
	
		
			
				|  |  | +                         width="300"
 | 
	
		
			
				|  |  | +                         :formatter="filterRemark">
 | 
	
		
			
				|  |  | +        </el-table-column>
 | 
	
		
			
				|  |  |        </el-table>
 | 
	
		
			
				|  |  |        <!-- <div class="paginationWrap"> -->
 | 
	
		
			
				|  |  |        <!-- <el-pagination background
 | 
	
	
		
			
				|  | @@ -96,14 +107,16 @@ export default {
 | 
	
		
			
				|  |  |    data () {
 | 
	
		
			
				|  |  |      return {
 | 
	
		
			
				|  |  |        topForm: {
 | 
	
		
			
				|  |  | -        team: [],
 | 
	
		
			
				|  |  | +        team: '', 
 | 
	
		
			
				|  |  | +        instruments: '', 
 | 
	
		
			
				|  |  |          money: ''
 | 
	
		
			
				|  |  |        },
 | 
	
		
			
				|  |  |        tableList: [],
 | 
	
		
			
				|  |  |        limit: 20,
 | 
	
		
			
				|  |  |        total: 0,
 | 
	
		
			
				|  |  |        page: 1,
 | 
	
		
			
				|  |  | -      brancheList: [],
 | 
	
		
			
				|  |  | +      brancheList: [],// 分部列表
 | 
	
		
			
				|  |  | +      instrumentList: [], // 乐团列表
 | 
	
		
			
				|  |  |        idTmr: '',
 | 
	
		
			
				|  |  |        tableId: '',
 | 
	
		
			
				|  |  |        props: {
 | 
	
	
		
			
				|  | @@ -127,7 +140,7 @@ export default {
 | 
	
		
			
				|  |  |    },
 | 
	
		
			
				|  |  |    mounted () {
 | 
	
		
			
				|  |  |      this.getBranches();
 | 
	
		
			
				|  |  | -    this.getstudentList();
 | 
	
		
			
				|  |  | +    // this.getstudentList();
 | 
	
		
			
				|  |  |    },
 | 
	
		
			
				|  |  |    methods: {
 | 
	
		
			
				|  |  |      handleCurrentChange (val) {
 | 
	
	
		
			
				|  | @@ -150,23 +163,34 @@ export default {
 | 
	
		
			
				|  |  |                children: []
 | 
	
		
			
				|  |  |              })
 | 
	
		
			
				|  |  |            })
 | 
	
		
			
				|  |  | -          // console.log(arr)
 | 
	
		
			
				|  |  |            this.brancheList = arr
 | 
	
		
			
				|  |  | -
 | 
	
		
			
				|  |  |          }
 | 
	
		
			
				|  |  |        });
 | 
	
		
			
				|  |  |      },
 | 
	
		
			
				|  |  | -    getstudentList () {
 | 
	
		
			
				|  |  | -      // this.
 | 
	
		
			
				|  |  | -      checkOrderList(qs.stringify({ branchId: this.branchId, classId: this.classId, type: this.topForm.money })).then(res => {
 | 
	
		
			
				|  |  | -        this.tableList = res.data;
 | 
	
		
			
				|  |  | -      })
 | 
	
		
			
				|  |  | +    getstudentList (callBack) {
 | 
	
		
			
				|  |  | +        // this.
 | 
	
		
			
				|  |  | +        // console.log(this.topForm.team)
 | 
	
		
			
				|  |  | +        // console.log(this.topForm.instruments)
 | 
	
		
			
				|  |  | +        // console.log(`branchId: ${this.branchId}, classId: ${this.classId}`)
 | 
	
		
			
				|  |  | +        // return false
 | 
	
		
			
				|  |  | +        let params = this.topForm
 | 
	
		
			
				|  |  | +        checkOrderList(qs.stringify({ 
 | 
	
		
			
				|  |  | +            branchId: params.team, 
 | 
	
		
			
				|  |  | +            classId: params.instruments, 
 | 
	
		
			
				|  |  | +            type: params.money })).then(res => {
 | 
	
		
			
				|  |  | +            this.tableList = res.data;
 | 
	
		
			
				|  |  | +            // 回调函数
 | 
	
		
			
				|  |  | +            if(callBack && typeof callBack == 'function') {
 | 
	
		
			
				|  |  | +                callBack()
 | 
	
		
			
				|  |  | +            }
 | 
	
		
			
				|  |  | +        })
 | 
	
		
			
				|  |  |      },
 | 
	
		
			
				|  |  |      resetStudentList () {
 | 
	
		
			
				|  |  |        this.branchId = "";
 | 
	
		
			
				|  |  |        this.classId = '';
 | 
	
		
			
				|  |  |        this.topForm.money = "";
 | 
	
		
			
				|  |  | -      this.topForm.team = [];
 | 
	
		
			
				|  |  | +      this.topForm.team = '';
 | 
	
		
			
				|  |  | +      this.topForm.instruments = '';
 | 
	
		
			
				|  |  |        this.page = 1;
 | 
	
		
			
				|  |  |        this.getstudentList();
 | 
	
		
			
				|  |  |      },
 | 
	
	
		
			
				|  | @@ -179,7 +203,14 @@ export default {
 | 
	
		
			
				|  |  |        // var curTbl = document.getElementById('tableid');
 | 
	
		
			
				|  |  |        // this.tableId = curTbl;
 | 
	
		
			
				|  |  |        // console.log(curTbl);
 | 
	
		
			
				|  |  | -      this.method5('tableid');
 | 
	
		
			
				|  |  | +      this.topForm.money = "";
 | 
	
		
			
				|  |  | +      this.topForm.team = '';
 | 
	
		
			
				|  |  | +      this.topForm.instruments = '';
 | 
	
		
			
				|  |  | +      this.getstudentList(() => {
 | 
	
		
			
				|  |  | +          setTimeout(() => {
 | 
	
		
			
				|  |  | +              this.method5('tableid');
 | 
	
		
			
				|  |  | +          }, 100);
 | 
	
		
			
				|  |  | +      })
 | 
	
		
			
				|  |  |      },
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  |      // 导出
 | 
	
	
		
			
				|  | @@ -264,36 +295,68 @@ export default {
 | 
	
		
			
				|  |  |      },
 | 
	
		
			
				|  |  |      // 多选框选项卡
 | 
	
		
			
				|  |  |      handleItemChange (val) {
 | 
	
		
			
				|  |  | -      // 发请求 获取分部下的乐团
 | 
	
		
			
				|  |  | -      if (val.length > 0) {
 | 
	
		
			
				|  |  | -        // console.log(val[0]);
 | 
	
		
			
				|  |  | -        getMusicTeams(qs.stringify({ branchId: val[0] })).then(res => {
 | 
	
		
			
				|  |  | -          // res.data.rows
 | 
	
		
			
				|  |  | -          // 1.格式化数据
 | 
	
		
			
				|  |  | -          // 2.追加数据到相应的位置 
 | 
	
		
			
				|  |  | -          if (res.code == 200) {
 | 
	
		
			
				|  |  | -            let arr = [];
 | 
	
		
			
				|  |  | -            res.data.rows.map(item => {
 | 
	
		
			
				|  |  | -              arr.push({
 | 
	
		
			
				|  |  | -                label: item.name,
 | 
	
		
			
				|  |  | -                value: item.id
 | 
	
		
			
				|  |  | -              })
 | 
	
		
			
				|  |  | -            })
 | 
	
		
			
				|  |  | -            for (let item in this.brancheList) {
 | 
	
		
			
				|  |  | -              if (this.brancheList[item].value == val) {
 | 
	
		
			
				|  |  | -                this.brancheList[item].children = arr;
 | 
	
		
			
				|  |  | -              }
 | 
	
		
			
				|  |  | +        // 发请求 获取分部下的乐团
 | 
	
		
			
				|  |  | +        if (!val) {
 | 
	
		
			
				|  |  | +            return false
 | 
	
		
			
				|  |  | +        }
 | 
	
		
			
				|  |  | +        getMusicTeams(qs.stringify({ branchId: val })).then(res => {
 | 
	
		
			
				|  |  | +            // res.data.rows
 | 
	
		
			
				|  |  | +            // 1.格式化数据
 | 
	
		
			
				|  |  | +            // 2.追加数据到相应的位置 
 | 
	
		
			
				|  |  | +            if (res.code == 200) {
 | 
	
		
			
				|  |  | +                let arr = [];
 | 
	
		
			
				|  |  | +                res.data.rows.map(item => {
 | 
	
		
			
				|  |  | +                    arr.push({
 | 
	
		
			
				|  |  | +                        label: item.name,
 | 
	
		
			
				|  |  | +                        value: item.id
 | 
	
		
			
				|  |  | +                    })
 | 
	
		
			
				|  |  | +                })
 | 
	
		
			
				|  |  | +                this.instrumentList = arr
 | 
	
		
			
				|  |  | +                // for (let item in this.brancheList) {
 | 
	
		
			
				|  |  | +                //     if (this.brancheList[item].value == val) {
 | 
	
		
			
				|  |  | +                //         this.brancheList[item].children = arr;
 | 
	
		
			
				|  |  | +                //     }
 | 
	
		
			
				|  |  | +                // }
 | 
	
		
			
				|  |  |              }
 | 
	
		
			
				|  |  | -          }
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  |          })
 | 
	
		
			
				|  |  | -      }
 | 
	
		
			
				|  |  |      },
 | 
	
		
			
				|  |  |      handleChange (val) {
 | 
	
		
			
				|  |  |        if (val) {
 | 
	
		
			
				|  |  |          this.branchId = val[0];
 | 
	
		
			
				|  |  |          this.classId = val[1];
 | 
	
		
			
				|  |  |        }
 | 
	
		
			
				|  |  | +    },
 | 
	
		
			
				|  |  | +
 | 
	
		
			
				|  |  | +    getSummaries(param) {
 | 
	
		
			
				|  |  | +        const { columns, data } = param;
 | 
	
		
			
				|  |  | +        const sums = [];
 | 
	
		
			
				|  |  | +        columns.forEach((column, index) => {
 | 
	
		
			
				|  |  | +            if (index === 0) {
 | 
	
		
			
				|  |  | +                sums[index] = '总价';
 | 
	
		
			
				|  |  | +                return;
 | 
	
		
			
				|  |  | +            }
 | 
	
		
			
				|  |  | +            if(index === 2 || index === 3) {
 | 
	
		
			
				|  |  | +                sums[index] = 'N/A'
 | 
	
		
			
				|  |  | +                return
 | 
	
		
			
				|  |  | +            }
 | 
	
		
			
				|  |  | +            const values = data.map(item => Number(item[column.property]));
 | 
	
		
			
				|  |  | +            if (!values.every(value => isNaN(value))) {
 | 
	
		
			
				|  |  | +                sums[index] = values.reduce((prev, curr) => {
 | 
	
		
			
				|  |  | +                const value = Number(curr);
 | 
	
		
			
				|  |  | +                if (!isNaN(value)) {
 | 
	
		
			
				|  |  | +                    return prev + curr;
 | 
	
		
			
				|  |  | +                } else {
 | 
	
		
			
				|  |  | +                    return prev;
 | 
	
		
			
				|  |  | +                }
 | 
	
		
			
				|  |  | +                }, 0);
 | 
	
		
			
				|  |  | +                sums[index] += ' 元';
 | 
	
		
			
				|  |  | +            } else {
 | 
	
		
			
				|  |  | +                sums[index] = 'N/A';
 | 
	
		
			
				|  |  | +            }
 | 
	
		
			
				|  |  | +        });
 | 
	
		
			
				|  |  | +
 | 
	
		
			
				|  |  | +        return sums;
 | 
	
		
			
				|  |  |      }
 | 
	
		
			
				|  |  |    }
 | 
	
		
			
				|  |  |  }
 |