Files
school-developer/src/views/stuwork/dormbuildingmanger/index.vue
2026-01-15 01:15:07 +08:00

78 lines
2.1 KiB
Vue

<template>
<div class="layout-padding">
<div class="layout-padding-auto layout-padding-view">
<!-- 表格 -->
<el-table
:data="state.dataList"
v-loading="state.loading"
border
:cell-style="tableStyle.cellStyle"
:header-cell-style="tableStyle.headerCellStyle"
@sort-change="sortChangeHandle">
<el-table-column type="index" label="序号" width="60" align="center" />
<el-table-column prop="buildingNo" label="楼号" show-overflow-tooltip align="center" />
<el-table-column prop="username" label="管理员工号" show-overflow-tooltip align="center" />
<el-table-column label="操作" width="100" align="center" fixed="right">
<template #default="scope">
<el-button
icon="Delete"
text
type="danger"
@click="handleDelete(scope.row)">
删除
</el-button>
</template>
</el-table-column>
</el-table>
<!-- 分页 -->
<pagination
@size-change="sizeChangeHandle"
@current-change="currentChangeHandle"
v-bind="state.pagination" />
</div>
</div>
</template>
<script setup lang="ts" name="DormBuildingManger">
import { reactive } from 'vue'
import { BasicTableProps, useTable } from "/@/hooks/table";
import { fetchList, delObjs } from "/@/api/stuwork/dormbuildingmanger";
import { useMessage, useMessageBox } from "/@/hooks/message";
// 配置 useTable
const state: BasicTableProps = reactive<BasicTableProps>({
queryForm: {},
pageList: fetchList,
props: {
item: 'records',
totalCount: 'total'
},
createdIsNeed: true
})
// table hook
const {
getDataList,
currentChangeHandle,
sizeChangeHandle,
sortChangeHandle,
tableStyle
} = useTable(state)
// 删除
const handleDelete = async (row: any) => {
try {
await useMessageBox().confirm('确定要删除该宿舍管理员吗?')
await delObjs([row.id])
useMessage().success('删除成功')
getDataList()
} catch (err: any) {
if (err !== 'cancel') {
useMessage().error(err.msg || '删除失败')
}
}
}
</script>