소스 검색

[门店列表][修改]:[将门店列表封装成组件]

tags/河北版C.8.2.0^2
meo 5 년 전
부모
커밋
4331631f1d
11개의 변경된 파일184개의 추가작업 그리고 151개의 파일을 삭제
  1. +1
    -4
      components/banner/index.json
  2. +2
    -2
      components/banner/index.wxss
  3. +0
    -1
      components/navbar/navbar.js
  4. +78
    -0
      components/store/index.js
  5. +3
    -0
      components/store/index.json
  6. +19
    -0
      components/store/index.wxml
  7. +72
    -0
      components/store/index.wxss
  8. +5
    -48
      pages/coupon/detail/index.js
  9. +2
    -1
      pages/coupon/detail/index.json
  10. +2
    -19
      pages/coupon/detail/index.wxml
  11. +0
    -76
      pages/coupon/detail/index.wxss

+ 1
- 4
components/banner/index.json 파일 보기

@@ -1,6 +1,3 @@
{ {
"component": true,
"usingComponents": {
}
"component": true
} }

+ 2
- 2
components/banner/index.wxss 파일 보기

@@ -57,12 +57,12 @@
.itemImg{ .itemImg{
position: absolute; position: absolute;
width: 640rpx; width: 640rpx;
height: 248rpx;
height: 227rpx;
border-radius: 15rpx; border-radius: 15rpx;
overflow: hidden; overflow: hidden;
z-index: 5; z-index: 5;
opacity: 0.7; opacity: 0.7;
top: 15%;
top: 20%;
margin: 0 20rpx; margin: 0 20rpx;
} }
.active{ .active{


+ 0
- 1
components/navbar/navbar.js 파일 보기

@@ -48,6 +48,5 @@ Component({
back: false back: false
}) })
} }
console.debug()
} }
}) })

+ 78
- 0
components/store/index.js 파일 보기

@@ -0,0 +1,78 @@
const imgurl = require("../../utils/imgurl");
Component({
/**
* 组件的属性列表
*/
properties: {
merchantVoList: {
value: [],
type: Array
}
},

/**
* 组件的初始数据
*/
data: {
teljpgUrl: imgurl.teljpg.url,
showMore:true,
more: "点击查看更多",
hidden:"hidden",
height: ""
},
/**
* 组件的方法列表
*/
methods: {
/**
* 跳转到门店列表的详情页面
*/
gotoDetail(e) {
wx.navigateTo({
url: `/pages/index/searchbar/detail/index?id=${e.currentTarget.dataset.id}`
})
},
// 点击查看更多
more: function () {
let that = this;
if (that.data.more == '点击查看更多') {
this.setData({
hidden: "",
height: 'auto!important',
more: "点击收起",
showMore: true
})
} else {
that.setData({
hidden: "hidden",
height: 4 * 140 + 'rpx',
more: "点击查看更多",
showMore: true
})
}
},
phone: function (e) {
let that = this;
wx.makePhoneCall({
phoneNumber: e.target.dataset.merchantlinkphone
});
}
},
ready: function () {
let merchantVoList = this.properties.merchantVoList;
if (merchantVoList.length>0){
if (merchantVoList.length <= 4) {
this.setData({
height: merchantVoList.length * 140 + 'rpx',
showMore: false,
hidden:"hidden"
})
} else if (merchantVoList && merchantVoList.length > 4) {
this.setData({
height: 4 * 140 + 'rpx'
})
}
}
}
});

+ 3
- 0
components/store/index.json 파일 보기

@@ -0,0 +1,3 @@
{
"component": true
}

+ 19
- 0
components/store/index.wxml 파일 보기

@@ -0,0 +1,19 @@
<view class='applyshop'>适用门店</view>
<view class='posi' style='overflow:{{hidden}};height:{{height}}'>
<view class='posi_logo' wx:for="{{merchantVoList}}" wx:key="index">
<view bindtap='gotoDetail' data-id='{{item.id}}'>
<image src='{{item.merchantImgUrl}}'></image>
</view>
<view bindtap='gotoDetail' data-id='{{item.id}}'>
<view class='name'>{{item.merchantName}}</view>
<view class='shopVoList'>
<view wx:for="{{item.shopVoList}}" wx:key="{{index}}" wx:for-item="itemName">
<text>{{itemName.buildingName}}{{itemName.floorName}}--{{itemName.shopNumber}}</text>
<text class='douhao' wx:if="{{item.shopVoList.length>1}}">,</text>
</view>
</view>
</view>
<image wx:if="{{item.linkLinePhone}}" bindtap='phone' data-merchantLinkPhone='{{item.linkLinePhone}}' class="tel" src="{{teljpgUrl}}" mode="widthFix" />
</view>
</view>
<view class='bottom' bindtap='more' wx:if="{{showMore}}">{{more}}</view>

