Merge remote-tracking branch 'origin/main' into main

main
26947 2024-06-09 15:38:25 +08:00
commit 9669565dc7
4 changed files with 112 additions and 27 deletions

View File

@ -39,9 +39,41 @@
:src="mediaItem"></image>
</view>
</block>
<!--三张图片-->
<block v-if="postValue.media.length >= 3">
<u-album :urls="postValue.media" singleSize="660rpx" multipleSize="220rpx" space="10rpx" maxCount="3"></u-album>
<!-- 三张图片 -->
<block v-if="postValue.media.length == 3">
<!-- <u-album :urls="postValue.media" singleSize="660rpx" multipleSize="220rpx" space="10rpx" maxCount="3"></u-album> -->
<view class="flex justifyBetween">
<view class="img-style-3-1" v-for="(mediaItem, index3) in postValue.media.slice(0,3)" :key="index3">
<image :lazy-load="true"
@tap.stop="previewImage(mediaItem, postValue.media)" mode="aspectFill"
:src="mediaItem"></image>
</view>
</view>
</block>
<!--大于三张图片-列表-->
<block v-if="postValue.media.length > 3 && postViewType == 0">
<!-- <u-album :urls="postValue.media" singleSize="660rpx" multipleSize="220rpx" space="10rpx" maxCount="3"></u-album> -->
<view class="flex justifyBetween">
<view class="img-style-3-2" v-for="(mediaItem, index3) in postValue.media.slice(0,3)" :key="index3">
<image :lazy-load="true"
@tap.stop="previewImage(mediaItem, postValue.media)" mode="aspectFill"
:src="mediaItem"></image>
<view v-if="index3 == 2" class="img-cover-style" @tap.stop="previewImage(mediaItem, postValue.media)">
<text>+{{ postValue.media.length - 3 }}</text>
</view>
</view>
</view>
</block>
<!--大于三张图片-详情-->
<block v-if="postValue.media.length > 3 && postViewType == 1">
<!-- <u-album :urls="postValue.media" singleSize="660rpx" multipleSize="220rpx" space="10rpx" maxCount="3"></u-album> -->
<view class="flex justifyBetween wrap">
<view class="img-style-3-1" v-for="(mediaItem, index3) in postValue.media" :key="index3">
<image :lazy-load="true"
@tap.stop="previewImage(mediaItem, postValue.media)" mode="aspectFill"
:src="mediaItem"></image>
</view>
</view>
</block>
<!-- tab -->
<view class="center-content-post-tab" style="display: flex;">
@ -214,7 +246,7 @@
line-height: 30rpx;
}
.no-focus-text {
font-weight: 400;
font-weight: 600;
width: 58rpx;
// height: 30rpx;
font-size: 28rpx;
@ -222,7 +254,7 @@
color: #3477FC;
}
.focus-text {
font-weight: 400;
font-weight: 600;
/* width: 58rpx; */
// height: 30rpx;
font-size: 28rpx;
@ -281,7 +313,7 @@
.u-album__row__wrapper {}
.data-v-6fcabaad {
border-radius: 20rpx 20rpx 20rpx 20rpx !important;
border-radius: 20rpx !important;
/* width: 200rpx !important;
height: 200rpx !important; */
}
@ -305,7 +337,7 @@
}
.center-content-post-tab-text{
font-weight: 400;
font-weight: 600;
/* width: 139rpx; */
// height: 26rpx;
font-size: 24rpx;
@ -381,7 +413,7 @@
width: 686rpx;
height: 370rpx;
border-radius: 18rpx 18rpx 18rpx 18rpx;
border-radius: 20rpx;
background: #b3d7ff;
}
@ -393,7 +425,46 @@
width: 100%;
height: 306rpx;
border-radius: 18rpx 18rpx 18rpx 18rpx;
border-radius: 20rpx;
}
}
.img-style-3-1{
image {
// margin: 6rpx;
width: 222rpx;
height: 222rpx;
border-radius: 20rpx;
}
}
.img-style-3-2{
display: flex;
justify-content: space-between;
position: relative;
image {
// margin: 6rpx;
width: 222rpx;
height: 222rpx;
border-radius: 20rpx;
}
}
.img-cover-style{
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: rgba(0, 0, 0, 0.3);
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
border-radius: 20rpx;
text{
color: #fff;
}
}

