Learn.Archives.Web/src/views/class/index.vue

148 lines
3.7 KiB
Vue

<script setup lang="ts">
import ahTable from "@/components/hTable/index.vue";
import {
ComboModel,
ConditionalType,
gradeComboModel,
intTableData,
TableColumn,
TableColumnEdit,
TableColumnSearch,
TableConfig,
} from "@/components/hTable/hTable";
import { onMounted, ref, defineOptions } from "vue";
import { fa } from "element-plus/es/locales.mjs";
import { hTableAPI } from "@/api/hTable";
import { getenum } from "@/api/enum";
import { ruleClassName, ruleRequired } from "@/utils/rules";
import { text } from "node:stream/consumers";
const ControllerName = "classes";
defineOptions({
name: ControllerName,
});
const SchoolApi = new hTableAPI("usercenter/back/schools");
function searchCallback(data) {}
const table = ref<{ initTable: (config: TableConfig) => void }>();
const tableData: TableConfig = intTableData({
apiUrl: "usercenter/back/classes",
selectColumn: false, // 列表选择
border: false, // 是否显示表格边框
searchCallback: searchCallback,
search: {
// 查询条件
show: true,
PageIndex: 0,
PageSize: 20,
OrderBy: "CreateTime", // 排序
defaultConditions: [], // 默认查询条件
Conditions: [],
},
operationColumn: true, // 显示操作按钮
operationColumnData: [
{
perms: "班级修改",
// 操作按钮
topBtn: false, // 是头部按钮
label: "修改",
btnType: "edit", // 按钮类型 add edit del custom
},
{
perms: "班级新增",
topBtn: true, // 头部按钮
label: "新增",
btnType: "custom", // 按钮类型 add edit del custom
btnStyle: "success", // topBtn: true才生效 success danger
custom: {
// 按钮类型 custom 专用
title: "新增班级", // 弹出框title
src: "class/edit", // 组件路径
width: "550px", // 弹框宽度
height: "520px", // 弹框高度
},
},
{
perms: "班级删除",
topBtn: false, // 头部按钮
show: true,
label: "删除",
btnType: "del", // 按钮类型 add edit del 不设置则 自定义按钮
btnStyle: "danger", // topBtn: true才生效 success danger
},
],
column: {
// 行数据
id: {
label: "编号",
width: "150px",
},
schoolId: {
label: "学校",
width: "180px",
type: "dropdown",
search: new TableColumnSearch(true),
edit: {
rules: ruleRequired,
},
},
Grade: {
label: "年级",
width: "220px",
type: "dropdown",
custom: (row) => `${row.gradeLevel + row.graduationYear}届 [${row.grade ?? ""}]`,
search: new TableColumnSearch(true),
edit: { add: true, edit: false, rules: ruleRequired },
},
name: {
label: "名称",
width: "180px",
search: {
yes: true,
searchType: ConditionalType.Like, // 搜索类型
},
edit: {
add: true,
edit: true,
rules: ruleClassName,
},
},
type: {
label: "类型",
type: "dropdown",
search: {
yes: true,
},
edit: {
add: true,
edit: true,
rules: ruleRequired,
},
},
},
data: [],
pageData: {
total: 0,
},
selectRows: [],
});
const showTable = ref(false);
onMounted(async () => {
//初始化数据原
tableData.column.Grade.setting.datasource = gradeComboModel();
tableData.column.type.setting.datasource = (await getenum("ClassTypeEnum")).data;
tableData.column.schoolId.setting.datasource = (
await SchoolApi.querycombo({ TextName: "Name", ValueName: "Id" })
).data;
showTable.value = true;
});
</script>
<template>
<div><ahTable v-if="showTable" ref="table" :tableConfig="tableData" /></div>
</template>