阅行客电子档案
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

184 lines
6.0 KiB

2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
1 year ago
2 years ago
2 years ago
  1. <template>
  2. <div class="head-container">
  3. <div class="head-search">
  4. <el-input
  5. v-if="!isCenter"
  6. v-model="keyWord"
  7. size="small"
  8. clearable
  9. placeholder="请输入关键词"
  10. style="width: 300px;"
  11. class="input-prepend filter-item"
  12. @clear="crud.toQuery"
  13. @keyup.enter.native="crud.toQuery"
  14. >
  15. <el-select slot="prepend" v-model="optionVal" style="width: 92px">
  16. <el-option
  17. v-for="item in options"
  18. :key="item.value"
  19. :label="item.label"
  20. :value="item.value"
  21. />
  22. </el-select>
  23. </el-input>
  24. <date-range-picker v-model="blurryTime" class="date-item" />
  25. <el-button class="filter-item filter-search" size="mini" type="success" icon="el-icon-search" @click="crud.toQuery">搜索</el-button>
  26. <el-button class="filter-item filter-refresh" size="mini" type="warning" icon="el-icon-refresh-left" @click="resetQuery()">重置</el-button>
  27. </div>
  28. <crudOperation>
  29. <template v-slot:left>
  30. <el-button v-if="!isCenter" :loading="crud.downloadLoading" size="mini" @click="handleComfiredDelt"><i class="iconfont icon-shanchu" />清空</el-button>
  31. </template>
  32. <template v-slot:right>
  33. <el-button :loading="crud.downloadLoading" size="mini" :disabled="crud.selections.length === 0" @click="doExport(crud.selections)">
  34. <i class="iconfont icon-daochu" />
  35. 导出
  36. </el-button>
  37. </template>
  38. </crudOperation>
  39. <!-- <el-button :loading="crud.downloadLoading" size="mini" icon="el-icon-download" @click="handleDownload">导出</el-button> -->
  40. <!-- 清空 -->
  41. <el-dialog class="tip-dialog" :visible.sync="delVisible" :close-on-click-modal="false" :modal-append-to-body="false" append-to-body title="提示">
  42. <div class="setting-dialog">
  43. <div class="tip-content">
  44. <p class="tipMsg">此操作将清空所选数据</p>
  45. <span>你是否还要继续?</span>
  46. </div>
  47. <div slot="footer" class="dialog-footer">
  48. <el-button type="text" @click="delVisible = false">取消</el-button>
  49. <el-button type="primary">继续</el-button>
  50. </div>
  51. </div>
  52. </el-dialog>
  53. </div>
  54. </template>
  55. <script>
  56. import CRUD, { header, crud } from '@crud/crud'
  57. import crudOperation from '@crud/CRUD.operation'
  58. import DateRangePicker from '@/components/DateRangePicker'
  59. import { mapGetters } from 'vuex'
  60. import { exportFile } from '@/utils/index'
  61. import qs from 'qs'
  62. export default {
  63. components: { DateRangePicker, crudOperation },
  64. mixins: [header(), crud()],
  65. props: {
  66. isLogType: {
  67. type: String,
  68. default: ''
  69. },
  70. isCenter: {
  71. type: Boolean,
  72. default: false
  73. }
  74. },
  75. data() {
  76. return {
  77. blurryTime: [],
  78. delVisible: false,
  79. keyWord: '',
  80. optionVal: 'username',
  81. options: []
  82. }
  83. },
  84. computed: {
  85. ...mapGetters([
  86. 'baseApi',
  87. 'user'
  88. ])
  89. },
  90. created() {
  91. if (this.isLogType === 'error') {
  92. this.options = [
  93. { value: 'username', label: '用户名' },
  94. { value: 'account', label: '登录账号' },
  95. { value: 'method', label: '请求方法' },
  96. { value: 'params', label: '请求参数' }
  97. ]
  98. } else {
  99. this.options = [
  100. { value: 'username', label: '用户名' },
  101. { value: 'det', label: '所属部门' },
  102. { value: 'account', label: '登录账号' }
  103. ]
  104. }
  105. },
  106. methods: {
  107. [CRUD.HOOK.beforeRefresh]() {
  108. this.crud.query[this.optionVal] = this.keyWord
  109. if (this.blurryTime) {
  110. this.crud.query.startTime = this.blurryTime[0]
  111. this.crud.query.endTime = this.blurryTime[1]
  112. } else {
  113. this.crud.query.startTime = null
  114. this.crud.query.endTime = null
  115. }
  116. },
  117. resetQuery() {
  118. if (this.isLogType === 'error') {
  119. this.options = [
  120. { value: 'username', label: '用户名' },
  121. { value: 'account', label: '登录账号' },
  122. { value: 'method', label: '请求方法' },
  123. { value: 'params', label: '请求参数' }
  124. ]
  125. } else {
  126. this.options = [
  127. { value: 'username', label: '用户名' },
  128. { value: 'det', label: '所属部门' },
  129. { value: 'account', label: '登录账号' }
  130. ]
  131. }
  132. this.keyWord = ''
  133. this.crud.query[this.optionVal] = this.keyWord
  134. this.blurryTime = null
  135. this.crud.query.startTime = null
  136. this.crud.query.endTime = null
  137. this.crud.toQuery()
  138. },
  139. handleComfiredDelt() {
  140. if (this.isLogType === 'login') {
  141. this.$emit('handleClearData')
  142. } else if (this.isLogType === 'operate') {
  143. this.$emit('handleClearOperateData')
  144. } else {
  145. this.$emit('handleClearErrorData')
  146. }
  147. },
  148. doExport(data) {
  149. console.log(data)
  150. crud.downloadLoading = true
  151. this.$confirm('此操作将导出所选数据' + '<span>你是否还要继续?</span>', '提示', {
  152. confirmButtonText: '继续',
  153. cancelButtonText: '取消',
  154. type: 'warning',
  155. dangerouslyUseHTMLString: true
  156. }).then(() => {
  157. const ids = []
  158. data.forEach(val => {
  159. ids.push(val.id)
  160. })
  161. const params = {
  162. 'ids': ids
  163. }
  164. if (this.isLogType === 'login') {
  165. exportFile(this.baseApi + '/api/log/downloadLoginLog?' + qs.stringify(params, { indices: false }))
  166. } else if (this.isLogType === 'operate') {
  167. exportFile(this.baseApi + '/api/log/downloadLog?' + qs.stringify(params, { indices: false }))
  168. } else {
  169. exportFile(this.baseApi + '/api/log/downloadErrorLog?' + qs.stringify(params, { indices: false }))
  170. }
  171. }).catch(() => {
  172. })
  173. }
  174. }
  175. }
  176. </script>
  177. <style lang="scss" scoped>
  178. ::v-deep .input-prepend .el-input__inner{
  179. padding-left: 100px;
  180. }
  181. </style>