修改未发送图片名称
This commit is contained in:
parent
37cf237ff1
commit
cffb2c29fb
|
|
@ -87,7 +87,7 @@
|
||||||
@click="sendMessage">
|
@click="sendMessage">
|
||||||
</image>
|
</image>
|
||||||
<image v-if="phone == 'oppo'" class="right-icon"
|
<image v-if="phone == 'oppo'" class="right-icon"
|
||||||
:src="`/static/image/phone-message/oppo/${isSend ? 'send' : 'unsend'}.png`"
|
:src="`/static/image/phone-message/oppo/${isSend ? 'send' : 'unSend'}.png`"
|
||||||
@click="sendMessage">
|
@click="sendMessage">
|
||||||
</image>
|
</image>
|
||||||
<image v-if="phone == 'huawei'" class="right-icon"
|
<image v-if="phone == 'huawei'" class="right-icon"
|
||||||
|
|
@ -108,9 +108,17 @@
|
||||||
</view>
|
</view>
|
||||||
</template>
|
</template>
|
||||||
<script setup>
|
<script setup>
|
||||||
import { reactive, onMounted, computed, toRefs } from 'vue'
|
import {
|
||||||
import { dateUtil, util } from '@/utils/common.js';
|
reactive,
|
||||||
const props = defineProps({
|
onMounted,
|
||||||
|
computed,
|
||||||
|
toRefs
|
||||||
|
} from 'vue'
|
||||||
|
import {
|
||||||
|
dateUtil,
|
||||||
|
util
|
||||||
|
} from '@/utils/common.js';
|
||||||
|
const props = defineProps({
|
||||||
// 手机品牌
|
// 手机品牌
|
||||||
phone: {
|
phone: {
|
||||||
type: String,
|
type: String,
|
||||||
|
|
@ -136,9 +144,9 @@ const props = defineProps({
|
||||||
type: Number,
|
type: Number,
|
||||||
default: 0
|
default: 0
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
||||||
const data = reactive({
|
const data = reactive({
|
||||||
statusBarHeight: 0,
|
statusBarHeight: 0,
|
||||||
topBoxHeight: 0,
|
topBoxHeight: 0,
|
||||||
bottomBoxHeight: 0,
|
bottomBoxHeight: 0,
|
||||||
|
|
@ -148,12 +156,17 @@ const data = reactive({
|
||||||
scrollTop: 0,
|
scrollTop: 0,
|
||||||
keyboardHeight: 0,
|
keyboardHeight: 0,
|
||||||
lastClickTime: 0
|
lastClickTime: 0
|
||||||
})
|
})
|
||||||
|
|
||||||
let { isSend, content, simIndex, scrollTop } = toRefs(data)
|
let {
|
||||||
|
isSend,
|
||||||
|
content,
|
||||||
|
simIndex,
|
||||||
|
scrollTop
|
||||||
|
} = toRefs(data)
|
||||||
|
|
||||||
const emit = defineEmits(['send', 'dblclick-left', 'dblclick-right', 'title-click'])
|
const emit = defineEmits(['send', 'dblclick-left', 'dblclick-right', 'title-click'])
|
||||||
const onInput = (e) => {
|
const onInput = (e) => {
|
||||||
content.value = e.detail.html
|
content.value = e.detail.html
|
||||||
const htmlStr = (content.value || '').trim()
|
const htmlStr = (content.value || '').trim()
|
||||||
if (htmlStr === '' || htmlStr === '<p><br></p>' || htmlStr === '<br>') {
|
if (htmlStr === '' || htmlStr === '<p><br></p>' || htmlStr === '<br>') {
|
||||||
|
|
@ -168,21 +181,21 @@ const onInput = (e) => {
|
||||||
}
|
}
|
||||||
}).exec();
|
}).exec();
|
||||||
}, 50);
|
}, 50);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 切换sim卡
|
* 切换sim卡
|
||||||
*/
|
*/
|
||||||
const changeSim = () => {
|
const changeSim = () => {
|
||||||
simIndex.value = simIndex.value == 1 ? 2 : 1
|
simIndex.value = simIndex.value == 1 ? 2 : 1
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 发送消息
|
* 发送消息
|
||||||
*/
|
*/
|
||||||
const sendMessage = () => {
|
const sendMessage = () => {
|
||||||
if (!isSend.value) return
|
if (!isSend.value) return
|
||||||
const date = dateUtil.now("YYYY-MM-DD HH:mm")
|
const date = dateUtil.now("YYYY-MM-DD HH:mm")
|
||||||
const params = {
|
const params = {
|
||||||
|
|
@ -214,12 +227,12 @@ const sendMessage = () => {
|
||||||
data.isSend = false
|
data.isSend = false
|
||||||
}, 100);
|
}, 100);
|
||||||
data.isSend = false
|
data.isSend = false
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 处理 center-box 点击事件,检测双击并区分左右
|
* 处理 center-box 点击事件,检测双击并区分左右
|
||||||
*/
|
*/
|
||||||
const handleBoxClick = (e) => {
|
const handleBoxClick = (e) => {
|
||||||
const now = Date.now();
|
const now = Date.now();
|
||||||
const clickInterval = now - data.lastClickTime;
|
const clickInterval = now - data.lastClickTime;
|
||||||
|
|
||||||
|
|
@ -245,16 +258,16 @@ const handleBoxClick = (e) => {
|
||||||
} else {
|
} else {
|
||||||
data.lastClickTime = now;
|
data.lastClickTime = now;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
const handleTitleClick = () => {
|
const handleTitleClick = () => {
|
||||||
emit('title-click');
|
emit('title-click');
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
// 处理标题显示
|
// 处理标题显示
|
||||||
const displayTitle = computed(() => {
|
const displayTitle = computed(() => {
|
||||||
let title = props.chatInfo.title || '';
|
let title = props.chatInfo.title || '';
|
||||||
if (props.phone === 'oppo') {
|
if (props.phone === 'oppo') {
|
||||||
const noSpace = title.replace(/\s+/g, '');
|
const noSpace = title.replace(/\s+/g, '');
|
||||||
|
|
@ -263,10 +276,10 @@ const displayTitle = computed(() => {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
return title;
|
return title;
|
||||||
})
|
})
|
||||||
|
|
||||||
// 展示文字信息
|
// 展示文字信息
|
||||||
const showInfo = computed(() => {
|
const showInfo = computed(() => {
|
||||||
let placeholder
|
let placeholder
|
||||||
switch (props.phone) {
|
switch (props.phone) {
|
||||||
case "iphone":
|
case "iphone":
|
||||||
|
|
@ -287,13 +300,15 @@ const showInfo = computed(() => {
|
||||||
default:
|
default:
|
||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
return { placeholder }
|
return {
|
||||||
})
|
placeholder
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 选择图片并发送
|
* 选择图片并发送
|
||||||
*/
|
*/
|
||||||
const chooseImage = () => {
|
const chooseImage = () => {
|
||||||
uni.chooseImage({
|
uni.chooseImage({
|
||||||
count: 1, // 仅选一张
|
count: 1, // 仅选一张
|
||||||
sizeType: ['original', 'compressed'], // 原图或压缩图
|
sizeType: ['original', 'compressed'], // 原图或压缩图
|
||||||
|
|
@ -312,7 +327,9 @@ const chooseImage = () => {
|
||||||
let h = image.height;
|
let h = image.height;
|
||||||
|
|
||||||
// 根据 EXIF 方向修正实际视觉宽高
|
// 根据 EXIF 方向修正实际视觉宽高
|
||||||
if (image.orientation && ['left', 'right', 'left-mirrored', 'right-mirrored'].includes(image.orientation)) {
|
if (image.orientation && ['left', 'right', 'left-mirrored',
|
||||||
|
'right-mirrored'
|
||||||
|
].includes(image.orientation)) {
|
||||||
w = image.height;
|
w = image.height;
|
||||||
h = image.width;
|
h = image.width;
|
||||||
}
|
}
|
||||||
|
|
@ -323,7 +340,8 @@ const chooseImage = () => {
|
||||||
|
|
||||||
const date = dateUtil.now("YYYY-MM-DD HH:mm")
|
const date = dateUtil.now("YYYY-MM-DD HH:mm")
|
||||||
// 封装成HTML的img标签作为消息内容
|
// 封装成HTML的img标签作为消息内容
|
||||||
const content = `<img src="${finalPath}" style="width: ${width}; height: ${height}; border-radius: 16rpx; display: block;" />`;
|
const content =
|
||||||
|
`<img src="${finalPath}" style="width: ${width}; height: ${height}; border-radius: 16rpx; display: block;" />`;
|
||||||
const params = {
|
const params = {
|
||||||
content: content,
|
content: content,
|
||||||
imgUrl: finalPath,
|
imgUrl: finalPath,
|
||||||
|
|
@ -339,9 +357,11 @@ const chooseImage = () => {
|
||||||
// 延迟拉动到底部
|
// 延迟拉动到底部
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
data.scrollTop = 99999 + Math.random();
|
data.scrollTop = 99999 + Math.random();
|
||||||
uni.createSelectorQuery().select('.bottom-box').boundingClientRect(rect => {
|
uni.createSelectorQuery().select('.bottom-box')
|
||||||
|
.boundingClientRect(rect => {
|
||||||
if (rect) {
|
if (rect) {
|
||||||
data.bottomBoxHeight = rect.height;
|
data.bottomBoxHeight = rect
|
||||||
|
.height;
|
||||||
}
|
}
|
||||||
}).exec();
|
}).exec();
|
||||||
}, 100);
|
}, 100);
|
||||||
|
|
@ -366,9 +386,9 @@ const chooseImage = () => {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
// 同步获取系统信息
|
// 同步获取系统信息
|
||||||
const systemInfo = uni.getSystemInfoSync();
|
const systemInfo = uni.getSystemInfoSync();
|
||||||
data.statusBarHeight = systemInfo.statusBarHeight || 0;
|
data.statusBarHeight = systemInfo.statusBarHeight || 0;
|
||||||
|
|
@ -397,54 +417,51 @@ onMounted(() => {
|
||||||
}).exec();
|
}).exec();
|
||||||
}, 300);
|
}, 300);
|
||||||
|
|
||||||
})
|
})
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
<style>
|
<style>
|
||||||
@import '@/common/main.css';
|
@import '@/common/main.css';
|
||||||
</style>
|
</style>
|
||||||
<style lang="less" scoped>
|
<style lang="less" scoped>
|
||||||
.page-container {
|
.page-container {
|
||||||
width: 100vw;
|
width: 100vw;
|
||||||
height: 100vh;
|
height: 100vh;
|
||||||
background-color: #fff;
|
background-color: #fff;
|
||||||
}
|
}
|
||||||
|
|
||||||
.m-l-34 {
|
.m-l-34 {
|
||||||
margin-left: 34rpx;
|
margin-left: 34rpx;
|
||||||
}
|
}
|
||||||
|
|
||||||
.m-l-50 {
|
.m-l-50 {
|
||||||
margin-left: 50rpx;
|
margin-left: 50rpx;
|
||||||
}
|
}
|
||||||
|
|
||||||
.center-box {
|
.center-box {
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
// overflow-y: scroll;
|
// overflow-y: scroll;
|
||||||
// padding-bottom: 12px;
|
// padding-bottom: 12px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.fixed-bottom-box {
|
.fixed-bottom-box {
|
||||||
position: fixed;
|
position: fixed;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
background: #fff;
|
background: #fff;
|
||||||
bottom: 0;
|
bottom: 0;
|
||||||
left: 0;
|
left: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
.fixed-top-box {
|
.fixed-top-box {
|
||||||
position: fixed;
|
position: fixed;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
z-index: 9;
|
z-index: 9;
|
||||||
left: 0;
|
left: 0;
|
||||||
top: 0;
|
top: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
//苹果样式
|
//苹果样式
|
||||||
.iphone-style {
|
.iphone-style {
|
||||||
.circle {
|
.circle {
|
||||||
border-radius: 50% !important;
|
border-radius: 50% !important;
|
||||||
}
|
}
|
||||||
|
|
@ -586,10 +603,10 @@ onMounted(() => {
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
//小米样式
|
//小米样式
|
||||||
.mi-style {
|
.mi-style {
|
||||||
background-color: #F7F7F7 !important;
|
background-color: #F7F7F7 !important;
|
||||||
|
|
||||||
.top-box {
|
.top-box {
|
||||||
|
|
@ -724,10 +741,10 @@ onMounted(() => {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
//oppo样式
|
//oppo样式
|
||||||
.oppo-style {
|
.oppo-style {
|
||||||
background-color: #F0F1F3 !important;
|
background-color: #F0F1F3 !important;
|
||||||
|
|
||||||
.top-box {
|
.top-box {
|
||||||
|
|
@ -887,10 +904,10 @@ onMounted(() => {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
//华为样式
|
//华为样式
|
||||||
.huawei-style {
|
.huawei-style {
|
||||||
background-color: #F1F5F8 !important;
|
background-color: #F1F5F8 !important;
|
||||||
|
|
||||||
.top-box {
|
.top-box {
|
||||||
|
|
@ -1052,11 +1069,11 @@ onMounted(() => {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
//vivo样式
|
//vivo样式
|
||||||
.vivo-style {
|
.vivo-style {
|
||||||
background-color: #F6F6F6 !important;
|
background-color: #F6F6F6 !important;
|
||||||
|
|
||||||
.top-box {
|
.top-box {
|
||||||
|
|
@ -1175,10 +1192,10 @@ onMounted(() => {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.bottom-placeholder {
|
.bottom-placeholder {
|
||||||
margin-top: env(safe-area-inset-bottom);
|
margin-top: env(safe-area-inset-bottom);
|
||||||
margin-top: constant(safe-area-inset-bottom);
|
margin-top: constant(safe-area-inset-bottom);
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
Loading…
Reference in New Issue