From f5d67b69142c78be1ee996f53b6bb8e4c954761c Mon Sep 17 00:00:00 2001 From: zhouwenxuan <1175765986@qq.com> Date: 星期三, 15 十一月 2023 10:06:38 +0800 Subject: [PATCH] 页面跳转修改 --- pages/tabBar/notice/notice.vue | 153 ++++++++++++++++++++++++++++++++++++-------------- 1 files changed, 109 insertions(+), 44 deletions(-) diff --git a/pages/tabBar/notice/notice.vue b/pages/tabBar/notice/notice.vue index 865b7bf..5be8b37 100644 --- a/pages/tabBar/notice/notice.vue +++ b/pages/tabBar/notice/notice.vue @@ -7,10 +7,16 @@ <!-- 真正的导航栏内容 --> <view class="navBar" > <view class="barText">{{user.name}}收到的工作通知</view> + <view > + <u-button type="text" @click="loginOut" style="color: blue;margin-right: 5px;">退出</u-button> + </view> <!-- <view class="barText">{{registerID}}</view> --> <!-- <view style="flex: 1;" @click="loginOut">退出</view> --> </view> </view> + <div v-if="loading" style='display: flex;justify-content: center;position: absolute;width:100%;top: 40%;left: 0'> + <u-loading-icon></u-loading-icon> + </div> <!-- 页面内容 --> <view class="controlBar"> <view class="buttonGroup"> @@ -30,12 +36,12 @@ </view> </view> <view class="listHead"> - <view class="switchBtn"> +<!-- <view class="switchBtn"> <u-checkbox-group> <u-checkbox v-model="isReadOnly" @change="chooseRead"></u-checkbox> </u-checkbox-group> <text>只显示未读</text> - </view> + </view> --> <view class="switchBtn"> <u-switch v-model="checked" size="20" @change="clickSwitch" style="margin-right: 6px"></u-switch> <text>仅紧临</text> @@ -44,13 +50,18 @@ </view> <view style="display: flex;flex-direction: column;margin-bottom: 55px;"> <view class="noticeList"> - <view class="listContent" v-if="noticeList.length > 0" > - <view v-for="(item, index) in noticeList" :key="index" class="itemContent" > - <view class="content" v-if="item.isRead" > - <text style="color:rgb(17, 204, 33);" @click="toDetail(item)">[已叫应]</text> - <text @click="toDetail(item)">[{{item.colorContent}}]</text> - <text @click="toDetail(item)">{{item.title}},{{item.content}}</text> - <view v-if="item.isRead" style="float: right; width: 80px;margin-top: 3px;"> +<!-- <view class="listContent" v-if="noticeList.length > 0" >--> + <scroll-view :scroll-top="scrollTop" scroll-y="true" class="listContent" @scrolltoupper="upper" v-if="noticeList.length > 0" + @scrolltolower="lower" @scroll="scroll" lower-threshold="50"> + <view v-for="(item, index) in noticeList" :key="index" class="itemContent" @click="toDetail(item)"> + <view class="content" v-if="item.isResponse" > + <text style="color:rgb(17, 204, 33);" >[已叫应]</text> + <text>[{{item.colorContent}}]</text> + <text>{{item.title}}</text> + <view> + {{item.content}} + </view> + <!-- <view v-if="item.isResponse" style="float: right; width: 80px;margin-top: 3px;"> --> <!-- <u-button @click="toDetail(item)"v-if="item.buttonContent == '已叫应'" size="mini" style="margin-bottom: 10px;background-color:rgb(17, 204, 33);color: white;"> {{item.buttonContent}} </u-button> @@ -60,14 +71,14 @@ <u-button @click="toDetail(item)" v-else type="error" size="mini" style="margin-bottom: 10px;"> {{item.buttonContent}} </u-button> --> - </view> + <!-- </view> --> </view> <view class="contentNoRead" v-else> <u-badge :is-dot="true" type="error" style="position: absolute;"></u-badge> <text style="color: red;margin-left:10px;" @click="toDetail(item)">[未叫应]</text> <text @click="toDetail(item)">[{{item.colorContent}}]</text> <text @click="toDetail(item)">{{item.title}},{{item.content}}</text> - <view style="float: right; width: 80px;margin-top: 3px;"> + <!-- <view style="float: right; width: 80px;margin-top: 3px;"> --> <!-- <u-button @click="toDetail(item)" v-if="item.buttonContent == '已叫应'" size="mini" style="margin-bottom: 10px;background-color:rgb(17, 204, 33);color: white;"> {{item.buttonContent}} </u-button> @@ -77,16 +88,13 @@ <u-button @click="toDetail(item)" v-else type="error" size="mini" style="margin-bottom: 10px;"> {{item.buttonContent}} </u-button> --> - </view> + <!-- </view> --> </view> </view> - </view> + </scroll-view> +<!-- </view>--> <view v-else> - <u-empty - mode="data" - icon="http://cdn.uviewui.com/uview/empty/data.png" - margin-top="50%"> - </u-empty> + <u-empty margin-top="40%" text="数据为空" mode="data"></u-empty> </view> </view> </view> @@ -97,7 +105,7 @@ </template> <script> - import { getNotice, update } from '../../../api/notice'; + import { getNotice, update,confirm } from '../../../api/notice'; import dia from './dialog.vue'; import tabBar from '../tabBarIndex.vue' export default { @@ -116,13 +124,16 @@ showDialog: false, data: { pageIndex: 1, - pageSize: 10000000, + pageSize: 10, searchParams: { emergType: null,//1-紧急;2-常规 warningLevel: null,//1-红色预警;2-橙色预警;3-黄色预警;4-蓝色预警 readStatus: null//0-未读,1-已读 } }, + total: 0, + scrollTop: 0, + loading: false, buttons: [{ label: 'red', name: '红' @@ -152,6 +163,7 @@ } }, onShow () { + this.data.pageIndex = 1 this.tabBarLists = uni.getStorageSync('tabBarList'); this.user.name = uni.getStorageSync('user').realName; this.getNoticeList(); @@ -165,28 +177,50 @@ // uni.startPullDownRefresh(); }, methods: { + loginOut() { + uni.clearStorageSync(); + uni.clearStorage(); + uni.navigateTo({ + url: '/pages/index/index' + }) + }, getNoticeList() { - this.data.searchParams.readStatus = this.isReadOnly ? 0 : null; + this.loading = true + this.noSpeak = 0; + // this.data.searchParams.readStatus = this.isReadOnly ? 0 : null; + this.data.searchParams.readStatus = null; this.data.searchParams.emergType = this.checked ? 1 : null ; this.data.searchParams.warningLevel = this.selectedSaleAnalysis =='all' ? null : this.selectedSaleAnalysis =='red' ? 1 : this.selectedSaleAnalysis =='orange' ? 2: this.selectedSaleAnalysis =='yellow'? 3 : 4; getNotice(this.data).then(res => { if (res.code == 100) { - this.noticeList = res.data ? res.data : []; + // this.noticeList = res.data ? res.data : []; + let list = res.data?res.data: []; + if (res.pageIndex != 1) { + this.noticeList = this.noticeList.concat(list) + } else { + this.noticeList = list; + } + this.total = res.total this.noticeListCopy = this.noticeList; if (this.noticeList.length > 0) { this.noticeList.forEach((item, index) => { - if(item.readStatus == 0){ + if(item.responseStatus == 1){ this.noSpeak++; } - this.noticeList[index].isRead = item.readStatus == 1 ? true : false; + this.noticeList[index].isResponse = item.responseStatus == 2 ? true : false; this.noticeList[index].colorContent = item.warningLevel == 1 ? '红色预警': item.warningLevel == 2 ? '橙色预警': item.warningLevel == 3 ? '黄色预警':'蓝色预警'; this.noticeList[index].buttonContent = item.responseStatus == 1 ? '待叫应': item.responseStatus == 2 ? '已叫应' : '超时未叫应'; }); } - } + }else{ + uni.$u.toast(res.msg) + } + this.loading = false + }).catch(err=>{ }) }, handleButtonClick(button) { + this.data.pageIndex = 1 this.selectedSaleAnalysis = button.label; this.getNoticeList(); }, @@ -202,15 +236,17 @@ toDetail(item) { console.log("item",item) //改为修改叫应状态 - if (item.readStatus === 0) { - this.updateReadStatus(item); + if (item.responseStatus === 1) { + this.updateResponseStatus(item); } + uni.setStorageSync('fdetailData', item); + uni.setStorageSync('backFlag','notice'); uni.navigateTo({ url: `/pages/tabBar/notice/detail?data=` + encodeURIComponent(JSON.stringify(item)) }) }, - updateReadStatus(item) { - update({id: item.id}).then(res => {}); + updateResponseStatus(item) { + confirm({id: item.id}).then(res => {}); }, openDialog(item){ this.$refs.showDialog.id = item.id; @@ -221,14 +257,14 @@ console.log("触发close") this.getNoticeList(); }, - loginOut() { - uni.removeStorageSync('tk'); - uni.removeStorageSync('uid'); - uni.removeStorageSync('user'); - uni.navigateTo({ - url: `/pages/index/index` - }) - }, + // loginOut() { + // uni.removeStorageSync('tk'); + // uni.removeStorageSync('uid'); + // uni.removeStorageSync('user'); + // uni.navigateTo({ + // url: `/pages/index/index` + // }) + // }, //下拉刷新 onPullDownRefresh() { console.log('refresh'); @@ -237,9 +273,28 @@ this.getNoticeList(); }, 1000); }, + + upper: function(e) { + // console.log(e) + }, + lower: function(e) { + if (this.data.pageIndex * this.data.pageSize >= this.total){ + // uni.$u.toast('已加载全部数据') + return + } + //并且让页码+1,调用获取数据的方法获取第二页数据 + this.data.pageIndex++ + //此处调用自己获取数据列表的方法 + this.getNoticeList() + }, + scroll: function(e) { + // console.log(e) + }, + clickSwitch(e) { + this.data.pageIndex = 1 this.getNoticeList(); - } + }, } } </script> @@ -269,7 +324,7 @@ box-shadow: 0 3px 12px rgba(0,0,0,0.05); } .barText{ - /* margin-left: 20px; */ + margin-left: 35px; text-align: center; width: 85%; font-size: 16px; @@ -308,7 +363,7 @@ .listHead{ display: flex; align-items: center; - justify-content: space-between; + justify-content: flex-end; } } @@ -379,7 +434,7 @@ .noticeList{ margin-top: 12px; - height: calc(100vh - 266px); + height: calc(100vh - 286px); overflow: hidden; overflow-y: scroll; } @@ -387,10 +442,13 @@ .listContent{ display: flex; flex-direction: column; + width: calc(100% - 24px); margin: 0 12px; background: #fff; border-radius: 5px; box-shadow: 0 3px 12px rgba(0,0,0,0.05); + height: 100%; + // margin-bottom: 30px; } .itemContent{ font-size: 16px; @@ -399,15 +457,22 @@ padding: 0 12px 15px; border-bottom: 1px solid #ebebeb; - &:last-of-type{ - border-bottom: none; - } + //&:last-of-type{ + // border-bottom: none; + //} } .content{ text-overflow: ellipsis; overflow: hidden; white-space: nowrap; + view{ + font-size: 14px; + color: #666; + text-overflow: ellipsis; + overflow: hidden; + white-space: nowrap; + } } .contentNoRead{ font-size: 14px; -- Gitblit v1.9.2