Commit 305f105620378e3b1ab4d206aa33e8dd6b0964a9

Authored by fengtao
1 parent fa14f9fc

feat:PC新增日志管理

  1 +import { defHttp } from '/@/utils/http/axios';
  2 +import { LogQueryParam } from './model/logModel';
  3 +
  4 +enum LogManagerApi {
  5 + LOG_DETAIL_URL = '/log',
  6 + LOG_EXCEPTION_URL = '/log/exception',
  7 + LOG_OPERATE_URL = '/log/operate',
  8 + LOG_USER_URL = '/log/user',
  9 +}
  10 +
  11 +export const getExceptionPage = (params: LogQueryParam) => {
  12 + return defHttp.get<LogQueryParam>({
  13 + url: LogManagerApi.LOG_EXCEPTION_URL,
  14 + params,
  15 + });
  16 +};
  17 +
  18 +export const getOperatePage = (params: LogQueryParam) => {
  19 + return defHttp.get<LogQueryParam>({
  20 + url: LogManagerApi.LOG_OPERATE_URL,
  21 + params,
  22 + });
  23 +};
  24 +
  25 +export const getUserPage = (params: LogQueryParam) => {
  26 + return defHttp.get<LogQueryParam>({
  27 + url: LogManagerApi.LOG_USER_URL,
  28 + params,
  29 + });
  30 +};
  31 +
  32 +// 异常详情
  33 +export const getLogManageDetail = (id: string) => {
  34 + return defHttp.get({
  35 + url: LogManagerApi.LOG_DETAIL_URL + `/${id}`,
  36 + });
  37 +};
... ...
  1 +import { BasicPageParams } from '/@/api/model/baseModel';
  2 +export type LogQueryParam = BasicPageParams & CameraParam;
  3 +
  4 +export type CameraParam = {
  5 + status?: true;
  6 + name?: string;
  7 + organizationId?: string;
  8 + orderFiled?: string;
  9 + orderType?: string;
  10 +};
