Skip to content

任超 / js.CadastralSystem

Go to a project
Toggle navigation
Toggle navigation pinning
55dabf3b by 杨威
Options

楼盘表样式修改

1 parent f4606fd8
Inline Side-by-side
Showing 2 changed files with 65 additions and 24 deletions
<template>
<div class="edit">
<div class="tab-header">
<div class="searchContent">
<el-radio-group v-model="radio1">
<el-radio-button class="radioBtn" label="1" border
>实测</el-radio-button
>
<el-radio-button class="radioBtn" label="2" border
>预测</el-radio-button
>
<el-row class="searchContent">
<el-col :span="10">
<el-radio-group v-model="tabPosition">
<el-radio-button label="sc">实测</el-radio-button>
<el-radio-button label="yc">预测</el-radio-button>
</el-radio-group>
<el-input
v-model="bdcdyh"
class="searchInput"
placeholder="输入不动产单元号"
></el-input>
</el-col>
<el-col :span="14">
<el-button class="radioBtn" label="1" @click="create" border>创建楼盘</el-button>
<el-button class="radioBtn" label="2" border>实预测转换</el-button>
<el-button class="radioBtn" label="3" border>批量户</el-button>
<el-button class="radioBtn" label="4" border @click="plcVisible=true">批量层</el-button>
<el-button class="radioBtn" label="5" border>批量室号</el-button>
<el-button class="radioBtn" label="6" border>批量坐落</el-button>
<el-button class="radioBtn" label="7" border>批量单元号</el-button>
</el-col>
</el-row>
<!-- <div >
<el-radio-group v-model="tabPosition">
<el-radio-button label="sc">实测</el-radio-button>
<el-radio-button label="yc">预测</el-radio-button>
</el-radio-group>
<el-input
v-model="bdcdyh"
class="searchInput"
placeholder="输入不动产单元号"
></el-input>
</div>
<div>
<el-button class="radioBtn" label="1" @click="create" border
>创建楼盘</el-button
>
<el-button class="radioBtn" label="2" border>实预测转换</el-button>
<el-button class="radioBtn" label="3" border>批量户</el-button>
<el-button class="radioBtn" label="4" border @click="plcVisible=true">批量层</el-button>
<el-button class="radioBtn" label="5" border>批量室号</el-button>
<el-button class="radioBtn" label="6" border>批量坐落</el-button>
<el-button class="radioBtn" label="7" border>批量单元号</el-button>
</div>
<div>
<el-button class="radioBtn" label="1" @click="create" border>创建楼盘</el-button>
<el-button class="radioBtn" label="2" border>实预测转换</el-button>
<el-button class="radioBtn" label="3" border>批量户</el-button>
<el-button class="radioBtn" label="4" border @click="plcVisible=true">批量层</el-button>
<el-button class="radioBtn" label="5" border>批量室号</el-button>
<el-button class="radioBtn" label="6" border>批量坐落</el-button>
<el-button class="radioBtn" label="7" border>批量单元号</el-button>
</div>
</div> -->
</div>
<div
class="tab-content"
......@@ -126,7 +143,8 @@ export default {
data() {
return {
bsms:["123","321","231"],
plcVisible:false,
plcVisible:false,
tabPosition:'sc',
radio1: "",
radio2: "",
createFlag: false,
......@@ -220,7 +238,7 @@ export default {
},
//获取高度计算lpb内容区高度
getHeight() {
this.lpbContentHight = window.innerHeight - 340;
this.lpbContentHight = window.innerHeight - 276;
},
//创建楼盘
create() {
......@@ -318,7 +336,22 @@ export default {
background-color: #ffffff;
margin-bottom: 20px;
.searchContent {
margin-bottom: 20px;
box-sizing: border-box;
padding-left: 20px;
/deep/.el-radio-button__inner {
border: 1px solid #00CACD;
color: #00CACD;
}
/deep/.el-radio-button__inner:hover{
color: #00CACD;
}
/deep/.is-active .el-radio-button__inner{
color: #fff;
}
/deep/.el-radio-button__orig-radio:checked+.el-radio-button__inner{
background-color: #00CACD;
border-color: #00CACD;
}
.searchInput {
width: 300px;
margin-left: 20px;
......@@ -357,6 +390,8 @@ export default {
.lp-overview {
transition: 0.5s;
flex: 1;
padding-right: 20px;
box-sizing: border-box;
}
.lp-legend {
transition: 0.5s;
......@@ -366,6 +401,8 @@ export default {
width: 34px;
float: right;
height: 100%;
background-color: #0091FF;
color: #fff;
.btn {
cursor: pointer;
height: 40px;
......@@ -426,6 +463,9 @@ export default {
}
}
}
.tab-content::-webkit-scrollbar{
width: 1px;
}
.btnGroup {
margin: 20px auto 0;
width: 230px;
......
......@@ -383,7 +383,8 @@ export default {
},
mounted() {
setTimeout(() => {
this.lpbContentWidth = this.$store.state.contentWidth - 34 - 6;
//lp-overview宽度 - 右侧图例宽度 - lp-overview滚动条宽度 - lpbContent的pandingRight
this.lpbContentWidth = this.$store.state.contentWidth - 34 - 1 - 20;
//让滚动条滚动至最下面 -6是横向滚动条的高度
this.$refs.lpbContent.scrollTop = this.$refs.lpbContent.scrollHeight - this.$refs.lpbContent.clientHeight -6;
}, 100);
......