|
|
@@ -5,6 +5,12 @@
|
|
|
<div id="first-left">
|
|
|
<div id="logo"></div>
|
|
|
<div class="tag">订单管理</div>
|
|
|
+ <div>
|
|
|
+ <el-select v-model="formInline.value" class="selectDate" placeholder="请选择" @change="selectTime">
|
|
|
+ <el-option v-for="item in formInline.options" :key="item.value" :label="item.label" :value="item.value">
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
<div id="first-right">
|
|
|
<el-button type="primary" class="first-right-btn" @click="downLoadFile">导出已缴表单</el-button>
|
|
|
@@ -15,9 +21,9 @@
|
|
|
<el-row>
|
|
|
<el-col :span="24" class="second-row">
|
|
|
<div class="total_balance">总金额:<span class="all-money">{{all_money}}</span> 元</div>
|
|
|
- <el-form :inline="true" :model="formInline" class="demo-form-inline">
|
|
|
- <el-form-item label="关键字:" class="shuibiaoId">
|
|
|
- <el-input v-model="formInline.user" placeholder="请输入订单号或者班级"></el-input>
|
|
|
+ <el-form :inline="true" class="demo-form-inline">
|
|
|
+ <el-form-item label="关键字:" class="order">
|
|
|
+ <el-input v-model="selectOrder" placeholder="请输入订单号或者班级"></el-input>
|
|
|
</el-form-item>
|
|
|
<el-form-item>
|
|
|
<el-button type="primary" @click="onSubmit">查找</el-button>
|
|
|
@@ -27,8 +33,7 @@
|
|
|
</el-row>
|
|
|
<el-row>
|
|
|
<el-col :span="24" class="third-row">
|
|
|
- <el-table ref="multipleTable" :data="tableData" tooltip-effect="dark" style="width: 100%"
|
|
|
- @selection-change="handleSelectionChange" highlight-current-row>
|
|
|
+ <el-table ref="multipleTable" :data="tableData" tooltip-effect="dark" style="width: 100%" highlight-current-row>
|
|
|
<el-table-column label="订单号" width="220" align="center">
|
|
|
<template slot-scope="scope">{{ scope.row.order }}</template>
|
|
|
</el-table-column>
|
|
|
@@ -46,11 +51,39 @@
|
|
|
</el-table>
|
|
|
<div style="margin-top: 20px" class="table-footer">
|
|
|
<div class="pages">
|
|
|
- <el-pagination layout="prev, pager, next" :total="1"></el-pagination>
|
|
|
+ <el-pagination layout="prev, pager, next" :page-size="pageSize" :total="totalCount"
|
|
|
+ @current-change="handleCurrentChange"></el-pagination>
|
|
|
</div>
|
|
|
</div>
|
|
|
</el-col>
|
|
|
</el-row>
|
|
|
+ <el-row>
|
|
|
+ <el-col :span="24" class="forth-row">
|
|
|
+ <!-- 编辑对话框 -->
|
|
|
+ <el-dialog v-if="selectM" title="请选择月份" :visible.sync="editdialogFormVisible" width="400px" top="0vh"
|
|
|
+ class="my-dialog">
|
|
|
+ <div id="month">
|
|
|
+ <el-date-picker v-model="monthValue" type="month" placeholder="选择月" value-format="yyyy-MM">
|
|
|
+ </el-date-picker>
|
|
|
+ <div class="last-row">
|
|
|
+ <el-button @click="selectMonth" class="submitBtn">确定</el-button>
|
|
|
+ <el-button @click="selectLogout" class="submitBtn">取消</el-button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </el-dialog>
|
|
|
+ <el-dialog v-if="!selectM" title="请选择日期" :visible.sync="editdialogFormVisible" width="400px" top="0vh"
|
|
|
+ class="my-dialog">
|
|
|
+ <div id="month">
|
|
|
+ <el-date-picker v-model="dayValue" type="date" placeholder="选择日期" value-format="yyyy-MM-dd">
|
|
|
+ </el-date-picker>
|
|
|
+ <div class="last-row">
|
|
|
+ <el-button @click="selectDay" class="submitBtn">确定</el-button>
|
|
|
+ <el-button @click="selectLogout" class="submitBtn">取消</el-button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </el-dialog>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
@@ -58,37 +91,108 @@
|
|
|
export default {
|
|
|
data() {
|
|
|
return {
|
|
|
- editdialogFormVisible: false,
|
|
|
- delDialogVisible: false,
|
|
|
- form: {
|
|
|
- id: 'KB580002652',
|
|
|
- drom: '18',
|
|
|
- room: '118'
|
|
|
- },
|
|
|
- formLabelWidth: '120px',
|
|
|
+ editdialogFormVisible: false, //月份
|
|
|
+ selectM: true,//显示月份
|
|
|
formInline: {
|
|
|
user: '',
|
|
|
options: [{
|
|
|
- value: '选项1',
|
|
|
+ value: 'all',
|
|
|
label: '全部'
|
|
|
}, {
|
|
|
- value: '选项2',
|
|
|
- label: '黄金糕'
|
|
|
+ value: 'month',
|
|
|
+ label: '月'
|
|
|
+ }, {
|
|
|
+ value: 'day',
|
|
|
+ label: '日'
|
|
|
}],
|
|
|
- value: '选项1'
|
|
|
+ value: ''
|
|
|
},
|
|
|
- tableData: [],
|
|
|
- multipleSelection: [],
|
|
|
- user_token: '',
|
|
|
- all_money: 0,
|
|
|
- // down_url: 'http://192.168.161.230:9999/tuitionpayment/payorder/downloadResult', //测试
|
|
|
- // url: 'http://192.168.161.230:9999/tuitionpayment/payorder/list', //测试
|
|
|
- down_url: 'https://jtishfw.ncjti.edu.cn/jiaofei/backendApi/tuitionpayment/payorder/downloadResult',
|
|
|
- url: 'https://jtishfw.ncjti.edu.cn/jiaofei/backendApi/tuitionpayment/payorder/list',
|
|
|
- // font_color: [true,false,false,false,false,false,false,false]
|
|
|
+ tableData: [], //订单数据
|
|
|
+ user_token: '', //token
|
|
|
+ all_money: 0, //总钱数
|
|
|
+ pageSize: 10, //每页订单数目
|
|
|
+ totalCount: 0, //总订单数
|
|
|
+ selectOrder: '', //查找订单号或姓名
|
|
|
+ monthValue: '', //选择的月份
|
|
|
+ dayValue: '', //选择的日期
|
|
|
}
|
|
|
},
|
|
|
+ created: function() {
|
|
|
+ this.user_info = JSON.parse(sessionStorage.getItem('usr_info'))
|
|
|
+ this.user_token = this.user_info.token
|
|
|
+ this.getTableData(this.$Api.orderList)
|
|
|
+ },
|
|
|
methods: {
|
|
|
+ //分页
|
|
|
+ handleCurrentChange(val) {
|
|
|
+ this.currentPage = val;
|
|
|
+ this.tableData = []
|
|
|
+ this.getTableData(this.$Api.orderList, val)
|
|
|
+ },
|
|
|
+ //获取订单数据
|
|
|
+ getTableData(url, index) {
|
|
|
+ this.$axios.get(url + '?' + this.$qs.stringify({
|
|
|
+ 'curPage': index,
|
|
|
+ 'pageSize': this.pageSize
|
|
|
+ }), {
|
|
|
+ headers: {
|
|
|
+ 'Content-Type': 'application/x-www-form-urlencoded;charset=utf-8',
|
|
|
+ 'Author': 'codingliang',
|
|
|
+ 'admin_token': this.user_token
|
|
|
+ }
|
|
|
+ }).then(res => {
|
|
|
+ // console.log(res)
|
|
|
+ this.totalCount = res.data.data.page.totalCount
|
|
|
+ for (var i = 0; i < res.data.data.page.list.length; i++) {
|
|
|
+ var list = {}
|
|
|
+ list.order = res.data.data.page.list[i].orderNo
|
|
|
+ list.id = res.data.data.page.list[i].payerIdentify
|
|
|
+ list.stuName = res.data.data.page.list[i].studentName
|
|
|
+ list.class = res.data.data.page.list[i].className
|
|
|
+ list.money = res.data.data.page.list[i].orderAmount
|
|
|
+
|
|
|
+ this.all_money += list.money
|
|
|
+
|
|
|
+ list.time = res.data.data.page.list[i].finishTime
|
|
|
+ if (res.data.data.page.list[i].status == 2) {
|
|
|
+ list.state = '支付成功'
|
|
|
+ } else {
|
|
|
+ list.state = '支付失败'
|
|
|
+ }
|
|
|
+ this.tableData.push(list)
|
|
|
+ }
|
|
|
+ // console.log(this.tableData)
|
|
|
+ }).catch(err => {
|
|
|
+ console.log(err)
|
|
|
+ })
|
|
|
+ },
|
|
|
+ //选择时间
|
|
|
+ selectTime(val) {
|
|
|
+ if (val == 'month') {
|
|
|
+ this.editdialogFormVisible = true
|
|
|
+ this.selectM = true
|
|
|
+ } else if (val == 'day') {
|
|
|
+ this.editdialogFormVisible = true
|
|
|
+ this.selectM = false
|
|
|
+ }
|
|
|
+ },
|
|
|
+ //选择月份
|
|
|
+ selectMonth(val) {
|
|
|
+ console.log(this.monthValue)
|
|
|
+ this.formInline.value = this.monthValue
|
|
|
+ this.editdialogFormVisible = false
|
|
|
+ },
|
|
|
+ //选择日期
|
|
|
+ selectDay() {
|
|
|
+ console.log(this.dayValue)
|
|
|
+ this.formInline.value = this.dayValue
|
|
|
+ this.editdialogFormVisible = false
|
|
|
+ },
|
|
|
+ //退出选择
|
|
|
+ selectLogout() {
|
|
|
+ this.editdialogFormVisible = false
|
|
|
+ this.formInline.value = '请重新选择'
|
|
|
+ },
|
|
|
onSubmit() {
|
|
|
console.log('submit!')
|
|
|
},
|
|
|
@@ -107,19 +211,9 @@
|
|
|
this.$refs.multipleTable.clearSelection()
|
|
|
}
|
|
|
},
|
|
|
- handleSelectionChange(val) {
|
|
|
- this.multipleSelection = val
|
|
|
- },
|
|
|
- handleEdit(index, row) {
|
|
|
- this.editdialogFormVisible = true
|
|
|
- console.log(index, row)
|
|
|
- },
|
|
|
- handleDelete(index, row) {
|
|
|
- this.delDialogVisible = true
|
|
|
- console.log(index, row)
|
|
|
- },
|
|
|
+ //下载文件
|
|
|
downLoadFile() {
|
|
|
- this.$axios.get(this.down_url, {
|
|
|
+ this.$axios.get(this.$Api.orderDownload, {
|
|
|
headers: {
|
|
|
'Content-Type': 'application/x-www-form-urlencoded;charset=utf-8',
|
|
|
'Author': 'codingliang',
|
|
|
@@ -133,7 +227,7 @@
|
|
|
console.log(err)
|
|
|
})
|
|
|
},
|
|
|
- //下载文件
|
|
|
+ //下载
|
|
|
download(data) {
|
|
|
if (!data) {
|
|
|
return
|
|
|
@@ -142,45 +236,12 @@
|
|
|
let link = document.createElement('a')
|
|
|
link.style.display = 'none'
|
|
|
link.href = url
|
|
|
- link.setAttribute('download', 'excel.xlsx')
|
|
|
+ link.setAttribute('download', '订单列表.xlsx')
|
|
|
document.body.appendChild(link)
|
|
|
link.click()
|
|
|
}
|
|
|
},
|
|
|
- created: function() {
|
|
|
- this.user_info = JSON.parse(sessionStorage.getItem('usr_info'))
|
|
|
- this.user_token = this.user_info.token
|
|
|
- this.$axios.get(this.url, {
|
|
|
- headers: {
|
|
|
- 'Content-Type': 'application/x-www-form-urlencoded;charset=utf-8',
|
|
|
- 'Author': 'codingliang',
|
|
|
- 'admin_token': this.user_token
|
|
|
- }
|
|
|
- }).then(res => {
|
|
|
- console.log(res)
|
|
|
- for (var i = 0; i < res.data.data.page.list.length; i++) {
|
|
|
- var list = {}
|
|
|
- list.order = res.data.data.page.list[i].orderNo
|
|
|
- list.id = res.data.data.page.list[i].payerIdentify
|
|
|
- list.stuName = res.data.data.page.list[i].studentName
|
|
|
- list.class = res.data.data.page.list[i].className
|
|
|
- list.money = res.data.data.page.list[i].orderAmount
|
|
|
-
|
|
|
- this.all_money += list.money
|
|
|
|
|
|
- list.time = res.data.data.page.list[i].finishTime
|
|
|
- if (res.data.data.page.list[i].status == 2) {
|
|
|
- list.state = '支付成功'
|
|
|
- } else {
|
|
|
- list.state = '支付失败'
|
|
|
- }
|
|
|
- this.tableData.push(list)
|
|
|
- }
|
|
|
- // console.log(this.tableData)
|
|
|
- }).catch(err => {
|
|
|
- console.log(err)
|
|
|
- })
|
|
|
- }
|
|
|
}
|
|
|
</script>
|
|
|
|