|
|
@@ -0,0 +1,381 @@
|
|
|
+<template>
|
|
|
+ <div class='container'>
|
|
|
+ <el-form :inline="true"
|
|
|
+ v-model="topForm">
|
|
|
+
|
|
|
+ <el-form-item label="支付时间">
|
|
|
+ <el-date-picker
|
|
|
+ v-model="paymentTime"
|
|
|
+ type="datetimerange"
|
|
|
+ :picker-options="pickerOptions"
|
|
|
+ range-separator="至"
|
|
|
+ format="yyyy-MM-dd"
|
|
|
+ value-format="yyyy-MM-dd"
|
|
|
+ start-placeholder="开始日期"
|
|
|
+ end-placeholder="结束日期"
|
|
|
+ align="right">
|
|
|
+ </el-date-picker>
|
|
|
+ </el-form-item>
|
|
|
+ <el-button type="primary"
|
|
|
+ icon="el-icon-search"
|
|
|
+ plain
|
|
|
+ @click="getstudentList">搜索</el-button>
|
|
|
+ <el-button type="success"
|
|
|
+ icon="el-icon-refresh"
|
|
|
+ plain
|
|
|
+ @click="resetStudentList">重置</el-button>
|
|
|
+ <el-button plain
|
|
|
+ @click="exportis">导出</el-button>
|
|
|
+ </el-form>
|
|
|
+ <div class="tableWrap">
|
|
|
+ <el-table :data='tableList'
|
|
|
+ id='tableid'
|
|
|
+ height="calc(100vh - 174px)"
|
|
|
+ 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="收款账户"
|
|
|
+ prop='account'></el-table-column>
|
|
|
+ <el-table-column align="center"
|
|
|
+ label="支付金额"
|
|
|
+ prop='amount'></el-table-column>
|
|
|
+ <el-table-column align="center"
|
|
|
+ label="到账时间"
|
|
|
+ prop='payTime'></el-table-column>
|
|
|
+ <el-table-column align="center"
|
|
|
+ label="课程费用"
|
|
|
+ prop='tuiFee'></el-table-column>
|
|
|
+ <el-table-column align="center"
|
|
|
+ label="商品"
|
|
|
+ prop="goodsFee"></el-table-column>
|
|
|
+ <el-table-column align="center"
|
|
|
+ label="教辅费用"
|
|
|
+ prop="sdFee"></el-table-column>
|
|
|
+ <el-table-column align="center"
|
|
|
+ label="专业"
|
|
|
+ prop="voicyPart"></el-table-column>
|
|
|
+ <el-table-column align="left"
|
|
|
+ label="单位/学校"
|
|
|
+ prop="poName"></el-table-column>
|
|
|
+ <el-table-column align="left"
|
|
|
+ label="备注"
|
|
|
+ width="300"
|
|
|
+ :formatter="filterRemark">
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ <div class="paginationWrap">
|
|
|
+ <el-pagination background
|
|
|
+ class="pagination"
|
|
|
+ layout="prev, pager, next"
|
|
|
+ :total="total"
|
|
|
+ :current-page.sync="currentPage"
|
|
|
+ :page-size.sync="rows"
|
|
|
+ @current-change="handleCurrentChange"></el-pagination>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+<script>
|
|
|
+import { orderListPage, getMusicTeams } from "@/api/table";
|
|
|
+import qs from "qs";
|
|
|
+import { scrollTo } from '@/utils/scroll-to'
|
|
|
+export default {
|
|
|
+ data () {
|
|
|
+ return {
|
|
|
+ pickerOptions: {
|
|
|
+ shortcuts: [{
|
|
|
+ text: '最近一周',
|
|
|
+ onClick(picker) {
|
|
|
+ const end = new Date();
|
|
|
+ const start = new Date();
|
|
|
+ start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
|
|
|
+ picker.$emit('pick', [start, end]);
|
|
|
+ }
|
|
|
+ }, {
|
|
|
+ text: '最近一个月',
|
|
|
+ onClick(picker) {
|
|
|
+ const end = new Date();
|
|
|
+ const start = new Date();
|
|
|
+ start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
|
|
|
+ picker.$emit('pick', [start, end]);
|
|
|
+ }
|
|
|
+ }, {
|
|
|
+ text: '最近三个月',
|
|
|
+ onClick(picker) {
|
|
|
+ const end = new Date();
|
|
|
+ const start = new Date();
|
|
|
+ start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
|
|
|
+ picker.$emit('pick', [start, end]);
|
|
|
+ }
|
|
|
+ }]
|
|
|
+ },
|
|
|
+ paymentTime: '',
|
|
|
+ topForm: {},
|
|
|
+ tableList: [],
|
|
|
+ rows: 20,
|
|
|
+ total: 0,
|
|
|
+ page: 1,
|
|
|
+ brancheList: [],// 分部列表
|
|
|
+ instrumentList: [], // 乐团列表
|
|
|
+ idTmr: '',
|
|
|
+ tableId: '',
|
|
|
+ props: {
|
|
|
+ value: 'value',
|
|
|
+ label: 'label',
|
|
|
+ children: 'children'
|
|
|
+ },//cascader 数据格式化
|
|
|
+ branchId: '',
|
|
|
+ classId: '',
|
|
|
+ account: this.$route.query.account // 财务唯一标识
|
|
|
+ }
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ currentPage: {
|
|
|
+ get () {
|
|
|
+ return this.page
|
|
|
+ },
|
|
|
+ set (val) {
|
|
|
+ this.$emit('update:page', val)
|
|
|
+ }
|
|
|
+ },
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ handleCurrentChange (val) {
|
|
|
+ this.page = val;
|
|
|
+ // this.rows = pageSize;
|
|
|
+ this.getstudentList();
|
|
|
+ },
|
|
|
+ getstudentList (rows, callBack) {
|
|
|
+ if(!this.account) {
|
|
|
+ this.$message.error('您没有权限')
|
|
|
+ return false
|
|
|
+ }
|
|
|
+ if(rows && typeof rows == 'number' ) {
|
|
|
+ console.log(rows)
|
|
|
+ this.rows = rows
|
|
|
+ } else {
|
|
|
+ this.rows = 20
|
|
|
+ }
|
|
|
+ let startTime = '', endTime = ''
|
|
|
+ if(this.paymentTime) {
|
|
|
+ startTime = this.paymentTime[0]
|
|
|
+ endTime = this.paymentTime[1]
|
|
|
+ }
|
|
|
+ let params = this.topForm
|
|
|
+ orderListPage(qs.stringify({
|
|
|
+ account: this.account,
|
|
|
+ page: this.page,
|
|
|
+ rows: this.rows,
|
|
|
+ branchId: params.team,
|
|
|
+ classId: params.instruments,
|
|
|
+ type: params.money,
|
|
|
+ startTime: startTime,
|
|
|
+ endTime: endTime})).then(res => {
|
|
|
+ this.tableList = res.data.rows;
|
|
|
+ this.total = res.data.total;
|
|
|
+ // 回调函数
|
|
|
+ if(callBack && typeof callBack == 'function') {
|
|
|
+ callBack()
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ resetStudentList () {
|
|
|
+ this.branchId = "";
|
|
|
+ this.classId = '';
|
|
|
+ this.topForm.money = "";
|
|
|
+ this.topForm.team = '';
|
|
|
+ this.topForm.instruments = '';
|
|
|
+ this.page = 1;
|
|
|
+ this.getstudentList();
|
|
|
+ },
|
|
|
+ filterRemark (val) {
|
|
|
+ let remark = val.remark ? val.remark : '';
|
|
|
+ let sdName = val.sdName ? val.sdName : '';
|
|
|
+ return remark + ' ' + sdName;
|
|
|
+ },
|
|
|
+ exportis () {
|
|
|
+ // this.topForm.money = "";
|
|
|
+ // this.topForm.team = '';
|
|
|
+ // this.topForm.instruments = '';
|
|
|
+ this.rows = 9999
|
|
|
+ this.page = 1
|
|
|
+ this.getstudentList(9999, () => {
|
|
|
+ setTimeout(() => {
|
|
|
+ this.method5('tableid');
|
|
|
+ }, 100);
|
|
|
+ })
|
|
|
+ // this.method5('tableid');
|
|
|
+ },
|
|
|
+
|
|
|
+ // 导出
|
|
|
+ getExplorer () {
|
|
|
+ var explorer = window.navigator.userAgent;
|
|
|
+ //ie
|
|
|
+ if (explorer.indexOf("MSIE") >= 0) {
|
|
|
+ return 'ie';
|
|
|
+ }
|
|
|
+ //firefox
|
|
|
+ else if (explorer.indexOf("Firefox") >= 0) {
|
|
|
+ return 'Firefox';
|
|
|
+ }
|
|
|
+ //Chrome
|
|
|
+ else if (explorer.indexOf("Chrome") >= 0) {
|
|
|
+ return 'Chrome';
|
|
|
+ }
|
|
|
+ //Opera
|
|
|
+ else if (explorer.indexOf("Opera") >= 0) {
|
|
|
+ return 'Opera';
|
|
|
+ }
|
|
|
+ //Safari
|
|
|
+ else if (explorer.indexOf("Safari") >= 0) {
|
|
|
+ return 'Safari';
|
|
|
+ }
|
|
|
+ },
|
|
|
+ method5 (tableid) {
|
|
|
+
|
|
|
+ if (this.getExplorer() == 'ie') {
|
|
|
+ var curTbl = document.getElementById(tableid);
|
|
|
+ var oXL = new ActiveXObject("Excel.Application");
|
|
|
+ var oWB = oXL.Workbooks.Add();
|
|
|
+ var xlsheet = oWB.Worksheets(1);
|
|
|
+ var sel = document.body.createTextRange();
|
|
|
+ sel.moveToElementText(curTbl);
|
|
|
+ sel.select();
|
|
|
+ sel.execCommand("Copy");
|
|
|
+ xlsheet.Paste();
|
|
|
+ oXL.Visible = true;
|
|
|
+ try {
|
|
|
+
|
|
|
+ var fname = oXL.Application.GetSaveAsFilename("哈哈哈.xls", "Excel Spreadsheets (*.xls), *.xls");
|
|
|
+ } catch (e) {
|
|
|
+ print("Nested catch caught " + e);
|
|
|
+ } finally {
|
|
|
+ oWB.SaveAs(fname);
|
|
|
+ oWB.Close(savechanges = false);
|
|
|
+ oXL.Quit();
|
|
|
+ oXL = null;
|
|
|
+ this.idTmr = window.setInterval("Cleanup();", 1);
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+ else {
|
|
|
+ this.tableToExcel();
|
|
|
+ }
|
|
|
+ },
|
|
|
+ Cleanup () {
|
|
|
+ window.clearInterval(this.idTmr);
|
|
|
+ this.CollectGarbage();
|
|
|
+ },
|
|
|
+ tableToExcel () {
|
|
|
+
|
|
|
+ (function () {
|
|
|
+ var uri = 'data:application/vnd.ms-excel;base64,',
|
|
|
+ template = '<html><head><meta charset="UTF-8"></head><body><table>{table}</table></body></html>',
|
|
|
+ base64 = function (s) { return window.btoa(unescape(encodeURIComponent(s))) },
|
|
|
+ format = function (s, c) {
|
|
|
+ return s.replace(/{(\w+)}/g,
|
|
|
+ function (m, p) { return c[p]; }) }
|
|
|
+ // table name
|
|
|
+ let table = document.getElementById('tableid')
|
|
|
+ // || name
|
|
|
+ var ctx = { worksheet: 'Worksheet', table: table.innerHTML }
|
|
|
+ window.location.href = uri + base64(format(template, ctx))
|
|
|
+ //
|
|
|
+ // return function () {
|
|
|
+
|
|
|
+
|
|
|
+ // }
|
|
|
+ })()
|
|
|
+ },
|
|
|
+ // 多选框选项卡
|
|
|
+ handleItemChange (val) {
|
|
|
+ // 发请求 获取分部下的乐团
|
|
|
+ if (!val) {
|
|
|
+ return false
|
|
|
+ }
|
|
|
+ getMusicTeams(qs.stringify({ branchId: val })).then(res => {
|
|
|
+ this.topForm.instruments = ''
|
|
|
+ // 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 || index === 9 || index === 10) {
|
|
|
+ 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;
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+</script>
|
|
|
+<style lang="scss">
|
|
|
+.container {
|
|
|
+ padding: 30px;
|
|
|
+ .paginationWrap {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: row;
|
|
|
+ justify-content: flex-end;
|
|
|
+ }
|
|
|
+ .pagination {
|
|
|
+ margin-top: 20px;
|
|
|
+ }
|
|
|
+}
|
|
|
+</style>
|
