fix: 赛事操作日志页面优化
This commit is contained in:
@@ -7,7 +7,7 @@ import {
|
|||||||
Form,
|
Form,
|
||||||
Space,
|
Space,
|
||||||
Select,
|
Select,
|
||||||
Tooltip,
|
Modal,
|
||||||
Pagination,
|
Pagination,
|
||||||
} from 'ant-design-vue';
|
} from 'ant-design-vue';
|
||||||
import { useLogModel, ACTION_TYPE_OPTIONS, ACTION_SOURCE_OPTIONS } from './model/useLogModel';
|
import { useLogModel, ACTION_TYPE_OPTIONS, ACTION_SOURCE_OPTIONS } from './model/useLogModel';
|
||||||
@@ -24,6 +24,7 @@ const LogContentCell = defineComponent({
|
|||||||
setup(props) {
|
setup(props) {
|
||||||
const textRef = ref<HTMLElement | null>(null);
|
const textRef = ref<HTMLElement | null>(null);
|
||||||
const [overflow, setOverflow] = useState(false);
|
const [overflow, setOverflow] = useState(false);
|
||||||
|
const [modalOpen, setModalOpen] = useState(false);
|
||||||
const checkOverflow = () => {
|
const checkOverflow = () => {
|
||||||
const el = textRef.value;
|
const el = textRef.value;
|
||||||
if (el) setOverflow(el.scrollHeight > el.clientHeight);
|
if (el) setOverflow(el.scrollHeight > el.clientHeight);
|
||||||
@@ -47,10 +48,23 @@ const LogContentCell = defineComponent({
|
|||||||
{raw}
|
{raw}
|
||||||
</div>
|
</div>
|
||||||
{overflow.value ? (
|
{overflow.value ? (
|
||||||
<Tooltip title={raw} placement="topLeft">
|
<span class="log-content-view" onClick={() => setModalOpen(true)}>
|
||||||
<span class="log-content-view">查看</span>
|
查看
|
||||||
</Tooltip>
|
</span>
|
||||||
) : null}
|
) : null}
|
||||||
|
<Modal
|
||||||
|
visible={modalOpen.value}
|
||||||
|
title="操作内容"
|
||||||
|
footer={null}
|
||||||
|
width={600}
|
||||||
|
centered
|
||||||
|
destroyOnClose
|
||||||
|
onCancel={() => setModalOpen(false)}
|
||||||
|
>
|
||||||
|
<div style={{ whiteSpace: 'pre-wrap', wordBreak: 'break-all', lineHeight: 1.8 }}>
|
||||||
|
{raw}
|
||||||
|
</div>
|
||||||
|
</Modal>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
@@ -93,7 +107,7 @@ export default defineComponent({
|
|||||||
record: any;
|
record: any;
|
||||||
index: number;
|
index: number;
|
||||||
}) => {
|
}) => {
|
||||||
if (column.key === 'content') {
|
if (column.key === 'obj') {
|
||||||
const raw = text || '';
|
const raw = text || '';
|
||||||
return raw ? <LogContentCell text={raw} /> : <span>--</span>;
|
return raw ? <LogContentCell text={raw} /> : <span>--</span>;
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1,4 +1,5 @@
|
|||||||
import { Image, Space } from 'ant-design-vue';
|
import { Image, Space } from 'ant-design-vue';
|
||||||
|
import { EyeOutlined } from '@ant-design/icons-vue';
|
||||||
import { StatusTag } from '@/components';
|
import { StatusTag } from '@/components';
|
||||||
import { STATUS_MAP } from './config';
|
import { STATUS_MAP } from './config';
|
||||||
|
|
||||||
@@ -77,6 +78,7 @@ export function useUserColumns() {
|
|||||||
width={40}
|
width={40}
|
||||||
height={40}
|
height={40}
|
||||||
style={{ objectFit: 'cover', borderRadius: '4px', cursor: 'pointer' }}
|
style={{ objectFit: 'cover', borderRadius: '4px', cursor: 'pointer' }}
|
||||||
|
previewMask={() => <EyeOutlined />}
|
||||||
/>
|
/>
|
||||||
))}
|
))}
|
||||||
</Space>
|
</Space>
|
||||||
|
|||||||
@@ -117,7 +117,7 @@ export function useUserModel() {
|
|||||||
|
|
||||||
Modal.confirm({
|
Modal.confirm({
|
||||||
title: `${actionText}确认`,
|
title: `${actionText}确认`,
|
||||||
content: `确认${actionText}用户"${record.realName}"吗?`,
|
content: `确认${actionText}用户"${record.nickname}"吗?`,
|
||||||
okText: '确认',
|
okText: '确认',
|
||||||
cancelText: '取消',
|
cancelText: '取消',
|
||||||
onOk: async () => {
|
onOk: async () => {
|
||||||
|
|||||||
Reference in New Issue
Block a user