Checker.vue 5.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146
  1. <style lang='scss'>
  2. .checker{
  3. .el-dialog__footer{
  4. text-align: right;
  5. }
  6. }
  7. </style>
  8. <template>
  9. <section class="checker">
  10. <p><span>会议管理></span>核销员管理</p>
  11. <div class="content">
  12. <div class="filter">
  13. <el-form size="small" label-width="70px" :inline="true" label-position="left">
  14. <el-form-item label="">
  15. <el-select v-model="form.id" clearable placeholder="请选择会议"></el-select>
  16. </el-form-item>
  17. <el-form-item label="">
  18. <el-select v-model="form.id" clearable placeholder="请选择核销员"></el-select>
  19. </el-form-item>
  20. <el-form-item>
  21. <el-button type="primary">搜索</el-button>
  22. </el-form-item>
  23. <el-form-item style="float:right" >
  24. <el-button @click="dialogVisible=true" icon="el-icon-plud" type="primary">添加核销员</el-button>
  25. <el-button plain icon="el-icon-download" type="primary">导出Excel</el-button>
  26. </el-form-item>
  27. </el-form>
  28. </div>
  29. <el-table
  30. class="table"
  31. :data="list"
  32. height='50vh'
  33. border v-loading="loading"
  34. default-expand-all row-key="id"
  35. style="width: 100%">
  36. <el-table-column
  37. prop="name"
  38. label="核销员头像">
  39. </el-table-column>
  40. <el-table-column
  41. prop="username"
  42. label="核销员昵称">
  43. </el-table-column>
  44. <el-table-column
  45. prop="username"
  46. label="所属会议">
  47. </el-table-column>
  48. <el-table-column
  49. prop="username"
  50. label="加入时间">
  51. </el-table-column>
  52. <el-table-column
  53. prop=""
  54. label="核销详细">
  55. </el-table-column>
  56. <el-table-column
  57. prop="zip" width="100" fixed="right"
  58. label="操作">
  59. <template slot-scope="">
  60. <el-button @click="del(scope.row.id)" class="edit" type="text" >解除核销员</el-button>
  61. </template>
  62. </el-table-column>
  63. </el-table>
  64. <Page ref="pageButton" :current='form.page' :page_size='form.page_size' :total='total' @pageChange='gopage'/>
  65. </div>
  66. <el-dialog width="70%"
  67. title="添加核销员" :close-on-click-modal='false'
  68. :visible.sync="dialogVisible">
  69. <el-button size="small" type="primary">点击获取会议列表</el-button>
  70. <span slot="footer" class="dialog-footer">
  71. <el-button size="small" type="primary">确 定</el-button>
  72. </span>
  73. </el-dialog>
  74. <el-dialog width="70%"
  75. title="会议列表" :close-on-click-modal='false'
  76. :visible.sync="dialogVisible1">
  77. <el-table
  78. class="table"
  79. :data="list"
  80. default-expand-all
  81. style="width: 100%">
  82. <el-table-column
  83. prop="name"
  84. label="会议名称">
  85. </el-table-column>
  86. <el-table-column
  87. prop="name"
  88. label="会议头像">
  89. </el-table-column>
  90. <el-table-column
  91. prop="name"
  92. label="创建时间">
  93. </el-table-column>
  94. </el-table>
  95. <span slot="footer" class="dialog-footer">
  96. <el-button size="small" type="primary">确 定</el-button>
  97. </span>
  98. </el-dialog>
  99. </section>
  100. </template>
  101. <script>
  102. import Page from '../../components/Page';
  103. export default {
  104. components:{
  105. Page
  106. },
  107. data(){
  108. return{
  109. form:{},
  110. list:[{}],
  111. dialogVisible:false,
  112. dialogVisible1:false,
  113. loading:false,
  114. total:0
  115. }
  116. },
  117. methods:{
  118. gopage(size){
  119. if(size){
  120. this.form.page_size=size
  121. }
  122. this.form.page=this.$refs.pageButton.page
  123. this.getData()
  124. },
  125. del(id){
  126. this.$confirm('确定删除吗', '提示', {
  127. type: 'warning'
  128. }).then(() => {
  129. this.$api.delUser({id:id}).then((res)=>{
  130. if(res.data.code==0){
  131. this.$message({
  132. message: '删除成功',
  133. type: 'success'
  134. })
  135. this.getData()
  136. }else{
  137. this.$message.error(res.data.message);
  138. }
  139. })
  140. })
  141. },
  142. }
  143. }
  144. </script>