|
@ -1,7 +1,7 @@
|
||||||
<template>
|
<template>
|
||||||
<div>
|
<div>
|
||||||
<div style="width: 45vw;height: 50vh;" id="chart2" v-show="showArea"></div>
|
<div style="width: 45vw;height: 50vh;" id="chart2" v-show="showArea"></div>
|
||||||
<div style="width: 45vw;height: 50vh;" id="chart3" v-show="!showArea"></div>
|
<div style="width: 45vw;height: 60vh;transform: translateY(-5VH);" id="chart3" v-show="!showArea"></div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
@ -36,7 +36,7 @@
|
||||||
</style>
|
</style>
|
||||||
|
|
||||||
<script setup>
|
<script setup>
|
||||||
import { ref, onMounted, watch } from "vue"
|
import { ref, onMounted, watch,defineEmits } from "vue"
|
||||||
import * as echarts from 'echarts';
|
import * as echarts from 'echarts';
|
||||||
// import "echarts-gl"
|
// import "echarts-gl"
|
||||||
import geoJson from "/static/jsonData/luxian_geo.js"
|
import geoJson from "/static/jsonData/luxian_geo.js"
|
||||||
|
@ -66,7 +66,10 @@ const deepCopy = (obj) => {
|
||||||
return copy;
|
return copy;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const emit = defineEmits(['getTowmName'])
|
||||||
|
const getTowmName = (e) => {
|
||||||
|
emit('getTowmName',e)
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
const pointerFn = () => {
|
const pointerFn = () => {
|
||||||
|
@ -96,7 +99,7 @@ const pointerFn2 = (lists) => {
|
||||||
value: item.name,
|
value: item.name,
|
||||||
animation: true,
|
animation: true,
|
||||||
symbol: index == geoJson.center.length - 1 ? ('image://' + lx) : ('image://' + icon),// 自定义图片路径
|
symbol: index == geoJson.center.length - 1 ? ('image://' + lx) : ('image://' + icon),// 自定义图片路径
|
||||||
symbolSize: [100, 30], // 图片大小
|
symbolSize: [190, 30], // 图片大小
|
||||||
symbolOffset: ['50%', '-50%'],
|
symbolOffset: ['50%', '-50%'],
|
||||||
data: lists,
|
data: lists,
|
||||||
|
|
||||||
|
@ -166,29 +169,29 @@ const initAreaMap = () => {
|
||||||
|
|
||||||
},
|
},
|
||||||
|
|
||||||
{
|
// {
|
||||||
type: "map",
|
// type: "map",
|
||||||
map: mapName,
|
// map: mapName,
|
||||||
zlevel: -1,
|
// zlevel: -1,
|
||||||
aspectScale: 1,
|
// aspectScale: 1,
|
||||||
zoom: 1.2,
|
// zoom: 1.2,
|
||||||
layoutCenter: ["50%", "51%"],
|
// layoutCenter: ["50%", "51%"],
|
||||||
layoutSize: "110%",
|
// layoutSize: "110%",
|
||||||
roam: false,
|
// roam: false,
|
||||||
silent: true,
|
// silent: true,
|
||||||
|
|
||||||
itemStyle: {
|
// itemStyle: {
|
||||||
normal: {
|
// normal: {
|
||||||
borderWidth: 1,
|
// borderWidth: 1,
|
||||||
borderColor: "rgba(17, 149, 216,0.6)",
|
// borderColor: "rgba(17, 149, 216,0.6)",
|
||||||
borderColor: "#5AD0E0",
|
// borderColor: "#5AD0E0",
|
||||||
shadowColor: "rgba(172, 122, 255,0.5)",
|
// shadowColor: "rgba(172, 122, 255,0.5)",
|
||||||
shadowOffsetY: 5,
|
// shadowOffsetY: 5,
|
||||||
shadowBlur: 15,
|
// shadowBlur: 15,
|
||||||
areaColor: "rgba(5,21,35,0.1)",
|
// areaColor: "rgba(5,21,35,0.1)",
|
||||||
},
|
// },
|
||||||
},
|
// },
|
||||||
},
|
// },
|
||||||
|
|
||||||
|
|
||||||
{
|
{
|
||||||
|
@ -315,6 +318,8 @@ const initAreaMap = () => {
|
||||||
const bg = echarts.init(myChart)
|
const bg = echarts.init(myChart)
|
||||||
bg.setOption(option);
|
bg.setOption(option);
|
||||||
bg.on('click', function (params) {
|
bg.on('click', function (params) {
|
||||||
|
|
||||||
|
getTowmName(params.name)
|
||||||
areaStore.areaCodeList.forEach(item => {
|
areaStore.areaCodeList.forEach(item => {
|
||||||
if (item.name == (params.name||params.value)) {
|
if (item.name == (params.name||params.value)) {
|
||||||
areaStore.changeUserInfoFn(510521, item.code)
|
areaStore.changeUserInfoFn(510521, item.code)
|
||||||
|
@ -336,7 +341,6 @@ const initTownMap = async (name) => {
|
||||||
...areaStore.userInfo
|
...areaStore.userInfo
|
||||||
})
|
})
|
||||||
|
|
||||||
console.log(res.data,4545)
|
|
||||||
|
|
||||||
res.data.list.forEach(item => {
|
res.data.list.forEach(item => {
|
||||||
|
|
||||||
|
@ -347,17 +351,7 @@ const initTownMap = async (name) => {
|
||||||
id: item.id
|
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)
|
const townJson = deepCopy(geoJson)
|
||||||
|
|
||||||
|
|
||||||
|
@ -377,18 +371,18 @@ const initTownMap = async (name) => {
|
||||||
type: "map",
|
type: "map",
|
||||||
map: mapName,
|
map: mapName,
|
||||||
aspectScale: 1,
|
aspectScale: 1,
|
||||||
zoom: 1.2,
|
zoom: 0.2,
|
||||||
layoutCenter: ["50%", "51%"],
|
layoutCenter: ["50%", "51%"],
|
||||||
layoutSize: "110%",
|
layoutSize: "90%",
|
||||||
roam: false,
|
roam: false,
|
||||||
label: {
|
label: {
|
||||||
emphasis: {
|
emphasis: {
|
||||||
show: false
|
show: false
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
show: true,
|
show: true,
|
||||||
map: mapName,
|
map: mapName,
|
||||||
zoom: 1.2,
|
zoom: 1,
|
||||||
aspectScale: 1,
|
aspectScale: 1,
|
||||||
roam: false,
|
roam: false,
|
||||||
itemStyle: {
|
itemStyle: {
|
||||||
|
@ -427,29 +421,7 @@ const initTownMap = async (name) => {
|
||||||
|
|
||||||
},
|
},
|
||||||
|
|
||||||
{
|
|
||||||
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)",
|
|
||||||
},
|
|
||||||
},
|
|
||||||
},
|
|
||||||
|
|
||||||
|
|
||||||
{
|
{
|
||||||
|
@ -457,9 +429,9 @@ const initTownMap = async (name) => {
|
||||||
map: mapName,
|
map: mapName,
|
||||||
zlevel: -1,
|
zlevel: -1,
|
||||||
aspectScale: 1,
|
aspectScale: 1,
|
||||||
zoom: 1.2,
|
zoom: 1,
|
||||||
layoutCenter: ["50%", "52%"],
|
layoutCenter: ["50%", "52%"],
|
||||||
layoutSize: "110%",
|
layoutSize: "90%",
|
||||||
roam: false,
|
roam: false,
|
||||||
silent: true,
|
silent: true,
|
||||||
|
|
||||||
|
@ -482,9 +454,9 @@ const initTownMap = async (name) => {
|
||||||
map: mapName,
|
map: mapName,
|
||||||
zlevel: -2,
|
zlevel: -2,
|
||||||
aspectScale: 1,
|
aspectScale: 1,
|
||||||
zoom: 1.2,
|
zoom: 1,
|
||||||
layoutCenter: ["50%", "53%"],
|
layoutCenter: ["50%", "53%"],
|
||||||
layoutSize: "110%",
|
layoutSize: "90%",
|
||||||
roam: false,
|
roam: false,
|
||||||
silent: true,
|
silent: true,
|
||||||
|
|
||||||
|
@ -506,9 +478,9 @@ const initTownMap = async (name) => {
|
||||||
map: mapName,
|
map: mapName,
|
||||||
zlevel: -4,
|
zlevel: -4,
|
||||||
aspectScale: 1,
|
aspectScale: 1,
|
||||||
zoom: 1.2,
|
zoom: 1,
|
||||||
layoutCenter: ["50%", "54%"],
|
layoutCenter: ["50%", "54%"],
|
||||||
layoutSize: "110%",
|
layoutSize: "90%",
|
||||||
roam: false,
|
roam: false,
|
||||||
silent: true,
|
silent: true,
|
||||||
|
|
||||||
|
@ -546,7 +518,7 @@ const initTownMap = async (name) => {
|
||||||
// return val[2] / 10;
|
// return val[2] / 10;
|
||||||
},
|
},
|
||||||
markPoint: {
|
markPoint: {
|
||||||
data: pointerFn2(pointerList2)
|
data: pointerFn2(pointerList)
|
||||||
},
|
},
|
||||||
|
|
||||||
data: (() => {
|
data: (() => {
|
||||||
|
@ -582,9 +554,8 @@ const initTownMap = async (name) => {
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
params.data.data.forEach(item => {
|
params.data.data.forEach(item => {
|
||||||
|
|
||||||
if (item.value[0] == longInfo[0] && item.value[1] == longInfo[1]) {
|
if (item.value[0] == longInfo[0] && item.value[1] == longInfo[1]) {
|
||||||
router.push(`/detail?landId=${item.id}&town=${name}&parmas=${JSON.stringify(areaStore.userInfo) }`)
|
router.push(`/detail?landId=${item.id}&town=${name}&parmas=${JSON.stringify(areaStore.userInfo)}&landName=${item.name}`)
|
||||||
}
|
}
|
||||||
|
|
||||||
})
|
})
|
||||||
|
|
|
@ -1,12 +1,12 @@
|
||||||
<template>
|
<template>
|
||||||
|
|
||||||
|
|
||||||
<div class="bottom-li" :class="(item.flag) ? '' : 'act'" v-for="(item, index) in environmentData">
|
<div class="bottom-li" :class="(item.flag) ? '' : 'act',actList.includes(item.name)?'dbg':''" v-for="(item, index) in environmentData">
|
||||||
|
|
||||||
<span class="color-font">{{ item.name }}</span>
|
<span class="color-font">{{ item.name }}</span>
|
||||||
<span>{{ item.value }}{{ item.unit }}</span>
|
<span>{{ item.value }}{{ item.unit }}</span>
|
||||||
<span v-if="item.flag">状态正常</span>
|
<span v-if="item.flag">状态正常</span>
|
||||||
<span v-else>状态正常</span>
|
<span v-else>状态异常</span>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
@ -18,6 +18,12 @@
|
||||||
import { monitorInfoApi } from "@/api.js"
|
import { monitorInfoApi } from "@/api.js"
|
||||||
|
|
||||||
import {ref,reactive} from "vue"
|
import {ref,reactive} from "vue"
|
||||||
|
|
||||||
|
const actList=reactive([
|
||||||
|
'环境湿度','环境温度','雨量','环境光照'
|
||||||
|
|
||||||
|
])
|
||||||
|
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
data:Object,
|
data:Object,
|
||||||
})
|
})
|
||||||
|
@ -134,9 +140,12 @@ const monitorThreshold=reactive({})
|
||||||
}
|
}
|
||||||
|
|
||||||
.act {
|
.act {
|
||||||
background-image: url('/static/detail/YC.png');
|
|
||||||
color: #C65956;
|
color: #C65956;
|
||||||
|
|
||||||
|
|
||||||
|
}
|
||||||
|
.dbg{
|
||||||
|
background-image: url('/static/detail/YC.png');
|
||||||
|
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
|
@ -32,15 +32,32 @@
|
||||||
</style>
|
</style>
|
||||||
|
|
||||||
<script setup>
|
<script setup>
|
||||||
import { ref, onMounted,defineEmits } from "vue"
|
import { ref, onMounted, defineEmits } from "vue"
|
||||||
import * as echarts from 'echarts';
|
import * as echarts from 'echarts';
|
||||||
import "echarts-gl"
|
import "echarts-gl"
|
||||||
import geoJson from "/static/jsonData/luxian_geo.js"
|
import geoJson from "/static/jsonData/luxian_geo.js"
|
||||||
import { useRoute } from "vue-router"
|
import { useRoute } 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"
|
||||||
const emit = defineEmits(['changeLand'])
|
const icon = "https:\/\/ceshi-worker-task.lihaink.cn\/uploads\/images\/20231204\/202312041608529c9e21252.png"
|
||||||
|
|
||||||
|
const emit = defineEmits(['changeLand'])
|
||||||
|
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: [190, 30], // 图片大小
|
||||||
|
symbolOffset: ['50%', '-50%'],
|
||||||
|
data: lists,
|
||||||
|
|
||||||
|
},)
|
||||||
|
})
|
||||||
|
return list
|
||||||
|
}
|
||||||
const areaStore = areaObj()
|
const areaStore = areaObj()
|
||||||
const deepCopy = (obj) => {
|
const deepCopy = (obj) => {
|
||||||
if (typeof obj !== 'object' || obj === null) {
|
if (typeof obj !== 'object' || obj === null) {
|
||||||
|
@ -62,39 +79,38 @@ const townJson = deepCopy(geoJson)
|
||||||
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 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 lx = "https:\/\/ceshi-worker-task.lihaink.cn\/uploads\/images\/20231205\/20231205092709cfe148712.png"
|
||||||
|
|
||||||
const pointerFn2 = (lists) => {
|
// const pointerFn2 = (lists) => {
|
||||||
let list = []
|
// let list = []
|
||||||
lists.forEach((item, index) => {
|
// lists.forEach((item, index) => {
|
||||||
list.push({
|
// list.push({
|
||||||
coord: item.value,
|
// coord: item.value,
|
||||||
value: item.name,
|
// value: item.name,
|
||||||
animation: true,
|
// animation: true,
|
||||||
data: lists,
|
// data: lists,
|
||||||
itemStyle: {
|
// itemStyle: {
|
||||||
normal: {
|
// normal: {
|
||||||
borderColor: 'red',
|
// borderColor: 'red',
|
||||||
borderWidth: 1, // 标注边线线宽,单位px,默认为1
|
// borderWidth: 1, // 标注边线线宽,单位px,默认为1
|
||||||
label: {
|
// label: {
|
||||||
show: false
|
// show: false
|
||||||
}
|
// }
|
||||||
},
|
// },
|
||||||
emphasis: {
|
// emphasis: {
|
||||||
borderColor: 'red',
|
// borderColor: 'red',
|
||||||
borderWidth: 5,
|
// borderWidth: 5,
|
||||||
label: {
|
// label: {
|
||||||
show: false
|
// show: false
|
||||||
}
|
// }
|
||||||
}
|
// }
|
||||||
},
|
// },
|
||||||
|
|
||||||
|
|
||||||
},)
|
// },)
|
||||||
})
|
// })
|
||||||
return list
|
// return list
|
||||||
}
|
// }
|
||||||
onMounted(async () => {
|
onMounted(async () => {
|
||||||
let center = []
|
let center = []
|
||||||
let pointerList = []
|
let pointerList = []
|
||||||
|
@ -112,15 +128,6 @@ onMounted(async () => {
|
||||||
|
|
||||||
})
|
})
|
||||||
|
|
||||||
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';
|
var mapName = 'lz';
|
||||||
const myChart = document.getElementById("farmerchart")
|
const myChart = document.getElementById("farmerchart")
|
||||||
|
@ -300,13 +307,13 @@ onMounted(async () => {
|
||||||
// return val[2] / 10;
|
// return val[2] / 10;
|
||||||
},
|
},
|
||||||
markPoint: {
|
markPoint: {
|
||||||
data: pointerFn2(pointerList2)
|
data: pointerFn2(pointerList)
|
||||||
},
|
},
|
||||||
|
|
||||||
data: (() => {
|
data: (() => {
|
||||||
|
|
||||||
let data = {
|
let data = {
|
||||||
资产数: center2
|
资产数: center
|
||||||
|
|
||||||
}
|
}
|
||||||
let finalData = []
|
let finalData = []
|
||||||
|
@ -334,7 +341,11 @@ onMounted(async () => {
|
||||||
params.data.data.forEach(item => {
|
params.data.data.forEach(item => {
|
||||||
if (item.value[0] == longInfo[0] && item.value[1] == longInfo[1]) {
|
if (item.value[0] == longInfo[0] && item.value[1] == longInfo[1]) {
|
||||||
|
|
||||||
emit('changeLand',item.id)
|
let data = {
|
||||||
|
id: item.id,
|
||||||
|
name: item.name
|
||||||
|
}
|
||||||
|
emit('changeLand', data)
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<template>
|
<template>
|
||||||
<div>监控设备总数: <span class="num color-font">{{ totalNum }}</span> 台</div>
|
<div>监测设备总数: <span class="num color-font">{{ totalNum }}</span> 台</div>
|
||||||
<div class="cont">
|
<div class="cont">
|
||||||
<div style="display: flex;justify-content: space-between;align-items: center;margin-top: 3vh;">
|
<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="">
|
<img src="/static/index/JYZ.png" style="width: 2.8vw; height: 4vw;" alt="">
|
||||||
|
@ -15,11 +15,11 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="eqNum">
|
<div class="eqNum">
|
||||||
<div>
|
<div>
|
||||||
<img src="/static/index/Q.png" alt="" style="transform: translateY(2px);"> 在线设备统计:<span
|
<img src="/static/index/Q.png" alt="" style="transform: translateY(2px);"> 在线设备数量:<span
|
||||||
class="num color-font" style="margin-left: 10px;">{{ onlineNum }}</span> 台
|
class="num color-font" style="margin-left: 10px;">{{ onlineNum }}</span> 台
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<img src="/static/index/Q.png" style="transform: translateY(2px);"> 离线设备统计:<span class="num color-font"
|
<img src="/static/index/Q.png" style="transform: translateY(2px);"> 离线设备数量:<span class="num color-font"
|
||||||
style="margin-left: 10px;">{{ offlineNum }}</span>
|
style="margin-left: 10px;">{{ offlineNum }}</span>
|
||||||
台
|
台
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -1,19 +1,33 @@
|
||||||
<template>
|
<template>
|
||||||
<div class="content" id="eq">
|
<div class="content" id="eq">
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<div class="eq" v-for="item in productList" :key="item">
|
<div class="eq" v-for="item in productList" :key="item">
|
||||||
<img :src="item.image" style="height: 100%;border-radius: 1vh;" alt="">
|
|
||||||
<div
|
|
||||||
style="display: flex;flex-direction: column;justify-content: space-between;margin-left: 1vw;color: #CAD5E5;">
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<div class="eq-name"> {{ item.name }}</div>
|
||||||
|
|
||||||
|
<img :src="item.image" style="width: 10vw; border-radius: 1vh;" alt="">
|
||||||
|
<!-- <div style="display: flex;flex-direction: column;justify-content: space-between;margin-left: 1vw;color: #CAD5E5;">
|
||||||
<div style="display: flex;align-items: center;">
|
<div style="display: flex;align-items: center;">
|
||||||
<img src="/static/index/MC.png" style="width:1.7vw;height: 1.5vw;margin-right: 5px; " alt="">
|
<img src="/static/index/MC.png" style="width:1.7vw;height: 1.5vw;margin-right: 5px; " alt="">
|
||||||
{{ item.name }}
|
{{ item.name }}
|
||||||
</div>
|
</div>
|
||||||
<div style="display: flex;align-items: center;">
|
<div style="display: flex;align-items: center;">
|
||||||
<img src="/static/index/JS.png" style="width:1.7vw;height: 1.5vw;margin-right: 5px; " alt="">
|
<img src="/static/index/JS.png" style="width:1.7vw;height: 1.5vw;margin-right: 5px; " alt="">
|
||||||
{{ item.desc }}
|
{{ item.desc }}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div> -->
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<style lang="scss">
|
<style lang="scss">
|
||||||
|
@ -21,19 +35,48 @@
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
transition: 1s;
|
transition: 1s;
|
||||||
// background-color: #fff;
|
|
||||||
overflow-y: auto;
|
overflow-y: auto;
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
|
// flex-wrap: wrap;
|
||||||
|
// display: flex;
|
||||||
|
// justify-content: space-between;
|
||||||
|
// background-color: red;
|
||||||
|
|
||||||
.eq {
|
.eq {
|
||||||
width: 100%;
|
float: left;
|
||||||
height: 10vh;
|
margin-right: 1vw;
|
||||||
// background-color: #fff;
|
|
||||||
margin-bottom: 1vh;
|
margin-bottom: 1vh;
|
||||||
background-color: #092049;
|
position: relative;
|
||||||
box-sizing: border-box;
|
|
||||||
padding: 1vh;
|
.eq-name {
|
||||||
display: flex;
|
position: absolute;
|
||||||
|
width: 100%;
|
||||||
|
height: 4vh;
|
||||||
|
text-align: center;
|
||||||
|
box-sizing: border-box;
|
||||||
|
padding-top: 1vh;
|
||||||
|
|
||||||
|
background-color: rgba(52, 76, 115, 0.7);
|
||||||
|
white-space: nowrap;
|
||||||
|
/* 文本不换行 */
|
||||||
|
overflow: hidden;
|
||||||
|
/* 超出部分隐藏 */
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
font-size: 14px;
|
||||||
|
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
// display: inline-block;
|
||||||
|
// margin-bottom: 2vh;
|
||||||
|
// min-height: 10vh;
|
||||||
|
// background-color: #fff;
|
||||||
|
// margin-bottom: 1vh;
|
||||||
|
// background-color: #092049;
|
||||||
|
// box-sizing: border-box;
|
||||||
|
// padding: 1vh;
|
||||||
|
// display: flex;
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
@ -53,17 +96,16 @@
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
<script setup>
|
<script setup>
|
||||||
import {ref,reactive,onMounted} from "vue"
|
import { ref, reactive, onMounted } from "vue"
|
||||||
import {productListApi} from "@/api.js"
|
import { productListApi } from "@/api.js"
|
||||||
import { areaObj } from "@/store/index.js"
|
import { areaObj } from "@/store/index.js"
|
||||||
const userInfoStore=areaObj()
|
const userInfoStore = areaObj()
|
||||||
// ...userInfoStore.userInfo
|
|
||||||
const scrollTableFn = () => {
|
const scrollTableFn = () => {
|
||||||
const tag = document.getElementById('eq')
|
const tag = document.getElementById('eq')
|
||||||
const height = tag.scrollHeight
|
const height = tag.scrollHeight
|
||||||
setInterval(() => {
|
setInterval(() => {
|
||||||
tag.scrollTop += 1
|
tag.scrollTop += 1
|
||||||
if ((tag.scrollTop + tag.clientHeight) >= height - 50) {
|
if ((tag.scrollTop + tag.clientHeight) >= height - 20) {
|
||||||
tag.scrollTop = 0
|
tag.scrollTop = 0
|
||||||
|
|
||||||
}
|
}
|
||||||
|
@ -72,20 +114,25 @@ const scrollTableFn = () => {
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
const productList=reactive([])
|
const productList = reactive([])
|
||||||
productListApi(
|
productListApi(
|
||||||
{
|
{
|
||||||
...userInfoStore.userInfo
|
...userInfoStore.userInfo
|
||||||
|
|
||||||
|
|
||||||
}
|
}
|
||||||
).then(res=>{
|
).then(res => {
|
||||||
res.data.list.forEach(item => {
|
res.data.list.forEach(item => {
|
||||||
productList.push(item)
|
productList.push(item)
|
||||||
});
|
});
|
||||||
})
|
})
|
||||||
|
|
||||||
onMounted( ()=>{
|
onMounted(() => {
|
||||||
scrollTableFn()
|
|
||||||
|
setTimeout(() => {
|
||||||
|
scrollTableFn()
|
||||||
|
|
||||||
|
}, 3000)
|
||||||
|
|
||||||
})
|
})
|
||||||
</script>
|
</script>
|
|
@ -6,7 +6,7 @@
|
||||||
<div style="display: flex;flex-direction: column;margin-left: 1vw;">
|
<div style="display: flex;flex-direction: column;margin-left: 1vw;">
|
||||||
<div style="font-family:FZCYJ ;">告警数据:</div>
|
<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>
|
<div class="warn-li"> <img src="/static/index/PM.png" class="pm-img"> <span class="pm-num">1</span>
|
||||||
<span class="text"> {{ props.data.value }}</span>
|
<span class="text"> {{ eqType(props.data.type, props.data.value) }} </span>
|
||||||
</div>
|
</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>
|
<span class="text"> 这是一名后端开发</span>
|
||||||
|
@ -19,7 +19,7 @@
|
||||||
<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;">{{ props.data.content }}</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
@ -89,10 +89,41 @@
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
<script setup>
|
<script setup>
|
||||||
import { ref, reactive, defineEmits,defineProps } from "vue"
|
import { ref, reactive, defineEmits, defineProps } from "vue"
|
||||||
|
|
||||||
|
|
||||||
|
const eqType = (type, value) => {
|
||||||
|
|
||||||
|
switch (type) {
|
||||||
|
case "ambient_temperature":
|
||||||
|
return "气温" + value + "℃"
|
||||||
|
case 'carbon_dioxide':
|
||||||
|
return "空气二氧化碳" + value + "ppm"
|
||||||
|
case 'soil_temperature':
|
||||||
|
return "土壤温度" + value + "℃"
|
||||||
|
case 'soil_moisture':
|
||||||
|
return "土壤湿度" + value + "℃"
|
||||||
|
case 'soil_potassium_phosphate_nitrogen':
|
||||||
|
return "土壤磷酸钾-含氮量偏高" + value + "mg/kg"
|
||||||
|
case 'ambient_air_pressure':
|
||||||
|
return "环境气压" + value + "KPa"
|
||||||
|
case 'rainfall':
|
||||||
|
return "雨量" + value + "mm"
|
||||||
|
case 'ambient_lighting':
|
||||||
|
return "环境光照" + value + "LUX"
|
||||||
|
case 'soil_conductivity':
|
||||||
|
return "土壤导电率" + value + "LUX"
|
||||||
|
case 'soil_PH':
|
||||||
|
return "土壤PH值为" + value
|
||||||
|
default:
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
data:Object,
|
data: Object,
|
||||||
})
|
})
|
||||||
|
|
||||||
|
|
||||||
|
|
|
@ -263,6 +263,138 @@ const setoptionsFn = (X, Y, tits) => {
|
||||||
}
|
}
|
||||||
return data
|
return data
|
||||||
}
|
}
|
||||||
|
// const CKP = {
|
||||||
|
|
||||||
|
|
||||||
|
// toolbox: {
|
||||||
|
// feature: {
|
||||||
|
// saveAsImage: {}
|
||||||
|
// }
|
||||||
|
// },
|
||||||
|
// grid: {
|
||||||
|
// left: '3%',
|
||||||
|
// right: '4%',
|
||||||
|
// bottom: '3%',
|
||||||
|
// containLabel: true
|
||||||
|
// },
|
||||||
|
// xAxis: [
|
||||||
|
// {
|
||||||
|
// show: false,
|
||||||
|
// type: "category",
|
||||||
|
// boundaryGap: false,
|
||||||
|
// axisLabel: {
|
||||||
|
// color: "#33a3dc",
|
||||||
|
// fontSize: 14
|
||||||
|
// },
|
||||||
|
// axisLine: {
|
||||||
|
// lineStyle: {
|
||||||
|
// color: "rgba(255,255,255,.1)"
|
||||||
|
// }
|
||||||
|
// },
|
||||||
|
// data: ["4月", "5月", "6月", "7月", "8月", "9月", "10月"]
|
||||||
|
// }
|
||||||
|
// ],
|
||||||
|
// yAxis: [
|
||||||
|
// {
|
||||||
|
// show:false,
|
||||||
|
// type: 'value'
|
||||||
|
// }
|
||||||
|
// ],
|
||||||
|
// series: [
|
||||||
|
// {
|
||||||
|
// name: 'Email',
|
||||||
|
// type: 'line',
|
||||||
|
// stack: 'Total',
|
||||||
|
// smooth: true,
|
||||||
|
// lineStyle: {
|
||||||
|
// normal: {
|
||||||
|
// color: "white" // 线条颜色
|
||||||
|
// }
|
||||||
|
// },
|
||||||
|
// areaStyle: {
|
||||||
|
// // 区域填充样式
|
||||||
|
// normal: {
|
||||||
|
// // 线性渐变,前4个参数分别是x0,y0,x2,y2(范围0~1);相当于图形包围盒中的百分比。如果最后一个参数是‘true’,则该四个值是绝对像素位置。
|
||||||
|
// color: new echarts.graphic.LinearGradient(0, 0, 0, 1,
|
||||||
|
// [
|
||||||
|
// { offset: 0, color: "#1A4BB3" },
|
||||||
|
|
||||||
|
// ],
|
||||||
|
// false
|
||||||
|
// )
|
||||||
|
// // shadowColor: "rgba(53,142,215, 0.9)", // 阴影颜色
|
||||||
|
// // shadowBlur: 20 // shadowBlur设图形阴影的模糊大小。配合shadowColor,shadowOffsetX/Y, 设置图形的阴影效果。
|
||||||
|
// }
|
||||||
|
// },
|
||||||
|
// emphasis: {
|
||||||
|
// focus: 'series'
|
||||||
|
// },
|
||||||
|
// data: [120, 132, 101, 134, 90, 230, 210]
|
||||||
|
// },
|
||||||
|
// {
|
||||||
|
// name: 'Union Ads',
|
||||||
|
// type: 'line',
|
||||||
|
// smooth: true,
|
||||||
|
// stack: 'Total',
|
||||||
|
// lineStyle: {
|
||||||
|
// normal: {
|
||||||
|
// color: "white" // 线条颜色
|
||||||
|
// }
|
||||||
|
// },
|
||||||
|
// areaStyle: {
|
||||||
|
// // 区域填充样式
|
||||||
|
// normal: {
|
||||||
|
// // 线性渐变,前4个参数分别是x0,y0,x2,y2(范围0~1);相当于图形包围盒中的百分比。如果最后一个参数是‘true’,则该四个值是绝对像素位置。
|
||||||
|
// color: new echarts.graphic.LinearGradient(0, 0, 0, 1,
|
||||||
|
// [
|
||||||
|
// { offset: 0, color: "#1C6AA9" },
|
||||||
|
|
||||||
|
// ],
|
||||||
|
// false
|
||||||
|
// )
|
||||||
|
// // shadowColor: "rgba(53,142,215, 0.9)", // 阴影颜色
|
||||||
|
// // shadowBlur: 20 // shadowBlur设图形阴影的模糊大小。配合shadowColor,shadowOffsetX/Y, 设置图形的阴影效果。
|
||||||
|
// }
|
||||||
|
// },
|
||||||
|
// emphasis: {
|
||||||
|
// focus: 'series'
|
||||||
|
// },
|
||||||
|
// data: [220, 182, 191, 234, 290, 330, 310]
|
||||||
|
// },
|
||||||
|
// {
|
||||||
|
// name: 'Video Ads',
|
||||||
|
// type: 'line',
|
||||||
|
// stack: 'Total',
|
||||||
|
// smooth: true,
|
||||||
|
// lineStyle: {
|
||||||
|
// normal: {
|
||||||
|
// color: "white" // 线条颜色
|
||||||
|
// }
|
||||||
|
// },
|
||||||
|
// areaStyle: {
|
||||||
|
// // 区域填充样式
|
||||||
|
// normal: {
|
||||||
|
// // 线性渐变,前4个参数分别是x0,y0,x2,y2(范围0~1);相当于图形包围盒中的百分比。如果最后一个参数是‘true’,则该四个值是绝对像素位置。
|
||||||
|
// color: new echarts.graphic.LinearGradient(0, 0, 0, 1,
|
||||||
|
// [
|
||||||
|
// { offset: 0, color: "#38A3D9" },
|
||||||
|
|
||||||
|
// ],
|
||||||
|
// false
|
||||||
|
// )
|
||||||
|
// // shadowColor: "rgba(53,142,215, 0.9)", // 阴影颜色
|
||||||
|
// // shadowBlur: 20 // shadowBlur设图形阴影的模糊大小。配合shadowColor,shadowOffsetX/Y, 设置图形的阴影效果。
|
||||||
|
// }
|
||||||
|
// },
|
||||||
|
// emphasis: {
|
||||||
|
// focus: 'series'
|
||||||
|
// },
|
||||||
|
// data: [150, 232, 201, 154, 190, 330, 410]
|
||||||
|
// },
|
||||||
|
|
||||||
|
// ]
|
||||||
|
// };
|
||||||
|
|
||||||
|
|
||||||
const CKP = {
|
const CKP = {
|
||||||
// backgroundColor: "#21263A",
|
// backgroundColor: "#21263A",
|
||||||
|
@ -354,8 +486,7 @@ const CKP = {
|
||||||
// 线性渐变,前4个参数分别是x0,y0,x2,y2(范围0~1);相当于图形包围盒中的百分比。如果最后一个参数是‘true’,则该四个值是绝对像素位置。
|
// 线性渐变,前4个参数分别是x0,y0,x2,y2(范围0~1);相当于图形包围盒中的百分比。如果最后一个参数是‘true’,则该四个值是绝对像素位置。
|
||||||
color: new echarts.graphic.LinearGradient(0, 0, 0, 1,
|
color: new echarts.graphic.LinearGradient(0, 0, 0, 1,
|
||||||
[
|
[
|
||||||
{ offset: 0, color: "rgba(22,84,156, 0.8)" },
|
{ offset: 0, color: "#306CDC" },
|
||||||
{ offset: 1, color: "rgba(22,84,156, 0)" }
|
|
||||||
],
|
],
|
||||||
false
|
false
|
||||||
)
|
)
|
||||||
|
@ -382,8 +513,7 @@ const CKP = {
|
||||||
// 线性渐变,前4个参数分别是x0,y0,x2,y2(范围0~1);相当于图形包围盒中的百分比。如果最后一个参数是‘true’,则该四个值是绝对像素位置。
|
// 线性渐变,前4个参数分别是x0,y0,x2,y2(范围0~1);相当于图形包围盒中的百分比。如果最后一个参数是‘true’,则该四个值是绝对像素位置。
|
||||||
color: new echarts.graphic.LinearGradient(0, 0, 0, 1,
|
color: new echarts.graphic.LinearGradient(0, 0, 0, 1,
|
||||||
[
|
[
|
||||||
{ offset: 0, color: "rgba(22,84,156, 0.8)" },
|
{ offset: 0, color: "#1B4BB5" },
|
||||||
{ offset: 1, color: "rgba(22,84,156, 0)" }
|
|
||||||
],
|
],
|
||||||
false
|
false
|
||||||
)
|
)
|
||||||
|
@ -409,8 +539,7 @@ const CKP = {
|
||||||
// 线性渐变,前4个参数分别是x0,y0,x2,y2(范围0~1);相当于图形包围盒中的百分比。如果最后一个参数是‘true’,则该四个值是绝对像素位置。
|
// 线性渐变,前4个参数分别是x0,y0,x2,y2(范围0~1);相当于图形包围盒中的百分比。如果最后一个参数是‘true’,则该四个值是绝对像素位置。
|
||||||
color: new echarts.graphic.LinearGradient(0, 0, 0, 1,
|
color: new echarts.graphic.LinearGradient(0, 0, 0, 1,
|
||||||
[
|
[
|
||||||
{ offset: 0, color: "rgba(22,84,156, 0.8)" },
|
{ offset: 0, color: "#5EAAE2" },
|
||||||
{ offset: 1, color: "rgba(22,84,156, 0)" }
|
|
||||||
],
|
],
|
||||||
false
|
false
|
||||||
)
|
)
|
||||||
|
|
|
@ -22,7 +22,7 @@
|
||||||
<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="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">{{ landName }}</span> </div>
|
||||||
</div>
|
</div>
|
||||||
<farmerMap @changeLand="changeLandFn"></farmerMap>
|
<farmerMap @changeLand="changeLandFn"></farmerMap>
|
||||||
</div>
|
</div>
|
||||||
|
@ -63,10 +63,13 @@ let data = reactive(
|
||||||
}
|
}
|
||||||
)
|
)
|
||||||
|
|
||||||
|
|
||||||
|
const landName=ref(route.query.landName)
|
||||||
|
|
||||||
landListApi({
|
landListApi({
|
||||||
...data
|
...data
|
||||||
}).then(res => {
|
}).then(res => {
|
||||||
console.log(res)
|
console.log(res.data)
|
||||||
res.data.list.forEach(item => {
|
res.data.list.forEach(item => {
|
||||||
if (item.id == data.land_id) {
|
if (item.id == data.land_id) {
|
||||||
video_url.value = item.video_url
|
video_url.value = item.video_url
|
||||||
|
@ -74,9 +77,12 @@ landListApi({
|
||||||
})
|
})
|
||||||
})
|
})
|
||||||
|
|
||||||
const changeLandFn = (land_id) => {
|
const changeLandFn = (item) => {
|
||||||
|
// console.log(item)
|
||||||
data.land_id = land_id
|
// return
|
||||||
|
data.land_id = item.id
|
||||||
|
landName.value=item.name
|
||||||
|
// route.query.townName=item.name
|
||||||
|
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
|
@ -14,8 +14,8 @@
|
||||||
<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">
|
<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" style="z-index: 99999;"><span class="color-font" @click="back">返回首页</span></div>
|
||||||
<div class=" c-top-tits"><span class="color-font">地块</span> </div>
|
<div class="c-top-tits" style="z-index: 99999;"><span class="color-font">{{ townName }}地块</span> </div>
|
||||||
</div>
|
</div>
|
||||||
<div class="c-top-tit" v-else>
|
<div class="c-top-tit" v-else>
|
||||||
<div class="c-top-li">种植面积 <span class="color-font"
|
<div class="c-top-li">种植面积 <span class="color-font"
|
||||||
|
@ -26,12 +26,9 @@
|
||||||
style="font-size: 18px;margin-left: 1vw; ">{{ centerData.landCount }}</span> 块</div>
|
style="font-size: 18px;margin-left: 1vw; ">{{ centerData.landCount }}</span> 块</div>
|
||||||
</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>
|
|
||||||
</div> -->
|
|
||||||
<div class="map">
|
<div class="map">
|
||||||
<areaMap ></areaMap>
|
<areaMap @getTowmName="getTowmName"></areaMap>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="bottom">
|
<div class="bottom">
|
||||||
|
@ -49,11 +46,11 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="video" style="height: 65%;">
|
<div class="video" style="height: 65%;">
|
||||||
<div class="video-tit"> 实时监测影像 </div>
|
<div class="video-tit "> 实时监测影像 </div>
|
||||||
<JessibucaDemo v-if="video_url" :src="video_url"></JessibucaDemo>
|
<JessibucaDemo v-if="video_url" :src="video_url"></JessibucaDemo>
|
||||||
<div style="height: 100%;height: 100%;background-color: #0C2856;position: relative;" v-else>
|
<div style="height: 100%;height: 100%;background-color: #0C2856;position: relative;" v-else>
|
||||||
|
|
||||||
<img src="/static/index/video.png" style="position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);" alt="">
|
<img src="/static/index/video.png" style="position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);width: 50px;height: 50px;" alt="">
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -114,9 +111,13 @@ const choseUrl=(item)=>{
|
||||||
|
|
||||||
}
|
}
|
||||||
const back=()=>{
|
const back=()=>{
|
||||||
|
console.log("back")
|
||||||
router.go(0)
|
router.go(0)
|
||||||
}
|
}
|
||||||
|
const townName=ref("")
|
||||||
|
const getTowmName=(e)=>{
|
||||||
|
townName.value=e
|
||||||
|
}
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
<style lang="scss">
|
<style lang="scss">
|
||||||
|
@ -248,7 +249,7 @@ const back=()=>{
|
||||||
|
|
||||||
.video {
|
.video {
|
||||||
.video-tit {
|
.video-tit {
|
||||||
color: white;
|
color: #CEE4FE;
|
||||||
width: 110px;
|
width: 110px;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
line-height: 30px;
|
line-height: 30px;
|
||||||
|
@ -257,6 +258,9 @@ const back=()=>{
|
||||||
background-size: cover;
|
background-size: cover;
|
||||||
font-size: 15px;
|
font-size: 15px;
|
||||||
margin-bottom: 3vh;
|
margin-bottom: 3vh;
|
||||||
|
font-size: 15px;
|
||||||
|
font-family: FZCYJ;
|
||||||
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -276,5 +280,17 @@ const back=()=>{
|
||||||
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.c-top-tits {
|
||||||
|
|
||||||
|
padding: 1vh 1vw;
|
||||||
|
font-size: 20px;
|
||||||
|
// border: 1px solid red;
|
||||||
|
cursor: pointer;
|
||||||
|
background-image: url('/static/detail/FHSY.png');
|
||||||
|
background-size: 100% 100%;
|
||||||
|
|
||||||
|
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
Before Width: | Height: | Size: 1.2 KiB |
Before Width: | Height: | Size: 1.5 KiB |
Before Width: | Height: | Size: 13 KiB |
Before Width: | Height: | Size: 611 B |
Before Width: | Height: | Size: 166 KiB |
Before Width: | Height: | Size: 4.0 KiB After Width: | Height: | Size: 3.4 KiB |
Before Width: | Height: | Size: 1.1 KiB |
Before Width: | Height: | Size: 3.2 KiB |
Before Width: | Height: | Size: 3.9 KiB |