146 lines
3.9 KiB
Vue
146 lines
3.9 KiB
Vue
<script setup lang="tsx">
|
|
import type { TableProps, TableRowData } from 'tdesign-vue-next';
|
|
import BackButton from '~/components/BackButton.vue';
|
|
import { TButton } from '#components';
|
|
const userId = useRoute().params.userId as string;
|
|
const store = useArticleStore();
|
|
const avatarURL = ref('');
|
|
const { currentManageUser, currentUserPagination, currentUserArticleList } =
|
|
storeToRefs(store);
|
|
onMounted(async () => {
|
|
try {
|
|
await store.getCurrentManageUserInfo(userId);
|
|
avatarURL.value = (await store.getCurrentManageUserAvatar(true))!;
|
|
await store.getCurrentManageUserArticleTotal();
|
|
await store.getCurrentManageUserArticleList();
|
|
} catch (e) {
|
|
await MessagePlugin.error(e as string);
|
|
}
|
|
});
|
|
const columns = ref<TableProps['columns']>([
|
|
{
|
|
colKey: 'index',
|
|
title: '序号',
|
|
cell: (_, { rowIndex }: { rowIndex: number }) => (
|
|
<div>
|
|
{(currentUserPagination.value!.current! - 1) *
|
|
currentUserPagination.value!.pageSize! +
|
|
rowIndex +
|
|
1}
|
|
</div>
|
|
),
|
|
},
|
|
{
|
|
colKey: 'title',
|
|
title: '文章标题',
|
|
},
|
|
{
|
|
colKey: 'mainIdea',
|
|
title: '文章大意',
|
|
},
|
|
{
|
|
colKey: 'operator',
|
|
title: '操作',
|
|
width: '10%',
|
|
cell: (_, { row }) =>
|
|
h('div', { class: 'w-48 flex flex-row justify-evenly' }, [
|
|
h(
|
|
TButton,
|
|
{
|
|
onClick: () => checkArticle(row),
|
|
},
|
|
{ default: () => '查看' },
|
|
),
|
|
h(
|
|
TButton,
|
|
{
|
|
onClick: () => modifyArticle(row),
|
|
},
|
|
{ default: () => '修改' },
|
|
),
|
|
h(
|
|
TButton,
|
|
{
|
|
onClick: () => deleteArticle(row),
|
|
},
|
|
{ default: () => '删除' },
|
|
),
|
|
]),
|
|
},
|
|
]);
|
|
|
|
function modifyArticle(row: TableRowData) {
|
|
store.currentArticle = {
|
|
id: row.id,
|
|
title: row.title,
|
|
mainIdea: row.mainIdea,
|
|
content: row.content,
|
|
};
|
|
useRouter().push(`/base/articleManage/${userId}/modifyArticle`);
|
|
}
|
|
function checkArticle(row: TableRowData) {
|
|
store.currentArticle = {
|
|
id: row.id,
|
|
title: row.title,
|
|
mainIdea: row.mainIdea,
|
|
content: row.content,
|
|
};
|
|
useRouter().push(`/base/articleManage/${userId}/checkArticle`);
|
|
}
|
|
async function deleteArticle(row: TableRowData) {
|
|
const { id } = row;
|
|
await store.deleteArticle(id);
|
|
await store.getCurrentManageUserArticleTotal();
|
|
await store.getCurrentManageUserArticleList();
|
|
}
|
|
async function pageChange(x: { current: number; pageSize: number }) {
|
|
if (currentUserPagination.value) {
|
|
currentUserPagination.value.current = x.current;
|
|
currentUserPagination.value.pageSize = x.pageSize;
|
|
await store.getCurrentManageUserArticleList();
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<template>
|
|
<BasicInfo
|
|
:avatar-url="avatarURL"
|
|
:show-welcome="false"
|
|
:data="currentManageUser"
|
|
>
|
|
<template #header>
|
|
<back-button class="ml-3" />
|
|
</template>
|
|
<div
|
|
class="h-full bg-white rounded-xl m-2 p-6 border-2 dark:bg-neutral-800 dark:border-zinc-600"
|
|
>
|
|
<div class="p-4 pt-0">
|
|
<t-button
|
|
@click="
|
|
() => {
|
|
store.currentArticle = {
|
|
id: 0,
|
|
title: '',
|
|
mainIdea: '',
|
|
content: '',
|
|
};
|
|
useRouter().push(`/base/articleManage/${userId}/addNewArticle`);
|
|
}
|
|
"
|
|
>
|
|
添加新文章
|
|
</t-button>
|
|
</div>
|
|
<super-table
|
|
v-model:pagination="currentUserPagination"
|
|
:data="currentUserArticleList"
|
|
:columns="columns"
|
|
:loading="false"
|
|
@page-change="pageChange"
|
|
></super-table>
|
|
</div>
|
|
</BasicInfo>
|
|
</template>
|
|
|
|
<style scoped lang="less"></style>
|