| | |
| | | /> |
| | | </el-select> |
| | | </el-form-item> |
| | | <el-form-item style="margin-left: 15px" label="项目名称:"> |
| | | <el-select v-model="data.queryParams.itemId" |
| | | filterable |
| | | placeholder="请选择" |
| | | clearable style="width: 100%" |
| | | @change="changePro" |
| | | > |
| | | <el-option |
| | | v-for="item in data.projectList" |
| | | :key="item.id" |
| | | :label="item.itemName" |
| | | :value="item.id"> |
| | | </el-option> |
| | | </el-select> |
| | | |
| | | </el-form-item> |
| | | <el-form-item style="margin-left: 15px"> |
| | | <el-button type="primary" @click="query">查询</el-button> |
| | | <el-button type="primary" plain @click="reset">重置</el-button> |
| | | </el-form-item> |
| | | <el-form-item> |
| | | <el-button |
| | | style="margin-left: 15px" |
| | |
| | | <el-table style="margin:15px 0;width: 100%" :data="state.form.dataList" :border="true" > |
| | | <el-table-column type="index" label="序号" width="80" align="center"></el-table-column> |
| | | <el-table-column label="目录" prop="catalogueName" align="center" width="130" :show-overflow-tooltip="true" /> |
| | | <el-table-column label="项目名称" prop="itemName" align="center" width="130" :show-overflow-tooltip="true" /> |
| | | <el-table-column label="文件编号" prop="number" align="center" /> |
| | | <el-table-column label="文件名称" prop="fileNameSimple" align="center" /> |
| | | <el-table-column label="文件" prop="fileName" align="center" > |
| | |
| | | <el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="160" > |
| | | <template #default="scope"> |
| | | <el-button v-if="scope.row.filePath" link type="primary" @click="downloadFile(scope.row)" >下载</el-button> |
| | | <el-button v-if="data.isAdmin" link type="primary" @click="openDataDialog('edit',scope.row)" >编辑</el-button> |
| | | <el-button v-if="data.isAdmin" link type="danger" @click="handleDataDelete(scope.row)" >删除</el-button> |
| | | <el-button link type="primary" @click="openDataDialog('edit',scope.row)" >编辑</el-button> |
| | | <el-button link type="danger" @click="handleDataDelete(scope.row)" >删除</el-button> |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | </el-form> |
| | | <div class="pag-container"> |
| | | <el-pagination |
| | | v-model:current-page="data.queryParams.pageNum" |
| | | v-model:page-size="data.queryParams.pageSize" |
| | | :page-sizes="[10,15,20,25]" |
| | | layout="total, sizes, prev, pager, next, jumper" |
| | | :total="total" |
| | | @size-change="handleSizeChange" |
| | | @current-change="handleCurrentChange" |
| | | /> |
| | | </div> |
| | | <!-- <div style="display: flex;align-items: center;justify-content: right;margin-top: 10px">--> |
| | | <!-- <el-button v-if="state.form.id && data.isAdmin" type="danger" @click="deleteData">删除</el-button>--> |
| | | <!-- <el-button v-if="data.isAdmin" type="primary" @click="addData()">保存</el-button>--> |
| | |
| | | import axios from "axios"; |
| | | import TEditor from "@/components/Tinymce/Tinymce.vue"; |
| | | import {renderAsync} from "docx-preview"; |
| | | import {delProductFile, getProductFilePage} from "@/api/selfProblems/productFile"; |
| | | import {delProductFile, getProductFilePage, getProductSet} from "@/api/selfProblems/productFile"; |
| | | import {generateWordDocument} from "@/utils/exportWord"; |
| | | |
| | | const { proxy } = getCurrentInstance(); |
| | |
| | | queryParams: { |
| | | type: 3, |
| | | companyId: null, |
| | | itemId: null, |
| | | pageNum: 1, |
| | | pageSize: 10, |
| | | }, |
| | | companyList: [], |
| | | projectList: [], |
| | | isAdmin: false, |
| | | userId: null, |
| | | defaultProps: { |
| | | children: 'children', |
| | | label: 'name', |
| | |
| | | const userInfo = JSON.parse(Cookies.get('userInfo')) |
| | | console.log("userInfo",userInfo) |
| | | data.isAdmin = userInfo.userType === 0; |
| | | data.userId = userInfo.id |
| | | |
| | | if(data.isAdmin){ |
| | | await getCompanyList() |
| | | data.queryParams.companyId = data.companyList[0].id |
| | |
| | | data.queryParams.companyId = userInfo.companyId |
| | | state.form.companyId = userInfo.companyId |
| | | } |
| | | await getProjectList() |
| | | await getList(); |
| | | if(data.treeData.length >0){ |
| | | // state.form.catalogueId = data.treeData[0].id |
| | |
| | | |
| | | } |
| | | |
| | | |
| | | }) |
| | | const getProjectList = async () => { |
| | | const param = { |
| | | companyId: data.queryParams.companyId, |
| | | userId: data.isAdmin ? null : data.userId |
| | | } |
| | | const res = await getProductSet(param); |
| | | if(res.code === 200){ |
| | | data.projectList = res.data |
| | | // if(res.data && res.data.length >0 ){ |
| | | // data.queryParams.itemId = res.data[0].id |
| | | // } |
| | | }else{ |
| | | ElMessage.warning(res.message) |
| | | } |
| | | |
| | | } |
| | | const getList = async () => { |
| | | data.treeData = []; |
| | | loading.value = true; |
| | |
| | | state.form.companyId = item.id |
| | | } |
| | | }) |
| | | await getList() |
| | | if(data.treeData.length >0 ){ |
| | | // state.form.catalogueId = data.treeData[0].id |
| | | // currentSelectedKey.value = state.form.catalogueId |
| | | await getFileList() |
| | | }else { |
| | | state.form.dataList = [] |
| | | } |
| | | data.projectList = [] |
| | | data.queryParams.itemId = null |
| | | await getProjectList() |
| | | |
| | | // await getList() |
| | | // if(data.treeData.length >0 ){ |
| | | // // state.form.catalogueId = data.treeData[0].id |
| | | // // currentSelectedKey.value = state.form.catalogueId |
| | | // await getFileList() |
| | | // }else { |
| | | // state.form.dataList = [] |
| | | // } |
| | | |
| | | } |
| | | const changePro = () => { |
| | | state.form.id = '' |
| | | state.form.catalogueId = null |
| | | } |
| | | |
| | | const handleNodeClick = async (val) => { |
| | |
| | | } |
| | | } |
| | | const openDataDialog = (type, value) => { |
| | | if(type =='edit'){ |
| | | state.form.catalogueId = value.catalogueId |
| | | } |
| | | if(!state.form.catalogueId){ |
| | | ElMessage.warning('请先选择左侧目录!') |
| | | return |
| | | } |
| | | dialogRef.value.openDialog(type, value, state.form.companyId,state.form.catalogueId); |
| | | dialogRef.value.openDialog(type, value, state.form.companyId,state.form.catalogueId,data.userId); |
| | | nextTick(() => { |
| | | if(!currentSelectedKey.value){ |
| | | state.form.catalogueId = null |
| | | } |
| | | }) |
| | | |
| | | |
| | | } |
| | | const openRecordDialog = (type, value) => { |
| | | if(!state.form.catalogueId){ |
| | |
| | | } |
| | | const reset = async () => { |
| | | data.queryParams = { |
| | | companyId: '', |
| | | companyId: data.isAdmin ? null : data.queryParams.companyId, |
| | | pageNum: 1, |
| | | pageSize: 10, |
| | | itemId: null, |
| | | } |
| | | state.form.id = '' |
| | | state.form.catalogueId = null |
| | | data.companyList = []; |
| | | data.treeData = [] |
| | | if(data.isAdmin){ |
| | | await getCompanyList() |
| | | data.queryParams.companyId = data.companyList[0].id |
| | | data.queryParams.companyName = data.companyList[0].name |
| | | state.form.companyId = data.companyList[0].id |
| | | } |
| | | await getProjectList(); |
| | | await getList(); |
| | | await getCompanyList() |
| | | data.queryParams.companyId = data.companyList[0].id |
| | | data.queryParams.companyName = data.companyList[0].name |
| | | state.form.companyId = data.companyList[0].id |
| | | if(data.treeData.length >0 ){ |
| | | await getFileList() |
| | | }else { |
| | | state.form.dataList = [] |
| | | } |
| | | |
| | | |
| | | } |
| | | const query = async () => { |
| | | await getList() |
| | | if(data.treeData.length >0 ){ |
| | | await getFileList() |
| | | }else { |
| | | state.form.dataList = [] |
| | | } |
| | | |
| | | } |
| | | |
| | | const getFileList = async () => { |
| | | const queryParams = { |
| | | companyId: state.form.companyId, |
| | | catalogueId: state.form.catalogueId, |
| | | type: 2 |
| | | type: 2, |
| | | itemId: data.queryParams.itemId, |
| | | pageSize: data.queryParams.pageSize, |
| | | pageNum: data.queryParams.pageNum |
| | | } |
| | | const res = await getProductFilePage(queryParams) |
| | | if (res.code == 200) { |
| | |
| | | fileNameSimple: item.fileName.split('.')[0] |
| | | } |
| | | }) |
| | | total.value = res.data.total |
| | | } else { |
| | | ElMessage.warning(res.message) |
| | | } |
| | | } |
| | | const handleSizeChange = (val) => { |
| | | data.queryParams.pageSize = val |
| | | getFileList() |
| | | } |
| | | const handleCurrentChange = (val) => { |
| | | data.queryParams.pageNum = val |
| | | getFileList() |
| | | } |
| | | const openFile = async(path)=>{ |
| | | const ext = path.split('.').pop().toLowerCase(); |
| | |
| | | console.log('取消预览') |
| | | }); |
| | | return |
| | | } |
| | | try { |
| | | // 1. 获取文件 |
| | | const response = await fetch(import.meta.env.VITE_APP_BASE_API + '/' + path); |
| | | const arrayBuffer = await response.arrayBuffer(); |
| | | // 2. 创建新窗口 |
| | | const win = window.open('', '_blank') |
| | | win.document.write(` |
| | | }else if(ext === 'pdf' || ext === 'png' || ext === 'jpg'|| ext === 'jpeg'){ |
| | | window.open(`${import.meta.env.VITE_APP_BASE_API}/${path}`, '_blank'); |
| | | }else { |
| | | try { |
| | | // 1. 获取文件 |
| | | const response = await fetch(import.meta.env.VITE_APP_BASE_API + '/' + path); |
| | | const arrayBuffer = await response.arrayBuffer(); |
| | | // 2. 创建新窗口 |
| | | const win = window.open('', '_blank') |
| | | win.document.write(` |
| | | <!DOCTYPE html> |
| | | <html> |
| | | <head> |
| | |
| | | </body> |
| | | </html> |
| | | `); |
| | | // 3. 渲染 DOCX |
| | | await renderAsync(arrayBuffer, win.document.getElementById('container')); |
| | | // 3. 渲染 DOCX |
| | | await renderAsync(arrayBuffer, win.document.getElementById('container')); |
| | | |
| | | } catch (error) { |
| | | console.error('预览失败:', error); |
| | | alert(`预览失败: ${error.message}`); |
| | | } catch (error) { |
| | | console.error('预览失败:', error); |
| | | alert(`预览失败: ${error.message}`); |
| | | } |
| | | } |
| | | |
| | | } |
| | | const downloadFile = (e)=>{ |
| | | axios.get(import.meta.env.VITE_APP_BASE_API + '/' +e.filePath,{headers:{'Content-Type': 'application/json','Authorization': `${getToken()}`},responseType: 'blob'}).then(res=>{ |
| | |
| | | } |
| | | }) |
| | | const caralogList = idGroupToTree(dataList) |
| | | const itemList = idGroupToTree(data.projectList) |
| | | |
| | | table.tableList = caralogList.map((item,index) => { |
| | | return { |
| | | ...item, |
| | |
| | | children: items |
| | | })); |
| | | } |
| | | |
| | | </script> |
| | | |
| | | <style scoped lang="scss"> |
| | | .app-container{ |
| | | .pag-container{ |
| | | float: right; |
| | | margin-top: 10px; |
| | | } |
| | | .bottom{ |
| | | display: flex; |
| | | width: auto; |