update 国内标准-详情
This commit is contained in:
@@ -26,7 +26,26 @@
|
||||
<div class="detail-page-part-form" v-if="index !== 3">
|
||||
<div class="detail-page-part-form-item" v-for="formItem in form[part]" :key="formItem.id">
|
||||
<label>{{ formItem.dbFieldTxt }}</label>
|
||||
<span>{{ detailData[needDictFieldList.includes(formItem.fieldShowType) ? formItem.dbFieldName + '_dictText' : formItem.dbFieldName] }}</span>
|
||||
<!--文件需要显示预览-->
|
||||
<span v-if="!fileField.includes(formItem.dbFieldName)">{{ detailData[needDictFieldList.includes(formItem.fieldShowType) ? formItem.dbFieldName + '_dictText' : formItem.dbFieldName]
|
||||
}}</span>
|
||||
<div class="file-box" v-else>
|
||||
<div class="detail-page-process-manuscript-file" v-for="file in detailData[formItem.dbFieldName + 'List']" :key="file.id">
|
||||
<div class="detail-page-process-manuscript-file-info">
|
||||
<a-icon type="link" />
|
||||
<div class="detail-page-process-manuscript-file-name" @click="handlePreview(file)">{{ file.fileName }}</div>
|
||||
</div>
|
||||
<!-- 下载-->
|
||||
<a-button type="link" icon="download" v-has="btnPermission.download" class="file-btn" @click="handleDownload(file)">{{ $t('download')
|
||||
}}
|
||||
</a-button>
|
||||
<!-- 无水印下载-->
|
||||
<!--<a-button type="link" v-has="btnPermission.unwatermarkedDownload" class="file-btn">-->
|
||||
<!-- <i class="iconfont icon-water-drop-slash"></i>-->
|
||||
<!-- {{ $t('unwatermarkedDownload') }}-->
|
||||
<!--</a-button>-->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 过程稿件特殊处理-->
|
||||
@@ -35,18 +54,23 @@
|
||||
<div class="detail-page-process-manuscript-title">
|
||||
<span>{{ formItem.dbFieldTxt }}</span>
|
||||
<!-- 标准分解单-->
|
||||
<a-button type="primary" ghost icon="file-text" @click="previewStandardResolutionSheet" v-has="btnPermission.standardResolutionSheet">
|
||||
<a-button type="primary"
|
||||
ghost
|
||||
icon="file-text"
|
||||
@click="previewStandardResolutionSheet"
|
||||
v-has="btnPermission.standardResolutionSheet"
|
||||
:disabled="!detailData[formItem.dbFieldName + '_standardSplit']">
|
||||
{{ $t('standardRegulationLibrary.standardResolutionSheet') }}
|
||||
</a-button>
|
||||
</div>
|
||||
<div class="detail-page-process-manuscript-file" v-for="file in detailData[formItem.dbFieldName]" :key="file.id">
|
||||
<div class="detail-page-process-manuscript-file" v-for="file in detailData[formItem.dbFieldName + 'List']" :key="file.id">
|
||||
<div class="detail-page-process-manuscript-file-info">
|
||||
<a-icon type="link" />
|
||||
<div class="detail-page-process-manuscript-file-name">{{ file.fileName }}</div>
|
||||
</div>
|
||||
<div class="detail-page-process-manuscript-file-operate">
|
||||
<!-- 下载-->
|
||||
<a-button type="link" icon="download" v-has="btnPermission.download">{{ $t('download') }}</a-button>
|
||||
<a-button type="link" icon="download" v-has="btnPermission.download" @click="handleDownload(file)">{{ $t('download') }}</a-button>
|
||||
<!-- 无水印下载-->
|
||||
<a-button type="link" v-has="btnPermission.unwatermarkedDownload">
|
||||
<i class="iconfont icon-water-drop-slash"></i>
|
||||
@@ -59,6 +83,12 @@
|
||||
</div>
|
||||
</a-spin>
|
||||
|
||||
<div id="images">
|
||||
<div class="image" v-viewer="{movable: false}">
|
||||
<img v-show="image" :src="imageUrl" alt="">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 更新记录-->
|
||||
<update-record-modal ref="uploadRecordModal" />
|
||||
<!-- 提交问题-->
|
||||
@@ -78,6 +108,12 @@ import UpdateRecordModal from './modules/UpdateRecordModal.vue'
|
||||
import SubmitQuestionModal from './modules/SubmitQuestionModal.vue'
|
||||
import UserSelectModal from '../../../components/selection/UserSelectModal.vue'
|
||||
import StandardResolutionSheetModal from './modules/StandardResolutionSheetModal.vue'
|
||||
import { getFileInfo } from '../../../api/api.js'
|
||||
import Vue from 'vue'
|
||||
import { ACCESS_TOKEN } from '../../../store/mutation-types.js'
|
||||
import { downloadFile, getFileAccessHttpUrl } from '../../../api/manage.js'
|
||||
import { previewPdf } from '../../../utils/previewPdf.js'
|
||||
import { Base64 } from 'js-base64'
|
||||
|
||||
// 国内标准权限
|
||||
const DomesticStandardPermission = {
|
||||
@@ -95,6 +131,9 @@ const DomesticApi = {
|
||||
getDetailData: getDomesticStandardDetail // 获取详情数据
|
||||
}
|
||||
|
||||
const FILE_TYPE_IMGS = ['jpg', 'jpeg', 'png', 'raw']
|
||||
const FILE_TYPE_PDF = 'pdf'
|
||||
|
||||
export default {
|
||||
name: 'StandardDetailPage',
|
||||
components: { UpdateRecordModal, SubmitQuestionModal, UserSelectModal, StandardResolutionSheetModal },
|
||||
@@ -104,20 +143,13 @@ export default {
|
||||
partList: [], // 页面模块列表
|
||||
form: {}, // 页面字段
|
||||
// 页面数据
|
||||
detailData: {
|
||||
// 修改单
|
||||
modification_list: [],
|
||||
// 报批稿
|
||||
draft_for_review: [],
|
||||
// 送审稿
|
||||
draft_for_approval: [],
|
||||
// 征求意见稿
|
||||
draft_for_comment: [],
|
||||
// 草案
|
||||
draft: []
|
||||
},
|
||||
detailData: {},
|
||||
// 文件的字段
|
||||
fileField: ['associated_file', 'modification_list', 'draft_for_review', 'draft_for_approval', 'draft_for_comment', 'draft'],
|
||||
// 需要数据字段翻译的属性类型
|
||||
needDictFieldList: [FieldType.USER_SINGLE.value, FieldType.ORGAN_SINGLE.value, FieldType.STANDARD_MORE.value, FieldType.ORGAN_MORE.value, FieldType.OPTION_SINGLE.value, FieldType.OPTION_MORE.value, FieldType.TREE.value]
|
||||
needDictFieldList: [FieldType.USER_SINGLE.value, FieldType.ORGAN_SINGLE.value, FieldType.STANDARD_MORE.value, FieldType.ORGAN_MORE.value, FieldType.OPTION_SINGLE.value, FieldType.OPTION_MORE.value, FieldType.TREE.value],
|
||||
image: false,
|
||||
imageUrl: null
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
@@ -160,7 +192,7 @@ export default {
|
||||
* 获取页面字段
|
||||
*/
|
||||
initForm () {
|
||||
this.operateApiFunc.getFormFunc().then(res => {
|
||||
this.operateApiFunc.getFormFunc({ type: 1 }).then(res => {
|
||||
if (res.success) {
|
||||
const data = res.result || {}
|
||||
this.partList = Object.keys(data)
|
||||
@@ -173,9 +205,23 @@ export default {
|
||||
// 获取数据
|
||||
initDetailData () {
|
||||
this.loading = true
|
||||
this.operateApiFunc.getDetailData({ id: this.$route.query.id }).then(res => {
|
||||
this.operateApiFunc.getDetailData({ id: this.$route.query.id, type: 1 }).then(res => {
|
||||
if (res.success) {
|
||||
this.detailData = Object.assign({}, res.result || {})
|
||||
this.fileField.forEach(item => {
|
||||
if (this.detailData[item]) {
|
||||
const fileList = this.detailData[item].split(',')
|
||||
const fileInfoList = []
|
||||
fileList.forEach(async id => {
|
||||
const fileInfo = await this.getFileInfo(id)
|
||||
if (fileInfo) {
|
||||
fileInfoList.push(fileInfo)
|
||||
}
|
||||
})
|
||||
this.$set(this.detailData, item + 'List', fileInfoList)
|
||||
}
|
||||
})
|
||||
console.log(this.detailData)
|
||||
} else {
|
||||
this.$message.warn(res.message)
|
||||
}
|
||||
@@ -183,6 +229,18 @@ export default {
|
||||
this.loading = false
|
||||
})
|
||||
},
|
||||
getFileInfo (fileId) {
|
||||
return new Promise(resolve => {
|
||||
let fileInfo
|
||||
getFileInfo({ id: fileId }).then(res => {
|
||||
if (res.success) {
|
||||
fileInfo = res.result
|
||||
}
|
||||
}).finally(() => {
|
||||
resolve(fileInfo)
|
||||
})
|
||||
})
|
||||
},
|
||||
/**
|
||||
* 更新记录
|
||||
*/
|
||||
@@ -227,11 +285,63 @@ export default {
|
||||
*/
|
||||
previewStandardResolutionSheet () {
|
||||
this.$refs.standardResolutionSheetModal.open()
|
||||
},
|
||||
handlePreview (file) {
|
||||
if (!file || !file.url) {
|
||||
return
|
||||
}
|
||||
// 截取文件后缀名
|
||||
const fileSuffix = file.fileName ? file.fileName.split('.')[file.fileName.split('.').length - 1] : ''
|
||||
const canPreview = FILE_TYPE_IMGS.some(tt => fileSuffix.toLowerCase() === tt) || fileSuffix.toLowerCase() === FILE_TYPE_PDF
|
||||
// 判断是否为可预览格式的文件
|
||||
if (!canPreview) {
|
||||
this.$message.loading('该文件类型不支持预览,正在为您准备下载...').then(() => {
|
||||
this.handleDownload(file)
|
||||
})
|
||||
return
|
||||
}
|
||||
const fileFullUrl = `${window._CONFIG.domianWebSocketURL}/sys/common/download/${file.id}?token=${Vue.ls.get(ACCESS_TOKEN)}&fullfilename=${file.fileName}`
|
||||
// 图片预览,使用自己添加的组件
|
||||
if (canPreview && FILE_TYPE_IMGS.includes(fileSuffix.toLowerCase())) {
|
||||
this.imageUrl = getFileAccessHttpUrl(file.id)
|
||||
// 获取viewer实例
|
||||
const viewer = this.$el.querySelector('.image').$viewer
|
||||
// 调用show方法进行显示预览图
|
||||
viewer.show()
|
||||
// this.$refs.imagePreviewModal.open(file)
|
||||
return
|
||||
}
|
||||
// pdf预览
|
||||
if (canPreview && FILE_TYPE_PDF.includes(fileSuffix)) {
|
||||
const url = previewPdf(file.response.result.id)
|
||||
window.open(url)
|
||||
return
|
||||
}
|
||||
// 其余可预览文件仍使用KKFile进行预览
|
||||
const url = `${window._CONFIG.onlinePreviewDomainURL}?url=${encodeURIComponent(Base64.encode(fileFullUrl))}`
|
||||
window.open(url)
|
||||
},
|
||||
/**
|
||||
* 单个文件的下载功能
|
||||
* @param file
|
||||
*/
|
||||
handleDownload (file) {
|
||||
// 下载文件
|
||||
downloadFile(`/sys/common/download/${file.id}`, file.fileName)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.file-box {
|
||||
flex: 1;
|
||||
width: 0;
|
||||
}
|
||||
|
||||
.file-btn > ::v-deep span {
|
||||
display: inline;
|
||||
color: @primary-color;
|
||||
font-size: 14px;
|
||||
}
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user