1434 lines
50 KiB
Vue
1434 lines
50 KiB
Vue
<template>
|
||
<view class="earlyWarningBox">
|
||
<view class="earlyTop">
|
||
<view class="earlyTopBg"></view>
|
||
<!-- top:menu.top + '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 class="backIconBox" @click="handleBack">
|
||
<image class="backIcon" src="https://eshangtech.com/ShopICO/ahyd-BID/commercial/navigation-left.svg" />
|
||
</view>
|
||
<view class="timeBox">
|
||
<view class="timeIconBox">
|
||
<image class="timeIcon" src="https://eshangtech.com/ShopICO/ahyd-BID/merchantAccount/selectIcon.svg" />
|
||
</view>
|
||
<text class="timeText" @click="handleShowPopup">{{ `${startDate}${endDate === startDate ? '' :
|
||
`-${endDate}`}` }}</text>
|
||
<!-- <uni-datetime-picker v-model="datetimerange" type="daterange"/>-->
|
||
<!-- <picker class="timeSelect" mode="date" fields="month" :end="end" onChange="handleGetStartTime(e)">{{startDate}}</picker>-->
|
||
<!-- <span class="timeSelect" style="margin: 0 4rpx">-</span>-->
|
||
<!-- <picker class="timeSelect" mode="date" fields="month" :end="end">{{endDate}}</picker>-->
|
||
<image class="downIcon" src="https://eshangtech.com/ShopICO/ahyd-BID/merchantAccount/downIcon.svg" />
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="errorWarning" :style="{ top: menu.bottom + 18 + 'px' }">
|
||
<view class="errorTitle">
|
||
<image class="warningIcon" src="https://eshangtech.com/ShopICO/ahyd-BID/warning/warningIcon.png" />
|
||
<text class="title">经营过程预警</text>
|
||
</view>
|
||
<view class="errorContent">
|
||
<view :class="selectTab === 1 ? 'contentItem selectItem' : 'contentItem'" @click="handleChangeWarningTab(1)">
|
||
<view style="display: flex;align-items: center">
|
||
<image class="itemIcon" src="https://eshangtech.com/ShopICO/ahyd-BID/merchantAccount/accountIcon.svg" />
|
||
<text class="contentText">车流增加，服务区营收减少</text>
|
||
</view>
|
||
<text class="value">{{ sumObj['车流增加，服务区营收减少'] || 0 }}</text>
|
||
</view>
|
||
|
||
<view :class="selectTab === 2 ? 'contentItem selectItem' : 'contentItem'" @click="handleChangeWarningTab(2)">
|
||
<view style="display: flex;align-items: center">
|
||
<image class="itemIcon" src="https://eshangtech.com/ShopICO/ahyd-BID/merchantAccount/entryIcon.svg" />
|
||
<text class="contentText">车流增加，门店的营收减少</text>
|
||
</view>
|
||
<text class="value">{{ sumObj['车流增加，门店的营收减少'] || 0 }}</text>
|
||
</view>
|
||
|
||
<view :class="selectTab === 3 ? 'contentItem selectItem' : 'contentItem'" @click="handleChangeWarningTab(3)">
|
||
<view style="display: flex;align-items: center">
|
||
<image class="itemIcon" src="https://eshangtech.com/ShopICO/ahyd-BID/merchantAccount/payIcon.svg" />
|
||
<text class="contentText">车流增加，营收增长不匹配</text>
|
||
</view>
|
||
<text class="value">{{ sumObj['车流增加，营收增长不匹配'] || 0 }}</text>
|
||
</view>
|
||
|
||
<view :class="selectTab === 4 ? 'contentItem selectItem' : 'contentItem'" style="margin-bottom: 0"
|
||
@click="handleChangeWarningTab(4)">
|
||
<view style="display: flex;align-items: center">
|
||
<image class="itemIcon" src="https://eshangtech.com/ShopICO/ahyd-BID/warning/dataIcon.png" />
|
||
<text class="contentText">车流减少，营收降低不匹配</text>
|
||
</view>
|
||
<text class="value">{{ sumObj['车流减少，营收降低不匹配'] || 0 }}</text>
|
||
</view>
|
||
|
||
<view class="descBox">
|
||
<view class="descTitle">
|
||
<text>预警说明：</text>
|
||
<view class="desc">
|
||
{{ '请重点关注带' }}
|
||
<image class="notice" src="https://eshangtech.com/ShopICO/ahyd-BID/warning/warningIcon.png" />
|
||
{{ selectTab === 1 ? '标识的服务区，入区车流增加自营商超营收同步增长，服务区整体营收呈现下降的情况！' :
|
||
selectTab === 2 ? '标识的服务区，入区车流增加自营商超营收同步增长，服务区部分门店营收呈现下降的情况！' :
|
||
selectTab === 3 ? '标识的服务区，营收与车流增幅产生较大差异的服务区！增幅差额=车流增幅-营收增幅，越大越不好，倒序排列' :
|
||
selectTab === 4 ? '标识的服务区，营收与车流降幅产生较大差异的服务区！增幅差额=销售增幅-车流降幅，越大越不好，倒序排列' : '' }}
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="servicepartContent">
|
||
<view class="contentTitle">
|
||
<view class="contentTitleLeft">
|
||
<image class="contentIcon" src="https://eshangtech.com/ShopICO/ahyd-BID/warning/foodIcon.png" />
|
||
<view class="titleBox">
|
||
<text class="title">服务区数据</text>
|
||
<text class="desc">/同比去年</text>
|
||
</view>
|
||
</view>
|
||
<view class="contentTitleRight">
|
||
<view class="fixedRight" @click="handleShowPopup">
|
||
<view v-if="searchCount > 0" class="searchCountBox">{{ searchCount }}</view>
|
||
<image v-else class="filterIcon" src="https://eshangtech.com/ShopICO/ahyd-BID/warning/filter.png" />
|
||
筛选
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
|
||
|
||
<view class="selectBox" v-if="false">
|
||
<view class="scrollBox">
|
||
<view :class="selectTab === 1 ? 'scrollItem selectScroll' : 'scrollItem'" @click="handleChangeWarningTab(1)">
|
||
<image class="itemImg" src="https://eshangtech.com/ShopICO/ahyd-BID/merchantAccount/accountIcon.svg" />
|
||
<text class="text">经营</text>
|
||
</view>
|
||
<view :class="selectTab === 2 ? 'scrollItem selectScroll' : 'scrollItem'" @click="handleChangeWarningTab(2)">
|
||
<image class="itemImg" src="https://eshangtech.com/ShopICO/ahyd-BID/merchantAccount/entryIcon.svg" />
|
||
<text class="text">营收</text>
|
||
</view>
|
||
<view :class="selectTab === 3 ? 'scrollItem selectScroll' : 'scrollItem'" @click="handleChangeWarningTab(3)">
|
||
<image class="itemImg" src="https://eshangtech.com/ShopICO/ahyd-BID/merchantAccount/payIcon.svg" />
|
||
<text class="text">增长</text>
|
||
</view>
|
||
<view :class="selectTab === 4 ? 'scrollItem selectScroll' : 'scrollItem'" @click="handleChangeWarningTab(4)">
|
||
<image class="itemImg" src="https://eshangtech.com/ShopICO/ahyd-BID/warning/dataIcon.png" />
|
||
<text class="text">减少</text>
|
||
</view>
|
||
</view>
|
||
<!-- <scroll-view scroll-x="true" class="scrollBox">-->
|
||
<!-- <view style="display: inline-block">-->
|
||
<!-- <view :class="selectTab===1?'scrollItem selectScroll':'scrollItem'" @click="handleChangeWarningTab(1)">-->
|
||
<!-- <image class="itemImg" src="https://eshangtech.com/ShopICO/ahyd-BID/merchantAccount/accountIcon.svg"/>-->
|
||
<!-- <text class="text">经营</text>-->
|
||
<!-- </view>-->
|
||
<!-- </view>-->
|
||
<!-- <view style="display: inline-block">-->
|
||
<!-- <view :class="selectTab===2?'scrollItem selectScroll':'scrollItem'" @click="handleChangeWarningTab(2)">-->
|
||
<!-- <image class="itemImg" src="https://eshangtech.com/ShopICO/ahyd-BID/merchantAccount/entryIcon.svg"/>-->
|
||
<!-- <text class="text">营收</text>-->
|
||
<!-- </view>-->
|
||
<!-- </view>-->
|
||
<!-- <view style="display: inline-block">-->
|
||
<!-- <view :class="selectTab===3?'scrollItem selectScroll':'scrollItem'" @click="handleChangeWarningTab(3)">-->
|
||
<!-- <image class="itemImg" src="https://eshangtech.com/ShopICO/ahyd-BID/merchantAccount/payIcon.svg"/>-->
|
||
<!-- <text class="text">增长</text>-->
|
||
<!-- </view>-->
|
||
<!-- </view>-->
|
||
<!-- <view style="display: inline-block">-->
|
||
<!-- <view :class="selectTab===4?'scrollItem selectScroll':'scrollItem'" @click="handleChangeWarningTab(4)">-->
|
||
<!-- <image class="itemImg" src="https://eshangtech.com/ShopICO/ahyd-BID/warning/dataIcon.png"/>-->
|
||
<!-- <text class="text">减少</text>-->
|
||
<!-- </view>-->
|
||
<!-- </view>-->
|
||
<!-- </scroll-view>-->
|
||
<!-- <view class="fixedRight" @click="handleShowPopup">-->
|
||
<!-- <view v-if="searchCount>0" class="searchCountBox">{{searchCount}}</view>-->
|
||
<!-- <image v-else class="filterIcon" src="https://eshangtech.com/ShopICO/ahyd-BID/warning/filter.png"/>-->
|
||
<!-- 筛选-->
|
||
<!-- </view>-->
|
||
</view>
|
||
|
||
<view class="dataList">
|
||
<view class="listTitle">
|
||
<view class="sortItem" style="width: 50%">
|
||
<text class="sortName">服务区名称</text>
|
||
</view>
|
||
|
||
<view class="sortItem" style="width: 25%;justify-content: flex-end" @click="handleChangeSortName(1)">
|
||
<text class="sortName">对客营收</text>
|
||
<view class="sortIconBox">
|
||
<image class="upIcon" :style="{ transform: sortName === 1 ? sortType === 1 ? `` : `rotate(180deg)` : `` }"
|
||
:src="sortType === 1 ? 'https://eshangtech.com/ShopICO/ahyd-BID/car/upDesc.svg' : sortName === 1 ? 'https://eshangtech.com/ShopICO/ahyd-BID/car/downDesc.svg' : 'https://eshangtech.com/ShopICO/ahyd-BID/car/upDesc.svg'" />
|
||
<image class="bottomIcon"
|
||
:style="{ transform: sortName === 1 ? sortType === 1 ? `` : `rotate(180deg)` : 'rotate(-180deg)' }"
|
||
:src="sortType === 1 && sortName === 1 ? 'https://eshangtech.com/ShopICO/ahyd-BID/car/downDesc.svg' : 'https://eshangtech.com/ShopICO/ahyd-BID/car/upDesc.svg'" />
|
||
</view>
|
||
</view>
|
||
<view class="sortItem" style="width: 25%;justify-content: flex-end" @click="handleChangeSortName(2)">
|
||
<text class="sortName">入区车流</text>
|
||
<view class="sortIconBox">
|
||
<image class="upIcon" :style="{ transform: sortName === 2 ? sortType === 1 ? `` : `rotate(180deg)` : `` }"
|
||
:src="sortType === 1 ? 'https://eshangtech.com/ShopICO/ahyd-BID/car/upDesc.svg' : sortName === 2 ? 'https://eshangtech.com/ShopICO/ahyd-BID/car/downDesc.svg' : 'https://eshangtech.com/ShopICO/ahyd-BID/car/upDesc.svg'" />
|
||
<image class="bottomIcon"
|
||
:style="{ transform: sortName === 2 ? sortType === 1 ? `` : `rotate(180deg)` : 'rotate(-180deg)' }"
|
||
:src="sortType === 1 && sortName === 2 ? 'https://eshangtech.com/ShopICO/ahyd-BID/car/downDesc.svg' : 'https://eshangtech.com/ShopICO/ahyd-BID/car/upDesc.svg'" />
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="listContent">
|
||
<view class="listItem" v-for="(item, index) in dataList" :key="index" @click="handleGoDetail(item)">
|
||
<view class="itemTop">
|
||
<view class="itemTopLeft">
|
||
<image v-if="index <= 2" class="topItemIcon"
|
||
:src="index === 0 ? 'https://eshangtech.com/ShopICO/ahyd-BID/warning/sort1st.png' : index === 1 ? 'https://eshangtech.com/ShopICO/ahyd-BID/warning/sort2st.png' : index === 2 ? 'https://eshangtech.com/ShopICO/ahyd-BID/warning/sort3st.png' : ''" />
|
||
<view class="otherIcon" v-else>{{ index + 1 }}</view>
|
||
<text class="name">{{ item.ServerpartName.split('服务区')[0] || '' }}</text>
|
||
<text class="unit">/服务区</text>
|
||
<image class="message" />
|
||
</view>
|
||
|
||
<view class="itemTopRight" @click.stop="handleGoDetail(item)">
|
||
<view class="warningNotice" v-if="item.showWarning">
|
||
<image class="notice" src="https://eshangtech.com/ShopICO/ahyd-BID/warning/warningIcon.png" />
|
||
<!-- <text class="shopNumber">{{ `${item.ShopINCList.length}个门店` }}</text>-->
|
||
</view>
|
||
<image class="moreIcon" src="https://eshangtech.com/ShopICO/ahyd-BID/newIndex3/goMore.svg" />
|
||
</view>
|
||
</view>
|
||
|
||
<view class="itemContent">
|
||
<view class="secondItem">
|
||
<view class="bgBox">
|
||
<image class="bg" src="https://eshangtech.com/ShopICO/ahyd-BID/warning/revenueBg.png" />
|
||
</view>
|
||
<view class="secondItemTop">
|
||
<view>
|
||
<text class="itemTopName">对客营收</text>
|
||
<text class="itemTopUnit">/万元</text>
|
||
</view>
|
||
<image v-if="false" class="addReduce"
|
||
:src="Number(item.RevenueINC.increaseRate) > 0 ? 'https://eshangtech.com/ShopICO/ahyd-BID/examine/add.svg' : Number(item.RevenueINC.increaseRate) < 0 ? 'https://eshangtech.com/ShopICO/ahyd-BID/examine/reduce.svg' : ''" />
|
||
|
||
</view>
|
||
<!-- <view :class="item.RevenueINC.curYearData<item.RevenueINC.lYearData?'itemGreenValue':'itemValue' ">{{ item.RevenueINC.curYearData?item.RevenueINC.curYearData>0?`+${$util.getMoney(item.RevenueINC.curYearData / 10000)}`:item.RevenueINC.curYearData<0?`${$util.getMoney(item.RevenueINC.curYearData / 10000)}`:'0':'-' }}</view>-->
|
||
<view class="normalValue">{{
|
||
item.RevenueINC.curYearData ? item.RevenueINC.curYearData > 0 ?
|
||
`+${$util.getMoney(item.RevenueINC.curYearData
|
||
/ 10000)}` : item.RevenueINC.curYearData < 0 ? `${$util.getMoney(item.RevenueINC.curYearData /
|
||
10000)}` : '0':'-' }}</view>
|
||
<view class="addRate" style="display: flex;align-items: center;justify-content: space-between">
|
||
<!-- 增长-->
|
||
<!-- <text :class="item.RevenueINC.increaseData>0?'redValue':item.RevenueINC.increaseData<0?'greenValue':''" style="margin-right: 8rpx">{{item.RevenueINC.increaseData?item.RevenueINC.increaseData>0?`+${$util.getMoney(item.RevenueINC.increaseData / 10000)}`:item.RevenueINC.increaseData<0?`${$util.getMoney(item.RevenueINC.increaseData / 10000)}`:'0':'-' }}</text>-->
|
||
<text class="normalValue" style="margin-right: 8rpx">{{ item.RevenueINC.increaseData ?
|
||
item.RevenueINC.increaseData > 0 ? `+${$util.getMoney(item.RevenueINC.increaseData
|
||
/ 10000)}` : item.RevenueINC.increaseData < 0 ? `${$util.getMoney(item.RevenueINC.increaseData /
|
||
10000)}`:'0':'-' }}</text>
|
||
<!-- 增幅-->
|
||
<text
|
||
:class="item.RevenueINC.increaseRate > 0 ? 'redValue' : item.RevenueINC.increaseRate < 0 ? 'greenValue' : ''">{{
|
||
item.RevenueINC.increaseRate ? item.RevenueINC.increaseRate > 0 ?
|
||
`+${item.RevenueINC.increaseRate}%` : item.RevenueINC.increaseRate < 0 ?
|
||
`${item.RevenueINC.increaseRate}%` : '0' : '-' }}</text>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="secondItem" @click="handleGoDetail(item)">
|
||
<view class="bgBox">
|
||
<image class="bg" src="https://eshangtech.com/ShopICO/ahyd-BID/warning/carBg.png" />
|
||
</view>
|
||
<view class="secondItemTop">
|
||
<view>
|
||
<text class="itemTopName">入区车流</text>
|
||
<text class="itemTopUnit">/万辆</text>
|
||
</view>
|
||
<image v-if="false" class="addReduce"
|
||
:src="Number(item.BayonetINC.increaseRate) > 0 ? 'https://eshangtech.com/ShopICO/ahyd-BID/examine/add.svg' : Number(item.BayonetINC.increaseRate) < 0 ? 'https://eshangtech.com/ShopICO/ahyd-BID/examine/reduce.svg' : ''" />
|
||
|
||
</view>
|
||
<!-- <view :class="item.BayonetINC.curYearData<item.BayonetINC.lYearData?'itemGreenValue':'itemValue' ">{{ item.BayonetINC.curYearData?item.BayonetINC.curYearData>0?`+${$util.getMoney(item.BayonetINC.curYearData / 10000)}`:item.BayonetINC.curYearData<0?`${$util.getMoney(item.BayonetINC.curYearData / 10000)}`:'0':'-' }}</view>-->
|
||
<view class="normalValue">{{
|
||
item.BayonetINC.curYearData ? item.BayonetINC.curYearData > 0 ?
|
||
`+${$util.getMoney(item.BayonetINC.curYearData
|
||
/ 10000)}` : item.BayonetINC.curYearData < 0 ? `${$util.getMoney(item.BayonetINC.curYearData /
|
||
10000)}`:'0':'-' }}</view>
|
||
<view class="addRate" style="display: flex;align-items: center;justify-content: space-between">
|
||
<!-- 增长-->
|
||
<!-- <text :class="item.BayonetINC.increaseData>0?'redValue':item.BayonetINC.increaseData<0?'greenValue':''" style="margin-right: 8rpx">{{item.BayonetINC.increaseData?item.BayonetINC.increaseData>0?`+${$util.getMoney(item.BayonetINC.increaseData / 10000)}`:item.BayonetINC.increaseData<0?`${$util.getMoney(item.BayonetINC.increaseData / 10000)}`:'0':'-' }}</text>-->
|
||
<text class="normalValue" style="margin-right: 8rpx">{{ item.BayonetINC.increaseData ?
|
||
item.BayonetINC.increaseData > 0 ? `+${$util.getMoney(item.BayonetINC.increaseData
|
||
/ 10000)}` : item.BayonetINC.increaseData < 0 ? `${$util.getMoney(item.BayonetINC.increaseData
|
||
/ 10000)}`:'0':'-' }}</text>
|
||
<!-- 增幅-->
|
||
<text
|
||
:class="item.BayonetINC.increaseRate > 0 ? 'redValue' : item.BayonetINC.increaseRate < 0 ? 'greenValue' : ''">{{
|
||
item.BayonetINC.increaseRate ? item.BayonetINC.increaseRate > 0 ?
|
||
`+${item.BayonetINC.increaseRate}%` : item.BayonetINC.increaseRate < 0 ?
|
||
`${item.BayonetINC.increaseRate}%` : '' : '-' }}</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<uniPopup type="bottom" :round="true" :show="showPop" @hidePopup="hidePopup">
|
||
<view class="uniPopup">
|
||
<view class="uniPopupTop">
|
||
<text class="uniPopupTitle">筛选</text>
|
||
<image @click="hidePopup" class="close" src="https://eshangtech.com/ShopICO/ahyd-BID/examine/close.svg">
|
||
</image>
|
||
</view>
|
||
|
||
<view class="filterBox">
|
||
<view class="filterTitle">统计时间</view>
|
||
<view class="filterTimeBox">
|
||
<picker class="timeSelect" mode="date" fields="month" :start="'2024-01-01'" :end="end"
|
||
@change="handleGetStartTime">{{ startDate }}</picker>
|
||
<span class="timeSelect" style="margin: 0 4rpx">-</span>
|
||
<picker class="timeSelect" mode="date" fields="month" :start="start" :end="end"
|
||
@change="handleGetEndTime">{{ endDate }}</picker>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="filterBox" style="margin-top: 48rpx">
|
||
<view class="filterTitle">经营模式</view>
|
||
<view class="filterItemList">
|
||
<view :class="statisticsType === 1 ? 'filterItem selectFilterItem' : 'filterItem'"
|
||
@click="handleChangeStaticType(1)">便利店</view>
|
||
<view :class="statisticsType === 2 ? 'filterItem selectFilterItem' : 'filterItem'"
|
||
@click="handleChangeStaticType(2)">餐饮客房</view>
|
||
<view :class="statisticsType === 3 ? 'filterItem selectFilterItem' : 'filterItem'"
|
||
@click="handleChangeStaticType(3)">商铺租赁</view>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="filterBox" style="margin-top: 48rpx">
|
||
<view class="filterTitle">经营业态</view>
|
||
<view class="filterItemList">
|
||
<view :class="shopTrade === item.value ? 'filterItem selectFilterItem' : 'filterItem'"
|
||
v-for="(item, index) in shopTradeList" :key="index" @click="handleChangeShopTrade(item.value)">
|
||
{{ item.label }}</view>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="filterBox" style="margin-top: 48rpx">
|
||
<view class="filterTitle">排行类型</view>
|
||
<view class="filterItemList">
|
||
<view :class="sorterType === 1 ? 'filterItem selectFilterItem' : 'filterItem'"
|
||
@click="handleChangeSorterType(1)">全局排行</view>
|
||
<view :class="sorterType === 2 ? 'filterItem selectFilterItem' : 'filterItem'"
|
||
@click="handleChangeSorterType(2)">管理排行</view>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="button" @click="handleSubmit">确定</view>
|
||
</view>
|
||
</uniPopup>
|
||
</view>
|
||
</template>
|
||
<script>
|
||
import moment from "moment";
|
||
import request from '@/util/index.js'
|
||
import UniPopup from "../../components/uni-popup.vue";
|
||
import { wrapTreeNode } from "../../util/dateTime";
|
||
export default {
|
||
name: "index",
|
||
components: { UniPopup },
|
||
data() {
|
||
return {
|
||
menu: {},
|
||
showPop: false,// 弹出框
|
||
// datetimerange:[moment().format('YYYY/MM'),moment().format('YYYY/MM')]
|
||
startDate: moment().subtract(1, 'months').format('YYYY/MM'),//开始时间
|
||
endDate: moment().subtract(1, 'months').format('YYYY/MM'),// 结束时间
|
||
start: moment().subtract(1, 'months').format('YYYY-MM'),// 结束时间开始范围
|
||
end: moment().format('YYYY-MM-DD'),// 结束的时间范围
|
||
useInfo: {},// 用户信息
|
||
statisticsType: 0,// 经营模式
|
||
shopTrade: 0,// 经营业态
|
||
shopTradeList: [],// 经营业态数组
|
||
sorterType: 2,// 排行类型
|
||
selectTab: 1,// 选择的tab
|
||
dataList: [],// 遍历的展示数组
|
||
sumObj: {},// 合计对象
|
||
searchCount: 0,// 搜索条件的数量
|
||
sortName: 1,// 1是对客销售 2是入区车流
|
||
sortType: 1,// 1是降序 2是升序
|
||
allServerPartId: '',// 所有服务区
|
||
}
|
||
},
|
||
onLoad(query) {
|
||
let systemInfo = uni.getSystemInfoSync()
|
||
this.menu = uni.getMenuButtonBoundingClientRect()
|
||
|
||
let userInfo = uni.getStorageSync('vuex')
|
||
userInfo = JSON.parse(userInfo)
|
||
this.useInfo = JSON.parse(JSON.stringify(userInfo))
|
||
|
||
let serverList = this.useInfo.userData.serverPartList
|
||
let serverPartId = ''
|
||
if (serverList && serverList.length > 0) {
|
||
serverList.forEach(item => {
|
||
if (serverPartId) {
|
||
serverPartId += `,${item.value}`
|
||
} else {
|
||
serverPartId = item.value
|
||
}
|
||
})
|
||
}
|
||
this.allServerPartId = serverPartId
|
||
|
||
this.handleBrandType()
|
||
|
||
this.handleGetWarningNumber()
|
||
this.handleGetPageData()
|
||
|
||
this.handleGetSearchCount()
|
||
},
|
||
methods: {
|
||
// 修改排序
|
||
handleChangeSortName(value) {
|
||
if (value === this.sortName) {
|
||
if (this.sortType === 1) {
|
||
this.sortType = 0
|
||
} else {
|
||
this.sortType = 1
|
||
}
|
||
} else {
|
||
this.sortName = value
|
||
this.sortType = 1
|
||
}
|
||
this.dataList = this.handleSortList(this.dataList)
|
||
},
|
||
// 显示弹出框
|
||
handleShowPopup() {
|
||
this.showPop = true
|
||
},
|
||
// 隐藏弹出框
|
||
hidePopup() {
|
||
this.showPop = false
|
||
},
|
||
// 修改开始时间
|
||
handleGetStartTime(e) {
|
||
console.log('e', e)
|
||
this.start = e.detail.value
|
||
this.startDate = moment(e.detail.value).format('YYYY/MM')
|
||
},
|
||
// 修改结束时间
|
||
handleGetEndTime(e) {
|
||
console.log('e', e)
|
||
this.endDate = moment(e.detail.value).format('YYYY/MM')
|
||
console.log('this.endDate', this.endDate)
|
||
},
|
||
// 经营业态数据
|
||
async handleBrandType() {
|
||
const req = {
|
||
FieldExplainField: 'BusinessTradeIds',
|
||
sessionName: 'BusinessTradeIds'
|
||
}
|
||
const data = await request.$webGet('EShangApiMain/FrameWork/GetFieldEnumTree', req)
|
||
const list = wrapTreeNode(data.Result_Data.List)
|
||
this.shopTradeList = list
|
||
},
|
||
// 修改经营模式
|
||
handleChangeStaticType(e) {
|
||
if (this.statisticsType === e) {
|
||
this.statisticsType = 0
|
||
} else {
|
||
this.statisticsType = e
|
||
}
|
||
},
|
||
// 修改经营业态
|
||
handleChangeShopTrade(e) {
|
||
if (this.shopTrade === e) {
|
||
this.shopTrade = 0
|
||
} else {
|
||
this.shopTrade = e
|
||
}
|
||
},
|
||
// 修改预警类型的tab
|
||
handleChangeWarningTab(e) {
|
||
this.selectTab = e
|
||
this.dataList = []
|
||
this.handleGetPageData()
|
||
},
|
||
// 修改排行类型
|
||
handleChangeSorterType(e) {
|
||
if (this.sorterType === e) {
|
||
this.sorterType = 0
|
||
} else {
|
||
this.sorterType = e
|
||
}
|
||
},
|
||
// 查询条件有多少个
|
||
handleGetSearchCount() {
|
||
// 多少个查询条件
|
||
let num = 0
|
||
if (this.startDate || this.endDate) {
|
||
num += 1
|
||
}
|
||
if (this.statisticsType > 0) {
|
||
num += 1
|
||
}
|
||
if (this.shopTrade > 0) {
|
||
num += 1
|
||
}
|
||
if (this.sorterType > 0) {
|
||
num += 1
|
||
}
|
||
this.searchCount = num
|
||
console.log('searchCount', this.searchCount)
|
||
},
|
||
// 确定按钮
|
||
handleSubmit() {
|
||
this.handleGetSearchCount()
|
||
this.showPop = false
|
||
this.handleGetWarningNumber()
|
||
this.handleGetPageData()
|
||
},
|
||
// 跳转详情
|
||
handleGoDetail(obj) {
|
||
let date = ''
|
||
let currentYear = new Date(this.startDate.replace('/', '-')).getFullYear()
|
||
if (this.startDate === this.endDate) {
|
||
let month = new Date(this.startDate.replace('/', '-')).getMonth() + 1
|
||
console.log('month', month)
|
||
date = `${month < 10 ? '0' + month : month}月`
|
||
} else {
|
||
date = `${moment(this.startDate.replace('/', '-')).format('YYYYMM')}-${moment(this.endDate.replace('/', '-')).format('YYYYMM')}`
|
||
}
|
||
|
||
this.$util.toNextRoute('navigateTo', `/pages/earlyWarning/detail?obj=${JSON.stringify(obj)}&date=${date}&type=${this.selectTab}¤tYear=${currentYear}`)
|
||
},
|
||
// 返回上一级
|
||
handleBack() {
|
||
uni.navigateBack({
|
||
delta: 1
|
||
})
|
||
},
|
||
// 异常合计数量
|
||
async handleGetWarningNumber() {
|
||
const req = {
|
||
StatisticsStartMonth: this.startDate.replace('/', ''),
|
||
StatisticsEndMonth: this.endDate.replace('/', ''),
|
||
BusinessTradeType: this.statisticsType || '',
|
||
shopTrade: this.shopTrade || ''
|
||
}
|
||
const data = await request.$webGet('/CommercialApi/Revenue/GetMonthINCAnalysisSummary', req)
|
||
console.log('data2312312', data)
|
||
let list = data.Result_Data.List
|
||
let obj = {}
|
||
if (list && list.length > 0) {
|
||
list.forEach(item => {
|
||
obj[item.name] = item.value
|
||
})
|
||
}
|
||
this.sumObj = obj
|
||
},
|
||
// 请求页面数据
|
||
async handleGetPageData() {
|
||
uni.showLoading({
|
||
title: '正在加载...'
|
||
})
|
||
const params = {
|
||
pushProvinceCode: this.useInfo.userData.ProvinceCode || '340000',
|
||
StatisticsStartMonth: this.startDate.replace('/', ''),
|
||
StatisticsEndMonth: this.endDate.replace('/', ''),
|
||
// businessRegion:1,
|
||
calcQOQ: false,
|
||
calcYOY: true,
|
||
calcBayonet: true,
|
||
sorterType: this.sorterType || '',
|
||
BusinessTradeType: this.statisticsType || '',
|
||
// shopTrade: this.shopTrade || '',
|
||
// showLevel: this.sorterType || '',
|
||
waringType: this.selectTab,
|
||
ServerpartId: this.allServerPartId || ''
|
||
}
|
||
let req = {}
|
||
if (this.selectTab === 1) {
|
||
req = {
|
||
...params,
|
||
showBayonet: 1,
|
||
showRevenue: 2,
|
||
showLevel: 1
|
||
}
|
||
} else if (this.selectTab === 2) {
|
||
req = {
|
||
...params,
|
||
showBayonet: 1,
|
||
showRevenue: 2,
|
||
showLevel: 2
|
||
}
|
||
} else if (this.selectTab === 3) {
|
||
req = {
|
||
...params,
|
||
showBayonet: 1,
|
||
showRevenue: 1,
|
||
}
|
||
} else if (this.selectTab === 4) {
|
||
req = {
|
||
...params,
|
||
showBayonet: 2,
|
||
showRevenue: 2,
|
||
}
|
||
}
|
||
console.log('req2312312', req)
|
||
const data = await request.$webGet('CommercialApi/Revenue/GetMonthINCAnalysis', req)
|
||
if (data.Result_Data.List && data.Result_Data.List.length > 0) {
|
||
let list = wrapTreeNode(data.Result_Data.List)
|
||
console.log('list', list)
|
||
|
||
let res = []
|
||
list.forEach(item => {
|
||
if (item.children && item.children.length > 0) {
|
||
item.children.forEach((subItem) => {
|
||
if (subItem.children && subItem.children.length > 0) {
|
||
subItem.children.forEach((thirdItem) => {
|
||
if (thirdItem.ShopINCList && thirdItem.ShopINCList.length > 0) {
|
||
thirdItem.ShopINCList.forEach(fourth => {
|
||
if (fourth.ServerpartShopName === '自营超市' && fourth.RevenueINC.increaseRate > 0) {
|
||
thirdItem.showWarning = true
|
||
}
|
||
})
|
||
}
|
||
res.push(thirdItem)
|
||
})
|
||
}
|
||
})
|
||
}
|
||
})
|
||
console.log('res', res)
|
||
this.dataList = this.handleSortList(res)
|
||
}
|
||
uni.hideLoading()
|
||
},
|
||
// 排序方法
|
||
handleSortList(list) {
|
||
var len = list.length;
|
||
for (var i = 0; i < len - 1; i++) {
|
||
for (var j = 0; j < len - 1 - i; j++) {
|
||
if (this.sortType === 1) {
|
||
if (this.sortName === 1) {
|
||
if (list[j].RevenueINC.curYearData < list[j + 1].RevenueINC.curYearData) { // 比较相邻元素大小并交换位置
|
||
var temp = list[j];
|
||
list[j] = list[j + 1];
|
||
list[j + 1] = temp;
|
||
}
|
||
} else if (this.sortName === 2) {
|
||
if (list[j].BayonetINC.curYearData < list[j + 1].BayonetINC.curYearData) { // 比较相邻元素大小并交换位置
|
||
var temp = list[j];
|
||
list[j] = list[j + 1];
|
||
list[j + 1] = temp;
|
||
}
|
||
}
|
||
} else {
|
||
if (this.sortName === 1) {
|
||
if (list[j].RevenueINC.curYearData > list[j + 1].RevenueINC.curYearData) { // 比较相邻元素大小并交换位置
|
||
var temp = list[j];
|
||
list[j] = list[j + 1];
|
||
list[j + 1] = temp;
|
||
}
|
||
} else if (this.sortName === 2) {
|
||
if (list[j].BayonetINC.curYearData > list[j + 1].BayonetINC.curYearData) { // 比较相邻元素大小并交换位置
|
||
var temp = list[j];
|
||
list[j] = list[j + 1];
|
||
list[j + 1] = temp;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
return list
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
<style scoped lang="scss">
|
||
.earlyWarningBox {
|
||
width: 100%;
|
||
background: #F3F3F3;
|
||
|
||
.earlyTop {
|
||
width: 100%;
|
||
height: 780rpx;
|
||
background: #F3F3F3;
|
||
position: relative;
|
||
|
||
.earlyTopBg {
|
||
width: 100%;
|
||
height: 430rpx;
|
||
background: linear-gradient(180deg, #D8E3FF 0%, #F3F3F3 100%);
|
||
}
|
||
|
||
.headerBox {
|
||
width: 100%;
|
||
position: fixed;
|
||
left: 0;
|
||
top: 0;
|
||
z-index: 20;
|
||
box-sizing: border-box;
|
||
background: linear-gradient(180deg, #D8E3FF 0%, #E5EBF9 100%);
|
||
//padding: 32rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
.backIconBox {
|
||
width: 48rpx;
|
||
height: 48rpx;
|
||
margin-right: 18rpx;
|
||
|
||
.backIcon {
|
||
width: 100%;
|
||
height: 100%;
|
||
}
|
||
}
|
||
|
||
.timeBox {
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
.timeIconBox {
|
||
width: 40rpx;
|
||
height: 40rpx;
|
||
margin-right: 12rpx;
|
||
|
||
.timeIcon {
|
||
width: 100%;
|
||
height: 100%;
|
||
}
|
||
}
|
||
|
||
.timeText {
|
||
font-family: AlimamaShuHeiTi, AlimamaShuHeiTi;
|
||
font-weight: bold;
|
||
font-size: 32rpx;
|
||
color: #000000;
|
||
line-height: 40rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
}
|
||
|
||
.timeSelect {
|
||
font-family: AlimamaShuHeiTi, AlimamaShuHeiTi;
|
||
font-weight: bold;
|
||
font-size: 32rpx;
|
||
color: #000000;
|
||
line-height: 40rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
}
|
||
|
||
.downIcon {
|
||
width: 30rpx;
|
||
height: 24rpx;
|
||
margin-right: 8rpx;
|
||
}
|
||
}
|
||
}
|
||
|
||
.errorWarning {
|
||
width: 100%;
|
||
box-sizing: border-box;
|
||
padding: 0 32rpx;
|
||
position: absolute;
|
||
left: 0;
|
||
|
||
.errorTitle {
|
||
width: 100%;
|
||
height: 88rpx;
|
||
background: linear-gradient(180deg, #F2F3FF 0%, #F7F8FF 100%);
|
||
border-top-right-radius: 16rpx;
|
||
border-top-left-radius: 16rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
box-sizing: border-box;
|
||
padding: 24rpx;
|
||
|
||
.warningIcon {
|
||
width: 40rpx;
|
||
height: 40rpx;
|
||
margin-right: 8rpx;
|
||
}
|
||
|
||
.title {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 600;
|
||
font-size: 28rpx;
|
||
color: #212226;
|
||
line-height: 40rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
}
|
||
}
|
||
|
||
.errorContent {
|
||
width: 100%;
|
||
//height: 328rpx;
|
||
background: #FFFFFF;
|
||
border-bottom-right-radius: 16rpx;
|
||
border-bottom-left-radius: 16rpx;
|
||
box-sizing: border-box;
|
||
padding: 12rpx 12rpx 24rpx;
|
||
|
||
.contentItem {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
padding: 12rpx 12rpx;
|
||
border-radius: 12rpx;
|
||
|
||
//margin-bottom: 24rpx;
|
||
.itemIcon {
|
||
width: 48rpx;
|
||
height: 48rpx;
|
||
margin-right: 8rpx;
|
||
}
|
||
|
||
.contentText {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 26rpx;
|
||
color: #160002;
|
||
line-height: 40rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
}
|
||
|
||
.value {
|
||
font-family: DINAlternate, DINAlternate;
|
||
font-size: 28rpx;
|
||
color: #160002;
|
||
line-height: 42rpx;
|
||
text-align: center;
|
||
font-style: normal;
|
||
}
|
||
}
|
||
|
||
.selectItem {
|
||
background: #D9E9FF;
|
||
}
|
||
|
||
.descBox {
|
||
width: 100%;
|
||
background: #F8F8F8;
|
||
border-radius: 16rpx;
|
||
box-sizing: border-box;
|
||
padding: 16rpx;
|
||
margin-top: 24rpx;
|
||
|
||
.descTitle {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 24rpx;
|
||
color: gray;
|
||
|
||
.desc {
|
||
color: red;
|
||
display: inline;
|
||
font-size: 24rpx;
|
||
|
||
.notice {
|
||
width: 30rpx;
|
||
height: 30rpx;
|
||
margin: 0 8rpx;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.servicepartContent {
|
||
width: 100%;
|
||
//height: calc(100vh - 616rpx);
|
||
border-top-left-radius: 32rpx;
|
||
border-top-right-radius: 32rpx;
|
||
background: #fff;
|
||
box-sizing: border-box;
|
||
padding: 32rpx;
|
||
|
||
.contentTitle {
|
||
width: 100%;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
|
||
.contentTitleLeft {
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
.contentIcon {
|
||
width: 48rpx;
|
||
height: 48rpx;
|
||
}
|
||
|
||
.titleBox {
|
||
margin-left: 12rpx;
|
||
|
||
.title {
|
||
font-size: 32rpx;
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 600;
|
||
color: #160002;
|
||
line-height: 44rpx;
|
||
}
|
||
|
||
.desc {
|
||
font-size: 24rpx;
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
color: #9A9A9A;
|
||
line-height: 36rpx;
|
||
margin-left: 8rpx;
|
||
}
|
||
}
|
||
}
|
||
|
||
.contentTitleRight {
|
||
.fixedRight {
|
||
width: 138rpx;
|
||
height: 72rpx;
|
||
background: #fff;
|
||
box-sizing: border-box;
|
||
padding: 22rpx 0 22rpx 22rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: flex-end;
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 28rpx;
|
||
color: #160002;
|
||
line-height: 40rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
|
||
.filterIcon {
|
||
width: 24rpx;
|
||
height: 28rpx;
|
||
margin-right: 4rpx;
|
||
}
|
||
|
||
.searchCountBox {
|
||
width: 28rpx;
|
||
height: 28rpx;
|
||
background: #2363FF;
|
||
border-radius: 15rpx;
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 24rpx;
|
||
color: #FFFFFF;
|
||
line-height: 24rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
margin-right: 6rpx;
|
||
}
|
||
}
|
||
}
|
||
|
||
}
|
||
|
||
.selectBox {
|
||
width: 100%;
|
||
height: 72rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
margin-top: 28rpx;
|
||
|
||
.scrollBox {
|
||
//width: calc(100% - 140rpx);
|
||
width: 100%;
|
||
height: 72rpx;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
|
||
//white-space: nowrap;
|
||
.scrollItem {
|
||
background: #F5F5F5;
|
||
border-radius: 8rpx;
|
||
margin-right: 16rpx;
|
||
padding: 16rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
.itemImg {
|
||
width: 48rpx;
|
||
height: 48rpx;
|
||
margin-right: 8rpx;
|
||
}
|
||
|
||
.text {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 26rpx;
|
||
color: #786B6C;
|
||
line-height: 40rpx;
|
||
text-align: right;
|
||
font-style: normal;
|
||
}
|
||
}
|
||
|
||
.selectScroll {
|
||
background: #ECF2FF !important;
|
||
|
||
.text {
|
||
color: #2363FF !important;
|
||
}
|
||
}
|
||
}
|
||
|
||
.fixedRight {
|
||
width: 138rpx;
|
||
height: 72rpx;
|
||
background: #fff;
|
||
box-sizing: border-box;
|
||
padding: 22rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 28rpx;
|
||
color: #160002;
|
||
line-height: 40rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
|
||
.filterIcon {
|
||
width: 24rpx;
|
||
height: 28rpx;
|
||
margin-right: 4rpx;
|
||
}
|
||
|
||
.searchCountBox {
|
||
width: 28rpx;
|
||
height: 28rpx;
|
||
background: #2363FF;
|
||
border-radius: 15rpx;
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 24rpx;
|
||
color: #FFFFFF;
|
||
line-height: 24rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
margin-right: 6rpx;
|
||
}
|
||
}
|
||
}
|
||
|
||
.dataList {
|
||
width: 100%;
|
||
background: #fff;
|
||
//height: calc(100% - 200rpx);
|
||
margin-top: 24rpx;
|
||
|
||
.listTitle {
|
||
display: flex;
|
||
align-items: center;
|
||
border-bottom: 1px solid #F1F1F1;
|
||
padding-bottom: 16rpx;
|
||
|
||
.titleName {
|
||
font-size: 24rpx;
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
color: #9A9A9A;
|
||
line-height: 36rpx;
|
||
}
|
||
|
||
.sortItem {
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
.sortName {
|
||
font-size: 24rpx;
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
color: #9A9A9A;
|
||
line-height: 36rpx;
|
||
}
|
||
|
||
.sortIconBox {
|
||
display: flex;
|
||
flex-direction: column;
|
||
margin-left: 16rpx;
|
||
|
||
.upIcon {
|
||
width: 16rpx;
|
||
height: 12rpx;
|
||
margin-bottom: 4rpx;
|
||
}
|
||
|
||
.bottomIcon {
|
||
width: 16rpx;
|
||
height: 12rpx;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.listContent {
|
||
width: 100%;
|
||
height: calc(100% - 60rpx);
|
||
margin-top: 24rpx;
|
||
|
||
.listItem {
|
||
width: 100%;
|
||
margin-bottom: 40rpx;
|
||
|
||
.itemTop {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
|
||
.itemTopLeft {
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
.topItemIcon {
|
||
width: 40rpx;
|
||
height: 40rpx;
|
||
}
|
||
|
||
.otherIcon {
|
||
width: 40rpx;
|
||
height: 40rpx;
|
||
border-radius: 50%;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
background-image: url("https://eshangtech.com/ShopICO/ahyd-BID/warning/sortOther.png");
|
||
background-repeat: no-repeat;
|
||
background-size: 100% 100%;
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 600;
|
||
font-size: 24rpx;
|
||
color: #FFFFFF;
|
||
line-height: 24rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
}
|
||
|
||
.name {
|
||
font-size: 28rpx;
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
color: #160002;
|
||
line-height: 40rpx;
|
||
}
|
||
|
||
.unit {
|
||
font-size: 24rpx;
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
color: #9A9A9A;
|
||
line-height: 36rpx;
|
||
margin-left: 4rpx;
|
||
white-space: nowrap;
|
||
}
|
||
|
||
.message {
|
||
width: 32rpx;
|
||
height: 32rpx;
|
||
}
|
||
}
|
||
|
||
.itemTopRight {
|
||
flex: 1;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: flex-end;
|
||
|
||
.warningNotice {
|
||
display: flex;
|
||
align-items: center;
|
||
margin-right: 16rpx;
|
||
|
||
.notice {
|
||
width: 40rpx;
|
||
height: 40rpx;
|
||
margin-right: 8rpx;
|
||
}
|
||
|
||
.shopNumber {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 600;
|
||
font-size: 28rpx;
|
||
color: #FF4C0A;
|
||
line-height: 40rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
}
|
||
}
|
||
|
||
.moreIcon {
|
||
width: 32rpx;
|
||
height: 32rpx;
|
||
}
|
||
}
|
||
}
|
||
|
||
.itemContent {
|
||
width: 100%;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
margin-top: 16rpx;
|
||
|
||
.secondItem {
|
||
width: calc((100% - 18rpx) / 2);
|
||
background: #F7F8FA;
|
||
border-radius: 8rpx;
|
||
padding: 16rpx 24rpx;
|
||
box-sizing: border-box;
|
||
position: relative;
|
||
|
||
.bg {
|
||
position: absolute;
|
||
bottom: 0;
|
||
right: 0;
|
||
width: 120rpx;
|
||
height: 120rpx;
|
||
overflow: hidden;
|
||
|
||
.bg {
|
||
width: 144rpx;
|
||
height: 144rpx
|
||
}
|
||
}
|
||
|
||
.secondItemTop {
|
||
margin-bottom: 4rpx;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
|
||
.itemTopName {
|
||
font-size: 28rpx;
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
color: #160002;
|
||
line-height: 40rpx;
|
||
}
|
||
|
||
.itemTopUnit {
|
||
font-size: 24rpx;
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
color: #9A9A9A;
|
||
line-height: 36rpx;
|
||
margin-left: 4rpx;
|
||
}
|
||
|
||
.addReduce {
|
||
width: 28rpx;
|
||
height: 28rpx;
|
||
margin-right: 4px;
|
||
border-radius: 50%;
|
||
}
|
||
}
|
||
|
||
.normalValue {
|
||
font-family: DINAlternate, DINAlternate;
|
||
font-size: 24rpx;
|
||
color: #9A9A9A;
|
||
line-height: 40rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
}
|
||
|
||
.itemValue {
|
||
font-family: DINAlternate, DINAlternate;
|
||
font-weight: bold;
|
||
font-size: 28rpx;
|
||
color: #E83944;
|
||
line-height: 40rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
}
|
||
|
||
.itemGreenValue {
|
||
font-family: DINAlternate, DINAlternate;
|
||
font-weight: bold;
|
||
font-size: 28rpx;
|
||
color: #127E5B;
|
||
line-height: 40rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
}
|
||
|
||
.addRate {
|
||
margin-top: 4rpx;
|
||
|
||
.normalValue {
|
||
font-family: DINAlternate, DINAlternate;
|
||
font-size: 24rpx;
|
||
color: #9A9A9A;
|
||
line-height: 32rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
}
|
||
|
||
.redValue {
|
||
font-family: DINAlternate, DINAlternate;
|
||
font-weight: bold;
|
||
font-size: 28rpx;
|
||
color: #E83944;
|
||
line-height: 32rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
}
|
||
|
||
.greenValue {
|
||
font-family: DINAlternate, DINAlternate;
|
||
font-weight: bold;
|
||
font-size: 28rpx;
|
||
color: #127E5B;
|
||
line-height: 32rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
}
|
||
|
||
.unit {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 24rpx;
|
||
color: #9A9A9A;
|
||
line-height: 32rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
margin-left: 8rpx;
|
||
white-space: nowrap;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.uniPopup {
|
||
width: 100%;
|
||
height: 1050rpx;
|
||
box-sizing: border-box;
|
||
padding: 32rpx;
|
||
|
||
.uniPopupTop {
|
||
width: 100%;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
|
||
.uniPopupTitle {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 600;
|
||
font-size: 32rpx;
|
||
color: #160002;
|
||
line-height: 44rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
}
|
||
|
||
.close {
|
||
width: 40rpx;
|
||
height: 40rpx;
|
||
}
|
||
|
||
}
|
||
|
||
.filterBox {
|
||
margin-top: 40rpx;
|
||
|
||
.filterTitle {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 600;
|
||
font-size: 28rpx;
|
||
color: #212226;
|
||
line-height: 40rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
}
|
||
|
||
.filterItemList {
|
||
margin: 24rpx;
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
|
||
.filterItem {
|
||
width: calc((100% - 32rpx)/3);
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
margin-right: 16rpx;
|
||
margin-bottom: 16rpx;
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 28rpx;
|
||
color: #160002;
|
||
line-height: 40rpx;
|
||
text-align: right;
|
||
font-style: normal;
|
||
background: #F5F5F5;
|
||
border-radius: 8rpx;
|
||
padding: 12rpx 0;
|
||
}
|
||
|
||
.selectFilterItem {
|
||
color: #2363FF;
|
||
background: #ECF2FF;
|
||
}
|
||
|
||
.filterItem:nth-child(3) {
|
||
margin-right: 0;
|
||
}
|
||
}
|
||
|
||
.filterTimeBox {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
margin-top: 24rpx;
|
||
|
||
.timeSelect {
|
||
width: calc((100% - 20px)/2);
|
||
}
|
||
}
|
||
}
|
||
|
||
.button {
|
||
background: #2363FF;
|
||
border-radius: 8rpx;
|
||
width: calc(100% - 64rpx);
|
||
height: 88rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 32rpx;
|
||
color: #FFFFFF;
|
||
line-height: 44rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
position: fixed;
|
||
bottom: 32rpx;
|
||
left: 50%;
|
||
transform: translateX(-50%);
|
||
}
|
||
}
|
||
}
|
||
</style>
|