From 0b2357a173a2bc52f3532bfcf93ff31daf226231 Mon Sep 17 00:00:00 2001
From: zhouwenxuan <1175765986@qq.com>
Date: 星期三, 06 九月 2023 14:44:23 +0800
Subject: [PATCH] 导航栏退出登录

---
 pages/tabBar/notice/notice.vue |  169 +++++++++++++++++++++++++++++++++++++++++---------------
 1 files changed, 124 insertions(+), 45 deletions(-)

diff --git a/pages/tabBar/notice/notice.vue b/pages/tabBar/notice/notice.vue
index c11047e..3c0d15a 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,15 @@
 			toDetail(item) {
 				console.log("item",item)
 				//改为修改叫应状态
-				if (item.readStatus === 0) {
-					this.updateReadStatus(item);
+				if (item.responseStatus === 1) {
+					this.updateResponseStatus(item);
 				}
 				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 +255,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 +271,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 +322,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 +361,7 @@
   .listHead{
     display: flex;
     align-items: center;
-    justify-content: space-between;
+    justify-content: flex-end;
   }
 }
 
@@ -322,7 +375,8 @@
 	height: 30px;
 	border-radius: 5px;
   &.active{
-    border: 1px solid #fff;
+    border: 1px solid rgba(0,0,0,.4);
+    box-shadow: 0 1px 3px rgba(0,0,0,0.1);
   }
 }
 .buttonAll{
@@ -340,21 +394,36 @@
 }
 .all {
 	background-color: rgb(17,204,33);
+  &.active{
+    background-image: linear-gradient(#22992d,#12da23);
+  }
 }
 .active {
 	border: 1.5px solid #8d8d8d;
 }
 .red {
 	background-color: #ff5555;
+  &.active{
+    background:linear-gradient(#dc2f2f, #ff5b5b);
+  }
 }
 .orange {
 	background-color: rgb(251, 158, 13);
+  &.active{
+    background: linear-gradient(#e28e0c,#ffa90e);
+  }
 }
 .yellow {
 	background-color: rgb(255, 223, 37);
+  &.active{
+    background: linear-gradient(#e6c921,#ffef28);
+  }
 }
 .blue {
 	background-color: #409EFF;
+  &.active{
+    background: linear-gradient(#3a8ee6,#44a9ff);
+  }
 }
 .switchBtn{
 	display: flex;
@@ -363,7 +432,7 @@
 
 .noticeList{
   margin-top: 12px;
-  height: calc(100vh - 266px);
+  height: calc(100vh - 286px);
   overflow: hidden;
   overflow-y: scroll;
 }
@@ -371,10 +440,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;
@@ -383,15 +455,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