136 lines
4.2 KiB
Vue
136 lines
4.2 KiB
Vue
<template>
|
|
<transition name="el-zoom-in-center">
|
|
<div class="map-control heightClass ">
|
|
<el-card type="border-card" class="heightClass">
|
|
<div slot="header" class="clearfix">
|
|
<el-button
|
|
type="text"
|
|
style="float: right; padding: 3px 0; margin-right: 5px;"
|
|
@click="handleSave"
|
|
>{{ $t('ibp.save') }}</el-button>
|
|
</div>
|
|
<el-tabs v-model="enabledTab" class="mapEdit" type="card" @tab-click="handleTabClick">
|
|
<el-tab-pane label="闸机" name="BrakeMachine">
|
|
<brake-machine
|
|
ref="brakeMachine"
|
|
style="width: 90%;"
|
|
@createDataModel="createDataModel"
|
|
@deleteDataModel="deleteDataModel"
|
|
/>
|
|
</el-tab-pane>
|
|
<el-tab-pane label="自动售货机" name="TicketMachine">
|
|
<ticket-machine
|
|
ref="ticketMachine"
|
|
style="width: 90%"
|
|
@createDataModel="createDataModel"
|
|
@deleteDataModel="deleteDataModel"
|
|
/>
|
|
</el-tab-pane>
|
|
<el-tab-pane label="半自动售货机" name="SemiAutomaticTicketMachine">
|
|
<semi-automatic-ticket-machine
|
|
ref="semiAutomaticTicketMachine"
|
|
style="width: 90%"
|
|
@createDataModel="createDataModel"
|
|
@deleteDataModel="deleteDataModel"
|
|
/>
|
|
</el-tab-pane>
|
|
<el-tab-pane label="文字" name="IscsText">
|
|
<iscs-text
|
|
ref="iscsText"
|
|
style="width: 90%;"
|
|
@createDataModel="createDataModel"
|
|
@deleteDataModel="deleteDataModel">
|
|
</iscs-text>
|
|
</el-tab-pane>
|
|
<el-tab-pane label="线段" name="IscsLine">
|
|
<iscs-line
|
|
ref="iscsLine"
|
|
style="width: 90%;"
|
|
@createDataModel="createDataModel"
|
|
@deleteDataModel="deleteDataModel">
|
|
</iscs-line>
|
|
</el-tab-pane>
|
|
<el-tab-pane label="矩形" name="IscsRect">
|
|
<iscs-rect
|
|
ref="iscsRect"
|
|
style="width: 90%;"
|
|
@createDataModel="createDataModel"
|
|
@deleteDataModel="deleteDataModel">
|
|
</iscs-rect>
|
|
</el-tab-pane>
|
|
</el-tabs>
|
|
</el-card>
|
|
</div>
|
|
</transition>
|
|
</template>
|
|
<script>
|
|
import {deviceFactory} from '@/iscs/utils/parser';
|
|
import BrakeMachine from './brakeMachine';
|
|
import TicketMachine from './ticketMachine';
|
|
import SemiAutomaticTicketMachine from './semiAutomaticTicketMachine';
|
|
import IscsLine from '../iscsCommonElem/line';
|
|
import IscsText from '../iscsCommonElem/text';
|
|
import IscsRect from '../iscsCommonElem/rect';
|
|
|
|
export default {
|
|
name: 'IscsOperate',
|
|
components: {
|
|
BrakeMachine,
|
|
TicketMachine,
|
|
SemiAutomaticTicketMachine,
|
|
IscsLine,
|
|
IscsRect,
|
|
IscsText
|
|
},
|
|
mixins: [
|
|
],
|
|
data() {
|
|
return {
|
|
enabledTab: 'brakeMachine',
|
|
data: '',
|
|
stationCode: ''
|
|
};
|
|
},
|
|
computed: {
|
|
height() {
|
|
return this.$store.state.config.height;
|
|
}
|
|
},
|
|
watch: {
|
|
'$store.state.iscs.rightClickCount': function (val) {
|
|
const model = this.$store.getters['iscs/updateDeviceData'];
|
|
this.enabledTab = model._type;
|
|
}
|
|
},
|
|
mounted() {
|
|
},
|
|
beforeDestroy() {
|
|
|
|
},
|
|
methods: {
|
|
createDataModel(model) {
|
|
const newModel = deviceFactory(model._type, model);
|
|
this.$store.dispatch('iscs/updateIscsDevices', newModel.model);
|
|
},
|
|
deleteDataModel(model) {
|
|
this.$store.dispatch('iscs/deleteIscsDevices', model);
|
|
},
|
|
handleSave() {
|
|
const data = JSON.stringify(this.$store.state.iscs.iscs);
|
|
console.log(data);
|
|
},
|
|
handleTabClick() {
|
|
|
|
}
|
|
}
|
|
};
|
|
</script>
|
|
<style rel="stylesheet/scss" lang="scss" scoped>
|
|
@import "src/styles/mixin.scss";
|
|
.map-control {
|
|
float: right;
|
|
width: 100%;
|
|
}
|
|
.heightClass{height:100%;}
|
|
</style>
|