Files
laws_weilai/jero-web/src/views/phoneView/taskData.vue
T
2023-07-05 11:54:00 +08:00

473 lines
13 KiB
Java
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<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>