Skip to content

S
self-support
Commit 5e3dae5d authored by Facius's avatar Facius
Browse files
Options

我的页面

parent c612caba
Hide whitespace changes
Inline Side-by-side
Showing with 216 additions and 73 deletions
src/pages.json
View file @ 5e3dae5d
...@@ -253,6 +253,15 @@ ...@@ -253,6 +253,15 @@
"navigationBarTitleText": "配件押金", "navigationBarTitleText": "配件押金",
"enablePullDownRefresh": false "enablePullDownRefresh": false
} }
},
{
"path": "setting/index",
"style": {
"navigationStyle": "custom",
"navigationBarTitleText": "设置",
"enablePullDownRefresh": false,
"disableScroll": true
}
}, },
{ {
"path": "warehouse/index", "path": "warehouse/index",
......
src/pages/index/mine.vue
View file @ 5e3dae5d
...@@ -5,24 +5,32 @@ ...@@ -5,24 +5,32 @@
<text class="title-view">我的</text> <text class="title-view">我的</text>
</u-navbar> </u-navbar>
<view class="mine-content"> <view class="mine-content">
<view class="header-view"> <view class="header-view">
<view class="head-image"> <view class="header-left-view">
<image :style="headImageStyle" :src="headImageUrl"></image> <view class="head-image">
</view> <image :style="headImageStyle" :src="headImageUrl"></image>
<view class="header-content">
<view class="name-view" @click="handleClickName">{{name || "点击登录"}}</view>
<view :class="['tel-view', {'active': mobile}]" @click="handleClickTel">
<text>{{telTip}}</text>
<u-icon class="tel-arrow-icon" name="arrow-up-fill"></u-icon>
</view> </view>
</view> <view class="header-content">
<view v-if="showSuperButton" class="super-button"><u-button@click="handleSuperButton">切换用户</u-button></view> <view class="name-view" @click="handleClickName">{{name || "点击登录"}}</view>
<view :class="['tel-view', {'active': mobile}]" @click="$u.throttle(handleClickTel, 500)">
<text>{{telTip}}</text>
<u-icon class="tel-arrow-icon" name="arrow-up-fill"></u-icon>
</view>
</view>
<view v-if="showSuperButton" class="super-button"><u-button@click="$u.throttle(handleSuperButton, 500)">切换用户</u-button></view>
</view>
<view class="header-right-view" @click="$u.throttle(handleClickSetting, 500)">
<image :src="shezhiImage" class="right-image-view"></image>
<text>设置</text>
</view>
</view> </view>
<view class="ware-house-view"> <view class="ware-house-view">
<view class="ware-house-title">我的仓库</view> <view class="ware-house-title">仓配功能</view>
<view class="ware-house-content"> <view class="ware-house-content">
<view v-for="(item, index) in warehouseItems" :key="index" class="ware-house-content-item" @click="handleClick(item.pathName)"> <view v-for="(item, index) in warehouseItems" :key="index" class="ware-house-content-item" @click="handleClick(item.pathName)">
<image :src="item.icon" class="ware-house-image"></image> <view class="ware-house-image">
<image :src="item.icon" :style="item.imageStyle"></image>
</view>
<view>{{item.title}}</view> <view>{{item.title}}</view>
</view> </view>
</view> </view>
...@@ -133,25 +141,29 @@ ...@@ -133,25 +141,29 @@
pathName: 'warehouse/index', pathName: 'warehouse/index',
title: '我的配件', title: '我的配件',
value: '', value: '',
icon: process.uniEnv.qn_base_url + 'cangku.png', icon: process.uniEnv.qn_base_url + 'wodepeijian.png',
imageStyle: 'width:60rpx;height:54rpx'
}, },
{ {
pathName: 'warehouse/spare', pathName: 'warehouse/spare',
title: '我的备件', title: '我的备件',
value: '', value: '',
icon: process.uniEnv.qn_base_url + 'cangku.png', icon: process.uniEnv.qn_base_url + 'wodebeijian.png',
imageStyle: 'width:60rpx;height:54rpx'
}, },
{ {
pathName: 'warehouse/return', pathName: 'warehouse/return',
title: '返件信息', title: '返件信息',
value: '', value: '',
icon: process.uniEnv.qn_base_url + 'cangku.png', icon: process.uniEnv.qn_base_url + 'fanjianxinxi.png',
imageStyle: 'width:56rpx;height:54rpx'
}, },
{ {
pathName: 'warehouse/records', pathName: 'warehouse/records',
title: '出入库记录', title: '出入库记录',
value: '', value: '',
icon: process.uniEnv.qn_base_url + 'cangku.png', icon: process.uniEnv.qn_base_url + 'churuku.png',
imageStyle: 'width:50rpx;height:54rpx'
}, },
] ]
}, },
...@@ -162,10 +174,13 @@ ...@@ -162,10 +174,13 @@
return this.avatar || this.placeholderImage return this.avatar || this.placeholderImage
}, },
headImageStyle() { headImageStyle() {
return this.avatar ? 'width:136rpx; height:136rpx;border-radius:68rpx' : 'width:144rpx; height:144rpx;border-radius:72rpx' return this.avatar ? 'width:112rpx; height:112rpx;border-radius:56rpx' : 'width:120rpx; height:120rpx;border-radius:60rpx'
}, },
headSize() { headSize() {
return this.avatar ? 136 : 144 return this.avatar ? 112 : 120
},
shezhiImage() {
return process.uniEnv.qn_base_url + 'shezhi.png'
} }
}, },
async onLoad() { async onLoad() {
...@@ -179,7 +194,7 @@ ...@@ -179,7 +194,7 @@
this.getData() this.getData()
} }
} }
this.wodebeijingImage = this.qnFile('wodebeijing.png') this.wodebeijingImage = this.qnFile('wodebeijing-jb.png')
this.placeholderImage = this.qnFile('touxiang.png') this.placeholderImage = this.qnFile('touxiang.png')
}, },
methods: { methods: {
...@@ -198,6 +213,9 @@ ...@@ -198,6 +213,9 @@
} else { } else {
this.$u.route({url: "pages/login/index"}) this.$u.route({url: "pages/login/index"})
} }
},
handleClickSetting() {
this.$u.route({url: 'pages/mine/setting/index'})
}, },
handleClickName() { handleClickName() {
if(this.vuex_token && this.settled) { if(this.vuex_token && this.settled) {
...@@ -252,70 +270,89 @@ ...@@ -252,70 +270,89 @@
.mine-content { .mine-content {
position: relative; position: relative;
padding: 30rpx; padding: 26rpx 30rpx 30rpx 20rpx;
.header-view { .header-view {
display: flex; display: flex;
align-items: center; align-items: flex-start;
margin-bottom: 60rpx; justify-content: space-between;
.head-image { margin-bottom: 60rpx;
width: 144rpx; .header-left-view {
height: 144rpx; display: flex;
background-color: #FFFFFF; align-items: center;
border-radius: 72rpx; .head-image {
display: flex; width: 120rpx;
align-items: center; height: 120rpx;
justify-content: center; background-color: #FFFFFF;
} border-radius: 56rpx;
display: flex;
.header-content { align-items: center;
color: #FFFFFF; justify-content: center;
z-index: 1; }
margin-left: 24rpx;
.header-content {
.name-view { color: #FFFFFF;
font-size: 44rpx; z-index: 1;
font-weight: bold; margin-left: 24rpx;
margin-bottom: 14rpx;
margin-top: 6rpx; .name-view {
} font-size: 40rpx;
font-weight: bold;
.tel-view { margin-bottom: 6rpx;
background-color: #FFFFFF; margin-top: -4rpx;
border-radius: 26rpx; }
color: #2272FF;
width: 180rpx; .tel-view {
height: 52rpx; background-color: #FFFFFF;
font-size: 20rpx; border-radius: 26rpx;
display: flex; color: #2272FF;
align-items: center; width: 180rpx;
justify-content: center; height: 52rpx;
font-size: 20rpx;
&.active { display: flex;
color: #FFFFFF; align-items: center;
border: 2rpx solid #FFFFFF; justify-content: center;
background-color: #2272FF;
} &.active {
color: #FFFFFF;
.tel-arrow-icon { border: 2rpx solid #FFFFFF;
transform: rotate(90deg); background-color: #2272FF;
margin-left: 6rpx; }
}
} .tel-arrow-icon {
transform: rotate(90deg);
margin-left: 6rpx;
}
}
}
.super-button {
margin-left: 20rpx;
}
} }
.super-button { .header-right-view {
margin-left: 20rpx; display: flex;
justify-content: flex-end;
align-items: center;
color: #FFFFFF;
margin-right: 4rpx;
font-size: 26rpx;
margin-top: -26rpx;
.right-image-view {
width: 34rpx;
height: 32rpx;
margin-right: 10rpx;
}
} }
} }
.ware-house-view { .ware-house-view {
background-color: #FFFFFF; background-color: #FFFFFF;
border-radius: 12rpx; border-radius: 12rpx;
padding: 30rpx; padding: 30rpx 30rpx 40rpx 30rpx;
height: 240rpx; height: 240rpx;
.ware-house-title { .ware-house-title {
color: #333333; color: #333333;
font-weight: bold; font-weight: bold;
font-size: 32rpx; font-size: 32rpx;
margin-bottom: 12rpx; margin-bottom: 30rpx;
} }
.ware-house-content { .ware-house-content {
display: flex; display: flex;
...@@ -324,11 +361,17 @@ ...@@ -324,11 +361,17 @@
.ware-house-content-item { .ware-house-content-item {
color: #333333; color: #333333;
font-size: 26rpx; font-size: 26rpx;
text-align: center; display: flex;
justify-content: center;
flex-direction: column;
align-items: center;
.ware-house-image { .ware-house-image {
width: 60rpx; width: 60rpx;
height: 60rpx; height: 60rpx;
margin-bottom: 12rpx; margin-bottom: 14rpx;
display: flex;
justify-content: center;
align-items: center;
} }
} }
......
src/pages/mine/setting/index.vue 0 → 100644
View file @ 5e3dae5d
<template>
<!-- 设置 -->
<view class="setting-view">
<u-navbar back-icon-color="#333333" background="#FFFFFF" title="设置" titleColor="#333333"
:border-bottom="false" title-bold></u-navbar>
<view class="list-view">
<u-cell-group :border="false">
<view v-for="(item, index) in items" :key="index">
<u-cell-item :value="item.value" :border-bottom="false" @click="handleClick(item.pathName)">
<image slot="icon" :src="item.icon" :style="item.imageStyle"></image>
<view slot="title" class="item-title">{{item.title}}</view>
<view slot="value" class="item-value">{{value}}</view>
</u-cell-item>
</view>
</u-cell-group>
</view>
</view>
</template>
<script>
export default {
data() {
return {
};
},
computed: {
items() {
return [
{
pathName: 'about',
title: '当前版本',
value: process.uniEnv.version,
icon: process.uniEnv.qn_base_url + 'version.png',
imageStyle: 'width:32rpx;height:32rpx'
}
]
}
},
onLoad() {
getApp().trackPage('设置')
},
methods: {
handleClick(path) {
if(this.vuex_token) {
if (path === 'about') {
getApp().updateApp(1)
return
}
this.$u.route({
url: 'pages/mine/' + path + '/index'
})
} else {
this.$u.route({url: "pages/login/index"})
}
},
}
};
</script>
<style lang="scss" scoped>
.setting-view {
padding-bottom: 44px;
height: 100vh;
display: flex;
flex-direction: column;
background-color: #F4F5F7;
.list-view {
height: 100%;
margin-top: 30rpx;
.item-title {
font-size: 32rpx;
color: #333333;
margin-left: 16rpx;
line-height: 32rpx;
}
.item-value {
font-size: 26rpx;
color: #999999;
}
.line-view {
height: 2rpx;
background-color: #F4F5F7;
margin: 30rpx;
}
}
}
</style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment