107 lines
2.8 KiB
Vue
107 lines
2.8 KiB
Vue
<template>
|
|
<div>
|
|
<BasicTable @register="registerTable">
|
|
<template #toolbar>
|
|
<a-button type="primary" @click="handleCreate"> 新增链接 </a-button>
|
|
</template>
|
|
<template #bodyCell="{ column, record }">
|
|
<template v-if="column.key === 'action'">
|
|
<div class="flex items-center justify-center">
|
|
<TableAction
|
|
:actions="[
|
|
{ label: '编辑', onClick: handleEdit.bind(null, record) },
|
|
{
|
|
label: '删除',
|
|
popConfirm: {
|
|
title: '是否确认删除',
|
|
placement: 'topRight',
|
|
confirm: handleDelete.bind(null, record),
|
|
},
|
|
},
|
|
]"
|
|
/>
|
|
</div>
|
|
</template>
|
|
</template>
|
|
</BasicTable>
|
|
|
|
<LinksDrawer @register="registerModal" @success="handleSuccess" />
|
|
</div>
|
|
</template>
|
|
|
|
<script lang="ts">
|
|
import { BasicTable, useTable, TableAction } from '/@/components/Table'
|
|
import { reactive, toRefs } from 'vue'
|
|
import { getFriendinks, deleteFriendinks } from '/@/api/sys/user'
|
|
import { columns, searchFormSchema } from './links.data'
|
|
import { useModal } from '/@/components/Modal'
|
|
import LinksDrawer from './LinksDrawer.vue'
|
|
import { message } from 'ant-design-vue'
|
|
export default {
|
|
components: {
|
|
BasicTable,
|
|
LinksDrawer,
|
|
TableAction,
|
|
},
|
|
setup() {
|
|
const state = reactive({})
|
|
const [registerModal, { openModal }] = useModal()
|
|
const [registerTable, { reload }] = useTable({
|
|
title: '账号列表',
|
|
api: async (e) => {
|
|
const { data, meta } = await getFriendinks({ ...e })
|
|
return {
|
|
items: data,
|
|
total: meta?.total,
|
|
}
|
|
},
|
|
rowKey: 'id',
|
|
columns,
|
|
formConfig: {
|
|
labelWidth: 80,
|
|
schemas: searchFormSchema,
|
|
},
|
|
useSearchForm: true,
|
|
showTableSetting: true,
|
|
bordered: true,
|
|
showIndexColumn: true,
|
|
})
|
|
|
|
const handleSuccess = () => {
|
|
message.success('操作成功')
|
|
reload()
|
|
}
|
|
|
|
const handleCreate = () => {
|
|
openModal(true, {
|
|
id: false,
|
|
})
|
|
}
|
|
|
|
const handleEdit = (record: Recordable) => {
|
|
openModal(true, {
|
|
...record,
|
|
isUpdate: true,
|
|
})
|
|
}
|
|
const handleDelete = async (record: Recordable) => {
|
|
await deleteFriendinks(record.id)
|
|
message.success('删除成功')
|
|
reload()
|
|
}
|
|
|
|
return {
|
|
handleEdit,
|
|
handleDelete,
|
|
registerTable,
|
|
registerModal,
|
|
handleSuccess,
|
|
...toRefs(state),
|
|
handleCreate,
|
|
}
|
|
},
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped></style>
|