pay-items.vue 5.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160
  1. <template>
  2. <div>
  3. <el-table :data="list" :header-cell-style="{ background: '#EDEEF0', color: '#444' }">
  4. <el-table-column
  5. align="center"
  6. prop="batchNo"
  7. width="200"
  8. label="订单编号"
  9. ></el-table-column>
  10. <el-table-column align="center" prop="paymentType" label="缴费类型">
  11. <template slot-scope="scope">
  12. <div>
  13. {{ scope.row.paymentType | userPaymentTypeFormat }}
  14. </div>
  15. </template>
  16. </el-table-column>
  17. <el-table-column
  18. align="center"
  19. prop="expectNum"
  20. width="200"
  21. label="缴费人数(预计/实际)"
  22. >
  23. <template slot-scope="scope">
  24. <div>{{ scope.row.expectNum }}/{{ scope.row.actualNum }}</div>
  25. </template>
  26. </el-table-column>
  27. <el-table-column align="center" prop="paymentPattern" label="缴费方式">
  28. <template slot-scope="scope">
  29. <div>
  30. {{ scope.row.paymentPattern | teamPayStatus }}
  31. </div>
  32. </template>
  33. </el-table-column>
  34. <el-table-column
  35. align="center"
  36. prop="paymentValidStartDate"
  37. width="200"
  38. label="缴费有效期"
  39. >
  40. <template slot-scope="scope">
  41. <div>
  42. {{ scope.row.paymentValidStartDate | formatTimer }} ~
  43. {{ scope.row.paymentValidEndDate | formatTimer }}
  44. </div>
  45. </template>
  46. </el-table-column>
  47. <el-table-column align="center" prop="status" label="缴费状态">
  48. <template slot-scope="scope">
  49. <div>
  50. {{ scope.row.status | payTypeStatus }}
  51. </div>
  52. </template>
  53. </el-table-column>
  54. <el-table-column align="center" prop="memo" label="备注"></el-table-column>
  55. <el-table-column label="操作" fixed="right" min-width="260px">
  56. <template slot-scope="scope">
  57. <div>
  58. <el-button
  59. type="text"
  60. @click="toDetail(scope.row)"
  61. v-permission="'musicGroupPaymentCalender/auditListDetail'"
  62. >查看</el-button
  63. >
  64. <el-button
  65. type="text"
  66. @click="$listeners.openChioseStudent(scope.row)"
  67. v-if="
  68. scope.row.status != 'REJECT' &&
  69. scope.row.status != 'AUDITING' &&
  70. teamStatus &&
  71. scope.row.paymentType != 'MUSIC_APPLY' &&
  72. scope.row.paymentType != 'ADD_STUDENT'
  73. "
  74. v-permission="'musicGroupPaymentCalenderDetail/batchAdd'"
  75. >添加学员</el-button
  76. >
  77. <el-button
  78. type="text"
  79. v-if="scope.row.status == 'REJECT' && teamStatus"
  80. v-permission="'musicGroupPaymentCalender/update'"
  81. @click="$listeners.resetPay(scope.row)"
  82. >修改</el-button
  83. >
  84. <el-button
  85. type="text"
  86. v-permission="'musicGroupPaymentCalender/makesureSchoolePaid'"
  87. v-if="scope.row.status == 'OPEN' && teamStatus == 'resetTeam'"
  88. @click="$listeners.commmitGetMoney(scope.row)"
  89. >确认收款</el-button
  90. >
  91. <el-button type="text"
  92. v-if="!isNewGropu&&teamStatus&&scope.row.paymentType!='MUSIC_APPLY'&&payUserType === 'STUDENT'"
  93. @click="$listeners.onCreateQRCode(scope.row)">续费二维码</el-button>
  94. <!-- <el-button type="text" v-if="!isNewGropu" @click="onCreateQRCode(scope.row)">续费二维码</el-button> -->
  95. </div>
  96. </template>
  97. </el-table-column>
  98. </el-table>
  99. <pagination :total="rules.total"
  100. :page.sync="rules.page"
  101. :limit.sync="rules.limit"
  102. :page-sizes="rules.page_size"
  103. @pagination="getList" />
  104. <div slot="footer"
  105. class="dialog-footer">
  106. <el-button @click="$listeners.close">取 消</el-button>
  107. </div>
  108. </div>
  109. </template>
  110. <script>
  111. import { addMusicGroupPaymentCalender, getMusicGroupPaymentCalender, resetMusicGroupPaymentCalender, delMusicGroupPaymentCalender, findMusicGroupSubjectInfo } from "@/api/buildTeam";
  112. import loading from '@/utils/loading'
  113. import pagination from "@/components/Pagination/index";
  114. export default {
  115. props: ['batchNo', 'teamStatus', 'teamType', 'payUserType', 'isNewGropu'],
  116. components: {
  117. pagination
  118. },
  119. data() {
  120. return {
  121. list: [],
  122. rules: {
  123. // 分页规则
  124. limit: 10, // 限制显示条数
  125. page: 1, // 当前页
  126. total: 0, // 总条数
  127. page_size: [10, 20, 40, 50], // 选择限制显示条数
  128. },
  129. }
  130. },
  131. mounted() {
  132. this.getList()
  133. },
  134. methods: {
  135. async getList() {
  136. try {
  137. const res = await getMusicGroupPaymentCalender({
  138. batchNo: this.batchNo,
  139. page: '1',
  140. rows: 10,
  141. })
  142. this.list = res.data.rows
  143. } catch (error) {}
  144. },
  145. toDetail(row) {
  146. this.$listeners.close()
  147. this.$nextTick(() => {
  148. this.$listeners.lookDetail(row)
  149. })
  150. }
  151. }
  152. };
  153. </script>
  154. <style lang="less" scoped>
  155. .dialog-footer {
  156. margin-top: 20px;
  157. display: block;
  158. text-align: right;
  159. }
  160. </style>