first commit
This commit is contained in:
ylj20011123
parent
c8f020d72e
commit
41d431011b
@ -40,7 +40,7 @@
|
|||||||
<view class="center">
|
<view class="center">
|
||||||
<text class="date-text">{{ selectDate ? $util.cutDate(new Date(selectDate), 'YYYY-MM') :
|
<text class="date-text">{{ selectDate ? $util.cutDate(new Date(selectDate), 'YYYY-MM') :
|
||||||
""
|
""
|
||||||
}}</text>
|
}}</text>
|
||||||
</view>
|
</view>
|
||||||
<view class="arrowBtn" @tap="handleChangeDate(1)">
|
<view class="arrowBtn" @tap="handleChangeDate(1)">
|
||||||
<image class="arrowIcon" src="https://eshangtech.com/cyy_DIB/rightArrowIcon.png" />
|
<image class="arrowIcon" src="https://eshangtech.com/cyy_DIB/rightArrowIcon.png" />
|
||||||
@ -56,33 +56,37 @@
|
|||||||
|
|
||||||
<!-- 统计汇总卡片 -->
|
<!-- 统计汇总卡片 -->
|
||||||
<view class="summaryCards" v-if="attendanceStatisticsData.length > 0">
|
<view class="summaryCards" v-if="attendanceStatisticsData.length > 0">
|
||||||
<view class="summaryCard">
|
<view class="summaryCard clickable" @click="showDetailModal('schedule')">
|
||||||
<view class="cardIcon scheduleIcon">📋</view>
|
<view class="cardIcon scheduleIcon">📋</view>
|
||||||
<view class="cardContent">
|
<view class="cardContent">
|
||||||
<text class="cardNumber">{{ getSummaryData().totalSchedule }}</text>
|
<text class="cardNumber">{{ getSummaryData().totalSchedule }}</text>
|
||||||
<text class="cardLabel">总排班</text>
|
<text class="cardLabel">总排班</text>
|
||||||
</view>
|
</view>
|
||||||
|
<view class="cardArrow">›</view>
|
||||||
</view>
|
</view>
|
||||||
<view class="summaryCard">
|
<view class="summaryCard clickable" @click="showDetailModal('attend')">
|
||||||
<view class="cardIcon attendIcon">✅</view>
|
<view class="cardIcon attendIcon">✅</view>
|
||||||
<view class="cardContent">
|
<view class="cardContent">
|
||||||
<text class="cardNumber">{{ getSummaryData().totalAttend }}</text>
|
<text class="cardNumber">{{ getSummaryData().totalAttend }}</text>
|
||||||
<text class="cardLabel">总出勤</text>
|
<text class="cardLabel">总出勤</text>
|
||||||
</view>
|
</view>
|
||||||
|
<view class="cardArrow">›</view>
|
||||||
</view>
|
</view>
|
||||||
<view class="summaryCard">
|
<view class="summaryCard clickable" @click="showDetailModal('late')">
|
||||||
<view class="cardIcon lateIcon">⏰</view>
|
<view class="cardIcon lateIcon">⏰</view>
|
||||||
<view class="cardContent">
|
<view class="cardContent">
|
||||||
<text class="cardNumber">{{ getSummaryData().totalLate }}</text>
|
<text class="cardNumber">{{ getSummaryData().totalLate }}</text>
|
||||||
<text class="cardLabel">迟到次数</text>
|
<text class="cardLabel">迟到次数</text>
|
||||||
</view>
|
</view>
|
||||||
|
<view class="cardArrow">›</view>
|
||||||
</view>
|
</view>
|
||||||
<view class="summaryCard">
|
<view class="summaryCard clickable" @click="showDetailModal('early')">
|
||||||
<view class="cardIcon earlyIcon">🏃</view>
|
<view class="cardIcon earlyIcon">🏃</view>
|
||||||
<view class="cardContent">
|
<view class="cardContent">
|
||||||
<text class="cardNumber">{{ getSummaryData().totalEarly }}</text>
|
<text class="cardNumber">{{ getSummaryData().totalEarly }}</text>
|
||||||
<text class="cardLabel">早退次数</text>
|
<text class="cardLabel">早退次数</text>
|
||||||
</view>
|
</view>
|
||||||
|
<view class="cardArrow">›</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
@ -184,6 +188,47 @@
|
|||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
|
<!-- 详情弹窗 -->
|
||||||
|
<view class="detailModal" v-if="showDetailPopup" @click="closeDetailModal">
|
||||||
|
<view class="modalContent" @click.stop="">
|
||||||
|
<view class="modalHeader">
|
||||||
|
<text class="modalTitle">{{ getModalTitle() }}</text>
|
||||||
|
<view class="closeBtn" @click="closeDetailModal">×</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="modalBody">
|
||||||
|
<view class="summaryInfo">
|
||||||
|
<text class="totalText">总计：{{ getCurrentModalTotal() }}</text>
|
||||||
|
<text class="countText">{{ attendanceStatisticsData.length }}人</text>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="employeeRankList">
|
||||||
|
<view class="rankHeader">
|
||||||
|
<text class="rankTitle">人员排名</text>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="rankScrollArea">
|
||||||
|
<view class="rankItem" v-for="(item, index) in getSortedData()" :key="index">
|
||||||
|
<view class="rankNumber"
|
||||||
|
:class="index === 0 ? 'rank-1' : index === 1 ? 'rank-2' : index === 2 ? 'rank-3' : ''">
|
||||||
|
{{ index + 1 }}</view>
|
||||||
|
<view class="employeeInfo">
|
||||||
|
<view class="employeeText">
|
||||||
|
<text class="name">{{ item.userName || "-" }}</text>
|
||||||
|
<text class="phone">{{ item.phone || item.userCode || "-" }}</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="rankValue">
|
||||||
|
<text class="numberWithUnit">{{ getCurrentValue(item) }}{{ getCurrentUnit()
|
||||||
|
}}</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
<!-- 日历组件 -->
|
<!-- 日历组件 -->
|
||||||
<uni-calendar ref="calendar" :insert="false" :mask-closable="true" @confirm="onCalendarConfirm"
|
<uni-calendar ref="calendar" :insert="false" :mask-closable="true" @confirm="onCalendarConfirm"
|
||||||
@close="onCalendarClose" />
|
@close="onCalendarClose" />
|
||||||
@ -207,7 +252,10 @@ export default {
|
|||||||
seatInfo: {},
|
seatInfo: {},
|
||||||
loading: false,
|
loading: false,
|
||||||
hasLoaded: false, // 是否已经完成过初始加载
|
hasLoaded: false, // 是否已经完成过初始加载
|
||||||
retryCount: 0
|
retryCount: 0,
|
||||||
|
// 详情弹窗相关
|
||||||
|
showDetailPopup: false,
|
||||||
|
currentDetailType: 'schedule' // 'schedule', 'attend', 'late', 'early'
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
onLoad() {
|
onLoad() {
|
||||||
@ -266,6 +314,75 @@ export default {
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
|
// 显示详情弹窗
|
||||||
|
showDetailModal(type) {
|
||||||
|
this.currentDetailType = type
|
||||||
|
this.showDetailPopup = true
|
||||||
|
this.showPopup = true // 禁止页面滚动
|
||||||
|
},
|
||||||
|
|
||||||
|
// 关闭详情弹窗
|
||||||
|
closeDetailModal() {
|
||||||
|
this.showDetailPopup = false
|
||||||
|
this.showPopup = false // 恢复页面滚动
|
||||||
|
},
|
||||||
|
|
||||||
|
// 获取弹窗标题
|
||||||
|
getModalTitle() {
|
||||||
|
const titles = {
|
||||||
|
schedule: '排班情况详情',
|
||||||
|
attend: '出勤情况详情',
|
||||||
|
late: '迟到情况详情',
|
||||||
|
early: '早退情况详情'
|
||||||
|
}
|
||||||
|
return titles[this.currentDetailType] || '详情'
|
||||||
|
},
|
||||||
|
|
||||||
|
// 获取当前模态总数
|
||||||
|
getCurrentModalTotal() {
|
||||||
|
const summary = this.getSummaryData()
|
||||||
|
const totals = {
|
||||||
|
schedule: summary.totalSchedule + '天',
|
||||||
|
attend: summary.totalAttend + '天',
|
||||||
|
late: summary.totalLate + '次',
|
||||||
|
early: summary.totalEarly + '次'
|
||||||
|
}
|
||||||
|
return totals[this.currentDetailType] || '0'
|
||||||
|
},
|
||||||
|
|
||||||
|
// 获取单位
|
||||||
|
getCurrentUnit() {
|
||||||
|
const units = {
|
||||||
|
schedule: '天',
|
||||||
|
attend: '天',
|
||||||
|
late: '次',
|
||||||
|
early: '次'
|
||||||
|
}
|
||||||
|
return units[this.currentDetailType] || '天'
|
||||||
|
},
|
||||||
|
|
||||||
|
// 获取当前项的值
|
||||||
|
getCurrentValue(item) {
|
||||||
|
const values = {
|
||||||
|
schedule: item.scheduleTotal || 0,
|
||||||
|
attend: item.attendTotal || 0,
|
||||||
|
late: item.lateTotal || 0,
|
||||||
|
early: item.earlyTotal || 0
|
||||||
|
}
|
||||||
|
return values[this.currentDetailType] || 0
|
||||||
|
},
|
||||||
|
|
||||||
|
// 获取排序后的数据
|
||||||
|
getSortedData() {
|
||||||
|
const data = [...this.attendanceStatisticsData]
|
||||||
|
return data.sort((a, b) => {
|
||||||
|
const valueA = this.getCurrentValue(a)
|
||||||
|
const valueB = this.getCurrentValue(b)
|
||||||
|
return valueB - valueA // 从大到小排序
|
||||||
|
})
|
||||||
|
},
|
||||||
|
|
||||||
|
|
||||||
// 显示日历
|
// 显示日历
|
||||||
showCalendar() {
|
showCalendar() {
|
||||||
this.$refs.calendar.open()
|
this.$refs.calendar.open()
|
||||||
@ -599,6 +716,17 @@ export default {
|
|||||||
box-shadow: @shadow;
|
box-shadow: @shadow;
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
|
position: relative;
|
||||||
|
|
||||||
|
&.clickable {
|
||||||
|
cursor: pointer;
|
||||||
|
transition: all 0.3s ease;
|
||||||
|
|
||||||
|
&:active {
|
||||||
|
transform: scale(0.98);
|
||||||
|
background: #f8f9fa;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
.cardIcon {
|
.cardIcon {
|
||||||
font-size: 40rpx;
|
font-size: 40rpx;
|
||||||
@ -640,6 +768,13 @@ export default {
|
|||||||
color: @muted;
|
color: @muted;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.cardArrow {
|
||||||
|
font-size: 32rpx;
|
||||||
|
color: #ccc;
|
||||||
|
font-weight: bold;
|
||||||
|
margin-left: 8rpx;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -955,5 +1090,217 @@ export default {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// 详情弹窗样式
|
||||||
|
.detailModal {
|
||||||
|
position: fixed;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
width: 100vw;
|
||||||
|
height: 100vh;
|
||||||
|
background: rgba(0, 0, 0, 0.5);
|
||||||
|
z-index: 9999;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
box-sizing: border-box;
|
||||||
|
padding: 60rpx 40rpx;
|
||||||
|
|
||||||
|
.modalContent {
|
||||||
|
width: calc(100vw - 64rpx);
|
||||||
|
max-height: 80vh;
|
||||||
|
background: #fff;
|
||||||
|
border-radius: 24rpx;
|
||||||
|
overflow: hidden;
|
||||||
|
box-shadow: 0 8rpx 32rpx rgba(0, 0, 0, 0.2);
|
||||||
|
|
||||||
|
.modalHeader {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
padding: 32rpx 40rpx;
|
||||||
|
border-bottom: 2rpx solid #f5f5f5;
|
||||||
|
background: linear-gradient(135deg, @primary, @primary2);
|
||||||
|
|
||||||
|
.modalTitle {
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-weight: 700;
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.closeBtn {
|
||||||
|
width: 48rpx;
|
||||||
|
height: 48rpx;
|
||||||
|
background: rgba(255, 255, 255, 0.2);
|
||||||
|
border-radius: 50%;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
font-size: 32rpx;
|
||||||
|
color: #fff;
|
||||||
|
font-weight: bold;
|
||||||
|
cursor: pointer;
|
||||||
|
|
||||||
|
&:active {
|
||||||
|
background: rgba(255, 255, 255, 0.3);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.modalBody {
|
||||||
|
padding: 32rpx 40rpx;
|
||||||
|
max-height: 60vh;
|
||||||
|
|
||||||
|
.summaryInfo {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
padding: 24rpx;
|
||||||
|
background: #f8f9fa;
|
||||||
|
border-radius: 16rpx;
|
||||||
|
margin-bottom: 32rpx;
|
||||||
|
|
||||||
|
.totalText {
|
||||||
|
font-size: 28rpx;
|
||||||
|
font-weight: 600;
|
||||||
|
color: #2c3e50;
|
||||||
|
}
|
||||||
|
|
||||||
|
.countText {
|
||||||
|
font-size: 24rpx;
|
||||||
|
color: @muted;
|
||||||
|
background: #fff;
|
||||||
|
padding: 8rpx 16rpx;
|
||||||
|
border-radius: 20rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.employeeRankList {
|
||||||
|
.rankHeader {
|
||||||
|
margin-bottom: 24rpx;
|
||||||
|
|
||||||
|
.rankTitle {
|
||||||
|
font-size: 28rpx;
|
||||||
|
font-weight: 600;
|
||||||
|
color: #2c3e50;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.rankScrollArea {
|
||||||
|
max-height: 40vh;
|
||||||
|
overflow-y: auto;
|
||||||
|
|
||||||
|
/* 隐藏滚动条 */
|
||||||
|
&::-webkit-scrollbar {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 兼容其他浏览器 */
|
||||||
|
-ms-overflow-style: none;
|
||||||
|
scrollbar-width: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.rankItem {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
padding: 24rpx 20rpx;
|
||||||
|
background: #fff;
|
||||||
|
border-radius: 12rpx;
|
||||||
|
margin-bottom: 16rpx;
|
||||||
|
border: 2rpx solid #f5f5f5;
|
||||||
|
|
||||||
|
&:nth-child(1) {
|
||||||
|
// 第一名
|
||||||
|
border-color: #ffd700;
|
||||||
|
background: linear-gradient(135deg, #fff9e6, #fff);
|
||||||
|
}
|
||||||
|
|
||||||
|
&:nth-child(2) {
|
||||||
|
// 第二名
|
||||||
|
border-color: #c0c0c0;
|
||||||
|
background: linear-gradient(135deg, #f8f8f8, #fff);
|
||||||
|
}
|
||||||
|
|
||||||
|
&:nth-child(3) {
|
||||||
|
// 第三名
|
||||||
|
border-color: #cd7f32;
|
||||||
|
background: linear-gradient(135deg, #fdf2e9, #fff);
|
||||||
|
}
|
||||||
|
|
||||||
|
.rankNumber {
|
||||||
|
width: 48rpx;
|
||||||
|
height: 48rpx;
|
||||||
|
background: @primary;
|
||||||
|
color: #fff;
|
||||||
|
border-radius: 50%;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
font-size: 24rpx;
|
||||||
|
font-weight: 700;
|
||||||
|
margin-right: 20rpx;
|
||||||
|
flex-shrink: 0;
|
||||||
|
|
||||||
|
&.rank-1 {
|
||||||
|
background: linear-gradient(135deg, #ffd700, #ffed4e);
|
||||||
|
color: #333;
|
||||||
|
box-shadow: 0 4rpx 12rpx rgba(255, 215, 0, 0.3);
|
||||||
|
}
|
||||||
|
|
||||||
|
&.rank-2 {
|
||||||
|
background: linear-gradient(135deg, #c0c0c0, #e8e8e8);
|
||||||
|
color: #333;
|
||||||
|
box-shadow: 0 4rpx 12rpx rgba(192, 192, 192, 0.3);
|
||||||
|
}
|
||||||
|
|
||||||
|
&.rank-3 {
|
||||||
|
background: linear-gradient(135deg, #cd7f32, #daa560);
|
||||||
|
color: #fff;
|
||||||
|
box-shadow: 0 4rpx 12rpx rgba(205, 127, 50, 0.3);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.employeeInfo {
|
||||||
|
flex: 1;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
.employeeText {
|
||||||
|
flex: 1;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
|
||||||
|
.name {
|
||||||
|
font-size: 28rpx;
|
||||||
|
font-weight: 600;
|
||||||
|
color: #2c3e50;
|
||||||
|
line-height: 1.3;
|
||||||
|
margin-bottom: 4rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.phone {
|
||||||
|
font-size: 24rpx;
|
||||||
|
color: @muted;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.rankValue {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: flex-end;
|
||||||
|
|
||||||
|
.numberWithUnit {
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-weight: 700;
|
||||||
|
color: @primary;
|
||||||
|
line-height: 1.2;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
@ -1,43 +1,38 @@
|
|||||||
<!-- 应急事件 -->
|
<!-- 应急事件 -->
|
||||||
<template>
|
<template>
|
||||||
<view class="main">
|
<view class="main">
|
||||||
<view class="emergencyList pad15">
|
<view class="emergencyList">
|
||||||
<view class="emergencyItem" v-for="(item, index) in showList" :key="index" @click="handleShowDetail(item)"
|
<view class="eventCard" v-for="(item, index) in showList" :key="index" @click="handleShowDetail(item)">
|
||||||
:style="{
|
<!-- 事件头部信息 -->
|
||||||
marginBottom: index + 1 === showList.length ? '0' : '',
|
<view class="cardHeader">
|
||||||
border: item.state === '完成' ? '2rpx solid #f4db9c' : item.state === '处理中' ? '2rpx solid #d3d3d3' : ''
|
<view class="eventTitle">{{ type === 1 ? item.title || "" : type === 2 ? item.type || "" : "" }}
|
||||||
}">
|
|
||||||
<view class="emergencyItemTitle">
|
|
||||||
<view class="emergencyItemTitleLeft">
|
|
||||||
{{ type === 1 ? item.title || "" : type === 2 ? item.type || "" : "" }}
|
|
||||||
</view>
|
</view>
|
||||||
<view class="emergencyItemTitleRight">
|
<view class="eventStatus" v-if="item.state" :class="{
|
||||||
<view class="emergencyItemStatus" v-if="item.state" :style="{
|
'status-completed': item.state === '完成',
|
||||||
background: item.state === '完成' ? '#ecbd44' : item.state === '处理中' ? '#d3d3d3' : '',
|
'status-processing': item.state === '处理中'
|
||||||
color: item.state === '完成' ? '#fff' : item.state === '处理中' ? '#fff' : ''
|
}">
|
||||||
}">
|
{{ item.state }}
|
||||||
{{ item.state }}</view>
|
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
<view class="emergencyDesc">{{ item.sceneOverview || "" }}</view>
|
|
||||||
|
|
||||||
<view class="line"></view>
|
<!-- 事件描述 -->
|
||||||
|
<view class="eventDesc" v-if="item.sceneOverview">{{ item.sceneOverview }}</view>
|
||||||
|
|
||||||
<view class="otherMessageRow">
|
<!-- 详细信息区域 -->
|
||||||
<image class="otherMessageIcon" src="https://eshangtech.com/cyy_DIB/personIcon.png" />
|
<view class="eventDetails">
|
||||||
<view class="otherMessageValue">{{ item.userName || item.createUserName }}</view>
|
<view class="detailItem">
|
||||||
|
<image class="detailIcon" src="https://eshangtech.com/cyy_DIB/personIcon.png" />
|
||||||
|
<view class="detailValue">{{ item.userName || item.createUserName || '-' }}</view>
|
||||||
|
</view>
|
||||||
|
<view class="detailItem">
|
||||||
|
<image class="detailIcon" src="https://eshangtech.com/cyy_DIB/phoneLabelIcon.png" />
|
||||||
|
<view class="detailValue">{{ item.phone || '-' }}</view>
|
||||||
|
</view>
|
||||||
|
<view class="detailItem">
|
||||||
|
<image class="detailIcon" src="https://eshangtech.com/cyy_DIB/timeIcon.png" />
|
||||||
|
<view class="detailValue">{{ item.createTime || '-' }}</view>
|
||||||
|
</view>
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
<view class="otherMessageRow">
|
|
||||||
<image class="otherMessageIcon" src="https://eshangtech.com/cyy_DIB/phoneLabelIcon.png" />
|
|
||||||
<view class="otherMessageValue">{{ item.phone }}</view>
|
|
||||||
</view>
|
|
||||||
|
|
||||||
<view class="otherMessageRow" style="margin-bottom: 0;">
|
|
||||||
<image class="otherMessageIcon" src="https://eshangtech.com/cyy_DIB/timeIcon.png" />
|
|
||||||
<view class="otherMessageValue">{{ item.createTime }}</view>
|
|
||||||
</view>
|
|
||||||
|
|
||||||
</view>
|
</view>
|
||||||
<view class="noDataBox" v-if="!isLoading && !(showList && showList.length > 0)">
|
<view class="noDataBox" v-if="!isLoading && !(showList && showList.length > 0)">
|
||||||
<noData :type="1" :text="'暂无数据'" />
|
<noData :type="1" :text="'暂无数据'" />
|
||||||
@ -432,214 +427,126 @@ export default {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
<style lang="less" scoped>
|
<style lang="scss" scoped>
|
||||||
@bg: #f8f9fa;
|
// 使用项目全局颜色变量
|
||||||
@muted: #666;
|
$bg: #f8f9fa;
|
||||||
@card: #fff;
|
$muted: #666;
|
||||||
@shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
|
$card: #fff;
|
||||||
@primary: #27B25F;
|
$shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
|
||||||
@primary2: #4CCC7F;
|
$primary: #27B25F;
|
||||||
@ok: #2ed573;
|
$primary2: #4CCC7F;
|
||||||
@warn: #ff9f43;
|
$success: #2ed573;
|
||||||
@danger: #ff4757;
|
$warning: #ff9f43;
|
||||||
|
$danger: #ff4757;
|
||||||
|
$info: #3742fa;
|
||||||
|
|
||||||
/* 抽屉页（特情/设施） */
|
/* 重新设计的应急事件页面 */
|
||||||
.main {
|
.main {
|
||||||
width: 100vw;
|
width: 100vw;
|
||||||
height: 100vh;
|
min-height: 100vh;
|
||||||
|
background-color: $bg;
|
||||||
.emergency-details-header {
|
box-sizing: border-box;
|
||||||
background: linear-gradient(135deg, @danger, #ff3838);
|
padding: 32rpx;
|
||||||
color: #fff;
|
padding-bottom: env(safe-area-inset-bottom);
|
||||||
padding: 40rpx;
|
|
||||||
position: relative;
|
|
||||||
box-shadow: @shadow;
|
|
||||||
|
|
||||||
&.facilities-theme {
|
|
||||||
background: linear-gradient(135deg, #20bf6b, #0fb9b1);
|
|
||||||
}
|
|
||||||
|
|
||||||
.emergency-back-btn {
|
|
||||||
position: absolute;
|
|
||||||
left: 30rpx;
|
|
||||||
top: 30rpx;
|
|
||||||
background: rgba(255, 255, 255, .2);
|
|
||||||
border: none;
|
|
||||||
color: #fff;
|
|
||||||
font-size: 36rpx;
|
|
||||||
width: 80rpx;
|
|
||||||
height: 80rpx;
|
|
||||||
border-radius: 50%;
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
.h1 {
|
|
||||||
text-align: center;
|
|
||||||
display: block;
|
|
||||||
margin-bottom: 6rpx;
|
|
||||||
}
|
|
||||||
|
|
||||||
.current-area {
|
|
||||||
text-align: center;
|
|
||||||
display: block;
|
|
||||||
opacity: .9;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.emergencyList {
|
.emergencyList {
|
||||||
padding: 30rpx;
|
width: 100%;
|
||||||
.noDataBox{
|
|
||||||
|
.noDataBox {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 100vh;
|
height: 60vh;
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
.emergencyItem {
|
.eventCard {
|
||||||
width: 100%;
|
background: $card;
|
||||||
border-radius: 8rpx;
|
border-radius: 16rpx;
|
||||||
background-color: #fff;
|
margin-bottom: 32rpx;
|
||||||
box-shadow: @shadow;
|
overflow: hidden;
|
||||||
box-sizing: border-box;
|
box-shadow: $shadow;
|
||||||
padding: 24rpx;
|
|
||||||
margin-bottom: 24rpx;
|
|
||||||
|
|
||||||
.emergencyItemTitle {
|
.cardHeader {
|
||||||
display: flex;
|
padding: 32rpx 32rpx 16rpx;
|
||||||
align-items: center;
|
|
||||||
justify-content: space-between;
|
|
||||||
margin-bottom: 24rpx;
|
|
||||||
|
|
||||||
.emergencyItemTitleLeft {
|
|
||||||
font-size: 28rpx;
|
|
||||||
font-weight: 600;
|
|
||||||
display: inline-block;
|
|
||||||
width: 80%;
|
|
||||||
}
|
|
||||||
|
|
||||||
.emergencyItemStatus {
|
|
||||||
font-size: 24rpx;
|
|
||||||
padding: 4rpx 16rpx;
|
|
||||||
border-radius: 32rpx;
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
.emergencyDesc {
|
|
||||||
font-size: 24rpx;
|
|
||||||
}
|
|
||||||
|
|
||||||
.line {
|
|
||||||
width: 100%;
|
|
||||||
height: 2rpx;
|
|
||||||
background-color: #dad9d3;
|
|
||||||
margin: 24rpx 0;
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
.otherMessageRow {
|
|
||||||
width: 100%;
|
|
||||||
margin-bottom: 8rpx;
|
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: flex-start;
|
align-items: flex-start;
|
||||||
|
justify-content: space-between;
|
||||||
|
|
||||||
.otherMessageIcon {
|
.eventTitle {
|
||||||
width: 30rpx;
|
flex: 1;
|
||||||
height: 30rpx;
|
font-size: 28rpx;
|
||||||
|
font-weight: 600;
|
||||||
|
color: #160002;
|
||||||
|
line-height: 1.4;
|
||||||
margin-right: 16rpx;
|
margin-right: 16rpx;
|
||||||
margin-top: 6rpx;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.otherMessageValue {
|
.eventStatus {
|
||||||
font-size: 24rpx;
|
font-size: 22rpx;
|
||||||
|
font-weight: 400;
|
||||||
|
padding: 6rpx 12rpx;
|
||||||
|
border-radius: 12rpx;
|
||||||
|
flex-shrink: 0;
|
||||||
|
|
||||||
|
&.status-completed {
|
||||||
|
background: #E7F8EE;
|
||||||
|
color: $success;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.status-processing {
|
||||||
|
background: #FFF3E0;
|
||||||
|
color: $warning;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.eventDesc {
|
||||||
|
padding: 0 32rpx 16rpx;
|
||||||
|
font-size: 24rpx;
|
||||||
|
font-weight: 400;
|
||||||
|
color: $muted;
|
||||||
|
line-height: 1.5;
|
||||||
|
}
|
||||||
|
|
||||||
|
.eventDetails {
|
||||||
|
padding: 16rpx 32rpx 32rpx;
|
||||||
|
background: #FAFAFA;
|
||||||
|
|
||||||
|
.detailItem {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
margin-bottom: 16rpx;
|
||||||
|
|
||||||
|
&:last-child {
|
||||||
|
margin-bottom: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.detailIcon {
|
||||||
|
width: 32rpx;
|
||||||
|
height: 32rpx;
|
||||||
|
margin-right: 16rpx;
|
||||||
|
flex-shrink: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.detailValue {
|
||||||
|
font-size: 24rpx;
|
||||||
|
font-weight: 400;
|
||||||
|
color: #160002;
|
||||||
|
flex: 1;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.add-event-btn {
|
|
||||||
position: fixed;
|
|
||||||
bottom: 160rpx;
|
|
||||||
right: 40rpx;
|
|
||||||
width: 96rpx;
|
|
||||||
height: 96rpx;
|
|
||||||
background: linear-gradient(135deg, @primary, @primary2);
|
|
||||||
border-radius: 50%;
|
|
||||||
border: none;
|
|
||||||
color: #fff;
|
|
||||||
font-size: 40rpx;
|
|
||||||
box-shadow: 0 8rpx 24rpx rgba(74, 144, 226, .4);
|
|
||||||
}
|
|
||||||
|
|
||||||
.promo-banner {
|
|
||||||
margin: 30rpx;
|
|
||||||
border-radius: 24rpx;
|
|
||||||
overflow: hidden;
|
|
||||||
box-shadow: @shadow;
|
|
||||||
|
|
||||||
.promo-image {
|
|
||||||
width: 100%;
|
|
||||||
height: 240rpx;
|
|
||||||
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: center;
|
|
||||||
color: #fff;
|
|
||||||
font-size: 48rpx;
|
|
||||||
position: relative;
|
|
||||||
overflow: hidden;
|
|
||||||
|
|
||||||
.promo-content {
|
|
||||||
position: absolute;
|
|
||||||
bottom: 0;
|
|
||||||
left: 0;
|
|
||||||
right: 0;
|
|
||||||
background: linear-gradient(transparent, rgba(0, 0, 0, .7));
|
|
||||||
padding: 40rpx 30rpx 30rpx;
|
|
||||||
color: #fff;
|
|
||||||
|
|
||||||
.promo-title {
|
|
||||||
font-size: 32rpx;
|
|
||||||
font-weight: 700;
|
|
||||||
margin-bottom: 8rpx;
|
|
||||||
}
|
|
||||||
|
|
||||||
.promo-subtitle {
|
|
||||||
font-size: 24rpx;
|
|
||||||
opacity: .9;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.facilities-section {
|
|
||||||
margin: 30rpx;
|
|
||||||
background: #fff;
|
|
||||||
border-radius: 24rpx;
|
|
||||||
overflow: hidden;
|
|
||||||
box-shadow: @shadow;
|
|
||||||
|
|
||||||
.facilities-header {
|
|
||||||
background: linear-gradient(135deg, #20bf6b, #0fb9b1);
|
|
||||||
color: #fff;
|
|
||||||
padding: 30rpx;
|
|
||||||
font-weight: 700;
|
|
||||||
font-size: 32rpx;
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
gap: 16rpx;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
|
// 弹窗样式保持不变，只是不再使用
|
||||||
.eventsPopupBox {
|
.eventsPopupBox {
|
||||||
width: 90vw;
|
width: 90vw;
|
||||||
height: 80vh;
|
height: 80vh;
|
||||||
background-color: #fff;
|
background-color: $card;
|
||||||
border-radius: 16rpx;
|
border-radius: 16rpx;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
padding: 24rpx;
|
padding: 24rpx;
|
||||||
@ -689,10 +596,9 @@ export default {
|
|||||||
|
|
||||||
.line {
|
.line {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 2rpx;
|
height: 1rpx;
|
||||||
background-color: #dad9d3;
|
background-color: #f0f0f0;
|
||||||
margin: 24rpx 0;
|
margin: 16rpx 0;
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.eventsSmallTitle {
|
.eventsSmallTitle {
|
||||||
@ -730,7 +636,6 @@ export default {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|||||||
@ -1,157 +1,140 @@
|
|||||||
<template>
|
<template>
|
||||||
<view class="main">
|
<view class="main">
|
||||||
<view class="detailBox">
|
<!-- 事件头部信息 -->
|
||||||
<view class="pageTitle">{{ detailObj.title || "" }}</view>
|
<view class="headerCard">
|
||||||
|
<view class="eventTitle">{{ detailObj.title || detailObj.type || "-" }}</view>
|
||||||
<view class="userDetailBox" :style="{ marginTop: pageType === 1 ? '' : '0' }">
|
<view class="headerInfo">
|
||||||
<view class="userDetailBoxTop">
|
<view class="serviceName">{{ detailObj.saName || "-" }}</view>
|
||||||
<view class="userDetailBoxService">{{ detailObj.saName || "" }}</view>
|
<view class="eventStatus" :class="{
|
||||||
|
'status-completed': detailObj.state === '完成',
|
||||||
<view class="userDetailBoxServiceRight">
|
'status-processing': detailObj.state === '处理中'
|
||||||
<view class="userDetailBoxStatus" :style="{
|
}">
|
||||||
background: detailObj.state === '完成' ? '#ecbd44' : detailObj.state === '处理中' ? '#d3d3d3' : '',
|
{{ detailObj.state || "-" }}
|
||||||
color: detailObj.state === '完成' ? '#fff' : detailObj.state === '处理中' ? '#fff' : ''
|
|
||||||
}">
|
|
||||||
{{ detailObj.state }}</view>
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
|
|
||||||
<view class="eventsItem" style="margin-top: 24rpx;">
|
|
||||||
<view class="eventsHaveImgLabel">
|
|
||||||
<image class="eventsHaveImg" src="https://eshangtech.com/cyy_DIB/personIcon.png" />
|
|
||||||
<view class="eventsHaveLabel">联系人：</view>
|
|
||||||
</view>
|
|
||||||
<view class="eventsValue">{{ detailObj.userName || detailObj.createUserName || "" }}</view>
|
|
||||||
</view>
|
|
||||||
<view class="eventsItem">
|
|
||||||
<view class="eventsHaveImgLabel">
|
|
||||||
<image class="eventsHaveImg" src="https://eshangtech.com/cyy_DIB/phoneLabelIcon.png" />
|
|
||||||
<view class="eventsHaveLabel">联系电话：</view>
|
|
||||||
</view>
|
|
||||||
<view class="eventsValue">{{ detailObj.phone || "" }}</view>
|
|
||||||
</view>
|
|
||||||
<view class="eventsItem" style="margin-bottom: 0;">
|
|
||||||
<view class="eventsHaveImgLabel">
|
|
||||||
<image class="eventsHaveImg" src="https://eshangtech.com/cyy_DIB/timeIcon.png" />
|
|
||||||
<view class="eventsHaveLabel">{{ pageType === 1 ? '处理用时：' : pageType === 2 ? '创建时间' : '' }}
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
<view class="eventsValue">{{ detailObj.handlingTime || detailObj.createTime || "" }}</view>
|
|
||||||
</view>
|
|
||||||
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
|
|
||||||
<view class="pageText" v-if="pageType === 1">应急事件</view>
|
|
||||||
<view class="pageText" v-if="pageType === 2">日常问题</view>
|
|
||||||
|
|
||||||
<view class="detailBox" v-if="pageType === 1">
|
|
||||||
<view class="userDetailBox noBoxShow">
|
|
||||||
<!-- <view class="eventsItem">
|
|
||||||
<view class="eventsLabel">标题：</view>
|
|
||||||
<view class="eventsValue">{{ detailObj.title || "" }}</view>
|
|
||||||
</view> -->
|
|
||||||
<view class="eventsItem">
|
|
||||||
<view class="eventsLabel">事件片区：</view>
|
|
||||||
<view class="eventsValue">{{ detailObj.belongArea || "" }}</view>
|
|
||||||
</view>
|
|
||||||
<!-- <view class="eventsItem">
|
|
||||||
<view class="eventsLabel">事件服务区：</view>
|
|
||||||
<view class="eventsValue">{{ detailObj.service || "" }}</view>
|
|
||||||
</view>
|
|
||||||
|
|
||||||
<view class="eventsItem">
|
|
||||||
<view class="eventsLabel">死亡人数：</view>
|
|
||||||
<view class="eventsValue">{{ detailObj.diePerson || "" }}</view>
|
|
||||||
</view> -->
|
|
||||||
<view class="eventsItem">
|
|
||||||
<view class="eventsLabel">事件概况：</view>
|
|
||||||
<view class="eventsValue">{{ detailObj.sceneOverview || "" }}</view>
|
|
||||||
</view>
|
|
||||||
<view class="eventsItem">
|
|
||||||
<view class="eventsLabel">事件损失情况：</view>
|
|
||||||
<view class="eventsValue">{{ detailObj.lossSituation || "" }}</view>
|
|
||||||
</view>
|
|
||||||
<view class="eventsItem">
|
|
||||||
<view class="eventsLabel">处理结果：</view>
|
|
||||||
<view class="eventsValue">{{ detailObj.handlingResult || "" }}</view>
|
|
||||||
</view>
|
|
||||||
<view class="eventsItemPic">
|
|
||||||
<view class="eventsLabel">事件现场照片：</view>
|
|
||||||
<view class="eventsPic" v-if="detailObj.imgUp && detailObj.imgUp.length > 0">
|
|
||||||
<view class="eventsPicItem" v-for="(item, index) in detailObj.imgUp" :key="index"
|
|
||||||
@click="showImg(detailObj.imgUp, index)">
|
|
||||||
<image class="eventsPicImg"
|
|
||||||
:src="'https://fwqznxj.yciccloud.com:9081/fileDownloadApi/bsys/document/docDownloadAction?fileId=' + item.fileID" />
|
|
||||||
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
<view class="detailBox" v-if="pageType === 2" style="padding-bottom: 24rpx;">
|
<!-- 基本信息 -->
|
||||||
<view class="userDetailBox noBoxShow">
|
<view class="infoCard">
|
||||||
<view class="eventsItem">
|
<view class="cardTitle">基本信息</view>
|
||||||
<view class="eventsLabel">事件片区：</view>
|
<view class="infoList">
|
||||||
<view class="eventsValue">{{ detailObj.belongArea || "" }}</view>
|
<view class="infoItem">
|
||||||
|
<image class="infoIcon" src="https://eshangtech.com/cyy_DIB/personIcon.png" />
|
||||||
|
<view class="infoLabel">联系人</view>
|
||||||
|
<view class="infoValue">{{ detailObj.userName || detailObj.createUserName || "-" }}</view>
|
||||||
</view>
|
</view>
|
||||||
<!-- <view class="eventsItem">
|
<view class="infoItem">
|
||||||
<view class="eventsLabel">事件服务区：</view>
|
<image class="infoIcon" src="https://eshangtech.com/cyy_DIB/phoneLabelIcon.png" />
|
||||||
<view class="eventsValue">{{ detailObj.service || "" }}</view>
|
<view class="infoLabel">联系电话</view>
|
||||||
</view> -->
|
<view class="infoValue">{{ detailObj.phone || "-" }}</view>
|
||||||
<view class="eventsItem">
|
|
||||||
<view class="eventsLabel">类型：</view>
|
|
||||||
<view class="eventsValue">{{ detailObj.type || "" }}</view>
|
|
||||||
</view>
|
</view>
|
||||||
<view class="eventsItem" style="margin-bottom: 0;">
|
<view class="infoItem">
|
||||||
<view class="eventsLabel">问题描述：</view>
|
<image class="infoIcon" src="https://eshangtech.com/cyy_DIB/timeIcon.png" />
|
||||||
<view class="eventsValue">{{ detailObj.describe || "" }}</view>
|
<view class="infoLabel">{{ pageType === 1 ? '处理用时' : '创建时间' }}</view>
|
||||||
|
<view class="infoValue">{{ detailObj.handlingTime || detailObj.createTime || "-" }}</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
</view>
|
|
||||||
|
|
||||||
<view class="pageText" v-if="pageType === 2">协调处理情况</view>
|
|
||||||
|
|
||||||
<view class="detailBox" v-if="pageType === 2" style="padding-bottom: 24rpx;">
|
|
||||||
<view class="eventsItem">
|
|
||||||
<view class="eventsLabel">协调处理结果：</view>
|
|
||||||
<view class="eventsValue">{{ detailObj.coorResult || "" }}</view>
|
|
||||||
</view>
|
|
||||||
<view class="eventsItem">
|
|
||||||
<view class="eventsLabel">办理人：</view>
|
|
||||||
<view class="eventsValue">{{ detailObj.coorUserName || "" }}</view>
|
|
||||||
</view>
|
|
||||||
<view class="eventsItem" style="margin-bottom: 0;">
|
|
||||||
<view class="eventsLabel">办理完成时间：</view>
|
|
||||||
<view class="eventsValue">{{ detailObj.coorEndTime || "" }}</view>
|
|
||||||
</view>
|
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
<view class="pageText" v-if="pageType === 2">经营公司协调处理情况</view>
|
<!-- 应急事件详情 -->
|
||||||
|
<view class="detailCard" v-if="pageType === 1">
|
||||||
|
<view class="cardTitle">事件详情</view>
|
||||||
|
<view class="detailList">
|
||||||
|
<view class="detailItem">
|
||||||
|
<view class="detailLabel">事件片区</view>
|
||||||
|
<view class="detailValue">{{ detailObj.belongArea || "-" }}</view>
|
||||||
|
</view>
|
||||||
|
<view class="detailItem">
|
||||||
|
<view class="detailLabel">事件概况</view>
|
||||||
|
<view class="detailValue">{{ detailObj.sceneOverview || "-" }}</view>
|
||||||
|
</view>
|
||||||
|
<view class="detailItem">
|
||||||
|
<view class="detailLabel">损失情况</view>
|
||||||
|
<view class="detailValue">{{ detailObj.lossSituation || "-" }}</view>
|
||||||
|
</view>
|
||||||
|
<view class="detailItem">
|
||||||
|
<view class="detailLabel">处理结果</view>
|
||||||
|
<view class="detailValue">{{ detailObj.handlingResult || "-" }}</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
<view class="detailBox" v-if="pageType === 2" style="padding-bottom: 24rpx;">
|
<!-- 现场照片 -->
|
||||||
<view class="eventsItem">
|
<view class="photoSection" v-if="detailObj.imgUp && detailObj.imgUp.length > 0">
|
||||||
<view class="eventsLabel">协调处理结果：</view>
|
<view class="photoTitle">事件现场照片</view>
|
||||||
<view class="eventsPic">{{ detailObj.companyResult || "" }}</view>
|
<view class="photoGrid">
|
||||||
</view>
|
<view class="photoItem" v-for="(item, index) in detailObj.imgUp" :key="index"
|
||||||
<view class="eventsItem">
|
@click="showImg(detailObj.imgUp, index)">
|
||||||
<view class="eventsLabel">办理人：</view>
|
<image class="photoImage" mode="aspectFill"
|
||||||
<view class="eventsValue">{{ detailObj.companyUserName || "" }}</view>
|
|
||||||
</view>
|
|
||||||
<view class="eventsItem">
|
|
||||||
<view class="eventsLabel">办理完成时间：</view>
|
|
||||||
<view class="eventsValue">{{ detailObj.companyEndTime || "" }}</view>
|
|
||||||
</view>
|
|
||||||
<view class="eventsItemPic" style="margin-bottom: 0;">
|
|
||||||
<view class="eventsLabel">事件现场照片：</view>
|
|
||||||
<view class="eventsPic" v-if="detailObj.fileUp && detailObj.fileUp.length > 0">
|
|
||||||
<view class="eventsPicItem" v-for="(item, index) in detailObj.fileUp" :key="index"
|
|
||||||
@click="showImg(detailObj.fileUp, index)">
|
|
||||||
<image class="eventsPicImg"
|
|
||||||
:src="'https://fwqznxj.yciccloud.com:9081/fileDownloadApi/bsys/document/docDownloadAction?fileId=' + item.fileID" />
|
:src="'https://fwqznxj.yciccloud.com:9081/fileDownloadApi/bsys/document/docDownloadAction?fileId=' + item.fileID" />
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<!-- 日常问题详情 -->
|
||||||
|
<view class="detailCard" v-if="pageType === 2">
|
||||||
|
<view class="cardTitle">问题详情</view>
|
||||||
|
<view class="detailList">
|
||||||
|
<view class="detailItem">
|
||||||
|
<view class="detailLabel">事件片区</view>
|
||||||
|
<view class="detailValue">{{ detailObj.belongArea || "-" }}</view>
|
||||||
|
</view>
|
||||||
|
<view class="detailItem">
|
||||||
|
<view class="detailLabel">问题类型</view>
|
||||||
|
<view class="detailValue">{{ detailObj.type || "-" }}</view>
|
||||||
|
</view>
|
||||||
|
<view class="detailItem">
|
||||||
|
<view class="detailLabel">问题描述</view>
|
||||||
|
<view class="detailValue">{{ detailObj.describe || "-" }}</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<!-- 协调处理情况 -->
|
||||||
|
<view class="detailCard" v-if="pageType === 2">
|
||||||
|
<view class="cardTitle">协调处理情况</view>
|
||||||
|
<view class="detailList">
|
||||||
|
<view class="detailItem">
|
||||||
|
<view class="detailLabel">处理结果</view>
|
||||||
|
<view class="detailValue">{{ detailObj.coorResult || "-" }}</view>
|
||||||
|
</view>
|
||||||
|
<view class="detailItem">
|
||||||
|
<view class="detailLabel">办理人</view>
|
||||||
|
<view class="detailValue">{{ detailObj.coorUserName || "-" }}</view>
|
||||||
|
</view>
|
||||||
|
<view class="detailItem">
|
||||||
|
<view class="detailLabel">完成时间</view>
|
||||||
|
<view class="detailValue">{{ detailObj.coorEndTime || "-" }}</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<!-- 经营公司处理情况 -->
|
||||||
|
<view class="detailCard" v-if="pageType === 2">
|
||||||
|
<view class="cardTitle">经营公司处理情况</view>
|
||||||
|
<view class="detailList">
|
||||||
|
<view class="detailItem">
|
||||||
|
<view class="detailLabel">处理结果</view>
|
||||||
|
<view class="detailValue">{{ detailObj.companyResult || "-" }}</view>
|
||||||
|
</view>
|
||||||
|
<view class="detailItem">
|
||||||
|
<view class="detailLabel">办理人</view>
|
||||||
|
<view class="detailValue">{{ detailObj.companyUserName || "-" }}</view>
|
||||||
|
</view>
|
||||||
|
<view class="detailItem">
|
||||||
|
<view class="detailLabel">完成时间</view>
|
||||||
|
<view class="detailValue">{{ detailObj.companyEndTime || "-" }}</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<!-- 现场照片 -->
|
||||||
|
<view class="photoSection" v-if="detailObj.fileUp && detailObj.fileUp.length > 0">
|
||||||
|
<view class="photoTitle">事件现场照片</view>
|
||||||
|
<view class="photoGrid">
|
||||||
|
<view class="photoItem" v-for="(item, index) in detailObj.fileUp" :key="index"
|
||||||
|
@click="showImg(detailObj.fileUp, index)">
|
||||||
|
<image class="photoImage" mode="aspectFill"
|
||||||
|
:src="'https://fwqznxj.yciccloud.com:9081/fileDownloadApi/bsys/document/docDownloadAction?fileId=' + item.fileID" />
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
@ -205,189 +188,202 @@ export default {
|
|||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
<style scoped lang="scss">
|
<style scoped lang="scss">
|
||||||
|
// 使用项目全局颜色变量
|
||||||
|
$bg: #f8f9fa;
|
||||||
|
$muted: #666;
|
||||||
|
$card: #fff;
|
||||||
|
$shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
|
||||||
|
$primary: #27B25F;
|
||||||
|
$primary2: #4CCC7F;
|
||||||
|
$success: #2ed573;
|
||||||
|
$warning: #ff9f43;
|
||||||
|
$danger: #ff4757;
|
||||||
|
$info: #3742fa;
|
||||||
|
|
||||||
.main {
|
.main {
|
||||||
width: 100vw;
|
width: 100vw;
|
||||||
min-height: 100vh;
|
min-height: 100vh;
|
||||||
background-color: #f0f2f3;
|
background-color: $bg;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
padding-bottom: constant(safe-area-inset-bottom);
|
padding: 32rpx;
|
||||||
/* 兼容旧版 iOS */
|
|
||||||
padding-bottom: env(safe-area-inset-bottom);
|
padding-bottom: env(safe-area-inset-bottom);
|
||||||
|
|
||||||
/* 兼容新版 */
|
// 事件头部信息卡片
|
||||||
.detailBox {
|
.headerCard {
|
||||||
width: 100%;
|
background: $card;
|
||||||
box-sizing: border-box;
|
border-radius: 16rpx;
|
||||||
padding: 24rpx 24rpx 48rpx;
|
padding: 32rpx;
|
||||||
background-color: #fff;
|
margin-bottom: 32rpx;
|
||||||
|
box-shadow: $shadow;
|
||||||
|
|
||||||
.pageTitle {
|
.eventTitle {
|
||||||
width: 100%;
|
font-size: 28rpx;
|
||||||
display: flex;
|
font-weight: 600;
|
||||||
justify-content: center;
|
color: #160002;
|
||||||
align-items: center;
|
margin-bottom: 16rpx;
|
||||||
font-size: 30rpx;
|
line-height: 1.4;
|
||||||
}
|
}
|
||||||
|
|
||||||
.userDetailBox {
|
.headerInfo {
|
||||||
width: calc(100% - 32rpx);
|
display: flex;
|
||||||
margin-top: 24rpx;
|
align-items: center;
|
||||||
margin-left: 16rpx;
|
justify-content: space-between;
|
||||||
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
|
|
||||||
box-sizing: border-box;
|
|
||||||
padding: 16rpx 24rpx;
|
|
||||||
|
|
||||||
.userDetailBoxTop {
|
.serviceName {
|
||||||
width: 100%;
|
font-size: 24rpx;
|
||||||
display: flex;
|
font-weight: 400;
|
||||||
align-items: center;
|
color: $muted;
|
||||||
justify-content: space-between;
|
flex: 1;
|
||||||
|
|
||||||
.userDetailBoxService {
|
|
||||||
font-size: 28rpx;
|
|
||||||
}
|
|
||||||
|
|
||||||
.userDetailBoxStatus {
|
|
||||||
display: inline-block;
|
|
||||||
font-size: 24rpx;
|
|
||||||
padding: 4rpx 16rpx;
|
|
||||||
border-radius: 32rpx;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.eventStatus {
|
||||||
|
font-size: 22rpx;
|
||||||
|
font-weight: 400;
|
||||||
|
padding: 6rpx 12rpx;
|
||||||
|
border-radius: 12rpx;
|
||||||
|
flex-shrink: 0;
|
||||||
|
|
||||||
.eventsItem {
|
&.status-completed {
|
||||||
width: 100%;
|
background: #E7F8EE;
|
||||||
|
color: $success;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.status-processing {
|
||||||
|
background: #FFF3E0;
|
||||||
|
color: $warning;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 基本信息卡片
|
||||||
|
.infoCard {
|
||||||
|
background: $card;
|
||||||
|
border-radius: 16rpx;
|
||||||
|
margin-bottom: 32rpx;
|
||||||
|
overflow: hidden;
|
||||||
|
box-shadow: $shadow;
|
||||||
|
|
||||||
|
.cardTitle {
|
||||||
|
padding: 32rpx 32rpx 16rpx;
|
||||||
|
font-size: 26rpx;
|
||||||
|
font-weight: 600;
|
||||||
|
color: #160002;
|
||||||
|
border-bottom: 1rpx solid #f0f0f0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.infoList {
|
||||||
|
padding: 16rpx 32rpx 32rpx;
|
||||||
|
background: #FAFAFA;
|
||||||
|
|
||||||
|
.infoItem {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
margin-bottom: 16rpx;
|
margin-bottom: 16rpx;
|
||||||
|
|
||||||
|
&:last-child {
|
||||||
|
margin-bottom: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.infoIcon {
|
||||||
|
width: 32rpx;
|
||||||
|
height: 32rpx;
|
||||||
|
margin-right: 16rpx;
|
||||||
|
flex-shrink: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.infoLabel {
|
||||||
|
font-size: 24rpx;
|
||||||
|
font-weight: 600;
|
||||||
|
color: #160002;
|
||||||
|
width: 120rpx;
|
||||||
|
flex-shrink: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.infoValue {
|
||||||
|
font-size: 24rpx;
|
||||||
|
font-weight: 400;
|
||||||
|
color: #160002;
|
||||||
|
flex: 1;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
// 详情卡片
|
||||||
|
.detailCard {
|
||||||
|
background: $card;
|
||||||
|
border-radius: 16rpx;
|
||||||
|
margin-bottom: 32rpx;
|
||||||
|
overflow: hidden;
|
||||||
|
box-shadow: $shadow;
|
||||||
|
|
||||||
|
.cardTitle {
|
||||||
|
padding: 32rpx 32rpx 16rpx;
|
||||||
|
font-size: 26rpx;
|
||||||
|
font-weight: 600;
|
||||||
|
color: #160002;
|
||||||
|
border-bottom: 1rpx solid #f0f0f0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.detailList {
|
||||||
|
padding: 16rpx 32rpx 0;
|
||||||
|
|
||||||
|
.detailItem {
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: flex-start;
|
align-items: flex-start;
|
||||||
|
padding: 16rpx 0;
|
||||||
|
border-bottom: 1rpx solid #f8f8f8;
|
||||||
|
|
||||||
.eventsHaveImgLabel {
|
&:last-child {
|
||||||
display: flex;
|
border-bottom: none;
|
||||||
width: 200rpx;
|
|
||||||
align-items: center;
|
|
||||||
|
|
||||||
.eventsHaveImg {
|
|
||||||
width: 30rpx;
|
|
||||||
height: 30rpx;
|
|
||||||
margin-right: 16rpx;
|
|
||||||
margin-top: 6rpx;
|
|
||||||
}
|
|
||||||
|
|
||||||
.eventsHaveLabel {
|
|
||||||
width: 154rpx;
|
|
||||||
font-size: 24rpx;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.eventsLabel {
|
.detailLabel {
|
||||||
width: 200rpx;
|
|
||||||
text-align: left;
|
|
||||||
font-size: 24rpx;
|
font-size: 24rpx;
|
||||||
}
|
font-weight: 600;
|
||||||
|
color: #160002;
|
||||||
.eventsValue {
|
width: 120rpx;
|
||||||
flex: 1;
|
flex-shrink: 0;
|
||||||
font-size: 24rpx;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.eventsItemPic {
|
|
||||||
width: 100%;
|
|
||||||
|
|
||||||
.eventsLabel {
|
|
||||||
width: 200rpx;
|
|
||||||
text-align: left;
|
|
||||||
font-size: 24rpx;
|
|
||||||
}
|
|
||||||
|
|
||||||
.eventsPic {
|
|
||||||
flex: 1;
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
font-size: 24rpx;
|
|
||||||
|
|
||||||
.eventsPicItem {
|
|
||||||
width: 100rpx;
|
|
||||||
height: 100rpx;
|
|
||||||
margin-right: 8rpx;
|
|
||||||
margin-bottom: 8rpx;
|
|
||||||
|
|
||||||
.eventsPicImg {
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.noBoxShow {
|
|
||||||
box-shadow: none;
|
|
||||||
margin-top: 0;
|
|
||||||
padding: 0 24rpx;
|
|
||||||
margin-left: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
.eventsItem {
|
|
||||||
width: 100%;
|
|
||||||
margin-bottom: 16rpx;
|
|
||||||
display: flex;
|
|
||||||
align-items: flex-start;
|
|
||||||
|
|
||||||
.eventsHaveImgLabel {
|
|
||||||
display: flex;
|
|
||||||
width: 200rpx;
|
|
||||||
align-items: center;
|
|
||||||
|
|
||||||
.eventsHaveImg {
|
|
||||||
width: 30rpx;
|
|
||||||
height: 30rpx;
|
|
||||||
margin-right: 16rpx;
|
margin-right: 16rpx;
|
||||||
margin-top: 6rpx;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.eventsHaveLabel {
|
.detailValue {
|
||||||
width: 154rpx;
|
|
||||||
font-size: 24rpx;
|
font-size: 24rpx;
|
||||||
|
font-weight: 400;
|
||||||
|
color: #160002;
|
||||||
|
flex: 1;
|
||||||
|
line-height: 1.5;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.eventsLabel {
|
|
||||||
width: 200rpx;
|
|
||||||
text-align: left;
|
|
||||||
font-size: 24rpx;
|
|
||||||
}
|
|
||||||
|
|
||||||
.eventsValue {
|
|
||||||
flex: 1;
|
|
||||||
font-size: 24rpx;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.eventsItemPic {
|
// 图片展示区域
|
||||||
width: 100%;
|
.photoSection {
|
||||||
|
padding: 16rpx 32rpx 32rpx;
|
||||||
|
border-top: 1rpx solid #f0f0f0;
|
||||||
|
margin-top: 16rpx;
|
||||||
|
|
||||||
.eventsLabel {
|
.photoTitle {
|
||||||
width: 200rpx;
|
|
||||||
text-align: left;
|
|
||||||
font-size: 24rpx;
|
font-size: 24rpx;
|
||||||
|
font-weight: 600;
|
||||||
|
color: #160002;
|
||||||
|
margin-bottom: 16rpx;
|
||||||
}
|
}
|
||||||
|
|
||||||
.eventsPic {
|
.photoGrid {
|
||||||
flex: 1;
|
display: grid;
|
||||||
display: flex;
|
grid-template-columns: repeat(3, 1fr);
|
||||||
align-items: center;
|
gap: 16rpx;
|
||||||
font-size: 24rpx;
|
|
||||||
|
|
||||||
.eventsPicItem {
|
.photoItem {
|
||||||
width: 100rpx;
|
aspect-ratio: 1;
|
||||||
height: 100rpx;
|
border-radius: 8rpx;
|
||||||
margin-right: 8rpx;
|
overflow: hidden;
|
||||||
margin-bottom: 8rpx;
|
background: #f8f8f8;
|
||||||
|
|
||||||
.eventsPicImg {
|
.photoImage {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
}
|
}
|
||||||
@ -395,13 +391,5 @@ export default {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.pageText {
|
|
||||||
width: 100%;
|
|
||||||
box-sizing: border-box;
|
|
||||||
padding: 16rpx 40rpx;
|
|
||||||
font-size: 24rpx;
|
|
||||||
color: #8d8e8e;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
@ -34,11 +34,17 @@
|
|||||||
style="width: 100%; height: 100%">
|
style="width: 100%; height: 100%">
|
||||||
<swiper-item v-for="(img, i) in serviceInfo.ImageLits" :key="i"
|
<swiper-item v-for="(img, i) in serviceInfo.ImageLits" :key="i"
|
||||||
style="width: 100%; height: 100%">
|
style="width: 100%; height: 100%">
|
||||||
<image style="width: 100%; height: 100%" mode="aspectFill" lazy-load="true" :src="img">
|
<image style="width: 100%; height: 100%" mode="aspectFill" lazy-load="true"
|
||||||
|
:src="img || 'https://eshangtech.com/ShopICO/ahyd-BID/service/default.png'">
|
||||||
</image>
|
</image>
|
||||||
</swiper-item>
|
</swiper-item>
|
||||||
</swiper>
|
</swiper>
|
||||||
</view>
|
</view>
|
||||||
|
<view v-else class="serviceImg">
|
||||||
|
<image style="width: 100%; height: 100%" mode="aspectFill" lazy-load="true"
|
||||||
|
:src="'https://eshangtech.com/ShopICO/ahyd-BID/service/default.png'">
|
||||||
|
</image>
|
||||||
|
</view>
|
||||||
</view>
|
</view>
|
||||||
<!-- <view class="detailBottom">
|
<!-- <view class="detailBottom">
|
||||||
<view class="detailFirst">
|
<view class="detailFirst">
|
||||||
@ -122,7 +128,7 @@
|
|||||||
<view class="onDutyPersonBoxHeader">
|
<view class="onDutyPersonBoxHeader">
|
||||||
<text class="title">{{ selectTab === 1 ? "👥 当前在岗人员" : selectTab === 2 ? "📋 请假人员列表" : selectTab === 3
|
<text class="title">{{ selectTab === 1 ? "👥 当前在岗人员" : selectTab === 2 ? "📋 请假人员列表" : selectTab === 3
|
||||||
? "👑 值班经理信息" : ""
|
? "👑 值班经理信息" : ""
|
||||||
}}</text>
|
}}</text>
|
||||||
|
|
||||||
|
|
||||||
<!-- 居中的日历时间 -->
|
<!-- 居中的日历时间 -->
|
||||||
|
|||||||
@ -1,6 +1,6 @@
|
|||||||
<template>
|
<template>
|
||||||
<view class="main">
|
<page-meta :page-style="'overflow:visible'"></page-meta>
|
||||||
|
<view class="main" :style="{ paddingTop: (menu.bottom + 14) + 'px' }">
|
||||||
<!-- 顶部固定的内容 -->
|
<!-- 顶部固定的内容 -->
|
||||||
<view class="topBox" :style="{ height: menu.bottom + 8 + 'px' }">
|
<view class="topBox" :style="{ height: menu.bottom + 8 + 'px' }">
|
||||||
<view class="topContent" :style="{ paddingTop: menu.top + 'px', height: menu.height + 'px' }">
|
<view class="topContent" :style="{ paddingTop: menu.top + 'px', height: menu.height + 'px' }">
|
||||||
@ -15,7 +15,8 @@
|
|||||||
</view>
|
</view>
|
||||||
|
|
||||||
<!-- 月份的轮播框 -->
|
<!-- 月份的轮播框 -->
|
||||||
<view class="monthListBox" :style="{ paddingTop: menu.bottom + 8 + 'px' }">
|
<!-- :style="{ paddingTop: menu.bottom + 8 + 'px' }" -->
|
||||||
|
<view class="monthListBox">
|
||||||
<swiper class="swiperBox" previous-margin="40rpx" next-margin="40rpx" :current="selectIndex"
|
<swiper class="swiperBox" previous-margin="40rpx" next-margin="40rpx" :current="selectIndex"
|
||||||
@animationfinish="handleChangeSwiper" :disable-programmatic-animation="false" :duration="300"
|
@animationfinish="handleChangeSwiper" :disable-programmatic-animation="false" :duration="300"
|
||||||
:easing-function="ease - out">
|
:easing-function="ease - out">
|
||||||
@ -79,16 +80,10 @@
|
|||||||
? '#97A9C6'
|
? '#97A9C6'
|
||||||
: '',
|
: '',
|
||||||
}"></view>
|
}"></view>
|
||||||
<span class="itemName">{{
|
<span class="itemName">{{ subItem.name }}</span>
|
||||||
subItem.name
|
|
||||||
}}</span>
|
|
||||||
</view>
|
</view>
|
||||||
<view class="itemCenter">
|
<view class="itemCenter">
|
||||||
{{
|
{{ subItem.value ? $util.getMoney(subItem.value / 10000) : "" }}
|
||||||
subItem.value
|
|
||||||
? $util.getMoney(subItem.value / 10000)
|
|
||||||
: ""
|
|
||||||
}}
|
|
||||||
</view>
|
</view>
|
||||||
<view class="itemRight" :style="{
|
<view class="itemRight" :style="{
|
||||||
color:
|
color:
|
||||||
@ -97,33 +92,22 @@
|
|||||||
: subItem.addQOQ < 0
|
: subItem.addQOQ < 0
|
||||||
? '#0E9976'
|
? '#0E9976'
|
||||||
: '',
|
: '',
|
||||||
}">{{
|
}">{{ subItem.addQOQ ? `${subItem.addQOQ}` : "" }}</view>
|
||||||
subItem.addQOQ ? `${subItem.addQOQ}` : ""
|
|
||||||
}}</view>
|
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
|
|
||||||
<!-- 年度标题 -->
|
<!-- 年度标题 -->
|
||||||
<view class="yearAccountItem" style="margin-bottom: 24rpx">
|
<view class="yearAccountItem" style="margin-bottom: 24rpx">
|
||||||
<view class="itemTop">
|
<view class="itemTop">
|
||||||
<view class="itemName">{{
|
<view class="itemName">{{ (Math.floor(index / 12) + 2024).toString().slice(2, 4)
|
||||||
(Math.floor(index / 12) + 2024)
|
|
||||||
.toString()
|
|
||||||
.slice(2, 4)
|
|
||||||
}}年累计对客销售<span class="unit">/亿元</span></view>
|
}}年累计对客销售<span class="unit">/亿元</span></view>
|
||||||
<!-- <view class="itemType">累计</view>-->
|
|
||||||
</view>
|
</view>
|
||||||
<view class="itemBottom">
|
<view class="itemBottom">
|
||||||
<span class="revenueNum" v-if="selectIndex === index && hasCurrentMonthData">{{
|
<span class="revenueNum" v-if="selectIndex === index && hasCurrentMonthData">{{
|
||||||
topShowData && topShowData.MonthRevenueModel &&
|
topShowData && topShowData.MonthRevenueModel &&
|
||||||
topShowData.MonthRevenueModel.YearRevenueAmount
|
topShowData.MonthRevenueModel.YearRevenueAmount ?
|
||||||
? $util.getMoney(
|
$util.getMoney(topShowData.MonthRevenueModel.YearRevenueAmount / 100000000) : ""
|
||||||
topShowData.MonthRevenueModel.YearRevenueAmount /
|
|
||||||
100000000
|
|
||||||
)
|
|
||||||
: ""
|
|
||||||
}}</span>
|
}}</span>
|
||||||
<span class="revenueAdd" v-if="selectIndex === index && hasCurrentMonthData" :style="{
|
<span class="revenueAdd" v-if="selectIndex === index && hasCurrentMonthData" :style="{
|
||||||
color:
|
color:
|
||||||
@ -133,22 +117,14 @@
|
|||||||
? '#0E9976'
|
? '#0E9976'
|
||||||
: '',
|
: '',
|
||||||
}">
|
}">
|
||||||
<span class="revenueAddNotice">{{
|
<span class="revenueAddNotice">{{ topShowData && topShowData.MonthRevenueModel
|
||||||
|
&& topShowData.MonthRevenueModel.YearRevenueAddNumber > 0 ? "增长" :
|
||||||
topShowData && topShowData.MonthRevenueModel &&
|
topShowData && topShowData.MonthRevenueModel &&
|
||||||
topShowData.MonthRevenueModel.YearRevenueAddNumber > 0
|
topShowData.MonthRevenueModel.YearRevenueAddNumber < 0 ? "下降" : "" }}</span>
|
||||||
? "增长"
|
{{ topShowData && topShowData.MonthRevenueModel &&
|
||||||
: topShowData && topShowData.MonthRevenueModel &&
|
topShowData.MonthRevenueModel.YearRevenueAddNumber ?
|
||||||
topShowData.MonthRevenueModel.YearRevenueAddNumber < 0 ? "下降" : "" }}</span>
|
$util.getMoney(topShowData && topShowData.MonthRevenueModel &&
|
||||||
{{
|
topShowData.MonthRevenueModel.YearRevenueAddNumber / 100000000) : "" }}
|
||||||
topShowData && topShowData.MonthRevenueModel &&
|
|
||||||
topShowData.MonthRevenueModel.YearRevenueAddNumber
|
|
||||||
? $util.getMoney(
|
|
||||||
topShowData && topShowData.MonthRevenueModel &&
|
|
||||||
topShowData.MonthRevenueModel.YearRevenueAddNumber /
|
|
||||||
100000000
|
|
||||||
)
|
|
||||||
: ""
|
|
||||||
}}
|
|
||||||
</span>
|
</span>
|
||||||
|
|
||||||
<span class="revenueAdd" v-if="selectIndex === index && hasCurrentMonthData"
|
<span class="revenueAdd" v-if="selectIndex === index && hasCurrentMonthData"
|
||||||
@ -159,121 +135,61 @@
|
|||||||
: topShowData && topShowData.MonthRevenueModel && topShowData.MonthRevenueModel.YearRevenueAdd < 0
|
: topShowData && topShowData.MonthRevenueModel && topShowData.MonthRevenueModel.YearRevenueAdd < 0
|
||||||
? '#0E9976'
|
? '#0E9976'
|
||||||
: '',
|
: '',
|
||||||
}"><span class="revenueAddNotice">{{
|
}"><span class="revenueAddNotice">{{ topShowData &&
|
||||||
topShowData && topShowData.MonthRevenueModel &&
|
topShowData.MonthRevenueModel
|
||||||
topShowData.MonthRevenueModel.YearRevenueAdd > 0
|
&& topShowData.MonthRevenueModel.YearRevenueAdd > 0 ? "增幅" : topShowData
|
||||||
? "增幅"
|
&& topShowData.MonthRevenueModel &&
|
||||||
: topShowData && topShowData.MonthRevenueModel &&
|
|
||||||
topShowData.MonthRevenueModel.YearRevenueAdd < 0 ? "降幅" : "" }}</span>
|
topShowData.MonthRevenueModel.YearRevenueAdd < 0 ? "降幅" : "" }}</span>
|
||||||
{{
|
{{ topShowData && topShowData.MonthRevenueModel &&
|
||||||
topShowData && topShowData.MonthRevenueModel &&
|
topShowData.MonthRevenueModel.YearRevenueAdd ?
|
||||||
topShowData.MonthRevenueModel.YearRevenueAdd
|
`${topShowData.MonthRevenueModel.YearRevenueAdd > 0 ? "+" :
|
||||||
? `${topShowData.MonthRevenueModel.YearRevenueAdd > 0
|
""}${topShowData.MonthRevenueModel.YearRevenueAdd}%` : "-" }}</span>
|
||||||
? "+"
|
|
||||||
: ""
|
|
||||||
}${topShowData.MonthRevenueModel.YearRevenueAdd}%`
|
|
||||||
: "-"
|
|
||||||
}}</span>
|
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
|
|
||||||
<!-- <view class="swiperItemContentYear">
|
|
||||||
年度累计
|
|
||||||
<span class="swiperItemContentUnit">/亿元</span>
|
|
||||||
</view>
|
|
||||||
<view class="swiperItemContentYearRevenueBox">
|
|
||||||
<view class="leftRevenueValue">126.32</view>
|
|
||||||
|
|
||||||
<view class="rightRevenueValue">
|
|
||||||
<text class="addValue" :style="{
|
|
||||||
color:
|
|
||||||
showTableData.add > 0
|
|
||||||
? '#E83944'
|
|
||||||
: showTableData.add < 0
|
|
||||||
? '#0E9976'
|
|
||||||
: '',
|
|
||||||
}">{{ showTableData.add ? showTableData.add : "-" }}%</text>
|
|
||||||
<text class="rightNav">同比</text>
|
|
||||||
|
|
||||||
</view>
|
|
||||||
</view> -->
|
|
||||||
|
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</swiper-item>
|
</swiper-item>
|
||||||
</swiper>
|
</swiper>
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
|
<!-- 实时数据统计 -->
|
||||||
|
<view class="thingBox">
|
||||||
<!-- 即时营收 -->
|
<!-- 实时营收 -->
|
||||||
<view class="instantRevenue" style="margin-top: 24rpx;">
|
<view class="revenue-banner" @click="handlePage">
|
||||||
<view class="revenue" @click="handlePage" style="padding-bottom: 0;">
|
<view class="revenue-header">
|
||||||
<view class="revenueTop">
|
<view class="revenue-title">
|
||||||
<view class="revenyeTopLeft">
|
<text>💰 今日实时营收</text>
|
||||||
<image class="monthIcon"
|
|
||||||
src="https://eshangtech.com/ShopICO/ahyd-BID/newIndex3/monthIcon.svg" />
|
|
||||||
<text class="dateText">{{
|
|
||||||
$util.handleGetMonthDay(nowDay)
|
|
||||||
}}</text>
|
|
||||||
<text class="day">/{{ howDay }}</text>
|
|
||||||
</view>
|
|
||||||
<view class="revenyeTopRight">
|
|
||||||
<image class="right" src="https://eshangtech.com/ShopICO/ahyd-BID/newIndex3/goMore.svg" />
|
|
||||||
</view>
|
</view>
|
||||||
|
<image class="right" src="https://eshangtech.com/ShopICO/ahyd-BID/newIndex3/goMore.svg" />
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
<view class="revenueMoney">
|
<view
|
||||||
<!-- <NumberScroll v-if="currentMoney" :number="currentMoney" /> -->
|
style="width: 100%;display: flex;align-items: center;justify-content: space-between;margin-top: 8rpx;">
|
||||||
<text class="moneyText">{{ currentMoney }}</text>
|
<view class="revenue-content">
|
||||||
<text class="moneyLabel">实时对客销售/元</text>
|
<view class="revenue-amount">{{ currentMoney }}</view>
|
||||||
|
<view class="revenue-label">元</view>
|
||||||
|
</view>
|
||||||
|
<view class="revenue-date">{{ $util.handleGetMonthDay(nowDay) }}/{{ howDay }}</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
<!-- <view class="revenue revenueOther">
|
<!-- 其他实时数据 -->
|
||||||
<view class="otherRealDataBox">
|
<view class="data-grid" v-if="otherRealData && otherRealData.length > 0">
|
||||||
<view class="revenueMoneyItem" v-for="(subItem, subIndex) in otherRealData"
|
<view class="data-item" v-for="(subItem, subIndex) in otherRealData" :key="subIndex">
|
||||||
:style="{ marginTop: subIndex >= 2 ? '24rpx' : '' }">
|
<view class="data-icon">
|
||||||
<view class="revenueMoneyItemLeft">
|
<image class="icon" :src="subItem.icon" />
|
||||||
<image class="leftIcon" :src="subItem.icon" />
|
|
||||||
</view>
|
|
||||||
|
|
||||||
<view class="revenueMoneyItemRight">
|
|
||||||
<view class="moneyLabel">{{ subItem.label || "" }}</view>
|
|
||||||
<view class="moneyText">{{ subItem.value || "" }}<span class="moneyUnit">{{ subItem.unit
|
|
||||||
|| "" }}</span>
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
</view>
|
</view>
|
||||||
</view>
|
<view class="data-info">
|
||||||
</view> -->
|
<view class="data-label">{{ subItem.label || "" }}</view>
|
||||||
</view>
|
<view class="data-value">
|
||||||
|
<span class="value">{{ subItem.value || "" }}</span>
|
||||||
<!-- 实时水电、加油、尿素、充电 -->
|
<span class="unit">/{{ subItem.unit || "" }}</span>
|
||||||
<view class="instantRevenue" style="margin-top: 24rpx;" v-if="otherRealData && otherRealData.length > 0">
|
|
||||||
<view class="revenue revenueOther">
|
|
||||||
<view class="otherRealDataBox">
|
|
||||||
<view class="revenueMoneyItem" v-for="(subItem, subIndex) in otherRealData"
|
|
||||||
:style="{ marginTop: subIndex >= 2 ? '24rpx' : '' }">
|
|
||||||
<view class="revenueMoneyItemLeft">
|
|
||||||
<image class="leftIcon" :src="subItem.icon" />
|
|
||||||
</view>
|
|
||||||
|
|
||||||
<view class="revenueMoneyItemRight">
|
|
||||||
<view class="moneyLabel">{{ subItem.label || "" }}</view>
|
|
||||||
<view class="moneyText">
|
|
||||||
<span class="money">{{ subItem.value || "" }}</span>
|
|
||||||
<span class="moneyUnit">/{{ subItem.unit
|
|
||||||
|| "" }}</span>
|
|
||||||
</view>
|
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
|
|
||||||
<!-- 底部的跳转 -->
|
<!-- 底部的跳转 -->
|
||||||
<view class="funBox">
|
<view class="funBox">
|
||||||
|
|
||||||
@ -288,35 +204,21 @@
|
|||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
|
|
||||||
<view class="funItem" @click="handleGoAttendanceStatus">
|
<view class="funItem" @click="handleGoAttendanceStatus">
|
||||||
<view class="funItemContent">
|
<view class="funItemContent">
|
||||||
<view class="funIconBox">
|
<view class="funIconBox">
|
||||||
<image class="funIcon"
|
<image class="funIcon"
|
||||||
src="https://eshangtech.com/ShopICO/ahyd-BID/warning/operateWarning.svg" />
|
src="https://eshangtech.com/ShopICO/ahyd-BID/warning/operateWarning.svg" />
|
||||||
</view>
|
</view>
|
||||||
<text class="funText">出勤情况</text>
|
<text class="funText">人员管理</text>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
|
|
||||||
<!-- <view class="funItem" @click="goToRobot">
|
|
||||||
<view class="funItemContent">
|
|
||||||
<view class="funIconBox">
|
|
||||||
<image class="funIcon" src="https://eshangtech.com/ShopICO/ahyd-BID/newIndex3/statistics.svg" />
|
|
||||||
</view>
|
|
||||||
<text class="funText">数智助手</text>
|
|
||||||
</view>
|
|
||||||
</view> -->
|
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
|
|
||||||
<Tabbar ref="tabbar" :page="page"></Tabbar>
|
<Tabbar ref="tabbar" :page="page"></Tabbar>
|
||||||
</view>
|
</view>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import request from "@/util/index.js";
|
import request from "@/util/index.js";
|
||||||
import RateCharts from "./components/rateCharts.vue";
|
import RateCharts from "./components/rateCharts.vue";
|
||||||
@ -464,7 +366,6 @@ export default {
|
|||||||
console.log('this.singlethis.singlethis.single', this.single);
|
console.log('this.singlethis.singlethis.single', this.single);
|
||||||
uni.setStorageSync("lastDay", this.lastDay);
|
uni.setStorageSync("lastDay", this.lastDay);
|
||||||
|
|
||||||
|
|
||||||
console.log('useruseruseruser', this.user);
|
console.log('useruseruseruser', this.user);
|
||||||
|
|
||||||
// 小程序进来存起来的用户信息
|
// 小程序进来存起来的用户信息
|
||||||
@ -475,7 +376,6 @@ export default {
|
|||||||
|
|
||||||
console.log('userInfouserInfo', userInfo);
|
console.log('userInfouserInfo', userInfo);
|
||||||
|
|
||||||
|
|
||||||
if (userInfo && userInfo.WeChat_UserId && userInfo.AuthorityInfo["89a1f248-2113-4d57-84b1-c2e6edb9e8ee"] === 1) {
|
if (userInfo && userInfo.WeChat_UserId && userInfo.AuthorityInfo["89a1f248-2113-4d57-84b1-c2e6edb9e8ee"] === 1) {
|
||||||
_this.isReturn = false;
|
_this.isReturn = false;
|
||||||
} else if (userInfo && userInfo.WeChat_UserId && userInfo.AuthorityInfo["89a1f248-2113-4d57-84b1-c2e6edb9e8ee"] !== 1) {
|
} else if (userInfo && userInfo.WeChat_UserId && userInfo.AuthorityInfo["89a1f248-2113-4d57-84b1-c2e6edb9e8ee"] !== 1) {
|
||||||
@ -732,6 +632,10 @@ export default {
|
|||||||
this.swiperTransition = false;
|
this.swiperTransition = false;
|
||||||
}, 100);
|
}, 100);
|
||||||
},
|
},
|
||||||
|
formatThousand(num) {
|
||||||
|
if (num === null || num === undefined) return '0';
|
||||||
|
return num.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
|
||||||
|
},
|
||||||
// 实时营收
|
// 实时营收
|
||||||
async handleRealRevenue() {
|
async handleRealRevenue() {
|
||||||
try {
|
try {
|
||||||
@ -741,7 +645,8 @@ export default {
|
|||||||
};
|
};
|
||||||
const res = await request.$webGet("CommercialApi/Revenue/GetCurRevenue", req);
|
const res = await request.$webGet("CommercialApi/Revenue/GetCurRevenue", req);
|
||||||
// this.currentMoney = res.Result_Data.CurRevenueAmount.toFixed(2);
|
// this.currentMoney = res.Result_Data.CurRevenueAmount.toFixed(2);
|
||||||
this.currentMoney = res.Result_Data.CurRevenueAmount.toLocaleString('zh-CN');
|
// this.currentMoney = res.Result_Data.CurRevenueAmount.toLocaleString('zh-CN');
|
||||||
|
this.currentMoney = this.formatThousand(res.Result_Data.CurRevenueAmount)
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
console.error('获取实时营收数据失败:', error);
|
console.error('获取实时营收数据失败:', error);
|
||||||
this.currentMoney = '暂无数据';
|
this.currentMoney = '暂无数据';
|
||||||
@ -800,7 +705,7 @@ export default {
|
|||||||
resObj.BusinessTypeList.forEach((item) => {
|
resObj.BusinessTypeList.forEach((item) => {
|
||||||
// 同比
|
// 同比
|
||||||
if (item.data) {
|
if (item.data) {
|
||||||
let number = ((item.value - item.data) / item.data) * 100;
|
let number = Number(item.data) ? ((item.value - item.data) / item.data) * 100 : 0;
|
||||||
if (number > 0) {
|
if (number > 0) {
|
||||||
item.add = "+" + number.toFixed(2);
|
item.add = "+" + number.toFixed(2);
|
||||||
} else if (number < 0) {
|
} else if (number < 0) {
|
||||||
@ -811,7 +716,7 @@ export default {
|
|||||||
}
|
}
|
||||||
// 环比
|
// 环比
|
||||||
if (item.key) {
|
if (item.key) {
|
||||||
let number = ((item.value - item.key) / item.key) * 100;
|
let number = Number(item.key) ? ((item.value - item.key) / item.key) * 100 : 0;
|
||||||
if (number > 0) {
|
if (number > 0) {
|
||||||
item.addQOQ = "+" + number.toFixed(2) + "%";
|
item.addQOQ = "+" + number.toFixed(2) + "%";
|
||||||
} else if (number < 0) {
|
} else if (number < 0) {
|
||||||
@ -919,11 +824,22 @@ export default {
|
|||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
<style scoped lang="less">
|
||||||
|
@bg: #f8f9fa;
|
||||||
|
@muted: #666;
|
||||||
|
@card: #fff;
|
||||||
|
@shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
|
||||||
|
@primary: #27B25F;
|
||||||
|
@primary2: #4CCC7F;
|
||||||
|
@success: #2ed573;
|
||||||
|
@warning: #ff9f43;
|
||||||
|
@danger: #ff4757;
|
||||||
|
@info: #3742fa;
|
||||||
|
|
||||||
<style scoped lang="scss">
|
|
||||||
.main {
|
.main {
|
||||||
width: 100vw;
|
width: 100vw;
|
||||||
height: 100vh;
|
min-height: 100vh;
|
||||||
|
box-sizing: border-box;
|
||||||
background-image: url("https://eshangtech.com/minTestImg/pageBg.png");
|
background-image: url("https://eshangtech.com/minTestImg/pageBg.png");
|
||||||
background-size: 100% 100%;
|
background-size: 100% 100%;
|
||||||
background-repeat: no-repeat;
|
background-repeat: no-repeat;
|
||||||
@ -955,24 +871,24 @@ export default {
|
|||||||
|
|
||||||
.topRight {
|
.topRight {
|
||||||
width: 310rpx;
|
width: 310rpx;
|
||||||
height: 72rpx;
|
height: 56rpx;
|
||||||
background: #f6f8fa;
|
background: #f6f8fa;
|
||||||
border-radius: 36rpx;
|
border-radius: 36rpx;
|
||||||
margin-left: 16rpx;
|
margin-left: 16rpx;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
padding: 16rpx 20rpx;
|
padding: 8rpx 16rpx;
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
|
|
||||||
.searchIcon {
|
.searchIcon {
|
||||||
width: 32rpx;
|
width: 28rpx;
|
||||||
height: 32rpx;
|
height: 28rpx;
|
||||||
}
|
}
|
||||||
|
|
||||||
.searchText {
|
.searchText {
|
||||||
font-family: 'PingFangSC';
|
font-family: 'PingFangSC';
|
||||||
font-weight: 400;
|
font-weight: 400;
|
||||||
font-size: 28rpx;
|
font-size: 24rpx;
|
||||||
color: #9fa1aa;
|
color: #9fa1aa;
|
||||||
line-height: 40rpx;
|
line-height: 40rpx;
|
||||||
text-align: left;
|
text-align: left;
|
||||||
@ -985,8 +901,8 @@ export default {
|
|||||||
|
|
||||||
.monthListBox {
|
.monthListBox {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
// height: 600rpx;
|
|
||||||
height: 460rpx;
|
height: 460rpx;
|
||||||
|
margin-top: 8rpx;
|
||||||
|
|
||||||
.swiperBox {
|
.swiperBox {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
@ -998,7 +914,7 @@ export default {
|
|||||||
|
|
||||||
.swiperItemContent {
|
.swiperItemContent {
|
||||||
height: 100%;
|
height: 100%;
|
||||||
padding: 0 10rpx; // 中间间距一半（两边相加=20rpx）
|
padding: 0 10rpx;
|
||||||
box-shadow: 0 8rpx 20rpx rgba(0, 0, 0, .06);
|
box-shadow: 0 8rpx 20rpx rgba(0, 0, 0, .06);
|
||||||
|
|
||||||
.swiperItemContentBox {
|
.swiperItemContentBox {
|
||||||
@ -1071,7 +987,6 @@ export default {
|
|||||||
margin-left: 4rpx;
|
margin-left: 4rpx;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.monthRevenueBox {
|
.monthRevenueBox {
|
||||||
@ -1124,7 +1039,6 @@ export default {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.newRightBox {
|
.newRightBox {
|
||||||
// height: 100%;
|
|
||||||
flex: 1;
|
flex: 1;
|
||||||
|
|
||||||
.newRightItem {
|
.newRightItem {
|
||||||
@ -1188,7 +1102,6 @@ export default {
|
|||||||
|
|
||||||
.yearAccountItem {
|
.yearAccountItem {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
//background: #F9FAFC;
|
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
margin-top: 48rpx;
|
margin-top: 48rpx;
|
||||||
|
|
||||||
@ -1198,20 +1111,6 @@ export default {
|
|||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
margin-bottom: 8rpx;
|
margin-bottom: 8rpx;
|
||||||
|
|
||||||
.itemType {
|
|
||||||
font-family: PingFangSC, PingFang SC;
|
|
||||||
font-weight: 400;
|
|
||||||
font-size: 24rpx;
|
|
||||||
color: #ffffff;
|
|
||||||
line-height: 24rpx;
|
|
||||||
text-align: left;
|
|
||||||
font-style: normal;
|
|
||||||
padding: 4rpx 8rpx;
|
|
||||||
background: #f2792e;
|
|
||||||
border-radius: 4rpx;
|
|
||||||
margin-right: 8rpx;
|
|
||||||
}
|
|
||||||
|
|
||||||
.itemName {
|
.itemName {
|
||||||
font-family: PingFangSC, PingFang SC;
|
font-family: PingFangSC, PingFang SC;
|
||||||
font-weight: 400;
|
font-weight: 400;
|
||||||
@ -1267,90 +1166,194 @@ export default {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.swiperItemContentYear {
|
|
||||||
margin-top: 24rpx;
|
|
||||||
font-family: 'PingFangSC';
|
|
||||||
font-weight: 400;
|
|
||||||
font-size: 28rpx;
|
|
||||||
color: #160002;
|
|
||||||
line-height: 40rpx;
|
|
||||||
text-align: left;
|
|
||||||
font-style: normal;
|
|
||||||
|
|
||||||
.swiperItemContentUnit {
|
|
||||||
font-family: 'PingFangSC';
|
|
||||||
font-weight: 400;
|
|
||||||
font-size: 24rpx;
|
|
||||||
color: #A69E9F;
|
|
||||||
line-height: 40rpx;
|
|
||||||
text-align: left;
|
|
||||||
font-style: normal;
|
|
||||||
margin-left: 4rpx;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.swiperItemContentYearRevenueBox {
|
|
||||||
width: 100%;
|
|
||||||
margin-top: 12rpx;
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: space-between;
|
|
||||||
|
|
||||||
.leftRevenueValue {
|
|
||||||
font-family: 'DINAlternate';
|
|
||||||
font-weight: bold;
|
|
||||||
font-size: 40rpx;
|
|
||||||
color: #160002;
|
|
||||||
line-height: 40rpx;
|
|
||||||
text-align: left;
|
|
||||||
font-style: normal;
|
|
||||||
}
|
|
||||||
|
|
||||||
.rightRevenueValue {
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
|
|
||||||
.addValue {
|
|
||||||
font-family: 'DINAlternate';
|
|
||||||
font-weight: bold;
|
|
||||||
font-size: 28rpx;
|
|
||||||
line-height: 40rpx;
|
|
||||||
text-align: left;
|
|
||||||
font-style: normal;
|
|
||||||
}
|
|
||||||
|
|
||||||
.rightNav {
|
|
||||||
font-family: PingFangSC, PingFang SC;
|
|
||||||
font-weight: 400;
|
|
||||||
font-size: 28rpx;
|
|
||||||
color: #A69E9F;
|
|
||||||
line-height: 40rpx;
|
|
||||||
text-align: left;
|
|
||||||
font-style: normal;
|
|
||||||
margin-left: 4rpx;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.swiperItemContent.is-first {
|
.swiperItemContent.is-first {
|
||||||
padding-left: 20rpx; // 左边额外+10rpx，让边距=40rpx
|
padding-left: 20rpx;
|
||||||
}
|
|
||||||
|
|
||||||
.swiperItemContent.is-last {
|
|
||||||
// padding-right: 20rpx; // 右边额外+10rpx，让边距=40rpx
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.thingBox {
|
||||||
|
width: 100%;
|
||||||
|
box-sizing: border-box;
|
||||||
|
padding: 0 32rpx;
|
||||||
|
margin-top: 24rpx;
|
||||||
|
|
||||||
|
.revenue-banner {
|
||||||
|
background: #ffffff;
|
||||||
|
color: #160002;
|
||||||
|
padding: 24rpx 24rpx 8rpx;
|
||||||
|
border-radius: 16rpx;
|
||||||
|
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
|
||||||
|
margin-bottom: 24rpx;
|
||||||
|
border: 2rpx solid #f0f0f0;
|
||||||
|
|
||||||
|
.revenue-header {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
|
||||||
|
.revenue-title {
|
||||||
|
font-weight: 400;
|
||||||
|
font-size: 28rpx;
|
||||||
|
color: #160002;
|
||||||
|
}
|
||||||
|
|
||||||
|
.right {
|
||||||
|
width: 32rpx;
|
||||||
|
height: 32rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.revenue-content {
|
||||||
|
display: flex;
|
||||||
|
align-items: baseline;
|
||||||
|
|
||||||
|
.revenue-amount {
|
||||||
|
font-family: DINAlternate-Bold, DINAlternate;
|
||||||
|
font-size: 36rpx;
|
||||||
|
font-weight: 600;
|
||||||
|
margin-right: 12rpx;
|
||||||
|
color: #27B25F;
|
||||||
|
}
|
||||||
|
|
||||||
|
.revenue-label {
|
||||||
|
font-size: 24rpx;
|
||||||
|
color: #666;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.revenue-date {
|
||||||
|
font-size: 24rpx;
|
||||||
|
color: #999;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.data-grid {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(2, 1fr);
|
||||||
|
gap: 16rpx;
|
||||||
|
margin-bottom: 24rpx;
|
||||||
|
|
||||||
|
.data-item {
|
||||||
|
background: #fff;
|
||||||
|
padding: 24rpx;
|
||||||
|
border-radius: 16rpx;
|
||||||
|
box-shadow: @shadow;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
.data-icon {
|
||||||
|
width: 64rpx;
|
||||||
|
height: 64rpx;
|
||||||
|
background: linear-gradient(135deg, #DCE6FF, #EEF3FF);
|
||||||
|
border-radius: 50%;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
margin-right: 16rpx;
|
||||||
|
|
||||||
|
.icon {
|
||||||
|
width: 32rpx;
|
||||||
|
height: 32rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.data-info {
|
||||||
|
flex: 1;
|
||||||
|
|
||||||
|
.data-label {
|
||||||
|
font-size: 24rpx;
|
||||||
|
color: @muted;
|
||||||
|
margin-bottom: 8rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.data-value {
|
||||||
|
.value {
|
||||||
|
font-size: 28rpx;
|
||||||
|
font-weight: 600;
|
||||||
|
color: #160002;
|
||||||
|
}
|
||||||
|
|
||||||
|
.unit {
|
||||||
|
font-size: 20rpx;
|
||||||
|
color: #A69E9F;
|
||||||
|
margin-left: 4rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.thingBox {
|
||||||
|
width: 100%;
|
||||||
|
box-sizing: border-box;
|
||||||
|
padding: 0 32rpx;
|
||||||
|
margin-top: 24rpx;
|
||||||
|
|
||||||
|
.data-grid {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(2, 1fr);
|
||||||
|
gap: 16rpx;
|
||||||
|
|
||||||
|
.data-item {
|
||||||
|
background: #fff;
|
||||||
|
padding: 24rpx;
|
||||||
|
border-radius: 16rpx;
|
||||||
|
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
.data-icon {
|
||||||
|
width: 64rpx;
|
||||||
|
height: 64rpx;
|
||||||
|
background: linear-gradient(135deg, #DCE6FF, #EEF3FF);
|
||||||
|
border-radius: 50%;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
margin-right: 16rpx;
|
||||||
|
|
||||||
|
.icon {
|
||||||
|
width: 32rpx;
|
||||||
|
height: 32rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.data-info {
|
||||||
|
flex: 1;
|
||||||
|
|
||||||
|
.data-label {
|
||||||
|
font-size: 24rpx;
|
||||||
|
color: #666;
|
||||||
|
margin-bottom: 8rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.data-value {
|
||||||
|
.value {
|
||||||
|
font-size: 28rpx;
|
||||||
|
font-weight: 600;
|
||||||
|
color: #160002;
|
||||||
|
}
|
||||||
|
|
||||||
|
.unit {
|
||||||
|
font-size: 20rpx;
|
||||||
|
color: #A69E9F;
|
||||||
|
margin-left: 4rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 即时营收
|
||||||
.instantRevenue {
|
.instantRevenue {
|
||||||
width: calc(100% - 80rpx);
|
width: calc(100% - 80rpx);
|
||||||
// height: 104px;
|
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
padding: 2rpx;
|
padding: 2rpx;
|
||||||
background: #fff;
|
background: #fff;
|
||||||
@ -1420,7 +1423,6 @@ export default {
|
|||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
// margin-top: 24rpx;
|
|
||||||
margin-top: 4rpx;
|
margin-top: 4rpx;
|
||||||
|
|
||||||
.moneyText {
|
.moneyText {
|
||||||
@ -1461,7 +1463,6 @@ export default {
|
|||||||
width: 88rpx;
|
width: 88rpx;
|
||||||
height: 88rpx;
|
height: 88rpx;
|
||||||
border-radius: 50%;
|
border-radius: 50%;
|
||||||
// border: 1px solid #9FA6A3;
|
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
@ -1483,7 +1484,6 @@ export default {
|
|||||||
font-weight: 400;
|
font-weight: 400;
|
||||||
color: #000;
|
color: #000;
|
||||||
line-height: 30rpx;
|
line-height: 30rpx;
|
||||||
// margin-bottom: 16rpx;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.moneyText {
|
.moneyText {
|
||||||
@ -1516,8 +1516,6 @@ export default {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@ -1527,19 +1525,20 @@ export default {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
.funBox {
|
.funBox {
|
||||||
width: calc(100% - 64rpx);
|
width: calc(100% - 64rpx);
|
||||||
margin-left: 32rpx;
|
margin-left: 32rpx;
|
||||||
|
margin-bottom: calc(100rpx + env(safe-area-inset-bottom));
|
||||||
background: #ffffff;
|
background: #ffffff;
|
||||||
border-radius: 16rpx;
|
border-radius: 16rpx;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
padding: 32rpx 24rpx;
|
padding: 32rpx 24rpx;
|
||||||
display: flex;
|
display: grid;
|
||||||
flex-flow: wrap;
|
grid-template-columns: repeat(4, 1fr);
|
||||||
|
gap: 24rpx;
|
||||||
|
box-shadow: @shadow;
|
||||||
|
|
||||||
.funItem {
|
.funItem {
|
||||||
width: 25%;
|
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
|
|
||||||
@ -1552,7 +1551,6 @@ export default {
|
|||||||
.funIconBox {
|
.funIconBox {
|
||||||
width: 88rpx;
|
width: 88rpx;
|
||||||
height: 88rpx;
|
height: 88rpx;
|
||||||
//border-radius: 50%;
|
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
margin-bottom: 16rpx;
|
margin-bottom: 16rpx;
|
||||||
|
|
||||||
|
|||||||
@ -202,22 +202,35 @@ export default {
|
|||||||
},
|
},
|
||||||
//跳转到腾讯地图
|
//跳转到腾讯地图
|
||||||
handleGomap(item) {
|
handleGomap(item) {
|
||||||
let seat = uni.getStorageSync('seatInfo')
|
let obj = item;
|
||||||
let key = 'STWBZ-DKCR4-J6UUF-FRD5I-3EBN2-GDBOT'
|
uni.openLocation({
|
||||||
let referer = 'goMap'
|
latitude: obj.latitude ? obj.latitude * 1 : obj.SERVERPART_Y * 1,
|
||||||
let startPoint = {
|
longitude: obj.longitude ? obj.longitude * 1 : obj.SERVERPART_X * 1,
|
||||||
name: '我的位置',
|
scale: 16, // 缩放比例
|
||||||
latitude: seat.latitude,
|
name: obj.SERVERPART_NAME,
|
||||||
longitude: seat.longitude
|
// address: "", // 这个可能会影响地图的定位，所以可以选择不填
|
||||||
}
|
success(data) {
|
||||||
let endPoint = {
|
},
|
||||||
'name': item.SERVERPART_NAME,
|
fail(err) {
|
||||||
latitude: item.SERVERPART_Y,
|
},
|
||||||
longitude: item.SERVERPART_X
|
|
||||||
}
|
|
||||||
wx.navigateTo({
|
|
||||||
url: `plugin://routePlan/index?key=${key}&referer=${referer}&endPoint=${JSON.stringify(endPoint)}&startPoint=${JSON.stringify(startPoint)}`
|
|
||||||
});
|
});
|
||||||
|
|
||||||
|
// let seat = uni.getStorageSync('seatInfo')
|
||||||
|
// let key = 'STWBZ-DKCR4-J6UUF-FRD5I-3EBN2-GDBOT'
|
||||||
|
// let referer = 'goMap'
|
||||||
|
// let startPoint = {
|
||||||
|
// name: '我的位置',
|
||||||
|
// latitude: seat.latitude,
|
||||||
|
// longitude: seat.longitude
|
||||||
|
// }
|
||||||
|
// let endPoint = {
|
||||||
|
// 'name': item.SERVERPART_NAME,
|
||||||
|
// latitude: item.SERVERPART_Y,
|
||||||
|
// longitude: item.SERVERPART_X
|
||||||
|
// }
|
||||||
|
// wx.navigateTo({
|
||||||
|
// url: `plugin://routePlan/index?key=${key}&referer=${referer}&endPoint=${JSON.stringify(endPoint)}&startPoint=${JSON.stringify(startPoint)}`
|
||||||
|
// });
|
||||||
},
|
},
|
||||||
//返回上一级页面
|
//返回上一级页面
|
||||||
handleBack() {
|
handleBack() {
|
||||||
|
|||||||
@ -1,282 +1,458 @@
|
|||||||
<template>
|
<template>
|
||||||
<view class="page-card" v-if="!isLoading">
|
<view class="main" v-if="!isLoading">
|
||||||
<!-- 日期筛选 -->
|
<!-- 时间筛选卡片 -->
|
||||||
<div class="uni-flex ai-center screen-box">
|
<view class="filterCard">
|
||||||
<picker mode="date" @change="bindDateChange($event,0)" :value="pageData.searchTime[0]" :end="pageData.endDate" start="2018-12-01" class="screen-unit">
|
<view class="filterHeader">
|
||||||
<text>{{pageData.searchTime[0]}}</text>
|
<view class="filterTitle">时间筛选</view>
|
||||||
<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">
|
|
||||||
<text>{{pageData.searchTime[1]}}</text>
|
|
||||||
<text class="uni-icon uni-icon-arrowdown"></text>
|
|
||||||
</picker>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- @tap="toTrend"-->
|
|
||||||
<view class="head-card" v-show="pageMsg.Serverpart_Name">
|
|
||||||
<view class="uni-flex jc-between ai-center text-strong">
|
|
||||||
<view class=""> {{pageMsg.Serverpart_Name}} </view>
|
|
||||||
<view class=""> ¥{{$util.fmoney(pageMsg.Serverpart_Revenue,2)}} </view>
|
|
||||||
</view>
|
</view>
|
||||||
<view class="uni-flex jc-between ai-center">
|
|
||||||
<text class="" v-if="pageMsg.Serverpart_S"> {{pageMsg.Serverpart_S}} ¥{{$util.fmoney(pageMsg.Serverpart_RevenueS,2)}}</text>
|
<view class="dateSelector">
|
||||||
<text class="" v-if="pageMsg.Serverpart_N"> {{pageMsg.Serverpart_N}} ¥{{$util.fmoney(pageMsg.Serverpart_RevenueN,2)}}</text>
|
<view class="dateRange">
|
||||||
|
<picker mode="date" @change="bindDateChange($event, 0)" :value="pageData.searchTime[0]"
|
||||||
|
:end="pageData.endDate" start="2018-12-01" class="datePicker">
|
||||||
|
<view class="dateInput">
|
||||||
|
<text>{{ pageData.searchTime[0] }}</text>
|
||||||
|
<text class="uni-icon uni-icon-arrowdown"></text>
|
||||||
|
</view>
|
||||||
|
</picker>
|
||||||
|
|
||||||
|
<view class="dateSeparator">至</view>
|
||||||
|
|
||||||
|
<picker mode="date" @change="bindDateChange($event, 1)" :value="pageData.searchTime[1]"
|
||||||
|
:end="pageData.endDate" start="2018-12-01" class="datePicker">
|
||||||
|
<view class="dateInput">
|
||||||
|
<text>{{ pageData.searchTime[1] }}</text>
|
||||||
|
<text class="uni-icon uni-icon-arrowdown"></text>
|
||||||
|
</view>
|
||||||
|
</picker>
|
||||||
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
<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="serviceCard" v-show="pageMsg.Serverpart_Name">
|
||||||
<view class="cell-body uni-flex ai-center" v-for="(item,i) in pageMsg.ShopList" :key="i">
|
<view class="serviceHeader">
|
||||||
<image :src="item.BusinessType_Logo || '/static/images/revenue/operating-shop.png'" mode="aspectFit"></image>
|
<view class="serviceName">{{ pageMsg.Serverpart_Name }}</view>
|
||||||
<view class="">
|
<view class="serviceRevenue">¥{{ $util.fmoney(pageMsg.Serverpart_Revenue, 2) }}</view>
|
||||||
<view class="uni-flex ai-center jc-between">
|
</view>
|
||||||
<text>{{item.BusinessType_Name}}</text>
|
|
||||||
<text class="shop-total">＋ ¥{{$util.fmoney(item.BusinessType_Revenue,2)}}</text>
|
<view class="serviceDetails" v-if="pageMsg.Serverpart_S || pageMsg.Serverpart_N">
|
||||||
</view>
|
<view class="detailItem" v-if="pageMsg.Serverpart_S">
|
||||||
<view class="uni-flex ai-center jc-between">
|
<view class="detailLabel">{{ pageMsg.Serverpart_S }}</view>
|
||||||
<text style="display: inline-block;width: 20%" class="type-text" :class="{'scan':item.Upload_Type==1,'port':item.Upload_Type==2}">
|
<view class="detailValue">¥{{ $util.fmoney(pageMsg.Serverpart_RevenueS, 2) }}</view>
|
||||||
<template v-if="item.Upload_Type==1">
|
</view>
|
||||||
扫码上传
|
<view class="detailItem" v-if="pageMsg.Serverpart_N">
|
||||||
</template>
|
<view class="detailLabel">{{ pageMsg.Serverpart_N }}</view>
|
||||||
<template v-else-if="item.Upload_Type==2" >
|
<view class="detailValue">¥{{ $util.fmoney(pageMsg.Serverpart_RevenueN, 2) }}</view>
|
||||||
接口传输
|
</view>
|
||||||
</template>
|
</view>
|
||||||
<template v-else>
|
</view>
|
||||||
自动上传
|
<!-- 商铺列表 -->
|
||||||
</template>
|
<view class="shopList" v-if="pageMsg.ShopList && pageMsg.ShopList.length > 0">
|
||||||
<!-- <text class="type-text scan" v-if="item.Upload_Type==1" >扫码上传</text>
|
<view class="shopItem" v-for="(item, i) in pageMsg.ShopList" :key="i">
|
||||||
<text class="type-text port" >接口传输</text>
|
<view class="shopHeader">
|
||||||
<text v-else>自动上传</text> -->
|
<view class="shopIcon">
|
||||||
</text>
|
<image :src="item.BusinessType_Logo || '/static/images/revenue/operating-shop.png'"
|
||||||
<view class="uni-flex ai-center" style="display: inline-block;width: 80%">
|
mode="aspectFill" />
|
||||||
<div style="display: inline-block;width: 48%;text-align: left;margin-right: 4%" class="text-coast">
|
</view>
|
||||||
<text style="display: inline-block;width: 40px;text-align: left">
|
|
||||||
{{item.Serverpart_RevenueS===0 || item.Serverpart_RevenueS? `${item.Serverpart_S}： `:''}}
|
<view class="shopInfo">
|
||||||
</text>
|
<view class="shopTop">
|
||||||
<text style="display: inline-block;width: calc(100% - 50px);margin-left: 10px">
|
<view class="shopName">{{ item.BusinessType_Name }}</view>
|
||||||
{{item.Serverpart_RevenueS===0 || item.Serverpart_RevenueS? `¥${$util.fmoney(item.Serverpart_RevenueS,2)}`:''}}
|
<view class="shopRevenue">+ ¥{{ $util.fmoney(item.BusinessType_Revenue, 2) }}</view>
|
||||||
</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 class="shopBottom">
|
||||||
|
<view class="uploadType" :class="{
|
||||||
|
'scan': item.Upload_Type == 1,
|
||||||
|
'port': item.Upload_Type == 2,
|
||||||
|
'auto': item.Upload_Type != 1 && item.Upload_Type != 2
|
||||||
|
}">
|
||||||
|
<view class="typeIcon"></view>
|
||||||
|
<text class="typeText">
|
||||||
|
<template v-if="item.Upload_Type == 1">扫码上传</template>
|
||||||
|
<template v-else-if="item.Upload_Type == 2">接口传输</template>
|
||||||
|
<template v-else>自动上传</template>
|
||||||
|
</text>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="revenueDetails">
|
||||||
|
<view class="revenueItem"
|
||||||
|
v-if="item.Serverpart_RevenueS || item.Serverpart_RevenueS === 0">
|
||||||
|
<text class="revenueLabel">{{ item.Serverpart_S }}:</text>
|
||||||
|
<text class="revenueValue">¥{{ $util.fmoney(item.Serverpart_RevenueS, 2) }}</text>
|
||||||
|
</view>
|
||||||
|
<view class="revenueItem"
|
||||||
|
v-if="item.Serverpart_RevenueN || item.Serverpart_RevenueN === 0">
|
||||||
|
<text class="revenueLabel">{{ item.Serverpart_N }}:</text>
|
||||||
|
<text class="revenueValue">¥{{ $util.fmoney(item.Serverpart_RevenueN, 2) }}</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
<!-- </view>-->
|
</view>
|
||||||
</view>
|
</view>
|
||||||
<view class="" v-if="isLoading && !pageOption.Serverpart_Name">
|
|
||||||
<noFound nodata="true" :text="noDataText"/>
|
<!-- 无数据状态 -->
|
||||||
|
<view v-if="isLoading && !pageOption.Serverpart_Name" class="noDataContainer">
|
||||||
|
<noFound nodata="true" :text="noDataText" />
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import request from '@/util/index.js'
|
import request from '@/util/index.js'
|
||||||
export default {
|
export default {
|
||||||
data() {
|
data() {
|
||||||
let now = new Date()
|
let now = new Date()
|
||||||
let nowTime = this.$util.cutDate(now, 'YYYY-MM-DD',-1)
|
let nowTime = this.$util.cutDate(now, 'YYYY-MM-DD', -1)
|
||||||
let sTime = this.$util.cutDate(now, 'YYYY-MM-DD', -1)
|
let sTime = this.$util.cutDate(now, 'YYYY-MM-DD', -1)
|
||||||
return {
|
return {
|
||||||
|
isLoading: true,
|
||||||
|
pageData: {
|
||||||
|
endDate: nowTime,
|
||||||
|
searchTime: [sTime, nowTime],
|
||||||
|
msg: {},
|
||||||
isLoading: true,
|
isLoading: true,
|
||||||
pageData: {
|
exsideShow: true,
|
||||||
endDate: nowTime,
|
insideShow: true,
|
||||||
searchTime: [sTime,nowTime],
|
},
|
||||||
msg: {},
|
pageMsg: {},
|
||||||
isLoading: true,
|
pageOption: {},
|
||||||
exsideShow: true,
|
noDataText: '抱歉，没有数据，请稍后重试'
|
||||||
insideShow: true,
|
}
|
||||||
},
|
},
|
||||||
pageMsg:{},
|
methods: {
|
||||||
pageOption: {},
|
bindDateChange(e, index) {
|
||||||
noDataText: '抱歉，没有数据，请稍后重试'
|
let nowDate = this.pageData.searchTime[index]
|
||||||
|
if (e.detail.value != nowDate) {
|
||||||
|
this.pageData.searchTime[index] = e.detail.value
|
||||||
|
this.$forceUpdate()
|
||||||
|
this.getDetail({ st: this.pageData.searchTime[0], et: this.pageData.searchTime[1], id: this.pageOption.id, pcode: this.pageOption.pcode })
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
methods: {
|
toTrend() {
|
||||||
bindDateChange(e,index){
|
this.$util.toNextRoute('navigateTo', '/pages/operatingStatements/operatingTrend?name=' + this.pageMsg.Serverpart_Name + '&time=' + this.pageOption.et + '&id=' + this.pageOption.id + '&ProvinceCode=' + this.pageOption.pcode)
|
||||||
let nowDate = this.pageData.searchTime[index]
|
|
||||||
if(e.detail.value != nowDate){
|
|
||||||
this.pageData.searchTime[index] = e.detail.value
|
|
||||||
this.$forceUpdate()
|
|
||||||
this.getDetail({st:this.pageData.searchTime[0],et:this.pageData.searchTime[1],id:this.pageOption.id,pcode:this.pageOption.pcode})
|
|
||||||
}
|
|
||||||
},
|
|
||||||
toTrend(){
|
|
||||||
this.$util.toNextRoute('navigateTo','/pages/operatingStatements/operatingTrend?name='+this.pageMsg.Serverpart_Name+'&time='+this.pageOption.et+'&id='+this.pageOption.id+'&ProvinceCode='+this.pageOption.pcode)
|
|
||||||
},
|
|
||||||
getDetail(obj){
|
|
||||||
let _this = this
|
|
||||||
uni.showLoading({
|
|
||||||
title:'正在加载...',
|
|
||||||
mask:true
|
|
||||||
})
|
|
||||||
// _this.$request.$webGet('WeChat/GetRevenueReportDetils',{
|
|
||||||
request.$webGet('CommercialApi/Revenue/GetRevenueReportDetil',{
|
|
||||||
startTime: obj.st,
|
|
||||||
endTime: obj.et,
|
|
||||||
serverpartId: obj.id,
|
|
||||||
provinceCode: obj.pcode,
|
|
||||||
BusinessTrade: obj.BusinessTrade || '',
|
|
||||||
SearchKeyName:_this.pageOption.searchKey,
|
|
||||||
SearchKeyValue:_this.pageOption.searchValue,
|
|
||||||
BusinessType:_this.pageOption.BusinessTypeValue>0?_this.pageOption.BusinessTypeValue:'',
|
|
||||||
SettlementMode:_this.pageOption.SettlementModeValue>0?_this.pageOption.SettlementModeValue:'',
|
|
||||||
}).then(res=>{
|
|
||||||
if(res.Result_Code==100) {
|
|
||||||
_this.pageMsg = res.Result_Data
|
|
||||||
|
|
||||||
}else if(res.Result_Code==200 || res.Result_Code==999){
|
|
||||||
_this.noDataText = '暂无数据'
|
|
||||||
} else{
|
|
||||||
_this.noDataText = res.Result_Desc
|
|
||||||
}
|
|
||||||
uni.hideLoading()
|
|
||||||
_this.isLoading = false
|
|
||||||
})
|
|
||||||
},
|
|
||||||
},
|
},
|
||||||
// 拿到传入的数据
|
getDetail(obj) {
|
||||||
onLoad(op) {
|
let _this = this
|
||||||
console.log('op',op)
|
uni.showLoading({
|
||||||
this.pageOption = op
|
title: '正在加载...',
|
||||||
if (this.pageOption.st){
|
mask: true
|
||||||
this.pageData.searchTime[0] = this.pageOption.st
|
})
|
||||||
}
|
// _this.$request.$webGet('WeChat/GetRevenueReportDetils',{
|
||||||
if (this.pageOption.et){
|
request.$webGet('CommercialApi/Revenue/GetRevenueReportDetil', {
|
||||||
this.pageData.searchTime[1] = this.pageOption.et
|
startTime: obj.st,
|
||||||
}
|
endTime: obj.et,
|
||||||
this.getDetail(op)
|
serverpartId: obj.id,
|
||||||
|
provinceCode: obj.pcode,
|
||||||
|
BusinessTrade: obj.BusinessTrade || '',
|
||||||
|
SearchKeyName: _this.pageOption.searchKey,
|
||||||
|
SearchKeyValue: _this.pageOption.searchValue,
|
||||||
|
BusinessType: _this.pageOption.BusinessTypeValue > 0 ? _this.pageOption.BusinessTypeValue : '',
|
||||||
|
SettlementMode: _this.pageOption.SettlementModeValue > 0 ? _this.pageOption.SettlementModeValue : '',
|
||||||
|
}).then(res => {
|
||||||
|
if (res.Result_Code == 100) {
|
||||||
|
_this.pageMsg = res.Result_Data
|
||||||
|
|
||||||
|
} else if (res.Result_Code == 200 || res.Result_Code == 999) {
|
||||||
|
_this.noDataText = '暂无数据'
|
||||||
|
} else {
|
||||||
|
_this.noDataText = res.Result_Desc
|
||||||
|
}
|
||||||
|
uni.hideLoading()
|
||||||
|
_this.isLoading = false
|
||||||
|
})
|
||||||
|
},
|
||||||
|
},
|
||||||
|
// 拿到传入的数据
|
||||||
|
onLoad(op) {
|
||||||
|
console.log('op', op)
|
||||||
|
this.pageOption = op
|
||||||
|
if (this.pageOption.st) {
|
||||||
|
this.pageData.searchTime[0] = this.pageOption.st
|
||||||
}
|
}
|
||||||
|
if (this.pageOption.et) {
|
||||||
|
this.pageData.searchTime[1] = this.pageOption.et
|
||||||
|
}
|
||||||
|
this.getDetail(op)
|
||||||
}
|
}
|
||||||
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style>
|
<style lang="scss" scoped>
|
||||||
page {
|
// 使用项目全局颜色变量
|
||||||
background-color: #fff;
|
$bg: #f8f9fa;
|
||||||
}
|
$muted: #666;
|
||||||
.page-card {
|
$card: #fff;
|
||||||
margin: 0 20rpx 30rpx;
|
$shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
|
||||||
|
$primary: #27B25F;
|
||||||
|
$primary2: #4CCC7F;
|
||||||
|
$success: #2ed573;
|
||||||
|
$warning: #ff9f43;
|
||||||
|
$danger: #ff4757;
|
||||||
|
$info: #3742fa;
|
||||||
|
|
||||||
}
|
page {
|
||||||
.screen-box {
|
background-color: $bg;
|
||||||
background-color: #fff;
|
}
|
||||||
padding: 0 20rpx;
|
|
||||||
position: sticky;
|
|
||||||
top: 0;
|
|
||||||
left: 0;
|
|
||||||
z-index: 9;
|
|
||||||
}
|
|
||||||
.screen-box .screen-unit {
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
width: 200rpx;
|
|
||||||
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: 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;
|
|
||||||
border-radius: 4rpx;
|
|
||||||
padding: 4rpx 12rpx;
|
|
||||||
margin-top: 20rpx;
|
|
||||||
}
|
|
||||||
.page-list {
|
|
||||||
border: 1rpx solid #F0F0F0;
|
|
||||||
border-radius: 0 0 12rpx 12rpx;
|
|
||||||
overflow: hidden;
|
|
||||||
|
|
||||||
padding: 30rpx 16rpx 30rpx 16rpx;
|
.main {
|
||||||
|
width: 100vw;
|
||||||
|
min-height: 100vh;
|
||||||
|
background-color: $bg;
|
||||||
|
padding: 32rpx;
|
||||||
|
padding-bottom: env(safe-area-inset-bottom);
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 筛选卡片
|
||||||
|
.filterCard {
|
||||||
|
background: $card;
|
||||||
|
border-radius: 16rpx;
|
||||||
|
padding: 24rpx;
|
||||||
|
margin-bottom: 32rpx;
|
||||||
|
box-shadow: $shadow;
|
||||||
|
|
||||||
|
.filterHeader {
|
||||||
|
margin-bottom: 24rpx;
|
||||||
|
|
||||||
|
.filterTitle {
|
||||||
|
font-size: 28rpx;
|
||||||
|
font-weight: 600;
|
||||||
|
color: #160002;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
.cell-body {
|
|
||||||
position: relative;
|
.dateSelector {
|
||||||
padding: 20rpx 20rpx 20rpx 0;
|
.dateRange {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
|
||||||
|
.datePicker {
|
||||||
|
flex: 1;
|
||||||
|
|
||||||
|
.dateInput {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
padding: 16rpx 24rpx;
|
||||||
|
background: #f8f8f8;
|
||||||
|
border-radius: 12rpx;
|
||||||
|
|
||||||
|
text:first-child {
|
||||||
|
font-size: 24rpx;
|
||||||
|
font-weight: 400;
|
||||||
|
color: #160002;
|
||||||
|
}
|
||||||
|
|
||||||
|
.uni-icon-arrowdown {
|
||||||
|
font-size: 20rpx;
|
||||||
|
color: $muted;
|
||||||
|
margin-left: 8rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.dateSeparator {
|
||||||
|
margin: 0 24rpx;
|
||||||
|
font-size: 24rpx;
|
||||||
|
font-weight: 400;
|
||||||
|
color: $muted;
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
.cell-body image {
|
}
|
||||||
width: 60rpx;
|
|
||||||
height: 60rpx;
|
// 服务区信息卡片
|
||||||
border-radius: 50%;
|
.serviceCard {
|
||||||
margin-right: 16rpx;
|
background: linear-gradient(to left, #93a4ec 0%, #4b76e9 100%);
|
||||||
}
|
border-radius: 16rpx;
|
||||||
.cell-body>view {
|
padding: 24rpx;
|
||||||
flex: 1;
|
margin-bottom: 32rpx;
|
||||||
}
|
box-shadow: $shadow;
|
||||||
.page-list text {
|
|
||||||
font-size: 22rpx;
|
.serviceHeader {
|
||||||
color: #2E2E2E;
|
|
||||||
}
|
|
||||||
text.shop-total {
|
|
||||||
font-size: 24rpx;
|
|
||||||
}
|
|
||||||
text.type-text {
|
|
||||||
color: #DFBE9F;
|
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
margin-bottom: 24rpx;
|
||||||
|
|
||||||
|
.serviceName {
|
||||||
|
font-size: 28rpx;
|
||||||
|
font-weight: 600;
|
||||||
|
color: #fff;
|
||||||
|
flex: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
.serviceRevenue {
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-weight: 600;
|
||||||
|
color: #fff;
|
||||||
|
font-family: 'DIN Alternate', 'Arial', sans-serif;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
text.type-text.scan::before,text.type-text.port::before {
|
|
||||||
content: '';
|
.serviceDetails {
|
||||||
width: 21rpx;
|
display: flex;
|
||||||
height: 23rpx;
|
gap: 32rpx;
|
||||||
margin-right: 8rpx;
|
|
||||||
|
.detailItem {
|
||||||
|
flex: 1;
|
||||||
|
|
||||||
|
.detailLabel {
|
||||||
|
font-size: 24rpx;
|
||||||
|
font-weight: 400;
|
||||||
|
color: rgba(255, 255, 255, 0.8);
|
||||||
|
margin-bottom: 8rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.detailValue {
|
||||||
|
font-size: 24rpx;
|
||||||
|
font-weight: 600;
|
||||||
|
color: #fff;
|
||||||
|
font-family: 'DIN Alternate', 'Arial', sans-serif;
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
text.type-text.scan::before {
|
}
|
||||||
background: url(/static/images/revenue/scan-up.png) no-repeat center;
|
|
||||||
background-size: contain;
|
// 商铺列表
|
||||||
|
.shopList {
|
||||||
|
.shopItem {
|
||||||
|
background: $card;
|
||||||
|
border-radius: 16rpx;
|
||||||
|
margin-bottom: 24rpx;
|
||||||
|
padding: 32rpx;
|
||||||
|
box-shadow: $shadow;
|
||||||
|
|
||||||
|
.shopHeader {
|
||||||
|
display: flex;
|
||||||
|
align-items: flex-start;
|
||||||
|
|
||||||
|
.shopIcon {
|
||||||
|
width: 80rpx;
|
||||||
|
height: 80rpx;
|
||||||
|
margin-right: 24rpx;
|
||||||
|
flex-shrink: 0;
|
||||||
|
|
||||||
|
image {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
border-radius: 12rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.shopInfo {
|
||||||
|
flex: 1;
|
||||||
|
|
||||||
|
.shopTop {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
margin-bottom: 16rpx;
|
||||||
|
|
||||||
|
.shopName {
|
||||||
|
font-size: 26rpx;
|
||||||
|
font-weight: 600;
|
||||||
|
color: #160002;
|
||||||
|
flex: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
.shopRevenue {
|
||||||
|
font-size: 28rpx;
|
||||||
|
font-weight: 600;
|
||||||
|
color: $primary;
|
||||||
|
font-family: 'DIN Alternate', 'Arial', sans-serif;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.shopBottom {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
|
||||||
|
.uploadType {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
.typeIcon {
|
||||||
|
width: 24rpx;
|
||||||
|
height: 24rpx;
|
||||||
|
margin-right: 8rpx;
|
||||||
|
flex-shrink: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.typeText {
|
||||||
|
font-size: 22rpx;
|
||||||
|
font-weight: 400;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.scan {
|
||||||
|
.typeIcon {
|
||||||
|
background: url(/static/images/revenue/scan-up.png) no-repeat center;
|
||||||
|
background-size: contain;
|
||||||
|
}
|
||||||
|
|
||||||
|
.typeText {
|
||||||
|
color: #DFBE9F;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&.port {
|
||||||
|
.typeIcon {
|
||||||
|
background: url(/static/images/revenue/port.png) no-repeat center;
|
||||||
|
background-size: contain;
|
||||||
|
}
|
||||||
|
|
||||||
|
.typeText {
|
||||||
|
color: #95BAF2;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&.auto {
|
||||||
|
.typeText {
|
||||||
|
color: $muted;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.revenueDetails {
|
||||||
|
display: flex;
|
||||||
|
gap: 24rpx;
|
||||||
|
|
||||||
|
.revenueItem {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
.revenueLabel {
|
||||||
|
font-size: 22rpx;
|
||||||
|
font-weight: 400;
|
||||||
|
color: $muted;
|
||||||
|
margin-right: 8rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.revenueValue {
|
||||||
|
font-size: 22rpx;
|
||||||
|
font-weight: 600;
|
||||||
|
color: #160002;
|
||||||
|
font-family: 'DIN Alternate', 'Arial', sans-serif;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
text.type-text.port::before {
|
}
|
||||||
background: url(/static/images/revenue/port.png) no-repeat center;
|
|
||||||
background-size: contain;
|
// 无数据状态
|
||||||
}
|
.noDataContainer {
|
||||||
text.type-text.port {
|
display: flex;
|
||||||
color: #95BAF2;
|
justify-content: center;
|
||||||
}
|
align-items: center;
|
||||||
text.text-coast {
|
min-height: 400rpx;
|
||||||
color: #848484;
|
}
|
||||||
width: 184rpx;
|
|
||||||
text-align: right;
|
|
||||||
}
|
|
||||||
/*text.text-coast + text.text-coast {*/
|
|
||||||
/* text-align: right;*/
|
|
||||||
//}
|
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
@ -1,23 +1,27 @@
|
|||||||
<template>
|
<template>
|
||||||
<view class="summaryOfPortraitsMain">
|
<view class="summaryOfPortraitsMain">
|
||||||
<view class="summaryTab" v-if="selectPortrait!==6 && selectPortrait!==7" :style="{height: (menu.bottom + 14) + 'px',background:selectPortrait===0?'':
|
<view class="summaryTab" v-if="selectPortrait !== 6 && selectPortrait !== 7" :style="{
|
||||||
selectPortrait===1?serviceInfo.SERVERPART_NAME==='安徽驿达'?'linear-gradient(180deg, #A8BFED 0%, #F0F5FF 100%)':'linear-gradient(180deg, #A8BFED 0%, #C3D3F4 100%)':
|
height: (menu.bottom + 14) + 'px', background: selectPortrait === 0 ? '' :
|
||||||
selectPortrait===2?serviceInfo.SERVERPART_NAME==='安徽驿达'?'linear-gradient(180deg, #A0D0C1 0%, #EEF7F8 100%)':'linear-gradient(180deg, #A0D0C1 0%, #C0E0D7 100%)':
|
selectPortrait === 1 ? serviceInfo.SERVERPART_NAME === '安徽驿达' ? 'linear-gradient(180deg, #A8BFED 0%, #F0F5FF 100%)' : 'linear-gradient(180deg, #A8BFED 0%, #C3D3F4 100%)' :
|
||||||
selectPortrait===3?serviceInfo.SERVERPART_NAME==='安徽驿达'?'linear-gradient(180deg, #D9CCEF 0%, #F4F0FF 100%)':'linear-gradient(180deg, #D9CCEF 0%, #F4F0FF 100%)':
|
selectPortrait === 2 ? serviceInfo.SERVERPART_NAME === '安徽驿达' ? 'linear-gradient(180deg, #A0D0C1 0%, #EEF7F8 100%)' : 'linear-gradient(180deg, #A0D0C1 0%, #C0E0D7 100%)' :
|
||||||
selectPortrait===4?serviceInfo.SERVERPART_NAME==='安徽驿达'?'linear-gradient(180deg, #ECD1AF 0%, #F0DDC4 100%)':'linear-gradient(180deg, #ECD1AF 0%, #F0DDC4 100%)':
|
selectPortrait === 3 ? serviceInfo.SERVERPART_NAME === '安徽驿达' ? 'linear-gradient(180deg, #D9CCEF 0%, #F4F0FF 100%)' : 'linear-gradient(180deg, #D9CCEF 0%, #F4F0FF 100%)' :
|
||||||
selectPortrait===5?serviceInfo.SERVERPART_NAME==='安徽驿达'?'linear-gradient(180deg, #C5C1F0 0%, #EEF0FE 100%)':'linear-gradient(180deg, #C5C1F0 0%, #EEF0FE 100%)':
|
selectPortrait === 4 ? serviceInfo.SERVERPART_NAME === '安徽驿达' ? 'linear-gradient(180deg, #ECD1AF 0%, #F0DDC4 100%)' : 'linear-gradient(180deg, #ECD1AF 0%, #F0DDC4 100%)' :
|
||||||
''}">
|
selectPortrait === 5 ? serviceInfo.SERVERPART_NAME === '安徽驿达' ? 'linear-gradient(180deg, #C5C1F0 0%, #EEF0FE 100%)' : 'linear-gradient(180deg, #C5C1F0 0%, #EEF0FE 100%)' :
|
||||||
<div class="leftArrow" :style="{top:(menu.top + ((menu.height - 24)/2) )+ 'px'}" >
|
''
|
||||||
<image class="img" src="https://eshangtech.com/ShopICO/ahyd-BID/commercial/navigation-left.svg" @click="handleBack"></image>
|
}">
|
||||||
<div class="picker" :style="{top:(menu.bottom + 24)+'px'}" @click="handleChangeService">
|
<div class="leftArrow" :style="{ top: (menu.top + ((menu.height - 24) / 2)) + 'px' }">
|
||||||
<div class="selectService" >
|
<image class="img" src="https://eshangtech.com/ShopICO/ahyd-BID/commercial/navigation-left.svg"
|
||||||
|
@click="handleBack"></image>
|
||||||
|
<div class="picker" :style="{ top: (menu.bottom + 24) + 'px' }" @click="handleChangeService">
|
||||||
|
<div class="selectService">
|
||||||
<image class="img" src="https://eshangtech.com/ShopICO/ahyd-BID/commercial/fixed.svg"></image>
|
<image class="img" src="https://eshangtech.com/ShopICO/ahyd-BID/commercial/fixed.svg"></image>
|
||||||
<view class="select">
|
<view class="select">
|
||||||
<view class="content">
|
<view class="content">
|
||||||
<view class="uni-input">{{serviceInfo.SERVERPART_NAME?serviceInfo.SERVERPART_NAME:''}}</view>
|
<view class="uni-input">{{ serviceInfo.SERVERPART_NAME ? serviceInfo.SERVERPART_NAME : '' }}</view>
|
||||||
<p class="area">{{serviceInfo.SPREGIONTYPE_NAME?serviceInfo.SPREGIONTYPE_NAME:''}}</p>
|
<p class="area">{{ serviceInfo.SPREGIONTYPE_NAME ? serviceInfo.SPREGIONTYPE_NAME : '' }}</p>
|
||||||
<text class="noticeText" v-if="serviceInfo.SERVERPART_NAME==='安徽驿达'">选择您要看的服务区</text>
|
<text class="noticeText" v-if="serviceInfo.SERVERPART_NAME === '安徽驿达'">选择您要看的服务区</text>
|
||||||
<image class="rightArrow" src="https://eshangtech.com/ShopICO/ahyd-BID/commercial/rightArrow.svg"></image>
|
<image class="rightArrow" src="https://eshangtech.com/ShopICO/ahyd-BID/commercial/rightArrow.svg">
|
||||||
|
</image>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</div>
|
</div>
|
||||||
@ -33,41 +37,50 @@
|
|||||||
<sliderPage :index="selectPortrait" @handleChangeIndex="handleChangeIndex"/>
|
<sliderPage :index="selectPortrait" @handleChangeIndex="handleChangeIndex"/>
|
||||||
</view> -->
|
</view> -->
|
||||||
|
|
||||||
<swiper v-if="isShowSwiper" class="summaryOfPortraitsBox" @change="handleChangeSelect" :current="selectPortrait" >
|
<view class="summaryOfPortraitsBox">
|
||||||
<!-- 服务区基本信息 0-->
|
<view class="swiperItem">
|
||||||
<swiper-item class="swiperItem">
|
<mapDetail :selectIndex="selectPortrait" />
|
||||||
<mapDetail :selectIndex="selectPortrait"/>
|
</view>
|
||||||
</swiper-item>
|
</view>
|
||||||
<!-- 车流预警 1-->
|
|
||||||
<swiper-item class="swiperItem" >
|
<template v-if=false>
|
||||||
<carPortrait :selectIndex="selectPortrait" :serviceInfo="serviceInfo"/>
|
<swiper v-if="isShowSwiper" class="summaryOfPortraitsBox" @change="handleChangeSelect" :current="selectPortrait">
|
||||||
</swiper-item>
|
<!-- 服务区基本信息 0-->
|
||||||
<!-- 客群画像 2-->
|
<swiper-item class="swiperItem">
|
||||||
<swiper-item class="swiperItem">
|
<mapDetail :selectIndex="selectPortrait" />
|
||||||
<guestPortrait :selectIndex="selectPortrait"/>
|
</swiper-item>
|
||||||
</swiper-item>
|
<!-- 车流预警 1-->
|
||||||
<!-- 经营画像 3-->
|
<swiper-item class="swiperItem" v-if=false>
|
||||||
<swiper-item class="swiperItem">
|
<carPortrait :selectIndex="selectPortrait" :serviceInfo="serviceInfo" />
|
||||||
<managePortrait :selectIndex="selectPortrait"/>
|
</swiper-item>
|
||||||
</swiper-item>
|
<!-- 客群画像 2-->
|
||||||
<!-- 交易画像 4-->
|
<swiper-item class="swiperItem" v-if=false>
|
||||||
<swiper-item class="swiperItem">
|
<guestPortrait :selectIndex="selectPortrait" />
|
||||||
<businessPortrait :selectIndex="selectPortrait"/>
|
</swiper-item>
|
||||||
</swiper-item>
|
<!-- 经营画像 3-->
|
||||||
<!-- 业态品牌 5-->
|
<swiper-item class="swiperItem" v-if=false>
|
||||||
<swiper-item class="swiperItem">
|
<managePortrait :selectIndex="selectPortrait" />
|
||||||
<formatPortraitBI v-if="serviceInfo.SERVERPART_NAME!=='安徽驿达'" :selectIndex="selectPortrait"/>
|
</swiper-item>
|
||||||
<formatPortrait v-else :selectIndex="selectPortrait" :comeType="'summaryOfPortraits'"/>
|
<!-- 交易画像 4-->
|
||||||
</swiper-item>
|
<swiper-item class="swiperItem" v-if=false>
|
||||||
<!-- 考评考核 6-->
|
<businessPortrait :selectIndex="selectPortrait" />
|
||||||
<swiper-item class="swiperItem">
|
</swiper-item>
|
||||||
<newAmine :selectIndex="selectPortrait" :pageType="1" />
|
<!-- 业态品牌 5-->
|
||||||
</swiper-item>
|
<swiper-item class="swiperItem" v-if=false>
|
||||||
<!-- 日常巡检 7-->
|
<formatPortraitBI v-if="serviceInfo.SERVERPART_NAME !== '安徽驿达'" :selectIndex="selectPortrait" />
|
||||||
<swiper-item class="swiperItem">
|
<formatPortrait v-else :selectIndex="selectPortrait" :comeType="'summaryOfPortraits'" />
|
||||||
<newAmine :selectIndex="selectPortrait" :pageType="2" />
|
</swiper-item>
|
||||||
</swiper-item>
|
<!-- 考评考核 6-->
|
||||||
</swiper>
|
<swiper-item class="swiperItem" v-if=false>
|
||||||
|
<newAmine :selectIndex="selectPortrait" :pageType="1" />
|
||||||
|
</swiper-item>
|
||||||
|
<!-- 日常巡检 7-->
|
||||||
|
<swiper-item class="swiperItem" v-if=false>
|
||||||
|
<newAmine :selectIndex="selectPortrait" :pageType="2" />
|
||||||
|
</swiper-item>
|
||||||
|
</swiper>
|
||||||
|
</template>
|
||||||
|
|
||||||
</view>
|
</view>
|
||||||
</template>
|
</template>
|
||||||
<script>
|
<script>
|
||||||
@ -81,77 +94,77 @@ import formatPortrait from "./components/formatPortrait.vue";
|
|||||||
import newAmine from "./components/newAmine.vue";
|
import newAmine from "./components/newAmine.vue";
|
||||||
import sliderPage from "./components/components/sliderPage.vue";
|
import sliderPage from "./components/components/sliderPage.vue";
|
||||||
export default {
|
export default {
|
||||||
components:{mapDetail,carPortrait,guestPortrait,managePortrait,businessPortrait,formatPortraitBI,newAmine,sliderPage,formatPortrait},
|
components: { mapDetail, carPortrait, guestPortrait, managePortrait, businessPortrait, formatPortraitBI, newAmine, sliderPage, formatPortrait },
|
||||||
data(){
|
data() {
|
||||||
return {
|
return {
|
||||||
selectPortrait: 0,// 选择要看的商业画像
|
selectPortrait: 0,// 选择要看的商业画像
|
||||||
query:'',// 传入的页面元素
|
query: '',// 传入的页面元素
|
||||||
isShowSwiper:false,// 是否显示滑动块
|
isShowSwiper: false,// 是否显示滑动块
|
||||||
menu:{},
|
menu: {},
|
||||||
serviceInfo:{},// 当前选中服务区
|
serviceInfo: {},// 当前选中服务区
|
||||||
isHandleOnShow: true,// 是否调用onShow的方法
|
isHandleOnShow: true,// 是否调用onShow的方法
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
onLoad(query){
|
onLoad(query) {
|
||||||
console.log('query',query)
|
console.log('query', query)
|
||||||
if (query.index){
|
if (query.index) {
|
||||||
this.selectPortrait = Number(query.index)
|
this.selectPortrait = Number(query.index)
|
||||||
}else{
|
} else {
|
||||||
let seat = uni.getStorageSync('currentService')
|
let seat = uni.getStorageSync('currentService')
|
||||||
this.selectPortrait = seat.SERVERPART_NAME==='安徽驿达' ? 1:0
|
this.selectPortrait = seat.SERVERPART_NAME === '安徽驿达' ? 1 : 0
|
||||||
}
|
}
|
||||||
this.query = query
|
this.query = query
|
||||||
console.log('onLoad')
|
console.log('onLoad')
|
||||||
this.menu = uni.getMenuButtonBoundingClientRect()
|
this.menu = uni.getMenuButtonBoundingClientRect()
|
||||||
|
|
||||||
},
|
},
|
||||||
onShow(){
|
onShow() {
|
||||||
console.log('onShow')
|
console.log('onShow')
|
||||||
console.log('selectPortrait',this.selectPortrait)
|
console.log('selectPortrait', this.selectPortrait)
|
||||||
this.isShowSwiper = true
|
this.isShowSwiper = true
|
||||||
let seat = uni.getStorageSync('currentService')
|
let seat = uni.getStorageSync('currentService')
|
||||||
console.log('seat',seat)
|
console.log('seat', seat)
|
||||||
this.serviceInfo = seat
|
this.serviceInfo = seat
|
||||||
if(this.selectPortrait){
|
if (this.selectPortrait) {
|
||||||
|
|
||||||
}else{
|
} else {
|
||||||
this.selectPortrait = this.query.index ? this.query.index: seat.SERVERPART_NAME==='安徽驿达' ? 1:0
|
this.selectPortrait = this.query.index ? this.query.index : seat.SERVERPART_NAME === '安徽驿达' ? 1 : 0
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
onHide(){
|
onHide() {
|
||||||
this.isShowSwiper = false
|
this.isShowSwiper = false
|
||||||
},
|
},
|
||||||
methods:{
|
methods: {
|
||||||
// 商业汇总的滑动方法
|
// 商业汇总的滑动方法
|
||||||
handleChangeSelect(e){
|
handleChangeSelect(e) {
|
||||||
console.log('e',e)
|
console.log('e', e)
|
||||||
// this.handleChangePreview(true)
|
// this.handleChangePreview(true)
|
||||||
this.selectPortrait = e.detail.current
|
this.selectPortrait = e.detail.current
|
||||||
},
|
},
|
||||||
// 切换页码
|
// 切换页码
|
||||||
handleChangeIndex(e){
|
handleChangeIndex(e) {
|
||||||
this.selectPortrait = e
|
this.selectPortrait = e
|
||||||
this.$forceUpdate()
|
this.$forceUpdate()
|
||||||
},
|
},
|
||||||
// 返回
|
// 返回
|
||||||
handleBack(){
|
handleBack() {
|
||||||
uni.navigateBack({
|
uni.navigateBack({
|
||||||
delta: 1
|
delta: 1
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
// 服务区跳转
|
// 服务区跳转
|
||||||
handleChangeService(){
|
handleChangeService() {
|
||||||
let currentService = uni.getStorageSync('currentService')
|
let currentService = uni.getStorageSync('currentService')
|
||||||
let lastDay = uni.getStorageSync('lastDay')
|
let lastDay = uni.getStorageSync('lastDay')
|
||||||
let pageList = getCurrentPages()
|
let pageList = getCurrentPages()
|
||||||
console.log('pageList',pageList)
|
console.log('pageList', pageList)
|
||||||
if (pageList.length>2){
|
if (pageList.length > 2) {
|
||||||
uni.navigateBack({
|
uni.navigateBack({
|
||||||
delta: 1
|
delta: 1
|
||||||
})
|
})
|
||||||
}else{
|
} else {
|
||||||
uni.navigateTo({
|
uni.navigateTo({
|
||||||
url:`/pages/map/index?time=${lastDay}&serviceInfo=${JSON.stringify(currentService)}`
|
url: `/pages/map/index?time=${lastDay}&serviceInfo=${JSON.stringify(currentService)}`
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@ -159,41 +172,48 @@ export default {
|
|||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
<style scoped lang="scss">
|
<style scoped lang="scss">
|
||||||
.summaryOfPortraitsMain{
|
.summaryOfPortraitsMain {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
.summaryTab{
|
|
||||||
|
.summaryTab {
|
||||||
position: fixed;
|
position: fixed;
|
||||||
left:0;top: 0;
|
left: 0;
|
||||||
|
top: 0;
|
||||||
width: 100vw;
|
width: 100vw;
|
||||||
background: transparent;
|
background-image: url("https://eshangtech.com/minTestImg/pageBg.png");
|
||||||
z-index: 99;
|
z-index: 99;
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: flex-end;
|
align-items: flex-end;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
padding-bottom: 16px;
|
padding-bottom: 16px;
|
||||||
.leftArrow{
|
|
||||||
|
.leftArrow {
|
||||||
height: 24px;
|
height: 24px;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
left: 16px;
|
left: 16px;
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
z-index:99999999999;
|
z-index: 99999999999;
|
||||||
.img{
|
|
||||||
|
.img {
|
||||||
width: 24px;
|
width: 24px;
|
||||||
height: 24px;
|
height: 24px;
|
||||||
margin-right: 8px;
|
margin-right: 8px;
|
||||||
}
|
}
|
||||||
.picker{
|
|
||||||
.selectService{
|
.picker {
|
||||||
|
.selectService {
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
.img{
|
|
||||||
|
.img {
|
||||||
width: 40px;
|
width: 40px;
|
||||||
height: 40px;
|
height: 40px;
|
||||||
z-index: 2;
|
z-index: 2;
|
||||||
}
|
}
|
||||||
.select{
|
|
||||||
|
.select {
|
||||||
height: 32px;
|
height: 32px;
|
||||||
background: #F8F8FA;
|
background: #F8F8FA;
|
||||||
border-radius: 0 16px 16px 0;
|
border-radius: 0 16px 16px 0;
|
||||||
@ -203,10 +223,12 @@ export default {
|
|||||||
padding-right: 8rpx;
|
padding-right: 8rpx;
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
.content{
|
|
||||||
|
.content {
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
.uni-input{
|
|
||||||
|
.uni-input {
|
||||||
padding: 0;
|
padding: 0;
|
||||||
background: transparent;
|
background: transparent;
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
@ -214,7 +236,8 @@ export default {
|
|||||||
font-weight: 600;
|
font-weight: 600;
|
||||||
color: #160002;
|
color: #160002;
|
||||||
}
|
}
|
||||||
.area{
|
|
||||||
|
.area {
|
||||||
font-size: 12px;
|
font-size: 12px;
|
||||||
font-family: PingFangSC-Regular, PingFang SC;
|
font-family: PingFangSC-Regular, PingFang SC;
|
||||||
font-weight: 400;
|
font-weight: 400;
|
||||||
@ -222,11 +245,13 @@ export default {
|
|||||||
line-height: 40px;
|
line-height: 40px;
|
||||||
margin-left: 4px;
|
margin-left: 4px;
|
||||||
}
|
}
|
||||||
.rightArrow{
|
|
||||||
|
.rightArrow {
|
||||||
width: 12px;
|
width: 12px;
|
||||||
height: 12px;
|
height: 12px;
|
||||||
}
|
}
|
||||||
.noticeText{
|
|
||||||
|
.noticeText {
|
||||||
font-size: 24rpx;
|
font-size: 24rpx;
|
||||||
font-family: PingFangSC, PingFang SC;
|
font-family: PingFangSC, PingFang SC;
|
||||||
font-weight: 400;
|
font-weight: 400;
|
||||||
@ -241,10 +266,12 @@ export default {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.summaryOfPortraitsBox{
|
|
||||||
|
.summaryOfPortraitsBox {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
.swiperItem{
|
|
||||||
|
.swiperItem {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 100vh;
|
height: 100vh;
|
||||||
}
|
}
|
||||||
|
|||||||
@ -183,6 +183,19 @@ export default {
|
|||||||
summaryOfPortraits: true,
|
summaryOfPortraits: true,
|
||||||
value: 4,
|
value: 4,
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
id: "",
|
||||||
|
name: "人员管理",
|
||||||
|
// homeUrl: "/pages/map/detail?come=user",
|
||||||
|
homeUrl: "/pages/attendanceStatus/index",
|
||||||
|
imagePath:
|
||||||
|
"https://eshangtech.com/ShopICO/ahyd-BID/user/assessment.svg",
|
||||||
|
isNotice: true,
|
||||||
|
notice: 0,
|
||||||
|
type: 0,
|
||||||
|
summaryOfPortraits: true,
|
||||||
|
value: 4,
|
||||||
|
},
|
||||||
],
|
],
|
||||||
},
|
},
|
||||||
],
|
],
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user