1622 lines
52 KiB
Vue
1622 lines
52 KiB
Vue
<template>
|
|
<div class="main">
|
|
<div
|
|
:class="
|
|
selectFestival === 1 || selectFestival === 2
|
|
? 'top springTop'
|
|
: selectFestival === 3
|
|
? 'top qmTop'
|
|
: selectFestival ===4
|
|
? 'top labourTop'
|
|
: selectFestival === 5
|
|
? 'top dragonBoatTop'
|
|
: selectFestival === 6
|
|
? 'top summerHolidayTop'
|
|
: selectFestival === 7
|
|
? 'top midAutumnTop'
|
|
: selectFestival === 8
|
|
? 'top nationalDayTop'
|
|
: ''
|
|
"
|
|
>
|
|
<div
|
|
:class="
|
|
selectFestival === 1 || selectFestival === 2
|
|
? 'header headerSpring'
|
|
: selectFestival === 3
|
|
? 'header headerQm'
|
|
: selectFestival === 4
|
|
? 'header headerlabour'
|
|
: selectFestival === 5
|
|
? 'header headerDragonBoat'
|
|
: selectFestival === 6
|
|
? 'header headerSummerHoliday'
|
|
: selectFestival === 7
|
|
? 'header headerMidAutumn'
|
|
: selectFestival === 8
|
|
? 'header headerNationalDay'
|
|
: ''
|
|
"
|
|
:style="{ height: menu.height + menu.top + 'px', top: 0 + 'px' }"
|
|
>
|
|
<image
|
|
:style="{ bottom: (statusBarHeight - 24) / 4 + 'px' }"
|
|
class="backArrow"
|
|
src="https://eshangtech.com/ShopICO/ahyd-BID/examine/leftArrowWhite.svg"
|
|
@click="handleBack"
|
|
/>
|
|
<!-- <img :style="{bottom: ((statusBarHeight-24)/4)+'px' }" class="detailIcon" src="https://eshangtech.com/ShopICO/ahyd-BID/newIndex3/serverPartDetail.png">-->
|
|
<div v-if="showSpring" class="picker" @click="handleGoMap">
|
|
<div class="selectService">
|
|
<image
|
|
class="img"
|
|
src="https://eshangtech.com/ShopICO/ahyd-BID/commercial/fixed.svg"
|
|
></image>
|
|
<view class="select">
|
|
<view class="content">
|
|
<view class="uni-input">{{
|
|
springService.SERVERPART_NAME
|
|
}}</view>
|
|
<p class="area" v-if="springService.Serverpart_ID">
|
|
{{ springService.SPREGIONTYPE_NAME }}
|
|
</p>
|
|
<image
|
|
class="rightArrow"
|
|
src="https://eshangtech.com/ShopICO/ahyd-BID/commercial/rightArrow.svg"
|
|
></image>
|
|
</view>
|
|
</view>
|
|
</div>
|
|
</div>
|
|
|
|
<view
|
|
v-else
|
|
class="seachBox"
|
|
:style="{ height: menu.height + 'px' }"
|
|
@click="handleGoMap"
|
|
>
|
|
<image class="searchIcon" src="/static/images/seach/searchIcon.svg" />
|
|
<text class="searchText">请输入想看的服务区</text>
|
|
</view>
|
|
</div>
|
|
|
|
<!-- <scroll-view :style="{top:menu.bottom + 24 + 'px' }" scroll-x="true" class="headerNavList" :scrollIntoView="currentServerPart" :scroll-with-animation="true">-->
|
|
<!-- <div :class="currentServerPart==='ServerPart'+item.value?'scrollItem selectItem':'scrollItem'" v-for="(item,index) in ServerpartList" :key="index" :id="'ServerPart'+item.value" @click="handleChangeServerPart(item.value)">{{item.name.split('服务区')[0]}}</div>-->
|
|
<!-- </scroll-view>-->
|
|
</div>
|
|
<div class="contentPage">
|
|
<div
|
|
:class="
|
|
selectFestival === 1 || selectFestival === 2
|
|
? 'contentTop springContentTop'
|
|
: selectFestival === 3
|
|
? 'contentTop qmContentTop'
|
|
: selectFestival === 4
|
|
? 'contentTop labourContentTop'
|
|
: selectFestival === 5
|
|
? 'contentTop dragonBoatContentTop'
|
|
: selectFestival === 6
|
|
? 'contentTop summerHolidayContentTop'
|
|
: selectFestival === 7
|
|
? 'contentTop midAutumnContentTop'
|
|
: selectFestival === 8
|
|
? 'contentTop nationalDayContentTop'
|
|
: ''
|
|
"
|
|
>
|
|
<div class="content">
|
|
<div class="left">
|
|
<!-- <img class="detailLogo" src="https://eshangtech.com/ShopICO/ahyd-BID/newIndex3/serverDetail.png"/>-->
|
|
<img
|
|
class="detailLogo"
|
|
:src="
|
|
selectFestival === 1 || selectFestival === 2
|
|
? 'https://eshangtech.com/ShopICO/ahyd-BID/newIndex3/serverDetail.png'
|
|
: selectFestival === 3
|
|
? 'https://eshangtech.com/ShopICO/ahyd-BID/newIndex3/qmServicepartDetail.png'
|
|
: selectFestival === 4
|
|
? 'https://eshangtech.com/ShopICO/ahyd-BID/newIndex3/labourServerPartDetail.png'
|
|
: selectFestival === 5
|
|
? 'https://eshangtech.com/ShopICO/ahyd-BID/newIndex3/dragonBoatDetail.png'
|
|
: selectFestival === 6
|
|
? 'https://eshangtech.com/ShopICO/ahyd-BID/newIndex3/summerHolidayDetail.png'
|
|
: selectFestival === 7
|
|
? 'https://eshangtech.com/ShopICO/ahyd-BID/newIndex3/midAutumnDetail.png'
|
|
: selectFestival === 8
|
|
? 'https://eshangtech.com/ShopICO/ahyd-BID/newIndex3/nationalDayDetail.png'
|
|
: ''
|
|
"
|
|
/>
|
|
<!-- <text class="modalUnit">{{selectDateText || ''}}</text>-->
|
|
<!-- <text class="modalUnit">{{`/统计到${allDateDay || ''}`}}</text>-->
|
|
</div>
|
|
<div class="right">
|
|
<div class="typeChangeBox">
|
|
<div
|
|
:class="pageType === 1 ? 'normal select' : 'normal'"
|
|
@click="handleChangeType(1)"
|
|
>
|
|
按天统计
|
|
</div>
|
|
<div
|
|
:class="pageType === 2 ? 'normal select' : 'normal'"
|
|
@click="handleChangeType(2)"
|
|
>
|
|
累计统计
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="contentBox">
|
|
<div class="navBigList" v-if="pageType === 1">
|
|
<!-- <div class="allBox">-->
|
|
<!-- <div :class="currentScroll==='all'?'scrollItem selectItem':'scrollItem'" @click="handleChangeTime('all')">累计</div>-->
|
|
<!-- </div>-->
|
|
<scroll-view
|
|
scroll-x="true"
|
|
:class="
|
|
selectFestival === 1 || selectFestival === 2
|
|
? 'navList springNav'
|
|
: selectFestival === 3
|
|
? 'navList qmNav'
|
|
: selectFestival === 4
|
|
? 'navList labourNav'
|
|
: selectFestival === 5
|
|
? 'navList dragonBoatNav'
|
|
: selectFestival === 6
|
|
? 'navList summerHolidayNav'
|
|
: selectFestival === 7
|
|
? 'navList midAutumnNav'
|
|
: selectFestival === 8
|
|
? 'navList nationalDayNav'
|
|
: ''
|
|
"
|
|
:scrollIntoView="currentScroll"
|
|
:scroll-with-animation="true"
|
|
>
|
|
<div
|
|
:class="
|
|
currentScroll === 'item' + item.value
|
|
? 'scrollItem selectItem'
|
|
: 'scrollItem'
|
|
"
|
|
v-for="(item, index) in scrollList"
|
|
:key="index"
|
|
:id="'item' + item.value"
|
|
@click="handleChangeTime(item.value)"
|
|
>
|
|
{{ item.label }}
|
|
</div>
|
|
</scroll-view>
|
|
</div>
|
|
<view class="sortBox">
|
|
<view
|
|
class="sortItem"
|
|
style="width: 80rpx"
|
|
@click="handleChangeSortName(1)"
|
|
>
|
|
<text class="sortText">排序</text>
|
|
</view>
|
|
<view
|
|
class="sortItem"
|
|
:style="{
|
|
width: 'calc(100% - 410rpx)',
|
|
display: 'flex',
|
|
alignItems: 'center',
|
|
justifyContent: 'flex-end',
|
|
}"
|
|
@click="handleChangeSortName(1)"
|
|
>
|
|
<!-- <text class="sortText">{{ `24年${type === 1 ? '销售' : type === 2 ? '营收' : type === 3 ? '车流' : ''}` }}</text>-->
|
|
<text class="sortText">{{ `24年` }}</text>
|
|
<view class="sortIconBox" style="margin-right: 60rpx">
|
|
<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: 110rpx"
|
|
@click="handleChangeSortName(2)"
|
|
>
|
|
<!-- <text class="sortText">{{ `23年${type === 1 ? '销售' : type === 2 ? '营收' : type === 3 ? '车流' : ''}` }}</text>-->
|
|
<text class="sortText">{{ `23年` }}</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
|
|
class="sortItem"
|
|
style="width: 110rpx"
|
|
@click="handleChangeSortName(3)"
|
|
>
|
|
<!-- <text class="sortText">{{ `${type === 1 ? '销售' : type === 2 ? '营收' : type === 3 ? '车流' : ''}增长` }}</text>-->
|
|
<text class="sortText">{{ `增长` }}</text>
|
|
<view class="sortIconBox">
|
|
<image
|
|
class="upIcon"
|
|
:style="{
|
|
transform:
|
|
sortName === 3
|
|
? sortType === 1
|
|
? ``
|
|
: `rotate(180deg)`
|
|
: ``,
|
|
}"
|
|
:src="
|
|
sortType === 1
|
|
? 'https://eshangtech.com/ShopICO/ahyd-BID/car/upDesc.svg'
|
|
: sortName === 3
|
|
? 'https://eshangtech.com/ShopICO/ahyd-BID/car/downDesc.svg'
|
|
: 'https://eshangtech.com/ShopICO/ahyd-BID/car/upDesc.svg'
|
|
"
|
|
/>
|
|
<image
|
|
class="bottomIcon"
|
|
:style="{
|
|
transform:
|
|
sortName === 3
|
|
? sortType === 1
|
|
? ``
|
|
: `rotate(180deg)`
|
|
: 'rotate(-180deg)',
|
|
}"
|
|
:src="
|
|
sortType === 1 && sortName === 3
|
|
? '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: 110rpx"
|
|
@click="handleChangeSortName(4)"
|
|
>
|
|
<!-- <text class="sortText">{{ `${type === 1 ? '销售' : type === 2 ? '营收' : type === 3 ? '车流' : ''}增幅` }}</text>-->
|
|
<text class="sortText">{{ `增幅` }}</text>
|
|
<view class="sortIconBox">
|
|
<image
|
|
class="upIcon"
|
|
:style="{
|
|
transform:
|
|
sortName === 4
|
|
? sortType === 1
|
|
? ``
|
|
: `rotate(180deg)`
|
|
: ``,
|
|
}"
|
|
:src="
|
|
sortType === 1
|
|
? 'https://eshangtech.com/ShopICO/ahyd-BID/car/upDesc.svg'
|
|
: sortName === 4
|
|
? 'https://eshangtech.com/ShopICO/ahyd-BID/car/downDesc.svg'
|
|
: 'https://eshangtech.com/ShopICO/ahyd-BID/car/upDesc.svg'
|
|
"
|
|
/>
|
|
<image
|
|
class="bottomIcon"
|
|
:style="{
|
|
transform:
|
|
sortName === 4
|
|
? sortType === 1
|
|
? ``
|
|
: `rotate(180deg)`
|
|
: 'rotate(-180deg)',
|
|
}"
|
|
:src="
|
|
sortType === 1 && sortName === 4
|
|
? 'https://eshangtech.com/ShopICO/ahyd-BID/car/downDesc.svg'
|
|
: 'https://eshangtech.com/ShopICO/ahyd-BID/car/upDesc.svg'
|
|
"
|
|
/>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<div class="scrollBox">
|
|
<scroll-view
|
|
:scroll-y="true"
|
|
class="typeFirst"
|
|
v-if="dataList && dataList.length > 0"
|
|
>
|
|
<div
|
|
class="listItem"
|
|
v-for="(item, index) in dataList"
|
|
:key="index"
|
|
>
|
|
<div class="noItem" style="width: 80rpx; align-items: center">
|
|
<img
|
|
v-if="index <= 2"
|
|
class="noIcon"
|
|
:src="
|
|
index === 0
|
|
? 'https://eshangtech.com/ShopICO/ahyd-BID/newIndex3/first.png'
|
|
: index === 1
|
|
? 'https://eshangtech.com/ShopICO/ahyd-BID/newIndex3/second.png'
|
|
: index === 2
|
|
? 'https://eshangtech.com/ShopICO/ahyd-BID/newIndex3/third.png'
|
|
: ''
|
|
"
|
|
/>
|
|
<text class="noOther" v-else>{{ index + 1 }}</text>
|
|
</div>
|
|
<div
|
|
class="firstItem"
|
|
:style="{ width: 'calc(100% - 440rpx)', textAlign: 'left' }"
|
|
>
|
|
<div class="itemIcon">
|
|
<img
|
|
class="itemImg"
|
|
v-if="item.Brand_ICO"
|
|
:src="item.Brand_ICO"
|
|
/>
|
|
<img
|
|
class="itemImg"
|
|
v-else
|
|
src="https://eshangtech.com/ShopICO/ahyd-BID/newIndex3/defaultShopIcon.png"
|
|
/>
|
|
</div>
|
|
<div
|
|
class="itemRight"
|
|
:style="{ width: 'calc(100% - 128rpx)' }"
|
|
>
|
|
<span class="firstItemText">{{
|
|
item.ServerpartShopName || "-"
|
|
}}</span>
|
|
<span>{{
|
|
item.RevenueINC.curYearData
|
|
? item.RevenueINC.curYearData < 100
|
|
? `${item.RevenueINC.curYearData}(元)`
|
|
: $util.getMoney(item.RevenueINC.curYearData / 10000)
|
|
: ""
|
|
}}</span>
|
|
</div>
|
|
</div>
|
|
<!-- <div class="item" style="width: 110rpx"></div>-->
|
|
<div class="item" style="width: 110rpx">
|
|
{{
|
|
item.RevenueINC.lYearData
|
|
? item.RevenueINC.lYearData < 100
|
|
? `${item.RevenueINC.lYearData}(元)`
|
|
: $util.getMoney(item.RevenueINC.lYearData / 10000)
|
|
: ""
|
|
}}
|
|
</div>
|
|
<div class="item" style="width: 110rpx">
|
|
{{
|
|
item.RevenueINC.increaseData
|
|
? item.RevenueINC.increaseData < 100 &&
|
|
item.RevenueINC.increaseData > 0
|
|
? `${item.RevenueINC.increaseData}(元)`
|
|
: $util.getMoney(item.RevenueINC.increaseData / 10000)
|
|
: ""
|
|
}}
|
|
</div>
|
|
<div class="item" style="width: 110rpx">
|
|
<span
|
|
:style="{
|
|
color:
|
|
item.RevenueINC.increaseData > 0
|
|
? '#E83944'
|
|
: item.RevenueINC.increaseRate < 0
|
|
? '#0E9976'
|
|
: '',
|
|
}"
|
|
>
|
|
{{ item.RevenueINC.increaseRate > 0 ? "+" : "" }}
|
|
</span>
|
|
<span
|
|
:style="{
|
|
color:
|
|
item.RevenueINC.increaseRate > 0
|
|
? '#E83944'
|
|
: item.RevenueINC.increaseRate < 0
|
|
? '#0E9976'
|
|
: '',
|
|
}"
|
|
>
|
|
{{
|
|
item.RevenueINC.increaseRate
|
|
? item.RevenueINC.increaseRate + "%"
|
|
: ""
|
|
}}
|
|
</span>
|
|
</div>
|
|
</div>
|
|
</scroll-view>
|
|
|
|
<view class="noDataBox" v-else>
|
|
<img
|
|
class="noDataImg"
|
|
src="https://eshangtech.com/ShopICO/ahyd-BID/commercial/noData.svg"
|
|
/>
|
|
<text class="noDataText">暂无数据</text>
|
|
</view>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
<script>
|
|
import request from "@/util/index.js";
|
|
import moment from "moment";
|
|
export default {
|
|
name: "merchantRevenue",
|
|
data() {
|
|
return {
|
|
statusBarHeight: 0, // 胶囊按钮高度
|
|
menu: "", // 手机属性
|
|
pageType: 1, // 一天还是累计
|
|
scrollList: [], // 横向滑动日期
|
|
currentScroll: "", // 选中的日期
|
|
lastDay: "", // 最近有效日期
|
|
sortType: 1, // 正序降序 0正序 1降序
|
|
sortName: 3, // 排序字段 1 24年营收 2 23年营收 3营收增长 4营收增幅
|
|
dataList: [],
|
|
type: 0, // 判断是要查询哪个数据 1销售 2营收 3车流
|
|
ServerpartId: "", // 服务区id
|
|
useInfo: {},
|
|
ServerpartList: [],
|
|
currentServerPart: "",
|
|
showSpring: false,
|
|
springService: null, // 当前选中的服务区
|
|
selectFestival: 0, // 选择的服务区
|
|
festivalObj: {},
|
|
};
|
|
},
|
|
onLoad(query) {
|
|
console.log("query", query);
|
|
// 获取手机参数对页面进行适配
|
|
let systemInfo = uni.getSystemInfoSync();
|
|
this.statusBarHeight = Number(systemInfo.statusBarHeight);
|
|
this.menu = uni.getMenuButtonBoundingClientRect();
|
|
|
|
if (query.ServerpartId) {
|
|
this.ServerpartId = query.ServerpartId;
|
|
this.currentServerPart = `ServerPart` + query.ServerpartId;
|
|
}
|
|
if (query.type) {
|
|
this.type = Number(query.type);
|
|
}
|
|
if (query.festivalType) {
|
|
this.selectFestival = Number(query.festivalType);
|
|
}
|
|
if (query.currentScroll) {
|
|
this.currentScroll = query.currentScroll;
|
|
}
|
|
if (query.festivalObj) {
|
|
this.festivalObj = JSON.parse(query.festivalObj);
|
|
}
|
|
this.lastDay = uni.getStorageSync("lastDay");
|
|
const currentDate = new Date(this.lastDay);
|
|
let nowTime = currentDate.getTime();
|
|
let dayList = [];
|
|
if (
|
|
new Date(this.festivalObj.startTime).getTime() <= nowTime &&
|
|
new Date(this.festivalObj.endTime).getTime() > nowTime
|
|
) {
|
|
let dayNumber = moment(this.lastDay).diff(
|
|
this.festivalObj.startTime,
|
|
"days"
|
|
);
|
|
console.log("dayNumber", dayNumber);
|
|
if (dayNumber > 0) {
|
|
for (let i = 0; i < dayNumber; i++) {
|
|
dayList.push({
|
|
label: `第${i + 1}天`,
|
|
value: moment(this.festivalObj.startTime)
|
|
.add(i, "days")
|
|
.format("YYYY-MM-DD"),
|
|
});
|
|
}
|
|
}
|
|
} else if (new Date(this.festivalObj.endTime).getTime() < nowTime) {
|
|
// 当前时间已经过了这个时间范围了
|
|
let dayNumber =
|
|
moment(this.festivalObj.endTime).diff(
|
|
this.festivalObj.startTime,
|
|
"days"
|
|
) + 1;
|
|
console.log("dayNumber", dayNumber);
|
|
if (dayNumber > 0) {
|
|
for (let i = 0; i < dayNumber; i++) {
|
|
dayList.push({
|
|
label: `第${i + 1}天`,
|
|
value: moment(this.festivalObj.startTime)
|
|
.add(i, "days")
|
|
.format("YYYY-MM-DD"),
|
|
});
|
|
}
|
|
}
|
|
}
|
|
this.scrollList = dayList;
|
|
return;
|
|
|
|
// if (query.serverPartList){
|
|
// this.ServerpartList = JSON.parse(query.serverPartList)
|
|
// }
|
|
// 获取用户信息
|
|
let userInfo = uni.getStorageSync("vuex");
|
|
userInfo = JSON.parse(userInfo);
|
|
this.useInfo = JSON.parse(JSON.stringify(userInfo));
|
|
|
|
this.lastDay = uni.getStorageSync("lastDay");
|
|
// this.lastDay = '2024-04-03'
|
|
console.log("query", query);
|
|
if (this.selectFestival === 0) {
|
|
} else {
|
|
this.currentScroll = "item" + this.lastDay;
|
|
}
|
|
// else if(this.selectFestival===1){
|
|
// this.currentScroll = 'item'+ this.lastDay
|
|
// }else if (this.selectFestival===2){
|
|
// this.currentScroll = 'item'+ this.lastDay
|
|
// }else if (this.selectFestival===3){
|
|
// this.currentScroll = 'item'+ this.lastDay
|
|
// }
|
|
|
|
// 拿到是春运开始的第几天
|
|
let dayNumber = 0;
|
|
const lastDate = new Date(this.lastDay);
|
|
let y = lastDate.getFullYear();
|
|
this.curYear = y;
|
|
this.compareYear = y - 1;
|
|
let lastMonth = lastDate.getMonth() + 1;
|
|
let lastDays = lastDate.getDate();
|
|
this.allDateDay = `${lastMonth < 10 ? "0" + lastMonth : lastMonth}月${
|
|
lastDays < 10 ? "0" + lastDays : lastDays
|
|
}日`;
|
|
// 24年春运开始时间为 1.26
|
|
// if (lastMonth === 1){
|
|
// dayNumber = lastDays - 26 + 1
|
|
// }else{
|
|
// dayNumber = 6 + lastDays
|
|
// }
|
|
if (this.selectFestival === 0) {
|
|
dayNumber = moment().diff("2024-01-26", "days");
|
|
this.howDayNumber = dayNumber <= 40 ? dayNumber : 40;
|
|
} else if (this.selectFestival === 1) {
|
|
dayNumber = moment().diff("2024-04-03", "days");
|
|
if (dayNumber <= 5) {
|
|
this.howDayNumber = dayNumber;
|
|
} else {
|
|
this.howDayNumber = 5;
|
|
this.currentScroll = "item" + "2024-04-07";
|
|
this.allDateDay = "2024-04-07";
|
|
}
|
|
} else if (this.selectFestival === 2) {
|
|
dayNumber = moment().diff("2024-04-30", "days"); // 劳动
|
|
if (dayNumber <= 7) {
|
|
this.howDayNumber = dayNumber;
|
|
} else {
|
|
this.howDayNumber = 7;
|
|
this.currentScroll = "item" + "2024-05-06";
|
|
this.lastDay = "2024-05-06";
|
|
this.allDateDay = "2024-05-06";
|
|
}
|
|
} else if (this.selectFestival === 3) {
|
|
dayNumber = moment().diff("2024-06-07", "days");
|
|
if (dayNumber <= 5) {
|
|
this.howDayNumber = dayNumber;
|
|
} else {
|
|
this.howDayNumber = 5;
|
|
this.currentScroll = "item" + "2024-06-11";
|
|
this.allDateDay = "2024-06-11";
|
|
}
|
|
} else if (this.selectFestival === 4) {
|
|
dayNumber = moment().diff("2024-07-01", "days"); // 暑期
|
|
if (dayNumber <= 62) {
|
|
this.howDayNumber = dayNumber;
|
|
} else {
|
|
this.howDayNumber = 62;
|
|
this.currentScroll = "item" + "2024-08-31";
|
|
this.lastDay = "2024-08-31";
|
|
this.allDateDay = "2024-09-01";
|
|
}
|
|
} else if (this.selectFestival === 5) {
|
|
dayNumber = moment().diff("2024-09-14", "days"); // 中秋
|
|
if (dayNumber <= 5) {
|
|
this.howDayNumber = dayNumber;
|
|
} else {
|
|
this.howDayNumber = 5;
|
|
this.currentScroll = "item" + "2024-09-18";
|
|
this.lastDay = "2024-09-18";
|
|
this.allDateDay = "2024-09-18";
|
|
}
|
|
} else if (this.selectFestival === 6) {
|
|
dayNumber = moment().diff("2024-09-30", "days"); // 国庆
|
|
if (dayNumber <= 9) {
|
|
this.howDayNumber = dayNumber;
|
|
} else {
|
|
this.howDayNumber = 9;
|
|
this.currentScroll = "item" + "2024-10-08";
|
|
this.lastDay = "2024-10-08";
|
|
this.allDateDay = "2024-10-08";
|
|
}
|
|
}
|
|
|
|
let dateList = [];
|
|
for (let i = 1; i <= this.howDayNumber; i++) {
|
|
if (this.selectFestival === 0) {
|
|
dateList.push({
|
|
label: `第${i}天`,
|
|
value: moment("2024-01-25").add(i, "days").format("YYYY-MM-DD"),
|
|
});
|
|
} else if (this.selectFestival === 1) {
|
|
dateList.push({
|
|
label: `第${i}天`,
|
|
value: moment("2024-04-02").add(i, "days").format("YYYY-MM-DD"),
|
|
});
|
|
} else if (this.selectFestival === 2) {
|
|
dateList.push({
|
|
label: `第${i}天`,
|
|
value: moment("2024-04-29").add(i, "days").format("YYYY-MM-DD"),
|
|
});
|
|
} else if (this.selectFestival === 3) {
|
|
dateList.push({
|
|
label: `第${i}天`,
|
|
value: moment("2024-06-06").add(i, "days").format("YYYY-MM-DD"),
|
|
});
|
|
} else if (this.selectFestival === 4) {
|
|
dateList.push({
|
|
label: `第${i}天`,
|
|
value: moment("2024-06-30").add(i, "days").format("YYYY-MM-DD"),
|
|
}); // 端午
|
|
} else if (this.selectFestival === 5) {
|
|
dateList.push({
|
|
label: `第${i}天`,
|
|
value: moment("2024-09-13").add(i, "days").format("YYYY-MM-DD"),
|
|
}); // 端午
|
|
} else if (this.selectFestival === 6) {
|
|
dateList.push({
|
|
label: `第${i}天`,
|
|
value: moment("2024-09-29").add(i, "days").format("YYYY-MM-DD"),
|
|
}); // 端午
|
|
}
|
|
// if (i<7){
|
|
// dateList.push({label:`第${i}天`,value:`2024-01-${26+i-1}`})
|
|
// }else{
|
|
// dateList.push({label:`第${i}天`,value:`2024-02-${i - 7 + 1<10?`0${i - 7 + 1}`:i - 7 + 1}`})
|
|
// }
|
|
}
|
|
this.scrollList = dateList;
|
|
console.log("dateList", dateList);
|
|
// this.handleGetPageData()
|
|
},
|
|
onShow() {
|
|
let seat = uni.getStorageSync("springService");
|
|
if (seat) {
|
|
this.springService = seat;
|
|
this.showSpring = true;
|
|
this.dataList = [];
|
|
this.handleGetPageData();
|
|
} else {
|
|
this.showSpring = false;
|
|
}
|
|
},
|
|
methods: {
|
|
handleChangeType(value) {
|
|
this.pageType = value;
|
|
if (value === 2) {
|
|
this.handleGetPageData("all");
|
|
} else {
|
|
this.handleGetPageData();
|
|
}
|
|
},
|
|
handleGoMap() {
|
|
this.$util.toNextRoute(
|
|
"navigateTo",
|
|
"/pages/map/index?type=springTravel"
|
|
);
|
|
},
|
|
// 拿到页面表格数据
|
|
async handleGetPageData(date) {
|
|
uni.showLoading({
|
|
title: "正在加载...",
|
|
});
|
|
let time = date
|
|
? date === "all"
|
|
? this.festivalObj.endTime
|
|
: this.currentScroll.split("item")[1]
|
|
: this.currentScroll.split("item")[1];
|
|
const req = {
|
|
calcType: this.pageType,
|
|
pushProvinceCode: "340000",
|
|
curYear: this.festivalObj.curYear,
|
|
compareYear: this.festivalObj.compareYear,
|
|
HolidayType: this.selectFestival,
|
|
// this.selectFestival === 0
|
|
// ? 2
|
|
// : this.selectFestival === 1
|
|
// ? 3
|
|
// : this.selectFestival === 2
|
|
// ? 4
|
|
// : this.selectFestival === 3
|
|
// ? 5
|
|
// : this.selectFestival === 4
|
|
// ? 6
|
|
// : this.selectFestival === 5
|
|
// ? 7
|
|
// : this.selectFestival === 6
|
|
// ? 8
|
|
// : "",
|
|
StatisticsDate: time,
|
|
ServerpartId: this.springService.Serverpart_ID || this.ServerpartId,
|
|
SortStr: `${
|
|
this.type === 1
|
|
? "revenue"
|
|
: this.type === 2
|
|
? "account"
|
|
: this.type === 3
|
|
? "bayonet"
|
|
: ""
|
|
} ${this.sortType === 0 ? "asc" : "desc"}`,
|
|
};
|
|
// this.dataList
|
|
const data = await request.$webGet(
|
|
"CommercialApi/Revenue/GetShopINCAnalysis",
|
|
req
|
|
);
|
|
if (data.Result_Data) {
|
|
if (data.Result_Code === 100) {
|
|
this.dataList = this.handleGetSort(data.Result_Data.ShopINCList);
|
|
} else {
|
|
this.dataList = [];
|
|
}
|
|
}
|
|
uni.hideLoading();
|
|
},
|
|
handleChangeTime(date) {
|
|
if (date === "all") {
|
|
this.currentScroll = "all";
|
|
const time = new Date(this.lastDay);
|
|
let m = time.getMonth() + 1;
|
|
let d = time.getDate();
|
|
this.allDateDay = `${m < 10 ? "0" + m : m}月${d < 10 ? "0" + d : d}日`;
|
|
} else {
|
|
this.currentScroll = "item" + date;
|
|
const time = new Date(date);
|
|
let m = time.getMonth() + 1;
|
|
let d = time.getDate();
|
|
this.allDateDay = `${m < 10 ? "0" + m : m}月${d < 10 ? "0" + d : d}日`;
|
|
}
|
|
|
|
this.handleGetPageData(date);
|
|
},
|
|
// 修改排序字段
|
|
handleChangeSortName(value) {
|
|
uni.showLoading({
|
|
title: "正在加载...",
|
|
});
|
|
if (value === this.sortName) {
|
|
if (this.sortType === 1) {
|
|
this.sortType = 0;
|
|
} else {
|
|
this.sortType = 1;
|
|
}
|
|
} else {
|
|
this.sortName = value;
|
|
this.sortType = 1;
|
|
}
|
|
let list = this.handleGetSort(this.dataList);
|
|
this.dataList = list;
|
|
this.$forceUpdate();
|
|
uni.hideLoading();
|
|
},
|
|
// 排序方法
|
|
handleGetSort(list) {
|
|
var len = list.length;
|
|
|
|
for (var i = 0; i < len - 1; i++) {
|
|
for (var j = 0; j < len - 1 - i; j++) {
|
|
// 判断按照那个排序
|
|
if (this.type === 1 || this.type === 2) {
|
|
// 正序
|
|
if (this.sortType === 0) {
|
|
// 24年营收
|
|
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;
|
|
}
|
|
// 23年营收
|
|
} else if (this.sortName === 2) {
|
|
if (
|
|
list[j].RevenueINC.lYearData >
|
|
list[j + 1].RevenueINC.lYearData
|
|
) {
|
|
// 比较相邻元素大小并交换位置
|
|
var temp = list[j];
|
|
list[j] = list[j + 1];
|
|
list[j + 1] = temp;
|
|
}
|
|
// 营收增长
|
|
} else if (this.sortName === 3) {
|
|
if (
|
|
list[j].RevenueINC.increaseData >
|
|
list[j + 1].RevenueINC.increaseData
|
|
) {
|
|
// 比较相邻元素大小并交换位置
|
|
var temp = list[j];
|
|
list[j] = list[j + 1];
|
|
list[j + 1] = temp;
|
|
}
|
|
// 营收增幅
|
|
} else if (this.sortName === 4) {
|
|
if (
|
|
list[j].RevenueINC.increaseRate >
|
|
list[j + 1].RevenueINC.increaseRate
|
|
) {
|
|
// 比较相邻元素大小并交换位置
|
|
var temp = list[j];
|
|
list[j] = list[j + 1];
|
|
list[j + 1] = temp;
|
|
}
|
|
}
|
|
} else {
|
|
// 降序
|
|
// 24年营收
|
|
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;
|
|
}
|
|
// 23年营收
|
|
} else if (this.sortName === 2) {
|
|
if (
|
|
list[j].RevenueINC.lYearData <
|
|
list[j + 1].RevenueINC.lYearData
|
|
) {
|
|
// 比较相邻元素大小并交换位置
|
|
var temp = list[j];
|
|
list[j] = list[j + 1];
|
|
list[j + 1] = temp;
|
|
}
|
|
// 营收增长
|
|
} else if (this.sortName === 3) {
|
|
if (
|
|
list[j].RevenueINC.increaseData <
|
|
list[j + 1].RevenueINC.increaseData
|
|
) {
|
|
// 比较相邻元素大小并交换位置
|
|
var temp = list[j];
|
|
list[j] = list[j + 1];
|
|
list[j + 1] = temp;
|
|
}
|
|
// 营收增幅
|
|
} else if (this.sortName === 4) {
|
|
if (
|
|
list[j].RevenueINC.increaseRate <
|
|
list[j + 1].RevenueINC.increaseRate
|
|
) {
|
|
// 比较相邻元素大小并交换位置
|
|
var temp = list[j];
|
|
list[j] = list[j + 1];
|
|
list[j + 1] = temp;
|
|
}
|
|
}
|
|
}
|
|
} else if (this.type === 3) {
|
|
// 正序
|
|
if (this.sortType === 0) {
|
|
// 24年车流
|
|
if (this.sortName === 1) {
|
|
if (
|
|
list[j].BayonetINC.curYearData >
|
|
list[j + 1].BayonetINC.curYearData
|
|
) {
|
|
// 比较相邻元素大小并交换位置
|
|
var temp = list[j];
|
|
list[j] = list[j + 1];
|
|
list[j + 1] = temp;
|
|
}
|
|
// 23年营收
|
|
} else if (this.sortName === 2) {
|
|
if (
|
|
list[j].BayonetINC.lYearData >
|
|
list[j + 1].BayonetINC.lYearData
|
|
) {
|
|
// 比较相邻元素大小并交换位置
|
|
var temp = list[j];
|
|
list[j] = list[j + 1];
|
|
list[j + 1] = temp;
|
|
}
|
|
// 营收增长
|
|
} else if (this.sortName === 3) {
|
|
if (
|
|
list[j].BayonetINC.increaseData >
|
|
list[j + 1].BayonetINC.increaseData
|
|
) {
|
|
// 比较相邻元素大小并交换位置
|
|
var temp = list[j];
|
|
list[j] = list[j + 1];
|
|
list[j + 1] = temp;
|
|
}
|
|
// 营收增幅
|
|
} else if (this.sortName === 4) {
|
|
if (
|
|
list[j].BayonetINC.increaseRate >
|
|
list[j + 1].BayonetINC.increaseRate
|
|
) {
|
|
// 比较相邻元素大小并交换位置
|
|
var temp = list[j];
|
|
list[j] = list[j + 1];
|
|
list[j + 1] = temp;
|
|
}
|
|
}
|
|
} else {
|
|
// 降序
|
|
// 24年车流
|
|
if (this.sortName === 1) {
|
|
if (
|
|
list[j].BayonetINC.curYearData <
|
|
list[j + 1].BayonetINC.curYearData
|
|
) {
|
|
// 比较相邻元素大小并交换位置
|
|
var temp = list[j];
|
|
list[j] = list[j + 1];
|
|
list[j + 1] = temp;
|
|
}
|
|
// 23年营收
|
|
} else if (this.sortName === 2) {
|
|
if (
|
|
list[j].BayonetINC.lYearData <
|
|
list[j + 1].BayonetINC.lYearData
|
|
) {
|
|
// 比较相邻元素大小并交换位置
|
|
var temp = list[j];
|
|
list[j] = list[j + 1];
|
|
list[j + 1] = temp;
|
|
}
|
|
// 营收增长
|
|
} else if (this.sortName === 3) {
|
|
if (
|
|
list[j].BayonetINC.increaseData <
|
|
list[j + 1].BayonetINC.increaseData
|
|
) {
|
|
// 比较相邻元素大小并交换位置
|
|
var temp = list[j];
|
|
list[j] = list[j + 1];
|
|
list[j + 1] = temp;
|
|
}
|
|
// 营收增幅
|
|
} else if (this.sortName === 4) {
|
|
if (
|
|
list[j].BayonetINC.increaseRate <
|
|
list[j + 1].BayonetINC.increaseRate
|
|
) {
|
|
// 比较相邻元素大小并交换位置
|
|
var temp = list[j];
|
|
list[j] = list[j + 1];
|
|
list[j + 1] = temp;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
return list;
|
|
},
|
|
handleBack() {
|
|
uni.navigateBack({
|
|
delta: 1,
|
|
});
|
|
},
|
|
// 选择服务区
|
|
handleChangeServerPart(value) {
|
|
this.ServerpartId = value;
|
|
this.currentServerPart = `ServerPart` + value;
|
|
this.handleGetPageData(null);
|
|
},
|
|
},
|
|
};
|
|
</script>
|
|
|
|
<style scoped lang="scss">
|
|
.main {
|
|
width: 100%;
|
|
height: 100%;
|
|
background: #fff;
|
|
.springTop {
|
|
background-image: url("https://eshangtech.com/ShopICO/ahyd-BID/newIndex3/rankBg.png");
|
|
}
|
|
.qmTop {
|
|
background-image: url("https://eshangtech.com/ShopICO/ahyd-BID/newIndex3/qmBackground.png");
|
|
}
|
|
.labourTop {
|
|
background-image: url("https://eshangtech.com/ShopICO/ahyd-BID/newIndex3/labourBg.png");
|
|
}
|
|
.dragonBoatTop {
|
|
background-image: url("https://eshangtech.com/ShopICO/ahyd-BID/newIndex3/dragonBoatBg.png");
|
|
}
|
|
.summerHolidayTop {
|
|
background-image: url("https://eshangtech.com/ShopICO/ahyd-BID/newIndex3/summerHolidayBg.png");
|
|
}
|
|
.midAutumnTop {
|
|
background-image: url("https://eshangtech.com/ShopICO/ahyd-BID/newIndex3/midAutumnBg.png") !important;
|
|
}
|
|
.nationalDayTop {
|
|
background-image: url("https://eshangtech.com/ShopICO/ahyd-BID/newIndex3/nationalDayBg.png") !important;
|
|
}
|
|
.top {
|
|
width: 100%;
|
|
height: 324rpx;
|
|
//background-image: url("https://eshangtech.com/ShopICO/ahyd-BID/newIndex3/rankBg.png");
|
|
//background-image: url("https://eshangtech.com/ShopICO/ahyd-BID/newIndex3/qmBackground.png");
|
|
background-repeat: no-repeat;
|
|
background-position: 0 0;
|
|
background-size: 100% 100%;
|
|
position: relative;
|
|
.headerSpring {
|
|
background-image: url("https://eshangtech.com/ShopICO/ahyd-BID/newIndex3/rankBg.png");
|
|
}
|
|
.headerQm {
|
|
background-image: url("https://eshangtech.com/ShopICO/ahyd-BID/newIndex3/qmBackground.png");
|
|
}
|
|
.headerlabour {
|
|
background-image: url("https://eshangtech.com/ShopICO/ahyd-BID/newIndex3/labourBg.png");
|
|
}
|
|
.headerDragonBoat {
|
|
background-image: url("https://eshangtech.com/ShopICO/ahyd-BID/newIndex3/dragonBoatBg.png");
|
|
}
|
|
.headerSummerHoliday {
|
|
background-image: url("https://eshangtech.com/ShopICO/ahyd-BID/newIndex3/summerHolidayBg.png");
|
|
}
|
|
.headerMidAutumn {
|
|
background-image: url("https://eshangtech.com/ShopICO/ahyd-BID/newIndex3/midAutumnBg.png") !important;
|
|
}
|
|
.headerNationalDay {
|
|
background-image: url("https://eshangtech.com/ShopICO/ahyd-BID/newIndex3/nationalDayBg.png") !important;
|
|
}
|
|
.header {
|
|
position: fixed;
|
|
width: 100%;
|
|
padding: 0 16px;
|
|
box-sizing: border-box;
|
|
//background-image: url("https://eshangtech.com/ShopICO/ahyd-BID/newIndex3/rankBg.png");
|
|
//background-image: url("https://eshangtech.com/ShopICO/ahyd-BID/newIndex3/qmBackground.png");
|
|
background-repeat: no-repeat;
|
|
background-position: 0 0;
|
|
background-size: 100% 324rpx;
|
|
display: flex;
|
|
align-items: center;
|
|
z-index: 3;
|
|
.backArrow {
|
|
width: 24px;
|
|
height: 24px;
|
|
margin-right: 16px;
|
|
position: absolute;
|
|
}
|
|
.detailIcon {
|
|
width: 230rpx;
|
|
height: 48rpx;
|
|
margin-left: 16rpx;
|
|
position: absolute;
|
|
left: 40px;
|
|
}
|
|
.seachBox {
|
|
position: absolute;
|
|
bottom: 0;
|
|
left: 60px;
|
|
width: 400rpx;
|
|
background: #fff;
|
|
border-radius: 32rpx;
|
|
margin-left: 16rpx;
|
|
box-sizing: border-box;
|
|
padding: 10rpx 20rpx;
|
|
display: flex;
|
|
align-items: center;
|
|
.searchIcon {
|
|
width: 32rpx;
|
|
height: 32rpx;
|
|
margin-right: 8rpx;
|
|
}
|
|
.searchText {
|
|
font-size: 28rpx;
|
|
font-family: PingFangSC, PingFang SC;
|
|
font-weight: 400;
|
|
color: #b6bacb;
|
|
line-height: 40rpx;
|
|
white-space: nowrap;
|
|
}
|
|
}
|
|
.picker {
|
|
position: absolute;
|
|
bottom: 0;
|
|
left: 40px;
|
|
.selectService {
|
|
display: flex;
|
|
align-items: center;
|
|
.img {
|
|
width: 40px;
|
|
height: 40px;
|
|
z-index: 2;
|
|
}
|
|
.select {
|
|
height: 32px;
|
|
background: #f8f8fa;
|
|
border-radius: 0 16px 16px 0;
|
|
transform: translateX(-20px);
|
|
box-sizing: border-box;
|
|
padding-left: 25px;
|
|
display: flex;
|
|
align-items: center;
|
|
.content {
|
|
display: flex;
|
|
align-items: center;
|
|
.uni-input {
|
|
padding: 0;
|
|
background: transparent;
|
|
font-size: 14px;
|
|
font-family: PingFangSC-Semibold, PingFang SC;
|
|
font-weight: 600;
|
|
color: #160002;
|
|
}
|
|
.area {
|
|
font-size: 12px;
|
|
font-family: PingFangSC-Regular, PingFang SC;
|
|
font-weight: 400;
|
|
color: #786b6c;
|
|
line-height: 40px;
|
|
margin-left: 4px;
|
|
}
|
|
.rightArrow {
|
|
width: 24px;
|
|
height: 12px;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
.headerNavList {
|
|
position: absolute;
|
|
width: 100%;
|
|
height: 60rpx;
|
|
display: flex;
|
|
align-items: center;
|
|
white-space: nowrap;
|
|
box-sizing: border-box;
|
|
padding-left: 32rpx;
|
|
.scrollItem {
|
|
display: inline-block;
|
|
height: 40rpx;
|
|
font-size: 28rpx;
|
|
font-family: PingFangSC, PingFang SC;
|
|
font-weight: 600;
|
|
color: #e8a29a;
|
|
line-height: 40rpx;
|
|
margin-right: 40rpx;
|
|
}
|
|
.selectItem {
|
|
font-size: 28rpx;
|
|
font-family: PingFangSC, PingFang SC;
|
|
font-weight: 600;
|
|
color: #ffffff;
|
|
line-height: 40rpx;
|
|
position: relative;
|
|
}
|
|
.selectItem:after {
|
|
content: "";
|
|
display: inline-block;
|
|
width: 56rpx;
|
|
height: 6rpx;
|
|
background-color: #fff;
|
|
position: absolute;
|
|
bottom: -8rpx;
|
|
left: 0px;
|
|
}
|
|
}
|
|
}
|
|
.contentPage {
|
|
width: 100%;
|
|
transform: translateY(-32rpx);
|
|
background: #fff;
|
|
border-radius: 32rpx 32rpx 0rpx 0rpx;
|
|
.springContentTop {
|
|
background: linear-gradient(
|
|
360deg,
|
|
rgba(255, 200, 198, 0) 0%,
|
|
#ffc8c6 100%
|
|
);
|
|
}
|
|
.qmContentTop {
|
|
background: linear-gradient(
|
|
360deg,
|
|
rgba(204, 231, 224, 0) 0%,
|
|
#cce7e0 100%
|
|
);
|
|
}
|
|
.labourContentTop {
|
|
background: linear-gradient(
|
|
360deg,
|
|
rgba(255, 236, 208, 0) 0%,
|
|
#ffecd0 100%
|
|
);
|
|
}
|
|
.dragonBoatContentTop {
|
|
background: linear-gradient(
|
|
360deg,
|
|
rgba(225, 241, 237, 0) 0%,
|
|
#e1f1ed 100%
|
|
);
|
|
}
|
|
.summerHolidayContentTop {
|
|
background: linear-gradient(
|
|
360deg,
|
|
rgba(214, 238, 243, 0) 0%,
|
|
#d1e9ee 100%
|
|
);
|
|
}
|
|
.midAutumnContentTop {
|
|
background: linear-gradient(
|
|
360deg,
|
|
rgba(255, 215, 180, 0) 0%,
|
|
#fff3e9 100%
|
|
);
|
|
}
|
|
.nationalDayContentTop {
|
|
background: linear-gradient(
|
|
360deg,
|
|
rgba(255, 218, 210, 0) 0%,
|
|
#fff2f0 100%
|
|
);
|
|
}
|
|
.contentTop {
|
|
width: 100%;
|
|
height: 120rpx;
|
|
//background: linear-gradient(360deg, rgba(255,200,198,0) 0%, #FFC8C6 100%);
|
|
//background: linear-gradient(360deg, rgba(204,231,224,0) 0%, #CCE7E0 100%);
|
|
border-radius: 32rpx 32rpx 0rpx 0rpx;
|
|
box-sizing: border-box;
|
|
padding: 24rpx 24rpx 0;
|
|
.content {
|
|
width: 100%;
|
|
box-sizing: border-box;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
.left {
|
|
.detailLogo {
|
|
width: 178rpx;
|
|
height: 32rpx;
|
|
}
|
|
.modalUnit {
|
|
font-size: 24rpx;
|
|
font-family: PingFangSC, PingFang SC;
|
|
font-weight: 400;
|
|
color: #9a9a9a;
|
|
line-height: 36rpx;
|
|
}
|
|
}
|
|
.right {
|
|
.typeChangeBox {
|
|
display: flex;
|
|
align-items: center;
|
|
background: #ffffff;
|
|
border-radius: 6rpx;
|
|
box-sizing: border-box;
|
|
padding: 4rpx;
|
|
.normal {
|
|
font-size: 24rpx;
|
|
font-family: PingFangSC, PingFang SC;
|
|
font-weight: 400;
|
|
color: #786b6c;
|
|
line-height: 36rpx;
|
|
padding: 6rpx 16rpx;
|
|
}
|
|
.select {
|
|
font-size: 24rpx;
|
|
font-family: PingFangSC, PingFang SC;
|
|
font-weight: 400;
|
|
color: #160002;
|
|
line-height: 36rpx;
|
|
background: #f5efef;
|
|
border-radius: 6rpx;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
.contentBox {
|
|
width: 100%;
|
|
box-sizing: border-box;
|
|
padding: 0 32rpx;
|
|
.navBigList {
|
|
width: 100%;
|
|
height: 40rpx;
|
|
display: flex;
|
|
align-items: center;
|
|
padding-bottom: 24rpx;
|
|
border-bottom: 1px solid #f5f4f4;
|
|
.allBox {
|
|
width: 70rpx;
|
|
height: 100%;
|
|
.scrollItem {
|
|
font-size: 28rpx;
|
|
font-family: PingFangSC, PingFang SC;
|
|
font-weight: 400;
|
|
color: #a69e9f;
|
|
line-height: 40rpx;
|
|
}
|
|
.selectItem {
|
|
font-size: 28rpx;
|
|
font-family: PingFangSC, PingFang SC;
|
|
font-weight: 600;
|
|
color: #ed3e48;
|
|
line-height: 40rpx;
|
|
}
|
|
}
|
|
.navList {
|
|
width: 100%;
|
|
height: 40rpx;
|
|
display: flex;
|
|
align-items: center;
|
|
white-space: nowrap;
|
|
.scrollItem {
|
|
font-size: 28rpx;
|
|
font-family: PingFangSC, PingFang SC;
|
|
font-weight: 400;
|
|
color: #a69e9f;
|
|
line-height: 40rpx;
|
|
margin-right: 32rpx;
|
|
display: inline-block;
|
|
}
|
|
.selectItem {
|
|
font-size: 28rpx;
|
|
font-family: PingFangSC, PingFang SC;
|
|
font-weight: 600;
|
|
//color: #226C61;
|
|
line-height: 40rpx;
|
|
}
|
|
}
|
|
.springNav {
|
|
.selectItem {
|
|
color: #ed3e48 !important;
|
|
}
|
|
}
|
|
.qmNav {
|
|
.selectItem {
|
|
color: #226c61 !important;
|
|
}
|
|
}
|
|
.labourNav {
|
|
.selectItem {
|
|
color: #d14702;
|
|
}
|
|
}
|
|
.dragonBoatNav {
|
|
.selectItem {
|
|
color: #3e8958 !important;
|
|
}
|
|
}
|
|
.summerHolidayNav {
|
|
.selectItem {
|
|
color: #007797 !important;
|
|
}
|
|
}
|
|
.midAutumnNav {
|
|
.selectItem {
|
|
color: #da5015;
|
|
}
|
|
}
|
|
.nationalDayNav {
|
|
.selectItem {
|
|
color: #d52020;
|
|
}
|
|
}
|
|
}
|
|
|
|
.sortBox {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
margin-bottom: 16rpx;
|
|
margin-top: 24rpx;
|
|
.sortItem {
|
|
display: flex;
|
|
align-items: center;
|
|
.sortText {
|
|
font-size: 24rpx;
|
|
font-family: PingFangSC, PingFang SC;
|
|
font-weight: 400;
|
|
color: #9a9a9a;
|
|
line-height: 36rpx;
|
|
white-space: nowrap;
|
|
}
|
|
.sortIconBox {
|
|
display: flex;
|
|
flex-direction: column;
|
|
margin-left: 16rpx;
|
|
.upIcon {
|
|
width: 16rpx;
|
|
height: 12rpx;
|
|
margin-bottom: 4rpx;
|
|
}
|
|
.bottomIcon {
|
|
width: 16rpx;
|
|
height: 12rpx;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
.scrollBox {
|
|
.typeFirst {
|
|
height: calc(100vh - 300px);
|
|
.listItem {
|
|
width: 100%;
|
|
display: flex;
|
|
//align-items: center;
|
|
align-items: flex-end;
|
|
padding: 16rpx 0;
|
|
.noItem {
|
|
display: flex;
|
|
height: 120rpx;
|
|
align-items: center;
|
|
.noIcon {
|
|
width: 40rpx;
|
|
height: 40rpx;
|
|
}
|
|
.noOther {
|
|
width: 40rpx;
|
|
height: 40rpx;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
background: linear-gradient(
|
|
141deg,
|
|
#babcc3 0%,
|
|
#cbccd1 45%,
|
|
#b5b6ba 100%
|
|
);
|
|
border-radius: 50%;
|
|
font-size: 24rpx;
|
|
font-family: PingFangSC, PingFang SC;
|
|
font-weight: 500;
|
|
color: #ffffff;
|
|
line-height: 24rpx;
|
|
}
|
|
}
|
|
.item {
|
|
text-align: center;
|
|
font-size: 28rpx;
|
|
font-family: PingFangSC, PingFang SC;
|
|
font-weight: 500;
|
|
color: #9a9a9a;
|
|
line-height: 40rpx;
|
|
}
|
|
.firstItem {
|
|
display: flex;
|
|
.itemIcon {
|
|
width: 120rpx;
|
|
height: 120rpx;
|
|
border-radius: 16rpx;
|
|
overflow: hidden;
|
|
margin-right: 8rpx;
|
|
.itemImg {
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
}
|
|
.itemRight {
|
|
height: 120rpx;
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: space-between;
|
|
color: #9a9a9a;
|
|
.firstItemText {
|
|
width: 100%;
|
|
text-align: left;
|
|
font-size: 28rpx;
|
|
font-family: PingFangSC, PingFang SC;
|
|
font-weight: 500;
|
|
color: #9a9a9a;
|
|
overflow: hidden;
|
|
white-space: nowrap;
|
|
text-overflow: ellipsis;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
.noDataBox {
|
|
width: 100%;
|
|
height: calc(100vh - 300px);
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
justify-content: center;
|
|
.noDataImg {
|
|
width: 120rpx;
|
|
height: 120rpx;
|
|
}
|
|
.noDataText {
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</style>
|