|
|
|
@ -2,85 +2,114 @@ |
|
|
|
<div class="app-container"> |
|
|
|
<!--头部选项--> |
|
|
|
<div class="head-container"> |
|
|
|
<div v-if="crud.props.searchToggle"> |
|
|
|
<el-input v-model="query.filename" placeholder="请输入文件名称" style="width: 200px;" class="filter-item" clearable @keyup.enter.native="crud.toQuery" /> |
|
|
|
<div class="searchBox"> |
|
|
|
<el-input |
|
|
|
v-model="query.filename" |
|
|
|
placeholder="请输入文件名称" |
|
|
|
style="width: 200px" |
|
|
|
class="filter-item" |
|
|
|
clearable |
|
|
|
@keyup.enter.native="crud.toQuery" |
|
|
|
/> |
|
|
|
|
|
|
|
<query :crud="crud" /> |
|
|
|
</div> |
|
|
|
<crud :permission="permission"> |
|
|
|
<el-button slot="right" class="filter-item" icon="el-icon-download" type="warning" @click="exportExcel"> |
|
|
|
<el-upload |
|
|
|
ref="upload" |
|
|
|
slot="right" |
|
|
|
class="upload-demo" |
|
|
|
:show-file-list="false" |
|
|
|
:before-upload="beforeUpload" |
|
|
|
accept=".pdf" |
|
|
|
action="" |
|
|
|
> |
|
|
|
<el-button slot="trigger" size="middle" type="primary"> |
|
|
|
上传文件 |
|
|
|
</el-button> |
|
|
|
</crud> |
|
|
|
</el-upload> |
|
|
|
</div> |
|
|
|
|
|
|
|
</div> |
|
|
|
<!--表格内容--> |
|
|
|
<CustomTable ref="customTable" :col-configs="colConfigs" :columns="columns" :crud="crud"> |
|
|
|
<el-table-column v-if="checkPermission(permission.edit)" slot="operation" align="center" width="100" label="操作"> |
|
|
|
<CustomTable |
|
|
|
ref="customTable" |
|
|
|
:col-configs="colConfigs" |
|
|
|
:columns="columns" |
|
|
|
:crud="crud" |
|
|
|
> |
|
|
|
<el-table-column |
|
|
|
slot="operation" |
|
|
|
align="center" |
|
|
|
width="100" |
|
|
|
label="操作" |
|
|
|
> |
|
|
|
<template slot-scope="scope"> |
|
|
|
<Edit :permission="permission" :data="scope.row" :disabled-edit="false" /> |
|
|
|
<el-button type="text" @click="downLoad(scope.row)"> |
|
|
|
在线预览 |
|
|
|
</el-button> |
|
|
|
<el-button type="text" @click="downLoadFn(scope.row)"> |
|
|
|
下载 |
|
|
|
</el-button> |
|
|
|
<el-button type="text" @click="checkHistory(scope.row)"> |
|
|
|
查看历史版本 |
|
|
|
</el-button> |
|
|
|
</template> |
|
|
|
</el-table-column> |
|
|
|
</CustomTable> |
|
|
|
<pagination /> |
|
|
|
<el-dialog title="查看历史版本" :visible.sync="dialogTableVisible"> |
|
|
|
<el-table :data="gridData"> |
|
|
|
<el-table-column property="inspectionSystemFileId" label="文件ID" /> |
|
|
|
<el-table-column property="filename" label="文件名称" /> |
|
|
|
<el-table-column property="suffix" label="文件后缀" /> |
|
|
|
<el-table-column property="updateTime" label="更新时间" /> |
|
|
|
</el-table> |
|
|
|
<el-pagination |
|
|
|
:page-size="params.pageSize" |
|
|
|
layout="total,prev, pager, next" |
|
|
|
:total="subTotal" |
|
|
|
@current-change="handleCurrentChange" |
|
|
|
/> |
|
|
|
</el-dialog> |
|
|
|
</div> |
|
|
|
</template> |
|
|
|
|
|
|
|
<script> |
|
|
|
import CRUD, { form, header, presenter } from '@/components/Crud/crud' |
|
|
|
import Crud from '@/components/Crud' |
|
|
|
import CRUD, { header, presenter } from '@/components/Crud/crud' |
|
|
|
import Query from '@/components/Crud/Query' |
|
|
|
import Edit from '@/components/Crud/Edit' |
|
|
|
import CustomTable from '@/components/Crud/Table' |
|
|
|
import Pagination from '@/components/Crud/Pagination' |
|
|
|
import CrudDocumentArchives from '@/api/document_archives' |
|
|
|
import { getDicDataListByTypeName } from '@/api/dic_data' |
|
|
|
import { parseTime, downloadFile, downloadFileUrl } from '@/utils' |
|
|
|
import { exportReport } from '@/api/export_document' |
|
|
|
|
|
|
|
import { uploadFileFn } from '@/api/common' |
|
|
|
import { downloadFileUrl } from '@/utils' |
|
|
|
import download from 'downloadjs' |
|
|
|
// crud交由presenter持有 |
|
|
|
const defaultCrud = presenter(CRUD({ |
|
|
|
title: '检验机构体系文件管理', |
|
|
|
url: '/documentArchives', |
|
|
|
orderBy: ['id desc'], |
|
|
|
crudMethod: { ...CrudDocumentArchives } |
|
|
|
})) |
|
|
|
|
|
|
|
// 设置初始form |
|
|
|
const defaultForm = form({ |
|
|
|
id: null, |
|
|
|
documentName: '', |
|
|
|
examiningUnit: '', |
|
|
|
borrower: '', |
|
|
|
borrowedDate: '', |
|
|
|
returnDate: '', |
|
|
|
borrowedState: '', |
|
|
|
remark: '' |
|
|
|
}) |
|
|
|
|
|
|
|
// 自定义模板内容 |
|
|
|
const PrefixPlusText = { |
|
|
|
props: ['value', 'functions'], |
|
|
|
template: ` |
|
|
|
<el-tag v-if="functions(value) === '未归还'" type="danger" effect="dark"><span v-html="functions(value)"></span></el-tag> |
|
|
|
<el-tag v-else type="success" effect="dark"><span v-html="functions(value)"></span></el-tag> |
|
|
|
` |
|
|
|
} |
|
|
|
const defaultCrud = presenter( |
|
|
|
CRUD({ |
|
|
|
title: '检验机构体系文件管理', |
|
|
|
url: '/inspectionSystemFile/list', |
|
|
|
orderBy: ['id desc'], |
|
|
|
rootApi: 1, |
|
|
|
crudMethod: { ...CrudDocumentArchives } |
|
|
|
}) |
|
|
|
) |
|
|
|
|
|
|
|
export default { |
|
|
|
name: 'DocumentArchivesList', |
|
|
|
components: { Pagination, Query, Crud, CustomTable, Edit }, |
|
|
|
mixins: [defaultCrud, defaultForm, header()], |
|
|
|
components: { Pagination, Query, CustomTable }, |
|
|
|
mixins: [defaultCrud, header()], |
|
|
|
data() { |
|
|
|
return { |
|
|
|
action: this.preview.baseURL + '/inspectionSystemFile', |
|
|
|
fileList: [], |
|
|
|
colConfigs: [ |
|
|
|
{ prop: 'filename', label: '文件名', align: 'center' }, |
|
|
|
{ prop: 'updateBy', label: '修改人', align: 'center', formatter: this.formatter.getChineseName }, |
|
|
|
{ prop: 'createBy', label: '创建人', align: 'center' }, |
|
|
|
{ prop: 'createTime ', label: '创建时间', align: 'center' }, |
|
|
|
{ prop: 'jieyueTime', label: '借阅时间', align: 'center' }, |
|
|
|
{ prop: 'suffix ', label: '文件名后缀', align: 'center', formatter: this.formatter.getChineseName }, |
|
|
|
{ prop: 'zfState', label: '作废状态', align: 'center', component: PrefixPlusText }, |
|
|
|
{ prop: 'updateBy', label: '修改人', align: 'center' }, |
|
|
|
{ prop: 'createBy', label: '创建人', align: 'center', formatter: this.formatter.getChineseName }, |
|
|
|
{ prop: 'createTime', label: '创建时间', align: 'center' }, |
|
|
|
{ |
|
|
|
prop: 'suffix', |
|
|
|
label: '文件名后缀', |
|
|
|
align: 'center' |
|
|
|
}, |
|
|
|
{ |
|
|
|
prop: 'updateTime', |
|
|
|
label: '更新时间', |
|
|
|
@ -94,73 +123,82 @@ export default { |
|
|
|
edit: ['documentArchives:update'], |
|
|
|
del: ['documentArchives:delete'] |
|
|
|
}, |
|
|
|
rules: { |
|
|
|
documentName: [ |
|
|
|
{ required: true, message: '请填写报告编号', trigger: 'blur' } |
|
|
|
], |
|
|
|
borrower: [ |
|
|
|
{ required: true, message: '请填写借阅人', trigger: 'blur' } |
|
|
|
], |
|
|
|
borrowedDate: [ |
|
|
|
{ required: true, message: '请选择借阅时间', trigger: 'blur' } |
|
|
|
], |
|
|
|
agreedReturnDate: [ |
|
|
|
{ required: true, message: '请选择归还时间', trigger: 'blur' } |
|
|
|
], |
|
|
|
borrowedState: [ |
|
|
|
{ required: true, message: '请选择借阅状态', trigger: 'change' } |
|
|
|
] |
|
|
|
dialogTableVisible: false, |
|
|
|
params: { |
|
|
|
inspectionSystemFileId: '', |
|
|
|
pageNum: 1, |
|
|
|
pageSize: 10 |
|
|
|
}, |
|
|
|
reportRules: { |
|
|
|
year: [ |
|
|
|
{ required: true, message: '请选择年度信息', trigger: 'blur' } |
|
|
|
], |
|
|
|
equipmentTypeCode: [ |
|
|
|
{ required: true, message: '请选择设备种类', trigger: 'change' } |
|
|
|
], |
|
|
|
category: [ |
|
|
|
{ required: true, message: '请选择检验类别', trigger: 'change' } |
|
|
|
] |
|
|
|
}, |
|
|
|
borrowedStateList: [], |
|
|
|
dialogVisible: false, |
|
|
|
reportForm: {}, |
|
|
|
categoryList: [], |
|
|
|
sedirectoryList: [] |
|
|
|
gridData: [], |
|
|
|
subTotal: 0 |
|
|
|
|
|
|
|
} |
|
|
|
}, |
|
|
|
mounted() { |
|
|
|
this.initDicDataList() |
|
|
|
}, |
|
|
|
mounted() {}, |
|
|
|
methods: { |
|
|
|
initDicDataList() { |
|
|
|
// 借阅状态列表 |
|
|
|
getDicDataListByTypeName('borrowed_state').then(data => { this.borrowedStateList = data }) |
|
|
|
// 设备种类列表 |
|
|
|
getDicDataListByTypeName('sedirectory_code').then(data => { this.sedirectoryList = data }) |
|
|
|
// 检验类别列表 |
|
|
|
getDicDataListByTypeName('inspection_category').then(data => { this.categoryList = data }) |
|
|
|
handleRemove(file, fileList) { |
|
|
|
console.log(file, fileList) |
|
|
|
}, |
|
|
|
handlePreview(file) { |
|
|
|
console.log(file) |
|
|
|
}, |
|
|
|
checkHistory(row) { |
|
|
|
this.dialogTableVisible = true |
|
|
|
this.params.inspectionSystemFileId = row.id |
|
|
|
this.getSubList() |
|
|
|
}, |
|
|
|
exportExcel() { |
|
|
|
CrudDocumentArchives.exportExcel(this.crud.query).then(data => { |
|
|
|
downloadFile(data, parseTime(new Date()) + '-' + this.crud.title + '数据', 'xlsx') |
|
|
|
getSubList() { |
|
|
|
this.preview({ |
|
|
|
url: '/inspectionSystemFileLog/list', |
|
|
|
method: 'get', |
|
|
|
params: this.params |
|
|
|
}).then(res => { |
|
|
|
this.gridData = res.list |
|
|
|
this.subTotal = res.total |
|
|
|
}) |
|
|
|
}, |
|
|
|
exportReport() { |
|
|
|
this.$refs['reportForm'].validate((valid) => { |
|
|
|
if (valid) { |
|
|
|
exportReport(this.reportForm).then(data => { |
|
|
|
downloadFileUrl(data.data, parseTime(new Date()) + '报告导出数据', 'xlsx') |
|
|
|
this.dialogVisible = false |
|
|
|
}) |
|
|
|
} else { |
|
|
|
return false |
|
|
|
} |
|
|
|
handleCurrentChange(val) { |
|
|
|
this.params.pageNum = val |
|
|
|
this.getSubList() |
|
|
|
}, |
|
|
|
handleExceed(files, fileList) { |
|
|
|
this.$message.warning( |
|
|
|
`当前限制选择 3 个文件，本次选择了 ${files.length} 个文件，共选择了 ${ |
|
|
|
files.length + fileList.length |
|
|
|
} 个文件` |
|
|
|
) |
|
|
|
}, |
|
|
|
// EXCEL上传方法 |
|
|
|
beforeUpload(file) { |
|
|
|
const fd = new FormData() |
|
|
|
fd.append('file', file) |
|
|
|
uploadFileFn(fd).then(() => { |
|
|
|
this.$notify.success('导入数据成功。') |
|
|
|
this.crud.toQuery() |
|
|
|
}) |
|
|
|
}, |
|
|
|
downLoad(item) { |
|
|
|
downloadFileUrl('http://test.sdma.mingansei.com/sdma-preview/SJJY/inspectionSystemFile/' + item.id + item.suffix, item.filename, item.suffix) |
|
|
|
}, |
|
|
|
downLoadFn(item) { |
|
|
|
download('http://test.sdma.mingansei.com/sdma-preview/SJJY/inspectionSystemFile/' + item.id + item.suffix) |
|
|
|
}, |
|
|
|
beforeRemove(file, fileList) { |
|
|
|
return this.$confirm(`确定移除 ${file.name}？`) |
|
|
|
}, |
|
|
|
closeReportDialog() { |
|
|
|
this.$refs['reportForm'].resetFields() |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
</script> |
|
|
|
<style scoped> |
|
|
|
.searchBox{ |
|
|
|
margin-bottom: 20px; |
|
|
|
display: flex; |
|
|
|
} |
|
|
|
.upload-demo{ |
|
|
|
margin-left: 20px; |
|
|
|
width: 200px; |
|
|
|
} |
|
|
|
</style> |
|
|
|
|
