OnlineEducation-teacher-front/src/views/myResources/myResources.vue

<template>
		<a-card>
			<!-- 标签页 -->
			<a-tabs v-model:activeKey="formState.verifyStatus" @change="tabChange">
				<a-tab-pane key="0,3" tab="未发布" v-if="!pageType"></a-tab-pane>
				<a-tab-pane key="1" tab="待审核"></a-tab-pane>
				<a-tab-pane key="2" tab="已发布"></a-tab-pane>
				<!-- <a-tab-pane key="3" tab="已审核" v-if="pageType == 'economize'"></a-tab-pane> -->
				<a-tab-pane key="4" tab="回收站"></a-tab-pane>
			</a-tabs>
			<!-- 搜索和操作区域 -->
			<a-card style="margin-bottom: 16px">
				<div style="display: flex; justify-content: space-between ;">
					<div style="display: flex; flex-direction: column;  width: 200%;">
						<!-- 第一行：名称、院系、类型 -->
						<a-row :gutter="16" style="margin-bottom: 16px">
							<a-col :span="6">
								<span>名称：</span>
								<a-input
									v-model:value="formState.fileName"
									placeholder="请输入名字"
									style="width: calc(100% - 50px); margin-left: 8px"
								/>
							</a-col>
							<a-col :span="6">
								<span>层级：</span>
								<a-cascader
									style="width: calc(100% - 50px); margin-left: 8px"
									v-model:value="majorIdName"
									:options="collegeMajorOptions"
									:fieldNames="{ label: 'name', value: 'id', children: 'children' }"
									placeholder="请选择"
									changeOnSelect
									@change="changeCollegeMajor"
								/>
							</a-col>
							<a-col :span="6">
								<span>类型：</span>
								<a-cascader
									style="width: calc(100% - 50px); margin-left: 8px"
									v-model:value="resourceName"
									:options="resourceTypeOptions"
									:fieldNames="{ label: 'name', value: 'id', children: 'children' }"
									placeholder="请选择"
									changeOnSelect
									@change="changeCollegeResource"
								/>
							</a-col>

						</a-row>

						<!-- 第二行：状态、租户、创建人 -->
						<a-row :gutter="16">
							<a-col :span="6">
								<span>状态：</span>
								<a-select
									v-if="['0,3', '0', '3'].includes(formState.verifyStatus)"
									v-model:value="isVerifyStatus"
									placeholder="请选择"
									style="width: calc(100% - 50px); margin-left: 8px"
								>
									<a-select-option value="0">未发布</a-select-option>
									<a-select-option value="3">未通过</a-select-option>
								</a-select>
								<a-select
									v-else
									v-model:value="formState.suffix"
									style="width: calc(100% - 50px); margin-left: 8px"
									:options="fileformatOptions"
									:fieldNames="{ label: 'fileExtendName', value: 'fileExtendName', children: 'children' }"
									placeholder="请选择"
								/>
							</a-col>
							<!--				<a-col :span="6">-->
							<!--					<span>租户：</span>-->
							<!--					<a-input placeholder="请选择" style="width: calc(100% - 50px); margin-left: 8px" disabled />-->
							<!--				</a-col>-->
