调整地图样式及加载逻辑

This commit is contained in:
zyy 2020-07-31 18:49:35 +08:00
parent e2c32f2e68
commit fb9e8f0325
13 changed files with 252 additions and 156 deletions

View File

@ -313,7 +313,7 @@ const training = {
reset: ({ commit }) => {
commit('over');
commit('resetOrder');
commit('stopCountTime');
// commit('stopCountTime');
// 清空计时器以及得分
commit('resetUsedTime');
@ -330,7 +330,7 @@ const training = {
OperateHandler.cleanOperates();
Handler.clear(); // 两种方式
// 清空计时器以及得分
commit('stopCountTime');
// commit('stopCountTime');
commit('resetUsedTime');
commit('resetScore');
commit('start');
@ -342,7 +342,7 @@ const training = {
over: ({ commit }) => {
commit('over');
commit('resetOrder');
commit('stopCountTime');
// commit('stopCountTime');
},
/**
@ -358,7 +358,7 @@ const training = {
* 停止计时
*/
setStopCountTime: ({ commit }) => {
commit('stopCountTime');
// commit('stopCountTime');
},
/**
@ -392,16 +392,20 @@ const training = {
commit('changeMode', opts.mode);
if (opts.start) {
// 清空计时器以及得分
commit('stopCountTime');
// commit('stopCountTime');
commit('resetUsedTime');
commit('resetScore');
// 开始实训
commit('start');
commit('next');
// 开始计时
commit('countUsedTime');
// // 开始计时
// commit('countUsedTime');
}
},
countUsedTime({ commit }) {
// 开始计时
commit('countUsedTime');
},
/**
* 开始实训模式变更和开始的混合操作
@ -603,7 +607,7 @@ const training = {
end: ({ commit }, mode) => {
commit('over');
commit('resetOrder');
commit('stopCountTime');
// commit('stopCountTime');
commit('changeMode', mode);
},

View File

@ -2,9 +2,9 @@ export function getBaseUrl() {
let BASE_API;
if (process.env.NODE_ENV === 'development') {
// BASE_API = 'https://joylink.club/jlcloud';
// BASE_API = 'https://test.joylink.club/jlcloud';
BASE_API = 'https://test.joylink.club/jlcloud';
// BASE_API = 'http://192.168.3.5:9000'; // 袁琪
BASE_API = 'http://192.168.3.6:9000'; // 旭强
// BASE_API = 'http://192.168.3.6:9000'; // 旭强
// BASE_API = 'http://192.168.3.41:9000'; // 张赛
// BASE_API = 'http://192.168.3.82:9000'; // 杜康
// BASE_API = 'http://b29z135112.zicp.vip';

View File

@ -1,63 +1,65 @@
<template>
<div class="chatBox" :class="{'active': drawer}" :style="{'bottom':offsetBottom+'px'}">
<div class="menuTrainListBtn" @click="clickBtn">
<i class="el-icon-more" />
<div class="menuTrainListBtn" @click="clickBtn">
<!-- <i class="el-icon-more" /> -->
<p style="margin: 0;"></p>
<p style="margin: 0;"></p>
</div>
<div class="chat-box-main">
<div class="chat-box-header">
<div class="chat-box-header-title">
<el-input v-if="isShow" v-model="queryMember" size="small" placeholder="请输入搜索人员">
<el-button slot="append" icon="el-icon-search" />
</el-input>
</div>
<div class="chat-setting" @click="handleSetting()">
<i class="el-icon-s-tools" />
</div>
</div>
<div v-if="isShow" class="chat-box-content">
<el-tree
ref="tree"
:data="treeData"
:props="defaultProps"
node-key="id"
default-expand-all
:filter-node-method="filterNode"
show-checkbox
style="margin: 10px;overflow-y: auto;height: 100%;margin-right: 0;"
@check-change="handleCheckChange"
>
<span :id="data.id" slot-scope="{ node, data }">
<span style="font-size: 14px">{{ data.label }}</span>
</span>
</el-tree>
</div>
<div v-else class="chat-box-content">
<div class="chatcontent">
<chat-content ref="chatContent" :chat-content-list="chatContentList" />
<div v-if="recordSending" class="chat_record_tip">
<div id="record_progress_bar" :style="'width:'+100/60*seconds+'%'" />
<div class="record_icon" />
<div class="record_tip_text">正在录音...</div>
<div class="record_tip_confirm" @click="stopRecording()">确定</div>
<div class="record_tip_cancle" @click="cancleRecording()">取消</div>
</div>
</div>
<chat-member-list ref="chatMemberList" :current-member-list="currentMemberList" />
</div>
<div class="chat-box-footer">
<div v-if="isShow">
<div class="userString">{{ userString }}</div>
<el-button :loading="loading" size="mini" type="primary" class="chat-box-create-coversite" @click="doCreate">创建会话</el-button>
<div v-if="scriptTip" class="scriptTip">{{ scriptTip }}</div>
</div>
<div v-else>
<div class="chat-box-footer-tool" />
<el-button v-if="isQuitShow" size="mini" type="danger" class="chat-box-footer-quit" :loading="loading" @click="quitConversition()">结束会话</el-button>
<el-button v-if="isStartRecord" class="chat-box-footer-send" size="mini" type="primary" :disabled="recordSending" @click="startRecording()">发送语音</el-button>
<div v-if="scriptTip" class="scriptTip">{{ scriptTip }}</div>
</div>
</div>
</div>
<div class="chat-box-main">
<div class="chat-box-header">
<div class="chat-box-header-title">
<el-input v-if="isShow" v-model="queryMember" size="small" placeholder="请输入搜索人员">
<el-button slot="append" icon="el-icon-search" />
</el-input>
</div>
<div class="chat-setting" @click="handleSetting()">
<i class="el-icon-s-tools" />
</div>
</div>
<div v-if="isShow" class="chat-box-content">
<el-tree
ref="tree"
:data="treeData"
:props="defaultProps"
node-key="id"
default-expand-all
:filter-node-method="filterNode"
show-checkbox
style="margin: 10px;overflow-y: auto;height: 100%;margin-right: 0;"
@check-change="handleCheckChange"
>
<span :id="data.id" slot-scope="{ node, data }">
<span style="font-size: 14px">{{ data.label }}</span>
</span>
</el-tree>
</div>
<div v-else class="chat-box-content">
<div class="chatcontent">
<chat-content ref="chatContent" :chat-content-list="chatContentList" />
<div v-if="recordSending" class="chat_record_tip">
<div id="record_progress_bar" :style="'width:'+100/60*seconds+'%'" />
<div class="record_icon" />
<div class="record_tip_text">正在录音...</div>
<div class="record_tip_confirm" @click="stopRecording()">确定</div>
<div class="record_tip_cancle" @click="cancleRecording()">取消</div>
</div>
</div>
<chat-member-list ref="chatMemberList" :current-member-list="currentMemberList" />
</div>
<div class="chat-box-footer">
<div v-if="isShow">
<div class="userString">{{ userString }}</div>
<el-button :loading="loading" size="mini" type="primary" class="chat-box-create-coversite" @click="doCreate">创建会话</el-button>
<div v-if="scriptTip" class="scriptTip">{{ scriptTip }}</div>
</div>
<div v-else>
<div class="chat-box-footer-tool" />
<el-button v-if="isQuitShow" size="mini" type="danger" class="chat-box-footer-quit" :loading="loading" @click="quitConversition()">结束会话</el-button>
<el-button v-if="isStartRecord" class="chat-box-footer-send" size="mini" type="primary" :disabled="recordSending" @click="startRecording()">发送语音</el-button>
<div v-if="scriptTip" class="scriptTip">{{ scriptTip }}</div>
</div>
</div>
</div>
<chat-setting ref="chatSetting" :form="form" @setSetting="setSetting" />
<chat-tooltip ref="chatToolTip" :group="group" :conversition-id="conversitionId" :invite-user-name="inviteUserName" />
</div>
@ -126,7 +128,7 @@ export default {
},
data() {
return {
drawer: false,
drawer: false,
bottom:15,
queryMember:'',
defaultProps: {
@ -156,7 +158,7 @@ export default {
}
},
methods:{
clickBtn() {
clickBtn() {
if (this.drawer) {
this.drawer = false;
} else {
@ -300,8 +302,8 @@ export default {
this.dialogVisible = false;
});
} else {
this.userString = '群聊列表为空, 请选择人员';
}
this.userString = '群聊列表为空, 请选择人员';
}
},
quitConversition() {
this.loading = true;
@ -334,8 +336,6 @@ export default {
}
}
.menuTrainListBtn {
width: 20px;
height: 40px;
background: #fff;
text-align: center;
border-radius: 0px 6px 6px 0px;
@ -345,6 +345,12 @@ export default {
transform: translateX(502px);
cursor: pointer;
z-index: 9;
display: flex;
flex-direction: column;
align-items: center;
text-align: center;
justify-content: center;
padding: 5px 3px;
.el-icon-more{
font-size: 20px;
margin-top: 9px;

View File

@ -1,7 +1,9 @@
<template>
<div class="chatBox" :class="{'active': drawer}" :style="{'bottom':bottom+'px'}">
<div class="menuTrainListBtn" @click="clickBtn">
<i class="el-icon-more" />
<!-- <i class="el-icon-more" /> -->
<p style="margin: 0;"></p>
<p style="margin: 0;"></p>
</div>
<div class="chat-box-main">
<div class="chat-box-header">
@ -580,8 +582,6 @@ export default {
}
}
.menuTrainListBtn {
width: 20px;
height: 40px;
background: #fff;
text-align: center;
border-radius: 0px 6px 6px 0px;
@ -591,6 +591,12 @@ export default {
transform: translateX(502px);
cursor: pointer;
z-index: 9;
display: flex;
flex-direction: column;
align-items: center;
text-align: center;
justify-content: center;
padding: 5px 3px;
.el-icon-more{
font-size: 20px;
margin-top: 9px;

View File

@ -368,11 +368,12 @@ export default {
const resp = await getSimulationInfoNew(this.group);
if (resp && resp.code == 200 && resp.data && !resp.data.dataError) {
this.dataError = false;
this.$store.dispatch('scriptRecord/updateSimulationPause', resp.data.pause);
this.$store.dispatch('scriptRecord/updateSimulationPause', resp.data.pause); //
this.scriptId = Number(resp.data.scriptId) || 0;
this.$store.dispatch('training/setInitTime', +new Date(`${new Date().toLocaleDateString()} ${timeFormat(resp.data.systemTime)}`));
this.planRunning = resp.data.planRunning;
this.$store.dispatch('map/setRunPlanStatus', this.planRunning);
this.$store.dispatch('training/countUsedTime');
if (!this.planRunning) {
this.$store.dispatch('training/over');
}

View File

@ -6,6 +6,21 @@
<span v-if="countTime" class="display-score">{{ $t('display.demon.trialTime') }} {{ countTime }}</span>
</el-row>
</div>
<div class="display_top_draft" :style="{top: offset+'px'}">
<div class="btn_hover" @click="menuClick">菜单</div>
<el-button-group ref="button_group_box" class="button_group_box" :style="`transform: translateX(-${btnWidth}px)`">
<template v-if="!dataError"> <!-- 地图错误判断 -->
<!-- 设备视图 -->
<el-button v-if="isShow3dmodel && !isShowScheduling" size="small" @click="jumpjlmap3dmodel">{{ jl3dmodel }}</el-button>
<!-- 三维视图 -->
<el-button v-if="!isShowScheduling" size="small" @click="jumpjlmap3d">{{ jl3dname }}</el-button>
<!-- cctv视图 -->
<el-button v-if="!isShowScheduling" size="small" @click="jumpjl3dpassflow">{{ jl3dpassflow }}</el-button>
<!-- 排班计划 -->
<el-button v-if="isShowScheduling" type="primary" size="small" @click="jumpScheduling">{{ $t('display.demon.dispatchingPlan') }}</el-button>
</template>
</el-button-group>
</div>
<div class="display-draft" :class="{'haerbin_btn_box': $route.query.lineCode == '07'}" :style="{bottom: offsetBottom + 'px'}">
<el-button-group class="button-group-box">
<el-button type="primary" size="small" @click="back">{{ projectDevice?'退出':$t('display.demon.back') }}</el-button>
@ -17,14 +32,6 @@
<el-button type="danger" size="small" @click="end">{{ $t('display.demon.initialize') }}</el-button>
<el-button type="success" :disabled="isDisable" size="small" @click="selectBeginTime">{{ $t('display.demon.drivingByPlan') }}</el-button>
</template>
<!-- 设备视图 -->
<el-button v-if="isShow3dmodel && !isShowScheduling" size="small" @click="jumpjlmap3dmodel">{{ jl3dmodel }}</el-button>
<!-- 三维视图 -->
<el-button v-if="!isShowScheduling" size="small" @click="jumpjlmap3d">{{ jl3dname }}</el-button>
<!-- cctv视图 -->
<el-button v-if="!isShowScheduling" size="small" @click="jumpjl3dpassflow">{{ jl3dpassflow }}</el-button>
<!-- 排班计划 -->
<el-button v-if="isShowScheduling" type="primary" size="small" @click="jumpScheduling">{{ $t('display.demon.dispatchingPlan') }}</el-button>
</template>
</el-button-group>
</div>
@ -99,7 +106,9 @@ export default {
jl3dstation: this.$t('display.demon.threeDimensionalStation'),
jl3dmodel: this.$t('display.demon.deviceView'),
isShow3dmodel :false,
isGoback: false
isGoback: false,
hoverBtn: false,
btnWidth: 0
};
},
computed: {
@ -151,6 +160,11 @@ export default {
clearTimeout(this.time);
}
},
mounted() {
this.$nextTick(() => {
this.menuClick();
});
},
methods: {
async initLoadPage() {
try {
@ -317,6 +331,15 @@ export default {
this.jl3dname = this.$t('display.demon.threeDimensionalView'); //
this.isShow3dmodel = true;
}
},
menuClick() {
this.hoverBtn = !this.hoverBtn;
if (this.hoverBtn) {
// this.$refs.button_group_box.$el.clientWidth ||
this.btnWidth = 500; //
} else {
this.btnWidth = 0;
}
}
}
};
@ -359,7 +382,6 @@ export default {
<style lang="scss">
.display-draft {
position: absolute;
// float: right;
right: 10px;
bottom: 15px;
button {
@ -383,4 +405,33 @@ export default {
}
}
.display_top_draft{
position: absolute;
left: 5px;
top: 15px;
height: 32px;
overflow: hidden;
padding-left: 44px;
.btn_hover{
position: absolute;
left: 0;
top: 0;
z-index: 2;
color: #4e4d4d;
font-size: 14px;
background: #fff;
padding: 8px;
border-radius: 5px;
display: table;
cursor: pointer;
float: left;
height: 32px;
}
.button_group_box{
float: left;
transition: all 0.5s;
overflow: hidden;
transform: translateX(0px);
}
}
</style>

View File

@ -185,7 +185,7 @@ export default {
}
},
endCommit() {
this.$store.dispatch('training/setStopCountTime');
// this.$store.dispatch('training/setStopCountTime');
const mode = {
mode: this.demoMode,
id: this.trainingObj.id,

View File

@ -1,7 +1,9 @@
<template>
<div class="menuTrainListOut" :class="{'xian_01' : lineCode == '11', 'active': drawer}">
<div class="menuTrainListBtn" @click="clickBtn">
<i class="el-icon-more" />
<!-- <i class="el-icon-more" /> -->
<p style="margin: 0;"></p>
<p style="margin: 0;"></p>
</div>
<div :show-close="false" class="menuTrainList_box" style="height: 100%;">
<div v-if="lineCode=='10'||lineCode=='11'" class="menuTrainList">
@ -153,6 +155,12 @@ export default {
z-index: 2;
transform: translateX(-20px);
cursor: pointer;
display: flex;
flex-direction: column;
align-items: center;
text-align: center;
justify-content: center;
padding: 5px 3px;
.el-icon-more{
font-size: 20px;
margin-top: 9px;

View File

@ -3,7 +3,7 @@
<div v-show="maskOpen" class="mask" />
<div :id="canvasId" style="background: #000;" class="display_canvas" />
<progress-bar ref="progressBar" />
<zoom-box v-if="!showZoom && !isScreen" :scale-rate="dataZoom.scaleRate" @setShrink="setShrink" @setMagnify="setMagnify" />
<!-- <zoom-box v-if="!showZoom && !isScreen" :scale-rate="dataZoom.scaleRate" @setShrink="setShrink" @setMagnify="setMagnify" /> -->
<show-mode v-show="isDesign" :local-station-show="localStationShow" @setShowMode="setShowMode" />
<switch-station v-show="isDesign && (showMode === '03') && localStationShow" ref="switchStation" :concentration-station-list="concentrationStationList" @setShowStation="setShowStation" />
<div v-if="show && !isScreen" class="zoom-view" :style="{ width: width +'px'}">
@ -35,7 +35,7 @@
import Vue from 'vue';
import localStore from 'storejs';
import Jlmap from '@/jmapNew/map';
import ZoomBox from './pendant/zoom';
// import ZoomBox from './pendant/zoom';
import ShowMode from './pendant/showMode';
import SwitchStation from './pendant/switchStation';
import ProgressBar from '@/views/components/progressBar/index';
@ -47,7 +47,7 @@ import Theme from '@/jmapNew/theme/factory';
export default {
name: 'JlmapVisual',
components: {
ZoomBox,
// ZoomBox,
ProgressBar,
ShowMode,
SwitchStation

View File

@ -1,7 +1,9 @@
<template>
<div class="chatBox" :class="{'active': drawer}" :style="{'bottom':bottom+'px'}">
<div class="menuTrainListBtn" @click="clickBtn">
<i class="el-icon-more" />
<!-- <i class="el-icon-more" /> -->
<p style="margin: 0;"></p>
<p style="margin: 0;"></p>
</div>
<div class="chat-box-main">
<template v-if="!conversitionId && userRole !== 'AUDIENCE' && !commonConversation">
@ -684,8 +686,6 @@ export default {
}
}
.menuTrainListBtn {
width: 20px;
height: 40px;
background: #fff;
text-align: center;
border-radius: 0px 6px 6px 0px;
@ -695,6 +695,12 @@ export default {
transform: translateX(502px);
cursor: pointer;
z-index: 9;
display: flex;
flex-direction: column;
align-items: center;
text-align: center;
justify-content: center;
padding: 5px 3px;
.el-icon-more{
font-size: 20px;
margin-top: 9px;

View File

@ -11,6 +11,7 @@
<menu-demon-joint
ref="demonMenu"
:group="group"
:offset="offset"
:offset-bottom="offsetBottom"
:data-error="dataError"
:user-role="userRole"
@ -143,9 +144,6 @@ export default {
'map',
'bigScreenConfig'
]),
// ...mapGetters('training', [
// 'offsetStationCode'
// ]),
width() {
return this.$store.state.app.width;
},
@ -324,6 +322,7 @@ export default {
} else {
this.$store.dispatch('training/over');
}
this.$store.dispatch('training/countUsedTime');
} else if (resp && resp.code == 200 && resp.data && resp.data.dataError) {
this.dataError = true;
this.$messageBox('此地图数据正在维护中,无法运行!');

View File

@ -1,8 +1,22 @@
<template>
<div>
<chat-box :group="group" :user-role="userRole" />
<!-- <div class="btn_hover" @mouseenter="btnHover"><i class="el-icon-s-promotion" /></div> -->
<!-- @mouseenter="btnBoxEnter" @mouseleave.stop="btnBoxLeave" -->
<div class="display_top_draft" :style="{top: offset+'px'}">
<div class="btn_hover" @click="menuClick">菜单</div>
<el-button-group ref="button_group_box" class="button_group_box" :style="`transform: translateX(-${btnWidth}px)`">
<template v-if="!dataError"> <!-- 地图错误判断 -->
<!-- 设备视图 -->
<el-button v-if="isShow3dmodel && isShowScheduling" size="small" @click="jumpjlmap3dmodel">{{ $t('display.demon.deviceView') }}</el-button>
<!-- 三维视图 / 司机视角 -->
<el-button v-if="isShowScheduling || isDriver" size="small" @click="jumpjlmap3d">{{ jl3dname }}</el-button>
<!-- cctv视图 -->
<el-button v-if="isShowScheduling || isStationSupervisor" size="small" @click="jumpjl3dpassflow">{{ $t('display.demon.passengerflow') }}</el-button>
<el-button v-if="isAdmin && !noQrcodeList.includes(project)" type="primary" size="small" @click="generateQrCode">生成二维码</el-button>
<el-button v-if="isAdmin" size="small" @click="memberManage">成员管理</el-button>
<el-button v-if="isAdmin && isProject" size="small" @click="handleEquipment">设备管理</el-button>
</template>
</el-button-group>
</div>
<div class="display-draft" :class="{'display-type-hb': lineCode == '07' && $store.state.training.prdType=='01', 'haerbin_btn_box': lineCode == '07'}" :style="{bottom: offsetBottom + 'px'}">
<el-button-group class="button-group-box">
<el-button v-if="project==='refereeJsxt'" type="success" size="small" @click="refeeEndCompetition">退出</el-button> <!-- 竞赛退出 -->
@ -18,15 +32,6 @@
<el-button :disabled="!jsStart" type="success" size="small" @click="startCompetition">开始</el-button>
<el-button :disabled="jsStart" type="danger" size="small" @click="endCompetition">提交</el-button>
</template>
<!-- 设备视图 -->
<el-button v-if="isShow3dmodel && isShowScheduling" size="small" @click="jumpjlmap3dmodel">{{ $t('display.demon.deviceView') }}</el-button>
<!-- 三维视图 / 司机视角 -->
<el-button v-if="isShowScheduling || isDriver" size="small" @click="jumpjlmap3d">{{ jl3dname }}</el-button>
<!-- cctv视图 -->
<el-button v-if="isShowScheduling || isStationSupervisor" size="small" @click="jumpjl3dpassflow">{{ $t('display.demon.passengerflow') }}</el-button>
<el-button v-if="isAdmin && !noQrcodeList.includes(project)" type="primary" size="small" @click="generateQrCode">生成二维码</el-button>
<el-button v-if="isAdmin" size="small" @click="memberManage">成员管理</el-button>
<el-button v-if="isAdmin && isProject" size="small" @click="handleEquipment">设备管理</el-button>
</template>
</el-button-group>
</div>
@ -88,6 +93,10 @@ export default {
return false;
}
},
offset: {
type: Number,
required: true
},
offsetBottom: {
type: [String, Number],
default: 15
@ -103,7 +112,8 @@ export default {
noQrcodeList: NoQrcodeList,
isShow3dmodel :false,
jl3dname: this.$t('display.demon.threeDimensionalView'),
hoverBtn: false
hoverBtn: false,
btnWidth: 0
};
},
computed: {
@ -139,14 +149,7 @@ export default {
});
}
},
// '$store.state.socket.simulationStart': async function (val) {
// if (val) {
// // this.$store.dispatch('training/setInitTime', +new Date(val));
// // this.$store.dispatch('training/simulationStart');
// }
// },
'$store.state.training.started': function (val) {
this.isDisable = false;
if (val) {
this.isDisable = true;
}
@ -166,6 +169,9 @@ export default {
},
async mounted() {
this.change3dname();
this.$nextTick(() => {
this.menuClick();
});
},
beforeDestroy() {
this.$store.dispatch('training/setGroup', '');
@ -232,6 +238,7 @@ export default {
},
// 仿
start(model) {
this.isDisable = true;
const data = {
time: model.initTime
};
@ -377,32 +384,16 @@ export default {
this.jl3dname = this.$t('display.demon.threeDimensionalView'); //
this.isShow3dmodel = true;
}
},
menuClick() {
this.hoverBtn = !this.hoverBtn;
if (this.hoverBtn) {
// this.$refs.button_group_box.$el.clientWidth ||
this.btnWidth = 500;
} else {
this.btnWidth = 0;
}
}
// btnHover() {
// if (!this.btnHoverTime) {
// this.btnHoverTime = setTimeout(() => {
// this.hoverBtn = false;
// }, 8000)
// }
// this.hoverBtn = true;
// },
// btnBoxEnter() {
// if (this.btnHoverTime) {
// clearTimeout(this.btnHoverTime);
// this.btnHoverTime = null;
// }
// if (this.btnBoxLeaveTime) {
// clearTimeout(this.btnBoxLeaveTime);
// this.btnBoxLeaveTime = null;
// }
// },
// btnBoxLeave() {
// if (!this.btnBoxLeaveTime) {
// this.btnBoxLeaveTime = setTimeout(() => {
// this.hoverBtn = false;
// }, 5000)
// }
// }
}
};
</script>
@ -489,19 +480,8 @@ export default {
}
}
.btn_hover{
position: absolute;
right: -2px;
bottom: 15px;
color: #fff;
font-size: 24px;
background: #1756e4;
padding: 8px 2px;
border-radius: 5px;
}
.display-draft {
position: absolute;
// float: right;
right: 10px;
bottom: 28px;
// transform: translateX(calc(100% + 40px));
@ -529,6 +509,35 @@ export default {
border-right-color: transparent;
}
}
.display_top_draft{
position: absolute;
left: 5px;
top: 15px;
height: 32px;
overflow: hidden;
padding-left: 44px;
.btn_hover{
position: absolute;
left: 0;
top: 0;
z-index: 2;
color: #4e4d4d;
font-size: 14px;
background: #fff;
padding: 8px;
border-radius: 5px;
display: table;
cursor: pointer;
float: left;
height: 32px;
}
.button_group_box{
float: left;
transition: all 0.5s;
overflow: hidden;
transform: translateX(0px);
}
}
.haerbin_btn_box{
width: 450px;
bottom: 15px!important;

View File

@ -1,7 +1,9 @@
<template>
<div class="menuTrainListOut" :class="{'xian_01' : lineCode == '11', 'active': drawer}">
<div class="menuTrainListBtn" @click="clickBtn">
<i class="el-icon-more" />
<!-- <i class="el-icon-more" /> -->
<p style="margin: 0;"></p>
<p style="margin: 0;"></p>
</div>
<div :show-close="false" class="menuTrainList_box" style="height: 100%;">
<div v-if="lineCode=='10'||lineCode=='11'" class="menuTrainList">
@ -132,8 +134,6 @@ export default {
}
}
.menuTrainListBtn{
width: 20px;
height: 40px;
background: #fff;
text-align: center;
border-radius: 6px 0px 0px 6px;
@ -142,6 +142,12 @@ export default {
z-index: 2;
transform: translateX(-20px);
cursor: pointer;
display: flex;
flex-direction: column;
align-items: center;
text-align: center;
justify-content: center;
padding: 5px 3px;
.el-icon-more{
font-size: 20px;
margin-top: 9px;