<!-- 选择体系文件 --> <script lang="ts" setup name="SelectSysFileDialog"> import { ElMessage } from 'element-plus' import type { Ref } from 'vue' import { ref } from 'vue' import dayjs from 'dayjs' import type { DateModelType } from 'element-plus' import type { TableColumn } from '../../../../../components/NormalTable/table_interface' import type { deptType } from '@/global' import { getDictByCode } from '@/api/system/dict' import { delFileSystem, getFileSystemList } from '@/api/resource/fileSystem' import { getFileApprovalFormList } from '@/api/resource/fileApproval' import { getBuildList } from '@/api/equipment/standard/build' import { SCHEDULE } from '@/utils/scheduleDict' const emits = defineEmits(['confirm']) const dialogFormVisible = ref(false) // 查询条件 const listQuery = ref({ fileNo: '', // 文件编号 fileName: '', // 文件名 fileDistributeNo: '', // 文件发放号 fileType: '', // 文件类别 history: '0', // 体系文件 labCode: '', // 实验室代码 groupCode: '', // 组别代码、部门 effectiveDateStart: '', // 实施时间开始 effectiveDateEnd: '', // 实施时间结束 promulgateTimeEnd: '', // 颁布时间开始 promulgateTimeStart: '', // 颁布时间结束 versionNo: '', // 版本号 offset: 1, limit: 20, }) // 多选选中的内容 const checkoutList = ref([]) const dateRange = ref<[DateModelType, DateModelType]>(['', ''])// 筛选时间段数据 const loadingTable = ref(false) const list = ref([]) // 表格数据 const total = ref(0) const columns = ref<TableColumn[]>([ { text: '实验室', value: 'labCodeName', align: 'center' }, { text: '部门', value: 'groupCodeName', align: 'center' }, { text: '文件类型', value: 'fileTypeName', align: 'center', width: '140' }, { text: '文件编号', value: 'fileNo', align: 'center', width: '180' }, { text: '文件名称', value: 'fileName_hide', align: 'center', followLink: true, width: '220' }, { text: '版本号', value: 'versionNo', align: 'center' }, { text: '颁布日期', value: 'promulgateTime', align: 'center', width: '120' }, { text: '实施日期', value: 'effectiveDate', align: 'center', width: '120' }, { text: '发放号', value: 'fileDistributeNo', align: 'center' }, { text: '编制人', value: 'createUserName', align: 'center' }, ]) // -----------------------------------------字典-------------------------------------------------------------- const useDeptList = ref<deptType[]>([]) // 部门 const labDeptList = ref<deptType[]>([]) // 实验室 const fileTypeList = ref<deptType[]>([]) // 文件类型 // 查询字典 const getDictFun = () => { // 实验室 getDictByCode('bizLabCode').then((response) => { labDeptList.value = response.data }) // 部门 getDictByCode('bizGroupCode').then((response) => { useDeptList.value = response.data }) // 文件类型 getDictByCode('bizFileType').then((response) => { fileTypeList.value = response.data }) } getDictFun() // ------------------------------------------------------------------------------------------------------- // 数据查询 function fetchData(isNowPage = false) { loadingTable.value = true if (!isNowPage) { // 是否显示当前页,否则跳转第一页 listQuery.value.offset = 1 } getFileSystemList(listQuery.value).then((response) => { if (response.code === 200) { list.value = response.data.rows.map((item: { fileName: string; effectiveDate: string; promulgateTime: string }) => { return { ...item, effectiveDate: dayjs(item.effectiveDate).format('YYYY-MM-DD') !== 'Invalid Date' ? dayjs(item.effectiveDate).format('YYYY-MM-DD') : '', promulgateTime: dayjs(item.promulgateTime).format('YYYY-MM-DD') !== 'Invalid Date' ? dayjs(item.promulgateTime).format('YYYY-MM-DD') : '', followLinkArr: [item.fileName], } }) total.value = parseInt(response.data.total) } loadingTable.value = false }).catch(() => { loadingTable.value = false }) } // 重置 const clearList = () => { listQuery.value = { fileNo: '', // 文件编号 fileName: '', // 文件名 fileDistributeNo: '', // 文件发放号 fileType: '', // 文件类别 history: '0', // 体系文件 labCode: '', // 实验室代码 groupCode: '', // 组别代码、部门 effectiveDateStart: '', // 实施时间开始 effectiveDateEnd: '', // 实施时间结束 promulgateTimeEnd: '', // 颁布时间开始 promulgateTimeStart: '', // 颁布时间结束 versionNo: '', // 版本号 offset: 1, limit: 20, } dateRange.value = ['', ''] fetchData() } // 搜索 const search = () => { fetchData(true) } // 多选选中 const handleSelectionChange = (val: any) => { checkoutList.value = val } // 页数发生变化后的操作,可能是页码变化,可能是每页容量变化,此函数必写 const changePage = (val: { size?: number;page?: number }) => { if (val && val.size) { listQuery.value.limit = val.size } if (val && val.page) { listQuery.value.offset = val.page } search() } // 点击确定 const confirmSelect = () => { if (!checkoutList.value.length) { ElMessage.warning('请选择体系文件') } else { emits('confirm', checkoutList.value) dialogFormVisible.value = false } } // 取消 const resetForm = () => { dialogFormVisible.value = false clearList() } // 初始化 const initDialog = () => { dialogFormVisible.value = true fetchData() } // ------------------------------------------钩子------------------------------------------------ defineExpose({ initDialog }) </script> <template> <el-dialog v-if="dialogFormVisible" v-model="dialogFormVisible" title="选择体系文件" width="65%"> <!-- 筛选条件 --> <search-area :need-clear="true" @search="search" @clear="clearList"> <search-item> <el-select v-model="listQuery.labCode" placeholder="实验室" class="short-input" filterable clearable > <el-option v-for="item in labDeptList" :key="item.id" :label="item.name" :value="item.value" /> </el-select> </search-item> <search-item> <el-select v-model="listQuery.groupCode" placeholder="部门" class="short-input" filterable clearable > <el-option v-for="item in useDeptList" :key="item.id" :label="item.name" :value="item.value" /> </el-select> </search-item> <search-item> <el-select v-model="listQuery.fileType" class="short-input" placeholder="文件类型" clearable> <el-option v-for="item in fileTypeList" :key="item.id" :value="item.value" :label="item.name" /> </el-select> </search-item> <search-item> <el-input v-model.trim="listQuery.fileNo" placeholder="文件编号" clearable /> </search-item> <search-item> <el-input v-model.trim="listQuery.fileName" placeholder="文件名称" clearable /> </search-item> </search-area> <!-- 查询结果Table显示 --> <div style="padding: 12px;"> <normal-table :data="list" :total="total" :columns="columns" :query="listQuery" is-showmulti-select :list-loading="loadingTable" :height="520" @change="changePage" @multi-select="handleSelectionChange" > <!-- 序号 --> <template #preColumns> <el-table-column label="#" width="55" align="center" fixed> <template #default="scope"> {{ (listQuery.offset - 1) * listQuery.limit + scope.$index + 1 }} </template> </el-table-column> </template> </normal-table> </div> <template #footer> <span class="dialog-footer"> <el-button type="primary" @click="confirmSelect">确认</el-button> <el-button @click="resetForm"> 取消 </el-button> </span> </template> </el-dialog> </template> <style lang="scss" scoped> :deep(.el-radio__label) { display: none; } </style>