yangys
2025-05-27 81060ec4cc3ead9080d4bdb3875920e257583de4
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
<template>
  <basic-container>
    <avue-crud
      :option="option"
      :table-loading="loading"
      :data="data"
      ref="crud"
      :before-open="beforeOpen"
      v-model="form"
      :permission="permissionList"
      v-model:page="page"
      @search-change="searchChange"
      @search-reset="searchReset"
      @current-change="currentChange"
      @size-change="sizeChange"
      @refresh-change="refreshChange"
      @on-load="onLoad"
    >
    </avue-crud>
  </basic-container>
</template>
 
<script>
import { getErrorList, getErrorLogs } from '@/api/logs';
import { mapGetters } from 'vuex';
 
export default {
  data() {
    return {
      form: {},
      selectionList: [],
      query: {},
      loading: true,
      page: {
        pageSize: 10,
        currentPage: 1,
        total: 0,
      },
      option: {
        height: 'auto',
        calcHeight: 32,
        tip: false,
        searchShow: true,
        searchMenuSpan: 6,
        border: true,
        index: true,
        viewBtn: true,
        editBtn: false,
        addBtn: false,
        delBtn: false,
        menuWidth: 120,
        dialogType: 'drawer',
        column: [
          {
            label: '服务id',
            prop: 'serviceId',
            search: true,
            width: '120',
          },
          {
            label: '服务host',
            prop: 'serverHost',
            search: true,
            width: '150',
          },
          {
            label: '服务ip',
            prop: 'serverIp',
            width: '160',
          },
          {
            label: '软件环境',
            prop: 'env',
            width: '85',
          },
          {
            label: '请求方法',
            prop: 'method',
            width: '85',
          },
          {
            label: '请求接口',
            prop: 'requestUri',
          },
          {
            label: '日志时间',
            prop: 'createTime',
            width: '180',
          },
          {
            label: '用户代理',
            prop: 'userAgent',
            span: 24,
            hide: true,
          },
          {
            label: '请求数据',
            prop: 'params',
            type: 'textarea',
            span: 24,
            minRows: 2,
            hide: true,
          },
          {
            label: '日志数据',
            prop: 'stackTrace',
            type: 'textarea',
            span: 24,
            minRows: 16,
            hide: true,
          },
        ],
      },
      data: [],
    };
  },
  computed: {
    ...mapGetters(['permission']),
    permissionList() {
      return {
        viewBtn: this.validData(this.permission.log_error_view, false),
      };
    },
  },
  methods: {
    searchReset() {
      this.query = {};
      this.onLoad(this.page);
    },
    searchChange(params, done) {
      this.query = params;
      this.page.currentPage = 1;
      this.onLoad(this.page, params);
      done();
    },
    beforeOpen(done, type) {
      if (['edit', 'view'].includes(type)) {
        getErrorLogs(this.form.id).then(res => {
          this.form = res.data.data;
        });
      }
      done();
    },
    currentChange(currentPage) {
      this.page.currentPage = currentPage;
    },
    sizeChange(pageSize) {
      this.page.pageSize = pageSize;
    },
    refreshChange() {
      this.onLoad(this.page, this.query);
    },
    onLoad(page, params = {}) {
      this.loading = true;
      getErrorList(page.currentPage, page.pageSize, Object.assign(params, this.query)).then(res => {
        const data = res.data.data;
        this.page.total = data.total;
        this.data = data.records;
        this.loading = false;
      });
    },
  },
};
</script>
 
<style></style>