<template> <!-- 工程项目移交 --> <div class="accessStatistics"> <div class="top"> <el-form ref="ruleForm" inline :model="form"> <el-form-item label="所属分类:" prop="typeId"> <el-tree-select v-model="form.typeId" :data="treeData" node-key="id" :render-after-expand="false" :props="{ label: 'typeName' }" check-strictly clearable style="width: 100%" /> </el-form-item> <el-form-item label="文件名称:" prop="fileName"> <el-input v-model="form.fileName" placeholder="请输入文件名称" /> </el-form-item> <el-form-item> <el-button type="primary" icon="Search" @click="search"> 搜索</el-button> <el-button icon="Refresh" @click="resetQuery">重置</el-button> </el-form-item> </el-form> </div> <el-table :data="tableData" v-loading="loading" stripe :max-height="600"> <el-table-column type="index" width="55" label="序号" /> <el-table-column label="文件名称" prop="fileName" show-overflow-tooltip width="200" /> <el-table-column label="文件编号" prop="fileCode" show-overflow-tooltip /> <el-table-column label="创建时间" prop="createTime" show-overflow-tooltip /> <el-table-column label="文件大小" prop="size" show-overflow-tooltip> <template #default="{ row }"> <span>{{ row.size ? (row.size > 1024 ? (row.size / 1024 / 1024).toFixed(2) + 'M' : (row.size / 1024).toFixed(2) + 'KB') : '-' }}</span> </template> </el-table-column> <el-table-column label="阅读统计(次数)" show-overflow-tooltip> <el-table-column label="最近一年" prop="yearCount" show-overflow-tooltip /> <el-table-column label="最近三个月" prop="threeMonthCount" show-overflow-tooltip /> <el-table-column label="最近一周" prop="weekCount" show-overflow-tooltip /> <el-table-column label="昨日" prop="yesterdayCount" show-overflow-tooltip /> <el-table-column label="今日" prop="todayCount" show-overflow-tooltip /> </el-table-column> </el-table> <pagination :total="total" v-model:page="pageNum" v-model:limit="pageSize" @pagination="getTableList" /> </div> </template> <script setup> import { reactive, ref, onMounted } from 'vue'; import { usePagination } from '@/hooks'; import { documentTypeTree } from '@/api/document/dataClassify'; import { documentAccessRecordReadCount } from '@/api/document/fileManagement/loanRecord'; const { proxy } = getCurrentInstance(); const form = reactive({ typeId: '', fileName: '', }); const fileList = ref([]); const treeData = ref([]); const { pageNum, pageSize, tableData, total, loading, getTableList } = usePagination(documentAccessRecordReadCount, { value: form }); const search = () => { pageNum.value = 1; getTableList(); }; const resetQuery = () => { proxy.$refs.ruleForm.resetFields(); search(); }; const getTreeData = async () => { const res = await documentTypeTree(); if (res?.code !== 200) return; treeData.value = res.data || []; }; onMounted(() => { getTableList(); getTreeData(); }); </script> <style lang="scss" scoped> .accessStatistics { padding: 20px; height: 90vh; overflow-y: hidden; .top { margin-bottom: 15px; } } :deep(.dialog) { .el-dialog__body { padding-bottom: 20px !important; } .el-dialog__footer { padding-top: 0 !important; } } </style>