ch
4 years ago
parent
b375a78167
commit
8797381ba2
@ -0,0 +1,76 @@
|
|||||||
|
<!--
|
||||||
|
* @Author: ch
|
||||||
|
* @Date: 2022-03-26 18:29:19
|
||||||
|
* @LastEditors: ch
|
||||||
|
* @LastEditTime: 2022-03-28 15:57:22
|
||||||
|
* @Description: file content
|
||||||
|
-->
|
||||||
|
<template>
|
||||||
|
<view class="uiCell" @click="$emit('click')">
|
||||||
|
<slot name="icon"></slot>
|
||||||
|
<view class="uiCell--left">
|
||||||
|
<text class="uiCell--title">{{title}}</text>
|
||||||
|
<text class="uiCell--label">{{label}}</text>
|
||||||
|
</view>
|
||||||
|
<slot name="value">
|
||||||
|
<text class="uiCell--value">{{value}}</text>
|
||||||
|
</slot>
|
||||||
|
<slot name="right-icon" v-if="rightIcon">
|
||||||
|
<image class="uiCell--rightIcon" src="@/static/common/arrow.png"/>
|
||||||
|
</slot>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
props : {
|
||||||
|
title : {
|
||||||
|
type: String,
|
||||||
|
default : ''
|
||||||
|
},
|
||||||
|
label : {
|
||||||
|
type: String,
|
||||||
|
default : ''
|
||||||
|
},
|
||||||
|
value : {
|
||||||
|
type : String,
|
||||||
|
default : ''
|
||||||
|
},
|
||||||
|
rightIcon : {
|
||||||
|
type : Boolean,
|
||||||
|
default : true
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.uiCell{
|
||||||
|
min-height: 100rpx;
|
||||||
|
border-bottom: 1px solid #eee;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
background: #fff;
|
||||||
|
&--title{
|
||||||
|
color: #333;
|
||||||
|
font-size: 28rpx;
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
&--label{
|
||||||
|
color: #999;
|
||||||
|
font-size: 24rpx;
|
||||||
|
display: block;
|
||||||
|
margin-top: 10rpx;
|
||||||
|
}
|
||||||
|
&--value{
|
||||||
|
flex: 1;
|
||||||
|
padding: 0 10rpx;
|
||||||
|
text-align: right;
|
||||||
|
font-size: 28rpx;
|
||||||
|
}
|
||||||
|
&--rightIcon{
|
||||||
|
width: 10rpx;
|
||||||
|
height: 20rpx;
|
||||||
|
margin-left: 18rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -1,19 +0,0 @@
|
|||||||
<!--
|
|
||||||
* @Author: ch
|
|
||||||
* @Date: 2022-03-22 15:09:06
|
|
||||||
* @LastEditors: ch
|
|
||||||
* @LastEditTime: 2022-03-22 16:19:06
|
|
||||||
* @Description: file content
|
|
||||||
-->
|
|
||||||
<template>
|
|
||||||
<view>
|
|
||||||
<u-cell :isLink="true" arrow-direction="right" label="昵称">
|
|
||||||
<u-image slot="icon" shape="circle" width="100rpx" height="100rpx" ></u-image>
|
|
||||||
</u-cell>
|
|
||||||
<u-cell label="我的收货地址" :isLink="true" rightIcon="arrow-right"></u-cell>
|
|
||||||
<u-cell label="版本号" value="1.0.0"></u-cell>
|
|
||||||
<u-button type="primary" text="退出登录"></u-button>
|
|
||||||
</view>
|
|
||||||
</template>
|
|
||||||
<style lang="scss" scoped>
|
|
||||||
</style>
|
|
||||||
@ -0,0 +1,66 @@
|
|||||||
|
<!--
|
||||||
|
* @Author: ch
|
||||||
|
* @Date: 2022-03-22 15:09:06
|
||||||
|
* @LastEditors: ch
|
||||||
|
* @LastEditTime: 2022-03-28 17:12:14
|
||||||
|
* @Description: file content
|
||||||
|
-->
|
||||||
|
<template>
|
||||||
|
<view>
|
||||||
|
<UiCell class="userInfo cell" title="昵称" @click="$Router.push('/pages/account/setting/setUserInfo')">
|
||||||
|
<image slot="icon" class="userInfo--head" src="@/static/account/tx.png" ></image>
|
||||||
|
</UiCell>
|
||||||
|
<UiCell class="cell" title="我的收货地址"></UiCell>
|
||||||
|
<UiCell class="cell" title="关于我们" ></UiCell>
|
||||||
|
<UiCell class="cell cell--last" title="版本号" value="1.0.0" valueClass="cell--value" :rightIcon="false"></UiCell>
|
||||||
|
<view class="logout">退出登录</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
<script>
|
||||||
|
import UiButton from '@/components/UiButton.vue'
|
||||||
|
import UiCell from '@/components/UiCell.vue'
|
||||||
|
export default {
|
||||||
|
components: { UiCell, UiButton },
|
||||||
|
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
page{
|
||||||
|
background: #f8f8f8;
|
||||||
|
}
|
||||||
|
.userInfo{
|
||||||
|
margin: 20rpx 0;
|
||||||
|
border: 0;
|
||||||
|
height: 200rpx;
|
||||||
|
&--head{
|
||||||
|
width: 120rpx;
|
||||||
|
height: 120rpx;
|
||||||
|
border-radius: 50%;
|
||||||
|
margin-right: 40rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.cell{
|
||||||
|
padding: 0 40rpx;
|
||||||
|
&--last{
|
||||||
|
border: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.logout{
|
||||||
|
height: 100rpx;
|
||||||
|
line-height: 100rpx;
|
||||||
|
text-align: center;
|
||||||
|
color: #999;
|
||||||
|
background: #fff;
|
||||||
|
margin: 20rpx 0;
|
||||||
|
font-size: 32rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
/deep/{
|
||||||
|
.userInfo .uiCell--title{
|
||||||
|
font-size: 32rpx;
|
||||||
|
}
|
||||||
|
.uiCell--value{
|
||||||
|
color: #999;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -0,0 +1,54 @@
|
|||||||
|
<!--
|
||||||
|
* @Author: ch
|
||||||
|
* @Date: 2022-03-28 15:38:23
|
||||||
|
* @LastEditors: ch
|
||||||
|
* @LastEditTime: 2022-03-28 17:08:34
|
||||||
|
* @Description: file content
|
||||||
|
-->
|
||||||
|
<template>
|
||||||
|
<view>
|
||||||
|
<UiPageHeader title="设置昵称">
|
||||||
|
<view slot="operation" class="headerBtn">确定</view>
|
||||||
|
</UiPageHeader>
|
||||||
|
<u--input class="input" placeholder="请输入昵称" clearable ></u--input>
|
||||||
|
<view class="tips">
|
||||||
|
<text>请输入1-10个字符</text>
|
||||||
|
<text>(1/10)</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
<script>
|
||||||
|
import UiButton from '@/components/UiButton.vue'
|
||||||
|
import UiCell from '@/components/UiCell.vue'
|
||||||
|
import UiPageHeader from '@/components/UiPageHeader.vue'
|
||||||
|
export default {
|
||||||
|
components: { UiCell, UiButton, UiPageHeader },
|
||||||
|
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
page{
|
||||||
|
background: #f8f8f8;
|
||||||
|
}
|
||||||
|
.headerBtn{
|
||||||
|
height: 88rpx;
|
||||||
|
line-height: 88rpx;
|
||||||
|
font-size: 28rpx;
|
||||||
|
color: #FF875B;
|
||||||
|
}
|
||||||
|
.input{
|
||||||
|
padding: 20rpx 40rpx !important;
|
||||||
|
height: 60rpx;
|
||||||
|
background: #fff;
|
||||||
|
border: 0;
|
||||||
|
font-size: 28rpx;
|
||||||
|
color: #333;
|
||||||
|
}
|
||||||
|
.tips{
|
||||||
|
padding: 20rpx 40rpx;
|
||||||
|
font-size: 24rpx;
|
||||||
|
color: #999;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -0,0 +1,74 @@
|
|||||||
|
<!--
|
||||||
|
* @Author: ch
|
||||||
|
* @Date: 2022-03-28 15:38:23
|
||||||
|
* @LastEditors: ch
|
||||||
|
* @LastEditTime: 2022-03-28 16:37:16
|
||||||
|
* @Description: file content
|
||||||
|
-->
|
||||||
|
<template>
|
||||||
|
<view>
|
||||||
|
<view class="userInfo">
|
||||||
|
<u-upload class="userInfo--upload" name="6" :fileList="fileList6" @afterRead="headUpload" >
|
||||||
|
<image class="userInfo--head" src="@/static/account/tx.png" ></image>
|
||||||
|
</u-upload>
|
||||||
|
<view>昵称</view>
|
||||||
|
</view>
|
||||||
|
<UiCell class="cell" title="昵称" value="马士兵" @click="$Router.push('/pages/account/setting/setName')"></UiCell>
|
||||||
|
<UiCell class="cell cell--last" title="性别" value="男" @click="sexShow = true"></UiCell>
|
||||||
|
<u-picker :show="sexShow" :columns="sexData" keyName="label" @cancel="sexShow = false" @confirm="sexChange"></u-picker>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
<script>
|
||||||
|
import UiButton from '@/components/UiButton.vue'
|
||||||
|
import UiCell from '@/components/UiCell.vue'
|
||||||
|
export default {
|
||||||
|
components: { UiCell, UiButton },
|
||||||
|
data(){
|
||||||
|
return {
|
||||||
|
fileList: [],
|
||||||
|
sexShow : false,
|
||||||
|
sexData : [[{label:'女',val:0},{label:'男',val:1}]]
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods:{
|
||||||
|
sexChange(){
|
||||||
|
this.sexShow = false
|
||||||
|
},
|
||||||
|
headUpload(){
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
page{
|
||||||
|
background: #f8f8f8;
|
||||||
|
}
|
||||||
|
.userInfo{
|
||||||
|
padding: 77rpx 0 60rpx;
|
||||||
|
text-align: center;
|
||||||
|
font-size: 28rpx;
|
||||||
|
color: #333;
|
||||||
|
&--head,&--upload{
|
||||||
|
width: 120rpx;
|
||||||
|
height: 120rpx;
|
||||||
|
border-radius: 50%;
|
||||||
|
margin: 0 auto 13rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.cell{
|
||||||
|
padding: 0 40rpx;
|
||||||
|
&--last{
|
||||||
|
border: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
/deep/{
|
||||||
|
.userInfo .uiCell--title{
|
||||||
|
font-size: 32rpx;
|
||||||
|
}
|
||||||
|
.uiCell--value{
|
||||||
|
color: #999;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
Loading…
Reference in new issue