jeecgBootUniapp/src/pages/onlinePreview/detail.vue
2025-05-16 16:03:56 +08:00

138 lines
2.8 KiB
Vue

<route lang="json5" type="page">
{
layout: 'default',
style: {
navigationStyle: 'custom',
navigationBarTitleText: '在线预览',
},
}
</route>
<template>
<PageLayout navTitle="在线预览">
<view class="serveBox">
<view class="title">
<view class="dot"></view>
<wd-text text="文件预览"></wd-text>
</view>
<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>
</PageLayout>
</template>
<script setup>
import {
ref
} from 'vue'
import {
onLoad
} from '@dcloudio/uni-app';
const detail = ref({})
const detailArr = ref([])
//判断是否h5 by 闵
var ifH5 = false;
const onlinePreview = (url) => { //在线预览文件 by 闵
uni.navigateTo({
url: url
})
}
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)}`);
}
})
</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>