驾校

src/views/SchoolManagement/School/index.vue

@@ -1,31 +1,39 @@
 <template>
   <div>
-    <el-form :model="searchForm" ref="searchForm" label-width="0" inline>
+    <el-form :model="searchForm" label-width="0" inline>
       <el-form-item>
         <el-input
-          v-model="searchForm.name"
+          v-model="searchForm.schoolName"
           class="!w-240px"
           placeholder="请输入驾校名称"
           @keyup.enter="handleQuery"
         />
       </el-form-item>
       <el-form-item>
-        <el-button @click="handleQuery"> 搜索 </el-button>
-        <el-button @click="resetQuery"> 重置 </el-button>
-        <el-button plain type="primary" @click="openForm('create')"> 新增 </el-button>
+        <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="name" />
-      <el-table-column label="负责人" prop="" />
-      <el-table-column label="联系方式" prop="" />
+      <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="true"
-            :inactive-value="false"
+            :active-value="0"
+            :inactive-value="1"
+            :disabled="checkPermi(['school:school:update'])"
             @change="changeStatus(row)"
           />
         </template>
@@ -33,15 +41,29 @@
       <el-table-column label="创建时间" prop="" />
       <el-table-column fixed="right" label="操作" width="150">
         <template #default="{ row }">
-          <el-button link type="primary" @click="openForm(update, row)"> 修改 </el-button>
-          <el-button link type="danger" @click="handleDelete(row.id)"> 删除 </el-button>
+          <el-button
+            link
+            type="primary"
+            @click="openForm(update, row)"
+            v-hasPermi="['school:school:update']"
+          >
+            修改
+          </el-button>
+          <el-button
+            link
+            type="danger"
+            @click="handleDelete(row.id)"
+            v-hasPermi="['school:school:delete']"
+          >
+            删除
+          </el-button>
         </template>
       </el-table-column>
     </el-table>
     <!-- 分页 -->
     <Pagination
       v-model:limit="searchForm.pageSize"
-      v-model:page="searchForm.pageNum"
+      v-model:page="searchForm.pageNo"
       :total="total"
       @pagination="getList"
     />
@@ -49,13 +71,16 @@
   </div>
 </template>
 
-<script setup name="School">
+<script setup schoolName="School">
 import DialogSchool from './Comp/DialogSchool.vue'
+import * as api from '@/api/school/sch'
+import { checkPermi } from '@/utils/permission'
+
 const message = useMessage() // 消息弹窗
 
 const searchForm = ref({
-  name: '',
-  pageNum: 1,
+  schoolName: '',
+  pageNo: 1,
   pageSize: 20
 })
 
@@ -67,20 +92,27 @@ const schoolDialog = ref()
 
 function resetQuery() {
   searchForm.value = {
-    name: '',
+    schoolName: '',
     pageSize: 20,
-    pageNum: 1
+    pageNo: 1
   }
   getList()
 }
 
 function handleQuery() {
-  searchForm.value.pageNum = 1
+  searchForm.value.pageNo = 1
   getList()
 }
 
-function getList() {
-  tableList.value = [{ name: '测试' }]
+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) {
@@ -89,20 +121,36 @@ function openForm(type, row = null) {
 
 async function handleDelete(row) {
   try {
-    console.log(row)
     // 删除的二次确认
     await message.delConfirm()
     // 发起删除
-    // await UserApi.deleteUser(row.id)
+    await api.deleteSchool(row.id)
     message.success(t('common.delSuccess'))
     // 刷新列表
     await getList()
   } catch {}
 }
 
-function changeStatus(row) {
-  console.log(row)
+async function changeStatus(row) {
+  try {
+    // 修改状态的二次确认
+    const text = row.status === CommonStatusEnum.ENABLE ? '启用' : '停用'
+    await message.confirm('确认要"' + text + '""' + row.schoolName + '"驾校吗?')
+    // 发起修改状态
+    await api.updateSchoolStatus(row.id, row.status)
+    // 刷新列表
+    await getList()
+  } catch {
+    // 取消后，进行恢复按钮
+    row.status =
+      row.status === CommonStatusEnum.ENABLE ? CommonStatusEnum.DISABLE : CommonStatusEnum.ENABLE
+  }
 }
+
+/** 初始化 **/
+onMounted(async () => {
+  await getList()
+})
 </script>
 
 <style lang="scss" scoped></style>