eladmin 1.0 版本发布

src/views/monitor/log/index.vue

@@ -0,0 +1,74 @@
+<template>
+  <div class="app-container">
+    <search :query="query"/>
+    <!--表格渲染-->
+    <el-table v-loading="loading" :data="data" size="small" border style="width: 100%;">
+      <el-table-column prop="username" label="用户名"/>
+      <el-table-column prop="requestIp" label="IP"/>
+      <el-table-column prop="description" label="描述"/>
+      <el-table-column :show-overflow-tooltip="true" prop="method" label="方法名称"/>
+      <el-table-column :show-overflow-tooltip="true" prop="params" label="参数"/>
+      <el-table-column :show-overflow-tooltip="true" prop="exceptionDetail" label="异常详细"/>
+      <el-table-column prop="time" label="请求耗时" align="center">
+        <template slot-scope="scope">
+          <el-tag v-if="scope.row.time <= 300">{{ scope.row.time }}ms</el-tag>
+          <el-tag v-else-if="scope.row.time <= 1000" type="warning">{{ scope.row.time }}ms</el-tag>
+          <el-tag v-else type="danger">{{ scope.row.time }}ms</el-tag>
+        </template>
+      </el-table-column>
+      <el-table-column prop="logType" label="日志类型" width="100px" align="center">
+        <template slot-scope="scope">
+          <span v-if="scope.row.logType === 'ERROR'" class="badge badge-bg-orange">{{ scope.row.logType }}</span>
+          <span v-else class="badge">{{ scope.row.logType }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column prop="createTime" label="创建日期" width="160px">
+        <template slot-scope="scope">
+          <span>{{ time(scope.row.createTime) }}</span>
+        </template>
+      </el-table-column>
+    </el-table>
+    <!--分页组件-->
+    <el-pagination
+      :total="total"
+      style="margin-top: 8px;"
+      layout="total, prev, pager, next, sizes"
+      @size-change="sizeChange"
+      @current-change="pageChange"/>
+  </div>
+</template>
+
+<script>
+import initData from '../../../mixins/initData'
+import { parseTime } from '@/utils/index'
+import search from './module/search'
+export default {
+  components: { search },
+  mixins: [initData],
+  created() {
+    this.$nextTick(() => {
+      this.init()
+    })
+  },
+  methods: {
+    beforeInit() {
+      this.url = 'api/logs'
+      const sort = 'id,desc'
+      const query = this.query
+      const username = query.username
+      const logType = query.logType
+      this.params = { page: this.page, size: this.size, sort: sort }
+      if (username && username) { this.params['username'] = username }
+      if (logType !== '' && logType !== null) { this.params['logType'] = logType }
+      return true
+    },
+    time(time) {
+      return parseTime(time)
+    }
+  }
+}
+</script>
+
+<style scoped>
+
+</style>

src/views/monitor/log/module/search.vue

@@ -0,0 +1,36 @@
+<template>
+  <div class="head-container">
+    <el-input v-model="query.username" clearable placeholder="用户名" style="width: 200px;" class="filter-item" @keyup.enter.native="toQuery"/>
+    <el-select v-model="query.logType" placeholder="日志类型" clearable class="filter-item" style="width: 110px" @change="toQuery">
+      <el-option v-for="item in enabledTypeOptions" :key="item.key" :label="item.display_name" :value="item.key"/>
+    </el-select>
+    <el-button class="filter-item" size="mini" type="primary" icon="el-icon-search" @click="toQuery">搜索</el-button>
+  </div>
+</template>
+
+<script>
+// 查询条件
+export default {
+  props: {
+    query: {
+      type: Object,
+      required: true
+    }
+  },
+  data() {
+    return {
+      downloadLoading: false,
+      enabledTypeOptions: [
+        { key: 'INFO', display_name: 'INFO' },
+        { key: 'ERROR', display_name: 'ERROR' }
+      ]
+    }
+  },
+  methods: {
+    toQuery() {
+      this.$parent.page = 0
+      this.$parent.init()
+    }
+  }
+}
+</script>