+ 72
- 0
components/store/index.wxss 파일 보기

@@ -0,0 +1,72 @@


.applyshop {
font-size: 30rpx;
height: 70rpx;
line-height: 70rpx;
color: #333;
text-indent: 1em;
background: #fff;
}

.posi {
position: relative;
width: 100%;
background: #FFF;
}
.posi_logo {
position: relative;
width: 92%;
display: flex;
padding: 20rpx 0;
background: #fff;
z-index: 10;
margin: 0 auto;
}

.posi_logo view:nth-child(1) {
/* width: 100rpx; *//* margin-right: 16rpx; */
border-radius: 16rpx;
/* height: 100rpx; */
}

.posi_logo view:nth-child(1) image {
display: block;
width: 100rpx;
height: 100rpx;
border-radius: 16rpx;
margin-right: 16rpx;
border: 1px solid #e5e5e5;
}
.name{
font-size: 32rpx;
color: #333;
letter-spacing: 0;
width: 500rpx;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
}
.posi_logo view:nth-child(2) view:nth-child(1) {
font-size: 32rpx;
color: #333;
letter-spacing: 0;
}

.shopVoList {
display: flex !important;
padding-left: 0 !important;
flex-direction: row !important;
}

.shopVoList text {
font-size: 20rpx !important;
color: #b8b8b8 !important;
}
.bottom{
background: #fff;
color: #666;
text-align: center;
padding: 20rpx 0;
font-size: 32rpx;
}

+ 5
- 48
pages/coupon/detail/index.js 파일 보기

