WL/laws_weilai
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

添加手机端

Browse Source
This commit is contained in:
范强强
2023-05-31 11:47:04 +08:00
parent 885a612709
commit e1aff1fbb6
4 changed files with 386 additions and 46 deletions
Download Patch File Download Diff File Expand all files Collapse all files
jero-web/src/views/phoneView/home.vue
+158 -1
View File
@@ -1,5 +1,53 @@
<template>
<div class="box">
<div class="box-header">
<div class="img-header">
<img src="~@/assets/logoOne.png" alt="">
</div>
</div>
<div class="name-header">
Yingxi.Sun
</div>
<div class="eamil-header">
XXXXXXXXXXXX@nio.cn
</div>
<div class="content-box-top">
<img src="~@/assets/icon_eye.png" class="content-box-img" alt="">
<span class="content-box-text">
最近浏览
</span>
<van-icon class="icon" name="arrow"/>
</div>
<div class="content-box">
<img src="~@/assets/icon_star.png" class="content-box-img" alt="">
<span class="content-box-text">
我的收藏
</span>
<van-icon class="icon" name="arrow"/>
</div>
<div class="content-box">
<img src="~@/assets/icon_link.png" class="content-box-img" alt="">
<span class="content-box-text">
我的订阅
</span>
<van-icon class="icon" name="arrow"/>
</div>
<div class="content-box">
<img src="~@/assets/icon_assign.png" class="content-box-img" alt="">
<span class="content-box-text">
退出登录
</span>
<van-icon class="icon" name="arrow"/>
</div>
<div class="content-box">
<img src="~@/assets/yuyan.png" class="content-box-img" alt="">
<span class="content-box-text-one">
语言切换
</span>
<span class="lang">英文</span>
<van-switch v-model="checked"/>
</div>
<van-tabbar v-model="active" @change="onChange">
<van-tabbar-item name="search" icon="search">搜索</van-tabbar-item>
<van-tabbar-item name="toDoCenter" icon="bell">待办中心</van-tabbar-item>
@@ -14,7 +62,8 @@
name: 'phoneHome',
data() {
return {
active: 'home'
active: 'home',
checked: false
}
},
methods: {
@@ -41,7 +90,115 @@
::v-deep .van-tabbar-item--active {
color: #00B3BE;
}
.box {
padding: 0.4rem;
}
.box-header {
padding-top: 0.8rem;
text-align: center;
display: flex;
justify-content: center;
}
.img-header {
width: 3rem;
height: 3rem;
border-radius: 50%;
background: #D9D9D9;
line-height: 3rem;
text-align: center;
}
.name-header {
font-size: 0.4rem;
font-family: PingFang SC-Medium, PingFang SC;
font-weight: 600;
color: #040B29;
text-align: center;
margin-top: 0.5rem;
}
.eamil-header {
font-size: 0.36rem;
font-family: PingFang SC-Medium, PingFang SC;
font-weight: 600;
color: #595E72;
text-align: center;
margin-top: 0.2rem;
}
.content-box-top {
border-top: 1px solid #E6E7EC;
margin-top: 0.8rem;
height: 1.6rem;
border-bottom: 1px solid #E6E7EC;
display: flex;
align-items: center;
}
.content-box {
height: 1.6rem;
border-bottom: 1px solid #E6E7EC;
display: flex;
align-items: center;
}
.content-box-img {
width: 0.52rem;
}
.content-box-text {
font-size: 0.4rem;
font-family: PingFang SC-Regular, PingFang SC;
font-weight: 600;
color: #040B29;
margin-left: 0.2rem;
width: calc(100% - 0.9rem);
}
.content-box-text-one {
font-size: 0.4rem;
font-family: PingFang SC-Regular, PingFang SC;
font-weight: 600;
color: #040B29;
margin-left: 0.2rem;
width: calc(100% - 1.8rem);
}
.icon {
font-size: 0.46rem;
font-weight: 500;
color: #040B29;
}
::v-deep .van-switch {
background-color: #BBBDC7;
height: 0.6rem;
width: 1.4rem;
}
::v-deep .van-switch__node {
width: 0.6rem;
height: 0.6rem;
}
::v-deep .van-switch--on {
background-color: #00B3BE;
}
::v-deep .van-switch--on .van-switch__node {
transform: translateX(0.56rem)
}
.lang {
font-size: 0.36rem;
font-family: PingFang SC-Regular, PingFang SC;
font-weight: 400;
color: #595E72;
display: inline-block;
width: 1rem;
margin-right: 0.2rem;
}
</style>
jero-web/src/views/phoneView/search.vue
+1 -1
View File
@@ -181,7 +181,7 @@
}
.text-left-button {
font-size: 0.26rem;
font-size: 0.32rem;
font-family: Blue Sky Noto-Light, Blue Sky Noto;
font-weight: 300;
color: #595E72;
jero-web/src/views/phoneView/taskData.vue
+213 -43
View File
@@ -11,52 +11,141 @@
<div class="content-box-text">
法规认证流程数据
</div>
<div class="content-box-data">
<div class="content-box-data-text">
法规清单发布
<div class="regulatory-box">
<div class="content-box-data">
<div class="content-box-data-text">
法规清单发布dasfkj hdskjf hgkjdhfgdfkjghdfkjgdfhgkdfjghdfkjgdfhgkjdfdhfk
</div>
<div class="content-box-data-num">
24
</div>
</div>
<div class="content-box-data-num">
24
<div class="content-box-data">
<div class="content-box-data-text">
法规清单发布
</div>
<div class="content-box-data-num">
24
</div>
</div>
<div class="content-box-data">
<div class="content-box-data-text">
法规清单发布
</div>
<div class="content-box-data-num">
24
</div>
</div>
<div class="content-box-data">
<div class="content-box-data-text">
法规清单发布
</div>
<div class="content-box-data-num">
24
</div>
</div>
<div class="content-box-data">
<div class="content-box-data-text">
法规清单发布
</div>
<div class="content-box-data-num">
24
</div>
</div>
<div class="content-box-data">
<div class="content-box-data-text">
法规清单发布
</div>
<div class="content-box-data-num">
24
</div>
</div>
</div>
<div class="content-box-data">
<div class="content-box-data-text">
法规清单发布
</div>
<div class="parameter" v-else-if="activeTab == 'parametercollection'">
<div class="content-box-text">
认证参数收集数据
</div>
<div class="parame-box">
<div class="parame-box-top">
<span class="parame-box-top-text-left">相关项目：</span>
<span class="parame-box-top-text-right">Orion-G1.1-英国-00</span>
</div>
<div class="content-box-data-num">
24
<div class="parame-box-top">
<span class="parame-box-top-text-left">清单标题：</span>
<span class="parame-box-top-text-right">认证参数收集模板</span>
</div>
<div class="parame-box-top">
<span class="parame-box-top-text-left">版本号：</span>
<span class="parame-box-top-text-right">03</span>
</div>
<div class="parame-box-bottom">
<div class="parame-box-bottom-box">
<div class="parame-box-bottom-box-text-top">
待填写
</div>
<div class="parame-box-bottom-box-text-num">
15
</div>
</div>
<div class="parame-box-bottom-box">
<div class="parame-box-bottom-box-text-top">
待分配填写人
</div>
<div class="parame-box-bottom-box-text-num">
15
</div>
</div>
<div class="parame-box-bottom-box">
<div class="parame-box-bottom-box-text-top">
参数待发起
</div>
<div class="parame-box-bottom-box-text-num">
15
</div>
</div>
</div>
</div>
<div class="content-box-data">
<div class="content-box-data-text">
法规清单发布
<div class="parame-box">
<div class="parame-box-top">
<span class="parame-box-top-text-left">相关项目：</span>
<span class="parame-box-top-text-right">Orion-G1.1-英国-00</span>
</div>
<div class="content-box-data-num">
24
<div class="parame-box-top">
<span class="parame-box-top-text-left">清单标题：</span>
<span class="parame-box-top-text-right">认证参数收集模板</span>
</div>
</div>
<div class="content-box-data">
<div class="content-box-data-text">
法规清单发布
<div class="parame-box-top">
<span class="parame-box-top-text-left">版本号：</span>
<span class="parame-box-top-text-right">03</span>
</div>
<div class="content-box-data-num">
24
</div>
</div>
<div class="content-box-data">
<div class="content-box-data-text">
法规清单发布
</div>
<div class="content-box-data-num">
24
</div>
</div>
<div class="content-box-data">
<div class="content-box-data-text">
法规清单发布
</div>
<div class="content-box-data-num">
24
<div class="parame-box-bottom">
<div class="parame-box-bottom-box">
<div class="parame-box-bottom-box-text-top">
待填写
</div>
<div class="parame-box-bottom-box-text-num">
15
</div>
</div>
<div class="parame-box-bottom-box">
<div class="parame-box-bottom-box-text-top">
待分配填写人
</div>
<div class="parame-box-bottom-box-text-num">
15
</div>
</div>
<div class="parame-box-bottom-box">
<div class="parame-box-bottom-box-text-top">
参数待发起
</div>
<div class="parame-box-bottom-box-text-num">
15
</div>
</div>
</div>
</div>
</div>
@@ -106,7 +195,7 @@
}
.content {
margin-top: 0.18rem;
padding-top: 0.18rem;
position: relative;
}
@@ -135,7 +224,19 @@
background: #fff;
box-shadow: 0.1rem 0.1rem 0.16rem 0 rgba(54, 61, 84, 0.05);
border-radius: 0.2rem;
overflow: hidden;
}
.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 {
@@ -151,7 +252,7 @@
.content-box-text {
font-size: 0.4rem;
font-family: PingFang SC-Regular, PingFang SC;
font-weight: 400;
font-weight: 500;
color: #040B29;
margin-bottom: 0.4rem;
margin-top: 0.2rem;
@@ -168,7 +269,7 @@
margin-bottom: 0.4rem;
}
.content-box-data:nth-child(odd) {
.content-box-data:nth-child(even) {
margin-right: 0;
}
@@ -177,12 +278,81 @@
font-family: PingFang SC-Regular, PingFang SC;
font-weight: 400;
color: #41475E;
word-break: break-all;
}
.content-box-data-num {
font-size: 0.42rem;
font-size: 0.44rem;
font-family: PingFang SC-Medium, PingFang SC;
font-weight: 500;
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-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-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;
}
</style>
jero-web/src/views/phoneView/toDoCenter.vue
+14 -1
View File
@@ -30,6 +30,10 @@
<span class="content-box-left">项目</span>
<span class="content-box-text">Aries-G1.1-中国台湾-00</span>
</div>
<div class="content-box-type">
<span class="content-box-left">节点</span>
<span class="content-box-text">符合性审查</span>
</div>
<div class="content-box-right">
符合性审查
</div>
@@ -46,6 +50,10 @@
<span class="content-box-left">项目</span>
<span class="content-box-text">Aries-G1.1-中国台湾-00</span>
</div>
<div class="content-box-type">
<span class="content-box-left">节点</span>
<span class="content-box-text">符合性审查</span>
</div>
<div class="content-box-right">
符合性审查
</div>
@@ -62,6 +70,10 @@
<span class="content-box-left">项目</span>
<span class="content-box-text">Aries-G1.1-中国台湾-00</span>
</div>
<div class="content-box-type">
<span class="content-box-left">节点</span>
<span class="content-box-text">符合性审查</span>
</div>
<div class="content-box-right">
符合性审查
</div>
@@ -227,11 +239,12 @@
}
.content-box-type {
font-size: 0.32rem;
font-size: 0.34rem;
font-family: PingFang SC-Medium, PingFang SC;
font-weight: 500;
color: #41475E;
display: flex;
margin-top: 0.08rem;
}
.content-box-left {