feat: 优化分类管理页面和登陆日志页面

master
luoer 2023-11-23 17:35:08 +08:00
parent 261f2490ec
commit 7148e464be
2 changed files with 36 additions and 29 deletions

View File

@ -12,27 +12,28 @@ import { listToTree } from '@/utils/listToTree';
const { component: CategoryTable } = useTable({ const { component: CategoryTable } = useTable({
columns: [ columns: [
{ {
title: '名称', title: '分类名称',
dataIndex: 'title', dataIndex: 'title',
width: 240,
render: ({ record }) => ( render: ({ record }) => (
<div class="flex flex-col overflow-hidden"> <div class="flex flex-col overflow-hidden">
<span>{record.title}</span> <span>
<span class="text-gray-400 text-xs truncate">#{record.slug}</span> {record.title}
<span class="text-gray-400 text-xs truncate ml-2">@{record.slug}</span>
</span>
<div class="text-gray-400 text-xs truncate mt-0.5">{record.description}</div>
</div> </div>
), ),
}, },
{
title: '描述',
dataIndex: 'description',
},
useCreateColumn(), useCreateColumn(),
useUpdateColumn(), useUpdateColumn(),
{ {
type: 'button', type: 'button',
title: '操作', title: '操作',
width: 120, width: 180,
buttons: [ buttons: [
{
text: '文章列表',
},
{ {
type: 'modify', type: 'modify',
text: '修改', text: '修改',
@ -67,15 +68,18 @@ const { component: CategoryTable } = useTable({
items: [ items: [
{ {
field: 'title', field: 'title',
label: '分类名称', label: '名称',
setter: 'input', setter: 'input',
required: true, required: true,
}, },
{ {
field: 'slug', field: 'slug',
label: '分类别名', label: '别名',
setter: 'input', setter: 'input',
required: true, required: true,
setterProps: {
placeholder: '只包含字母、小数和连字符'
}
}, },
{ {
field: 'description', field: 'description',

View File

@ -35,34 +35,37 @@ const { component: LoginLogTable } = useTable({
return api.log.getLoginLogs(model); return api.log.getLoginLogs(model);
}, },
columns: [ columns: [
{ // {
title: '登陆账号', // title: '',
dataIndex: 'nickname', // dataIndex: 'nickname',
width: 140, // width: 140,
render({ record }) { // render({ record }) {
return ( // return (
<div class="overflow-hidden"> // <div class="overflow-hidden">
<i class="icon-park-outline-user mr-2"></i> // <i class="icon-park-outline-user mr-2"></i>
<span>{record.nickname}</span> // <span>{record.nickname}</span>
</div> // </div>
); // );
}, // },
}, // },
{ {
title: '操作描述', title: '操作描述',
dataIndex: 'description', dataIndex: 'description',
render: ({ record: { status, description } }) => { render: ({ record }) => {
return ( return (
<span> <div class="flex items-center gap-2">
<span <span
class={ class={
status === null || status record.status === null || record.status
? 'text-base text-green-500 icon-park-outline-check-one mr-2' ? 'text-base text-green-500 icon-park-outline-check-one mr-2'
: 'text-base text-red-500 icon-park-outline-close-one mr-2' : 'text-base text-red-500 icon-park-outline-close-one mr-2'
} }
></span> ></span>
{description} <div>
</span> <div>{record.nickname}</div>
<div class="text-xs text-gray-400">{record.description}</div>
</div>
</div>
); );
}, },
}, },