[add] 文档库和文档拆分模块的详情页
This commit is contained in:
lideqin
@@ -0,0 +1,959 @@
|
||||
<template>
|
||||
<div class="doc-detail">
|
||||
<div class="doc-detail-wrap">
|
||||
<div class="doc-detail-header" style="position: fixed; top: 0">
|
||||
<div class="doc-detail-title">
|
||||
<a-tooltip placement="topLeft">
|
||||
<template slot="title">
|
||||
<span v-html="serialNumber"></span>
|
||||
</template>
|
||||
<span v-html="serialNumber"></span>
|
||||
</a-tooltip>
|
||||
</div>
|
||||
<div class="doc-detail-right">
|
||||
<!-- v-has="'bussLog:page'"-->
|
||||
<div @click="updateLog" class="operator-text-text" :title="$t('updateLog')">
|
||||
<a-icon type="reload"/>
|
||||
{{$t('updateLog')}}
|
||||
</div>
|
||||
<!-- v-has="'bussLog:database'"-->
|
||||
<div @click="knowledgeDatabaseClick" class="operator-text-text"
|
||||
:title="$t('problemKnowledgeBase')">
|
||||
<a-icon type="folder"/>
|
||||
{{ $t('problemKnowledgeBase') }}
|
||||
</div>
|
||||
<!-- v-has="'document:addCollect'"-->
|
||||
<div @click="collectionClick({'collectFlag':collectFlag,'id':documentId})" class="operator-text-text"
|
||||
:title="$t('collection')">
|
||||
<a-icon class="icon" type="star"/>
|
||||
{{ collectFlag == '1' ? $t('cancelCollection') : $t('collection') }}
|
||||
</div>
|
||||
<!-- v-has="'document:pullMessage'"-->
|
||||
<div @click="shareClick" class="operator-text-text"
|
||||
:title="$t('share')">
|
||||
<a-icon type="share-alt"/>
|
||||
{{ $t('share') }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div style="margin-top: 68px;background: #fff" class="detail-box">
|
||||
<div class="detail-content">
|
||||
<div v-for="(item, index) in detailList" :key="index" class="content-box">
|
||||
<div v-for="(val, index) in Object.keys(item)" :key="index" class="content">
|
||||
<div class="header-text fixed-position">
|
||||
{{ val }}
|
||||
</div>
|
||||
<div class="content-text" v-if="val === $t('essentialInformation')">
|
||||
<div class="text-field" v-for="(ol,index1) in item[val]" :key="index1"
|
||||
:class="{'text-content-button-one': ol.field_show_type === 8 ? true : false,
|
||||
'text-content-button-Two': index1 === 1 || index1 === 9 ? true : false}">
|
||||
<span v-if="ol.field_show_type === 10" class="text-field-left-index" :title="ol.db_field_txt">{{ol.db_field_txt}}</span>
|
||||
<span v-else class="text-field-left" :title="ol.db_field_txt">{{ol.db_field_txt}}</span>
|
||||
<span class="text-field-right text-field-right-text" v-if="index1 === 9"
|
||||
:title="ol.value">{{ol.value ? ol.value : '--'}}</span>
|
||||
<span class="text-field-right text-field-right-color" v-else-if="ol.urlClick" @click="urlClick(ol)"
|
||||
:title="ol.value">{{ol.value ? ol.value : '--'}}</span>
|
||||
<span class="text-field-right" v-else-if="ol.field_show_type === 7">
|
||||
<a-button type="primary" class="button-text"
|
||||
v-if="ol.value && ol.value.length > 0"
|
||||
@click="clickButtonToUpload(ol.value)">
|
||||
{{$t('viewUploadedFiles')}}
|
||||
</a-button>
|
||||
<span v-else>--</span>
|
||||
</span>
|
||||
<span class="text-field-right-index"
|
||||
v-else-if="ol.field_show_type === 10">
|
||||
<template v-for="(valItem, index) in ol.list">
|
||||
<span class="text-field-right-color-text"
|
||||
:key="index"
|
||||
:title="valItem.title"
|
||||
@click="relatedClick(valItem)"
|
||||
v-if="ol.list && ol.list.length > 0">
|
||||
{{valItem.title}}
|
||||
</span>
|
||||
<span v-else>--</span>
|
||||
</template>
|
||||
</span>
|
||||
<span class="text-field-right" v-else :title="ol.value">{{ol.value ? ol.value : '--'}}</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="text-information" v-else-if="val === $t('textInformation')">
|
||||
<div class="text-information-box" v-for="(ol,index1) in item[val]" :key="index1">
|
||||
<div class="text-information-box-title fixed-position">
|
||||
{{ol.db_field_txt}}
|
||||
</div>
|
||||
<div class="text-information-box-box">
|
||||
<template v-for="(valItem, index) in ol.value">
|
||||
<div class="text-information-box-box-text" :key="index" v-if="ol.value && ol.value.length > 0">
|
||||
<span @click="pdfPreview(valItem)"
|
||||
:title="valItem.fileName"
|
||||
class="left-conte-td-information">{{valItem.fileName}}</span>
|
||||
<a-icon class="left-conte-td-information-icon"
|
||||
@click="download(valItem)"
|
||||
:title="$t('download')"
|
||||
type="vertical-align-bottom"/>
|
||||
<a-icon class="left-conte-td-information-icon"
|
||||
@click="breakdown(valItem)"
|
||||
v-if="valItem.splitFlag === 1"
|
||||
:title="$t('StandardBreakdown')"
|
||||
type="profile"/>
|
||||
</div>
|
||||
</template>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="content-text" v-else>
|
||||
<div class="text-field" :class="{'text-content-button-one':ol.field_show_type === 8 ? true : false}"
|
||||
v-for="(ol, index1) in item[val]" :key="index1">
|
||||
<span v-if="ol.field_show_type === 10" class="text-field-left-Index" :title="ol.db_field_txt">{{ol.db_field_txt}}</span>
|
||||
<span class="text-field-left" v-else :title="ol.db_field_txt">{{ol.db_field_txt}}</span>
|
||||
<span class="text-field-right text-field-right-color" v-if="ol.urlClick" @click="urlClick(ol)"
|
||||
:title="ol.value">{{ol.value ? ol.value : '--'}}</span>
|
||||
<span class="text-field-right" v-else-if="ol.field_show_type === 7">
|
||||
<a-button type="primary" class="button-text"
|
||||
v-if="ol.value && ol.value.length > 0"
|
||||
@click="clickButtonToUpload(ol.value)">
|
||||
{{$t('viewUploadedFiles')}}
|
||||
</a-button>
|
||||
<span v-else>--</span>
|
||||
</span>
|
||||
<span class="text-field-right-Index"
|
||||
v-else-if="ol.field_show_type === 10">
|
||||
<template v-for="(valItem, index) in ol.list">
|
||||
<span class="text-field-right-color-text"
|
||||
:key="index"
|
||||
@click="relatedClick(valItem)"
|
||||
:title="valItem.title"
|
||||
v-if="ol.list && ol.list.length > 0">
|
||||
{{valItem.title}}
|
||||
</span>
|
||||
<span :key="index" v-else>--</span>
|
||||
</template>
|
||||
</span>
|
||||
<span class="text-field-right" v-else :title="ol.value">{{ol.value ? ol.value : '--'}}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="content-box">
|
||||
<div class="content">
|
||||
<div class="header-text fixed-position">
|
||||
{{$t('DetailsPhasedImplementation')}}
|
||||
</div>
|
||||
<a-table
|
||||
:scroll="{x: '100%'}"
|
||||
:data-source="dataGrad"
|
||||
:columns="columnsGrading"
|
||||
:pagination="ipagination"
|
||||
>
|
||||
</a-table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<a-modal
|
||||
:title="$t('UpdateLog')"
|
||||
:width="900"
|
||||
:visible="visible"
|
||||
:confirm-loading="confirmLoading"
|
||||
:maskClosable="false"
|
||||
@ok="handleOk"
|
||||
@cancel="handleCancel"
|
||||
>
|
||||
<a-table
|
||||
class="table"
|
||||
:components="drag(columns,'columns')"
|
||||
:columns="columns"
|
||||
:pagination="ipaginationUpdateLog"
|
||||
:scroll="{x: '100%',y: 400}"
|
||||
:data-source="dataSource"
|
||||
:loading="loading"
|
||||
>
|
||||
<span slot="content" slot-scope="text">
|
||||
<a-tooltip placement="topLeft" overlayClassName="tooltip-color">
|
||||
<template slot="title">
|
||||
<span v-html="text"></span>
|
||||
</template>
|
||||
<span v-html="text"></span>
|
||||
</a-tooltip>
|
||||
</span>
|
||||
</a-table>
|
||||
</a-modal>
|
||||
<a-modal
|
||||
:title="$t('standardOne')"
|
||||
:width="600"
|
||||
:visible="visibleRelated"
|
||||
:maskClosable="false"
|
||||
@ok="visibleRelated = false"
|
||||
@cancel="visibleRelated = false"
|
||||
>
|
||||
<a-table
|
||||
class="table"
|
||||
:columns="columnsRelated"
|
||||
:pagination="ipaginationStandarOne"
|
||||
:scroll="{x: '100%',y: 400}"
|
||||
:data-source="dataSourceRelated"
|
||||
:loading="loading"
|
||||
>
|
||||
<span slot="operation" slot-scope="text,record">
|
||||
<a class="text" :title="text" @click="detailClick(record)">
|
||||
{{text && text.length > 18 ? text.slice(0,17)+'...' : text}}
|
||||
</a>
|
||||
</span>
|
||||
</a-table>
|
||||
</a-modal>
|
||||
<a-modal
|
||||
:title="$t('viewFileOne')"
|
||||
:width="600"
|
||||
:visible="visibleFile"
|
||||
:maskClosable="false"
|
||||
@cancel="visibleFile = false"
|
||||
>
|
||||
<template slot="footer">
|
||||
<a-button key="back" @click="visibleFile = false">
|
||||
{{$t('cancel')}}
|
||||
</a-button>
|
||||
</template>
|
||||
<a-table
|
||||
class="table"
|
||||
:columns="columnsFile"
|
||||
:pagination="ipaginationViewFileOne"
|
||||
:scroll="{x:500,y: 400}"
|
||||
:data-source="dataSourceFile"
|
||||
:loading="loading"
|
||||
>
|
||||
<span slot="fileOperation" slot-scope="record">
|
||||
<a class="text" @click="pdfPreview(record)"
|
||||
:disabled="record.fileSuffix === '.pdf' || record.fileSuffix === '.docx' || record.fileSuffix === '.doc'
|
||||
|| record.fileSuffix === '.jpg' || record.fileSuffix === '.png' || record.fileSuffix === '.gif'
|
||||
|| record.fileSuffix === '.jpeg' || record.fileSuffix === '.xlsx' || record.fileSuffix === '.xls' ? false : true">
|
||||
{{$t('See')}}
|
||||
</a>
|
||||
<a class="text" @click="download(record)">
|
||||
{{$t('download')}}
|
||||
</a>
|
||||
<a class="text" @click="breakdown(record)" v-if="record.splitFlag === 1">
|
||||
{{$t('StandardBreakdown')}}
|
||||
</a>
|
||||
</span>
|
||||
</a-table>
|
||||
</a-modal>
|
||||
<JLoading :loading="loading">{{$t('dataLoading')}}</JLoading>
|
||||
<uploadFile ref="uploadFile" :isUploadFile="true" :disabled="true"></uploadFile>
|
||||
<libraryPush
|
||||
:url="url"
|
||||
ref="libraryPushRef"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { ResizeHeader, ResizeColumnProvide } from '@/mixins/header'
|
||||
import UploadFile from '@/components/UploadFile'
|
||||
import LibraryPush from './LibraryPush'
|
||||
import { mapGetters } from 'vuex'
|
||||
|
||||
export default {
|
||||
name: 'LibraryDetail',
|
||||
mixins: [ResizeColumnProvide, ResizeHeader],
|
||||
components: { UploadFile, LibraryPush },
|
||||
data () {
|
||||
return {
|
||||
url: {
|
||||
getInfo: 'document/bussDocumentLibraryEO/getInfoById',
|
||||
list: 'log/bussLogEO/page',
|
||||
getTitle: '/document/bussDocumentLibraryEO/getTitle',
|
||||
getPage: '/document/phasedImplementationDetailsEO/page',
|
||||
getMenuList: 'document/bussDocumentLibraryEO/getMenuList',
|
||||
pullMessage: 'document/bussDocumentLibraryEO/pullMessage', // 推送
|
||||
getWdkCollectAndSubscribeInfoByUser: ''
|
||||
},
|
||||
visibleFile: false,
|
||||
loading: false,
|
||||
columnsRelated: [
|
||||
{
|
||||
title: this.$t('standardName'),
|
||||
dataIndex: 'title',
|
||||
align: 'left',
|
||||
ellipsis: true,
|
||||
scopedSlots: { customRender: 'operation' },
|
||||
width: 544
|
||||
}
|
||||
],
|
||||
columnsFile: [
|
||||
{
|
||||
title: this.$t('fileName'),
|
||||
dataIndex: 'fileName',
|
||||
align: 'left',
|
||||
width: 260,
|
||||
ellipsis: true
|
||||
},
|
||||
{
|
||||
title: this.$t('operation'),
|
||||
align: 'left',
|
||||
width: 130,
|
||||
scopedSlots: { customRender: 'fileOperation' }
|
||||
}
|
||||
],
|
||||
visibleRelated: false,
|
||||
dataSourceRelated: [],
|
||||
detailList: [],
|
||||
dataGrad: [],
|
||||
visible: false, // 更新日志弹框是否可见
|
||||
serialNumber: '',
|
||||
confirmLoading: false,
|
||||
downLoadFileUrl: window._CONFIG.domianPreviewURL + '/sys/common/download',
|
||||
downLoadImgUrl: window._CONFIG.domianWebImgURL + '/sys/common/download',
|
||||
dataSource: [],
|
||||
dataSourceFile: [],
|
||||
documentId: this.$route.query.documentId === undefined ? this.$route.query.id : this.$route.query.documentId,
|
||||
columnsGrading: [
|
||||
{
|
||||
title: this.$t('Statutenumberclause'),
|
||||
dataIndex: 'standNumberOrClause',
|
||||
align: 'left',
|
||||
ellipsis: true,
|
||||
width: '25%'
|
||||
},
|
||||
{
|
||||
title: this.$t('Typeofimplementation'),
|
||||
dataIndex: 'implementationTypeText',
|
||||
align: 'left',
|
||||
ellipsis: true,
|
||||
width: '15%'
|
||||
},
|
||||
{
|
||||
title: this.$t('implementationDateTwo'),
|
||||
dataIndex: 'implementationDate',
|
||||
align: 'left',
|
||||
ellipsis: true,
|
||||
width: '15%'
|
||||
},
|
||||
{
|
||||
title: this.$t('remarks'),
|
||||
dataIndex: 'remarks',
|
||||
align: 'left',
|
||||
width: '45%'
|
||||
}
|
||||
],
|
||||
columns: [
|
||||
{
|
||||
title: this.$t('ModificationContent'),
|
||||
dataIndex: 'content',
|
||||
align: 'left',
|
||||
ellipsis: true,
|
||||
scopedSlots: { customRender: 'content' },
|
||||
width: 484
|
||||
},
|
||||
{
|
||||
title: this.$t('ModificationTime'),
|
||||
dataIndex: 'createTime',
|
||||
align: 'left',
|
||||
ellipsis: true,
|
||||
width: 180
|
||||
},
|
||||
{
|
||||
title: this.$t('personnel'),
|
||||
dataIndex: 'createBy',
|
||||
align: 'left',
|
||||
ellipsis: true,
|
||||
width: 180
|
||||
}
|
||||
],
|
||||
collectFlag: ''
|
||||
}
|
||||
},
|
||||
created () {
|
||||
this.loading = true
|
||||
document.title = this.$t('documentLibraryDetails')
|
||||
|
||||
this.getTitle(() => {
|
||||
this.getInfoById()
|
||||
})
|
||||
this.getPage()
|
||||
this.getWdkCollectAndSubscribeInfoByUser()
|
||||
},
|
||||
methods: {
|
||||
...mapGetters(['userInfo']),
|
||||
shareClick () {
|
||||
const _id = this.$route.query.documentId === undefined ? this.$route.query.id : this.$route.query.documentId
|
||||
this.$refs.libraryPushRef.getPush(_id.split(','))
|
||||
},
|
||||
getWdkCollectAndSubscribeInfoByUser () {
|
||||
const _id = this.$route.query.documentId === undefined ? this.$route.query.id : this.$route.query.documentId
|
||||
getAction(this.url.getWdkCollectAndSubscribeInfoByUser, { id: _id }).then((res) => {
|
||||
if (res.success) {
|
||||
if (res.result.collectionList && res.result.collectionList.length > 0) {
|
||||
this.collectFlag = '1'
|
||||
} else {
|
||||
this.collectFlag = '0'
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
collectionClick (val) {
|
||||
this.$confirm({
|
||||
content: val.collectFlag === 0 || !val.collectFlag ? this.$t('ConfirmCollection') : this.$t('cancelConfirmCollection'),
|
||||
onOk: () => {
|
||||
let url = ''
|
||||
if (val.collectFlag === 0 || !val.collectFlag) {
|
||||
url = 'document/bussDocumentLibraryEO/addCollect'
|
||||
} else {
|
||||
url = 'document/bussDocumentLibraryEO/cancelCollect'
|
||||
}
|
||||
getAction(url, { id: val.id }).then((res) => {
|
||||
if (res.success) {
|
||||
this.$message.success(this.$t('OperationSuccessful'))
|
||||
this.getWdkCollectAndSubscribeInfoByUser()
|
||||
} else {
|
||||
this.$message.warning(this.$t('operationFailed'))
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
documentTranslationClick () {
|
||||
let serialNumber = ''
|
||||
if (this.detailList.length > 0) {
|
||||
this.detailList[0][this.$t('essentialInformation')].forEach(res => {
|
||||
if (res.db_field_name === 'serialNumber') {
|
||||
serialNumber = res.value
|
||||
}
|
||||
})
|
||||
}
|
||||
const newUrl = this.$router.resolve({
|
||||
path: '/documentTranslation',
|
||||
query: {
|
||||
serialNumber: serialNumber
|
||||
}
|
||||
})
|
||||
window.open(newUrl.href, '_blank')
|
||||
},
|
||||
documentComparisonClick () {
|
||||
let serialNumber = ''
|
||||
if (this.detailList.length > 0) {
|
||||
this.detailList[0][this.$t('essentialInformation')].forEach(res => {
|
||||
if (res.db_field_name === 'serialNumber') {
|
||||
serialNumber = res.value
|
||||
}
|
||||
})
|
||||
}
|
||||
const newUrl = this.$router.resolve({
|
||||
path: '/documentComparison',
|
||||
query: {
|
||||
serialNumber: serialNumber
|
||||
}
|
||||
})
|
||||
window.open(newUrl.href, '_blank')
|
||||
},
|
||||
knowledgeDatabaseClick () {
|
||||
let serialNumber = ''
|
||||
if (this.detailList.length > 0) {
|
||||
this.detailList[0][this.$t('essentialInformation')].forEach(res => {
|
||||
if (res.db_field_name === 'serialNumber') {
|
||||
serialNumber = res.value
|
||||
}
|
||||
})
|
||||
}
|
||||
const newUrl = this.$router.resolve({
|
||||
path: '/problemknowledgeBase',
|
||||
query: {
|
||||
serial_number: serialNumber
|
||||
}
|
||||
})
|
||||
window.open(newUrl.href, '_blank')
|
||||
},
|
||||
getTitle (callback) {
|
||||
const _id = this.$route.query.documentId === undefined ? this.$route.query.id : this.$route.query.documentId
|
||||
getAction(this.url.getTitle, { id: _id }).then((res) => {
|
||||
if (res.success) {
|
||||
this.serialNumber = res.result
|
||||
callback && callback()
|
||||
} else {
|
||||
this.serialNumber = ''
|
||||
}
|
||||
})
|
||||
},
|
||||
getInfoById () {
|
||||
const _id = this.$route.query.documentId === undefined ? this.$route.query.id : this.$route.query.documentId
|
||||
getAction(this.url.getInfo, { id: _id }).then((res) => {
|
||||
if (res.success) {
|
||||
this.detailList = res.result
|
||||
this.loading = false
|
||||
} else {
|
||||
this.detailList = []
|
||||
}
|
||||
})
|
||||
},
|
||||
getPage () {
|
||||
const tableQuery = {
|
||||
pageNo: this.tablepageNo,
|
||||
pageSize: this.tablepageSize,
|
||||
bussDocumentLibraryId: this.$route.query.id
|
||||
}
|
||||
getAction(this.url.getPage, tableQuery).then((res) => {
|
||||
if (res.success) {
|
||||
this.dataGrad = res.result.records
|
||||
this.tabletotal = res.result.total
|
||||
this.loading = false
|
||||
} else {
|
||||
this.dataGrad = []
|
||||
this.loading = false
|
||||
}
|
||||
})
|
||||
},
|
||||
clickButtonToUpload (item) {
|
||||
this.loading = true
|
||||
this.visibleFile = true
|
||||
getAction('document/bussDocumentLibraryEO/getFileInfos', { id: item.join(',') }).then((res) => {
|
||||
if (res.success) {
|
||||
this.dataSourceFile = res.result
|
||||
this.dataSourceFile.forEach((val) => {
|
||||
const fileName = val.fileName
|
||||
const index1 = fileName.lastIndexOf('.')
|
||||
const index2 = fileName.length
|
||||
const fileSuffix = fileName.substring(index1, index2)
|
||||
val.fileSuffix = fileSuffix
|
||||
})
|
||||
this.loading = false
|
||||
} else {
|
||||
this.dataSourceFile = []
|
||||
this.loading = false
|
||||
}
|
||||
})
|
||||
},
|
||||
pdfPreview (fileQuery) {
|
||||
const fileName = fileQuery.fileName
|
||||
const index1 = fileName.lastIndexOf('.')
|
||||
const index2 = fileName.length
|
||||
const fileSuffix = fileName.substring(index1, index2)
|
||||
if (fileSuffix === '.pdf') {
|
||||
window.open('/pdf/web/viewer.html?file=' + encodeURIComponent('/jero-boot/sys/common/pdf/viewFile?id=' + fileQuery.id + '&userName=' + this.userInfo().username))
|
||||
} else if (fileSuffix === '.docx' || fileSuffix === '.doc') {
|
||||
const url = window._CONFIG.onlinePreviewDomainURL + '?url=' + Base64.encode(this.downLoadFileUrl + '/' + fileQuery.id + fileSuffix)
|
||||
window.open(url, '_blank')
|
||||
} else if (fileSuffix === '.xlsx' || fileSuffix === '.xls') {
|
||||
const url = window._CONFIG.onlinePreviewDomainURL + '?url=' + Base64.encode(this.downLoadFileUrl + '/' + fileQuery.id + fileSuffix)
|
||||
window.open(url, '_blank')
|
||||
} else if (fileSuffix === '.png' || fileSuffix === '.jpeg' || fileSuffix === '.gif' || fileSuffix === '.jpg') {
|
||||
const url = window._CONFIG.onlinePreviewDomainURL + '?url=' + Base64.encode(this.downLoadImgUrl + '/' + fileQuery.id + fileSuffix)
|
||||
window.open(url, '_blank')
|
||||
} else {
|
||||
downloadFile('/sys/common/downLoadFile', fileQuery.fileName, { id: fileQuery.id })
|
||||
}
|
||||
},
|
||||
download (item) {
|
||||
downloadFile('/sys/common/downLoadFile', item.fileName, { id: item.id, userName: this.userInfo().username })
|
||||
},
|
||||
updateLog () {
|
||||
this.visible = true
|
||||
this.bussLogList()
|
||||
},
|
||||
handleOk () {
|
||||
this.visible = false
|
||||
},
|
||||
handleCancel () {
|
||||
this.visible = false
|
||||
},
|
||||
urlClick (item) {
|
||||
window.open(item.value)
|
||||
},
|
||||
bussLogList () {
|
||||
const query = {
|
||||
pageNo: this.pageNo,
|
||||
pageSize: this.pageSize,
|
||||
documentId: this.$route.query.id
|
||||
}
|
||||
this.loading = true
|
||||
getAction(this.url.list, query).then((res) => {
|
||||
if (res.success) {
|
||||
this.dataSource = res.result.records
|
||||
this.total = res.result.total
|
||||
this.loading = false
|
||||
} else {
|
||||
this.loading = false
|
||||
}
|
||||
})
|
||||
},
|
||||
documentSplitting () {
|
||||
let serialNumber = ''
|
||||
if (this.detailList.length > 0) {
|
||||
this.detailList[0][this.$t('essentialInformation')].forEach(res => {
|
||||
if (res.db_field_name === 'serialNumber') {
|
||||
serialNumber = res.value
|
||||
}
|
||||
})
|
||||
}
|
||||
const newUrl = this.$router.resolve({
|
||||
path: '/docManage/splite',
|
||||
query: {
|
||||
serial_number: serialNumber
|
||||
}
|
||||
})
|
||||
window.open(newUrl.href, '_blank')
|
||||
},
|
||||
detailClick (val) {
|
||||
const newUrl = this.$router.resolve({
|
||||
path: '/docManage/library/detail',
|
||||
query: val
|
||||
})
|
||||
this.visibleRelated = false
|
||||
window.open(newUrl.href, '_blank')
|
||||
},
|
||||
relatedClick (val) {
|
||||
const newUrl = this.$router.resolve({
|
||||
path: '/docManage/library/detail',
|
||||
query: val
|
||||
})
|
||||
window.open(newUrl.href, '_blank')
|
||||
},
|
||||
breakdown (item) {
|
||||
const newUrl = this.$router.resolve({
|
||||
path: '/docManage/splitting/splitDetail',
|
||||
query: {
|
||||
infoId: item.splitInfoId
|
||||
}
|
||||
})
|
||||
window.open(newUrl.href, '_blank')
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.tooltip-color .ant-tooltip-inner {
|
||||
color: #333;
|
||||
background-color: #fff !important;
|
||||
}
|
||||
|
||||
.tooltip-color .ant-tooltip-arrow::before {
|
||||
background-color: #fff;
|
||||
}
|
||||
</style>
|
||||
|
||||
<style scoped lang="less">
|
||||
@import '~@assets/less/common.less';
|
||||
|
||||
body {
|
||||
height: auto;
|
||||
transition: all .5s linear !important;
|
||||
}
|
||||
|
||||
.doc-detail {
|
||||
background: #fff;
|
||||
height: 100%;
|
||||
|
||||
.detail-content {
|
||||
/*width: calc(100% - 212px);*/
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.doc-detail-wrap {
|
||||
.doc-detail-header {
|
||||
width: 100%;
|
||||
height: 68px;
|
||||
line-height: 68px;
|
||||
padding: 0 0 0 32px;
|
||||
box-sizing: border-box;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
border-bottom: 2px #eff1f3 solid;
|
||||
background: #fff;
|
||||
|
||||
.doc-detail-title {
|
||||
display: inline-block;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
font-size: 20px;
|
||||
font-weight: 400;
|
||||
color: #040B29;
|
||||
line-height: 68px;
|
||||
}
|
||||
|
||||
.doc-detail-right {
|
||||
/*width: 800px;*/
|
||||
line-height: 68px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
.doc-detail-btn {
|
||||
margin-left: 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.content-box {
|
||||
/*padding: 0 40px 0 32px;*/
|
||||
/*box-sizing: border-box;*/
|
||||
}
|
||||
|
||||
.header-text {
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
height: 90px;
|
||||
color: #000F16;
|
||||
line-height: 110px;
|
||||
}
|
||||
|
||||
.content-text {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
|
||||
.text-field {
|
||||
width: 33%;
|
||||
margin-bottom: 8px;
|
||||
|
||||
.text-field-left {
|
||||
width: 114px;
|
||||
display: inline-block;
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
color: #6F7385;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
margin-right: 6px;
|
||||
}
|
||||
|
||||
.text-field-right {
|
||||
width: calc(100% - 130px);
|
||||
display: inline-block;
|
||||
font-size: 14px;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
word-break: break-word;
|
||||
color: #040B29;
|
||||
/*font-weight: bold;*/
|
||||
}
|
||||
}
|
||||
|
||||
.text-content-button-one {
|
||||
width: 100%;
|
||||
|
||||
.text-field-left {
|
||||
width: 114px;
|
||||
display: inline-block;
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
color: #6F7385;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
margin-right: 6px;
|
||||
float: left;
|
||||
}
|
||||
|
||||
.text-field-right {
|
||||
width: calc(66.6% - 130px);
|
||||
display: inline-block;
|
||||
font-size: 14px;
|
||||
text-overflow: ellipsis;
|
||||
white-space: pre-wrap;
|
||||
word-break: break-word;
|
||||
overflow: visible;
|
||||
float: left;
|
||||
color: #040B29;
|
||||
/*font-weight: bold;*/
|
||||
}
|
||||
}
|
||||
|
||||
.text-content-button-Two {
|
||||
width: 67%;
|
||||
|
||||
.text-field-left {
|
||||
width: 114px;
|
||||
display: inline-block;
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
color: #6F7385;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
margin-right: 6px;
|
||||
float: left;
|
||||
}
|
||||
|
||||
.text-field-right {
|
||||
width: calc(100% - 130px);
|
||||
display: inline-block;
|
||||
font-size: 14px;
|
||||
text-overflow: ellipsis;
|
||||
white-space: pre-wrap;
|
||||
word-break: break-word;
|
||||
overflow: hidden;
|
||||
float: left;
|
||||
color: #040B29;
|
||||
/*font-weight: bold;*/
|
||||
}
|
||||
|
||||
.text-field-right-text {
|
||||
width: calc(50% - 140px);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.detail-box {
|
||||
padding: 0 110px 0 110px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.operator-text-text {
|
||||
cursor: pointer;
|
||||
margin-right: 16px;
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
color: #040B29;
|
||||
display: inline-block;
|
||||
width: 130px;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-align: center;
|
||||
height: 40px;
|
||||
border: 1px solid #CED0D8;
|
||||
border-radius: 4px;
|
||||
line-height: 40px;
|
||||
padding: 0 5px;
|
||||
}
|
||||
|
||||
.content-box:last-child {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.td-information {
|
||||
border: 1px #eff1f3 solid;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.conte-td-information {
|
||||
color: #01A0AC;
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.left-conte-td-information {
|
||||
max-width: calc(100% - 30px);
|
||||
display: inline-block;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
margin-right: 4px;
|
||||
color: #01A0AC;
|
||||
cursor: pointer;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.left-conte-td-information-icon {
|
||||
color: #01A0AC;
|
||||
cursor: pointer;
|
||||
margin-right: 6px;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.text-field-right-color {
|
||||
color: #00B3BE !important;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
/deep/ .ant-table-placeholder {
|
||||
margin-top: 0px !important;
|
||||
}
|
||||
|
||||
.text {
|
||||
margin-right: 10px
|
||||
}
|
||||
|
||||
.text-information {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
&-box {
|
||||
width: calc(33.3% - 10px);
|
||||
height: auto;
|
||||
display: inline-block;
|
||||
overflow: hidden;
|
||||
margin-right: 15px;
|
||||
}
|
||||
&-box:nth-child(3n) {
|
||||
margin-right: 0;
|
||||
}
|
||||
&-box-title {
|
||||
background: #f3f6f6;
|
||||
border-radius: 4px;
|
||||
width: 100%;
|
||||
display: inline-block;
|
||||
height: 44px;
|
||||
padding: 0 16px;
|
||||
line-height: 44px;
|
||||
color: #040B29;
|
||||
font-weight: 500;
|
||||
font-size: 14px;
|
||||
}
|
||||
&-box-box {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
padding: 10px 16px 10px 16px;
|
||||
overflow: hidden;
|
||||
}
|
||||
&-box-box-text {
|
||||
width: 100%;
|
||||
margin-right: 20px;
|
||||
height: 36px;
|
||||
float: left;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
|
||||
.text-field-left-index {
|
||||
width: 114px;
|
||||
display: inline-block;
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
color: #6F7385;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
margin-right: 6px;
|
||||
float: left;
|
||||
}
|
||||
|
||||
.text-field-right-index {
|
||||
width: calc(100% - 130px);
|
||||
display: inline-block;
|
||||
font-size: 14px;
|
||||
word-break: break-word;
|
||||
float: left;
|
||||
}
|
||||
|
||||
.text-field-right-color-text {
|
||||
width: calc(50% - 20px);
|
||||
margin-right: 20px;
|
||||
font-size: 14px;
|
||||
display: inline-block;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
cursor: pointer;
|
||||
/*font-weight: bold;*/
|
||||
color: #01A0AC;
|
||||
}
|
||||
|
||||
/deep/ .ant-table-column-title {
|
||||
font-weight: 400 !important;
|
||||
color: #040B29 !important;
|
||||
}
|
||||
|
||||
/deep/ .ant-table-column-title {
|
||||
font-weight: 400 !important;
|
||||
color: #040B29 !important;
|
||||
}
|
||||
|
||||
</style>
|
||||
Reference in New Issue
Block a user