Compare commits
2 Commits
ebac38299f
...
d04053a9d9
| Author | SHA1 | Date |
|---|---|---|
 徐景良
|
d04053a9d9 | |
|
徐景良
|
e8016a4d88 |
|
|
@ -29,7 +29,7 @@
|
|||
"appname":"费县智慧林业防灭火平台",
|
||||
"area":"费县",
|
||||
"baseUrl":"http://223.99.16.253:9001",
|
||||
"layerurl":"http://223.99.16.253:9006/applicationMars/getApplicationInfo",
|
||||
"layerurl":"http://223.99.16.253:9006/applicationMars/getApplicationInfo/feixian",
|
||||
"uavWebSocketUrl":"ws://123.132.248.154:9211/",
|
||||
"map":{
|
||||
"center":[],
|
||||
|
|
|
|||
Binary file not shown.
|
Before Width: | Height: | Size: 2.0 KiB After Width: | Height: | Size: 22 KiB |
|
|
@ -22,6 +22,15 @@
|
|||
nprogress,toastr,admui,turf,mars3d,mars3d-widget,mars3d-esri,mars3d-echarts"
|
||||
></script>
|
||||
|
||||
<!-- 腾讯云视频直播 -->
|
||||
<link href="https://web.sdk.qcloud.com/player/tcplayer/release/v4.6.0/tcplayer.min.css" rel="stylesheet" />
|
||||
<script src="https://web.sdk.qcloud.com/player/tcplayer/release/v4.6.0/libs/TXLivePlayer-1.2.3.min.js"></script>
|
||||
<script src="https://web.sdk.qcloud.com/player/tcplayer/release/v4.6.0/libs/hls.min.1.1.5.js"></script>
|
||||
<script src="https://web.sdk.qcloud.com/player/tcplayer/release/v4.6.0/libs/flv.min.1.6.3.js"></script>
|
||||
<script src="https://web.sdk.qcloud.com/player/tcplayer/release/v4.6.0/libs/dash.all.min.4.4.1.js"></script>
|
||||
<script src="https://web.sdk.qcloud.com/player/tcplayer/release/v4.6.0/tcplayer.v4.6.0.min.js"></script>
|
||||
|
||||
|
||||
<script type="text/javascript" src="imouPlayer.js"></script>
|
||||
<link rel="stylesheet" href="index.css">
|
||||
<link rel="stylesheet" href="http://mars3d.cn/temp/css/divGraphic.css">
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
|
|
@ -19,12 +19,12 @@
|
|||
</div>
|
||||
<div class="list-box">
|
||||
<div class="list-item" v-for="(item,index) in listData" :key="index*tableRandom" >
|
||||
<div class="list-item-box" style="width:15%;">{{item.xzqmc}}</div>
|
||||
<div class="list-item-box" style="width:15%;">{{item.type}}</div>
|
||||
<div class="list-item-box" style="width:15%;">{{item.dcz}}</div>
|
||||
<div class="list-item-box" style="width:45%;">{{item.fdcz}}</div>
|
||||
<div class="list-item-box" style="width:15%;">{{item.xzqmc ? item.xzqmc : '暂无数据'}}</div>
|
||||
<div class="list-item-box" style="width:15%;">{{item.type ? item.type : ' 暂无数据'}}</div>
|
||||
<div class="list-item-box" style="width:15%;">{{item.dcz ? item.dcz : ' 暂无数据'}}</div>
|
||||
<div class="list-item-box" style="width:45%;">{{item.fdcz ? item.fdcz : '暂无数据 '}}</div>
|
||||
<div class="list-item-box" style="width:10%;">
|
||||
<div class="operate-button operate-edit" @click="userListContainer = true"><i class="el-icon el-icon-edit"></i></div>
|
||||
<div class="operate-button operate-edit" @click="getUserlist(item.gid)"><i class="el-icon el-icon-edit"></i></div>
|
||||
<div class="operate-button operate-delete"><i class="el-icon el-icon-delete"></i></div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -50,31 +50,34 @@
|
|||
<div class="grid-list-box">
|
||||
<div class="grider-list-item" v-for="(item,index) in userList" :key="index">
|
||||
<el-form :model="item" size="mini" label-width="90px" class="demo-ruleForm">
|
||||
<el-form-item label="姓称：" prop="areaName">
|
||||
<el-form-item label="人员姓名：" prop="areaName">
|
||||
<el-input v-model="item.name"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="单位：" prop="households">
|
||||
<el-input v-model="item.unit"></el-input>
|
||||
<el-form-item label="所属单位：" prop="households">
|
||||
<el-input v-model="item.workunit"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="防火职务：" prop="households">
|
||||
<el-input v-model="item.work"></el-input>
|
||||
<el-input v-model="item.fireduties"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="督察职务：" prop="households">
|
||||
<el-input v-model="item.ducha"></el-input>
|
||||
<el-input v-model="item.supervision"></el-input>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div style="height:40px;">
|
||||
<div class="operate-button operate-edit"><i class="el-icon el-icon-edit"></i></div>
|
||||
<div class="operate-button operate-delete"><i class="el-icon el-icon-delete"></i></div>
|
||||
<div class="operate-button operate-edit"><i class="el-icon el-icon-folder-checked" @click="saveUser(item)"></i></div>
|
||||
<div class="operate-button operate-delete" @click="deleteUser(item.id)"><i class="el-icon el-icon-delete"></i></div>
|
||||
</div>
|
||||
</div>
|
||||
<div style="text-align:center;">
|
||||
<el-button type="primary" size="mini" icon="el-icon-plus" round @click="addUser">添加</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getMethodCommon } from '../../../api/common';
|
||||
import { getMethodCommon, postMethodCommon } from '../../../api/common';
|
||||
export default {
|
||||
name: 'index',
|
||||
data(){
|
||||
|
|
@ -85,30 +88,15 @@ import { getMethodCommon } from '../../../api/common';
|
|||
},
|
||||
userListContainer:false,
|
||||
userList:[
|
||||
{
|
||||
name:"徐景良",
|
||||
unit:"山东慧创信息科技有限公司",
|
||||
work:"",
|
||||
ducha:false,
|
||||
},{
|
||||
name:"徐景良",
|
||||
unit:"山东慧创信息科技有限公司",
|
||||
work:"",
|
||||
ducha:false,
|
||||
},{
|
||||
name:"徐景良",
|
||||
unit:"山东慧创信息科技有限公司",
|
||||
work:"",
|
||||
ducha:false,
|
||||
},{
|
||||
name:"徐景良",
|
||||
unit:"山东慧创信息科技有限公司",
|
||||
work:"",
|
||||
ducha:false,
|
||||
}
|
||||
|
||||
],
|
||||
tableRandom:1,
|
||||
globalMap:null,
|
||||
tableRandom:1,
|
||||
currentStreetId:null,
|
||||
listQuery:{
|
||||
pageindex:1,
|
||||
pagesize:20
|
||||
}
|
||||
}
|
||||
},
|
||||
mounted(){
|
||||
|
|
@ -150,9 +138,46 @@ import { getMethodCommon } from '../../../api/common';
|
|||
getList(){
|
||||
getMethodCommon("/FireGrid/GetTowInfo",this.listQuery).then(res=>{
|
||||
if(res.code == 200){
|
||||
this.listData = res.result;
|
||||
this.listData = res.data;
|
||||
this.tableRandom = Math.random();
|
||||
}
|
||||
})
|
||||
},
|
||||
getUserlist(id){
|
||||
this.currentStreetId = id;
|
||||
getMethodCommon("/FireGrid/GetInspectorByTown",{id:id}).then(res=>{
|
||||
if(res.code == 200){
|
||||
this.userList = res.result;
|
||||
this.userListContainer = true;
|
||||
}
|
||||
})
|
||||
},
|
||||
deleteUser(id){
|
||||
postMethodCommon("/FireGrid/DeleteInspectors",{id:id}).then(res=>{
|
||||
if(res.code == 200){
|
||||
this.$message({
|
||||
type:"success",
|
||||
message:"删除成功！"
|
||||
})
|
||||
this.getUserlist(this.currentStreetId);
|
||||
}
|
||||
})
|
||||
},
|
||||
saveUser(item){
|
||||
console.log("item",item);
|
||||
item.id = 0;
|
||||
item.townid = [this.currentStreetId];
|
||||
postMethodCommon("/FireGrid/AddInspector",item).then(res=>{
|
||||
if(res.code == 200){
|
||||
this.$message({
|
||||
type:"success",
|
||||
message:"添加成功！"
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
addUser(){
|
||||
this.userList.push({});
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -64,7 +64,7 @@
|
|||
</reportlist>
|
||||
</div>
|
||||
<!-- 线索合并 -->
|
||||
<div class="merage-box" v-if="mergeboxShow">
|
||||
<div class="merage-box" v-if="mergeboxShow" v-drag>
|
||||
<mergebox @wuzi="wuzi" @changeCurrentInfo="changeCurrentInfo" @clsoe="mergeboxShow = false;" @success="mergeSuccess"
|
||||
:globalmap="globalmap" :checkList="checkList" :checkNumber="checkNumber"></mergebox>
|
||||
</div>
|
||||
|
|
@ -109,12 +109,12 @@
|
|||
|
||||
</div>
|
||||
<!-- 人员 -->
|
||||
<div class="personnel-container" v-if="personVisible">
|
||||
<div class="personnel-container" v-drag v-if="personVisible">
|
||||
<personnel :fireData="currentInfo" :globalmap="globalmap" @close="personVisible = false" @videoCall="videoCall">
|
||||
</personnel>
|
||||
</div>
|
||||
<!-- 物资 -->
|
||||
<div class="goods-container" v-if="goodsVisible">
|
||||
<div class="goods-container" v-if="goodsVisible" v-drag>
|
||||
<goodsbox :endLngLat="endLngLat" :globalmap="globalmap" @close="goodsVisible = false"></goodsbox>
|
||||
</div>
|
||||
<!-- 水源 -->
|
||||
|
|
@ -130,11 +130,6 @@
|
|||
|
||||
<div class="bottom-tools-container" style="display:none">
|
||||
|
||||
<!-- 无人机 -->
|
||||
<div class="uav" v-if="uavShow && appTools['uavbox']">
|
||||
<uavbox></uavbox>
|
||||
</div>
|
||||
|
||||
<!-- 最优路线规划 -->
|
||||
<div class="route" v-show="routeShow && appTools['routebox']">
|
||||
<routebox :globalmap="globalmap"></routebox>
|
||||
|
|
@ -193,10 +188,11 @@
|
|||
<rightEchartsData></rightEchartsData>
|
||||
</div>
|
||||
<div class="rightbox2">
|
||||
<fireClues></fireClues>
|
||||
<!-- <fireClues></fireClues> -->
|
||||
<reportlist @close="reportlistShow=false" :mergeSuccessRandom="mergeSuccessRandom" @wuzi="wuzi" @shuiyuan="shuiyuan" @getTaskListSocket="getTaskList" @getlistSocket="reportlistShow = true" @jiankong="jiankong" @renyuan="renyuan" @merge="mergeboxShow=true;" @changeCurrentInfo="changeCurrentInfo" :globalmap="globalmap" :checkList="checkList" :checkNumber="checkNumber"></reportlist>
|
||||
</div>
|
||||
<div class="rightbox1">
|
||||
<uavbox></uavbox>
|
||||
<uavbox :globalmap="globalmap"></uavbox>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 呼叫中心 -->
|
||||
|
|
@ -256,10 +252,10 @@ import rightclicksetting from './widget/rightclick.vue';
|
|||
import socketDiaBox from './widget/socketdiabox.vue';
|
||||
import layerPlugInUnit from './widget/layerplug.vue';
|
||||
import callCenter from './widget/callcenter.vue';
|
||||
import fireClues from './widget/fireclues.vue';
|
||||
// import fireClues from './widget/fireclues.vue';
|
||||
import rightEchartsData from './widget/rightechartsdata.vue';
|
||||
import search from './widget/search.vue'
|
||||
|
||||
import drag from '../../utils/draged';
|
||||
let BASE_URL = process.env.VUE_APP_BASE_API
|
||||
const areaName = localStorage.getItem("areaName")
|
||||
export default {
|
||||
|
|
@ -288,7 +284,7 @@ export default {
|
|||
taskDelivery,
|
||||
layerPlugInUnit,
|
||||
callCenter,
|
||||
fireClues,
|
||||
// fireClues,
|
||||
rightEchartsData,
|
||||
search
|
||||
},
|
||||
|
|
@ -384,14 +380,14 @@ export default {
|
|||
window.delFirePoint = this.delFirePoint
|
||||
},
|
||||
methods: {
|
||||
getTaskList(){
|
||||
|
||||
},
|
||||
// 一件呼叫
|
||||
callUser(){
|
||||
this.personVisible = true;
|
||||
},
|
||||
diaToggle() {
|
||||
console.log('feixianConfigJson', feixianConfigJson)
|
||||
console.log('conf', this.configUrl)
|
||||
console.log('globalmap', this.globalmap)
|
||||
if (this.callCenterVisible) {
|
||||
document.getElementById("diatoggleBtn").style.right = "25px"
|
||||
document.getElementById("layercontainer").style.left = "50px"
|
||||
|
|
@ -413,11 +409,8 @@ export default {
|
|||
|
||||
}
|
||||
|
||||
console.log("widgetJson", widgetJson);
|
||||
|
||||
this.mars3d.widget.destroy()
|
||||
this.mars3d.widget.init(this.globalmap, widgetJson, "/");
|
||||
|
||||
this.globalmap.options = feixianConfigJson.map3d
|
||||
|
||||
this.callCenterVisible = !this.rightDiaVisible
|
||||
|
|
|
|||
|
|
@ -29,21 +29,21 @@
|
|||
<span class="content-title-span"></span>
|
||||
<span class="fz-14 fw-b fc-w">督查长</span>
|
||||
</div>
|
||||
<div class="flex-1 fz-14 fc-w" style="line-height:28px">{{item.title}}</div>
|
||||
<div class="flex-1 fz-14 fc-w" style="line-height:28px">{{item.dcz}}</div>
|
||||
</div>
|
||||
<div class="content-li flex">
|
||||
<div class="content-title flex ai-c">
|
||||
<span class="content-title-span"></span>
|
||||
<span class="fz-14 fw-b fc-w">副督查长</span>
|
||||
</div>
|
||||
<div class="flex-1 fz-14 fc-w" style="line-height:28px">{{item.label}}</div>
|
||||
<div class="flex-1 fz-14 fc-w" style="line-height:28px">{{item.fdcz}}</div>
|
||||
</div>
|
||||
<div class="content-li flex">
|
||||
<div class="content-title flex ai-c">
|
||||
<span class="content-title-span"></span>
|
||||
<span class="fz-14 fw-b fc-w">防火片区</span>
|
||||
</div>
|
||||
<div class="flex-1 fz-14 fc-w" style="line-height:28px">{{item.value}}</div>
|
||||
<div class="flex-1 fz-14 fc-w" style="line-height:28px">{{item.xzqmc}}</div>
|
||||
</div>
|
||||
</el-carousel-item>
|
||||
</el-carousel>
|
||||
|
|
@ -108,11 +108,20 @@ export default {
|
|||
|
||||
// 首次加载页面获取在线人数
|
||||
this.getOnLineInfo();
|
||||
|
||||
this.getBannerArr();
|
||||
},
|
||||
mounted(){
|
||||
|
||||
},
|
||||
methods:{
|
||||
getBannerArr(){
|
||||
getMethodCommon("/FireGrid/GetTowInfo",{pageindex:1,pagesize:20}).then(res=>{
|
||||
if(res.code == 200){
|
||||
this.BannersArr = res.data;
|
||||
}
|
||||
})
|
||||
},
|
||||
getOnLineInfo(){
|
||||
getMethodCommon("/FireManagement/GetOnOffLineInfo").then(res =>{
|
||||
this.listDataInfo = res.data
|
||||
|
|
|
|||
|
|
@ -146,7 +146,7 @@ export default {
|
|||
_this.checkPidArr = []
|
||||
axios({
|
||||
method: "get",
|
||||
url: "http://223.99.16.253:9006/applicationMars/getApplicationInfo"
|
||||
url: "http://223.99.16.253:9006/applicationMars/getApplicationInfo/feixian"
|
||||
}).then(res=>{
|
||||
this.listData = res.data.data
|
||||
this.listData.forEach(item =>{
|
||||
|
|
|
|||
|
|
@ -219,7 +219,7 @@
|
|||
horizontalOrigin: Cesium.HorizontalOrigin.LEFT,
|
||||
verticalOrigin: Cesium.VerticalOrigin.BOTTOM,
|
||||
distanceDisplayCondition: new Cesium.DistanceDisplayCondition(0, 200000), // 按视距距离显示
|
||||
scaleByDistance: new Cesium.NearFarScalar(1000, 1.0, 200000, 0.2),
|
||||
scaleByDistance: new Cesium.NearFarScalar(1000, 0.4, 8000, 0.2),
|
||||
clampToGround: true
|
||||
},
|
||||
"popup": `<div class="marsTiltPanel marsTiltPanel-theme-green">
|
||||
|
|
@ -252,7 +252,7 @@
|
|||
<div class="arrow" ></div>
|
||||
</div>`,
|
||||
"popupOptions":{
|
||||
"offsetY":-30,
|
||||
"offsetY":-50,
|
||||
"offsetX":30,
|
||||
"template":"{content}",
|
||||
"horizontalOrigin":"Cesium.HorizontalOrigin.LEFT",
|
||||
|
|
@ -312,6 +312,9 @@
|
|||
time: dates,
|
||||
address:this.fireData.address
|
||||
}
|
||||
|
||||
console.log("paramsEEEEEEEEEEEEE",param);
|
||||
return;
|
||||
postMethodCommon('/FireCodePC/EventAssign',param).then(res =>{
|
||||
if(res.code == 200){
|
||||
this.$message({
|
||||
|
|
|
|||
|
|
@ -322,17 +322,17 @@
|
|||
.box{
|
||||
width:100%;
|
||||
height:100%;
|
||||
background-image: url(/img/huoqing-bg.png);
|
||||
background-size:100% 100%;
|
||||
}
|
||||
|
||||
.box-title{
|
||||
width:100%;
|
||||
height:45px;
|
||||
height:55px;
|
||||
line-height:55px;
|
||||
text-indent:28px;
|
||||
overflow: hidden;
|
||||
line-height:40px;
|
||||
color:#eee;
|
||||
text-align: center;
|
||||
text-align: left;
|
||||
font-size:18px;
|
||||
}
|
||||
.title-title{
|
||||
|
|
@ -362,7 +362,7 @@
|
|||
width: calc( 100% - 20px);
|
||||
margin:0px 15px;
|
||||
margin-bottom:10px;
|
||||
height: calc( 100% - 90px);
|
||||
height: calc( 100% - 120px);
|
||||
overflow-y:auto;
|
||||
}
|
||||
.news{
|
||||
|
|
@ -394,7 +394,7 @@
|
|||
cursor: pointer;
|
||||
}
|
||||
.news-container{
|
||||
width: calc( 100% - 30px);
|
||||
width: calc( 100% - 50px);
|
||||
float:left;
|
||||
}
|
||||
.news .title{
|
||||
|
|
|
|||
|
|
@ -1,17 +1,25 @@
|
|||
<template>
|
||||
<div class="box">
|
||||
<div class="box-title">视频巡航</div>
|
||||
<div class="box-container">
|
||||
<div class="leida" v-if="!list.length">
|
||||
<div class="tangjialing" ></div>
|
||||
</div>
|
||||
|
||||
<div class="box-container" v-if="list.length">
|
||||
<!-- 没有无人机提示 -->
|
||||
<div class="video-container"></div>
|
||||
<div class="video-container">
|
||||
<video id="player-container-id" width="235px" height="178px" autoplay preload="auto" playsinline
|
||||
webkit-playsinline>
|
||||
</video>
|
||||
</div>
|
||||
|
||||
<div class="none-uav">
|
||||
<div class="uav-item" v-for="(item,index) in list" :key="index">
|
||||
<div class="uav-item" v-for="(item,index) in list" :key="index" @click="flyToPoint([item.lng,item.lat]);playerVideo(item.account)">
|
||||
<p>
|
||||
<img src="/img/uav-icon.png" style="width:22px;margin-right:10px;" alt="">
|
||||
<span style="font-size:14px;line-height:30px;">Air 2 UAV</span>
|
||||
<span style="font-size:14px;line-height:30px;">{{item.model}}</span>
|
||||
</p>
|
||||
<p>17861857725</p>
|
||||
<p>{{item.account}}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -21,25 +29,104 @@
|
|||
<script>
|
||||
export default {
|
||||
name: 'uavbox',
|
||||
props:['globalmap'],
|
||||
data(){
|
||||
return {
|
||||
list:[
|
||||
{
|
||||
name:"Air Pont 2",
|
||||
phone:"17861857726"
|
||||
},{
|
||||
name:"Air Pont 2",
|
||||
phone:"17861857726"
|
||||
},{
|
||||
name:"Air Pont 2",
|
||||
phone:"17861857726"
|
||||
},{
|
||||
name:"Air Pont 2",
|
||||
phone:"17861857726"
|
||||
// {
|
||||
// "account":"13280580815",
|
||||
// "createtime":"2023-03-23 15:44:38",
|
||||
// "height":0.5,
|
||||
// "ip":"192.168.10.101",
|
||||
// "lat":34.999998687396594,
|
||||
// "lng":117.95890203784971,
|
||||
// "model":"Mavic Air 2"
|
||||
// },{
|
||||
// "account":"17861857725",
|
||||
// "createtime":"2023-03-23 15:44:38",
|
||||
// "height":0.5,
|
||||
// "ip":"192.168.10.101",
|
||||
// "lat":35.19998687396594,
|
||||
// "lng":117.95890203784971,
|
||||
// "model":"Air Two"
|
||||
// }
|
||||
],
|
||||
player:null,
|
||||
uavGraphicLayer:null,
|
||||
}
|
||||
]
|
||||
},
|
||||
watch:{
|
||||
globalmap:function(e){
|
||||
if(e){
|
||||
this.drawUavPoint();
|
||||
}
|
||||
}
|
||||
},
|
||||
mounted(){
|
||||
|
||||
},
|
||||
methods:{
|
||||
flyToPoint(lngLat){
|
||||
try{
|
||||
this.globalmap.flyToPoint(lngLat, { radius: 1200, "pitch": -90 });
|
||||
}catch(e){
|
||||
|
||||
}
|
||||
},
|
||||
drawUavPoint(){
|
||||
if(this.uavGraphicLayer){
|
||||
this.uavGraphicLayer.clear();
|
||||
}else{
|
||||
this.uavGraphicLayer = new this.mars3d.layer.GraphicLayer({ id: 99999119 });;
|
||||
this.globalmap.addLayer(this.uavGraphicLayer)
|
||||
}
|
||||
|
||||
this.list.forEach((item,index)=>{
|
||||
let graphic = new mars3d.graphic.ModelEntity({
|
||||
name: "无人机",
|
||||
position: [parseFloat(item.lng),parseFloat(item.lat), 256.58],
|
||||
style: {
|
||||
url: "//data.mars3d.cn/gltf/mars/wrj.glb",
|
||||
scale: 0.1,
|
||||
minimumPixelSize: 50,
|
||||
silhouette: false,
|
||||
label: {
|
||||
text: item.model,
|
||||
font_size: 14,
|
||||
color: "#ffffff",
|
||||
pixelOffsetY: -50,
|
||||
distanceDisplayCondition: true,
|
||||
distanceDisplayCondition_far: 10000,
|
||||
distanceDisplayCondition_near: 0
|
||||
},
|
||||
|
||||
// 高亮时的样式（默认为鼠标移入，也可以指定type:'click'单击高亮），构造后也可以openHighlight、closeHighlight方法来手动调用
|
||||
highlight: {
|
||||
label: {
|
||||
font_size: 30
|
||||
},
|
||||
silhouette: true,
|
||||
silhouetteColor: "#ff0000",
|
||||
silhouetteSize: 4
|
||||
}
|
||||
},
|
||||
attr: { remark: "示例3" }
|
||||
})
|
||||
this.uavGraphicLayer.addGraphic(graphic)
|
||||
|
||||
this.uavGraphicLayer.flyTo();
|
||||
})
|
||||
},
|
||||
playerVideo(phone){
|
||||
if (this.player) {
|
||||
this.player.src("http://live.hopetrytech.com/live/" + phone + ".flv");
|
||||
} else {
|
||||
this.player = TCPlayer('player-container-id', {});
|
||||
this.player.src("http://live.hopetrytech.com/live/" + phone + ".flv");
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
</script>
|
||||
|
||||
|
|
@ -48,6 +135,7 @@
|
|||
width:100%;
|
||||
height:100%;
|
||||
text-align: left;
|
||||
position:relative;
|
||||
}
|
||||
.box-title{
|
||||
width: 100%;
|
||||
|
|
@ -62,14 +150,14 @@
|
|||
}
|
||||
.box-container{
|
||||
width:100%;
|
||||
height: calc( 100% - 60px);
|
||||
padding-top: 12px;
|
||||
}
|
||||
|
||||
.video-container{
|
||||
width: 235px;
|
||||
float:left;
|
||||
margin:15px;
|
||||
height: calc( 100% - 30px);
|
||||
height: 178px;
|
||||
background:rgba(0,0,0,0.4);
|
||||
}
|
||||
.none-uav{
|
||||
|
|
@ -143,4 +231,90 @@
|
|||
.none-uav .uav-item p{
|
||||
margin-bottom:0px;
|
||||
}
|
||||
|
||||
.leida{
|
||||
background-image: linear-gradient(0deg, transparent 24%, rgba(32, 255, 77, 0.15) 25%, rgba(32, 255, 77, 0.15) 26%, transparent 27%, transparent 74%, rgba(32, 255, 77, 0.15) 75%, rgba(32, 255, 77, 0.15) 76%, transparent 77%, transparent), linear-gradient(90deg, transparent 24%, rgba(32, 255, 77, 0.15) 25%, rgba(32, 255, 77, 0.15) 26%, transparent 27%, transparent 74%, rgba(32, 255, 77, 0.15) 75%, rgba(32, 255, 77, 0.15) 76%, transparent 77%, transparent);
|
||||
background-size: 3rem 3rem;
|
||||
background-position: -5.2rem -5.2rem;
|
||||
width: calc( 100% - 30px);
|
||||
height:178px;
|
||||
position: absolute;
|
||||
top:75px;
|
||||
left:15px;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
font-size: 1.6rem;
|
||||
box-sizing: border-box;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.tangjialing {
|
||||
background: -webkit-radial-gradient(center, rgba(32, 255, 77, 0.3) 0%, rgba(32, 255, 77, 0) 75%), -webkit-repeating-radial-gradient(rgba(32, 255, 77, 0) 5.8%, rgba(32, 255, 77, 0) 18%, #20ff4d 18.6%, rgba(32, 255, 77, 0) 18.9%), -webkit-linear-gradient(90deg, rgba(32, 255, 77, 0) 49.5%, #20ff4d 50%, #20ff4d 50%, rgba(32, 255, 77, 0) 50.2%), -webkit-linear-gradient(0deg, rgba(32, 255, 77, 0) 49.5%, #20ff4d 50%, #20ff4d 50%, rgba(32, 255, 77, 0) 50.2%);
|
||||
background: radial-gradient(center, rgba(32, 255, 77, 0.3) 0%, rgba(32, 255, 77, 0) 75%), repeating-radial-gradient(rgba(32, 255, 77, 0) 5.8%, rgba(32, 255, 77, 0) 18%, #20ff4d 18.6%, rgba(32, 255, 77, 0) 18.9%), linear-gradient(90deg, rgba(32, 255, 77, 0) 49.5%, #20ff4d 50%, #20ff4d 50%, rgba(32, 255, 77, 0) 50.2%), linear-gradient(0deg, rgba(32, 255, 77, 0) 49.5%, #20ff4d 50%, #20ff4d 50%, rgba(32, 255, 77, 0) 50.2%);
|
||||
width: 408px;
|
||||
height: 408px;
|
||||
max-height: 75vh;
|
||||
max-width: 75vh;
|
||||
position: relative;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
transform: translate(-50%, -70%);
|
||||
border-radius: 50%;
|
||||
/* border: 0.2rem solid #0cdd36;; */
|
||||
overflow: hidden;
|
||||
}
|
||||
.tangjialing:before {
|
||||
content: ' ';
|
||||
display: block;
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 50%;
|
||||
animation: bei 5s infinite;
|
||||
animation-timing-function: linear;
|
||||
animation-delay: 1.4s;
|
||||
}
|
||||
.tangjialing:after {
|
||||
content: ' ';
|
||||
display: block;
|
||||
background-image: linear-gradient(44deg, rgba(0, 255, 51, 0) 50%, #00bb22 100%);
|
||||
width: 50%;
|
||||
height: 50%;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
animation: zhuan 5s infinite;
|
||||
animation-timing-function: linear;
|
||||
transform-origin: bottom right;
|
||||
border-radius: 100% 0 0 0;
|
||||
}
|
||||
|
||||
@keyframes zhuan {
|
||||
0% {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
100% {
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
@keyframes bei {
|
||||
14% {
|
||||
background: radial-gradient(2vmin circle at 75% 70%, #ffffff 10%, #20ff4d 30%, rgba(255, 255, 255, 0) 100%);
|
||||
}
|
||||
14.0002% {
|
||||
background: radial-gradient(2vmin circle at 75% 70%, #ffffff 10%, #20ff4d 30%, rgba(255, 255, 255, 0) 100%), radial-gradient(2vmin circle at 63% 72%, #ffffff 10%, #20ff4d 30%, rgba(255, 255, 255, 0) 100%);
|
||||
}
|
||||
25% {
|
||||
background: radial-gradient(2vmin circle at 75% 70%, #ffffff 10%, #20ff4d 30%, rgba(255, 255, 255, 0) 100%), radial-gradient(2vmin circle at 63% 72%, #ffffff 10%, #20ff4d 30%, rgba(255, 255, 255, 0) 100%), radial-gradient(2vmin circle at 56% 86%, #ffffff 10%, #20ff4d 30%, rgba(255, 255, 255, 0) 100%);
|
||||
}
|
||||
26% {
|
||||
background: radial-gradient(2vmin circle at 75% 70%, #ffffff 10%, #20ff4d 30%, rgba(255, 255, 255, 0) 100%), radial-gradient(2vmin circle at 63% 72%, #ffffff 10%, #20ff4d 30%, rgba(255, 255, 255, 0) 100%), radial-gradient(2vmin circle at 56% 86%, #ffffff 10%, #20ff4d 30%, rgba(255, 255, 255, 0) 100%);
|
||||
opacity: 1;
|
||||
}
|
||||
100% {
|
||||
background: radial-gradient(2vmin circle at 75% 70%, #ffffff 10%, #20ff4d 30%, rgba(255, 255, 255, 0) 100%), radial-gradient(2vmin circle at 63% 72%, #ffffff 10%, #20ff4d 30%, rgba(255, 255, 255, 0) 100%), radial-gradient(2vmin circle at 56% 86%, #ffffff 10%, #20ff4d 30%, rgba(255, 255, 255, 0) 100%);
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
|
||||
</style>
|
||||
Loading…
Reference in New Issue