@@ -22,12 +22,8 @@ Page({
fail: imgurl.fail.url, fail: imgurl.fail.url,
wmhome: imgurl.wmhome.url, wmhome: imgurl.wmhome.url,
swiperCurrent: 0, swiperCurrent: 0,
hidden: "hidden",
height: "",
detailPicture:[], detailPicture:[],
coverPicture:[], coverPicture:[],
more: "点击查看更多",
showMore: true,
data: { data: {
title: null title: null
}, },
@@ -105,14 +101,7 @@ Page({
isshowposter: false, isshowposter: false,
}) })
}, },
/**
* 跳转到门店列表的详情页面
*/
gotoDetail(e) {
wx.navigateTo({
url: `/pages/index/searchbar/detail/index?id=${e.currentTarget.dataset.id}`
})
},
/** /**
* 显示分享海报 * 显示分享海报
*/ */
@@ -127,31 +116,8 @@ Page({
swiperCurrent: e.detail.current swiperCurrent: e.detail.current
}); });
}, },
phone: function(e) {
let that = this;
wx.makePhoneCall({
phoneNumber: e.target.dataset.merchantlinkphone
});
},
// 点击查看更多
more: function() {
let that = this;
if (that.data.more == '点击查看更多') {
this.setData({
hidden: "",
height: that.data.data.merchantVoList.length * 140 + 'rpx',
more: "点击收起",
showMore: true
})
} else {
this.setData({
hidden: "hidden",
height: 4 * 140 + 'rpx',
more: "点击查看更多",
showMore: true
})
}
},
//获取当前登录用户信息 //获取当前登录用户信息
getUserInfo: function() { getUserInfo: function() {
let that = this; let that = this;
@@ -546,19 +512,10 @@ Page({
} }
wx.hideLoading(); wx.hideLoading();
that.setData({ that.setData({
data: res.data
data: res.data,
merchantVoList: res.data.merchantVoList
}); });


if (that.data.data.merchantVoList && that.data.data.merchantVoList.length <= 4) {
that.setData({
height: that.data.data.merchantVoList.length * 140 + 'rpx',
showMore: false
})
} else if (that.data.data.merchantVoList && that.data.data.merchantVoList.length > 4) {
that.setData({
height: 4 * 140 + 'rpx'
})
}
if (res.data.validType == 1) { if (res.data.validType == 1) {
that.setData({ that.setData({
validStartDate: util.formatTime(res.data.validStartDate, "yyyy-MM-dd"), validStartDate: util.formatTime(res.data.validStartDate, "yyyy-MM-dd"),


+ 2
- 1
pages/coupon/detail/index.json 파일 보기

@@ -1,7 +1,8 @@
{ {
"usingComponents": { "usingComponents": {
"c-shareposter": "../../../../components/shareposter/index", "c-shareposter": "../../../../components/shareposter/index",
"navbar": "../../../../components/navbar/navbar"
"navbar": "../../../../components/navbar/navbar",
"store": "../../../../components/store/index"
}, },
"navigationBarTitleText": "", "navigationBarTitleText": "",
"backgroundColor":"#f4f4f4", "backgroundColor":"#f4f4f4",


+ 2
- 19
pages/coupon/detail/index.wxml 파일 보기

@@ -89,25 +89,8 @@
</view> </view>
</view> </view>
</view> </view>
<!-- <view class='applyshop'>适用门店</view> -->
<view class='posi' style='overflow:{{hidden}};height:{{height}}'>
<view class='posi_logo' wx:for="{{data.merchantVoList}}" wx:key="index">
<view bindtap='gotoDetail' data-id='{{item.id}}'>
<image src='{{item.merchantImgUrl}}'></image>
</view>
<view bindtap='gotoDetail' data-id='{{item.id}}'>
<view class='name'>{{item.merchantName}}</view>
<view class='shopVoList'>
<view wx:for="{{item.shopVoList}}" wx:key="{{index}}" wx:for-item="itemName">
<text>{{itemName.buildingName}}{{itemName.floorName}}--{{itemName.shopNumber}}</text>
<text class='douhao' wx:if="{{item.shopVoList.length>1}}">,</text>
</view>
</view>
</view>
<image wx:if="{{item.linkLinePhone}}" bindtap='phone' data-merchantLinkPhone='{{item.linkLinePhone}}' class="tel" src="{{teljpgUrl}}" mode="widthFix" />
</view>
</view>
<view class='bottom' bindtap='more' wx:if="{{showMore}}">{{more}}</view>
<!-- 适用门店 -->
<store showMore="{{showMore}}" merchantVoList="{{merchantVoList}}"></store>
<view class='notes'> <view class='notes'>
<view> <view>
<text>购买须知</text> <text>购买须知</text>


+ 0
- 76
pages/coupon/detail/index.wxss 파일 보기

@@ -220,74 +220,6 @@ button::after {
float: right; float: right;
} }


.posi {
position: relative;
width: 100%;
background: #FFF;
margin: 18rpx 0 0;
}

/* .posi>view:nth-child(2) text:nth-child(1) {
font-size: 30rpx;
color: #a9a9a9;
} */

/*
.posi>view:nth-child(2) text:nth-child(2) {
font-size: 30rpx;
color: #a9a9a9;
} */

.posi_logo {
position: relative;
width: 92%;
display: flex;
padding: 20rpx 0;
background: #fff;
z-index: 10;
margin: 0 auto;
}

.posi_logo view:nth-child(1) {
/* width: 100rpx; *//* margin-right: 16rpx; */
border-radius: 16rpx;
/* height: 100rpx; */
}

.posi_logo view:nth-child(1) image {
display: block;
width: 100rpx;
height: 100rpx;
border-radius: 16rpx;
margin-right: 16rpx;
border: 1px solid #e5e5e5;
}
.name{
font-size: 32rpx;
color: #333;
letter-spacing: 0;
width: 500rpx;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
}
.posi_logo view:nth-child(2) view:nth-child(1) {
font-size: 32rpx;
color: #333;
letter-spacing: 0;
}

.shopVoList {
display: flex !important;
padding-left: 0 !important;
flex-direction: row !important;
}

.shopVoList text {
font-size: 20rpx !important;
color: #b8b8b8 !important;
}

.notes view:nth-child(1) { .notes view:nth-child(1) {
height: 87rpx; height: 87rpx;
line-height: 87rpx; line-height: 87rpx;
@@ -544,14 +476,6 @@ button::after {
padding: 0 6rpx; padding: 0 6rpx;
} }


.applyshop {
font-size: 30rpx;
height: 70rpx;
line-height: 70rpx;
color: #333;
text-indent: 1em;
}

.btns { .btns {
/* padding: 0 33rpx; */ /* padding: 0 33rpx; */
position: fixed; position: fixed;


불러오는 중...
취소
저장