courseInfo1.vue 3.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106
  1. <template>
  2. <div class='courseInfo'>
  3. <div class="tableWrap tableMargin">
  4. <el-table :data='teamList'
  5. :header-cell-style="{background:'#EDEEF0',color:'#444'}">
  6. <el-table-column label="VIP编号" prop="vipClassId">
  7. </el-table-column>
  8. <el-table-column label="VIP课名称" prop="vipClassName">
  9. </el-table-column>
  10. <el-table-column label="VIP课状态">
  11. <template slot-scope="scope">
  12. {{ scope.row.status | coursesStatus }}
  13. </template>
  14. </el-table-column>
  15. <el-table-column label="班级人数" prop="studentNum">
  16. </el-table-column>
  17. <el-table-column label="课程单价">
  18. <template slot-scope="scope">
  19. 线上:{{ scope.row.onlineClassesUnitPrice }} <br />
  20. 线下:{{ scope.row.offlineClassesUnitPrice }}
  21. </template>
  22. </el-table-column>
  23. <el-table-column label="活动方案" prop="activityName">
  24. </el-table-column>
  25. <el-table-column label="剩余课时">
  26. <template slot-scope="scope">
  27. {{ scope.row.totalClassTimes - scope.row.currentClassTimes }}
  28. </template>
  29. </el-table-column>
  30. <el-table-column label="月均消耗" prop="monthAvg">
  31. </el-table-column>
  32. <el-table-column label="开课时间">
  33. <template slot-scope="scope">
  34. {{ scope.row.paymentExpireDate | formatTimer }}
  35. </template>
  36. </el-table-column>
  37. <el-table-column label="截止时间">
  38. <template slot-scope="scope">
  39. {{ scope.row.coursesExpireDate | formatTimer }}
  40. </template>
  41. </el-table-column>
  42. <el-table-column label="申请时间">
  43. <template slot-scope="scope">
  44. {{ scope.row.createDate | formatTimer }}
  45. </template>
  46. </el-table-column>
  47. </el-table>
  48. <pagination :total="pageInfo.total"
  49. :page.sync="pageInfo.page"
  50. :limit.sync="pageInfo.limit"
  51. :page-sizes="pageInfo.page_size"
  52. @pagination="getList" />
  53. </div>
  54. </div>
  55. </template>
  56. <script>
  57. import { getTeacherVipClass } from '@/api/teacherManager'
  58. import pagination from '@/components/Pagination/index'
  59. import store from '@/store'
  60. export default {
  61. components: {
  62. pagination
  63. },
  64. data () {
  65. return {
  66. teamList: [],
  67. organId: store.getters.organ,
  68. teacherId: this.$route.query.teacherId,
  69. pageInfo: {
  70. // 分页规则
  71. limit: 10, // 限制显示条数
  72. page: 1, // 当前页
  73. total: 1, // 总条数
  74. page_size: [10, 20, 40, 50] // 选择限制显示条数
  75. }
  76. }
  77. },
  78. mounted() {
  79. this.getList()
  80. },
  81. methods: {
  82. getList() {
  83. getTeacherVipClass({
  84. rows: this.pageInfo.limit,
  85. page: this.pageInfo.page,
  86. teacherId: this.teacherId
  87. }).then(res => {
  88. if(res.code == 200) {
  89. this.teamList = res.data.rows
  90. this.pageInfo.total = res.data.total
  91. }
  92. })
  93. }
  94. }
  95. }
  96. </script>
  97. <style lang="scss" scope>
  98. .courseInfo {
  99. h4 {
  100. margin-bottom: 20px;
  101. }
  102. .tableMargin {
  103. margin-top: 20px;
  104. }
  105. }
  106. </style>