yxt_group
/
mallplus
5
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

2023-02-22 完善页面样式

master
guoxing 2 years ago
parent
515ae22389
commit
c64e72109e
4 changed files with 299 additions and 267 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 3
      mallplusui-uniapp-app/pages/index/messageDetail.vue
  2. 36
      mallplusui-uniapp-app/pages/public/login.vue
  3. 2
      mallplusui-uniapp-app/pagesU/user/coupon.vue
  4. 75
      mallplusui-uniapp-app/pagesU/user/profile.vue

3
mallplusui-uniapp-app/pages/index/messageDetail.vue
View File

@ -91,7 +91,8 @@
display: flex; display: flex;
margin-top: 10px; margin-top: 10px;
height: 850px; height: 850px;
padding: 10rpx; font-size: 28px;
padding: 20upx 30upx;
background-color: #fff; background-color: #fff;
} }

36
mallplusui-uniapp-app/pages/public/login.vue
View File

@ -1,19 +1,21 @@
<template> <template>
<view class="container"> <view class="container">
<view class="left-bottom-sign"></view> <!-- <view class="left-bottom-sign"></view> -->
<!-- <view class="back-btn yticon icon-zuojiantou-up" @click="navBack"></view> --> <!-- <view class="back-btn yticon icon-zuojiantou-up" @click="navBack"></view> -->
<view class="right-top-sign"></view> <!-- <view class="right-top-sign"></view> -->
<!-- 设置白色背景防止软键盘把下部绝对定位元素顶上来盖住输入框等 --> <!-- 设置白色背景防止软键盘把下部绝对定位元素顶上来盖住输入框等 -->
<!-- <view class="left-top-sign">{{ sysInfo.name }}LOGIN</view> --> <!-- <view class="left-top-sign">{{ sysInfo.name }}LOGIN</view> -->
<view class="welcome">欢迎回来！汇融云链</view> <view class="welcome">汇融云链欢迎您</view>
<view class="wrapper"> <view class="wrapper">
<!-- #ifdef H5 --> <!-- #ifdef H5 -->
<view class="input-content"> <view class="input-content">
<view class="select_lay"> <view class="select_lay">
<text class="select_lay_text" :class="{'select_lay_text1':selectKey===0}" @click="selectType(0)">免密登录</text> <text :class="{'select_lay_text1':selectKey===0}"
<text class="select_lay_text" :class="{'select_lay_text1':selectKey===1}" @click="selectType(1)">账号登录</text> @click="selectType(0)">账号登录</text>
<text style="margin-left: 20px;" :class="{'select_lay_text1':selectKey===1}"
@click="selectType(1)">短信登录</text>
</view> </view>
@ -57,8 +59,10 @@
<view class="input-content"> <view class="input-content">
<view class="select_lay"> <view class="select_lay">
<text :class="{'select_lay_text1':selectKey===0}" @click="selectType(0)">免密登录</text> <text :class="{'select_lay_text1':selectKey===0}"
<text class="select_lay_text" :class="{'select_lay_text1':selectKey===1}" @click="selectType(1)">账号登录</text> @click="selectType(0)">账号登录</text>
<text style="margin-left: 20px;" :class="{'select_lay_text1':selectKey===1}" @click="selectType(1)">短信登录</text>
</view> </view>
@ -114,8 +118,8 @@
}, },
data() { data() {
return { return {
show: false, show: true,
selectKey:0, selectKey: 0,
code: '', code: '',
coding: false, coding: false,
auth_time: 60, auth_time: 60,
@ -140,8 +144,8 @@
}, },
methods: { methods: {
...mapMutations(['login']), ...mapMutations(['login']),
selectType(index){ selectType(index) {
this.selectKey=index this.selectKey = index
this.show = !this.show this.show = !this.show
}, },
@ -488,14 +492,14 @@
var that = this; var that = this;
let phoneReg = /^1[1-9][0-9]\d{8}$/; let phoneReg = /^1[1-9][0-9]\d{8}$/;
if(that.selectKey==0){ if (that.selectKey == 1) {
// 免密登录 // 短信登录
uni.showToast({ uni.showToast({
icon: 'none', icon: 'none',
title: '暂不支持此登录方式' title: '暂不支持此登录方式'
}); });
return; return;
}else{ } else {
// 账号登录 // 账号登录
try { try {
@ -701,7 +705,7 @@
align-items: center; align-items: center;
.select_lay_text { .select_lay_text {
margin-left: 30upx;
} }
.select_lay_text1 { .select_lay_text1 {
@ -792,7 +796,7 @@
.login_bot { .login_bot {
display: flex; display: flex;
margin-top: 15upx; margin-top: 25upx;
margin-left: 70upx; margin-left: 70upx;
margin-right: 70upx; margin-right: 70upx;
flex-direction: row; flex-direction: row;

2
mallplusui-uniapp-app/pagesU/user/coupon.vue
View File

@ -288,7 +288,7 @@ import Api from '@/common/api';
/* #ifdef H5 || MP-WEIXIN*/ /* #ifdef H5 || MP-WEIXIN*/
width: 100% !important; width: 100% !important;
/* #endif */ /* #endif */
width: 94%; width: 100%;
height: 95upx; height: 95upx;
padding: 0 3%; padding: 0 3%;
border-bottom: solid 1upx #dedede; border-bottom: solid 1upx #dedede;

75
mallplusui-uniapp-app/pagesU/user/profile.vue
View File

@ -2,13 +2,16 @@
<view class="container"> <view class="container">
<view class="list-cell b-b m-t" @click="upImg" :hover-stay-time="50" style="display: flex;align-items: center;"> <view class="list-cell b-b m-t" @click="upImg" :hover-stay-time="50" style="display: flex;align-items: center;">
<text class="cell-tit">我的头像</text> <text class="cell-tit">我的头像</text>
<view class="" style="display: flex;align-items: center;justify-content: center;height: 80upx;line-height: 80upx;"> <view class=""
<image v-if="userInfos && userInfos.icon" :src="userInfos.icon" style="border-radius: 50%;width: 100upx;height: 100upx;"></image> style="display: flex;align-items: center;justify-content: center;height: 80upx;line-height: 80upx;">
<image v-if="userInfos && userInfos.icon" :src="userInfos.icon"
style="border-radius: 50%;width: 100upx;height: 100upx;"></image>
<text class="cell-more yticon icon-you"></text> <text class="cell-more yticon icon-you"></text>
</view> </view>
</view> </view>
<view class="list-cell b-b m-t" @click="inputShowModal('nickname')" hover-class="cell-hover" :hover-stay-time="50"> <view class="list-cell b-b m-t" @click="inputShowModal('nickname')" hover-class="cell-hover"
:hover-stay-time="50">
<text class="cell-tit" v-if="userInfos && userInfos.nickname">修改昵称:{{userInfos.nickname|| ''}}</text> <text class="cell-tit" v-if="userInfos && userInfos.nickname">修改昵称:{{userInfos.nickname|| ''}}</text>
<text class="cell-more yticon icon-you"></text> <text class="cell-more yticon icon-you"></text>
</view> </view>
@ -35,10 +38,13 @@
<script> <script>
import mallplusCopyright from '@/components/mall-copyright/mallplusCopyright.vue'; import mallplusCopyright from '@/components/mall-copyright/mallplusCopyright.vue';
import Api from '@/common/api'; import Api from '@/common/api';
import neilModal from '@/components/neil-modal.vue'; import neilModal from '@/components/neil-modal.vue';
import { mapState, mapMutations } from 'vuex'; import {
export default { mapState,
mapMutations
} from 'vuex';
export default {
components: { components: {
neilModal neilModal
}, },
@ -49,8 +55,17 @@ export default {
inputContent: '', inputContent: '',
genderShow: false, genderShow: false,
gender: undefined, gender: undefined,
genders: [{ name: '保密', value: 0 }, { name: '男', value: 1 }, { name: '女', value: 2 }], genders: [{
name: '保密',
value: 0
}, {
name: '男',
value: 1
}, {
name: '女',
value: 2
}],
current: 0,
userInfos: {}, userInfos: {},
sourceTypeIndex: 0, sourceTypeIndex: 0,
sourceType: ['拍照', '相册', '拍照或相册'], sourceType: ['拍照', '相册', '拍照或相册'],
@ -59,24 +74,24 @@ export default {
}; };
}, },
async onShow() { async onShow() {
let params = { }; let params = {};
let data = await Api.apiCall('get', Api.index.userSampleInfo, params); let data = await Api.apiCall('get', Api.index.userSampleInfo, params);
this.userInfos=data; this.userInfos = data;
console.log(this.userInfos); console.log(this.userInfos);
}, },
async onLoad() { async onLoad() {
let params = { }; let params = {};
let data = await Api.apiCall('get', Api.index.userSampleInfo, params); let data = await Api.apiCall('get', Api.index.userSampleInfo, params);
this.userInfos=data; this.userInfos = data;
console.log(this.userInfos); console.log(this.userInfos);
}, },
methods: { methods: {
upImg(){ upImg() {
this.$otherApi.uploadFiles(res => { this.$otherApi.uploadFiles(res => {
if (res.code == 200) { if (res.code == 200) {
this.userInfos.icon = res.data; this.userInfos.icon = res.data;
let obj = { let obj = {
id:1, id: 1,
icon: res.data icon: res.data
}; };
Api.apiCall('post', Api.member.updateMember, obj); Api.apiCall('post', Api.member.updateMember, obj);
@ -106,7 +121,9 @@ export default {
that.$api.msg('输入不能为空'); that.$api.msg('输入不能为空');
return; return;
} }
let obj = { id:1}; let obj = {
id: 1
};
obj[that.feild] = that.inputContent; obj[that.feild] = that.inputContent;
Api.apiCall('post', Api.member.updateMember, obj); Api.apiCall('post', Api.member.updateMember, obj);
that.$api.msg('修改成功'); that.$api.msg('修改成功');
@ -123,7 +140,7 @@ export default {
return; return;
} }
let obj = { let obj = {
id:1, id: 1,
gender: that.gender gender: that.gender
}; };
Api.apiCall('post', Api.member.updateMember, obj); Api.apiCall('post', Api.member.updateMember, obj);
@ -131,18 +148,19 @@ export default {
} }
} }
}; };
</script> </script>
<style lang="scss"> <style lang="scss">
page { page {
background: $page-color-base; background: $page-color-base;
} }
page { page {
background: $page-color-base; background: $page-color-base;
} }
.list-cell {
.list-cell {
display: flex; display: flex;
align-items: baseline; align-items: baseline;
padding: 20upx; padding: 20upx;
@ -150,41 +168,50 @@ page {
position: relative; position: relative;
background: #fff; background: #fff;
justify-content: center; justify-content: center;
&.log-out-btn { &.log-out-btn {
margin-top: 40upx; margin-top: 40upx;
.cell-tit { .cell-tit {
color: $uni-color-primary; color: $uni-color-primary;
text-align: center; text-align: center;
margin-right: 0; margin-right: 0;
} }
} }
&.cell-hover { &.cell-hover {
background: #fafafa; background: #fafafa;
} }
&.b-b:after { &.b-b:after {
left: 30upx; left: 30upx;
} }
&.m-t { &.m-t {
margin-top: 16upx; margin-top: 16upx;
} }
.cell-more { .cell-more {
align-self: baseline; align-self: baseline;
font-size: $font-lg; font-size: $font-lg;
color: $font-color-light; color: $font-color-light;
margin-left: 10upx; margin-left: 10upx;
} }
.cell-tit { .cell-tit {
flex: 1; flex: 1;
font-size: $font-base + 2upx; font-size: $font-base + 2upx;
color: $font-color-dark; color: $font-color-dark;
margin-right: 10upx; margin-right: 10upx;
} }
.cell-tip { .cell-tip {
font-size: $font-base; font-size: $font-base;
color: $font-color-light; color: $font-color-light;
} }
switch { switch {
transform: translateX(16upx) scale(0.84); transform: translateX(16upx) scale(0.84);
} }
} }
</style> </style>

Write Preview
Loading…
Cancel
Save