Compare commits
2 Commits
431d95645b
...
f82ab7bb6a
| Author | SHA1 | Date | |
|---|---|---|---|
|
f82ab7bb6a | ||
|
|
42f254afb9 |
@ -305,6 +305,45 @@ function playVideo(opt) {
|
||||
|
||||
return new EZUIPlayer(opt)
|
||||
}
|
||||
|
||||
// 得到这个月有多少天
|
||||
function getThisMonthDay(value) {
|
||||
let date = new Date(value)
|
||||
let y = date.getFullYear()
|
||||
let m = date.getMonth() + 1
|
||||
let howDay;
|
||||
let flag = false
|
||||
if (y % 4 === 0 && y % 100 !== 0 || y % 400 === 0) {
|
||||
flag = true
|
||||
}
|
||||
switch (m) {
|
||||
case 1:
|
||||
case 3:
|
||||
case 5:
|
||||
case 7:
|
||||
case 8:
|
||||
case 10:
|
||||
case 12:
|
||||
howDay = 31
|
||||
break
|
||||
case 4:
|
||||
case 6:
|
||||
case 9:
|
||||
case 11:
|
||||
howDay = 30
|
||||
break
|
||||
case 2:
|
||||
if (flag) {
|
||||
howDay = 29
|
||||
} else {
|
||||
howDay = 28
|
||||
}
|
||||
break
|
||||
}
|
||||
return howDay
|
||||
}
|
||||
|
||||
|
||||
export default {
|
||||
netChange,
|
||||
cutDate,
|
||||
@ -318,5 +357,6 @@ export default {
|
||||
getFieldEnumByField, // 获取枚举参数
|
||||
// calculateDistance,
|
||||
// bMapToQQMap,
|
||||
playVideo
|
||||
playVideo,
|
||||
getThisMonthDay
|
||||
}
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
@ -1,7 +1,7 @@
|
||||
<template>
|
||||
<view :class="'province-theme-' + currentProvinceCode" scroll-with-animation v-if="showPage">
|
||||
<view class="page-body">
|
||||
<div class="box-card" :style="'opacity:' + (1 - opacity) + ';'">
|
||||
<view class="page-body page-enter">
|
||||
<div class="box-card card-enter" :style="'opacity:' + (1 - opacity) + ';'">
|
||||
<div class="box-top-title">
|
||||
<span class="box-center-title">{{ sMsg.serverpartname }}</span>
|
||||
<picker mode="date" @change="bindDateChange" :value="theRequest && theRequest.time" :start="startTime"
|
||||
@ -10,7 +10,7 @@
|
||||
</picker>
|
||||
|
||||
</div>
|
||||
<view class="top-card">
|
||||
<view class="top-card data-card-enter">
|
||||
<div class="box-center-box">
|
||||
<div class="uni-flex ai-center jc-between" style="margin-bottom: 8rpx;">
|
||||
<div class="main-amount-title">对客营收(元)</div>
|
||||
@ -36,37 +36,37 @@
|
||||
</div>
|
||||
<div class="uni-flex jc-between box-center-box">
|
||||
|
||||
<div class="check-unit">
|
||||
<div class="check-unit metric-enter">
|
||||
<text>长款金额</text>
|
||||
<div class="check-price-color">{{ $util.fmoney(sMsg.diffMorePrice, 2) }} <text>元</text></div>
|
||||
</div>
|
||||
<div class="check-unit">
|
||||
<div class="check-unit metric-enter">
|
||||
<text>短款金额</text>
|
||||
<div class="check-price-color">{{ $util.fmoney(sMsg.diffLessPrice, 2) }} <text>元</text></div>
|
||||
</div>
|
||||
<div class="check-unit">
|
||||
<div class="check-unit metric-enter">
|
||||
<text>客单交易</text>
|
||||
<div class="check-price-color">{{ $util.fmoney(sMsg.ticketCount, 0) }} <text>笔</text></div>
|
||||
</div>
|
||||
<div class="check-unit">
|
||||
<div class="check-unit metric-enter">
|
||||
<text>客单均价</text>
|
||||
<div class="check-price-color">{{ $util.fmoney(sMsg.tickave, 2) }} <text>元</text></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="uni-flex jc-between box-center-box mt8">
|
||||
<div class="check-unit">
|
||||
<div class="check-unit metric-enter">
|
||||
<text>优惠金额</text>
|
||||
<div class="check-price-color">{{ $util.fmoney(sMsg.totalOffAmount, 2) }} <text>元</text></div>
|
||||
</div>
|
||||
<div class="check-unit">
|
||||
<div class="check-unit metric-enter">
|
||||
<text>移动支付</text>
|
||||
<div class="check-price-color">{{ $util.fmoney(sMsg.mobilePayment, 2) }} <text>元</text></div>
|
||||
</div>
|
||||
<div class="check-unit">
|
||||
<div class="check-unit metric-enter">
|
||||
<text>商品出售</text>
|
||||
<div class="check-price-color">{{ $util.fmoney(sMsg.totalCount, 0) }} <text>件</text></div>
|
||||
</div>
|
||||
<div class="check-unit">
|
||||
<div class="check-unit metric-enter">
|
||||
<text>商品均价</text>
|
||||
<div class="check-price-color">{{ $util.fmoney(sMsg.countave, 2) }} <text>元</text></div>
|
||||
</div>
|
||||
@ -82,11 +82,11 @@
|
||||
|
||||
<template v-if="cateBrandList.length">
|
||||
<template v-if="theRequest.ProvinceCode == '340000'">
|
||||
<view class="uni-flex ai-center analysis-tabs">
|
||||
<view class="uni-flex ai-center analysis-tabs tabs-enter">
|
||||
<!-- <view @tap="changeTab(3)" class="tab" :class="{'active': nowTab==3}">经营模式</view> -->
|
||||
<view @tap="changeTab(4)" class="tab" :class="{ 'active': nowTab == 4 }">车流分析</view>
|
||||
<view @tap="changeTab(1)" class="tab" :class="{ 'active': nowTab == 1 }">经营分析</view>
|
||||
<view @tap="changeTab(2)" class="tab" :class="{ 'active': nowTab == 2 }">客群分析</view>
|
||||
<view @tap="changeTab(4)" class="tab tab-slide" :class="{ 'active': nowTab == 4 }">车流分析</view>
|
||||
<view @tap="changeTab(1)" class="tab tab-slide" :class="{ 'active': nowTab == 1 }">经营分析</view>
|
||||
<view @tap="changeTab(2)" class="tab tab-slide" :class="{ 'active': nowTab == 2 }">客群分析</view>
|
||||
</view>
|
||||
|
||||
<!-- <view class="pie-content" v-show="nowTab==3">
|
||||
@ -98,36 +98,33 @@
|
||||
</view> -->
|
||||
</template>
|
||||
|
||||
<!-- 经营分析内容 -->
|
||||
<view v-show="nowTab == 1">
|
||||
<!-- 安徽省 -->
|
||||
<div class="pie-content">
|
||||
<div class="model-busniess">经营业态占比</div>
|
||||
<ServiceRevenuePie ref="serviceRevenuePie" v-if="ServiceRevenueData.length == 2 && nowTab == 1"
|
||||
<ServiceRevenuePie ref="serviceRevenuePie" v-show="ServiceRevenueData && ServiceRevenueData.length >= 2"
|
||||
:data="ServiceRevenueData" @selectCate="selectCate" />
|
||||
<!-- 其余省份 -->
|
||||
<!-- <canvas v-else-if="sellData.length>0" canvas-id="sellCate" id="sellCate" class="operation-cate-content" @click="touchPie($event,'sellCate')"></canvas> -->
|
||||
<div class="model-busniess">
|
||||
<div class="model-busniess progress-section-enter">
|
||||
<div>经营模式占比</div>
|
||||
<div class="progress-content">
|
||||
<div class="progress-left" :style="'width: ' + operationModel[0].bili + '%;'"></div>
|
||||
<div class="progress-right" :style="'width: ' + operationModel[1].bili + '%;'"></div>
|
||||
</div>
|
||||
<div class="uni-flex jc-between">
|
||||
<div style="color: #667ED5;font-size: 26rpx;">{{ operationModel[0].name }}: <span
|
||||
style="font-size: 26rpx;">{{
|
||||
<div style="color: #667ED5;">{{ operationModel[0].name }}: <span style="font-size: 32rpx;">{{
|
||||
operationModel[0].bili }}</span>%</div>
|
||||
<div style="color: #F3AF50;font-size: 26rpx;" v-if="operationModel[1].name">{{ operationModel[1].name
|
||||
}}:
|
||||
<span style="font-size: 26rpx;">{{ operationModel[1].bili }}</span>%
|
||||
<div style="color: #F3AF50;" v-if="operationModel[1].name">{{ operationModel[1].name }}:
|
||||
<span style="font-size: 32rpx;">{{ operationModel[1].bili }}</span>%
|
||||
</div>
|
||||
</div>
|
||||
<div class="uni-flex jc-between">
|
||||
<div style="margin-bottom: 0;font-size: 24rpx;"><span style="font-size: 26rpx;">{{
|
||||
operationModel[0].data
|
||||
<div style="margin-bottom: 0;"><span style="font-size: 32rpx;">{{ operationModel[0].data
|
||||
}}</span>元
|
||||
</div>
|
||||
<div style="margin-bottom: 0;font-size: 24rpx;" v-if="operationModel[1].data"><span
|
||||
style="font-size: 26rpx;">{{
|
||||
<div style="margin-bottom: 0;" v-if="operationModel[1].data"><span style="font-size: 32rpx;">{{
|
||||
operationModel[1].data
|
||||
}}</span>元
|
||||
</div>
|
||||
@ -135,17 +132,19 @@
|
||||
</div>
|
||||
</div>
|
||||
<!-- 品牌列表 -->
|
||||
<div class="shop-box">
|
||||
<scroll-view scroll-x class="tab-shop" scroll-with-animation :scroll-left="scrollLeft">
|
||||
<div v-for="(n, i) in cateBrandList" :key="i" :id="`tabNum${i}`" class="cate-name"
|
||||
:class="{ 'active': nowShop == i }" @click="selectCate(i)">{{ n.Bussiness_Name }}</div>
|
||||
<div class="shop-box brand-list-enter">
|
||||
<scroll-view scroll-x class="tab-shop tab-shop-slide" scroll-with-animation :scroll-left="scrollLeft">
|
||||
<div v-for="(n, i) in cateBrandList" :key="i" :id="`tabNum${i}`" class="cate-name brand-tab-stagger"
|
||||
:class="{ 'active': nowShop == i }" @click="selectCate(i)"
|
||||
:style="'animation-delay: ' + (i * 0.05) + 's'">{{
|
||||
n.Bussiness_Name }}</div>
|
||||
</scroll-view>
|
||||
<div class="tab-content" v-if="cateBrandList.length">
|
||||
<div class="shop-card" v-for="(m, i) in cateBrandList[nowShop].listBrandModel" :key="i"
|
||||
@click="toBrandPage(m, i)">
|
||||
<div>
|
||||
<image v-if="m.Brand_ICO" :src="m.Brand_ICO" mode="aspectFit"></image>
|
||||
<image v-else src="/static/images/revenue/home.png" mode="aspectFit"></image>
|
||||
<div class="tab-content brand-cards-container" v-if="cateBrandList.length">
|
||||
<div class="shop-card brand-card-stagger" v-for="(m, i) in cateBrandList[nowShop].listBrandModel" :key="i"
|
||||
@click="toBrandPage(m, i)" :style="'animation-delay: ' + (i * 0.08) + 's'">
|
||||
<div class="brand-icon-wrapper">
|
||||
<image v-if="m.Brand_ICO" :src="m.Brand_ICO" mode="aspectFit" class="brand-icon"></image>
|
||||
<image v-else src="/static/images/revenue/home.png" mode="aspectFit" class="brand-icon"></image>
|
||||
</div>
|
||||
<div class="shop-name">{{ m.Brand_Name }}</div>
|
||||
<div class="price-num">¥ {{ m.Revenue_Amount ? $util.fmoney(m.Revenue_Amount, 2) : '0.00' }}
|
||||
@ -155,10 +154,10 @@
|
||||
</div>
|
||||
</view>
|
||||
|
||||
<view class="" v-show="nowTab == 2">
|
||||
<view class="tab-content-fade" v-show="nowTab == 2">
|
||||
<CustomerAnalysis ref="customerAna" :show="nowTab == 2" />
|
||||
</view>
|
||||
<view class="" v-show="nowTab == 4">
|
||||
<view class="tab-content-fade" v-show="nowTab == 4">
|
||||
<CarAnalysis ref="carAna" :show="nowTab == 4" />
|
||||
</view>
|
||||
|
||||
@ -320,8 +319,7 @@ export default {
|
||||
let d = date.getDate() - 1
|
||||
if (d - 8 < 0) {
|
||||
let num = 8 - d
|
||||
m = m - 1
|
||||
let changeMonth = m
|
||||
let changeMonth = m - 1
|
||||
if (changeMonth < 10) {
|
||||
changeMonth = '0' + changeMonth
|
||||
}
|
||||
@ -338,8 +336,13 @@ export default {
|
||||
day = d - 8
|
||||
startTime = `${y}-${m}-${day}`
|
||||
}
|
||||
console.log('mmm', m);
|
||||
|
||||
this.startTime = startTime
|
||||
this.endTime = `${y}-${m}-${d}`
|
||||
console.log('this.startTimethis.startTime', this.startTime);
|
||||
console.log('this.startTimethis.endTime', this.endTime);
|
||||
|
||||
|
||||
|
||||
},
|
||||
@ -368,7 +371,6 @@ export default {
|
||||
changeTab(value) {
|
||||
this.nowTab = value
|
||||
if (value == 2) {
|
||||
|
||||
let opt = this.theRequest
|
||||
const params = {
|
||||
serverpartId: opt.ServerpartIds,
|
||||
@ -480,8 +482,15 @@ export default {
|
||||
let colors1 = ['#FFAC37', '#d8ece9', '#e0e3f7', '#f7f5f6', '#b2b7e3'];
|
||||
let list = []
|
||||
let list2 = []
|
||||
|
||||
// 检查数据有效性
|
||||
if (!_this.pageData || !_this.pageData.listBusinessModel) {
|
||||
console.warn('pageData 或 listBusinessModel 无效')
|
||||
return
|
||||
}
|
||||
|
||||
_this.pageData.listBusinessModel.map((m, i) => {
|
||||
if (m.Revenue_Amount != 0) {
|
||||
if (m.Revenue_Amount && m.Revenue_Amount != 0) {
|
||||
let n = {
|
||||
name: m.Bussiness_Name,
|
||||
data: m.Revenue_Amount
|
||||
@ -506,24 +515,43 @@ export default {
|
||||
}
|
||||
|
||||
})
|
||||
if (list2.length > 0) {
|
||||
_this.ServiceRevenueData.push(list2)
|
||||
_this.sellData = list
|
||||
|
||||
// 构建完整的数据数组
|
||||
let fullServiceRevenueData = []
|
||||
|
||||
// 添加第一层数据
|
||||
if (list2.length > 0) {
|
||||
fullServiceRevenueData.push(list2)
|
||||
_this.sellData = list
|
||||
console.log('第一层数据准备:', list2)
|
||||
}
|
||||
|
||||
// 添加第二层数据
|
||||
if (_this.pageData.listCurBusinessModel && _this.pageData.listCurBusinessModel.length > 0) {
|
||||
let list = []
|
||||
let list3 = []
|
||||
_this.pageData.listCurBusinessModel.map(m => {
|
||||
if (m.Revenue_Amount != 0) {
|
||||
if (m.Revenue_Amount && m.Revenue_Amount != 0) {
|
||||
let n = {
|
||||
name: m.Bussiness_Name,
|
||||
value: m.Revenue_Amount
|
||||
}
|
||||
list.push(n)
|
||||
list3.push(n)
|
||||
}
|
||||
})
|
||||
_this.ServiceRevenueData.push(list)
|
||||
if (list3.length > 0) {
|
||||
fullServiceRevenueData.push(list3)
|
||||
console.log('第二层数据准备:', list3)
|
||||
}
|
||||
}
|
||||
|
||||
// 一次性设置完整数据，确保响应式更新
|
||||
if (fullServiceRevenueData.length > 0) {
|
||||
_this.$set(_this, 'ServiceRevenueData', fullServiceRevenueData)
|
||||
console.log('operationFn设置完整数据:', fullServiceRevenueData)
|
||||
}
|
||||
|
||||
console.log('最终 ServiceRevenueData:', _this.ServiceRevenueData)
|
||||
|
||||
if (list.length > 0) {
|
||||
_this.showPie({
|
||||
id: 'sellCate',
|
||||
@ -670,7 +698,7 @@ export default {
|
||||
_this.pageData = res.Result_Data
|
||||
if (res.Result_Data.listBusinessModel) {
|
||||
let list = JSON.parse(JSON.stringify(res.Result_Data.listBusinessModel))
|
||||
console.log('list', list)
|
||||
console.log('获取到业务数据:', list)
|
||||
if (list.length > 0) {
|
||||
let all = {
|
||||
Bussiness_Name: '全部',
|
||||
@ -687,12 +715,18 @@ export default {
|
||||
}
|
||||
})
|
||||
_this.cateBrandList = [all, ...list]
|
||||
|
||||
// 确保在数据设置后调用 operationFn
|
||||
_this.$nextTick(() => {
|
||||
_this.operationFn()
|
||||
})
|
||||
return
|
||||
}
|
||||
return
|
||||
}
|
||||
// 没有数据时清空相关数据
|
||||
_this.cateBrandList = []
|
||||
_this.$set(_this, 'ServiceRevenueData', [])
|
||||
})
|
||||
},
|
||||
// 获取头部卡片 展示信息
|
||||
@ -727,8 +761,11 @@ export default {
|
||||
colors: colors1,
|
||||
});
|
||||
// 经营业态
|
||||
// this.ServiceRevenueData = []
|
||||
this.ServiceRevenueData = [busniessTradeFathPie, busniessTradePie]
|
||||
if (busniessTradeFathPie && busniessTradeFathPie.length > 0 && busniessTradePie && busniessTradePie.length > 0) {
|
||||
this.$set(this, 'ServiceRevenueData', [busniessTradeFathPie, busniessTradePie])
|
||||
} else {
|
||||
this.$set(this, 'ServiceRevenueData', [])
|
||||
}
|
||||
if (totalData.uploadCount !== totalData.totalUploadCount) {
|
||||
this.getUnUpLoadShops(theRequest)
|
||||
|
||||
@ -1476,7 +1513,6 @@ cover-view.page-title {
|
||||
padding: 8rpx 24rpx;
|
||||
background: linear-gradient(135deg, #f8f9fa 0%, #ffffff 100%);
|
||||
border-radius: 12rpx;
|
||||
font-size: 28rpx;
|
||||
border: 1rpx solid #f0f0f0;
|
||||
box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.04);
|
||||
}
|
||||
@ -1507,4 +1543,370 @@ cover-view.page-title {
|
||||
background: linear-gradient(90deg, #ff9f43, #ffb84d);
|
||||
border-radius: 0 6rpx 6rpx 0;
|
||||
}
|
||||
|
||||
/* 动画效果 - UniApp微信小程序兼容版本 */
|
||||
|
||||
/* 页面入场动画 */
|
||||
@keyframes pageEnter {
|
||||
0% {
|
||||
opacity: 0;
|
||||
transform: translateY(50rpx);
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 1;
|
||||
transform: translateY(0);
|
||||
}
|
||||
}
|
||||
|
||||
.page-enter {
|
||||
animation: pageEnter 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards;
|
||||
}
|
||||
|
||||
/* 卡片入场动画 */
|
||||
@keyframes cardEnter {
|
||||
0% {
|
||||
opacity: 0;
|
||||
transform: translateY(30rpx) scale(0.95);
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 1;
|
||||
transform: translateY(0) scale(1);
|
||||
}
|
||||
}
|
||||
|
||||
.card-enter {
|
||||
animation: cardEnter 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.1s forwards;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
/* 数据卡片动画 */
|
||||
@keyframes dataCardEnter {
|
||||
0% {
|
||||
opacity: 0;
|
||||
transform: translateY(20rpx);
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 1;
|
||||
transform: translateY(0);
|
||||
}
|
||||
}
|
||||
|
||||
.data-card-enter {
|
||||
animation: dataCardEnter 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.2s forwards;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
/* 指标动画 */
|
||||
@keyframes metricEnter {
|
||||
0% {
|
||||
opacity: 0;
|
||||
transform: translateY(15rpx);
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 1;
|
||||
transform: translateY(0);
|
||||
}
|
||||
}
|
||||
|
||||
.metric-enter:nth-child(1) {
|
||||
animation: metricEnter 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.3s forwards;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.metric-enter:nth-child(2) {
|
||||
animation: metricEnter 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.4s forwards;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.metric-enter:nth-child(3) {
|
||||
animation: metricEnter 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.5s forwards;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.metric-enter:nth-child(4) {
|
||||
animation: metricEnter 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.6s forwards;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
/* Tab标签页动画 */
|
||||
@keyframes tabsEnter {
|
||||
0% {
|
||||
opacity: 0;
|
||||
transform: translateY(20rpx);
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 1;
|
||||
transform: translateY(0);
|
||||
}
|
||||
}
|
||||
|
||||
.tabs-enter {
|
||||
animation: tabsEnter 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.4s forwards;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
@keyframes tabSlide {
|
||||
0% {
|
||||
opacity: 0;
|
||||
transform: translateX(-20rpx);
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 1;
|
||||
transform: translateX(0);
|
||||
}
|
||||
}
|
||||
|
||||
.tab-slide:nth-child(1) {
|
||||
animation: tabSlide 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.5s forwards;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.tab-slide:nth-child(2) {
|
||||
animation: tabSlide 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.6s forwards;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.tab-slide:nth-child(3) {
|
||||
animation: tabSlide 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.7s forwards;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
/* Tab内容淡入动画 */
|
||||
@keyframes tabContentFade {
|
||||
0% {
|
||||
opacity: 0;
|
||||
transform: translateY(10rpx);
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 1;
|
||||
transform: translateY(0);
|
||||
}
|
||||
}
|
||||
|
||||
.tab-content-fade {
|
||||
animation: tabContentFade 0.4s ease-out forwards;
|
||||
}
|
||||
|
||||
/* 图表容器动画 */
|
||||
@keyframes chartContainerEnter {
|
||||
0% {
|
||||
opacity: 0;
|
||||
transform: translateY(30rpx) scale(0.98);
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 1;
|
||||
transform: translateY(0) scale(1);
|
||||
}
|
||||
}
|
||||
|
||||
.chart-container-enter {
|
||||
animation: chartContainerEnter 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.6s forwards;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
/* 标题滑入动画 */
|
||||
@keyframes titleSlideIn {
|
||||
0% {
|
||||
opacity: 0;
|
||||
transform: translateX(-30rpx);
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 1;
|
||||
transform: translateX(0);
|
||||
}
|
||||
}
|
||||
|
||||
.title-slide-in {
|
||||
animation: titleSlideIn 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.7s forwards;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
/* 进度条区域动画 */
|
||||
@keyframes progressSectionEnter {
|
||||
0% {
|
||||
opacity: 0;
|
||||
transform: translateY(20rpx);
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 1;
|
||||
transform: translateY(0);
|
||||
}
|
||||
}
|
||||
|
||||
.progress-section-enter {
|
||||
animation: progressSectionEnter 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.8s forwards;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
/* 品牌列表动画 */
|
||||
@keyframes brandListEnter {
|
||||
0% {
|
||||
opacity: 0;
|
||||
transform: translateY(25rpx);
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 1;
|
||||
transform: translateY(0);
|
||||
}
|
||||
}
|
||||
|
||||
.brand-list-enter {
|
||||
animation: brandListEnter 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.9s forwards;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
/* 品牌卡片错列动画 */
|
||||
@keyframes brandCardStagger {
|
||||
0% {
|
||||
opacity: 0;
|
||||
transform: translateY(20rpx) scale(0.95);
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 1;
|
||||
transform: translateY(0) scale(1);
|
||||
}
|
||||
}
|
||||
|
||||
.brand-card-stagger {
|
||||
animation: brandCardStagger 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94) 1s forwards;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
/* 交互反馈动画 */
|
||||
.tab-slide:active,
|
||||
.brand-card-stagger:active {
|
||||
transform: scale(0.98);
|
||||
transition: transform 0.1s ease-out;
|
||||
}
|
||||
|
||||
/* 图表加载状态 */
|
||||
.chart-loading {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
height: 300rpx;
|
||||
color: #999;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
|
||||
/* 品牌标签页动画 */
|
||||
@keyframes tabShopSlide {
|
||||
0% {
|
||||
opacity: 0;
|
||||
transform: translateY(15rpx);
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 1;
|
||||
transform: translateY(0);
|
||||
}
|
||||
}
|
||||
|
||||
.tab-shop-slide {
|
||||
animation: tabShopSlide 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94) 1.1s forwards;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
/* 品牌标签错列动画 */
|
||||
@keyframes brandTabStagger {
|
||||
0% {
|
||||
opacity: 0;
|
||||
transform: translateX(-15rpx);
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 1;
|
||||
transform: translateX(0);
|
||||
}
|
||||
}
|
||||
|
||||
.brand-tab-stagger {
|
||||
animation: brandTabStagger 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94) 1.2s forwards;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
/* 品牌卡片容器动画 */
|
||||
@keyframes brandCardsContainer {
|
||||
0% {
|
||||
opacity: 0;
|
||||
transform: translateY(20rpx);
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 1;
|
||||
transform: translateY(0);
|
||||
}
|
||||
}
|
||||
|
||||
.brand-cards-container {
|
||||
animation: brandCardsContainer 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94) 1.3s forwards;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
/* 品牌图标包装器动画 */
|
||||
@keyframes brandIconWrapper {
|
||||
0% {
|
||||
opacity: 0;
|
||||
transform: scale(0.8) rotate(-5deg);
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 1;
|
||||
transform: scale(1) rotate(0deg);
|
||||
}
|
||||
}
|
||||
|
||||
.brand-icon-wrapper {
|
||||
animation: brandIconWrapper 0.5s cubic-bezier(0.34, 1.56, 0.64, 1) forwards;
|
||||
animation-delay: inherit;
|
||||
}
|
||||
|
||||
.brand-icon {
|
||||
transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
|
||||
}
|
||||
|
||||
/* 品牌卡片悬浮效果增强 */
|
||||
.brand-card-stagger:active .brand-icon-wrapper {
|
||||
transform: scale(0.9) rotate(2deg);
|
||||
}
|
||||
|
||||
.brand-card-stagger:active .shop-name {
|
||||
transform: translateY(2rpx);
|
||||
}
|
||||
|
||||
.brand-card-stagger:active .price-num {
|
||||
transform: scale(1.05);
|
||||
}
|
||||
|
||||
/* 品牌标签活跃状态动画 */
|
||||
.brand-tab-stagger.active {
|
||||
animation: brandTabStagger 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards,
|
||||
tabActivePulse 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.2s forwards;
|
||||
}
|
||||
|
||||
@keyframes tabActivePulse {
|
||||
0% {
|
||||
transform: scale(1);
|
||||
}
|
||||
|
||||
50% {
|
||||
transform: scale(1.05);
|
||||
}
|
||||
|
||||
100% {
|
||||
transform: scale(1);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -6,11 +6,11 @@
|
||||
<view class="tab-icon">🏪</view>
|
||||
<text class="tab-text">商超</text>
|
||||
</view>
|
||||
<view class="tab-item" @tap="selectTab(2000)" :class="{ 'active': nowRank == 2000 }">
|
||||
<view class="tab-item" @tap="selectTab(3000)" :class="{ 'active': nowRank == 3000 }">
|
||||
<view class="tab-icon">🍽️</view>
|
||||
<text class="tab-text">餐饮</text>
|
||||
</view>
|
||||
<view class="tab-item" @tap="selectTab(3000)" :class="{ 'active': nowRank == 3000 }">
|
||||
<view class="tab-item" @tap="selectTab(2000)" :class="{ 'active': nowRank == 2000 }">
|
||||
<view class="tab-icon">🍿</view>
|
||||
<text class="tab-text">小吃</text>
|
||||
</view>
|
||||
@ -85,7 +85,7 @@ export default {
|
||||
/* 现代化选项卡 */
|
||||
.ranking-tabs {
|
||||
display: flex;
|
||||
background: #fff;
|
||||
background: #f8f9fa;
|
||||
border-radius: 12rpx;
|
||||
padding: 6rpx;
|
||||
margin: 0 20rpx 24rpx;
|
||||
@ -105,12 +105,12 @@ export default {
|
||||
cursor: pointer;
|
||||
|
||||
&.active {
|
||||
background: linear-gradient(135deg, #27B25F, #4CCC7F);
|
||||
box-shadow: 0 4rpx 12rpx rgba(39, 178, 95, 0.3);
|
||||
background: linear-gradient(135deg, #27B25F, #4CCC7F) !important;
|
||||
box-shadow: 0 4rpx 12rpx rgba(39, 178, 95, 0.3) !important;
|
||||
transform: translateY(-2rpx);
|
||||
|
||||
.tab-text {
|
||||
color: #fff;
|
||||
color: #fff !important;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
@ -260,7 +260,7 @@ export default {
|
||||
}
|
||||
|
||||
.item-name {
|
||||
font-size: 24rpx;
|
||||
font-size: 28rpx;
|
||||
color: #333;
|
||||
font-weight: 600;
|
||||
margin-bottom: 12rpx;
|
||||
@ -338,7 +338,8 @@ export default {
|
||||
|
||||
/* 主题色支持 - 通过全局主题类控制 */
|
||||
:global(.province-theme-330200) .tab-item.active {
|
||||
background: linear-gradient(135deg, #1890FF, #69C0FF);
|
||||
background: linear-gradient(135deg, #1890FF, #69C0FF) !important;
|
||||
box-shadow: 0 4rpx 12rpx rgba(24, 144, 255, 0.3) !important;
|
||||
|
||||
.stat-value.sales-amount {
|
||||
color: #1890FF;
|
||||
@ -346,7 +347,8 @@ export default {
|
||||
}
|
||||
|
||||
:global(.province-theme-340000) .tab-item.active {
|
||||
background: linear-gradient(135deg, #748ED6, #91A7E3);
|
||||
background: linear-gradient(135deg, #748ED6, #91A7E3) !important;
|
||||
box-shadow: 0 4rpx 12rpx rgba(116, 142, 214, 0.3) !important;
|
||||
|
||||
.stat-value.sales-amount {
|
||||
color: #748ED6;
|
||||
@ -354,7 +356,8 @@ export default {
|
||||
}
|
||||
|
||||
:global(.province-theme-500000) .tab-item.active {
|
||||
background: linear-gradient(135deg, #FA541C, #FF7A45);
|
||||
background: linear-gradient(135deg, #FA541C, #FF7A45) !important;
|
||||
box-shadow: 0 4rpx 12rpx rgba(250, 84, 28, 0.3) !important;
|
||||
|
||||
.stat-value.sales-amount {
|
||||
color: #FA541C;
|
||||
@ -362,7 +365,8 @@ export default {
|
||||
}
|
||||
|
||||
:global(.province-theme-510000) .tab-item.active {
|
||||
background: linear-gradient(135deg, #FA8C16, #FFA940);
|
||||
background: linear-gradient(135deg, #FA8C16, #FFA940) !important;
|
||||
box-shadow: 0 4rpx 12rpx rgba(250, 140, 22, 0.3) !important;
|
||||
|
||||
.stat-value.sales-amount {
|
||||
color: #FA8C16;
|
||||
@ -370,7 +374,8 @@ export default {
|
||||
}
|
||||
|
||||
:global(.province-theme-520000) .tab-item.active {
|
||||
background: linear-gradient(135deg, #52C41A, #73D13D);
|
||||
background: linear-gradient(135deg, #52C41A, #73D13D) !important;
|
||||
box-shadow: 0 4rpx 12rpx rgba(82, 196, 26, 0.3) !important;
|
||||
|
||||
.stat-value.sales-amount {
|
||||
color: #52C41A;
|
||||
@ -378,7 +383,8 @@ export default {
|
||||
}
|
||||
|
||||
:global(.province-theme-530000) .tab-item.active {
|
||||
background: linear-gradient(135deg, #27B25F, #4CCC7F);
|
||||
background: linear-gradient(135deg, #27B25F, #4CCC7F) !important;
|
||||
box-shadow: 0 4rpx 12rpx rgba(39, 178, 95, 0.3) !important;
|
||||
|
||||
.stat-value.sales-amount {
|
||||
color: #27B25F;
|
||||
@ -386,7 +392,8 @@ export default {
|
||||
}
|
||||
|
||||
:global(.province-theme-630000) .tab-item.active {
|
||||
background: linear-gradient(135deg, #13C2C2, #36CFC9);
|
||||
background: linear-gradient(135deg, #13C2C2, #36CFC9) !important;
|
||||
box-shadow: 0 4rpx 12rpx rgba(19, 194, 194, 0.3) !important;
|
||||
|
||||
.stat-value.sales-amount {
|
||||
color: #13C2C2;
|
||||
@ -394,7 +401,8 @@ export default {
|
||||
}
|
||||
|
||||
:global(.province-theme-734100) .tab-item.active {
|
||||
background: linear-gradient(135deg, #E91E63, #F06292);
|
||||
background: linear-gradient(135deg, #E91E63, #F06292) !important;
|
||||
box-shadow: 0 4rpx 12rpx rgba(233, 30, 99, 0.3) !important;
|
||||
|
||||
.stat-value.sales-amount {
|
||||
color: #E91E63;
|
||||
|
||||
@ -32,33 +32,44 @@ const methods = {
|
||||
Serverpart_ID: obj.ServerpartIds ? obj.ServerpartIds : ''
|
||||
}
|
||||
this.provinceCode = obj.ProvinceCode
|
||||
// 营收数据
|
||||
const data = await request.$webGet('CommercialApi/Revenue/GetRevenuePushList', requestParamas)
|
||||
if (data.Result_Code != 100) return
|
||||
|
||||
// 在营门店数量统计
|
||||
const busniessCounts = await request.$webGet('CommercialApi/BaseInfo/GetShopCountList', requestParamas)
|
||||
if (busniessCounts.Result_Code != 100) return
|
||||
try {
|
||||
// 并行请求优化：同时发起所有API请求，减少加载时间
|
||||
const [data, busniessCounts, tradeData, budgetAmount, mobileShare, mallDeliver, bayonetCount] = await Promise.all([
|
||||
request.$webGet('CommercialApi/Revenue/GetRevenuePushList', requestParamas),
|
||||
request.$webGet('CommercialApi/BaseInfo/GetShopCountList', requestParamas),
|
||||
request.$webGet('CommercialApi/BaseInfo/GetBusinessTradeList', requestParamas),
|
||||
request.$webGet('CommercialApi/Revenue/GetBudgetExpenseList', requestParamasBudget),
|
||||
request.$webGet('CommercialApi/Revenue/GetMobileShare', requestParamas),
|
||||
request.$webGet('CommercialApi/Revenue/GetMallDeliver', requestParamas),
|
||||
request.$webGet('CommercialApi/Revenue/GetSPBayonetList', requestParamas)
|
||||
])
|
||||
|
||||
// 业态关系
|
||||
const tradeData = await request.$webGet('CommercialApi/BaseInfo/GetBusinessTradeList', requestParamas)
|
||||
if (tradeData.Result_Code != 100) return
|
||||
|
||||
// 计划营收金额
|
||||
const budgetAmount = await request.$webGet('CommercialApi/Revenue/GetBudgetExpenseList', requestParamasBudget)
|
||||
if (budgetAmount.Result_Code != 100) return
|
||||
|
||||
// 移动支付分账数据
|
||||
const mobileShare = await request.$webGet('CommercialApi/Revenue/GetMobileShare', requestParamas)
|
||||
if (mobileShare.Result_Code != 100) return
|
||||
|
||||
// 万佳商城配送数据
|
||||
const mallDeliver = await request.$webGet('CommercialApi/Revenue/GetMallDeliver', requestParamas)
|
||||
if (mallDeliver.Result_Code != 100) return
|
||||
|
||||
// 片区车流量
|
||||
const bayonetCount = await request.$webGet('CommercialApi/Revenue/GetSPBayonetList', requestParamas)
|
||||
if (bayonetCount.Result_Code != 100) return
|
||||
// 检查数据有效性
|
||||
if (data.Result_Code != 100 ||
|
||||
busniessCounts.Result_Code != 100 ||
|
||||
tradeData.Result_Code != 100 ||
|
||||
budgetAmount.Result_Code != 100 ||
|
||||
mobileShare.Result_Code != 100 ||
|
||||
mallDeliver.Result_Code != 100 ||
|
||||
bayonetCount.Result_Code != 100) {
|
||||
console.error('部分API请求失败', {
|
||||
data: data.Result_Code,
|
||||
busniessCounts: busniessCounts.Result_Code,
|
||||
tradeData: tradeData.Result_Code,
|
||||
budgetAmount: budgetAmount.Result_Code,
|
||||
mobileShare: mobileShare.Result_Code,
|
||||
mallDeliver: mallDeliver.Result_Code,
|
||||
bayonetCount: bayonetCount.Result_Code
|
||||
})
|
||||
// 返回一个默认的空数据结构，而不是undefined
|
||||
return [[], {
|
||||
cashPay: 0,
|
||||
ticketCount: 0,
|
||||
totalCount: 0,
|
||||
uploadState: '0/0'
|
||||
}, [], [], [], []]
|
||||
}
|
||||
|
||||
if (isServerPartDetail) { // 是服务区营收推送页面
|
||||
return _this.getSeverpartReginList(data.Result_Data.List, busniessCounts.Result_Data.List,
|
||||
@ -69,6 +80,17 @@ const methods = {
|
||||
bayonetCount.Result_Data.List, mobileShare.Result_Data, mallDeliver.Result_Data)
|
||||
// [reginList, totalData, busniessTypePie, busniessTradePie]
|
||||
|
||||
} catch (error) {
|
||||
console.error('API请求出错:', error)
|
||||
// 返回默认空数据结构
|
||||
return [[], {
|
||||
cashPay: 0,
|
||||
ticketCount: 0,
|
||||
totalCount: 0,
|
||||
uploadState: '0/0'
|
||||
}, [], [], [], []]
|
||||
}
|
||||
|
||||
},
|
||||
getTotalShowData(newData, oldData, index) {
|
||||
// <TotalModel>
|
||||
|
||||
@ -1,11 +1,12 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="analysis-cell" @tap="toggleShow" :class="{ 'active': item.show }" :style="activeCellStyleStr">
|
||||
<div class="shop-title" :class="'theme-' + provinceCode">
|
||||
<div class="analysis-cell cell-enter" @tap="toggleShow" :class="{ 'active': item.show }"
|
||||
:style="activeCellStyleStr">
|
||||
<div class="shop-title title-slide" :class="'theme-' + provinceCode">
|
||||
<span> {{ (i > 8 ? i + 1 : '0' + (i + 1)) + ' ' + item.SHOPNAME }}</span>
|
||||
<p>
|
||||
<span v-show="item.UNACCOUNT_SIGN">￥</span>
|
||||
<span class="cell-price" :style="priceStyleStr">{{
|
||||
<span class="cell-price price-highlight" :style="priceStyleStr">{{
|
||||
item.UNACCOUNT_SIGN
|
||||
? $util.fmoney(item.CASHPAY_TOTAL, 2) : '无结账信息' }}</span>
|
||||
<image src="/static/images/effective/true.png" mode="aspectFit" class="" v-if='item.SHOWDEAL_SIGN'>
|
||||
@ -14,11 +15,11 @@
|
||||
|
||||
</p>
|
||||
</div>
|
||||
<p v-if="item.detail.length > 0" style="line-height: 1.2;">
|
||||
<p v-if="item.detail.length > 0" style="line-height: 1.2;" class="tags-container">
|
||||
<span v-for="(child, index) in item.detail" :key="index" class="atribute-tag">{{ child }} </span>
|
||||
</p>
|
||||
</div>
|
||||
<div class="analysis-detail" v-show="item.show">
|
||||
<div class="analysis-detail" v-if="item.show">
|
||||
<div class="detail-unit" v-for="(unit, o) in item.ShopEndAccountList" :key="o">
|
||||
<div class="uni-inline-flex">
|
||||
<span class="detail-title">结账时间：</span>
|
||||
@ -31,24 +32,23 @@
|
||||
</div>
|
||||
<block v-if="unit.DESCRIPTION_DATE">
|
||||
|
||||
<div class="detail-title">日结校验：{{ unit.DESCRIPTION_DATE }}</div>
|
||||
<p><span class="detail-title">{{ unit.DESCRIPTION_STAFF }}：</span><span style="font-size: 24rpx;">{{
|
||||
<div class="detail-title" style="font-size: 24rpx;">日结校验：{{ unit.DESCRIPTION_DATE }}</div>
|
||||
<p><span class="detail-title" style="font-size: 24rpx;">{{ unit.DESCRIPTION_STAFF }}：</span><span>{{
|
||||
unit.DIFFERENCE_REASON
|
||||
}}</span>
|
||||
</p>
|
||||
</block>
|
||||
<block v-if="unit.APPROVE_DATE">
|
||||
<div><span class="detail-title">日结审核：{{ unit.APPROVE_DATE }}</span></div>
|
||||
<p><span class="detail-title" style="font-size: 24rpx;">{{ unit.APPROVE_STAFF }}：</span><span
|
||||
style="font-size: 24rpx;">{{
|
||||
<div><span class="detail-title" style="font-size: 24rpx;">日结审核：{{ unit.APPROVE_DATE }}</span></div>
|
||||
<p><span class="detail-title" style="font-size: 24rpx;">{{ unit.APPROVE_STAFF }}：</span><span>{{
|
||||
unit.APPROVED_INFO }}</span>
|
||||
</p>
|
||||
</block>
|
||||
<div>
|
||||
<p class="detail-short-info" v-show="unit.FACTAMOUNT_SALE">单品报表：<text
|
||||
class="uni-icon uni-icon-checkmarkempty"></text></p>
|
||||
<p class="detail-short-info" v-show="unit.FACTAMOUNT_CIGARETTE">香烟数据：<span
|
||||
class="uni-icon uni-icon-checkmarkempty"></span></p>
|
||||
<p class="detail-short-info" v-show="unit.FACTAMOUNT_SALE" style="font-size: 24rpx;"> 单品报表：<text
|
||||
class="uni-icon uni-icon-checkmarkempty" style="font-size: 24rpx;"></text></p>
|
||||
<p class="detail-short-info" v-show="unit.FACTAMOUNT_CIGARETTE" style="font-size: 24rpx;">香烟数据：<span
|
||||
class="uni-icon uni-icon-checkmarkempty" style="font-size: 24rpx;"></span></p>
|
||||
</div>
|
||||
<div><span class="detail-title detail-short-info" style="font-size: 24rpx;">稽核次数：{{ unit.CHECK_COUNT }}
|
||||
次</span><span class="detail-short-info" style="font-size: 24rpx;">长短款额：{{
|
||||
@ -128,7 +128,7 @@ export default {
|
||||
|
||||
// 动态样式字符串（小程序兼容）
|
||||
activeCellStyleStr() {
|
||||
if (!this.item.show) return ''
|
||||
if (!this.item || !this.item.show) return ''
|
||||
return `border: 2rpx solid ${this.themeColors.primary}; box-shadow: 0 4px 20px rgba(${this.hexToRgb(this.themeColors.primary)}, 0.15);`
|
||||
},
|
||||
|
||||
@ -376,4 +376,159 @@ export default {
|
||||
font-size: 28rpx;
|
||||
}
|
||||
}
|
||||
|
||||
/* 动画效果 - listUnit组件 */
|
||||
|
||||
/* 单元格入场动画 */
|
||||
@keyframes cellEnter {
|
||||
0% {
|
||||
opacity: 0;
|
||||
transform: translateY(20rpx) scale(0.95);
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 1;
|
||||
transform: translateY(0) scale(1);
|
||||
}
|
||||
}
|
||||
|
||||
.cell-enter {
|
||||
animation: cellEnter 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
/* 标题滑入动画 */
|
||||
@keyframes titleSlide {
|
||||
0% {
|
||||
opacity: 0;
|
||||
transform: translateX(-15rpx);
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 1;
|
||||
transform: translateX(0);
|
||||
}
|
||||
}
|
||||
|
||||
.title-slide {
|
||||
animation: titleSlide 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.1s forwards;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
/* 价格高亮动画 */
|
||||
@keyframes priceHighlight {
|
||||
0% {
|
||||
opacity: 0;
|
||||
transform: scale(0.8);
|
||||
}
|
||||
|
||||
50% {
|
||||
transform: scale(1.1);
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 1;
|
||||
transform: scale(1);
|
||||
}
|
||||
}
|
||||
|
||||
.price-highlight {
|
||||
animation: priceHighlight 0.6s cubic-bezier(0.68, -0.55, 0.265, 1.55) 0.2s forwards;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
/* 标签容器动画 */
|
||||
@keyframes tagsContainer {
|
||||
0% {
|
||||
opacity: 0;
|
||||
transform: translateY(10rpx);
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 1;
|
||||
transform: translateY(0);
|
||||
}
|
||||
}
|
||||
|
||||
.tags-container {
|
||||
animation: tagsContainer 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.2s forwards;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
/* 标签弹跳动画 */
|
||||
@keyframes tagBounce {
|
||||
0% {
|
||||
opacity: 0;
|
||||
transform: translateY(-10rpx) scale(0.8);
|
||||
}
|
||||
|
||||
60% {
|
||||
transform: translateY(2rpx) scale(1.05);
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 1;
|
||||
transform: translateY(0) scale(1);
|
||||
}
|
||||
}
|
||||
|
||||
.tag-bounce {
|
||||
animation: tagBounce 0.6s cubic-bezier(0.68, -0.55, 0.265, 1.55) forwards;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
/* 详情展开动画 */
|
||||
@keyframes detailExpand {
|
||||
0% {
|
||||
opacity: 0;
|
||||
max-height: 0;
|
||||
transform: translateY(-20rpx);
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 1;
|
||||
max-height: 2000rpx;
|
||||
transform: translateY(0);
|
||||
}
|
||||
}
|
||||
|
||||
.detail-expand {
|
||||
animation: detailExpand 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
/* 详情单元淡入动画 */
|
||||
@keyframes unitFadeIn {
|
||||
0% {
|
||||
opacity: 0;
|
||||
transform: translateY(15rpx);
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 1;
|
||||
transform: translateY(0);
|
||||
}
|
||||
}
|
||||
|
||||
.unit-fade-in {
|
||||
animation: unitFadeIn 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
/* 交互反馈动画 */
|
||||
.cell-enter:active {
|
||||
transform: scale(0.98);
|
||||
transition: transform 0.1s ease-out;
|
||||
}
|
||||
|
||||
.tag-bounce:hover {
|
||||
transform: translateY(-2rpx) scale(1.02);
|
||||
transition: all 0.2s cubic-bezier(0.25, 0.46, 0.45, 0.94);
|
||||
}
|
||||
|
||||
/* 单元格活跃状态增强 */
|
||||
.analysis-cell.active {
|
||||
transform: translateY(-2rpx);
|
||||
transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -557,7 +557,7 @@ export default {
|
||||
methods: {
|
||||
toggleCard(isup) {
|
||||
this.isup = !isup;
|
||||
this.$forceUpdate();
|
||||
// 移除不必要的$forceUpdate，由Vue自动检测变化
|
||||
},
|
||||
bindDateChange(e) {
|
||||
// 切换日期 加载选中日期的营收数据
|
||||
@ -574,10 +574,16 @@ export default {
|
||||
title: "正在加载...",
|
||||
mask: true,
|
||||
});
|
||||
this.getData();
|
||||
this.getTender();
|
||||
this.todayAmount();
|
||||
this.$forceUpdate();
|
||||
// 异步并行加载数据
|
||||
Promise.all([
|
||||
this.getData(),
|
||||
this.getTender(),
|
||||
this.todayAmount()
|
||||
]).catch(err => {
|
||||
console.error('数据刷新失败:', err);
|
||||
uni.hideLoading();
|
||||
});
|
||||
// 移除不必要的$forceUpdate
|
||||
}
|
||||
},
|
||||
toDetail(item, provinceId) {
|
||||
@ -610,15 +616,15 @@ export default {
|
||||
"navigateTo",
|
||||
canToSeverpartIndex ? severpartIndexPath : serverpartUploadPath
|
||||
);
|
||||
item.visited = true;
|
||||
this.$forceUpdate();
|
||||
// 使用Vue.set确保响应式更新
|
||||
this.$set(item, 'visited', true);
|
||||
},
|
||||
selectTab(name, index) {
|
||||
this[name] = index;
|
||||
},
|
||||
toggleRegion(item) {
|
||||
item.show = !item.show ? true : false;
|
||||
this.$forceUpdate();
|
||||
// 使用Vue.set确保响应式更新
|
||||
this.$set(item, 'show', !item.show);
|
||||
},
|
||||
touchPie(e, id) {
|
||||
rincanvas[id].showToolTip(e, {
|
||||
@ -647,7 +653,7 @@ export default {
|
||||
totalTicketCount: res.Data.TOTALTICKET,
|
||||
avrticketCount: this.$util.fmoney(avrticket, 2),
|
||||
};
|
||||
_this.$forceUpdate();
|
||||
// 移除不必要的$forceUpdate，由Vue自动检测变化
|
||||
});
|
||||
},
|
||||
getRankmMap(list) {
|
||||
@ -660,7 +666,7 @@ export default {
|
||||
});
|
||||
return map;
|
||||
},
|
||||
getData() {
|
||||
async getData() {
|
||||
let _this = this;
|
||||
let theRequest = _this.theRequest;
|
||||
let provinceCode = _this.theRequest.ProvinceCode;
|
||||
@ -672,7 +678,7 @@ export default {
|
||||
Statistics_Date: theRequest.time,
|
||||
};
|
||||
|
||||
this.$request.$get("getRevenuePush", arr).then((res) => {
|
||||
return this.$request.$get("getRevenuePush", arr).then((res) => {
|
||||
console.log("res", res);
|
||||
_this.isLoading = false;
|
||||
if (res.ResultCode != 100) {
|
||||
@ -711,7 +717,7 @@ export default {
|
||||
}
|
||||
uni.hideLoading();
|
||||
_this.showPage = true;
|
||||
_this.$forceUpdate();
|
||||
// 移除不必要的$forceUpdate，由Vue自动检测变化
|
||||
});
|
||||
|
||||
function sortMount(list) {
|
||||
@ -1182,8 +1188,8 @@ export default {
|
||||
},
|
||||
toggleShow(i) {
|
||||
let item = this.regionList[i];
|
||||
item.show = !item.show;
|
||||
this.$forceUpdate();
|
||||
// 使用Vue.set确保响应式更新
|
||||
this.$set(item, 'show', !item.show);
|
||||
},
|
||||
|
||||
changeDate(name, index) {
|
||||
@ -1200,7 +1206,7 @@ export default {
|
||||
});
|
||||
},
|
||||
|
||||
getTender() {
|
||||
async getTender() {
|
||||
// 营收趋势
|
||||
let _this = this;
|
||||
let obj = this.theRequest;
|
||||
@ -1216,7 +1222,7 @@ export default {
|
||||
2: [],
|
||||
3: [],
|
||||
};
|
||||
_this.$request
|
||||
return _this.$request
|
||||
.$webGet("WeChat/GetRevenueTrends", {
|
||||
Statictics_Type: "Week",
|
||||
Report_Type: Report_Type[typeIndex],
|
||||
@ -1266,7 +1272,7 @@ export default {
|
||||
},
|
||||
],
|
||||
});
|
||||
_this.$forceUpdate();
|
||||
// 移除不必要的$forceUpdate，由Vue自动检测变化
|
||||
});
|
||||
bili.forEach((biliName, i) => {
|
||||
if (i == 1) {
|
||||
@ -1345,58 +1351,48 @@ export default {
|
||||
},
|
||||
onLoad(option) {
|
||||
console.log("indexOption", option);
|
||||
uni.showLoading({
|
||||
title: "正在加载...",
|
||||
});
|
||||
|
||||
const toSnhuiPageProvinceCode = [
|
||||
340000, 520000, 451200, 510000, 530000, 620000, 630000, 330200, 330300, 734100
|
||||
]; // 需要跳转到安徽类型的每日营收推送页面
|
||||
|
||||
// 优化：先判断是否需要跳转，避免不必要的资源加载
|
||||
if (option.ProvinceCode) {
|
||||
// 从推送进入
|
||||
console.log(
|
||||
"12321312",
|
||||
toSnhuiPageProvinceCode.indexOf(parseInt(option.ProvinceCode))
|
||||
);
|
||||
// 从推送进入 - 立即判断跳转，避免资源浪费
|
||||
if (toSnhuiPageProvinceCode.indexOf(parseInt(option.ProvinceCode)) > -1) {
|
||||
// 451200、510000、520000、620000、630000、330200
|
||||
uni.redirectTo({
|
||||
url:
|
||||
"/pages/everdayRenven/AnhuiIndex?ProvinceCode=" +
|
||||
// 直接跳转，不显示loading，不加载当前页面数据
|
||||
const url = "/pages/everdayRenven/AnhuiIndex?ProvinceCode=" +
|
||||
option.ProvinceCode +
|
||||
"&time=" +
|
||||
option.time +
|
||||
"&GroupType=" +
|
||||
option.GroupType +
|
||||
"&ServerpartIds=" +
|
||||
option.ServerpartIds,
|
||||
});
|
||||
option.ServerpartIds;
|
||||
|
||||
console.log('推送跳转到AnhuiIndex，参数:', url);
|
||||
uni.redirectTo({ url });
|
||||
return;
|
||||
}
|
||||
this.theRequest = option;
|
||||
option.time = this.$util.cutDate(option.time, "YYYY-MM-DD");
|
||||
|
||||
this.getData();
|
||||
this.getTender();
|
||||
} else {
|
||||
// 默认
|
||||
// 默认情况 - 也要先判断是否跳转
|
||||
if (this.PushAuthority.length > 0) {
|
||||
console.log(1);
|
||||
this.theRequest = this.defaultMsg() || {};
|
||||
if (
|
||||
toSnhuiPageProvinceCode.indexOf(this.theRequest.ProvinceCode) > -1
|
||||
) {
|
||||
uni.redirectTo({
|
||||
url: "/pages/everdayRenven/AnhuiIndex",
|
||||
});
|
||||
// 直接跳转，传递完整参数
|
||||
const url = "/pages/everdayRenven/AnhuiIndex?" +
|
||||
"ProvinceCode=" + this.theRequest.ProvinceCode +
|
||||
"&GroupType=" + (this.theRequest.GroupType || '1000') +
|
||||
"&time=" + this.lastDay +
|
||||
"&ServerpartIds=" + (this.theRequest.ServerpartIds || '');
|
||||
|
||||
console.log('默认跳转到AnhuiIndex，参数:', url);
|
||||
uni.redirectTo({ url });
|
||||
return;
|
||||
}
|
||||
this.theRequest.time = this.lastDay;
|
||||
this.getData();
|
||||
this.getTender();
|
||||
this.nowTab = this.theRequest.ProvinceCode == 340000 ? 4 : 1;
|
||||
} else {
|
||||
uni.hideLoading();
|
||||
this.theRequest = null;
|
||||
this.isLoading = false;
|
||||
this.showPage = false;
|
||||
@ -1404,11 +1400,37 @@ export default {
|
||||
return;
|
||||
}
|
||||
}
|
||||
|
||||
// 只有确认不需要跳转时，才开始加载数据
|
||||
uni.showLoading({
|
||||
title: "正在加载...",
|
||||
mask: false
|
||||
});
|
||||
|
||||
if (option.ProvinceCode) {
|
||||
this.theRequest = option;
|
||||
option.time = this.$util.cutDate(option.time, "YYYY-MM-DD");
|
||||
} else {
|
||||
this.theRequest.time = this.lastDay;
|
||||
this.nowTab = this.theRequest.ProvinceCode == 340000 ? 4 : 1;
|
||||
}
|
||||
|
||||
// 并行加载数据，减少等待时间
|
||||
Promise.all([
|
||||
this.getData(),
|
||||
this.getTender(),
|
||||
this.todayAmount()
|
||||
]).catch(err => {
|
||||
console.error('数据加载失败:', err);
|
||||
uni.hideLoading();
|
||||
this.isLoading = false;
|
||||
});
|
||||
|
||||
this.sevenDate = [
|
||||
this.$util.cutDate(new Date(this.theRequest.time), "MM.DD", -13),
|
||||
this.$util.cutDate(new Date(this.theRequest.time), "MM.DD", -7),
|
||||
];
|
||||
this.todayAmount();
|
||||
|
||||
if (this.theRequest.GroupType == 1010) {
|
||||
this.getDetail(this.theRequest);
|
||||
}
|
||||
|
||||
@ -1,25 +1,21 @@
|
||||
<template>
|
||||
<div :class="'province-theme-' + currentProvinceCode" v-if="showPage">
|
||||
<div class="page-body">
|
||||
<div class="page-body page-enter">
|
||||
|
||||
<div class="service-brand-box">
|
||||
<div class="uni-flex align-center">
|
||||
|
||||
<image v-if="pageMsg.Brand_ICO" :src="pageMsg.Brand_ICO" mode="aspectFit"></image>
|
||||
<image v-else src="/static/images/revenue/home.png" mode="aspectFit"></image>
|
||||
|
||||
|
||||
<!-- <div class="band-name">{{ pageMsg.Brand_Name }}</div> -->
|
||||
<div class="band-name">{{ pageMsg.ShopEndaccountList && pageMsg.ShopEndaccountList.length > 0 ?
|
||||
<div class="service-brand-box brand-header-enter">
|
||||
<div class="uni-flex align-center brand-info-slide">
|
||||
<div class="band-name brand-name-slide">{{ pageMsg.ShopEndaccountList &&
|
||||
pageMsg.ShopEndaccountList.length > 0 ?
|
||||
pageMsg.ShopEndaccountList[0].SERVERPART_NAME : "" }}</div>
|
||||
</div>
|
||||
<div class="price-num">{{ pageMsg.Revenue_Amount ? $util.fmoney(pageMsg.Revenue_Amount, 2) : '0.00' }}
|
||||
</div>
|
||||
<div class="price-num price-count-up">{{ pageMsg.Revenue_Amount ? $util.fmoney(pageMsg.Revenue_Amount,
|
||||
2) : '0.00' }}</div>
|
||||
</div>
|
||||
<!--服务区门店分析-->
|
||||
<div style="margin-top: 0 20rpx;padding: 0 16rpx">
|
||||
<div style="margin-top: 0 20rpx;padding: 0 16rpx" class="shop-list-container">
|
||||
<shopCell v-for="(item, i) in pageMsg.ShopEndaccountList" :key="i" :item='item' @toggleShow="toggleShow"
|
||||
:i='i' :provinceCode='currentProvinceCode'></shopCell>
|
||||
:i='i' :provinceCode='currentProvinceCode' class="shop-item-stagger"
|
||||
:style="'animation-delay: ' + (i * 0.1 + 0.8) + 's'" v-if="item"></shopCell>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
@ -33,7 +29,9 @@ export default {
|
||||
return {
|
||||
showPage: false,
|
||||
|
||||
pageMsg: {},
|
||||
pageMsg: {
|
||||
ShopEndaccountList: [] // 初始化为空数组，确保响应式
|
||||
},
|
||||
currentProvinceCode: '', // 当前省份代码
|
||||
keyJson: {
|
||||
SHOWMORE_SIGN: { 1: '【长款】', 2: '【异常长款】' }, // 长款
|
||||
@ -120,10 +118,18 @@ export default {
|
||||
return this.provinceTheme
|
||||
},
|
||||
toggleShow(i) {
|
||||
if (!this.pageMsg.ShopEndaccountList || !this.pageMsg.ShopEndaccountList[i]) {
|
||||
return
|
||||
}
|
||||
|
||||
let item = this.pageMsg.ShopEndaccountList[i]
|
||||
item.show = !item.show
|
||||
this.$forceUpdate()
|
||||
let currentItem = this.pageMsg.ShopEndaccountList[i]
|
||||
let newShowState = !currentItem.show
|
||||
|
||||
// 使用Vue.set确保响应式更新
|
||||
this.$set(this.pageMsg.ShopEndaccountList, i, {
|
||||
...currentItem,
|
||||
show: newShowState
|
||||
})
|
||||
},
|
||||
|
||||
|
||||
@ -148,12 +154,16 @@ export default {
|
||||
}).then(res => {
|
||||
uni.hideLoading()
|
||||
if (res.Result_Code != 100) return
|
||||
res.Result_Data.ShopEndaccountList.map(n => {
|
||||
n.show = true
|
||||
n.detail = this.getDetail(n)
|
||||
|
||||
// 处理数据，确保响应式属性正确设置
|
||||
res.Result_Data.ShopEndaccountList.forEach((n, index) => {
|
||||
// 使用Vue.set确保响应式
|
||||
_this.$set(n, 'show', false)
|
||||
_this.$set(n, 'detail', _this.getDetail(n))
|
||||
})
|
||||
_this.pageMsg = res.Result_Data
|
||||
console.log('_this.pageMsg_this.pageMsg_this.pageMsg', _this.pageMsg);
|
||||
|
||||
// 设置页面数据
|
||||
_this.$set(_this, 'pageMsg', res.Result_Data)
|
||||
|
||||
_this.showPage = true
|
||||
})
|
||||
@ -169,13 +179,20 @@ export default {
|
||||
}).then(res => {
|
||||
uni.hideLoading()
|
||||
if (res.Result_Code != 100) return
|
||||
res.Result_Data.listBrandShopModel.map(n => {
|
||||
n.show = true
|
||||
n.detail = this.getDetail(n)
|
||||
|
||||
// 处理品牌门店数据，确保响应式属性正确设置
|
||||
res.Result_Data.listBrandShopModel.forEach((n, index) => {
|
||||
// 使用Vue.set确保响应式
|
||||
_this.$set(n, 'show', false)
|
||||
_this.$set(n, 'detail', _this.getDetail(n))
|
||||
})
|
||||
|
||||
// 设置数据结构
|
||||
res.Result_Data.ShopEndaccountList = res.Result_Data.listBrandShopModel
|
||||
_this.pageMsg = res.Result_Data
|
||||
console.log('_this.pageMsg_this.pageMsg_this.pageMsg', _this.pageMsg);
|
||||
|
||||
// 设置页面数据
|
||||
_this.$set(_this, 'pageMsg', res.Result_Data)
|
||||
|
||||
_this.showPage = true
|
||||
})
|
||||
},
|
||||
@ -318,11 +335,171 @@ export default {
|
||||
|
||||
.price-num {
|
||||
color: #fff;
|
||||
font-size: 28rpx;
|
||||
font-size: 32rpx;
|
||||
font-weight: 700;
|
||||
font-family: 'PingFang SC', sans-serif;
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
text-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
/* 动画效果 - UniApp微信小程序兼容版本 */
|
||||
|
||||
/* 页面入场动画 */
|
||||
@keyframes pageEnter {
|
||||
0% {
|
||||
opacity: 0;
|
||||
transform: translateY(30rpx);
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 1;
|
||||
transform: translateY(0);
|
||||
}
|
||||
}
|
||||
|
||||
.page-enter {
|
||||
animation: pageEnter 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards;
|
||||
}
|
||||
|
||||
/* 品牌头部动画 */
|
||||
@keyframes brandHeaderEnter {
|
||||
0% {
|
||||
opacity: 0;
|
||||
transform: translateY(-30rpx) scale(0.95);
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 1;
|
||||
transform: translateY(0) scale(1);
|
||||
}
|
||||
}
|
||||
|
||||
.brand-header-enter {
|
||||
animation: brandHeaderEnter 0.8s cubic-bezier(0.34, 1.56, 0.64, 1) 0.2s forwards;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
/* 品牌信息滑入动画 */
|
||||
@keyframes brandInfoSlide {
|
||||
0% {
|
||||
opacity: 0;
|
||||
transform: translateX(-20rpx);
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 1;
|
||||
transform: translateX(0);
|
||||
}
|
||||
}
|
||||
|
||||
.brand-info-slide {
|
||||
animation: brandInfoSlide 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.4s forwards;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
/* 品牌图标弹跳动画 */
|
||||
@keyframes brandIconBounce {
|
||||
0% {
|
||||
opacity: 0;
|
||||
transform: scale(0.3) rotate(-10deg);
|
||||
}
|
||||
|
||||
50% {
|
||||
transform: scale(1.1) rotate(5deg);
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 1;
|
||||
transform: scale(1) rotate(0deg);
|
||||
}
|
||||
}
|
||||
|
||||
.brand-icon-bounce {
|
||||
animation: brandIconBounce 0.8s cubic-bezier(0.68, -0.55, 0.265, 1.55) 0.6s forwards;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
/* 品牌名称滑入动画 */
|
||||
@keyframes brandNameSlide {
|
||||
0% {
|
||||
opacity: 0;
|
||||
transform: translateX(-15rpx);
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 1;
|
||||
transform: translateX(0);
|
||||
}
|
||||
}
|
||||
|
||||
.brand-name-slide {
|
||||
animation: brandNameSlide 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.7s forwards;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
/* 价格数字计数动画 */
|
||||
@keyframes priceCountUp {
|
||||
0% {
|
||||
opacity: 0;
|
||||
transform: translateY(10rpx) scale(0.8);
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 1;
|
||||
transform: translateY(0) scale(1);
|
||||
}
|
||||
}
|
||||
|
||||
.price-count-up {
|
||||
animation: priceCountUp 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.8s forwards;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
/* 门店列表容器动画 */
|
||||
@keyframes shopListContainer {
|
||||
0% {
|
||||
opacity: 0;
|
||||
transform: translateY(30rpx);
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 1;
|
||||
transform: translateY(0);
|
||||
}
|
||||
}
|
||||
|
||||
.shop-list-container {
|
||||
animation: shopListContainer 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.6s forwards;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
/* 门店项目错列动画 */
|
||||
@keyframes shopItemStagger {
|
||||
0% {
|
||||
opacity: 0;
|
||||
transform: translateX(-30rpx) scale(0.95);
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 1;
|
||||
transform: translateX(0) scale(1);
|
||||
}
|
||||
}
|
||||
|
||||
.shop-item-stagger {
|
||||
animation: shopItemStagger 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
/* 交互反馈动画 */
|
||||
.brand-header-enter:active {
|
||||
transform: scale(0.98);
|
||||
transition: transform 0.1s ease-out;
|
||||
}
|
||||
|
||||
.brand-icon-bounce:active {
|
||||
transform: scale(0.9) rotate(5deg);
|
||||
transition: transform 0.2s cubic-bezier(0.68, -0.55, 0.265, 1.55);
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -6,22 +6,26 @@
|
||||
<view class=""> ¥{{ $util.fmoney(pageMsg.Serverpart_Revenue, 2) }} </view>
|
||||
</view>
|
||||
<view class="uni-flex jc-between ai-center">
|
||||
<text class=""> {{pageMsg.Serverpart_S||'南/东区'}} ¥{{$util.fmoney(pageMsg.Serverpart_RevenueS,2)}}</text>
|
||||
<text class=""> {{pageMsg.Serverpart_N||'北/西区'}} ¥{{$util.fmoney(pageMsg.Serverpart_RevenueN,2)}}</text>
|
||||
<text class=""> {{ pageMsg.Serverpart_S || '南/东区' }}
|
||||
¥{{ $util.fmoney(pageMsg.Serverpart_RevenueS, 2) }}</text>
|
||||
<text class=""> {{ pageMsg.Serverpart_N || '北/西区' }}
|
||||
¥{{ $util.fmoney(pageMsg.Serverpart_RevenueN, 2) }}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="page-list">
|
||||
<view v-for="(dateItem,i) in pageMsg.revenueReportDetilsDates" :key="i">
|
||||
<text class="list-date"> {{$util.cutDate(dateItem.Statistics_Date,'MM.DD')}}</text>
|
||||
<view class="cell-body uni-flex ai-center" v-for="(item,i) in dateItem.revenueReportDetils" :key="i">
|
||||
<image :src="item.BusinessType_Logo || '/static/images/revenue/operating-shop.png'" mode="aspectFit"></image>
|
||||
<view class="page-list" v-if="pageMsg.ShopList && pageMsg.ShopList.length > 0">
|
||||
<!-- <view v-for="(dateItem,i) in pageMsg.revenueReportDetilsDates" :key="i">-->
|
||||
<!-- <text class="list-date"> {{// $util.cutDate(dateItem.Statistics_Date,'MM.DD')}}</text>-->
|
||||
<view class="cell-body uni-flex ai-center" v-for="(item, i) in pageMsg.ShopList" :key="i">
|
||||
<image :src="item.BusinessType_Logo || '/static/images/revenue/operating-shop.png'" mode="aspectFit">
|
||||
</image>
|
||||
<view class="">
|
||||
<view class="uni-flex ai-center jc-between">
|
||||
<text>{{ item.BusinessType_Name }}</text>
|
||||
<text class="shop-total">＋ ¥{{ $util.fmoney(item.BusinessType_Revenue, 2) }}</text>
|
||||
</view>
|
||||
<view class="uni-flex ai-center jc-between">
|
||||
<text class="type-text" :class="{'scan':item.Upload_Type==1,'port':item.Upload_Type==2}">
|
||||
<text style="display: inline-block;width: 20%" class="type-text"
|
||||
:class="{ 'scan': item.Upload_Type == 1, 'port': item.Upload_Type == 2 }">
|
||||
<template v-if="item.Upload_Type == 1">
|
||||
扫码上传
|
||||
</template>
|
||||
@ -35,15 +39,36 @@
|
||||
<text class="type-text port" >接口传输</text>
|
||||
<text v-else>自动上传</text> -->
|
||||
</text>
|
||||
<view class="uni-flex ai-center">
|
||||
<text class="text-coast">{{item.Serverpart_S||'南/东区'}}: ¥{{$util.fmoney(item.Serverpart_RevenueS,2)}}</text>
|
||||
<text class="text-coast">{{item.Serverpart_N||'北/西区'}}: ¥{{$util.fmoney(item.Serverpart_RevenueN,2)}}</text>
|
||||
<view class="uni-flex ai-center" style="display: inline-block;width: 80%">
|
||||
<div style="display: inline-block;width: 48%;text-align: left;margin-right: 4%"
|
||||
class="text-coast">
|
||||
<text style="display: inline-block;width: 40px;text-align: left">
|
||||
{{ item.Serverpart_RevenueS === 0 || item.Serverpart_RevenueS ?
|
||||
`${item.Serverpart_S}：
|
||||
`: '' }}
|
||||
</text>
|
||||
<text style="display: inline-block;width: calc(100% - 50px);margin-left: 10px">
|
||||
{{ item.Serverpart_RevenueS === 0 || item.Serverpart_RevenueS ?
|
||||
`¥${$util.fmoney(item.Serverpart_RevenueS, 2)}` : '' }}
|
||||
</text>
|
||||
</div>
|
||||
<div style="display: inline-block;width: 48%;text-align: right" class="text-coast">
|
||||
<text style="display: inline-block;width: 40px;text-align: left">
|
||||
{{ item.Serverpart_RevenueN === 0 || item.Serverpart_RevenueN ?
|
||||
`${item.Serverpart_N}：
|
||||
`: '' }}
|
||||
</text>
|
||||
<text style="display: inline-block;width: calc(100% - 50px);margin-left: 10px">
|
||||
{{ item.Serverpart_RevenueN === 0 || item.Serverpart_RevenueN ?
|
||||
`¥${$util.fmoney(item.Serverpart_RevenueN, 2)}` : '' }}
|
||||
</text>
|
||||
</div>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- </view>-->
|
||||
</view>
|
||||
<view class="" v-if="!isLoading && !pageMsg.Serverpart_Name">
|
||||
<noFound nodata="true" :text="noDataText" />
|
||||
@ -71,12 +96,16 @@
|
||||
title: '正在加载...',
|
||||
mask: true
|
||||
})
|
||||
_this.$request.$webGet('WeChat/GetRevenueReportDetils',{
|
||||
|
||||
const req = {
|
||||
provinceCode: obj.pcode,
|
||||
serverpartId: obj.id,
|
||||
startTime: obj.st,
|
||||
endTime: obj.et,
|
||||
Serverpart_Id: obj.id,
|
||||
pushProvinceCode: obj.pcode
|
||||
}).then(res=>{
|
||||
}
|
||||
|
||||
_this.$request.$webGet('CommercialApi/Revenue/GetRevenueReportDetil', req).then((res) => {
|
||||
console.log('dadasda', res);
|
||||
|
||||
if (res.Result_Code == 100) {
|
||||
_this.pageMsg = res.Result_Data
|
||||
@ -87,6 +116,24 @@
|
||||
uni.hideLoading()
|
||||
_this.isLoading = false
|
||||
})
|
||||
|
||||
|
||||
// _this.$request.$webGet('WeChat/GetRevenueReportDetils',{
|
||||
// startTime: obj.st,
|
||||
// endTime: obj.et,
|
||||
// Serverpart_Id: obj.id,
|
||||
// pushProvinceCode: obj.pcode
|
||||
// }).then(res=>{
|
||||
|
||||
// if(res.Result_Code==100) {
|
||||
// _this.pageMsg = res.Result_Data
|
||||
|
||||
// }else{
|
||||
// _this.noDataText = res.Result_Desc
|
||||
// }
|
||||
// uni.hideLoading()
|
||||
// _this.isLoading = false
|
||||
// })
|
||||
},
|
||||
|
||||
},
|
||||
@ -101,25 +148,31 @@
|
||||
page {
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.page-card {
|
||||
margin: 30rpx 20rpx;
|
||||
|
||||
}
|
||||
|
||||
.head-card {
|
||||
padding: 30rpx 35rpx;
|
||||
background: linear-gradient(to left, #f7f6f8 0%, #eceaeb 100%);
|
||||
border-radius: 12rpx 12rpx 0 0;
|
||||
}
|
||||
|
||||
.head-card>view+view {
|
||||
margin-top: 16rpx;
|
||||
}
|
||||
|
||||
.text-strong {
|
||||
font-weight: bolder;
|
||||
}
|
||||
|
||||
.head-card>view>text {
|
||||
font-size: 24rpx;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.list-date {
|
||||
font-size: 22rpx;
|
||||
background-color: #f8f8f8;
|
||||
@ -127,6 +180,7 @@
|
||||
padding: 4rpx 12rpx;
|
||||
margin-top: 20rpx;
|
||||
}
|
||||
|
||||
.page-list {
|
||||
border: 1rpx solid #F0F0F0;
|
||||
border-radius: 0 0 12rpx 12rpx;
|
||||
@ -134,53 +188,66 @@
|
||||
|
||||
padding: 30rpx 16rpx 30rpx 16rpx;
|
||||
}
|
||||
|
||||
.cell-body {
|
||||
position: relative;
|
||||
padding: 20rpx 20rpx 20rpx 0;
|
||||
}
|
||||
|
||||
.cell-body image {
|
||||
width: 60rpx;
|
||||
height: 60rpx;
|
||||
border-radius: 50%;
|
||||
margin-right: 16rpx;
|
||||
}
|
||||
|
||||
.cell-body>view {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.page-list text {
|
||||
font-size: 22rpx;
|
||||
color: #2E2E2E;
|
||||
}
|
||||
|
||||
text.shop-total {
|
||||
font-size: 24rpx;
|
||||
}
|
||||
|
||||
text.type-text {
|
||||
color: #DFBE9F;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
text.type-text.scan::before,text.type-text.port::before {
|
||||
|
||||
text.type-text.scan::before,
|
||||
text.type-text.port::before {
|
||||
content: '';
|
||||
width: 21rpx;
|
||||
height: 23rpx;
|
||||
margin-right: 8rpx;
|
||||
}
|
||||
|
||||
text.type-text.scan::before {
|
||||
background: url(/static/images/revenue/scan-up.png) no-repeat center;
|
||||
background-size: contain;
|
||||
}
|
||||
|
||||
text.type-text.port::before {
|
||||
background: url(/static/images/revenue/port.png) no-repeat center;
|
||||
background-size: contain;
|
||||
}
|
||||
|
||||
text.type-text.port {
|
||||
color: #95BAF2;
|
||||
}
|
||||
|
||||
text.text-coast {
|
||||
color: #848484;
|
||||
width: 184rpx;
|
||||
|
||||
}
|
||||
|
||||
text.text-coast+text.text-coast {
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
@ -2,12 +2,14 @@
|
||||
<view class="page-body">
|
||||
<!-- 日期筛选 -->
|
||||
<div class="uni-flex ai-center screen-box">
|
||||
<picker mode="date" @change="bindDateChange($event,0)" :value="pageData.searchTime[0]" :end="pageData.endDate" start="2018-12-01" class="screen-unit">
|
||||
<picker mode="date" @change="bindDateChange($event, 0)" :value="pageData.searchTime[0]"
|
||||
:end="pageData.endDate" start="2018-12-01" class="screen-unit">
|
||||
<text>{{ pageData.searchTime[0] }}</text>
|
||||
<text class="uni-icon uni-icon-arrowdown"></text>
|
||||
</picker>
|
||||
<text class="mr20">至</text>
|
||||
<picker mode="date" @change="bindDateChange($event,1)" :value="pageData.searchTime[1]" :end="pageData.endDate" start="2018-12-01" class="screen-unit">
|
||||
<picker mode="date" @change="bindDateChange($event, 1)" :value="pageData.searchTime[1]"
|
||||
:end="pageData.endDate" start="2018-12-01" class="screen-unit">
|
||||
<text>{{ pageData.searchTime[1] }}</text>
|
||||
<text class="uni-icon uni-icon-arrowdown"></text>
|
||||
</picker>
|
||||
@ -24,7 +26,8 @@
|
||||
切换
|
||||
</div>
|
||||
<view>{{ !regionType ? "省内" : "省外" }}实收</view>
|
||||
<view class="price-num">¥{{!regionType ? $util.fmoney(pageData.msg.Province_InsideAmount,2) : $util.fmoney(pageData.msg.Province_ExternalAmount,2)}}</view>
|
||||
<view class="price-num">¥{{ !regionType ? $util.fmoney(pageData.msg.Province_InsideAmount, 2) :
|
||||
$util.fmoney(pageData.msg.Province_ExternalAmount, 2) }}</view>
|
||||
</view>
|
||||
<view class="" v-else>
|
||||
<div class="all-diff" @tap="regionType = !regionType">
|
||||
@ -32,7 +35,8 @@
|
||||
切换方向
|
||||
</div>
|
||||
<view>{{ !regionType ? "东 (南)" : "西 (北)" }}区实收</view>
|
||||
<view class="price-num">¥{{!regionType ? $util.fmoney(pageData.msg.Revenue_AmountS,2) : $util.fmoney(pageData.msg.Revenue_AmountN,2)}}</view>
|
||||
<view class="price-num">¥{{ !regionType ? $util.fmoney(pageData.msg.Revenue_AmountS, 2) :
|
||||
$util.fmoney(pageData.msg.Revenue_AmountN, 2) }}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="modle-title">
|
||||
@ -40,7 +44,9 @@
|
||||
<text>经营报表</text>
|
||||
</view>
|
||||
<view class="bg-white" v-if="ServerpartList.length > 0">
|
||||
<view class="region-area-title uni-flex ai-center jc-between" v-show="pageData.msg.Province_ExternalAmount" :class="{'active':pageData.insideShow}" @tap="pageData.insideShow=!pageData.insideShow">
|
||||
<view class="region-area-title uni-flex ai-center jc-between"
|
||||
v-show="pageData.msg.Province_ExternalAmount" :class="{ 'active': pageData.insideShow }"
|
||||
@tap="pageData.insideShow = !pageData.insideShow">
|
||||
<text>省内区域</text>
|
||||
|
||||
</view>
|
||||
@ -64,7 +70,8 @@
|
||||
</div>
|
||||
</div>
|
||||
<ul class="region-cell-area" v-show="item.show">
|
||||
<li v-for="(child,index) in item.revenueServerModels" :class="{'visited':child.visited}" :key="index" @tap="toDetail(child)">
|
||||
<li v-for="(child, index) in item.revenueServerModels" :class="{ 'visited': child.visited }"
|
||||
:key="index" @tap="toDetail(child)">
|
||||
<view>{{ child.Serverpart_Name }}</view>
|
||||
<view class="uni-flex ai-center data-number">
|
||||
<text class="">{{ child.Revenue_Proportion }}</text>
|
||||
@ -78,13 +85,15 @@
|
||||
</view>
|
||||
|
||||
<template v-if="insideRegionList.length > 0">
|
||||
<view class="region-area-title uni-flex ai-center jc-between" :class="{'active':pageData.exsideShow }" @tap="pageData.exsideShow = !pageData.exsideShow">
|
||||
<view class="region-area-title uni-flex ai-center jc-between"
|
||||
:class="{ 'active': pageData.exsideShow }" @tap="pageData.exsideShow = !pageData.exsideShow">
|
||||
<text>省外区域</text>
|
||||
</view>
|
||||
<view v-show="pageData.exsideShow">
|
||||
<view v-for="(item, i) in insideRegionList" :key="i">
|
||||
<div class=" region-cell" @tap="toggleRegion(item)">
|
||||
<div class="region-cell-unit region-title cuIcon-triangledownfill" :class="{'active':item.show}">
|
||||
<div class="region-cell-unit region-title cuIcon-triangledownfill"
|
||||
:class="{ 'active': item.show }">
|
||||
<text class="">{{ item.Region_Name }}</text>
|
||||
<div class="ct01">
|
||||
<text class="strong-text">¥{{ $util.fmoney(item.Total_Revenue, 2) }}</text>
|
||||
@ -99,10 +108,12 @@
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div class="region-cell-unit"><text class="uni-icon uni-icon-arrowright" :class="{'active':item.show}"></text></div>
|
||||
<div class="region-cell-unit"><text class="uni-icon uni-icon-arrowright"
|
||||
:class="{ 'active': item.show }"></text></div>
|
||||
</div>
|
||||
<ul class="region-cell-area" v-show="item.show">
|
||||
<li v-for="(child,index) in item.revenueServerModels" :class="{'visited':child.visited}" :key="index" @tap="toDetail(child)">
|
||||
<li v-for="(child, index) in item.revenueServerModels"
|
||||
:class="{ 'visited': child.visited }" :key="index" @tap="toDetail(child)">
|
||||
<view>{{ child.Serverpart_Name }}</view>
|
||||
<view class="uni-flex ai-center data-number">
|
||||
<text class="">{{ child.Revenue_Proportion }}</text>
|
||||
@ -185,14 +196,23 @@
|
||||
getList() {
|
||||
let _this = this
|
||||
let searchTime = this.pageData.searchTime
|
||||
_this.$request.$webGet('WeChat/GetRevenueReport',{
|
||||
|
||||
const req = {
|
||||
provinceCode: this.ProvinceCode,
|
||||
startTime: searchTime[0],
|
||||
endTime: searchTime[1],
|
||||
additionalCode: this.ProvinceCode=='330000' ? '451200,630000' :''
|
||||
}).then(res=>{
|
||||
|
||||
}
|
||||
console.log('reqdad', req);
|
||||
uni.showLoading({
|
||||
title: '正在加载',
|
||||
mask: true
|
||||
})
|
||||
_this.$request.$webGet('CommercialApi/Revenue/GetRevenueReport', req).then((res) => {
|
||||
console.log('resresresres', res);
|
||||
uni.hideLoading()
|
||||
if (res.Result_Code == 100) {
|
||||
_this.pageData.msg = res.Result_Data
|
||||
_this.pageData.msg.countave = (Number(_this.pageData.msg.Province_InsideAmount) / Number(_this.pageData.msg.TotalCount)).toFixed(2)
|
||||
res.Result_Data.revenueRegionModels.map(n => {
|
||||
n.show = false
|
||||
})
|
||||
@ -203,15 +223,67 @@
|
||||
_this.insideRegionList = res.Result_Data.revenueInsideRegionModels
|
||||
}
|
||||
|
||||
// _this.pageData.msg.SearchResult
|
||||
// 判断一下 如果是有搜索框的值 就按照搜索框有的值显示
|
||||
// 没有就出现结算模式 或者经营模式
|
||||
if (this.searchText) {
|
||||
this.showModal = false
|
||||
if (res.Result_Data.SearchResult) {
|
||||
let newList = []
|
||||
res.Result_Data.SearchResult.forEach(item => {
|
||||
newList.push(item.split(this.searchText))
|
||||
_this.pageData.msg.SearchResult = newList
|
||||
_this.copySearchText = JSON.parse(JSON.stringify(this.searchText))
|
||||
})
|
||||
}
|
||||
} else {
|
||||
if (this.BusinessTypeValue || this.SettlementModeValue) {
|
||||
this.showModal = true
|
||||
}
|
||||
}
|
||||
_this.ServerpartList = res.Result_Data.revenueRegionModels
|
||||
} else if (res.Result_Code == 200 || res.Result_Code == 999) {
|
||||
_this.noDataText = '暂无数据'
|
||||
_this.insideRegionList = []
|
||||
_this.pageData.msg = null
|
||||
} else {
|
||||
_this.pageData.msg = null
|
||||
_this.noDataText = res.Result_Desc
|
||||
_this.insideRegionList = []
|
||||
}
|
||||
uni.hideLoading()
|
||||
_this.requestText = _this.searchText
|
||||
|
||||
_this.pageData.isLoading = false
|
||||
_this.$forceUpdate()
|
||||
})
|
||||
|
||||
// _this.$request.$webGet('WeChat/GetRevenueReport', {
|
||||
// startTime: searchTime[0],
|
||||
// endTime: searchTime[1],
|
||||
// additionalCode: this.ProvinceCode == '330000' ? '451200,630000' : ''
|
||||
// }).then(res => {
|
||||
|
||||
// if (res.Result_Code == 100) {
|
||||
// _this.pageData.msg = res.Result_Data
|
||||
// res.Result_Data.revenueRegionModels.map(n => {
|
||||
// n.show = false
|
||||
// })
|
||||
// if (res.Result_Data.revenueInsideRegionModels) {
|
||||
// res.Result_Data.revenueInsideRegionModels.map(n => {
|
||||
// n.show = false
|
||||
// })
|
||||
// _this.insideRegionList = res.Result_Data.revenueInsideRegionModels
|
||||
// }
|
||||
|
||||
// _this.ServerpartList = res.Result_Data.revenueRegionModels
|
||||
// } else {
|
||||
// _this.pageData.msg = null
|
||||
// _this.noDataText = res.Result_Desc
|
||||
// }
|
||||
// uni.hideLoading()
|
||||
// _this.pageData.isLoading = false
|
||||
// _this.$forceUpdate()
|
||||
// })
|
||||
}
|
||||
},
|
||||
onLoad() {
|
||||
@ -229,6 +301,7 @@
|
||||
.page-body {
|
||||
padding-bottom: 80rpx;
|
||||
}
|
||||
|
||||
.screen-box {
|
||||
background-color: #fff;
|
||||
padding: 0 20rpx;
|
||||
@ -237,6 +310,7 @@
|
||||
left: 0;
|
||||
z-index: 9;
|
||||
}
|
||||
|
||||
.screen-box .screen-unit {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
@ -244,28 +318,34 @@
|
||||
padding: 0 14rpx;
|
||||
line-height: 3;
|
||||
}
|
||||
|
||||
.screen-box .mr20 {
|
||||
margin-right: 20rpx;
|
||||
color: #95999C;
|
||||
}
|
||||
|
||||
.uni-icon-arrowdown {
|
||||
font-size: 22rpx;
|
||||
color: #C7C7C7;
|
||||
margin-left: 8rpx;
|
||||
}
|
||||
|
||||
.screen-box text {
|
||||
line-height: 3;
|
||||
}
|
||||
|
||||
.screen-box image {
|
||||
width: 12rpx;
|
||||
height: 8rpx;
|
||||
margin: 0 16rpx;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.head-card {
|
||||
padding: 40rpx 26rpx;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.head-card>view {
|
||||
width: 330rpx;
|
||||
height: 190rpx;
|
||||
@ -277,6 +357,7 @@
|
||||
box-sizing: border-box;
|
||||
|
||||
}
|
||||
|
||||
.head-card>view:first-child {
|
||||
|
||||
background: linear-gradient(to left, #93a4ec 0%, #4b76e9 100%);
|
||||
@ -288,11 +369,13 @@
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.head-card .price-num {
|
||||
font-family: 'Bahnschrift Regular';
|
||||
font-size: 50rpx;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
.all-diff {
|
||||
background: linear-gradient(#f28785, #ee5b4c);
|
||||
height: 36rpx;
|
||||
@ -307,11 +390,13 @@
|
||||
border-radius: 0 0 0 54rpx;
|
||||
|
||||
}
|
||||
|
||||
.all-diff image {
|
||||
width: 20rpx;
|
||||
height: 17rpx;
|
||||
margin-right: 8rpx;
|
||||
}
|
||||
|
||||
.modle-title {
|
||||
padding-left: 24rpx;
|
||||
font-size: 30rpx;
|
||||
@ -321,17 +406,20 @@
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.modle-title image {
|
||||
max-width: 36rpx;
|
||||
max-height: 36rpx;
|
||||
margin-right: 14rpx;
|
||||
}
|
||||
|
||||
.bg-white {
|
||||
background-color: #fff;
|
||||
margin: 0 24rpx;
|
||||
border-radius: 12rpx;
|
||||
padding-bottom: 26rpx;
|
||||
}
|
||||
|
||||
.region-area-title {
|
||||
color: #000;
|
||||
font-weight: bolder;
|
||||
@ -339,6 +427,7 @@
|
||||
position: relative;
|
||||
display: flex;
|
||||
}
|
||||
|
||||
/*日结上传*/
|
||||
.region-title {
|
||||
position: relative;
|
||||
@ -346,9 +435,12 @@
|
||||
/* font-weight: bolder; */
|
||||
|
||||
}
|
||||
.region-title,.ct01 {
|
||||
|
||||
.region-title,
|
||||
.ct01 {
|
||||
color: #000000;
|
||||
}
|
||||
|
||||
.ct01 {
|
||||
padding-top: 8rpx;
|
||||
}
|
||||
@ -368,6 +460,7 @@
|
||||
transition: all 0.4s;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.active.region-area-title:before {
|
||||
|
||||
border-left: 8rpx solid transparent;
|
||||
@ -381,23 +474,28 @@
|
||||
padding: 26rpx 46rpx 16rpx 56rpx;
|
||||
align-items: flex-end;
|
||||
}
|
||||
|
||||
.region-cell .active.uni-icon-arrowright::before {
|
||||
transform: rotate(90deg);
|
||||
|
||||
|
||||
}
|
||||
.region-cell .uni-icon-arrowdown,.region-cell .uni-icon-arrowright {
|
||||
|
||||
.region-cell .uni-icon-arrowdown,
|
||||
.region-cell .uni-icon-arrowright {
|
||||
font-size: 36rpx;
|
||||
color: #5A5A5A;
|
||||
/* padding-bottom: 12rpx; */
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.region-cell .uni-icon-arrowright::before {
|
||||
position: absolute;
|
||||
right: -26rpx;
|
||||
top: -46rpx;
|
||||
transition: all 0.4s;
|
||||
}
|
||||
|
||||
.region-cell .region-cell-unit {
|
||||
flex: 2;
|
||||
display: flex;
|
||||
@ -412,11 +510,13 @@
|
||||
flex: 3;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.region-cell .region-cell-unit:nth-child(3) {
|
||||
|
||||
flex: 2.5;
|
||||
|
||||
}
|
||||
|
||||
.region-cell-image {
|
||||
width: 48rpx;
|
||||
display: flex;
|
||||
@ -435,13 +535,16 @@
|
||||
.region-cell-area {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.region-cell-area li:nth-child(2n+1) {
|
||||
background-color: #FCFCFC;
|
||||
}
|
||||
|
||||
.region-cell-area li view:first-child {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.region-cell-area li.visited view:first-child {
|
||||
color: #007AFF;
|
||||
|
||||
@ -491,17 +594,20 @@
|
||||
font-size: 22rpx;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.region-cell-area li>view text {
|
||||
font-size: 22rpx;
|
||||
flex: 1;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.region-cell-area li>view text:last-child {
|
||||
/* text-align: right; */
|
||||
font-weight: bolder;
|
||||
padding-right: 8rpx;
|
||||
flex: 2;
|
||||
}
|
||||
|
||||
.region-cell-area li>view:last-child:after {
|
||||
content: '';
|
||||
background: url(/static/images/revenue/you-jt.png) no-repeat center;
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user