|
|
|
|
@ -63,13 +63,20 @@
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<!--键盘高度{{keyHeight}} 输入框距离底部距离{{writeStyle}}屏幕高度{{screenHeight}}顶部聊天区域高度{{msgKeyHeight}}-->
|
|
|
|
|
<input v-show="!showEmojiInput" :focus="isFocus" class="msg-input-input g_flex_1" :maxlength="-1" :placeholder="isTeamMute ? t('teamMutePlaceholder') : t('chatInputPlaceHolder')" v-model="inputText" type="text" :disabled="isTeamMute" :confirm-hold="true" cursor-spacing="20" :adjust-position="pushUp" confirm-type="send" @keyboardheightchange="keyboardheightchange" @confirm="handleSendTextMsg" @blur="handleInputBlur" @input="handleInput" id="msg-input" />
|
|
|
|
|
<!-- {{ssff}}键盘高度{{keyHeight}} 输入框距离底部距离{{writeStyle}}屏幕高度{{screenHeight}}顶部聊天区域高度{{msgKeyHeight}} -->
|
|
|
|
|
<input v-show="!showEmojiInput" :focus="isFocus" class="msg-input-input g_flex_1" :maxlength="-1" :placeholder="isTeamMute ? t('teamMutePlaceholder') : t('chatInputPlaceHolder')" v-model="inputText" type="text" :disabled="isTeamMute" :confirm-hold="true" cursor-spacing="20" :adjust-position="pushUp" confirm-type="send" @keyboardheightchange="keyboardheightchange" @focus="handleInputFocus" @confirm="handleSendTextMsg" @blur="handleInputBlur" @input="handleInput" id="msg-input" />
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div class="msg-input-button" v-if="false">
|
|
|
|
|
<Icon @tap="handleEmojiVisible" class="g_p_6" style="padding-right: 5px" :size="28" type="icon-biaoqing" />
|
|
|
|
|
<div class="msg-input-button" @tap="(event) => handleSendJob()">
|
|
|
|
|
<div class="iconfont icon-5gongdanguanli g_c_6 g_fs_24"></div>
|
|
|
|
|
</div>
|
|
|
|
|
<!-- <div class="send-more-panel-item-wrapper">
|
|
|
|
|
<div class="send-more-panel-item" @tap="(event) => handleSendJob()">
|
|
|
|
|
<div class="iconfont icon-5gongdanguanli g_c_6 g_fs_24 g_fw_600"></div>
|
|
|
|
|
</div>
|
|
|
|
|
</div> -->
|
|
|
|
|
<!-- <div class="msg-input-button" v-if="false">
|
|
|
|
|
<Icon @tap="handleEmojiVisible" class="g_p_6" style="padding-right: 5px" :size="28" type="icon-biaoqing" />
|
|
|
|
|
</div> -->
|
|
|
|
|
<div class="msg-input-button" v-if="true">
|
|
|
|
|
<Icon @tap="handleSendMoreVisible" class="g_p_6" style="padding-left: 5px; padding-right: 8px" type="send-more" :size="28" />
|
|
|
|
|
</div>
|
|
|
|
|
@ -98,13 +105,13 @@
|
|
|
|
|
<div class="icon-text">{{ t("shootText") }}</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div class="send-more-panel-item-wrapper">
|
|
|
|
|
<!-- <div class="send-more-panel-item-wrapper">
|
|
|
|
|
<div class="send-more-panel-item" @tap="(event) => handleSendVideoMsg('album', event)">
|
|
|
|
|
<Icon type="icon-shipin2" :size="30"></Icon>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="icon-text">{{ t("albumText") }}</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="send-more-panel-item-wrapper" v-if="isApp && props.conversationType !== V2NIMConst.V2NIMConversationType.V2NIM_CONVERSATION_TYPE_TEAM">
|
|
|
|
|
</div> -->
|
|
|
|
|
<!-- <div class="send-more-panel-item-wrapper" v-if="isApp && props.conversationType !== V2NIMConst.V2NIMConversationType.V2NIM_CONVERSATION_TYPE_TEAM">
|
|
|
|
|
<div class="send-more-panel-item" @tap="handleCall(1)">
|
|
|
|
|
<Icon type="icon-audio-call" :size="30"></Icon>
|
|
|
|
|
</div>
|
|
|
|
|
@ -115,7 +122,7 @@
|
|
|
|
|
<Icon type="icon-video-call" :size="30"></Icon>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="icon-text">{{ t("videoCallText") }}</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div> -->
|
|
|
|
|
<div v-if="isWeb" class="send-more-panel-item-wrapper" @tap="handleSendFileMsg">
|
|
|
|
|
<div class="send-more-panel-item">
|
|
|
|
|
<Icon type="icon-file" :size="30"></Icon>
|
|
|
|
|
@ -361,72 +368,80 @@ const pushUp = ref(false);
|
|
|
|
|
|
|
|
|
|
const keyHeight = ref(350);
|
|
|
|
|
const msgKeyHeight = ref("100%");
|
|
|
|
|
const ssff = ref(uni.getWindowInfo().safeArea.top);
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
const handleInputFocus = (e) => {
|
|
|
|
|
emojiVisible.value = false;
|
|
|
|
|
extVisible.value = false;
|
|
|
|
|
audioPanelVisible.value = false;
|
|
|
|
|
sendMoreVisible.value = false;
|
|
|
|
|
const systemInfo = uni.getSystemInfoSync();
|
|
|
|
|
const availableHeight = systemInfo.windowHeight - e.detail.height - ssff.value;
|
|
|
|
|
setTimeout(()=>{
|
|
|
|
|
|
|
|
|
|
console.log("获取焦点获取焦点获取焦点获取焦点获取焦点获取焦点获取焦点获取焦点获取焦点获取焦点获取焦点获取焦点获取焦点获取焦点");
|
|
|
|
|
uni.$emit("msgKeyHeight", availableHeight); // 传递实际可用高度
|
|
|
|
|
writeStyle.value = `bottom: calc(${e.detail.height}px - env(safe-area-inset-bottom))`;
|
|
|
|
|
uni.$emit(events.ON_SCROLL_BOTTOM);
|
|
|
|
|
},80)
|
|
|
|
|
// if (e.detail.height === 0) {
|
|
|
|
|
// writeStyle.value = "bottom: 0";
|
|
|
|
|
// uni.$emit("msgKeyHeight", "100%"); // 键盘收起时恢复全屏高度
|
|
|
|
|
// } else {
|
|
|
|
|
// // 隐藏其他面板
|
|
|
|
|
// emojiVisible.value = false;
|
|
|
|
|
// extVisible.value = false;
|
|
|
|
|
// audioPanelVisible.value = false;
|
|
|
|
|
// sendMoreVisible.value = false;
|
|
|
|
|
|
|
|
|
|
// const systemInfo = uni.getSystemInfoSync();
|
|
|
|
|
// const availableHeight = systemInfo.windowHeight - e.detail.height - ssff.value;
|
|
|
|
|
// uni.$emit("msgKeyHeight", availableHeight); // 传递实际可用高度
|
|
|
|
|
// writeStyle.value = `bottom: calc(${e.detail.height}px - env(safe-area-inset-bottom))`;
|
|
|
|
|
// // let safeBottom = 0;
|
|
|
|
|
// }
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
// 在message-input.vue的keyboardheightchange事件中修改
|
|
|
|
|
// 在message-input.vue的keyboardheightchange事件中修改
|
|
|
|
|
const keyboardheightchange = (e) => {
|
|
|
|
|
keyHeight.value = e.detail.height;
|
|
|
|
|
uni.$emit(events.KeyboardEvent, e.detail.height);
|
|
|
|
|
uni.$emit('KeyboardHeight', e.detail.height);
|
|
|
|
|
uni.$emit("KeyboardHeight", e.detail.height);
|
|
|
|
|
|
|
|
|
|
if (e.detail.height === 0) {
|
|
|
|
|
writeStyle.value = "bottom: 0";
|
|
|
|
|
uni.$emit('msgKeyHeight', '100%'); // 键盘收起时恢复全屏高度
|
|
|
|
|
uni.$emit("msgKeyHeight", "100%"); // 键盘收起时恢复全屏高度
|
|
|
|
|
} else {
|
|
|
|
|
// 隐藏其他面板
|
|
|
|
|
console.log("触发输入框触发输入框触发输入框触发输入框触发输入框触发输入框触发输入框触发输入框");
|
|
|
|
|
emojiVisible.value = false;
|
|
|
|
|
extVisible.value = false;
|
|
|
|
|
audioPanelVisible.value = false;
|
|
|
|
|
sendMoreVisible.value = false;
|
|
|
|
|
|
|
|
|
|
// 统一计算安全区域（适配APP和小程序）
|
|
|
|
|
const systemInfo = uni.getSystemInfoSync();
|
|
|
|
|
const safeBottom = systemInfo.safeAreaInsets?.bottom || 0;
|
|
|
|
|
// 计算会话区域可用高度 = 屏幕高度 - 键盘高度 - 安全区域底部
|
|
|
|
|
|
|
|
|
|
// 输入框定位适配
|
|
|
|
|
// #ifdef MP-WEIXIN
|
|
|
|
|
if (systemInfo.platform === 'ios') {
|
|
|
|
|
const availableHeight = systemInfo.windowHeight - e.detail.height - safeBottom - 64;
|
|
|
|
|
uni.$emit('msgKeyHeight', availableHeight); // 传递实际可用高度
|
|
|
|
|
}else{
|
|
|
|
|
const availableHeight = systemInfo.windowHeight - e.detail.height - safeBottom - 94;
|
|
|
|
|
uni.$emit('msgKeyHeight', availableHeight); // 传递实际可用高度
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
const availableHeight = systemInfo.windowHeight - e.detail.height - ssff.value;
|
|
|
|
|
uni.$emit("msgKeyHeight", availableHeight); // 传递实际可用高度
|
|
|
|
|
writeStyle.value = `bottom: calc(${e.detail.height}px - env(safe-area-inset-bottom))`;
|
|
|
|
|
// #endif
|
|
|
|
|
// #ifdef APP-PLUS
|
|
|
|
|
// 区分安卓和苹果平台
|
|
|
|
|
let availableHeight, bottomValue;
|
|
|
|
|
if (systemInfo.platform === 'ios') {
|
|
|
|
|
// 苹果设备
|
|
|
|
|
availableHeight = systemInfo.windowHeight - e.detail.height - safeBottom;
|
|
|
|
|
bottomValue = e.detail.height - safeBottom - 34;
|
|
|
|
|
} else {
|
|
|
|
|
// 安卓设备
|
|
|
|
|
availableHeight = systemInfo.windowHeight - e.detail.height - safeBottom - 34;
|
|
|
|
|
bottomValue = e.detail.height - safeBottom;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
uni.$emit('msgKeyHeight', availableHeight); // 传递实际可用高度
|
|
|
|
|
writeStyle.value = `bottom: ${bottomValue}px`;
|
|
|
|
|
// #endif
|
|
|
|
|
}
|
|
|
|
|
setTimeout(()=>{
|
|
|
|
|
uni.$emit(events.ON_SCROLL_BOTTOM);
|
|
|
|
|
},80)
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
const handleInputBlur = () => {
|
|
|
|
|
isFocus.value = false;
|
|
|
|
|
uni.$emit("msgKeyHeight", "100%");
|
|
|
|
|
};
|
|
|
|
|
// const handleInputBlur = () => {
|
|
|
|
|
// isFocus.value = false;
|
|
|
|
|
// uni.$emit("msgKeyHeight", "100%");
|
|
|
|
|
// };
|
|
|
|
|
|
|
|
|
|
// 滚动到底部
|
|
|
|
|
const scrollBottom = () => {
|
|
|
|
|
if (isAndroidApp || isWxApp || isIosApp) {
|
|
|
|
|
setTimeout(() => {
|
|
|
|
|
uni.$emit(events.ON_SCROLL_BOTTOM);
|
|
|
|
|
}, 300);
|
|
|
|
|
}, 80);
|
|
|
|
|
} else {
|
|
|
|
|
uni.$emit(events.ON_SCROLL_BOTTOM);
|
|
|
|
|
}
|
|
|
|
|
@ -553,15 +568,15 @@ const handleEmojiVisible = () => {
|
|
|
|
|
uni.$emit(events.KeyboardEvent, 0);
|
|
|
|
|
}
|
|
|
|
|
uni.$emit(events.ON_SCROLL_BOTTOM);
|
|
|
|
|
}, 100);
|
|
|
|
|
}, 80);
|
|
|
|
|
};
|
|
|
|
|
watch(sendMoreVisible, (val) => {
|
|
|
|
|
if (val) {
|
|
|
|
|
uni.$emit("msgKeyHeight", uni.getSystemInfoSync().windowHeight - 320); // 传递实际可用高度
|
|
|
|
|
} else {
|
|
|
|
|
uni.$emit("msgKeyHeight", "100%"); // 传递实际可用高度
|
|
|
|
|
}
|
|
|
|
|
});
|
|
|
|
|
// watch(sendMoreVisible, (val) => {
|
|
|
|
|
// if (val) {
|
|
|
|
|
// uni.$emit("msgKeyHeight", uni.getSystemInfoSync().windowHeight - 270); // 传递实际可用高度
|
|
|
|
|
// } else {
|
|
|
|
|
// uni.$emit("msgKeyHeight", "100%"); // 传递实际可用高度
|
|
|
|
|
// }
|
|
|
|
|
// });
|
|
|
|
|
// 显示发送更多"+"面板
|
|
|
|
|
const handleSendMoreVisible = () => {
|
|
|
|
|
if (isTeamMute.value) return;
|
|
|
|
|
@ -569,12 +584,17 @@ const handleSendMoreVisible = () => {
|
|
|
|
|
emojiVisible.value = false;
|
|
|
|
|
sendMoreVisible.value = !sendMoreVisible.value;
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
setTimeout(()=>{
|
|
|
|
|
if (sendMoreVisible.value) {
|
|
|
|
|
uni.$emit(events.KeyboardEvent, 230);
|
|
|
|
|
uni.$emit("msgKeyHeight", uni.getSystemInfoSync().windowHeight - 360); // 传递实际可用高度
|
|
|
|
|
} else {
|
|
|
|
|
uni.$emit(events.KeyboardEvent, 0);
|
|
|
|
|
uni.$emit("msgKeyHeight", '100%'); // 传递实际可用高度
|
|
|
|
|
}
|
|
|
|
|
uni.$emit(events.ON_SCROLL_BOTTOM);
|
|
|
|
|
},80)
|
|
|
|
|
// }, 300)
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
|
zsk
wangxia