project.vue 4.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152
  1. <template>
  2. <div class="hui-flex hui-content">
  3. <div class="hui-flex">
  4. <div class="hui-content-title">
  5. <div class="hui-title-item active">项目会议</div>
  6. </div>
  7. <div class="hui-flex-box hui-flex hui-table">
  8. <div class="hui-content-insert">
  9. <el-button type="primary" size="medium" @click="insert">新增会议</el-button>
  10. </div>
  11. <div class="hui-flex-box">
  12. <el-table :data="tableData" row-key="id" border height="100%">
  13. <el-table-column label="序号" width="50">
  14. <template slot-scope="scope">
  15. <div style="text-align: center;">{{scope.$index + 1}}</div>
  16. </template>
  17. </el-table-column>
  18. <el-table-column label="会议名称" prop="name"></el-table-column>
  19. <el-table-column label="会议时间" prop="date"></el-table-column>
  20. <el-table-column label="会议类型" prop="typeName"></el-table-column>
  21. <el-table-column label="发起人" prop="userName"></el-table-column>
  22. <el-table-column label="会议地点" prop="placeName"></el-table-column>
  23. <el-table-column label="会议纪要" prop="meetingMinutes"></el-table-column>
  24. <el-table-column label="操作" width="150">
  25. <template slot-scope="scope">
  26. <div class="hui-table-operation">
  27. <span class="table-operation" @click="detailItem(scope.row)">
  28. 详情
  29. </span>
  30. <span class="table-operation" @click="updateItem(scope.row)">
  31. 编辑
  32. </span>
  33. <span class="table-operation" @click="deleteItem(scope.row)">
  34. 删除
  35. </span>
  36. </div>
  37. </template>
  38. </el-table-column>
  39. <template slot="empty">
  40. <empty description="暂无数据"></empty>
  41. </template>
  42. </el-table>
  43. </div>
  44. <div class="hui-content-pagination">
  45. <el-pagination :page-size="pageSize" :pager-count="9" layout="prev, pager, next" :total="totalCount"
  46. @current-change="currentChange">
  47. </el-pagination>
  48. </div>
  49. </div>
  50. </div>
  51. <el-dialog :close-on-click-modal="false" :title="isUpdate?'编辑':'新增'" :visible.sync="visible" width="900px"
  52. :append-to-body="true">
  53. <edit v-if="visible" @callback="callback" :isUpdate="isUpdate" :detailId="detailId" :type="type"></edit>
  54. </el-dialog>
  55. <el-drawer title="会议详情" :visible.sync="drawer" :size="400" :append-to-body="true">
  56. <detail v-if="drawer" :detailId="detailId" @callback="callback"></detail>
  57. </el-drawer>
  58. </div>
  59. </template>
  60. <script>
  61. import {
  62. getMeetingListByQuery,
  63. deleteMeetingById
  64. } from '@/httpApi/operation'
  65. import edit from '@/components/work/operation/meeting/edit'
  66. import detail from '@/components/work/operation/meeting/detail'
  67. export default {
  68. data() {
  69. return {
  70. tableData: [],
  71. currPage: 1,
  72. pageSize: 10,
  73. totalCount: 0,
  74. filterOption: {},
  75. type: 1,
  76. isUpdate: false,
  77. visible: false,
  78. detailId: '',
  79. drawer: false
  80. }
  81. },
  82. created() {
  83. this.init();
  84. },
  85. methods: {
  86. init() {
  87. let postData = {
  88. currPage: this.currPage,
  89. pageSize: this.pageSize,
  90. organizationId: this.$store.getters.organization.id,
  91. projectId: this.$store.getters.project.id,
  92. type: this.type
  93. }
  94. postData = Object.assign(postData, this.filterOption);
  95. getMeetingListByQuery(postData).then(res => {
  96. if (res.state) {
  97. this.tableData = res.data.dataList;
  98. this.totalCount = res.data.totalCount;
  99. }
  100. })
  101. },
  102. filterInit(option) {
  103. this.filterOption = option;
  104. this.currPage = 1;
  105. this.init();
  106. },
  107. insert() {
  108. this.detailId = '';
  109. this.isUpdate = false;
  110. this.visible = true;
  111. },
  112. updateItem(item) {
  113. this.detailId = item.id;
  114. this.isUpdate = true;
  115. this.visible = true;
  116. },
  117. detailItem(item) {
  118. this.detailId = item.id;
  119. this.drawer = true;
  120. },
  121. currentChange(currPage) {
  122. this.currPage = currPage;
  123. this.init();
  124. },
  125. deleteItem(item) {
  126. this.$confirm('确定要删除该会议记录?', () => {
  127. deleteMeetingById(item.id).then(res => {
  128. if (res.state) {
  129. this.$message({
  130. type: 'success',
  131. message: '操作成功'
  132. })
  133. this.init();
  134. }
  135. })
  136. });
  137. },
  138. callback(type) {
  139. if (type === 'init') this.init();
  140. this.visible = false;
  141. }
  142. },
  143. components: {
  144. edit,
  145. detail
  146. },
  147. }
  148. </script>
  149. <style>
  150. </style>