添加老师排序

src/views/cees/localTeacher/CeesLocalTeacher.data.ts

@@ -2,9 +2,9 @@ import { BasicColumn } from '/@/components/Table';
 import { FormSchema } from '/@/components/Table';
 import { rules } from '/@/utils/helper/validator';
 import { render } from '/@/utils/common/renderUtils';
-import { ref, onMounted,reactive } from 'vue';
+import { ref, onMounted, reactive } from 'vue';
 
-const groupOptions=ref()
+const groupOptions = ref();
 // 创建一个简单的事件总线
 export const updateGroupOptions = reactive({
   updateGroupOptions(newOptions: any) {
@@ -17,34 +17,39 @@ export const columns: BasicColumn[] = [
   {
     title: '姓名',
     align: 'center',
+    sorter: true,
     dataIndex: 'userName',
   },
   {
     title: '用户ID',
     align: 'center',
+    sorter: true,
     dataIndex: 'userId',
   },
   {
     title: '工号',
     align: 'center',
+    sorter: true,
     dataIndex: 'teacherId',
   },
   {
     title: '手机号',
     align: 'center',
+    sorter: true,
     dataIndex: 'phone',
   },
   {
     title: '学科',
     align: 'center',
-    dataIndex: 'majorId'
+    sorter: true,
+    dataIndex: 'majorId',
   },
   {
     title: '所属分组',
     align: 'center',
     //dataIndex: 'groupId',
     customRender: ({ text }) => {
-      const group = groupOptions.value.find(item => item.value === text.groupId);
+      const group = groupOptions.value.find((item) => item.value === text.groupId);
       if (group) {
         return group.label;
       }
@@ -54,6 +59,7 @@ export const columns: BasicColumn[] = [
   {
     title: '是否第一次阅卷',
     align: 'center',
+    sorter: true,
     dataIndex: 'status',
   },
   //{
@@ -62,13 +68,11 @@ export const columns: BasicColumn[] = [
   //  dataIndex: 'userMajorId',
   //},
 
-  
   //{
   //  title: '使用次数',
   //  align: 'center',
   //  dataIndex: 'numberuse',
   //},
-  
 ];
 //查询数据
 export const searchFormSchema: FormSchema[] = [
@@ -90,7 +94,7 @@ export const searchFormSchema: FormSchema[] = [
         { label: '政治', value: 8 },
       ],
     },
-  }
+  },
 ];
 //表单数据
 export const formSchema: FormSchema[] = [

src/views/cees/waiTeacher/CeesWaiTeacher.data.ts

@@ -18,41 +18,49 @@ export const columns: BasicColumn[] = [
   {
     title: '姓名',
     align: 'center',
+    sorter: true,
     dataIndex: 'userName',
   },
   {
     title: '用户ID',
     align: 'center',
+    sorter: true,
     dataIndex: 'userId',
   },
   {
     title: '年龄',
     align: 'center',
+    sorter: true,
     dataIndex: 'age',
   },
   {
     title: '性别',
     align: 'center',
+    sorter: true,
     dataIndex: 'sex',
   },
   {
     title: '学科',
     align: 'center',
-    dataIndex: 'majorId'
+    sorter: true,
+    dataIndex: 'majorId',
   },
   {
     title: '手机号',
     align: 'center',
+    sorter: true,
     dataIndex: 'phone',
   },
   {
     title: '职称',
     align: 'center',
+    sorter: true,
     dataIndex: 'jobTitle',
   },
   {
     title: '职务',
     align: 'center',
+    sorter: true,
     dataIndex: 'office',
   },
   {

src/views/cees/waiTeacher/CeesWaiTeacherList.vue

@@ -1,8 +1,15 @@
 <template>
   <div>
     <!--引用表格-->
-    <BasicTable @register="registerTable" :rowSelection="rowSelection" ref="tableRef" :expandedRowKeys="expandedKeys"
+    <BasicTable
-      rowKey="id" :expandedRowRender="renderExpandedRow" @expand="handleExpand">
+      @register="registerTable"
+      :rowSelection="rowSelection"
+      ref="tableRef"
+      :expandedRowKeys="expandedKeys"
+      rowKey="id"
+      :expandedRowRender="renderExpandedRow"
+      @expand="handleExpand"
+    >
       <!--插槽:table标题-->
       <template #tableTitle>
         <a-button type="primary" @click="handleAdd" preIcon="ant-design:plus-outlined"> 新增</a-button>
@@ -17,7 +24,8 @@
               </a-menu-item>
             </a-menu>
           </template>
-          <a-button>批量操作
+          <a-button
+            >批量操作
             <Icon icon="mdi:chevron-down" />
           </a-button>
         </a-dropdown>
@@ -52,16 +60,21 @@
         </span>
         <span v-if="column.dataIndex === 'dormitoryName'">
           <!-- 选择逻辑存在问题使placeholder没办法显示 -->
-          <a-select placeholder="请选择" size="small" style="width: 120px" v-model:value="record.dormitoryName"
+          <a-select
-            :disabled="record.dormitoryId != null" @focus="handleFocus(record.sex, record)"
+            placeholder="请选择"
-            @change="handleChange(record.userId, record.dormitoryName, record)" filterables>
+            size="small"
+            style="width: 120px"
+            v-model:value="record.dormitoryName"
+            :disabled="record.dormitoryName != null"
+            @focus="handleFocus(record.sex, record)"
+            @change="handleChange(record.userId, record.dormitoryName, record)"
+            filterables
+          >
             <template v-if="dormOptions.length === 0">
               <a-option value="" label="加载中..." disabled />
             </template>
 
-            <a-select-option v-for="item in dormOptions" :key="item.value" :label="item.label" :value="item.value">{{
+            <a-select-option v-for="item in dormOptions" :key="item.value" :label="item.label" :value="item.value">{{ item.label }}</a-select-option>
-              item.label
-            }}</a-select-option>
 
             <template v-if="dormOptions.length === 0">
               <a-option value="" label="暂无数据" disabled />
@@ -76,289 +89,299 @@
 </template>
 
 <script lang="tsx" name="cees-ceesWaiTeacher" setup>
-import { ref, reactive, computed, unref, onMounted } from 'vue';
+  import { ref, reactive, computed, unref, onMounted } from 'vue';
-import { BasicTable, useTable, TableAction } from '/@/components/Table';
+  import { BasicTable, useTable, TableAction } from '/@/components/Table';
-import { useModal } from '/@/components/Modal';
+  import { useModal } from '/@/components/Modal';
-import { useListPage } from '/@/hooks/system/useListPage';
+  import { useListPage } from '/@/hooks/system/useListPage';
-import CeesWaiTeacherModal from './components/CeesWaiTeacherModal.vue';
+  import CeesWaiTeacherModal from './components/CeesWaiTeacherModal.vue';
-import { columns, searchFormSchema, superQuerySchema, updateGroupOptions } from './CeesWaiTeacher.data';
+  import { columns, searchFormSchema, superQuerySchema, updateGroupOptions } from './CeesWaiTeacher.data';
-import { list, deleteOne, batchDelete, getImportUrl, getExportUrl, getGroup, updateDormitory, cancelCheckIn, confirmCheckIn } from './CeesWaiTeacher.api';
+  import {
-import { selectBySex } from '/@/views/cees/dormitory/CeesDormitoryInfo.api';
+    list,
-import { downloadFile } from '/@/utils/common/renderUtils';
+    deleteOne,
-import { useUserStore } from '/@/store/modules/user';
+    batchDelete,
-const queryParam = reactive<any>({});
+    getImportUrl,
-const checkedKeys = ref<Array<string | number>>([]);
+    getExportUrl,
-const userStore = useUserStore();
+    getGroup,
-import { configStyleImportPlugin } from 'build/vite/plugin/styleImport';
+    updateDormitory,
-import { message } from 'ant-design-vue';
+    cancelCheckIn,
-import { registerCoordinateSystem } from 'echarts';
+    confirmCheckIn,
+  } from './CeesWaiTeacher.api';
+  import { selectBySex } from '/@/views/cees/dormitory/CeesDormitoryInfo.api';
+  import { downloadFile } from '/@/utils/common/renderUtils';
+  import { useUserStore } from '/@/store/modules/user';
+  const queryParam = reactive<any>({});
+  const checkedKeys = ref<Array<string | number>>([]);
+  const userStore = useUserStore();
+  import { configStyleImportPlugin } from 'build/vite/plugin/styleImport';
+  import { message } from 'ant-design-vue';
+  import { registerCoordinateSystem } from 'echarts';
 
-// 定义响应式数据
+  // 定义响应式数据
-const dormOptions = ref([]);
+  const dormOptions = ref([]);
 
-//注册model
+  //注册model
-const [registerModal, { openModal }] = useModal();
+  const [registerModal, { openModal }] = useModal();
-//注册table数据
+  //注册table数据
-const { prefixCls, tableContext, onExportXls, onImportXls } = useListPage({
+  const { prefixCls, tableContext, onExportXls, onImportXls } = useListPage({
-  tableProps: {
+    tableProps: {
-    title: '外校老师管理',
+      title: '外校老师管理',
-    api: list,
+      api: list,
-    columns,
+      columns,
-    canResize: false,
+      canResize: false,
-    formConfig: {
+      formConfig: {
-      //labelWidth: 120,
+        //labelWidth: 120,
-      schemas: searchFormSchema,
+        schemas: searchFormSchema,
-      autoSubmitOnEnter: true,
+        autoSubmitOnEnter: true,
-      showAdvancedButton: true,
+        showAdvancedButton: true,
-      fieldMapToTime: [],
+        fieldMapToTime: [],
-    },
+      },
-    actionColumn: {
+      actionColumn: {
-      width: 120,
+        width: 120,
-      fixed: 'right',
+        fixed: 'right',
-    },
+      },
-    beforeFetch: (params) => {
+      beforeFetch: (params) => {
-      return Object.assign(params, queryParam);
+        return Object.assign(params, queryParam);
-    },
-  },
-  exportConfig: {
-    name: '外校老师管理',
-    url: getExportUrl,
-    params: queryParam,
-  },
-  importConfig: {
-    url: getImportUrl,
-    success: handleSuccess,
-  },
-});
-// 指定默认展开的行（根据 rowKey 属性传入行的 key 值）
-const expandedKeys = ref<string[]>(['1']); // 默认展开第一行
-// 定义展开行内容的渲染函数
-const renderExpandedRow = (record: Record<string, any>) => {
-  return (
-    <a-descriptions column={2}>
-      <a-descriptions-item label="身份证号"> {record.record.identityId} </a-descriptions-item>
-      <a-descriptions-item label="银行卡号"> {record.record.pyCard} </a-descriptions-item>
-      <a-descriptions-item label="工作单位"> {record.record.workName} </a-descriptions-item>
-      <a-descriptions-item label="开户所在地"> {record.record.bankAddress} </a-descriptions-item>
-      <a-descriptions-item label="单位电话"> {record.record.workPhone} </a-descriptions-item>
-      <a-descriptions-item label="开户行"> {record.record.bankName} </a-descriptions-item>
-      <a-descriptions-item label="车牌号"> {record.record.carNumber} </a-descriptions-item>
-      <a-descriptions-item label="饭卡号"> {record.record.mealCard} </a-descriptions-item>
-    </a-descriptions>
-  );
-};
-// 监听展开/收起事件，更新 expandedKeys
-const handleExpand = (expanded: boolean, record: Record<string, any>) => {
-  console.log('展开/收起', expanded, record);
-  if (expanded) {
-    if (!expandedKeys.value.includes(record.id)) {
-      expandedKeys.value.push(record.id);
-    }
-  } else {
-    expandedKeys.value = expandedKeys.value.filter((key) => key !== record.id);
-  }
-};
-const [registerTable, { reload }, { rowSelection, selectedRowKeys }] = tableContext;
-
-// 在组件加载时获取分组数据
-const groupOptions = ref<{ label: string; value: number }[]>([]);
-
-onMounted(async () => {
-  console.log('组件已加载');
-  try {
-    const res = await getGroup();
-    console.log('获取分组数据成功:', res);
-    groupOptions.value = res.map((group) => ({
-      label: group.name, // 假设分组名称字段为 name
-      value: group.id, // 假设分组 ID 字段为 id
-    }));
-    console.log('分组数据:', groupOptions.value);
-    updateGroupOptions.updateGroupOptions(groupOptions.value);
-  } catch (error) {
-    console.error('获取分组数据失败:', error);
-  }
-});
-
-// 高级查询配置
-const superQueryConfig = reactive(superQuerySchema);
-
-/**
- * 高级查询事件
- */
-function handleSuperQuery(params) {
-  Object.keys(params).map((k) => {
-    queryParam[k] = params[k];
-  });
-  reload();
-}
-/**
- * 新增事件
- */
-function handleAdd() {
-  openModal(true, {
-    isUpdate: false,
-    showFooter: true,
-  });
-}
-/**
- * 编辑事件
- */
-function handleEdit(record: Recordable) {
-  openModal(true, {
-    record,
-    isUpdate: true,
-    showFooter: true,
-  });
-}
-/**
- * 详情
- */
-function handleDetail(record: Recordable) {
-  openModal(true, {
-    record,
-    isUpdate: true,
-    showFooter: false,
-  });
-}
-/**
- * 删除事件
- */
-async function handleDelete(record) {
-  await deleteOne({ id: record.id }, handleSuccess);
-}
-/**
- * 批量删除事件
- */
-async function batchHandleDelete() {
-  await batchDelete({ ids: selectedRowKeys.value }, handleSuccess);
-}
-/**
- * 成功回调
- */
-function handleSuccess() {
-  (selectedRowKeys.value = []) && reload();
-}
-/**
- * 操作栏
- */
-function getTableAction(record) {
-  const actions = [
-    {
-      label: '编辑',
-      onClick: handleEdit.bind(null, record),
-    },
-  ];
-
-  return actions;
-}
-function ConfirmRegistration(record) {
-  const actions = [{}];
-  // 添加“确认报到”和“取消确认”按钮
-  if (record.status === 0) {
-    actions.push({
-      label: '取消确认',
-      color: 'error', // 按钮颜色
-      onClick: () => updateStatus(record.id, 'un'), // 点击事件
-    });
-  } else {
-    actions.push({
-      label: '确认报到',
-      color: 'primary', // 按钮颜色
-      onClick: () => updateStatus(record.id), // 点击事件
-    });
-  }
-  return actions;
-}
-
-async function updateStatus(id, action = '') {
-  try {
-    let params = { id };
-    if (action === 'un') {
-      // 取消确认的逻辑
-      console.log(`取消确认报到，ID: ${id}`);
-      // 调用 API 取消确认
-      await cancelCheckIn(params);
-    } else {
-      // 确认报到的逻辑
-      console.log(`确认报到，ID: ${id}`);
-      // 调用 API 确认报到
-      await confirmCheckIn(params);
-    }
-    // 刷新表格数据
-    reload();
-  } catch (error) {
-    console.error('操作失败:', error);
-  }
-}
-/**
- * 下拉操作栏
- */
-function getDropDownAction(record) {
-  return [
-    {
-      label: '详情',
-      onClick: handleDetail.bind(null, record),
-    },
-    {
-      label: '删除',
-      popConfirm: {
-        title: '是否确认删除',
-        confirm: handleDelete.bind(null, record),
-        placement: 'topLeft',
       },
     },
-  ];
+    exportConfig: {
-}
+      name: '外校老师管理',
-
+      url: getExportUrl,
-// 定义 handleFocus 函数
+      params: queryParam,
-async function handleFocus(sex, record) {
+    },
-  console.log('dormitory11:', record.dormitoryId);
+    importConfig: {
-  console.log('性别:', sex);
+      url: getImportUrl,
-  try {
+      success: handleSuccess,
-    const response = await selectBySex({ sex });
+    },
-    console.log('响应:', response);
+  });
-    // 检查响应是否为数组
+  // 指定默认展开的行（根据 rowKey 属性传入行的 key 值）
-    if (Array.isArray(response)) {
+  const expandedKeys = ref<string[]>(['1']); // 默认展开第一行
-      //response.forEach((dormitory, index) => {
+  // 定义展开行内容的渲染函数
-      //  console.log(`宿舍 ${index + 1}:`);
+  const renderExpandedRow = (record: Record<string, any>) => {
-      //  console.log('  宿舍状态:', dormitory.dormitoryStatus);
+    return (
-      //  console.log('  宿舍类型:', dormitory.dormitoryType);
+      <a-descriptions column={2}>
-      //  console.log('  宿舍名称:', dormitory.dormitory);
+        <a-descriptions-item label="身份证号"> {record.record.identityId} </a-descriptions-item>
-      //  console.log('  组织代码:', dormitory.sysOrgCode);
+        <a-descriptions-item label="银行卡号"> {record.record.pyCard} </a-descriptions-item>
-      //  console.log('  宿舍编号:', dormitory.dormitoryNum);
+        <a-descriptions-item label="工作单位"> {record.record.workName} </a-descriptions-item>
-      //});
+        <a-descriptions-item label="开户所在地"> {record.record.bankAddress} </a-descriptions-item>
-      dormOptions.value = response.map((dormitory) => ({
+        <a-descriptions-item label="单位电话"> {record.record.workPhone} </a-descriptions-item>
-        label: dormitory.dormitory,
+        <a-descriptions-item label="开户行"> {record.record.bankName} </a-descriptions-item>
-        value: dormitory.id,
+        <a-descriptions-item label="车牌号"> {record.record.carNumber} </a-descriptions-item>
-      }));
+        <a-descriptions-item label="饭卡号"> {record.record.mealCard} </a-descriptions-item>
-    } else {
+      </a-descriptions>
-      console.error('预期的响应应该是一个数组。');
+    );
-    }
-  } catch (error) {
-    console.error('在 handleFocus 中发生错误:', error);
-  }
-}
-// 定义 handleFocus 函数
-async function handleChange(userId, dormitory, record) {
-  console.log("userId", userId)
-  console.log("dormitory", dormitory)
-  console.log("record", record)
-  let params = {
-    id: userId,
-    dormitory: dormitory,
   };
-  try {
+  // 监听展开/收起事件，更新 expandedKeys
-    // 正确调用方式（传递独立参数）
+  const handleExpand = (expanded: boolean, record: Record<string, any>) => {
-    const response = await updateDormitory(userId, dormitory);
+    console.log('展开/收起', expanded, record);
-    console.log('响应:', response);
+    if (expanded) {
-  } catch (error) {
+      if (!expandedKeys.value.includes(record.id)) {
-    console.error('在 handleFocus 中发生错误:', error);
+        expandedKeys.value.push(record.id);
+      }
+    } else {
+      expandedKeys.value = expandedKeys.value.filter((key) => key !== record.id);
+    }
+  };
+  const [registerTable, { reload }, { rowSelection, selectedRowKeys }] = tableContext;
+
+  // 在组件加载时获取分组数据
+  const groupOptions = ref<{ label: string; value: number }[]>([]);
+
+  onMounted(async () => {
+    console.log('组件已加载');
+    try {
+      const res = await getGroup();
+      console.log('获取分组数据成功:', res);
+      groupOptions.value = res.map((group) => ({
+        label: group.name, // 假设分组名称字段为 name
+        value: group.id, // 假设分组 ID 字段为 id
+      }));
+      console.log('分组数据:', groupOptions.value);
+      updateGroupOptions.updateGroupOptions(groupOptions.value);
+    } catch (error) {
+      console.error('获取分组数据失败:', error);
+    }
+  });
+
+  // 高级查询配置
+  const superQueryConfig = reactive(superQuerySchema);
+
+  /**
+   * 高级查询事件
+   */
+  function handleSuperQuery(params) {
+    Object.keys(params).map((k) => {
+      queryParam[k] = params[k];
+    });
+    reload();
+  }
+  /**
+   * 新增事件
+   */
+  function handleAdd() {
+    openModal(true, {
+      isUpdate: false,
+      showFooter: true,
+    });
+  }
+  /**
+   * 编辑事件
+   */
+  function handleEdit(record: Recordable) {
+    openModal(true, {
+      record,
+      isUpdate: true,
+      showFooter: true,
+    });
+  }
+  /**
+   * 详情
+   */
+  function handleDetail(record: Recordable) {
+    openModal(true, {
+      record,
+      isUpdate: true,
+      showFooter: false,
+    });
+  }
+  /**
+   * 删除事件
+   */
+  async function handleDelete(record) {
+    await deleteOne({ id: record.id }, handleSuccess);
+  }
+  /**
+   * 批量删除事件
+   */
+  async function batchHandleDelete() {
+    await batchDelete({ ids: selectedRowKeys.value }, handleSuccess);
+  }
+  /**
+   * 成功回调
+   */
+  function handleSuccess() {
+    (selectedRowKeys.value = []) && reload();
+  }
+  /**
+   * 操作栏
+   */
+  function getTableAction(record) {
+    const actions = [
+      {
+        label: '编辑',
+        onClick: handleEdit.bind(null, record),
+      },
+    ];
+
+    return actions;
+  }
+  function ConfirmRegistration(record) {
+    const actions = [{}];
+    // 添加“确认报到”和“取消确认”按钮
+    if (record.status === 0) {
+      actions.push({
+        label: '取消确认',
+        color: 'error', // 按钮颜色
+        onClick: () => updateStatus(record.id, 'un'), // 点击事件
+      });
+    } else {
+      actions.push({
+        label: '确认报到',
+        color: 'primary', // 按钮颜色
+        onClick: () => updateStatus(record.id), // 点击事件
+      });
+    }
+    return actions;
+  }
+
+  async function updateStatus(id, action = '') {
+    try {
+      let params = { id };
+      if (action === 'un') {
+        // 取消确认的逻辑
+        console.log(`取消确认报到，ID: ${id}`);
+        // 调用 API 取消确认
+        await cancelCheckIn(params);
+      } else {
+        // 确认报到的逻辑
+        console.log(`确认报到，ID: ${id}`);
+        // 调用 API 确认报到
+        await confirmCheckIn(params);
+      }
+      // 刷新表格数据
+      reload();
+    } catch (error) {
+      console.error('操作失败:', error);
+    }
+  }
+  /**
+   * 下拉操作栏
+   */
+  function getDropDownAction(record) {
+    return [
+      {
+        label: '详情',
+        onClick: handleDetail.bind(null, record),
+      },
+      {
+        label: '删除',
+        popConfirm: {
+          title: '是否确认删除',
+          confirm: handleDelete.bind(null, record),
+          placement: 'topLeft',
+        },
+      },
+    ];
+  }
+
+  // 定义 handleFocus 函数
+  async function handleFocus(sex, record) {
+    console.log('dormitory11:', record.dormitoryId);
+    console.log('性别:', sex);
+    try {
+      const response = await selectBySex({ sex });
+      console.log('响应:', response);
+      // 检查响应是否为数组
+      if (Array.isArray(response)) {
+        //response.forEach((dormitory, index) => {
+        //  console.log(`宿舍 ${index + 1}:`);
+        //  console.log('  宿舍状态:', dormitory.dormitoryStatus);
+        //  console.log('  宿舍类型:', dormitory.dormitoryType);
+        //  console.log('  宿舍名称:', dormitory.dormitory);
+        //  console.log('  组织代码:', dormitory.sysOrgCode);
+        //  console.log('  宿舍编号:', dormitory.dormitoryNum);
+        //});
+        dormOptions.value = response.map((dormitory) => ({
+          label: dormitory.dormitory,
+          value: dormitory.id,
+        }));
+      } else {
+        console.error('预期的响应应该是一个数组。');
+      }
+    } catch (error) {
+      console.error('在 handleFocus 中发生错误:', error);
+    }
+  }
+  // 定义 handleFocus 函数
+  async function handleChange(userId, dormitory, record) {
+    console.log('userId', userId);
+    console.log('dormitory', dormitory);
+    console.log('record', record);
+    let params = {
+      id: userId,
+      dormitory: dormitory,
+    };
+    try {
+      // 正确调用方式（传递独立参数）
+      const response = await updateDormitory(userId, dormitory);
+      console.log('响应:', response);
+    } catch (error) {
+      console.error('在 handleFocus 中发生错误:', error);
+    }
   }
-}
 </script>
 
 <style scoped>
-.ant-select .ant-input__inner::placeholder {
+  .ant-select .ant-input__inner::placeholder {
-  color: #999 !important;
+    color: #999 !important;
-}
+  }
 </style>