Merge branch 'feixian' of http://123.132.248.154:10000/xujingliang/Fei_Xian_Lin_Ye_Fang_Huo into feixian
commit
e76c13652a
Binary file not shown.
|
After Width: | Height: | Size: 2.9 KiB |
Binary file not shown.
Binary file not shown.
|
After Width: | Height: | Size: 2.5 KiB |
|
|
@ -15,7 +15,7 @@
|
|||
}
|
||||
@font-face {
|
||||
font-family: 'DINPro';
|
||||
src: url('/bigScreen/fonts/fonts/DINPro-Medium.ttf') format('truetype');
|
||||
src: url('/bigScreen/fonts/DINPro-Medium.ttf') format('truetype');
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
}
|
||||
|
|
@ -25,6 +25,12 @@
|
|||
font-weight: normal;
|
||||
font-style: normal;
|
||||
}
|
||||
@font-face {
|
||||
font-family: 'AlibabaPuHuiTiR';
|
||||
src: url('/bigScreen/fonts/AlibabaPuHuiTiRegular.ttf') format('truetype');
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
}
|
||||
.iconfont {
|
||||
font-family: "iconfont" !important;
|
||||
font-size: 16px;
|
||||
|
|
|
|||
|
|
@ -10,7 +10,7 @@
|
|||
</div>
|
||||
<div class="close-button" @click="closeModal"></div>
|
||||
<div class="info-title">火情预警信息</div>
|
||||
<div class="show-image">
|
||||
<div class="show-image" @mousedown="(event) => event.stopPropagation()">
|
||||
<div class="prev-button" @click="prevImage"></div>
|
||||
<div class="image-div">
|
||||
<el-carousel ref="carousel" indicator-position="outside" height="170px" arrow="never" :autoplay="false">
|
||||
|
|
@ -35,6 +35,16 @@
|
|||
<div class="address-span">预警位置:</div>
|
||||
<div class="address-value">{{ info.detailed_address }}</div>
|
||||
</div>
|
||||
<div class="operation-button-div">
|
||||
<div class="close-forewarning-button">
|
||||
<span class="button-span">关闭</span>
|
||||
<span class="button-span-shadow">关闭</span>
|
||||
</div>
|
||||
<div class="save-button" @click="save">
|
||||
<span class="button-span">下发</span>
|
||||
<span class="button-span-shadow">下发</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
|
|
@ -116,6 +126,9 @@ export default {
|
|||
this.isDragging = false;
|
||||
window.removeEventListener('mousemove', this.onMouseMove);
|
||||
window.removeEventListener('mouseup', this.onMouseUp);
|
||||
},
|
||||
save(){
|
||||
this.$emit('openTaskDelivery',this.info.allValue)
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
|
|
@ -300,5 +313,80 @@ export default {
|
|||
line-height: 17px;
|
||||
}
|
||||
}
|
||||
.operation-button-div{
|
||||
display: flex;
|
||||
position: absolute;
|
||||
bottom: -35px;
|
||||
right: 20px;
|
||||
.close-forewarning-button{
|
||||
position: relative;
|
||||
width: 106px;
|
||||
height: 44px;
|
||||
background-image: url('/bigScreen/close_forewarning_button.png');
|
||||
background-size: 100% 100%;
|
||||
margin-right: 10px;
|
||||
cursor: pointer;
|
||||
.button-span{
|
||||
font-family: AlibabaPuHuiTiR;
|
||||
font-weight: 400;
|
||||
font-size: 17px;
|
||||
line-height: 16px;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
color: #FFFFFF;
|
||||
background: linear-gradient( #EDFFEF,#13D1D8);
|
||||
-webkit-background-clip: text;
|
||||
-webkit-text-fill-color: transparent;
|
||||
}
|
||||
.button-span-shadow{
|
||||
font-family: AlibabaPuHuiTiR;
|
||||
font-weight: 400;
|
||||
font-size: 17px;
|
||||
line-height: 16px;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
color: rgba(0,0,0,0);
|
||||
text-shadow: 0px 1px 16px rgba(19,213,219,0.5);
|
||||
}
|
||||
}
|
||||
.save-button{
|
||||
width: 106px;
|
||||
height: 44px;
|
||||
background-image: url('/bigScreen/save_forewarning_button.png');
|
||||
background-size: 100% 100%;
|
||||
position: relative;
|
||||
cursor: pointer;
|
||||
.button-span{
|
||||
font-family: AlibabaPuHuiTiR;
|
||||
font-weight: 400;
|
||||
font-size: 17px;
|
||||
line-height: 16px;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
color: #FFFFFF;
|
||||
background: linear-gradient( #EDFFEF,#79EA86);
|
||||
-webkit-background-clip: text;
|
||||
-webkit-text-fill-color: transparent;
|
||||
}
|
||||
.button-span-shadow{
|
||||
font-family: AlibabaPuHuiTiR;
|
||||
font-weight: 400;
|
||||
font-size: 17px;
|
||||
line-height: 16px;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
color: rgba(0,0,0,0);
|
||||
text-shadow: 0px 1px 16px rgba(5,154,76,0.5);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -26,9 +26,20 @@
|
|||
<ResponseResource />
|
||||
</div>
|
||||
|
||||
<InfoModal v-if="showForewarningModal" :info="forewarningInfo" @closeForewarningModal="closeForewarningModal"/>
|
||||
<InfoModal
|
||||
v-if="showForewarningModal"
|
||||
:info="forewarningInfo"
|
||||
@closeForewarningModal="closeForewarningModal"
|
||||
@openTaskDelivery="openTaskDelivery"/>
|
||||
|
||||
<SearchComponent :hiddenDiv="leftHidden" @cameraFly="cameraFly"/>
|
||||
<div
|
||||
class="task"
|
||||
v-if="taskDeliveryShow"
|
||||
@mousedown="onMouseDown"
|
||||
:style="{ right: `${position.x}px`, top: `${position.y}px` }">
|
||||
<taskDelivery @closeTask="closeTask" :lng="tasklng" :lat="tasklat" :description="description"></taskDelivery>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
|
@ -43,12 +54,13 @@ import InfoModal from './InfoModal/index.vue'
|
|||
import SearchComponent from './SearchComponent/index.vue'
|
||||
import Map from "@/components/mars3d/ResourceMap.vue";
|
||||
import Onlineuserbox from "./OnLineUser/index.vue";
|
||||
import taskDelivery from "@/views/home/widget/taskDelivery.vue";
|
||||
|
||||
|
||||
const areaName = localStorage.getItem("areaName");
|
||||
export default {
|
||||
name: "bigScreen",
|
||||
components: { Forewarning, Person, Monitor, ResponseResource, Header, InfoModal, SearchComponent, Map,Onlineuserbox},
|
||||
components: { Forewarning, Person, Monitor, ResponseResource, Header, InfoModal, SearchComponent, Map,Onlineuserbox, taskDelivery},
|
||||
data() {
|
||||
return {
|
||||
configUrl: `config/yingjiConfig.json`,
|
||||
|
|
@ -64,9 +76,17 @@ export default {
|
|||
picture:'',
|
||||
detailed_address: '',
|
||||
start_time: '',
|
||||
allValue: '',
|
||||
},
|
||||
leftHidden: false,
|
||||
rightHidden: false,
|
||||
taskDeliveryShow: false,
|
||||
tasklng: '',
|
||||
tasklat: '',
|
||||
description: '',
|
||||
position: { x: 450, y: 300 },
|
||||
isDragging: false,
|
||||
offset: { x: 0, y: 0 },
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
|
|
@ -95,6 +115,7 @@ export default {
|
|||
this.forewarningInfo.video = item.images_path.replaceAll(IPAddress,'221.2.83.254:7011')
|
||||
this.forewarningInfo.detailed_address = item.detailed_address
|
||||
this.forewarningInfo.start_time = item.start_time
|
||||
this.forewarningInfo.allValue = item
|
||||
this.showForewarningModal = true
|
||||
this.cameraFly(item.longitude,item.latitude)
|
||||
},
|
||||
|
|
@ -140,6 +161,39 @@ export default {
|
|||
console.log(url);
|
||||
return url;
|
||||
},
|
||||
closeTask() {
|
||||
this.taskDeliveryShow = false;
|
||||
this.position.x = 450
|
||||
this.position.y = 300
|
||||
this.tasklng = ''
|
||||
this.tasklat = ''
|
||||
this.description = ''
|
||||
},
|
||||
openTaskDelivery(item){
|
||||
this.tasklng = item.longitude
|
||||
this.tasklat = item.latitude
|
||||
this.description = item.detailed_address
|
||||
this.taskDeliveryShow = true
|
||||
},
|
||||
onMouseDown(event) {
|
||||
this.isDragging = true;
|
||||
this.offset.x = -event.clientX - this.position.x;
|
||||
this.offset.y = event.clientY - this.position.y;
|
||||
|
||||
window.addEventListener('mousemove', this.onMouseMove);
|
||||
window.addEventListener('mouseup', this.onMouseUp);
|
||||
},
|
||||
onMouseMove(event) {
|
||||
if (this.isDragging) {
|
||||
this.position.x = -event.clientX - this.offset.x;
|
||||
this.position.y = event.clientY - this.offset.y;
|
||||
}
|
||||
},
|
||||
onMouseUp() {
|
||||
this.isDragging = false;
|
||||
window.removeEventListener('mousemove', this.onMouseMove);
|
||||
window.removeEventListener('mouseup', this.onMouseUp);
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
|
||||
|
|
@ -323,6 +377,12 @@ export default {
|
|||
right: -429px;
|
||||
opacity: 1;
|
||||
}
|
||||
.task {
|
||||
width: 540px;
|
||||
height:480px;
|
||||
position: absolute;
|
||||
z-index:100;
|
||||
}
|
||||
}
|
||||
|
||||
::v-deep .cesium-viewer-toolbar{
|
||||
|
|
|
|||
|
|
@ -80,7 +80,7 @@ import { getMethodCommon } from '../../../api/common';
|
|||
let BASE_URL = process.env.VUE_APP_BASE_API;
|
||||
export default {
|
||||
name: 'taskDelivery',
|
||||
props: ['globalmap', 'lng', 'lat'],
|
||||
props: ['globalmap', 'lng', 'lat', 'description'],
|
||||
data() {
|
||||
return {
|
||||
location: '',
|
||||
|
|
@ -107,7 +107,10 @@ export default {
|
|||
mounted() {
|
||||
if (this.lat) {
|
||||
this.location = this.lng + "," + this.lat;
|
||||
}
|
||||
}
|
||||
if(this.description){
|
||||
this.content = this.description
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
selectChange(e){
|
||||
|
|
|
|||
Loading…
Reference in New Issue