206 lines
5.0 KiB
Vue
206 lines
5.0 KiB
Vue
<template>
|
|
<page-meta :page-font-size="fontValue+'px'" :root-font-size="fontValue+'px'"></page-meta>
|
|
<view class="top-view"></view>
|
|
<view class="center-box">
|
|
<view class="grid-box">
|
|
<view style="width: 100%;height: auto;display: flex;justify-content: space-between;align-items: center;">
|
|
<view style="font-size: 28rpx;font-weight: 600;">证件管理</view>
|
|
</view>
|
|
<view class="grid-container">
|
|
<view class="grid-item" @click="navigateTo('/pages/certificateManage/certificateInfo/index')">
|
|
<view class="icon-wrapper">
|
|
<image style="width: 120rpx;height: 120rpx;" src="/static/images/my/personalInfo.png"></image>
|
|
</view>
|
|
<text class="icon-text">证件信息</text>
|
|
</view>
|
|
<view class="grid-item" @click="navigateTo('/pages/certificateManage/certificateRecord/index')">
|
|
<view class="icon-wrapper">
|
|
<image style="width: 120rpx;height: 120rpx;" src="/static/images/my/notice.png"></image>
|
|
</view>
|
|
<text class="icon-text">证件记录</text>
|
|
</view>
|
|
<view class="grid-item" @click="navigateTo('/pages/certificateManage/certificateLifespan/index')">
|
|
<view class="icon-wrapper">
|
|
<image style="width: 120rpx;height: 120rpx;" src="/static/images/my/notice.png"></image>
|
|
</view>
|
|
<text class="icon-text">存证超期</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="grid-box">
|
|
<view style="width: 100%;height: auto;display: flex;justify-content: space-between;align-items: center;">
|
|
<view style="font-size: 28rpx;font-weight: 600;">证照借还管理</view>
|
|
</view>
|
|
<view class="grid-container">
|
|
<view class="grid-item" @click="navigateTo('/pages/certificateReturnManage/certificateTask/index')">
|
|
<view class="icon-wrapper">
|
|
<image style="width: 120rpx;height: 120rpx;" src="/static/images/my/personalInfo.png"></image>
|
|
</view>
|
|
<text class="icon-text">证件任务记录</text>
|
|
</view>
|
|
<view class="grid-item" @click="navigateTo('/pages/certificateReturnManage/certificateSave/index')">
|
|
<view class="icon-wrapper">
|
|
<image style="width: 120rpx;height: 120rpx;" src="/static/images/my/notice.png"></image>
|
|
</view>
|
|
<text class="icon-text">证件存证</text>
|
|
</view>
|
|
<view class="grid-item" @click="navigateTo('/pages/certificateReturnManage/certificateTake/index')">
|
|
<view class="icon-wrapper">
|
|
<image style="width: 120rpx;height: 120rpx;" src="/static/images/my/notice.png"></image>
|
|
</view>
|
|
<text class="icon-text">证件取证</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
data() {
|
|
return {
|
|
fontValue:uni.getStorageSync('fontSize') || 8,
|
|
}
|
|
},
|
|
onShow() {
|
|
this.getUserInfo()
|
|
},
|
|
onLoad() {
|
|
|
|
},
|
|
onUnload() {
|
|
},
|
|
methods: {
|
|
//获取用户信息
|
|
getUserInfo(){
|
|
// this.$store.dispatch('GetInfo').then(res => {
|
|
// uni.setStorageSync('userId', res.user.userId)
|
|
// uni.setStorageSync('userName', res.user.userName)
|
|
// uni.setStorageSync('phonenumber', res.user.phonenumber)
|
|
// uni.setStorageSync('mobile', res.user.phonenumber)
|
|
// })
|
|
},
|
|
navigateTo(url) {
|
|
uni.navigateTo({
|
|
url
|
|
})
|
|
}
|
|
},
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
/* #ifndef APP-NVUE */
|
|
page {
|
|
display: flex;
|
|
flex-direction: column;
|
|
box-sizing: border-box;
|
|
background-color: #fafcff;
|
|
height: 100%;
|
|
}
|
|
view {
|
|
font-size: 28rpx;
|
|
line-height: inherit;
|
|
}
|
|
/* #endif */
|
|
.top-view{
|
|
width: 100%;
|
|
height: 14vh;
|
|
background: linear-gradient( 180deg, #3888FF 0%, rgba(56,136,255,0) 100%);
|
|
position: relative;
|
|
}
|
|
|
|
.header {
|
|
padding: 40rpx;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
margin-bottom: 10rpx;
|
|
|
|
.header-text {
|
|
font-size: 38rpx;
|
|
font-weight: 600;
|
|
color: #fff;
|
|
}
|
|
}
|
|
|
|
.center-box{
|
|
// margin-top: 30rpx;
|
|
width: 100%;
|
|
height: 70vh;
|
|
background: rgba(255,255,255,0.3);
|
|
opacity: 0.8;
|
|
border-radius: 48rpx 48rpx 0rpx 0rpx;
|
|
border: 1px solid #fff;
|
|
margin-top: -10vh;
|
|
padding: 20rpx 20rpx;
|
|
padding-top: 60rpx;
|
|
z-index: 999999;
|
|
|
|
.tag-view{
|
|
width: 96%;
|
|
height: auto;
|
|
margin: 0 auto;
|
|
display: flex;
|
|
margin-bottom: 2vh;
|
|
}
|
|
.tag-view-item{
|
|
width: auto;
|
|
height: 100%;
|
|
color: #333333;
|
|
font-size: 32rpx;
|
|
font-weight: 600;
|
|
margin-right: 40rpx;
|
|
padding-bottom: 10rpx;
|
|
}
|
|
.active{
|
|
border-bottom: 2px solid #3888FF;
|
|
color: #000;
|
|
}
|
|
.main-box{
|
|
width: 96%;
|
|
height: auto;
|
|
margin: 0 auto;
|
|
}
|
|
.record-item{
|
|
width: 100%;
|
|
height: 120rpx;
|
|
display: flex;
|
|
align-items: center;
|
|
border-bottom: 1px solid #eee;
|
|
}
|
|
}
|
|
.grid-box{
|
|
width: 100%;
|
|
height: 15vh;
|
|
margin: 20rpx auto;
|
|
}
|
|
.grid-container {
|
|
display: grid;
|
|
grid-template-columns: repeat(3, 1fr);
|
|
gap: 20px;
|
|
|
|
.grid-item {
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
|
|
.icon-wrapper {
|
|
// width: 48px;
|
|
// height: 48px;
|
|
//border-radius: 24px;
|
|
//background: #f5f5f5;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
margin-bottom: 3px;
|
|
}
|
|
|
|
.icon-text {
|
|
font-size: 28rpx;
|
|
color: #0F274B;
|
|
}
|
|
}
|
|
}
|
|
</style>
|