|
@@ -0,0 +1,966 @@
|
|
|
+<template>
|
|
|
+ <view :class="tabbarName==='home'?'container2':tabbarName==='my'?'container3':'container'">
|
|
|
+ <uni-navbar :title="getTile()" :placeholder="true" bgColor="rgba(0,0,0,0)" leftIconSize="0">
|
|
|
+ </uni-navbar>
|
|
|
+ <view class="box homeHeight" v-if="tabbarName==='home'">
|
|
|
+ <view class="contentBox">
|
|
|
+ <view class="headImg commonMt"></view>
|
|
|
+ <view class="userName titleStyle">账号:{{userName}}</view>
|
|
|
+ <view class="headName titleStyle">{{nickName}}</view>
|
|
|
+ <view class="tabs commonBj">
|
|
|
+ <view class="tabs-top">
|
|
|
+ <view class="tabs-top-one" @click="goTo('/pages/cityCar/index')">
|
|
|
+ <view class="img-box">
|
|
|
+ <image class="one-img" src="../../static/images/home/index1.png" mode="widthFix">
|
|
|
+ </image>
|
|
|
+ </view>
|
|
|
+ <text>车辆审批</text>
|
|
|
+ </view>
|
|
|
+ <view class="tabs-top-one" @click="goTo('/pages/cityPath/index')">
|
|
|
+ <view class="img-box">
|
|
|
+ <image class="one-img" src="../../static/images/city/index2.png" mode="widthFix">
|
|
|
+ </image>
|
|
|
+ </view>
|
|
|
+ <text>路线审批</text>
|
|
|
+ </view>
|
|
|
+ <view class="tabs-top-one" @click="goTo('/pages/cityTransport/index')">
|
|
|
+ <view class="img-box">
|
|
|
+ <image class="one-img" src="../../static/images/home/index4.png" mode="widthFix">
|
|
|
+ </image>
|
|
|
+ </view>
|
|
|
+ <text>运输审批</text>
|
|
|
+ </view>
|
|
|
+ <view class="tabs-top-one" @click="goTo('/pages/cityRecord/index')">
|
|
|
+ <view class="img-box">
|
|
|
+ <image class="one-img" src="../../static/images/home/index5.png" mode="widthFix">
|
|
|
+ </image>
|
|
|
+ </view>
|
|
|
+ <text>记录审批</text>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="safeInfo">
|
|
|
+ <view class="flexBox">
|
|
|
+ <!-- <view class="leftLine"></view> -->
|
|
|
+ <image class="imgStyle" src="../../static/images/home/rigthPath.png" mode="widthFix">
|
|
|
+ </image>
|
|
|
+ </view>
|
|
|
+ <view class="flexBox">安全信息 </view>
|
|
|
+ <view class="flexBox">
|
|
|
+ <!-- <view class="rightLine"></view> -->
|
|
|
+ <image class="imgStyle" src="../../static/images/home/leftPath.png" mode="widthFix">
|
|
|
+ </image>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="safeBox">
|
|
|
+ <view class="safe-content commonBj" v-for="(item,index) in safetyData" :key="index">
|
|
|
+ <view class="safe-content-one">
|
|
|
+ <view class="colorbox">
|
|
|
+ </view>
|
|
|
+ <view class="text-content">
|
|
|
+ <text>{{item.title}}</text>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="safe-content-one">
|
|
|
+ <view class="colorbox1">
|
|
|
+ </view>
|
|
|
+ <view class="text-content1">
|
|
|
+ <text>{{item.conten}}</text>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="safe-content-bottom">
|
|
|
+ <view class="bottom-left">
|
|
|
+ <image class="timer" src="../../static/images/home/time.png" mode="aspectFill"></image>
|
|
|
+ <text>{{item.date}}</text>
|
|
|
+ <text>{{item.time}}</text>
|
|
|
+ </view>
|
|
|
+ <view class="bottom-right">
|
|
|
+ <text>{{item.dept}}</text>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view v-if="tabbarName==='firm'" class="box" style="overflow: hidden;">
|
|
|
+ <!-- 企业信息 -->
|
|
|
+ <view class="box2 firmHeight">
|
|
|
+ <view class="commonMb commonMt">
|
|
|
+ <view class="car-content" @tap="gotoPersonInfo(item.id)" v-for="item in companyList" :key="item.id">
|
|
|
+ <view class="car-info commonBj">
|
|
|
+ <view class="person-top">
|
|
|
+ <image style="width: 60rpx;height: 60rpx;" src="../../static/images/city/gongsi.png"
|
|
|
+ mode="widthFix"></image>
|
|
|
+ <text>{{ item.companyName }}</text>
|
|
|
+ </view>
|
|
|
+ <view class="person-bottom" style="margin-top: 20rpx;">
|
|
|
+ <view class="carinfo-bottom listText">
|
|
|
+ <image style="width: 22rpx;height: 22rpx;"
|
|
|
+ src="../../static/images/record/duoren.png" mode="widthFix"></image>
|
|
|
+ <text>企业法人:{{item.legalPerson}}</text>
|
|
|
+ </view>
|
|
|
+ <view class="carinfo-bottom listText">
|
|
|
+ <image style="width: 22rpx;height: 22rpx;" src="../../static/images/user/phone.png"
|
|
|
+ mode="widthFix"></image>
|
|
|
+ <text>电 话:{{item.phoneNumber}}</text>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view v-if="tabbarName==='my'" class="box homeHeight width100">
|
|
|
+ <view class="commonMt">
|
|
|
+ <view class="avstarImgBox">
|
|
|
+ <view class="headImg2">
|
|
|
+ <!-- <image style="width: 191rpx;" src="../../static/images/home/avstar.png" mode="widthFix"></image> -->
|
|
|
+ </view>
|
|
|
+ <view class="username">
|
|
|
+ <p>账号:{{userName}}</p>
|
|
|
+ <p>{{nickName}}</p>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="avstarInfo ">
|
|
|
+ <view class="info-box" @tap="goTo('/pages/cityEditInfo/index')">
|
|
|
+ <image style="width: 78rpx;" src="../../static/images/home/bianjiwenjian.png" mode="widthFix">
|
|
|
+ </image>
|
|
|
+ <text class="mt28">修改信息</text>
|
|
|
+ </view>
|
|
|
+ <view class="info-box" @tap="versionList">
|
|
|
+ <image style="width: 78rpx;" src="../../static/images/home/banbengengxin.png" mode="widthFix">
|
|
|
+ </image>
|
|
|
+ <text class="mt28">版本更新</text>
|
|
|
+ </view>
|
|
|
+ <view class="info-box mt30" @tap="goTo('/pages/editPassword/index')">
|
|
|
+ <image style="width: 78rpx;" src="../../static/images/home/klm.png" mode="widthFix">
|
|
|
+ </image>
|
|
|
+ <text class="mt28">修改密码</text>
|
|
|
+ </view>
|
|
|
+ <view class="info-box mt30">
|
|
|
+ <image style="width: 78rpx;" src="../../static/images/home/tuichu.png" mode="widthFix">
|
|
|
+ </image>
|
|
|
+ <text class="mt28">退出</text>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <homeHint :show="show"></homeHint>
|
|
|
+ <u-tabbar :value="tabbarName" @change="changeTabbarName" :fixed="true" :border="false" :placeholder="true"
|
|
|
+ activeColor="#F59A02" :safeAreaInsetBottom="true">
|
|
|
+ <u-tabbar-item text="首页" name="home">
|
|
|
+ <image class="u-page__item__slot-icon" slot="active-icon" src="../../static/images/nav_02.png"></image>
|
|
|
+ <image class="u-page__item__slot-icon" slot="inactive-icon" src="../../static/images/nav_01.png">
|
|
|
+ </image>
|
|
|
+ </u-tabbar-item>
|
|
|
+ <u-tabbar-item text="企业信息" name="firm">
|
|
|
+ <image class="u-page__item__slot-icon" slot="active-icon" src="../../static/images/nav_04.png"></image>
|
|
|
+ <image class="u-page__item__slot-icon" slot="inactive-icon" src="../../static/images/nav_03.png">
|
|
|
+ </image>
|
|
|
+ </u-tabbar-item>
|
|
|
+ <u-tabbar-item text="我的" name="my">
|
|
|
+ <image class="u-page__item__slot-icon" slot="active-icon" src="../../static/images/nav_06.png"></image>
|
|
|
+ <image class="u-page__item__slot-icon" slot="inactive-icon" src="../../static/images/nav_05.png">
|
|
|
+ </image>
|
|
|
+ </u-tabbar-item>
|
|
|
+ </u-tabbar>
|
|
|
+ <!-- 版本更新弹出框 -->
|
|
|
+ <u-popup :show="isUpdateShow" mode="center">
|
|
|
+ <view class="update-box">
|
|
|
+ <view class="update-text" v-if="bnList.url">
|
|
|
+ <view class="title-text">
|
|
|
+ 版本更新
|
|
|
+ </view>
|
|
|
+ <view class="middle-text">
|
|
|
+ 发现新版本{{bnList.version}},升级后体验更顺畅
|
|
|
+ </view>
|
|
|
+ <view class="middle-text">
|
|
|
+ 当前版本{{bnList.oldVersion}}
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="update-text" v-else>
|
|
|
+ <view class="title-text">
|
|
|
+ 版本更新
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <view class="middle-text">
|
|
|
+ 当前版本{{bnList.version}},已经是最新版本了
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="update-button" v-if="bnList.url">
|
|
|
+ <u-button shape="circle" color="linear-gradient(to top, #F59A02, #FFD334 )"
|
|
|
+ @tap="getKpi(bnList.url)" class="add-button width220 boderRadius buttonLang width220">马上更新
|
|
|
+ </u-button>
|
|
|
+ <u-button @tap="isUpdateShow = false"
|
|
|
+ class=" add-button boderRadius backWhtie colorYellow width220">暂不更新</u-button>
|
|
|
+ </view>
|
|
|
+ <view class="update-close" @tap="isUpdateShow = false">
|
|
|
+ <u-icon size="66" color="#ffffff" name="close-circle"></u-icon>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </u-popup>
|
|
|
+ </view>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+ import homeHint from "../../components/homeHint.vue"
|
|
|
+ import {
|
|
|
+ companyInfoList
|
|
|
+ } from "@/api/city/company.js"
|
|
|
+ import {
|
|
|
+ versionList
|
|
|
+ } from "@/api/company/my.js"
|
|
|
+ export default {
|
|
|
+ components: {
|
|
|
+ homeHint
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ nickName: this.$store.state.user.nickName,
|
|
|
+ userName: this.$store.state.user.userName,
|
|
|
+ weburl: 'http://jl.122.gov.cn/',
|
|
|
+ // 版本更新开关
|
|
|
+ isUpdateShow: false,
|
|
|
+ // 车辆信息或者人员信息
|
|
|
+ isCarInfo: true,
|
|
|
+ companyList: [],
|
|
|
+ safetyData: [{
|
|
|
+ title: '安全信息安全信息安全信息安全信息安全信息',
|
|
|
+ conten: '占位文字占位文字占位文字占位文字占位文字占位文 占位文字占位文字占位文字占位文字占位文字',
|
|
|
+ date: '2022-08-19',
|
|
|
+ time: '14:35:30',
|
|
|
+ dept: '环保部门',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '安全信息安全信息安全信息安全信息安全信息',
|
|
|
+ conten: '占位文字占位文字占位文字占位文字占位文字占位文 占位文字占位文字占位文字占位文字占位文字',
|
|
|
+ date: '2022-08-19',
|
|
|
+ time: '14:35:30',
|
|
|
+ dept: '环保部门',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '安全信息安全信息安全信息安全信息安全信息',
|
|
|
+ conten: '占位文字占位文字占位文字占位文字占位文字占位文 占位文字占位文字占位文字占位文字占位文字',
|
|
|
+ date: '2022-08-19',
|
|
|
+ time: '14:35:30',
|
|
|
+ dept: '环保部门',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '安全信息安全信息安全信息安全信息安全信息',
|
|
|
+ conten: '占位文字占位文字占位文字占位文字占位文字占位文 占位文字占位文字占位文字占位文字占位文字',
|
|
|
+ date: '2022-08-19',
|
|
|
+ time: '14:35:30',
|
|
|
+ dept: '环保部门',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '安全信息安全信息安全信息安全信息安全信息',
|
|
|
+ conten: '占位文字占位文字占位文字占位文字占位文字占位文 占位文字占位文字占位文字占位文字占位文字',
|
|
|
+ date: '2022-08-19',
|
|
|
+ time: '14:35:30',
|
|
|
+ dept: '环保部门',
|
|
|
+ },
|
|
|
+
|
|
|
+ ],
|
|
|
+ show: false,
|
|
|
+ tabbarName: "home",
|
|
|
+ mineForm: {
|
|
|
+ username: 'ltjz0102',
|
|
|
+ qiyeName: '蓝天建筑'
|
|
|
+ },
|
|
|
+ // 版本更新开关
|
|
|
+ isUpdateShow: false,
|
|
|
+ bnList: {
|
|
|
+ version: "",
|
|
|
+ oldVersion: "",
|
|
|
+ url: ','
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ onLoad() {},
|
|
|
+ onShow() {
|
|
|
+ // this.show = true;
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ changeTabbarName(name) {
|
|
|
+ this.tabbarName = name
|
|
|
+ if (name === 'firm') {
|
|
|
+ console.log(111);
|
|
|
+ this.getCompanyList()
|
|
|
+ }
|
|
|
+ },
|
|
|
+ getCompanyList() {
|
|
|
+ companyInfoList().then(res => {
|
|
|
+ console.log("企业列表", res);
|
|
|
+ this.companyList = res.rows
|
|
|
+ })
|
|
|
+ },
|
|
|
+ // getUserState() {
|
|
|
+ // getUserState().then(res => {
|
|
|
+ // this.personList = res.rows
|
|
|
+ // })
|
|
|
+ // },
|
|
|
+ getKpi(url) {
|
|
|
+ this.isUpdateShow = false
|
|
|
+ // #ifdef H5
|
|
|
+ window.location.href = url; //问号后面传参
|
|
|
+ // #endif
|
|
|
+
|
|
|
+ // #ifdef APP-PLUS
|
|
|
+ plus.runtime.openURL(url);
|
|
|
+ // #endif
|
|
|
+ },
|
|
|
+ versionList() {
|
|
|
+ versionList().then(res => {
|
|
|
+ console.log(res, 'res')
|
|
|
+ //#ifdef APP-PLUS
|
|
|
+ console.log('版本', plus.runtime.versionCode)
|
|
|
+ // this.version=plus.runtime.versionCode
|
|
|
+ // 获取本地应用资源版本号
|
|
|
+ plus.runtime.getProperty(plus.runtime.appid, (info) => {
|
|
|
+ console.log(JSON.stringify(info));
|
|
|
+ this.bnList.oldVersion = info.version;
|
|
|
+ this.bnList.version = res.rows[0].versionNo;
|
|
|
+ if (res.rows[0].versionNo == info.version) {
|
|
|
+ this.bnList.url = ''
|
|
|
+ } else {
|
|
|
+ this.bnList.url = res.rows[0].url;
|
|
|
+ }
|
|
|
+ this.isUpdateShow = true;
|
|
|
+ // this.versionCode = info.versionCode ;
|
|
|
+ })
|
|
|
+ //#endif
|
|
|
+
|
|
|
+ // console.log(res.rows[0].versionNo, 'res');
|
|
|
+ })
|
|
|
+ },
|
|
|
+ goAddres() {
|
|
|
+ // #ifdef H5
|
|
|
+ window.location.href = this.weburl; //问号后面传参
|
|
|
+ // #endif
|
|
|
+
|
|
|
+ // #ifdef APP-PLUS
|
|
|
+ plus.runtime.openURL(this.weburl);
|
|
|
+ // #endif
|
|
|
+
|
|
|
+ },
|
|
|
+ getTile() {
|
|
|
+ switch (this.tabbarName) {
|
|
|
+ case 'firm':
|
|
|
+ return '企业信息';
|
|
|
+ break;
|
|
|
+ case 'my':
|
|
|
+ return '个人中心';
|
|
|
+ break;
|
|
|
+ default:
|
|
|
+ return ''
|
|
|
+ }
|
|
|
+ },
|
|
|
+ goTo(path) {
|
|
|
+ console.log('出发了')
|
|
|
+
|
|
|
+ this.$tab.navigateTo(path)
|
|
|
+ },
|
|
|
+ gotoPersonInfo(id) {
|
|
|
+ this.$tab.navigateTo(`/pages/cityCompanyDetail/index?id=${id}`)
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="scss" scoped>
|
|
|
+ // 屏幕高度-导航栏高度-按钮的高度上边距-按钮的高度-按钮的高度下边距-底部导航栏高度
|
|
|
+ $Height: calc(100vh - 44px - 22px - 66rpx - 25rpx - 50px + 112rpx);
|
|
|
+
|
|
|
+ /deep/.u-popup__content {
|
|
|
+ border-radius: 18rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ // 个人中心
|
|
|
+ .avstarImgBox {
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ flex-direction: column;
|
|
|
+ align-items: center;
|
|
|
+
|
|
|
+ .username {
|
|
|
+ text-align: center;
|
|
|
+ font-size: 28rpx;
|
|
|
+ font-weight: bold;
|
|
|
+ color: #FFFFFF;
|
|
|
+ margin-top: 33rpx;
|
|
|
+
|
|
|
+ p {
|
|
|
+ &:nth-child(2) {
|
|
|
+ margin-top: 18rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .avstarInfo {
|
|
|
+ display: flex;
|
|
|
+ flex-wrap: wrap;
|
|
|
+ justify-content: space-between;
|
|
|
+ border-radius: 17% 17% 0 0;
|
|
|
+ background: linear-gradient(to bottom, rgba(2, 92, 204, 0.9) 0%, rgba(40, 127, 222, 0.3) 100%);
|
|
|
+ padding: 80rpx 36rpx 0rpx;
|
|
|
+ // box-shadow: 0px 0px 64px 0px rgba(0, 76, 170, 0.52);
|
|
|
+ margin-top: 60rpx;
|
|
|
+
|
|
|
+ .info-box {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ width: 322rpx;
|
|
|
+ height: 225rpx;
|
|
|
+ background: rgba(255, 255, 255, 0.5);
|
|
|
+ border: 2rpx solid #77A8FF;
|
|
|
+ // box-shadow: 0px 0px 24rpx 6rpx rgba(109, 160, 251, 0.6);
|
|
|
+ border-radius: 28rpx;
|
|
|
+ font-size: 28rpx;
|
|
|
+ font-weight: bold;
|
|
|
+ color: #FFFFFF;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .mt30 {
|
|
|
+ margin-top: 30rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .width100 {
|
|
|
+ width: 100%;
|
|
|
+ }
|
|
|
+
|
|
|
+ .width220 {
|
|
|
+ width: 220rpx;
|
|
|
+ height: 68rpx !important;
|
|
|
+ }
|
|
|
+
|
|
|
+ .boderRadius {
|
|
|
+ border-radius: 68rpx !important;
|
|
|
+ }
|
|
|
+
|
|
|
+ .colorYellow {
|
|
|
+ color: rgba(245, 154, 2, 1) !important;
|
|
|
+ }
|
|
|
+
|
|
|
+ .backWhtie {
|
|
|
+ background-color: #ffffff !important;
|
|
|
+ border: 2rpx solid #F69C04;
|
|
|
+ font-weight: bold;
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ .update-box {
|
|
|
+ width: 543rpx;
|
|
|
+ height: 630rpx;
|
|
|
+ background: url(../../static/images/home/update.png);
|
|
|
+ background-size: 100%;
|
|
|
+ position: relative;
|
|
|
+
|
|
|
+ .update-text {
|
|
|
+ text-align: center;
|
|
|
+ margin-top: 330rpx;
|
|
|
+
|
|
|
+ .title-text {
|
|
|
+ font-size: 36rpx;
|
|
|
+ color: #333333;
|
|
|
+ font-weight: bold;
|
|
|
+ }
|
|
|
+
|
|
|
+ .middle-text {
|
|
|
+ font-size: 26rpx;
|
|
|
+ color: rgba(153, 153, 153, 1);
|
|
|
+ font-weight: 400;
|
|
|
+ margin-top: 16rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+ .update-button {
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+
|
|
|
+ /deep/ uni-button {
|
|
|
+ margin-top: 47rpx;
|
|
|
+
|
|
|
+ &:nth-child(1) {
|
|
|
+ margin-right: 13rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ &:nth-child(2) {
|
|
|
+ margin-left: 13rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+ .update-close {
|
|
|
+ position: absolute;
|
|
|
+ text-align: center;
|
|
|
+ left: 50%;
|
|
|
+ transform: translate(-50%);
|
|
|
+ bottom: -80rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .mt28 {
|
|
|
+ margin-top: 28rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ // 企业信息
|
|
|
+ .firmHeight {
|
|
|
+ height: $Height;
|
|
|
+ }
|
|
|
+
|
|
|
+ .firmBox {
|
|
|
+ padding: 0rpx 36rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .person-bottom {
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ align-items: center;
|
|
|
+ }
|
|
|
+
|
|
|
+ .person-top {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+
|
|
|
+ uni-text {
|
|
|
+ font-size: 28rpx;
|
|
|
+ font-weight: bold;
|
|
|
+ color: #333333;
|
|
|
+ margin-left: 25rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .car-content {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ margin-top: 20rpx;
|
|
|
+ margin-bottom: 30rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ .car-info {
|
|
|
+ padding: 18rpx 30rpx;
|
|
|
+ box-sizing: border-box;
|
|
|
+ // margin-top: 24rpx;
|
|
|
+
|
|
|
+ .carInfo-top {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: space-between;
|
|
|
+ // margin-bottom: 17rpx;
|
|
|
+
|
|
|
+ .top-left {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+
|
|
|
+ uni-text {
|
|
|
+ font-size: 28rpx;
|
|
|
+ font-weight: bold;
|
|
|
+ color: #333333;
|
|
|
+ margin-left: 25rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .top-right {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+
|
|
|
+ uni-text {
|
|
|
+ // font-size: 24rpx;
|
|
|
+ // font-weight: 400;
|
|
|
+ // color: #485B93;
|
|
|
+ margin-left: 19rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .car-info:nth-child(1) {
|
|
|
+ margin-top: 0rpx !important;
|
|
|
+ }
|
|
|
+
|
|
|
+ .carinfo-bottom::before {
|
|
|
+ content: '';
|
|
|
+ display: table;
|
|
|
+ }
|
|
|
+
|
|
|
+ .carinfo-bottom {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ margin-bottom: 14rpx;
|
|
|
+
|
|
|
+ uni-text {
|
|
|
+ margin-left: 19rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ .container2 {
|
|
|
+ background-image: url(@/static/images/home/bg.png);
|
|
|
+ background-size: 100% 100%;
|
|
|
+ height: 100vh;
|
|
|
+ overflow: hidden;
|
|
|
+ }
|
|
|
+
|
|
|
+ .container3 {
|
|
|
+ background-image: url(@/static/images/loginBj.png);
|
|
|
+ background-size: 100% 100%;
|
|
|
+ height: 100vh;
|
|
|
+ overflow: hidden;
|
|
|
+ }
|
|
|
+
|
|
|
+ .contentBox {
|
|
|
+ // width: 90%;
|
|
|
+
|
|
|
+ // display: flex;
|
|
|
+ // flex-direction: column;
|
|
|
+ height: 100%;
|
|
|
+ overflow: hidden;
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ .title {
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ margin: 30rpx 0;
|
|
|
+ color: #FFFFFF;
|
|
|
+ }
|
|
|
+
|
|
|
+ .search {
|
|
|
+ // margin-top: 66px;
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ width: 100%;
|
|
|
+
|
|
|
+ color: #ffffff;
|
|
|
+ font-size: 25rpx;
|
|
|
+ height: 66rpx;
|
|
|
+ line-height: 66rpx;
|
|
|
+ background: rgba(255, 255, 255, 0.64);
|
|
|
+ border: 2rpx solid #77A8FF;
|
|
|
+ box-shadow: 0rpx 0rpx 24rpx 6rpx rgba(109, 160, 251, 0.6);
|
|
|
+ /* opacity: 0.8; */
|
|
|
+ border-radius: 33rpx;
|
|
|
+ margin-bottom: 30rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .searchIMG {
|
|
|
+ width: 25rpx !important;
|
|
|
+ height: 25rpx !important;
|
|
|
+ margin-right: 10rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .tabs {
|
|
|
+ // width: 100%;
|
|
|
+ // height: 417rpx;
|
|
|
+ padding: 44rpx 30rpx 56rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .img-box {
|
|
|
+ width: 90rpx;
|
|
|
+ height: 90rpx;
|
|
|
+ margin: 10rpx 0 20rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .one-img {
|
|
|
+ width: 100% !important;
|
|
|
+ }
|
|
|
+
|
|
|
+ .tabs-top {
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-around;
|
|
|
+ }
|
|
|
+
|
|
|
+ .tabs-top-one {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ font-size: 28rpx;
|
|
|
+ font-weight: bold;
|
|
|
+ color: #485B93;
|
|
|
+ width: 170rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .safeInfo {
|
|
|
+ margin: 25rpx 0;
|
|
|
+ width: 100%;
|
|
|
+ color: #ffffff;
|
|
|
+ font-size: 36rpx;
|
|
|
+ font-weight: bold;
|
|
|
+ display: flex;
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+ .flexBox {
|
|
|
+ flex: 1;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ }
|
|
|
+
|
|
|
+ .imgStyle {
|
|
|
+ width: 100%;
|
|
|
+ height: 12rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .safe-content {
|
|
|
+ width: 100%;
|
|
|
+ margin-bottom: 20rpx;
|
|
|
+ padding: 20rpx 30rpx;
|
|
|
+ box-sizing: border-box;
|
|
|
+ }
|
|
|
+
|
|
|
+ .safe-content:last-child {
|
|
|
+ margin-bottom: 90px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .safe-content-one {
|
|
|
+ display: flex;
|
|
|
+ margin-top: 20rpx;
|
|
|
+ margin-bottom: 20rpx;
|
|
|
+ // align-items: center;
|
|
|
+ }
|
|
|
+
|
|
|
+ .colorbox {
|
|
|
+ width: 15rpx;
|
|
|
+ height: 15rpx;
|
|
|
+ background-color: #00E2C6;
|
|
|
+ border-radius: 8rpx;
|
|
|
+ margin-top: 14rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .colorbox1 {
|
|
|
+ width: 15rpx;
|
|
|
+ height: 15rpx;
|
|
|
+ background-color: #FF5E46;
|
|
|
+ border-radius: 8rpx;
|
|
|
+ margin-top: 16rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .text-content {
|
|
|
+ color: #2F4173;
|
|
|
+ font-size: 28rpx;
|
|
|
+ font-weight: bold;
|
|
|
+ // margin: 20rpx 0 20rpx 20rpx;
|
|
|
+ margin-left: 20rpx;
|
|
|
+ width: 568rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .text-content1 {
|
|
|
+ font-size: 24rpx;
|
|
|
+ width: 558rpx;
|
|
|
+ font-weight: 400;
|
|
|
+ color: #485B93;
|
|
|
+ line-height: 48rpx;
|
|
|
+ margin-left: 20rpx;
|
|
|
+ // margin: 0rpx 0 20rpx 20rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .safe-content-bottom {
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ align-items: center;
|
|
|
+ }
|
|
|
+
|
|
|
+ .bottom-left {
|
|
|
+ width: 280rpx;
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ align-items: center;
|
|
|
+ font-size: 24rpx;
|
|
|
+ font-weight: 400;
|
|
|
+ color: #485B94;
|
|
|
+ }
|
|
|
+
|
|
|
+ .timer {
|
|
|
+ width: 25rpx !important;
|
|
|
+ height: 25rpx !important;
|
|
|
+ }
|
|
|
+
|
|
|
+ .bottom-right {
|
|
|
+ font-size: 24rpx;
|
|
|
+ font-weight: 400;
|
|
|
+ color: #485B94;
|
|
|
+ }
|
|
|
+
|
|
|
+ .dialog {
|
|
|
+ position: fixed;
|
|
|
+ width: 542rpx;
|
|
|
+ height: 462rpx;
|
|
|
+ background: rgba(185, 196, 201, 0.75);
|
|
|
+ border: 2rpx solid #77A8FF;
|
|
|
+ box-shadow: 0rpx 0rpx 24rpx 6rpx rgba(109, 160, 251, 0.6);
|
|
|
+ border-radius: 28rpx;
|
|
|
+ top: 50%;
|
|
|
+ left: 50%;
|
|
|
+ transform: translate(-50%, -50%);
|
|
|
+ }
|
|
|
+
|
|
|
+ .sheild {
|
|
|
+ width: 197rpx;
|
|
|
+ height: 197rpx;
|
|
|
+ background: #FFFCF6;
|
|
|
+ box-shadow: 0rpx 9rpx 7rpx 0rpx rgba(24, 51, 129, 0.14);
|
|
|
+ border-radius: 50%;
|
|
|
+ position: absolute;
|
|
|
+ left: 50%;
|
|
|
+ transform: translate(-50%, -50%);
|
|
|
+ }
|
|
|
+
|
|
|
+ .sheild-img {
|
|
|
+ position: absolute;
|
|
|
+ width: 120rpx;
|
|
|
+ top: 50%;
|
|
|
+ left: 50%;
|
|
|
+ transform: translate(-50%, -50%);
|
|
|
+ }
|
|
|
+
|
|
|
+ .star {
|
|
|
+ position: absolute;
|
|
|
+ width: 450rpx;
|
|
|
+ left: 50%;
|
|
|
+ top: 15%;
|
|
|
+ transform: translate(-50%, -50%);
|
|
|
+ }
|
|
|
+
|
|
|
+ .star-img {
|
|
|
+ width: 450rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .dialog-top {
|
|
|
+ position: absolute;
|
|
|
+ height: 240rpx;
|
|
|
+ width: 100%;
|
|
|
+ border-bottom: 1rpx solid #77A8FF;
|
|
|
+ border-top-left-radius: 28rpx;
|
|
|
+ border-top-right-radius: 28rpx;
|
|
|
+ border-bottom-left-radius: 48%;
|
|
|
+ border-bottom-right-radius: 48%;
|
|
|
+ background-color: #D3E0FF;
|
|
|
+ }
|
|
|
+
|
|
|
+ .yellow-circle {
|
|
|
+ width: 31rpx;
|
|
|
+ height: 31rpx;
|
|
|
+ background: linear-gradient(0deg, #EFC20D 0%, #EBCC12 100%);
|
|
|
+ border-radius: 50%;
|
|
|
+ opacity: 0.6;
|
|
|
+ position: absolute;
|
|
|
+ top: 20%;
|
|
|
+ left: 70%;
|
|
|
+ }
|
|
|
+
|
|
|
+ .dialog-title {
|
|
|
+ text-align: center;
|
|
|
+ position: absolute;
|
|
|
+ bottom: 15%;
|
|
|
+ left: 50%;
|
|
|
+ transform: translate(-50%);
|
|
|
+ }
|
|
|
+
|
|
|
+ .dialog-bottom {
|
|
|
+ width: 542rpx;
|
|
|
+ height: 200rpx;
|
|
|
+ position: absolute;
|
|
|
+ bottom: 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ .dialog-bottom {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ align-items: center;
|
|
|
+ font-size: 28rpx;
|
|
|
+ font-weight: bold;
|
|
|
+ color: #485B93;
|
|
|
+ line-height: 41rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ /deep/ .u-tabbar__content {
|
|
|
+ background-image: url('@/static/images/nav_bg.png');
|
|
|
+ background-size: 100% 100%;
|
|
|
+ }
|
|
|
+
|
|
|
+ /deep/ .u-tabbar-item {
|
|
|
+ height: 70px;
|
|
|
+ }
|
|
|
+
|
|
|
+ /deep/ .u-tabbar__content {
|
|
|
+ background-color: transparent;
|
|
|
+ }
|
|
|
+
|
|
|
+ /deep/ .u-tabbar__content {
|
|
|
+ height: 60px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .u-page__item__slot-icon {
|
|
|
+ width: 32px;
|
|
|
+ height: 32px;
|
|
|
+ }
|
|
|
+
|
|
|
+ /deep/ .u-tabbar-item__text {
|
|
|
+ font-size: 11px;
|
|
|
+ font-weight: 400;
|
|
|
+ color: #4A5D94;
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ .headImg {
|
|
|
+ margin-left: auto;
|
|
|
+ margin-right: auto;
|
|
|
+ width: 160rpx;
|
|
|
+ height: 160rpx;
|
|
|
+ // border: 1px salmon solid;
|
|
|
+ background: url('@/static/images/city/tx.png');
|
|
|
+ background-size: 100% 100%;
|
|
|
+ // margin-bottom: 19rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .headImg2 {
|
|
|
+ margin-left: auto;
|
|
|
+ margin-right: auto;
|
|
|
+ width: 190rpx;
|
|
|
+ height: 190rpx;
|
|
|
+ // border: 1px salmon solid;
|
|
|
+ background: url('@/static/images/city/tx.png');
|
|
|
+ background-size: 100% 100%;
|
|
|
+ }
|
|
|
+
|
|
|
+ .headName {
|
|
|
+ margin-left: auto;
|
|
|
+ margin-right: auto;
|
|
|
+ text-align: center;
|
|
|
+ margin-bottom: 40rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .userName {
|
|
|
+ margin-left: auto;
|
|
|
+ margin-right: auto;
|
|
|
+ text-align: center;
|
|
|
+ margin-bottom: 20rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .titleStyle {
|
|
|
+ font-size: 30rpx;
|
|
|
+ font-weight: bold;
|
|
|
+ color: #FFFFFF;
|
|
|
+ }
|
|
|
+
|
|
|
+ //屏幕高度-导航栏高度-状态栏高度-底部导航栏-上边距-头像高度-下边距-文字框高度-文字框下边距 -二个图标高度-二个图标上边距-二个文本高度-一个文本高度-一个文本框的上下高度
|
|
|
+ .safeBox {
|
|
|
+ overflow-y: auto;
|
|
|
+ height: calc(100vh - 44px - 22px - 70px - 22rpx - 140rpx - 19rpx - 27rpx - 40rpx - 180rpx - 20rpx - 52rpx - 26rpx - 50rpx + 108rpx);
|
|
|
+ }
|
|
|
+</style>
|