feat: 登陆日志添加提示

master
luoer 2023-09-22 17:31:09 +08:00
parent a1002f8518
commit 446698c27e
3 changed files with 39 additions and 34 deletions

View File

@ -1,6 +1,15 @@
<template>
<BreadPage>
<Table v-bind="table"></Table>
<template #content>
<div class="p-4">
<a-alert :closable="true">
仅展示近 90 天内的数据如需查看更多数据请联系管理员
</a-alert>
<div class="bg-white p-4 mt-2">
<Table v-bind="table"></Table>
</div>
</div>
</template>
</BreadPage>
</template>
@ -27,7 +36,7 @@ const table = useTable({
return (
<span>
<Tag color={status === null || status ? "green" : "red"} class="mr-2">
{ status === null || status ? "成功" : "失败" }
{status === null || status ? "成功" : "失败"}
</Tag>
{description}
</span>
@ -65,11 +74,11 @@ const table = useTable({
type: "input",
required: false,
nodeProps: {
placeholder: '请输入登陆账号',
placeholder: "请输入登陆账号",
},
itemProps: {
hideLabel: true,
}
},
},
],
},

View File

@ -1,21 +1,20 @@
<template>
<BreadPage>
<template #content>
<a-tabs default-active-key="1" size="large" class="bg-white m-4">
<a-tab-pane key="1" title="全部">
<Table v-bind="table" class="px-4 pb-4">
<template #action>
<a-button status="danger" type="outline" :disabled="true">
<template #icon>
<i class="icon-park-outline-delete"></i>
</template>
删除</a-button>
</template>
</Table>
</a-tab-pane>
<a-tab-pane key="2" title="已通过(12)"></a-tab-pane>
</a-tabs>
</template>
<a-radio-group type="button" v-model="type">
<a-radio value="all">全部</a-radio>
<a-radio value="all1">已激活</a-radio>
<a-radio value="all2">未激活</a-radio>
</a-radio-group>
<Table v-bind="table" class="pt-4">
<template #action>
<a-button status="danger" type="outline" :disabled="true">
<template #icon>
<i class="icon-park-outline-delete"></i>
</template>
删除
</a-button>
</template>
</Table>
</BreadPage>
</template>
@ -23,7 +22,8 @@
import { api } from "@/api";
import { Table, useTable } from "@/components";
import { dayjs } from "@/libs/dayjs";
import { Avatar } from "@arco-design/web-vue";
const type = ref("all");
const table = useTable({
data: async (model, paging) => {
@ -36,16 +36,12 @@ const table = useTable({
width: 180,
render: ({ record }) => (
<div class="flex items-center">
<Avatar size={32}>
<img src={record.avatar || 'https://github.com/juetan.png'} alt="" />
</Avatar>
<a-avatar size={40}>
<img src={record.avatar || "https://github.com/juetan.png"} alt="" />
</a-avatar>
<span class="ml-2 flex-1 flex flex-col overflow-hidden">
<span>
{record.nickname}
</span>
<span class="text-gray-400 text-xs truncate">
ID: {record.username}
</span>
<span>{record.nickname}</span>
<span class="text-gray-400 text-xs truncate">ID: {record.username}</span>
</span>
</div>
),
@ -75,7 +71,7 @@ const table = useTable({
text: "修改",
},
{
text: '设置密码',
text: "设置密码",
},
{
type: "delete",
@ -151,9 +147,9 @@ const table = useTable({
type: "custom",
component: ({ field, model }) => {
return (
<Avatar size={40}>
<a-avatar size={40}>
<img src={model?.[field]} alt="" />
</Avatar>
</a-avatar>
);
},
},

View File

@ -2,7 +2,7 @@
// @blue-6: #09f;
@arcoblue-6:#3b9;
@arcoblue-6:#08f;
body {
.arco-layout-sider {