275 lines
9.5 KiB
Vue
275 lines
9.5 KiB
Vue
<template>
|
|
<div class="reminder-drag">
|
|
<div class="reminder-box" ref="drapBox">
|
|
<div class="tip-title">
|
|
<i class="icon el-icon-minus" @click="shrink" v-show="isShrink"></i>
|
|
<i class="icon el-icon-plus" @click="shrink" v-show="!isShrink"></i>
|
|
<p style="color: #fff;" v-if="isShrink">
|
|
<span>{{ title }}</span>
|
|
</p>
|
|
</div>
|
|
<div class="tip-body-box" ref="dragBody">
|
|
<div class="tip-body">
|
|
<div>
|
|
<get-action ref="getAction" :group="group"></get-action>
|
|
</div>
|
|
<!-- <el-button-group class="button-group1"> -->
|
|
|
|
<!-- </el-button-group> -->
|
|
<el-button-group class="button-group">
|
|
<el-button type="primary" @click="pauseScript" v-if="isPause" :disabled="executeDisabled">暂停</el-button>
|
|
<el-button type="primary" @click="executePlayScript" v-else :disabled="executeDisabled">恢复并执行</el-button>
|
|
<el-button type="primary" @click="saveMaplocation">{{$t('scriptRecord.saveMaplocation')}}</el-button>
|
|
<el-button type="danger" @click="dumpScenesData">重置剧本</el-button>
|
|
<el-button type="primary" @click="saveScenesStage">{{$t('scriptRecord.saveBackground')}}</el-button>
|
|
<el-button type="success" @click="saveScenesData" :loading="isSavingScript" >{{$t('scriptRecord.saveData')}}</el-button>
|
|
<!-- 暂停 -->
|
|
</el-button-group>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
<script>
|
|
import Vue from 'vue';
|
|
import GetAction from './scriptRecord/getAction';
|
|
import { launchFullscreen, exitFullscreen } from '@/utils/screen';
|
|
import {saveScriptScenes, saveScriptData, dumpScriptData,updateMapLocation,scriptPause,executeScript} from '@/api/simulation';
|
|
|
|
export default {
|
|
name: 'TipScriptRecord',
|
|
props: {
|
|
group: {
|
|
type: String,
|
|
required: true
|
|
},
|
|
},
|
|
components: {
|
|
GetAction,
|
|
},
|
|
// this.$t('scriptRecord.scriptTitle')
|
|
data() {
|
|
return {
|
|
title:"剧本编制",
|
|
isShrink: false,
|
|
mapLocation:{},
|
|
autoSaveScript: null,
|
|
isSavingScript:false,
|
|
isPause:false,
|
|
executeDisabled:false,
|
|
// isSaveStage: true,
|
|
}
|
|
},
|
|
created() {
|
|
},
|
|
mounted(){
|
|
this.initAutoSaveScript();
|
|
this.shrink();
|
|
},
|
|
beforeDestroy() {
|
|
this.clearAutoSave();
|
|
},
|
|
methods: {
|
|
jump(obj) {
|
|
},
|
|
shrink() {
|
|
let height = this.$refs.dragBody.offsetHeight + 40;
|
|
let top = this.$refs.drapBox.style.top;
|
|
if (this.isShrink) {
|
|
this.$refs.drapBox.style.height = '40px';
|
|
this.$refs.drapBox.style.top = '';
|
|
this.isShrink = false;
|
|
} else {
|
|
this.$refs.drapBox.style.height = height + 'px';
|
|
this.$refs.drapBox.style.top = top;
|
|
this.isShrink = true;
|
|
}
|
|
},
|
|
setIsParse(isPause){
|
|
this.isPause=isPause;
|
|
},
|
|
setDisabled(data)
|
|
{
|
|
this.executeDisabled=!data;
|
|
},
|
|
initAutoSaveScript() {
|
|
const timeout = 1000 * 20;
|
|
this.clearAutoSave(this.autoSaveScript);
|
|
this.autoSaveScript = setInterval(this.saveScenesData,timeout);
|
|
},
|
|
clearAutoSave() {
|
|
if (this.autoSaveScript) {
|
|
clearInterval(this.autoSaveScript);
|
|
this.autoSaveScript = null;
|
|
}
|
|
},
|
|
pauseScript(){
|
|
scriptPause(this.group).then(resp => {
|
|
// this.isSaveStage = false;
|
|
this.$store.dispatch('scriptRecord/updateSimulationPause',true);
|
|
// this.$message.success('暂停成功');
|
|
}).catch(error => {
|
|
this.$messageBox('暂停失败!');
|
|
});
|
|
},
|
|
executePlayScript(){
|
|
executeScript(this.group).then(resp => {
|
|
// this.isSaveStage = false;
|
|
this.$store.dispatch('scriptRecord/updateSimulationPause',false);
|
|
// this.$message.success('暂停成功');
|
|
}).catch(error => {
|
|
this.$messageBox('恢复失败!');
|
|
});
|
|
},
|
|
saveScenesStage() {
|
|
saveScriptScenes(this.group).then(resp => {
|
|
// this.isSaveStage = false;
|
|
this.$message.success('保存背景成功');
|
|
}).catch(error => {
|
|
this.$messageBox('保存背景失败!');
|
|
})
|
|
},
|
|
saveScenesData() {
|
|
this.isSavingScript=true;
|
|
saveScriptData(this.group).then(resp => {
|
|
this.$message.success('保存数据成功');
|
|
this.isSavingScript=false;
|
|
this.initAutoSaveScript();
|
|
}).catch(error => {
|
|
this.$messageBox(`保存数据失败!: ${error.message}`);
|
|
this.isSavingScript=false;
|
|
if (error.code === 40004 || error.code === 40005 || error.code === 40003) {
|
|
this.clearAutoSave();
|
|
} else {
|
|
this.initAutoSaveScript();
|
|
}
|
|
})
|
|
},
|
|
dumpScenesData() {
|
|
this.clearAutoSave();
|
|
let group=this.group;
|
|
this.$confirm('此操作将会清除已保存的编制数据, 是否继续?', '提示', {
|
|
confirmButtonText: '确定',
|
|
cancelButtonText: '取消',
|
|
type: 'warning'
|
|
}).then(() => {
|
|
dumpScriptData(group).then(resp => {
|
|
// this.isSaveStage = true;
|
|
this.$parent.resetBeginTime();
|
|
this.$refs["getAction"].loadInitData();
|
|
this.initAutoSaveScript();
|
|
this.$message.success('清除数据成功');
|
|
}).catch(error => {
|
|
this.$messageBox('清除数据失败!');
|
|
})
|
|
}).catch(error => {
|
|
this.initAutoSaveScript();
|
|
})
|
|
},
|
|
saveMaplocation()
|
|
{
|
|
let data=Vue.prototype.$jlmap.$options;
|
|
let group=this.$route.query.group;
|
|
let dataZoom={scale:data.scaleRate,x:data.offsetX,y:data.offsetY};
|
|
updateMapLocation(group,dataZoom).then(response=>{
|
|
this.$message.success('更新定位成功');
|
|
}).catch(error => {
|
|
this.$messageBox(`更新定位失败: ${error.message}`);
|
|
});
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
<style rel="stylesheet/scss" lang="scss" scoped>
|
|
@import "src/styles/mixin.scss";
|
|
|
|
.tip-body-box {
|
|
position: relative;
|
|
// height: 540px;
|
|
}
|
|
.tab-pane-big{
|
|
height:420px;
|
|
}
|
|
.breadColor{
|
|
color:#fff;
|
|
}
|
|
|
|
.reminder-box {
|
|
position: absolute;
|
|
float: left;
|
|
left: 15px;
|
|
bottom: 15px;
|
|
width: 995px;
|
|
height: 540px;
|
|
background-color: #fff;
|
|
border-radius: 5px;
|
|
overflow: hidden;
|
|
z-index: 10;
|
|
font-size: 18px;
|
|
|
|
.tip-title {
|
|
width: 100%;
|
|
overflow: hidden;
|
|
height: 40px;
|
|
display: flex;
|
|
align-items: center;
|
|
flex-direction: row-reverse;
|
|
background-color: #409EFF;
|
|
border-radius: 5px 5px 0 0;
|
|
justify-content: space-between;
|
|
padding: 0 10px;
|
|
}
|
|
|
|
.tip-body {
|
|
height: 500px;
|
|
padding: 10px;
|
|
|
|
.list-label {
|
|
width: 105px;
|
|
}
|
|
.button-group{
|
|
margin-top:15px;
|
|
margin-left: 20px;
|
|
float:right;
|
|
}
|
|
.button-group1{
|
|
margin-top:15px;
|
|
margin-left: 20px;
|
|
float:left;
|
|
}
|
|
.actionInfo{
|
|
margin-top:30px;
|
|
}
|
|
.conditionVO{
|
|
width:400px;
|
|
}
|
|
.actionList{
|
|
margin-top: 10px;
|
|
margin-left: 5px;
|
|
font-size: 15px;
|
|
margin-bottom:10px;
|
|
}
|
|
.titleStyle{
|
|
margin-left:10px;
|
|
}
|
|
}
|
|
|
|
.icon {
|
|
float: right;
|
|
margin-right: 10px;
|
|
cursor: pointer;
|
|
background-color: #f3f3f3;
|
|
border-radius: 50%;
|
|
}
|
|
|
|
/deep/ {
|
|
.el-tree-node__content {
|
|
margin-bottom: 4px;
|
|
}
|
|
|
|
.el-tree--highlight-current .el-tree-node.is-current>.el-tree-node__content {
|
|
background-color: #d6e5f7;
|
|
}
|
|
}
|
|
}
|
|
</style> |