徐景良 2024-12-09 15:50:54 +08:00
commit e76c13652a
7 changed files with 163 additions and 6 deletions

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

View File

@ -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;

View File

@ -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>

View File

@ -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{

View File

@ -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){