Files
ss-crm-manage-web/src/views/SchoolManagement/School/index.vue
2024-07-01 14:49:13 +08:00

161 lines
4.2 KiB
Vue

<template>
<div>
<el-form :model="searchForm" label-width="0" inline>
<el-form-item>
<el-input
v-model="searchForm.schoolName"
class="!w-240px"
placeholder="请输入驾校名称"
@keyup.enter="handleQuery"
/>
</el-form-item>
<el-form-item>
<el-button @click="handleQuery" v-hasPermi="['school:school:search']"> 搜索 </el-button>
<el-button @click="resetQuery" v-hasPermi="['school:school:reset']"> 重置 </el-button>
<el-button
plain
type="primary"
@click="openForm('create')"
v-hasPermi="['school:school:add']"
>
新增
</el-button>
</el-form-item>
</el-form>
<!-- 列表 -->
<el-table v-loading="loading" :data="tableList">
<el-table-column label="驾校名称" prop="schoolName" />
<el-table-column label="负责人" prop="leader" />
<el-table-column label="联系方式" prop="phone" />
<el-table-column label="状态">
<template #default="{ row }">
<el-switch
v-model="row.status"
:active-value="0"
:inactive-value="1"
:disabled="!checkPermi(['school:school:update'])"
@change="changeStatus(row)"
/>
</template>
</el-table-column>
<el-table-column label="创建时间" prop="createTime" :formatter="dateFormatter" />
<el-table-column fixed="right" label="操作" width="150">
<template #default="{ row }">
<el-button
link
type="primary"
@click="openForm(update, row.schoolId)"
v-hasPermi="['school:school:update']"
>
修改
</el-button>
<el-button
link
type="danger"
@click="handleDelete(row.schoolId)"
v-hasPermi="['school:school:delete']"
>
删除
</el-button>
</template>
</el-table-column>
</el-table>
<!-- 分页 -->
<Pagination
v-model:limit="searchForm.pageSize"
v-model:page="searchForm.pageNo"
:total="total"
@pagination="getList"
/>
<DialogSchool ref="schoolDialog" @success="handleQuery" />
</div>
</template>
<script setup schoolName="School">
import DialogSchool from './Comp/DialogSchool.vue'
import * as api from '@/api/school/sch'
import { checkPermi } from '@/utils/permission'
import { CommonStatusEnum } from '@/utils/constants'
import { dateFormatter } from '@/utils/formatTime'
const message = useMessage() // 消息弹窗
const { t } = useI18n() // 国际化
const searchForm = ref({
schoolName: '',
pageNo: 1,
pageSize: 20
})
const loading = ref(false)
const total = ref(0)
const tableList = ref([])
const schoolDialog = ref()
function resetQuery() {
searchForm.value = {
schoolName: '',
pageSize: 20,
pageNo: 1
}
getList()
}
function handleQuery() {
searchForm.value.pageNo = 1
getList()
}
async function getList() {
loading.value = true
try {
const data = await api.getSchoolPage(searchForm.value)
tableList.value = data.list
total.value = data.total
} finally {
loading.value = false
}
}
function openForm(type, row = null) {
schoolDialog.value.open(type, row)
}
async function handleDelete(id) {
try {
// 删除的二次确认
await message.delConfirm()
// 发起删除
await api.deleteSchool(id)
message.success(t('common.delSuccess'))
// 刷新列表
await getList()
} catch {}
}
async function changeStatus(row) {
try {
// 修改状态的二次确认
const text = row.status === CommonStatusEnum.ENABLE ? '启用' : '停用'
await message.confirm('确认要"' + text + '""' + row.schoolName + '"驾校吗?')
// 发起修改状态
await api.updateSchoolStatus(row.schoolId, row.status)
message.success('修改成功')
// 刷新列表
await getList()
} catch {
// 取消后,进行恢复按钮
row.status =
row.status === CommonStatusEnum.ENABLE ? CommonStatusEnum.DISABLE : CommonStatusEnum.ENABLE
}
}
/** 初始化 **/
onMounted(async () => {
await getList()
})
</script>
<style lang="scss" scoped></style>