odjbin/pupil
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

dengjie commit : 完善我的页面和我的发布页面样式初步完成

Browse Source
This commit is contained in:
clay
2022-12-22 21:49:44 +08:00
parent 35203f0d42
commit 02e6961b06
25 changed files with 409 additions and 42 deletions
Download Patch File Download Diff File Expand all files Collapse all files

100
pages/detail/productsDetail/productsDetail.vue
View File

@@ -1,13 +1,20 @@
<template>
<view>
<view v-for="(item,index) in detailList" :key="index">
<u-swiper :list="swiperList" indicatorMode="line " width="750rpx" height="530rpx" radius="0" circular>
</u-swiper>
<view class="collect">
<u-icon :name="like?'heart-fill':'heart'" color="#FEAA19" size="23" @click.stop="likeTap"></u-icon>
<view class="collect_text">收藏</view>
<view class="star">
<u-image v-if="showStar==false" src="/static/detail/xp_icon_wstar.png" width="28rpx" height="28rpx"
@click="starTap">
</u-image>
<u-image v-if="showStar==true" src="/static/detail/xp_icon_star.png" width="28rpx" height="28rpx"
@click="starTap">
</u-image>
</view>
<u-image src="/static/detail/xiangqing_icon_shoucang.png" width="119rpx" height="48rpx">
</u-image>
</view>
<view class="content">
@@ -21,12 +28,30 @@
<view class="classify">
{{item.classify}}
</view>
<view class="tagOne">{{item.tagOne}}</view>
<view class="tagTwo">{{item.tagTwo}}</view>
<view class="tag_view">
<view>
<text class="tagOne">{{item.tagOne}}</text>
<text class="tagTwo">{{item.tagTwo}}</text>
</view>
<view v-if="isThumb==false" class="heart">
<u-image v-if="showHeart==false" src="/static/detail/xp_icon_heart.png" width="34rpx"
height="32rpx" @click="heartTap">
</u-image>
<u-image v-if="showHeart==true" src="/static/detail/xp_icon_ysc.png" width="34rpx"
height="32rpx" @click="heartTap">
</u-image>
<text class="thumb">点赞</text>
</view>
<view v-if="isThumb==true" class="heart">
<u-image src="/static/detail/xp_icon_ysc.png" width="34rpx" height="32rpx" @click="heartTap">
</u-image>
<text class="thumb">122赞</text>
</view>
</view>
</view>
<view class="releaseDate">
<u-image src="/static/products/sy_icon_sjf.png" width="24rpx" height="24rpx" :lazy-load="true">
<u-image src="/static/products/xp_icon_sjf.png" width="24rpx" height="24rpx">
</u-image>
<text class="release">发布日期：</text>
<text>{{item.time}}</text>
@@ -41,14 +66,15 @@
export default {
data() {
return {
like: false,
showStar: false,
showHeart: false,
isThumb: true,
detailList: [{
// src: '/static/detail/zhanwei_xppx.png',
title: '锅巴',
tag: '零食铺子',
desc: '糯米蟹黄锅巴散装，非油炸绿色健康食品',
classify: '薯片膨化',
tagOne: '无添加剂',
tagOne: '无添加剂1',
tagTwo: '无添加剂',
time: '2022年12月04日',
content: '<h1>一级标题</h1><br/><h2>二级标题</h2>'
@@ -60,8 +86,13 @@
}
},
methods: {
likeTap() {
this.like = !this.like
//收藏按钮
starTap() {
this.showStar = !this.showStar
},
//点赞按钮
heartTap() {
this.showHeart = !this.showHeart
}
}
}
@@ -73,17 +104,20 @@
position: absolute;
top: 16rpx;
right: 0;
background-color: #a6a6a6;
color: #fff;
border-radius: 54rpx 0px 0px 54rpx;
padding: 2px 2px 2px 3px;
.collect_text {
font-size: 26rpx;
padding: 1px;
.star {
position: absolute !important;
top: 6px !important;
right: 77rpx;
z-index: 99;
}
}
.content {
padding: 20rpx;
background-color: #fff;
@@ -140,25 +174,35 @@
padding: 1rpx 15rpx;
}
.tagOne {
.tag_view {
display: flex;
justify-content: space-between;
align-items: center;
padding-top: 14rpx;
font-size: 20rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #CCCCCC;
line-height: 28rpx;
float: left;
padding-top: 14rpx;
padding-right: 20rpx;
.tagOne {
padding-right: 20rpx;
}
.heart {
display: flex;
.thumb {
font-size: 24rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #666666;
line-height: 33rpx;
margin-left: 14rpx;
}
}
}
.tagTwo {
font-size: 20rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #CCCCCC;
line-height: 28rpx;
padding-top: 14rpx;
}
}
.releaseDate {

33
pages/index/index.vue
View File

@@ -19,12 +19,17 @@
<text class="grid-text">{{listItem.title}}</text>
</u-grid-item>
</u-grid>
<!-- <u-toast ref="uToast" /> -->
</view>
<!-- 分类模块下的轮播图 -->
<view>
<u-swiper :list="swiperList" indicatorMode="line" radius="0" circular></u-swiper>
</view>
<!-- <view style="width: 100px; height: 100px; z-index: 999;">
<u-button type="primary" open-type="getPhoneNumber" size="medium" @getphonenumber="getphonenumber">
获取电话号码</u-button>
</view> -->
<!-- 选项卡: 上架时间和点赞量 -->
<view>
<u-tabs :list="tabList" lineColor="#15CA65" :is-scroll="false"
@@ -110,6 +115,32 @@
url: '../../packageSearch/search/search'
})
},
getphonenumber(e) {
const {
code
} = e.detail;
console.log("手机code : ", code);
uni.login({
"provider": "weixin",
"onlyAuthorize": true, // 微信登录仅请求授权认证
success: function(event) {
const {
code
} = event
console.log("登录code", code);
//客户端成功获取授权临时票据（code）,向业务服务器发起登录请求。
// 调用登录接口 拿到token 传手机code,更新手机号码
},
fail: function(err) {
// 登录授权失败
// err.code是错误码
}
})
},
//点击一级分类跳转到分类页
toClassify() {
uni.navigateTo({

15
pages/my/my.vue
View File

@@ -16,6 +16,8 @@
@click="toBrowseHistory()"></u-cell>
<u-cell size="large" title="我的收藏" icon="/static/my/wo_icon_sc.png" :isLink="true"
@click="toMyCollect()"></u-cell>
<u-cell size="large" title="我的发布" icon="/static/my/wo_icon_wdfb.png" :isLink="true"
@click="toMyRelease()"></u-cell>
<u-cell size="large" title="联系客服" icon="/static/my/wo_icon_lxkf.png" :isLink="true"
@click="showModal()">
</u-cell>
@@ -32,7 +34,6 @@
export default {
data() {
return {
showM: false,
content: `138 1222 222<br>
是否拨打客服电话`,
@@ -58,12 +59,20 @@
url: '../../packageMy/browseHistory/browseHistory?id=' + 1
})
},
//跳转到我的收藏页面
toMyCollect() {
uni.navigateTo({
url: '../../packageMy/browseHistory/browseHistory?id=' + 2
})
},
//跳转到我的发布页面
toMyRelease() {
uni.navigateTo({
url: '../../packageMy/myRelease/myRelease'
})
},
// 联系客服模态框
showModal() {
this.showM = true
@@ -110,6 +119,10 @@
}
.u-cell:last-child {
border: none !important;
}
.u-icon__icon--info {
font-size: 28rpx !important;
}