... ...
... ... @@ -150,7 +150,7 @@
150 150
151 151 const getIsFixed = computed(() => {
152 152 /* eslint-disable-next-line */
153   - mixSideHasChildren.value = unref(childrenMenus).length > 0;
  153 + mixSideHasChildren.value = unref(childrenMenus).length > 0;interfaceDisplay
154 154 const isFixed = unref(getMixSideFixed) && unref(mixSideHasChildren);
155 155 if (isFixed) {
156 156 /* eslint-disable-next-line */
... ...
  1 +<template>
  2 + <BasicDrawer v-bind="$attrs" @register="registerDrawer" title="异常日志详情" width="30%">
  3 + <BasicForm @register="registerForm" />
  4 + </BasicDrawer>
  5 +</template>
  6 +<script lang="ts">
  7 + import { defineComponent } from 'vue';
  8 + import { BasicForm, useForm } from '/@/components/Form';
  9 + import { formSchema } from './config.data';
  10 + import { BasicDrawer, useDrawerInner } from '/@/components/Drawer';
  11 + import { getLogManageDetail } from '/@/api/log/logManager';
  12 +
  13 + export default defineComponent({
  14 + name: 'ContactDrawer',
  15 + components: { BasicDrawer, BasicForm },
  16 + emits: ['success', 'register'],
  17 + setup(_) {
  18 + const [registerForm, { setFieldsValue, resetFields }] = useForm({
  19 + labelWidth: 120,
  20 + schemas: formSchema,
  21 + showActionButtonGroup: false,
  22 + });
  23 +
  24 + const [registerDrawer, { setDrawerProps }] = useDrawerInner(async (data) => {
  25 + await resetFields();
  26 + setDrawerProps({ confirmLoading: false });
  27 + const res = await getLogManageDetail(data.record.id);
  28 + const actionData = JSON.stringify(res.actionData);
  29 + await setFieldsValue(res || data.record);
  30 + await setFieldsValue({ actionData });
  31 + });
  32 + return {
  33 + registerDrawer,
  34 + registerForm,
  35 + };
  36 + },
  37 + });
  38 +</script>
... ...
  1 +import { BasicColumn, FormSchema } from '/@/components/Table';
  2 +import moment from 'moment';
  3 +
  4 +// 表格数据
  5 +export const columns: BasicColumn[] = [
  6 + {
  7 + title: '租户名称',
  8 + dataIndex: 'tenantName',
  9 + width: 120,
  10 + },
  11 + {
  12 + title: '客户名称',
  13 + dataIndex: 'customerName',
  14 + width: 120,
  15 + },
  16 + {
  17 + title: '资源类型',
  18 + dataIndex: 'entityType',
  19 + width: 180,
  20 + },
  21 + {
  22 + title: '资源名称',
  23 + dataIndex: 'entityName',
  24 + width: 180,
  25 + },
  26 + {
  27 + title: '操作人员',
  28 + dataIndex: 'userName',
  29 + width: 180,
  30 + },
  31 + {
  32 + title: '操作类型',
  33 + dataIndex: 'actionType',
  34 + width: 180,
  35 + },
  36 + {
  37 + title: '操作状态',
  38 + dataIndex: 'actionStatus',
  39 + width: 180,
  40 + },
  41 + {
  42 + title: '操作时间',
  43 + dataIndex: 'createdTime',
  44 + width: 80,
  45 + format: (_, record) => {
  46 + return moment(record.createdTime).format('YYYY-MM-DD');
  47 + },
  48 + },
  49 +];
  50 +
  51 +// 分页查询
  52 +export const searchFormSchema: FormSchema[] = [
  53 + {
  54 + field: 'queryTime',
  55 + label: '查询时间',
  56 + component: 'RangePicker',
  57 + componentProps: {
  58 + showTime: {
  59 + defaultValue: [moment('00:00:00', 'HH:mm:ss'), moment('23:59:59', 'HH:mm:ss')],
  60 + },
  61 + },
  62 + colProps: { span: 6 },
  63 + },
  64 +];
  65 +
  66 +// 详情配置
  67 +export const formSchema: FormSchema[] = [
  68 + {
  69 + field: 'createdTime',
  70 + label: '操作时间',
  71 + component: 'Input',
  72 + componentProps: {
  73 + disabled: true,
  74 + },
  75 + },
  76 + {
  77 + field: 'tenantName',
  78 + label: '租户名称',
  79 + component: 'Input',
  80 + componentProps: {
  81 + disabled: true,
  82 + },
  83 + },
  84 + {
  85 + field: 'customerName',
  86 + label: '客户名称',
  87 + component: 'Input',
  88 + componentProps: {
  89 + disabled: true,
  90 + },
  91 + },
  92 + {
  93 + field: 'entityType',
  94 + label: '资源类型',
  95 + component: 'Input',
  96 + componentProps: {
  97 + disabled: true,
  98 + },
  99 + },
  100 + {
  101 + field: 'entityName',
  102 + label: '资源名称',
  103 + component: 'Input',
  104 + componentProps: {
  105 + disabled: true,
  106 + },
  107 + },
  108 + {
  109 + field: 'userName',
  110 + label: '操作人员',
  111 + colProps: { span: 24 },
  112 + component: 'Input',
  113 + componentProps: {
  114 + disabled: true,
  115 + },
  116 + },
  117 + {
  118 + field: 'actionType',
  119 + label: '操作类型',
  120 + component: 'Input',
  121 + componentProps: {
  122 + disabled: true,
  123 + },
  124 + },
  125 + {
  126 + field: 'actionStatus',
  127 + label: '操作状态',
  128 + component: 'Input',
  129 + componentProps: {
  130 + disabled: true,
  131 + },
  132 + },
  133 + {
  134 + field: 'actionData',
  135 + label: '操作数据',
  136 + component: 'InputTextArea',
  137 + componentProps: {
  138 + disabled: true,
  139 + autosize: true,
  140 + allowClear: false,
  141 + },
  142 + },
  143 + {
  144 + field: 'actionFailureDetails',
  145 + label: '失败信息',
  146 + component: 'InputTextArea',
  147 + componentProps: {
  148 + disabled: true,
  149 + autosize: true,
  150 + allowClear: false,
  151 + },
  152 + },
  153 +];
... ...
  1 +<template>
  2 + <div>
  3 + <BasicTable :clickToRowSelect="false" @register="registerTable">
  4 + <template #toolbar> </template>
  5 + <template #action="{ record }">
  6 + <TableAction
  7 + :actions="[
  8 + {
  9 + label: '详情',
  10 + auth: 'api:yt:admin:viewFeedBack',
  11 + icon: 'clarity:note-edit-line',
  12 + onClick: handleViewDetail.bind(null, record),
  13 + },
  14 + ]"
  15 + />
  16 + </template>
  17 + </BasicTable>
  18 + <ExceptionDrawer @register="registerDrawer" @success="handleSuccess" />
  19 + </div>
  20 +</template>
  21 +
  22 +<script lang="ts">
  23 + import { defineComponent } from 'vue';
  24 + import { BasicTable, useTable, TableAction } from '/@/components/Table';
  25 + import { useDrawer } from '/@/components/Drawer';
  26 + import ExceptionDrawer from './ExceptionDrawer.vue';
  27 + import { getExceptionPage } from '/@/api/log/logManager';
  28 + import { searchFormSchema, columns } from './config.data';
  29 + import { useModal } from '/@/components/Modal';
  30 +
  31 + export default defineComponent({
  32 + components: {
  33 + BasicTable,
  34 + TableAction,
  35 + ExceptionDrawer,
  36 + },
  37 + setup() {
  38 + const [registerModal] = useModal();
  39 + const [registerTable, { reload }] = useTable({
  40 + title: '异常日志列表',
  41 + api: getExceptionPage,
  42 + columns,
  43 + showIndexColumn: false,
  44 + clickToRowSelect: false,
  45 + formConfig: {
  46 + labelWidth: 120,
  47 + schemas: searchFormSchema,
  48 + fieldMapToTime: [['queryTime', ['startTime', 'endTime'], 'YYYY-MM-DD HH:mm:ss']],
  49 + },
  50 + useSearchForm: true,
  51 + showTableSetting: true,
  52 + bordered: true,
  53 + rowKey: 'id',
  54 + actionColumn: {
  55 + width: 200,
  56 + title: '操作',
  57 + dataIndex: 'action',
  58 + slots: { customRender: 'action' },
  59 + fixed: 'right',
  60 + },
  61 + });
  62 + // 弹框
  63 + const [registerDrawer, { openDrawer }] = useDrawer();
  64 +
  65 + // 刷新
  66 + const handleSuccess = () => {
  67 + reload();
  68 + };
  69 +
  70 + const handleViewDetail = (record) => {
  71 + openDrawer(true, {
  72 + isUpdate: true,
  73 + record,
  74 + });
  75 + };
  76 + return {
  77 + handleSuccess,
  78 + registerTable,
  79 + registerDrawer,
  80 + handleViewDetail,
  81 + registerModal,
  82 + };
  83 + },
  84 + });
  85 +</script>
... ...
  1 +<template>
  2 + <BasicDrawer v-bind="$attrs" @register="registerDrawer" title="操作日志详情" width="30%">
  3 + <BasicForm @register="registerForm" />
  4 + </BasicDrawer>
  5 +</template>
  6 +<script lang="ts">
  7 + import { defineComponent } from 'vue';
  8 + import { BasicForm, useForm } from '/@/components/Form';
  9 + import { formSchema } from './config.data';
  10 + import { BasicDrawer, useDrawerInner } from '/@/components/Drawer';
  11 + import { getLogManageDetail } from '/@/api/log/logManager';
  12 +
  13 + export default defineComponent({
  14 + name: 'ContactDrawer',
  15 + components: { BasicDrawer, BasicForm },
  16 + emits: ['success', 'register'],
  17 + setup(_) {
  18 + const [registerForm, { setFieldsValue, resetFields }] = useForm({
  19 + labelWidth: 120,
  20 + schemas: formSchema,
  21 + showActionButtonGroup: false,
  22 + });
  23 +
  24 + const [registerDrawer, { setDrawerProps }] = useDrawerInner(async (data) => {
  25 + await resetFields();
  26 + setDrawerProps({ confirmLoading: false });
  27 + const res = await getLogManageDetail(data.record.id);
  28 + const actionData = JSON.stringify(res.actionData);
  29 + await setFieldsValue(res || data.record);
  30 + await setFieldsValue({ actionData });
  31 + });
  32 + return {
  33 + registerDrawer,
  34 + registerForm,
  35 + };
  36 + },
  37 + });
  38 +</script>
... ...
  1 +import { BasicColumn, FormSchema } from '/@/components/Table';
  2 +import moment from 'moment';
  3 +
  4 +// 表格数据
  5 +export const columns: BasicColumn[] = [
  6 + {
  7 + title: '租户名称',
  8 + dataIndex: 'tenantName',
  9 + width: 120,
  10 + },
  11 + {
  12 + title: '客户名称',
  13 + dataIndex: 'customerName',
  14 + width: 120,
  15 + },
  16 + {
  17 + title: '资源类型',
  18 + dataIndex: 'entityType',
  19 + width: 180,
  20 + },
  21 + {
  22 + title: '资源名称',
  23 + dataIndex: 'entityName',
  24 + width: 180,
  25 + },
  26 + {
  27 + title: '操作人员',
  28 + dataIndex: 'userName',
  29 + width: 180,
  30 + },
  31 + {
  32 + title: '操作类型',
  33 + dataIndex: 'actionType',
  34 + width: 180,
  35 + },
  36 + {
  37 + title: '操作状态',
  38 + dataIndex: 'actionStatus',
  39 + width: 180,
  40 + },
  41 + {
  42 + title: '操作时间',
  43 + dataIndex: 'createdTime',
  44 + width: 80,
  45 + format: (_, record) => {
  46 + return moment(record.createdTime).format('YYYY-MM-DD');
  47 + },
  48 + },
  49 +];
  50 +
  51 +// 分页查询
  52 +export const searchFormSchema: FormSchema[] = [
  53 + {
  54 + field: 'actionType',
  55 + label: '操作类型',
  56 + component: 'Select',
  57 + componentProps: {
  58 + options: [
  59 + { label: 'ACTIVATED', value: 'ACTIVATED' },
  60 + { label: 'ADDED', value: 'ADDED' },
  61 + { label: 'ALARM_ACK', value: 'ALARM_ACK' },
  62 + { label: 'ALARM_CLEAR', value: 'ALARM_CLEAR' },
  63 + ],
  64 + },
  65 + colProps: { span: 6 },
  66 + },
  67 + {
  68 + field: 'queryTime',
  69 + label: '查询时间',
  70 + component: 'RangePicker',
  71 + componentProps: {
  72 + showTime: {
  73 + defaultValue: [moment('00:00:00', 'HH:mm:ss'), moment('23:59:59', 'HH:mm:ss')],
  74 + },
  75 + },
  76 + colProps: { span: 6 },
  77 + },
  78 +];
  79 +
  80 +// 详情配置
  81 +export const formSchema: FormSchema[] = [
  82 + {
  83 + field: 'createdTime',
  84 + label: '操作时间',
  85 + component: 'Input',
  86 + componentProps: {
  87 + disabled: true,
  88 + },
  89 + },
  90 + {
  91 + field: 'tenantName',
  92 + label: '租户名称',
  93 + component: 'Input',
  94 + componentProps: {
  95 + disabled: true,
  96 + },
  97 + },
  98 + {
  99 + field: 'customerName',
  100 + label: '客户名称',
  101 + component: 'Input',
  102 + componentProps: {
  103 + disabled: true,
  104 + },
  105 + },
  106 + {
  107 + field: 'entityType',
  108 + label: '资源类型',
  109 + component: 'Input',
  110 + componentProps: {
  111 + disabled: true,
  112 + },
  113 + },
  114 + {
  115 + field: 'entityName',
  116 + label: '资源名称',
  117 + component: 'Input',
  118 + componentProps: {
  119 + disabled: true,
  120 + },
  121 + },
  122 + {
  123 + field: 'userName',
  124 + label: '操作人员',
  125 + colProps: { span: 24 },
  126 + component: 'Input',
  127 + componentProps: {
  128 + disabled: true,
  129 + },
  130 + },
  131 + {
  132 + field: 'actionType',
  133 + label: '操作类型',
  134 + component: 'Input',
  135 + componentProps: {
  136 + disabled: true,
  137 + },
  138 + },
  139 + {
  140 + field: 'actionStatus',
  141 + label: '操作状态',
  142 + component: 'Input',
  143 + componentProps: {
  144 + disabled: true,
  145 + },
  146 + },
  147 + {
  148 + field: 'actionData',
  149 + label: '操作数据',
  150 + component: 'InputTextArea',
  151 + componentProps: {
  152 + disabled: true,
  153 + autosize: true,
  154 + allowClear: false,
  155 + },
  156 + },
  157 + {
  158 + field: 'actionFailureDetails',
  159 + label: '失败信息',
  160 + component: 'InputTextArea',
  161 + componentProps: {
  162 + disabled: true,
  163 + autosize: true,
  164 + allowClear: false,
  165 + },
  166 + },
  167 +];
... ...
  1 +<template>
  2 + <div>
  3 + <BasicTable :clickToRowSelect="false" @register="registerTable">
  4 + <template #toolbar> </template>
  5 + <template #action="{ record }">
  6 + <TableAction
  7 + :actions="[
  8 + {
  9 + label: '详情',
  10 + auth: 'api:yt:admin:viewFeedBack',
  11 + icon: 'clarity:note-edit-line',
  12 + onClick: handleViewDetail.bind(null, record),
  13 + },
  14 + ]"
  15 + />
  16 + </template>
  17 + </BasicTable>
  18 + <OperateDrawer @register="registerDrawer" @success="handleSuccess" />
  19 + </div>
  20 +</template>
  21 +
  22 +<script lang="ts">
  23 + import { defineComponent } from 'vue';
  24 + import { BasicTable, useTable, TableAction } from '/@/components/Table';
  25 + import { useDrawer } from '/@/components/Drawer';
  26 + import OperateDrawer from './OperateDrawer.vue';
  27 + import { getOperatePage } from '/@/api/log/logManager';
  28 + import { searchFormSchema, columns } from './config.data';
  29 + import { useModal } from '/@/components/Modal';
  30 +
  31 + export default defineComponent({
  32 + components: {
  33 + BasicTable,
  34 + TableAction,
  35 + OperateDrawer,
  36 + },
  37 + setup() {
  38 + const [registerModal] = useModal();
  39 + const [registerTable, { reload }] = useTable({
  40 + title: '操作日志列表',
  41 + api: getOperatePage,
  42 + columns,
  43 + showIndexColumn: false,
  44 + clickToRowSelect: false,
  45 + formConfig: {
  46 + labelWidth: 120,
  47 + schemas: searchFormSchema,
  48 + fieldMapToTime: [['queryTime', ['startTime', 'endTime'], 'YYYY-MM-DD HH:mm:ss']],
  49 + },
  50 + useSearchForm: true,
  51 + showTableSetting: true,
  52 + bordered: true,
  53 + rowKey: 'id',
  54 + actionColumn: {
  55 + width: 200,
  56 + title: '操作',
  57 + dataIndex: 'action',
  58 + slots: { customRender: 'action' },
  59 + fixed: 'right',
  60 + },
  61 + });
  62 + // 弹框
  63 + const [registerDrawer, { openDrawer }] = useDrawer();
  64 +
  65 + // 刷新
  66 + const handleSuccess = () => {
  67 + reload();
  68 + };
  69 +
  70 + const handleViewDetail = (record) => {
  71 + openDrawer(true, {
  72 + isUpdate: true,
  73 + record,
  74 + });
  75 + };
  76 + return {
  77 + handleSuccess,
  78 + registerTable,
  79 + registerDrawer,
  80 + handleViewDetail,
  81 + registerModal,
  82 + };
  83 + },
  84 + });
  85 +</script>
... ...
  1 +<template>
  2 + <BasicDrawer v-bind="$attrs" @register="registerDrawer" title="登陆登出日志详情" width="30%">
  3 + <BasicForm @register="registerForm" />
  4 + </BasicDrawer>
  5 +</template>
  6 +<script lang="ts">
  7 + import { defineComponent } from 'vue';
  8 + import { BasicForm, useForm } from '/@/components/Form';
  9 + import { formSchema } from './config.data';
  10 + import { BasicDrawer, useDrawerInner } from '/@/components/Drawer';
  11 + import { getLogManageDetail } from '/@/api/log/logManager';
  12 +
  13 + export default defineComponent({
  14 + name: 'ContactDrawer',
  15 + components: { BasicDrawer, BasicForm },
  16 + emits: ['success', 'register'],
  17 + setup(_) {
  18 + const [registerForm, { setFieldsValue, resetFields }] = useForm({
  19 + labelWidth: 120,
  20 + schemas: formSchema,
  21 + showActionButtonGroup: false,
  22 + });
  23 +
  24 + const [registerDrawer, { setDrawerProps }] = useDrawerInner(async (data) => {
  25 + await resetFields();
  26 + setDrawerProps({ confirmLoading: false });
  27 + const res = await getLogManageDetail(data.record.id);
  28 + const actionData = JSON.stringify(res.actionData);
  29 + await setFieldsValue(res || data.record);
  30 + await setFieldsValue({ actionData });
  31 + });
  32 + return {
  33 + registerDrawer,
  34 + registerForm,
  35 + };
  36 + },
  37 + });
  38 +</script>
... ...
  1 +import { BasicColumn, FormSchema } from '/@/components/Table';
  2 +import moment from 'moment';
  3 +
  4 +// 表格数据
  5 +export const columns: BasicColumn[] = [
  6 + {
  7 + title: '租户名称',
  8 + dataIndex: 'tenantName',
  9 + width: 120,
  10 + },
  11 + {
  12 + title: '客户名称',
  13 + dataIndex: 'customerName',
  14 + width: 120,
  15 + },
  16 + {
  17 + title: '资源类型',
  18 + dataIndex: 'entityType',
  19 + width: 180,
  20 + },
  21 + {
  22 + title: '资源名称',
  23 + dataIndex: 'entityName',
  24 + width: 180,
  25 + },
  26 + {
  27 + title: '操作人员',
  28 + dataIndex: 'userName',
  29 + width: 180,
  30 + },
  31 + {
  32 + title: '操作类型',
  33 + dataIndex: 'actionType',
  34 + width: 180,
  35 + },
  36 + {
  37 + title: '操作状态',
  38 + dataIndex: 'actionStatus',
  39 + width: 180,
  40 + },
  41 + {
  42 + title: '操作时间',
  43 + dataIndex: 'createdTime',
  44 + width: 80,
  45 + format: (_, record) => {
  46 + return moment(record.createdTime).format('YYYY-MM-DD');
  47 + },
  48 + },
  49 +];
  50 +
  51 +// 分页查询
  52 +export const searchFormSchema: FormSchema[] = [
  53 + {
  54 + field: 'actionType',
  55 + label: '操作类型',
  56 + component: 'Select',
  57 + componentProps: {
  58 + options: [
  59 + { label: 'LOGIN', value: 'LOGIN' },
  60 + { label: 'LOGOUT', value: 'LOGOUT' },
  61 + ],
  62 + },
  63 + colProps: { span: 6 },
  64 + },
  65 + {
  66 + field: 'queryTime',
  67 + label: '查询时间',
  68 + component: 'RangePicker',
  69 + componentProps: {
  70 + showTime: {
  71 + defaultValue: [moment('00:00:00', 'HH:mm:ss'), moment('23:59:59', 'HH:mm:ss')],
  72 + },
  73 + },
  74 + colProps: { span: 6 },
  75 + },
  76 +];
  77 +
  78 +// 详情配置
  79 +export const formSchema: FormSchema[] = [
  80 + {
  81 + field: 'createdTime',
  82 + label: '操作时间',
  83 + component: 'Input',
  84 + componentProps: {
  85 + disabled: true,
  86 + },
  87 + },
  88 + {
  89 + field: 'tenantName',
  90 + label: '租户名称',
  91 + component: 'Input',
  92 + componentProps: {
  93 + disabled: true,
  94 + },
  95 + },
  96 + {
  97 + field: 'customerName',
  98 + label: '客户名称',
  99 + component: 'Input',
  100 + componentProps: {
  101 + disabled: true,
  102 + },
  103 + },
  104 + {
  105 + field: 'entityType',
  106 + label: '资源类型',
  107 + component: 'Input',
  108 + componentProps: {
  109 + disabled: true,
  110 + },
  111 + },
  112 + {
  113 + field: 'entityName',
  114 + label: '资源名称',
  115 + component: 'Input',
  116 + componentProps: {
  117 + disabled: true,
  118 + },
  119 + },
  120 + {
  121 + field: 'userName',
  122 + label: '操作人员',
  123 + colProps: { span: 24 },
  124 + component: 'Input',
  125 + componentProps: {
  126 + disabled: true,
  127 + },
  128 + },
  129 + {
  130 + field: 'actionType',
  131 + label: '操作类型',
  132 + component: 'Input',
  133 + componentProps: {
  134 + disabled: true,
  135 + },
  136 + },
  137 + {
  138 + field: 'actionStatus',
  139 + label: '操作状态',
  140 + component: 'Input',
  141 + componentProps: {
  142 + disabled: true,
  143 + },
  144 + },
  145 + {
  146 + field: 'actionData',
  147 + label: '操作数据',
  148 + component: 'InputTextArea',
  149 + componentProps: {
  150 + disabled: true,
  151 + autosize: true,
  152 + allowClear: false,
  153 + },
  154 + },
  155 + {
  156 + field: 'actionFailureDetails',
  157 + label: '失败信息',
  158 + component: 'InputTextArea',
  159 + componentProps: {
  160 + disabled: true,
  161 + autosize: true,
  162 + allowClear: false,
  163 + },
  164 + },
  165 +];
... ...
  1 +<template>
  2 + <div>
  3 + <BasicTable :clickToRowSelect="false" @register="registerTable">
  4 + <template #toolbar> </template>
  5 + <template #action="{ record }">
  6 + <TableAction
  7 + :actions="[
  8 + {
  9 + label: '详情',
  10 + auth: 'api:yt:admin:viewFeedBack',
  11 + icon: 'clarity:note-edit-line',
  12 + onClick: handleViewDetail.bind(null, record),
  13 + },
  14 + ]"
  15 + />
  16 + </template>
  17 + </BasicTable>
  18 + <UserDrawer @register="registerDrawer" @success="handleSuccess" />
  19 + </div>
  20 +</template>
  21 +
  22 +<script lang="ts">
  23 + import { defineComponent } from 'vue';
  24 + import { BasicTable, useTable, TableAction } from '/@/components/Table';
  25 + import { useDrawer } from '/@/components/Drawer';
  26 + import UserDrawer from './UserDrawer.vue';
  27 + import { getUserPage } from '/@/api/log/logManager';
  28 + import { searchFormSchema, columns } from './config.data';
  29 + import { useModal } from '/@/components/Modal';
  30 +
  31 + export default defineComponent({
  32 + components: {
  33 + BasicTable,
  34 + TableAction,
  35 + UserDrawer,
  36 + },
  37 + setup() {
  38 + const [registerModal] = useModal();
  39 + const [registerTable, { reload }] = useTable({
  40 + title: '登录登出日志列表',
  41 + api: getUserPage,
  42 + columns,
  43 + showIndexColumn: false,
  44 + clickToRowSelect: false,
  45 + formConfig: {
  46 + labelWidth: 120,
  47 + schemas: searchFormSchema,
  48 + fieldMapToTime: [['queryTime', ['startTime', 'endTime'], 'YYYY-MM-DD HH:mm:ss']],
  49 + },
  50 + useSearchForm: true,
  51 + showTableSetting: true,
  52 + bordered: true,
  53 + rowKey: 'id',
  54 + actionColumn: {
  55 + width: 200,
  56 + title: '操作',
  57 + dataIndex: 'action',
  58 + slots: { customRender: 'action' },
  59 + fixed: 'right',
  60 + },
  61 + });
  62 + // 弹框
  63 + const [registerDrawer, { openDrawer }] = useDrawer();
  64 +
  65 + // 刷新
  66 + const handleSuccess = () => {
  67 + reload();
  68 + };
  69 +
  70 + const handleViewDetail = (record) => {
  71 + openDrawer(true, {
  72 + isUpdate: true,
  73 + record,
  74 + });
  75 + };
  76 + return {
  77 + handleSuccess,
  78 + registerTable,
  79 + registerDrawer,
  80 + handleViewDetail,
  81 + registerModal,
  82 + };
  83 + },
  84 + });
  85 +</script>
... ...