98 lines
2.0 KiB
Vue
Executable File
98 lines
2.0 KiB
Vue
Executable File
<template>
|
||
<!-- 门店列表 -->
|
||
<view class="diy-shop">
|
||
<view class="shop-item dis-flex flex-y-center" v-for="(dataItem, index) in dataList" :key="index"
|
||
@click="handleNavDetail(dataItem.shop_id)">
|
||
<view class="shop-item__logo">
|
||
<image class="image" :src="dataItem.logo_url"></image>
|
||
</view>
|
||
<view class="shop-item__content">
|
||
<view class="shop-item__title">
|
||
<span>{{ dataItem.shop_name }}</span>
|
||
</view>
|
||
<view class="shop-item__address oneline-hide">
|
||
<span>门店地址：{{ dataItem.region.province }}{{ dataItem.region.city }}{{ dataItem.region.region }}{{ dataItem.address }}</span>
|
||
</view>
|
||
<view class="shop-item__phone">
|
||
<span>联系电话：{{ dataItem.phone }}</span>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import mixin from '../mixin'
|
||
|
||
export default {
|
||
|
||
/**
|
||
* 组件的属性列表
|
||
* 用于组件自定义设置
|
||
*/
|
||
props: {
|
||
itemIndex: String,
|
||
itemStyle: Object,
|
||
params: Object,
|
||
dataList: Array
|
||
},
|
||
|
||
mixins: [mixin],
|
||
|
||
/**
|
||
* 组件的方法列表
|
||
* 更新属性和数据的方法与更新页面数据的方法类似
|
||
*/
|
||
methods: {
|
||
|
||
// 跳转到门店详情页
|
||
handleNavDetail(shopId) {
|
||
this.$navTo('pages/shop/detail', { shopId })
|
||
}
|
||
}
|
||
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss" scoped>
|
||
.shop-item {
|
||
padding: 16rpx 30rpx;
|
||
min-height: 180rpx;
|
||
font-size: 26rpx;
|
||
line-height: 1.5;
|
||
border-bottom: 1rpx solid #eee;
|
||
box-sizing: border-box;
|
||
}
|
||
|
||
.shop-item__logo {
|
||
margin-right: 30rpx;
|
||
|
||
.image {
|
||
display: block;
|
||
width: 130rpx;
|
||
height: 130rpx;
|
||
border-radius: 50%;
|
||
border: 1px solid rgba(0, 0, 0, 0.1);
|
||
}
|
||
}
|
||
|
||
.shop-item__content {
|
||
flex: 1;
|
||
}
|
||
|
||
.shop-item__title {
|
||
font-size: 28rpx;
|
||
color: #535353;
|
||
margin-bottom: 10rpx;
|
||
}
|
||
|
||
.shop-item__address,
|
||
.shop-item__phone {
|
||
color: #919396;
|
||
}
|
||
|
||
.shop-item__address {
|
||
width: 520rpx;
|
||
}
|
||
</style>
|