页面开发

This commit is contained in:
ChuShiZ 2024-08-22 20:13:57 +08:00
parent b8ce17c902
commit 1220174322
3 changed files with 115 additions and 12 deletions

View File

@ -27,9 +27,10 @@ export default {
default: '#fff'
}
},
onLoad() {
mounted() {
// #ifdef MP
const {barHeight, barTop, menuButtonLeft} = getWXStatusHeight()
console.log('barHeight, barTop, menuButtonLeft: ',barHeight, barTop, menuButtonLeft);
this.homeHeaderPaddingTop = barTop || 0
this.homeHeaderMenuHeight = barHeight
this.homeHeaderMenuLeft = menuButtonLeft - 6

View File

@ -3,7 +3,7 @@
<VNavigationBarVue title="消息通知"></VNavigationBarVue>
<scroll-view scroll-y @scrolltolower="scrolltolower" class="mubu">
<view class="jsy" v-if="listArr.length == 0">
<image src="http://www.nuoyunr.com/lananRsc/detection/qs.png" mode=""></image>
<image src="http://www.nuoyunr.com/lananRsc/detection/qs.png" mode="aspectFit"></image>
</view>
<view class="noticeGroup" v-for="group in groupArr" :key="group.date">
<view class="noticeDate">{{ group.date }}</view>

View File

@ -82,7 +82,7 @@
<!-- #endif -->
<!-- #ifdef MP-WEIXIN -->
<view class="box">
<view class="xz-box" id="y1" @click="getsxwhat(1)">
<!-- <view class="xz-box" id="y1" @click="getsxwhat(1)">
<view class="box-wenzi">拖车</view>
</view>
<view class="xz-box" id="y2" @click="getsxwhat(2)">
@ -93,7 +93,17 @@
</view>
<view class="xz-box" id="y4" @click="getsxwhat(4)">
<view class="box-wenzi">换胎</view>
</view>
</view> -->
<template v-for="(item, index) in busiTypeList">
<view :key="index" class="xz-box" :class="{ checked: busiType === index + 1 }" @click="getsxwhat(index + 1)">
<image class="xz-box-icon" :src="item.icon" mode="aspectFit"></image>
<view class="box-wenzi">{{item.label}}</view>
<view class="checkedFlag">
</view>
<!-- <uni-icons type="plus"></uni-icons> -->
<uni-icons class="checkedFlagIcon" type="checkmarkempty" size="22" color="#fff"></uni-icons>
</view>
</template>
<!-- <view class="xz-box" v-if="role[0] == 'jjdd' " id="y5" @click="getsx(5)">
<view class="box-wenzi">扣车</view>
</view> -->
@ -138,7 +148,7 @@
</view>
<view class="tap-box">
<view class="ques" v-if="orderList.length== 0 ">
<image src="../../static/quesheng.png" mode=""></image>
<image src="../../static/quesheng.png" mode="aspectFit"></image>
</view>
<view style="display: flex;flex-direction: column;row-gap: 10px;" v-else>
<order-card @deleteOk="deleteOrderHandle" @refresh="getlist" v-for="(item, index) in orderList" :key="index" :orderData="item"></order-card>
@ -198,7 +208,7 @@
</view>
<u-modal :show="showDelete" :title="title" :showCancelButton="true" @confirm="confirm"
@cancel="cancel"></u-modal>
<u-popup :show="showp" @close="close" @open="open" mode="center" :round="10">
<u-popup :show="showp" @close="close" mode="center" :round="10">
<scroll-view scroll-y style="height: 200px;">
<view class="box_">
<view class="title_">车辆提醒</view>
@ -229,6 +239,27 @@
export default {
data() {
return {
busiTypeList: [{
label: '拖车',
icon: require('@/static/icons/order/tuoche.png')
},
{
label: '送油',
icon: require('@/static/icons/order/songyou.png')
},
{
label: '搭电',
icon: require('@/static/icons/order/dadian.png')
},
{
label: '换胎',
icon: require('@/static/icons/order/huantai.png')
},
// {
// label: '',
// icon: require('@/static/icons/order/tuoche.png')
// },
],
topMenuList: [
{
title: '我的订单',
@ -413,6 +444,7 @@
})
},
register() { //
// #ifdef APP
console.log('keepAlive', keepAlivePlugin);
keepAlivePlugin.register({
channelId: this.keepLive.channelId,
@ -423,6 +455,7 @@
(res) => {
console.log('保活注册', res);
});
// #endif
},
deleteOrderHandle() {
this.pageNum = 1
@ -697,6 +730,9 @@
background-image: url('~@/static/images/homeOrderCard/dzf.png');
background-size: cover;
background-position: center;
display: flex;
flex-direction: column;
justify-content: center;
}
.boxf1 {
@ -708,6 +744,9 @@
background-image: url('~@/static/images/homeOrderCard/dqc.png');
background-size: cover;
background-position: center;
display: flex;
flex-direction: column;
justify-content: center;
}
.boxf2 {
@ -719,6 +758,9 @@
background-image: url('~@/static/images/homeOrderCard/jyz.png');
background-size: cover;
background-position: center;
display: flex;
flex-direction: column;
justify-content: center;
}
.boxf3 {
@ -730,6 +772,9 @@
background-image: url('~@/static/images/homeOrderCard/ywc.png');
background-size: cover;
background-position: center;
display: flex;
flex-direction: column;
justify-content: center;
}
.zi1 {
@ -979,19 +1024,76 @@
flex-wrap: wrap;
}
// .xz-box {
// height: 80px;
// width: 48%;
// display: flex;
// justify-content: center;
// align-items: center;
// font-size: 16px;
// font-weight: 400;
// color: #FFFFFF;
// background-size: cover;
// background-position: center;
// margin-top: 20px;
// }
.xz-box {
height: 80px;
width: 48%;
width: 330rpx;
height: 396rpx;
background: #FFFFFF;
box-shadow: 0rpx 4rpx 8rpx 0rpx rgba(0, 0, 0, 0.06);
border-radius: 16rpx;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
font-size: 16px;
font-weight: 400;
color: #FFFFFF;
background-size: cover;
background-position: center;
margin-top: 20px;
margin-top: 36rpx;
transition: all ease 400ms;
overflow: hidden;
.checkedFlagIcon {
display: none;
}
&.checked {
box-sizing: border-box;
position: relative;
border: 2rpx solid #478AFA;
.checkedFlag {
background-color: #478AFA;
width: 120rpx;
height: 120rpx;
position: absolute;
right: -60rpx;
bottom: -60rpx;
transform: rotate(45deg);
z-index: 1;
}
.checkedFlagIcon {
display: inline-block;
position: absolute;
z-index: 2;
bottom: 0;
right: 0;
}
}
.xz-box-icon {
width: 130rpx;
height: 130rpx;
margin-bottom: 26rpx;
}
.box-wenzi {
font-size: 28rpx;
color: #000000;
}
}
#y1 {