<!--							<a-col :span="6">-->
<!--								<span>创建人：</span>-->
<!--								<a-input placeholder="请输入名字" style="width: calc(100% - 64px); margin-left: 8px" />-->
<!--							</a-col>-->

						</a-row>
						<a-row style="margin-top: 16px">
							<a-col :span="24" style="text-align: left">
								<a-button
									type="primary"
									style="margin-right: 8px"
									v-if="formState.verifyStatus === '0,3' && !pageType"
									@click="batchPublish"
									:disabled="selectedRowKeys.length === 0"
								>
									+ 批量发布
								</a-button>
								<a-button type="primary" v-if="!pageType && formState.verifyStatus === '0,3'" @click="showUploadModal">+ 新增</a-button>
							</a-col>
						</a-row>
					</div>

					<div>
						<a-button type="primary" @click="handleSearch">查询</a-button>
						<a-button @click="handleReset" style="margin-top: 20px">重置</a-button>
					</div>
				</div>






			</a-card>
			<!-- 表格 -->
			<a-table
				:columns="columnsPending"
				:data-source="dataSource"
				:pagination="false"
				:loading="loading"
				bordered
				:row-key="(record) => record.id"
				:row-selection="rowSelection"
				:scroll="{ x: 1300 }"
			>
				<template #bodyCell="{ column, text, record }">
					<template
						v-if="
						['fileName', 'collegeAllIdName', 'majorIdName', 'resourceALLTypeName', 'suffix', 'uploadTime'].includes(
							column.dataIndex
						)
					"
					>
						<div class="multiLine-ellipsis" :title="text">{{ text || '-' }}</div>
					</template>
					<!-- 状态列 -->
					<template v-if="column.key === 'verifyStatus'">
					<span v-if="record.verifyStatus === '0'">
						<a-badge status="processing" text="未发布" />
					</span>

						<span v-else-if="record.verifyStatus === 'uploaded'">
						<a-badge status="success" text="已上传" />
					</span>
						<span v-else-if="record.verifyStatus === '1'">
						<a-badge status="default" text="待审核" />
					</span>
						<span v-else-if="record.verifyStatus === '2'">
						<a-badge status="success" text="已发布" />
					</span>
						<span v-if="record.verifyStatus === '3'">
						<a-badge status="error" text="未通过" />
					</span>
						<span v-else-if="record.verifyStatus === '4'">
						<a-badge status="error" text="已删除" />
					</span>
					</template>
					<template v-if="column.dataIndex === 'fileUrl'">
						<!-- 动态图标 + 格式提示 -->
						<a-tooltip :title="`${record.suffix || '未知'}`">
							<component
								:is="fileTypeIcons[record.suffix?.toLowerCase()] || fileTypeIcons['*']"
								:style="{ fontSize: '24px', color: getIconColor(record.suffix) }"
							/>
						</a-tooltip>
					</template>
					<!-- 个人资源操作列 -->
					<template v-if="column.key === 'action' && !pageType">
						<div class="editable-cell">
							<span v-if="formState.verifyStatus === '0,3'" style="cursor:  pointer" @click="handlePublish(record)">发布</span>
							<span v-if="formState.verifyStatus === '4'"  style="cursor:  pointer" @click="handleRestore(record)">恢复</span>

							<a-dropdown>
								<span class="ant-dropdown-link" style="cursor:  pointer">
									更多
									<DownOutlined />
								</span>
								<template #overlay>
									<a-menu>
										<a-menu-item>
											<a href="javascript:;" @click="handleView(record)">预览</a>
										</a-menu-item>
										<a-menu-item>
											<a
												target="_blank"
												style="display: block; color: inherit"
												:href="$file.getDownloadFilePath3(record)"
												:download="record.fileName"
											>
												下载
											</a>
										</a-menu-item>
										<a-menu-item v-if="formState.verifyStatus == '2'">
											<a-popconfirm title="确认下架吗?" @confirm="resourcesDown(record)">
												<a href="javascript:;">下架</a>
											</a-popconfirm>
										</a-menu-item>
										<a-menu-item >
											<a href="javascript:;" @click="edit(record)">编辑</a>
										</a-menu-item>
										<a-menu-item v-if="formState.verifyStatus !== '2'">
											<a-popconfirm title="确认删除吗?" @confirm="resourcesDelete(record)">
												<a href="javascript:;">删除</a>
											</a-popconfirm>
										</a-menu-item>
									</a-menu>
								</template>
							</a-dropdown>
						</div>
					</template>
					<!-- 资源管理操作列 -->
					<template v-if="column.key === 'action' && pageType == 'economize'">
						<div class="editable-cell">
							<a v-if="formState.verifyStatus === '1'" @click="handleAudit(record)">审核</a>
							<a v-if="formState.verifyStatus === '2'" @click="handlePermission(record)">权限</a>
							<a v-if="formState.verifyStatus === '4'" @click="handleRestore(record)">恢复</a>
							<a-divider type="vertical" />
							<a-dropdown>
								<a class="ant-dropdown-link">
									更多
									<DownOutlined />
								</a>
								<template #overlay>
									<a-menu>
										<a-menu-item>
											<a href="javascript:;" @click="handleView(record)">预览</a>
										</a-menu-item>
										<a-menu-item>
											<a
												target="_blank"
												style="display: block; color: inherit"
												:href="$file.getDownloadFilePath3(record)"
												:download="record.fileName"
											>
												下载
											</a>
										</a-menu-item>
										<a-menu-item v-if="formState.verifyStatus !== '1'">
											<a-popconfirm title="确认删除吗?" @confirm="resourcesDelete(record)">
												<a href="javascript:;">删除</a>
											</a-popconfirm>
										</a-menu-item>
									</a-menu>
								</template>
							</a-dropdown>
						</div>
					</template>
				</template>
			</a-table>
			<div class="dis-flex-sb margin-top">
				<div>
					<a-button @click="selectAll">选择全部</a-button>
					<a-button @click="invertSelection" style="margin-left: 8px">反选选择</a-button>
				</div>
				<div>
					<CustomPagination
						:total="pagination.total"
						:current="pagination.pageNum"
						:pageSize="pagination.pageSize"
						:showQuickJumper="true"
						:showSizeChanger="true"
						:showTotal="(total) => `共 ${total} 条数据`"
						@change="handlePageChange"
						@showSizeChange="handlePageSizeChange"
					/>
				</div>
			</div>
			<!-- 权限树模态框 -->
			<permissionTree v-if="permissionTreeVisible" @close="permissionTreeVisible = false"></permissionTree>
			<!-- 审核播放模态框 -->
			<auditModal
				v-if="auditModalVisible"
				:recordData="publishedData"
				:isAudit="auditState"
				@confirm="auditConfirm"
				@close="auditModalVisible = false"
			></auditModal>
			<!-- 资源上传模态框 -->
			<resourceUpload
				v-if="uploadModalVisible"
				:isState="isState"
				:isVerifyStatus="formState.verifyStatus"
				:resourcesId="editResourcesId"
				@close="uploadModalVisible = false"
				@getList="getList"
			></resourceUpload>
			<!-- 发布模态框 -->
			<releaseModal v-if="releaseVisible" @close="releaseVisible = false" @confirm="releaseConfirm"></releaseModal>
			<div style="height: 20px"></div>
			<span>容量</span><span style="color: #6abe39"> {{ bToGb(storageMin) }} GB</span><span> / </span
		><span style="color: red">{{ bToGb(storageMax) }} GB</span>
		</a-card>

