394 lines
		
	
	
		
			10 KiB
		
	
	
	
		
			Vue
		
	
	
			
		
		
	
	
			394 lines
		
	
	
		
			10 KiB
		
	
	
	
		
			Vue
		
	
	
| <template>
 | ||
| 	<view>
 | ||
| 		<cu-custom bgColor="bg-gradual-blueness">
 | ||
| 			<block slot="content">通知公告</block>
 | ||
| 		</cu-custom>
 | ||
|     <view class="top-fixed">
 | ||
|       <scroll-view scroll-x class="bg-white nav" scroll-with-animation :scroll-left="scrollLeft">
 | ||
|         <view class="flex text-center">
 | ||
|           <view class="cu-item flex-sub" :class="index==TabCur?'text-blue cur':''" v-for="(item,index) in tabNav" :key="index" @tap="tabSelect" :data-id="index">
 | ||
|             {{tabNav[index]}}
 | ||
|           </view>
 | ||
|         </view>
 | ||
|       </scroll-view>
 | ||
|       <view class="cu-bar search bg-white">
 | ||
|         <view class="search-form radius">
 | ||
|           <text class="cuIcon-search"></text>
 | ||
|           <input  v-model="KEYWORDS" placeholder="请输入关键字"></input>
 | ||
|         </view>
 | ||
|         <view class="action">
 | ||
|           <button class="cu-btn bg-green shadow-blur radius" @click="getQuery()">搜索</button>
 | ||
|         </view>
 | ||
|       </view>
 | ||
|       <view class="line"></view>
 | ||
|     </view>
 | ||
| 
 | ||
| 		<block v-if="TabCur==0">
 | ||
|       <view class="select-fixed top-fixed">
 | ||
|         <view class="cu-bar search bg-white">
 | ||
|           <view class="search-form radius" style="margin-left: 0;">
 | ||
|             <text class="cuIcon-search"></text>
 | ||
|             <input @input="InputBlur" placeholder="请输入关键字"
 | ||
|                    confirm-type="search"></input>
 | ||
| 
 | ||
|           </view>
 | ||
|           <view class="action">
 | ||
|             <button class="cu-btn bg-green shadow-blur radius" @click="getQuery">搜索</button>
 | ||
|           </view>
 | ||
|         </view>
 | ||
|         <view class="line"></view>
 | ||
|       </view>
 | ||
| 			<scroll-view class="dy-scroll-nobg"  scroll-y :style="'top:'+sTop+'px;height:calc(100vh - '+totalHeight+'px)'">
 | ||
| 				<view v-if="list.length>0" >
 | ||
| 					<view class="news-list">
 | ||
| 						<view class="news-item"  v-for="item in list" :key="item.NOTICE_ID" @click="$noMultipleClicks(goToDetail,item.NOTICE_ID)">
 | ||
| 							<view class="news-media-list">
 | ||
| 		<!--						<image src="https://ossweb-img.qq.com/images/lol/web201310/skin/big10006.jpg" mode="aspectFill" class="news-media-logo"></image>-->
 | ||
| 								<view class="news-media-body">
 | ||
| 									<view class="news-media-title">
 | ||
| 										{{item.SYNOPSIS}}
 | ||
| 									</view>
 | ||
| 									<view class="news-media-text">
 | ||
| 		<!--								<text>新泰安全</text>-->
 | ||
| 										<text>{{item.CREATTIME}}</text>
 | ||
| 									</view>
 | ||
| 								</view>
 | ||
| 							</view>
 | ||
| 						</view>
 | ||
| 					</view>
 | ||
| 				</view>
 | ||
| 				<view v-else-if="dataFlag=='noData'" class="dy-null">
 | ||
| 				    <view class="dy-null-img">
 | ||
| 						<image src="../../static/null.png" mode=""></image>
 | ||
| 				    </view>
 | ||
| 				    <view class="dy-null-title">
 | ||
| 						暂无数据
 | ||
| 				    </view>
 | ||
| 				</view>
 | ||
| 				<view class="cu-tabbar-height"></view>
 | ||
| 			</scroll-view>
 | ||
| 		</block>
 | ||
| 		<block v-if="TabCur==1">
 | ||
| 			<scroll-view class="dy-scroll-nobg"  scroll-y :style="'top:'+sTop+'px;height:calc(100vh - '+totalHeight+'px)'">
 | ||
| 				<view v-if="pclist.length>0" >
 | ||
| 					<view class="news-list">
 | ||