View File

@ -1,7 +1,7 @@
<template>
<view class="content">
<!-- 顶部导航栏 -->
<u-navbar leftText=" " title=" " :placeholder="true" :safeAreaInsetTop="true" :bgColor="bgColor">
<u-navbar leftText=" " title=" " :placeholder="true" :safeAreaInsetTop="true" :bgColor="bgColor" >
<template class="img1BOX" #left>
<image @click="GotoUNISignid()" src="../static/images/icon/tu2-4.png" class="img1"></image>
<!-- <image src="../static/images/icon/tu2-5.png" class="img2 image-container" @click="togglePostType"></image> -->
@ -127,11 +127,21 @@
</template>
<script setup>
import { ref, reactive, onMounted, getCurrentInstance } from 'vue';
import {onReachBottom,onLoad} from "@dcloudio/uni-app";
import { ref, reactive, onMounted, onUnmounted, onBeforeUnmount, getCurrentInstance } from 'vue';
import {onReachBottom,onLoad,onPageScroll} from "@dcloudio/uni-app";
import PostView from "@/pages/common/postview/index.vue";
const bgColor = ref('rgba(170, 0, 0, 0)');
onPageScroll((e) => {
// console.log("" + e.scrollTop);
if (e.scrollTop >= 70) {
bgColor.value = 'rgba(255, 255, 255, 1)'
} else {
bgColor.value = 'rgba(170, 0, 0, 0)'
}
})
const { proxy } = getCurrentInstance();
onReachBottom(() => {
console.log('触底了')
@ -142,7 +152,6 @@ import PostView from "@/pages/common/postview/index.vue";
const lefther = ref(0);
const searchPrerequisite = ref('热门');
const postTypeOpen = ref(false);
const bgColor = ref('rgba(170, 0, 0, 0)');
// const postTypeList = ['', ''];
const postTypeList = [{lable:'发布话题',id:1}, {lable:'发布活动',id:2}];
@ -186,10 +195,10 @@ import PostView from "@/pages/common/postview/index.vue";
content: '八年前,学弟在工地上杀了一个工友,杀人前,他给警察打了电话,预告杀人的时间和地点,并超出部分测试超出部分测试超出部分测试超出部分测试......超出部分测试超出部分测试超出部分测试超出部分测试',
type: '1',
media: [
'https://tu.sioe.cn/gj/qiege/image.jpg',
'https://picx.zhimg.com/v2-3b4fc7e3a1195a081d0259246c38debc_720w.jpg?source=172ae18b',
'https://bpic.51yuansu.com/backgd/cover/00/63/09/64b52b1426fff_800.jpg?x-oss-process=image/resize,w_780/sharpen,100',
'https://tu.sioe.cn/gj/qiege/image.jpg',
'https://img1.baidu.com/it/u=1179199327,1946315836&fm=253&fmt=auto&app=138&f=JPEG?w=1364&h=800',
'https://www4.bing.com//th?id=OHR.CopenhagenBicycles_ZH-CN3047958346_1920x1080.jpg&rf=LaDigue_1920x1080.jpg&pid=hp&w=360&h=202',
'https://www4.bing.com//th?id=OHR.CarnavalTenerife_ZH-CN1559136778_1920x1080.jpg&rf=LaDigue_1920x1080.jpg&pid=hp&w=360&h=202',
'https://www4.bing.com//th?id=OHR.StJamesPool_ZH-CN5930624359_1920x1080.jpg&rf=LaDigue_1920x1080.jpg&pid=hp&w=360&h=202',
],
tab: ['学术讨论组', '校园风景'],
transmitCount: 136,
@ -209,7 +218,7 @@ import PostView from "@/pages/common/postview/index.vue";
content: '是一个中文互联网高质量问答社区和创作者聚集的原创内容平台于2011年1月正式上线',
type: '1',
media: [
'https://tu.sioe.cn/gj/qiege/image.jpg',
'https://www4.bing.com//th?id=OHR.BambooPanda_ZH-CN8455481760_1920x1080.jpg&rf=LaDigue_1920x1080.jpg&pid=hp&w=360&h=202',
],
tab: ['校园风景'],
transmitCount: 13,
@ -230,8 +239,8 @@ import PostView from "@/pages/common/postview/index.vue";
content: '是一个中文互联网高质量问答社区和创作者聚集的原创内容平台于2011年1月正式上线',
type: '1',
media: [
'https://tu.sioe.cn/gj/qiege/image.jpg',
'https://picx.zhimg.com/v2-3b4fc7e3a1195a081d0259246c38debc_720w.jpg?source=172ae18b'
'https://www4.bing.com//th?id=OHR.PlitviceWinter_ZH-CN0407572344_1920x1080.jpg&rf=LaDigue_1920x1080.jpg&pid=hp&w=360&h=202',
'https://www4.bing.com//th?id=OHR.HawkOwl_ZH-CN3401920167_1920x1080.jpg&rf=LaDigue_1920x1080.jpg&pid=hp&w=360&h=202'
],
tab: ['校园风景'],
transmitCount: 13,
@ -494,6 +503,10 @@ import PostView from "@/pages/common/postview/index.vue";
height: 200rpx !important; */
}
.data-v-6fcabaad{
border-radius: 20rpx 20rpx 20rpx 20rpx !important;
}
.box-a {
margin-top: 42rpx;
display: flex;

View File

@ -79,7 +79,7 @@
<!-- <view class="flex justifyCenter"> -->
<view class="flex alignCenter justifyCenter">
<view class="flex justifyCenter alignCenter commentInput" @click="toInput()">
<image class="commentInput-img" src="../../../static/logo.png" mode=""></image>
<image class="commentInput-img" src="../../../static/images/icon/write-1.png" mode=""></image>
<text class="commentInput-text">友好评论~</text>
</view>
</view>
@ -185,10 +185,10 @@
content: '八年前,学弟在工地上杀了一个工友,上杀了一个工友,杀人前,他给警察打了电话,预告杀人的时间和地点,和地点,并......',
type: '1',
media: [
'https://tu.sioe.cn/gj/qiege/image.jpg',
'https://picx.zhimg.com/v2-3b4fc7e3a1195a081d0259246c38debc_720w.jpg?source=172ae18b',
'https://bpic.51yuansu.com/backgd/cover/00/63/09/64b52b1426fff_800.jpg?x-oss-process=image/resize,w_780/sharpen,100',
'https://tu.sioe.cn/gj/qiege/image.jpg',
'https://img1.baidu.com/it/u=1179199327,1946315836&fm=253&fmt=auto&app=138&f=JPEG?w=1364&h=800',
'https://www4.bing.com//th?id=OHR.CopenhagenBicycles_ZH-CN3047958346_1920x1080.jpg&rf=LaDigue_1920x1080.jpg&pid=hp&w=360&h=202',
'https://www4.bing.com//th?id=OHR.CarnavalTenerife_ZH-CN1559136778_1920x1080.jpg&rf=LaDigue_1920x1080.jpg&pid=hp&w=360&h=202',
'https://www4.bing.com//th?id=OHR.StJamesPool_ZH-CN5930624359_1920x1080.jpg&rf=LaDigue_1920x1080.jpg&pid=hp&w=360&h=202',
],
tab: ['学术讨论组', '校园风景'],
transmitCount: 136,
@ -347,8 +347,9 @@ page{
}
.commentInput-img{
width: 40rpx;
height: 40rpx;
width: 36rpx;
height: 36rpx;
margin-right: 12rpx;
}
.commentInput-text{

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.3 KiB