代码调整
This commit is contained in:
parent
8fc7907f42
commit
648d04f0b4
@ -1,38 +1,53 @@
|
||||
<template>
|
||||
<div v-if="isShowBtn" id="menuButtons_box" class="menu menuButton" :style="{left: point.x+'px', top: point.y+'px' }">
|
||||
<!-- style="height: 45px;" -->
|
||||
<button :id="Switch.locate.button.domId" class="button_box" :style="{width: width+'px', backgroundColor:buttonUpColor}" @click="buttonDown(Switch.locate.button.operation)">
|
||||
<span class="buttonColor">总定</span>
|
||||
</button>
|
||||
<button :id="Switch.reverse.button.domId" class="button_box" :style="{width: width+'px', backgroundColor:buttonUpColor}" @click="buttonDown(Switch.reverse.button.operation)">
|
||||
<span class="buttonColor">总反</span>
|
||||
</button>
|
||||
<button :id="Switch.lock.button.domId" class="button_box" :style="{width: width+'px', backgroundColor:buttonUpColor}" @click="buttonDown(Switch.lock.button.operation)">
|
||||
<span class="buttonColor">单锁</span>
|
||||
</button>
|
||||
<button :id="Switch.unlock.button.domId" class="button_box" :style="{width: width+'px', backgroundColor:buttonUpColor}" @click="buttonDown(Switch.unlock.button.operation)">
|
||||
<span class="buttonColor">单解</span>
|
||||
</button>
|
||||
<button :id="Switch.block.button.domId" class="button_box" :style="{width: width+'px', backgroundColor:buttonUpColor}" @click="buttonDown(Switch.block.button.operation)">
|
||||
<span class="buttonColor">岔封</span>
|
||||
</button>
|
||||
<button :id="Switch.unblock.button.domId" class="button_box" :style="{width: width+'px', backgroundColor:buttonUpColor}" @click="buttonDown(Switch.unblock.button.operation)">
|
||||
<span class="buttonColor">岔解</span>
|
||||
</button>
|
||||
<button :id="Signal.lock.button.domId" class="button_box" :style="{width: width+'px', backgroundColor:buttonUpColor}" @click="buttonDown(Signal.lock.button.operation)">
|
||||
<span class="buttonColor">钮封</span>
|
||||
</button>
|
||||
<button :id="Signal.unlock.button.domId" class="button_box" :style="{width: width+'px', backgroundColor:buttonUpColor}" @click="buttonDown(Signal.unlock.button.operation)">
|
||||
<span class="buttonColor">钮解</span>
|
||||
</button>
|
||||
<button :id="Command.cancel.clearMbm.domId" class="button_box" :style="{width: width+'px', backgroundColor:buttonUpColor}" @click="buttonDown(Command.cancel.clearMbm.operation)">
|
||||
<span class="buttonColor">取消</span>
|
||||
</button>
|
||||
<button :id="Section.fault.button.domId" class="button_box" :style="{width: width+'px', backgroundColor:buttonUpColor,color:'#DA2D29'}" @click="buttonDown(Section.fault.button.operation)">
|
||||
<span class="buttonColor">区解</span>
|
||||
</button>
|
||||
<div v-if="isShowBtn">
|
||||
<div id="menuButtons_box" class="menu menuButton" :style="{left: point.x+'px', top: point.y+'px' }">
|
||||
<!-- style="height: 45px;" -->
|
||||
<button :id="Switch.locate.button.domId" class="button_box" :style="{width: width+'px', backgroundColor:buttonUpColor}" @click="buttonDown(Switch.locate.button.operation)">
|
||||
<span class="buttonColor">总定</span>
|
||||
</button>
|
||||
<button :id="Switch.reverse.button.domId" class="button_box" :style="{width: width+'px', backgroundColor:buttonUpColor}" @click="buttonDown(Switch.reverse.button.operation)">
|
||||
<span class="buttonColor">总反</span>
|
||||
</button>
|
||||
<button :id="Switch.lock.button.domId" class="button_box" :style="{width: width+'px', backgroundColor:buttonUpColor}" @click="buttonDown(Switch.lock.button.operation)">
|
||||
<span class="buttonColor">单锁</span>
|
||||
</button>
|
||||
<button :id="Switch.unlock.button.domId" class="button_box" :style="{width: width+'px', backgroundColor:buttonUpColor}" @click="buttonDown(Switch.unlock.button.operation)">
|
||||
<span class="buttonColor">单解</span>
|
||||
</button>
|
||||
<button :id="Switch.block.button.domId" class="button_box" :style="{width: width+'px', backgroundColor:buttonUpColor}" @click="buttonDown(Switch.block.button.operation)">
|
||||
<span class="buttonColor">岔封</span>
|
||||
</button>
|
||||
<button :id="Switch.unblock.button.domId" class="button_box" :style="{width: width+'px', backgroundColor:buttonUpColor}" @click="buttonDown(Switch.unblock.button.operation)">
|
||||
<span class="buttonColor">岔解</span>
|
||||
</button>
|
||||
<button :id="Signal.lock.button.domId" class="button_box" :style="{width: width+'px', backgroundColor:buttonUpColor}" @click="buttonDown(Signal.lock.button.operation)">
|
||||
<span class="buttonColor">钮封</span>
|
||||
</button>
|
||||
<button :id="Signal.unlock.button.domId" class="button_box" :style="{width: width+'px', backgroundColor:buttonUpColor}" @click="buttonDown(Signal.unlock.button.operation)">
|
||||
<span class="buttonColor">钮解</span>
|
||||
</button>
|
||||
<button :id="Command.cancel.clearMbm.domId" class="button_box" :style="{width: width+'px', backgroundColor:buttonUpColor}" @click="buttonDown(Command.cancel.clearMbm.operation)">
|
||||
<span class="buttonColor">取消</span>
|
||||
</button>
|
||||
<button :id="Section.fault.button.domId" class="button_box" :style="{width: width+'px', backgroundColor:buttonUpColor,color:'#DA2D29'}" @click="buttonDown(Section.fault.button.operation)">
|
||||
<span class="buttonColor">区解</span>
|
||||
</button>
|
||||
</div>
|
||||
<div id="menuButton">
|
||||
<div class="promptInfo">
|
||||
<span class="status_lable">提示<br>信息</span>
|
||||
<span class="status_detailInfo" style="color: #FD00F4;">{{ promptInfo }}</span>
|
||||
</div>
|
||||
<div class="alamMessage">
|
||||
<span class="status_lable">报警<br>信息</span>
|
||||
<span class="status_detailInfo" style="color: #E61013;">{{ alamMessage }}</span>
|
||||
</div>
|
||||
<div class="delayTime">
|
||||
<span class="status_lable">延时<br>时间</span>
|
||||
<span class="status_detailInfo" style="color: #E61013;">{{ delayTime }}</span>
|
||||
</div>
|
||||
</div>
|
||||
<password-box ref="password" pop-class="fuzhou-01__systerm" @checkOver="passWordCommit" />
|
||||
<!-- @checkOver="passWordCommit" -->
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
@ -53,6 +68,9 @@ export default {
|
||||
y: 0
|
||||
},
|
||||
operation: '0',
|
||||
delayTime:'',
|
||||
promptInfo:'',
|
||||
alamMessage:'',
|
||||
deviceList: [],
|
||||
buttonDownColor: '#A8A8A8',
|
||||
buttonUpColor: '#F0F0F0',
|
||||
@ -88,6 +106,7 @@ export default {
|
||||
updateButtonShow(val, old) {
|
||||
if (old) {
|
||||
// 恢复旧按钮显示
|
||||
this.promptInfo = '';
|
||||
const domId = OperationHandler.getDomIdByOperation(old);
|
||||
const dom = document.getElementById(domId);
|
||||
if (dom) {
|
||||
@ -100,6 +119,7 @@ export default {
|
||||
const domId = OperationHandler.getDomIdByOperation(val);
|
||||
const dom = document.getElementById(domId);
|
||||
if (dom) {
|
||||
this.promptInfo = dom.innerText;
|
||||
dom.disabled = true;
|
||||
dom.style.backgroundColor = this.buttonDownColor;
|
||||
}
|
||||
@ -227,5 +247,44 @@ export default {
|
||||
background-color: $hoverBg;
|
||||
}
|
||||
}
|
||||
#menuButton{
|
||||
position: absolute;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
z-index: 2;
|
||||
background: #F0F0F0;
|
||||
box-shadow: 0px -3px 6px #909090;
|
||||
}
|
||||
.promptInfo{
|
||||
width: 33%;
|
||||
float: left;
|
||||
font-size:15px;
|
||||
padding:5px 0px;
|
||||
padding-left:10px;
|
||||
}
|
||||
.alamMessage{
|
||||
width: 33%;
|
||||
float: left;
|
||||
font-size:15px;
|
||||
padding:5px 0px;
|
||||
}
|
||||
.delayTime{
|
||||
font-size:15px;
|
||||
padding:5px 0px;
|
||||
}
|
||||
.status_lable{
|
||||
color: #1815B1;
|
||||
display: inline-block;
|
||||
}
|
||||
.status_detailInfo{
|
||||
margin-left: 10px;
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
margin-top: 10px;
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
letter-spacing: 3px;
|
||||
}
|
||||
</style>
|
||||
|
||||
|
Loading…
Reference in New Issue
Block a user