Skip to content

B
buildingAgricultureSharing-miniapp
Commit fc2409a4 authored by 周俊涛（东信）'s avatar 周俊涛（东信）
Browse files
Options

Merge branch 'master' of…

Merge branch 'master' of http://gitlab.platform.xinhuaapp.com/pengjiani/buildingAgricultureSharing-miniapp
parents 9c13a252 73096d13
Hide whitespace changes
Inline Side-by-side
Showing with 200 additions and 33 deletions
src/pages.json
View file @ fc2409a4
......@@ -42,7 +42,9 @@
{
"path": "pages/cart/cart",
"style": {
"navigationBarTitleText": "购物车"
"navigationBarTitleText": "购物车",
"navigationBarBackgroundColor": "#ffffff",
"navigationStyle":""
}
}
],
......
src/pages/detail/detail.vue
View file @ fc2409a4
......@@ -30,8 +30,10 @@
<view class="detail-int">
这是商品简介这是商品简介这是商品简介这是商品简介这是商品 简介这是商品简介这是商品简介
</view>
<img class="share-img" src="/static/detail/share.png" />
<text class="share-text">分享</text>
<view>
<img class="share-img" src="/static/detail/share.png" />
<text class="share-text" @click="share">分享</text>
</view>
</view>
<view class="evaluate">
<view class="evaluate-num">
......@@ -50,11 +52,26 @@
<view class="detail-bottom">
<view class="sort">
<view class="bottom" style="display: flex; flex-direction: row">
<view class="borderClass" v-for="(item, index) in sortList" :key="index">
<img :src="item.img" style="width: 40rpx; height: 40rpx" />
<view class="sort-text">{{ item.text }}</view>
<view class="borderClass" @tap="toStore">
<img src="/static/detail/img7.png" style="width: 40rpx; height: 40rpx" />
<view class="sort-text">店铺</view>
</view>
<view class="borderClass">
<img src="/static/detail/img8.png" style="width: 40rpx; height: 40rpx" />
<view class="sort-text">客服</view>
</view>
<view class="borderClass">
<img src="/static/detail/img6.png" style="width: 40rpx; height: 40rpx" />
<view class="sort-text" @tap="toCart">购物车</view>
</view>
</view>
<!-- <view class="sort">-->
<!-- <view class="bottom" style="display: flex; flex-direction: row">-->
<!-- <view class="borderClass" v-for="(item, index) in storeList" :key="index">-->
<!-- <img :src="item.img" style="width: 40rpx; height: 40rpx" />-->
<!-- <view class="sort-text">{{ item.text }}</view>-->
<!-- </view>-->
<!-- </view>-->
<view class="btn">
<wd-button type="warning" size="small" style="margin-right: 10rpx">加入购物车</wd-button>
<wd-button type="error" size="small">立即购买</wd-button>
......@@ -67,6 +84,8 @@
<script setup>
import OtherSearch from '../../components/index/OtherSearch.vue';
import { ref } from 'vue';
import { onShow } from '@dcloudio/uni-app';
// 图片
const swiperList = ref([
'../../static/detail/img2.png',
......@@ -74,11 +93,33 @@ const swiperList = ref([
'../../static/detail/img2.png',
]);
// 底部
const sortList = ref([
const storeList = ref([
{ img: '/static/detail/img7.png', text: '店铺' },
{ img: '/static/detail/img8.png', text: '客服' },
{ img: '/static/detail/img6.png', text: '购物车' },
]);
// 进入页面回到顶部
onShow(() => {
uni.pageScrollTo({
scrollTop: 0,
duration: 300,
});
});
const share = () => {
alert('分享功能已触发！');
};
function toStore() {
// TODO: 跳转到筑农严选
xma.navigateTo({
url: '/pages/shop/index',
});
}
function toCart() {
// TODO: 跳转到购物车
xma.navigateTo({
url: '/pages/cart/cart',
});
}
</script>
<style lang="scss" scoped>
......@@ -279,8 +320,9 @@ const sortList = ref([
border-radius: 16rpx 16px 0rpx 0rpx;
background: #ffffff;
box-shadow: 0rpx -8rpx 20rpx 0rpx rgba(0, 0, 0, 0.12);
position: relative;
z-index: 10;
position: fixed;
top: 88%;
}
.sort {
width: 750rpx;
......
src/pages/index/building.vue
View file @ fc2409a4
......@@ -28,6 +28,7 @@
style="height: 176rpx; margin-left: 8rpx"
/>
<img
@tap="toPresale"
class="fresh"
src="/static/assets/fresh.png"
style="height: 176rpx; margin-left: 8rpx"
......@@ -47,15 +48,21 @@
color="#ABAAAA"
style="position: relative; float: right; top: -42rpx"
></wd-icon>
<img class="rice" src="/static/assets/rice.png" style="width: 670rpx; height: 236rpx" />
<img
@tap="toDetail"
class="rice"
src="/static/assets/rice.png"
style="width: 670rpx; height: 236rpx"
/>
<img
@tap="toDetail"
class="potato"
src="/static/assets/potato.png"
style="width: 650rpx; height: 236rpx; margin-left: 20rpx; margin-top: -20rpx"
/>
</view>
<!-- tabs-->
<scroll-view class="tabs" scroll-x="true">
<scroll-view class="tabs" show-scrollbar="false" scroll-x :scroll-with-animation="true">
<text
@tap="choice(index, item.categoryId)"
v-for="(item, index) in tabsData"
......@@ -75,7 +82,7 @@
/>
<view class="sort-list">
<view class="sort-img" v-for="(item, index) in detailList" :key="index">
<img :src="item.img" style="width: 330rpx; height: 330rpx" />
<img @tap="toDetail" :src="item.img" style="width: 330rpx; height: 330rpx" />
<view class="detail-title">{{ item.text }}</view>
<view class="price-page">
<text class="price">￥{{ item.price }}</text>
......@@ -123,6 +130,18 @@ function handleClick(e) {
function onChange(e) {
console.log(e);
}
function toPresale() {
// TODO: 跳转到预售
xma.navigateTo({
url: '/pages/index/presale',
});
}
function toDetail() {
// TODO: 跳转到详情页
xma.navigateTo({
url: '/pages/detail/detail',
});
}
</script>
<style lang="scss" scoped>
......@@ -192,6 +211,13 @@ page {
.tabs {
white-space: nowrap;
height: 60rpx;
::-webkit-scrollbar {
display: none;
width: 0;
height: 0;
color: transparent;
}
background-color: transparent;
.text {
font-size: 24rpx;
color: #d8d8d8;
......@@ -211,7 +237,7 @@ page {
position: relative;
&::after {
content: '';
width: 20rpx;
width: 40rpx;
height: 12rpx;
background: url('../../static/assets/selected.png') no-repeat;
background-size: 100% 100%;
......
src/pages/index/index.vue
View file @ fc2409a4
......@@ -9,18 +9,106 @@
</view>
<view class="sort">
<view style="display: flex; flex-direction: row">
<view
class="borderClass"
@tap="toBuilding"
v-for="(item, index) in sortList"
:key="index"
>
<img :src="item.img" style="width: 96rpx; height: 96rpx" />
<view class="sort-text">{{ item.text }}</view>
<view class="borderClass" @tap="toBuilding">
<img src="/static/assets/buildingAgriculture.png" style="width: 96rpx; height: 96rpx" />
<view class="sort-text">筑农严选</view>
</view>
<view class="borderClass">
<img src="/static/assets/adoption.png" style="width: 96rpx; height: 96rpx" />
<view class="sort-text">认养农业</view>
</view>
<view class="borderClass">
<img src="/static/assets/rural.png" style="width: 96rpx; height: 96rpx" />
<view class="sort-text">乡村旅居</view>
</view>
<view class="borderClass">
<img src="/static/assets/buildingAgriculture.png" style="width: 96rpx; height: 96rpx" />
<view class="sort-text">特色农庄</view>
</view>
</view>
<!-- <view style="display: flex; flex-direction: row">-->
<!-- <view-->
<!-- class="borderClass"-->
<!-- @tap="toBuilding"-->
<!-- v-for="(item, index) in sortList"-->
<!-- :key="index"-->
<!-- >-->
<!-- <img :src="item.img" style="width: 96rpx; height: 96rpx" />-->
<!-- <view class="sort-text">{{ item.text }}</view>-->
<!-- </view>-->
<!-- </view>-->
</view>
<view class="product-page" @tap="toPresale" v-for="(item, index) in list" :key="index">
<view class="product-page">
<view>
<view class="page-title">特色美食</view>
<img src="/static/assets/mainPicture.png" class="main-img" />
<view style="display: flex; flex-direction: row">
<view class="detail-border">
<img src="/static/assets/detailedMapOne.png" style="width: 216rpx; height: 176rpx" />
<view class="detail-title">干辣椒炒肉</view>
<view class="jiage-page">
<text class="jiage">￥25</text>
/份
</view>
<view class="yushou">预售</view>
</view>
<view class="detail-border">
<img src="/static/assets/detailedMapOne.png" style="width: 216rpx; height: 176rpx" />
<view class="detail-title">贵阳辣子鸡</view>
<view class="jiage-page">
<text class="jiage">￥25</text>
/份
</view>
<view class="yushou">预售</view>
</view>
<view class="detail-border">
<img src="/static/assets/detailedMapOne.png" style="width: 216rpx; height: 176rpx" />
<view class="detail-title">麻辣鱼豆腐</view>
<view class="jiage-page">
<text class="jiage">￥25</text>
/份
</view>
<view class="yushou">预售</view>
</view>
</view>
</view>
</view>
<view class="product-page" @tap="toDetail">
<view>
<view class="page-title">农货预售</view>
<img src="/static/assets/img4.png" class="main-img" />
<view style="display: flex; flex-direction: row">
<view class="detail-border">
<img src="/static/assets/img1.png" style="width: 216rpx; height: 176rpx" />
<view class="detail-title">这是农村种的土豆</view>
<view class="jiage-page">
<text class="jiage">￥25</text>
/份
</view>
<view class="yushou">预售</view>
</view>
<view class="detail-border">
<img src="/static/assets/img2.png" style="width: 216rpx; height: 176rpx" />
<view class="detail-title">这是农村玉米</view>
<view class="jiage-page">
<text class="jiage">￥25</text>
/份
</view>
<view class="yushou">预售</view>
</view>
<view class="detail-border">
<img src="/static/assets/img3.png" style="width: 216rpx; height: 176rpx" />
<view class="detail-title">这是农村中的猕猴桃</view>
<view class="jiage-page">
<text class="jiage">￥25</text>
/份
</view>
<view class="yushou">预售</view>
</view>
</view>
</view>
</view>
<view class="product-page" @tap="toDetail" v-for="(item, index) in list" :key="index">
<view>
<view class="page-title">{{ item.text }}</view>
<img :src="item.img" class="main-img" />
......@@ -45,8 +133,8 @@
import Search from '../../components/index/Search.vue';
const list = ref([
{ img: '/static/assets/mainPicture.png', text: '特色美食' },
{ img: '/static/assets/presale.png', text: '农货预售' },
// { img: '/static/assets/mainPicture.png', text: '特色美食' },
// { img: '/static/assets/presale.png', text: '农货预售' },
{ img: '/static/assets/mainPicture.png', text: '乡村非遗' },
{ img: '/static/assets/mainPicture.png', text: '认养农业' },
{ img: '/static/assets/mainPicture.png', text: '乡村旅居' },
......@@ -69,16 +157,16 @@ function toBuilding() {
url: '/pages/index/building',
});
}
function toPresale() {
// TODO: 跳转到预售
// 跳转详情页
function toDetail() {
// TODO: 跳转到筑农严选
xma.navigateTo({
url: '/pages/index/presale',
url: '/pages/detail/detail',
});
}
const goBack = () => {};
</script>
<style lang="scss">
<style lang="scss" scoped>
page {
background-color: #f3f3f3;
}
......@@ -175,8 +263,7 @@ page {
font-weight: 500;
line-height: 28rpx;
letter-spacing: 0em;
margin-left: 48rpx;
margin-top: -20rpx;
margin-left: 30rpx;
color: #3d3d3d;
width: 190rpx;
white-space: nowrap;
......
src/pages/index/presale.vue
View file @ fc2409a4
......@@ -16,7 +16,7 @@
</view>
<view class="sort">
<view style="display: flex; flex-direction: row">
<view class="borderClass" @tap="toDetail" v-for="(item, index) in sortList" :key="index">
<view class="borderClass" @tap="toPresale" v-for="(item, index) in sortList" :key="index">
<img :src="item.img" style="width: 48rpx; height: 48rpx" />
<view class="sort-text">{{ item.text }}</view>
</view>
......@@ -24,7 +24,7 @@
</view>
<view>
<view>
<scroll-view class="tabs" scroll-x="true">
<scroll-view class="tabs" show-scrollbar="false" scroll-x :scroll-with-animation="true">
<text
@tap="choice(index, item.categoryId)"
v-for="(item, index) in tabsData"
......@@ -312,6 +312,13 @@ page {
margin-left: 20rpx;
border-radius: 8px 8px 0px 0px;
background: #ffffff;
::-webkit-scrollbar {
display: none;
width: 0;
height: 0;
color: transparent;
}
background-color: transparent;
}
.tabs {
white-space: nowrap;
......@@ -450,11 +457,14 @@ page {
}
.pre-text {
float: right;
margin-top: -40rpx;
margin-top: -36rpx;
font-size: 11px;
font-weight: normal;
line-height: 14px;
color: #ffffff;
position: relative;
left: -40rpx;
z-index: 999;
}
.cart-floating {
position: fixed;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment