From 38430ddb8612fce15a2f1c940f9bd57d4da3e70b Mon Sep 17 00:00:00 2001
From: zhangzengfei <zhangzengfei@smartai.com>
Date: 星期四, 16 九月 2021 11:59:39 +0800
Subject: [PATCH] add new key
---
pages/index/index.vue | 764 +++++++++++++++++++++++++++++-----------------------------
1 files changed, 382 insertions(+), 382 deletions(-)
diff --git a/pages/index/index.vue b/pages/index/index.vue
index da0b959..109d24e 100644
--- a/pages/index/index.vue
+++ b/pages/index/index.vue
@@ -1,383 +1,383 @@
-<template>
- <view class="content">
- <view class="header_bg">
- <uniNavBar title="鍖椾含甯傝偛鑻变腑瀛�" class="header-bar" background-color="transparent" right-icon="contact" color="#fff"
- @clickRight="toMine">
- </uniNavBar>
- <div class="header-info">
- <div class="left">
- <div class="weather-info">
- <image :src="`../../static/weather-icon/${curWeather.cond_code}.png`" mode="widthFix"></image>
-
- <span class="desc">{{curWeather.cond_txt}}</span>
- </div>
- <div class="temperature" v-show="curWeather.tmp">
- {{curWeather.tmp}}鈩�
- </div>
- </div>
- <div class="right">
- <span class="dimension" v-cloak v-if="dataReturn">{{isLimit?'浠婃棩闄愯':'浠婃棩涓嶉檺琛�'}}</span>
- <div class="cube" v-for="(i,index) in limitNum" :key="index">{{i}}</div>
- </div>
- </div>
- </view>
- <view class="body">
- <div class="card remain">
- <div class="detail">
- <image src="../../static/index/u21.png" mode="widthFix"></image>
- <text class="remain-num">{{remainNum}}</text>
- </div>
- <div class="title" style="padding-top:20rpx;">褰撳墠鍓╀綑杞︿綅</div>
- </div>
- <div class="card parking-navigation">
- <div class="detail">
- <image src="../../static/index/u20.png" mode="widthFix"></image>
- </div>
- <div class="title">
- <navigator url="/pages/parking/parking" hover-class="other-navigator-hover" class="nav-btn">
- <span>鎵惧仠杞︿綅</span>
- <image src="../../static/index/right-arrow.png" ></image>
- </navigator> |
- <navigator url="/pages/gaode/gaode" hover-class="other-navigator-hover" class="nav-btn btn-gaode">
- <span>瀛︽牎杞﹀満瀵艰埅</span>
- <image src="../../static/index/right-arrow.png" ></image>
- </navigator>
- </div>
- </div>
- </view>
- <!-- <view class="modal" v-if="update">
- <div class="content">
- <div class="title">鍙戠幇鏂扮増鏈�</div>
- <div class="desc">
- <p>鐗堟湰 {{version}}</p>
- <p>鏈鏇存柊:</p>
- <p >....</p>
- </div>
- </div>
- </view> -->
- </view>
-</template>
-
-<script>
- export default {
- data() {
- return {
- nbTitle: '鏍囬',
- titleIcon: '/static/logo.png',
- titleIconRadius: '20px',
- subtitleText: 'subtitleText',
- nbLoading: false,
- nbFrontColor: '#fff',
- nbBackgroundColor: 'transparent',
- curWeather: {},
- //limitNum: 17,
- dataReturn: false,
- isLimit: true,
- limitNum: [],
- remainNum: '',
- update: false,
- version:'',
- timerId:'',
- }
- },
- computed: {
- // nums() {
- // return this.limitNum.toString().split('');
- // }
- },
- mounted(){
- console.log('mounted')
- this.init();
- // this.timerId = setInterval(()=>{
- // console.log('timer')
- // this.init();
- // },30000)
- },
- onShow() {
- console.log('show')
- this.init();
- this.timerId = setInterval(()=>{
- console.log('timer')
- this.init();
- },30000)
- },
- onHide() {
- clearInterval(this.timerId);
- console.log('clear')
- },
- onReady(){
-
- },
- onBackPress(e){
- console.log(e);
- uni.showModal({
- title: '鎻愮ず',
- content: '鏄惁閫�鍑哄綋鍓嶅簲鐢紵',
- success: function(res) {
- if (res.confirm) {
- // 閫�鍑哄綋鍓嶅簲鐢紝鏀规柟娉曞彧鍦ˋpp涓敓鏁�
- plus.runtime.quit();
- } else if (res.cancel) {
- console.log('鐢ㄦ埛鐐瑰嚮鍙栨秷');
- }
- }
- });
- return true
- },
- onReady(){
-
- },
- onLoad() {
-
- },
- onPullDownRefresh(){
- console.log("refresh");
- this.init()
- },
-
- methods: {
- init(){
- this.getWeatherInfo();
- this.getRemainNum();
- this.getLimitedNum();
- uni.stopPullDownRefresh();
-
- },
- async getWeatherInfo(){
- let res = await this.$api.syncRequest({
- url:'https://free-api.heweather.net/s6/weather/now?location=beijing&key=618660daa2144e1094ce8d2ef90516d4',
- loading: true
- });
- this.curWeather = res.data.HeWeather6[0].now;
- },
- async getRemainNum(){
- let res = await this.$api.syncRequest({
- url: '/basic/api/car/statistic',
- loading: true
- });
- this.remainNum = res.data.data.left;
- },
- async getLimitedNum(){
- let res = await this.$api.syncRequest({
- url: '/basic/api/car/restriction',
- loading: true
- });
-
- if(res.data.success && res.data.data.isxianxing==1){
- this.limitNum = res.data.data.xxWeiHao;
- }else{
- this.isLimit = false;
- }
- this.dataReturn = true;
- },
- toMine() {
- uni.navigateTo({
- url: '../mine/mine'
- });
- },
-
- }
- }
-</script>
-
-<style lang="scss">
- .content {
- display: flex;
- flex-direction: column;
- align-items: center;
- justify-content: center;
- position: relative;
-
- .header_bg {
- width: 100%;
- height: 500rpx;
- background: url(../../static/index/u3.jpg) no-repeat;
- background-size: 100% 100%;
- background-position: left top;
- .header-bar {
- /deep/.uni-navbar--border {
- border-bottom: none;
- }
- /deep/.uni-navbar__header{
- height: 76px;
- line-height: 76px;
- .uni-icons{
- margin-top: 42rpx;
- font-size: 54rpx!important;
- }
- }
- /deep/.uni-nav-bar-text {
- font-size: 38rpx;
- line-height: 1;
- margin-top: 40rpx;
- }
- }
-
- .header-info {
- margin: 0 auto;
- width: 500rpx;
- height: 240rpx;
- padding: 58rpx 70rpx 0;
- border-radius: 5rpx;
- background-color: rgba(255, 255, 255, .5);
- color: #006699;
-
- &[v-cloak] {
- display: none;
- }
- // &::after{
- // content: "";
- // width:100%;
- // height:100%;
- // position: absolute;
- // left:0;
- // top:0;
- // background: inherit;
- // filter: blur(2px);
- // }
- .left {
- display: flex;
- justify-content: center;
- align-items: center;
-
- .weather-info {
- display: flex;
- align-items: center;
- margin-right: 10rpx;
- image {
- width: 90rpx;
- }
-
- .desc {
- font-size: 44rpx;
- line-height: 1;
- margin-left: 14rpx;
- }
- }
-
- .temperature {
- font-size: 46rpx;
- text-align: center;
- margin-top: 10rpx;
- margin-left: 10rpx;
- }
- }
-
- .right {
- display: flex;
- justify-content: center;
- margin-top: 10rpx;
- .dimension {
- font-size: 40rpx;
- &[v-cloak] {
- display: none !important;
- }
- }
- .cube {
- width: 44rpx;
- height: 60rpx;
- border-radius: 5rpx;
- margin-right: 14rpx;
- background-color: #fff;
- color: #35ADA7;
- line-height: 60rpx;
- text-align: center;
- font-size: 40rpx;
- }
- }
- }
- }
-
- .body {
- width: 750rpx;
- padding: 10rpx 30rpx;
- box-sizing: border-box;
-
- .card {
- height: 380rpx;
- border-radius: 8rpx;
- margin-top: 20rpx;
- color: #fff;
-
- &.remain {
- background: linear-gradient(135deg, rgba(124, 206, 249, 1) 0%, rgba(124, 206, 249, 1) 0%, rgba(117, 144, 253, 1) 100%, rgba(117, 144, 253, 1) 100%);
- }
-
- &.parking-navigation {
- background: linear-gradient(135deg, rgba(69, 218, 210, 1) 0%, rgba(69, 218, 210, 1) 0%, rgba(48, 211, 172, 1) 100%, rgba(48, 211, 172, 1) 100%);
- }
-
- .detail {
- display: flex;
- justify-content: center;
- font-size: 130rpx;
- line-height: 140rpx;
- padding-top: 70rpx;
-
- image {
- width: 140rpx;
- margin-right: 20rpx;
- }
-
- text {
- line-height: 1;
- font-weight: bold;
- }
- }
-
- .title {
- margin-top: 20rpx;
- text-align: center;
- navigator {
- display: inline-block;
- padding: 7rpx 10rpx 7rpx 20rpx;
- margin: 0 16rpx;
- font-size: 34rpx;
- color: #45dad2;
- background: #fff;
- border-radius: 40rpx;
- margin-top: 4rpx;
- }
- .nav-btn{
- span{
- vertical-align: top;
- }
- image{
- width: 36rpx!important;
- height: 36rpx;
- vertical-align: top;
- margin-top: 5rpx;
- }
- }
- }
- }
- }
- .modal{
- width: 100%;
- height: 100%;
- background: rgba(0,0,0,0.3);
- position: absolute;
- top: 0;
- left: 0;
- z-index: 100;
- .content{
- width: 70%;
- height: 300rpx;
- background: #fff;
- .header{
- height: 30rpx;
- padding-left: 20rpx;
- line-height: 30rpx;
- }
- .desc{
-
- }
- }
- }
- }
-
- .text-area {
- display: flex;
- justify-content: center;
- }
+<template>
+ <view class="content">
+ <view class="header_bg">
+ <uniNavBar title="鍖椾含甯傝偛鑻变腑瀛�" class="header-bar" background-color="transparent" right-icon="contact" color="#fff"
+ @clickRight="toMine">
+ </uniNavBar>
+ <div class="header-info">
+ <div class="left">
+ <div class="weather-info">
+ <image :src="`../../static/weather-icon/${curWeather.cond_code}.png`" mode="widthFix"></image>
+
+ <span class="desc">{{curWeather.cond_txt}}</span>
+ </div>
+ <div class="temperature" v-show="curWeather.tmp">
+ {{curWeather.tmp}}鈩�
+ </div>
+ </div>
+ <div class="right">
+ <span class="dimension" v-cloak v-if="dataReturn">{{isLimit?'浠婃棩闄愯':'浠婃棩涓嶉檺琛�'}}</span>
+ <div class="cube" v-for="(i,index) in limitNum" :key="index">{{i}}</div>
+ </div>
+ </div>
+ </view>
+ <view class="body">
+ <div class="card remain">
+ <div class="detail">
+ <image src="../../static/index/u21.png" mode="widthFix"></image>
+ <text class="remain-num">{{remainNum}}</text>
+ </div>
+ <div class="title" style="padding-top:20rpx;">褰撳墠鍓╀綑杞︿綅</div>
+ </div>
+ <div class="card parking-navigation">
+ <div class="detail">
+ <image src="../../static/index/u20.png" mode="widthFix"></image>
+ </div>
+ <div class="title">
+ <navigator url="/pages/parking/parking" hover-class="other-navigator-hover" class="nav-btn">
+ <span>鎵惧仠杞︿綅</span>
+ <image src="../../static/index/right-arrow.png" ></image>
+ </navigator> |
+ <navigator url="/pages/gaode/gaode" hover-class="other-navigator-hover" class="nav-btn btn-gaode">
+ <span>瀛︽牎杞﹀満瀵艰埅</span>
+ <image src="../../static/index/right-arrow.png" ></image>
+ </navigator>
+ </div>
+ </div>
+ </view>
+ <!-- <view class="modal" v-if="update">
+ <div class="content">
+ <div class="title">鍙戠幇鏂扮増鏈�</div>
+ <div class="desc">
+ <p>鐗堟湰 {{version}}</p>
+ <p>鏈鏇存柊:</p>
+ <p >....</p>
+ </div>
+ </div>
+ </view> -->
+ </view>
+</template>
+
+<script>
+ export default {
+ data() {
+ return {
+ nbTitle: '鏍囬',
+ titleIcon: '/static/logo.png',
+ titleIconRadius: '20px',
+ subtitleText: 'subtitleText',
+ nbLoading: false,
+ nbFrontColor: '#fff',
+ nbBackgroundColor: 'transparent',
+ curWeather: {},
+ //limitNum: 17,
+ dataReturn: false,
+ isLimit: true,
+ limitNum: [],
+ remainNum: '',
+ update: false,
+ version:'',
+ timerId:'',
+ }
+ },
+ computed: {
+ // nums() {
+ // return this.limitNum.toString().split('');
+ // }
+ },
+ mounted(){
+ console.log('mounted')
+ this.init();
+ // this.timerId = setInterval(()=>{
+ // console.log('timer')
+ // this.init();
+ // },30000)
+ },
+ onShow() {
+ console.log('show')
+ this.init();
+ this.timerId = setInterval(()=>{
+ console.log('timer')
+ this.init();
+ },30000)
+ },
+ onHide() {
+ clearInterval(this.timerId);
+ console.log('clear')
+ },
+ onReady(){
+
+ },
+ onBackPress(e){
+ console.log(e);
+ uni.showModal({
+ title: '鎻愮ず',
+ content: '鏄惁閫�鍑哄綋鍓嶅簲鐢紵',
+ success: function(res) {
+ if (res.confirm) {
+ // 閫�鍑哄綋鍓嶅簲鐢紝鏀规柟娉曞彧鍦ˋpp涓敓鏁�
+ plus.runtime.quit();
+ } else if (res.cancel) {
+ console.log('鐢ㄦ埛鐐瑰嚮鍙栨秷');
+ }
+ }
+ });
+ return true
+ },
+ onReady(){
+
+ },
+ onLoad() {
+
+ },
+ onPullDownRefresh(){
+ console.log("refresh");
+ this.init()
+ },
+
+ methods: {
+ init(){
+ this.getWeatherInfo();
+ this.getRemainNum();
+ this.getLimitedNum();
+ uni.stopPullDownRefresh();
+
+ },
+ async getWeatherInfo(){
+ let res = await this.$api.syncRequest({
+ url:'https://free-api.heweather.net/s6/weather/now?location=beijing&key=618660daa2144e1094ce8d2ef90516d4',
+ loading: true
+ });
+ this.curWeather = res.data.HeWeather6[0].now;
+ },
+ async getRemainNum(){
+ let res = await this.$api.syncRequest({
+ url: '/basic/api/car/statistic',
+ loading: true
+ });
+ this.remainNum = res.data.data.left;
+ },
+ async getLimitedNum(){
+ let res = await this.$api.syncRequest({
+ url: '/basic/api/car/restriction',
+ loading: true
+ });
+
+ if(res.data.success && res.data.data.isxianxing==1){
+ this.limitNum = res.data.data.xxWeiHao;
+ }else{
+ this.isLimit = false;
+ }
+ this.dataReturn = true;
+ },
+ toMine() {
+ uni.navigateTo({
+ url: '../mine/mine'
+ });
+ },
+
+ }
+ }
+</script>
+
+<style lang="scss">
+ .content {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+ position: relative;
+
+ .header_bg {
+ width: 100%;
+ height: 500rpx;
+ background: url(../../static/index/u3.jpg) no-repeat;
+ background-size: 100% 100%;
+ background-position: left top;
+ .header-bar {
+ /deep/.uni-navbar--border {
+ border-bottom: none;
+ }
+ /deep/.uni-navbar__header{
+ height: 76px;
+ line-height: 76px;
+ .uni-icons{
+ margin-top: 42rpx;
+ font-size: 54rpx!important;
+ }
+ }
+ /deep/.uni-nav-bar-text {
+ font-size: 38rpx;
+ line-height: 1;
+ margin-top: 40rpx;
+ }
+ }
+
+ .header-info {
+ margin: 0 auto;
+ width: 500rpx;
+ height: 240rpx;
+ padding: 58rpx 70rpx 0;
+ border-radius: 5rpx;
+ background-color: rgba(255, 255, 255, .5);
+ color: #006699;
+
+ &[v-cloak] {
+ display: none;
+ }
+ // &::after{
+ // content: "";
+ // width:100%;
+ // height:100%;
+ // position: absolute;
+ // left:0;
+ // top:0;
+ // background: inherit;
+ // filter: blur(2px);
+ // }
+ .left {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+
+ .weather-info {
+ display: flex;
+ align-items: center;
+ margin-right: 10rpx;
+ image {
+ width: 90rpx;
+ }
+
+ .desc {
+ font-size: 44rpx;
+ line-height: 1;
+ margin-left: 14rpx;
+ }
+ }
+
+ .temperature {
+ font-size: 46rpx;
+ text-align: center;
+ margin-top: 10rpx;
+ margin-left: 10rpx;
+ }
+ }
+
+ .right {
+ display: flex;
+ justify-content: center;
+ margin-top: 10rpx;
+ .dimension {
+ font-size: 40rpx;
+ &[v-cloak] {
+ display: none !important;
+ }
+ }
+ .cube {
+ width: 44rpx;
+ height: 60rpx;
+ border-radius: 5rpx;
+ margin-right: 14rpx;
+ background-color: #fff;
+ color: #35ADA7;
+ line-height: 60rpx;
+ text-align: center;
+ font-size: 40rpx;
+ }
+ }
+ }
+ }
+
+ .body {
+ width: 750rpx;
+ padding: 10rpx 30rpx;
+ box-sizing: border-box;
+
+ .card {
+ height: 380rpx;
+ border-radius: 8rpx;
+ margin-top: 20rpx;
+ color: #fff;
+
+ &.remain {
+ background: linear-gradient(135deg, rgba(124, 206, 249, 1) 0%, rgba(124, 206, 249, 1) 0%, rgba(117, 144, 253, 1) 100%, rgba(117, 144, 253, 1) 100%);
+ }
+
+ &.parking-navigation {
+ background: linear-gradient(135deg, rgba(69, 218, 210, 1) 0%, rgba(69, 218, 210, 1) 0%, rgba(48, 211, 172, 1) 100%, rgba(48, 211, 172, 1) 100%);
+ }
+
+ .detail {
+ display: flex;
+ justify-content: center;
+ font-size: 130rpx;
+ line-height: 140rpx;
+ padding-top: 70rpx;
+
+ image {
+ width: 140rpx;
+ margin-right: 20rpx;
+ }
+
+ text {
+ line-height: 1;
+ font-weight: bold;
+ }
+ }
+
+ .title {
+ margin-top: 20rpx;
+ text-align: center;
+ navigator {
+ display: inline-block;
+ padding: 7rpx 10rpx 7rpx 20rpx;
+ margin: 0 16rpx;
+ font-size: 34rpx;
+ color: #45dad2;
+ background: #fff;
+ border-radius: 40rpx;
+ margin-top: 4rpx;
+ }
+ .nav-btn{
+ span{
+ vertical-align: top;
+ }
+ image{
+ width: 36rpx!important;
+ height: 36rpx;
+ vertical-align: top;
+ margin-top: 5rpx;
+ }
+ }
+ }
+ }
+ }
+ .modal{
+ width: 100%;
+ height: 100%;
+ background: rgba(0,0,0,0.3);
+ position: absolute;
+ top: 0;
+ left: 0;
+ z-index: 100;
+ .content{
+ width: 70%;
+ height: 300rpx;
+ background: #fff;
+ .header{
+ height: 30rpx;
+ padding-left: 20rpx;
+ line-height: 30rpx;
+ }
+ .desc{
+
+ }
+ }
+ }
+ }
+
+ .text-area {
+ display: flex;
+ justify-content: center;
+ }
</style>
--
Gitblit v1.8.0