查看动态圈子详情修改

packages/app/src/pages/home/moment/index.vue

@@ -42,6 +42,7 @@ const router = useRouter()
 const dictStore = useDictStore()
 const { getOptionLabel } = dictStore
 const id = ref()
+const currentImg = ref(0)
 const isShared = ref(false)
 const commeentRef = ref<InstanceType<typeof WdInput>>()
 const commentItemRef = ref<InstanceType<typeof CommentItem>[]>()
@@ -68,6 +69,8 @@ const isVideo = ref(false)
 const reviewId = ref()
 const refreshIndex = ref<number>()
 const handleChange = ({ detail: { current } }) => {
+	// console.log(current)
+	currentImg.value = current;
   // swiperStyle.value = {
   //   height: swiperSizes.value[current].height + 'px',
   // }
@@ -87,7 +90,7 @@ const setSwiperStyle = async () => {
     height:
       height > width
         ? addUnit(500)
-        : addUnit(
+        : height === width?addUnit(screenWidth):addUnit(
             screenWidth / width > 1
               ? height / (screenWidth / width)
               : height * (screenWidth / width),
@@ -192,11 +195,12 @@ onShareAppMessage(async ({ from, target }) => {
     </div> -->
     <template v-if="data.circleType === '1'">
       <template v-if="!isVideo">
-        <div>
-          <swiper class="" :style="swiperStyle" @change="handleChange">
+        <div class="pos-relative">
+		  <div class="currentImg">{{ currentImg + 1 }}/{{data?.bannerUrls.length}}</div>	
+          <swiper :current="currentImg" :style="swiperStyle" @change="handleChange" :indicator-dots="true">
             <template v-for="it of data?.bannerUrls" :key="it">
               <swiper-item>
-                <wd-img width="100%" height="100%" :src="it" mode="aspectFill"></wd-img>
+                <wd-img width="100%" height="100%" :src="it" mode="aspectFill" :enable-preview="true"></wd-img>
               </swiper-item>
             </template>
           </swiper>
@@ -400,3 +404,16 @@ onShareAppMessage(async ({ from, target }) => {
     </BottomAppBar>
   </view>
 </template>
+<style lang="scss" scope>
+	.currentImg{
+		position:absolute;
+		z-index:2;
+		color:#fff;
+		background-color: rgba(0,0,0,.5);
+		top:10rpx;
+		right:10rpx;
+		padding:4rpx 20rpx;
+		font-size:24rpx;
+		border-radius: 8rpx;
+	}
+</style>