|
|
@@ -6,15 +6,27 @@
|
|
|
<!-- 对方消息 -->
|
|
|
<template v-if="msg.sender === 'received'">
|
|
|
<!-- <div class="avatar">{{ msg.receiverName.charAt(0) }}</div> -->
|
|
|
- <el-avatar class="avatar" :size="40" :src="msg.receiverIcon || 'https://birdseye-img.sysuimars.com/birdseye-look-mini/Group%201321316260.png'" />
|
|
|
- <img src="" alt="">
|
|
|
+ <el-avatar
|
|
|
+ class="avatar"
|
|
|
+ :size="40"
|
|
|
+ :src="
|
|
|
+ msg.receiverIcon ||
|
|
|
+ 'https://birdseye-img.sysuimars.com/birdseye-look-mini/Group%201321316260.png'
|
|
|
+ "
|
|
|
+ />
|
|
|
+ <img src="" alt="" />
|
|
|
<div class="bubble" :class="{ 'no-bubble': msg.messageType === 'image' }">
|
|
|
<!-- 文本消息 -->
|
|
|
<div v-if="msg.messageType === 'text'" class="content">{{ msg.content }}</div>
|
|
|
|
|
|
<!-- 图片消息 -->
|
|
|
<div v-if="msg.messageType === 'image'" class="image-message">
|
|
|
- <img :src="msg.content + resize" @click="showImagePreview(msg.content)" @load="handleImageLoad" alt="图片" />
|
|
|
+ <img
|
|
|
+ :src="msg.content + resize"
|
|
|
+ @click="showImagePreview(msg.content)"
|
|
|
+ @load="handleImageLoad"
|
|
|
+ alt="图片"
|
|
|
+ />
|
|
|
</div>
|
|
|
|
|
|
<!-- 语音消息 -->
|
|
|
@@ -74,7 +86,12 @@
|
|
|
|
|
|
<!-- 图片消息 -->
|
|
|
<div v-if="msg.messageType === 'image'" class="image-message">
|
|
|
- <img :src="msg.content + resize" @click="showImagePreview(msg.content)" @load="handleImageLoad" alt="图片" />
|
|
|
+ <img
|
|
|
+ :src="msg.content + resize"
|
|
|
+ @click="showImagePreview(msg.content)"
|
|
|
+ @load="handleImageLoad"
|
|
|
+ alt="图片"
|
|
|
+ />
|
|
|
</div>
|
|
|
|
|
|
<!-- 语音消息 -->
|
|
|
@@ -86,44 +103,46 @@
|
|
|
<!-- 对话样式消息 -->
|
|
|
<div v-if="msg.messageType === 'dialog'" class="dialog-message">
|
|
|
<template v-if="msg.content.type === 'farm_report'">
|
|
|
- <div class="report-title" >{{ msg.content.title }}</div>
|
|
|
+ <div class="report-title">{{ msg.content.title }}</div>
|
|
|
<div class="dialog-title">{{ msg.content.content }}</div>
|
|
|
- <img src="@/assets/img/monitor/aaa.png" alt="" class="monitor-image">
|
|
|
+ <img src="@/assets/img/monitor/aaa.png" alt="" class="monitor-image" />
|
|
|
</template>
|
|
|
<template v-else>
|
|
|
<div class="dialog-title">{{ msg.content.title }}</div>
|
|
|
- <img src="@/assets/img/monitor/image.png" alt="" class="monitor-image">
|
|
|
+ <img src="@/assets/img/monitor/image.png" alt="" class="monitor-image" />
|
|
|
</template>
|
|
|
</div>
|
|
|
|
|
|
<!-- <div class="time">{{ msg.time }}</div> -->
|
|
|
</div>
|
|
|
<!-- <div class="avatar avatar-r">{{ msg.senderName.charAt(0) }}</div> -->
|
|
|
- <el-avatar class="avatar avatar-r" :size="40" :src="msg.senderIcon || 'https://birdseye-img.sysuimars.com/birdseye-look-mini/Group%201321316260.png'" />
|
|
|
+ <el-avatar
|
|
|
+ class="avatar avatar-r"
|
|
|
+ :size="40"
|
|
|
+ :src="
|
|
|
+ msg.senderIcon ||
|
|
|
+ 'https://birdseye-img.sysuimars.com/birdseye-look-mini/Group%201321316260.png'
|
|
|
+ "
|
|
|
+ />
|
|
|
</template>
|
|
|
</div>
|
|
|
</div>
|
|
|
-
|
|
|
+
|
|
|
<!-- 功能按钮区域 -->
|
|
|
<div class="function-buttons">
|
|
|
- <el-select v-model="farmVal" size="large">
|
|
|
+ <el-select v-model="farmVal" size="large" @change="handleFarmChange()">
|
|
|
<el-option
|
|
|
- v-for="item in options"
|
|
|
- :key="item.id"
|
|
|
- :label="item.name"
|
|
|
- :value="item.id"
|
|
|
+ v-for="item in options"
|
|
|
+ :key="item.id"
|
|
|
+ :label="item.name"
|
|
|
+ :value="item.id"
|
|
|
/>
|
|
|
</el-select>
|
|
|
- <div
|
|
|
- v-for="(btn, index) in functionButtons"
|
|
|
- :key="index"
|
|
|
- class="function-btn"
|
|
|
- @click="btn.handler"
|
|
|
- >
|
|
|
+ <div v-for="(btn, index) in functionButtons" :key="index" class="function-btn" @click="btn.handler">
|
|
|
<span class="btn-text">{{ btn.text }}</span>
|
|
|
</div>
|
|
|
</div>
|
|
|
-
|
|
|
+
|
|
|
<!-- 输入框区域 -->
|
|
|
<div class="input-area">
|
|
|
<div class="toolbar">
|
|
|
@@ -175,19 +194,19 @@ const resize = "?x-oss-process=image/resize,p_120/format,webp/quality,q_100";
|
|
|
const router = useRouter();
|
|
|
|
|
|
const props = defineProps({
|
|
|
- text:{
|
|
|
- type:String,
|
|
|
- defalut:''
|
|
|
+ text: {
|
|
|
+ type: String,
|
|
|
+ defalut: "",
|
|
|
},
|
|
|
- img:{
|
|
|
- type:String,
|
|
|
- defalut:''
|
|
|
+ img: {
|
|
|
+ type: String,
|
|
|
+ defalut: "",
|
|
|
},
|
|
|
- userId:{
|
|
|
- type:[String,Number],
|
|
|
- defalut:''
|
|
|
- }
|
|
|
-})
|
|
|
+ userId: {
|
|
|
+ type: [String, Number],
|
|
|
+ defalut: "",
|
|
|
+ },
|
|
|
+});
|
|
|
|
|
|
const defalutMsg = ref([
|
|
|
{
|
|
|
@@ -198,128 +217,136 @@ const defalutMsg = ref([
|
|
|
"你好,我叫陈晓晓。有100亩荔枝,30亩桂味,70亩妃子笑,位置在广州市番禺区大学城110号,希望您可以来指导。",
|
|
|
time: "上午10:32",
|
|
|
},
|
|
|
-])
|
|
|
+]);
|
|
|
|
|
|
-const curUserId = Number(localStorage.getItem('MINI_USER_ID'))
|
|
|
-const senderIcon = ref('')
|
|
|
-const receiverIcon = ref('')
|
|
|
-const receiverIdVal = ref(null)
|
|
|
+const curUserId = Number(localStorage.getItem("MINI_USER_ID"));
|
|
|
+const senderIcon = ref("");
|
|
|
+const receiverIcon = ref("");
|
|
|
+const receiverIdVal = ref(null);
|
|
|
|
|
|
// 本地用户头像
|
|
|
const localUserInfoIcon = (() => {
|
|
|
try {
|
|
|
- const info = JSON.parse(localStorage.getItem('localUserInfo') || '{}')
|
|
|
- return info?.icon || ''
|
|
|
+ const info = JSON.parse(localStorage.getItem("localUserInfo") || "{}");
|
|
|
+ return info?.icon || "";
|
|
|
} catch (e) {
|
|
|
- return ''
|
|
|
+ return "";
|
|
|
}
|
|
|
-})()
|
|
|
+})();
|
|
|
|
|
|
// 初始化本地头像为默认发送者头像
|
|
|
-senderIcon.value = localUserInfoIcon
|
|
|
+senderIcon.value = localUserInfoIcon;
|
|
|
|
|
|
//聊天会话
|
|
|
-const createSession = (targetUserId,callback) =>{
|
|
|
+const createSession = (targetUserId, callback) => {
|
|
|
// 先保存当前的对话样式消息 要注释
|
|
|
- const dialogMessages = messages.value.filter(msg => msg.messageType === 'dialog');
|
|
|
-
|
|
|
- VE_API.bbs.createSession({farmId:farmVal.value,targetUserId}).then(({data,code}) => {
|
|
|
- if(code === 0){
|
|
|
- senderIcon.value = localUserInfoIcon
|
|
|
- receiverIcon.value = data.session.targetUserAvatar
|
|
|
- receiverIdVal.value = data.session.targetUserId
|
|
|
- messages.value = data.messages.map(item =>{
|
|
|
- let content = item.content
|
|
|
- if(item.messageType==='image'){
|
|
|
+ const dialogMessages = messages.value.filter((msg) => msg.messageType === "dialog");
|
|
|
+
|
|
|
+ VE_API.bbs.createSession({ farmId: farmVal.value, targetUserId }).then(({ data, code }) => {
|
|
|
+ if (code === 0) {
|
|
|
+ senderIcon.value = localUserInfoIcon;
|
|
|
+ receiverIcon.value = data.session.targetUserAvatar;
|
|
|
+ receiverIdVal.value = data.session.targetUserId;
|
|
|
+ messages.value = data.messages.map((item) => {
|
|
|
+ let content = item.content;
|
|
|
+ if (item.messageType === "image") {
|
|
|
// 优先读取后端的 image 字段,其次兼容旧的 content(JSON)
|
|
|
if (item.image && (item.image.url || item.image.originUrl)) {
|
|
|
- content = item.image.url || item.image.originUrl
|
|
|
+ content = item.image.url || item.image.originUrl;
|
|
|
} else if (item.content) {
|
|
|
try {
|
|
|
- const imgObj = JSON.parse(item.content)
|
|
|
- content = imgObj.url || imgObj.originUrl
|
|
|
+ const imgObj = JSON.parse(item.content);
|
|
|
+ content = imgObj.url || imgObj.originUrl;
|
|
|
} catch (e) {
|
|
|
- console.error(e,'e')
|
|
|
+ console.error(e, "e");
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
return {
|
|
|
...item,
|
|
|
content,
|
|
|
- sender:item.senderId===curUserId?'sent':'received',
|
|
|
- senderIcon:item.senderId===curUserId ? localUserInfoIcon : data.session.targetUserAvatar,
|
|
|
- receiverIcon:data.session.targetUserAvatar
|
|
|
- }
|
|
|
- })
|
|
|
-
|
|
|
+ sender: item.senderId === curUserId ? "sent" : "received",
|
|
|
+ senderIcon: item.senderId === curUserId ? localUserInfoIcon : data.session.targetUserAvatar,
|
|
|
+ receiverIcon: data.session.targetUserAvatar,
|
|
|
+ };
|
|
|
+ });
|
|
|
+
|
|
|
// 重新添加对话样式消息 要注释
|
|
|
- if(dialogMessages.length > 0) {
|
|
|
+ if (dialogMessages.length > 0) {
|
|
|
messages.value = [...messages.value, ...dialogMessages];
|
|
|
}
|
|
|
-
|
|
|
- setTimeout(()=>{
|
|
|
+
|
|
|
+ setTimeout(() => {
|
|
|
scrollToBottom();
|
|
|
- },300)
|
|
|
- callback && callback()
|
|
|
+ }, 300);
|
|
|
+ callback && callback();
|
|
|
}
|
|
|
});
|
|
|
-}
|
|
|
+};
|
|
|
+
|
|
|
+const handleFarmChange = (e) => {
|
|
|
+ createSession(userId.value);
|
|
|
+ initMqtt();
|
|
|
+};
|
|
|
|
|
|
//发送消息接口
|
|
|
//类型 text ,file,image
|
|
|
-const sendMsg = (messageType = 'text',content = '',image = {}) =>{
|
|
|
+const sendMsg = (messageType = "text", content = "", image = {}) => {
|
|
|
const params = {
|
|
|
- farmId:farmVal.value,
|
|
|
- senderId:curUserId,
|
|
|
- receiverId:userId.value,
|
|
|
+ farmId: farmVal.value,
|
|
|
+ senderId: curUserId,
|
|
|
+ receiverId: userId.value,
|
|
|
content,
|
|
|
image,
|
|
|
- messageType
|
|
|
- }
|
|
|
+ messageType,
|
|
|
+ };
|
|
|
VE_API.bbs.sendMsg(params);
|
|
|
-}
|
|
|
+};
|
|
|
|
|
|
-const userId = ref(null)
|
|
|
-
|
|
|
-watch(()=>props.userId, async (newValue) =>{
|
|
|
- if(newValue){
|
|
|
- await getFarmList();
|
|
|
- userId.value = newValue
|
|
|
- createSession(newValue,()=>{
|
|
|
- if(props.text){
|
|
|
- sendMsg('text',props.text)
|
|
|
- messages.value.push({
|
|
|
- sender: "sent",
|
|
|
- senderIcon: senderIcon.value,
|
|
|
- messageType: "text",
|
|
|
- content:props.text,
|
|
|
- })
|
|
|
- if(props.img){
|
|
|
- const imgArr = JSON.parse(props.img)
|
|
|
- if(imgArr.length){
|
|
|
- imgArr.forEach(item =>{
|
|
|
- sendMsg('image', '', { url: item, thumbnailUrl: item + resize })
|
|
|
- messages.value.push({
|
|
|
- sender: "sent",
|
|
|
- senderIcon: senderIcon.value,
|
|
|
- messageType: "image",
|
|
|
- content:item,
|
|
|
- })
|
|
|
- })
|
|
|
+const userId = ref(null);
|
|
|
+
|
|
|
+watch(
|
|
|
+ () => props.userId,
|
|
|
+ async (newValue) => {
|
|
|
+ if (newValue) {
|
|
|
+ await getFarmList();
|
|
|
+ userId.value = newValue;
|
|
|
+ createSession(newValue, () => {
|
|
|
+ if (props.text) {
|
|
|
+ sendMsg("text", props.text);
|
|
|
+ messages.value.push({
|
|
|
+ sender: "sent",
|
|
|
+ senderIcon: senderIcon.value,
|
|
|
+ messageType: "text",
|
|
|
+ content: props.text,
|
|
|
+ });
|
|
|
+ if (props.img) {
|
|
|
+ const imgArr = JSON.parse(props.img);
|
|
|
+ if (imgArr.length) {
|
|
|
+ imgArr.forEach((item) => {
|
|
|
+ sendMsg("image", "", { url: item, thumbnailUrl: item + resize });
|
|
|
+ messages.value.push({
|
|
|
+ sender: "sent",
|
|
|
+ senderIcon: senderIcon.value,
|
|
|
+ messageType: "image",
|
|
|
+ content: item,
|
|
|
+ });
|
|
|
+ });
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
- }
|
|
|
- })
|
|
|
- initMqtt()
|
|
|
+ });
|
|
|
+ initMqtt();
|
|
|
+ }
|
|
|
}
|
|
|
-})
|
|
|
+);
|
|
|
|
|
|
-onDeactivated(()=>{
|
|
|
+onDeactivated(() => {
|
|
|
// mqttClient.value.client.end(true);
|
|
|
-})
|
|
|
+});
|
|
|
|
|
|
// mqtt 连接
|
|
|
-const mqttClient = ref(null)
|
|
|
+const mqttClient = ref(null);
|
|
|
const messagesContainer = ref(null);
|
|
|
|
|
|
// 消息数据
|
|
|
@@ -349,30 +376,29 @@ const previewImage = ref(null);
|
|
|
const initMqtt = () => {
|
|
|
const topics = [`user/chat/message/${farmVal.value}/${curUserId}`]; // 订阅的主题数组
|
|
|
mqttClient.value = new MqttClient(topics, (topic, message) => {
|
|
|
- console.log(topic,'topic')
|
|
|
- console.log('接收推送信息:', message);
|
|
|
- if(message && message.length > 10){
|
|
|
- const obj = JSON.parse(message)
|
|
|
- console.log('message有值',obj)
|
|
|
- if(obj.senderId === receiverIdVal.value){
|
|
|
- if(obj.messageType==="image"){
|
|
|
+ console.log(topic, "topic");
|
|
|
+ console.log("接收推送信息:", message);
|
|
|
+ if (message && message.length > 10) {
|
|
|
+ const obj = JSON.parse(message);
|
|
|
+ console.log("message有值", obj);
|
|
|
+ if (obj.senderId === receiverIdVal.value) {
|
|
|
+ if (obj.messageType === "image") {
|
|
|
if (obj.image && (obj.image.url || obj.image.originUrl)) {
|
|
|
- obj.content = obj.image.url || obj.image.originUrl
|
|
|
+ obj.content = obj.image.url || obj.image.originUrl;
|
|
|
} else if (obj.content) {
|
|
|
try {
|
|
|
- const img = JSON.parse(obj.content)
|
|
|
- obj.content = img.url || img.originUrl
|
|
|
+ const img = JSON.parse(obj.content);
|
|
|
+ obj.content = img.url || img.originUrl;
|
|
|
} catch (e) {
|
|
|
- console.error(e,'e')
|
|
|
+ console.error(e, "e");
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
- obj.receiverId = curUserId
|
|
|
- obj.sender = obj.senderId === curUserId ?'sent':'received',
|
|
|
- obj.senderIcon = senderIcon.value
|
|
|
- obj.receiverIcon = receiverIcon.value
|
|
|
- messages.value.push(obj)
|
|
|
-
|
|
|
+ obj.receiverId = curUserId;
|
|
|
+ (obj.sender = obj.senderId === curUserId ? "sent" : "received"), (obj.senderIcon = senderIcon.value);
|
|
|
+ obj.receiverIcon = receiverIcon.value;
|
|
|
+ messages.value.push(obj);
|
|
|
+
|
|
|
scrollToBottom();
|
|
|
}
|
|
|
}
|
|
|
@@ -383,14 +409,14 @@ const initMqtt = () => {
|
|
|
|
|
|
// 发送消息
|
|
|
const sendMessage = (message) => {
|
|
|
- if(message.messageType === 'text'){
|
|
|
- sendMsg('text',message.content)
|
|
|
- }else if(message.messageType === 'image'){
|
|
|
+ if (message.messageType === "text") {
|
|
|
+ sendMsg("text", message.content);
|
|
|
+ } else if (message.messageType === "image") {
|
|
|
// 按新协议:不传 content,传 image 对象
|
|
|
- sendMsg('image', '', { url: message.content, thumbnailUrl: message.content + resize })
|
|
|
- }else if(message.messageType === 'dialog'){
|
|
|
+ sendMsg("image", "", { url: message.content, thumbnailUrl: message.content + resize });
|
|
|
+ } else if (message.messageType === "dialog") {
|
|
|
// 对话样式消息不发送到服务器,只显示在本地
|
|
|
- console.log('发送对话样式消息:', message.content);
|
|
|
+ console.log("发送对话样式消息:", message.content);
|
|
|
}
|
|
|
messages.value.push(message);
|
|
|
scrollToBottom();
|
|
|
@@ -447,10 +473,10 @@ const handleImageUpload = (event) => {
|
|
|
const file = event.target.files[0];
|
|
|
if (file) {
|
|
|
// 实际项目中应该上传到服务器,这里使用本地URL模拟
|
|
|
- const miniUserId = localStorage.getItem('MINI_USER_ID')
|
|
|
+ const miniUserId = localStorage.getItem("MINI_USER_ID");
|
|
|
let ext = getFileExt(file.name);
|
|
|
let key = `birdseye-look-mini/${miniUserId}/${new Date().getTime()}.${ext}`;
|
|
|
- let imageUrl = ''
|
|
|
+ let imageUrl = "";
|
|
|
uploadFileObj.put(key, file).then((resFilename) => {
|
|
|
imageUrl = base_img_url2 + resFilename;
|
|
|
sendImageMessage(imageUrl);
|
|
|
@@ -534,19 +560,19 @@ const addEmoji = (emoji) => {
|
|
|
// 功能按钮配置
|
|
|
const functionButtons = ref([
|
|
|
{
|
|
|
- text: '农场报告',
|
|
|
+ text: "农场报告",
|
|
|
handler: () => {
|
|
|
- console.log('点击农场报告,农场ID:', farmVal.value);
|
|
|
+ console.log("点击农场报告,农场ID:", farmVal.value);
|
|
|
// 发送农场报告对话框消息
|
|
|
sendFarmReportDialog();
|
|
|
- }
|
|
|
+ },
|
|
|
},
|
|
|
{
|
|
|
- text: '农事卡片',
|
|
|
+ text: "农事卡片",
|
|
|
handler: () => {
|
|
|
// 跳转到农事卡片页面
|
|
|
router.push(`/farm_card?farmId=${farmVal.value}`);
|
|
|
- }
|
|
|
+ },
|
|
|
},
|
|
|
// {
|
|
|
// text: '农场相册',
|
|
|
@@ -567,47 +593,47 @@ const getCurrentTime = () => {
|
|
|
|
|
|
const scrollToBottom = () => {
|
|
|
nextTick(() => {
|
|
|
- setTimeout(()=>{
|
|
|
+ setTimeout(() => {
|
|
|
if (messagesContainer.value) {
|
|
|
- messagesContainer.value.scrollTop = messagesContainer.value.scrollHeight
|
|
|
+ messagesContainer.value.scrollTop = messagesContainer.value.scrollHeight;
|
|
|
}
|
|
|
- },300)
|
|
|
+ }, 300);
|
|
|
});
|
|
|
};
|
|
|
|
|
|
-const farmVal = ref('')
|
|
|
-const options = ref([])
|
|
|
+const farmVal = ref("");
|
|
|
+const options = ref([]);
|
|
|
|
|
|
// 获取农场列表
|
|
|
function getFarmList() {
|
|
|
- return VE_API.farm.userFarmSelectOption().then(({data}) => {
|
|
|
- options.value = data || []
|
|
|
+ return VE_API.farm.userFarmSelectOption().then(({ data }) => {
|
|
|
+ options.value = data || [];
|
|
|
if (data && data.length > 0) {
|
|
|
- const defaultOption = data.find(item => item.defaultOption === true)
|
|
|
- farmVal.value = defaultOption ? defaultOption.id : data[0].id
|
|
|
+ const defaultOption = data.find((item) => item.defaultOption === true);
|
|
|
+ farmVal.value = defaultOption ? defaultOption.id : data[0].id;
|
|
|
}
|
|
|
- })
|
|
|
+ });
|
|
|
}
|
|
|
|
|
|
-onActivated(()=>{
|
|
|
- if(props.userId){
|
|
|
- scrollToBottom();
|
|
|
+onActivated(() => {
|
|
|
+ if (props.userId) {
|
|
|
+ scrollToBottom();
|
|
|
}
|
|
|
// 检查是否有选中的农事工作数据
|
|
|
checkSelectedFarmWork();
|
|
|
-})
|
|
|
+});
|
|
|
|
|
|
// 检查选中的农事工作数据
|
|
|
const checkSelectedFarmWork = () => {
|
|
|
- const selectedFarmWork = localStorage.getItem('selectedFarmWork');
|
|
|
+ const selectedFarmWork = localStorage.getItem("selectedFarmWork");
|
|
|
if (selectedFarmWork) {
|
|
|
const data = JSON.parse(selectedFarmWork);
|
|
|
// 发送对话样式的消息
|
|
|
sendDialogMessage(data.dialogMessage);
|
|
|
// 清除localStorage中的数据
|
|
|
- localStorage.removeItem('selectedFarmWork');
|
|
|
+ localStorage.removeItem("selectedFarmWork");
|
|
|
}
|
|
|
-}
|
|
|
+};
|
|
|
|
|
|
// 发送对话样式的消息
|
|
|
const sendDialogMessage = (dialogData) => {
|
|
|
@@ -619,25 +645,25 @@ const sendDialogMessage = (dialogData) => {
|
|
|
time: getCurrentTime(),
|
|
|
};
|
|
|
sendMessage(message);
|
|
|
-}
|
|
|
+};
|
|
|
|
|
|
// 发送农场报告对话框
|
|
|
const sendFarmReportDialog = () => {
|
|
|
- const currentFarmName = options.value.find(opt => opt.id === farmVal.value)?.name || '当前农场';
|
|
|
-
|
|
|
+ const currentFarmName = options.value.find((opt) => opt.id === farmVal.value)?.name || "当前农场";
|
|
|
+
|
|
|
const farmReportData = {
|
|
|
- type: 'farm_report',
|
|
|
+ type: "farm_report",
|
|
|
title: currentFarmName,
|
|
|
- content: '这是我的果园情况,请查看~',
|
|
|
+ content: "这是我的果园情况,请查看~",
|
|
|
reportDetails: {
|
|
|
farmId: farmVal.value,
|
|
|
farmName: currentFarmName,
|
|
|
- reportDate: new Date().toLocaleDateString('zh-CN'),
|
|
|
- reportType: '综合报告',
|
|
|
- status: '正常'
|
|
|
- }
|
|
|
+ reportDate: new Date().toLocaleDateString("zh-CN"),
|
|
|
+ reportType: "综合报告",
|
|
|
+ status: "正常",
|
|
|
+ },
|
|
|
};
|
|
|
-
|
|
|
+
|
|
|
const message = {
|
|
|
sender: "sent",
|
|
|
messageType: "dialog",
|
|
|
@@ -647,7 +673,7 @@ const sendFarmReportDialog = () => {
|
|
|
time: getCurrentTime(),
|
|
|
};
|
|
|
sendMessage(message);
|
|
|
-}
|
|
|
+};
|
|
|
</script>
|
|
|
|
|
|
<style scoped lang="scss">
|
|
|
@@ -897,7 +923,6 @@ const sendFarmReportDialog = () => {
|
|
|
}
|
|
|
}
|
|
|
|
|
|
-
|
|
|
/* 图片预览 */
|
|
|
.image-preview {
|
|
|
position: fixed;
|
|
|
@@ -924,58 +949,60 @@ const sendFarmReportDialog = () => {
|
|
|
background: #fff !important;
|
|
|
padding: 10px;
|
|
|
border-radius: 10px;
|
|
|
- .report-title{
|
|
|
+ .report-title {
|
|
|
font-size: 16px;
|
|
|
font-weight: 600;
|
|
|
color: #000;
|
|
|
margin-bottom: 5px;
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
.dialog-title {
|
|
|
font-size: 12px;
|
|
|
color: rgba(0, 0, 0, 0.6);
|
|
|
margin-bottom: 10px;
|
|
|
}
|
|
|
- .monitor-image{
|
|
|
- width: 222px;
|
|
|
- height: 180px;
|
|
|
+ .monitor-image {
|
|
|
+ width: 222px;
|
|
|
+ height: 180px;
|
|
|
object-fit: cover;
|
|
|
- }
|
|
|
-
|
|
|
- .farm-report-content, .farm-work-content {
|
|
|
- .report-details, .work-details {
|
|
|
- background: #f8f9fa;
|
|
|
- border-radius: 8px;
|
|
|
- padding: 12px;
|
|
|
- margin-top: 10px;
|
|
|
-
|
|
|
- .detail-item {
|
|
|
- display: flex;
|
|
|
- margin-bottom: 6px;
|
|
|
- font-size: 13px;
|
|
|
-
|
|
|
- &:last-child {
|
|
|
- margin-bottom: 0;
|
|
|
- }
|
|
|
-
|
|
|
- .detail-label {
|
|
|
- color: #666;
|
|
|
- min-width: 80px;
|
|
|
- }
|
|
|
-
|
|
|
- .detail-value {
|
|
|
- color: #333;
|
|
|
- flex: 1;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
+ }
|
|
|
+
|
|
|
+ .farm-report-content,
|
|
|
+ .farm-work-content {
|
|
|
+ .report-details,
|
|
|
+ .work-details {
|
|
|
+ background: #f8f9fa;
|
|
|
+ border-radius: 8px;
|
|
|
+ padding: 12px;
|
|
|
+ margin-top: 10px;
|
|
|
+
|
|
|
+ .detail-item {
|
|
|
+ display: flex;
|
|
|
+ margin-bottom: 6px;
|
|
|
+ font-size: 13px;
|
|
|
+
|
|
|
+ &:last-child {
|
|
|
+ margin-bottom: 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ .detail-label {
|
|
|
+ color: #666;
|
|
|
+ min-width: 80px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .detail-value {
|
|
|
+ color: #333;
|
|
|
+ flex: 1;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
}
|
|
|
|
|
|
/* 我方消息中的对话样式 */
|
|
|
.message.sent .dialog-message {
|
|
|
background: #e3f2fd;
|
|
|
-
|
|
|
+
|
|
|
.work-details {
|
|
|
background: #f0f8ff;
|
|
|
}
|