706 lines
27 KiB
Vue
706 lines
27 KiB
Vue
<template>
|
|
<div>
|
|
<div class="scriptRecordNew">
|
|
<div v-if="!dialogVisible" class="scriptRecordNewTitle" @click="minisize">
|
|
<span class="titleStyle">{{ $t('scriptRecord.scriptRecordTitle') }}</span>
|
|
</div>
|
|
</div>
|
|
<div>
|
|
<el-dialog
|
|
v-dialogDrag
|
|
:title="$t('scriptRecord.scriptRecordTitle')"
|
|
z-index="2008"
|
|
class="__scriptRecord"
|
|
:visible.sync="dialogVisible"
|
|
:modal="false"
|
|
append-to-body
|
|
:close-on-click-modal="false"
|
|
width="700px"
|
|
>
|
|
<div class="scriptRecordNewIn">
|
|
<el-tabs type="card">
|
|
<el-tab-pane :label="$t('scriptRecord.scriptRecordTitle')+'('+language+')'">
|
|
<div class="eachScriptPanel">
|
|
<div class="scriptPanelLeft">
|
|
<div class="panelLeftSelect">
|
|
<div>
|
|
<span style="font-size:13px;">当前剧本角色:</span>
|
|
<span style="font-size:13px;">{{ getRoleName(memberId) }}</span>
|
|
</div>
|
|
<div class="quickChange">
|
|
<div class="quickChangeList" style="margin:10px 0px 10px 0px;overflow-y:auto;height:200px;">
|
|
<div v-for="member in quickChangeMember.list" :key="member.id" class="setGroupOut">
|
|
<span style="font-size: 14px">{{ member.normalName }}</span>
|
|
<span class="setGroup">
|
|
<span v-if="member.userId" class="hasSetted">已设置</span>
|
|
<span v-else class="settingBtn" @click="changeRole(member)">设置</span>
|
|
</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<el-button-group v-if="!isReplaceBg" class="button-group">
|
|
<el-button v-if="isPause" size="small" type="primary" :disabled="executeDisabled" @click="pauseScript">{{ $t('scriptRecord.drivingPause') }}</el-button>
|
|
<el-button v-else size="small" type="primary" :disabled="executeDisabled" @click="executePlayScript">恢复</el-button>
|
|
<el-button size="small" type="danger" :disabled="!backDisabled" @click="dumpScenesData">{{ $t('scriptRecord.resetScript') }}</el-button>
|
|
<el-button v-if="backDisabled" size="small" type="primary" @click="startReplaceBg">{{ $t('scriptRecord.startReplaceBg') }}</el-button>
|
|
<el-button v-else size="small" type="primary" :disabled="backDisabled" @click="saveScenesStage">{{ $t('scriptRecord.saveBackground') }}</el-button>
|
|
<el-button size="small" type="success" :loading="isSavingScript" @click="saveScenesData">{{ $t('scriptRecord.saveData') }}</el-button>
|
|
</el-button-group>
|
|
</div>
|
|
<div class="scriptPanelRight">
|
|
<get-action-new ref="getAction" :group="group" :size="size" :member-list="memberList" @showConditionManage="showConditionManage" />
|
|
</div>
|
|
</div>
|
|
<template v-if="isReplaceBg">
|
|
<div class="mask" />
|
|
<el-button-group class="button-group">
|
|
<el-button v-if="isPause" size="small" type="primary" :disabled="executeDisabled" @click="pauseScript">{{ $t('scriptRecord.drivingPause') }}</el-button>
|
|
<el-button v-else size="small" type="primary" :disabled="executeDisabled" @click="executePlayScript">恢复</el-button>
|
|
<el-button size="small" type="primary" @click="confirmReplaceBg">{{ $t('scriptRecord.confirmReplaceBg') }}</el-button>
|
|
<el-button size="small" type="info" @click="cancelReplaceBg">{{ $t('scriptRecord.cancelReplaceBg') }}</el-button>
|
|
</el-button-group>
|
|
</template>
|
|
</el-tab-pane>
|
|
<el-tab-pane label="所有成员">
|
|
<div class="eachScriptPanel">
|
|
<all-script-role
|
|
ref="allScriptRole"
|
|
:member-id="memberId"
|
|
:tree-data="treeData"
|
|
:group="group"
|
|
@changeMode="changeMode"
|
|
@addMember="addMember"
|
|
/>
|
|
</div>
|
|
</el-tab-pane>
|
|
</el-tabs>
|
|
</div>
|
|
</el-dialog>
|
|
</div>
|
|
<add-script-member ref="addScriptMember" :station-list="stationList" @addScriptMember="addScriptMember" />
|
|
<condition-manage ref="conditionManage" @clearConditionActionId="clearConditionActionId" />
|
|
</div>
|
|
</template>
|
|
<script>
|
|
import Vue from 'vue';
|
|
import Cookies from 'js-cookie';
|
|
import {getDraftScriptByGroupNew, getAllSelectedScriptRole } from '@/api/script';
|
|
import ConstConfig from '@/scripts/ConstConfig';
|
|
import AddScriptMember from './addScriptMember';
|
|
import {covertMemberData} from '@/views/newMap/displayNew/utils';
|
|
import GetActionNew from './getAction';
|
|
import AllScriptRole from './allScriptRole';
|
|
import { getToken } from '@/utils/auth';
|
|
import { mapGetters } from 'vuex';
|
|
import ConditionManage from './conditionManage';
|
|
import {executeScriptNew, dumpScriptDataNew, saveScriptDataNew, saveScriptScenesNew, updateMapLocationNew, simulationPause, startReplaceBg, confirmReplaceBg, cancelReplaceBg} from '@/api/simulation';
|
|
export default {
|
|
name:'TipScriptRecord',
|
|
components: {
|
|
GetActionNew,
|
|
AllScriptRole,
|
|
AddScriptMember,
|
|
ConditionManage
|
|
},
|
|
props: {
|
|
group: {
|
|
type: String,
|
|
required: true
|
|
},
|
|
offset:{
|
|
type: Number,
|
|
required: true
|
|
},
|
|
isReplaceBg: {
|
|
type: Boolean,
|
|
default: false
|
|
}
|
|
},
|
|
data() {
|
|
return {
|
|
isFirst:true,
|
|
language:'',
|
|
isPause:false,
|
|
executeDisabled: false,
|
|
backDisabled: false,
|
|
autoSaveScript: null,
|
|
isSavingScript: false,
|
|
mapLocation:null,
|
|
quickChangeMember:{list:[]},
|
|
size: {
|
|
width: 300,
|
|
height: 300
|
|
},
|
|
openWindow:null,
|
|
treeData:[],
|
|
memberList:[],
|
|
driverList:[],
|
|
activeTrainList:[],
|
|
oldMember:{id:null, type:''},
|
|
dialogVisible: false
|
|
};
|
|
},
|
|
computed:{
|
|
...mapGetters('map', [
|
|
'stationList'
|
|
]),
|
|
memberId() {
|
|
return this.$store.state.scriptRecord.updateRoleId;
|
|
},
|
|
memberType() {
|
|
return this.$store.state.scriptRecord.userRole;
|
|
},
|
|
orignalUserRoleId() {
|
|
return this.$store.state.training.orignalUserRoleId;
|
|
}
|
|
},
|
|
watch:{
|
|
'$store.state.map.mapViewLoadedCount': function (val) {
|
|
Vue.prototype.$jlmap.setOptions(this.$store.state.scriptRecord.mapLocation);
|
|
this.isPause = !(this.$store.state.scriptRecord.simulationPause);
|
|
if (this.mapLocation) {
|
|
const newMapLocation = {'offsetX': this.mapLocation.x, 'offsetY': this.mapLocation.y, 'scaleRate': this.mapLocation.scale};
|
|
Vue.prototype.$jlmap.setOptions(newMapLocation);
|
|
}
|
|
},
|
|
'$store.state.scriptRecord.bgSet': function (val) {
|
|
this.backDisabled = val;
|
|
},
|
|
'$store.state.scriptRecord.simulationPause': function(val) {
|
|
this.isPause = !(this.$store.state.scriptRecord.simulationPause);
|
|
},
|
|
'memberList':function(val) {
|
|
if (this.isFirst) {
|
|
this.isFirst = false;
|
|
this.initData();
|
|
}
|
|
},
|
|
'$store.state.training.memberList': function (val) {
|
|
if (val && val.length) {
|
|
const memberData = this.$store.state.training.memberData;
|
|
this.driverList = [];
|
|
this.treeData = [];
|
|
if (this.$store.state.training.started) {
|
|
this.activeTrainList = this.$store.state.map.activeTrainList;
|
|
}
|
|
// 获取仿真成员列表
|
|
const result = covertMemberData(this.activeTrainList, Object.values(memberData));
|
|
this.driverList = result.driverList;
|
|
this.treeData = [{
|
|
label: '行调',
|
|
id: 'dispatcher',
|
|
type: 'role',
|
|
children: result.deviceListData[0]
|
|
}, {
|
|
label: '车站值班员',
|
|
id: 'stationSupervisor',
|
|
type: 'role',
|
|
children: result.deviceListData[2]
|
|
}, {
|
|
label: '司机',
|
|
id: 'driver',
|
|
type: 'role',
|
|
children: result.deviceListData[3]
|
|
}, {
|
|
label: '通号',
|
|
id: 'maintainer',
|
|
type: 'role',
|
|
children: result.deviceListData[1]
|
|
}, {
|
|
label: '车辆段信号楼',
|
|
id: 'depotDispatcher',
|
|
type: 'role',
|
|
children: result.deviceListData[4]
|
|
}, {
|
|
label: '上级部门',
|
|
id: 'parentDepartment',
|
|
type: 'role',
|
|
children: result.deviceListData[5]
|
|
}, {
|
|
label: '电力调度',
|
|
id: 'electricDispatcher',
|
|
type: 'role',
|
|
children: result.deviceListData[6]
|
|
},
|
|
{
|
|
label: '停车场信号楼',
|
|
id: 'parkingLotSignalBuilding',
|
|
type: 'role',
|
|
children: result.deviceListData[7]
|
|
}
|
|
];
|
|
this.memberList = result.lastMemberList;
|
|
}
|
|
},
|
|
// 按计划行车的列车列表更新(更新司机列表)
|
|
'$store.state.map.activeTrainListChange': function (val) {
|
|
const activeTrainList = this.$store.state.map.activeTrainList;
|
|
if (this.driverList.length > 0) {
|
|
const driverList = [];
|
|
if (activeTrainList && activeTrainList.length) {
|
|
activeTrainList.sort();
|
|
activeTrainList.forEach(groupNumber => {
|
|
const drivers = this.driverList.find(driver=>{
|
|
return driver.deviceCode == groupNumber;
|
|
});
|
|
if (drivers) {
|
|
driverList.push(drivers);
|
|
|
|
}
|
|
});
|
|
}
|
|
// this.memberData = [...this.treeData[0].children, ...this.treeData[1].children, ...this.treeData[2].children, ...this.treeData[3].children, ...this.treeData[4].children];
|
|
this.treeData[2].children = driverList;
|
|
} else {
|
|
this.activeTrainList = activeTrainList;
|
|
}
|
|
}
|
|
},
|
|
mounted() {
|
|
this.language = this.$route.query.lang == 'en' ? this.$t('scriptRecord.english') : this.$t('scriptRecord.chinese');
|
|
getDraftScriptByGroupNew(this.group).then(response=>{
|
|
this.backDisabled = response.data.bgSet;
|
|
this.mapLocation = response.data.mapLocation;
|
|
this.$store.dispatch('scriptRecord/updateBgSet', response.data.bgSet);
|
|
});
|
|
},
|
|
methods:{
|
|
initData() {
|
|
getAllSelectedScriptRole(this.group).then(res=>{
|
|
res.data.forEach(each=>{
|
|
const eachMember = this.memberList.find(member=>{ return member.id == each.id; });
|
|
if (eachMember) {
|
|
this.quickChangeMember.list.push(eachMember);
|
|
}
|
|
});
|
|
this.oldMember = {id:this.memberId, type:this.memberType};
|
|
});
|
|
},
|
|
addScriptMember(member) {
|
|
member.userId = '';
|
|
member.disabled = false;
|
|
const lastData = JSON.stringify([member]);
|
|
const covertmember = this.covert(lastData, ConstConfig.ConstSelect.roleTypeNew);
|
|
const newMember = covertmember[0];
|
|
this.memberList.push(newMember);
|
|
const deviceTypeList = ['行调', '行值', '司机', '通号', '车辆段信号楼', '上级部门', '电力调度', '停车场信号楼'];
|
|
const index = deviceTypeList.indexOf(newMember.type);
|
|
if (index >= 0) {
|
|
const treeDataIn = this.treeData[index];
|
|
treeDataIn.children.push(newMember);
|
|
this.treeData[index] = treeDataIn;
|
|
}
|
|
},
|
|
addMember() {
|
|
this.$refs.addScriptMember.doShow();
|
|
},
|
|
changeRole(member) {
|
|
this.$refs.allScriptRole.changeRole(member);
|
|
},
|
|
getRoleName(memberId) {
|
|
const currentMember = this.memberList.find(member=>{
|
|
return member.id == memberId;
|
|
});
|
|
if (currentMember) {
|
|
return currentMember.normalName;
|
|
}
|
|
return '';
|
|
},
|
|
minisize() {
|
|
this.dialogVisible = true;
|
|
},
|
|
covert(data, roleTypeList) {
|
|
let lastData = data;
|
|
roleTypeList.forEach(function(element) {
|
|
const rolename = element.value;
|
|
if (Cookies.get('user_lang') == 'en') {
|
|
lastData = lastData.replace(new RegExp(rolename, 'g'), element.enLabel);
|
|
} else {
|
|
lastData = lastData.replace(new RegExp(rolename, 'g'), element.label);
|
|
}
|
|
});
|
|
lastData = JSON.parse(lastData);
|
|
lastData.forEach(each=>{
|
|
let deviceName = '';
|
|
if (each.deviceCode) {
|
|
const device = this.$store.getters['map/getDeviceByCode'](each.deviceCode);
|
|
if (device) {
|
|
if (device._type == 'Train') {
|
|
deviceName = device.groupNumber;
|
|
} else {
|
|
deviceName = device.name;
|
|
}
|
|
} else {
|
|
deviceName = each.deviceCode;
|
|
}
|
|
}
|
|
each.deviceName = deviceName;
|
|
each.normalName = each.type + deviceName + (each.name ? '' + each.name : '');
|
|
each.label = each.normalName;
|
|
});
|
|
return lastData;
|
|
},
|
|
pauseScript() {
|
|
simulationPause(this.group).then(resp => {
|
|
this.$store.dispatch('scriptRecord/updateSimulationPause', true);
|
|
}).catch(() => {
|
|
this.$messageBox(this.$t('scriptRecord.pauseFail'));
|
|
});
|
|
},
|
|
saveScenesData() {
|
|
this.isSavingScript = true;
|
|
const data = Vue.prototype.$jlmap.$options;
|
|
const dataZoom = {scale: data.scaleRate, x: data.offsetX, y: data.offsetY};
|
|
updateMapLocationNew(this.group, dataZoom).then(response=>{
|
|
saveScriptDataNew(this.group).then(resp => {
|
|
this.$message.success(this.$t('scriptRecord.saveDataSucess'));
|
|
this.isSavingScript = false;
|
|
// this.initAutoSaveScript();
|
|
}).catch(error => {
|
|
this.$messageBox(`${this.$t('scriptRecord.saveDataFail')}: ${error.message}`);
|
|
this.isSavingScript = false;
|
|
if (error.code === 40004 || error.code === 40005 || error.code === 40003) {
|
|
// this.clearAutoSave();
|
|
} else {
|
|
// // this.initAutoSaveScript();
|
|
}
|
|
});
|
|
}).catch(error => {
|
|
this.$messageBox(`${this.$t('scriptRecord.saveDataFail')}: ${error.message}`);
|
|
this.isSavingScript = false;
|
|
if (error.code === 40004 || error.code === 40005 || error.code === 40003) {
|
|
// this.clearAutoSave();
|
|
} else {
|
|
// // this.initAutoSaveScript();
|
|
}
|
|
});
|
|
|
|
},
|
|
saveScenesStage() {
|
|
const data = Vue.prototype.$jlmap.$options;
|
|
const group = this.$route.query.group;
|
|
const dataZoom = {scale: data.scaleRate, x: data.offsetX, y: data.offsetY};
|
|
updateMapLocationNew(group, dataZoom).then(response=>{
|
|
saveScriptScenesNew(this.group).then(resp => {
|
|
this.$store.dispatch('scriptRecord/updateBgSet', true);
|
|
this.$message.success(this.$t('scriptRecord.saveBackgroundSuceess'));
|
|
}).catch(error => {
|
|
this.$messageBox(`${this.$t('scriptRecord.updateLocationFail')}: ${error.message}`);
|
|
});
|
|
}).catch((error) => {
|
|
this.$messageBox(`${this.$t('scriptRecord.saveBackgroundFail')}: ${error.message}`);
|
|
});
|
|
},
|
|
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;
|
|
}
|
|
},
|
|
executePlayScript() {
|
|
executeScriptNew(this.group).then(resp => {
|
|
this.$store.dispatch('scriptRecord/updateSimulationPause', false);
|
|
}).catch(() => {
|
|
this.$messageBox(this.$t('scriptRecord.recoverFail'));
|
|
});
|
|
},
|
|
dumpScenesData() {
|
|
// this.clearAutoSave();
|
|
const group = this.group;
|
|
this.$confirm(this.$t('scriptRecord.clearDataTip'), this.$t('global.tips'), {
|
|
confirmButtonText: this.$t('global.confirm'),
|
|
cancelButtonText: this.$t('global.cancel'),
|
|
type: 'warning'
|
|
}).then(() => {
|
|
dumpScriptDataNew(group).then(resp => {
|
|
// this.$parent.resetBeginTime();
|
|
this.$refs['getAction'].loadInitData();
|
|
this.$store.dispatch('training/updateMemberListInScript',
|
|
{
|
|
oldMemberId:this.memberId,
|
|
newMemberId:this.orignalUserRoleId,
|
|
userId:this.$store.state.user.id,
|
|
name:this.$store.state.user.nickname
|
|
}
|
|
);
|
|
const new_member = this.memberList.find(mem=>{ return mem.id == this.orignalUserRoleId; });
|
|
const old_member = this.memberList.find(mem=>{ return mem.id == this.memberId; });
|
|
if (new_member && old_member) {
|
|
new_member.userId = this.$store.state.user.id;
|
|
new_member.disabled = true;
|
|
this.quickChangeMember.list = [new_member];
|
|
this.$emit('resetChat');
|
|
}
|
|
this.$refs.conditionManage && this.$refs.conditionManage.handleClose();
|
|
this.$refs.getAction.conditionActionId = '';
|
|
this.$store.dispatch('training/setPrdType', '02');
|
|
this.$store.dispatch('map/resetActiveTrainList');
|
|
this.$store.dispatch('scriptRecord/updateRole', new_member.type + ':' + this.orignalUserRoleId);
|
|
this.$store.dispatch('scriptRecord/updateBgSet', false);
|
|
// this.memberId = this.orignalUserRoleId;
|
|
this.oldMember = {id:this.orignalUserRoleId, type:new_member.type};
|
|
this.$message.success(this.$t('scriptRecord.resetDataSuccess'));
|
|
}).catch(() => {
|
|
// console.log(error);
|
|
this.$messageBox(this.$t('scriptRecord.resetDataFail'));
|
|
});
|
|
});
|
|
},
|
|
changeMode(member) {
|
|
let prdType = '';
|
|
if (this.openWindow) {
|
|
this.openWindow.close();
|
|
}
|
|
const role = Object.assign({}, member);
|
|
if (role.type == '行值') {
|
|
prdType = '01';
|
|
role.type = 'STATION_SUPERVISOR';
|
|
this.$store.dispatch('training/setRoles', 'STATION_SUPERVISOR');
|
|
this.$store.dispatch('training/setRoleDeviceCode', role.deviceCode);
|
|
} else if (role.type == '行调') {
|
|
prdType = '02';
|
|
role.type = 'DISPATCHER';
|
|
this.$store.dispatch('training/setRoles', 'DISPATCHER');
|
|
} else if (role.type == '司机') {
|
|
prdType = '04';
|
|
role.type = 'DRIVER';
|
|
this.$store.dispatch('training/setRoles', 'DRIVER');
|
|
} else if (role.type == '通号') {
|
|
prdType = '';
|
|
role.type = 'MAINTAINER';
|
|
this.$store.dispatch('training/setRoles', 'MAINTAINER');
|
|
const routeData = this.$router.resolve({
|
|
path:'/jlmap3d/maintainer',
|
|
query:{
|
|
mapid:this.$route.query.mapId,
|
|
group:this.group,
|
|
token:getToken(),
|
|
project: this.project,
|
|
noPreLogout: true
|
|
}
|
|
});
|
|
this.openWindow = window.open(routeData.href);
|
|
} else if (role.type == '车辆段信号楼') {
|
|
prdType = '05';
|
|
role.type = 'DEPOT_DISPATCHER';
|
|
this.$store.dispatch('training/setRoles', 'DEPOT_DISPATCHER');
|
|
} else if (role.type == '上级部门') {
|
|
prdType = '';
|
|
role.type = 'PARENT_DEPARTMENT';
|
|
this.$store.dispatch('training/setRoles', 'PARENT_DEPARTMENT');
|
|
} else if (role.type == '电力调度') {
|
|
prdType = '';
|
|
role.type = 'ELECTRIC_DISPATCHER';
|
|
this.$store.dispatch('training/setRoles', 'ELECTRIC_DISPATCHER');
|
|
} else if (role.type == '停车场信号楼') {
|
|
prdType = '';
|
|
role.type = 'PARKING_LOT_SIGNAL_BUILDING';
|
|
this.$store.dispatch('training/setRoles', 'PARKING_LOT_SIGNAL_BUILDING');
|
|
} else {
|
|
prdType = '';
|
|
}
|
|
this.$store.dispatch('training/setPrdType', prdType);
|
|
this.$store.dispatch('scriptRecord/updateRole', role.type + ':' + role.id);
|
|
const newRole = role;
|
|
const oldRole = this.oldMember;
|
|
const quickChangeMember = this.quickChangeMember.list;
|
|
quickChangeMember.forEach((mem, index)=>{
|
|
if (oldRole.id && mem.id == oldRole.id) {
|
|
delete mem.userId;
|
|
}
|
|
if (newRole.id == mem.id) {
|
|
mem.userId = this.$store.state.user.id;
|
|
}
|
|
});
|
|
this.quickChangeMember = {list:quickChangeMember};
|
|
const memberdata = this.quickChangeMember.list.find(mem=>{ return mem.id == newRole.id; });
|
|
if (!memberdata) {
|
|
newRole.userId = this.$store.state.user.id;
|
|
const roleTypeEnumMap = {
|
|
'STATION_SUPERVISOR':'行值',
|
|
'DISPATCHER':'行调',
|
|
'DRIVER':'司机',
|
|
'MAINTAINER':'通号',
|
|
'DEPOT_DISPATCHER':'车辆段信号楼',
|
|
'PARENT_DEPARTMENT':'上级部门',
|
|
'ELECTRIC_DISPATCHER':'电力调度',
|
|
'PARKING_LOT_SIGNAL_BUILDING':'停车场信号楼'
|
|
};
|
|
newRole.type = roleTypeEnumMap[newRole.type];
|
|
this.quickChangeMember.list.push(newRole);
|
|
}
|
|
this.$store.dispatch('training/updateMemberListInScript',
|
|
{
|
|
oldMemberId:this.oldMember.id,
|
|
newMemberId:role.id,
|
|
userId:this.$store.state.user.id,
|
|
name:this.$store.state.user.nickname
|
|
}
|
|
);
|
|
this.oldMember = Object.assign({}, role);
|
|
this.$refs.allScriptRole.updateLoading();
|
|
},
|
|
startReplaceBg() {
|
|
startReplaceBg(this.group).then(resp => {
|
|
this.$emit('setReplace', true);
|
|
}).catch(error => {
|
|
this.$messageBox(error.message);
|
|
});
|
|
},
|
|
confirmReplaceBg() {
|
|
confirmReplaceBg(this.group).then(resp => {
|
|
this.$message.success('替换成功');
|
|
this.$emit('setReplace', false);
|
|
}).catch(error => {
|
|
this.$messageBox(error.message);
|
|
});
|
|
},
|
|
cancelReplaceBg() {
|
|
cancelReplaceBg(this.group).then(resp => {
|
|
this.$emit('setReplace', false);
|
|
}).catch(error => {
|
|
this.$messageBox(error.message);
|
|
});
|
|
},
|
|
showConditionManage(actionInfo) {
|
|
this.$refs.conditionManage.doShow(actionInfo);
|
|
},
|
|
clearConditionActionId() {
|
|
this.$refs.getAction.conditionActionId = '';
|
|
}
|
|
}
|
|
};
|
|
</script>
|
|
<style lang="scss">
|
|
.__scriptRecord {
|
|
padding: 0;
|
|
pointer-events: none !important;
|
|
}
|
|
.__scriptRecord {
|
|
.el-dialog__header {
|
|
padding: 10px 0;
|
|
pointer-events: all !important;
|
|
text-align: center;
|
|
}
|
|
.el-dialog__body {
|
|
padding: 0;
|
|
pointer-events: all !important;
|
|
}
|
|
.el-dialog__headerbtn {
|
|
top: 10px;
|
|
right: 10px;
|
|
}
|
|
}
|
|
</style>
|
|
<style lang="scss" scoped>
|
|
|
|
.button-group{
|
|
position: absolute;
|
|
left: 0;
|
|
bottom: 0;
|
|
z-index: 5;
|
|
}
|
|
.eachScriptPanel{
|
|
height: 300px;
|
|
display: inline-block;
|
|
width:100%;
|
|
}
|
|
.scriptPanelLeft{
|
|
width: 330px;
|
|
height: 100%;
|
|
vertical-align: top;
|
|
position: absolute;
|
|
left: 0;
|
|
top: 0;
|
|
z-index: 2;
|
|
}
|
|
.scriptPanelRight{
|
|
width: 680px;
|
|
position: relative;
|
|
}
|
|
.scriptRecordNew{
|
|
position: absolute;
|
|
z-index: 10;
|
|
right: 12px;
|
|
top: calc(45% + 100px);
|
|
}
|
|
.scriptRecordNewTitle{
|
|
position: absolute;
|
|
background: #fff;
|
|
border-radius: 5px 0px 0px 5px ;
|
|
padding: 5px 0px;
|
|
width: 23px;
|
|
text-align: center;
|
|
left: 50%;
|
|
transform: translateX(-50%);
|
|
cursor: pointer;
|
|
top:-28px;
|
|
}
|
|
.scriptRecordNewIn{
|
|
padding: 10px;
|
|
background: #fff;
|
|
height: 380px;
|
|
}
|
|
.scriptPanelRight{
|
|
|
|
}
|
|
.quickChange{
|
|
width: 300px;
|
|
}
|
|
.quickChange_head{
|
|
font-size: 14px;
|
|
margin-top: 5px;
|
|
color: #409eff;
|
|
}
|
|
.setGroup{
|
|
font-size: 14px;
|
|
float: right;
|
|
margin-right: 15px;
|
|
}
|
|
.settingBtn{
|
|
color: #409eff;
|
|
cursor: pointer;
|
|
padding: 2px 10px;
|
|
border-radius: 4px;
|
|
border: 1px #409eff solid;
|
|
}
|
|
.setGroupOut{
|
|
padding: 4px 6px;
|
|
}
|
|
.setGroupOut:hover{
|
|
background-color:#ccc;
|
|
}
|
|
.hasSetted{
|
|
width: 50px;
|
|
text-align: center;
|
|
display: inline-block;
|
|
}
|
|
|
|
.mask {
|
|
position: absolute;
|
|
top:0;
|
|
right:0;
|
|
bottom:0;
|
|
left:0;
|
|
opacity: 0.5;
|
|
z-index: 2;
|
|
&::before {
|
|
content: '';
|
|
position: absolute;
|
|
top:0;
|
|
right:0;
|
|
bottom:0;
|
|
left:0;
|
|
background: #aaa;
|
|
filter: blur(20px);
|
|
}
|
|
}
|
|
</style>
|
|
|