<template> <view> <cu-custom bgColor="bg-blue" :isBack="true" backUrl="/pages/indexcf/indexcf"> <block slot="content">楼宇列表</block> </cu-custom> <view :style="[{top:CustomBar + 'px'}]"> <view class="search-box"> <view class="choose-box"> <jp-picker v-model="parkId" rangeKey="label" rangeValue="value" :range="parkList" empty="选择园区"> </jp-picker> </view> <view class="input-box"> <input type="text" placeholder="请输入楼宇名称" v-model="curWord" confirm-type="search"></input> </view> <text class="cuIcon-search color-white" @click="doSearch"></text> </view> <view> <view class="cu-item" :class="modalName=='move-box-'+ index?'move-cur':''" v-for="(item, index) in buildList" :key="index"> <view class="item-box" @click="gotoBuildInfo(item.id)"> <view class="item-title"> <view> <text class="line-zs"></text>{{item.buildingName}}(<text class="subtitle">{{item.parkName}}</text>) </view> </view> <view class="item-line"> <view class="item-name">楼宇总面积:</view> <view class="item-content">{{item.buildingArea}}㎡</view> </view> <view class="item-line"> <view class="item-name">楼宇企业数:</view> <view class="item-content">{{item.reserve3}}</view> </view> <view class="item-line"> <view class="item-name">楼宇联系人:</view> <view class="item-content">{{item.buildingContacts.substring(0,5)}}({{item.reserve2}}) </view> </view> </view> </view> </view> </view> <view style="height: 20rpx;"></view> </view> </template> <script> import loginService from '@/api/auth/loginService.js' export default { onShow(option) {}, components: {}, data() { return { searchForm: {}, curWord: "", //当前搜索关键词 dataList: [], // 数据列表 buildList: [{ "id": "23082c03aeb4464ea1b4577125a56767", "createDate": "2024-12-17 17:52:47", "createBy": "1506167921787850753", "updateDate": "2024-12-19 11:39:38", "updateBy": "1", "delFlag": 0, "parkManagementId": "c8c61706e1e3430ca4fdd8413e7b6704", "parkName": "人工智能港", "buildingName": "B3", "buildingLongitude": "120.11693", "buildingLatitude": "33.328376", "buildingContacts": "吉祥", "buildingDescribe": "", "buildingNum": "8", "buildingArea": "8081", "buildingIndustry": "", "placeSelectName": "盐城市/盐都区", "place": "320900/320903/320903004", "street": "1", "placeDetailed": "", "placeSelectType3": "320900", "placeSelectType4": "320903", "placeSelectType5": "320903004", "picture": "", "notes": "", "reserve2": "13813223933", "reserve3": "0", "reserve4": "1", "reserve9": "00003" }, { "id": "5a8400338b834360a8e029f8bc73f0d4", "createDate": "2024-12-17 17:51:02", "createBy": "1506167921787850753", "updateDate": "2024-12-17 17:51:02", "updateBy": "1506167921787850753", "delFlag": 0, "parkManagementId": "c8c61706e1e3430ca4fdd8413e7b6704", "parkName": "人工智能港", "buildingName": "B1", "buildingLongitude": "120.118174", "buildingLatitude": "33.328787", "buildingContacts": "葛金霞", "buildingDescribe": "", "buildingNum": "28", "buildingArea": "58077", "buildingIndustry": "", "placeSelectName": "盐城市/盐都区", "place": "320900/320903/320903004", "street": "1", "placeDetailed": "", "placeSelectType3": "320900", "placeSelectType4": "320903", "placeSelectType5": "320903004", "picture": "", "notes": "", "reserve2": "18752233653", "reserve3": "0", "reserve4": "1", "reserve9": "00001" }, { "id": "6a87501c27c44b83875c7ef65702247b", "createDate": "2024-12-17 11:36:10", "createBy": "1506167921787850753", "updateDate": "2024-12-17 17:03:18", "updateBy": "1506167921787850753", "delFlag": 0, "parkManagementId": "c8c61706e1e3430ca4fdd8413e7b6704", "parkName": "人工智能港", "buildingName": "B6", "buildingLongitude": "120.114055", "buildingLatitude": "33.327644", "buildingContacts": "徐玲玲", "buildingDescribe": "特种领域机器人项目,重点开展机器人成品、终端、配套零部件等的研发、生产、测试", "buildingNum": "", "buildingArea": "23946", "buildingIndustry": "人工智能", "placeSelectName": "盐城市/盐都区", "place": "320900/320903/320903004", "street": "1", "placeDetailed": "", "placeSelectType3": "320900", "placeSelectType4": "320903", "placeSelectType5": "320903004", "picture": "", "notes": "", "reserve2": "15161991110", "reserve3": "4", "reserve4": "3", "reserve9": "00006" }, { "id": "92456d83820b4def9a327380479d2e79", "createDate": "2024-12-17 17:06:00", "createBy": "1506167921787850753", "updateDate": "2024-12-17 17:06:34", "updateBy": "1506167921787850753", "delFlag": 0, "parkManagementId": "c8c61706e1e3430ca4fdd8413e7b6704", "parkName": "人工智能港", "buildingName": "B7", "buildingLongitude": "120.113098", "buildingLatitude": "33.328809", "buildingContacts": "朱海扬", "buildingDescribe": "", "buildingNum": "8", "buildingArea": "10771", "buildingIndustry": "智能穿戴、智能驾驶以及低空经济", "placeSelectName": "盐城市/盐都区", "place": "320900/320903/320903004", "street": "1", "placeDetailed": "", "placeSelectType3": "320900", "placeSelectType4": "320903", "placeSelectType5": "320903004", "picture": "", "notes": "", "reserve2": "18551557883", "reserve3": "0", "reserve4": "2", "reserve9": "00007" }, { "id": "9530e29bb7b54a62b5aaafd4293c0426", "createDate": "2024-12-17 17:51:50", "createBy": "1506167921787850753", "updateDate": "2024-12-19 11:25:02", "updateBy": "1506167921787850753", "delFlag": 0, "parkManagementId": "c8c61706e1e3430ca4fdd8413e7b6704", "parkName": "人工智能港", "buildingName": "B2", "buildingLongitude": "120.117518", "buildingLatitude": "33.328421", "buildingContacts": "王坚", "buildingDescribe": "", "buildingNum": "8", "buildingArea": "8760", "buildingIndustry": "", "placeSelectName": "盐城市/盐都区", "place": "320900/320903/320903004", "street": "1", "placeDetailed": "", "placeSelectType3": "320900", "placeSelectType4": "320903", "placeSelectType5": "320903004", "picture": "", "notes": "", "reserve2": "18752225310", "reserve3": "0", "reserve4": "1", "reserve9": "00002" }, { "id": "988c362fbcc943bab5fe0b2eded42b7e", "createDate": "2024-11-11 11:42:41", "createBy": "1", "updateDate": "2024-12-17 17:04:20", "updateBy": "1506167921787850753", "delFlag": 0, "parkManagementId": "c8c61706e1e3430ca4fdd8413e7b6704", "parkName": "人工智能港", "buildingName": "B10", "buildingLongitude": "120.112258", "buildingLatitude": "33.330872", "buildingContacts": "程岑", "buildingDescribe": "", "buildingNum": "8", "buildingArea": "10771", "buildingIndustry": "专业生物科技楼宇", "placeSelectName": "盐城市/盐都区", "place": "320900/320903/320903004", "street": "1", "placeDetailed": "", "placeSelectType3": "320900", "placeSelectType4": "320903", "placeSelectType5": "320903004", "picture": "", "notes": "", "reserve2": "18551041889", "reserve3": "4", "reserve4": "3", "reserve9": "00010" }, { "id": "a006ed5dec5b458780605774d89ac190", "createDate": "2024-11-11 11:43:22", "createBy": "1", "updateDate": "2024-12-17 17:03:06", "updateBy": "1506167921787850753", "delFlag": 0, "parkManagementId": "c8c61706e1e3430ca4fdd8413e7b6704", "parkName": "人工智能港", "buildingName": "B5", "buildingLongitude": "120.115007", "buildingLatitude": "33.327686", "buildingContacts": "虎翅云工厂盐城数字中心胡生", "buildingDescribe": "", "buildingNum": "8", "buildingArea": "8760", "buildingIndustry": "打造人工智能技术应用中心,不仅要有孵化的功能,也要呈现出从产品到商品的过程,要在探索应用上做努力", "placeSelectName": "盐城市/盐都区", "place": "320900/320903/320903004", "street": "1", "placeDetailed": "", "placeSelectType3": "320900", "placeSelectType4": "320903", "placeSelectType5": "320903004", "picture": "", "notes": "", "reserve2": "18021471090", "reserve3": "9", "reserve4": "3", "reserve9": "00005" }, { "id": "bda3cf0285964785adb49036f8144842", "createDate": "2024-11-11 11:44:07", "createBy": "1", "updateDate": "2024-12-19 11:24:33", "updateBy": "1506167921787850753", "delFlag": 0, "parkManagementId": "c8c61706e1e3430ca4fdd8413e7b6704", "parkName": "人工智能港", "buildingName": "B9", "buildingLongitude": "120.112546", "buildingLatitude": "33.330212", "buildingContacts": "朱敏", "buildingDescribe": "", "buildingNum": "8", "buildingArea": "10771", "buildingIndustry": "工业数字经济", "placeSelectName": "盐城市/盐都区", "place": "320900/320903/320903004", "street": "1", "placeDetailed": "", "placeSelectType3": "320900", "placeSelectType4": "320903", "placeSelectType5": "320903004", "picture": "", "notes": "", "reserve2": "18861985358", "reserve3": "22", "reserve4": "3", "reserve9": "00009" }, { "id": "fbb6ca3417804c4db5a5b635103a4a2c", "createDate": "2024-11-11 11:42:57", "createBy": "1", "updateDate": "2024-12-19 11:24:42", "updateBy": "1506167921787850753", "delFlag": 0, "parkManagementId": "c8c61706e1e3430ca4fdd8413e7b6704", "parkName": "人工智能港", "buildingName": "B4", "buildingLongitude": "120.115636", "buildingLatitude": "33.327882", "buildingContacts": "启迪信通-滕鹏飞", "buildingDescribe": "", "buildingNum": "8", "buildingArea": "8800", "buildingIndustry": "人工智能方向的孵化功能", "placeSelectName": "盐城市/盐都区", "place": "320900/320903/320903004", "street": "1", "placeDetailed": "", "placeSelectType3": "320900", "placeSelectType4": "320903", "placeSelectType5": "320903004", "picture": "", "notes": "", "reserve2": "18921876099", "reserve3": "46", "reserve4": "3", "reserve9": "00004" }, { "id": "fee838a5d36243f08bf45cbf2709e0b9", "createDate": "2024-11-11 11:43:36", "createBy": "1", "updateDate": "2024-12-17 17:03:51", "updateBy": "1506167921787850753", "delFlag": 0, "parkManagementId": "c8c61706e1e3430ca4fdd8413e7b6704", "parkName": "人工智能港", "buildingName": "B8", "buildingLongitude": "120.112815", "buildingLatitude": "33.329514", "buildingContacts": "徐大勇", "buildingDescribe": "", "buildingNum": "8", "buildingArea": "10771", "buildingIndustry": "元宇宙产业", "placeSelectName": "盐城市/盐都区", "place": "320900/320903/320903004", "street": "1", "placeDetailed": "", "placeSelectType3": "320900", "placeSelectType4": "320903", "placeSelectType5": "320903004", "picture": "", "notes": "", "reserve2": "13375250860", "reserve3": "33", "reserve4": "3", "reserve9": "00008" }], modalName: null, tablePage: { total: 0, currentPage: 1, pageSize: 10, orders: [] }, loading: false, parkList: [], parkId: '', stype: '', // 企业 => 3 楼宇 => 2 园区 => 1 zfadmin => 4 admin=> 5 } }, created() { }, methods: { // 新增 add() { uni.navigateTo({ url: '/pages/buildEdit/buildEdit' }) }, getParkList() { loginService.parkList({ current: 1, size: 1000000, }).then(({ data }) => { this.parkList = data.records.map((item) => { return { label: item.parkName, value: item.id } }) console.log(this.parkList, '=============>') }).catch(e => { console.log(e) }) }, // 修改 edit(id) { uni.navigateTo({ url: '/pages/buildEdit/buildEdit?id=' + id }) }, gotoBuildInfo(id) { uni.navigateTo({ url: `/pages/buildEditcf/buildEditcf?id=${id}&ischeck=1` }) }, // 删除 del(id) { uni.showModal({ title: '提示', content: '您确认要删除数据吗', showCancel: true, success: (res) => { if (res.confirm) { loginService.delete(id).then(({ data }) => { uni.showToast({ title: data, icon: "success" }) this.doSearch() }) } } }); }, /*获取数据列表 */ upCallback(page) { this.loading = true loginService.list({ current: page.num, size: page.size, buildingName: this.curWord, }).then(({ data }) => { let curPageData = data.records this.mescroll.endBySize(curPageData.length, data.total); //如果是第一页需手动制空列表 if (page.num == 1) { this.dataList = []; } //追加新数据 this.dataList = this.dataList.concat(curPageData); }).catch(e => { //联网失败, 结束加载 this.mescroll.endErr(); }) }, // 输入监听 inputWord(e) { }, // 搜索 doSearch(word) { this.dataList = []; // 先清空列表,显示加载进度 this.mescroll.resetUpScroll(); }, // ListTouch触摸开始 ListTouchStart(e) { this.listTouchStart = e.touches[0].pageX }, // ListTouch计算方向 ListTouchMove(e) { this.listTouchDirection = e.touches[0].pageX - this.listTouchStart > -60 ? 'right' : 'left' }, // ListTouch计算滚动 ListTouchEnd(e) { if (this.listTouchDirection == 'left') { this.modalName = e.currentTarget.dataset.target } else { this.modalName = null } this.listTouchDirection = null } } } </script> <style> .ellipsis-description { font-size: 12px; line-height: $line-height-base; display: -webkit-box; /*作为弹性伸缩盒子模型显示*/ -webkit-line-clamp: 1; /*显示的行数;如果要设置2行加...则设置为2*/ overflow: hidden; /*超出的文本隐藏*/ text-overflow: ellipsis; /* 溢出用省略号*/ -webkit-box-orient: vertical; /*伸缩盒子的子元素排列:从上到下*/ } .item-box { width: 710rpx; margin-left: 20rpx; background: #FFFFFF; box-shadow: 0px 1px 3px 0px rgba(9, 2, 4, 0.1); border-radius: 10px; padding-top: 20rpx; padding-left: 38rpx; padding-right: 10rpx; margin-top: 20rpx; } .item-title { position: relative; display: flex; justify-content: space-between; font-size: 30rpx; color: #333; font-weight: bold; align-items: center; } .item-line { display: flex; height: 48rpx; margin-top: 20rpx; } .subtitle { color: #E5880E; } .item-name { font-size: 30rpx; color: #333; } .item-content { color: #1497EF; font-size: 30rpx; } .btn-box { display: flex; } .line-zs { width: 2rpx; height: 30rpx; background: #36A7F3; } .edit-botton { width: 100rpx; height: 48rpx; line-height: 48rpx; color: #fff; font-size: 28rpx; margin-right: 20rpx; border-radius: 10rpx; background: #5A9EE9; text-align: center; } .del-botton { width: 100rpx; height: 48rpx; line-height: 48rpx; color: #fff; font-size: 28rpx; margin-right: 20rpx; border-radius: 10rpx; background: #F27C85; text-align: center; } .color-white { color: #fff; font-size: 40rpx; line-height: 60rpx; } .search-box { background: #36A7F3; display: flex; padding-left: 20rpx; padding-right: 20rpx; padding-bottom: 10rpx; } .input-box { margin-left: 20rpx; background: #fff; height: 60rpx; width: 420rpx; display: flex; align-items: center; border-radius: 30rpx; padding-left: 10rpx; margin-right: 20rpx; } .choose-box { background: #fff; width: 200rpx; border-radius: 30rpx; height: 60rpx; display: flex; align-items: center; justify-content: center; } .cu-bar .search-form { background-color: white; } </style>