|
|
@@ -8,10 +8,10 @@
|
|
|
</h2>
|
|
|
<div class="btnList">
|
|
|
<div class='newBand close'>停止乐团</div>
|
|
|
- <div class='newBand'
|
|
|
+ <div class='newBand' @click="paymentStatus = true"
|
|
|
v-if="status=='APPLY'">开始缴费</div>
|
|
|
- <div class='newBand'
|
|
|
- v-if="status=='APPLY'">允许缴费</div>
|
|
|
+ <div class='newBand' @click="onCreateQRCode"
|
|
|
+ v-if="status=='APPLY'">生成二维码</div>
|
|
|
<div class='newBand'
|
|
|
v-if="status=='PAY'">确认开团</div>
|
|
|
<div class='newBand'
|
|
|
@@ -72,8 +72,13 @@
|
|
|
</el-table>
|
|
|
</div>
|
|
|
<div class="right">
|
|
|
- <el-table :data='rightList'
|
|
|
- :header-cell-style="{background:'#EDEEF0',color:'#444'}">
|
|
|
+ <el-table :data='rightList' ref="multipleTable"
|
|
|
+ :header-cell-style="{background:'#EDEEF0',color:'#444'}"
|
|
|
+ @selection-change="handleSelectionChange">
|
|
|
+ <el-table-column
|
|
|
+ type="selection"
|
|
|
+ width="55">
|
|
|
+ </el-table-column>
|
|
|
<el-table-column label="学员姓名"
|
|
|
prop="studentName"
|
|
|
align='center'>
|
|
|
@@ -120,7 +125,7 @@
|
|
|
prop="parentsPhone"
|
|
|
align='center'>
|
|
|
</el-table-column>
|
|
|
- <el-table-column label="学员状态"
|
|
|
+ <el-table-column label="学员状态" v-if='status == "PAY"'
|
|
|
prop="paymentStatus"
|
|
|
align='center'>
|
|
|
<template slot-scope="scope">
|
|
|
@@ -129,18 +134,21 @@
|
|
|
</div>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
- <el-table-column label="备注"
|
|
|
- v-if='status == "APPLY"'
|
|
|
- prop="remark"
|
|
|
- align='center'>
|
|
|
- </el-table-column>
|
|
|
- <!-- remark -->
|
|
|
<el-table-column label="操作"
|
|
|
align='center'>
|
|
|
<template slot-scope="scope">
|
|
|
<div>
|
|
|
<el-button type='text'
|
|
|
@click='resetSubject(scope.row)'>修改专业</el-button>
|
|
|
+ <!-- APPLY -->
|
|
|
+ <el-popover v-if='status == "APPLY" || scope.row.remark'
|
|
|
+ placement="top-start"
|
|
|
+ title="备注"
|
|
|
+ width="200"
|
|
|
+ trigger="hover"
|
|
|
+ :content="scope.row.remark">
|
|
|
+ <el-button type="text" slot="reference">备注</el-button>
|
|
|
+ </el-popover>
|
|
|
<!-- PAY -->
|
|
|
<el-button type='text'
|
|
|
v-if='status == "PAY"&&scope.row.paymentStatus==1'
|
|
|
@@ -149,6 +157,11 @@
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
</el-table>
|
|
|
+ <div style="margin-top: 10px; margin-bottom: 10px;" v-if="status=='APPLY'">
|
|
|
+ <el-button @click="onSelectAll">全选/取消</el-button>
|
|
|
+ <el-button style="background-color: #14928a;border: 1px solid #14928a;" @click="onPartPayment" type="primary">提前缴费</el-button>
|
|
|
+ <!-- <div class='newBand' v-if="status=='APPLY'">允许缴费</div> -->
|
|
|
+ </div>
|
|
|
<pagination :total="rules.total"
|
|
|
:page.sync="rules.page"
|
|
|
:limit.sync="rules.limit"
|
|
|
@@ -173,8 +186,7 @@
|
|
|
<div slot="footer"
|
|
|
class="dialog-footer">
|
|
|
<el-button @click="subjectVisible = false">取 消</el-button>
|
|
|
- <el-button type="primary"
|
|
|
- @click="okReset">确 定</el-button>
|
|
|
+ <el-button type="primary" @click="okReset">确 定</el-button>
|
|
|
</div>
|
|
|
</el-dialog>
|
|
|
|
|
|
@@ -231,18 +243,47 @@
|
|
|
@click="orderVisible = false">确 定</el-button>
|
|
|
</div>
|
|
|
</el-dialog>
|
|
|
+
|
|
|
+ <el-dialog title="开始缴费"
|
|
|
+ :visible.sync="paymentStatus"
|
|
|
+ width="400px">
|
|
|
+ <el-form ref="paymentForm" :model="paymentForm" label-position="top" :rules="paymentRules">
|
|
|
+ <el-form-item label="请设置缴费截止日期" prop="paymentExpireDate">
|
|
|
+ <el-date-picker
|
|
|
+ v-model="paymentForm.paymentExpireDate"
|
|
|
+ type="date"
|
|
|
+ style="width: 100%"
|
|
|
+ placeholder="选择日期">
|
|
|
+ </el-date-picker>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ <div slot="footer" class="dialog-footer">
|
|
|
+ <el-button @click="paymentStatus = false">取 消</el-button>
|
|
|
+ <el-button type="primary" @click="onStartPayment('paymentForm')">确 定</el-button>
|
|
|
+ </div>
|
|
|
+ </el-dialog>
|
|
|
+ <el-dialog title="报名二维码"
|
|
|
+ :visible.sync="qrcodeStatus"
|
|
|
+ width="400px">
|
|
|
+ <div id="qrcode" class="qrcode code"
|
|
|
+ ref="qrCodeUrl"></div>
|
|
|
+ <p class="code-url" v-if="codeUrl">{{ codeUrl }}</p>
|
|
|
+ </el-dialog>
|
|
|
</div>
|
|
|
</template>
|
|
|
<script>
|
|
|
import pagination from '@/components/Pagination/index'
|
|
|
-import { getTeamRecruit, getintoClass, getStudentList, findSound } from '@/api/buildTeam'
|
|
|
+import { getTeamRecruit, getintoClass, getStudentList, findSound, musicGroupOpenPay, openPayment } from '@/api/buildTeam'
|
|
|
import { resetStudentSubject, getStudentFeeDetail } from '@/api/studentManager'
|
|
|
+import QRCode from 'qrcodejs2'
|
|
|
export default {
|
|
|
components: {
|
|
|
pagination
|
|
|
},
|
|
|
data () {
|
|
|
return {
|
|
|
+ multipleSelection: [], //
|
|
|
+
|
|
|
subjectVisible: false,
|
|
|
orderVisible: false,
|
|
|
leftList: [],
|
|
|
@@ -276,7 +317,18 @@ export default {
|
|
|
axePrice: '',
|
|
|
others: '',
|
|
|
othersPrice: ''
|
|
|
- }
|
|
|
+ },
|
|
|
+ paymentStatus: false,
|
|
|
+ paymentForm: {
|
|
|
+ paymentExpireDate: null,
|
|
|
+ },
|
|
|
+ paymentRules: {
|
|
|
+ paymentExpireDate: [{ required: true, message: '请设置缴费截止日期', trigger: 'blur' }]
|
|
|
+ },
|
|
|
+ qrcodeStatus: false, // 生成二维码
|
|
|
+ qrcodes: true,
|
|
|
+ qrcode: null,
|
|
|
+ codeUrl: null
|
|
|
}
|
|
|
},
|
|
|
created () {
|
|
|
@@ -302,7 +354,7 @@ export default {
|
|
|
}
|
|
|
})
|
|
|
// 通过乐团id获取乐团学生列表
|
|
|
- this.getList();
|
|
|
+ this.getList()
|
|
|
},
|
|
|
methods: {
|
|
|
getList () {
|
|
|
@@ -319,6 +371,88 @@ export default {
|
|
|
}
|
|
|
})
|
|
|
},
|
|
|
+ onStartPayment(formName) { // 开启缴费
|
|
|
+ this.$refs[formName].validate((valid) => {
|
|
|
+ if (valid) {
|
|
|
+ musicGroupOpenPay({
|
|
|
+ musicGroupId: this.id,
|
|
|
+ expireDate: this.paymentForm.paymentExpireDate
|
|
|
+ }).then(res => {
|
|
|
+ let result = res.data
|
|
|
+ console.log(result)
|
|
|
+ if(result.code == 200) {
|
|
|
+ this.$message({
|
|
|
+ type: 'success',
|
|
|
+ message: '开启成功'
|
|
|
+ })
|
|
|
+ this.$router.push({
|
|
|
+ path: '/business/signupList',
|
|
|
+ query: {
|
|
|
+ status: 'PAY',
|
|
|
+ name: this.$route.query.name
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ })
|
|
|
+ } else {
|
|
|
+ console.log('error submit!!');
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+ })
|
|
|
+ // this.id
|
|
|
+
|
|
|
+ },
|
|
|
+ onSelectAll() { // 选中全部
|
|
|
+ this.$refs.multipleTable.toggleAllSelection()
|
|
|
+ },
|
|
|
+ onPartPayment() { // 部分缴费
|
|
|
+ let selection = this.multipleSelection
|
|
|
+ if(selection.length <= 0) {
|
|
|
+ this.$message({
|
|
|
+ message: '您还没有选择学生',
|
|
|
+ type: 'warning'
|
|
|
+ })
|
|
|
+ return false
|
|
|
+ }
|
|
|
+ let studentIds = []
|
|
|
+ selection.forEach(item => {
|
|
|
+ studentIds.push(item.studentId)
|
|
|
+ })
|
|
|
+
|
|
|
+ openPayment({
|
|
|
+ id: studentIds.join(',')
|
|
|
+ }).then(res => {
|
|
|
+ if(res.code == 200) {
|
|
|
+ this.$message({
|
|
|
+ message: '开启成功',
|
|
|
+ type: 'success'
|
|
|
+ })
|
|
|
+ } else {
|
|
|
+ this.$message.error(res.msg)
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ onCreateQRCode() { // 生成报名二维码
|
|
|
+ this.qrcodeStatus = true
|
|
|
+ if(this.qrcodes) {
|
|
|
+ this.qrcodes = false
|
|
|
+ setTimeout(() => {
|
|
|
+ this.qrcode = new QRCode('qrcode', {
|
|
|
+ // text: 'http://www.baidu.com',
|
|
|
+ width: 300,
|
|
|
+ height: 300,
|
|
|
+ colorDark: '#000000',
|
|
|
+ colorLight: '#ffffff',
|
|
|
+ correctLevel: QRCode.CorrectLevel.H
|
|
|
+ })
|
|
|
+ this.qrcode.makeCode('http://www.baidu.com')
|
|
|
+ this.codeUrl = 'http://www.baidu.com'
|
|
|
+ }, 500)
|
|
|
+ }
|
|
|
+ },
|
|
|
+ handleSelectionChange(val) {
|
|
|
+ this.multipleSelection = val;
|
|
|
+ },
|
|
|
// 修改专业
|
|
|
resetSubject (row) {
|
|
|
this.activeId = row.studentId
|
|
|
@@ -466,4 +600,16 @@ export default {
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
+.qrcode {
|
|
|
+ img {
|
|
|
+ width: 300px;
|
|
|
+ height: 300px;
|
|
|
+ margin: 0 auto;
|
|
|
+ }
|
|
|
+}
|
|
|
+.code-url {
|
|
|
+ font-size: 18px;
|
|
|
+ text-align: center;
|
|
|
+ padding-top: 15px;
|
|
|
+}
|
|
|
</style>
|
