| | |
| | | <el-form-item label="标题" prop="title"> |
| | | <el-input v-model="queryParams.title" style="width: 226.4px" placeholder="标题" clearable /> |
| | | </el-form-item> |
| | | |
| | | <el-form-item> |
| | | <el-button type="primary" icon="ele-Search" @click="handleQueryTable"> 查询 </el-button> |
| | | <el-button icon="ele-Refresh" @click="resetQuery">重置 </el-button> |
| | | <el-button icon="ele-Plus" @click="openOptDlg()"> 添加 </el-button> |
| | | </el-form-item> |
| | |
| | | class="flex-auto" |
| | | border |
| | | :row-class-name="isDragStatus ? 'cursor-move' : 'cursor-pointer'" |
| | | :data="displayTableData" |
| | | :data="showPageList" |
| | | highlight-current-row |
| | | > |
| | | <template v-for="item in columnList" :key="item.prop"> |
| | |
| | | |
| | | <script setup lang="ts"> |
| | | import { useDraggable } from '@vueuse/core'; |
| | | import { travelTree } from '/@/utils/util'; |
| | | |
| | | import { computed, onMounted, ref } from 'vue'; |
| | | import { usePageDisplay } from '/@/hooks/usePageDisplay'; |
| | | import { useQueryTable } from '/@/hooks/useQueryTable'; |
| | | // import { useTableSort } from '/@/hooks/useTableSort'; |
| | | // import { useValidateUniqueness } from '/@/hooks/useValidateUniqueness'; |
| | | import axios, { CancelTokenSource } from 'axios'; |
| | | import type { FormInstance, FormRules } from 'element-plus'; |
| | | import { ElMessage, ElMessageBox } from 'element-plus'; |
| | | import { nextTick } from 'vue'; |
| | | import { computed, nextTick, onMounted, ref, watch } from 'vue'; |
| | | import SqlAmisEdit from './edit/SqlAmisEdit.vue'; |
| | | import OptDlg from './optDlg/OptDlg.vue'; |
| | | import { SupervisorPublished, supervisorPublishedMap } from './types'; |
| | |
| | | import ColFilter from '/@/components/table/colFilter/ColFilter.vue'; |
| | | import { TableCol } from '/@/components/table/colFilter/types'; |
| | | import LeftTreeByMgr from '/@/components/tree/leftTreeByMgr.vue'; |
| | | import { usePageDisplay } from '/@/hooks/usePageDisplay'; |
| | | import { useQueryTable } from '/@/hooks/useQueryTable'; |
| | | import { useSearch } from '/@/hooks/useSearch'; |
| | | import { useUpdateData } from '/@/hooks/useUpdateData'; |
| | | import emitter from '/@/utils/mitt'; |
| | | import { deepClone } from '/@/utils/other'; |
| | | import { gotoRoute } from '/@/utils/route'; |
| | | import { useCompRef } from '/@/utils/types'; |
| | | import { convertListToTree } from '/@/utils/util'; |
| | | import { convertListToTree, debounce, travelTree } from '/@/utils/util'; |
| | | import { OptClassificationMap, classificationEnum } from '/@/views/types/metrics'; |
| | | |
| | | const columnList = ref<TableCol[]>([ |
| | | { prop: 'title', label: '标题', width: 300, fixed: 'left' }, |
| | | { prop: 'published', label: '发布状态', width: 85 }, |
| | |
| | | const listData = ref([]); |
| | | const currentListID = computed(() => currentNode.value?.group_id); |
| | | const currentNode = ref(null); |
| | | |
| | | const listTreeData = computed(() => { |
| | | const byParentData = convertListToTree(listData.value, { |
| | | ID: 'group_id', |
| | |
| | | return item; |
| | | }); |
| | | } |
| | | tableData.value = allTableData.value.filter((item) => item.group_id === currentListID.value); |
| | | let selNode = currentNode.value; |
| | | let curGroupID = []; |
| | | if (selNode.children && selNode.children.length > 0) { |
| | | selNode.children.forEach((item) => { |
| | | curGroupID.push(item.group_id); |
| | | }); |
| | | } else { |
| | | curGroupID.push(selNode.group_id); |
| | | } |
| | | let page_data = []; |
| | | curGroupID.forEach((curItem) => { |
| | | allTableData.value.forEach((sample) => { |
| | | if (curItem == sample.group_id) page_data.push(sample); |
| | | }); |
| | | }); |
| | | tableData.value = page_data; |
| | | }; |
| | | //#endregion |
| | | |
| | |
| | | const queryParams = ref({ |
| | | title: '', |
| | | }); |
| | | const { resetQuery, handleQueryTable, displayTableData } = useQueryTable(tableData, queryParams, () => { |
| | | displayTableData.value = tableData.value; |
| | | const { query: queryTerminology, queryData: showPageList } = useSearch(tableData, queryParams); |
| | | const pageQuery = debounce(queryTerminology); |
| | | watch( |
| | | () => queryParams.value.title, |
| | | (val) => { |
| | | pageQuery(); |
| | | } |
| | | ); |
| | | const { resetQuery, handleQueryTable } = useQueryTable(tableData, queryParams, () => { |
| | | showPageList.value = tableData.value; |
| | | }); |
| | | |
| | | //#endregion |
| | | |
| | | //#region ====================== 查询快捷键 ====================== |
| | |
| | | }); |
| | | </script> |
| | | <style scoped lang="scss"></style> |
| | | , watch |