小程序客服图片报警处理,瀑布流重构
parent
5c3f0ab2f3
commit
d4ef49b913
|
@ -495,9 +495,9 @@
|
|||
});
|
||||
chat.showTools = false;
|
||||
// scrollBottom();
|
||||
setTimeout(()=>{
|
||||
setTimeout(() => {
|
||||
chat.msg = '';
|
||||
},100)
|
||||
}, 100);
|
||||
}
|
||||
|
||||
// 点击猜你想问
|
||||
|
@ -546,7 +546,7 @@
|
|||
let emojiFile = selEmojiFile(item);
|
||||
newData = newData.replace(
|
||||
item,
|
||||
`<img class="chat-img" style="width:25px;height:25px;margin:0 3px" src="${sheep.$url.cdn(
|
||||
`<img class="chat-img" src="${sheep.$url.cdn(
|
||||
'/static/img/chat/emoji/' + emojiFile,
|
||||
)}"/>`,
|
||||
);
|
||||
|
@ -587,6 +587,7 @@
|
|||
background-size: 750rpx 100%;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.chat-wrap {
|
||||
// :deep() {
|
||||
// .ui-navbar-box {
|
||||
|
@ -701,10 +702,12 @@
|
|||
background: #fff;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
:deep() {
|
||||
.imgred {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.imgred,
|
||||
img {
|
||||
width: 100%;
|
||||
|
@ -852,3 +855,16 @@
|
|||
}
|
||||
}
|
||||
</style>
|
||||
<style>
|
||||
.chat-img {
|
||||
width: 25px;
|
||||
height: 25px;
|
||||
margin: 0 3px;
|
||||
}
|
||||
.full-img {
|
||||
object-fit: cover;
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
border-radius: 6px;
|
||||
}
|
||||
</style>
|
||||
|
|
|
@ -494,7 +494,7 @@ export function useChatWebSocket(socketConfig) {
|
|||
const img = await readImg(file);
|
||||
const blob = await compressImg(img, file.type);
|
||||
const { data } = await upload(file.name, blob);
|
||||
let image = `<img src='${data.fullurl}' style='object-fit: cover;width:100px;height:100px;border-radius:6px'>`;
|
||||
let image = `<img class="full-url" src='${data.fullurl}'>`;
|
||||
document.execCommand('insertHTML', false, image);
|
||||
} else {
|
||||
document.execCommand('insertHTML', false, paste.getData('text'));
|
||||
|
@ -516,7 +516,7 @@ export function useChatWebSocket(socketConfig) {
|
|||
const img = await readImg(file);
|
||||
const blob = await compressImg(img, file.type);
|
||||
const { data } = await upload(file.name, blob);
|
||||
let image = `<img src='${data.fullurl}' style='object-fit: cover;width:100px;height:100px;border-radius:6px'>`;
|
||||
let image = `<img class="full-url" src='${data.fullurl}' >`;
|
||||
document.execCommand('insertHTML', false, image);
|
||||
} else {
|
||||
ElMessage({
|
||||
|
@ -818,4 +818,4 @@ export function useChatWebSocket(socketConfig) {
|
|||
showTime,
|
||||
formatTime,
|
||||
};
|
||||
}
|
||||
}
|
|
@ -65,12 +65,7 @@
|
|||
<view v-if="tagStyle.show" class="tag-icon-box">
|
||||
<image class="tag-icon" :src="sheep.$url.cdn(tagStyle.src)"></image>
|
||||
</view>
|
||||
<image
|
||||
class="md-img-box"
|
||||
:src="sheep.$url.cdn(data.image)"
|
||||
mode="widthFix"
|
||||
@load="calculatePanelHeight"
|
||||
></image>
|
||||
<image class="md-img-box" :src="sheep.$url.cdn(data.image)" mode="widthFix"></image>
|
||||
<view
|
||||
class="md-goods-content ss-flex-col ss-row-around ss-p-b-20 ss-p-t-20 ss-p-x-16"
|
||||
:id="elId"
|
||||
|
@ -296,7 +291,7 @@
|
|||
* @event {Function()} click - 点击卡片
|
||||
*
|
||||
*/
|
||||
import { computed, reactive, getCurrentInstance } from 'vue';
|
||||
import { computed, reactive, getCurrentInstance, onMounted, nextTick } from 'vue';
|
||||
import sheep from '@/sheep';
|
||||
import { formatSales } from '@/sheep/hooks/useGoods';
|
||||
import { formatStock } from '@/sheep/hooks/useGoods';
|
||||
|
@ -417,23 +412,32 @@
|
|||
emits('click');
|
||||
};
|
||||
|
||||
// 获取实时卡片高度
|
||||
// 获取卡片实时高度
|
||||
const { proxy } = getCurrentInstance();
|
||||
const elId = `sheep_${Math.ceil(Math.random() * 10e5).toString(36)}`;
|
||||
function calculatePanelHeight(e) {
|
||||
function getGoodsPriceCardWH() {
|
||||
if (props.size === 'md') {
|
||||
const view = uni.createSelectorQuery().in(proxy);
|
||||
view.select(`#${elId}`).fields({ size: true, scrollOffset: true });
|
||||
view.exec((data) => {
|
||||
let totalHeight = 0;
|
||||
const goodsPriceCard = data[0];
|
||||
const card = {
|
||||
width: goodsPriceCard.width,
|
||||
height: (goodsPriceCard.width / e.detail.width) * e.detail.height + goodsPriceCard.height,
|
||||
};
|
||||
emits('getHeight', card.height);
|
||||
if (props.data.image_wh) {
|
||||
totalHeight =
|
||||
(goodsPriceCard.width / props.data.image_wh.w) * props.data.image_wh.h +
|
||||
goodsPriceCard.height;
|
||||
} else {
|
||||
totalHeight = goodsPriceCard.width;
|
||||
}
|
||||
emits('getHeight', totalHeight);
|
||||
});
|
||||
}
|
||||
}
|
||||
onMounted(() => {
|
||||
nextTick(() => {
|
||||
getGoodsPriceCardWH();
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
|
|
|
@ -20,6 +20,7 @@
|
|||
height: poster.height + 'px',
|
||||
width: poster.width + 'px',
|
||||
}"
|
||||
:show-menu-by-longpress="true"
|
||||
></image>
|
||||
<canvas
|
||||
class="hideCanvas"
|
||||
|
|
Loading…
Reference in New Issue