Merge branch 'dev' of https://git.code.tencent.com/lian-cbtc/jl-client into dev
This commit is contained in:
fan
commit
a29b0360d5
@ -18,8 +18,6 @@ export default class Train extends Group {
|
||||
this.z = 40;
|
||||
this.size = 0;
|
||||
this.section = null;
|
||||
this.nextPointIndex = 1;
|
||||
this.currentAdd = 0;
|
||||
this.isShowShape = true;
|
||||
this.fontSize = style.Train.common.useSelfText ? style.Train.common.nameFontSize || style.Train.common.trainTextFontSize : model.nameFontSize || style.Train.common.nameFontSize || style.Train.common.trainTextFontSize;
|
||||
this.newScale = this.fontSize / style.Train.common.trainTextFontSize;
|
||||
@ -183,19 +181,21 @@ export default class Train extends Group {
|
||||
// }
|
||||
// debugger;
|
||||
// 目标距离
|
||||
console.log('2222222222///////////////////////', this.currentAdd);
|
||||
let targetDistance = Math.sqrt(
|
||||
Math.pow(points[this.nextPointIndex - 1].x - points[this.nextPointIndex].x, 2) +
|
||||
Math.pow(points[this.nextPointIndex - 1].y - points[this.nextPointIndex].y, 2),
|
||||
);
|
||||
const right = train.right == 1 ? 0 : 1;
|
||||
let currentDistance = this.lineLength * Math.abs(right - train.offsetp) - this.currentAdd;
|
||||
console.log('33333333333/////////////////', currentDistance);
|
||||
// 利用运动距离与目标距离, 判断运动的点是否超过下一个目标点, 超过了就重置下一个点
|
||||
if (currentDistance >= targetDistance) {
|
||||
this.nextPointIndex++;
|
||||
this.currentAdd += targetDistance;
|
||||
if (this.nextPointIndex <= points.length - 1) {
|
||||
currentDistance = this.lineLength * Math.abs(right - train.offsetp) - this.currentAdd;
|
||||
console.log('///////////////////////////////////', this.currentAdd);
|
||||
console.log('44444444444///////////////', this.currentAdd);
|
||||
console.log('///////////////////////////////////', currentDistance);
|
||||
targetDistance = Math.sqrt(
|
||||
Math.pow(points[this.nextPointIndex - 1].x - points[this.nextPointIndex].x, 2) +
|
||||
@ -527,6 +527,8 @@ export default class Train extends Group {
|
||||
item.show();
|
||||
});
|
||||
this.isShowShape = true;
|
||||
this.nextPointIndex = 1;
|
||||
this.currentAdd = 0;
|
||||
this.setState(this.model, this);
|
||||
} else {
|
||||
this.eachChild(item => {
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<div>
|
||||
<div :id="ibpId" v-loading="loading" :style="{ width: this.canvasWidth +'px', height: this.canvasHeight +'px',background:'#000' }" class="ibp-canvas" />
|
||||
<div :id="ibpId" v-loading="loading" :style="{ width: canvasWidth+'px', height: canvasHeight +'px',background:'#000' }" class="ibp-canvas" />
|
||||
<el-button v-if="showBackButton" class="ibp-button" type="primary" @click="back">{{ $t('global.back') }}</el-button>
|
||||
</div>
|
||||
</template>
|
||||
@ -58,6 +58,9 @@ export default {
|
||||
]),
|
||||
ibpId() {
|
||||
return ['ibp', (Math.random().toFixed(5)) * 100000].join('_');
|
||||
},
|
||||
width() {
|
||||
return this.canvasWidth - 200;
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
@ -198,18 +201,14 @@ export default {
|
||||
this.$ibp.setClockStart(started);
|
||||
},
|
||||
reSize() {
|
||||
this.$nextTick(() => {
|
||||
this.width = this.$store.state.config.width;
|
||||
this.height = this.$store.state.config.height;
|
||||
this.$ibp && this.$ibp.resize({ width: this.width, height: this.height });
|
||||
});
|
||||
this.width = this.$store.state.config.width;
|
||||
this.height = this.$store.state.config.height;
|
||||
this.$ibp && this.$ibp.resize({ width: this.width, height: this.height });
|
||||
},
|
||||
setWindowSize() {
|
||||
this.$nextTick(() => {
|
||||
const width = this.size ? this.size.width : this.$store.state.app.width;
|
||||
const height = this.size ? this.size.height : this.$store.state.app.height;
|
||||
this.$store.dispatch('config/resize', { width: width, height: height });
|
||||
});
|
||||
const width = this.size ? this.size.width : this.$store.state.app.width;
|
||||
const height = this.size ? this.size.height : this.$store.state.app.height;
|
||||
this.$store.dispatch('config/resize', { width: width, height: height });
|
||||
},
|
||||
back() {
|
||||
this.group = this.$route.query.group;
|
||||
|
||||
@ -1,141 +1,159 @@
|
||||
<template>
|
||||
<transition name="el-zoom-in-center">
|
||||
<div class="map-control">
|
||||
<el-card type="border-card">
|
||||
<div slot="header" class="clearfix">
|
||||
<span>{{ $t('ibp.stationName') }}</span>
|
||||
<el-select v-model="stationCode" :placeholder="this.$t('rules.selectStation')" @change="changeStationCode">
|
||||
<el-option
|
||||
v-for="item in stationOptions"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
<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="this.$t('ibp.background')" name="Background">
|
||||
<div class="clearfix">
|
||||
<span style="padding-top: 5px;">{{ $t('ibp.stationName') }}</span>
|
||||
<el-select v-model="stationCode" :placeholder="this.$t('rules.selectStation')" @change="changeStationCode" style="padding-top: 5px;">
|
||||
<el-option
|
||||
v-for="item in stationOptions"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
<el-button type="text" style="float: right; padding: 15px 0; margin-right: 5px;" @click="handleSave" >{{ $t('ibp.save') }}</el-button>
|
||||
</div>
|
||||
<el-tabs v-model="enabledTab" class="ibpEdit" type="card" @tab-click="handleTabClick">
|
||||
<el-tab-pane :label="this.$t('ibp.background')" name="Background">
|
||||
<el-scrollbar wrap-class="scrollbar-wrapper" :style="{ height: height+'px' }">
|
||||
<ibp-bg
|
||||
ref="background"
|
||||
style="width:90%"
|
||||
@updateBg="createDataModel"
|
||||
/>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane :label="this.$t('ibp.line')" name="IbpLine">
|
||||
</el-scrollbar>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane :label="this.$t('ibp.line')" name="IbpLine">
|
||||
<el-scrollbar wrap-class="scrollbar-wrapper" :style="{ height: height+'px' }">
|
||||
<ibp-line
|
||||
ref="ibpline"
|
||||
style="width:90%"
|
||||
@createLine="createDataModel"
|
||||
@deleteDataModel="deleteDataModel"
|
||||
/>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane :label="this.$t('ibp.text')" name="IbpText">
|
||||
<el-scrollbar wrap-class="scrollbar-wrapper" :style="{ height: height+'px' }">
|
||||
<ibp-text
|
||||
ref="ibptext"
|
||||
style="width:90%"
|
||||
@createText="createDataModel"
|
||||
@deleteDataModel="deleteDataModel"
|
||||
/>
|
||||
</el-scrollbar>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane :label="this.$t('ibp.rect')" name="TipBox">
|
||||
<el-scrollbar wrap-class="scrollbar-wrapper" :style="{ height: height+'px' }">
|
||||
<ibp-tip-box
|
||||
ref="tipbox"
|
||||
style="width:90%"
|
||||
@createTipBox="createDataModel"
|
||||
@deleteDataModel="deleteDataModel"
|
||||
/>
|
||||
</el-scrollbar>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane :label="this.$t('ibp.button')" name="SquareButton">
|
||||
</el-scrollbar>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane :label="this.$t('ibp.text')" name="IbpText">
|
||||
<el-scrollbar wrap-class="scrollbar-wrapper" :style="{ height: height+'px' }">
|
||||
<ibp-text
|
||||
ref="ibptext"
|
||||
style="width:90%"
|
||||
@createText="createDataModel"
|
||||
@deleteDataModel="deleteDataModel"
|
||||
/>
|
||||
</el-scrollbar>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane :label="this.$t('ibp.rect')" name="TipBox">
|
||||
<el-scrollbar wrap-class="scrollbar-wrapper" :style="{ height: height+'px' }">
|
||||
<ibp-tip-box
|
||||
ref="tipbox"
|
||||
style="width:90%"
|
||||
@createTipBox="createDataModel"
|
||||
@deleteDataModel="deleteDataModel"
|
||||
/>
|
||||
</el-scrollbar>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane :label="this.$t('ibp.button')" name="SquareButton">
|
||||
<el-scrollbar wrap-class="scrollbar-wrapper" :style="{ height: height+'px' }">
|
||||
<ibp-button
|
||||
ref="squarebutton"
|
||||
style="width:90%"
|
||||
@createButton="createDataModel"
|
||||
@deleteDataModel="deleteDataModel"
|
||||
/>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane :label="this.$t('ibp.circularLamp')" name="CircularLamp">
|
||||
</el-scrollbar>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane :label="this.$t('ibp.circularLamp')" name="CircularLamp">
|
||||
<el-scrollbar wrap-class="scrollbar-wrapper" :style="{ height: height+'px' }">
|
||||
<ibp-lamp
|
||||
ref="circularlamp"
|
||||
style="width:90%"
|
||||
@createLamp="createDataModel"
|
||||
@deleteDataModel="deleteDataModel"
|
||||
/>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane :label="this.$t('ibp.arrow')" name="Arrow">
|
||||
</el-scrollbar>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane :label="this.$t('ibp.arrow')" name="Arrow">
|
||||
<el-scrollbar wrap-class="scrollbar-wrapper" :style="{ height: height+'px' }">
|
||||
<ibp-arrow
|
||||
ref="arrow"
|
||||
style="width:90%"
|
||||
@createArrow="createDataModel"
|
||||
@deleteDataModel="deleteDataModel"
|
||||
/>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane :label="this.$t('ibp.escalatorFrame')" name="AppendageBox">
|
||||
</el-scrollbar>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane :label="this.$t('ibp.escalatorFrame')" name="AppendageBox">
|
||||
<el-scrollbar wrap-class="scrollbar-wrapper" :style="{ height: height+'px' }">
|
||||
<ibp-appendage-box
|
||||
ref="appendagebox"
|
||||
style="width:90%"
|
||||
@createAppendageBox="createDataModel"
|
||||
@deleteDataModel="deleteDataModel"
|
||||
/>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane :label="this.$t('ibp.alarm')" name="Alarm">
|
||||
</el-scrollbar>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane :label="this.$t('ibp.alarm')" name="Alarm">
|
||||
<el-scrollbar wrap-class="scrollbar-wrapper" :style="{ height: height+'px' }">
|
||||
<ibp-alarm
|
||||
ref="alarm"
|
||||
style="width:90%"
|
||||
@createAlarm="createDataModel"
|
||||
@deleteDataModel="deleteDataModel"
|
||||
/>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane :label="this.$t('ibp.telephoneTerminal')" name="TeleTerminal">
|
||||
</el-scrollbar>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane :label="this.$t('ibp.telephoneTerminal')" name="TeleTerminal">
|
||||
<el-scrollbar wrap-class="scrollbar-wrapper" :style="{ height: height+'px' }">
|
||||
<ibp-telephone-terminal
|
||||
ref="teleTerminal"
|
||||
style="width:90%"
|
||||
@createTeleTerminal="createDataModel"
|
||||
@deleteDataModel="deleteDataModel"
|
||||
/>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane :label="this.$t('ibp.escalator')" name="Elevator">
|
||||
</el-scrollbar>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane :label="this.$t('ibp.escalator')" name="Elevator">
|
||||
<el-scrollbar wrap-class="scrollbar-wrapper" :style="{ height: height+'px' }">
|
||||
<ibp-elevator
|
||||
ref="elevator"
|
||||
style="width:90%"
|
||||
@createElevator="createDataModel"
|
||||
@deleteDataModel="deleteDataModel"
|
||||
/>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane :label="this.$t('ibp.key')" name="Key">
|
||||
</el-scrollbar>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane :label="this.$t('ibp.key')" name="Key">
|
||||
<el-scrollbar wrap-class="scrollbar-wrapper" :style="{ height: height+'px' }">
|
||||
<ibp-key
|
||||
ref="key"
|
||||
style="width:90%"
|
||||
@createKey="createDataModel"
|
||||
@deleteDataModel="deleteDataModel"
|
||||
/>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane :label="this.$t('ibp.digitalClock')" name="Clock">
|
||||
</el-scrollbar>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane :label="this.$t('ibp.digitalClock')" name="Clock">
|
||||
<el-scrollbar wrap-class="scrollbar-wrapper" :style="{ height: height+'px' }">
|
||||
<ibp-clock
|
||||
ref="clock"
|
||||
style="width:90%"
|
||||
@createClock="createDataModel"
|
||||
@deleteDataModel="deleteDataModel"
|
||||
/>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane :label="this.$t('ibp.rotateTip')" name="RotateTip">
|
||||
</el-scrollbar>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane :label="this.$t('ibp.rotateTip')" name="RotateTip">
|
||||
<el-scrollbar wrap-class="scrollbar-wrapper" :style="{ height: height+'px' }">
|
||||
<ibp-rotate-tip
|
||||
ref="rotateTip"
|
||||
style="width:90%"
|
||||
@createRotateTip="createDataModel"
|
||||
@deleteDataModel="deleteDataModel"
|
||||
/>
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
</el-card>
|
||||
</el-scrollbar>
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
</div>
|
||||
</transition>
|
||||
</template>
|
||||
@ -254,5 +272,58 @@ export default {
|
||||
.map-control {
|
||||
float: right;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
.clearfix{
|
||||
height: 50px;
|
||||
padding: 0 22px;
|
||||
}
|
||||
.ibpEdit{
|
||||
height: calc(100% - 50px);
|
||||
}
|
||||
|
||||
/deep/ {
|
||||
.ibpEdit .el-tabs__nav-wrap.is-scrollable {
|
||||
padding: 0 20px;
|
||||
}
|
||||
.ibpEdit .el-tabs__header{
|
||||
margin: 0;
|
||||
}
|
||||
.ibpEdit .el-tabs__header .el-tabs__item.is-active {
|
||||
border-bottom-color: #f5f7fa;
|
||||
background: #f5f7fa;
|
||||
}
|
||||
.ibpEdit .el-tabs__active-bar{
|
||||
background: transparent;
|
||||
}
|
||||
.ibpEdit .el-tabs__content {
|
||||
height: calc(100% - 56px);
|
||||
padding-top: 15px;
|
||||
// overflow-y: scroll;
|
||||
}
|
||||
|
||||
.card .el-tabs__nav .el-tabs__item.is-active {
|
||||
border-bottom: 2px solid #E4E7ED;
|
||||
background: #409eff;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.ibpEdit .el-tabs__nav-prev {
|
||||
width: 20px;
|
||||
height: 41px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
box-shadow: 1px 1px 4px #ccc;
|
||||
}
|
||||
|
||||
.ibpEdit .el-tabs__nav-next {
|
||||
width: 20px;
|
||||
height: 41px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
box-shadow: 1px 1px 4px #ccc;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -13,6 +13,7 @@
|
||||
<script>
|
||||
import IbpPlate from '@/views/ibpsystem/index';
|
||||
import IbpOperate from './ibpOperate/index';
|
||||
import localStore from 'storejs';
|
||||
|
||||
export default {
|
||||
name: 'IbpView',
|
||||
@ -22,19 +23,20 @@ export default {
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
widthLeft: Number(localStore.get('LeftWidth')) || 450,
|
||||
size: {
|
||||
width: this.$store.state.app.width - 521,
|
||||
width: this.$store.state.app.width - 521 - Number(localStore.get('LeftWidth')) || 450,
|
||||
height: this.$store.state.app.height - 60
|
||||
}
|
||||
};
|
||||
},
|
||||
watch: {
|
||||
'$store.state.app.windowSizeCount': function() {
|
||||
this.$store.dispatch('config/resize', { width: this.$store.state.app.width - 521, height: this.$store.state.app.height - 60 });
|
||||
this.$store.dispatch('config/resize', { width: this.$store.state.app.width - 521 - this.widthLeft, height: this.$store.state.app.height - 60 });
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.$store.dispatch('config/resize', { width: this.$store.state.app.width - 521, height: this.$store.state.app.height - 60 });
|
||||
this.$store.dispatch('config/resize', { width: this.$store.state.app.width - 521 - this.widthLeft, height: this.$store.state.app.height - 60 });
|
||||
},
|
||||
mounted() {
|
||||
this.$refs.ibpPlate.show();
|
||||
@ -73,6 +75,7 @@ export default {
|
||||
.map-draft {
|
||||
float: right;
|
||||
width: 520px;
|
||||
height: 100%;
|
||||
|
||||
// /deep/ .el-scrollbar__view {
|
||||
// width: 510px !important;
|
||||
|
||||
Loading…
Reference in New Issue
Block a user