Blame view

src/views/sys/error-log/index.vue 3.16 KB
vben authored
1
2
<template>
  <div class="p-4">
3
    <template v-for="src in imgList" :key="src">
vben authored
4
5
      <img :src="src" v-show="false" />
    </template>
6
    <DetailModal :info="rowInfo" @register="registerModal" />
vben authored
7
8
    <BasicTable @register="register" class="error-handle-table">
      <template #toolbar>
vben authored
9
10
11
12
13
14
15
16
17
        <a-button @click="fireVueError" type="primary">
          {{ t('sys.errorLog.fireVueError') }}
        </a-button>
        <a-button @click="fireResourceError" type="primary">
          {{ t('sys.errorLog.fireResourceError') }}
        </a-button>
        <a-button @click="fireAjaxError" type="primary">
          {{ t('sys.errorLog.fireAjaxError') }}
        </a-button>
vben authored
18
19
      </template>
      <template #action="{ record }">
vben authored
20
21
22
23
24
        <TableAction
          :actions="[
            { label: t('sys.errorLog.tableActionDesc'), onClick: handleDetail.bind(null, record) },
          ]"
        />
vben authored
25
26
27
28
29
30
      </template>
    </BasicTable>
  </div>
</template>

<script lang="ts">
Vben authored
31
32
  import type { ErrorLogInfo } from '/#/store';
vben authored
33
34
35
  import { defineComponent, watch, ref, nextTick } from 'vue';

  import DetailModal from './DetailModal.vue';
vben authored
36
37
  import { BasicTable, useTable, TableAction } from '/@/components/Table/index';
vben authored
38
  import { useModal } from '/@/components/Modal/index';
vben authored
39
  import { useMessage } from '/@/hooks/web/useMessage';
vben authored
40
  import { useI18n } from '/@/hooks/web/useI18n';
vben authored
41
Vben authored
42
  import { useErrorLogStore } from '/@/store/modules/errorLog';
vben authored
43
44
45
46
47
48
49
50
51
52
53

  import { fireErrorApi } from '/@/api/demo/error';

  import { getColumns } from './data';

  import { cloneDeep } from 'lodash-es';

  export default defineComponent({
    name: 'ErrorHandler',
    components: { DetailModal, BasicTable, TableAction },
    setup() {
Vben authored
54
      const rowInfo = ref<ErrorLogInfo>();
55
      const imgList = ref<string[]>([]);
vben authored
56
57
      const { t } = useI18n();
Vben authored
58
      const errorLogStore = useErrorLogStore();
vben authored
59
      const [register, { setTableData }] = useTable({
vben authored
60
        title: t('sys.errorLog.tableTitle'),
vben authored
61
62
63
        columns: getColumns(),
        actionColumn: {
          width: 80,
vben authored
64
          title: 'Action',
vben authored
65
66
67
68
69
          dataIndex: 'action',
          slots: { customRender: 'action' },
        },
      });
      const [registerModal, { openModal }] = useModal();
vben authored
70
vben authored
71
      watch(
Vben authored
72
        () => errorLogStore.getErrorLogInfoList,
vben authored
73
74
75
76
77
78
79
80
81
        (list) => {
          nextTick(() => {
            setTableData(cloneDeep(list));
          });
        },
        {
          immediate: true,
        }
      );
vben authored
82
      const { createMessage } = useMessage();
Vben authored
83
      if (import.meta.env.DEV) {
84
        createMessage.info(t('sys.errorLog.enableMessage'));
vben authored
85
      }
vben authored
86
      // 查看详情
Vben authored
87
      function handleDetail(row: ErrorLogInfo) {
88
        rowInfo.value = row;
vben authored
89
90
91
92
93
94
95
96
        openModal(true);
      }

      function fireVueError() {
        throw new Error('fire vue error!');
      }

      function fireResourceError() {
97
        imgList.value.push(`${new Date().getTime()}.png`);
vben authored
98
99
100
101
102
103
104
105
106
107
108
109
110
      }

      async function fireAjaxError() {
        await fireErrorApi();
      }

      return {
        register,
        registerModal,
        handleDetail,
        fireVueError,
        fireResourceError,
        fireAjaxError,
111
112
        imgList,
        rowInfo,
vben authored
113
        t,
vben authored
114
115
116
117
      };
    },
  });
</script>