pdf改为弹窗

大唐会议前台1/pages/components/MeetingList.vue

@@ -6,24 +6,6 @@
 			</view>
 			<view class="li-item " v-if="item.type == 'file-pdf'">
 				<view class="li-pdf" @click="handlePdf(item)"> {{item.filePdfName}}</view>
-				<view class="view-pdf" v-if="pdfId == item.id">
-					<div class="tools">
-						<button :theme="'default'" type="submit"  @click.stop="prePage" class="mr10">
-							上一页
-						</button>
-						<div class="page">{{pageNum}}/{{pageTotalNum}}</div>
-						<button :theme="'default'" type="submit"  @click.stop="nextPage" class="mr10">
-							下一页
-						</button>
-						<button class="view-gb" :theme="'default'" type="submit"  @click.stop="pdfId = ''">
-							关闭
-						</button>
-					</div>
-					<pdf ref="pdf" :page="pageNum" @progress="loadedRatio = $event" @page-loaded="pageLoaded($event)"
-						@num-pages="pageTotalNum=$event" @error="pdfError($event)" @link-clicked="page = $event"
-						:src="item.filePdfUrl">
-					</pdf>
-				</view>
 			</view>
 			<view class="li-item" v-if="item.type == 'richtext'">
 				<view class="li-text">{{item.richtext}}</view>
@@ -32,6 +14,27 @@
 				<MeetingList :infos='item.infos'></MeetingList>
 			</view>
 		</view>
+		<u-popup :show="show" @close="close" mode="center">
+			<view class="view-pdf" >
+				
+				<pdf v-if='show' ref="pdf" :page="pageNum" @progress="loadedRatio = $event" @page-loaded="pageLoaded($event)"
+					@num-pages="pageTotalNum=$event" @error="pdfError($event)" @link-clicked="page = $event"
+					:src="filePdfUrl">
+				</pdf>
+				<div class="tools">
+					<button :theme="'default'" type="submit" @click.stop="prePage" class="mr10">
+						上一页
+					</button>
+					<div class="page">{{pageNum}}/{{pageTotalNum}}</div>
+					<button :theme="'default'" type="submit" @click.stop="nextPage" class="mr10">
+						下一页
+					</button>
+					<button class="view-gb" :theme="'default'" type="submit" @click.stop="show = false">
+						关闭
+					</button>
+				</div>
+			</view>
+		</u-popup>
 	</view>
 </template>
 
@@ -45,7 +48,8 @@
 		},
 		data() {
 			return {
-				url: "http://storage.xuetangx.com/public_assets/xuetangx/PDF/PlayerAPI_v1.0.6.pdf",
+				show:false,
+				filePdfUrl: "",
 				pageNum: 1,
 				pageTotalNum: 1,
 				// 加载进度
@@ -58,6 +62,12 @@
 			console.log('infos', infos)
 		},
 		methods: {
+			
+			// 关闭弹窗
+			handleClose(){
+				this.pdfId = ''
+				this.show = false
+			},
 			// 上一页函数，
 			prePage() {
 				var page = this.pageNum
@@ -80,7 +90,8 @@
 			},
 			// 显示pdf
 			handlePdf(_item) {
-				this.pdfId = _item.id
+				this.filePdfUrl = _item.filePdfUrl
+				this.show = true
 			},
 		},
 		// 页面显示调用接口
@@ -89,27 +100,32 @@
 </script>
 
 <style lang="scss" scoped>
-	.view-gb{
-		max-width:100px;
+	.view-gb {
+		max-width: 100px;
 		margin-left: 16px;
 	}
-	.view-li{
+
+	.view-li {
 		padding-left: 10px;
 	}
+
 	.view-pdf {
 		margin: 16px 0;
 		padding: 16px;
 		border: 1px solid #ededed;
 		background: #fff;
+
 		.tools {
 			display: flex;
-			uni-button{
+
+			uni-button {
 				font-size: 18px;
 				line-height: 44px;
 				height: 44px;
-				flex:1
+				flex: 1
 			}
-			.page{
+
+			.page {
 				line-height: 44px;
 				height: 44px;
 				width: 100px;
@@ -165,7 +181,7 @@
 	}
 
 	.view-pdf {
-		width: 70%;
+		width: 36vw;
 	}
 
 	.li-item {