From 2d398b4fa805ba43a89311d955fbb6e47c540e6c Mon Sep 17 00:00:00 2001
From: YANGDL <114714267@qq.com>
Date: 星期五, 12 三月 2021 20:57:16 +0800
Subject: [PATCH] 修改了界面自适应
---
src/components/panel/RightSearchPanel.vue | 62 +++++++++++++++++++++---------
1 files changed, 43 insertions(+), 19 deletions(-)
diff --git a/src/components/panel/RightSearchPanel.vue b/src/components/panel/RightSearchPanel.vue
index f8c5efd..13b6e48 100644
--- a/src/components/panel/RightSearchPanel.vue
+++ b/src/components/panel/RightSearchPanel.vue
@@ -1,10 +1,19 @@
<template>
- <div id="right-panel" >
+ <div class="panel-right">
<div class="panel-tab">
- <div v-for="item in topicMenu" :key="item.id" :title="item.name" class="tab-item" @click="handleGd" :class="{'B-TMT-tab-waybill-isActive': isWaybillHover}">
+ <div v-for="item in topicMenu" :key="item.id" :title="item.name" class="tab-item" @click="handleGd"
+ :class="{'B-TMT-tab-waybill-isActive': isWaybillHover}">
<img :src="item.icon" style="width: 24px;height: 24px;"></div>
-<!-- <div class="tab-item" @click="handleHb" :class="{'B-TMT-tab-route-isActive': isRouteHover}"></div>-->
-<!-- <div class="tab-item" @click="handlePk" :class="{'B-TMT-tab-route-isActive': isRouteHover}"></div>-->
+ <div class="container">
+ <ul class="module-wrap"
+ style="padding-top: 0px; transition-timing-function: cubic-bezier(0.1, 0.57, 0.1, 1); transition-duration: 0ms; transform: translate(0px, 0px) translateZ(0px);">
+ <li class="active module-wrap__box">
+ <div class="module-wrap__box-item">
+ <!----><img src="../../assets/images/map-pages/icon/dd.png" class="icon">
+ </div><!---->
+ </li>
+ </ul><!----><!---->
+ </div>
</div>
<!-- <div class="panel-fold-btn" >-->
<!-- <div class="btn-stretch" @click="toggleMonitorPanel"></div>-->
@@ -85,14 +94,13 @@
},
toggleMonitorPanel () {
this.isCollapse = !this.isCollapse
- console.log(11)
// const el = $('.btn-stretch')
// const el2 = $('.panel-fold-btn')
// const el = document.getElementsByClassName('.btn-stretch')
// const el2 = document.getElementsByClassName('.panel-fold-btn')
// let = 'btn-stretch-active'
- // var rightControl = $('#right-panel')
- // var rightControl = document.getElementById('#right-panel')
+ // var rightControl = $('#panel-right')
+ // var rightControl = document.getElementById('#panel-right')
// const right = rightControl.css('right')
// const rightit = rightControl.ownerDocument.defaultView
// const right = rightit.getComputedStyle(rightit, null).right
@@ -132,18 +140,27 @@
<style lang="less">
@import '@assets/css/map/_map-variable';
-#right-panel {
+.panel-right {
width: 322px;
- //height: 573px;
- height: 100%;
+ //height: 100%;
+ //position: absolute;
+ //right: 10px;
+ //top: 10px;
+ height: 0;
position: absolute;
- right: 10px;
- top: 10px;
+ top: .60417rem;
+ right: .15625rem;
+ z-index: 501;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-box-align: start;
+ -ms-flex-align: start;
+ align-items: flex-start;
.el-card__body {
padding: 7px;
}
-
.el-form-item__content {
color: rgb(52, 224, 255);
}
@@ -160,7 +177,7 @@
.el-form-item__label {
color: rgb(52, 224, 255);
- /*<!--color: @color;-->*/
+ color: @color;
}
.el-input__inner::placeholder {
@@ -304,6 +321,13 @@
width: 32px;
z-index: 500;
background: url('../../assets/images/map-pages/icon/caidan.png') no-repeat;
+ .container{
+ max-height: 3.125rem;
+ overflow: hidden;
+ position: relative;
+ position: relative;
+ }
+
}
.right-control {
@@ -311,11 +335,11 @@
//height: 573px;
height: 100%;
position: relative;
- top: 0;
- right: 0;
- z-index: 999;
- background: url('../../assets/images/map-pages/icon/bgc.png') no-repeat;
- background-size: 100% 98%;
+ //top: 0;
+ //right: 0;
+ z-index: 500;
+ //background: url('../../assets/images/map-pages/icon/bgc.png') no-repeat;
+ //background-size: 100% 98%;
}
.a{
transform: translateX(328px);
--
Gitblit v1.8.0