83 lines
1.8 KiB
Vue
83 lines
1.8 KiB
Vue
<template>
|
|
<view>
|
|
<!-- 头部 -->
|
|
<status-nav :ifReturn="false" navBarTitle="GPS" :marginBottom="0"></status-nav>
|
|
<!-- 背景 -->
|
|
<view class="gps-content-bg border-box" :style="{height:screenHeight-statusHeight-50+'px'}">
|
|
<image src="/static/public/gps-bg.jpg" mode="heightFix"></image>
|
|
</view>
|
|
<!-- 二维码 -->
|
|
<view class="gps-code">
|
|
<view class="tips font30">
|
|
<text>
|
|
查询物流实时状态
|
|
请常按识别下方二维码
|
|
</text>
|
|
</view>
|
|
<image :show-menu-by-longpress="true" src="/static/public/gps-code.jpg" mode="widthFix" @click="previewImage"></image>
|
|
</view>
|
|
<!-- 尾部 -->
|
|
<foot-tab :current="2"></foot-tab>
|
|
</view>
|
|
</template>
|
|
<script>
|
|
export default {
|
|
data() {
|
|
return {
|
|
screenHeight:uni.getSystemInfoSync().screenHeight,
|
|
statusHeight:uni.getSystemInfoSync().statusBarHeight,
|
|
}
|
|
},
|
|
onLoad(op) {
|
|
|
|
},
|
|
methods: {
|
|
previewImage() {
|
|
uni.previewImage({
|
|
// 需要预览的图片链接列表
|
|
urls: [],
|
|
// 为当前显示图片的链接/索引值
|
|
current: '/static/public/gps-code.jpg',
|
|
// 图片指示器样式
|
|
indicator:'default',
|
|
// 是否可循环预览
|
|
loop:false,
|
|
// 长按图片显示操作菜单，如不填默认为保存相册
|
|
success: res => {
|
|
console.log('res', res);
|
|
},
|
|
fail: err => {
|
|
console.log('err', err);
|
|
}
|
|
});
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
<style scoped>
|
|
.gps-content-bg{
|
|
width: 100%;
|
|
padding-bottom: 98rpx;
|
|
}
|
|
.gps-content-bg>image{
|
|
min-width: 100%;
|
|
min-height: 100%;
|
|
}
|
|
.gps-code{
|
|
width: 500rpx;
|
|
position: fixed;
|
|
left: 50%;
|
|
top: 50%;
|
|
transform: translate(-50%,-55%);
|
|
}
|
|
.gps-code .tips{
|
|
line-height: 1.6;
|
|
color: #ffffff;
|
|
text-align: center;
|
|
margin-bottom: 60rpx;
|
|
}
|
|
.gps-code>image{
|
|
width: 100%;
|
|
border-radius: .02rem;
|
|
}
|
|
</style> |