首页加下拉刷新,公告显示问题;报修优化

This commit is contained in:
zhouyanli
2026-08-19 11:46:20 +08:00
parent cb885dc1f2
commit 2f5b166bc1
4 changed files with 96 additions and 25 deletions

View File

@@ -2,7 +2,9 @@
<view class="form-container">
<!-- 维修项目展示 -->
<view class="form-item">
<text class="label">维修项目</text>
<view class="label">
<text class="required">*</text>维修项目
</view>
<view class="value" @click="goBackSelect">
<view>
<text v-if="!repairProject">请选择项目</text>
@@ -14,34 +16,43 @@
<!-- 标题输入 -->
<view class="form-item">
<text class="label">标题</text>
<!-- <input type="text" placeholder="请输入问题标题" v-model="form.title" /> -->
<text class="label">标题</text>
<uni-easyinput
v-model="form.title"
placeholder="请输入内容"
placeholder="请输入标题(最多30字符)"
:inputBorder="false"
maxlength="30"
></uni-easyinput>
</view>
<!-- 问题描述 -->
<view class="form-item-wenti">
<text class="label">问题描述</text>
<!-- <textarea placeholder="请输入问题内容" v-model="form.desc" rows="5" ></textarea> -->
<uni-easyinput
<!-- <text class="label">问题描述</text> -->
<view class="label">
<text class="required">*</text>问题描述
</view>
<view class="textarea-wrap">
<textarea v-model="form.desc" placeholder="请描述你的问题(最多200字)" maxlength="200" class="desc-textarea" />
<text class="char-count">{{ form.desc.length }}/200</text>
</view>
<!-- <uni-easyinput
v-model="form.desc"
placeholder="请描述你的问题"
type="textarea"
></uni-easyinput>
></uni-easyinput> -->
</view>
<!-- 手机号 -->
<view class="form-item">
<text class="label">手机号</text>
<view class="label">
<text class="required">*</text>手机号
</view>
<uni-easyinput
type="number"
v-model="form.phone"
placeholder="请输入手机号"
:inputBorder="false"
maxlength="11"
></uni-easyinput>
</view>
@@ -60,7 +71,7 @@
<!-- <uni-icons type="close" size="16" @click="deleteImage(index)"></uni-icons> -->
</view>
<!-- 上传按钮 -->
<view class="upload-btn" @click="chooseImage" v-if="form.images.length < 3">
<view class="upload-btn" @click="chooseImage" v-if="form.images.length < 9">
<uni-icons type="plusempty" size="24"></uni-icons>
<!-- <text>上传照片</text> -->
</view>
@@ -69,6 +80,9 @@
<!-- 提交按钮 -->
<button class="submit-btn" @click="submitForm">提交</button>
<!-- 提交时遮罩,禁止页面点击 -->
<view class="submit-mask" v-if="submitting"></view>
</view>
</template>
@@ -90,6 +104,9 @@ const form = ref({
images: [] // 图片列表
})
// 防止重复点击
const submitting = ref(false)
// ==========方法========
// 页面加载
@@ -122,10 +139,10 @@ const goBackSelect = () => {
// 选择图片
const chooseImage = () => {
// 计算还能选几张
const remainCount = 3 - form.value.images.length
const remainCount = 9 - form.value.images.length
if (remainCount <= 0) {
uni.showToast({
title: '最多只能上传3张图片',
title: '最多只能上传9张图片',
icon: 'none'
})
return
@@ -171,15 +188,13 @@ const deleteImage = index => {
// 表单提交
const submitForm = async () => {
// 防止重复提交
if (submitting.value) return
// 表单校验
if (!repairProject.value) {
uni.showToast({ title: '请选择维修项目', icon: 'none' })
return
}
if (!form.value.title) {
uni.showToast({ title: '请输入问题标题', icon: 'none' })
return
}
if (!form.value.desc) {
uni.showToast({ title: '请输入问题描述', icon: 'none' })
return
@@ -189,6 +204,7 @@ const submitForm = async () => {
return
}
// 提交数据
submitting.value = true
uni.showLoading({ title: '提交中...' ,mask:true})
try {
// 先上传图片
@@ -219,6 +235,7 @@ const submitForm = async () => {
} catch (e) {
uni.showToast({ title: e.msg || '网络异常', icon: 'none' })
} finally {
submitting.value = false
uni.hideLoading()
}
@@ -244,11 +261,15 @@ const submitForm = async () => {
border-bottom: 1px solid #eee;
}
.label {
width: 140rpx;
width: 180rpx;
font-size: 28rpx;
color: #333;
line-height: 80rpx;
}
.required {
color: red;
margin-right: 4rpx;
}
.value {
flex: 1;
@@ -259,6 +280,27 @@ const submitForm = async () => {
display: flex;
justify-content: space-between;
}
.textarea-wrap {
flex: 1;
position: relative;
}
.desc-textarea {
width: 100%;
height: 160rpx;
font-size: 28rpx;
padding: 10rpx 0;
box-sizing: border-box;
border: 1px solid #eee;
border-radius: 4px;
padding: 5px;
}
.char-count {
position: absolute;
right: 10rpx;
bottom: 10rpx;
font-size: 24rpx;
color: #999;
}
.input,
.textarea {
font-size: 14px;
@@ -318,4 +360,12 @@ const submitForm = async () => {
line-height: 44px;
font-size: 16px;
}
.submit-mask {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 9999;
}
</style>

View File

@@ -13,7 +13,7 @@
</view>
<view class="news-content">
<text class="content-text">{{ item.notice || item.problem }}</text>
<text class="content-text">{{ item.problem || item.notice}}</text>
</view>
<view class="detail-btn" @click="goToDetail(item)">

View File

@@ -3,7 +3,9 @@
"path": "pages/index/index",
"style": {
"navigationBarTitleText": "工作台",
"navigationStyle": "custom"
"navigationStyle": "custom",
"enablePullDownRefresh": true,
"backgroundTextStyle": "dark"
}
},
{

View File

@@ -125,7 +125,7 @@
<script setup>
import { ref } from 'vue'
import { onLoad, onUnload, onShow, onReady } from '@dcloudio/uni-app'
import { onLoad, onUnload, onShow, onReady, onPullDownRefresh } from '@dcloudio/uni-app'
import {
getCurrentVillage,
getTodayInspection,
@@ -308,7 +308,7 @@ const handleFunctionClick = item => {
// 获取当前小区
const currentVillageData = () => {
currentCommunity.value = '请先绑定房屋'
getCurrentVillage()
return getCurrentVillage()
.then(res => {
const data = res.data
if (data) {
@@ -323,7 +323,7 @@ const currentVillageData = () => {
}
// 获取今日巡检数据
const getInspectionData = () => {
getTodayInspection()
return getTodayInspection()
.then(res => {
if (res.code === 200) {
if (res.data) {
@@ -346,7 +346,7 @@ const getInspectionData = () => {
// 获取消息通知
const getNoticeData = () => {
getNewNoticeData().then(res => {
const notice = res.code === 200 && res.data ? (res.data.notice || '') : '暂无公告'
const notice = res.code === 200 && res.data ? (res.data.problem || res.data.notice) : '暂无公告'
// 仅在内容真正变化时才更新
if (noticeText.value !== notice) {
noticeText.value = notice
@@ -369,7 +369,7 @@ function getbannarData(forceRefresh = false) {
}
} catch (e) {}
}
getBannarList()
return getBannarList()
.then(res => {
if (res.code === 200 && res.data) {
const newData = res.data
@@ -397,7 +397,7 @@ function getbannarData(forceRefresh = false) {
const MyOrderNum = ref(0)
// 查询我的工单-待办数量
function getMyOrderNum() {
myOrderCount()
return myOrderCount()
.then(res => {
if (res.code === 200 && res.data) {
MyOrderNum.value = res.data
@@ -432,6 +432,7 @@ onShow(() => {
// 从其他页面返回 / 从后台恢复:只刷新可能变化的数据
getbannarData()
getMyOrderNum()
getNoticeData()
// 换账号登录后 currentVillage 缓存已被清除,需要重新获取小区
if (!uni.getStorageSync('currentVillage')) {
currentVillageData()
@@ -470,6 +471,24 @@ onReady(() => {
onUnload(() => {
uni.$off('confirm', slelctHomeData)
})
// 下拉刷新
onPullDownRefresh(async () => {
if (!isLoggedIn.value) {
uni.stopPullDownRefresh()
return
}
try {
await Promise.allSettled([
currentVillageData(),
getInspectionData(),
getbannarData(true),
getMyOrderNum()
])
} finally {
uni.stopPullDownRefresh()
}
})
</script>
<style lang="scss" scoped>