Skip to content

U
user
Commit bd6f7e59 by weijiguang
Options

优化UI

parent d677557b
Showing with 73 additions and 52 deletions
components/menuAssembly/index.vue
......@@ -366,7 +366,8 @@ export default {
.addbox{
// line-height: 26rpx;
// margin-top: 20rpx ;
.add{
.add {
margin-right: -1rpx;
width: 40rpx;
height: 40rpx;
margin-top: 1rpx;
......
menuSubPackage/pages/areaSelect/areaSelect.vue
......@@ -7,30 +7,26 @@
<text>{{areaName.disName}}</text>
</view>
<view class="icon">
<image :style="{'height':'100%','width':'100%'}" :src="'../../../static/imgs/jiantouhei.png'" />
<image :style="{'height':'100%','width':'100%'}" :src="'../../../static/imgs/jiantouhei2.png'" />
</view>
</view>
<div v-for="item in list" :key="item.id" @click="selectedShop(item)" class="shop_item">
<div v-for="item in list" :key="item.id" @click="selectedShop(item)" class="shop_item" :class="shopId==item.id?'active':''">
<div class="header">
<view class="name">{{ item.name }}</view>
<view class="adressBox">
<view class="map">
<u-icon name="map" color="#999999" size="12"></u-icon>
</view>
<view class="map"><u-icon name="map" color="#999999" size="12"></u-icon></view>
<view class="address">{{ item.address }}</view>
</view>
<view class="timeBox">
<view class="clock">
<u-icon name="clock" color="#999999" size="10"></u-icon>
</view>
<view class="clock"><u-icon name="clock" color="#999999" size="10"></u-icon></view>
<view class="time">{{ item.startTime }} - {{ item.endTime }}</view>
</view>
</div>
<view class="line"></view>
<view class="line" />
<div class="dec">
<view :style="{'height':'34rpx'}" v-show="item.distance && item.distance!=-1"></view>
<view :style="{'height':'34rpx'}" class="distance1" v-show="item.distance && item.distance!=-1"></view>
<view class="goshop">去品尝</view>
<view :style="{'height':'30rpx'}" class="distance" v-show="item.distance && item.distance!=-1">距离 {{ item.distance }}</view>
<view :style="{'height':'34rpx'}" class="distance" v-show="item.distance && item.distance!=-1">距离{{ item.distance }}</view>
</div>
</div>
</view>
......@@ -45,10 +41,14 @@ export default {
show: true,
columns: [],
list: [],
areaName:{}
areaName:{},
shopId:0
}
},
onShow() {
if(uni.getStorageSync('shopData')) {
this.shopId = uni.getStorageSync('shopData').id;
}
this.list = uni.getStorageSync('shops');
this.areaName = uni.getStorageSync('areaName')
},
......@@ -84,52 +84,58 @@ export default {
line-height: 36rpx;
}
.icon {
width: 16rpx;
width: 14rpx;
margin-left: 16rpx;
height: 24rpx;
margin-top: 2rpx;
height: 22rpx;
display: flex;
align-items: center;
}
}
.active {
border: 0.5px solid #003AE9;
}
.shop_item {
width: 90%;
width: 686rpx;
background: #FFFFFF;
border: 1px solid #003AE9;
padding: 44rpx 30rpx 44rpx 32rpx;
padding: 40rpx 30rpx 40rpx 32rpx;
box-sizing: border-box;
margin: 30rpx auto;
margin: 32rpx 30rpx 32rpx 34rpx;
display: flex;
justify-content: flex-start;
justify-content: 30rpx 30rpx flex-start;
align-items: center;
.header {
margin-right: 30rpx;
margin-right: 32rpx;
// border-right: 2rpx solid red;
.name {
font-size: 28rpx;
height: 42rpx;
line-height: 40rpx;
width: 348rpx;
width: 378rpx;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500;
font-family: PingFangSC-Medium, PingFang SC;
color: #333333;
}
.adressBox {
width: 348rpx;
width: 378rpx;
margin-top: 16rpx;
display: flex;
justify-content: flex-start;
.map {
margin-top: 4rpx;
// width: 24rpx;
// height: 30rpx;
// background-color: #000000;
margin-top: 6rpx;
}
.address {
margin-left: 12rpx;
// background-color: #000000;
margin-left: 10rpx;
font-size: 24rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #999999;
margin-top: -5rpx;
line-height: 36rpx;
}
}
.timeBox {
......@@ -138,37 +144,40 @@ export default {
align-items: center;
justify-content: flex-start;
.clock {
// width: 24rpx;
// height: 27rpx;
// background-color: #000000;
margin-top: -6rpx;
}
.time {
margin-left: 12rpx;
padding-left: 4rpx;
// background-color: #000000;
margin-left: 10rpx;
height: 34rpx;
font-size: 24rpx;
font-family: ArialMT;
color: #999999;
margin-top: -2rpx;
line-height: 28rpx;
}
}
}
.line {
height: 146rpx;
width: 2rpx;
border: 0.1px solid #F4F4F4;
height: 172rpx;
width: 1px;
border-right: 1px solid #F4F4F4;
}
.dec {
margin-left: 43rpx;
margin-left: 44rpx;
display: flex;
flex-direction: column;
height: 146rpx;
justify-content: space-around;
border-radius: 2px;
view{
// height: 146rpx;
view {
vertical-align: baseline;
}
.goshop {
width: 167rpx;
height: 64rpx;
background: #0050F6;
border-radius: 2rpx;
font-size: 24rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
......@@ -177,13 +186,19 @@ export default {
line-height: 64rpx;
}
.distance1,
.distance {
padding-top: 16rpx;
font-size: 24rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #999999;
text-align: center;
line-height: 56rpx;
line-height: 34rpx;
}
.distance1 {
padding-top: 0rpx;
padding-bottom: 16rpx;
}
}
......
menuSubPackage/pages/goodsDetail/goodsDetail.vue
......@@ -52,7 +52,7 @@
<view class="good-select-price">
<div class="price">
<view class="good-select-price-normal"><text class="moneyLog">￥</text>{{ Utils.isInteger(priceTotal.discount) }}</view>
<view class="good-select-price-small" v-show="priceTotal.price!=priceTotal.discount">￥{{ Utils.isInteger(priceTotal.price) }}</view>
<view class="good-select-price-small" v-show="priceTotal.price!=priceTotal.discount">￥<text class="num">{{ Utils.isInteger(priceTotal.price) }}</text></view>
</div>
<div v-if="!size > 0" style="color: orangered">已售罄</div>
<div v-else class="set_size">
......@@ -583,15 +583,18 @@ button[disabled]:not([type]) {
line-height: 38rpx;
.moneyLog {
font-size: 32rpx;
font-weight: 900;
}
}
.good-select-price-small {
font-size: 20rpx;
text-decoration: line-through;
font-family: ArialMT;
line-height: 32rpx;
color: #999999;
.num {
text-decoration: line-through;
}
}
}
}
......
orderSubPackage/pages/orderInfo/index.vue
......@@ -7,8 +7,9 @@
<div class="order_status" :style="{'margin-top':(statusBarHeight+navigationBarHeight+getPx(32))+'px'}">
<view class="status_text">订单状态：{{ orderStatusText }}</view>
<view class="tips">
<view v-if="orderInfo.state == 7">为保持口感，请尽快引用哦~</view>
<view v-if="orderInfo.state == 7">为保持口感，请尽快饮用哦~</view>
<view v-if="orderInfo.state == 4">订单已制作完成，请尽快取餐~</view>
<view v-if="orderInfo.state == 8 || orderInfo.state == 9 || orderInfo.state == 10 || orderInfo.state == 11">非常抱歉，有疑问请点击下方联系客服～</view>
<view v-if="orderInfo.state == 2 || orderInfo.state == 3">请您耐心等候，预计<text class="time">{{waitTime}}</text>分钟后可取</view>
</view>
<div class="btns">
......@@ -103,7 +104,7 @@
<u-icon name="server-fill" color="#000000" size="16"></u-icon>
<span :style="{'margin-left':'16rpx'}">联系客服</span>
</view>
<view >
<view>
<image class="icno-arrow" :src="'../../../static/imgs/jiantouhei.png'" />
</view>
</button>
......@@ -760,7 +761,8 @@ export default {
color: #333333;
}
}
.icno-arrow{
.icno-arrow {
margin-top: 2rpx;
width: 15.27rpx;
height: 21.68rpx;
}
......
pages/menu/menu.vue
......@@ -25,7 +25,7 @@
<view>
<image class="arrow-right-select" v-if="userms" :src="'../../static/imgs/jiantouhei.png'" />
<button class="login-btn" v-if="!userms" open-type="getPhoneNumber"
@getphonenumber="getPhoneNumber">立刻登录
@getphonenumber="getPhoneNumber">立即登录
</button>
</view>
</view>
......@@ -364,12 +364,12 @@ export default {
display: flex;
width: 686rpx;
height: 104rpx;
padding:16rpx 32rpx 16rpx 34rpx;
padding: 16rpx 32rpx 16rpx 32rpx;
background: #ffffff;
position: absolute;
z-index: 1;
bottom: -2rpx;
left: 32rpx;
left: 33rpx;
box-sizing: border-box;
box-shadow: 0px 2px 8px 0px rgba(102, 102, 102, 0.1);
backdrop-filter: blur(0px);
......@@ -423,6 +423,7 @@ export default {
.login-btn {
// width: 114rpx;
margin-right: -5rpx;
width: 167rpx;
height: 64rpx;
background: #0050F6;
......@@ -434,7 +435,6 @@ export default {
color: #FFFFFF;
line-height: 64rpx;
}
}
}
......
pages/mine/mine.vue
......@@ -22,12 +22,12 @@
</view>
<view>
<button class="login-btn" v-if="!userms" open-type="getPhoneNumber"
@getphonenumber="getPhoneNumber">立刻登录
@getphonenumber="getPhoneNumber">立即登录
</button>
</view>
</view>
</view>
<!-- <button class="mod11 flex-col" v-else open-type="getPhoneNumber" @getphonenumber="getPhoneNumber">立刻登录</button> -->
<!-- <button class="mod11 flex-col" v-else open-type="getPhoneNumber" @getphonenumber="getPhoneNumber">立即登录</button> -->
<view class="contents" v-if="userms">
<view class="myOrder" @click="goToPage('order')">
<view class="text">我的订单</view>
......
pages/order/order.vue
......@@ -58,7 +58,7 @@
<view class="total">
共{{ orderDetailsSize(item.orderDetails) }}件商品 实付<text class="price">￥{{ Utils.isInteger(item.amount) }}</text>
</view>
<a class="btn" @click.stop="PayNow(item)" v-if="item.state == 1" type="primary">立刻支付</a>
<a class="btn" @click.stop="PayNow(item)" v-if="item.state == 1" type="primary">立即支付</a>
<a class="btn" v-else @click.stop="oneMoreOrder(item)" type="primary">再来一单</a>
</view>
</view>
......
request/order/index.js
......@@ -53,7 +53,7 @@ export default {
console.log('服务器错误');
});
},
// 立刻支付
// 立即支付
payOrder(params) {
return uni.$u.http
.get('order/payOrder', {
......
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