This commit is contained in:
cclu 2024-05-31 10:44:22 +08:00
parent f8b01a6075
commit da382c8991
3 changed files with 729 additions and 630 deletions

View File

@ -1,4 +1,5 @@
<template> <template>
<scroll-view class="scrollBox" scroll-y="true" @scroll="handlePageScroll">
<view class="earlyWarningDetail"> <view class="earlyWarningDetail">
<view class="earlyTop" :style="{height: `calc(${menu.bottom}px + 680rpx)`}"> <view class="earlyTop" :style="{height: `calc(${menu.bottom}px + 680rpx)`}">
<!-- menu.bottom + 314 + 'px'--> <!-- menu.bottom + 314 + 'px'-->
@ -23,6 +24,17 @@
</view> </view>
</view> </view>
<view class="detailFixed" :style="{top: menu.bottom + 12 +'px'}" v-if="showDetailFixed">
<view class="itemDetail">
<text :class="res.RevenueINC.increaseRate>0?'value red':res.RevenueINC.increaseRate<0?'value green':''">{{ res.RevenueINC.increaseRate?res.RevenueINC.increaseRate>0?`+${res.RevenueINC.increaseRate}%`:res.RevenueINC.increaseRate<0?`${res.RevenueINC.increaseRate}%`:'0':'-' }}</text>
<text class="label">对客销售</text>
</view>
<view class="itemDetail">
<text :class="res.BayonetINC.increaseRate>0?'value red':res.BayonetINC.increaseRate<0?'value green':''">{{ res.BayonetINC.increaseRate?res.BayonetINC.increaseRate>0?`+${res.BayonetINC.increaseRate}%`:res.BayonetINC.increaseRate<0?`${res.BayonetINC.increaseRate}%`:'0':'-' }}</text>
<text class="label">入区车流</text>
</view>
</view>
<view class="revenueBox" :style="{top: menu.bottom + 19 +'px' }"> <view class="revenueBox" :style="{top: menu.bottom + 19 +'px' }">
<view class="box"> <view class="box">
<view class="typeBox"> <view class="typeBox">
@ -218,6 +230,7 @@
</view> </view>
</view> </view>
</view> </view>
</scroll-view>
</template> </template>
<script> <script>
import {wrapTreeNode} from "../../util/dateTime"; import {wrapTreeNode} from "../../util/dateTime";
@ -244,6 +257,7 @@
selectType: 0,// selectType: 0,//
otherList:[],// otherList:[],//
ownerShop:{},// ownerShop:{},//
showDetailFixed: false,//
} }
}, },
onLoad(query){ onLoad(query){
@ -267,6 +281,13 @@
// this.dataList = this.handleSortList(this.res.ShopINCList) // this.dataList = this.handleSortList(this.res.ShopINCList)
}, },
methods:{ methods:{
handlePageScroll(e){
if (e.target.scrollTop>200){
this.showDetailFixed = true
}else{
this.showDetailFixed = false
}
},
handleGoCarCharts(){ handleGoCarCharts(){
console.log('res',this.res) console.log('res',this.res)
this.$util.toNextRoute('navigateTo', `/pages/earlyWarning/carCharts?id=${this.res.ServerpartId}&date=${this.date}`) this.$util.toNextRoute('navigateTo', `/pages/earlyWarning/carCharts?id=${this.res.ServerpartId}&date=${this.date}`)
@ -405,6 +426,9 @@
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">
.scrollBox{
width: 100vw;
height: 100vh;
.earlyWarningDetail{ .earlyWarningDetail{
width: 100%; width: 100%;
background: #F3F3F3; background: #F3F3F3;
@ -494,6 +518,46 @@
} }
} }
} }
.detailFixed{
width: 100%;
position: fixed;
left: 0;
background: #E5EBF9;
display: flex;
align-items: center;
box-sizing: border-box;
padding: 32rpx;
z-index: 20;
.itemDetail{
width: 50%;
display: flex;
flex-direction: column;
//align-items: center;
.value{
font-family: DINAlternate, DINAlternate;
font-weight: bold;
font-size: 42rpx;
line-height: 40rpx;
text-align: left;
font-style: normal;
}
.green{
color: #127E5B;
}
.red{
color: #E83944;
}
.label{
font-family: PingFangSC, PingFang SC;
font-weight: 400;
font-size: 28rpx;
color: #9A9A9A;
line-height: 40rpx;
text-align: left;
font-style: normal;
}
}
}
.revenueBox{ .revenueBox{
position: absolute; position: absolute;
width: calc(100% - 48rpx); width: calc(100% - 48rpx);
@ -894,4 +958,5 @@
} }
} }
} }
}
</style> </style>

View File

@ -177,7 +177,7 @@
<image class="message"/> <image class="message"/>
</view> </view>
<view class="itemTopRight" @click="handleGoDetail(item)"> <view class="itemTopRight" @click.stop="handleGoDetail(item)">
<view class="warningNotice" v-if="item.showWarning"> <view class="warningNotice" v-if="item.showWarning">
<image class="notice" src="https://eshangtech.com/ShopICO/ahyd-BID/warning/warningIcon.png"/> <image class="notice" src="https://eshangtech.com/ShopICO/ahyd-BID/warning/warningIcon.png"/>
<!-- <text class="shopNumber">{{ `${item.ShopINCList.length}个门店` }}</text>--> <!-- <text class="shopNumber">{{ `${item.ShopINCList.length}个门店` }}</text>-->

View File

