473 lines
13 KiB
Java
473 lines
13 KiB
Java
<template>
|
||
<div class="box">
|
||
<div class="content">
|
||
<van-tabs v-model="activeTab" @change="activeChange" :ellipsis="false">
|
||
<van-tab name="regulatoryCertification" :title="$t('regulatoryCertificationProcess')"></van-tab>
|
||
<van-tab name="parametercollection" :title="$t('authenticationParameterCollection')"></van-tab>
|
||
</van-tabs>
|
||
</div>
|
||
<div class="content-box">
|
||
<div class="regulatory" v-if="activeTab == 'regulatoryCertification'">
|
||
<!-- <div class="content-box-text">-->
|
||
<!-- {{$t('regulatoryCertificationProcessData')}}-->
|
||
<!-- </div>-->
|
||
<div class="regulatory-box">
|
||
<div class="content-box-data" @click="regulationListIssuanceClick">
|
||
<div class="content-box-data-text">
|
||
{{$t('regulationListIssuance')}}
|
||
</div>
|
||
<div class="content-box-data-num">
|
||
{{publishingCount}}
|
||
</div>
|
||
</div>
|
||
<div class="content-box-data" @click="processClick(2)">
|
||
<div class="content-box-data-text">
|
||
{{$t('designTheComplianceProcess')}}
|
||
</div>
|
||
<div class="content-box-data-num">
|
||
{{designCount}}
|
||
</div>
|
||
</div>
|
||
<div class="content-box-data" @click="processClick(4)">
|
||
<div class="content-box-data-text">
|
||
{{$t('verifyComplianceProcess')}}
|
||
</div>
|
||
<div class="content-box-data-num">
|
||
{{verifyCount}}
|
||
</div>
|
||
</div>
|
||
<div class="content-box-data" @click="processClick(21)">
|
||
<div class="content-box-data-text">
|
||
{{$t('thePreHomeProcess')}}
|
||
</div>
|
||
<div class="content-box-data-num">
|
||
{{preHomoCount}}
|
||
</div>
|
||
</div>
|
||
<div class="content-box-data" @click="regulationListIssuanceClick">
|
||
<div class="content-box-data-text">
|
||
{{$t('technicalAssessmentOfRegulations')}}
|
||
</div>
|
||
<div class="content-box-data-num">
|
||
{{technologyEvaluationCount}}
|
||
</div>
|
||
</div>
|
||
<div class="content-box-data" @click="regulationListIssuanceClick">
|
||
<div class="content-box-data-text">
|
||
{{$t('legalOpinionCollection')}}
|
||
</div>
|
||
<div class="content-box-data-num">
|
||
{{opinionCollectionCount}}
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="parameter" v-else-if="activeTab == 'parametercollection'">
|
||
<!-- <div class="content-box-text">-->
|
||
<!-- {{$t('authenticationParameterCollectionData')}}-->
|
||
<!-- </div>-->
|
||
<van-list
|
||
v-model="loading"
|
||
:finished="finished"
|
||
:finished-text="$t('noMore')"
|
||
:loading-text="$t('loading')"
|
||
@load="onLoad"
|
||
>
|
||
<div class="parame-box" @click="parameClick" v-for="(item,index) in dataSource" :key="index">
|
||
<div class="parame-box-top">
|
||
<span class="parame-box-top-text-left"
|
||
:class="{'parame-box-top-text-left-one':language == 'en-us'? true : false}">
|
||
{{$t('phoneRelatedItems')}}:</span>
|
||
<span class="parame-box-top-text-right"
|
||
:class="{'parame-box-top-text-right-one':language == 'en-us'? true : false}">
|
||
{{item.projectName}}
|
||
</span>
|
||
</div>
|
||
<div class="parame-box-top">
|
||
<span class="parame-box-top-text-left"
|
||
:class="{'parame-box-top-text-left-one':language == 'en-us'? true : false}">
|
||
{{$t('listHeading')}}:
|
||
</span>
|
||
<span class="parame-box-top-text-right"
|
||
:class="{'parame-box-top-text-right-one':language == 'en-us'? true : false}">
|
||
{{item.title}}
|
||
</span>
|
||
</div>
|
||
<div class="parame-box-top">
|
||
<span class="parame-box-top-text-left"
|
||
:class="{'parame-box-top-text-left-one':language == 'en-us'? true : false}">
|
||
{{$t('Version')}}:
|
||
</span>
|
||
<span class="parame-box-top-text-right"
|
||
:class="{'parame-box-top-text-right-one':language == 'en-us'? true : false}">
|
||
{{item.version}}
|
||
</span>
|
||
</div>
|
||
<div class="parame-box-bottom">
|
||
<div class="parame-box-bottom-box">
|
||
<div class="parame-box-bottom-box-text-top">
|
||
{{$t('completednum')}}
|
||
</div>
|
||
<div class="parame-box-bottom-box-text-num">
|
||
{{item.waitFillNum || '--'}}
|
||
</div>
|
||
</div>
|
||
<div class="parame-box-bottom-box">
|
||
<div class="parame-box-bottom-box-text-top">
|
||
{{$t('filledBy')}}
|
||
</div>
|
||
<div class="parame-box-bottom-box-text-num">
|
||
{{item.waitSdtNum || '--'}}
|
||
</div>
|
||
</div>
|
||
<div class="parame-box-bottom-box">
|
||
<div class="parame-box-bottom-box-text-top">
|
||
{{$t('parameterToBeInitiated')}}
|
||
</div>
|
||
<div class="parame-box-bottom-box-text-num">
|
||
{{item.waitCollectNum || '--'}}
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</van-list>
|
||
</div>
|
||
</div>
|
||
|
||
<van-tabbar v-model="active" @change="onChange">
|
||
<van-tabbar-item name="search" icon="search">{{$t('phoneSearch')}}</van-tabbar-item>
|
||
<van-tabbar-item name="toDoCenter" icon="bell">{{$t('todocenter')}}</van-tabbar-item>
|
||
<van-tabbar-item name="taskData" icon="underway">{{$t('taskStatistics')}}</van-tabbar-item>
|
||
<van-tabbar-item name="home" icon="manager">{{$t('mine')}}</van-tabbar-item>
|
||
</van-tabbar>
|
||
</div>
|
||
</template>
|
||
|
||
<script>
|
||
import { getAction, postAction, deleteAction, downloadFile } from '@/api/manage'
|
||
import { Toast } from 'vant'
|
||
|
||
export default {
|
||
name: 'phoneTaskData',
|
||
data() {
|
||
return {
|
||
active: 'taskData',
|
||
activeTab: 'regulatoryCertification',
|
||
language: localStorage.getItem('language'),
|
||
pageNo: 0,
|
||
pageSize: 10,
|
||
loading: false,
|
||
finished: false,
|
||
dataSource: [],
|
||
publishingCount: 0,
|
||
preHomoCount: 0,
|
||
designCount: 0,
|
||
verifyCount: 0,
|
||
technologyEvaluationCount: 0,
|
||
opinionCollectionCount: 0
|
||
}
|
||
},
|
||
mounted() {
|
||
document.title = 'NIO GRP'
|
||
this.getProcessDataCount()
|
||
},
|
||
methods: {
|
||
onChange(value) {
|
||
if (value == 'toDoCenter') {
|
||
this.$router.push({
|
||
path: '/phoneToDoCenter'
|
||
})
|
||
} else if (value == 'search') {
|
||
this.$router.push({
|
||
path: '/phoneSearch'
|
||
})
|
||
} else if (value == 'home') {
|
||
this.$router.push({
|
||
path: '/phoneHome'
|
||
})
|
||
}
|
||
},
|
||
regulationListIssuanceClick() {
|
||
Toast(this.$t('pleaseProcessThePC'))
|
||
},
|
||
parameClick() {
|
||
Toast(this.$t('pleaseProcessThePC'))
|
||
},
|
||
processClick(num) {
|
||
this.$router.push({
|
||
path: '/phoneToDoCenter',
|
||
query: {
|
||
searchFlowType: num
|
||
}
|
||
})
|
||
},
|
||
getProcessDataCount() {
|
||
getAction('/phone/taskStatistics/getRegulatoryCertificationProcessDataCount', {}).then((res) => {
|
||
if (res.success) {
|
||
this.publishingCount = res.result.publishingCount || 0
|
||
this.preHomoCount = res.result.preHomoCount || 0
|
||
this.designCount = res.result.designCount || 0
|
||
this.verifyCount = res.result.verifyCount || 0
|
||
this.technologyEvaluationCount = res.result.technologyEvaluationCount || 0
|
||
this.opinionCollectionCount = res.result.opinionCollectionCount || 0
|
||
} else {
|
||
this.publishingCount = 0
|
||
this.preHomoCount = 0
|
||
this.designCount = 0
|
||
this.verifyCount = 0
|
||
this.technologyEvaluationCount = 0
|
||
this.opinionCollectionCount = 0
|
||
}
|
||
})
|
||
},
|
||
|
||
activeChange() {
|
||
if (this.activeTab == 'regulatoryCertification') {
|
||
this.getProcessDataCount()
|
||
} else if (this.activeTab == 'parametercollection') {
|
||
this.loading = true
|
||
this.dataSource = []
|
||
this.finished = false
|
||
this.pageNo = 1
|
||
this.getList()
|
||
}
|
||
},
|
||
onLoad() {
|
||
if (this.finished) {
|
||
this.dataSource = []
|
||
this.finished = false
|
||
} else {
|
||
this.pageNo++
|
||
this.getList()
|
||
}
|
||
},
|
||
getList() {
|
||
let query = {
|
||
pageNo: this.pageNo,
|
||
pageSize: this.pageSize
|
||
}
|
||
getAction('todoCenter/params/manifest/page', query).then((res) => {
|
||
if (res.success) {
|
||
if (res.result.records.length > 0 && this.pageNo > 1) {
|
||
this.dataSource = this.dataSource.concat(res.result.records)
|
||
} else if (res.result.records.length > 0 && this.pageNo == 1) {
|
||
this.dataSource = res.result.records
|
||
} else if (res.result.records.length == 0) {
|
||
this.finished = true
|
||
}
|
||
this.loading = false
|
||
} else {
|
||
this.dataSource = []
|
||
}
|
||
})
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style scoped>
|
||
::v-deep .van-tabbar-item--active {
|
||
color: #00B3BE;
|
||
}
|
||
|
||
.box {
|
||
padding-top: 1.32rem;
|
||
overflow: hidden;
|
||
}
|
||
|
||
.content {
|
||
position: fixed;
|
||
top: 0;
|
||
left: 0;
|
||
width: 100%;
|
||
z-index: 1000;
|
||
background: #fff;
|
||
padding-top: 0.16rem;
|
||
}
|
||
|
||
::v-deep .van-tabs__line {
|
||
background-color: #00B3BE;
|
||
}
|
||
|
||
::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.6rem;
|
||
}
|
||
|
||
::v-deep .van-tab--active {
|
||
font-size: 0.38rem;
|
||
font-family: PingFang SC-Medium, PingFang SC;
|
||
font-weight: 600;
|
||
color: #040B29;
|
||
}
|
||
|
||
.regulatory {
|
||
padding: 0.36rem 0.36rem 0 0.36rem;
|
||
background: #fff;
|
||
box-shadow: 0.1rem 0.1rem 0.16rem 0 rgba(54, 61, 84, 0.05);
|
||
border-radius: 0.2rem;
|
||
}
|
||
|
||
.parameter {
|
||
padding: 0.36rem;
|
||
background: #fff;
|
||
box-shadow: 0.1rem 0.1rem 0.16rem 0 rgba(54, 61, 84, 0.05);
|
||
border-radius: 0.2rem;
|
||
}
|
||
|
||
.regulatory-box {
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
justify-content: space-between;
|
||
}
|
||
|
||
::v-deep .van-tabs {
|
||
padding: 0 0.4rem;
|
||
}
|
||
|
||
.content-box {
|
||
width: 100%;
|
||
padding: 0.4rem;
|
||
background: #F7F7F8;
|
||
margin-bottom: 1.3rem;
|
||
}
|
||
|
||
.content-box-text {
|
||
font-size: 0.4rem;
|
||
font-family: PingFang SC-Regular, PingFang SC;
|
||
font-weight: 500;
|
||
color: #040B29;
|
||
margin-bottom: 0.4rem;
|
||
margin-top: 0.2rem;
|
||
}
|
||
|
||
.content-box-data {
|
||
background: #F7F8FA;
|
||
border-radius: 0.2rem;
|
||
padding: 0.42rem;
|
||
box-sizing: border-box;
|
||
width: calc(50% - 0.2rem);
|
||
display: inline-block;
|
||
margin-right: 0.4rem;
|
||
margin-bottom: 0.4rem;
|
||
}
|
||
|
||
.content-box-data:nth-child(even) {
|
||
margin-right: 0;
|
||
}
|
||
|
||
.content-box-data-text {
|
||
font-size: 0.36rem;
|
||
font-family: PingFang SC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #41475E;
|
||
word-break: break-all;
|
||
}
|
||
|
||
.content-box-data-num {
|
||
font-size: 0.44rem;
|
||
font-family: PingFang SC-Medium, PingFang SC;
|
||
font-weight: 600;
|
||
color: #01A0AC;
|
||
margin-top: 0.12rem;
|
||
}
|
||
|
||
.parame-box {
|
||
padding: 0.36rem;
|
||
box-sizing: border-box;
|
||
background: #F7F8FA;
|
||
border-radius: 0.2rem;
|
||
margin-bottom: 0.3rem;
|
||
}
|
||
|
||
.parame-box:last-child {
|
||
margin-bottom: 0;
|
||
}
|
||
|
||
.parame-box-top {
|
||
display: flex;
|
||
margin-bottom: 0.12rem;
|
||
}
|
||
|
||
.parame-box-top-text-left {
|
||
font-size: 0.36rem;
|
||
font-family: PingFang SC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #868A9A;
|
||
display: inline-block;
|
||
margin-right: 0.12rem;
|
||
flex: 1;
|
||
word-break: break-all;
|
||
}
|
||
|
||
.parame-box-top-text-left-one {
|
||
flex: 1.1;
|
||
}
|
||
|
||
.parame-box-top-text-right {
|
||
font-size: 0.36rem;
|
||
font-family: PingFang SC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #040B29;
|
||
flex: 3;
|
||
word-break: break-all;
|
||
}
|
||
|
||
.parame-box-top-text-right-one {
|
||
flex: 2;
|
||
}
|
||
|
||
.parame-box-bottom {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
margin-top: 0.18rem;
|
||
}
|
||
|
||
.parame-box-bottom-box {
|
||
width: calc(33% - 0.16rem);
|
||
background: #fff;
|
||
display: inline-block;
|
||
text-align: center;
|
||
padding: 0.26rem 0.16rem;
|
||
box-sizing: border-box;
|
||
border-radius: 0.2rem;
|
||
}
|
||
|
||
.parame-box-bottom-box-text-top {
|
||
font-size: 0.32rem;
|
||
font-family: PingFang SC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #595E72;
|
||
word-break: break-all;
|
||
}
|
||
|
||
.parame-box-bottom-box-text-num {
|
||
font-size: 0.44rem;
|
||
font-family: PingFang SC-Regular, PingFang SC;
|
||
font-weight: 600;
|
||
color: #01A0AC;
|
||
margin-top: 0.12rem;
|
||
}
|
||
|
||
::v-deep .van-tabs__nav--line.van-tabs__nav--complete {
|
||
padding-left: 0;
|
||
}
|
||
|
||
::v-deep .van-tabs__wrap--scrollable .van-tab {
|
||
padding: 0 0.1rem;
|
||
}
|
||
|
||
::v-deep .van-tabbar {
|
||
height: 74px !important;
|
||
align-items: baseline;
|
||
}
|
||
|
||
::v-deep .van-tabbar-item {
|
||
margin-top: 8px !important;
|
||
}
|
||
</style> |