Unverified Commit 3759c910 authored by linlinjava's avatar linlinjava Committed by GitHub
Browse files

Merge pull request #31 from usgeek/master

小程序前端界面调整及部分功能实现,java后端添加阿里云对象存储
parents 70763a2e 4a911bd5
...@@ -28,6 +28,11 @@ ...@@ -28,6 +28,11 @@
<version>5.4.4</version> <version>5.4.4</version>
</dependency> </dependency>
<dependency>
<groupId>com.aliyun.oss</groupId>
<artifactId>aliyun-sdk-oss</artifactId>
<version>2.5.0</version>
</dependency>
</dependencies> </dependencies>
......
package org.linlinjava.litemall.os.service;
import com.aliyun.oss.OSSClient;
import com.aliyun.oss.model.ObjectMetadata;
import com.aliyun.oss.model.PutObjectRequest;
import com.aliyun.oss.model.PutObjectResult;
import org.springframework.beans.factory.annotation.Value;
import org.springframework.context.annotation.PropertySource;
import org.springframework.core.io.Resource;
import org.springframework.core.io.UrlResource;
import org.springframework.stereotype.Service;
import org.springframework.web.multipart.MultipartFile;
import java.net.MalformedURLException;
import java.net.URL;
import java.nio.file.Path;
import java.util.stream.Stream;
/**
* @author Yogeek
* @date 2018/7/16 16:10
* @decrpt 阿里云对象存储服务
*/
@PropertySource(value = "classpath:aliyun.properties")
@Service("aos")
public class AliyunOsService implements ObjectStorageService {
@Value("${aliyun.os.ENDPOINT}")
private String ENDPOINT;
@Value("${aliyun.os.ACCESS_KEY_ID}")
private String ACCESS_KEY_ID;
@Value("${aliyun.os.ACCESS_KEY_SECRET}")
private String ACCESS_KEY_SECRET;
@Value("${aliyun.os.BUCKET_NAME}")
private String BUCKET_NAME;
// @Value("${aliyun.os.FOLDER}")
// private String FOLDER;
/**
* 获取阿里云OSS客户端对象
*
* @return ossClient
*/
private OSSClient getOSSClient(){
return new OSSClient(ENDPOINT,ACCESS_KEY_ID, ACCESS_KEY_SECRET);
}
private String getBaseUrl() {
return "https://" + BUCKET_NAME + "." + ENDPOINT + "/" ;
}
/**
* 阿里云OSS对象存储简单上传实现
*/
@Override
public void store(MultipartFile file, String keyName) {
try {
// 简单文件上传, 最大支持 5 GB, 适用于小文件上传, 建议 20M以下的文件使用该接口
ObjectMetadata objectMetadata = new ObjectMetadata();
objectMetadata.setContentLength(file.getSize());
objectMetadata.setContentType(file.getContentType());
// 对象键(Key)是对象在存储桶中的唯一标识。
PutObjectRequest putObjectRequest = new PutObjectRequest(BUCKET_NAME, keyName, file.getInputStream(), objectMetadata);
PutObjectResult putObjectResult = getOSSClient().putObject(putObjectRequest);
} catch (Exception ex) {
ex.printStackTrace();
}
}
@Override
public Stream<Path> loadAll() {
return null;
}
@Override
public Path load(String keyName) {
return null;
}
@Override
public Resource loadAsResource(String keyName) {
try {
URL url = new URL(getBaseUrl() + keyName);
Resource resource = new UrlResource(url);
if (resource.exists() || resource.isReadable()) {
return resource;
} else {
return null;
}
} catch (MalformedURLException e) {
e.printStackTrace();
return null;
}
}
@Override
public void delete(String keyName) {
try {
getOSSClient().deleteObject(BUCKET_NAME, keyName);
}catch (Exception e){
e.printStackTrace();
}
}
@Override
public String generateUrl(String keyName) {
return getBaseUrl() + keyName;
}
}
# 阿里云对象存储配置信息
aliyun.os.ENDPOINT=oss-cn-shenzhen.aliyuncs.com
aliyun.os.ACCESS_KEY_ID=
aliyun.os.ACCESS_KEY_SECRET=
aliyun.os.BUCKET_NAME=
#aliyun.os.FOLDER="xxxxxx"
\ No newline at end of file
...@@ -31,43 +31,45 @@ ...@@ -31,43 +31,45 @@
"pages/shopping/checkout/checkout", "pages/shopping/checkout/checkout",
"pages/shopping/address/address", "pages/shopping/address/address",
"pages/shopping/addressAdd/addressAdd", "pages/shopping/addressAdd/addressAdd",
"pages/goods/goods" "pages/goods/goods",
"pages/about/index"
], ],
"window": { "window": {
"navigationBarTitleText": "litemall小程序商城",
"navigationBarTextStyle": "#FFFFFF",
"navigationBarBackgroundColor": "#696969",
"backgroundColor": "#FFFFFF",
"backgroundTextStyle": "dark", "backgroundTextStyle": "dark",
"navigationBarBackgroundColor": "#fff", "enablePullDownRefresh": false
"navigationBarTitleText": "仿网易严选",
"navigationBarTextStyle": "black",
"enablePullDownRefresh": true
}, },
"tabBar": { "tabBar": {
"backgroundColor": "#fafafa", "backgroundColor": "#fafafa",
"borderStyle": "white", "borderStyle": "white",
"selectedColor": "#b4282d", "selectedColor": "#AB956D",
"color": "#666", "color": "#666",
"list": [ "list": [
{ {
"pagePath": "pages/index/index", "pagePath": "pages/index/index",
"iconPath": "static/images/ic_menu_choice_nor.png", "iconPath": "static/images/ic_menu_choice_nor.png",
"selectedIconPath": "static/images/ic_menu_choice_pressed.png", "selectedIconPath": "static/images/home@selected.png",
"text": "首页" "text": "首页"
}, },
{ {
"pagePath": "pages/catalog/catalog", "pagePath": "pages/catalog/catalog",
"iconPath": "static/images/ic_menu_sort_nor.png", "iconPath": "static/images/ic_menu_sort_nor.png",
"selectedIconPath": "static/images/ic_menu_sort_pressed.png", "selectedIconPath": "static/images/category@selected.png",
"text": "分类" "text": "分类"
}, },
{ {
"pagePath": "pages/cart/cart", "pagePath": "pages/cart/cart",
"iconPath": "static/images/ic_menu_shoping_nor.png", "iconPath": "static/images/ic_menu_shoping_nor.png",
"selectedIconPath": "static/images/ic_menu_shoping_pressed.png", "selectedIconPath": "static/images/cart@selected.png",
"text": "购物车" "text": "购物车"
}, },
{ {
"pagePath": "pages/ucenter/index/index", "pagePath": "pages/ucenter/index/index",
"iconPath": "static/images/ic_menu_me_nor.png", "iconPath": "static/images/ic_menu_me_nor.png",
"selectedIconPath": "static/images/ic_menu_me_pressed.png", "selectedIconPath": "static/images/my@selected.png",
"text": "个人" "text": "个人"
} }
] ]
......
// index.js
var app = getApp()
var util = require("../../utils/util.js");
var api = require("../../config/api.js");
Page({
/**
* 页面的初始数据
*/
data: {
load_statue: true,
shopInfo: {
name: 'litemall',
address: 'https://github.com/linlinjava/litemall',
latitude: 22.60,
longitude: 116.87,
linkPhone: '0755-xxxx-xxxx',
qqNumber: '738696120'
},
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
},
showLocation: function (e) {
var that = this
wx.openLocation({
latitude: that.data.shopInfo.latitude,
longitude: that.data.shopInfo.longitude,
name: that.data.shopInfo.name,
address: that.data.shopInfo.address,
})
},
callPhone: function (e) {
var that = this
wx.makePhoneCall({
phoneNumber: that.data.shopInfo.linkPhone,
})
},
reLoad: function (e) {
this.loadShopInfo();
}
})
\ No newline at end of file
{}
\ No newline at end of file
<view class="container">
<view class="about-item">
<view class="item-left">
<label>项目名称: </label>
<text>{{shopInfo.name}}</text>
</view>
</view>
<view class="about-item">
<view class="item-left">
<label>项目地址: </label>
<text>{{shopInfo.address}}</text>
</view>
<view class="item-right" bindtap="showLocation">
<image src="/static/images/ico-addr.png" class="right-icon"></image>
</view>
</view>
<view class="about-item">
<view class="item-left">
<label>电话号码: </label>
<text>{{shopInfo.linkPhone}}</text>
</view>
<view class="item-right" bindtap="callPhone">
<image src="/static/images/telephone.png" class="right-icon"></image>
</view>
</view>
<view class="about-item">
<view class="item-left">
<label>litemall交流群: </label>
<text>{{shopInfo.qqNumber}}</text>
</view>
<view class="item-right">
<image src="/static/images/mobile.png" class="right-icon"></image>
</view>
</view>
</view>
\ No newline at end of file
/* index.wxss */
page{
height: 100%;
background-color: #F2f2f2;
}
.page-view{
height: 100%;
}
.banner-image{
width: 100%;
height: 350rpx;
background: #ee1;
margin-bottom: 30rpx;
border-bottom: solid #f2f2f2 0.5dp;
}
.about-item{
background: white;
border-top: solid #f2f2f2 0.5rpx;
border-bottom: solid #f2f2f2 0.5rpx;
width: 100%;
height: 100rpx;
display: flex;
flex-direction: row;
justify-content: space-between;
}
.item-left{
font-size: 32rpx;
margin-left: 15rpx;
margin-top: auto;
margin-bottom: auto;
}
.item-right{
margin-right: 15rpx;
margin-top: auto;
margin-bottom: auto;
}
.right-icon{
width: 40rpx;
height: 40rpx;
}
\ No newline at end of file
...@@ -42,7 +42,7 @@ Page({ ...@@ -42,7 +42,7 @@ Page({
// 这里检测一下 // 这里检测一下
let _productPrice = res.data.productList[0].price; let _productPrice = res.data.productList[0].price;
let _goodsPrice = res.data.info.retailPrice; let _goodsPrice = res.data.info.retailPrice;
if (_productPrice != _goodsPrice){ if (_productPrice != _goodsPrice) {
console.error('商品数量价格和货品不一致'); console.error('商品数量价格和货品不一致');
} }
...@@ -206,21 +206,21 @@ Page({ ...@@ -206,21 +206,21 @@ Page({
} }
let checkedProduct = checkedProductArray[0]; let checkedProduct = checkedProductArray[0];
if (checkedProduct.number > 0){ if (checkedProduct.number > 0) {
this.setData({ this.setData({
checkedSpecPrice: checkedProduct.price, checkedSpecPrice: checkedProduct.price,
soldout: false soldout: false
}); });
} }
else{ else {
this.setData({ this.setData({
checkedSpecPrice: this.data.goods.retailPrice, checkedSpecPrice: this.data.goods.retailPrice,
soldout: true soldout: true
}); });
} }
} }
else{ else {
this.setData({ this.setData({
checkedSpecText: '规格数量选择', checkedSpecText: '规格数量选择',
checkedSpecPrice: this.data.goods.retailPrice, checkedSpecPrice: this.data.goods.retailPrice,
...@@ -276,28 +276,33 @@ Page({ ...@@ -276,28 +276,33 @@ Page({
}); });
} }
}, },
closeAttrOrCollect: function () { closeAttr: function () {
this.setData({
openAttr: false,
});
},
addCollectOrNot: function () {
let that = this; let that = this;
if (this.data.openAttr) { // if (this.data.openAttr) {
this.setData({ // this.setData({
openAttr: false, // openAttr: false,
}); // });
if (that.data.userHasCollect == 1) { // if (that.data.userHasCollect == 1) {
that.setData({ // that.setData({
collectBackImage: that.data.hasCollectImage // collectBackImage: that.data.hasCollectImage
}); // });
} else { // } else {
that.setData({ // that.setData({
collectBackImage: that.data.noCollectImage // collectBackImage: that.data.noCollectImage
}); // });
} // }
} else { // } else {
//添加或是取消收藏 //添加或是取消收藏
util.request(api.CollectAddOrDelete, { type: 0, valueId: this.data.id }, "POST") util.request(api.CollectAddOrDelete, { type: 0, valueId: this.data.id }, "POST")
.then(function (res) { .then(function (res) {
let _res = res; let _res = res;
if (_res.errno == 0) { if (_res.errno == 0) {
if ( _res.data.type == 'add') { if (_res.data.type == 'add') {
that.setData({ that.setData({
collectBackImage: that.data.hasCollectImage collectBackImage: that.data.hasCollectImage
}); });
...@@ -316,7 +321,6 @@ Page({ ...@@ -316,7 +321,6 @@ Page({
} }
}); });
}
}, },
openCartPage: function () { openCartPage: function () {
...@@ -394,7 +398,7 @@ Page({ ...@@ -394,7 +398,7 @@ Page({
//打开规格选择窗口 //打开规格选择窗口
this.setData({ this.setData({
openAttr: !this.data.openAttr, openAttr: !this.data.openAttr,
collectBackImage: '/static/images/detail_back.png' // collectBackImage: '/static/images/detail_back.png'
}); });
} else { } else {
......
<scroll-view class="container" scroll-y="true"> <view class="container">
<view wx:if="{{!openAttr}}"> <swiper class="goodsimgs" indicator-dots="true" autoplay="true" interval="3000" duration="1000">
<swiper class="goodsimgs" indicator-dots="true" autoplay="true" interval="3000" duration="1000"> <swiper-item wx:for="{{goods.gallery}}" wx:key="*this">
<swiper-item wx:for="{{goods.gallery}}" wx:key="*this"> <image src="{{item}}" background-size="cover"></image>
<image src="{{item}}" background-size="cover"></image> </swiper-item>
</swiper-item> </swiper>
</swiper> <view class="service-policy">
<view class="service-policy"> <view class="item">30天无忧退货</view>
<view class="item">30天无忧退货</view> <view class="item">48小时快速退款</view>
<view class="item">48小时快速退款</view> <view class="item">满88元免邮费</view>
<view class="item">满88元免邮费</view> </view>
</view> <view class="goods-info">
<view class="goods-info"> <view class="c">
<view class="c"> <text class="name">{{goods.name}}</text>
<text class="name">{{goods.name}}</text> <text class="desc">{{goods.goodsBrief}}</text>
<text class="desc">{{goods.goodsBrief}}</text> <text class="price">¥{{checkedSpecPrice}}</text>
<text class="price">¥{{checkedSpecPrice}}</text> <view class="brand" wx:if="{{brand.name}}">
<view class="brand" wx:if="{{brand.name}}"> <navigator url="../brandDetail/brandDetail?id={{brand.id}}">
<navigator url="/pages/brandDetail/brandDetail?id={{brand.id}}"> <text>{{brand.name}}</text>
<text>{{brand.name}}</text> </navigator>
</navigator>
</view>
</view> </view>
</view> </view>
<view class="section-nav section-attr" bindtap="switchAttrPop"> </view>
<view class="t">{{checkedSpecText}}</view> <view class="section-nav section-attr" bindtap="switchAttrPop">
<image class="i" src="/static/images/address_right.png" background-size="cover"></image> <view class="t">{{checkedSpecText}}</view>
<image class="i" src="/static/images/address_right.png" background-size="cover"></image>
</view>
<view class="comments" wx:if="{{comment.count > 0}}">
<view class="h">
<navigator url="/pages/comment/comment?valueId={{goods.id}}&type=0">
<text class="t">评价({{comment.count > 999 ? '999+' : comment.count}})</text>
<text class="i">查看全部</text>
</navigator>
</view> </view>
<view class="comments" wx:if="{{comment.count > 0}}"> <view class="b">
<view class="h"> <view class="item" wx:for="{{comment.data}}" wx:key="id">
<navigator url="/pages/comment/comment?valueId={{goods.id}}&type=0"> <view class="info">
<text class="t">评价({{comment.count > 999 ? '999+' : comment.count}})</text> <view class="user">
<text class="i">查看全部</text> <image src="{{item.avatar}}"></image>
</navigator> <text>{{item.nickname}}</text>
</view>
<view class="b">
<view class="item" wx:for="{{comment.data}}" wx:key="id">
<view class="info">
<view class="user">
<image src="{{item.avatar}}"></image>
<text>{{item.nickname}}</text>
</view>
<view class="time">{{item.addTime}}</view>
</view>
<view class="content">
{{item.content}}
</view>
<view class="imgs" wx:if="{{item.picList.length > 0}}">
<image class="img" wx:for="{{item.picList}}" wx:key="*this" wx:for-item="iitem" src="{{iitem}}"></image>
</view> </view>
<view class="time">{{item.addTime}}</view>
</view>
<view class="content">
{{item.content}}
</view>
<view class="imgs" wx:if="{{item.picList.length > 0}}">
<image class="img" wx:for="{{item.picList}}" wx:key="*this" wx:for-item="iitem" src="{{iitem}} "></image>
</view> </view>
<!-- <view class="spec">白色 2件</view> -->
</view> </view>
</view> </view>
<view class="goods-attr"> </view>
<view class="t">商品参数</view> <view class="goods-attr">
<view class="l"> <view class="t">商品参数</view>
<view class="item" wx:for="{{attribute}}" wx:key="item"> <view class="l">
<text class="left">{{item.attribute}}</text> <view class="item" wx:for="{{attribute}}" wx:key="name">
<text class="right">{{item.value}}</text> <text class="left">{{item.attribute}}</text>
</view> <text class="right">{{item.value}}</text>
</view> </view>
</view> </view>
</view>
<view class="detail"> <view class="detail">
<import src="/lib/wxParse/wxParse.wxml" /> <import src="/lib/wxParse/wxParse.wxml" />
<template is="wxParse" data="{{wxParseData:goodsDetail.nodes}}" /> <template is="wxParse" data="{{wxParseData:goodsDetail.nodes}}" />
</view> </view>
<view class="common-problem">
<view class="h"> <view class="common-problem">
<view class="line"></view> <view class="h">
<text class="title">常见问题</text> <view class="line"></view>
</view> <text class="title">常见问题</text>
<view class="b"> </view>
<view class="item" wx:for="{{issueList}}" wx:key="id"> <view class="b">
<view class="question-box"> <view class="item" wx:for="{{issueList}}" wx:key="id">
<text class="spot"></text> <view class="question-box">
<text class="question">{{item.question}}</text> <text class="spot"></text>
</view> <text class="question">{{item.question}}</text>
<view class="answer"> </view>
{{item.answer}} <view class="answer">
</view> {{item.answer}}
</view> </view>
</view> </view>
</view> </view>
</view>
<view class="related-goods" wx:if="{{relatedGoods.length > 0}}"> <view class="related-goods" wx:if="{{relatedGoods.length > 0}}">
<view class="h"> <view class="h">
<view class="line"></view> <view class="line"></view>
<text class="title">大家都在看</text> <text class="title">大家都在看</text>
</view> </view>
<view class="b"> <view class="b">
<view class="item" wx:for="{{relatedGoods}}" wx:key="id"> <view class="item" wx:for="{{relatedGoods}}" wx:key="id">
<navigator url="/pages/goods/goods?id={{item.id}}"> <navigator url="/pages/goods/goods?id={{item.id}}">
<image class="img" src="{{item.picUrl}}" background-size="cover"></image> <image class="img" src="{{item.picUrl}}" background-size="cover"></image>
<text class="name">{{item.name}}</text> <text class="name">{{item.name}}</text>
<text class="price">¥{{item.retailPrice}}</text> <text class="price">¥{{item.retailPrice}}</text>
</navigator> </navigator>
</view>
</view> </view>
</view> </view>
</view> </view>
<view wx:if="{{openAttr}}" class="attr-pop"> </view>
<view class="attr-pop-box" hidden="{{!openAttr}}">
<view class="attr-pop">
<view class="close" bindtap="closeAttr">
<image class="icon" src="/static/images/icon_close.png"></image>
</view>
<view class="img-info"> <view class="img-info">
<image class="img" src="{{goods.picUrl}}"></image> <image class="img" src="{{goods.picUrl}}"></image>
<view class="info"> <view class="info">
<view class="c"> <view class="c">
<view class="p">价格:¥{{checkedSpecPrice}}</view> <view class="p">价格:¥{{checkedSpecPrice}}</view>
<view class="a">{{tmpSpecText}}</view> <view class="a" wx:if="{{productList.length>0}}">已选择:{{checkedSpecText}}</view>
</view> </view>
</view> </view>
</view> </view>
...@@ -114,9 +119,7 @@ ...@@ -114,9 +119,7 @@
<view class="spec-item" wx:for="{{specificationList}}" wx:key="name"> <view class="spec-item" wx:for="{{specificationList}}" wx:key="name">
<view class="name">{{item.name}}</view> <view class="name">{{item.name}}</view>
<view class="values"> <view class="values">
<view class="value {{vitem.checked ? 'selected' : ''}}" bindtap="clickSkuValue" wx:for="{{item.valueList}}" wx:for-item="vitem" wx:key="id" data-value-id="{{vitem.id}}" data-name="{{vitem.specification}}"> <view class="value {{vitem.checked ? 'selected' : ''}}" bindtap="clickSkuValue" wx:for="{{item.valueList}}" wx:for-item="vitem" wx:key="{{vitem.id}}" data-value-id="{{vitem.id}}" data-name-id="{{vitem.specification}}">{{vitem.value}}</view>
{{vitem.value}}
</view>
</view> </view>
</view> </view>
...@@ -130,9 +133,13 @@ ...@@ -130,9 +133,13 @@
</view> </view>
</view> </view>
</view> </view>
</scroll-view> </view>
<view class="contact">
<contact-button style="opacity:0;position:absolute;" type="default-dark" session-from="weapp" size="27">
</contact-button>
</view>
<view class="bottom-btn"> <view class="bottom-btn">
<view class="l l-collect {{ openAttr ? 'back' : ''}}" bindtap="closeAttrOrCollect"> <view class="l l-collect" bindtap="addCollectOrNot">
<image class="icon" src="{{ collectBackImage }}"></image> <image class="icon" src="{{ collectBackImage }}"></image>
</view> </view>
<view class="l l-cart"> <view class="l l-cart">
......
This diff is collapsed.
...@@ -80,6 +80,23 @@ Page({ ...@@ -80,6 +80,23 @@ Page({
wx.navigateTo({ url: "/pages/auth/login/login" }); wx.navigateTo({ url: "/pages/auth/login/login" });
}; };
}, },
aboutUs: function () {
// wx.navigateTo({
// url: '/page/about/index',
// })
wx.navigateTo({
url: '../../about/index',//页面跳转相对路径要写清楚且准确
success: function (res) {
console.log('跳转到news页面成功')// success
},
fail: function () {
console.log('跳转到news页面失败') // fail
},
complete: function () {
console.log('跳转到news页面完成') // complete
}
})
},
exitLogin: function () { exitLogin: function () {
wx.showModal({ wx.showModal({
title: '', title: '',
......
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
<view class="profile-info" bindtap="goLogin"> <view class="profile-info" bindtap="goLogin">
<image class="avatar" src="{{userInfo.avatarUrl}}"></image> <image class="avatar" src="{{userInfo.avatarUrl}}"></image>
<view class="info"> <view class="info">
<text class="name">{{userInfo.nickName}}</text> <text class="name">{{userInfo.nickName}}</text>
</view> </view>
</view> </view>
...@@ -27,13 +27,13 @@ ...@@ -27,13 +27,13 @@
</view> --> </view> -->
<view class="item"> <view class="item">
<view class="a" bindtap="goCollect"> <view class="a" bindtap="goCollect">
<text class="icon collect"></text> <image class="user-menu .icon.collect" src="/static/images/icon_collect.png"></image>
<text class="txt">我的收藏</text> <text class="txt">我的收藏</text>
</view> </view>
</view> </view>
<view class="item"> <view class="item">
<view class="a" bindtap="goFootprint"> <view class="a" bindtap="goFootprint">
<text class="icon security"></text> <image class="user-menu .icon.collect" src="/static/images/foot.png"></image>
<text class="txt">我的足迹</text> <text class="txt">我的足迹</text>
</view> </view>
</view> </view>
...@@ -55,19 +55,27 @@ ...@@ -55,19 +55,27 @@
<text class="txt">账号安全</text> <text class="txt">账号安全</text>
</view> </view>
</view> --> </view> -->
<!-- <view class="item no-border"> <!-- 能力有限,此添加方式开发环境看不到效果,但是线上环境可以正常使用-->
<button class="item no-border" open-type="contact" size="20" session-from="weapp">
<view class="a"> <view class="a">
<text class="icon kefu"></text> <text class="icon kefu"></text>
<text class="txt">联系客服</text> <text class="txt">联系客服</text>
</view> </view>
</view> --> </button>
<!-- <view class="item item-bottom"> <button view class="item" open-type="getPhoneNumber" bindgetphonenumber="getPhoneNumber">
<view class="a"> <view class="a">
<text class="icon help"></text> <image class="user-menu .icon.phone" src="/static/images/mobile.png"></image>
<text class="txt">帮助中心</text> <text class="txt">绑定手机号码</text>
</view> </view>
</view> --> </button>
<view class="item">
<view class="a" bindtap="aboutUs">
<image class="user-menu .icon.collect" src="/static/images/about_us.png"></image>
<text class="txt">关于我们</text>
</view>
</view>
</view> </view>
<!--<view class="logout" bindtap="exitLogin">退出登录</view>--> <!--<view class="logout" bindtap="exitLogin">退出登录</view>-->
</view> </view>
\ No newline at end of file
page{ page {
height: 100%; height: 100%;
width: 100%; width: 100%;
background: #f4f4f4; background: #f4f4f4;
} }
.container{
background: #f4f4f4; .container {
height: auto; background: #f4f4f4;
overflow: hidden; height: auto;
width: 100%; overflow: hidden;
} width: 100%;
.profile-info{ }
width: 100%;
height: 280rpx; .profile-info {
display: flex; width: 100%;
flex-wrap: wrap; height: 280rpx;
align-items: center; display: flex;
justify-content: flex-start; flex-wrap: wrap;
padding: 0 30.25rpx; align-items: center;
background: #333; justify-content: flex-start;
} padding: 0 30.25rpx;
background: #333;
.profile-info .avatar{ }
height: 148rpx;
width: 148rpx; .profile-info .avatar {
border-radius: 50%; height: 148rpx;
} width: 148rpx;
border-radius: 50%;
.profile-info .info{ }
flex: 1;
height: 85rpx; .profile-info .info {
padding-left: 31.25rpx; flex: 1;
} height: 85rpx;
padding-left: 31.25rpx;
.profile-info .name{ }
display: block;
height: 45rpx; .profile-info .name {
line-height: 45rpx; display: block;
color: #fff; height: 45rpx;
font-size: 37.5rpx; line-height: 45rpx;
margin-bottom: 10rpx; color: #fff;
} font-size: 37.5rpx;
margin-bottom: 10rpx;
.profile-info .level{ }
display: block;
height: 30rpx; .profile-info .level {
line-height: 30rpx; display: block;
margin-bottom: 10rpx; height: 30rpx;
color: #7f7f7f; line-height: 30rpx;
font-size: 30rpx; margin-bottom: 10rpx;
} color: #7f7f7f;
font-size: 30rpx;
.user-menu{ }
width: 100%;
height: auto; .user-menu {
overflow: hidden; width: 100%;
background: #fff; height: auto;
} overflow: hidden;
background: #fff;
.user-menu .item{ }
float: left;
width: 33.33333%; .user-menu .item {
height: 187.5rpx; float: left;
border-right: 1px solid rgba(0,0,0,.15); width: 33.33333%;
border-bottom: 1px solid rgba(0,0,0,.15); height: 187.5rpx;
text-align: center; border-right: 1px solid rgba(0, 0, 0, 0.15);
} border-bottom: 1px solid rgba(0, 0, 0, 0.15);
text-align: center;
.user-menu .item .a{ }
.user-menu .item .a {
display: flex; display: flex;
width: 100%; width: 100%;
height: 100%; height: 100%;
...@@ -76,82 +78,100 @@ page{ ...@@ -76,82 +78,100 @@ page{
} }
.user-menu .item.no-border { .user-menu .item.no-border {
border-right: 0; border-right: 0;
} }
.user-menu .item.item-bottom { .user-menu .item.item-bottom {
border-bottom: none; border-bottom: none;
} }
.user-menu .icon{ .user-menu .icon {
margin: 0 auto; margin: 0 auto;
display: block; display: block;
height: 52.803rpx; height: 52.803rpx;
width: 52.803rpx; width: 52.803rpx;
margin-bottom: 16rpx; margin-bottom: 16rpx;
} }
.user-menu .icon.order{ .user-menu .icon.order {
background: url(http://yanxuan.nosdn.127.net/hxm/yanxuan-wap/p/20161201/style/img/sprites/ucenter-sdf6a55ee56-f2c2b9c2f0.png) 0 -437.5rpx no-repeat; background: url(http://yanxuan.nosdn.127.net/hxm/yanxuan-wap/p/20161201/style/img/sprites/ucenter-sdf6a55ee56-f2c2b9c2f0.png) 0 -437.5rpx no-repeat;
background-size: 52.803rpx; background-size: 52.803rpx;
} }
.user-menu .icon.coupon{ .user-menu .icon.coupon {
background: url(http://yanxuan.nosdn.127.net/hxm/yanxuan-wap/p/20161201/style/img/sprites/ucenter-sdf6a55ee56-f2c2b9c2f0.png) 0 -62.4997rpx no-repeat; background: url(http://yanxuan.nosdn.127.net/hxm/yanxuan-wap/p/20161201/style/img/sprites/ucenter-sdf6a55ee56-f2c2b9c2f0.png) 0 -62.4997rpx no-repeat;
background-size: 52.803rpx; background-size: 52.803rpx;
} }
.user-menu .icon.collect{ .user-menu .icon.phone {
background: url(http://yanxuan.nosdn.127.net/hxm/yanxuan-wap/p/20161201/style/img/sprites/ucenter-sdf6a55ee56-f2c2b9c2f0.png) 0 -62.4997rpx no-repeat; display: block;
background-size: 52.803rpx; height: 55rpx;
width: 55rpx;
background-size: 52.803rpx;
} }
.user-menu .icon.gift{ .user-menu .icon.gift {
background: url(http://yanxuan.nosdn.127.net/hxm/yanxuan-wap/p/20161201/style/img/sprites/ucenter-sdf6a55ee56-f2c2b9c2f0.png) 0 -187.5rpx no-repeat; background: url(http://yanxuan.nosdn.127.net/hxm/yanxuan-wap/p/20161201/style/img/sprites/ucenter-sdf6a55ee56-f2c2b9c2f0.png) 0 -187.5rpx no-repeat;
background-size: 52.803rpx; background-size: 52.803rpx;
} }
.user-menu .icon.address{ .user-menu .icon.address {
background: url(http://yanxuan.nosdn.127.net/hxm/yanxuan-wap/p/20161201/style/img/sprites/ucenter-sdf6a55ee56-f2c2b9c2f0.png) 0 0 no-repeat; background: url(http://yanxuan.nosdn.127.net/hxm/yanxuan-wap/p/20161201/style/img/sprites/ucenter-sdf6a55ee56-f2c2b9c2f0.png) 0 0 no-repeat;
background-size: 52.803rpx; background-size: 52.803rpx;
} }
.user-menu .icon.security{ .user-menu .icon.security {
background: url(http://yanxuan.nosdn.127.net/hxm/yanxuan-wap/p/20161201/style/img/sprites/ucenter-sdf6a55ee56-f2c2b9c2f0.png) 0 -500rpx no-repeat; background: url(http://yanxuan.nosdn.127.net/hxm/yanxuan-wap/p/20161201/style/img/sprites/ucenter-sdf6a55ee56-f2c2b9c2f0.png) 0 -500rpx no-repeat;
background-size: 52.803rpx; background-size: 52.803rpx;
} }
.user-menu .icon.kefu{ .user-menu .icon.kefu {
background: url(http://yanxuan.nosdn.127.net/hxm/yanxuan-wap/p/20161201/style/img/sprites/ucenter-sdf6a55ee56-f2c2b9c2f0.png) 0 -312.5rpx no-repeat; background: url(http://yanxuan.nosdn.127.net/hxm/yanxuan-wap/p/20161201/style/img/sprites/ucenter-sdf6a55ee56-f2c2b9c2f0.png) 0 -312.5rpx no-repeat;
background-size: 52.803rpx; background-size: 52.803rpx;
} }
.user-menu .icon.help{ .user-menu .icon.help {
background: url(http://yanxuan.nosdn.127.net/hxm/yanxuan-wap/p/20161201/style/img/sprites/ucenter-sdf6a55ee56-f2c2b9c2f0.png) 0 -250rpx no-repeat; background: url(http://yanxuan.nosdn.127.net/hxm/yanxuan-wap/p/20161201/style/img/sprites/ucenter-sdf6a55ee56-f2c2b9c2f0.png) 0 -250rpx no-repeat;
background-size: 52.803rpx; background-size: 52.803rpx;
}
.user-menu .icon.about {
/* background: url(http://yanxuan.nosdn.127.net/hxm/yanxuan-wap/p/20161201/style/img/sprites/ucenter-sdf6a55ee56-f2c2b9c2f0.png) 0 -62.4997rpx no-repeat; */
display: block;
height: 55rpx;
width: 55rpx;
background-size: 52.803rpx;
} }
.user-menu .icon.feedback{ .user-menu .icon.feedback {
background: url(http://yanxuan.nosdn.127.net/hxm/yanxuan-wap/p/20161201/style/img/sprites/ucenter-sdf6a55ee56-f2c2b9c2f0.png) 0 -125rpx no-repeat; background: url(http://yanxuan.nosdn.127.net/hxm/yanxuan-wap/p/20161201/style/img/sprites/ucenter-sdf6a55ee56-f2c2b9c2f0.png) 0 -125rpx no-repeat;
background-size: 52.803rpx; background-size: 52.803rpx;
} }
.user-menu .txt {
display: block;
height: 24rpx;
width: 100%;
font-size: 24rpx;
color: #333;
}
.user-menu .txt{ .logout {
display: block; margin-top: 50rpx;
height: 24rpx; height: 101rpx;
width: 100%; width: 100%;
font-size: 24rpx; line-height: 101rpx;
color:#333; text-align: center;
background: #fff;
color: #333;
font-size: 30rpx;
} }
.logout{ .about {
margin-top: 50rpx; width: 100%;
height: 101rpx; background: url(https://cdn.it120.cc/images/weappshop/arrow-right.png) no-repeat 750rpx center;
width: 100%; background-size: 16rpx auto, 750rpx auto;
line-height: 101rpx; margin: 20rpx 0;
text-align: center; height: 80rpx;
background: #fff; line-height: 80rpx;
color: #333; padding-left: 100rpx;
font-size: 30rpx;
} }
Supports Markdown
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