@ -1,6 +1,6 @@
<template> <template>
<view class="projectWarningBox"> <view class="projectWarningBox">
<view class="earlyTop" :style="{height: `calc(${menu.bottom}px + 775rpx)`}"> <view class="earlyTop" :style="{height: `calc(${menu.bottom}px + 910rpx)`}">
<view class="earlyTopBg"></view> <view class="earlyTopBg"></view>
<view class="headerBox" :style="{paddingTop: menu.top + 'px',height:menu.bottom + 4 +'px'}"> <view class="headerBox" :style="{paddingTop: menu.top + 'px',height:menu.bottom + 4 +'px'}">
<view :style="{height:menu.height +'px',display: 'flex',alignItems: 'center',paddingLeft:'32rpx'}"> <view :style="{height:menu.height +'px',display: 'flex',alignItems: 'center',paddingLeft:'32rpx'}">
@ -29,7 +29,6 @@
<text class="title">经营项目预警</text> <text class="title">经营项目预警</text>
</view> </view>
<view class="errorContent" > <view class="errorContent" >
<view v-for="(item,index) in topTabList" :key="index" :class="selectTab===index+1?'errorItem selectErrorItem':'errorItem'" @click="handleChangeTab(index+1)"> <view v-for="(item,index) in topTabList" :key="index" :class="selectTab===index+1?'errorItem selectErrorItem':'errorItem'" @click="handleChangeTab(index+1)">
<view class="itemLeft"> <view class="itemLeft">
<image class="itemLogo" :src="'https://eshangtech.com/ShopICO/ahyd-BID/warning/error' + (index+1) + 'st.png'"/> <image class="itemLogo" :src="'https://eshangtech.com/ShopICO/ahyd-BID/warning/error' + (index+1) + 'st.png'"/>
@ -40,6 +39,17 @@
</view> </view>
</view> </view>
<view class="messageBox">
<view style="display: flex;align-items: center">
<image class="messageIcon" src="https://eshangtech.com/ShopICO/ahyd-BID/warning/error6st.png"/>
<text class="messageType">{{ warningNameObj[selectTab] }}</text>
</view>
<view style="margin-top: 16rpx">
<text class="messageDesc">{{ warningDescObj[selectTab] }}</text>
</view>
</view>
<!-- <view :class="selectTab===1?'errorItem selectErrorItem':'errorItem'" @click="handleChangeTab(1)">--> <!-- <view :class="selectTab===1?'errorItem selectErrorItem':'errorItem'" @click="handleChangeTab(1)">-->
<!-- <view class="itemLeft">--> <!-- <view class="itemLeft">-->
<!-- <image class="itemLogo" src="https://eshangtech.com/ShopICO/ahyd-BID/warning/error1st.png"/>--> <!-- <image class="itemLogo" src="https://eshangtech.com/ShopICO/ahyd-BID/warning/error1st.png"/>-->
@ -140,15 +150,7 @@
</view> </view>
</view> </view>
<view class="messageBox">
<view style="display: flex;align-items: center">
<image class="messageIcon" src="https://eshangtech.com/ShopICO/ahyd-BID/warning/error6st.png"/>
<text class="messageType">{{ warningNameObj[selectTab] }}</text>
</view>
<view style="margin-top: 16rpx">
<text class="messageDesc">{{ warningDescObj[selectTab] }}</text>
</view>
</view>
<view class="selectBox" v-if="false"> <view class="selectBox" v-if="false">
<scroll-view scroll-x="true" class="scrollBox"> <scroll-view scroll-x="true" class="scrollBox">
@ -283,7 +285,7 @@
<view class="filterBox"> <view class="filterBox">
<view class="filterTitle">统计时间</view> <view class="filterTitle">统计时间</view>
<view class="filterTimeBox"> <view class="filterTimeBox">
<picker class="timeSelect" mode="date" fields="month" :value="$moment(startDate).format('YYYY-MM')" :end="end" @change="handleGetStartTime">{{startDate}}</picker> <picker class="timeSelect" mode="date" fields="month" :value="$moment(startDate).format('YYYY-MM')" :start="'2024-01-01'" :end="end" @change="handleGetStartTime">{{startDate}}</picker>
<span class="timeSelect" style="margin: 0 4rpx">-</span> <span class="timeSelect" style="margin: 0 4rpx">-</span>
<picker class="timeSelect" mode="date" fields="month" :value="$moment(endDate).format('YYYY-MM')" :start="start" :end="end" @change="handleGetEndTime">{{endDate}}</picker> <picker class="timeSelect" mode="date" fields="month" :value="$moment(endDate).format('YYYY-MM')" :start="start" :end="end" @change="handleGetEndTime">{{endDate}}</picker>
</view> </view>
@ -666,7 +668,7 @@ export default {
border-bottom-right-radius: 16rpx; border-bottom-right-radius: 16rpx;
border-bottom-left-radius: 16rpx; border-bottom-left-radius: 16rpx;
box-sizing: border-box; box-sizing: border-box;
padding: 32rpx 32rpx 0; padding: 32rpx 32rpx 16rpx;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
flex-wrap: wrap; flex-wrap: wrap;
@ -719,6 +721,38 @@ export default {
.selectErrorItem{ .selectErrorItem{
background: #D9E9FF; background: #D9E9FF;
} }
.messageBox{
margin-top: 16rpx;
.messageIcon{
width: 48rpx;
height: 48rpx;
margin-right: 8rpx;
}
.messageType{
font-family: PingFangSC, PingFang SC;
font-weight: 400;
font-size: 28rpx;
color: #1979FE;
line-height: 36rpx;
text-align: left;
font-style: normal;
padding: 4rpx 12rpx;
background: #E3EFFF;
border-radius: 4rpx;
margin-right: 16rpx;
white-space: nowrap;
}
.messageDesc{
font-family: PingFangSC, PingFang SC;
font-weight: 400;
font-size: 28rpx;
color: #F07604;
line-height: 36rpx;
text-align: left;
font-style: normal;
white-space: nowrap;
}
}
} }
} }
} }