设备告警修改
This commit is contained in:
parent
9b0ec613eb
commit
5bc6506e55
|
|
@ -5,7 +5,9 @@ import axios from "axios";
|
|||
|
||||
// 创建axios 实例
|
||||
const instacne = axios.create({
|
||||
baseURL: "http://ceshi-suyuan.lihaink.cn/",
|
||||
// baseURL: "http://ceshi-suyuan.lihaink.cn/",
|
||||
baseURL: "https://suyuan.lihaink.cn/",
|
||||
|
||||
timeout: 30000,
|
||||
});
|
||||
|
||||
|
|
|
|||
|
|
@ -42,6 +42,8 @@ const choseTownFn = (item) => {
|
|||
|
||||
axios.get(`https://crmeb-test.shop.lihaink.cn/api/city/get_street?area_code=${510521}`)
|
||||
.then(function (response) {
|
||||
|
||||
userInfoStore.changeareaCodeList(response.data.data)
|
||||
response.data.data.forEach(item => {
|
||||
areaList.push(item)
|
||||
})
|
||||
|
|
|
|||
|
|
@ -42,6 +42,8 @@ import * as echarts from 'echarts';
|
|||
import geoJson from "/static/jsonData/luxian_geo.js"
|
||||
import { useRouter } from "vue-router"
|
||||
import { areaObj } from "@/store/index.js"
|
||||
import { landListApi } from "@/api.js"
|
||||
|
||||
const areaStore = areaObj()
|
||||
|
||||
const showArea = (ref(true))
|
||||
|
|
@ -86,9 +88,24 @@ const pointerFn = () => {
|
|||
})
|
||||
return list
|
||||
}
|
||||
|
||||
const pointerFn2 = (lists) => {
|
||||
let list = []
|
||||
lists.forEach((item, index) => {
|
||||
list.push({
|
||||
coord: item.value,
|
||||
value: item.name,
|
||||
animation: true,
|
||||
symbol: index == geoJson.center.length - 1 ? ('image://' + lx) : ('image://' + icon),// 自定义图片路径
|
||||
symbolSize: [100, 30], // 图片大小
|
||||
symbolOffset: ['50%', '-50%'],
|
||||
data: lists,
|
||||
|
||||
},)
|
||||
})
|
||||
return list
|
||||
}
|
||||
const initAreaMap = () => {
|
||||
showArea.value=true
|
||||
showArea.value = true
|
||||
var mapName = 'lz';
|
||||
const myChart = document.getElementById("chart2")
|
||||
let option = {
|
||||
|
|
@ -298,7 +315,12 @@ const initAreaMap = () => {
|
|||
const bg = echarts.init(myChart)
|
||||
bg.setOption(option);
|
||||
bg.on('click', function (params) {
|
||||
areaStore.changeAddress('',params.name||params.value)
|
||||
areaStore.areaCodeList.forEach(item => {
|
||||
if (item.name == (params.name||params.value)) {
|
||||
areaStore.changeUserInfoFn(510521, item.code)
|
||||
}
|
||||
})
|
||||
areaStore.changeAddress('', params.name || params.value)
|
||||
initTownMap(params.name || params.value)
|
||||
|
||||
|
||||
|
|
@ -306,13 +328,45 @@ const initAreaMap = () => {
|
|||
|
||||
|
||||
}
|
||||
const initTownMap = (name) => {
|
||||
const initTownMap = async (name) => {
|
||||
showArea.value = false
|
||||
let center = []
|
||||
let pointerList = []
|
||||
let res = await landListApi({
|
||||
...areaStore.userInfo
|
||||
})
|
||||
|
||||
console.log(res.data,4545)
|
||||
|
||||
res.data.list.forEach(item => {
|
||||
|
||||
center.push([item.longitude, item.latitude])
|
||||
pointerList.push({
|
||||
value: [item.longitude, item.latitude],
|
||||
name: item.title,
|
||||
id: item.id
|
||||
})
|
||||
})
|
||||
console.log(center,'center')
|
||||
// let center2 = [[105.33113, 29.121584], [105.329675, 29.122785], [105.329046, 29.123046], [105.328221, 29.123388], [105.266415, 29.138461], [105.266196, 29.167795]]
|
||||
let pointerList2 = []
|
||||
center.forEach((item, index) => {
|
||||
pointerList2.push({
|
||||
value: item,
|
||||
name: "土地" + index,
|
||||
id: 18
|
||||
})
|
||||
})
|
||||
|
||||
const townJson = deepCopy(geoJson)
|
||||
|
||||
|
||||
|
||||
townJson.features = townJson.features.filter((item) => {
|
||||
return item.properties.name == name
|
||||
})
|
||||
|
||||
|
||||
var mapName = 'town';
|
||||
const myChart = document.getElementById("chart3")
|
||||
let option = {
|
||||
|
|
@ -492,27 +546,27 @@ const initTownMap = (name) => {
|
|||
// return val[2] / 10;
|
||||
},
|
||||
markPoint: {
|
||||
// data: pointerFn()
|
||||
data: pointerFn2(pointerList2)
|
||||
},
|
||||
|
||||
// data: (() => {
|
||||
// let data = {
|
||||
// 资产数: geoJson.center
|
||||
data: (() => {
|
||||
let data = {
|
||||
资产数: center
|
||||
|
||||
// }
|
||||
// let finalData = []
|
||||
// Object.keys(data).map((i, index) => {
|
||||
// let child = data[i].map((row, index) => ({
|
||||
// value: row,
|
||||
// itemStyle: {
|
||||
// color: index == geoJson.center.length - 1 ? '#FEB821' : '#F0733A',
|
||||
// },
|
||||
// }))
|
||||
}
|
||||
let finalData = []
|
||||
Object.keys(data).map((i, index) => {
|
||||
let child = data[i].map((row, index) => ({
|
||||
value: row,
|
||||
itemStyle: {
|
||||
color: index == geoJson.center.length - 1 ? '#FEB821' : '#F0733A',
|
||||
},
|
||||
}))
|
||||
|
||||
// finalData = [...finalData, ...child]
|
||||
// })
|
||||
// return finalData
|
||||
// })(),
|
||||
finalData = [...finalData, ...child]
|
||||
})
|
||||
return finalData
|
||||
})(),
|
||||
},
|
||||
],
|
||||
};
|
||||
|
|
@ -521,6 +575,22 @@ const initTownMap = (name) => {
|
|||
const bg = echarts.init(myChart)
|
||||
bg.setOption(option);
|
||||
bg.on('click', function (params) {
|
||||
let longInfo = params.data.coord
|
||||
areaStore.areaCodeList.forEach(item => {
|
||||
if (item.name == name) {
|
||||
areaStore.changeUserInfoFn(510521, item.code)
|
||||
}
|
||||
})
|
||||
params.data.data.forEach(item => {
|
||||
|
||||
if (item.value[0] == longInfo[0] && item.value[1] == longInfo[1]) {
|
||||
router.push(`/detail?landId=${item.id}&town=${name}&parmas=${JSON.stringify(areaStore.userInfo) }`)
|
||||
}
|
||||
|
||||
})
|
||||
|
||||
// console.log(params.data.coord)
|
||||
// console.log(params.data.data)
|
||||
});
|
||||
}
|
||||
|
||||
|
|
@ -529,13 +599,12 @@ watch(
|
|||
() => areaStore.address,
|
||||
(value, oldValue) => {
|
||||
|
||||
if(value.city){
|
||||
if (value.city) {
|
||||
initAreaMap()
|
||||
}
|
||||
else if(value.area){
|
||||
else if (value.area) {
|
||||
showArea.value = false
|
||||
initTownMap(value.area)
|
||||
console.log(showArea.value)
|
||||
}
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -18,6 +18,10 @@
|
|||
import { monitorInfoApi } from "@/api.js"
|
||||
|
||||
import {ref,reactive} from "vue"
|
||||
const props = defineProps({
|
||||
data:Object,
|
||||
})
|
||||
|
||||
const statusFn=(min,max,item )=>{
|
||||
|
||||
if(item.value>=min&&item.value<=max ) item.flag=true
|
||||
|
|
@ -27,9 +31,7 @@ else item.flag=false
|
|||
|
||||
monitorInfoApi(
|
||||
{
|
||||
areaCode: 510521,
|
||||
streetCode: 510521100,
|
||||
land_id: 18
|
||||
...props.data
|
||||
}
|
||||
|
||||
).then(res => {
|
||||
|
|
@ -54,13 +56,6 @@ statusFn(monitorThreshold.ambient_air_pressure_min,monitorThreshold.ambient_air_
|
|||
|
||||
|
||||
|
||||
|
||||
console.log(environmentData)
|
||||
console.log(monitorThreshold)
|
||||
|
||||
|
||||
|
||||
|
||||
})
|
||||
const environmentData = reactive({
|
||||
|
||||
|
|
|
|||
|
|
@ -5,8 +5,12 @@
|
|||
<script setup>
|
||||
import warnDetail from "@/components/warnDetail.vue"
|
||||
import scrollTable from "@/components/scrollTable.vue"
|
||||
import { ref, reactive,onMounted } from "vue"
|
||||
import { ref, reactive,onMounted,defineProps } from "vue"
|
||||
import {deviceAlarmCountApi} from "@/api.js"
|
||||
const props = defineProps({
|
||||
data:Object,
|
||||
})
|
||||
|
||||
|
||||
const showWarnDeatil = ref(false)
|
||||
|
||||
|
|
@ -34,24 +38,13 @@ const config3 = reactive({
|
|||
oddRowBGC: "#0C2045",
|
||||
headerStyle: "background-image: url('/static/index/SBGJBG.png');font-family: FZCYJ;background-size: 100% 100%;",
|
||||
align: alignFn(4),
|
||||
data: [
|
||||
// ['行1列1', '行1列2', '行1列3', `<span style="color:#2562AD"> 详情 </span>`,],
|
||||
// ['行1列1', '行1列2', '行1列3', `<span style="color:#2562AD"> 详情 </span>`,],
|
||||
// ['行1列1', '行1列2', '行1列3', `<span style="color:#2562AD"> 详情 </span>`,],
|
||||
// ['行1列1', '行1列2', '行1列3', `<span style="color:#2562AD"> 详情 </span>`,],
|
||||
// ['行1列1', '行1列2', '行1列3', `<span style="color:#2562AD"> 详情 </span>`,],
|
||||
// ['行1列1', '行1列2', '行1列3', `<span style="color:#2562AD"> 详情 </span>`,],
|
||||
// ['行1列1', '行1列2', '行1列3', `<span style="color:#2562AD"> 详情 </span>`,],
|
||||
|
||||
]
|
||||
data: [ ]
|
||||
})
|
||||
|
||||
onMounted( ()=>{
|
||||
deviceAlarmCountApi(
|
||||
{
|
||||
areaCode:510521,
|
||||
streetCode:510521100,
|
||||
land_id:18
|
||||
...props.data
|
||||
}
|
||||
).then(res=>{
|
||||
|
||||
|
|
|
|||
|
|
@ -1,11 +1,11 @@
|
|||
<template>
|
||||
<div style="display: flex;justify-content: space-between;align-items: center;">
|
||||
<span>种植总面积： </span>
|
||||
<span style="font-size: 15px;">种植总面积： </span>
|
||||
<div>
|
||||
<span class="area-num " v-for="item in plantData.totalArea"><span class="color-font">{{ item }}</span> </span>
|
||||
</div>
|
||||
</div>
|
||||
<div style="">种植种类：</div>
|
||||
<div style="font-size: 15px;">种植种类 ：</div>
|
||||
<div>
|
||||
<div class="lands">
|
||||
<div class="land" v-for="(item, index) in plantData.plantKindList" :key="index">{{ item.kind }}</div>
|
||||
|
|
@ -15,7 +15,15 @@
|
|||
|
||||
<script setup>
|
||||
import {areaPlantTypeCountApi} from "@/api.js"
|
||||
import {ref,reactive} from "vue"
|
||||
import {ref,reactive,defineProps} from "vue"
|
||||
|
||||
|
||||
const props = defineProps({
|
||||
data:Object,
|
||||
})
|
||||
|
||||
// ...props.data
|
||||
|
||||
|
||||
let plantData=reactive({
|
||||
totalArea:0,
|
||||
|
|
@ -26,9 +34,7 @@ let plantData=reactive({
|
|||
// api/dataview.land/areaPlantTypeCount?areaCode=510521&streetCode=510521100
|
||||
areaPlantTypeCountApi(
|
||||
{
|
||||
areaCode:510521,
|
||||
streetCode:510521100,
|
||||
land_id:12
|
||||
...props.data
|
||||
}
|
||||
).then(res=>{
|
||||
for (let key in res.data){
|
||||
|
|
|
|||
|
|
@ -9,8 +9,11 @@
|
|||
|
||||
|
||||
<script setup>
|
||||
import { reactive } from "vue"
|
||||
import { reactive,defineProps } from "vue"
|
||||
import { monitorInfoApi } from "@/api.js"
|
||||
const props = defineProps({
|
||||
data:Object,
|
||||
})
|
||||
|
||||
const statusFn=(min,max,item )=>{
|
||||
|
||||
|
|
@ -22,9 +25,7 @@ else item.flag=false
|
|||
|
||||
monitorInfoApi(
|
||||
{
|
||||
areaCode: 510521,
|
||||
streetCode: 510521100,
|
||||
land_id: 18
|
||||
...props.data
|
||||
}
|
||||
|
||||
).then(res => {
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
<template>
|
||||
<div>监控设备总数: <span class="num color-font">{{ totalNum }}</span> 台</div>
|
||||
<div style="font-size: 15px;">监控设备总数: <span class="num color-font">{{ totalNum }}</span> 台</div>
|
||||
<div class="cont">
|
||||
<div style="display: flex;justify-content: space-between;align-items: center;margin-top: 3vh;">
|
||||
<img src="/static/index/JYZ.png" style="width: 2.8vw; height: 4vw;" alt="">
|
||||
|
|
@ -30,8 +30,13 @@
|
|||
|
||||
<script setup>
|
||||
import * as echarts from 'echarts';
|
||||
import { ref, reactive, onMounted } from "vue"
|
||||
import { ref, reactive, onMounted,defineProps } from "vue"
|
||||
import { deviceCountLandApi } from "@/api.js"
|
||||
const props = defineProps({
|
||||
data:Object,
|
||||
})
|
||||
|
||||
|
||||
const totalNum = ref(0)
|
||||
const onlineNum = ref(0)
|
||||
const offlineNum = ref(0)
|
||||
|
|
@ -319,7 +324,8 @@ const initCharts = (tag, option) => {
|
|||
myChart.setOption(option);
|
||||
}
|
||||
deviceCountLandApi({
|
||||
areaCode: 510521, streetCode: 510521100,land_id:18
|
||||
...props.data
|
||||
|
||||
}).then(res => {
|
||||
totalNum.value = res.data.total
|
||||
onlineNum.value = res.data.online
|
||||
|
|
|
|||
|
|
@ -2,7 +2,6 @@
|
|||
<div>
|
||||
<div style="width: 45vw;height: 50vh;" id="farmerchart"></div>
|
||||
</div>
|
||||
|
||||
</template>
|
||||
|
||||
|
||||
|
|
@ -33,12 +32,17 @@
|
|||
</style>
|
||||
|
||||
<script setup>
|
||||
import { ref, onMounted } from "vue"
|
||||
import { ref, onMounted,defineEmits } from "vue"
|
||||
import * as echarts from 'echarts';
|
||||
import "echarts-gl"
|
||||
import geoJson from "/static/jsonData/luxian_geo.js"
|
||||
import { useRoute } from "vue-router"
|
||||
const deepCopy=(obj)=> {
|
||||
import { useRoute } from "vue-router"
|
||||
import { areaObj } from "@/store/index.js"
|
||||
import { landListApi } from "@/api.js"
|
||||
const emit = defineEmits(['changeLand'])
|
||||
|
||||
const areaStore = areaObj()
|
||||
const deepCopy = (obj) => {
|
||||
if (typeof obj !== 'object' || obj === null) {
|
||||
return obj;
|
||||
}
|
||||
|
|
@ -53,36 +57,71 @@ const deepCopy=(obj)=> {
|
|||
|
||||
return copy;
|
||||
}
|
||||
|
||||
const townJson=deepCopy(geoJson)
|
||||
const route = useRoute()
|
||||
const townJson = deepCopy(geoJson)
|
||||
townJson.features = townJson.features.filter((item) => {
|
||||
return item.properties.name == route.query.town
|
||||
})
|
||||
const icon = "https:\/\/ceshi-worker-task.lihaink.cn\/uploads\/images\/20231204\/202312041608529c9e21252.png"
|
||||
const lx = "https:\/\/ceshi-worker-task.lihaink.cn\/uploads\/images\/20231205\/20231205092709cfe148712.png"
|
||||
|
||||
const pointerFn = () => {
|
||||
return
|
||||
const pointerFn2 = (lists) => {
|
||||
let list = []
|
||||
geoJson.center.forEach((item, index) => {
|
||||
lists.forEach((item, index) => {
|
||||
list.push({
|
||||
coord: item,
|
||||
symbol: index == geoJson.center.length - 1 ? ('image://' + lx) : ('image://' + icon),// 自定义图片路径
|
||||
symbolSize: [100, 30], // 图片大小
|
||||
symbolOffset: ['50%', '-50%'],
|
||||
value: geoJson.features[index]?.properties.name || '泸县',
|
||||
coord: item.value,
|
||||
value: item.name,
|
||||
animation: true,
|
||||
label: {
|
||||
show: true,
|
||||
color: 'white',
|
||||
fontSize: 14,
|
||||
data: lists,
|
||||
itemStyle: {
|
||||
normal: {
|
||||
borderColor: 'red',
|
||||
borderWidth: 1, // 标注边线线宽，单位px，默认为1
|
||||
label: {
|
||||
show: false
|
||||
}
|
||||
},
|
||||
emphasis: {
|
||||
borderColor: 'red',
|
||||
borderWidth: 5,
|
||||
label: {
|
||||
show: false
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
|
||||
},)
|
||||
})
|
||||
return list
|
||||
}
|
||||
onMounted(() => {
|
||||
onMounted(async () => {
|
||||
let center = []
|
||||
let pointerList = []
|
||||
let res = await landListApi({
|
||||
...areaStore.userInfo
|
||||
})
|
||||
|
||||
res.data.list.forEach(item => {
|
||||
center.push([item.longitude, item.latitude])
|
||||
pointerList.push({
|
||||
value: [item.longitude, item.latitude],
|
||||
name: item.title,
|
||||
id: item.id
|
||||
})
|
||||
|
||||
})
|
||||
|
||||
let center2 = [[105.33113, 29.121584], [105.329675, 29.122785], [105.329046, 29.123046], [105.328221, 29.123388], [105.266415, 29.138461], [105.266196, 29.167795]]
|
||||
let pointerList2 = []
|
||||
center2.forEach((item, index) => {
|
||||
pointerList2.push({
|
||||
value: item,
|
||||
name: "土地" + index,
|
||||
id: 17
|
||||
})
|
||||
})
|
||||
|
||||
var mapName = 'lz';
|
||||
const myChart = document.getElementById("farmerchart")
|
||||
/*获取地图数据*/
|
||||
|
|
@ -261,13 +300,13 @@ onMounted(() => {
|
|||
// return val[2] / 10;
|
||||
},
|
||||
markPoint: {
|
||||
data: pointerFn()
|
||||
data: pointerFn2(pointerList2)
|
||||
},
|
||||
|
||||
data: (() => {
|
||||
return
|
||||
|
||||
let data = {
|
||||
资产数: geoJson.center
|
||||
资产数: center2
|
||||
|
||||
}
|
||||
let finalData = []
|
||||
|
|
@ -287,15 +326,19 @@ onMounted(() => {
|
|||
],
|
||||
};
|
||||
document.getElementById("farmerchart").removeAttribute('_echarts_instance_');
|
||||
|
||||
echarts.registerMap(mapName, townJson)
|
||||
const bg = echarts.init(myChart)
|
||||
bg.setOption(option);
|
||||
|
||||
bg.on('click', function (params) {
|
||||
// mapClick()
|
||||
console.log(params.name)
|
||||
let longInfo = params.data.coord
|
||||
params.data.data.forEach(item => {
|
||||
if (item.value[0] == longInfo[0] && item.value[1] == longInfo[1]) {
|
||||
|
||||
emit('changeLand',item.id)
|
||||
|
||||
}
|
||||
|
||||
})
|
||||
});
|
||||
|
||||
})
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
<template>
|
||||
<warnPop v-if="showWarnPop" ref="ChildsDom" @off="showWarnPop = false"></warnPop>
|
||||
<warnPop v-if="showWarnPop" ref="ChildsDom" @off="showWarnPop = false" :item="item"></warnPop>
|
||||
<scrollTable v-if="config.data.length" :config="config" @click="hdClick" style="width:100%;height:100%"></scrollTable>
|
||||
</template>
|
||||
<script setup>
|
||||
|
|
@ -12,11 +12,15 @@ const userInfoStore=areaObj()
|
|||
// ...userInfoStore.userInfo
|
||||
const showWarnPop = ref(false)
|
||||
const ChildsDom = ref(null);
|
||||
const dataList=ref("")
|
||||
const item=ref('')
|
||||
const hdClick = (e) => {
|
||||
// console.log(e)
|
||||
if (e.ceil) {
|
||||
if (e.columnIndex == 9) {
|
||||
showWarnPop.value = true
|
||||
item.value=dataList.value[e.rowIndex]
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -45,6 +49,7 @@ landCollectionListApi(
|
|||
}
|
||||
|
||||
).then(res=>{
|
||||
dataList.value=res.data.list
|
||||
res.data.list.forEach(item => {
|
||||
config.data.push(
|
||||
[item.title, item.soil_temperature,item.soil_moisture, item.soil_PH,item.soil_potassium_phosphate_nitrogen+'/'+item.soil_potassium_phosphate_phosphorus+'/'+item.soil_potassium_phosphate_potassium, item.wind_speed, item.ambient_temperature, item.ambient_humidity, item.carbon_dioxide, `<span style='color:#2562AD' > 查看<span>`]
|
||||
|
|
|
|||
|
|
@ -58,7 +58,6 @@ onMounted( ()=>{
|
|||
}
|
||||
).then(res=>{
|
||||
|
||||
console.log(res)
|
||||
res.data.list.forEach(item => {
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -3,17 +3,17 @@
|
|||
<div class="offWarn" @click="emit('off')">关闭</div>
|
||||
<div class="box-top">
|
||||
<img :src="props.data.image" style="width: 5vw;height: 4.5vw;" alt="">
|
||||
<div style="display: flex;justify-content: space-between;flex-direction: column;margin-left: 1vw;">
|
||||
<div style="display: flex;flex-direction: column;margin-left: 1vw;">
|
||||
<div style="font-family:FZCYJ ;">告警数据:</div>
|
||||
<div class="warn-li"> <img src="/static/index/PM.png" class="pm-img"> <span class="pm-num">1</span>
|
||||
<span class="text"> 老东赛！</span>
|
||||
<span class="text"> {{ props.data.value }}</span>
|
||||
</div>
|
||||
<div class="warn-li"> <img src="/static/index/PM.png" class="pm-img"> <span class="pm-num"> 2</span>
|
||||
<!-- <div class="warn-li"> <img src="/static/index/PM.png" class="pm-img"> <span class="pm-num"> 2</span>
|
||||
<span class="text"> 这是一名后端开发</span>
|
||||
</div>
|
||||
<div class="warn-li"> <img src="/static/index/PM.png" class="pm-img"> <span class="pm-num">3</span> <span
|
||||
class="text"> 这是一名地方都是开发建设的咖啡机发动机</span>
|
||||
</div>
|
||||
</div> -->
|
||||
</div>
|
||||
</div>
|
||||
<div class="box-bottom">
|
||||
|
|
@ -55,6 +55,7 @@
|
|||
display: flex;
|
||||
width: 15vw;
|
||||
align-items: center;
|
||||
margin-top: 1vh;
|
||||
|
||||
|
||||
.pm-img {
|
||||
|
|
|
|||
|
|
@ -136,8 +136,15 @@
|
|||
<script setup>
|
||||
import options from "@/view/option"
|
||||
import * as echarts from 'echarts';
|
||||
import { ref, reactive, onMounted, defineEmits } from "vue"
|
||||
import { ref, reactive, onMounted, defineEmits,defineProps } from "vue"
|
||||
import { landMonitorAlarmHistoryApi } from "@/api.js"
|
||||
import { areaObj } from "@/store/index.js"
|
||||
const userStore=areaObj()
|
||||
|
||||
const props = defineProps({
|
||||
item:Object,
|
||||
})
|
||||
|
||||
|
||||
const data=reactive({})
|
||||
const emit = defineEmits(['off'])
|
||||
|
|
@ -426,16 +433,14 @@ const CKP = {
|
|||
|
||||
|
||||
landMonitorAlarmHistoryApi({
|
||||
areaCode: 510521,
|
||||
streetCode: 510521100,
|
||||
land_id: 18
|
||||
...userStore.userInfo,
|
||||
land_id: props.item.land_id
|
||||
}).then(res => {
|
||||
|
||||
|
||||
for (let key in res.data.list){
|
||||
data[key]=res.data.list[key]
|
||||
}
|
||||
console.log(data,5656)
|
||||
|
||||
initCharts('l_t', setoptionsFn(res.data.list.soil_temperature.historyList[0].time, res.data.list.soil_temperature.historyList[1].value))
|
||||
initCharts('l_c', setoptionsFn(res.data.list.soil_moisture.historyList[0].time, res.data.list.soil_moisture.historyList[1].value))
|
||||
|
|
|
|||
|
|
@ -5,10 +5,11 @@ import {
|
|||
export const areaObj = defineStore('counter', {
|
||||
state: () => ({
|
||||
userInfo: {
|
||||
// areaCode:'',
|
||||
// streetCode:'',
|
||||
areaCode:'',
|
||||
streetCode:'',
|
||||
|
||||
},
|
||||
areaCodeList:[],
|
||||
address:{
|
||||
city:"",
|
||||
area:""
|
||||
|
|
@ -26,7 +27,10 @@ export const areaObj = defineStore('counter', {
|
|||
this.address.city=c
|
||||
this.address.area=a
|
||||
|
||||
}
|
||||
},
|
||||
changeareaCodeList(list){
|
||||
this.areaCodeList=list
|
||||
}
|
||||
|
||||
}
|
||||
})
|
||||
|
|
@ -2,35 +2,40 @@
|
|||
<div class="box">
|
||||
<div class="l">
|
||||
<div class="top">
|
||||
<leftTop></leftTop>
|
||||
<leftTop :data="data" :key="data.land_id"></leftTop>
|
||||
</div>
|
||||
<div class="bottom top">
|
||||
<leftCenter></leftCenter>
|
||||
<leftCenter :data="data" :key="data.land_id"></leftCenter>
|
||||
</div>
|
||||
<div class="top center">
|
||||
<video style="margin-top: 1vh;width: 100%;height: 100%;" autoplay muted
|
||||
|
||||
<JessibucaDemo v-if="video_url" :src="video_url"></JessibucaDemo>
|
||||
|
||||
|
||||
|
||||
<!-- <video style="margin-top: 1vh;width: 100%;height: 100%;" autoplay muted
|
||||
src="http://192.168.1.27/live/test.live.mp4?secret=gqig2yFKkDpIMic1uWZY1L5MsIo0eflm">
|
||||
</video>
|
||||
</video> -->
|
||||
</div>
|
||||
</div>
|
||||
<div class="center">
|
||||
<div class="top-c">
|
||||
<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">{{route.query.town}}地块</span> </div>
|
||||
<div class=" c-top-tits"><span class="color-font">{{ route.query.town }}地块</span> </div>
|
||||
</div>
|
||||
<farmerMap></farmerMap>
|
||||
<farmerMap @changeLand="changeLandFn"></farmerMap>
|
||||
</div>
|
||||
<div class="bottom">
|
||||
<centerBottom></centerBottom>
|
||||
<centerBottom :data="data" :key="data.land_id"></centerBottom>
|
||||
</div>
|
||||
</div>
|
||||
<div class="r">
|
||||
<div class="center top">
|
||||
<rightTop></rightTop>
|
||||
<rightTop :data="data" :key="data.land_id"></rightTop>
|
||||
</div>
|
||||
<div class="bottom">
|
||||
<rightBottom></rightBottom>
|
||||
<rightBottom :data="data" :key="data.land_id"></rightBottom>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -44,10 +49,36 @@ import leftCenter from "../components/detail/leftCenter.vue";
|
|||
import centerBottom from "../components/detail/centerBottom.vue";
|
||||
import rightTop from "../components/detail/rightTop.vue";
|
||||
import rightBottom from "../components/detail/rightBottom.vue";
|
||||
import {useRouter,useRoute} from "vue-router"
|
||||
const router=useRouter()
|
||||
const route=useRoute()
|
||||
import { useRouter, useRoute } from "vue-router"
|
||||
import JessibucaDemo from "@/components/videoFlv.vue"
|
||||
import { landListApi } from "@/api.js"
|
||||
const video_url = ref('')
|
||||
const router = useRouter()
|
||||
const route = useRoute()
|
||||
let data = reactive(
|
||||
{
|
||||
land_id: route.query.landId,
|
||||
areaCode: JSON.parse(route.query.parmas).areaCode,
|
||||
streetCode: JSON.parse(route.query.parmas).streetCode
|
||||
}
|
||||
)
|
||||
|
||||
landListApi({
|
||||
...data
|
||||
}).then(res => {
|
||||
console.log(res)
|
||||
res.data.list.forEach(item => {
|
||||
if (item.id == data.land_id) {
|
||||
video_url.value = item.video_url
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
const changeLandFn = (land_id) => {
|
||||
|
||||
data.land_id = land_id
|
||||
|
||||
}
|
||||
</script>
|
||||
<style lang="scss">
|
||||
.box {
|
||||
|
|
@ -125,7 +156,7 @@ const route=useRoute()
|
|||
flex-wrap: wrap;
|
||||
justify-content: space-between;
|
||||
|
||||
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
|
|
@ -182,7 +213,7 @@ const route=useRoute()
|
|||
.center {
|
||||
background-image: url('/static/index/JCSBSLTJ.png');
|
||||
|
||||
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -13,15 +13,19 @@
|
|||
</div>
|
||||
<div class="c">
|
||||
<div class="top">
|
||||
<div class="c-top-tit">
|
||||
<div class="c-top-li">种植面积 <span class="color-font"
|
||||
<div style="display: flex;justify-content: space-between;" v-if="userInfoStore.userInfo.streetCode">
|
||||
<div class=" c-top-tits"><span class="color-font" @click="back">返回首页</span></div>
|
||||
<div class=" c-top-tits"><span class="color-font">地块</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="c-top-tit">
|
||||
<div class=" c-top-tits"><span class="color-font" @click="router.push('/')">返回首页</span></div>
|
||||
<div class=" c-top-tits"><span class="color-font">{{}}地块</span> </div>
|
||||
|
|
@ -70,6 +74,8 @@ import areaMap from "@/components/areaMap.vue"
|
|||
import { landListApi } from "@/api.js"
|
||||
import rightTop from "../components/index/rightTop.vue"
|
||||
import { areaObj } from "@/store/index.js"
|
||||
import { useRouter } from "vue-router"
|
||||
const router=useRouter()
|
||||
const userInfoStore= areaObj()
|
||||
// ...userInfoStore.userInfo
|
||||
|
||||
|
|
@ -107,7 +113,9 @@ const choseUrl=(item)=>{
|
|||
},500)
|
||||
|
||||
}
|
||||
|
||||
const back=()=>{
|
||||
router.go(0)
|
||||
}
|
||||
|
||||
|
||||
</script>
|
||||
|
|
|
|||
Loading…
Reference in New Issue