This commit is contained in:
ghusermoon 2020-06-08 15:23:23 +08:00
parent e8c74df8a0
commit 233cb82ee4
44 changed files with 2461 additions and 82 deletions

View File

@ -23,11 +23,11 @@
</view>
<view class="address-operate">
<view @click="editAddress">
<img src="@/pageE/static/mine/24.png" />
<image src="@/pageE/static/mine/24.png"></image>
<view>编辑</view>
</view>
<view>
<img src="@/pageE/static/mine/25.png" />
<image src="@/pageE/static/mine/25.png"></image>
<view>删除</view>
</view>
</view>
@ -54,12 +54,12 @@ export default {
methods: {
editAddress() {
uni.navigateTo({
url: '/pageE/mine/EditAddress'
url: '/pageE/more/EditAddress'
});
},
addAddress() {
uni.navigateTo({
url: '/pageE/mine/AddAddress'
url: '/pageE/more/AddAddress'
});
},
changeDefault(event) {
@ -136,9 +136,21 @@ export default {
&:not(:last-child) {
margin-right: 30rpx;
}
> img {
height: 23rpx;
> image {
margin-right: 15rpx;
flex-shrink: 0;
}
&:first-child {
> image {
width: 23rpx;
height: 23rpx;
}
}
&:nth-child(2) {
> image {
width: 17rpx;
height: 21rpx;
}
}
}
}

View File

@ -2,7 +2,7 @@
<view class="article-list">
<view v-for="(item, index) in articleList" :key="index" class="list-item" @click="toDetailsPage()">
<view>{{ type }}</view>
<img src="@/pageE/static/mine/21.png" />
<image src="@/pageE/static/mine/21.png"></image>
</view>
</view>
</template>
@ -18,7 +18,7 @@ export default {
methods: {
toDetailsPage() {
uni.navigateTo({
url: '/pageE/mine/ArticleDetails?title=' + this.type
url: '/pageE/mine/ArticleDetails?title=' + this.type + "详情"
});
}
},
@ -26,7 +26,7 @@ export default {
</script>
<style lang="scss" scoped>
.article-list {
min-height: calc(100vh-var(--custom-bar-height));
min-height: calc(100vh - var(--window-top));
background-color: #ECECEC;
.list-item {
display: flex;
@ -38,7 +38,7 @@ export default {
padding: 0 30rpx;
font-size: 30rpx;
color: rgba(51,51,51,1);
> img {
> image {
width: 14rpx;
height: 24rpx;
}

View File

@ -0,0 +1,114 @@
<template>
<view class="collection-item">
<u-swipe-action
v-for="(item, index) in list" :key="index"
:index='index'
:show="item.show"
:options="options"
@click="click"
@open="open"
>
<view class="item u-border-bottom">
<image src="@/pageE/static/mine/23.png"></image>
<!-- 此层wrap在此为必写的否则可能会出现标题定位错误 -->
<view class="title-wrap">
<view class="item-top u-line-2">木糖少女小紫薯西装领连衣裙夏季新款女装夏收腰格子格纹裙子</view>
<view class="item-bottom">
<view class="item-price">99</view>
<view class="item-date">
<image src="@/pageE/static/mine/26.png"></image>
<view>2020-05-17</view>
</view>
</view>
</view>
</view>
</u-swipe-action>
</view>
</template>
<script>
export default {
data() {
return {
list: [
{
id: 1,
show: false
},
{
id: 2,
show: false
},
{
id: 3,
show: false,
}
],
btnWidth: 152,
show: false,
options: [
{
text: '删除',
style: {
backgroundColor: '#FF3131'
}
}
]
}
},
methods: {
click(index) {
this.list.splice(index, 1);
this.$u.toast(`删除了第${index+1}个cell`);
},
open(index) {
// swipeActionprops
// 'false''false'
this.list[index].show = true;
this.list.map((val, idx) => {
if(index != idx) this.list[idx].show = false;
})
}
},
};
</script>
<style lang="scss" scoped>
.collection-item {
.item {
padding: 30rpx;
display: flex;
> image {
width: 180rpx;
height: 160rpx;
border-radius: 10rpx;
margin-right: 30rpx;
flex-shrink: 0;
}
.title-wrap {
.item-top {
font-size: 30rpx;
color: rgba(51,51,51,1);
line-height: 44rpx;
margin-bottom: 54rpx;
}
.item-bottom {
display: flex;
align-items: center;
justify-content: space-between;
.item-price {
font-size: 30rpx;
color: rgba(51,51,51,1);
}
.item-date {
display: flex;
align-items: center;
> image {
margin-right: 25rpx;
width: 24rpx;
height: 24rpx;
}
}
}
}
}
}
</style>

View File

@ -0,0 +1,72 @@
<template>
<view class="comment">
<view class="user-info">
<image src="@/pageE/static/mine/23.png" class="user-avatar"></image>
<view class="user-name">***</view>
</view>
<view class="user-comment">
<view class="text u-line-2">宝贝收到了和卖家描述的一样,质量不错,很漂亮一直想买这样的杯子这个蓝色的稍微有点小瑕疵不过自己用没问题没问题没问题</view>
<view class="image">
<image v-for="(src, index) in ImageList" :key="index" :src="src" mode="aspectFit"></image>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
ImageList: [
require('@/pageE/static/mine/23.png'),
require('@/pageE/static/mine/23.png'),
require('@/pageE/static/mine/23.png'),
require('@/pageE/static/mine/23.png')
]
}
}
};
</script>
<style lang="scss" scoped>
.comment {
padding: 30rpx;
width: 750rpx;
background: rgba(255,255,255,1);
.user-info {
display: flex;
align-items: center;
margin-bottom: 19rpx;
.user-avatar {
width: 60rpx;
height: 60rpx;
border-radius: 50%;
margin-right: 20rpx;
}
.user-name {
font-size: 26rpx;
color: rgba(153,153,153,1);
}
}
.user-comment {
.text {
font-size: 26rpx;
color: rgba(51,51,51,1);
line-height: 40rpx;
margin-bottom: 19rpx;
}
.image {
display: flex;
flex-wrap: wrap;
> image {
width: 210rpx;
height: 210rpx;
border-radius: 10rpx;
margin-bottom: 20rpx;
flex-shrink: 0;
&:not(:nth-child(3n)) {
margin-right: 30rpx;
}
}
}
}
}
</style>

View File

@ -0,0 +1,65 @@
<template>
<view class="integral1">
<view class="integral-top">
<view>
<view class="title">总积分</view>
<view class="value">999</view>
</view>
<view>
<view class="title">经验值</view>
<view class="value">999</view>
</view>
<view>
<view class="title">预计进度</view>
<view class="value">999</view>
</view>
</view>
<view class="integral-botom">
<rich-text :nodes="nodes"></rich-text>
</view>
</view>
</template>
<script>
export default {
data() {
return {
nodes: '<h1>2</h1><h1>2</h1><h1>2</h1><h1>2</h1><h1>2</h1><h1>2</h1><h1>2</h1><h1>2</h1><h1>2</h1><h1>2</h1><h1>2</h1><h1>2</h1><h1>2</h1><h1>2</h1><h1>2</h1><h1>2</h1><h1>2</h1><h1>2</h1>'
}
}
};
</script>
<style lang="scss" scoped>
.integral1 {
.integral-top {
padding: 79rpx 88rpx;
width: 750rpx;
height: 271rpx;
background: linear-gradient(0deg,rgba(246,211,119,1) 1%,rgba(240,154,105,1) 100%);
display: flex;
justify-content: space-between;
> view {
flex: 1;
text-align: center;
.title {
font-size: 28rpx;
color: rgba(255,255,255, 0.6);
margin-bottom: 29rpx;
}
.value {
font-size: 48rpx;
font-weight: 500;
color: rgba(255,255,255,1);
}
}
}
.integral-botom {
position: absolute;
width: 750rpx;
// height: 856rpx;
background: rgba(255,255,255,1);
border-radius: 20rpx 20rpx 0rpx 0rpx;
top: 251rpx;
z-index: 9;
}
}
</style>

View File

@ -0,0 +1,163 @@
<template>
<view class="order-item">
<view class="order-title">
<view class="store-info">
<image src="@/pageE/static/mine/23.png"></image>
<view class="store-name">胖胖的店</view>
</view>
<view class="order-status">交易成功</view>
</view>
<view class="goods-info" @click="toDetailsPage">
<image src="@/pageE/static/mine/23.png"></image>
<view class="goods-text">
<view class="goods-name u-line-2">木糖少女小紫薯西装领连衣裙夏季新款女装夏收腰格子格纹裙子</view>
<view class="goods-sku u-line-1" v-if="current !== 5 && current !== 6">XL;红色条纹XL;红色条纹XL;红色条纹</view>
<view class="goods-time u-line-1" v-if="current == 1 || current == 4">距离结束23:23:38</view>
<view class="goods-price u-line-1" v-if="current == 5 || current == 6">总价99.00实付款99</view>
<view class="goods-date" v-if="current == 5 || current == 6">
<image src="@/pageE/static/mine/26.png"></image>
<view>2020.05.17</view>
</view>
</view>
</view>
<view class="order-btn" v-if="[0, 2, 4].indexOf(current) < 0">
<view class="logistics" v-if="current == 3" @click="toLogistics">查看物流</view>
<view class="comment" v-if="current == 5" @click="toComment">立即评价</view>
<view class="payment" v-if="current == 1">立即支付</view>
<view class="service" v-if="current == 6">联系官方客服</view>
<view class="submit" v-if="current == 6">提交官方审核</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {}
},
props: {
current: Number
},
methods: {
toDetailsPage() {
uni.navigateTo({
url: '/pageE/order/Details?current=' + this.current
});
},
toLogistics() {
uni.navigateTo({
url: '/pageE/order/Logistics'
});
},
toComment() {
uni.navigateTo({
url: '/pageE/order/Comment'
});
}
},
};
</script>
<style lang="scss" scoped>
.order-item {
width: 690rpx;
background: rgba(255,255,255,1);
border-radius: 20rpx;
padding: 30rpx;
.order-title {
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 20rpx;
.store-info {
display: flex;
align-items: center;
> image {
width: 50rpx;
height: 50rpx;
border-radius: 50%;
margin-right: 15rpx;
}
.store-name {
font-size: 26rpx;
color: rgba(51,51,51,1);
}
}
.order-status {
font-size: 28rpx;
color: rgba(255,120,15,1);
}
}
.goods-info {
display: flex;
margin-bottom: 28rpx;
> image {
flex-shrink: 0;
width: 180rpx;
height: 160rpx;
border-radius: 10rpx;
margin-right: 30rpx;
}
.goods-text {
display: flex;
flex-direction: column;
justify-content: space-between;
.goods-name {
font-size: 28rpx;
color: rgba(51,51,51,1);
line-height: 38rpx;
}
.goods-sku {
max-width: 230rpx;
background: rgba(236,236,236,1);
border-radius: 6rpx;
padding: 10rpx 15rpx;
font-size: 24rpx;
color: rgba(153,153,153,1);
}
.goods-time {
font-size: 24rpx;
color: rgba(255,49,49,1);
}
.goods-price {
font-size: 24rpx;
color: rgba(253,211,96,1);
}
.goods-date {
display: flex;
align-items: center;
font-size: 24rpx;
color: rgba(153,153,153,1);
> image {
width: 24rpx;
height: 24rpx;
margin-right: 21rpx;
}
}
}
}
.order-btn {
display: flex;
justify-content: flex-end;
@mixin btn-class($width, $color) {
width: $width;
height: 60rpx;
border: 2rpx solid $color;
color: $color;
border-radius: 30rpx;
padding: 15rpx 23rpx;
font-size: 28rpx;
&:not(:last-child) {
margin-right: 30rpx;
}
}
.logistics, .comment, .payment {
@include btn-class($width: 160rpx, $color: rgba(255,119,15,1));
}
.service {
@include btn-class($width: 216rpx, $color: rgba(155,153,153,1));
}
.submit {
@include btn-class($width: 216rpx, $color: rgba(255,119,15,1));
}
}
}
</style>

View File

@ -16,7 +16,7 @@ export default {
methods: {
setTitle(title){
uni.setNavigationBarTitle({
title: title + "详情"
title: title
});
},
},

104
pageE/mine/EditUserInfo.vue Normal file
View File

@ -0,0 +1,104 @@
<template>
<view class="edit-info">
<view class="user-info">
<view class="info-avatar">
<image src="../static/mine/23.png"></image>
</view>
<view class="info-item">
<view class="title">昵称</view>
<view class="value">胖胖</view>
</view>
<view class="info-item">
<view class="title">性别</view>
<view class="value"></view>
</view>
<view class="info-item">
<view class="title">生日</view>
<view class="value">1998.10.13</view>
</view>
<view class="info-item phone" @click="updatePhone">
<view class="title">手机号</view>
<view class="value">18265906216</view>
<image src="../static/mine/21.png"></image>
</view>
</view>
<view class="edit-tips">注意修改手机号需要原手机号获取验证码无原手机验证码请联系后台</view>
<view class="edit-btn">完成</view>
</view>
</template>
<script>
export default {
data() {
return {}
},
methods: {
updatePhone() {
uni.navigateTo({
url: '/pageE/mine/UpdatePhone'
});
}
},
};
</script>
<style lang="scss" scoped>
.edit-info {
min-height: calc(100vh - var(--window-top));
background-color: #ECECEC;
padding-top: 1rpx;
.user-info {
.info-avatar {
text-align: center;
height: 160rpx;
background: rgba(255,255,255,1);
> image {
flex-shrink: 0;
width: 120rpx;
height: 120rpx;
border-radius: 50%;
margin-top: 20rpx;
}
}
.info-item {
display: flex;
align-items: center;
padding: 35rpx 30rpx;
border-top: 2rpx solid #ECECEC;
font-size: 30rpx;
height: 98rpx;
background: rgba(255,255,255,1);
.title {
width: 240rpx;
color: rgba(51,51,51,1);
}
.value {
color: rgba(102,102,102,1);
}
}
.phone {
> image {
margin-left: auto;
width: 11rpx;
height: 22rpx;
}
}
}
.edit-tips {
font-size: 24rpx;
color: rgba(102,102,102,1);
line-height: 40rpx;
margin: 20rpx 0 120rpx;
padding: 0 30rpx;
}
.edit-btn {
margin: 0 auto;
width: 690rpx;
height: 98rpx;
background: rgba(255,120,15,1);
border-radius: 49rpx;
font-size: 36rpx;
color: rgba(255,255,255,1);
line-height: 98rpx;
text-align: center;
}
}
</style>

View File

@ -0,0 +1,23 @@
<template>
<view class="collection">
<CollectionItem></CollectionItem>
</view>
</template>
<script>
import CollectionItem from '@/components/mine/collection-item/index'
export default {
data() {
return {}
},
components: {
CollectionItem
}
};
</script>
<style lang="scss" scoped>
.collection {
min-height: calc(100vh - var(--window-top));
background-color: #ECECEC;
padding-top: 1rpx;
}
</style>

View File

@ -0,0 +1,31 @@
<template>
<view class="collection">
<view class="item-box" v-for="(item, index) in 5" :key="index">
<videoItem></videoItem>
</view>
</view>
</template>
<script>
import videoItem from "@/components/index/video-item/index"
export default {
data() {
return {}
},
components: {
videoItem
}
};
</script>
<style lang="scss" scoped>
.collection {
border-top: 1rpx solid #ECECEC;
padding: 21rpx 30rpx 0;
display: flex;
flex-wrap: wrap;
.item-box {
&:not(:nth-child(2n)) {
margin-right: 20rpx;
}
}
}
</style>

77
pageE/mine/Integral.vue Normal file
View File

@ -0,0 +1,77 @@
<template>
<view class="integral1">
<view class="integral-top">
<view>
<view class="title">总积分</view>
<view class="value">999</view>
</view>
<view>
<view class="title">经验值</view>
<view class="value">999</view>
</view>
<view>
<view class="title">预计进度</view>
<view class="value">999</view>
</view>
</view>
<scroll-view scroll-y class="integral-botom">
<rich-text :nodes="nodes"></rich-text>
</scroll-view>
</view>
</template>
<script>
export default {
data() {
return {
nodes: '<h1>2</h1><h1>2</h1><h1>2</h1><h1>2</h1><h1>2</h1><h1>2</h1><h1>2</h1><h1>2</h1><h1>2</h1><h1>2</h1><h1>2</h1><h1>2</h1><h1>2</h1><h1>2</h1><h1>2</h1><h1>2</h1><h1>2</h1><h1>2</h1>',
integralHeight: 0
}
},
onShow() {
this.setIntegralHeight();
},
methods: {
setIntegralHeight() {
// this.integralHeight =
}
},
};
</script>
<style lang="scss" scoped>
.integral1 {
height: calc(100vh - var(--window-top));
overflow: hidden;
position: relative;
.integral-top {
padding: 79rpx 88rpx;
width: 750rpx;
height: 271rpx;
background: linear-gradient(0deg,rgba(246,211,119,1) 1%,rgba(240,154,105,1) 100%);
display: flex;
justify-content: space-between;
> view {
flex: 1;
text-align: center;
.title {
font-size: 28rpx;
color: rgba(255,255,255, 0.6);
margin-bottom: 29rpx;
}
.value {
font-size: 48rpx;
font-weight: 500;
color: rgba(255,255,255,1);
}
}
}
.integral-botom {
position: absolute;
width: 750rpx;
height: calc(100vh - 251rpx);
background: rgba(255,255,255,1);
border-radius: 20rpx 20rpx 0rpx 0rpx;
top: 251rpx;
z-index: 9;
}
}
</style>

View File

@ -0,0 +1,59 @@
<template>
<view class="medal">
<scroll-view scroll-y class="medal-article">
<view class="medal-title">
<image src="../static/mine/29.png"></image>
<view>了解勋章</view>
<image src="../static/mine/30.png"></image>
</view>
<view class="medal-content">
<rich-text :nodes="nodes"></rich-text>
</view>
</scroll-view>
</view>
</template>
<script>
export default {
data() {
return {
nodes: '<h1>2</h1><h1>2</h1><h1>2</h1><h1>2</h1><h1>2</h1><h1>2</h1><h1>2</h1><h1>2</h1><h1>2</h1><h1>2</h1><h1>2</h1><h1>2</h1><h1>2</h1><h1>2</h1><h1>2</h1><h1>2</h1><h1>2</h1><h1>2</h1>'
}
}
};
</script>
<style lang="scss" scoped>
.medal {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100vh;
background: linear-gradient(0deg,rgba(246,211,119,1) 1%,rgba(240,154,105,1) 100%);
.medal-article {
box-sizing: border-box;
width: 690rpx;
height: 885rpx;
background: rgba(255,255,255,1);
border-radius: 20rpx;
padding: 40rpx 30rpx;
margin: calc(56rpx + var(--window-top)) auto 0;
.medal-title {
display: flex;
align-items: center;
justify-content: center;
margin-bottom: 52rpx;
> image {
width: 22rpx;
height: 22rpx;
}
> view {
font-size: 32rpx;
color: rgba(51,51,51,1);
margin: 0 30rpx;
}
}
.medal-content {
}
}
}
</style>

View File

@ -0,0 +1,58 @@
<template>
<view class="concerns">
<u-index-list :scrollTop="scrollTop">
<view v-for="(item, index) in indexList" :key="index">
<u-index-anchor :index="item" class="anchor-class" />
<view class="list-cell">
<image src="../static/mine/23.png"></image>
<view>阿迪达斯</view>
</view>
<view class="list-cell">
列表2
</view>
<view class="list-cell">
列表3
</view>
</view>
</u-index-list>
</view>
</template>
<script>
export default {
data() {
return {
scrollTop: 0,
indexList: ["A", "B", "C", "D", "E", "F", "G", "H", "I", "J", "K", "L", "M", "N", "O", "P", "Q", "R", "S", "T", "U", "V", "W", "X", "Y", "Z"]
}
},
onPageScroll(e) {
this.scrollTop = e.scrollTop;
}
};
</script>
<style lang="scss" scoped>
.concerns {
padding: 35rpx 30rpx 0;
.u-index-anchor {
background-color: #ffffff !important;
}
.list-cell {
display: flex;
box-sizing: border-box;
align-items: center;
width: 100%;
overflow: hidden;
margin: 50rpx 0;
> image {
width: 70rpx;
height: 70rpx;
border-radius: 10rpx;
margin-right: 30rpx;
}
> view {
font-size: 30rpx;
color: rgba(102,102,102,1);
}
}
}
</style>

View File

@ -2,11 +2,11 @@
<view class="mine">
<view class="mine-top">
<view class="top">
<img src="../static/mine/23.png" class="avatar" />
<img src="../static/mine/23.png" class="avatar" @click="toOtherPage('/mine/MineInfo')" />
<view class="user-info">
<view class="info-left">
<view class="user-nickname">小同学</view>
<view class="user-medal">
<view class="user-nickname" @click="toOtherPage('/mine/MineInfo')">小同学</view>
<view class="user-medal" @click="toOtherPage('/mine/MedalIntroduction')">
<img src="../static/mine/13.png" />
<view class="rank-title">勋章</view>
</view>
@ -16,26 +16,26 @@
<view class="user-rank">等级:34</view>
</view>
</view>
<view class="member-service" @click="toOtherPage('MemberServe')">会员服务</view>
<view class="member-service" @click="toOtherPage('/mine/MemberServe')">会员服务</view>
</view>
<view class="bottom">
<view>
<view @click="toOtherPage('/mine/GoodsCollection')">
<view>99</view>
<view>商品收藏</view>
</view>
<view>
<view @click="toOtherPage('/mine/StoreCollection')">
<view>9</view>
<view>店铺收藏</view>
</view>
<view>
<view @click="toOtherPage('/mine/ImageTextCollection')">
<view>9</view>
<view>图文收藏</view>
</view>
<view>
<view @click="toOtherPage('/mine/Integral')">
<view>9</view>
<view>积分数</view>
</view>
<view>
<view @click="toOtherPage('/mine/MineConcerns')">
<view>9</view>
<view>关注</view>
</view>
@ -45,33 +45,33 @@
<view class="order">
<view class="title">
<view class="title-text">我的订单</view>
<view class="more">
<view class="more" @click="toOtherPage('/order/Index')">
<view>查看全部订单</view>
<img src="../static/mine/21.png" />
</view>
</view>
<view class="content">
<view>
<view @click="toOtherPage('/order/Index?current=1')">
<img src="../static/mine/6.png" />
<view>待支付</view>
</view>
<view>
<view @click="toOtherPage('/order/Index?current=2')">
<img src="../static/mine/14.png" />
<view>已取消</view>
</view>
<view>
<view @click="toOtherPage('/order/Index?current=3')">
<img src="../static/mine/2.png" />
<view>待收货</view>
</view>
<view>
<view @click="toOtherPage('/order/Index?current=4')">
<img src="../static/mine/1.png" />
<view>试穿试送</view>
</view>
<view>
<view @click="toOtherPage('/order/Index?current=5')">
<img src="../static/mine/3.png" />
<view>待评价</view>
</view>
<view>
<view @click="toOtherPage('/order/Index?current=6')">
<img src="../static/mine/9.png" />
<view>售后</view>
</view>
@ -80,15 +80,15 @@
<view class="tool">
<view class="title">我的工具</view>
<view class="content">
<view @click="toOtherPage('SendWash')">
<view @click="toOtherPage('/tool/SendWash')">
<img src="../static/mine/20.png" />
<view>送洗</view>
</view>
<view @click="toOtherPage('Manicure')">
<view @click="toOtherPage('/tool/Manicure')">
<img src="../static/mine/19.png" />
<view>美甲</view>
</view>
<view @click="toOtherPage('MineHistory')">
<view @click="toOtherPage('/tool/MineHistory')">
<img src="../static/mine/18.png" />
<view>足迹</view>
</view>
@ -97,19 +97,19 @@
<view class="more-tool">
<view class="title">更多工具</view>
<view class="content">
<view @click="toOtherPage('Address')">
<view @click="toOtherPage('/more/Address')">
<img src="../static/mine/17.png" />
<view>收货地址</view>
</view>
<view @click="toOtherPage('AfterSalesHelp')">
<view @click="toOtherPage('/more/AfterSalesHelp')">
<img src="../static/mine/9.png" />
<view>售后政策</view>
</view>
<view @click="toOtherPage('MineHelp')">
<view @click="toOtherPage('/more/MineHelp')">
<img src="../static/mine/16.png" />
<view>使用帮助</view>
</view>
<view @click="toOtherPage('Complaints')">
<view @click="toOtherPage('/more/Complaints')">
<img src="../static/mine/15.png" />
<view>投诉意见</view>
</view>
@ -126,11 +126,16 @@ export default {
title: "2"
};
},
onLoad() {},
onLoad() {},
onNavigationBarButtonTap() {
console.log("setting");
this.toOtherPage("/setting/Index");
},
methods: {
toOtherPage(url) {
console.log(url);
uni.navigateTo({
url: '/pageE/mine/' + url
url: '/pageE' + url
});
}
}
@ -139,7 +144,6 @@ export default {
<style lang="scss" scoped>
.mine {
min-height: calc(100vh - var(--window-top));
// min-height: calc(100vh-var(--custom-bar-height));
background: #ECECEC;
.mine-top {
width: 750rpx;
@ -172,8 +176,10 @@ export default {
// height: 25rpx;
background: linear-gradient(269deg,rgba(175,175,175,1) 0%,rgba(224,224,224,1) 100%);
border-radius: 13rpx;
align-items: center;
padding: 0 17rpx 0 10rpx;
> img {
margin: 2rpx 10rpx;
margin-right: 9rpx;
width: 20rpx;
height: 22rpx;
}

87
pageE/mine/MineInfo.vue Normal file
View File

@ -0,0 +1,87 @@
<template>
<view class="information">
<view class="info-avatar">
<image src="../static/mine/23.png"></image>
</view>
<view class="info-item">
<view class="title">昵称</view>
<view class="value">胖胖</view>
</view>
<view class="info-item">
<view class="title">性别</view>
<view class="value"></view>
</view>
<view class="info-item">
<view class="title">生日</view>
<view class="value">1998.10.13</view>
</view>
<view class="info-item">
<view class="title">手机号</view>
<view class="value">18265906216</view>
</view>
<view class="info-item">
<view class="title">等级</view>
<view class="value">9999</view>
</view>
<view class="info-item">
<view class="title">积分数</view>
<view class="value">9999</view>
</view>
<view class="info-item">
<view class="title">经验值</view>
<view class="value">9999</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {}
},
onNavigationBarButtonTap() {
this.toEditPage();
},
methods: {
toEditPage() {
uni.navigateTo({
url: '/pageE/mine/EditUserInfo'
});
}
},
};
</script>
<style lang="scss" scoped>
.information {
min-height: calc(100vh - var(--window-top));
background-color: #ECECEC;
padding-top: 1rpx;
.info-avatar {
text-align: center;
height: 160rpx;
background: rgba(255,255,255,1);
> image {
flex-shrink: 0;
width: 120rpx;
height: 120rpx;
border-radius: 50%;
margin-top: 20rpx;
}
}
.info-item {
display: flex;
align-items: center;
padding: 35rpx 30rpx;
border-top: 2rpx solid #ECECEC;
font-size: 30rpx;
height: 98rpx;
background: rgba(255,255,255,1);
.title {
width: 240rpx;
color: rgba(51,51,51,1);
}
.value {
color: rgba(102,102,102,1);
}
}
}
</style>

View File

@ -0,0 +1,106 @@
<template>
<view class="store">
<u-swipe-action
v-for="(item, index) in list" :key="index"
:index='index'
:show="item.show"
:options="options"
@click="click"
@open="open"
>
<view class="item u-border-bottom">
<image src="@/pageE/static/mine/23.png"></image>
<!-- 此层wrap在此为必写的否则可能会出现标题定位错误 -->
<view class="title-wrap">
<view class="item-name u-line-1">胖胖定制此层wrap在此为必写的否则可能会出现标题定位错误</view>
<view class="item-date">
<image src="@/pageE/static/mine/26.png"></image>
<view>2020-05-17</view>
</view>
</view>
</view>
</u-swipe-action>
</view>
</template>
<script>
export default {
data() {
return {
list: [
{
id: 1,
show: false
},
{
id: 2,
show: false
},
{
id: 3,
show: false,
}
],
btnWidth: 152,
show: false,
options: [
{
text: '删除',
style: {
backgroundColor: '#FF3131'
}
}
]
}
},
methods: {
click(index) {
this.list.splice(index, 1);
this.$u.toast(`删除了第${index+1}个cell`);
},
open(index) {
// swipeActionprops
// 'false''false'
this.list[index].show = true;
this.list.map((val, idx) => {
if(index != idx) this.list[idx].show = false;
})
}
},
};
</script>
<style lang="scss" scoped>
.store {
.item {
padding: 30rpx;
display: flex;
align-items: center;
> image {
width: 80rpx;
height: 80rpx;
border-radius: 50%;
flex-shrink: 0;
margin-right: 21rpx;
}
.title-wrap {
flex: 1;
display: flex;
align-items: center;
justify-content: space-between;
.item-name {
width: 260rpx;
font-size: 30rpx;
color: rgba(51,51,51,1);
}
.item-date {
display: flex;
align-items: center;
> image {
margin-right: 25rpx;
width: 24rpx;
height: 24rpx;
}
}
}
}
}
</style>

109
pageE/mine/UpdatePhone.vue Normal file
View File

@ -0,0 +1,109 @@
<template>
<view class="update-phone">
<view class="update-main">
<view class="old-phone">
<view class="phone-number">
<view class="title">原手机号</view>
<input type="text" placeholder="请输入手机号码" />
</view>
<view class="code">
<view class="title">验证码</view>
<input type="text" placeholder="请输入验证码" />
<view class="get-code">获取验证码</view>
</view>
</view>
<view class="new-phone">
<view class="phone-number">
<view class="title">新手机号</view>
<input type="text" placeholder="请输入手机号码" />
</view>
<view class="code">
<view class="title">验证码</view>
<input type="text" placeholder="请输入验证码" />
<view class="get-code">获取验证码</view>
</view>
</view>
</view>
<view class="tips">注意修改手机号需要原手机号获取验证码无原手机验证码请联系后台</view>
</view>
</template>
<script>
export default {
data() {
return {}
}
};
</script>
<style lang="scss" scoped>
.update-phone {
min-height: calc(100vh - var(--window-top));
background-color: #ECECEC;
padding-top: 1rpx;
.update-main {
@mixin update-General() {
> view {
display: flex;
align-items: center;
padding: 35rpx 30rpx;
background-color: #ffffff;
.title {
width: 156rpx;
font-size: 28rpx;
color: rgba(51,51,51,1);
}
.input {
flex: 1;
font-size: 26rpx;
}
.get-code {
font-size: 28rpx;
color: rgba(153,153,153,1);
position: relative;
padding: 0 25rpx;
margin-left: 20rpx;
&::after {
position: absolute;
content: "";
width: 2rpx;
height: 43rpx;
background: rgba(242,242,242,1);
left: 0;
top: 50%;
transform: translate(0, -50%);
}
}
}
// .phone-number::after {
// position: absolute;
// content: "";
// width: 2rpx;
// height: 43rpx;
// background: rgba(242,242,242,1);
// left: 0;
// top: 50%;
// transform: translate(0, -50%);
// }
.code {
display: flex;
align-items: center;
.title {
font-size: 28rpx;
color: rgba(51,51,51,1);
}
}
}
.old-phone {
@include update-General()
}
.new-phone {
@include update-General()
}
}
.tips {
padding: 20rpx 30rpx;
font-size: 24rpx;
color: rgba(102,102,102,1);
line-height: 40rpx;
}
}
</style>

View File

@ -4,7 +4,7 @@
<view class="suggestions">
<view class="text">您的满意是对我们最大的支持茫茫德铭阳光之中能够遇到亲也是我们的荣幸</view>
<view class="image">
<img v-for="(url, index) in imgList" :key="index" :src="url" />
<image v-for="(url, index) in imgList" :key="index" :src="url"></image>
</view>
</view>
<view class="reply">
@ -12,7 +12,7 @@
<view class="reply-content u-line-4">您的满意是对我们最大的支持茫茫德铭阳光之中能够遇到亲也是我们的荣幸您的评价是对我们付出最好的认可我们会不断前行不忘初衷给亲们提供更好的服务和产品!我把对您的谢意写在纸上被风吹走了;我把对您的谢意写在沙滩上被海浪卷走了;我只好把对您的谢意写在解释里这样才会永驻心间!感谢您对的支持!加油!加油! 祝您生活愉快工作顺利期待我们下次合作愉快! ! !</view>
</view>
<view class="date">
<img src="../static/mine/26.png" />
<image src="../static/mine/26.png"></image>
<view>2020-05-14</view>
</view>
</view>
@ -32,7 +32,7 @@ export default {
},
onNavigationBarButtonTap() {
uni.navigateTo({
url: '/pageE/mine/WriteComments'
url: '/pageE/more/WriteComments'
});
},
}
@ -55,9 +55,10 @@ export default {
.image {
display: flex;
flex-wrap: wrap;
> img {
> image {
width: 210rpx;
height: 210rpx;
flex-shrink: 0;
border-radius: 10rpx;
margin-bottom: 10rpx;
&:not(:nth-child(3n)) {
@ -85,10 +86,11 @@ export default {
.date {
display: flex;
align-items: center;
> img {
> image {
width: 28rpx;
height: 28rpx;
margin-right: 12rpx;
flex-shrink: 0;
}
> view {
font-size: 24rpx;

98
pageE/order/Comment.vue Normal file
View File

@ -0,0 +1,98 @@
<template>
<view class="comment">
<view class="main-container">
<textarea @blur="bindTextAreaBlur" auto-height placeholder="发表你的评价吧,收货时心情如何?" maxlength="200" />
<u-upload
ref="uUpload"
@on-uploaded="onUploaded"
:custom-btn="true"
:max-count="count"
:auto-upload="false"
>
<view slot="addBtn" class="slot-btn" hover-class="slot-btn__hover" hover-stay-time="150">
<img src="../static/mine/27.png" />
</view>
</u-upload>
</view>
<view class="rate">
<view>
<view class="title">物流评分</view>
<u-rate :count="5" current="1" active-color="#FF780F" inactive-color="#CCCCCC" gutter="20" size="32"></u-rate>
</view>
<view>
<view class="title">服务态度</view>
<u-rate :count="5" current="1" active-color="#FF780F" inactive-color="#CCCCCC" gutter="20" size="32"></u-rate>
</view>
<view>
<view class="title">描述相符</view>
<u-rate :count="5" current="1" active-color="#FF780F" inactive-color="#CCCCCC" gutter="20" size="32"></u-rate>
</view>
</view>
<view class="write-btn" @click="submit">发表意见</view>
</view>
</template>
<script>
export default {
data() {
return {
count: 4,
logistics: 1,
service: 1,
describe: 1
}
}
};
</script>
<style lang="scss" scoped>
.comment {
min-height: calc(100vh - var(--window-top));
background-color: #ECECEC;
.main-container {
background-color: #ffffff;
padding: 30rpx;
margin-bottom: 10rpx;
textarea {
width: 100% !important;
margin-bottom: 60rpx;
}
.slot-btn {
width: 140rpx;
height: 140rpx;
background: rgba(236,236,236,1);
border-radius: 10rpx;
text-align: center;
> img {
margin-top: 48rpx;
width: 54rpx;
height: 49rpx;
}
}
}
.rate {
background-color: #ffffff;
padding: 33rpx 30rpx;
> view {
display: flex;
&:not(:last-child) {
margin-bottom: 35rpx;
}
.title {
margin-right: 25rpx;
font-size: 28rpx;
color: rgba(51,51,51,1);
}
}
}
.write-btn {
margin: 120rpx auto 0;
width: 690rpx;
height: 98rpx;
background: rgba(255,120,15,1);
border-radius: 46rpx;
font-size: 36rpx;
color: rgba(255,255,255,1);
text-align: center;
line-height: 98rpx;
}
}
</style>

302
pageE/order/Details.vue Normal file
View File

@ -0,0 +1,302 @@
<template>
<view class="details">
<view class="status">
<view class="text">
<view class="status-text">交易成功</view>
<view class="time" v-if="current == 2">距离结束22:22:22</view>
</view>
<image src="../static/mine/31.png" v-if="current"></image>
</view>
<view class="info">
<view class="info-address">
<image src="../static/mine/28.png"></image>
<view class="address-right">
<view class="user-info">
<view>胖胖</view>
<view>18220171014</view>
</view>
<view class="address-text u-line-2">山东省泰安市泰山区东岳大街与克山路交汇口银山店四楼橙天影视南邻山东省泰安市泰山区东岳大街与克山路交汇口银山店四楼橙天影视南邻</view>
</view>
</view>
<view class="info-goods">
<view class="goods-store">
<view class="stoer-title">
<image src="../static/mine/23.png" class="store-image"></image>
<view class="store-name">胖胖的店</view>
<image src="../static/mine/21.png" class="right-icon"></image>
</view>
<view class="store-goods">
<image src="../static/mine/23.png"></image>
<view class="goods-info">
<view class="goods-name u-line-2">木糖少女小紫薯西装领连衣裙夏季新款女装夏收腰格子格纹裙子木糖少女小紫薯西装领连衣裙夏季新款女装夏收腰格子格纹裙子</view>
<view class="goods-order">
<view class="price">99</view>
<view class="num">x2</view>
</view>
</view>
</view>
</view>
<view class="goods-others">
<view>
<view class="title">运费(快递/骑手)</view>
<view class="price">0.00</view>
</view>
<view>
<view class="title">店铺优惠</view>
<view class="price">0.00</view>
</view>
<view>
<view class="title">订单总价</view>
<view class="price">0.00</view>
</view>
<view>
<view class="title">实付费(含运费)</view>
<view class="price">0.00</view>
</view>
<view>
<view class="title">支付方式</view>
<view class="price">0.00</view>
</view>
</view>
</view>
<view class="info-order">
<view>订单编号2222222222222222</view>
<view>微信交易号2222222222222222</view>
<view>创建时间2020-05-14</view>
</view>
</view>
<view class="btn" v-if="[0, 2, 4].indexOf(current) < 0">
<view class="logistics" v-if="current == 3" @click="toOtherPage('Logistics')">查看物流</view>
<view class="comment" v-if="current == 5">立即评价</view>
<view class="payment" v-if="current == 1">立即支付</view>
<view class="service" v-if="current == 6">联系官方客服</view>
<view class="submit" v-if="current == 6">提交官方审核</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
current: 0
}
},
onLoad(option) {
this.current = option.current;
console.log(option.current);
this.setTitle();
},
methods: {
setTitle(){
let title = ''
switch (this.current) {
case '1':
console.log(title);
title = "支付成功"
break;
default:
title = "订单详情"
break;
}
uni.setNavigationBarTitle({
title: title
});
},
toOtherPage(url) {
uni.navigateTo({
url: '/pageE/order/' + url
});
}
},
};
</script>
<style lang="scss" scoped>
.details {
min-height: calc(100vh - var(--window-top));
background-color: #ECECEC;
.status {
position: fixed;
top: 0;
left: 0;
display: flex;
height: calc(180rpx + var(--window-top));
width: 100%;
background: rgba(255,120,15,1);
z-index: 9;
.text {
margin: calc(74rpx + var(--window-top)) auto 0 73rpx;
color: rgba(255,255,255,1);
.status-text {
font-size: 36rpx;
font-weight: 500;
margin-bottom: 17rpx;
}
.time {
// white-space: nowrap;
font-size: 26rpx;
color: rgba(255,255,255,1);
}
}
> image {
margin: calc(36rpx + var(--window-top)) 70rpx 0 0;
width: 126rpx;
height: 109rpx;
flex-shrink: 0;
}
}
.info {
padding-top: 180rpx;
margin-bottom: 10rpx;
.info-address {
padding: 30rpx;
display: flex;
align-items: center;
margin-bottom: 10rpx;
background:rgba(255,255,255,1);
> image {
width: 28rpx;
height: 34rpx;
margin-right: 31rpx;
flex-shrink: 0;
}
.address-right {
.user-info {
display: flex;
align-items: center;
font-size: 28rpx;
color: rgba(51,51,51,1);
margin-bottom: 20rpx;
> view:first-child {
margin-right: 13rpx;
}
}
.address-text {
font-size: 24rpx;
color: rgba(102,102,102,1);
line-height: 42rpx;
}
}
}
.info-goods {
margin-bottom: 10rpx;
.goods-store {
padding: 30rpx;
margin-bottom: 2rpx;
background:rgba(255,255,255,1);
.stoer-title {
display: flex;
align-items: center;
margin-bottom: 20rpx;
.store-image {
width: 60rpx;
height: 60rpx;
border-radius: 50%;
margin-right: 16rpx;
}
.store-name {
font-size: 28rpx;
color: rgba(51,51,51,1);
margin-right: 14rpx;
}
.right-icon {
width: 11rpx;
height: 22rpx;
}
}
.store-goods {
display: flex;
> image {
width: 180rpx;
height: 160rpx;
border-radius: 10rpx;
margin-right: 30rpx;
flex-shrink: 0;
}
.goods-info {
display: flex;
flex-direction: column;
justify-content: space-between;
.goods-name {
font-size: 30rpx;
color: rgba(51,51,51,1);
line-height: 44rpx;
}
.goods-order {
display: flex;
align-items: center;
justify-content: space-between;
.price {
font-size: 30rpx;
font-weight: 500;
color: rgba(51,51,51,1);
}
.num {
font-size: 28rpx;
color: rgba(102,102,102,1);
}
}
}
}
}
.goods-others {
background:rgba(255,255,255,1);
padding: 30rpx;
> view {
display: flex;
align-items: center;
justify-content: space-between;
&:not(:last-child) {
margin-bottom: 30rpx;
}
.title {
font-size: 28rpx;
color: rgba(102,102,102,1);
}
.price {
font-size: 30rpx;
color: rgba(51,51,51,1);
}
}
}
}
.info-order {
background:rgba(255,255,255,1);
padding: 30rpx;
font-size: 28rpx;
color: rgba(102,102,102,1);
> view:not(:last-child) {
margin-bottom: 30rpx;
}
}
}
.btn {
height: 98rpx;
background: rgba(255,255,255,1);
display: flex;
justify-content: flex-end;
padding: 19rpx 30rpx;
@mixin btn-class($width, $color) {
width: $width;
height: 60rpx;
border: 2rpx solid $color;
color: $color;
border-radius: 30rpx;
padding: 15rpx 23rpx;
font-size: 28rpx;
&:not(:last-child) {
margin-right: 30rpx;
}
}
.logistics, .comment, .payment {
@include btn-class($width: 160rpx, $color: rgba(255,119,15,1));
}
.service {
@include btn-class($width: 216rpx, $color: rgba(155,153,153,1));
}
.submit {
@include btn-class($width: 216rpx, $color: rgba(255,119,15,1));
}
}
}
</style>

119
pageE/order/Index.vue Normal file
View File

@ -0,0 +1,119 @@
<template>
<view class="order">
<view>
<u-tabs-swiper ref="tabs" :list="list" :is-scroll="false" active-color="#FF780F" :current="current" font-size="26" @change="tabsChange" height="88" :gutter="30"></u-tabs-swiper>
</view>
<swiper :current="swiperCurrent" @animationfinish="animationfinish">
<swiper-item class="swiper-item">
<scroll-view scroll-y style="height: 100%;">
<view class="item-container" v-for="(item, index) in 4" :key="index">
<OrderItem :current="current"></OrderItem>
</view>
</scroll-view>
</swiper-item>
<swiper-item class="swiper-item">
<scroll-view scroll-y style="height: 100%;">
<view class="item-container">
<OrderItem :current="current"></OrderItem>
</view>
</scroll-view>
</swiper-item>
<swiper-item class="swiper-item">
<scroll-view scroll-y style="height: 100%;">
<view class="item-container">
<OrderItem :current="current"></OrderItem>
</view>
</scroll-view>
</swiper-item>
<swiper-item class="swiper-item">
<scroll-view scroll-y style="height: 100%;">
<view class="item-container">
<OrderItem :current="current"></OrderItem>
</view>
</scroll-view>
</swiper-item>
<swiper-item class="swiper-item">
<scroll-view scroll-y style="height: 100%;">
<view class="item-container">
<OrderItem :current="current"></OrderItem>
</view>
</scroll-view>
</swiper-item>
<swiper-item class="swiper-item">
<scroll-view scroll-y style="height: 100%;">
<view class="item-container">
<OrderItem :current="current"></OrderItem>
</view>
</scroll-view>
</swiper-item>
<swiper-item class="swiper-item">
<scroll-view scroll-y style="height: 100%;">
<view class="item-container">
<OrderItem :current="current"></OrderItem>
</view>
</scroll-view>
</swiper-item>
</swiper>
</view>
</template>
<script>
import OrderItem from '@/components/mine/order-item/index'
export default {
data() {
return {
list: [{
name: '全部'
}, {
name: '待支付'
}, {
name: '已取消'
}, {
name: '待收货'
}, {
name: '试穿试送'
}, {
name: '待评价'
}, {
name: '售后'
}],
current: 0,
swiperCurrent: 0
}
},
components: {
OrderItem
},
onLoad(option) {
if(option.current) {
this.current = Number(option.current);
this.swiperCurrent = this.current;
}
},
methods: {
tabsChange(index) {
this.swiperCurrent = Number(index);
},
animationfinish(e) {
let current = Number(e.detail.current);
this.swiperCurrent = current;
this.current = current;
}
}
};
</script>
<style lang="scss" scoped>
.order {
min-height: calc(100vh - var(--window-top));
background-color: #ECECEC;
display: flex;
flex-direction: column;
> uni-swiper {
flex: 1;
}
.swiper-item {
.item-container {
padding: 20rpx 30rpx;
}
}
}
</style>

150
pageE/order/Logistics.vue Normal file
View File

@ -0,0 +1,150 @@
<template>
<view class="logistics">
<view class="logistics-info">
<view class="express">
<image src="../static/mine/23.png"></image>
<view class="dispatcher-info">
<view>派件员xxx</view>
<view>手机123456789</view>
</view>
</view>
<view class="express-status">
<image src="../static/mine/23.png"></image>
<view>
<view class="status">物流状态已签收</view>
<view>承运来源百世快递</view>
<view>运单编号3253463464777</view>
<view>官方电话4009-565-656</view>
</view>
</view>
</view>
<view class="logistics-tracking">
<view class="title">物流跟踪</view>
<view class="main">
<view v-for="(item, index) in list" :key="index" class="logistics-item">
<view class="info u-line-2">{{ item.address }}</view>
<view class="date">{{ item.date }}</view>
</view>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
list: [
{
address: '[北京市]【已签收,本人签收】,感谢使用百事快递,期待再次为您服务[北京市]【已签收,本人签收】,感谢使用百事快递,期待再次为您服务[北京市]【已签收,本人签收】,感谢使用百事快递,期待再次为您服务',
date: '2019-12-25 09:38:21'
},
{
address: '[北京市]【已签收,本人签收】,感谢使用百事快递,期待再次为您服务',
date: '2019-12-25 09:38:21'
},
{
address: '[北京市]【已签收,本人签收】,感谢使用百事快递,期待再次为您服务',
date: '2019-12-15 09:38:20'
},
{
address: '卖家已发货',
date: '2019-12-15 09:38:20'
}
]
}
}
};
</script>
<style lang="scss" scoped>
.logistics {
min-height: calc(100vh - var(--window-top));
padding: 40rpx 30rpx;
border-top: 1rpx solid #ECECEC;
.logistics-info {
.express {
display: flex;
align-items: center;
margin-bottom: 40rpx;
> image {
flex-shrink: 0;
width: 80rpx;
height: 80rpx;
border-radius: 50%;
margin-right: 35rpx;
}
.dispatcher-info {
font-size: 26rpx;
color: rgba(51,51,51,1);
> view:first-child {
margin-bottom: 19rpx;
}
}
}
.express-status {
display: flex;
align-items: center;
padding-bottom: 30rpx;
position: relative;
&::after {
content: '';
position: absolute;
width: 690rpx;
height: 2rpx;
background: rgba(236,236,236,1);
bottom: 0;
left: 50%;
transform: translate(-50%, 0);
}
> image {
flex-shrink: 0;
width: 200rpx;
height: 200rpx;
border-radius: 10rpx;
margin-right: 29rpx;
}
> view {
.status {
font-size: 26rpx;
color: rgba(51,51,51,1);
margin-bottom: 29rpx !important;
}
> view {
font-size: 24rpx;
color:rgba(102,102,102,1);
&:not(:last-child) {
margin-bottom: 20rpx;
}
}
}
}
}
.logistics-tracking {
padding-top: 35rpx;
.title {
font-size: 30rpx;
font-weight: 500;
color: rgba(51,51,51,1);
margin-bottom: 35rpx;
}
.main {
.logistics-item {
&:not(:last-child) {
margin-bottom: 75rpx;
}
.info {
font-size: 26rpx;
font-weight: 500;
color: rgba(51,51,51,1);
line-height: 38rpx;
margin-bottom: 14rpx;
}
.date {
font-size: 22rpx;
font-weight: 500;
color: rgba(153,153,153,1);
}
}
}
}
}
</style>

107
pageE/setting/Index.vue Normal file
View File

@ -0,0 +1,107 @@
<template>
<view class="setting">
<view class="list-item">
<view>消息提醒</view>
<view>
<u-switch v-model="checked" active-color="#FF770F" inactive-color="#A9A7A7" size="35"></u-switch>
</view>
</view>
<view v-for="(item, index) in settingList" :key="index" class="list-item" @click="toNextPage(item.link)">
<view>{{ item.title }}</view>
<image src="../static/mine/21.png"></image>
</view>
<view class="list-item" @click="sheetStatus=true">
<view>退出登录</view>
<image src="../static/mine/21.png"></image>
</view>
<u-action-sheet
v-model="sheetStatus"
:list="list"
:tips="tips"
:border-radius="20"
@click="choiceOption">
</u-action-sheet>
</view>
</template>
<script>
export default {
data() {
return {
checked: false,
tips: {
text: '您可选择以下操作',
color: '#999999',
fontSize: 24
},
sheetStatus: false,
list: [
{
text: '换个账号登录',
color: '#FF780F',
fontSize: 28
},
{
text: '退出登录',
color: '#FF780F',
fontSize: 28
}
],
settingList: [
{
title: '个人信息',
link: '../mine/MineInfo'
},
{
title: '收货地址',
link: '../more/Address'
},
{
title: '证件中心',
link: '../mine/ArticleDetails?title=证件照中心'
},
{
title: '关于我们',
link: '../mine/ArticleDetails?title=关于我们'
},
{
title: '帮助与反馈',
link: './feedback'
}
]
}
},
methods: {
choiceOption(index) {
console.log(index);
// console.log(`${index + 1}${this.list[index].text}`)
},
toNextPage(url, ...params) {
uni.navigateTo({
url: url
});
}
},
};
</script>
<style lang="scss" scoped>
.setting {
min-height: calc(100vh - var(--window-top));
background-color: #ECECEC;
.list-item {
display: flex;
align-items: center;
justify-content: space-between;
height: 98rpx;
border-top: 2rpx solid #EBEBEB;
background-color: #ffffff;
padding: 0 30rpx;
font-size: 30rpx;
color: rgba(51,51,51,1);
> image {
width: 14rpx;
height: 24rpx;
}
}
}
</style>

View File

@ -0,0 +1,99 @@
<template>
<view class="feedback">
<view class="feedback-box">
<view class="feedback-title">人工服务</view>
<view class="feedback-itme">
<view class="manual">
<view class="service-phone">拨打官方客服电话400-100-100</view>
<view class="manual-time">周一至周五08:0-18:00</view>
</view>
<view class="suggestions">意见反馈</view>
</view>
</view>
<view class="feedback-box">
<view class="feedback-title">常见服务</view>
<view class="feedback-itme">
<view class="u-line-2">账号问题登录时需要验证码手机号使用不了怎么办</view>
<view class="u-line-2">账号问题登录时需提示您的密码不安全请重置</view>
<view class="u-line-2">账号问题登录密码忘记了怎么办</view>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {}
}
};
</script>
<style lang="scss" scoped>
.feedback {
min-height: calc(100vh - var(--window-top));
background: #ECECEC;
padding: 20rpx 30rpx;
.feedback-box {
width: 689rpx;
background: rgba(255,255,255,1);
border-radius: 10rpx;
margin-bottom: 20rpx;
padding: 30rpx;
.feedback-title {
position: relative;
font-size: 30rpx;
font-weight: 500;
color: rgba(51,51,51,1);
// margin-bottom: 30rpx;
padding-left: 20rpx;
&::after {
position: absolute;
content: '';
width: 6rpx;
height: 30rpx;
background: rgba(255,120,15,1);
top: 50%;
left: 0;
transform: translate(0, -50%);
}
}
.feedback-itme {
> view {
position: relative;
font-size: 26rpx;
color: rgba(51,51,51,1);
line-height: 42rpx;
&:not(:last-child) {
padding: 20rpx 0;
&::after {
position: absolute;
content: '';
width: 630rpx;
height: 2rpx;
background: rgba(236,236,236,1);
bottom: 0;
left: 50%;
transform: translate(-50%, 0);
}
}
&:last-child {
padding-top: 20rpx;
}
}
.manual {
.service-phone {
}
.manual-time {
font-size: 22rpx;
color: rgba(153,153,153,1);
}
}
.suggestions {
font-size: 26rpx;
font-weight: 500;
color: rgba(102,102,102,1);
}
}
}
}
</style>

BIN
pageE/static/mine/28.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.3 KiB

BIN
pageE/static/mine/29.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.3 KiB

BIN
pageE/static/mine/30.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.4 KiB

BIN
pageE/static/mine/31.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 7.3 KiB

BIN
pageE/static/mine/32.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 9.6 KiB

BIN
pageE/static/mine/33.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 8.0 KiB

BIN
pageE/static/mine/34.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 8.2 KiB

BIN
pageE/static/mine/35.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 8.7 KiB

View File

@ -6,7 +6,7 @@
<swiper :current="swiperCurrent" @animationfinish="animationfinish">
<swiper-item class="swiper-item">
<scroll-view scroll-y class="order-list">
<view v-for="(item, index) in 3" :key="index" class="order-item">
<view v-for="(item, index) in 6" :key="index" class="order-item">
<view class="order-title">
<view class="order-text">订单</view>
<view class="order-status">已预约</view>
@ -55,7 +55,7 @@ export default {
toApplyPage(index) {
if(index == 1) {
uni.navigateTo({
url: '/pageE/mine/ManicureOrder'
url: '/pageE/tool/ManicureOrder'
});
}
}
@ -72,8 +72,9 @@ export default {
flex: 1;
}
.swiper-item {
padding: 20rpx 30rpx 0;
.order-list {
box-sizing: border-box;
padding: 20rpx 30rpx 0;
.order-item {
padding: 30rpx;
width:690rpx;

View File

@ -6,7 +6,7 @@
<swiper :current="swiperCurrent" @animationfinish="animationfinish">
<swiper-item class="swiper-item">
<scroll-view scroll-y class="order-list">
<view v-for="(item, index) in 3" :key="index" class="order-item">
<view v-for="(item, index) in 6" :key="index" class="order-item">
<view class="order-title">
<view class="order-text">订单状态</view>
<view class="order-status">已预约</view>
@ -23,19 +23,22 @@
</scroll-view>
</swiper-item>
<swiper-item class="swiper-item">
<scroll-view scroll-y class="none-page">
<scroll-view scroll-y style="height: 100%;" class="none-page">
<view></view>
</scroll-view>
</swiper-item>
<swiper-item class="swiper-item">
<scroll-view scroll-y class="none-page">
<view></view>
<scroll-view scroll-y class="comment">
<view v-for="(item, index) in 3" :key="index" class="comment-item">
<Comment></Comment>
</view>
</scroll-view>
</swiper-item>
</swiper>
</view>
</template>
<script>
import Comment from '@/components/mine/comment/index'
export default {
data() {
return {
@ -50,6 +53,9 @@ export default {
swiperCurrent: 0
}
},
components: {
Comment
},
onShow() {
this.current = 0;
this.swiperCurrent = 0;
@ -66,11 +72,11 @@ export default {
this.toApplyPage(current);
},
toApplyPage(index) {
// if(index == 2) {
// uni.navigateTo({
// url: '/pageE/mine/ManicureOrder'
// });
// }
if(index == 1) {
uni.navigateTo({
url: '/pageE/tool/WashOrder'
});
}
}
},
};
@ -85,8 +91,12 @@ export default {
flex: 1;
}
.swiper-item {
padding: 20rpx 30rpx 0;
padding-top: 20rpx;
.order-list {
width: 100%;
height: 100%;
box-sizing: border-box;
padding: 0 30rpx;
.order-item {
padding: 30rpx;
width:690rpx;
@ -127,6 +137,13 @@ export default {
}
}
}
.comment {
width: 100%;
height: 100%;
.comment-item {
margin-bottom: 20rpx;
}
}
}
}
</style>

145
pageE/tool/WashOrder.vue Normal file
View File

@ -0,0 +1,145 @@
<template>
<view class="wash-order">
<view class="order-info">
<view class="order-name">
<view class="title">送洗人</view>
<input type="text" v-model="name" />
</view>
<view class="order-phone">
<view class="title">手机号</view>
<input type="text" v-model="phone" />
</view>
<view class="order-area">
<view class="title">省市区</view>
<input type="text" v-model="area" />
<view class="location">
<image src="../static/mine/28.png"></image>
<view>定位</view>
</view>
</view>
<view class="order-address">
<view class="title">详细地址</view>
<input type="text" v-model="address" />
</view>
</view>
<view class="upload-image">
<view class="title">上传商品图片</view>
<u-upload
ref="uUpload"
@on-uploaded="onUploaded"
:custom-btn="true"
:max-count="count"
:auto-upload="false"
>
<view slot="addBtn" class="slot-btn" hover-class="slot-btn__hover" hover-stay-time="150">
<img src="../static/mine/27.png" />
</view>
</u-upload>
</view>
<view class="wash-btn">确认送洗</view>
</view>
</template>
<script>
export default {
data() {
return {
count: 4, //
name: '',
phone: '',
area: '',
address: ''
}
},
methods: {
submit() {
this.$refs.uUpload.upload();
},
onUploaded(list) {
console.log(list)
}
},
};
</script>
<style lang="scss" scoped>
.wash-order {
border-top: 1rpx solid #ECECEC;
.order-info {
> view {
width: 750rpx;
height: 98rpx;
background: rgba(255,255,255,1);
padding: 35rpx 30rpx;
display: flex;
align-items: center;
justify-content: space-between;
position: relative;
&::after {
content: '';
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 2rpx;
background-color: #ECECEC;
}
.title {
font-size: 30rpx;
color: rgba(51,51,51,1);
margin-right: 10rpx;
}
> input {
flex: 1;
text-align: right;
}
}
.order-area {
.location {
margin-left: 20rpx;
text-align: center;
font-size: 22rpx;
color: rgba(255,120,15,1);
> image {
width: 26rpx;
height: 32rpx;
margin-bottom: 10rpx;
}
}
}
}
.upload-image {
padding: 35rpx 30rpx;
.title {
font-size: 30rpx;
color: rgba(51,51,51,1);
margin-bottom: 34rpx;
}
.slot-btn {
width: 140rpx;
height: 140rpx;
background: rgba(236,236,236,1);
border-radius: 10rpx;
text-align: center;
> img {
width: 54rpx;
height: 49rpx;
margin-top: 48rpx;
}
}
}
.wash-btn {
width: 690rpx;
height: 98rpx;
background: rgba(255,120,15,1);
border-radius: 49rpx;
position: absolute;
bottom: 40rpx;
left: 50%;
transform: translate(-50%, 0);
font-size: 36rpx;
color:rgba(255,255,255,1);
text-align: center;
line-height: 98rpx;
}
}
</style>

View File

@ -56,47 +56,55 @@
"navigationBarTitleText": "我的",
"app-plus": {
"titleSize": "36px",
"titleColor": "#333333",
"titleNView": {
"backgroundColor": "#FFFFFF"
"titleColor": "#333333",
"backgroundColor": "#FFFFFF",
"buttons": [
{
"type": "none",
"text": "\ue502",
"float": "right",
"fontSize": "14"
}
]
}
}
}
},
{
"path": "mine/MineHistory",
"path": "tool/MineHistory",
"style": {
"navigationBarTitleText": "我的足迹",
"app-plus": {
"titleSize": "36px",
"titleColor": "#333333",
"titleNView": {
"titleColor": "#333333",
"backgroundColor": "#FFFFFF"
}
}
}
},
{
"path": "mine/MineHelp",
"path": "more/MineHelp",
"style": {
"navigationBarTitleText": "使用帮助",
"app-plus": {
"titleSize": "36px",
"titleColor": "#333333",
"titleNView": {
"titleColor": "#333333",
"backgroundColor": "#FFFFFF"
}
}
}
},
{
"path": "mine/AfterSalesHelp",
"path": "more/AfterSalesHelp",
"style": {
"navigationBarTitleText": "售后政策",
"app-plus": {
"titleSize": "36px",
"titleColor": "#333333",
"titleNView": {
"titleColor": "#333333",
"backgroundColor": "#FFFFFF"
}
}
@ -107,34 +115,34 @@
"style": {
"app-plus": {
"titleSize": "36px",
"titleColor": "#333333",
"titleNView": {
"titleColor": "#333333",
"backgroundColor": "#FFFFFF"
}
}
}
},
{
"path": "mine/Address",
"path": "more/Address",
"style": {
"navigationBarTitleText": "收货地址",
"app-plus": {
"titleSize": "36px",
"titleColor": "#333333",
"titleNView": {
"titleColor": "#333333",
"backgroundColor": "#FFFFFF"
}
}
}
},
{
"path": "mine/EditAddress",
"path": "more/EditAddress",
"style": {
"navigationBarTitleText": "编辑地址",
"app-plus": {
"titleSize": "36px",
"titleColor": "#333333",
"titleNView": {
"titleColor": "#333333",
"backgroundColor": "#FFFFFF",
"buttons": [
{
@ -149,26 +157,26 @@
}
},
{
"path": "mine/AddAddress",
"path": "more/AddAddress",
"style": {
"navigationBarTitleText": "添加地址",
"app-plus": {
"titleSize": "36px",
"titleColor": "#333333",
"titleNView": {
"titleColor": "#333333",
"backgroundColor": "#FFFFFF"
}
}
}
},
{
"path": "mine/Complaints",
"path": "more/Complaints",
"style": {
"navigationBarTitleText": "投诉意见",
"app-plus": {
"titleSize": "36px",
"titleColor": "#333333",
"titleNView": {
"titleColor": "#333333",
"backgroundColor": "#FFFFFF",
"buttons": [
{
@ -183,13 +191,13 @@
}
},
{
"path": "mine/WriteComments",
"path": "more/WriteComments",
"style": {
"navigationBarTitleText": "写意见",
"app-plus": {
"titleSize": "36px",
"titleColor": "#333333",
"titleNView": {
"titleColor": "#333333",
"backgroundColor": "#FFFFFF"
}
}
@ -201,47 +209,292 @@
"navigationBarTitleText": "会员服务",
"app-plus": {
"titleSize": "36px",
"titleColor": "#333333",
"titleNView": {
"titleColor": "#333333",
"backgroundColor": "#FFFFFF"
}
}
}
},
{
"path": "mine/Manicure",
"path": "mine/Integral",
"style": {
"navigationBarTitleText": "积分数",
"app-plus": {
"titleSize": "36px",
"titleNView": {
"titleColor": "#333333",
"backgroundColor": "#FFFFFF"
}
}
}
},
{
"path": "tool/Manicure",
"style": {
"navigationBarTitleText": "美甲",
"app-plus": {
"titleSize": "36px",
"titleColor": "#333333",
"titleNView": {
"titleColor": "#333333",
"backgroundColor": "#FFFFFF"
}
}
}
},
{
"path": "mine/ManicureOrder",
"path": "tool/ManicureOrder",
"style": {
"navigationBarTitleText": "美甲订单",
"app-plus": {
"titleSize": "36px",
"titleColor": "#333333",
"titleNView": {
"titleColor": "#333333",
"backgroundColor": "#FFFFFF"
}
}
}
},
{
"path": "mine/SendWash",
"path": "tool/SendWash",
"style": {
"navigationBarTitleText": "送洗",
"app-plus": {
"titleSize": "36px",
"titleColor": "#333333",
"titleNView": {
"titleColor": "#333333",
"backgroundColor": "#FFFFFF"
}
}
}
},
{
"path": "tool/WashOrder",
"style": {
"navigationBarTitleText": "送洗订单",
"app-plus": {
"titleSize": "36px",
"titleNView": {
"titleColor": "#333333",
"backgroundColor": "#FFFFFF"
}
}
}
},
{
"path": "mine/GoodsCollection",
"style": {
"navigationBarTitleText": "商品收藏",
"app-plus": {
"titleSize": "36px",
"titleNView": {
"titleColor": "#333333",
"backgroundColor": "#FFFFFF"
}
}
}
},
{
"path": "mine/ImageTextCollection",
"style": {
"navigationBarTitleText": "图文收藏",
"app-plus": {
"titleSize": "36px",
"titleNView": {
"titleColor": "#333333",
"backgroundColor": "#FFFFFF"
}
}
}
},
{
"path": "mine/StoreCollection",
"style": {
"navigationBarTitleText": "店铺收藏",
"app-plus": {
"titleSize": "36px",
"titleNView": {
"titleColor": "#333333",
"backgroundColor": "#FFFFFF"
}
}
}
},
{
"path": "mine/MineConcerns",
"style": {
"navigationBarTitleText": "我的关注",
"app-plus": {
"titleSize": "36px",
"titleNView": {
"titleColor": "#333333",
"backgroundColor": "#FFFFFF"
}
}
}
},
{
"path": "mine/MedalIntroduction",
"style": {
"navigationBarTitleText": "勋章介绍",
"app-plus": {
"titleSize": "36px",
"titleNView": {
"backgroundColor": "rgba(255,255,255,0)",
"titleColor": "#ffffff"
}
}
}
},
{
"path": "mine/MineInfo",
"style": {
"navigationBarTitleText": "我的资料",
"app-plus": {
"titleSize": "36px",
"titleNView": {
"backgroundColor": "#FFFFFF",
"titleColor": "#333333",
"buttons": [
{
"type":"none",
"text":"编辑",
"float":"right",
"fontSize":"14"
}
]
}
}
}
},
{
"path": "mine/EditUserInfo",
"style": {
"navigationBarTitleText": "我的资料",
"app-plus": {
"titleSize": "36px",
"titleNView": {
"backgroundColor": "#FFFFFF",
"titleColor": "#333333",
"buttons": [
{
"type":"none",
"text":"取消",
"float":"left",
"fontSize":"14"
},
{
"type":"none",
"text":"\ue264",
"float":"right",
"fontSize":"14"
}
],
"autoBackButton": false,
"backButton": {
"badgeText": "取消"
}
}
}
}
},
{
"path": "mine/UpdatePhone",
"style": {
"navigationBarTitleText": "修改手机号",
"app-plus": {
"titleSize": "36px",
"titleNView": {
"backgroundColor": "#FFFFFF",
"titleColor": "#333333",
"buttons": [
{
"type":"none",
"text":"取消",
"float":"left",
"fontSize":"14"
}
]
}
}
}
},
{
"path": "setting/Index",
"style": {
"navigationBarTitleText": "设置",
"app-plus": {
"titleSize": "36px",
"titleNView": {
"backgroundColor": "#FFFFFF",
"titleColor": "#333333"
}
}
}
},
{
"path": "setting/feedback",
"style": {
"navigationBarTitleText": "帮助与反馈",
"app-plus": {
"titleSize": "36px",
"titleNView": {
"titleColor": "#333333",
"backgroundColor": "#FFFFFF"
}
}
}
},
{
"path": "order/Index",
"style": {
"navigationBarTitleText": "我的订单",
"app-plus": {
"titleSize": "36px",
"titleNView": {
"titleColor": "#333333",
"backgroundColor": "#FFFFFF"
}
}
}
},
{
"path": "order/Details",
"style": {
"navigationBarTitleText": "订单详情",
"app-plus": {
"titleSize": "36px",
"titleNView": {
"titleColor": "#FFFFFF",
"backgroundColor": "rgba(255,255,255,0)"
},
"backButton": {
"color": "#FFFFFF"
}
}
}
},
{
"path": "order/Logistics",
"style": {
"navigationBarTitleText": "物流详情",
"app-plus": {
"titleSize": "36px",
"titleNView": {
"titleColor": "#333333",
"backgroundColor": "#FFFFFF"
}
}
}
},
{
"path": "order/Comment",
"style": {
"navigationBarTitleText": "发表评价",
"app-plus": {
"titleSize": "36px",
"titleNView": {
"titleColor": "#333333",
"backgroundColor": "#FFFFFF"
}
}