|
@@ -7,12 +7,13 @@
|
|
<icon-ic-round-plus class="mr-4px text-20px" />
|
|
<icon-ic-round-plus class="mr-4px text-20px" />
|
|
新增
|
|
新增
|
|
</n-button>
|
|
</n-button>
|
|
- <n-button type="error" @click="deleteSubjectsList">
|
|
|
|
|
|
+ <!-- <n-button type="error" @click="deleteSubjectsList">
|
|
<icon-ic-round-delete class="mr-4px text-20px" />
|
|
<icon-ic-round-delete class="mr-4px text-20px" />
|
|
删除
|
|
删除
|
|
- </n-button>
|
|
|
|
|
|
+ </n-button> -->
|
|
<n-input-group>
|
|
<n-input-group>
|
|
- <n-input :style="{ width: '50%' }" placeholder="输入序号查询..." />
|
|
|
|
|
|
+ <n-input :style="{ width: '50%' }" :value="conditionParams.id" @input="event => conditionParams.id = event"
|
|
|
|
+ placeholder="输入序号查询..." />
|
|
<n-input :style="{ width: '50%' }" placeholder="输入姓名查询..." />
|
|
<n-input :style="{ width: '50%' }" placeholder="输入姓名查询..." />
|
|
<n-cascader v-model:value="value" placeholder="是否签到" :options="options" :filterable="true"
|
|
<n-cascader v-model:value="value" placeholder="是否签到" :options="options" :filterable="true"
|
|
:render-label="renderLabel" @update:value="handleUpdateValue" />
|
|
:render-label="renderLabel" @update:value="handleUpdateValue" />
|
|
@@ -23,12 +24,13 @@
|
|
</n-space>
|
|
</n-space>
|
|
</n-space>
|
|
</n-space>
|
|
<n-scrollbar style="max-height: 100vh" trigger="none">
|
|
<n-scrollbar style="max-height: 100vh" trigger="none">
|
|
- <n-data-table :row-key="row => row.id" :columns="columns" :data="pageDate" :loading="loading"
|
|
|
|
- :pagination="pagination" />
|
|
|
|
|
|
+ <n-data-table :row-key="row => row.id" v-model:checked-row-keys="deletedID" :columns="columns" :data="pageDate"
|
|
|
|
+ :loading="loading" :pagination="pagination" />
|
|
|
|
+
|
|
<!-- <n-pagination v-model:page="page" :page-count="100" simple /> -->
|
|
<!-- <n-pagination v-model:page="page" :page-count="100" simple /> -->
|
|
|
|
|
|
- <!-- <table-action-modal @init="init" v-model:visible="visible" @update:checked-row-keys="handleCheck"
|
|
|
|
- :type="modalType" :pagination="pagination" :edit-data="(editData as SelectByConditionParams)" /> -->
|
|
|
|
|
|
+ <table-action-modal @init="init" v-model:visible="visible" @update:checked-row-keys="handleCheck"
|
|
|
|
+ :type="modalType" :pagination="pagination" :edit-data="(editData as Query_5Params)" />
|
|
<div style="width: 100%; height: 300px;"></div>
|
|
<div style="width: 100%; height: 300px;"></div>
|
|
</n-scrollbar>
|
|
</n-scrollbar>
|
|
|
|
|
|
@@ -40,10 +42,14 @@
|
|
<script setup lang="tsx">
|
|
<script setup lang="tsx">
|
|
import { useBoolean, useLoading } from '@/hooks';
|
|
import { useBoolean, useLoading } from '@/hooks';
|
|
import type { Ref } from 'vue';
|
|
import type { Ref } from 'vue';
|
|
-import { reactive, ref } from 'vue';
|
|
|
|
-import type { SelectByConditionParams } from '~/src/service/api/crouse'
|
|
|
|
-import { PaginationProps, DataTableColumns, DataTableRowKey, NButton, NPopconfirm, NSpace } from 'naive-ui';
|
|
|
|
|
|
+import { reactive, ref, provide } from 'vue';
|
|
|
|
+import type { Query_5Params } from '~/src/service/api/student';
|
|
|
|
+import { query_5, getStudentList, delete_5 } from '~/src/service/api/student'
|
|
|
|
+
|
|
|
|
+import { PaginationProps, DataTableColumns, DataTableRowKey, NButton, NPopconfirm, NSpace, c } from 'naive-ui';
|
|
import { CascaderOption } from 'naive-ui'
|
|
import { CascaderOption } from 'naive-ui'
|
|
|
|
+import TableActionModal from './components/table-action-modal.vue';
|
|
|
|
+import type { ModalType } from './components/table-action-modal.vue';
|
|
|
|
|
|
function getOptions(depth = 3, iterator = 1, prefix = '') {
|
|
function getOptions(depth = 3, iterator = 1, prefix = '') {
|
|
const length = 2;
|
|
const length = 2;
|
|
@@ -105,6 +111,19 @@ function getOptions(depth = 3, iterator = 1, prefix = '') {
|
|
}
|
|
}
|
|
return options
|
|
return options
|
|
}
|
|
}
|
|
|
|
+const conditionParams: Query_5Params = reactive({
|
|
|
|
+ id: null,
|
|
|
|
+ checkinDate: null,
|
|
|
|
+ scheduleId: null,
|
|
|
|
+ month: null,
|
|
|
|
+ morning: null,
|
|
|
|
+ afternoon: null,
|
|
|
|
+ studentName: null,
|
|
|
|
+ studentNumber: null,
|
|
|
|
+ createUid: null,
|
|
|
|
+ createTime: null,
|
|
|
|
+ modifyTime: null,
|
|
|
|
+});
|
|
const value = ref(null);
|
|
const value = ref(null);
|
|
const options = getOptions();
|
|
const options = getOptions();
|
|
function handleUpdateValue(...args: unknown[]) {
|
|
function handleUpdateValue(...args: unknown[]) {
|
|
@@ -114,14 +133,15 @@ function renderLabel(option: { value?: string | number; label?: string }) {
|
|
return `${option.label}`
|
|
return `${option.label}`
|
|
};
|
|
};
|
|
|
|
|
|
-const { loading } = useLoading(false);
|
|
|
|
-// const { bool: visible, setTrue: openModal } = useBoolean();
|
|
|
|
-
|
|
|
|
|
|
+const { loading, startLoading, endLoading } = useLoading(false);
|
|
|
|
+const { bool: visible, setTrue: openModal } = useBoolean();
|
|
|
|
+const checkedRowKeysRef = ref<DataTableRowKey[]>([]);
|
|
const pagination: PaginationProps = reactive({
|
|
const pagination: PaginationProps = reactive({
|
|
page: 1,
|
|
page: 1,
|
|
pageSize: 10,
|
|
pageSize: 10,
|
|
showSizePicker: true,
|
|
showSizePicker: true,
|
|
showQuickJumper: true,
|
|
showQuickJumper: true,
|
|
|
|
+ itemCount: 1,
|
|
pageSizes: [10, 15, 20, 25, 30],
|
|
pageSizes: [10, 15, 20, 25, 30],
|
|
onUpdatePageSize: (pageSize: number) => {
|
|
onUpdatePageSize: (pageSize: number) => {
|
|
pagination.pageSize = pageSize;
|
|
pagination.pageSize = pageSize;
|
|
@@ -132,49 +152,61 @@ const pagination: PaginationProps = reactive({
|
|
// serchCondition();
|
|
// serchCondition();
|
|
}
|
|
}
|
|
});
|
|
});
|
|
-const columns: Ref<DataTableColumns<SelectByConditionParams>> = ref([
|
|
|
|
- {
|
|
|
|
- type: 'selection',
|
|
|
|
- align: 'center'
|
|
|
|
- },
|
|
|
|
|
|
+const pageDate = ref([]);
|
|
|
|
+
|
|
|
|
+const columns: Ref<DataTableColumns<Query_5Params>> = ref([
|
|
|
|
+ // {
|
|
|
|
+ // type: 'selection',
|
|
|
|
+ // align: 'center'
|
|
|
|
+ // },
|
|
{
|
|
{
|
|
key: 'id',
|
|
key: 'id',
|
|
title: '序号',
|
|
title: '序号',
|
|
align: 'center'
|
|
align: 'center'
|
|
},
|
|
},
|
|
{
|
|
{
|
|
- key: 'name',
|
|
|
|
|
|
+ key: 'studentName',
|
|
title: '姓名',
|
|
title: '姓名',
|
|
align: 'center'
|
|
align: 'center'
|
|
},
|
|
},
|
|
{
|
|
{
|
|
- key: 'description',
|
|
|
|
- title: '是否签到',
|
|
|
|
|
|
+ key: 'studentNumber',
|
|
|
|
+ title: '学生档案号',
|
|
align: 'center'
|
|
align: 'center'
|
|
},
|
|
},
|
|
{
|
|
{
|
|
- key: 'categoryId',
|
|
|
|
- title: '正常',
|
|
|
|
|
|
+ key: 'checkinDate',
|
|
|
|
+ title: '签到日期',
|
|
align: 'center'
|
|
align: 'center'
|
|
},
|
|
},
|
|
{
|
|
{
|
|
- key: 'createTime',
|
|
|
|
- title: '迟到',
|
|
|
|
|
|
+ key: 'scheduleId',
|
|
|
|
+ title: '排课id',
|
|
align: 'center'
|
|
align: 'center'
|
|
},
|
|
},
|
|
{
|
|
{
|
|
- key: 'modifyTime',
|
|
|
|
- title: '早退',
|
|
|
|
|
|
+ key: 'month',
|
|
|
|
+ title: '月份',
|
|
|
|
+ align: 'center'
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ key: 'morning',
|
|
|
|
+ title: '上午出勤',
|
|
align: 'center'
|
|
align: 'center'
|
|
},
|
|
},
|
|
{
|
|
{
|
|
- key: 'createUid',
|
|
|
|
- title: '请假',
|
|
|
|
|
|
+ key: 'afternoon',
|
|
|
|
+ title: '下午出勤',
|
|
align: 'center'
|
|
align: 'center'
|
|
},
|
|
},
|
|
{
|
|
{
|
|
- key: 'disabled',
|
|
|
|
- title: '无效',
|
|
|
|
|
|
+ key: 'createTime',
|
|
|
|
+ title: '创建时间',
|
|
|
|
+ align: 'center'
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ key: 'modifyTime',
|
|
|
|
+ title: '修改时间',
|
|
align: 'center'
|
|
align: 'center'
|
|
},
|
|
},
|
|
{
|
|
{
|
|
@@ -187,7 +219,7 @@ const columns: Ref<DataTableColumns<SelectByConditionParams>> = ref([
|
|
<NButton size={'small'} onClick={() => handleEditTable(row)}>
|
|
<NButton size={'small'} onClick={() => handleEditTable(row)}>
|
|
编辑
|
|
编辑
|
|
</NButton>
|
|
</NButton>
|
|
- <NPopconfirm onPositiveClick={() => handleDeleteTable(row.id.toString())}>
|
|
|
|
|
|
+ <NPopconfirm onPositiveClick={() => handleDeleteTable(row.checkinDate, row.studentNumber)}>
|
|
{{
|
|
{{
|
|
default: () => '确认删除',
|
|
default: () => '确认删除',
|
|
trigger: () => <NButton size={'small'}>删除</NButton>
|
|
trigger: () => <NButton size={'small'}>删除</NButton>
|
|
@@ -197,6 +229,72 @@ const columns: Ref<DataTableColumns<SelectByConditionParams>> = ref([
|
|
);
|
|
);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
-]) as Ref<DataTableColumns<SelectByConditionParams>>;
|
|
|
|
|
|
+]) as Ref<DataTableColumns<Query_5Params>>;
|
|
|
|
+
|
|
|
|
+function handleCheck(rowKeys: DataTableRowKey[]) {
|
|
|
|
+ checkedRowKeysRef.value = rowKeys;
|
|
|
|
+
|
|
|
|
+}
|
|
|
|
+// const s = ref([]);
|
|
|
|
+// const deletedID = ref([]);
|
|
|
|
+// function deleteSubjectsList() {
|
|
|
|
+// const difference = deletedID.value.filter(item => !s.value.includes(item));
|
|
|
|
+// s.value = deletedID.value
|
|
|
|
+// console.log(difference)
|
|
|
|
+// for (let i = 0; i < difference.length; i++) {
|
|
|
|
+// // delete_5({});
|
|
|
|
+// }
|
|
|
|
+// init();
|
|
|
|
+// }
|
|
|
|
+
|
|
|
|
+const editData = ref<Query_5Params | null>(null);
|
|
|
|
+function setEditData(data: Query_5Params | null) {
|
|
|
|
+ editData.value = data;
|
|
|
|
+}
|
|
|
|
+function handleEditTable(findItem: Query_5Params) {
|
|
|
|
+ if (findItem) {
|
|
|
|
+ setEditData(findItem);
|
|
|
|
+ }
|
|
|
|
+ setModalType('edit');
|
|
|
|
+ openModal();
|
|
|
|
+}
|
|
|
|
+function handleAddTable() {
|
|
|
|
+ openModal();
|
|
|
|
+ setModalType('add');
|
|
|
|
+ init();
|
|
|
|
+}
|
|
|
|
+const modalType = ref<ModalType>('add' || 'edit');
|
|
|
|
+function setModalType(type: ModalType) {
|
|
|
|
+ modalType.value = type;
|
|
|
|
+}
|
|
|
|
+function serchCondition() {
|
|
|
|
+ startLoading();
|
|
|
|
+ query_5(pagination.page, pagination.pageSize, conditionParams).then(r => {
|
|
|
|
+ pageDate.value = r.data as [];
|
|
|
|
+ endLoading();
|
|
|
|
+ }).catch(() => {
|
|
|
|
+ console.log('jdias')
|
|
|
|
+ })
|
|
|
|
+}
|
|
|
|
+function init() {
|
|
|
|
+ startLoading();
|
|
|
|
+ setTimeout(() => {
|
|
|
|
+ serchCondition();
|
|
|
|
+ }, 1000)
|
|
|
|
+ endLoading();
|
|
|
|
+}
|
|
|
|
+
|
|
|
|
+// 初始化
|
|
|
|
+init();
|
|
|
|
+// 删除
|
|
|
|
+function handleDeleteTable(rowData: string, rowNumber: string) {
|
|
|
|
+ startLoading();
|
|
|
|
+ delete_5({ "checkinDate": rowData, "studentNumber": rowNumber }).then(() => {
|
|
|
|
+ endLoading()
|
|
|
|
+ })
|
|
|
|
+ init();
|
|
|
|
+}
|
|
|
|
+
|
|
|
|
+provide('init', init);
|
|
</script>
|
|
</script>
|
|
<style></style>
|
|
<style></style>
|