| 						<view class="news-item"  v-for="item in pclist" :key="item.NOTICECORP_ID" >
 | ||
| 							<view class="news-media-list">
 | ||
| 								<view class="news-media-body">
 | ||
| 									<view class="news-media-title" @click="$noMultipleClicks(goToPcDetail,item.NOTICECORPUSERID_ID)">
 | ||
| 										{{item.SYNOPSIS}}
 | ||
| 										<text style="float:right;">
 | ||
| 											<template v-if="item.TYPE=='0'">未读</template>
 | ||
| 											<template v-else-if="item.TYPE=='1'">已读</template>
 | ||
| 										</text>
 | ||
| 									</view>
 | ||
| 									<view class="news-media-text">
 | ||
| 										<text>{{item.CREATTIME}}</text>
 | ||
| 										<view  v-if="item.TYPE=='1'" style="float:right;">
 | ||
| 										  <button class="cu-btn round bg-red" style="height:40upx;" @click="deleteNotice(item.NOTICECORPUSERID_ID)">删除</button>
 | ||
| 										</view>
 | ||
| 									</view>
 | ||
| 								</view>
 | ||
| 							</view>
 | ||
| 						</view>
 | ||
| 					</view>
 | ||
| 				</view>
 | ||
| 				<view v-else-if="dataFlag=='noData'" class="dy-null">
 | ||
| 				    <view class="dy-null-img">
 | ||
| 						<image src="../../static/null.png" mode=""></image>
 | ||
| 				    </view>
 | ||
| 				    <view class="dy-null-title">
 | ||
| 						暂无数据
 | ||
| 				    </view>
 | ||
| 				</view>
 | ||
| 				<view class="cu-tabbar-height"></view>
 | ||
| 			</scroll-view>
 | ||
| 		</block>
 | ||
| 	</view>
 | ||
| </template>
 | ||
| 
 | ||
| <script>
 | ||
| 	import {
 | ||
| 		basePath,corpinfoId,loginUserId,loginUser
 | ||
| 	} from '@/common/tool.js';
 | ||
