feat: 新增很多页面

src/views/stuwork/entrancerule/index.vue

@@ -0,0 +1,199 @@
+<template>
+  <div class="layout-padding">
+    <div class="layout-padding-auto layout-padding-view">
+      <!-- 操作按钮 -->
+      <el-row>
+        <div class="mb8" style="width: 100%">
+          <el-button 
+            icon="FolderAdd" 
+            type="primary" 
+            class="ml10" 
+            @click="formDialogRef.openDialog()">
+            新 增
+          </el-button>
+          <right-toolbar  
+            v-model:showSearch="showSearch" 
+            class="ml10 mr20"
+            style="float: right;"
+            @queryTable="getDataList">
+          </right-toolbar>
+        </div>
+      </el-row>
+
+      <!-- 表格 -->
+      <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="序号" align="center" />
+        <el-table-column prop="ruleName" label="规则名称" show-overflow-tooltip />
+        <el-table-column prop="classNames" label="绑定班级" show-overflow-tooltip />
+        <el-table-column prop="isHoliday" label="假期模式" show-overflow-tooltip>
+          <template #default="scope">
+            <span>{{ scope.row.isHoliday === '1' ? '开启' : '关闭' }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column label="操作" align="center" fixed="right" width="280">
+          <template #default="scope">
+            <el-button 
+              icon="Switch" 
+              text 
+              :type="scope.row.isHoliday === '1' ? 'warning' : 'success'"
+              @click="handleToggleHoliday(scope.row)">
+              {{ scope.row.isHoliday === '1' ? '关闭假期模式' : '开启假期模式' }}
+            </el-button>
+            <el-button 
+              icon="View" 
+              text 
+              type="primary" 
+              @click="handleViewDetail(scope.row)">
+              查看详情
+            </el-button>
+            <el-button 
+              icon="Edit" 
+              text 
+              type="primary" 
+              @click="formDialogRef.openDialog(scope.row.id)">
+              编辑
+            </el-button>
+            <el-button 
+              icon="Delete" 
+              text 
+              type="danger" 
+              @click="handleDelete([scope.row.id])">
+              删除
+            </el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+
+      <!-- 分页 -->
+      <pagination 
+        @size-change="sizeChangeHandle" 
+        @current-change="currentChangeHandle" 
+        v-bind="state.pagination" />
+    </div>
+
+    <!-- 编辑、新增  -->
+    <FormDialog ref="formDialogRef" @refresh="getDataList(false)" />
+    
+    <!-- 详情对话框 -->
+    <el-dialog 
+      title="门禁规则详情" 
+      v-model="detailDialogVisible"
+      :close-on-click-modal="false" 
+      draggable
+      width="800px">
+      <div v-if="detailData">
+        <el-descriptions :column="2" border>
+          <el-descriptions-item label="规则名称">{{ detailData.ruleName || '-' }}</el-descriptions-item>
+          <el-descriptions-item label="绑定班级">{{ detailData.classNames || '-' }}</el-descriptions-item>
+          <el-descriptions-item label="假期模式">
+            {{ detailData.isHoliday === '1' ? '开启' : '关闭' }}
+          </el-descriptions-item>
+        </el-descriptions>
+        <!-- 这里可以根据需要展示更多详情信息 -->
+      </div>
+      <template #footer>
+        <span class="dialog-footer">
+          <el-button @click="detailDialogVisible = false">关 闭</el-button>
+        </span>
+      </template>
+    </el-dialog>
+  </div>
+</template>
+ 
+<script setup lang="ts" name="EntranceRule">
+import { ref, reactive, defineAsyncComponent, onMounted } from 'vue'
+import { BasicTableProps, useTable } from "/@/hooks/table";
+import { fetchList, delObjs, getObj, openHoliday } from "/@/api/stuwork/entrancerule";
+import { useMessage, useMessageBox } from "/@/hooks/message";
+
+// 引入组件
+const FormDialog = defineAsyncComponent(() => import('./form.vue'));
+
+// 定义变量内容
+const formDialogRef = ref()
+// 搜索变量
+const showSearch = ref(false) // 没有搜索条件，隐藏搜索区域
+const detailDialogVisible = ref(false)
+const detailData = ref<any>(null)
+
+// 配置 useTable
+const state: BasicTableProps = reactive<BasicTableProps>({
+  queryForm: {},
+  pageList: fetchList,
+  props: {
+    item: 'records',
+    totalCount: 'total'
+  }
+})
+
+// table hook
+const {
+  getDataList,
+  currentChangeHandle,
+  sizeChangeHandle,
+  sortChangeHandle,
+  tableStyle
+} = useTable(state)
+
+// 删除
+const handleDelete = async (ids: string[]) => {
+  try {
+    await useMessageBox().confirm('确定要删除选中的记录吗？')
+  } catch {
+    return
+  }
+
+  try {
+    await delObjs(ids)
+    useMessage().success('删除成功')
+    getDataList()
+  } catch (err: any) {
+    useMessage().error(err.msg || '删除失败')
+  }
+}
+
+// 开启/关闭假期模式
+const handleToggleHoliday = async (row: any) => {
+  const action = row.isHoliday === '1' ? '关闭' : '开启'
+  try {
+    await useMessageBox().confirm(`确定要${action}假期模式吗？`)
+  } catch {
+    return
+  }
+
+  try {
+    await openHoliday({
+      id: row.id,
+      isHoliday: row.isHoliday === '1' ? '0' : '1'
+    })
+    useMessage().success(`${action}成功`)
+    getDataList()
+  } catch (err: any) {
+    useMessage().error(err.msg || `${action}失败`)
+  }
+}
+
+// 查看详情
+const handleViewDetail = async (row: any) => {
+  try {
+    const res = await getObj({ id: row.id })
+    if (res.data) {
+      detailData.value = res.data
+      detailDialogVisible.value = true
+    }
+  } catch (err: any) {
+    useMessage().error(err.msg || '获取详情失败')
+  }
+}
+
+// 初始化
+onMounted(() => {
+  getDataList()
+})
+</script>