</template>

<script setup>
	import { ref, onMounted } from 'vue'
	import { DownOutlined } from '@ant-design/icons-vue'
	import releaseModal from './releaseModal.vue'
	import resourceUpload from './resourceUpload.vue'
	import resourceAuditApi from '@/api/resourceAudit.js'
	import permissionTree from './permissionTree.vue'
	import auditModal from './auditModal.vue'
	import { getstorage } from '@/api/myResource/user'
	import CustomPagination from '@/components/customPagination.vue'
	import tool from '@/utils/tool'
	import { useRoute, useRouter } from 'vue-router'
	const router = useRouter()
	// eslint-disable-next-line vue/no-setup-props-destructure
	const { pageType } = defineProps({
		pageType: {
			type: String,
			default: () => {}
		}
	})
	const fileTypeIcons = {
		// 图片类
		jpg: 'FileImageOutlined',
		jpeg: 'FileImageOutlined',
		png: 'FileImageOutlined',
		gif: 'FileImageOutlined',

		// 文档类
		pdf: 'FilePdfOutlined',
		ppt: 'FilePptOutlined',
		pptx: 'FilePptOutlined',
		doc: 'FileWordOutlined',
		docx: 'FileWordOutlined',
		xls: 'FileExcelOutlined',
		xlsx: 'FileExcelOutlined',
		txt: 'FileTextOutlined',

		// 视频类
		mp4: 'PlaySquareOutlined',
		mov: 'PlaySquareOutlined',

		// 压缩包
		zip: 'FileZipOutlined',
		rar: 'FileZipOutlined',

		// 默认图标
		'*': 'FileOutlined'
	}
	// 数据源
	const dataSource = ref([])
	//发布按钮状态
	const releaseVisible = ref(false)
	const permissionTreeVisible = ref(false) //权限树
	const auditModalVisible = ref(false) //播放审核
	const isPublishBulk = ref(false) //是否批量发布
	const loading = ref(false) // 列表loading
	const isState = ref(0) //是否是编辑  0:新增 1:编辑
	const isVerifyStatus = ref(null) //未发布状态 0未发布 3已驳回
	const editResourcesId = ref(null) //资源id

	const storageMin = ref(0) //资源id
	const storageMax = ref(0) //资源id

	// 搜索值
	const searchValue = ref('')
	//课程类型
	const courseTypeOptions = tool.dictList('COURSE_TYPE')
	const suffixTypeOptions = ref([])
	const pagination = reactive({
		pageSize: 10,
		pageNum: 1,
		total: 0
	})
	const formState = reactive({
		fileName: null,
		verifyStatus: '0,3',
		resourcesId: null,
		// majorId: null, //专业
		collegeId: null, //院校一级id
		collegeTwoId: null, //院校二级id
		collegeThreeId: null, //院校三级id
		resourceType: null, //资源类型一级
		resourceTwoType: null, //资源类型二级
		suffix: null
	})
	// 添加选择状态
	const majorIdName = ref([])
	const resourceName = ref([])
	const majorOptions = ref([]) //专业
	const selectedRowKeys = ref([])
	const selectedRows = ref([])
	const publishedData = ref([]) //当前点击数据
	// 行选择配置
	const rowSelection = computed(() => {
		return {
			selectedRowKeys: selectedRowKeys.value,
			onChange: (keys, rows) => {
				selectedRowKeys.value = keys
				selectedRows.value = rows
			},
			onSelectAll: (selected, selectedRows, changeRows) => {
				if (selected) {
					// 全选当前页
					selectedRowKeys.value = dataSource.value.map((item) => item.id)
					selectedRows.value = dataSource.value
				} else {
					// 取消全选
					selectedRowKeys.value = []
					selectedRows.value = []
				}
			},
			onSelectInvert: () => {
				// 反选当前页
				const allKeys = dataSource.value.map((item) => item.id)
				const newSelectedKeys = allKeys.filter((key) => !selectedRowKeys.value.includes(key))
				selectedRowKeys.value = newSelectedKeys
				selectedRows.value = dataSource.value.filter((item) => newSelectedKeys.includes(item.id))
			}
		}
	})
	// 列定义
	const columnsUnpublished = [
		// {
		// 	title: '编号',
		// 	align: 'center',
		// 	dataIndex: 'fileId',
		// 	key: 'fileId'
		// },
		{
			title: '资源名称',
			align: 'center',
			dataIndex: 'fileName',
			key: 'fileName',

		},
		{
			title: '课件格式',
			align: 'center',
			dataIndex: 'suffix',
			key: 'suffix'
		},
		{
			title: '上传时间',
			dataIndex: 'uploadTime',
			align: 'center',
			key: 'uploadTime'
		},
		{
			title: '状态',
			align: 'center',
			key: 'verifyStatus'
		},
		{
			title: '资源缩略图',
			align: 'center',
			dataIndex: 'fileUrl',
			key: 'fileUrl'
		},
		{
			title: '操作',
			align: 'center',
			width: 150,
			key: 'action'
		}
	]

	const columnsPending = [
		// {
		// 	title: '编号',
		// 	dataIndex: 'id',
		// 	align: 'center',
		// 	key: 'id'
		// },
		{
			title: '资源名称',
			align: 'center',
			dataIndex: 'fileName',
			key: 'fileName'
		},
		{
			title: '所属单位',
			align: 'center',
			dataIndex: 'collegeAllIdName',
			key: 'collegeAllIdName'
		},
		// {
		// 	title: '所属课程',
		// 	align: 'center',
		// 	dataIndex: 'collegeIdName',
		// 	key: 'collegeIdName'
		// },
		// {
		// 	title: '所属专业',
		// 	align: 'center',
		// 	dataIndex: 'majorIdName',
		// 	key: 'majorIdName'
		// },
		{
			title: '资源类型',
			align: 'center',
			dataIndex: 'resourceALLTypeName',
			key: 'resourceALLTypeName',
			width: 110
		},
		{
			title: '资源格式',
			align: 'center',
			dataIndex: 'suffix',
			key: 'suffix',
			width: 90
		},
		{
			title: '上传时间',
			align: 'center',
			dataIndex: 'uploadTime',
			key: 'uploadTime',
			width: 180
		},
		{
			title: '状态',
			align: 'center',
			key: 'verifyStatus',
			width: 100
		},
		{
			title: '资源缩略图',
			align: 'center',
			dataIndex: 'fileUrl',
			key: 'fileUrl',
			width: 110
		},
		{
			title: '操作',
			align: 'center',
			width: 140,
			fixed: 'right',
			key: 'action'
		}
	]

	const columnsPublished = [...columnsPending]
	const columnsRecycle = [...columnsPending]
	const collegeMajorOptions = ref([]) //院校下拉数据
	const resourceTypeOptions = ref([]) //资源类型下拉数据
	const fileformatOptions = ref([]) //资源格式下拉数据
	const currentColumns = computed(() => {
		switch (formState.verifyStatus) {
			case '0':
				return columnsUnpublished
			case '1':
				return columnsPending
			case '2':
				return columnsPublished
			case '3':
				return columnsPublished
			case '4':
				return columnsRecycle
			default:
				return []
		}
	})
	const getIconColor = (suffix) => {
		const type = suffix?.toLowerCase()
		if (['jpg', 'jpeg', 'png', 'gif'].includes(type)) return '#ff4d4f' // 图片红色
		if (['pdf'].includes(type)) return '#f5222d' // PDF红色
		if (['ppt', 'pptx'].includes(type)) return '#fa8c16' // PPT橙色
		if (['doc', 'docx'].includes(type)) return '#1890ff' // Word蓝色
		if (['xls', 'xlsx'].includes(type)) return '#52c41a' // Excel绿色
		return '#666' // 默认灰色
	}
	const getListData = () => {
		loading.value = true
		let params = {
			current: pagination.pageNum,
			size: pagination.pageSize,
			verifyStatus: isVerifyStatus.value ? isVerifyStatus.value : formState.verifyStatus,
			fileName: formState.fileName,
			resourceType: formState.resourceType,
			resourceTwoType: formState.resourceTwoType,
			suffix: formState.suffix,
			// majorId: formState.majorId,
			collegeTwoId: formState.collegeTwoId,
			collegeId: formState.collegeId,
			collegeThreeId: formState.collegeThreeId,
			isSelf: !pageType ? 1 : 0
		}
		resourceAuditApi
			.page(params)
			.then((res) => {
				console.log(res, '资源审核列表')
				dataSource.value = res.data.records
				pagination.total = res.data.total
				loading.value = false
			})
			.catch((err) => {
				console.log(err)
				dataSource.value = []
				pagination.total = 0
				loading.value = false
			})
	}

	const bToMb = (b) => {
		if (typeof b !== 'number' || b < 0) {
			throw new Error('请输入有效的非负数字')
		}
		return (b / (1024 * 1024)).toFixed(2) // 保留两位小数
	}
	const bToGb = (b) => {
		if (typeof b !== 'number' || b < 0) {
			throw new Error('请输入有效的非负数字')
		}
		return (b / (1024 * 1024 * 1024)).toFixed(2) // 保留两位小数
	}

	const changeCollegeMajor = (value, selectedOptions) => {
		console.log('Selected:', value, selectedOptions)
		if (!value) {
			majorIdName.value = ''
			return false
		}
		majorIdName.value = selectedOptions.map((it) => it.name).join('/')
		formState.collegeId = value[0] || null
		formState.collegeTwoId = value[1] || null
		formState.collegeThreeId = value[2] || null
		if (selectedOptions.length) {
			// 获取选中的最后一级
			const lastSelected = selectedOptions[selectedOptions.length - 1]
			console.log(lastSelected, '最后一级id')
			getCollegeMajor(lastSelected.id)
		}
	}
	const changeCollegeResource = (value, selectedOptions) => {
		console.log('Selected:', value, selectedOptions)
		if (!value) {
			resourceName.value = ''
			formState.resourceType = undefined
			formState.resourceTwoType = undefined
			return false
		}
		resourceName.value = selectedOptions.map((it) => it.name).join('/')
		formState.resourceType = value[0] || undefined
		formState.resourceTwoType = value[1] || undefined

		console.log('已经修改:', formState)
	}
	const getList = () => {
		getListData()
		uploadModalVisible.value = false
	}
	//院系组织查询
	const getOrgTreeSelector = () => {
		resourceAuditApi
			.orgTreeSelector()
			.then((res) => {
				console.log(res.data, '获取组织树选择器')
				collegeMajorOptions.value = res.data
			})
			.catch((err) => {
				console.log(err)
			})
	}
	//资源类型下拉查询
	const getResourceTypeTree = () => {
		resourceAuditApi
			.resourceTypeTree()
			.then((res) => {
				console.log(res.data, '资源类型下拉')
				resourceTypeOptions.value = res.data
			})
			.catch((err) => {
				console.log(err)
			})
	}
	//资源格式下拉查询
	const getFileformat = () => {
		resourceAuditApi
			.fileformat()
			.then((res) => {
				console.log(res.data, '资源类型下拉')
				fileformatOptions.value = res.data.records
			})
			.catch((err) => {
				console.log(err)
			})
	}
	const getCollegeMajor = (id) => {
		resourceAuditApi
			.zyselect({ collegeId: id })
			.then((res) => {
				console.log(res.data, '专业下拉数据')
				majorOptions.value = res.data
			})
			.catch((err) => {
				console.log(err)
			})
	}
	// 方法
	const handleSearch = () => {
		console.log('Search:', searchValue.value)
		getListData()
	}

	const handleReset = () => {
		searchValue.value = null
		majorIdName.value = null
		resourceName.value = null
		isVerifyStatus.value = null
		if (formState.verifyStatus == '3' || formState.verifyStatus == '0') {
			formState.verifyStatus = '0,3'
		}
		formState.fileName = null
		formState.resourceType = null
		formState.resourceTwoType = null
		formState.suffix = null
		formState.collegeTwoId = null
		// formState.majorId = null
		formState.collegeId = null
		formState.collegeThreeId = null
		getListData()
	}
	const tabChange = () => {
		dataSource.value = []
		getListData()
	}
	//发布
	const handlePublish = (record) => {
		publishedData.value = record
		releaseVisible.value = true
		isPublishBulk.value = false
	}
	// 批量发布方法
	const batchPublish = () => {
		if (selectedRows.value.length === 0) {
			message.warning('请至少选择一条记录')
			return
		}
		isState.value = 0
		isPublishBulk.value = true
		releaseVisible.value = true
	}
	// 全选当前页数据
	const selectAll = () => {
		selectedRowKeys.value = dataSource.value.map((item) => item.id)
		selectedRows.value = dataSource.value
	}

	// 反选当前页数据
	const invertSelection = () => {
		const allKeys = dataSource.value.map((item) => item.id)
		const newSelectedKeys = allKeys.filter((key) => !selectedRowKeys.value.includes(key))
		selectedRowKeys.value = newSelectedKeys
		selectedRows.value = dataSource.value.filter((item) => newSelectedKeys.includes(item.id))
	}
	//发布确定
	const releaseConfirm = (obj) => {
		console.log(obj, selectedRows.value, '传回来的数据')
		releaseVisible.value = false
		if (isPublishBulk.value) {
			// const batchParams = selectedRows.value.map((item) => ({
			// 	id: item.id,
			// 	coverImage: item.coverImage,
			// 	resourceDesc: item.resourceDesc,
			// 	verifyStatus: 1
			// }))
			const params = {
				ids: selectedRows.value.map((item) => item.id).join(','),
				coverImage: obj.coverImageId,
				resourceDesc: obj.courseDesc,
				verifyStatus: 1
			}
			console.log(params, '批量发布参数')
			handleRelease(params)
		} else {
			const params = {
				ids: publishedData.value.id,
				coverImage: obj.coverImageId,
				resourceDesc: obj.courseDesc,
				verifyStatus: 1
			}
			console.log(params, '发布参数')
			handleRelease(params)
		}
	}
	// updateStatus接口调用
	const handleRelease = (Params) => {
		resourceAuditApi
			.updateStatus(Params)
			.then((res) => {
				getListData()
				selectedRowKeys.value = []
			})
			.catch((err) => {
				console.error(err)
			})
	}
	const auditState = ref(null)
	const handleAudit = (record) => {
		// console.log('Audit:', record)
		// publishedData.value = record
		// auditState.value = true
		// auditModalVisible.value = true
		router.push({
			path: '/portal/resourceDetails',
			query: {
				id: record.id,
				state: 1,
				audit: 1
			}
		})
	}
	const handleView = (record) => {
		router.push({
			path: '/portal/resourceDetails',
			query: {
				id: record.id,
				state: 1
			}
		})
		// publishedData.value = record
		// auditState.value = false
		// auditModalVisible.value = true
	}
	const handleDownload = (record) => {
		resourceAuditApi
			.downloadfile({
				userFileId: record.fileId,
				shareBatchNum: record.shareBatchNum == null ? '' : record.shareBatchNum,
				extractionCode: record.extractionCode == null ? '' : record.extractionCode,
				admin: true
			})
			.then((res) => {
				console.log('下载成功:', res)
				// 创建Blob对象
				const url = window.URL.createObjectURL(new Blob([res]))
				const link = document.createElement('a')
				link.href = url
				link.download = record.fileName || `file_${record.id}.${record.suffix}`
				document.body.appendChild(link)
				link.click()
				window.URL.revokeObjectURL(url)
				document.body.removeChild(link)
			})
			.catch((err) => {
				console.error(err)
			})
	}

	const handlePermission = (record) => {
		console.log('Permission:', record)
		permissionTreeVisible.value = true
	}
	const auditConfirm = (obj) => {
		console.log('auditConfirm:', obj)
		const params = {
			ids: obj.id,
			verifyStatus: obj.auditResult
		}
		resourceAuditApi
			.updateStatus(params)
			.then((res) => {
				if (res.code == 200) {
					auditModalVisible.value = false
				}
				getListData()
			})
			.catch((err) => {
				console.error(err)
			})
	}

	const handleDelete = (record) => {
		console.log('Delete:', record)
	}
	const handleRestore = (record) => {
		const params = {
			ids: record.id,
			verifyStatus: 0
		}
		resourceAuditApi
			.updateStatus(params)
			.then((res) => {
				getListData()
			})
			.catch((err) => {
				console.error(err)
			})
	}
	//资源编辑
	const edit = (record) => {
		console.log('Restore:', record)
		uploadModalVisible.value = true

		console.log('打开什么呢:', formState.verifyStatus)
		isState.value = 1
		formState.verifyStatus = '0,3'
		editResourcesId.value = record.id
	}
	//资源删除
	const resourcesDelete = (record) => {
		if (formState.verifyStatus == 4) {
			const params = [
				{
					id: record.id
				}
			]
			resourceAuditApi
				.deletefile(params)
				.then((res) => {
					getListData()
				})
				.catch((err) => {
					console.error(err)
				})
		} else {
			const params = {
				ids: record.id,
				verifyStatus: 4
			}
			resourceAuditApi
				.updateStatus(params)
				.then((res) => {
					getListData()
				})
				.catch((err) => {
					console.error(err)
				})
		}
	}
	const resourcesDown = (record) => {
			const params =
				{
					ids: record.id,
					verifyStatus : 0
				}

		resourceAuditApi
			.updateStatus(params)
			.then((res) => {
				getListData()
			})
			.catch((err) => {
				console.error(err)
			})
	}

	// 上传资源模态框
	const uploadModalVisible = ref(false)

	// 显示上传模态框
	const showUploadModal = () => {
		isState.value = 0
		uploadModalVisible.value = true
	}
	// 翻页
	const handlePageChange = (page) => {
		pagination.pageNum = page
		getListData()
	}
	// 每页条数
	const handlePageSizeChange = (pageNum, size) => {
		pagination.pageNum = 1
		pagination.pageSize = size
		getListData()
	}

	onMounted(() => {
		if (pageType == 'economize') {
			formState.verifyStatus = '1'
		}
		getOrgTreeSelector()
		getFileformat()
		getResourceTypeTree()
		getListData()
		getstorage().then((res) => {
			console.log('容量', res)

			storageMin.value = res.data.storageSize
			storageMax.value = res.data.totalStorageSize
		})
	})
</script>

<style scoped>
	.editable-cell {
		position: relative;
	}

	.ant-dropdown-link {
		margin-left: 8px;
	}

	.upload-area {
		border: 2px dashed #3ca9f5;
		padding: 40px;
		text-align: center;
	}

	.upload-area p {
		margin: 10px 0;
	}

	.file-item {
		display: flex;
		align-items: center;
		margin: 10px 0;
	}

	.file-item .ant-progress {
		flex: 1;
		margin: 0 10px;
	}
</style>