| 	export default {
 | ||
| 		data() {
 | ||
| 			return {
 | ||
| 				dataFlag:'noData',
 | ||
| 				background:{"url":""},
 | ||
| 				sTop:0,
 | ||
| 				totalHeight:0,
 | ||
| 				TabCur: 0,
 | ||
| 				scrollLeft: 0,
 | ||
| 				tabNav: ['平台公告', '企业公告'],
 | ||
| 				noClick:true,
 | ||
|         		KEYWORDS:'',
 | ||
| 				list: [],
 | ||
| 				pclist: [],
 | ||
| 				page:1,//分页参数--页数
 | ||
| 				rows:10,//分页参数--每页数据条数
 | ||
| 				totalCount:0,//分页参数--初始化页数
 | ||
| 				isEnd:false,//防止多次刷新
 | ||
| 				totalPage:0,//分页参数--分页数量
 | ||
| 				showCount :-1,
 | ||
| 				currentPage:1,
 | ||
| 				tabCur :0,
 | ||
| 
 | ||
| 			}
 | ||
| 		},
 | ||
| 		mounted(e){
 | ||
| 
 | ||
| 			this.getData();
 | ||
| 			let that=this;
 | ||
| 			let CustomBar = this.CustomBar;
 | ||
| 			uni.getSystemInfo({ //调用uni-app接口获取屏幕高度
 | ||
| 				success(res) { //成功回调函数
 | ||
| 					let titleH=uni.createSelectorQuery().select(".top-fixed"); //想要获取高度的元素名(class/id)
 | ||
| 					titleH.boundingClientRect(data=>{
 | ||
| 						that._data.sTop=data.height  //计算高度:元素高度=窗口高度-元素距离顶部的距离(data.top)
 | ||
| 						that.totalHeight = data.height+CustomBar
 | ||
| 					}).exec()
 | ||
| 				}
 | ||
| 			})
 | ||
| 		},
 | ||
| 		// 滑动到底方法
 | ||
| 		scrolltolower(){
 | ||
| 			var _this = this;
 | ||
| 			_this.showCount = -1;
 | ||
| 			_this.currentPage = _this.currentPage + 1;
 | ||
| 			_this.isEnd = false;
 | ||
| 			if("0"==_this.TabCur ){
 | ||
| 				if(_this.totalPage >= _this.currentPage){
 | ||
| 					_this.getDate();//开始分页查询
 | ||
| 				}
 | ||
| 			}
 | ||
| 			if ("1"==_this.TabCur){
 | ||
| 				if(_this.totalPage >= _this.currentPage){
 | ||
| 					_this.getPcData();//开始分页查询
 | ||
| 				}
 | ||
| 			}
 | ||
| 
 | ||
| 		},
 | ||
| 		onReady() {
 | ||
| 		},
 | ||
| 		methods: {
 | ||
| 			tabSelect(e) {
 | ||
| 				this.TabCur = e.currentTarget.dataset.id;
 | ||
| 				this.scrollLeft = (e.currentTarget.dataset.id - 1) * 60;
 | ||
| 				if("1" ==this.TabCur){
 | ||
| 					this.getPcData();
 | ||
| 				}
 | ||
| 				if("0" == this.TabCur){
 | ||
| 					this.getData();
 | ||
| 				}
 | ||
| 			},
 | ||
| 			  getQuery() { //搜索按钮事件
 | ||
| 				var _this = this;
 | ||
| 				if(_this.TabCur == 0){
 | ||
| 				  _this.getData();
 | ||
| 				}else{
 | ||
| 				  _this.getPcData();
 | ||
| 				}
 | ||
| 
 | ||
| 			  },
 | ||
| 			getData() {
 | ||
| 				var _this = this;
 | ||
| 				uni.showLoading({
 | ||
| 					title: '请稍候'
 | ||
| 				})
 | ||
| 				uni.request({
 | ||
| 					url: basePath + '/app/notice/list',
 | ||
| 					method: 'POST',
 | ||
| 					dataType: 'json',
 | ||
| 					header: {
 | ||
| 						'Content-type':'application/x-www-form-urlencoded'
 | ||
| 					},
 | ||
| 					data: {
 | ||
| 						showCount : _this.showCount,
 | ||
| 						currentPage : _this.currentPage,
 | ||
|             			KEYWORDS:_this.KEYWORDS,
 | ||
| 						corpinfoId :corpinfoId,
 | ||
| 						CORPINFO_ID:loginUser.CORPINFO_ID,
 | ||
| 						USER_ID:loginUser.USER_ID,
 | ||
| 					},
 | ||
| 					success: (res) => {
 | ||
| 						if("success" == res.data.result){
 | ||
| 							uni.hideLoading();
 | ||
| 							_this.list = res.data.varList;
 | ||
| 							console.log(res.data.varList)
 | ||
| 						} else {
 | ||
| 							uni.showToast({
 | ||
| 								title: res.data.message,
 | ||
| 								duration: 2000
 | ||
| 							});
 | ||
| 						}
 | ||
| 					}
 | ||
| 				});
 | ||
| 			},
 | ||
| 
 | ||
| 			getPcData() {
 | ||
| 				var _this = this;
 | ||
| 				uni.showLoading({
 | ||
| 					title: '请稍候'
 | ||
| 				})
 | ||
| 				uni.request({
 | ||
| 					url: basePath + '/app/notice/listForCp',
 | ||
| 					method: 'POST',
 | ||
| 					dataType: 'json',
 | ||
| 					header: {
 | ||
| 						'Content-type':'application/x-www-form-urlencoded'
 | ||
| 					},
 | ||
| 					data: {
 | ||
| 						showCount : _this.showCount,
 | ||
| 						currentPage : _this.currentPage,
 | ||
|             			KEYWORDS:_this.KEYWORDS,
 | ||
| 						loginUserId :loginUserId,
 | ||
| 						CORPINFO_ID:loginUser.CORPINFO_ID,
 | ||
| 						USER_ID:loginUser.USER_ID,
 | ||
| 					},
 | ||
| 					success: (res) => {
 | ||
| 						if("success" == res.data.result){
 | ||
| 							uni.hideLoading();
 | ||
| 							_this.pclist = res.data.varList;
 | ||
| 							console.log(res.data.varList)
 | ||
| 						} else {
 | ||
| 							uni.showToast({
 | ||
| 								title: res.data.message,
 | ||
| 								duration: 2000
 | ||
| 							});
 | ||
| 						}
 | ||
| 					}
 | ||
| 				});
 | ||
| 			},
 | ||
| 			//跳转事件
 | ||
| 			goToDetail(e) {
 | ||
| 				uni.navigateTo({
 | ||
| 					url: '/pages/news/news-list-detail?id='+e+'&type=0',
 | ||
| 				});
 | ||
| 			},
 | ||
| 			goToPcDetail(e){
 | ||
| 				uni.navigateTo({
 | ||
| 					url: '/pages/news/news-list-detail?id='+e+'&type=1',
 | ||
| 				});
 | ||
| 			},
 | ||
|       deleteNotice(ID){
 | ||
|         var _this = this;
 | ||
|         uni.showModal({
 | ||
|           title: '',
 | ||
|           content: '确定要删除这条记录?',
 | ||
|           cancelColor:"#000000",
 | ||
|           cancelText: '取消',
 | ||
|           confirmText: '确定',
 | ||
|           success: res => {
 | ||
|             if (res.confirm) {
 | ||
|               uni.showLoading({
 | ||
|                 title: '处理中'
 | ||
|               })
 | ||
|               uni.request({
 | ||
|                 url: basePath+'/app/notice/delete',
 | ||
|                 method: 'POST',
 | ||
|                 dataType: 'json',
 | ||
|                 header: {
 | ||
|                   'Content-type':'application/x-www-form-urlencoded'
 | ||
|                 },
 | ||
|                 data: {
 | ||
|                   NOTICECORPUSERID_ID: ID
 | ||
|                 },
 | ||
|                 success: (res) => {
 | ||
|                   uni.hideLoading();
 | ||
|                   uni.showToast({
 | ||
|                     icon: 'none',
 | ||
|                     title: '删除成功',
 | ||
|                     duration: 1500
 | ||
|                   });
 | ||
|                   _this.getQuery()
 | ||
|                 },
 | ||
|                 fail: (err) => {
 | ||
|                   uni.hideLoading();
 | ||
|                   uni.showModal({
 | ||
|                     content: err.errMsg,
 | ||
|                     showCancel: false
 | ||
|                   });
 | ||
|                 }
 | ||
|               })
 | ||
|             }
 | ||
|           }
 | ||
|         })
 | ||
|       }
 | ||
| 		}
 | ||
| 	}
 | ||
