|
@@ -12,14 +12,18 @@
|
|
删除
|
|
删除
|
|
</n-button>
|
|
</n-button>
|
|
<n-input-group>
|
|
<n-input-group>
|
|
-
|
|
|
|
-
|
|
|
|
- <n-input :style="{ width: '50%' }" :value="conditionParams.id" @input="event=>conditionParams.id = event" placeholder="输入查询..." />
|
|
|
|
- <n-input :style="{ width: '50%' }" :value="conditionParams.name" @input="event=>conditionParams.name = event" placeholder="输入查询..." />
|
|
|
|
- <n-input :style="{ width: '50%' }" :value="conditionParams.description" @input="event=>conditionParams.description = event" placeholder="输入查询..." />
|
|
|
|
- <n-input :style="{ width: '50%' }" :value="conditionParams.disabled" @input="event=>conditionParams.disabled = event" placeholder="输入查询..." />
|
|
|
|
- <n-input :style="{ width: '50%' }" :value="conditionParams.createTime" @input="event=>conditionParams.createTime = event" placeholder="输入查询..." />
|
|
|
|
- <n-input :style="{ width: '50%' }" :value="conditionParams.categoryId" @input="event=>conditionParams.categoryId = event" placeholder="输入查询..." />
|
|
|
|
|
|
+ <n-input :style="{ width: '50%' }" :value="conditionParams.id" @input="event => conditionParams.id = event"
|
|
|
|
+ placeholder="输入id查询..." />
|
|
|
|
+ <n-input :style="{ width: '50%' }" :value="conditionParams.name"
|
|
|
|
+ @input="event => conditionParams.name = event" placeholder="输入名字查询..." />
|
|
|
|
+ <n-input :style="{ width: '50%' }" :value="conditionParams.description"
|
|
|
|
+ @input="event => conditionParams.description = event" placeholder="输入学科描述查询..." />
|
|
|
|
+ <n-input :style="{ width: '50%' }" :value="conditionParams.disabled"
|
|
|
|
+ @input="event => conditionParams.disabled = event" placeholder="输入是否禁用查询..." />
|
|
|
|
+ <n-input :style="{ width: '50%' }" :value="conditionParams.createTime"
|
|
|
|
+ @input="event => conditionParams.createTime = event" placeholder="输入创建时间查询..." />
|
|
|
|
+ <n-input :style="{ width: '50%' }" :value="conditionParams.categoryId"
|
|
|
|
+ @input="event => conditionParams.categoryId = event" placeholder="输入学科分类查询..." />
|
|
<n-button type="primary" ghost @click="serchCondition()">
|
|
<n-button type="primary" ghost @click="serchCondition()">
|
|
搜索
|
|
搜索
|
|
</n-button>
|
|
</n-button>
|
|
@@ -27,7 +31,10 @@
|
|
</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 :columns="columns" :data="pageDate" :loading="loading" :row-key="rowKey" :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 /> -->
|
|
|
|
+
|
|
<table-action-modal @init="init" v-model:visible="visible" @update:checked-row-keys="handleCheck"
|
|
<table-action-modal @init="init" v-model:visible="visible" @update:checked-row-keys="handleCheck"
|
|
:type="modalType" :pagination="pagination" :edit-data="(editData as SelectByConditionParams)" />
|
|
:type="modalType" :pagination="pagination" :edit-data="(editData as SelectByConditionParams)" />
|
|
<div style="width: 100%; height: 300px;"></div>
|
|
<div style="width: 100%; height: 300px;"></div>
|
|
@@ -39,7 +46,7 @@
|
|
</template>
|
|
</template>
|
|
|
|
|
|
<script setup lang="tsx">
|
|
<script setup lang="tsx">
|
|
-import { reactive, ref } from 'vue';
|
|
|
|
|
|
+import { reactive, ref, provide } from 'vue';
|
|
import type { Ref } from 'vue';
|
|
import type { Ref } from 'vue';
|
|
import { useBoolean, useLoading } from '@/hooks';
|
|
import { useBoolean, useLoading } from '@/hooks';
|
|
import TableActionModal from './component/table-action-modal.vue';
|
|
import TableActionModal from './component/table-action-modal.vue';
|
|
@@ -49,8 +56,7 @@ import type { SelectByConditionParams } from '~/src/service/api/crouse'
|
|
import { PaginationProps, DataTableColumns, DataTableRowKey, NButton, NPopconfirm, NSpace } from 'naive-ui';
|
|
import { PaginationProps, DataTableColumns, DataTableRowKey, NButton, NPopconfirm, NSpace } from 'naive-ui';
|
|
|
|
|
|
|
|
|
|
-
|
|
|
|
-const conditionParams:SelectByConditionParams = reactive({
|
|
|
|
|
|
+const conditionParams: SelectByConditionParams = reactive({
|
|
id: null,
|
|
id: null,
|
|
name: null,
|
|
name: null,
|
|
description: null,
|
|
description: null,
|
|
@@ -61,37 +67,28 @@ const conditionParams:SelectByConditionParams = reactive({
|
|
});
|
|
});
|
|
|
|
|
|
|
|
|
|
-// 输入值
|
|
|
|
-const form = ref('');
|
|
|
|
-console.log(form)
|
|
|
|
-const { loading } = useLoading(false);
|
|
|
|
|
|
+const deletedID = ref([]);
|
|
|
|
+
|
|
|
|
+const { loading, startLoading, endLoading } = useLoading(false);
|
|
const { bool: visible, setTrue: openModal } = useBoolean();
|
|
const { bool: visible, setTrue: openModal } = useBoolean();
|
|
|
|
|
|
const pagination: PaginationProps = reactive({
|
|
const pagination: PaginationProps = reactive({
|
|
page: 1,
|
|
page: 1,
|
|
pageSize: 10,
|
|
pageSize: 10,
|
|
showSizePicker: true,
|
|
showSizePicker: true,
|
|
- pageCount: 12,
|
|
|
|
|
|
+ showQuickJumper: true,
|
|
pageSizes: [10, 15, 20, 25, 30],
|
|
pageSizes: [10, 15, 20, 25, 30],
|
|
onUpdatePageSize: (pageSize: number) => {
|
|
onUpdatePageSize: (pageSize: number) => {
|
|
pagination.pageSize = pageSize;
|
|
pagination.pageSize = pageSize;
|
|
|
|
+ serchCondition();
|
|
},
|
|
},
|
|
onUpdatePage: (page: number) => {
|
|
onUpdatePage: (page: number) => {
|
|
pagination.page = page;
|
|
pagination.page = page;
|
|
|
|
+ serchCondition();
|
|
}
|
|
}
|
|
});
|
|
});
|
|
-console.log(pagination.page, pagination.pageSize)
|
|
|
|
-type RowData = {
|
|
|
|
- key: number
|
|
|
|
- id: number
|
|
|
|
- name: string
|
|
|
|
- description: string
|
|
|
|
- createTime: string
|
|
|
|
- modifyTime: string
|
|
|
|
- createUid: number
|
|
|
|
- disabled: string
|
|
|
|
-}
|
|
|
|
-const rowKey = (row: RowData) => row.id
|
|
|
|
|
|
+// const page = ref(0)
|
|
|
|
+// const pageSize = ref(0)
|
|
const checkedRowKeysRef = ref<DataTableRowKey[]>([]);
|
|
const checkedRowKeysRef = ref<DataTableRowKey[]>([]);
|
|
const pageDate = ref([]);
|
|
const pageDate = ref([]);
|
|
|
|
|
|
@@ -169,7 +166,7 @@ function handleAddTable() {
|
|
init();
|
|
init();
|
|
}
|
|
}
|
|
|
|
|
|
-
|
|
|
|
|
|
+// selectAll()
|
|
// 编辑
|
|
// 编辑
|
|
const editData = ref<SelectByConditionParams | null>(null);
|
|
const editData = ref<SelectByConditionParams | null>(null);
|
|
function setEditData(data: SelectByConditionParams | null) {
|
|
function setEditData(data: SelectByConditionParams | null) {
|
|
@@ -194,17 +191,29 @@ function setModalType(type: ModalType) {
|
|
modalType.value = type;
|
|
modalType.value = type;
|
|
}
|
|
}
|
|
const s = ref([]) as any;
|
|
const s = ref([]) as any;
|
|
-
|
|
|
|
|
|
+console.log(deletedID)
|
|
|
|
+// 删除
|
|
function deleteSubjectsList() {
|
|
function deleteSubjectsList() {
|
|
- const difference = checkedRowKeysRef.value.filter(item => !s.value.includes(item));
|
|
|
|
- s.value = checkedRowKeysRef.value
|
|
|
|
|
|
+ const difference = deletedID.value.filter(item => !s.value.includes(item));
|
|
|
|
+ s.value = deletedID.value
|
|
|
|
+
|
|
for (let i = 0; i < difference.length; i++) {
|
|
for (let i = 0; i < difference.length; i++) {
|
|
deleteSubjects(Number(difference[i]));
|
|
deleteSubjects(Number(difference[i]));
|
|
}
|
|
}
|
|
- init();
|
|
|
|
|
|
+ // init();
|
|
|
|
+ selectByCondition(pagination.page, pagination.pageSize, conditionParams).then(r => {
|
|
|
|
+ pageDate.value = r.data as [];
|
|
|
|
+ }).catch(() => {
|
|
|
|
+ console.log('jdias')
|
|
|
|
+ })
|
|
}
|
|
}
|
|
|
|
+
|
|
|
|
+const rowKey = (row: SelectByConditionParams) => { return row.id }
|
|
|
|
+console.log(rowKey)
|
|
function handleCheck(rowKeys: DataTableRowKey[]) {
|
|
function handleCheck(rowKeys: DataTableRowKey[]) {
|
|
|
|
+ console.log(checkedRowKeysRef.value, rowKeys, 'jdaspo')
|
|
checkedRowKeysRef.value = rowKeys;
|
|
checkedRowKeysRef.value = rowKeys;
|
|
|
|
+
|
|
}
|
|
}
|
|
function serchCondition() {
|
|
function serchCondition() {
|
|
selectByCondition(pagination.page, pagination.pageSize, conditionParams).then(r => {
|
|
selectByCondition(pagination.page, pagination.pageSize, conditionParams).then(r => {
|
|
@@ -214,10 +223,15 @@ function serchCondition() {
|
|
})
|
|
})
|
|
}
|
|
}
|
|
function init() {
|
|
function init() {
|
|
- serchCondition();
|
|
|
|
|
|
+ startLoading();
|
|
|
|
+ setTimeout(() => {
|
|
|
|
+ serchCondition();
|
|
|
|
+ }, 1000)
|
|
|
|
+ endLoading();
|
|
}
|
|
}
|
|
|
|
|
|
// 初始化
|
|
// 初始化
|
|
init();
|
|
init();
|
|
|
|
+provide('init', init);
|
|
</script>
|
|
</script>
|
|
<style scoped></style>
|
|
<style scoped></style>
|