diff --git a/pages/details/details.scss b/pages/details/details.scss
index a085ef3..398c698 100644
--- a/pages/details/details.scss
+++ b/pages/details/details.scss
@@ -1,146 +1,162 @@
.page {
- position: absolute;
+ position: relative;
width: 100%;
// height: 100%;
overflow-x: hidden;
// overflow-y: auto;
}
-/* banner 标题 */
-.banner-title{
- background-color: #FFFFFF;
- padding-bottom: 20rpx;
-}
-/* banner */
-.banner{
+// 图片
+.banner-img {
width: 100%;
- height: 450rpx;
- .screen-swiper{
- width: 100%;
- height: 100%;
- }
+ height: 30vh;
}
-/* 价格 */
-.price-info{
- display: flex;
- align-items: center;
- justify-content: space-between;
- padding: 0 4%;
- margin: 20rpx 0;
- .price{
- font-size: 28rpx;
- text {
- font-size: 24rpx;
- color: #aaaaaa;
+// 商铺信息
+.banner {
+ position: absolute;
+ top: calc(30vh - 30rpx);
+ width: 100%;
+ margin-top: -20rpx;
+ border-radius: 30rpx;
+ background-color: #fff;
+ padding: 26rpx 34rpx 100rpx;
+ .banner-item {
+ border-bottom: 2rpx solid #EBEBEB;
+ padding-bottom: 32rpx;
+ .banner-item-title {
+ font-size: 28rpx;
+ font-weight: 700;
+ line-height: 48rpx;
+ margin-top: 30rpx;
}
- .price-num {
- font-weight: bold;
- color: #ff7337;
- font-size: 40rpx;
- margin-top: 20rpx;
+ .banner-item-form {
+ .form-item {
+ display: flex;
+ justify-content: flex-start;
+ align-items: top;
+ padding: 8rpx 0;
+ }
+ }
+ &:last-child {
+ border-bottom: unset;
}
}
- .price-line {
- width: 2rpx;
- height: 80rpx;
- background-color: #f4f4f4;
- }
-}
-/* 标题 */
-.goods-title{
- padding: 0 4%;
- margin: 40rpx auto;
- text{
- font-size: 34rpx;
- color: #000;
- font-weight: bold;
- }
-}
-.goods-icon {
- display: flex;
- margin: 0 20rpx;
- .goods-icon-list {
- background-color: #f1fff6;
- color:#4fa477;
- font-size: 24rpx;
- display: inline-block;
- padding: 10rpx 20rpx;
- margin-right: 10rpx;
- }
-}
-/* 评价 */
-.evaluate-data{
- padding: 0 4%;
- margin: 20rpx auto;
- background-color: #FFFFFF;
- overflow: hidden;
- .title-more{
- display: flex;
- align-items: center;
- justify-content: space-between;
- width: 100%;
- height: 100rpx;
- .title{
+ // 基础信息
+ .info {
+ .info-title {
+ font-weight: bold;
+ font-size: 32rpx;
+ margin-bottom: 24rpx;
+ span {
+ display: inline-block;
+ padding: 0 8rpx;
+ }
+ }
+ .info-text {
+ margin-bottom: 30rpx;
+ }
+ .info-racord {
display: flex;
+ justify-content: space-between;
align-items: center;
- height: 100%;
- text{
- font-size: 30rpx;
- color: #000;
+ .info-price {
+ color: #31AA6A;
+ span {
+ font-size: 40rpx;
+ font-weight: 700;
+ margin-right: 4rpx;
+ }
}
}
- .more{
+ }
+ // 场地信息
+ // 位置信息
+ .position {
+ .position-info {
display: flex;
align-items: center;
- text{
- font-size: 26rpx;
- color: #212121;
+ flex-direction: row;
+ margin: 38rpx 22rpx;
+ background-color: #fff;
+ font-size: 24rpx;
+ padding: 20rpx 16rpx;
+ line-height: 30rpx;
+ border-radius: 14rpx;
+ text {
+ margin-left: 10rpx;
}
}
}
- .evaluate-list{
- width: 100%;
- .content{
+ // 周边商铺
+ .other-business {
+ .scroll-view_H {
+ white-space: nowrap;
width: 100%;
- .character{
- display: flex;
- align-items: center;
- padding: 10rpx 0;
- text{
- font-size: 26rpx;
- color: #333333;
+ }
+ .scroll-view-item_H {
+ display: inline-block;
+ width: 210rpx;
+ margin-right: 22rpx;
+ &:last-child {
+ margin-right: 0;
+ }
+ .business-card {
+ width: 100%;
+ .u-image {
+ overflow: hidden !important;
+ border-radius: 20rpx !important;
+ }
+ .business-card-title {
+ width: 100%;
+ overflow : hidden;/*必须结合的属性,当内容溢出元素框时发生的事情*/
+ text-overflow: ellipsis;/*可以用来多行文本的情况下，用省略号“…”隐藏超出范围的文本 。*/
+ // display: -webkit-box;/*必须结合的属性 ，将对象作为弹性伸缩盒子模型显示 。*/
+ // -webkit-line-clamp: 2;/*用来限制在一个块元素显示的文本的行数。*/
+ // -webkit-box-orient: vertical;/*必须结合的属性 ，设置或检索伸缩盒对象的子元素的排*/
+ line-height: 30rpx;
+ margin: 10rpx 0;
+ padding: 0 10rpx;
+ }
+ .business-card-item {
+ padding: 0 10rpx;
+ font-weight: 400;
+ font-size: 20rpx;
+ color: #676767;
+ line-height: 1.5;
+ span {
+ font-weight: 700;
+ font-size: 30rpx;
+ color: #000000;
+ }
}
}
}
}
}
+
/* 底部 */
.page-footer{
position: fixed;
left: 0;
bottom: 0;
display: flex;
+ align-items: center;
+ justify-content: center;
width: 100%;
- height: 100rpx;
+ height: 125rpx;
background-color: #FFFFFF;
padding-bottom: constant(safe-area-inset-bottom);
padding-bottom: env(safe-area-inset-bottom);
- .footer-buy{
+ .footer-btn {
display: flex;
+ width: 70vw;
+ }
+ .footer-service {
+ display: flex;
+ flex-direction: column;
align-items: center;
- justify-content: space-between;
- width: 100%;
- height: 100%;
- .cart-add{
- display: flex;
- align-items: center;
- justify-content: center;
- width: 100%;
- height: 100rpx;
- background-color: #3f9b6a;
- text{
- font-size: 28rpx;
- color: #FFFFFF;
- }
+ text {
+ margin-top: 6rpx;
+ line-height: 42rpx;
}
}
-}
+}
\ No newline at end of file
diff --git a/pages/details/details.vue b/pages/details/details.vue
index f242632..0089a9b 100644
--- a/pages/details/details.vue
+++ b/pages/details/details.vue
@@ -1,78 +1,97 @@
-
-
-
-
-
-
-
-
-
-
-
-
-
- {{tableList.shopName}}
-
-
- 靠近地铁
- 采光好
-
-
-
-
- 单价（元/m²/月）
- 100
-
-
-
- 面积（m²）
- 265
+
+
+
+
+
+
+ {{tableData.shopName}}{{tableData.venueNumber}}，
+ {{tableData.detailedLocation}}
+
+
+
+ {{tableData.shopDescription}}
+
+ 1000元/月
+ 2456人有意向
+
-
-
- 月租金（元/月）
- 26500
+
+ 场地信息
+
+
+ 场地类型：
+ {{tableData.architecturalForm}}
+
+
+ 实际使用面积：
+ {{tableData.actualUsableArea}}
+
+
+ 所属区域：
+ {{tableData.belongingRegion}}
+
+
+ 规划图纸：
+
+
+ 暂无
+
+
+
+
+
+
+
+ 位置描述：
+ {{tableData.detailedLocation}}
+
+
-
-
- 2押1付
- 使用率80%
-
-
-
-
-
-
- 更多信息
-
-
-
-
-
-
-
-
- 地址：{{tableList.detailedLocation}}
-
-
- 业态：零售
-
-
- 招商要求：不可使用明火
-
-
-
-
+
+ 位置信息
+
+
+
+
+
+ 周边商铺
+
+
+
+
+
+
+ 这里是标题这里是标题这里是标题这里是标题这里是标题
+
+ 租金：￥1067/月
+ 面积：81/m2
+
+
+
+
+
+
@@ -82,22 +101,26 @@
export default {
data() {
return {
- tableList:{},
- swiperList: [
- {
- id: 0,
- type: 'image',
- url: this.$imgUrl('/img/1.jpg')
- }
- ],
+ tableData:{},
+ swiperList: [
+ {
+ id: 0,
+ type: 'image',
+ url: this.$imgUrl('/img/1.jpg')
+ }
+ ],
+ latitude: 39.909,
+ longitude: 116.39742,
};
},
onLoad(option){
- this.tableList = JSON.parse(option.item)
- this.swiperList[0].url = this.tableList.displayMainImage || this.tableList.locationDiagram
- console.log( this.swiperList)
- console.log( this.tableList)
-
+ let data = JSON.parse(option.item)
+ this.swiperList[0].url = data.displayMainImage || data.locationDiagram
+ this.tableData = data;
+ let location = JSON.parse(data.mapPunctuation)
+ this.latitude = location.latitude;
+ this.longitude = location.longitude;
+ console.log(this.swiperList, this.tableData);
},
methods: {
leaseAdd(){
diff --git a/pages/leaseAdd/leaseAdd.scss b/pages/leaseAdd/leaseAdd.scss
index a9722a7..d50de53 100644
--- a/pages/leaseAdd/leaseAdd.scss
+++ b/pages/leaseAdd/leaseAdd.scss
@@ -3,9 +3,13 @@
left: 0;
top: 0;
width: 100%;
- height: 100%;
+ overflow-y: scroll;
+ height: calc(100% - 120rpx);
background-color: #f6f6f6;
}
+.steps-box {
+ padding-top: 40rpx;
+}
.add-list{
padding: 0 4%;
@@ -13,7 +17,6 @@
border-radius: 20rpx;
margin-top: 20rpx;
width: 100%;
- padding-bottom: 150rpx;
.list{
display: flex;
justify-content: space-between;
@@ -56,6 +59,38 @@
}
}
}
+ .deom-box {
+ width: 100vw;
+ display: flex !important;
+ padding: 14rpx 0;
+ background-color: #FFFFFF;
+ border-radius: 9px;
+ // margin-top: 9px;
+ width: 100%;
+ // .u-upload {
+ // .u-add-wrap {
+ // width: 304rpx !important;
+ // height: 182rpx !important;
+ // }
+ // }
+ // .u-upload {
+ // height: 88px;
+ // width: 155px;
+ // background: url(/static/images/uploadID1.png);
+ // background-size:134rpx 188rpx;
+ // background-repeat:no-repeat;
+ // }
+ .img-deom {
+ flex: 1;
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ padding: 20rpx;
+ text {
+ margin-top: 18rpx;
+ }
+ }
+ }
}
/* 保存按钮 */
@@ -64,8 +99,9 @@
left: 0;
bottom: 0;
display: flex;
+ align-items: center;
width: 100%;
- height: 100rpx;
+ height: 125rpx;
background-color: #FFFFFF;
padding-bottom: constant(safe-area-inset-bottom);
padding-bottom: env(safe-area-inset-bottom);
diff --git a/pages/leaseAdd/leaseAdd.vue b/pages/leaseAdd/leaseAdd.vue
index 509ae89..d9b0b99 100644
--- a/pages/leaseAdd/leaseAdd.vue
+++ b/pages/leaseAdd/leaseAdd.vue
@@ -1,109 +1,130 @@
-
-
-
- 租赁人姓名
- *
-
-
-
-
-
-
-
- 身份证号
- *
-
-
-
-
-
-
-
- 联系方式
- *
-
-
-
-
-
-
-
- 意向租期
- *
-
-
-
-
-
-
-
- 经营用途
- *
-
-
-
-
-
-
-
-
- 经营类型
- *
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
-
-
-
- 法人身份证正反面
- *
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
-
-
-
- 营业许可证
- *
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
-
-
-
-
-
-
-
-
-
-
- 餐饮服务许可证
- *
+
+
+
+
+
+
+
+
+ 点击上传证件人像面
+
+
+
+
+
+
+
+ 点击上传证件国徽面
+
+
+
+
+ 上传示例
+
+
+
+ 人脸示例图
+
+
+
+ 国徽面示例图
+
+
-
-
-
-
+ 请拍摄证件原件，保证照片拍摄清晰，取图完整，不反光。
+
+
+
+ 是
+ 否
+
+
+
+
+
-
+
-
@@ -112,6 +133,23 @@
export default {
data() {
return {
+ active: 2,
+ numList: [{name: '租赁信息'}, {name: '主体信息'}, {name: '经营者信息'}],
+ model1: {
+ name: '',
+ type: '',
+ typeShow: false,
+ fileList: [], // 文件列表
+ },
+ rules: {},
+ // 类型
+ showType: false,
+ activesType: [
+ {value: 1, label: '类型1'},
+ {value: 2, label: '类型2'},
+ ],
+ // 上传文件
+ active: '', // 地址
};
},
@@ -126,10 +164,21 @@
}
},
methods:{
+ typeChange(e) {
+ this.model1.type = e[0].label;
+ },
go(){
uni.navigateTo({
url: '/pages/record/record'
})
+ },
+ // 上一步
+ toBefor() {
+ this.active = +this.active - 1;
+ },
+ // 下一步
+ toNext() {
+ this.active = +this.active + 1;
}
}
}