| </script>
 | ||
| 
 | ||
| <style>
 | ||
| 	.news-list {
 | ||
| 		background-color: #FFFFFF;
 | ||
| 		position: relative;
 | ||
| 		width: 100%;
 | ||
| 	}
 | ||
| 
 | ||
| 	.news-item {
 | ||
| 		display: flex;
 | ||
| 		position: relative;
 | ||
| 		flex-direction: row;
 | ||
| 		align-items: center;
 | ||
| 	}
 | ||
| 
 | ||
| 	.news-media-list {
 | ||
| 		padding: 11px 15px;
 | ||
| 		display: flex;
 | ||
| 		width: 100%;
 | ||
| 		flex-direction: row;
 | ||
| 	}
 | ||
| 
 | ||
| 	.news-media-logo {
 | ||
| 		width: 90px;
 | ||
| 		height: 70px;
 | ||
| 		margin-right: 10px;
 | ||
| 		overflow: hidden;
 | ||
| 		position: relative;
 | ||
| 
 | ||
| 	}
 | ||
| 
 | ||
| 	.news-media-body {
 | ||
| 		display: flex;
 | ||
| 		flex-direction: column;
 | ||
| 		justify-content: space-between;
 | ||
| 		flex: 1;
 | ||
| 
 | ||
| 	}
 | ||
| 
 | ||
| 	.news-media-title {
 | ||
| 		height: 37px;
 | ||
| 		font-size: 14px;
 | ||
| 		overflow: hidden;
 | ||
| 		width: 100%;
 | ||
| 		line-height: 18px;
 | ||
| 		display: -webkit-box;
 | ||
| 		-webkit-box-orient: vertical;
 | ||
| 		-webkit-line-clamp: 2;
 | ||
| 	}
 | ||
| 
 | ||
| 	.news-item::after {
 | ||
| 		position: absolute;
 | ||
| 		z-index: 3;
 | ||
| 		right: 0;
 | ||
| 		bottom: 0;
 | ||
| 		left: 15px;
 | ||
| 		height: 1px;
 | ||
| 		content: '';
 | ||
| 		-webkit-transform: scaleY(.5);
 | ||
| 		transform: scaleY(.5);
 | ||
| 		background-color: #c8c7cc;
 | ||
| 	}
 | ||
| 
 | ||
| 	.news-media-text {
 | ||
| 		display: flex;
 | ||
| 		flex-direction: row;
 | ||
| 		justify-content: space-between;
 | ||
| 		width: 100%;
 | ||
| 		line-height: 15px;
 | ||
| 		font-size: 13px;
 | ||
| 		color: #8f8f94;
 | ||
| 	}
 | ||
| </style>
 |