log-operation.vue 6.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197
  1. <template>
  2. <div class="detail-container">
  3. <!-- 筛选条件 -->
  4. <div class="screen-container">
  5. <Collapse :is-collapse="isCollapse" :screen-form="screenForm">
  6. <template #right_btn>
  7. <el-button size="mini" @click="resetScreenForm">清空</el-button>
  8. <el-button size="mini" type="primary" @click="submitScreenForm">搜索</el-button>
  9. </template>
  10. <template #search>
  11. <el-form ref="screenForm" :model="screenForm" label-width="120px" size="mini" label-position="left">
  12. <el-row :gutter="20">
  13. <el-col :xs="24" :sm="12" :lg="6">
  14. <el-form-item label="账号" prop="account">
  15. <el-input v-model="screenForm.account" placeholder="请输入账号"></el-input>
  16. </el-form-item>
  17. </el-col>
  18. <el-col :xs="24" :sm="12" :lg="6">
  19. <el-form-item label="姓名" prop="name">
  20. <el-input v-model="screenForm.name" placeholder="请输入姓名"></el-input>
  21. </el-form-item>
  22. </el-col>
  23. <el-col :xs="24" :sm="12" :lg="6">
  24. <el-form-item label="操作对象" prop="obj">
  25. <el-input v-model="screenForm.obj" placeholder="请输入操作对象"></el-input>
  26. </el-form-item>
  27. </el-col>
  28. <el-col :xs="24" :sm="12" :lg="6">
  29. <el-form-item label="操作时间" prop="date">
  30. <el-date-picker
  31. v-model="screenForm.date"
  32. type="datetimerange"
  33. range-separator="至"
  34. style="width: 100%"
  35. value-format="yyyy-MM-dd HH:mm:ss"
  36. start-placeholder="开始日期"
  37. end-placeholder="结束日期"
  38. >
  39. </el-date-picker>
  40. </el-form-item>
  41. </el-col>
  42. </el-row>
  43. </el-form>
  44. </template>
  45. </Collapse>
  46. </div>
  47. <div class="mymain-container">
  48. <div class="btn-group clearfix">
  49. <div class="fl" />
  50. <div class="fr">
  51. <ExportButton :exUrl="'admin/user/mch/export'" :exParams="exParams" />
  52. </div>
  53. </div>
  54. <div class="table">
  55. <el-table
  56. v-loading="listLoading"
  57. :data="dataList"
  58. element-loading-text="Loading"
  59. border
  60. fit
  61. highlight-current-row
  62. stripe
  63. >
  64. <el-table-column align="center" label="账号" prop="moduleName" min-width="140"></el-table-column>
  65. <el-table-column align="center" label="姓名" prop="moduleName" min-width="140"></el-table-column>
  66. <el-table-column align="center" label="操作编号" prop="moduleName" min-width="140"></el-table-column>
  67. <el-table-column align="center" label="操作时间" prop="createTime" min-width="160"></el-table-column>
  68. <el-table-column align="center" label="所属模块" prop="ip" min-width="140"></el-table-column>
  69. <el-table-column align="center" label="操作对象" prop="ip" min-width="140"></el-table-column>
  70. <el-table-column align="center" label="操作类型" prop="ip" min-width="140"></el-table-column>
  71. </el-table>
  72. </div>
  73. <div class="pagination clearfix">
  74. <div class="fr">
  75. <el-pagination
  76. @size-change="handleSizeChange"
  77. @current-change="handleCurrentChange"
  78. :current-page="currentPage"
  79. :page-sizes="[10, 20, 30, 50]"
  80. :page-size="10"
  81. layout="total, sizes, prev, pager, next, jumper"
  82. :total="listTotal"
  83. >
  84. </el-pagination>
  85. </div>
  86. </div>
  87. </div>
  88. </div>
  89. </template>
  90. <script>
  91. import { getOplogList } from '@/api/setting'
  92. export default {
  93. data() {
  94. return {
  95. dataList: null, // 列表数据
  96. listLoading: true, // 列表加载loading
  97. screenForm: {
  98. // 筛选表单数据
  99. account: '',
  100. name: '',
  101. date: '',
  102. obj: ''
  103. },
  104. currentPage: 1, // 当前页码
  105. pageSize: 10, // 每页数量
  106. listTotal: 0, // 列表总数
  107. isCollapse: true
  108. }
  109. },
  110. computed: {
  111. exParams() {
  112. return {
  113. account: this.screenForm.account,
  114. name: this.screenForm.name,
  115. obj: this.screenForm.obj,
  116. startTime: this.screenForm.date ? this.screenForm.date[0] : '',
  117. endTime: this.screenForm.date ? this.screenForm.date[1] : ''
  118. }
  119. }
  120. },
  121. created() {
  122. this.getList()
  123. },
  124. methods: {
  125. // 查询按钮权限
  126. checkBtnRole(value) {
  127. // let btnRole = this.$route.meta.roles;
  128. // if(!btnRole) {return true}
  129. // let index = btnRole.indexOf(value);
  130. // return index >= 0 ? true : false;
  131. return true
  132. },
  133. getList() {
  134. this.listLoading = true
  135. let params = {
  136. account: this.screenForm.account,
  137. name: this.screenForm.name,
  138. obj: this.screenForm.obj,
  139. startTime: this.screenForm.date ? this.screenForm.date[0] : '',
  140. endTime: this.screenForm.date ? this.screenForm.date[1] : '',
  141. pageNo: this.currentPage,
  142. pageSize: this.pageSize
  143. }
  144. getOplogList(params).then(res => {
  145. this.dataList = res.data.records
  146. this.listTotal = res.data.total
  147. this.listLoading = false
  148. })
  149. },
  150. // 筛选后重新获取列表
  151. getListByScreen() {
  152. this.currentPage = 1
  153. this.getList()
  154. },
  155. // 更改每页数量
  156. handleSizeChange(val) {
  157. this.pageSize = val
  158. this.currentPage = 1
  159. this.getList()
  160. },
  161. // 更改当前页
  162. handleCurrentChange(val) {
  163. this.currentPage = val
  164. this.getList()
  165. },
  166. // 提交筛选表单
  167. submitScreenForm() {
  168. this.currentPage = 1
  169. this.getList()
  170. },
  171. // 重置筛选表单
  172. resetScreenForm() {
  173. this.$refs.screenForm.resetFields()
  174. this.currentPage = 1
  175. this.getList()
  176. }
  177. }
  178. }
  179. </script>
  180. <style></style>