update 国内标准-详情

This commit is contained in:
赵霄
2023-09-20 15:14:50 +08:00
parent 551071aa17
commit b5025aad35
2 changed files with 138 additions and 20 deletions
@@ -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>