梁航:更新详情页

This commit is contained in:
hot777zz
2023-11-01 21:59:51 +08:00
parent 80a2007ea8
commit f5271dbc92
2 changed files with 69 additions and 6 deletions

View File

@@ -1,7 +1,7 @@
<template>
<view class="detail">
<view class="swiper">
<u-swiper :list="list"></u-swiper>
<u-swiper :list="list" height="300rpx" radius="0"></u-swiper>
</view>
<view class="sub-detail u-flex">
<view class="title">
@@ -34,18 +34,49 @@
<u-avatar :src="src"></u-avatar>
<u-cell title="张先生" label="123456"></u-cell>
</view>
<!-- <text>美食杂货店是一个主打食品和日用杂货的淘宝2222222222222222</text> -->
<u-cell title="店铺介绍" label="美食杂货店是一个主打食品和日用杂货的淘宝222222222222222222222美食杂货店是一个主打食品和日用杂货的淘宝美食杂货店是一个主打食品和日用杂货的淘宝"></u-cell>
</view>
<view class="bottom">
<view class="bot-tab">
<view class="tab-left">
<view class="share">
<u-icon name="share-fill" color="green"></u-icon>
分享
</view>
<view class="customer">
<u-icon name="server-fill" color="green"></u-icon>
客服
</view>
</view>
<view class="tab-right">
<view class="call">
打电话
</view>
</view>
</view>
</view>
</view>
</template>
<script>
export default {
props:{},
props: {
list: {
type: Array,
default () {
return [
"https://alifei01.cfp.cn/creative/vcg/800/new/VCG41175510742.jpg",
"https://alifei01.cfp.cn/creative/vcg/800/new/VCG41175510742.jpg",
"https://alifei01.cfp.cn/creative/vcg/800/new/VCG41175510742.jpg"
]
}
},
},
data() {
return {
list:'',
}
},
methods: {
@@ -83,4 +114,36 @@
align-items: center;
margin-left: 16rpx;
}
.bottom{
position: fixed;
bottom: 0;
background-color: #fff;
width: 100%;
z-index: 100;
height: 100rpx;
}
.bot-tab{
display: flex;
// flex: 1;
justify-content: space-evenly;
}
.tab-left{
width: 50%;
display: flex;
justify-content: space-around;
height: 100px;
}
.coustom{
height: 100px;
}
.tab-right{
width: 50%;
height: 100%;
display: flex;
justify-content: center;
align-items: center;
}
.share{
}
</style>

View File

@@ -2,9 +2,9 @@
<view>
<view class="search_box">
<view class="search_box_border">
<u-input placeholder="搜索优质产品" placeholder-style="color: #969696" prefixIcon="search"
<!-- <u-input placeholder="搜索优质产品" placeholder-style="color: #969696" prefixIcon="search"
prefixIconStyle="font-size: 22px;color: #909399;margin-left:30rpx" readonly>
</u-input>
</u-input> -->
</view>
<InputAndSwiper></InputAndSwiper>
<TabBar :current-page="0"></TabBar>