fa88dd6d80dc507b904ae451749fc7e6d9b6bb18.svn-base 4.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136
  1. <!-- -->
  2. <template>
  3. <div>
  4. <el-dialog
  5. title="已签到人员"
  6. :before-close="closeDialog"
  7. :visible.sync="dialogFormVisible"
  8. width='30%'>
  9. <el-container>
  10. <el-main>
  11. <el-table
  12. :data="tableData"
  13. :height="ryTableHeight"
  14. stripe
  15. border
  16. style="width: 100%;margin-top:10px;">
  17. <el-table-column
  18. prop="name"
  19. show-overflow-tooltip
  20. label="姓名"
  21. width="130"
  22. >
  23. </el-table-column>
  24. <el-table-column
  25. prop="unit"
  26. show-overflow-tooltip
  27. label="单位">
  28. </el-table-column>
  29. <el-table-column
  30. prop="mbleNum"
  31. show-overflow-tooltip
  32. label="手机号"
  33. width="120">
  34. </el-table-column>
  35. </el-table>
  36. <el-pagination
  37. style="text-align:center;"
  38. @size-change="handleSizeChange"
  39. @current-change="handleCurrentChange"
  40. :current-page.sync="pageNum"
  41. :page-sizes="[10, 20, 30, 40, 50, 100]"
  42. :page-size="pageSize"
  43. small
  44. layout="prev, pager, next"
  45. :total="total">
  46. </el-pagination>
  47. </el-main>
  48. </el-container>
  49. </el-dialog>
  50. </div>
  51. </template>
  52. <script>
  53. //这里可以导入其他文件(比如:组件,工具js,第三方插件js,json文件,图片文件等等)
  54. //例如:import 《组件名称》 from '《组件路径》';
  55. import { getSginDetailsLists } from "../../api/meetingAPI.js";
  56. export default {
  57. //import引入的组件需要注入到对象中才能使用
  58. components: {},
  59. props: ['editFormDataSgin','meetingInfoRow','sginId'],
  60. data() {
  61. //这里存放数据
  62. return {
  63. dialogFormVisible:true,
  64. tableData:[],
  65. pageNum:1,
  66. pageSize:10,
  67. total:0,
  68. // ryTableHeight:innerWid
  69. };
  70. },
  71. //监听属性 类似于data概念
  72. computed: {
  73. ryTableHeight(){
  74. if(window.innerWidth <= 1366){
  75. return window.innerHeight - 500;
  76. }else{
  77. return window.innerHeight - 660;
  78. }
  79. },
  80. },
  81. //监控data中的数据变化
  82. watch: {},
  83. //方法集合
  84. methods: {
  85. handleSizeChange(val) {
  86. console.log(`每页 ${val} 条`);
  87. this.pageSize = val;
  88. this.getPeoTableData();
  89. },
  90. handleCurrentChange(val) {
  91. console.log(`当前页: ${val}`);
  92. this.pageNum = val;
  93. this.getPeoTableData();
  94. },
  95. closeDialog() {
  96. this.$emit("cancelHandler");
  97. },
  98. //获取会议人员数据
  99. getPeoTableData(){
  100. var _self = this;
  101. let obj = {
  102. "pageNum":_self.pageNum,
  103. "pageSize":_self.pageSize,
  104. "meetingId":_self.meetingInfoRow.id,
  105. "sginId":_self.sginId,
  106. }
  107. getSginDetailsLists(obj).then(response => {
  108. _self.tableData = response.data.list;
  109. _self.total = response.data.total;
  110. });
  111. },
  112. cancel(){
  113. this.$emit("cancelHandler");
  114. }
  115. },
  116. //生命周期 - 创建完成(可以访问当前this实例)
  117. created() {
  118. },
  119. //生命周期 - 挂载完成(可以访问DOM元素)
  120. mounted() {
  121. this.getPeoTableData();
  122. },
  123. beforeCreate() {}, //生命周期 - 创建之前
  124. beforeMount() {}, //生命周期 - 挂载之前
  125. beforeUpdate() {}, //生命周期 - 更新之前
  126. updated() {}, //生命周期 - 更新之后
  127. beforeDestroy() {}, //生命周期 - 销毁之前
  128. destroyed() {}, //生命周期 - 销毁完成
  129. activated() {}, //如果页面有keep-alive缓存功能,这个函数会触发
  130. }
  131. </script>
  132. <style scoped>
  133. </style>