6.8
This commit is contained in:
@@ -1,24 +0,0 @@
|
||||
<template>
|
||||
<view class="add-address">
|
||||
<AddressActive></AddressActive>
|
||||
</view>
|
||||
</template>
|
||||
<script>
|
||||
import AddressActive from '@/components/mine/address-active/index'
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
checked: false
|
||||
}
|
||||
},
|
||||
components: {
|
||||
AddressActive
|
||||
},
|
||||
onLoad() {}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.add-address {
|
||||
min-height: calc(100vh - var(--window-top));
|
||||
}
|
||||
</style>
|
||||
@@ -1,25 +0,0 @@
|
||||
<template>
|
||||
<view class="address">
|
||||
<AddressItem :addressList='addressList'></AddressItem>
|
||||
</view>
|
||||
</template>
|
||||
<script>
|
||||
import AddressItem from '@/components/mine/address-block/address-item'
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
addressList: ['0', '1', '2', '3']
|
||||
}
|
||||
},
|
||||
components: {
|
||||
AddressItem
|
||||
},
|
||||
onLoad() {}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.address {
|
||||
min-height: calc(100vh - var(--window-top));
|
||||
background-color: #ECECEC;
|
||||
}
|
||||
</style>
|
||||
@@ -1,26 +0,0 @@
|
||||
<template>
|
||||
<view class="after-sale">
|
||||
<ArticleList :articleList="policyList" :type="type"></ArticleList>
|
||||
</view>
|
||||
</template>
|
||||
<script>
|
||||
import ArticleList from '@/components/mine/article-list/index'
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
type: '售后政策',
|
||||
policyList: [1,1,1,1, 1, 1, 1]
|
||||
}
|
||||
},
|
||||
components: {
|
||||
ArticleList
|
||||
},
|
||||
methods: {},
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.after-sale {
|
||||
min-height: calc(100vh - var(--window-top));
|
||||
background-color: #ECECEC;
|
||||
}
|
||||
</style>
|
||||
@@ -16,7 +16,7 @@ export default {
|
||||
methods: {
|
||||
setTitle(title){
|
||||
uni.setNavigationBarTitle({
|
||||
title: title + "详情"
|
||||
title: title
|
||||
});
|
||||
},
|
||||
},
|
||||
|
||||
@@ -1,100 +0,0 @@
|
||||
<template>
|
||||
<view class="complaints">
|
||||
<view class="complaints-box">
|
||||
<view class="suggestions">
|
||||
<view class="text">您的满意是对我们最大的支持，茫茫德铭阳光之中能够遇到亲也是我们的荣幸</view>
|
||||
<view class="image">
|
||||
<img v-for="(url, index) in imgList" :key="index" :src="url" />
|
||||
</view>
|
||||
</view>
|
||||
<view class="reply">
|
||||
<view class="reply-title">后台回复：</view>
|
||||
<view class="reply-content u-line-4">您的满意是对我们最大的支持，茫茫德铭阳光之中能够遇到亲也是我们的荣幸，您的评价是对我们付出最好的认可，我们会不断前行，不忘初衷，给亲们提供更好的服务和产品!我把对您的谢意写在纸上，被风吹走了;我把对您的谢意写在沙滩上，被海浪卷走了;我只好把对您的谢意写在解释里，这样才会永驻心间!感谢您对的支持!加油!加油!， 祝您生活愉快，工作顺利，期待我们下次合作愉快! ! !</view>
|
||||
</view>
|
||||
<view class="date">
|
||||
<img src="../static/mine/26.png" />
|
||||
<view>2020-05-14</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
imgList: [
|
||||
require('../static/mine/23.png'),
|
||||
require('../static/mine/23.png'),
|
||||
require('../static/mine/23.png'),
|
||||
require('../static/mine/23.png')
|
||||
]
|
||||
}
|
||||
},
|
||||
onNavigationBarButtonTap() {
|
||||
uni.navigateTo({
|
||||
url: '/pageE/mine/WriteComments'
|
||||
});
|
||||
},
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.complaints {
|
||||
min-height: calc(100vh - var(--window-top));
|
||||
background-color: #ECECEC;
|
||||
padding-top: 1rpx;
|
||||
.complaints-box {
|
||||
padding: 30rpx;
|
||||
background-color: #ffffff;
|
||||
.suggestions {
|
||||
.text {
|
||||
font-size: 26rpx;
|
||||
color: rgba(51,51,51,1);
|
||||
margin-bottom: 25rpx;
|
||||
line-height: 36rpx;
|
||||
}
|
||||
.image {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
> img {
|
||||
width: 210rpx;
|
||||
height: 210rpx;
|
||||
border-radius: 10rpx;
|
||||
margin-bottom: 10rpx;
|
||||
&:not(:nth-child(3n)) {
|
||||
margin-right: 30rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.reply {
|
||||
width: 690rpx;
|
||||
height: 224rpx;
|
||||
background: rgba(240,238,238,1);
|
||||
border-radius: 10rpx;
|
||||
padding: 20rpx;
|
||||
font-size: 24rpx;
|
||||
color: rgba(102,102,102,1);
|
||||
margin: 20rpx 0;
|
||||
.reply-title {
|
||||
margin-bottom: 16rpx;
|
||||
}
|
||||
.reply-content {
|
||||
line-height: 36rpx;
|
||||
}
|
||||
}
|
||||
.date {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
> img {
|
||||
width: 28rpx;
|
||||
height: 28rpx;
|
||||
margin-right: 12rpx;
|
||||
}
|
||||
> view {
|
||||
font-size: 24rpx;
|
||||
color: rgba(153,153,153,1);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -1,63 +0,0 @@
|
||||
<template>
|
||||
<view class="edit-address">
|
||||
<AddressActive></AddressActive>
|
||||
<u-popup v-model="popupShow" mode="center" border-radius="10">
|
||||
<view class="popup-tips">确定要删除该地址吗</view>
|
||||
<view class="popup-btn">
|
||||
<view class="cancel" @click="popupShow=false">取消</view>
|
||||
<view class="determine" @click="delAddress">确定</view>
|
||||
</view>
|
||||
</u-popup>
|
||||
</view>
|
||||
</template>
|
||||
<script>
|
||||
import AddressActive from '@/components/mine/address-active/index'
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
popupShow: false
|
||||
}
|
||||
},
|
||||
components: {
|
||||
AddressActive
|
||||
},
|
||||
onLoad() {},
|
||||
onNavigationBarButtonTap() {
|
||||
this.popupShow = true
|
||||
},
|
||||
methods: {
|
||||
delAddress() {
|
||||
this.popupShow = false
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.edit-address {
|
||||
min-height: calc(100vh - var(--window-top));
|
||||
.popup-tips {
|
||||
width: 420rpx;
|
||||
text-align: center;
|
||||
line-height: 104rpx;
|
||||
font-size: 28rpx;
|
||||
color: rgba(102,102,102,1);
|
||||
}
|
||||
.popup-btn {
|
||||
width: 420rpx;
|
||||
display: flex;
|
||||
border-top: 2rpx solid #ECECEC;
|
||||
> view {
|
||||
flex: 1;
|
||||
height: 98rpx;
|
||||
text-align: center;
|
||||
line-height: 98rpx;
|
||||
&:first-child {
|
||||
border-right: 2rpx solid #ECECEC;
|
||||
}
|
||||
}
|
||||
.determine {
|
||||
color: #FF780F;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
104
pageE/mine/EditUserInfo.vue
Normal file
104
pageE/mine/EditUserInfo.vue
Normal 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>
|
||||
23
pageE/mine/GoodsCollection.vue
Normal file
23
pageE/mine/GoodsCollection.vue
Normal 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>
|
||||
31
pageE/mine/ImageTextCollection.vue
Normal file
31
pageE/mine/ImageTextCollection.vue
Normal 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
77
pageE/mine/Integral.vue
Normal 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>
|
||||
@@ -1,111 +0,0 @@
|
||||
<template>
|
||||
<view class="manicure">
|
||||
<view>
|
||||
<u-tabs-swiper ref="tabs" :list="list" :is-scroll="false" active-color="#FF780F" :current="current" font-size="32" :show-bar="false" @change="tabsChange" height="88" ></u-tabs-swiper>
|
||||
</view>
|
||||
<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 class="order-title">
|
||||
<view class="order-text">订单</view>
|
||||
<view class="order-status">已预约</view>
|
||||
</view>
|
||||
<view class="order-name">美甲人姓名：xxx</view>
|
||||
<view class="order-date">时间：2020-04-12</view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</swiper-item>
|
||||
<swiper-item class="swiper-item">
|
||||
<scroll-view scroll-y class="none-page">
|
||||
<view></view>
|
||||
</scroll-view>
|
||||
</swiper-item>
|
||||
</swiper>
|
||||
</view>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
list: [{
|
||||
name: '我的订单'
|
||||
}, {
|
||||
name: '申请表'
|
||||
}],
|
||||
current: 0,
|
||||
swiperCurrent: 0
|
||||
}
|
||||
},
|
||||
onShow() {
|
||||
this.current = 0;
|
||||
this.swiperCurrent = 0;
|
||||
},
|
||||
methods: {
|
||||
tabsChange(index) {
|
||||
this.swiperCurrent = index;
|
||||
this.toApplyPage(index);
|
||||
},
|
||||
animationfinish(e) {
|
||||
let current = e.detail.current;
|
||||
this.swiperCurrent = current;
|
||||
this.current = current;
|
||||
this.toApplyPage(current);
|
||||
},
|
||||
toApplyPage(index) {
|
||||
if(index == 1) {
|
||||
uni.navigateTo({
|
||||
url: '/pageE/mine/ManicureOrder'
|
||||
});
|
||||
}
|
||||
}
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.manicure {
|
||||
min-height: calc(100vh - var(--window-top));
|
||||
background-color: #ECECEC;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
> uni-swiper {
|
||||
flex: 1;
|
||||
}
|
||||
.swiper-item {
|
||||
padding: 20rpx 30rpx 0;
|
||||
.order-list {
|
||||
.order-item {
|
||||
padding: 30rpx;
|
||||
width:690rpx;
|
||||
height: 229rpx;
|
||||
background: rgba(255,255,255,1);
|
||||
border-radius: 10rpx;
|
||||
margin-bottom: 20rpx;
|
||||
.order-title {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
.order-text {
|
||||
font-size: 30rpx;
|
||||
color: rgba(51,51,51,1);
|
||||
}
|
||||
.order-status {
|
||||
font-size: 28rpx;
|
||||
color: rgba(255,120,15,1);
|
||||
}
|
||||
}
|
||||
.order-name {
|
||||
font-size: 32rpx;
|
||||
font-weight: 500;
|
||||
color: rgba(51,51,51,1);
|
||||
margin: 43rpx 0 45rpx;
|
||||
}
|
||||
.order-date {
|
||||
font-size: 24rpx;
|
||||
color: rgba(153,153,153,1);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -1,94 +0,0 @@
|
||||
<template>
|
||||
<view class="manicure-order">
|
||||
<view class="order-form">
|
||||
<view class="order-name">
|
||||
<view>美甲人：</view>
|
||||
<input type="text" v-model="name" />
|
||||
</view>
|
||||
<view class="order-date" @click="show=true">
|
||||
<view>美甲时间：</view>
|
||||
<img src="../static/mine/21.png" v-if="!time" />
|
||||
<view v-else>{{ time }}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="order-btn">确认订单</view>
|
||||
<u-picker mode="time" v-model="show" :params="params" @confirm="chooseDate"></u-picker>
|
||||
</view>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
name: '',
|
||||
time: '',
|
||||
params: {
|
||||
year: true,
|
||||
month: true,
|
||||
day: true,
|
||||
hour: true,
|
||||
minute: true,
|
||||
second: false
|
||||
},
|
||||
show: false
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
chooseDate(e) {
|
||||
let time = e.year + '年' + e.month + '月' + e.day + '日' + e.hour + '时' + e.minute + '分'
|
||||
this.time = time
|
||||
}
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.manicure-order {
|
||||
min-height: calc(100vh - var(--window-top));
|
||||
background-color: #ECECEC;
|
||||
padding-top: 1rpx;
|
||||
.order-form {
|
||||
> view {
|
||||
height: 98rpx;
|
||||
background-color: #ffffff;
|
||||
padding: 35rpx 30rpx;
|
||||
&:not(:last-child) {
|
||||
margin-bottom: 2rpx;
|
||||
}
|
||||
}
|
||||
.order-name {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
> view {
|
||||
font-size: 30rpx;
|
||||
color: rgba(51,51,51,1);
|
||||
}
|
||||
> input {
|
||||
flex: 1;
|
||||
text-align: right;
|
||||
}
|
||||
}
|
||||
.order-date {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
> img {
|
||||
width: 14rpx;
|
||||
height :24rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
.order-btn {
|
||||
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;
|
||||
position: absolute;
|
||||
bottom: 40rpx;
|
||||
left: 50%;
|
||||
transform: translate(-50%, 0);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
59
pageE/mine/MedalIntroduction.vue
Normal file
59
pageE/mine/MedalIntroduction.vue
Normal 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>
|
||||
58
pageE/mine/MineConcerns.vue
Normal file
58
pageE/mine/MineConcerns.vue
Normal 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>
|
||||
@@ -1,26 +0,0 @@
|
||||
<template>
|
||||
<view class="mine-help">
|
||||
<ArticleList :articleList="helpList" :type="type"></ArticleList>
|
||||
</view>
|
||||
</template>
|
||||
<script>
|
||||
import ArticleList from '@/components/mine/article-list/index'
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
type: '使用帮助',
|
||||
helpList: [1,1,1,1, 1, 1, 1]
|
||||
}
|
||||
},
|
||||
components: {
|
||||
ArticleList
|
||||
},
|
||||
methods: {},
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.mine-help {
|
||||
min-height: calc(100vh - var(--window-top));
|
||||
background-color: #ECECEC;
|
||||
}
|
||||
</style>
|
||||
@@ -1,84 +0,0 @@
|
||||
<template>
|
||||
<view class="mine-history">
|
||||
<view class="history-box">
|
||||
<view v-for="(item, index) in historyList" :key="index" class="history-item">
|
||||
<view class="item-title">
|
||||
<img src="../static/mine/23.png" />
|
||||
<view>小米店铺</view>
|
||||
</view>
|
||||
<!-- <view class="item-image">
|
||||
<img src="../static/mine/23.png" />
|
||||
</view> -->
|
||||
<img src="../static/mine/23.png" class="item-image" />
|
||||
<view class="item-info">
|
||||
<view class="info-name">{{ item }}</view>
|
||||
<img src="../static/mine/22.png" />
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
historyList: [1, 2, 3, 6]
|
||||
};
|
||||
},
|
||||
onLoad() {},
|
||||
methods: {}
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.mine-history {
|
||||
min-height: calc(100vh - var(--window-top));
|
||||
background: #ECECEC;
|
||||
.history-box {
|
||||
padding: 20rpx 30rpx 0;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
.history-item {
|
||||
width: 220rpx;
|
||||
height: 290rpx;
|
||||
background: rgba(255,255,255,1);
|
||||
border-radius: 10rpx;
|
||||
padding: 20rpx 20rpx 22rpx;
|
||||
margin: 0 10rpx 20rpx 0;
|
||||
.item-title {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
> img {
|
||||
width: 50rpx;
|
||||
height: 50rpx;
|
||||
border-radius: 50%;
|
||||
margin-right: 19rpx;
|
||||
}
|
||||
> view {
|
||||
font-size: 24rpx;
|
||||
color: rgba(51,51,51,1);
|
||||
}
|
||||
}
|
||||
.item-image {
|
||||
margin: 20rpx 0 17rpx;
|
||||
width: 180rpx;
|
||||
height: 140rpx;
|
||||
border-radius: 10rpx;
|
||||
}
|
||||
.item-info {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
.info-name {
|
||||
font-size: 22rpx;
|
||||
color: rgba(51,51,51,1);
|
||||
}
|
||||
> img {
|
||||
width: 37rpx;
|
||||
height: 8rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -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
87
pageE/mine/MineInfo.vue
Normal 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>
|
||||
@@ -1,132 +0,0 @@
|
||||
<template>
|
||||
<view class="wash">
|
||||
<view>
|
||||
<u-tabs-swiper ref="tabs" :list="list" :is-scroll="false" active-color="#FF780F" :current="current" font-size="32" :show-bar="false" @change="tabsChange" height="88" ></u-tabs-swiper>
|
||||
</view>
|
||||
<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 class="order-title">
|
||||
<view class="order-text">订单状态</view>
|
||||
<view class="order-status">已预约</view>
|
||||
</view>
|
||||
<view class="order-info">
|
||||
<image src="../static/mine/23.png"></image>
|
||||
<view>
|
||||
<view>骑手名字：xxx</view>
|
||||
<view>联系方式：123456789</view>
|
||||
<view>所属公司：xx公司</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</swiper-item>
|
||||
<swiper-item class="swiper-item">
|
||||
<scroll-view scroll-y 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>
|
||||
</swiper-item>
|
||||
</swiper>
|
||||
</view>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
list: [{
|
||||
name: '我的订单'
|
||||
}, {
|
||||
name: '申请表'
|
||||
}, {
|
||||
name: '评价'
|
||||
}],
|
||||
current: 0,
|
||||
swiperCurrent: 0
|
||||
}
|
||||
},
|
||||
onShow() {
|
||||
this.current = 0;
|
||||
this.swiperCurrent = 0;
|
||||
},
|
||||
methods: {
|
||||
tabsChange(index) {
|
||||
this.swiperCurrent = index;
|
||||
this.toApplyPage(index);
|
||||
},
|
||||
animationfinish(e) {
|
||||
let current = e.detail.current;
|
||||
this.swiperCurrent = current;
|
||||
this.current = current;
|
||||
this.toApplyPage(current);
|
||||
},
|
||||
toApplyPage(index) {
|
||||
// if(index == 2) {
|
||||
// uni.navigateTo({
|
||||
// url: '/pageE/mine/ManicureOrder'
|
||||
// });
|
||||
// }
|
||||
}
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.wash {
|
||||
min-height: calc(100vh - var(--window-top));
|
||||
background-color: #ECECEC;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
> uni-swiper {
|
||||
flex: 1;
|
||||
}
|
||||
.swiper-item {
|
||||
padding: 20rpx 30rpx 0;
|
||||
.order-list {
|
||||
.order-item {
|
||||
padding: 30rpx;
|
||||
width:690rpx;
|
||||
height: 308rpx;
|
||||
background: rgba(255,255,255,1);
|
||||
border-radius: 10rpx;
|
||||
margin-bottom: 20rpx;
|
||||
.order-title {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 30rpx;
|
||||
.order-text {
|
||||
font-size: 30rpx;
|
||||
color: rgba(51,51,51,1);
|
||||
}
|
||||
.order-status {
|
||||
font-size: 28rpx;
|
||||
color: rgba(255,120,15,1);
|
||||
}
|
||||
}
|
||||
.order-info {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
> image {
|
||||
width: 180rpx;
|
||||
height: 160rpx;
|
||||
border-radius: 10rpx;
|
||||
margin-right: 30rpx;
|
||||
}
|
||||
> view {
|
||||
font-size: 26rpx;
|
||||
color: rgba(51,51,51,1);
|
||||
> view:not(:last-child) {
|
||||
margin-bottom: 19rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
106
pageE/mine/StoreCollection.vue
Normal file
106
pageE/mine/StoreCollection.vue
Normal 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) {
|
||||
// 先将正在被操作的swipeAction标记为打开状态，否则由于props的特性限制，
|
||||
// 原本为'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
109
pageE/mine/UpdatePhone.vue
Normal 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>
|
||||
@@ -1,74 +0,0 @@
|
||||
<template>
|
||||
<view class="write-complaints">
|
||||
<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="write-btn" @click="submit">发表意见</view>
|
||||
</view>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
count: 4, // 最大图片数量
|
||||
imageList: []
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
submit() {
|
||||
this.$refs.uUpload.upload();
|
||||
},
|
||||
onUploaded(list) {
|
||||
console.log(list)
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.write-complaints {
|
||||
min-height: calc(100vh - var(--window-top));
|
||||
background-color: #ECECEC;
|
||||
.main-container {
|
||||
background-color: #ffffff;
|
||||
padding: 30rpx;
|
||||
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;
|
||||
}
|
||||
}
|
||||
}
|
||||
.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>
|
||||
Reference in New Issue
Block a user