jeecgBootUniapp/src/pages/onlinePreview/detail.vue

159 lines
3.3 KiB
Vue
Raw Normal View History

2025-05-16 07:04:50 +00:00
<route lang="json5" type="page">
{
layout: 'default',
style: {
navigationStyle: 'custom',
navigationBarTitleText: '在线预览',
},
}
</route>
<template>
<view :class="{ 'gray': appStore.isGray == 1 }">
<wd-navbar left-text="返回" left-arrow
custom-style="padding-top: var(--status-bar-height, 0); background-image: linear-gradient(to right, #1890ff, #096dd9); color: #fff;"
@click-left="handleClickLeft">
</wd-navbar>
<view class="serveBox">
<view class="title">
<view class="dot"></view>
<wd-text text="文件预览"></wd-text>
</view>
<view class="f-col">
<view v-if="ifH5">
<!-- 在线预览 by -->
<wd-text color="#1890ff" lines=1 style="font-size: 40rpx;padding-left: 25rpx;padding-top: 25rpx;" decoration="underline" @click="onlinePreview(`/pages/onlinePreview/onlinePreviewH5?data=${JSON.stringify(item)}`)"
v-for="item,i in detailArr" :text="captureText(item)">
</wd-text>
</view>
<view v-else>
<!-- 在线预览 by -->
<wd-text color="#1890ff" lines=1 style="font-size: 40rpx;padding-left: 25rpx;padding-top: 25rpx;" decoration="underline" @click="onlinePreview(`/pages/onlinePreview/onlinePreview?data=${JSON.stringify(item)}`)"
v-for="item,i in detailArr" :text="captureText(item)">
</wd-text>
</view>
</view>
</view>
</view>
</template>
<script setup>
import {
useAppStore
} from '@/store'
import {
ref
} from 'vue'
import {
onLoad,
onShow
} from '@dcloudio/uni-app';
const appStore = useAppStore();
const detail = ref({})
const detailArr = ref([])
//判断是否h5 by 闵
var ifH5 = false;
const onlinePreview = (url)=>{ //在线预览文件 by 闵
uni.navigateTo({
url:url
})
}
const handleClickLeft = () => {
uni.navigateBack()
}
const captureText = (text)=>{ //截取字符串显示
const match = text.match(/\/([^_]+)(?=_)/);
console.log(match)
return match ? match[1] : '';
}
onLoad((options) => {
detail.value = options.data
detailArr.value = options.data.split(",");
//#ifdef H5 || MP-WEIXIN
ifH5 = true;
//#endif
//判断是否只有一个文件
if(detailArr.value&&detailArr.value.length==1){
let url = '/pages/onlinePreview/onlinePreview';
if(ifH5) url = '/pages/onlinePreview/onlinePreviewH5'
onlinePreview(url+`?data=${JSON.stringify(options.data)}`);
}
})
onShow (()=>{
// if(detailArr.value&&detailArr.value.length==1){
// uni.navigateBack()
// }
})
</script>
<style>
/* page{
background-color: #f8f8f8;
} */
</style>
<style lang="scss" scoped>
.content {
padding: 0 30rpx;
}
.title_box {
.title {
font-size: 32rpx;
color: #333333;
padding: 30rpx 0 20rpx 0;
}
.time {
font-size: 24rpx;
color: #888888;
padding-bottom: 30rpx;
}
}
.document {
text {
font-size: 28rpx;
color: #333333;
white-space: nowrap;
}
view {
font-size: 28rpx;
color: #5A79F8;
text-decoration: underline;
}
}
.serveBox {
margin-bottom: 32upx;
background-color: #fff;
.title {
display: flex;
align-items: center;
padding-left: 30upx;
height: 52px;
.dot {
width: 14upx;
height: 14upx;
background-color: #0081ff;
border-radius: 100%;
margin-right: 20upx;
}
.wd-text {
color: #666;
font-size: 15px;
}
}
}
</style>