templateList.vue 2.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899
  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 :inline="true" :model="searchForm" @submit="search" @reset='onReSet'>
  10. <el-form-item>
  11. <el-input
  12. v-model.trim="searchForm.search"
  13. clearable
  14. @keyup.enter.native="search"
  15. placeholder='请输入乐团编号'
  16. ></el-input>
  17. </el-form-item>
  18. <el-form-item>
  19. <el-input
  20. v-model.trim="searchForm.search"
  21. @keyup.enter.native="search"
  22. placeholder='请输入乐团编号'
  23. ></el-input>
  24. </el-form-item>
  25. <el-form-item>
  26. <el-button native-type="submit" type="primary">搜索</el-button>
  27. <el-button native-type="reset" type="danger">重置</el-button>
  28. </el-form-item>
  29. </save-form>
  30. <div class="tableWrap">
  31. <el-table
  32. style="width: 100%"
  33. :header-cell-style="{ background: '#EDEEF0', color: '#444' }"
  34. :data="tableList"
  35. >
  36. <el-table-column
  37. align="center"
  38. prop="studentId"
  39. label="分部"
  40. ></el-table-column>
  41. </el-table>
  42. <pagination
  43. sync
  44. :total.sync="rules.total"
  45. :page.sync="rules.page"
  46. :limit.sync="rules.limit"
  47. :page-sizes="rules.page_size"
  48. @pagination="getList"
  49. />
  50. </div>
  51. </div>
  52. </div>
  53. </template>
  54. <script>
  55. import axios from "axios";
  56. import { getToken } from "@/utils/auth";
  57. import pagination from "@/components/Pagination/index";
  58. import load from "@/utils/loading";
  59. export default {
  60. components: { pagination },
  61. data() {
  62. return {
  63. searchForm: {
  64. search: null,
  65. },
  66. tableList: [],
  67. organList: [],
  68. rules: {
  69. // 分页规则
  70. limit: 10, // 限制显示条数
  71. page: 1, // 当前页
  72. total: 0, // 总条数
  73. page_size: [10, 20, 40, 50], // 选择限制显示条数
  74. },
  75. };
  76. },
  77. //生命周期 - 创建完成(可以访问当前this实例)
  78. created() {},
  79. //生命周期 - 挂载完成(可以访问DOM元素)
  80. mounted() {
  81. // 获取分部
  82. this.init();
  83. },
  84. methods: {
  85. init() {},
  86. getList() {},
  87. search(){
  88. this.rules.page = 1;
  89. this.getList()
  90. },
  91. onReSet(){},
  92. },
  93. };
  94. </script>
  95. <style lang='scss' scoped>
  96. </style>