This commit is contained in:
parent
c2899beea1
commit
c13e52d482
71
src/App.vue
71
src/App.vue
|
@ -5,49 +5,56 @@
|
||||||
import { globalEventBus } from '@/common/eventBus'
|
import { globalEventBus } from '@/common/eventBus'
|
||||||
import { Push } from '@/common/push'
|
import { Push } from '@/common/push'
|
||||||
import { areaObj } from "@/store/index.js"
|
import { areaObj } from "@/store/index.js"
|
||||||
|
import { useRouter } from 'vue-router';
|
||||||
|
const router=useRouter()
|
||||||
|
|
||||||
|
|
||||||
const userInfoStore=areaObj()
|
const userInfoStore=areaObj()
|
||||||
userInfoStore.changeUserInfoFn(510521)
|
userInfoStore.changeUserInfoFn(510521)
|
||||||
|
|
||||||
// var connection = new Push({
|
var connection = new Push({
|
||||||
// url: 'ws://192.168.1.10:3131', // websocket地址
|
url: 'wss://chat.lihaink.cn/tts', // websocket地址
|
||||||
// app_key: 'aaea61749929eb53a4bd75a1474c1d27',
|
app_key: 'aaea61749929eb53a4bd75a1474c1d27',
|
||||||
// });
|
});
|
||||||
// // 假设用户uid为1
|
// 假设用户uid为1
|
||||||
// var uid = 3;
|
var uid = 3;
|
||||||
// // 浏览器监听user-2频道的消息,也就是用户uid为1的用户消息
|
// 浏览器监听user-2频道的消息,也就是用户uid为1的用户消息
|
||||||
// var user_channel = connection.subscribe('user-' + uid);
|
var user_channel = connection.subscribe('user-' + uid);
|
||||||
|
|
||||||
// // 当user-2频道有message事件的消息时
|
// 当user-2频道有message事件的消息时
|
||||||
// user_channel.on('message', function (data) {
|
user_channel.on('message', function (data) {
|
||||||
// globalEventBus.emit(data.content.event, data.content.data)
|
|
||||||
|
|
||||||
|
|
||||||
// console.log("收到消息",data)
|
|
||||||
|
|
||||||
// });
|
|
||||||
// // 断线事件
|
|
||||||
// user_channel.on('close', function () {
|
|
||||||
|
|
||||||
// });
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
var ws = new WebSocket("ws://192.168.26.167:8080");
|
globalEventBus.emit(data.content.event, data.content.data)
|
||||||
|
});
|
||||||
|
// 断线事件
|
||||||
|
user_channel.on('close', function () {
|
||||||
|
|
||||||
//当WebSocket创建成功时,触发onopen事件
|
});
|
||||||
ws.onopen = function () {
|
|
||||||
console.log("open");
|
|
||||||
}
|
|
||||||
//当客户端收到服务端发来的消息时,触发onmessage事件,参数e.data包含server传递过来的数据
|
|
||||||
ws.onmessage = function (e) {
|
|
||||||
|
|
||||||
let data =JSON.parse(e.data)
|
|
||||||
|
|
||||||
globalEventBus.emit(data.event, data.data ||'')
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
}
|
globalEventBus.on('refresh', data => {
|
||||||
|
router.go(0)
|
||||||
|
})
|
||||||
|
|
||||||
|
// var ws = new WebSocket("ws://192.168.26.167:8080");
|
||||||
|
|
||||||
|
// //当WebSocket创建成功时,触发onopen事件
|
||||||
|
// ws.onopen = function () {
|
||||||
|
// console.log("open");
|
||||||
|
// }
|
||||||
|
// //当客户端收到服务端发来的消息时,触发onmessage事件,参数e.data包含server传递过来的数据
|
||||||
|
// ws.onmessage = function (e) {
|
||||||
|
|
||||||
|
// let data =JSON.parse(e.data)
|
||||||
|
|
||||||
|
// globalEventBus.emit(data.event, data.data ||'')
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
// }
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
<template>
|
<template>
|
||||||
|
|
|
@ -3,6 +3,7 @@
|
||||||
<div class="logo" style="background-color: red;">
|
<div class="logo" style="background-color: red;">
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<!-- <div style="color: red;">{{ areaStore.userInfo }}</div> -->
|
||||||
<div class="right">
|
<div class="right">
|
||||||
<div class="rigth-li" @click="choseArea = true"> <img style="width: 1VW;height:1VW;margin-right: 0.5vw;"
|
<div class="rigth-li" @click="choseArea = true"> <img style="width: 1VW;height:1VW;margin-right: 0.5vw;"
|
||||||
:src="u('DW')" alt=""> {{ areaStore.userInfo.name|| '泸县' }}
|
:src="u('DW')" alt=""> {{ areaStore.userInfo.name|| '泸县' }}
|
||||||
|
@ -39,8 +40,6 @@ import { areaObj } from "@/store/index.js"
|
||||||
|
|
||||||
const areaStore = areaObj()
|
const areaStore = areaObj()
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
const u = (name) => {
|
const u = (name) => {
|
||||||
return `/static/index/${name}.png`
|
return `/static/index/${name}.png`
|
||||||
}
|
}
|
||||||
|
|
|
@ -170,32 +170,6 @@ const initAreaMap = () => {
|
||||||
|
|
||||||
|
|
||||||
},
|
},
|
||||||
|
|
||||||
// {
|
|
||||||
// type: "map",
|
|
||||||
// map: mapName,
|
|
||||||
// zlevel: -1,
|
|
||||||
// aspectScale: 1,
|
|
||||||
// zoom: 1.2,
|
|
||||||
// layoutCenter: ["50%", "51%"],
|
|
||||||
// layoutSize: "110%",
|
|
||||||
// roam: false,
|
|
||||||
// silent: true,
|
|
||||||
|
|
||||||
// itemStyle: {
|
|
||||||
// normal: {
|
|
||||||
// borderWidth: 1,
|
|
||||||
// borderColor: "rgba(17, 149, 216,0.6)",
|
|
||||||
// borderColor: "#5AD0E0",
|
|
||||||
// shadowColor: "rgba(172, 122, 255,0.5)",
|
|
||||||
// shadowOffsetY: 5,
|
|
||||||
// shadowBlur: 15,
|
|
||||||
// areaColor: "rgba(5,21,35,0.1)",
|
|
||||||
// },
|
|
||||||
// },
|
|
||||||
// },
|
|
||||||
|
|
||||||
|
|
||||||
{
|
{
|
||||||
type: "map",
|
type: "map",
|
||||||
map: mapName,
|
map: mapName,
|
||||||
|
@ -315,7 +289,7 @@ const initAreaMap = () => {
|
||||||
],
|
],
|
||||||
};
|
};
|
||||||
|
|
||||||
document.getElementById("chart2").removeAttribute('_echarts_instance_');
|
// document.getElementById("chart2").removeAttribute('_echarts_instance_');
|
||||||
echarts.registerMap(mapName, geoJson)
|
echarts.registerMap(mapName, geoJson)
|
||||||
const bg = echarts.init(myChart)
|
const bg = echarts.init(myChart)
|
||||||
bg.setOption(option);
|
bg.setOption(option);
|
||||||
|
@ -355,14 +329,9 @@ const initTownMap = async (name) => {
|
||||||
})
|
})
|
||||||
|
|
||||||
const townJson = deepCopy(geoJson)
|
const townJson = deepCopy(geoJson)
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
townJson.features = townJson.features.filter((item) => {
|
townJson.features = townJson.features.filter((item) => {
|
||||||
return item.properties.name == name
|
return item.properties.name == name
|
||||||
})
|
})
|
||||||
console.log(townJson,"res")
|
|
||||||
|
|
||||||
var mapName = 'town';
|
var mapName = 'town';
|
||||||
const myChart = document.getElementById("chart3")
|
const myChart = document.getElementById("chart3")
|
||||||
let option = {
|
let option = {
|
||||||
|
@ -555,8 +524,7 @@ const initTownMap = async (name) => {
|
||||||
|
|
||||||
|
|
||||||
let longInfo = params.data.coord
|
let longInfo = params.data.coord
|
||||||
console.log(params)
|
|
||||||
return
|
|
||||||
areaStore.areaCodeList.forEach(item => {
|
areaStore.areaCodeList.forEach(item => {
|
||||||
if (item.name == name) {
|
if (item.name == name) {
|
||||||
areaStore.changeUserInfoFn(510521, item.code)
|
areaStore.changeUserInfoFn(510521, item.code)
|
||||||
|
@ -568,29 +536,11 @@ console.log(params)
|
||||||
}
|
}
|
||||||
|
|
||||||
})
|
})
|
||||||
|
|
||||||
// console.log(params.data.coord)
|
|
||||||
// console.log(params.data.data)
|
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
// watch(() => areaStore.address, (value, oldValue) => {
|
|
||||||
// if (value.city) {
|
|
||||||
// initAreaMap()
|
|
||||||
// }
|
|
||||||
// else if (value.area) {
|
|
||||||
// showArea.value = false
|
|
||||||
// initTownMap(value.area)
|
|
||||||
// }
|
|
||||||
// }, {
|
|
||||||
// deep: true,
|
|
||||||
// }
|
|
||||||
|
|
||||||
// )
|
|
||||||
|
|
||||||
watch(() => areaStore.userInfo.areaCode, (value, oldValue) => {
|
watch(() => areaStore.userInfo.areaCode, (value, oldValue) => {
|
||||||
|
|
||||||
console.log(value,'value')
|
|
||||||
|
|
||||||
if (value) {
|
if (value) {
|
||||||
switch (value) {
|
switch (value) {
|
||||||
case "510503":
|
case "510503":
|
||||||
|
@ -611,7 +561,6 @@ console.log(value,'value')
|
||||||
case "510524":
|
case "510524":
|
||||||
geoJson = geoJsonXuyong
|
geoJson = geoJsonXuyong
|
||||||
break;
|
break;
|
||||||
|
|
||||||
case "510525":
|
case "510525":
|
||||||
geoJson = geoJsonGulin
|
geoJson = geoJsonGulin
|
||||||
break;
|
break;
|
||||||
|
@ -630,33 +579,39 @@ console.log(value,'value')
|
||||||
)
|
)
|
||||||
|
|
||||||
|
|
||||||
|
/* 夏弥睡眼惺忪地抬起头来,脸上还有手表压出的印子,“居然睡着了……都快给高数折磨疯了。我说卡塞尔学院的高数课真是有够变态。”她是一边跟楚子航聊天一边啃课本的时候睡着的,这些天她常常在病房里混迹,好像这里是她的自习室。楚子航渐渐地也习惯了,如果他困了就会直接睡过去,当她不存在,有时候醒来夏弥还在,有时候夏弥走了。*/
|
||||||
|
|
||||||
onMounted(async () => {
|
onMounted(async () => {
|
||||||
setTimeout(() => { initAreaMap() }, 1000)
|
setTimeout(() => { initAreaMap() }, 500)
|
||||||
})
|
})
|
||||||
|
|
||||||
globalEventBus.on('choserArea', data => {
|
globalEventBus.on('choserArea', data => {
|
||||||
|
|
||||||
areaStore.changeUserInfoFn(data.code, '', data.name)
|
areaStore.changeUserInfoFn(data.code, '', data.name)
|
||||||
|
|
||||||
// console.log(areaStore.userInfo, "data")
|
|
||||||
|
|
||||||
})
|
})
|
||||||
globalEventBus.on('choseTown', data => {
|
globalEventBus.on('choseTown', data => {
|
||||||
getTowmName(data.name)
|
getTowmName(data.name)
|
||||||
areaStore.areaCodeList.forEach(item => {
|
areaStore.areaCodeList.forEach(item => {
|
||||||
if (item.name == (data.name)) {
|
if (item.name == (data.name)) {
|
||||||
areaStore.changeUserInfoFn(areaStore.userInfo.areaCode, item.code,data.name)
|
areaStore.changeUserInfoFn(areaStore.userInfo.areaCode, item.code, data.name)
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
areaStore.changeAddress('', data.name )
|
areaStore.changeAddress('', data.name)
|
||||||
initTownMap(data.name)
|
initTownMap(data.name)
|
||||||
|
|
||||||
})
|
})
|
||||||
|
|
||||||
globalEventBus.on('choseLand', data => {
|
globalEventBus.on('choseLand', data => {
|
||||||
|
|
||||||
router.push(`/detail?landId=${data.id}&town=${areaStore.userInfo.name}&parmas=${JSON.stringify(areaStore.userInfo)}&landName=${data.landName}`)
|
router.push(`/detail?landId=${data.id}&town=${areaStore.userInfo.name}&parmas=${JSON.stringify(areaStore.userInfo)}&landName=${data.landName}`)
|
||||||
|
})
|
||||||
|
|
||||||
|
|
||||||
|
globalEventBus.on('initAreaMap', data => {
|
||||||
|
areaStore.changeUserInfoFn(areaStore.userInfo.areaCode, '', '')
|
||||||
|
|
||||||
|
console.log("chufa")
|
||||||
|
initAreaMap()
|
||||||
})
|
})
|
||||||
</script>
|
</script>
|
|
@ -32,20 +32,33 @@
|
||||||
</style>
|
</style>
|
||||||
|
|
||||||
<script setup>
|
<script setup>
|
||||||
import { ref, onMounted, defineEmits } from "vue"
|
import { ref, onMounted, defineEmits,watch } from "vue"
|
||||||
import * as echarts from 'echarts';
|
import * as echarts from 'echarts';
|
||||||
import "echarts-gl"
|
import "echarts-gl"
|
||||||
import geoJsonLuxian from "/static/jsonData/luxian_geo.js"
|
import geoJsonLuxian from "/static/jsonData/luxian_geo.js"
|
||||||
// import geoJson from "/static/jsonData/luxian_geo.js"
|
import geoJsonGulin from "/static/jsonData/gulin_geo.js"
|
||||||
import { useRoute } from "vue-router"
|
import geoJsonHejiang from "/static/jsonData/hejiang_geo.js"
|
||||||
|
import geoJsonJiangyang from "/static/jsonData/jiangyang_geo.js"
|
||||||
|
import geoJsonLongmatan from "/static/jsonData/longmatan_geo.js"
|
||||||
|
import geoJsonNaxi from "/static/jsonData/naxi_geo.js"
|
||||||
|
import geoJsonXuyong from "/static/jsonData/xuyong_geo.js"
|
||||||
|
import { useRoute,useRouter } from "vue-router"
|
||||||
import { areaObj } from "@/store/index.js"
|
import { areaObj } from "@/store/index.js"
|
||||||
import { landListApi } from "@/api.js"
|
import { landListApi } from "@/api.js"
|
||||||
import { globalEventBus } from '@/common/eventBus'
|
import { globalEventBus } from '@/common/eventBus'
|
||||||
|
const router=useRouter()
|
||||||
|
const route = useRoute()
|
||||||
|
|
||||||
|
let geoJson ;
|
||||||
const icon = "https:\/\/ceshi-worker-task.lihaink.cn\/uploads\/images\/20231204\/202312041608529c9e21252.png"
|
const icon = "https:\/\/ceshi-worker-task.lihaink.cn\/uploads\/images\/20231204\/202312041608529c9e21252.png"
|
||||||
|
const areaStore = areaObj()
|
||||||
|
if(JSON.parse(route.query.parmas).areaCode==510503) geoJson = geoJsonNaxi;
|
||||||
let geoJson = geoJsonLuxian
|
if(JSON.parse(route.query.parmas).areaCode==510502) geoJson = geoJsonJiangyang;
|
||||||
|
if(JSON.parse(route.query.parmas).areaCode==510504) geoJson = geoJsonLongmatan;
|
||||||
|
if(JSON.parse(route.query.parmas).areaCode==510521) geoJson = geoJsonLuxian;
|
||||||
|
if(JSON.parse(route.query.parmas).areaCode==510522) geoJson = geoJsonHejiang;
|
||||||
|
if(JSON.parse(route.query.parmas).areaCode==510524) geoJson = geoJsonXuyong;
|
||||||
|
if(JSON.parse(route.query.parmas).areaCode==510525) geoJson = geoJsonGulinc;
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
@ -66,60 +79,27 @@ const pointerFn2 = (lists) => {
|
||||||
})
|
})
|
||||||
return list
|
return list
|
||||||
}
|
}
|
||||||
const areaStore = areaObj()
|
|
||||||
const deepCopy = (obj) => {
|
const deepCopy = (obj) => {
|
||||||
if (typeof obj !== 'object' || obj === null) {
|
if (typeof obj !== 'object' || obj === null) {
|
||||||
return obj;
|
return obj;
|
||||||
}
|
}
|
||||||
|
|
||||||
let copy = Array.isArray(obj) ? [] : {};
|
let copy = Array.isArray(obj) ? [] : {};
|
||||||
|
|
||||||
for (let key in obj) {
|
for (let key in obj) {
|
||||||
if (Object.prototype.hasOwnProperty.call(obj, key)) {
|
if (Object.prototype.hasOwnProperty.call(obj, key)) {
|
||||||
copy[key] = deepCopy(obj[key]);
|
copy[key] = deepCopy(obj[key]);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
return copy;
|
return copy;
|
||||||
}
|
}
|
||||||
const route = useRoute()
|
|
||||||
const townJson = deepCopy(geoJson)
|
const townJson = deepCopy(JSON.parse( JSON.stringify(geoJson)) )
|
||||||
|
townJson.features=geoJson.features
|
||||||
townJson.features = townJson.features.filter((item) => {
|
townJson.features = townJson.features.filter((item) => {
|
||||||
return item.properties.name == route.query.town
|
return item.properties.name == route.query.town
|
||||||
})
|
})
|
||||||
const lx = "https:\/\/ceshi-worker-task.lihaink.cn\/uploads\/images\/20231205\/20231205092709cfe148712.png"
|
const lx = "https:\/\/ceshi-worker-task.lihaink.cn\/uploads\/images\/20231205\/20231205092709cfe148712.png"
|
||||||
|
const initMap=async ()=>{
|
||||||
// const pointerFn2 = (lists) => {
|
|
||||||
// let list = []
|
|
||||||
// lists.forEach((item, index) => {
|
|
||||||
// list.push({
|
|
||||||
// coord: item.value,
|
|
||||||
// value: item.name,
|
|
||||||
// animation: true,
|
|
||||||
// data: lists,
|
|
||||||
// itemStyle: {
|
|
||||||
// normal: {
|
|
||||||
// borderColor: 'red',
|
|
||||||
// borderWidth: 1, // 标注边线线宽,单位px,默认为1
|
|
||||||
// label: {
|
|
||||||
// show: false
|
|
||||||
// }
|
|
||||||
// },
|
|
||||||
// emphasis: {
|
|
||||||
// borderColor: 'red',
|
|
||||||
// borderWidth: 5,
|
|
||||||
// label: {
|
|
||||||
// show: false
|
|
||||||
// }
|
|
||||||
// }
|
|
||||||
// },
|
|
||||||
|
|
||||||
|
|
||||||
// },)
|
|
||||||
// })
|
|
||||||
// return list
|
|
||||||
// }
|
|
||||||
onMounted(async () => {
|
|
||||||
let center = []
|
let center = []
|
||||||
let pointerList = []
|
let pointerList = []
|
||||||
let res = await landListApi({
|
let res = await landListApi({
|
||||||
|
@ -135,8 +115,6 @@ onMounted(async () => {
|
||||||
})
|
})
|
||||||
|
|
||||||
})
|
})
|
||||||
|
|
||||||
|
|
||||||
var mapName = 'lz';
|
var mapName = 'lz';
|
||||||
const myChart = document.getElementById("farmerchart")
|
const myChart = document.getElementById("farmerchart")
|
||||||
/*获取地图数据*/
|
/*获取地图数据*/
|
||||||
|
@ -340,7 +318,7 @@ onMounted(async () => {
|
||||||
},
|
},
|
||||||
],
|
],
|
||||||
};
|
};
|
||||||
document.getElementById("farmerchart").removeAttribute('_echarts_instance_');
|
// document.getElementById("farmerchart").removeAttribute('_echarts_instance_');
|
||||||
echarts.registerMap(mapName, townJson)
|
echarts.registerMap(mapName, townJson)
|
||||||
const bg = echarts.init(myChart)
|
const bg = echarts.init(myChart)
|
||||||
bg.setOption(option);
|
bg.setOption(option);
|
||||||
|
@ -360,15 +338,18 @@ onMounted(async () => {
|
||||||
})
|
})
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
onMounted(async () => {
|
||||||
|
initMap()
|
||||||
|
|
||||||
})
|
})
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
globalEventBus.on('detail', data => {
|
globalEventBus.on('detail', data => {
|
||||||
|
|
||||||
emit('changeLand', data)
|
emit('changeLand', data)
|
||||||
|
|
||||||
|
|
||||||
})
|
})
|
||||||
|
|
||||||
|
|
||||||
|
|
|
@ -0,0 +1,52 @@
|
||||||
|
<template>
|
||||||
|
<div style="display: flex;justify-content: space-between;" v-if="userInfoStore.userInfo.streetCode">
|
||||||
|
<div class="c-top-tits" style="z-index: 99999;"><span class="color-font" @click="back">返回首页</span></div>
|
||||||
|
<div class="c-top-tits" style="z-index: 99999;"><span class="color-font">{{ props.townName }}地块</span> </div>
|
||||||
|
</div>
|
||||||
|
<div class="c-top-tit" v-else>
|
||||||
|
<div class="c-top-li">种植面积 <span class="color-font" style="font-size: 18px;margin-left: 1vw; ">{{
|
||||||
|
centerData.totalArea }}</span> ㎡</div>
|
||||||
|
<div class="c-top-li">种植种类 <span class="color-font" style="font-size: 18px;margin-left: 1vw; ">{{
|
||||||
|
centerData.plantCount }}</span> 种</div>
|
||||||
|
<div class="c-top-li">地块数量 <span class="color-font" style="font-size: 18px;margin-left: 1vw; ">{{
|
||||||
|
centerData.landCount }}</span> 块</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<script setup>
|
||||||
|
import {ref,reactive,defineProps} from "vue"
|
||||||
|
import { centralCountApi } from "@/api.js"
|
||||||
|
import { areaObj } from "@/store/index.js"
|
||||||
|
import { globalEventBus } from '@/common/eventBus'
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
const userInfoStore = areaObj()
|
||||||
|
const props = defineProps({
|
||||||
|
townName: String,
|
||||||
|
})
|
||||||
|
|
||||||
|
centralCountApi({
|
||||||
|
...userInfoStore.userInfo
|
||||||
|
}).then(res => {
|
||||||
|
for (let key in centerData) {
|
||||||
|
centerData[key] = res.data[key]
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
const centerData = reactive({
|
||||||
|
landCount: "",
|
||||||
|
plantCount: "",
|
||||||
|
totalArea: "",
|
||||||
|
|
||||||
|
})
|
||||||
|
const back=(name)=>{
|
||||||
|
userInfoStore.changeUserInfoFn(userInfoStore.userInfo.areaCode, '', name)
|
||||||
|
globalEventBus.emit('initAreaMap')
|
||||||
|
|
||||||
|
}
|
||||||
|
globalEventBus.on('back', data => {
|
||||||
|
back()
|
||||||
|
})
|
||||||
|
|
||||||
|
</script>
|
|
@ -1,7 +1,8 @@
|
||||||
<template>
|
<template>
|
||||||
<div style="height: 35%;">
|
<div style="height: 35%;">
|
||||||
<div class="landa">
|
<div class="landa">
|
||||||
<div class="land-li" @click="choseUrl(item)" v-for="(item, index) in landlist" :key="index">{{
|
<div class="land-li" style="cursor: pointer;" @click="choseUrl(item)" v-for="(item, index) in landlist"
|
||||||
|
:key="index">{{
|
||||||
item.title }}</div>
|
item.title }}</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -20,7 +21,7 @@
|
||||||
<script setup>
|
<script setup>
|
||||||
import JessibucaDemo from "@/components/videoFlv.vue"
|
import JessibucaDemo from "@/components/videoFlv.vue"
|
||||||
import { landListApi } from "@/api.js"
|
import { landListApi } from "@/api.js"
|
||||||
import {ref,reactive,onBeforeUnmount} from "vue"
|
import { ref, reactive, onBeforeUnmount } from "vue"
|
||||||
import { areaObj } from "@/store/index.js"
|
import { areaObj } from "@/store/index.js"
|
||||||
import { globalEventBus } from '@/common/eventBus'
|
import { globalEventBus } from '@/common/eventBus'
|
||||||
|
|
||||||
|
@ -38,8 +39,15 @@ landListApi({
|
||||||
})
|
})
|
||||||
// 新建scoket 通知開始推流
|
// 新建scoket 通知開始推流
|
||||||
const video_url = ref('')
|
const video_url = ref('')
|
||||||
let socket = new WebSocket('wss://iot.lihaink.cn/test')
|
|
||||||
const pullStream = () => {
|
const showVideo = ref(false)
|
||||||
|
|
||||||
|
let socket;
|
||||||
|
const choseUrl = (item) => {
|
||||||
|
if (socket) socket.close()
|
||||||
|
|
||||||
|
socket = new WebSocket('wss://iot.lihaink.cn/test')
|
||||||
|
const pullStream = () => {
|
||||||
const onSocketOpen = (event) => {
|
const onSocketOpen = (event) => {
|
||||||
console.log("scoket打开,5565")
|
console.log("scoket打开,5565")
|
||||||
}
|
}
|
||||||
|
@ -52,12 +60,8 @@ const pullStream = () => {
|
||||||
socket.addEventListener('open', onSocketOpen);
|
socket.addEventListener('open', onSocketOpen);
|
||||||
socket.addEventListener('close', onSocketClose);
|
socket.addEventListener('close', onSocketClose);
|
||||||
socket.addEventListener('error', onSocketError);
|
socket.addEventListener('error', onSocketError);
|
||||||
}
|
}
|
||||||
pullStream()
|
pullStream()
|
||||||
const showVideo = ref(false)
|
|
||||||
|
|
||||||
|
|
||||||
const choseUrl = (item) => {
|
|
||||||
video_url.value = ''
|
video_url.value = ''
|
||||||
showVideo.value = false
|
showVideo.value = false
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
|
@ -73,7 +77,7 @@ const choseUrl = (item) => {
|
||||||
|
|
||||||
}
|
}
|
||||||
onBeforeUnmount(() => {
|
onBeforeUnmount(() => {
|
||||||
socket.close()
|
if(socket) socket.close()
|
||||||
})
|
})
|
||||||
|
|
||||||
|
|
||||||
|
|
|
@ -18,7 +18,7 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="box-bottom">
|
<div class="box-bottom">
|
||||||
<div style="font-family: FZCYJ;">告警原因</div>
|
<div style="font-family: FZCYJ;">告警原因</div>
|
||||||
<div class="text" style="width: 10vw;">{{ props.data.content }}</div>
|
<div class="text" style="width: 10vw;margin-top: 10px;">{{ props.data.content }}</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
|
@ -21,7 +21,7 @@
|
||||||
<div class="center">
|
<div class="center">
|
||||||
<div class="top-c">
|
<div class="top-c">
|
||||||
<div style="display: flex;justify-content: space-between;">
|
<div style="display: flex;justify-content: space-between;">
|
||||||
<div class=" c-top-tits"><span class="color-font" @click="router.push('/')">返回首页</span></div>
|
<div class=" c-top-tits"><span class="color-font" @click="back">返回首页</span></div>
|
||||||
<div class=" c-top-tits"><span class="color-font">{{ landName }}</span> </div>
|
<div class=" c-top-tits"><span class="color-font">{{ landName }}</span> </div>
|
||||||
</div>
|
</div>
|
||||||
<farmerMap @changeLand="changeLandFn"></farmerMap>
|
<farmerMap @changeLand="changeLandFn"></farmerMap>
|
||||||
|
@ -50,8 +50,13 @@ import centerBottom from "../components/detail/centerBottom.vue";
|
||||||
import rightTop from "../components/detail/rightTop.vue";
|
import rightTop from "../components/detail/rightTop.vue";
|
||||||
import rightBottom from "../components/detail/rightBottom.vue";
|
import rightBottom from "../components/detail/rightBottom.vue";
|
||||||
import { useRouter, useRoute } from "vue-router"
|
import { useRouter, useRoute } from "vue-router"
|
||||||
import JessibucaDemo from "@/components/videoFlv.vue"
|
|
||||||
import { landListApi } from "@/api.js"
|
import { landListApi } from "@/api.js"
|
||||||
|
import { globalEventBus } from '@/common/eventBus'
|
||||||
|
import { areaObj } from "@/store/index.js"
|
||||||
|
import JessibucaDemo from "@/components/videoFlv.vue"
|
||||||
|
|
||||||
|
const areaStore=areaObj()
|
||||||
|
|
||||||
const showVideo = ref(false)
|
const showVideo = ref(false)
|
||||||
const video_url = ref('')
|
const video_url = ref('')
|
||||||
const router = useRouter()
|
const router = useRouter()
|
||||||
|
@ -92,11 +97,12 @@ const getDetail = () => {
|
||||||
if (item.id == data.land_id) {
|
if (item.id == data.land_id) {
|
||||||
video_url.value = item.video_url
|
video_url.value = item.video_url
|
||||||
showVideo.value = true
|
showVideo.value = true
|
||||||
|
console.log(showVideo.value,video_url.value)
|
||||||
|
|
||||||
let data = {
|
let data = {
|
||||||
username: item.master_phone,
|
username: item.master_phone,
|
||||||
// device: 'lihai_lot_walnutpi_dev_' + item.id,
|
device: 'lihai_lot_walnutpi_dev_' + item.id,
|
||||||
device: 'lihai_lot_walnutpi_dev_' + 5,
|
// device: 'lihai_lot_walnutpi_dev_' + 5,
|
||||||
scene: 'screen'
|
scene: 'screen'
|
||||||
}
|
}
|
||||||
socket.send(JSON.stringify(data))
|
socket.send(JSON.stringify(data))
|
||||||
|
@ -115,6 +121,16 @@ const changeLandFn = (item) => {
|
||||||
getDetail()
|
getDetail()
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const back = () => {
|
||||||
|
areaStore.changeUserInfoFn(areaStore.userInfo.areaCode, '','')
|
||||||
|
router.replace("/home")
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
globalEventBus.on('backHome', data => {
|
||||||
|
back()
|
||||||
|
|
||||||
|
})
|
||||||
</script>
|
</script>
|
||||||
<style lang="scss">
|
<style lang="scss">
|
||||||
.box {
|
.box {
|
||||||
|
|
|
@ -13,19 +13,7 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="c">
|
<div class="c">
|
||||||
<div class="top">
|
<div class="top">
|
||||||
<div style="display: flex;justify-content: space-between;" v-if="userInfoStore.userInfo.streetCode">
|
<centerTop :townName="townName" :key="userInfoStore.userInfo.name"></centerTop>
|
||||||
<div class="c-top-tits" style="z-index: 99999;"><span class="color-font" @click="back">返回首页</span></div>
|
|
||||||
<div class="c-top-tits" style="z-index: 99999;"><span class="color-font">{{ townName }}地块</span> </div>
|
|
||||||
</div>
|
|
||||||
<div class="c-top-tit" v-else>
|
|
||||||
<div class="c-top-li">种植面积 <span class="color-font" style="font-size: 18px;margin-left: 1vw; ">{{
|
|
||||||
centerData.totalArea }}</span> ㎡</div>
|
|
||||||
<div class="c-top-li">种植种类 <span class="color-font" style="font-size: 18px;margin-left: 1vw; ">{{
|
|
||||||
centerData.plantCount }}</span> 种</div>
|
|
||||||
<div class="c-top-li">地块数量 <span class="color-font" style="font-size: 18px;margin-left: 1vw; ">{{
|
|
||||||
centerData.landCount }}</span> 块</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
|
|
||||||
<div class="map">
|
<div class="map">
|
||||||
<areaMap @getTowmName="getTowmName"></areaMap>
|
<areaMap @getTowmName="getTowmName"></areaMap>
|
||||||
|
@ -54,46 +42,16 @@ import leftCenter from "../components/index/leftCenter.vue"
|
||||||
import leftBottom from "../components/index/leftBottom.vue"
|
import leftBottom from "../components/index/leftBottom.vue"
|
||||||
import centerBottom from "../components/index/centerBottom.vue"
|
import centerBottom from "../components/index/centerBottom.vue"
|
||||||
import rightBottom from "../components/index/rightBottom.vue"
|
import rightBottom from "../components/index/rightBottom.vue"
|
||||||
|
import centerTop from "../components/index/centerTop.vue"
|
||||||
import { centralCountApi } from "@/api.js"
|
import { centralCountApi } from "@/api.js"
|
||||||
import areaMap from "@/components/areaMap.vue"
|
import areaMap from "@/components/areaMap.vue"
|
||||||
import { landListApi } from "@/api.js"
|
|
||||||
import rightTop from "../components/index/rightTop.vue"
|
import rightTop from "../components/index/rightTop.vue"
|
||||||
import { areaObj } from "@/store/index.js"
|
import { areaObj } from "@/store/index.js"
|
||||||
import { useRouter } from "vue-router"
|
import { useRouter } from "vue-router"
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
const router = useRouter()
|
const router = useRouter()
|
||||||
const userInfoStore = areaObj()
|
const userInfoStore = areaObj()
|
||||||
// ...userInfoStore.userInfo
|
|
||||||
|
|
||||||
const showVideo = ref(false)
|
|
||||||
|
|
||||||
|
|
||||||
centralCountApi({
|
|
||||||
...userInfoStore.userInfo
|
|
||||||
}).then(res => {
|
|
||||||
|
|
||||||
for (let key in centerData) {
|
|
||||||
centerData[key] = res.data[key]
|
|
||||||
}
|
|
||||||
})
|
|
||||||
|
|
||||||
const centerData = reactive({
|
|
||||||
landCount: "",
|
|
||||||
plantCount: "",
|
|
||||||
totalArea: "",
|
|
||||||
|
|
||||||
})
|
|
||||||
// 地块
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
const back = () => {
|
|
||||||
console.log("back")
|
|
||||||
router.go(0)
|
|
||||||
}
|
|
||||||
const townName = ref("")
|
const townName = ref("")
|
||||||
const getTowmName = (e) => {
|
const getTowmName = (e) => {
|
||||||
townName.value = e
|
townName.value = e
|
||||||
|
@ -101,7 +59,6 @@ const getTowmName = (e) => {
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
<style lang="scss">
|
<style lang="scss">
|
||||||
.box {
|
.box {
|
||||||
|
|
Loading…
Reference in New Issue