zhouyanli/property-manager-side
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge branch 'master' of http://gitea.bugtc.com/zhouyanli/property-manager-side

Browse Source
This commit is contained in:
Zy
2026-05-21 10:55:51 +08:00
parent ac9379ab8a cd9cc3fd92
commit af98d07d7d
4 changed files with 495 additions and 584 deletions
Download Patch File Download Diff File Expand all files Collapse all files

701
wuye-manager-uniapp/pages/index/index.vue
View File

@@ -1,149 +1,118 @@
<template>
<view class="content-class">
<view class="nar-top">
<!-- 这里是状态栏占位 -->
<!-- 顶部渐变背景层 -->
<view class="bg-gradient"></view>
<!-- 页面内容区 -->
<view class="page-content">
<!-- 状态栏占位 -->
<view class="status_bar" :style="{ height: statusBarHeight + 'px' }"></view>
<!-- 导航栏 -->
<view class="nav-bar">
<text class="nav-title">首页</text>
</view>
<view class="tabbarClass">
<view class="header-container" @click="navigateToPage">
<!-- 左侧小区选择区域 -->
<view class="location-area">
<!-- 定位图标 -->
<view class="location-icon">
<image
src="https://wuyeadmin.bugtc.com/images/imgs/adress.png"
style="height: 100%; width: 100%"
></image>
</view>
<!-- 小区名称和下拉箭头 -->
<view class="community-selector">
<text class="community-name">{{ currentCommunity }}</text>
<view class="community-icon">
<image
src="https://wuyeadmin.bugtc.com/images/imgs/三角形.png"
style="height: 100%; width: 100%"
></image>
</view>
<!-- 小区选择 -->
<view class="header-container" @click="navigateToPage">
<view class="location-area">
<view class="location-icon">
<image src="https://wuyeadmin.bugtc.com/images/imgs/adress.png" style="height: 100%; width: 100%"></image>
</view>
<view class="community-selector">
<text class="community-name">{{ currentCommunity }}</text>
<view class="community-icon">
<image src="https://wuyeadmin.bugtc.com/images/imgs/三角形.png" style="height: 100%; width: 100%"></image>
</view>
</view>
</view>
</view>
</view>
<!-- banner -->
<view class="bannarClass">
<uni-swiper-dot
class="uni-swiper-dot-box"
@clickItem="clickItem"
:info="bannerList"
:current="current"
mode="round"
>
<swiper class="swiper-box" :current="current" autoplay>
<swiper-item v-for="(item, index) in bannerList" :key="index">
<view class="swiper-item">
<image :src="item.url" style="width: 100%; height: 100%"></image>
</view>
</swiper-item>
</swiper>
</uni-swiper-dot>
</view>
<!-- banner -->
<view class="bannarClass">
<uni-swiper-dot
class="uni-swiper-dot-box"
@clickItem="clickItem"
:info="bannerList"
:current="current"
mode="round"
>
<swiper class="swiper-box" :current="current" autoplay>
<swiper-item v-for="(item, index) in bannerList" :key="index">
<view class="swiper-item">
<image :src="item.url" style="width: 100%; height: 100%"></image>
</view>
</swiper-item>
</swiper>
</uni-swiper-dot>
</view>
<!-- 巡检 -->
<view class="inspectionClass">
<!-- 消息通知栏 -->
<view class="noticeClass">
<!-- 左侧消息通知文字 -->
<view class="notice-left">
<image
src="https://wuyeadmin.bugtc.com/images/imgs/notice.png"
class="notice-icon"
></image>
<view class="notice-line"></view>
<!-- 巡检 -->
<view class="inspectionClass">
<!-- 消息通知栏 -->
<view class="noticeClass">
<view class="notice-left">
<image src="https://wuyeadmin.bugtc.com/images/imgs/notice.png" class="notice-icon"></image>
<view class="notice-line"></view>
</view>
<view class="notice-right" @click="getNoticeMore">
<uni-notice-bar
:text="noticeText"
type="line"
:showIcon="false"
show-get-more
scrollable
color="#fff"
background-color="transparent"
moreColor="#fff"
no-border
>
</uni-notice-bar>
</view>
</view>
<!-- 右侧滚动公告 -->
<view class="notice-right" @click="getNoticeMore">
<uni-notice-bar
:text="noticeText"
type="line"
:showIcon="false"
show-get-more
scrollable
color="#fff"
background-color="transparent"
moreColor="#fff"
no-border
>
</uni-notice-bar>
<!-- 巡检数据统计区 -->
<view class="statistics-wrap">
<view class="statistics-item" @click="goToInspectionRecord">
<text class="num">{{allCount}}</text>
<text class="label">全部巡检</text>
</view>
<view class="statistics-item" @click="goToDaysInspection">
<text class="num">{{pendingCount}}</text>
<text class="label">待巡检</text>
</view>
<view class="statistics-item">
<text class="num">{{InspectedCount}}</text>
<text class="label">已巡检</text>
</view>
</view>
</view>
<!-- 巡检数据统计区 -->
<view class="statistics-wrap">
<view class="statistics-item" @click="goToInspectionRecord">
<text class="num">{{ allCount }}</text>
<text class="label">全部巡检</text>
<!-- 网格布局功能 -->
<view class="function-container">
<!-- 第一行功能：故障上报、一键开门、工单大厅、我的工单 -->
<view class="function-row">
<view class="function-item" @click="goToReport">
<image class="item-icon" src="https://wuyeadmin.bugtc.com/images/imgs/fault-report.png" mode="aspectFit"></image>
<text class="item-text">故障上报</text>
</view>
<view class="function-item" @click="goToOneOpenDoor">
<image class="item-icon" src="https://wuyeadmin.bugtc.com/images/imgs/open.png" mode="aspectFit"></image>
<text class="item-text">一键开门</text>
</view>
<view class="function-item" @tap="goToTicketHall">
<image class="item-icon" src="https://wuyeadmin.bugtc.com/images/imgs/work-order.png" mode="aspectFit"></image>
<text class="item-text">工单大厅</text>
</view>
<view class="function-item" @tap="goToMyTicket">
<image class="item-icon" src="https://wuyeadmin.bugtc.com/images/imgs/my-work.png" mode="aspectFit"></image>
<text class="item-text">我的工单</text>
</view>
</view>
<view class="statistics-item" @click="goToDaysInspection">
<text class="num">{{ pendingCount }}</text>
<text class="label">待巡检</text>
</view>
<view class="statistics-item">
<text class="num">{{ InspectedCount }}</text>
<text class="label">已巡检</text>
</view>
</view>
</view>
<!-- 网格布局功能 -->
<view class="function-container">
<!-- 第一行功能：故障上报、一键开门、工单大厅、我的工单 -->
<view class="function-row">
<view class="function-item" @click="goToReport">
<image
class="item-icon"
src="https://wuyeadmin.bugtc.com/images/imgs/fault-report.png"
mode="aspectFit"
></image>
<text class="item-text">故障上报</text>
</view>
<view class="function-item" @click="goToOneOpenDoor">
<image
class="item-icon"
src="https://wuyeadmin.bugtc.com/images/imgs/open.png"
mode="aspectFit"
></image>
<text class="item-text">一键开门</text>
</view>
<view class="function-item" @tap="goToTicketHall">
<image
class="item-icon"
src="https://wuyeadmin.bugtc.com/images/imgs/work-order.png"
mode="aspectFit"
></image>
<text class="item-text">工单大厅</text>
</view>
<view class="function-item" @tap="goToMyTicket">
<image
class="item-icon"
src="https://wuyeadmin.bugtc.com/images/imgs/my-work.png"
mode="aspectFit"
></image>
<text class="item-text">我的工单</text>
</view>
</view>
<!-- 第二行 -->
<view class="function-row" style="margin-top: 2px">
<view class="function-item" @tap="goToComplaint">
<image
class="item-icon"
src="https://wuyeadmin.bugtc.com/images/imgs/complaint.png"
mode="aspectFit"
></image>
<text class="item-text">投诉处理</text>
<!-- 第二行 -->
<view class="function-row" style="margin-top: 2px">
<view class="function-item" @tap="goToComplaint">
<image class="item-icon" src="https://wuyeadmin.bugtc.com/images/imgs/complaint.png" mode="aspectFit"></image>
<text class="item-text">投诉处理</text>
</view>
</view>
</view>
</view>
@@ -260,8 +229,10 @@ const getInspectionData = () => {
InspectedCount.value = 0
}
}
})
.catch(err => {
}else{
uni.showToast({ title: res.msg || '获取失败', icon: 'none' })
}
}).catch(err => {
uni.showToast({ title: err.msg || '获取失败', icon: 'none' })
})
}
@@ -318,256 +289,250 @@ const clickItem = index => {
<style lang="scss" scoped>
.content-class {
background-color: #f9f9f9;
box-sizing: border-box;
min-height: 100vh;
overflow-y: auto;
position: relative;
}
.nar-top {
height: 400rpx;
width: 100%;
background: repeating-linear-gradient(to right, #edf4fa, #c0e4fb);
position: absolute;
}
/* 顶部渐变背景 */
.bg-gradient {
position: absolute;
top: 0;
left: 0;
right: 0;
height: 400rpx;
background: repeating-linear-gradient(to right, #edf4fa, #c0e4fb);
z-index: 0;
}
.status_bar {
width: 100%;
/* 页面内容容器 */
.page-content {
position: relative;
z-index: 1;
padding: 0 40rpx 40rpx;
}
.status_bar {
width: 100%;
}
/* 导航栏 */
.nav-bar {
height: 88rpx;
line-height: 88rpx;
text-align: center;
}
.nav-title {
font-size: 32rpx;
font-weight: 400;
}
.header-container {
display: flex;
align-items: center;
justify-content: space-between;
padding: 4rpx 0;
}
/* 左侧区域 */
.location-area {
display: flex;
align-items: center;
position: relative;
flex: 1;
min-width: 0;
.location-icon {
width: 45rpx;
height: 45rpx;
margin-right: 12rpx;
flex-shrink: 0;
}
/* 导航栏 */
.nav-bar {
height: 44px;
line-height: 44px;
text-align: center;
}
.nav-title {
font-size: 32rpx;
font-weight: 400;
}
.header-container {
.community-selector {
display: flex;
align-items: center;
justify-content: space-between;
padding: 4rpx 30rpx;
box-sizing: border-box;
position: absolute;
top: 85px;
left: 0;
z-index: 9999;
}
max-width: 300rpx;
cursor: pointer;
// 左侧区域
.location-area {
display: flex;
align-items: center;
position: relative;
flex: 1;
min-width: 0;
.location-icon {
width: 45rpx;
height: 45rpx;
margin-right: 12rpx;
flex-shrink: 0;
.community-name {
font-size: 26rpx;
font-weight: 500;
color: #000;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
max-width: 200rpx;
}
.community-selector {
display: flex;
align-items: center;
max-width: 300rpx;
cursor: pointer;
.community-name {
font-size: 26rpx;
font-weight: 500;
color: #000;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
max-width: 200rpx;
}
.community-icon {
width: 20rpx;
height: 20rpx;
margin-left: 20rpx;
margin-top: -22rpx;
}
.community-icon {
width: 20rpx;
height: 20rpx;
margin-left: 20rpx;
margin-top: -22rpx;
}
}
.bannarClass {
position: relative;
top: 110px;
left: 0;
padding: 20rpx 40rpx;
}
.swiper-box {
height: 300rpx;
border-radius: 16rpx !important;
overflow: hidden !important;
}
.swiper-item {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
height: 300rpx;
color: #fff;
}
.inspectionClass {
position: relative;
top: 111px;
left: 0;
margin: 0 40rpx;
background: linear-gradient(to right, #7b87fa, #4d5dfa);
border-radius: 16rpx;
box-sizing: border-box;
padding: 30rpx;
}
// 消息通知栏
.noticeClass {
display: flex;
align-items: center;
height: 80rpx;
background: rgba(255, 255, 255, 0.1);
border-radius: 16rpx;
padding: 6rpx 20rpx;
margin-bottom: 30rpx;
border: 1rpx solid rgba(255, 255, 255, 0.1);
}
// 左侧”消息通知”文字
.notice-left {
display: flex;
align-items: center;
margin-right: 16rpx;
.notice-icon {
width: 48rpx;
height: 48rpx;
margin-right: 15rpx;
}
.notice-line {
width: 1rpx;
height: 40rpx;
background-color: rgba(255, 255, 255, 0.4);
}
}
// 右侧公告滚动区
.notice-right {
flex: 1;
}
// 深度修改uni-notice-bar样式
:deep(.uni-noticebar) {
background-color: transparent !important;
height: 100% !important;
line-height: 80rpx !important;
padding: 0 !important;
margin: 0 !important;
}
// 公告文字样式
:deep(.uni-noticebar__content) {
font-size: 26rpx !important;
color: #fff !important;
padding: 0 !important;
}
// 右侧箭头按钮
:deep(.uni-noticebar__more) {
color: #fff !important;
font-size: 24rpx !important;
padding: 0 0 0 10rpx !important;
}
// 隐藏默认滚动动画的多余样式
:deep(.uni-noticebar__content-wrapper--scrollable) {
left: 0 !important;
width: calc(100% - 30rpx) !important;
}
// 统计区布局
.statistics-wrap {
display: flex;
justify-content: space-between;
align-items: center;
padding: 0 20rpx;
}
// 统计项样式
.statistics-item {
text-align: center;
}
.statistics-item .num {
font-size: 36rpx;
font-weight: bold;
color: #fff;
display: block;
line-height: 1;
margin-bottom: 10rpx;
}
.statistics-item .label {
font-size: 24rpx;
color: #fff;
opacity: 0.9;
}
.function-container {
background-color: #ffffff;
border-radius: 16rpx;
padding: 30rpx 20rpx;
box-sizing: border-box;
position: relative;
top: 123px;
left: 0;
margin: 0 40rpx;
}
// 功能行布局
.function-row {
display: flex;
align-items: center;
margin-bottom: 20rpx;
&:last-child {
margin-bottom: 0;
}
}
.function-item {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
width: 25%;
padding: 10rpx 0;
}
// 功能图标样式
.item-icon {
width: 88rpx;
height: 88rpx;
margin-bottom: 10rpx;
}
// 功能文字样式
.item-text {
font-size: 24rpx;
color: #333333;
font-weight: 400;
text-align: center;
}
}
.bannarClass {
padding: 20rpx 0;
}
.swiper-box {
height: 300rpx;
border-radius: 16rpx !important;
overflow: hidden !important;
}
.swiper-item {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
height: 300rpx;
color: #fff;
}
.inspectionClass {
background: linear-gradient(to right, #7b87fa, #4d5dfa);
border-radius: 16rpx;
box-sizing: border-box;
padding: 30rpx;
}
/* 消息通知栏 */
.noticeClass {
display: flex;
align-items: center;
height: 80rpx;
background: rgba(255, 255, 255, 0.1);
border-radius: 16rpx;
padding: 6rpx 20rpx;
margin-bottom: 30rpx;
border: 1rpx solid rgba(255, 255, 255, 0.1);
}
/* 左侧"消息通知"文字 */
.notice-left {
display: flex;
align-items: center;
margin-right: 16rpx;
.notice-icon {
width: 48rpx;
height: 48rpx;
margin-right: 15rpx;
}
.notice-line {
width: 1rpx;
height: 40rpx;
background-color: rgba(255, 255, 255, 0.4);
}
}
/* 右侧公告滚动区 */
.notice-right {
flex: 1;
}
/* 深度修改uni-notice-bar样式 */
:deep(.uni-noticebar) {
background-color: transparent !important;
height: 100% !important;
line-height: 80rpx !important;
padding: 0 !important;
margin: 0 !important;
}
/* 公告文字样式 */
:deep(.uni-noticebar__content) {
font-size: 26rpx !important;
color: #fff !important;
padding: 0 !important;
}
/* 右侧箭头按钮 */
:deep(.uni-noticebar__more) {
color: #fff !important;
font-size: 24rpx !important;
padding: 0 0 0 10rpx !important;
}
/* 隐藏默认滚动动画的多余样式 */
:deep(.uni-noticebar__content-wrapper--scrollable) {
left: 0 !important;
width: calc(100% - 30rpx) !important;
}
/* 统计区布局 */
.statistics-wrap {
display: flex;
justify-content: space-between;
align-items: center;
padding: 0 20rpx;
}
/* 统计项样式 */
.statistics-item {
text-align: center;
}
.statistics-item .num {
font-size: 36rpx;
font-weight: bold;
color: #fff;
display: block;
line-height: 1;
margin-bottom: 10rpx;
}
.statistics-item .label {
font-size: 24rpx;
color: #fff;
opacity: 0.9;
}
.function-container {
background-color: #ffffff;
border-radius: 16rpx;
padding: 30rpx 0;
box-sizing: border-box;
margin-top: 20rpx;
}
/* 功能行布局 */
.function-row {
display: flex;
align-items: center;
margin-bottom: 20rpx;
&:last-child {
margin-bottom: 0;
}
}
.function-item {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
width: 25%;
padding: 10rpx 0;
}
/* 功能图标样式 */
.item-icon {
width: 88rpx;
height: 88rpx;
margin-bottom: 10rpx;
}
/* 功能文字样式 */
.item-text {
font-size: 24rpx;
color: #333333;
font-weight: 400;
text-align: center;
}
</style>