Commit a659c077 authored by yuwenwen's avatar yuwenwen

移动端调整(不换行)

parent 79e3bfa9
...@@ -251,6 +251,8 @@ ...@@ -251,6 +251,8 @@
.text { .text {
width: calc(100% - 180rpx); width: calc(100% - 180rpx);
word-wrap: break-word;
word-break: break-all;
} }
......
...@@ -20,7 +20,7 @@ ...@@ -20,7 +20,7 @@
</view> </view>
<view class="dynamic-content-box" > <view class="dynamic-content-box" >
<rich-text v-if="preNodes.length > 0" :nodes="preNodes"></rich-text> <rich-text v-if="preNodes.length > 0" :nodes="preNodes" class="text"></rich-text>
<view class="imgs" v-if="form.type=='IMAGE'&&form.attachments && form.attachments.length > 0"> <view class="imgs" v-if="form.type=='IMAGE'&&form.attachments && form.attachments.length > 0">
<template v-for="(item,index) in form.attachments"> <template v-for="(item,index) in form.attachments">
<image class="item" :src="item.url" @click.stop="preview(form.attachments,index)"></image> <image class="item" :src="item.url" @click.stop="preview(form.attachments,index)"></image>
......
...@@ -11,19 +11,26 @@ ...@@ -11,19 +11,26 @@
<scroll-view class="scroll-view-index" scroll-y :show-scrollbar="false" v-if="list.length>0" <scroll-view class="scroll-view-index" scroll-y :show-scrollbar="false" v-if="list.length>0"
@scrolltolower="loadMore"> @scrolltolower="loadMore">
<template v-for="(item,index) in list"> <template v-for="(item,index) in list">
<dynamic-item :form="item" @refresh="refreshContentList" @refreshCurrent="refreshCurrent"></dynamic-item> <dynamic-item :form="item" @refresh="refreshContentList"
@refreshCurrent="refreshCurrent"></dynamic-item>
</template> </template>
</scroll-view> </scroll-view>
<scroll-view class="scroll-view-index" scroll-y :show-scrollbar="false" v-else> <scroll-view class="scroll-view-index" scroll-y :show-scrollbar="false" v-else>
<list-empty></list-empty> <list-empty></list-empty>
</scroll-view> </scroll-view>
<!-- 发布按钮 --> <!-- 发布按钮 -->
<movable-area class="movable-area"> <!-- <movable-area class="movable-area">
<movable-view class="add-dynamic-box move-button" :x="area.x+'rpx'" :y="area.y + 'rpx'" direction="all" <movable-view class="add-dynamic-box move-button" :x="area.x+'rpx'" :y="area.y + 'rpx'" direction="all"
@change="onChange" damping="30" @click="toPublishPage"> @change="onChange" damping="30" @click="toPublishPage">
<image class="icon" src="/static/images/publish-icon.png"></image> <image class="icon" src="/static/images/publish-icon.png"></image>
</movable-view> </movable-view>
</movable-area> </movable-area> -->
<!-- 发布按钮 -->
<view class="add-dynamic-box" @click="toPublishPage" :style="{ left: iconLeft + 'px', top: iconTop + 'px' }"
@touchstart="handleTouchStart" @touchmove="handleTouchMove" @touchend="handleTouchEnd">
<image class="icon" src="/static/images/publish-icon.png"></image>
</view>
</view> </view>
</template> </template>
...@@ -49,7 +56,10 @@ ...@@ -49,7 +56,10 @@
y: 1060 y: 1060
}, },
emotions, emotions,
scrollTop: 0 scrollTop: 0,
iconLeft: 310,
iconTop: 480,
isMoving: false
} }
}, },
components: { components: {
...@@ -141,6 +151,49 @@ ...@@ -141,6 +151,49 @@
}); });
} }
}) })
},
// 触摸开始
handleTouchStart(e) {
this.isMoving = true;
// 记录触摸起点(相对于屏幕)
this.startX = e.touches[0].clientX;
this.startY = e.touches[0].clientY;
// 记录图标当前位置
this.initialLeft = this.iconLeft;
this.initialTop = this.iconTop;
},
// 触摸移动
handleTouchMove(e) {
if (!this.isMoving) return;
// 防止页面滚动
e.preventDefault();
// 计算当前触摸位置与起点的偏移量
const moveX = e.touches[0].clientX - this.startX;
const moveY = e.touches[0].clientY - this.startY;
// 计算新位置(初始位置 + 偏移量)
let newLeft = this.initialLeft + moveX;
let newTop = this.initialTop + moveY;
// 限制图标在屏幕内(可选)
const windowWidth = uni.getSystemInfoSync().windowWidth;
const windowHeight = uni.getSystemInfoSync().windowHeight;
const iconSize = 50; // 图标宽高(根据实际调整)
// 左右边界
newLeft = Math.max(0, Math.min(newLeft, windowWidth - iconSize));
// 上下边界
newTop = Math.max(0, Math.min(newTop, windowHeight - iconSize));
// 更新位置
this.iconLeft = newLeft;
this.iconTop = newTop;
},
// 触摸结束
handleTouchEnd() {
this.isMoving = false;
} }
} }
} }
...@@ -148,21 +201,4 @@ ...@@ -148,21 +201,4 @@
<style lang="scss" scoped> <style lang="scss" scoped>
@import '@/static/styles/index.scss'; @import '@/static/styles/index.scss';
.movable-area {
position: fixed;
height: calc(100vh - 3.75rem);
width: 100%;
z-index: 998;
pointer-events: none;
left: 0;
top: 0;
.move-button {
pointer-events: auto;
pointer-events: auto;
}
}
</style> </style>
\ No newline at end of file
...@@ -43,6 +43,8 @@ ...@@ -43,6 +43,8 @@
color: rgba(16, 16, 16, 1); color: rgba(16, 16, 16, 1);
font-size: 32rpx; font-size: 32rpx;
margin-bottom: 20rpx; margin-bottom: 20rpx;
word-wrap: break-word;
word-break: break-all;
} }
.imgs{ .imgs{
// display: grid; // display: grid;
...@@ -100,6 +102,8 @@ ...@@ -100,6 +102,8 @@
.text{ .text{
color: rgba(142, 153, 171, 1); color: rgba(142, 153, 171, 1);
font-size: 28rpx; font-size: 28rpx;
word-wrap: break-word;
word-break: break-all;
} }
} }
} }
...@@ -265,6 +269,8 @@ ...@@ -265,6 +269,8 @@
display: flex; display: flex;
.text { .text {
width: 100%; width: 100%;
word-wrap: break-word;
word-break: break-all;
} }
...@@ -285,6 +291,7 @@ ...@@ -285,6 +291,7 @@
} }
.add-dynamic-box{ .add-dynamic-box{
position: fixed;
width: 76rpx; width: 76rpx;
height: 76rpx; height: 76rpx;
border-radius: 50%; border-radius: 50%;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment