Commit 8735d835 authored by wangjiankun's avatar wangjiankun

fix: 客户提出的问题bug

parent aa47272e
......@@ -2,5 +2,5 @@ NODE_ENV = "development"
BASE_URL = "./"
VUE_APP_PUBLIC_PATH = "./"
VUE_APP_API = "http://10.96.4.28:9393/api/v1/"
VUE_APP_OSS_SRC = "https://ss1.bdstatic.com"
VUE_APP_API = "http://106.2.11.235:38092/api/v1/"
VUE_APP_OSS_SRC = "http://106.2.11.235:3324/server/realFile"
......@@ -51,7 +51,7 @@
</el-dropdown-menu>
</el-dropdown>
</el-header>
<el-main>
<el-main id="htmlMain">
<router-view></router-view>
</el-main>
</el-container>
......
......@@ -75,7 +75,6 @@
<style lang="stylus">
.bannerMap{
.el-carousel__container{
min-height 400px
text-align center
}
}
......
<template>
<div class="table_container">
<div class="table_container" :style="{ zoom: zoom }">
<div class="table_wrap">
<div class="table_header" :style="{ width: headerWidth + '%'}">
<el-row v-for="(item,index) in headerData" :key="index" :class="{ 'heighter' : item.cellHeight, 'justifyRow': index < 2 }">
......@@ -36,7 +36,7 @@
:key="srcIndex"
:src="getImageUrl(src.fileUrl)"
alt="失效链接"
:style="{ 'cursor': 'pointer', height: src.fileOrder === 0 ? '80px' : '0', width: src.fileOrder === 0 ? '100%' : '0', maxWidth: '200px' }">
:style="{ 'cursor': 'pointer', height: src.fileOrder === 0 ? '80px' : '0'}">
</viewer>
<div v-else-if="value === 'boolean' && item2[key] == 1" class="circle block"></div>
<div v-else-if="value === 'boolean' && item2[key] == 0" class="circle hollow"></div>
......@@ -87,6 +87,12 @@
},
bodyWidth: {
type: Number
},
zoom: {
type: Number,
default() {
return 1
}
}
},
data () {
......
......@@ -2,18 +2,26 @@
<div class="container">
<div class="row">
<div class="left blue">
<div class="blockShow"></div>
<div class="blockShow"
@click="saleingState = !saleingState"
:style="{ backgroundColor: saleingState ? 'rgb(25,124,230)' : '#ccc' }"></div>
</div>
<div class="right buleText">
<div :style="{ display: 'inline', cursor: 'pointer' , color: saleingState ? 'rgb(25,124,230)' : '#000' }" @click="saleingState = !saleingState">{{upText}}</div>
<div
:style="{ display: 'inline', cursor: 'pointer' , color: saleingState ? 'rgb(25,124,230)' : '#ccc' }"
@click="saleingState = !saleingState">{{upText}}</div>
</div>
</div>
<div class="row">
<div class="left green">
<div class="blockShow"></div>
<div class="blockShow"
@click="soldOutState = !soldOutState"
:style="{ backgroundColor: soldOutState ? 'rgb(46,204,113)' : '#ccc' }"></div>
</div>
<div class="right greenText">
<div :style="{ display: 'inline', cursor: 'pointer' , color: soldOutState ? 'rgb(169,209,142)' : '#000' }" @click="soldOutState = !soldOutState">{{downText}}</div>
<div
:style="{ display: 'inline', cursor: 'pointer' , color: soldOutState ? 'rgb(46,204,113)' : '#ccc' }"
@click="soldOutState = !soldOutState">{{downText}}</div>
</div>
</div>
</div>
......@@ -98,14 +106,16 @@
.green .blockShow {
width: 20px;
height: 20px;
background-color: rgb(169,209,142);
background-color: rgb(46,204,113);
margin: 0 auto;
cursor: pointer;
}
.blue .blockShow {
width: 20px;
height: 20px;
background-color: rgb(25,124,230);
margin: 0 auto;
cursor: pointer;
}
.left {
text-align: center;
......
......@@ -76,6 +76,7 @@
:data="pieData"
:legend="{ bottom: 20 }"
:colors="colorsArr"
:title="{ text: '供应套数占比', textStyle: { fontSize: '13' }, left: 0, top: '10px', right: 0, bottom: 0}"
:settings="pieSettings"></ve-ring>
<div v-else style="height: 400px;display: flex;align-items: center">
<div style="width: 50%;text-align: center;margin: auto">
......@@ -191,6 +192,11 @@
labelMap: {
productionPie: '产品类型',
supplication: '产品提供数'
},
label: {
formatter: (params) => {
return params.data.name + ':' + params.data.value + '(' + this.supplyRateMap[params.data.name] + ')'
}
}
},
histogramData: {
......@@ -251,7 +257,10 @@
},
// 多级表头数据
productionProjectData: []
productionProjectData: [],
supplyRateMap: {
} // 供应套数占比map
}
},
methods: {
......@@ -317,7 +326,24 @@
}
}
plateAnalysis(temp).then((res) => {
this.pieData.rows = res.data.pieDetilProductDtoList || []
let supplyResult = 0
try {
res.data.pieDetilProductDtoList.forEach(item => { supplyResult += item.supplication })
} catch (e) {
supplyResult = 0
}
try {
res.data.pieDetilProductDtoList.forEach((item) => {
if(supplyResult === 0 && item.supplication === 0) {
this.supplyRateMap[item.productionPie] = 0 + '%'
} else {
this.supplyRateMap[item.productionPie] = Number((item.supplication / supplyResult) * 100).toFixed(2) + '%'
}
})
} catch (e) {
res.data.pieDetilProductDtoList = []
}
this.pieData.rows = res.data.pieDetilProductDtoList
this.histogramTableData = res.data.barDetilDtoList || []
// 处理 面宽数据 格式: { roomInfo: '南向面宽', '产品1': num, '产品2': num2 }
let histomData = []
......@@ -426,10 +452,10 @@
if(!this.plateMap[item.adminRegionId]) {
this.plateMap[item.adminRegionId] = item.resultRegionDTOS
}
if(item.resultRegionDTOS && item.resultRegionDTOS.length > 0 && !this.regionVal && !this.plateVal) {
if(item.adminRegionId === '86fab0c4cf485c649ba4ee3df23b4fc6') {
this.plateOptions = item.resultRegionDTOS
this.regionVal = item.adminRegionId
this.plateVal = item.resultRegionDTOS[0].regionId
this.plateVal = item.resultRegionDTOS.find(item => { return item.regionId === 'e569ab6db18756eb04192f8cde95b25d' }).regionId
this.timeVal = new Date().getFullYear()
this.areaInterval = '0-70'
}
......@@ -450,10 +476,10 @@
if(product_type) {
this.houseTypeVal = product_type
} else {
this.houseTypeVal = res.data[0] ? res.data[0].businessId : '0-70'
this.houseTypeVal = res.data.find(item => { return item.name === '洋房' }).businessId
}
} else {
this.houseTypeVal = res.data[0] ? res.data[0].businessId : '0-70'
this.houseTypeVal = res.data.find(item => { return item.name === '洋房' }).businessId
}
if(callback) {
callback()
......
......@@ -59,15 +59,15 @@
:text="item.name"
:fontSize="12"
:text-color="'#ffffff'"
:bg-color="item.saleStatus == 1 ? 'rgb(25,124,230,0.7)' : 'rgb(46,204,113, 0.8)'"
:active-color="item.saleStatus == 1 ? 'rgb(25,124,230,1)' : 'rgb(46,204,113, 1)'"
:bg-color="item.saleStatus == 1 ? 'rgba(25,124,230,0.7)' : 'rgba(169,209,142,0.6)'"
:active-color="item.saleStatus == 1 ? 'rgba(25,124,230,1)' : 'rgba(46,204,113,0.6)'"
:bg-img-url="null"
:circle="'10px'"
:height="30"></my-overlay>
<!-- 土拍-->
<my-overlay
v-show="showType === 'plateRegion' && infotType === 1 && solidState !== '' ? ( solidState === 'all' ? true : ( solidState == item.isHave ? true : false ) ) : false"
@click.native.stop="collapseItemShow(index)"
@click.native.stop="collapseItemShow(item.businessId)"
:key="index+ 'soild' + 'plateRegion'"
v-for="(item,index) in dataType.plateRegion.resultBnsLandDTOS"
:position="{lng: item.longitude, lat: item.latitude}"
......@@ -75,8 +75,9 @@
:text="item.code"
:fontSize="12"
:text-color="'#ffffff'"
:bg-color="item.isHave == 0 ? 'rgb(25,124,230,0.6)' : 'rgb(169,209,142,0.6)'"
:active-color="item.isHave == 0 ? 'rgb(25,124,230,1)' : 'rgb(169,209,142,1)'"
:bg-color="item.isHave == 0 ? (item.businessId === soildInfoChange ? 'rgba(25,124,230,1)': 'rgba(25,124,230,0.6)') :
(item.businessId === soildInfoChange ? 'rgba(46,204,113, 0.6)': 'rgba(169,209,142,0.6)')"
:active-color="item.isHave == 0 ? 'rgba(25,124,230,1)' : 'rgba(46,204,113, 0.6)'"
:bg-img-url="null"
:circle="'10px'"
:height="30"></my-overlay>
......@@ -127,15 +128,21 @@
</div>
</el-col>
</div>
<div v-if="infotType === 1" style="margin-top: 20px;" class="soildInfo">
<el-collapse accordion v-model="soildInfoChange" class="sys-collapse" v-if="dataType.plateRegion.resultBnsLandDTOSDetail.length > 0">
<div v-if="infotType === 1" style="margin-top: 20px;" id="solidInfoCollapse" class="soildInfo">
<el-collapse accordion
@change="(activeId) => { scrollOverFlow(activeId) }"
v-model="soildInfoChange" class="sys-collapse"
v-if="dataType.plateRegion.resultBnsLandDTOSDetail.length > 0">
<el-card
:title="item.code"
:body-style="{padding: '0'}"
class="box-card"
v-for="(item,index) in dataType.plateRegion.resultBnsLandDTOSDetail"
:key="index">
<el-collapse-item :title="item.code" :name="index">
<el-collapse-item :name="item.businessId" :id="'solidInfoCollapse' + item.businessId">
<template slot="title">
<div :style="{ 'text-align': 'center','width': '100%', color: item.businessId === soildInfoChange ? '#409eff': '#303133'}">{{item.code}}</div>
</template>
<p><b>行政分区:</b>{{dataType.plateRegion.plateInfo.adminRegionName || '--'}}</p>
<p><b>板块: </b>{{dataType.plateRegion.plateInfo.name || '--'}}</p>
<p><b>土地面积:</b>{{item.landArea || '--'}}m<sup>2</sup></p>
......@@ -183,11 +190,11 @@
</div>
</div>
<div v-else-if="showType === 'property'" class="dealWidth">
<div class="searchDetailFlex">
<el-image style="cursor: pointer;height: 200px" @click="toPropertyDetail(propertyDetailData.businessId)"
<div class="searchDetailFlex" @click="toPropertyDetail(propertyDetailData.businessId)">
<el-image style="cursor: pointer;height: 200px"
:src="propertyDetailData.fileUrl ? imgUrlHeader + propertyDetailData.fileUrl: require('@assets/img/noPicture.png')" alt="加载失败" >
</el-image>
<p @click="toPropertyDetail(propertyDetailData.businessId)" class="propertyName">{{propertyDetailData.name || '---'}}</p>
<p class="propertyName">{{propertyDetailData.name || '---'}}</p>
<p class="propertyDetail" v-html="'<b>价格'+':</b>' + propertyDetailData.price + '元/m<sup>2</sup>'"></p>
<p class="propertyDetail"><b>产品类型:</b>{{propertyDetailData.productType || '---'}}</p>
<p class="propertyDetail"
......@@ -230,7 +237,7 @@
lat: 39.44000 // 纬度 天津市中心坐标点
},
saveCenter: { lng: 117.2300, lat: 39.44000 },
setZoom: 10 // 放大倍数
setZoom: 11 // 放大倍数
}, // 地图初始化配置,经纬度坐标中点 放大倍数
dataType: {
region: [],
......@@ -335,9 +342,28 @@
query: temp
})
},
collapseItemShow(index) {
if(index !== this.soildInfoChange) {
this.soildInfoChange = index
collapseItemShow(solidId) {
if(solidId !== this.soildInfoChange) {
this.soildInfoChange = solidId
this.scrollOverFlow(solidId)
}
},
scrollOverFlow(activeId) {
if(activeId) {
// 子折叠面板到父元素的高度
const collapseItemHeight = document.getElementById('solidInfoCollapse'+ activeId).offsetTop
// 父元素的滚动高度
const parentScrollTop = document.getElementById('solidInfoCollapse').scrollTop
// 父元素的高度
const parentHeight = document.getElementById('solidInfoCollapse').offsetHeight
console.log(collapseItemHeight + 493, parentHeight + parentScrollTop)
if(collapseItemHeight + 493 > parentHeight + parentScrollTop) {
setTimeout(() => {
document.getElementById('solidInfoCollapse').scrollTop = 597
},300)
} else if(collapseItemHeight < parentHeight) {
document.getElementById('solidInfoCollapse').scrollTop = 0
}
}
},
showTowerInfo(item) {
......@@ -364,25 +390,6 @@
this.map.setZoom = this.zoomType['plate']
}
})
// queryPlateByRegionId(item.businessId).then(res => {
// if(!res.data || res.data.length === 0) {
// this.$message({
// type: 'warning',
// message: '该行政区下未查询到板块'
// })
// return
// }
// this.regionClickId = item.businessId
// for(let i =0, l = res.data.length; i < l; i++) {
//
// }
// }).catch(e => {
// this.$message({
// type: 'error',
// message: e.msg
// })
// return e
// })
},
setShowToPlateRegion (item) {
queryPlateDetailById(item.businessId).then(res => {
......@@ -839,6 +846,13 @@
margin: auto;
height 100%
overflow-y auto
.soildInfo{
height calc(100% - 60px)
overflow-y auto
}
.soildInfo::-webkit-scrollbar {
width 0
}
}
.dealWidth::-webkit-scrollbar {
width 0
......@@ -890,6 +904,7 @@
.searchDetailFlex{
padding-top: 1em;
width: 80%;
cursor pointer
margin: 0 auto;
display: flex;
flex-direction: column;
......@@ -966,24 +981,6 @@
& > div {
width 100%
}
.el-collapse-item__header{
padding: 0 30px 0 20px;
border-bottom: 1px solid #e6e6e6;
text-align center;
box-sizing border-box
display inline-block
white-space nowrap
text-overflow ellipsis
overflow hidden
position relative
width 100%
.el-collapse-item__arrow{
position absolute
right 5px
top 50%
transform translateY(-50%)
}
}
.el-collapse-item__wrap{
padding: 0 20px;
border-bottom: none;
......
<template>
<vue-viewer
:thumb="imgList[0]"
:full="imgList">
</vue-viewer>
</template>
<script>
export default {
name: "isTest",
data() {
return {
imgList: [
'https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1550224739247&di=512032866bea6329b1e46c735d50ac8b&imgtype=0&src=http%3A%2F%2Fimglf2.ph.126.net%2FdHH6OM2rD8JucPGAotUfag%3D%3D%2F6608219914074710297.jpg',
'https://ss0.baidu.com/6ONWsjip0QIZ8tyhnq/it/u=488030022,1694816207&fm=173&app=25&f=JPEG?w=580&h=347&s=A08FB35A5E0616C664F5631C030010D6',
'https://ss0.baidu.com/6ONWsjip0QIZ8tyhnq/it/u=2574767313,3929397124&fm=173&app=25&f=JPEG?w=580&h=868&s=B784EEA3460236E17A1F137F0300A058'
]
}
}
}
</script>
<style scoped>
</style>
......@@ -312,10 +312,10 @@
if(!this.plateMap[item.adminRegionName]) {
this.plateMap[item.adminRegionName] = item.resultRegionDTOS
}
if(item.resultRegionDTOS && item.resultRegionDTOS.length > 0 && !this.regionVal && !this.plateVal) {
if(item.adminRegionId === '86fab0c4cf485c649ba4ee3df23b4fc6') {
this.plateOptions = item.resultRegionDTOS
this.regionVal = item.adminRegionName
this.plateVal = item.resultRegionDTOS[0].regionName
this.plateVal = item.resultRegionDTOS.find(item => { return item.regionId === 'e569ab6db18756eb04192f8cde95b25d' }).regionName
this.timeVal = new Date().getFullYear()
}
})
......
......@@ -2,18 +2,20 @@
<el-card :body-style="{ padding: '5px 0 10px 0' }">
<section class="propertiesMain" v-loading.body="propertyLoading">
<header class="header">
<div class="back">
<el-button type="primary" size="small" @click="goBackToQuery">返回</el-button>
</div>
<div class="name">
{{propertyData.projectInformation.name}}
</div>
<div class="bannerOptions">
<el-radio-group v-model="bannerType">
<el-radio-button :label="0">总图</el-radio-button>
<el-radio-button :label="1">立面</el-radio-button>
<el-radio-button :label="2">户型</el-radio-button>
</el-radio-group>
<div class="headerMain">
<div class="back">
<el-button type="primary" size="small" @click="goBackToQuery">返回</el-button>
</div>
<div class="name">
{{propertyData.projectInformation.name}}
</div>
<div class="bannerOptions">
<el-radio-group v-model="bannerType" @change="scorllTop">
<el-radio-button :label="0">总图</el-radio-button>
<el-radio-button :label="1">立面</el-radio-button>
<el-radio-button :label="2">户型</el-radio-button>
</el-radio-group>
</div>
</div>
</header>
<main class="detailMain">
......@@ -31,7 +33,7 @@
<!-- 户型信息 只在banner类型为户型时才显示-->
<div class="unitInformation" v-if="bannerType === 2">
<div style="padding: 15px 5px;width: 98%;margin: 0 auto" align="center">
<multi-header-table :header-width="60" :body-width="40" :header-data="multiHeader" :table-data="hxObjectData"></multi-header-table>
<multi-header-table :zoom="0.65" :header-width="60" :body-width="40" :header-data="multiHeader" :table-data="hxObjectData"></multi-header-table>
</div>
</div>
</div>
......@@ -73,7 +75,7 @@
</el-table-column>
</el-table>
</div>
<div style="margin: 15px" v-if="item.remarks">{{`*${item.remarks}`}}</div>
<div style="margin: 15px;font-size: 14px;color: #cccccc" v-if="item.remarks">{{`*${item.remarks}`}}</div>
</div>
</div>
......@@ -140,7 +142,13 @@
<div class="haveData" v-else>
<el-col :span="12">
<!-- 各房 庭室数量数据-->
<ve-ring v-if="houseUnitCharts.rows.length > 0" :data="houseUnitCharts" :legend="{ bottom: 0 }" :colors="colorArr" :settings="supplySettings"></ve-ring>
<ve-ring
v-if="houseUnitCharts.rows.length > 0"
:data="houseUnitCharts"
:legend="{ bottom: 0 }"
:colors="colorArr"
:settings="supplySettings"
:title="{ text: '供应套数占比', textStyle: { fontSize: '13' }, left: 0, top: '10px', right: 0, bottom: 0}"></ve-ring>
<div v-else style="height: 400px;display: flex;align-items: center">
<div style="width: 50%;text-align: center;margin: auto">
<svg-icon icon-class="noData" style="width: 250px;height: 250px" />
......@@ -271,6 +279,11 @@
labelMap: {
production: '产品类型',
supplication: '产品提供数'
},
label: {
formatter: (params) => {
return params.data.name + ':' + params.data.value + '(' + this.productionSupplyMap[params.data.name] + ')'
}
}
},
// 各房面积区间 供应数量图饼
......@@ -374,7 +387,10 @@
exportHouseInfoSave: [],
// 暂无数据变量
supplyNoDataFlag: false,
propertyExportLoading: false
propertyExportLoading: false,
productionSupplyMap: {
}
}
},
methods: {
......@@ -575,9 +591,19 @@
queryPropertyProductionAnalysis() {
queryAnalysisById(this.propertyId).then(res => {
// 饼图图表数据
res.data.pieDetilDtoList = res.data.pieDetilDtoList.filter(item => {
return item.supplication > 0
})
this.houseUnitCharts.rows = res.data.pieDetilDtoList
let suppyNum = 0
res.data.pieDetilDtoList.forEach(item => {
suppyNum += item.supplication
})
res.data.pieDetilDtoList.forEach(item => {
if(item.supplication && item.supplication > 0) {
this.houseUnitCharts.rows.push(item)
if(suppyNum === 0 && item.supplication === 0) {
this.productionSupplyMap[item.productionPie] = 0 + '%'
} else {
this.productionSupplyMap[item.productionPie] = Number((item.supplication / suppyNum) * 100).toFixed(2) + '%'
}
})
// res.data.pieDetilDtoList.map((item, index) => {
......@@ -630,6 +656,9 @@
})
return e
})
},
scorllTop() {
document.getElementById('htmlMain').scrollTop = 0
}
},
computed: {
......@@ -663,25 +692,33 @@
<style scoped lang="stylus">
.propertiesMain{
padding 0 20px
position relative
.header{
height 50px
line-height 50px
padding 0 10px 0 80px
position relative
overflow hidden
margin-bottom 15px
.back {
position absolute
left 0
}
.name {
float left
font-size 22px
font-family "Arial Black"
font-weight bold
}
.bannerOptions {
float right
.headerMain {
width: calc(100vw - 279px);
position: fixed;
padding 0 10px 0 80px
overflow hidden
background-color: transparent;
z-index 9999
box-sizing border-box
.back {
position absolute
left 0
}
.name {
float left
font-size 22px
font-family "Arial Black"
font-weight bold
}
.bannerOptions {
float right
}
}
}
.detailMain{
......@@ -837,8 +874,9 @@
}
}
.unitPicture{
width 100%
height 50%
width 60%;
height 98%;
margin 0 auto;
.el-carousel--horizontal{
height 100%
.el-carousel__container{
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment