316 lines
8.0 KiB
Java
316 lines
8.0 KiB
Java
<template>
|
|
<div class="box">
|
|
<div class="header-search">
|
|
<van-icon @click="iconClick" class="icon" name="arrow-left"/>
|
|
<span class="header-search-text">
|
|
{{$t('myCollection')}}
|
|
</span>
|
|
</div>
|
|
<van-tabs v-model="activeTab" @change="activeChange">
|
|
<van-tab name="documentLibrary" :title="$t('DocumentLibrary')"></van-tab>
|
|
<van-tab name="problemKnowledgeBase" :title="$t('problemKnowledgeBase')"></van-tab>
|
|
</van-tabs>
|
|
<div class="content" v-if="activeTab == 'documentLibrary'">
|
|
<van-list
|
|
v-model="loading"
|
|
:finished="finished"
|
|
:finished-text="$t('noMore')"
|
|
:loading-text="$t('loading')"
|
|
@load="onLoad"
|
|
>
|
|
<div class="content-text" @click="collectionClick(item)" v-for="(item,index) in collectionList" :key="index">
|
|
<div class="content-text-left">
|
|
<div class="content-text-top">
|
|
<span class="content-text-top-left">
|
|
{{item.serialNumber}}
|
|
</span>
|
|
</div>
|
|
<div class="content-text-button">
|
|
<span> {{item.title}}</span>
|
|
</div>
|
|
</div>
|
|
<div class="content-text-right">
|
|
<van-icon name="arrow"/>
|
|
</div>
|
|
</div>
|
|
</van-list>
|
|
</div>
|
|
|
|
|
|
<div class="content" v-else-if="activeTab == 'problemKnowledgeBase'">
|
|
<van-list
|
|
v-model="problemLoading"
|
|
:finished="problemFinished"
|
|
:finished-text="$t('noMore')"
|
|
:loading-text="$t('loading')"
|
|
@load="problemOnLoad"
|
|
>
|
|
<div class="content-text" @click="problemKnowledgeBaseClick(item)" v-for="(item,index) in problemList"
|
|
:key="index">
|
|
<div class="content-text-left">
|
|
<!-- <div class="content-text-top">-->
|
|
<!-- <span class="content-text-top-left">-->
|
|
<!-- {{item.serialNumber}}-->
|
|
<!-- </span>-->
|
|
<!-- </div>-->
|
|
<div class="content-text-button">
|
|
<span> {{item.title}}</span>
|
|
</div>
|
|
</div>
|
|
<div class="content-text-right">
|
|
<van-icon name="arrow"/>
|
|
</div>
|
|
</div>
|
|
</van-list>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import { getAction, postAction, deleteAction, downloadFile } from '@/api/manage'
|
|
|
|
export default {
|
|
name: 'phoneMyCollection',
|
|
data() {
|
|
return {
|
|
collectionList: [],
|
|
pageNo: 0,
|
|
pageSize: 10,
|
|
loading: false,
|
|
finished: false,
|
|
activeTab: 'documentLibrary',
|
|
problemList: [],
|
|
problemLoading: false,
|
|
problemFinished: false,
|
|
problemPageNo: 1,
|
|
url: {
|
|
documentLibraryUrl: 'collection/onlCgformCollection/page',
|
|
problemKnowledgeBaseUrl: '/problemKnowledgeBase/problemKnowledgeBaseCollectEO/queryCollectPageList'
|
|
}
|
|
}
|
|
},
|
|
mounted() {
|
|
document.title = 'NIO GRP'
|
|
// this.getCollection()
|
|
},
|
|
methods: {
|
|
iconClick() {
|
|
this.$router.go(-1)
|
|
},
|
|
activeChange() {
|
|
if (this.activeTab == 'documentLibrary') {
|
|
this.loading = true
|
|
this.collectionList = []
|
|
this.finished = false
|
|
this.pageNo = 1
|
|
this.getCollection()
|
|
} else if (this.activeTab == 'problemKnowledgeBase') {
|
|
this.problemLoading = true
|
|
this.problemList = []
|
|
this.problemFinished = false
|
|
this.problemPageNo = 1
|
|
this.getProblem()
|
|
}
|
|
},
|
|
onLoad() {
|
|
if (this.finished) {
|
|
this.collectionList = []
|
|
this.finished = false
|
|
} else {
|
|
this.pageNo++
|
|
this.getCollection()
|
|
}
|
|
},
|
|
problemOnLoad() {
|
|
if (this.problemFinished) {
|
|
this.problemList = []
|
|
this.problemFinished = false
|
|
} else {
|
|
this.problemPageNo++
|
|
this.getProblem()
|
|
}
|
|
},
|
|
getProblem() {
|
|
let params = {
|
|
pageNo: this.problemPageNo,
|
|
pageSize: 10
|
|
}
|
|
getAction(this.url.problemKnowledgeBaseUrl, params).then(res => {
|
|
if (res.success) {
|
|
let result = res.result ? res.result.records : []
|
|
if (result.length > 0 && this.problemPageNo > 1) {
|
|
this.problemList = this.problemList.concat(result)
|
|
} else if (result.length > 0 && this.problemPageNo == 1) {
|
|
this.problemList = result
|
|
} else if (result.length == 0) {
|
|
this.problemFinished = true
|
|
}
|
|
this.problemLoading = false
|
|
} else {
|
|
this.problemList = []
|
|
}
|
|
})
|
|
},
|
|
getCollection() {
|
|
let params = {
|
|
pageNo: this.pageNo,
|
|
pageSize: this.pageSize
|
|
}
|
|
postAction(this.url.documentLibraryUrl, params).then(res => {
|
|
if (res.success) {
|
|
let result = res.result ? res.result.records : []
|
|
if (result.length > 0 && this.pageNo > 1) {
|
|
this.collectionList = this.collectionList.concat(result)
|
|
} else if (result.length > 0 && this.pageNo == 1) {
|
|
this.collectionList = result
|
|
} else if (result.length == 0) {
|
|
this.finished = true
|
|
}
|
|
this.loading = false
|
|
} else {
|
|
this.collectionList = []
|
|
}
|
|
})
|
|
},
|
|
|
|
|
|
collectionClick(item) {
|
|
this.$router.push({
|
|
path: '/phoneDocumentDetails',
|
|
query: {
|
|
id: item.documentId
|
|
}
|
|
})
|
|
},
|
|
problemKnowledgeBaseClick(item) {
|
|
this.$router.push({
|
|
path: '/phoneProblemKnowledgeBase',
|
|
query: {
|
|
id: item.id
|
|
}
|
|
})
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style scoped>
|
|
.box {
|
|
padding: 0 0.4rem 0.4rem 0.4rem;
|
|
position: relative;
|
|
}
|
|
|
|
::v-deep .van-tabbar-item--active {
|
|
color: #00B3BE;
|
|
}
|
|
|
|
.header-search {
|
|
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;
|
|
}
|
|
|
|
.content {
|
|
margin-top: 0.26rem;
|
|
}
|
|
|
|
.content-text {
|
|
padding: 0.3rem 0;
|
|
box-sizing: border-box;
|
|
display: flex;
|
|
align-items: center;
|
|
border-bottom: 0.02rem solid #E6E7EC;
|
|
}
|
|
|
|
.content-text-left {
|
|
width: calc(100% - 1rem);
|
|
}
|
|
|
|
.content-text-right {
|
|
width: 1rem;
|
|
text-align: right;
|
|
}
|
|
|
|
.content-text-top {
|
|
font-size: 0.42rem;
|
|
font-family: PingFang SC-Regular, PingFang SC;
|
|
font-weight: 500;
|
|
color: #040B29;
|
|
}
|
|
|
|
.content-text-button {
|
|
font-size: 0.42rem;
|
|
font-family: PingFang SC-Regular, PingFang SC;
|
|
font-weight: 400;
|
|
color: #595E72;
|
|
margin-top: 0.13rem;
|
|
word-break: break-all;
|
|
overflow: hidden;
|
|
display: -webkit-box;
|
|
text-overflow: ellipsis;
|
|
/*! autoprefixer: off */
|
|
-webkit-box-orient: vertical;
|
|
-webkit-line-clamp: 3;
|
|
/*! autoprefixer: on;*/
|
|
text-justify: inter-ideograph;
|
|
}
|
|
|
|
.content-text-right .van-icon {
|
|
font-size: 0.5rem;
|
|
color: #040B29;
|
|
}
|
|
|
|
.content-text-top-right {
|
|
margin-left: 0.3rem;
|
|
}
|
|
|
|
::v-deep .van-tab {
|
|
font-size: 0.38rem;
|
|
font-family: PingFang SC-Regular, PingFang SC;
|
|
font-weight: 400;
|
|
color: #868A9A;
|
|
flex: none;
|
|
margin-right: 0.2rem;
|
|
}
|
|
|
|
::v-deep .van-tab--active {
|
|
font-size: 0.38rem;
|
|
font-family: PingFang SC-Medium, PingFang SC;
|
|
font-weight: 600;
|
|
color: #040B29;
|
|
}
|
|
|
|
::v-deep .van-tabs {
|
|
margin-top: 0.36rem;
|
|
}
|
|
|
|
::v-deep .van-tabs__line {
|
|
background-color: #00B3BE;
|
|
}
|
|
</style> |