7 changed files with 337 additions and 49 deletions
-
20src/api/prearchiveLibrary/prearchiveLibrary.js
-
10src/api/system/category/category.js
-
96src/views/components/category/PreviewForm.vue
-
50src/views/prearchiveLibrary/index.vue
-
188src/views/prearchiveLibrary/module/detail.vue
-
10src/views/prearchiveLibrary/module/moveFile.vue
-
6src/views/system/notifyManage/module/selectObj.vue
@ -0,0 +1,188 @@ |
|||
<template> |
|||
<el-dialog class="detail-dialog" title="详情" :close-on-click-modal="false" :modal-append-to-body="false" append-to-body :visible.sync="archivesInfoVisible" :before-close="handleClose"> |
|||
<!-- <span class="dialog-right-top" /> |
|||
<span class="dialog-left-bottom" /> --> |
|||
<div class="setting-dialog"> |
|||
<div class="detail-tab tab-content"> |
|||
<!-- tab --> |
|||
<ul class="tab-nav"> |
|||
<li :class="{'active-tab-nav': archivesTabIndex == 0}" @click="changeActiveTab(0)">基本信息</li> |
|||
<li :class="{'active-tab-nav': archivesTabIndex == 1}" @click="changeActiveTab(1)">电子原件</li> |
|||
</ul> |
|||
<!-- 基本信息 --> |
|||
<div v-if="archivesTabIndex===0" class="base-info item-content"> |
|||
<el-row> |
|||
<el-col v-for="(item,index) in archivesDetailsData" v-show="index<archivesDetailsData.length-5" :key="index" :span="item.isLine ? 24 : 12" class="base-info-item"> |
|||
<span>{{ item.fieldCnName }}：</span> |
|||
<p :style="{ width: ( item.editLength ? item.editLength+'px' : '' ), flex: ( !item.editLength ? 1 : '' )}">{{ item.context }}</p> |
|||
</el-col> |
|||
</el-row> |
|||
<el-row v-if="isDetailsInfo"> |
|||
<el-col v-for="(item,index) in archivesDetailsData.slice(archivesDetailsData.length-5,archivesDetailsData.length)" :key="'last'+index" :span=" 12" class="base-info-item"> |
|||
<span>{{ item.fieldCnName }}：</span> |
|||
<div v-if="item.fieldName === 'folder_location' && item.context" :style="{ width: item.editLength+'px', marginTop:'-6px'}"> |
|||
<div v-if="item.context.indexOf(',')"> |
|||
<el-tag |
|||
v-for="(val,key) in item.context.split(',')" |
|||
:key="key" |
|||
:type="val" |
|||
effect="dark" |
|||
> |
|||
{{ val }} |
|||
</el-tag> |
|||
</div> |
|||
<div v-else-if="!item.context.indexOf(',')"> |
|||
<el-tag effect="dark">{{ item.context }}</el-tag> |
|||
</div> |
|||
</div> |
|||
<div v-else :style="{ width: item.editLength+'px'}" :class="[ (item.fieldName === 'borrow_type') ? 'row-state row-lending' : '' ]"> |
|||
{{ item.context }} |
|||
</div> |
|||
</el-col> |
|||
</el-row> |
|||
</div> |
|||
<!-- 电子原件 --> |
|||
<div v-if="archivesTabIndex===1" class="item-content"> |
|||
<el-table |
|||
ref="table" |
|||
:data="tableData" |
|||
style="min-width: 100%" |
|||
height="calc(100vh - 382px)" |
|||
@row-click="clickRowHandler" |
|||
@selection-change="selectionChangeHandler" |
|||
> |
|||
<el-table-column prop="file_name" label="文件名称" show-overflow-tooltip min-width="140" align="center" /> |
|||
<el-table-column prop="file_type" label="格式" min-width="60" align="center" /> |
|||
<el-table-column prop="file_size" label="大小" min-width="85" align="center"> |
|||
<template slot-scope="scope"> |
|||
{{ (scope.row.file_size / 1024).toFixed(2) + 'kB' }} |
|||
</template> |
|||
</el-table-column> |
|||
<el-table-column prop="file_dpi" label="分辨率" min-width="85" align="center" /> |
|||
<el-table-column prop="file_thumbnail" label="缩览图" min-width="60" align="center"> |
|||
<template slot-scope="scope"> |
|||
<div v-if="scope.row.file_type === 'jpg' || scope.row.file_type === 'jpeg' || scope.row.file_type === 'png' || scope.row.file_type === 'bmp'|| scope.row.file_type === 'gif'"> |
|||
<img width="60px" height="32px" class="screenshot" :src="baseApi+ '/downloadFile' +scope.row.file_path" :onerror="defaultImg" @click="showCoverPreview(scope.row)"> |
|||
</div> |
|||
<div v-else> |
|||
<svg-icon icon-class="fujian" class-name="svg-style" /> |
|||
</div> |
|||
</template> |
|||
</el-table-column> |
|||
</el-table> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</el-dialog> |
|||
</template> |
|||
|
|||
<script> |
|||
import { form } from '@crud/crud' |
|||
import { FetchArchivesDetails, FetchArchivesMetadata } from '@/api/archivesManage/archivesList' |
|||
// import detailData from './data.json' |
|||
// import metaData from './metadata.json' |
|||
export default { |
|||
name: 'PrearchiveLibraryDetail', |
|||
components: { }, |
|||
mixins: [ |
|||
form({}) |
|||
], |
|||
props: { |
|||
categoryId: { |
|||
type: String, |
|||
default: function() { |
|||
return '' |
|||
} |
|||
}, |
|||
arcId: { |
|||
type: String, |
|||
default: function() { |
|||
return '' |
|||
} |
|||
} |
|||
}, |
|||
data() { |
|||
return { |
|||
archivesInfoVisible: false, |
|||
archivesTabIndex: 0, |
|||
archivesDetailsData: [], |
|||
archivesDetailsMetadata: [] |
|||
} |
|||
}, |
|||
created() { |
|||
this.archivesDetailsData = [] |
|||
this.archivesDetailsMetadata = [] |
|||
}, |
|||
mounted() { |
|||
}, |
|||
methods: { |
|||
getDetial(rowId) { |
|||
const params = { |
|||
categoryId: this.categoryId, |
|||
archivesId: rowId |
|||
} |
|||
FetchArchivesDetails(params).then(data => { |
|||
this.archivesDetailsData = data |
|||
// 案卷 / 文件的借阅状态 |
|||
this.archivesDetailsData.forEach(item => { |
|||
if (item.fieldName === 'borrow_type') { |
|||
if (item.context === 1) { |
|||
item.context = '待登记' |
|||
} else if (item.context === 2) { |
|||
item.context = '待借阅' |
|||
} else if (item.context === 3) { |
|||
item.context = '待归还' |
|||
} else if (item.context === 4 || item.context === '' || item.context === null) { |
|||
item.context = '-' |
|||
} else if (item.context === -1) { |
|||
item.context = '在库' |
|||
} |
|||
} |
|||
}) |
|||
// 如果是卷内 - 不显示‘tid’/'借阅状态' |
|||
if (!this.isTidOrBorrow) { |
|||
const indexBorrow = this.archivesDetailsData.findIndex(item => item.fieldName === 'borrow_type') |
|||
const indexTid = this.archivesDetailsData.findIndex(item => item.fieldName === 'tid') |
|||
this.archivesDetailsData.splice(indexBorrow, 1) |
|||
this.archivesDetailsData.splice(indexTid, 1) |
|||
} |
|||
}) |
|||
FetchArchivesMetadata(params).then(data => { |
|||
this.archivesDetailsMetadata = data |
|||
}) |
|||
}, |
|||
changeActiveTab(index) { |
|||
this.archivesTabIndex = index |
|||
}, |
|||
// 删除 - 关闭 |
|||
handleClose(done) { |
|||
this.archivesInfoVisible = false |
|||
done() |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss" scoped> |
|||
.base-info, |
|||
.metadata-cont{ |
|||
background-color: #F6F8FC; |
|||
} |
|||
// 档案详情 |
|||
.base-info{ |
|||
padding: 20px 0; |
|||
.base-info-item{ |
|||
display: flex; |
|||
flex-direction: row; |
|||
margin-bottom: 20px; |
|||
color: #545B65; |
|||
span{ |
|||
display: block; |
|||
width: 120px; |
|||
margin-right: 5px; |
|||
text-align: right; |
|||
color: #0C0E1E; |
|||
} |
|||
} |
|||
} |
|||
</style> |
|||
Write
Preview
Loading…
Cancel
Save
Reference in new issue