templateList.vue 3.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143
  1. <!-- -->
  2. <template>
  3. <div class="m-container">
  4. <h2>
  5. <div class="squrt"></div>
  6. 班级列表
  7. </h2>
  8. <div class="m-core">
  9. <save-form
  10. :inline="true"
  11. :model="searchForm"
  12. @submit="search"
  13. @reset="onReSet"
  14. >
  15. <el-form-item>
  16. <el-input
  17. v-model.trim="searchForm.search"
  18. clearable
  19. @keyup.enter.native="search"
  20. placeholder="请输入乐团编号"
  21. ></el-input>
  22. </el-form-item>
  23. <el-form-item>
  24. <el-input
  25. v-model.trim="searchForm.search"
  26. @keyup.enter.native="search"
  27. placeholder="请输入乐团编号"
  28. ></el-input>
  29. </el-form-item>
  30. <el-form-item>
  31. <el-button native-type="submit" type="primary">搜索</el-button>
  32. <el-button native-type="reset" type="danger">重置</el-button>
  33. </el-form-item>
  34. </save-form>
  35. <div class="tableWrap">
  36. <el-table
  37. style="width: 100%"
  38. :header-cell-style="{ background: '#EDEEF0', color: '#444' }"
  39. :data="tableList"
  40. >
  41. <el-table-column
  42. align="center"
  43. prop="studentId"
  44. label="代理商编号"
  45. ></el-table-column>
  46. <el-table-column
  47. align="center"
  48. prop="studentId"
  49. label="代理商名称"
  50. ></el-table-column>
  51. <el-table-column
  52. align="center"
  53. prop="studentId"
  54. label="机构编号"
  55. ></el-table-column>
  56. <el-table-column
  57. align="center"
  58. prop="studentId"
  59. label="机构名称"
  60. ></el-table-column>
  61. <el-table-column
  62. align="center"
  63. prop="studentId"
  64. label="激活时间"
  65. ></el-table-column>
  66. <el-table-column
  67. align="center"
  68. prop="studentId"
  69. label="激活数量"
  70. ></el-table-column>
  71. <el-table-column
  72. align="center"
  73. prop="studentId"
  74. label="推荐人"
  75. ></el-table-column>
  76. </el-table>
  77. <pagination
  78. sync
  79. :total.sync="rules.total"
  80. :page.sync="rules.page"
  81. :limit.sync="rules.limit"
  82. :page-sizes="rules.page_size"
  83. @pagination="getList"
  84. />
  85. </div>
  86. </div>
  87. </div>
  88. </template>
  89. <script>
  90. import axios from "axios";
  91. import { getToken } from "@/utils/auth";
  92. import pagination from "@/components/Pagination/index";
  93. import load from "@/utils/loading";
  94. import { getTimes } from "@/utils";
  95. export default {
  96. components: { pagination },
  97. data() {
  98. return {
  99. searchForm: {
  100. search: null,
  101. },
  102. tableList: [],
  103. organList: [],
  104. rules: {
  105. // 分页规则
  106. limit: 10, // 限制显示条数
  107. page: 1, // 当前页
  108. total: 0, // 总条数
  109. page_size: [10, 20, 40, 50], // 选择限制显示条数
  110. },
  111. };
  112. },
  113. //生命周期 - 创建完成(可以访问当前this实例)
  114. created() {},
  115. //生命周期 - 挂载完成(可以访问DOM元素)
  116. mounted() {
  117. // 获取分部
  118. this.init();
  119. },
  120. methods: {
  121. init() {},
  122. getList() {
  123. let { timer, ...rest } = this.searchForm;
  124. let params = {
  125. ...rest,
  126. page: this.rules.page,
  127. rows: this.rules.limit,
  128. ...getTimes(timer, ["startTime", "endTime"]),
  129. };
  130. },
  131. search() {
  132. this.rules.page = 1;
  133. this.getList();
  134. },
  135. onReSet() {},
  136. },
  137. };
  138. </script>
  139. <style lang='scss' scoped>
  140. </style>