543 lines
14 KiB
Java
543 lines
14 KiB
Java
<template>
|
|
<div class="box">
|
|
<div class="header-search">
|
|
<van-icon @click="iconClick" class="icon" name="arrow-left"/>
|
|
<span class="header-search-text">
|
|
{{serial_number}}
|
|
</span>
|
|
</div>
|
|
<div class="header-right">
|
|
<div class="header-right-text" @click="subscribeClick">
|
|
<img v-if="subscribeFlag == '1'" src="~@/assets/icon_link_document.png" alt="">
|
|
<img v-else src="~@/assets/icon_link.png" alt="">
|
|
<span :class="{'header-right-text-color':subscribeFlag == '1'?true:false}">{{$t('subscribe')}}</span>
|
|
</div>
|
|
<div class="header-right-text" @click="collectionClick">
|
|
<img v-if="collectFlag == '1'" src="~@/assets/icon_star_document.png" alt="">
|
|
<img v-else src="~@/assets/icon_star.png" alt="">
|
|
<span :class="{'header-right-text-color':collectFlag == '1'?true:false}">{{$t('Collection')}}</span>
|
|
</div>
|
|
</div>
|
|
<van-collapse class="collapse" v-model="activeNames">
|
|
<div v-for="(item,index) in detailList">
|
|
<div v-for="val in Object.keys(item)">
|
|
<van-collapse-item v-if="val == $t('essentialInformation')" :title="val" name="1">
|
|
<div class="content-box-type-box" v-for="(ol,index1) in item[val]">
|
|
<div class="content-box-type-num" v-if="ol.field_show_type == 10">
|
|
<span class="content-box-left-num">{{ol.db_field_txt}}</span>
|
|
<span class="content-box-text-num"
|
|
v-if="!ol.list">--</span>
|
|
<span class="content-box-text-num"
|
|
v-for="valItem in ol.list"
|
|
@click="numClick(valItem)"
|
|
v-else-if="ol.list && ol.list.length > 0">
|
|
{{valItem.title}}
|
|
</span>
|
|
</div>
|
|
<div class="content-box-type-num" v-else-if="ol.field_show_type == 8">
|
|
<span class="content-box-left-num">{{ol.db_field_txt}}</span>
|
|
<span class="content-box-text-num" style="color: #040B29">
|
|
{{ol.value || '--'}}
|
|
</span>
|
|
</div>
|
|
<div class="content-box-type" v-else-if="ol.urlClick">
|
|
<span class="content-box-left">{{ol.db_field_txt}}</span>
|
|
<span class="content-box-text" style="color: #01A0AC"
|
|
@click="urlClick(ol)">{{ol.value || '--'}}</span>
|
|
</div>
|
|
<div class="content-box-type" v-else>
|
|
<span class="content-box-left">{{ol.db_field_txt}}</span>
|
|
<span class="content-box-text">{{ol.value || '--'}}</span>
|
|
</div>
|
|
</div>
|
|
</van-collapse-item>
|
|
|
|
<van-collapse-item v-else-if="val == $t('textInformation')"
|
|
:title="val" name="2">
|
|
<div class="textInformation" v-for="(ol,index1) in item[val]">
|
|
<div class="textInformationText">
|
|
{{ol.db_field_txt}}
|
|
</div>
|
|
<div v-if="ol.value && ol.value.length > 0">
|
|
<div class="textInformationFile" @click="fileClick(valItem)" v-for="valItem in ol.value">
|
|
{{valItem.fileName}}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</van-collapse-item>
|
|
</div>
|
|
</div>
|
|
|
|
<van-collapse-item :title="$t('DetailsPhasedImplementation')" name="3">
|
|
<van-list
|
|
v-model="loading"
|
|
:finished="finished"
|
|
:finished-text="$t('noMore')"
|
|
:loading-text="$t('loading')"
|
|
@load="onLoad"
|
|
>
|
|
<div class="Implementation" v-for="(item,index) in dataGrad" :key="index">
|
|
<div class="ImplementationText">{{item.standNumberOrClause}}</div>
|
|
<div class="ImplementationBox">
|
|
<div class="ImplementationBoxLeft">
|
|
{{item.implementationTypeText}}
|
|
</div>
|
|
<div class="ImplementationBoxRight">
|
|
{{item.implementationDate}}
|
|
</div>
|
|
</div>
|
|
<div class="ImplementationButtom">
|
|
{{item.remarks}}
|
|
</div>
|
|
</div>
|
|
</van-list>
|
|
</van-collapse-item>
|
|
</van-collapse>
|
|
<van-overlay :show="show">
|
|
<van-loading type="spinner">{{textLoading}}</van-loading>
|
|
</van-overlay>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import { getAction, postAction, downFile } from '@/api/manage'
|
|
import { kkFileView } from '@/utils/kkfileView'
|
|
import eventBUs from '../../common/event'
|
|
import { Toast } from 'vant'
|
|
|
|
export default {
|
|
name: 'phoneDocumentDetails',
|
|
data() {
|
|
return {
|
|
activeNames: ['1', '2', '3'],
|
|
url: {
|
|
getInfo: 'document/bussDocumentLibraryEO/getInfoById',
|
|
list: 'log/bussLogEO/page',
|
|
getTitle: '/document/bussDocumentLibraryEO/getTitle',
|
|
getPage: '/document/phasedImplementationDetailsEO/page',
|
|
getMenuList: 'document/bussDocumentLibraryEO/getMenuList'
|
|
},
|
|
show: false,
|
|
serial_number: '',
|
|
detailList: [],
|
|
loading: false,
|
|
finished: false,
|
|
pageNo: 0,
|
|
dataGrad: [],
|
|
textLoading: this.$t('loading'),
|
|
collectFlag: 0,
|
|
subscribeFlag: 0
|
|
}
|
|
},
|
|
mounted() {
|
|
document.title = 'NIO GRP'
|
|
let _this = this
|
|
this.getWdkCollectAndSubscribeInfoByUser()
|
|
this.getTitle(function() {
|
|
_this.getInfoById()
|
|
})
|
|
},
|
|
watch: {
|
|
'$route': function(res) {
|
|
let _this = this
|
|
this.getWdkCollectAndSubscribeInfoByUser()
|
|
this.getTitle(function() {
|
|
_this.getInfoById()
|
|
})
|
|
}
|
|
},
|
|
methods: {
|
|
iconClick() {
|
|
if (this.$route.query.goRouter) {
|
|
this.$router.push({
|
|
path: this.$route.query.goRouter,
|
|
query: {
|
|
searchValue: this.$route.query.searchValue,
|
|
activeTab: this.$route.query.activeTab
|
|
}
|
|
})
|
|
} else {
|
|
this.$router.go(-1)
|
|
}
|
|
},
|
|
getWdkCollectAndSubscribeInfoByUser() {
|
|
getAction('/phone/search/getWdkCollectAndSubscribeInfoByUser', { id: this.$route.query.id }).then((res) => {
|
|
if (res.success) {
|
|
if (res.result.subscribeList && res.result.subscribeList.length > 0) {
|
|
this.subscribeFlag = '1'
|
|
} else {
|
|
this.subscribeFlag = '0'
|
|
}
|
|
if (res.result.collectionList && res.result.collectionList.length > 0) {
|
|
this.collectFlag = '1'
|
|
} else {
|
|
this.collectFlag = '0'
|
|
}
|
|
}
|
|
})
|
|
},
|
|
getTitle(callback) {
|
|
this.show = true
|
|
let _id = this.$route.query.id
|
|
getAction(this.url.getTitle, { id: _id }).then((res) => {
|
|
if (res.success) {
|
|
this.serial_number = res.result
|
|
callback && callback()
|
|
} else {
|
|
this.serial_number = ''
|
|
}
|
|
})
|
|
},
|
|
getInfoById() {
|
|
let _id = this.$route.query.id
|
|
getAction(this.url.getInfo, { id: _id }).then((res) => {
|
|
if (res.success) {
|
|
this.detailList = res.result
|
|
this.show = false
|
|
} else {
|
|
this.detailList = []
|
|
}
|
|
})
|
|
},
|
|
collectionClick() {
|
|
let url = ''
|
|
if (this.collectFlag == 0 || !this.collectFlag) {
|
|
url = 'document/bussDocumentLibraryEO/addCollect'
|
|
} else {
|
|
url = 'document/bussDocumentLibraryEO/cancelCollect'
|
|
}
|
|
getAction(url, { id: this.$route.query.id }).then((res) => {
|
|
if (res.success) {
|
|
Toast(this.$t('OperationSuccessful'))
|
|
this.getWdkCollectAndSubscribeInfoByUser()
|
|
} else {
|
|
Toast(this.$t('operationFailed'))
|
|
}
|
|
})
|
|
},
|
|
subscribeClick() {
|
|
let url = ''
|
|
if (this.subscribeFlag == 0 || !this.subscribeFlag) {
|
|
url = 'document/bussDocumentLibraryEO/addSubscribe'
|
|
} else {
|
|
url = 'document/bussDocumentLibraryEO/cancelSubscribe'
|
|
}
|
|
getAction(url, { id: this.$route.query.id }).then((res) => {
|
|
if (res.success) {
|
|
Toast(this.$t('OperationSuccessful'))
|
|
this.getWdkCollectAndSubscribeInfoByUser()
|
|
} else {
|
|
Toast(this.$t('operationFailed'))
|
|
}
|
|
})
|
|
},
|
|
getPage() {
|
|
let query = {
|
|
pageNo: this.pageNo,
|
|
pageSize: 10,
|
|
bussDocumentLibraryId: this.$route.query.id
|
|
}
|
|
getAction(this.url.getPage, query).then((res) => {
|
|
if (res.success) {
|
|
if (res.result.records.length > 0 && this.pageNo > 1) {
|
|
this.dataGrad = this.dataGrad.concat(res.result.records)
|
|
} else if (res.result.records.length > 0 && this.pageNo == 1) {
|
|
this.dataGrad = res.result.records
|
|
} else if (res.result.records.length == 0) {
|
|
this.finished = true
|
|
}
|
|
this.loading = false
|
|
} else {
|
|
this.dataGrad = []
|
|
}
|
|
})
|
|
},
|
|
onLoad() {
|
|
if (this.finished) {
|
|
this.dataGrad = []
|
|
this.finished = false
|
|
} else {
|
|
this.pageNo++
|
|
this.getPage()
|
|
}
|
|
},
|
|
fileClick(item) {
|
|
kkFileView(item.fileName, item.id)
|
|
},
|
|
urlClick(item) {
|
|
window.open(item.value)
|
|
},
|
|
numClick(item) {
|
|
this.$router.push({
|
|
path: '/phoneDocumentDetails',
|
|
query: {
|
|
id: item.id
|
|
}
|
|
})
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style scoped>
|
|
.box {
|
|
padding: 0 0.4rem 0.4rem 0.4rem;
|
|
position: relative;
|
|
}
|
|
|
|
.fixed {
|
|
/*position: fixed;*/
|
|
/*top: 0;*/
|
|
/*left: 0;*/
|
|
/*width: 100%;*/
|
|
/*z-index: 1000;*/
|
|
/*background: #fff;*/
|
|
/*padding-top: 0.4rem;*/
|
|
}
|
|
|
|
.header-search {
|
|
/*padding-left: 0.4rem;*/
|
|
/*padding-right: 0.4rem;*/
|
|
width: 100%;
|
|
display: flex;
|
|
position: sticky;
|
|
top: 0;
|
|
padding-top: 0.4rem;
|
|
background: #fff;
|
|
z-index: 1000;
|
|
}
|
|
|
|
.icon {
|
|
font-size: 0.66rem;
|
|
width: 0.7rem;
|
|
}
|
|
|
|
.header-search-text {
|
|
font-size: 0.44rem;
|
|
font-family: PingFang SC-Medium, PingFang SC;
|
|
font-weight: 600;
|
|
color: #040B29;
|
|
margin-left: 0.2rem;
|
|
word-break: break-all;
|
|
overflow: hidden;
|
|
display: -webkit-box;
|
|
text-overflow: ellipsis;
|
|
/*! autoprefixer: off */
|
|
-webkit-box-orient: vertical;
|
|
-webkit-line-clamp: 2;
|
|
/*! autoprefixer: on;*/
|
|
text-justify: inter-ideograph;
|
|
}
|
|
|
|
.header-right {
|
|
margin-top: 0.4rem;
|
|
display: flex;
|
|
justify-content: flex-end;
|
|
}
|
|
|
|
.header-right-text {
|
|
display: flex;
|
|
align-items: center;
|
|
margin-right: 0.4rem;
|
|
}
|
|
|
|
.header-right-text:last-child {
|
|
margin-right: 0.1rem;
|
|
}
|
|
|
|
.header-right-text img {
|
|
width: 0.4rem;
|
|
}
|
|
|
|
.header-right-text span {
|
|
font-size: 0.38rem;
|
|
font-family: PingFang SC-Regular, PingFang SC;
|
|
font-weight: 400;
|
|
color: #000000;
|
|
margin-left: 0.1rem;
|
|
}
|
|
|
|
.collapse {
|
|
margin-top: 0.6rem;
|
|
}
|
|
|
|
::v-deep .van-cell {
|
|
padding: 0;
|
|
}
|
|
|
|
::v-deep .van-cell::after {
|
|
border-bottom: none;
|
|
}
|
|
|
|
::v-deep .van-collapse-item--border::after {
|
|
border-top: none;
|
|
}
|
|
|
|
::v-deep .van-hairline--top-bottom::after, .van-hairline-unset--top-bottom::after {
|
|
border-width: 0;
|
|
}
|
|
|
|
::v-deep .van-cell__title span {
|
|
font-size: 0.44rem;
|
|
font-family: PingFang SC-Medium, PingFang SC;
|
|
font-weight: 600;
|
|
color: #040B29;
|
|
}
|
|
|
|
::v-deep .collapse .van-icon {
|
|
font-size: 0.44rem;
|
|
color: #040B29;
|
|
}
|
|
|
|
::v-deep .van-collapse-item {
|
|
margin-bottom: 0.6rem;
|
|
}
|
|
|
|
.content-box-type-box {
|
|
margin-top: 0.08rem;
|
|
margin-bottom: 0.4rem;
|
|
}
|
|
|
|
.content-box-type {
|
|
display: flex;
|
|
}
|
|
|
|
.content-box-type-box:last-child {
|
|
margin-bottom: 0.1rem;
|
|
}
|
|
|
|
.content-box-left {
|
|
display: inline-block;
|
|
font-size: 0.38rem;
|
|
font-family: PingFang SC-Regular, PingFang SC;
|
|
font-weight: 400;
|
|
color: #6F7385;
|
|
flex: auto;
|
|
min-width: 2rem;
|
|
}
|
|
|
|
.content-box-left-num {
|
|
display: inline-block;
|
|
font-size: 0.38rem;
|
|
font-family: PingFang SC-Regular, PingFang SC;
|
|
font-weight: 400;
|
|
color: #6F7385;
|
|
width: 100%;
|
|
flex: none;
|
|
}
|
|
|
|
.content-box-text-num {
|
|
text-align: left;
|
|
width: 100%;
|
|
margin-top: 0.2rem;
|
|
font-size: 0.38rem;
|
|
font-family: PingFang SC-Regular, PingFang SC;
|
|
font-weight: 500;
|
|
color: #01A0AC;
|
|
word-break: break-all;
|
|
flex: none;
|
|
display: inline-block;
|
|
}
|
|
|
|
.content-box-text {
|
|
text-align: right;
|
|
margin-left: 0.3rem;
|
|
font-size: 0.38rem;
|
|
font-family: PingFang SC-Regular, PingFang SC;
|
|
font-weight: 500;
|
|
color: #040B29;
|
|
word-break: break-all;
|
|
}
|
|
|
|
::v-deep .van-collapse-item__content {
|
|
padding: 0.5rem 0;
|
|
}
|
|
|
|
.textInformation {
|
|
padding: 0.2rem 0 0 0;
|
|
}
|
|
|
|
.textInformationText {
|
|
margin-bottom: 0.5rem;
|
|
font-size: 0.38rem;
|
|
font-family: PingFang SC-Regular, PingFang SC;
|
|
font-weight: 500;
|
|
color: #040B29;
|
|
}
|
|
|
|
.textInformationFile {
|
|
margin-bottom: 0.3rem;
|
|
font-size: 0.38rem;
|
|
font-family: PingFang SC-Regular, PingFang SC;
|
|
font-weight: 500;
|
|
color: #01A0AC;
|
|
word-break: break-all;
|
|
}
|
|
|
|
.Implementation {
|
|
width: 100%;
|
|
padding: 0.2rem 0 0.3rem 0;
|
|
border-bottom: 1px solid #E6E7EC;
|
|
margin-bottom: 0.2rem;
|
|
}
|
|
|
|
.ImplementationText {
|
|
font-size: 0.42rem;
|
|
font-family: PingFang SC-Regular, PingFang SC;
|
|
font-weight: 500;
|
|
color: #040B29;
|
|
}
|
|
|
|
.ImplementationBox {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
margin-top: 0.2rem;
|
|
margin-bottom: 0.2rem;
|
|
}
|
|
|
|
.ImplementationBoxLeft {
|
|
font-size: 0.38rem;
|
|
font-family: PingFang SC-Regular, PingFang SC;
|
|
font-weight: 400;
|
|
color: #868A9A;
|
|
}
|
|
|
|
.ImplementationBoxRight {
|
|
font-size: 0.38rem;
|
|
font-family: PingFang SC-Regular, PingFang SC;
|
|
font-weight: 400;
|
|
color: #868A9A;
|
|
}
|
|
|
|
.ImplementationButtom {
|
|
font-size: 0.38rem;
|
|
font-family: PingFang SC-Regular, PingFang SC;
|
|
font-weight: 400;
|
|
color: #41475E;
|
|
word-break: break-all;
|
|
}
|
|
|
|
::v-deep .van-loading {
|
|
color: #fff;
|
|
font-size: 0.36rem;
|
|
}
|
|
|
|
::v-deep .van-loading__text {
|
|
color: #fff;
|
|
font-size: 0.46rem;
|
|
}
|
|
|
|
::v-deep .van-overlay {
|
|
z-index: 1001;
|
|
text-align: center;
|
|
line-height: 30;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
}
|
|
|
|
.header-right-text-color {
|
|
color: #01A0AC !important;
|
|
}
|
|
</style> |