chengdandan
/
shigongsi
Template
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

详情页修改

This commit is contained in:
徐克 2022-08-04 18:19:34 +08:00
parent 9a0e800f49
commit 38757ba031
2 changed files with 281 additions and 82 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

66
src/components/BasicBox4/index.vue
View File

@ -3,9 +3,9 @@
<div class="title">
<!-- <span class="icon"></span> -->
{{ title }}
</div>
<!-- <div>
<!-- <div>
<template>
<el-select v-model="valueData" class="timeStle1">
<el-option
@ -18,6 +18,12 @@
</el-select>
</template>
</div> -->
<div class="search-middle">
<div class="search-container" @click="search('111')">
<input type="text" name="" id="" placeholder="请输入名称点击查询" class="inputStyle">
<button>搜索</button>
</div>
</div>
<slot name="top"></slot>
<ul v-if="dataSource">
<li v-for="(item, index) in dataSource " :key="index">
@ -59,7 +65,7 @@ export default {
},
mounted() {
console.log(this.dataSource);
},
beforeDestroy() {
@ -71,6 +77,10 @@ export default {
</script>
<style lang="scss" scoped>
@import "~@/common/var.scss";
.timeStle1 {
@ -173,4 +183,54 @@ width: 100%;
}
}
.search-middle {
height: 45px;
background: rgba(16, 29, 37, 0.8);
border: 2px solid #29a3d3a1;
// width: 80%;
width: 95.6%;
float: right;
margin-right: 2%;
}
.search-middle .search-container {
position: relative;
width: 100%;
height: 100%;
}
.search-middle .search-container input:focus {
outline: none;
}
.search-middle .search-container input::-webkit-input-placeholder {
color: rgb(211, 245, 255);
}
.search-middle .search-container button {
width: 80px;
height: 100%;
position: absolute;
right: 0;
top: 0;
background-color: transparent;
background: 10px 10px url(../../assets/search-button.png) no-repeat;
border: 0;
border-radius: 0;
text-align: center;
line-height: 30px;
cursor: pointer;
padding-left: 20px;
color: #b4e9ff;
}
.inputStyle{
height: 40px;
background: rgba(16, 29, 37, 0.8);
border: 2px solid transparent;
// width: 80%;
width: 80%;
// float: right;
// margin-right: 2%;
color: #fff;
}
</style>

297
src/views/land/children/index.vue
View File

@ -19,39 +19,56 @@
<!-- <BasicBox2 class="basicInfo" :title="tit" :dataSource="workList" ></BasicBox2>
<BasicBox2 class="basicInfo" title="房产证信息" :dataSource="workListFCZ" v-show="fczShow"></BasicBox2> -->
<!-- <div v-for="item in floorInfo" :key="item.id" style="width:100px;height: auto;"> -->
<div v-if="val">
<div style=" margin-top: 4%;text-align: center;top: 1px;width: 182px;" @click=showChild()
v-show="!isShow">
<div v-show="val">
<div style=" margin-top: 4%;text-align: center;top: 1px;width: 182px;" v-show="!isShow"
v-for="(item,index) in floorNameQcData" :key="index">
<ul @click=showChild(item,index)>
<li class=" leftFloor">{{item}}</li>
</ul>
<ul>
<li class="leftFloor">{{floorInfo1.floor}}</li>
<div style="margin-top: 4%;text-align: center;top: 1px;" v-show="isShow"
v-for="(item,index) in departQcData" :key="index">
<ul @click="departSearch(item)">
<li class="leftFloor1">{{item}}</li>
</ul>
</div>
</ul>
</div>
<div style="margin-top: 4%;text-align: center;top: 1px;width: 182px;" @click=showChild() v-show="isShow">
<div style="margin-top: 4%;text-align: center;top: 1px;width: 182px;" v-show="isShow"
v-for="(item,index) in floorNameQcData" :key="index">
<ul @click=showChild()>
<li class="leftFloors">{{item}}</li>
</ul>
<ul>
<li class="leftFloors">{{floorInfo1.floor}}</li>
<div style="margin-top: 4%;text-align: center;top: 1px;" v-show="isShow"
v-for="(item,index) in departQcData" :key="index">
<ul @click="departSearch(item)">
<li class="leftFloor1">{{item}}</li>
</ul>
</div>
</ul>
</div>
</div>
<div v-else-if="!val">
<div style=" margin-top: 4%;text-align: center;top: 1px;width: 182px;" @click=showChild()
v-show="!isShow">
<ul>
<div v-show="!val">
<div style=" margin-top: 4%;text-align: center;top: 1px;width: 182px;" v-show="!isShow">
<ul @click=showChild()>
<li class="leftFloor">{{floorInfo}}</li>
</ul>
</div>
<div style="margin-top: 4%;text-align: center;top: 1px;width: 182px;" @click=showChild() v-show="isShow">
<ul>
<div style="margin-top: 4%;text-align: center;top: 1px;width: 182px;" v-show="isShow">
<ul @click=showChild()>
<li class="leftFloors">{{floorInfo}}</li>
</ul>
</div>
<div style="margin-top: 4%;text-align: center;top: 1px;" v-show="isShow"
v-for="(item,index) in departQcData" :key="index">
<ul @click="departSearch(item)">
<li class="leftFloor1">{{item}}</li>
</ul>
</div>
</div>
<div style="margin-top: 4%;text-align: center;top: 1px;" v-show="isShow"
v-for="(item,index) in departQcData" :key="index">
<ul>
<li class="leftFloor1">{{item}}</li>
</ul>
</div>
</div>
<!-- <div class="center">
@ -64,13 +81,15 @@
<BasicBox4 title="生产用房" :dataSource="false" :options="options" :valueData="valueData">
<!-- <template slot="top">
<customDvScrollBoard2 :config="config5
" :style="{ height: '650px', padding: '10px' }"></customDvScrollBoard2>
</template> -->
<template slot="top">
<customDvScrollBoard2 :config="config6
" :style="{ height: '650px', padding: '10px' }" :key="componentKey1" v-show="!isShow1">
</customDvScrollBoard2>
</template>
<template slot="top">
<customDvScrollBoard2 :config="config5
" :style="{ height: '650px', padding: '10px' }" :key="componentKey"></customDvScrollBoard2>
" :style="{ height: '650px', padding: '10px' }" :key="componentKey" v-show="isShow1">
</customDvScrollBoard2>
</template>
</BasicBox4>
</div>
@ -95,14 +114,23 @@ export default {
mixins: [drawMixin],
data() {
return {
componentKey:0,
arr: [],
componentKey: 0,
componentKey1: 0,
isShow1: true,
isShow2: true,
val: true,
isShow:true,
floorInfo: '',
floorInfo1: {},
isShow:false,
floorInfo: [],
floorInfo1: [],
departInfo: [],
tableData:[],
departQcData:[],
departInfo1: [],
tableData: [],
tableData1: [],
tableData2: [],
departQcData: [],
departQcData1: [],
floorNameQcData: [],
unityUrl:"/Publish/city-build/index.html",
titleData:"城北基地",
valueData: '38',
@ -276,6 +304,19 @@ export default {
],
columnWidth: [60],
},
config6: {
header: ['部门', '楼层', '房号', '名称'],
rowNum: 12,
data:
// [['2019', '2', '16.67%'],
// ['2021', '2', '16.67%'],
// ['2022', '5', '66.67%'],['无', '无', '无'],]
[
],
columnWidth: [60],
},
type:'',
tit:"不动产产权证信息",
@ -291,7 +332,6 @@ export default {
customDvScrollBoard2,
},
mounted() {
this.timeFn();
this.cancelLoading();
console.log("this.$route.params",this.$route.params.id)
@ -324,6 +364,12 @@ this.unityUrl="/Publish/city-build/index.html"
clearInterval(this.timing);
},
methods: {
//更新的点击事件
// showChild(item,type) {
// let fn = `this.showChild${type}(${item})`;
// eval(fn);
// console.log(fn);
// },
//重新渲染
forceRerender() {
this.componentKey ++;
@ -455,61 +501,89 @@ console.log("val",val)
axios.get('/json/'+val+ '.json')
.then(result => {
console.log('val', result.data)
this.arr = result.data
for (var a = 0; a < result.data.length; a++) {
//拿到楼号
that.floorInfo1 = result.data[0]
// that.floorInfo1.push(result.data[a].floorName)
// console.log(that.floorInfo1);
//判断楼号
var str = that.floorInfo1.floor;
var spstr = str.split("");
// var str = that.floorInfo1.floor;
// var spstr = str.split("");
//判断城南基地部分数字楼层拿到所有部门
if (spstr[spstr.length - 1] == 0) {
// if (spstr[spstr.length - 1] == 0) {
for (let i = 0; i < result.data.length; i++) {
that.floorInfo1.floor = val + '主楼'
var str1 = result.data[i].floor
var spstr1 = str1.split("");
if (spstr1[spstr1.length - 1] == 0) {
that.departInfo.push(result.data[i].depart)
that.tableData.push(Object.values(result.data[i]))
}
// that.floorInfo1.floor = val + '主楼'
// var str1 = result.data[i].floor
// var spstr1 = str1.split("");
// if (spstr1[spstr1.length - 1] == 0) {
// that.floorInfo.push(result.data[i].floorName)
that.floorInfo1.push(result.data[i].floorName)
// that.departInfo.push(result.data[i].depart)
// that.tableData.push(Object.values(result.data[i]))
// }
//表格数据
}
that.config5.data = that.tableData
// for (let v = 0; v < that.config5.data.length; v++) {
that.tableData.push(Object.values(result.data[i]))
}
for (let v = 0; v < that.tableData.length; v++) {
that.departInfo.push(that.tableData[v].slice(0, 4))
}
that.config5.data = that.departInfo
console.log(that.tableData);
const qcData = new Set(that.config5.data)
that.departQcData = qcData
//去除部门数组中的空字符串
// var newArr1 = that.departInfo.filter(i => i && i.trim())
//楼号去重
const qcData1 = new Set(that.floorInfo1)
that.floorNameQcData = qcData1
//去重
// const qcData = new Set(newArr1)
// that.departQcData = qcData
//拿到对应楼号对应部门
// for (let j = 0; j < result.data.length; j++) {
// if (that.floorNameQcData == result.data[j].floorName) {
// console.log(8989898);
// that.departInfo.push(result.data[j].depart)
// //表格数据
// // that.departInfo.push(result.data[j].depart)
// }
// }
//去除部门数组中的空字符串
// var newArr1 = that.departInfo.filter(i => i && i.trim())
//去重
// const qcData = new Set(newArr1)
// that.departQcData = qcData
// } else {
//拿到对应楼层对应部门
// for (let j = 0; j < result.data.length; j++) {
// if (that.floorInfo1.floor === result.data[j].floor) {
// that.departInfo.push(result.data[j].depart)
// //表格数据
// }
// }
// that.tableData.push(Object.values(result.data[]))
// that.config5.data = that.tableData
// for (let v = 0; v < that.config5.data.length; v++){
// that.config5.data[v].pop()
// }
//去除部门数组中的空字符串
var newArr1 = that.departInfo.filter(i => i && i.trim())
//去重
const qcData = new Set(newArr1)
that.departQcData = qcData
} else {
//拿到对应楼层对应部门
for (let j = 0; j < result.data.length; j++) {
if (that.floorInfo1.floor === result.data[j].floor) {
that.departInfo.push(result.data[j].depart)
//表格数据
that.tableData.push(Object.values(result.data[j]))
}
}
that.config5.data = that.tableData
for (let v = 0; v < that.config5.data.length; v++){
that.config5.data[v].pop()
}
console.log("that.config5",that.config5);
//去除部门数组中的空字符串
var newArr = that.departInfo.filter(i => i && i.trim())
// console.log(that.config5.data);
//去重
const qcData = new Set(newArr)
that.departQcData = qcData
// console.log("that.config5",that.config5);
// //去除部门数组中的空字符串
// var newArr = that.departInfo.filter(i => i && i.trim())
// // console.log(that.config5.data);
// //去重
// const qcData = new Set(newArr)
// that.departQcData = qcData
var arr = Object.entries(result.data(a))
console.log("arr", arr)
}
// }
}
@ -520,8 +594,8 @@ console.log("val",val)
// }else{
// }
} else if (val == "健康中心（安仁街变）" || val == "老卫生所" || val == "龙吟广场" || val == "栖霞基地") {
if (val == '健康中心（安仁街变）') {
} else if (val == "健康中心" || val == "老卫生所" || val == "龙吟广场" || val == "栖霞基地") {
if (val == '健康中心') {
that.floorInfo = "健康中心主楼"
} else {
that.floorInfo = val + "主楼"
@ -542,10 +616,11 @@ console.log("val",val)
//表格数据
that.tableData.push(Object.values(result.data[j]))
}
that.config5.data = that.tableData
for (let v = 0; v < that.config5.data.length; v++) {
that.config5.data[v].pop()
for (let v = 0; v < that.tableData.length; v++) {
that.departInfo1.push(that.tableData[v].slice(0, 4))
}
that.config5.data = that.departInfo1
//去除部门数组中的空字符串
var newArr = that.departInfo.filter(i => i && i.trim())
//去重
@ -569,8 +644,60 @@ console.log("val",val)
this.loading = false;
}, 500);
},
showChild() {
showChild(item, index) {
console.log(item);
this.isShow = !this.isShow
for (let i = 0; i < this.config5.data.length; i++) {
this.departInfo = this.config5.data[i]
// if (item == this.departInfo[2]) {
for (let a = 0; a < this.arr.length; a++) {
this.departQcData1.push(this.arr[a].depart)
console.log(this.arr[a].depart);
}
console.log(this.departQcData1);
//去除部门数组中的空字符串
var newArr = this.departQcData1.filter(i => i && i.trim())
// console.log(that.config5.data);
//去重
const qcData = new Set(newArr)
this.departQcData = qcData
console.log(this.departQcData);
}
// }
},
departSearch(item) {
console.log(item);
this.componentKey1++
this.isShow1 = false
var floorname = ''
this.floorNameQcData.forEach(function (item1, index, set) {
floorname = item1
})
if (floorname != '') {
for (let i = 0; i < this.config5.data.length; i++) {
this.tableData = this.config5.data[i]
if (item == this.tableData[0] && floorname == this.tableData[2]) {
this.tableData1.push(this.tableData)
}
}
this.config6.data = this.tableData1
console.log(this.config6.data);
this.tableData1 = []
} else {
for (let i = 0; i < this.config5.data.length; i++) {
this.tableData = this.config5.data[i]
if (item == this.tableData[0]) {
this.tableData1.push(this.tableData)
}
}
this.config6.data = this.tableData1
console.log(this.config6.data);
this.tableData1 = []
}
}
},
};
@ -598,6 +725,8 @@ console.log("val",val)
@ -816,7 +945,7 @@ h1 {
cursor: pointer;
}
.leftFloor1:hover {
background: url("~@/assets/landRes2/按钮默认.png")no-repeat;
// background: url("~@/assets/landRes2/按钮默认.png")no-repeat;
background-size: 100%;
width: 182px;
padding-top: 3%;
@ -825,5 +954,15 @@ h1 {
font-weight: 700;
font-size: 14px;
cursor: pointer;
background: url("~@/assets/landRes/boxX.png") no-repeat;
li {
color: #00fcff;
text-shadow: 0 0 5px #00fcff,
0 0 10px #00fcff,
0 0 15px #00fcff,
0 0 20px #00fcff;
}
}
</style>