1747191978@qq.com
4 months ago
1 changed files with 303 additions and 0 deletions
@ -0,0 +1,303 @@ |
|||||
|
<template> |
||||
|
<view class="box" style="position: relative;"> |
||||
|
<!-- <image class="back" src='../../imgs/back.png' mode="widthFix" @click="handleBack"></image> --> |
||||
|
<image class="logo" src='../../imgs/logo.png' mode="widthFix" ></image> |
||||
|
<view class="box-cent"> |
||||
|
<view class="box-cent1"> |
||||
|
<view class="view-pdf"> |
||||
|
<pdf v-for="i in numPages" :key="i" :src="filePdfUrl" :page="i"></pdf> |
||||
|
</view> |
||||
|
</view> |
||||
|
<u-modal v-if="show" :show="show" @cancel="show = false" :showCancelButton="true" content='是否确认退出登录？' @confirm="handleOut"></u-modal> |
||||
|
</view> |
||||
|
<!-- 底部背景图 --> |
||||
|
<view class="view-backimg"> |
||||
|
<view class="view-backimg-top"></view> |
||||
|
<!-- <view class="view-backimg-bottom"></view> --> |
||||
|
</view> |
||||
|
<!-- <div class="tools"> |
||||
|
<view style="width:50vw;display: flex;margin: auto;"> |
||||
|
<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> |
||||
|
</view> |
||||
|
</div> --> |
||||
|
<!-- 头像 - 头像 --> |
||||
|
<view class="avatarobx"> |
||||
|
<view class="name">{{userName}}</view> |
||||
|
<image @click='handleBack' class="avatar" src='../../imgs/arrow-left.png' mode="widthFix"></image> |
||||
|
<image @click="show = true" class="avatar" src='../../imgs/out.png' mode="widthFix"></image> |
||||
|
</view> |
||||
|
</view> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
import pdf from 'vue-pdf' |
||||
|
export default { |
||||
|
name: 'MeetingList', |
||||
|
props: ['infos'], |
||||
|
components: { |
||||
|
pdf |
||||
|
}, |
||||
|
data() { |
||||
|
return { |
||||
|
filePdfUrl: '', |
||||
|
userName: uni.getStorageSync("userName"), |
||||
|
detailsId:'', |
||||
|
numPages:'', |
||||
|
show:false |
||||
|
}; |
||||
|
}, |
||||
|
created() { |
||||
|
let routes = getCurrentPages(); // 获取当前打开过的页面路由数组 |
||||
|
let curParam = routes[routes.length - 1].options; //获取路由参数 |
||||
|
this.detailsId = curParam.detailsId |
||||
|
this.filePdfUrl = curParam.filePdfUrl |
||||
|
this.getNumPages(this.filePdfUrl ) |
||||
|
}, |
||||
|
methods: { |
||||
|
getNumPages(url) { |
||||
|
this.pdfSrc=url |
||||
|
this.pdfSrc = pdf.createLoadingTask(this.pdfSrc) |
||||
|
this.pdfSrc.promise.then(pdf => { |
||||
|
this.numPages = pdf.numPages |
||||
|
console.log('this.numPages',this.numPages) |
||||
|
}) |
||||
|
}, |
||||
|
// logo 回到首页 |
||||
|
handleBack() { |
||||
|
uni.navigateTo({ |
||||
|
url: `/pages/index/details?id=${this.detailsId}`, |
||||
|
}); |
||||
|
// uni.navigateBack({ |
||||
|
// delta: 1 |
||||
|
// }); |
||||
|
}, |
||||
|
// 退出登录 |
||||
|
handleOut() { |
||||
|
uni.clearStorage(); |
||||
|
uni.reLaunch({ |
||||
|
url: '/pages/user/login', |
||||
|
}); |
||||
|
}, |
||||
|
// logo 回到首页 |
||||
|
handleLogo() { |
||||
|
uni.navigateTo({ |
||||
|
url: `/pages/index/index`, |
||||
|
}); |
||||
|
}, |
||||
|
|
||||
|
// 关闭弹窗 |
||||
|
handleClose() { |
||||
|
this.pdfId = '' |
||||
|
this.show = false |
||||
|
}, |
||||
|
// 上一页函数， |
||||
|
prePage() { |
||||
|
var page = this.pageNum |
||||
|
page = page > 1 ? page - 1 : this.pageTotalNum |
||||
|
this.pageNum = page |
||||
|
}, |
||||
|
// 下一页函数 |
||||
|
nextPage() { |
||||
|
var page = this.pageNum |
||||
|
page = page < this.pageTotalNum ? page + 1 : 1 |
||||
|
this.pageNum = page |
||||
|
}, |
||||
|
// 页面加载回调函数，其中e为当前页数 |
||||
|
pageLoaded(e) { |
||||
|
this.curPageNum = e |
||||
|
}, |
||||
|
// 其他的一些回调函数。 |
||||
|
pdfError(error) { |
||||
|
console.error(error) |
||||
|
}, |
||||
|
}, |
||||
|
// 页面显示调用接口 |
||||
|
onLoad() {}, |
||||
|
}; |
||||
|
</script> |
||||
|
|
||||
|
<style lang="scss" scoped> |
||||
|
/deep/ .u-modal__content{ |
||||
|
text-align: center; |
||||
|
} |
||||
|
.popup-close { |
||||
|
position: fixed; |
||||
|
right: 20px; |
||||
|
top: 20px; |
||||
|
z-index: 9999; |
||||
|
|
||||
|
/deep/.uni-icons { |
||||
|
font-size: 40px !important; |
||||
|
color: #fff !important; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.view-gb { |
||||
|
max-width: 100px; |
||||
|
margin-left: 16px; |
||||
|
} |
||||
|
|
||||
|
.view-li { |
||||
|
// padding-left: 10px; |
||||
|
} |
||||
|
|
||||
|
.view-pdf { |
||||
|
width: 60vw; |
||||
|
margin: auto; |
||||
|
} |
||||
|
|
||||
|
.tools { |
||||
|
display: flex; |
||||
|
align-items: center; |
||||
|
position: absolute; |
||||
|
bottom: 26px; |
||||
|
left:16px; |
||||
|
right:16px; |
||||
|
|
||||
|
uni-button { |
||||
|
font-size: 18px; |
||||
|
line-height: 44px; |
||||
|
height: 44px; |
||||
|
flex: 1 |
||||
|
} |
||||
|
|
||||
|
.page { |
||||
|
line-height: 44px; |
||||
|
height: 44px; |
||||
|
width: 100px; |
||||
|
text-align: center; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.pathsName { |
||||
|
color: #fff; |
||||
|
font-size: 12px; |
||||
|
} |
||||
|
|
||||
|
.pdfBox .el-button { |
||||
|
background: rgba(255, 255, 255, 0); |
||||
|
border: none; |
||||
|
/* width: 30px; */ |
||||
|
} |
||||
|
|
||||
|
.pdfBox>>>.el-icon-arrow-left, |
||||
|
.pdfBox>>>.el-icon-arrow-right { |
||||
|
font-size: 18px; |
||||
|
color: #000; |
||||
|
} |
||||
|
|
||||
|
.pdfBox .page { |
||||
|
margin: 0 10px; |
||||
|
} |
||||
|
|
||||
|
.pdfBox .el-button-group { |
||||
|
width: 100%; |
||||
|
justify-content: center; |
||||
|
display: flex; |
||||
|
align-items: center; |
||||
|
padding-top: 20px; |
||||
|
} |
||||
|
|
||||
|
.pdfBox { |
||||
|
padding-bottom: 20px; |
||||
|
margin-top: 20px; |
||||
|
background: #fff; |
||||
|
min-height: 300px; |
||||
|
} |
||||
|
|
||||
|
.contLeft-pane>>>.el-form-item__label { |
||||
|
text-align: right; |
||||
|
margin-right: 10px !important; |
||||
|
padding: 0 !important; |
||||
|
} |
||||
|
|
||||
|
.contLeft-pane>>>.el-form-item--medium .el-form-item__content { |
||||
|
flex: 1; |
||||
|
} |
||||
|
|
||||
|
.li-item { |
||||
|
uni-view { |
||||
|
font-size: 20px; |
||||
|
line-height: 40px; |
||||
|
|
||||
|
span { |
||||
|
font-size: 20px; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
|
||||
|
.li-title { |
||||
|
font-size: 20px; |
||||
|
font-weight: bold; |
||||
|
line-height: 30px; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.view-box { |
||||
|
margin-top: 50px; |
||||
|
} |
||||
|
|
||||
|
.view-none { |
||||
|
height: 100%; |
||||
|
display: flex; |
||||
|
justify-content: center; |
||||
|
align-items: center; |
||||
|
font-size: 40px !important; |
||||
|
} |
||||
|
|
||||
|
.view-ul { |
||||
|
text-align: left; |
||||
|
margin-bottom: 16px; |
||||
|
|
||||
|
.view-li { |
||||
|
span { |
||||
|
font-size: 20px; |
||||
|
line-height: 40px; |
||||
|
} |
||||
|
|
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.view-title { |
||||
|
display: inline-block; |
||||
|
border: 1px solid #000; |
||||
|
padding: 0 14px; |
||||
|
margin-bottom: 30px; |
||||
|
line-height: 50px; |
||||
|
border-radius: 6px; |
||||
|
font-size: 20px; |
||||
|
font-weight: bold; |
||||
|
} |
||||
|
|
||||
|
.box { |
||||
|
height: 100vh; |
||||
|
background-size: cover; |
||||
|
box-sizing: border-box; |
||||
|
padding: 20px 100px; |
||||
|
display: flex; |
||||
|
flex-direction: column; |
||||
|
|
||||
|
.box-cent { |
||||
|
flex: 1; |
||||
|
margin-top: 70px; |
||||
|
position: relative; |
||||
|
} |
||||
|
|
||||
|
.box-cent1 { |
||||
|
position: absolute; |
||||
|
top: 0; |
||||
|
bottom: 0; |
||||
|
left: 0; |
||||
|
right: 0; |
||||
|
overflow: auto; |
||||
|
|
||||
|
} |
||||
|
} |
||||
|
</style> |
||||
|
<style></style> |
||||
Loading…
Reference in new issue