@@ -208,7 +208,7 @@ | |||
this.globalData.userLocation.longitude = res.longitude; | |||
resolve(true); | |||
}, | |||
fail: () => { | |||
fail: (error) => { | |||
this.globalData.userLocation.latitude = null; | |||
this.globalData.userLocation.longitude = null; | |||
resolve(false); | |||
@@ -261,13 +261,15 @@ | |||
const deskCode = this.getDeskCode(url, 'number'); | |||
const activityId = this.getDeskCode(url, 'activityId'); | |||
const storeId = this.getDeskCode(url, 'storeId'); | |||
if (activityId != null) { | |||
const reserve = this.getDeskCode(url, 'reserve'); | |||
if (activityId) { | |||
uni.redirectTo({ | |||
url: `/pages/specialOffer/specialOffer?storeId=${activityId}` | |||
}); | |||
return; | |||
} | |||
if (deskCode != null && storeId != null) { | |||
if (deskCode && storeId) { | |||
const codeScanInfo = { | |||
storeId, | |||
deskCode | |||
@@ -276,6 +278,18 @@ | |||
uni.switchTab({ | |||
url: '/pages/food/food' | |||
}); | |||
return; | |||
} | |||
if (reserve && storeId) { | |||
const codeScanInfo = { | |||
storeId, | |||
deskCode: 0 | |||
} | |||
store.commit('onInitScanInfo', codeScanInfo); | |||
uni.redirectTo({ | |||
url: '/pages/foodReservation/foodReservation' | |||
}); | |||
return; | |||
} | |||
}, | |||
//根据门店ID获取店铺素材 | |||
@@ -9,6 +9,26 @@ export default { | |||
interfaceType: 0 | |||
}); | |||
}, | |||
//根据店铺ID获取预定菜品列表 | |||
GetReservationGoodsList(storeId) { | |||
return request({ | |||
url: `/api/StoreHelper/GetReservationGoodsList?storeId=${storeId}`, | |||
method: 'GET', | |||
interfaceType: 0 | |||
}); | |||
}, | |||
//添加预定商品 | |||
AddReservationGoods(reservaList, memberInfoId) { | |||
return request({ | |||
url: `/api/StoreHelper/AddReservationGoods`, | |||
method: 'POST', | |||
data: reservaList, | |||
header: { | |||
memberInfoId | |||
}, | |||
interfaceType: 0 | |||
}); | |||
}, | |||
//获取店铺列表 | |||
getStoreList() { | |||
return request({ | |||
@@ -130,6 +130,19 @@ | |||
</view> | |||
</view> | |||
</view> | |||
<view class="reserve-btn-list" v-if="isReserve"> | |||
<checkbox-group @change="onThreeMealChange"> | |||
<label class="reserve-btn-item"> | |||
<checkbox value="1" :disabled="!currentGoods.mealType.includes(1)" /> 早餐 | |||
</label> | |||
<label class="reserve-btn-item"> | |||
<checkbox value="2" :disabled="!currentGoods.mealType.includes(2)"/> 中餐 | |||
</label> | |||
<label class="reserve-btn-item"> | |||
<checkbox value="3" :disabled="!currentGoods.mealType.includes(3)"/> 晚餐 | |||
</label> | |||
</checkbox-group> | |||
</view> | |||
<view class="choose-success-btn" @click="onSure"> | |||
加入购物车 | |||
</view> | |||
@@ -186,6 +199,12 @@ | |||
type: Boolean, | |||
default: false, | |||
required: false | |||
}, | |||
//是否预定 | |||
isReserve: { | |||
type: Boolean, | |||
default: false, | |||
required: false | |||
} | |||
}, | |||
data() { | |||
@@ -202,7 +221,7 @@ | |||
let price = 0; | |||
let food = this.currentGoods; | |||
price += food.vipPrice; | |||
food.addtoFoodList.forEach(item => { | |||
food.addtoFoodList?.forEach(item => { | |||
item.foods.forEach(addFood => { | |||
if (addFood.count > 0) { | |||
price += (addFood.count * addFood.price); | |||
@@ -216,7 +235,7 @@ | |||
let price = 0; | |||
let food = this.currentGoods; | |||
price += food.price; | |||
food.addtoFoodList.forEach(item => { | |||
food.addtoFoodList?.forEach(item => { | |||
item.foods.forEach(addFood => { | |||
if (addFood.count > 0) { | |||
price += (addFood.count * addFood.price); | |||
@@ -229,6 +248,10 @@ | |||
currentGoods() { | |||
return store.state.currentGoods; | |||
}, | |||
//购物车 | |||
shoppingCart() { | |||
return store.state.shoppingCart; | |||
}, | |||
specificationTotalPrice() { | |||
let price = 0; | |||
if (this.currentChoose.specification) { | |||
@@ -244,6 +267,13 @@ | |||
} | |||
}, | |||
methods: { | |||
onThreeMealChange(value) { | |||
let array = JSON.parse(JSON.stringify(value.target.value)); | |||
array = array.sort((a,b) => (a - b)); | |||
const tempGoods = JSON.parse(JSON.stringify(this.currentGoods)); | |||
tempGoods.threeMeal = array.join(); | |||
store.commit('initCurrentGoods', tempGoods); | |||
}, | |||
onFeedPopuoClose() { | |||
this.$emit('onFeedPopuoClose'); | |||
}, | |||
@@ -276,6 +306,70 @@ | |||
}, | |||
//从配料列表添加主食 | |||
onSure() { | |||
if (this.isReserve) { | |||
const result = this.currentGoods.threeMeal && '1,2,3,1,3'.includes(this.currentGoods.threeMeal); | |||
if (!result) { | |||
uni.showToast({ | |||
title: "请选择用餐时间!", | |||
duration: 2000, | |||
icon: 'none', | |||
mask: true | |||
}); | |||
return; | |||
} else { | |||
const tempGoods = JSON.parse(JSON.stringify(this.currentGoods)); | |||
tempGoods.sencondId = tempGoods.sencondId.concat(tempGoods.threeMeal); | |||
store.commit('initCurrentGoods', tempGoods); | |||
//首先看自身有没有超过每餐可预订数量 | |||
const mealList = Array.from(tempGoods.threeMeal); | |||
for(let i = 1; i <= 3 ;i ++) { | |||
const filterCount = mealList.filter(item => item === `${i}`); | |||
if (filterCount > tempGoods.qyt) { | |||
uni.showToast({ | |||
title: `该商品每餐最多预定${tempGoods.qty}份`, | |||
duration: 2000, | |||
icon: 'none', | |||
mask: true | |||
}); | |||
return; | |||
} | |||
} | |||
//再看购物车有没有超过每餐可预订数量 | |||
const jsonData = []; | |||
this.shoppingCart.forEach(item => { | |||
for(let i = 0; i < item.count; i++) { | |||
Array.from(item.threeMeal).forEach(threeItem => { | |||
if ('123'.includes(threeItem)) { | |||
jsonData.push({ | |||
"goodsId": item.id, | |||
"qty": 1, | |||
"mealType": threeItem | |||
}); | |||
} | |||
}); | |||
} | |||
}); | |||
let isMore = false; | |||
mealList.forEach(item => { | |||
if ("123".includes(item)) { | |||
const cardFoodCount = jsonData.filter(jsonItem => (jsonItem.goodsId === tempGoods.id && jsonItem.mealType === item)) || []; | |||
if (cardFoodCount.length + 1 > tempGoods.qty) { | |||
uni.showToast({ | |||
title: `该商品每餐最多预定${tempGoods.qty}份`, | |||
duration: 2000, | |||
icon: 'none', | |||
mask: true | |||
}); | |||
isMore = true; | |||
return; | |||
} | |||
} | |||
}); | |||
if (isMore) { | |||
return; | |||
} | |||
} | |||
} | |||
if (this.isSpecialOffer) { | |||
store.commit('onStapleFoodPlusFromList'); | |||
getApp().onCheckUserSession('specialOffer').then(() => { | |||
@@ -668,4 +762,15 @@ | |||
.more-one-icon { | |||
color: #666; | |||
} | |||
.reserve-btn-list { | |||
height: 100rpx; | |||
display: flex; | |||
align-items: center; | |||
justify-content: center; | |||
} | |||
.reserve-btn-item { | |||
margin-right: 30rpx; | |||
} | |||
</style> |
@@ -29,9 +29,11 @@ | |||
<view class="food-card-info"> | |||
<view class="food-card-name"> | |||
{{food.name}} | |||
</view> | |||
<view class="food-card-no-vip"> | |||
非会员{{food.price}}起 | |||
<text class="food-card-reserve-count" v-if="isReserve">可预订({{food.qty}})份</text> | |||
</view> | |||
<view class="food-card-price"> | |||
<view class="card-price-left"> | |||
@@ -49,7 +51,7 @@ | |||
</view> | |||
<icon class="iconfont icon-zengjia" @click="onChooseFood(food)"></icon> | |||
</view> | |||
<view class="card-price-right special-offer-btn" v-else @click="onChooseSpecial(food)"> | |||
<view class="card-price-right special-offer-btn" v-if="isSpecialOffer" @click="onChooseSpecial(food)"> | |||
<icon class="iconfont icon-wancheng"></icon> | |||
选购 | |||
</view> | |||
@@ -64,9 +66,10 @@ | |||
@onFeedPopuoClose="onFeedPopuoClose" | |||
class="feed-list-popup" | |||
:isSpecialOffer="isSpecialOffer" | |||
:isReserve="isReserve" | |||
> | |||
</FeedListPopup> | |||
<SettlementPopup ref="settlementRef" v-if="!isSpecialOffer"></SettlementPopup> | |||
<SettlementPopup :isReserve="isReserve" ref="settlementRef" v-if="!isSpecialOffer"></SettlementPopup> | |||
</view> | |||
</template> | |||
@@ -96,6 +99,12 @@ | |||
type: Array, | |||
default: [], | |||
require: true | |||
}, | |||
//是否预定 | |||
isReserve: { | |||
type: Boolean, | |||
default: false, | |||
required: false | |||
} | |||
}, | |||
data() { | |||
@@ -156,7 +165,7 @@ | |||
this.foodRightIntoView = 'foodRightIntoView'.concat(index); | |||
}, | |||
// 点击加号选择商品 | |||
onChooseFood(food) { | |||
onChooseFood(food, type) { | |||
food.count = 0; | |||
food.sencondId = food.id; | |||
if (food.addtoFoodList && food.addtoFoodList.length > 0) { | |||
@@ -218,7 +227,16 @@ | |||
return name.includes(this.searchText); | |||
}, | |||
onReduceFood(food) { | |||
if (food.addtoFoodList.length > 0) { | |||
if (this.isReserve) { | |||
uni.showToast({ | |||
title: `请在购物车中删除该商品!`, | |||
duration: 2000, | |||
icon: 'none', | |||
mask: true | |||
}); | |||
return; | |||
} | |||
if (food.addtoFoodList && food.addtoFoodList.length > 0) { | |||
this.$refs.settlementRef.isShowShopCart = true; | |||
} else { | |||
store.commit('onStapleFoodReduce', food); | |||
@@ -460,4 +478,9 @@ | |||
.advertisement-card image { | |||
border-radius: 10rpx; | |||
} | |||
.food-card-reserve-count { | |||
margin-left: 10rpx; | |||
color: #F84352; | |||
} | |||
</style> |
@@ -20,7 +20,9 @@ | |||
¥{{shopCartTotalPrice.toFixed(2)}} | |||
</view> | |||
<view class="settlement-btn" @click.stop="onJumpConfirm"> | |||
去结算 | |||
{{ | |||
isReserve ? '去预定' : '去结算' | |||
}} | |||
</view> | |||
</view> | |||
</view> | |||
@@ -46,7 +48,8 @@ | |||
<view class="cart-goods-info"> | |||
<view class="cart-goods-name text-overflow-one"> | |||
{{food.name}} | |||
<text class="cart-goods-company">{{food.company ? food.company : '份'}}</text> | |||
<text class="cart-goods-company">({{food.company ? food.company : '份'}})</text> | |||
<text class="three-meal-text">{{onFormartThreeMeal(food.threeMeal)}}</text> | |||
</view> | |||
<view class="cart-goods-feed text-overflow-one"> | |||
<view v-for="feed in food.addtoFoodList" :key="feed.id" class="cart-goods-feed-item"> | |||
@@ -89,8 +92,17 @@ | |||
import { debounce } from "@/utils/DebounceAndThrottle.js"; | |||
import store from '@/store/index.js'; | |||
import memberAPI from "@/api/member"; | |||
import goodsAPI from "@/api/goods"; | |||
export default { | |||
name:"SettlementPopup", | |||
props: { | |||
//是否预定 | |||
isReserve: { | |||
type: Boolean, | |||
default: false, | |||
required: false | |||
} | |||
}, | |||
data() { | |||
return { | |||
imageServer: getApp().globalData.imageServer, | |||
@@ -121,6 +133,21 @@ | |||
} | |||
}, | |||
methods: { | |||
//格式化早中晚餐 | |||
onFormartThreeMeal(meals) { | |||
if (!this.isReserve) return ''; | |||
let result = ''; | |||
if (meals.includes(1)) { | |||
result = result.concat(',早餐'); | |||
} | |||
if (meals.includes(2)) { | |||
result = result.concat(',中餐'); | |||
} | |||
if (meals.includes(3)) { | |||
result = result.concat(',晚餐'); | |||
} | |||
return result; | |||
}, | |||
//关闭购物车弹窗 | |||
onCloseShopCart() { | |||
this.isShowShopCart = false; | |||
@@ -131,11 +158,15 @@ | |||
}, | |||
//跳转确认订单页面 | |||
onJumpConfirm: debounce(function() { | |||
getApp().onCheckUserSession('food').then(() => { | |||
uni.navigateTo({ | |||
url: '/pages/confirmOrder/confirmOrder' | |||
if (this.isReserve) { | |||
this.onReserveFood(); | |||
} else { | |||
getApp().onCheckUserSession('food').then(() => { | |||
uni.navigateTo({ | |||
url: '/pages/confirmOrder/confirmOrder' | |||
}); | |||
}); | |||
}); | |||
} | |||
}, 2000, true), | |||
//清空购物车 | |||
onClearShopCart() { | |||
@@ -155,6 +186,56 @@ | |||
}, | |||
//主食数量加1 | |||
onStapleFoodPlusFromCart(food) { | |||
if (this.isReserve) { | |||
//首先看自身有没有超过每餐可预订数量 | |||
const mealList = Array.from(food.threeMeal); | |||
for(let i = 1; i <= 3 ;i ++) { | |||
const filterCount = mealList.filter(item => item === `${i}`); | |||
if (filterCount > food.qyt) { | |||
uni.showToast({ | |||
title: `该商品每餐最多预定${food.qty}份`, | |||
duration: 2000, | |||
icon: 'none', | |||
mask: true | |||
}); | |||
return; | |||
} | |||
} | |||
//再看购物车有没有超过每餐可预订数量 | |||
const jsonData = []; | |||
this.shoppingCart.forEach(item => { | |||
for(let i = 0; i < item.count; i++) { | |||
Array.from(item.threeMeal).forEach(threeItem => { | |||
if ('123'.includes(threeItem)) { | |||
jsonData.push({ | |||
"goodsId": item.id, | |||
"qty": 1, | |||
"mealType": threeItem | |||
}); | |||
} | |||
}); | |||
} | |||
}); | |||
let isMore = false; | |||
mealList.forEach(item => { | |||
if ("123".includes(item)) { | |||
const cardFoodCount = jsonData.filter(jsonItem => (jsonItem.goodsId === food.id && jsonItem.mealType === item)) || []; | |||
if (cardFoodCount.length + 1 > food.qty) { | |||
uni.showToast({ | |||
title: `该商品每餐最多预定${food.qty}份`, | |||
duration: 2000, | |||
icon: 'none', | |||
mask: true | |||
}); | |||
isMore = true; | |||
return; | |||
} | |||
} | |||
}); | |||
if (isMore) { | |||
return; | |||
} | |||
} | |||
store.commit('onStapleFoodPlusFromCart', food); | |||
}, | |||
async onCheckUserInfo() { | |||
@@ -163,9 +244,23 @@ | |||
this.isLogin = true; | |||
} | |||
const response = await memberAPI.selectMemberByOpenId(userStorage.openId); | |||
if (response.isSuccess && response.data?.memberInfo_Id) { | |||
if (response.isSuccess && response.data?.memberInfo_Id && response.data.phone) { | |||
this.isMember = true; | |||
store.commit('onChangeUserIsVip', true); | |||
} else { | |||
if (this.isReserve) { | |||
uni.showToast({ | |||
title: "请注册会员后再进行预约!", | |||
duration: 2000, | |||
icon: 'none', | |||
mask: true, | |||
complete: () => { | |||
uni.redirectTo({ | |||
url: '/pages/memberRegister/memberRegister' | |||
}); | |||
} | |||
}); | |||
} | |||
} | |||
}, | |||
onJumpRegister() { | |||
@@ -180,13 +275,59 @@ | |||
url: '/pages/login/login?fromUrl=food' | |||
}); | |||
} | |||
}, | |||
/** | |||
* 预定菜品 | |||
*/ | |||
async onReserveFood() { | |||
const jsonData = []; | |||
const result = []; | |||
this.shoppingCart.forEach(item => { | |||
for(let i = 0; i < item.count; i++) { | |||
Array.from(item.threeMeal).forEach(threeItem => { | |||
if ('123'.includes(threeItem)) { | |||
jsonData.push({ | |||
"goodsId": item.id, | |||
"qty": 1, | |||
"mealType": threeItem | |||
}); | |||
} | |||
}); | |||
} | |||
}); | |||
jsonData.forEach(item => { | |||
const find = result.find(resItem => (resItem.goodsId === item.goodsId && resItem.mealType === item.mealType)); | |||
if (find) { | |||
find.qty += 1; | |||
} else { | |||
result.push(item); | |||
} | |||
}); | |||
const storage = getApp().onGetUserStorage(); | |||
const response = await goodsAPI.AddReservationGoods(result, storage.memberInfo_Id || ''); | |||
if (response.isSuccess) { | |||
uni.showToast({ | |||
title: "预定成功!", | |||
duration: 2000, | |||
icon: 'none', | |||
mask: true | |||
}); | |||
store.commit('onClearShopCart'); | |||
} else { | |||
uni.showToast({ | |||
title: response.msg || '预定失败!', | |||
duration: 2000, | |||
icon: 'none', | |||
mask: true | |||
}); | |||
} | |||
} | |||
} | |||
} | |||
</script> | |||
<style scoped lang="scss"> | |||
/* 结算 */ | |||
/* 结算 */ | |||
.settlement-box { | |||
position: relative; | |||
width: 700rpx; | |||
@@ -406,4 +547,8 @@ | |||
.hidden-blank-data { | |||
visibility: hidden; | |||
} | |||
.three-meal-text { | |||
color: #F84352; | |||
} | |||
</style> |
@@ -86,7 +86,7 @@ | |||
}, | |||
async onSearchUserLocation() { | |||
let response = await getApp().onGetUserLocation(); | |||
if (response) { | |||
if (true) { | |||
this.isShowLoactionAuth = false; | |||
this.onFetchStoreList(); | |||
} else { | |||
@@ -126,7 +126,7 @@ | |||
}, | |||
//根据店铺ID获取商品列表 | |||
async getGoodsList() { | |||
if (this.currentStore.id == this.lastCurrentStore.id) return; | |||
// if (this.currentStore.id == this.lastCurrentStore.id) return; | |||
let response = await goodsApi.getStoreGoodsByStoreId(this.currentStore.id); | |||
if (response.isSuccess == true) { | |||
this.isSuccessGoodsList = true; | |||
@@ -7,58 +7,16 @@ | |||
</view> | |||
<icon class="iconfont icon-you"></icon> | |||
</view> | |||
<view class="food-list-box"> | |||
<scroll-view class="food-left-scroll" scroll-y="true" :scroll-into-view="foodLeftIntoView" scroll-with-animation> | |||
<view :class="{'food-left-item': true, 'food-left-active': index == foodLeftIndex}" v-for="(item, index) in foodArray" :key="index" :id="'foodLeftIntoView'.concat(index)" @click="setLeftView(index)"> | |||
<view class="food-left-cover"> | |||
<image @error="onImageErrorType(item)" :lazy-load="true" class="image-common-cover" :src="imageServer.concat('785ffa97-f2ee-4e08-ae39-86b90b45d33c.png')" ></image> | |||
</view> | |||
<view class="food-left-name"> | |||
{{item.name}} | |||
</view> | |||
</view> | |||
</scroll-view> | |||
<scroll-view class="food-right-scroll" scroll-y="true" :scroll-into-view="foodRightIntoView" @scroll="onScroll" @scrolltoupper="onScrollTop" @scrolltolower="onScrollBottom" scroll-with-animation> | |||
<view class="food-right-item" v-for="(item, index) in foodArray" :key="item.id" :id="'foodRightIntoView'.concat(index)"> | |||
<view class="foodt-right-title"> | |||
{{item.name}} | |||
</view> | |||
<view class="food-card" v-for="(food, fIndex) in item.foods" :key="food.id"> | |||
<view class="food-card-cover" > | |||
<image @error="onImageError(food)" @click="onPreviewImage(food.cover)" :lazy-load="true" :src="food.cover" class="image-common-cover"></image> | |||
<view class="food-sell-out" v-show="food.state === 0"> | |||
已售罄 | |||
</view> | |||
</view> | |||
<view class="food-card-info"> | |||
<view class="food-card-name"> | |||
{{food.name}} | |||
</view> | |||
<view class="food-card-no-vip"> | |||
非会员{{food.price}}起 | |||
</view> | |||
<view class="food-card-price"> | |||
<view class="card-price-left"> | |||
<view class="food-vip-icon"> | |||
<image :lazy-load="true" class="image-common-cover" :src="imageServer.concat('ca8ae689-92cf-427a-b34f-b64b81368ae8.png')"></image> | |||
</view> | |||
<view class="minimum-price green-color"> | |||
¥{{food.vipPrice}}起 | |||
</view> | |||
</view> | |||
<view class="card-price-right" > | |||
<icon @click="onReduceFood(food)" class="iconfont icon-jianshaojianqujianhao" :class="{'hidden-blank-data': food.shopCartNumber < 1}"></icon> | |||
<view class="food-card-count" :class="{'hidden-blank-data': food.shopCartNumber < 1}"> | |||
{{food.shopCartNumber}} | |||
</view> | |||
<icon class="iconfont icon-zengjia" @click="onChooseFood(food)"></icon> | |||
</view> | |||
</view> | |||
</view> | |||
</view> | |||
</view> | |||
</scroll-view> | |||
<GoodsList :isReserve="true" ref="goodsListRef" class="goods-list-box" :adverList="adverList" v-if="foodArray.length > 0"></GoodsList> | |||
<view class="food-list-box food-list-box-empty" v-else> | |||
<view class="food-empty-image"> | |||
<image :src="imageServer.concat('5d404162-0cae-41df-9a91-51eda578d60b.png')" class="image-common-cover"></image> | |||
</view> | |||
<view class="food-list-box-empty-btn" @click="onReacquireData" v-if="!isSuccessGoodsList"> | |||
重新获取商品数据 | |||
</view> | |||
</view> | |||
<LocationAuth v-if="isShowLoactionAuth" @onSuccessLocationAuth="onSuccessLocationAuth"></LocationAuth> | |||
<uni-popup ref="popup" type="bottom"> | |||
<view class="store-list"> | |||
<view :class="{'store-list-item': true, 'selected-store': store.id === currentStore.id}" v-for="(store,index) in storeList" :key="index" @click="onChooseStore(store)"> | |||
@@ -79,36 +37,59 @@ | |||
</view> | |||
</view> | |||
</uni-popup> | |||
<button v-if="chooseGoodsCount > 0" class="reservation-btn" @click="onReservation">去预定</button> | |||
</view> | |||
</template> | |||
<script> | |||
import { mapState } from 'vuex'; | |||
import goodsApi from "@/api/goods.js"; | |||
import store from '@/store/index.js'; | |||
import { debounce } from "@/utils/DebounceAndThrottle.js"; | |||
export default { | |||
onLoad(options) { | |||
if (options.shareFoodId && options.shareStoreId) { | |||
this.friendShare = options; | |||
} | |||
}, | |||
onShow() { | |||
this.onFetchStoreList(); | |||
store.commit('onClearShopCart'); | |||
if (store.state.isSpecialOffer) { | |||
store.commit('onChangeIsSpecialOffer', false); | |||
store.commit('onClearShopCart'); | |||
} | |||
if (!this.isScanShow) { | |||
this.onGetUserLocation(); | |||
} | |||
}, | |||
onHide() { | |||
if(this.$refs.goodsListRef) { | |||
this.$refs.goodsListRef.onHideShopCart(); | |||
} | |||
}, | |||
onUnload() { | |||
store.commit('onClearShopCart'); | |||
}, | |||
computed: { | |||
...mapState([ | |||
'foodArray', 'currentStore', 'lastCurrentStore', 'codeScanInfo', 'currentGoods', 'storeStyles' | |||
]) | |||
}, | |||
data() { | |||
return { | |||
imageServer: getApp().globalData.imageServer, | |||
foodLeftIndex: 0, //左侧滚动面板当前下标 | |||
foodRightNodeTop: [], //右侧节点距顶部高度 | |||
foodLeftIntoView: '', //左侧滚动面板当前锚点 | |||
foodRightIntoView: '', //右侧滚动面板当前锚点 | |||
storeList: [], //店铺列表 | |||
foodArray: [], //商品数据 | |||
currentStore: {}, //当前门店 | |||
chooseGoodsCount: 0 //已选商品数量 | |||
userToStoreDistance: 0, | |||
isSuccessGoodsList: true, | |||
isScanShow: false, | |||
isInnerDistance: false, | |||
isShowLoactionAuth: false, | |||
friendShare: {}, | |||
adverList: [] | |||
}; | |||
}, | |||
methods: { | |||
/** | |||
* 获取门店列表 | |||
*/ | |||
async onFetchStoreList() { | |||
let storeId = this.codeScanInfo.storeId; | |||
let response = await goodsApi.getStoreList(); | |||
this.storeList = []; | |||
if (response.isSuccess == true) { | |||
@@ -122,11 +103,15 @@ | |||
storeList.forEach(item => { | |||
if (item.toUserDistance <= 9999) { | |||
this.storeList.push(item); | |||
this.isInnerDistance = true; | |||
} | |||
}); | |||
this.currentStore = storeList[0]; | |||
getApp().globalData.companyId = storeList[0].companyId; | |||
this.getGoodsList(storeList[0].id); | |||
if (storeId != '') { | |||
store.commit('onInitChooseStore', this.storeList.find(x => x.id === storeId)); | |||
} else { | |||
store.commit('onInitChooseStore', this.storeList[0]); | |||
} | |||
getApp().globalData.companyId = this.currentStore.companyId; | |||
} else { | |||
uni.showToast({ | |||
title: response.msg, | |||
@@ -137,8 +122,8 @@ | |||
} | |||
}, | |||
//根据店铺ID获取商品列表 | |||
async getGoodsList(storeId) { | |||
let response = await goodsApi.getStoreGoodsByStoreId(storeId); | |||
async getGoodsList() { | |||
let response = await goodsApi.GetReservationGoodsList(this.currentStore.id); | |||
if (response.isSuccess == true) { | |||
this.isSuccessGoodsList = true; | |||
} else { | |||
@@ -154,126 +139,104 @@ | |||
food.shopCartNumber = 0; | |||
}); | |||
}); | |||
this.foodArray = foodTypes; | |||
store.commit('initFoodArray', foodTypes); | |||
setTimeout(() => { | |||
this.getNodeInfo(); | |||
this.$refs.goodsListRef.getNodeInfo(); | |||
}, 100); | |||
} else { | |||
store.commit('initFoodArray', []); | |||
} | |||
}, | |||
// 监听滚动到顶部 | |||
onScrollTop() { | |||
this.foodLeftIntoView = 'foodLeftIntoView'.concat(0); | |||
this.foodLeftIndex = 0; | |||
}, | |||
onScrollBottom() { | |||
this.foodLeftIntoView = 'foodLeftIntoView'.concat(this.foodRightNodeTop.length - 1); | |||
this.foodLeftIndex = this.foodRightNodeTop.length - 1; | |||
onStoreList() { | |||
this.$refs.popup.open('right'); | |||
}, | |||
// 监听滚动 | |||
onScroll(e) { | |||
let scrollTop = e.detail.scrollTop; | |||
for(let i = 0; i < this.foodRightNodeTop.length; i++) { | |||
let h1 = this.foodRightNodeTop[i]; | |||
let h2 = this.foodRightNodeTop[i + 1]; | |||
if (scrollTop > h1 && scrollTop < h2) { | |||
this.foodLeftIndex = i + 1; | |||
this.foodLeftIntoView = 'foodLeftIntoView'.concat(i + 1); | |||
} | |||
async onGetUserLocation() { | |||
// this.isShowLoactionAuth = false; | |||
// this.onQueryStoreAndGoods(); | |||
const response = await getApp().onGetUserLocation(); | |||
if (response) { | |||
this.isShowLoactionAuth = false; | |||
this.onQueryStoreAndGoods(); | |||
} else { | |||
this.isShowLoactionAuth = true; | |||
} | |||
this.foodRightIntoView = 'foodRightIntoView'; | |||
}, | |||
//获取节点信息 | |||
getNodeInfo() { | |||
this.onResetFoodInfo(); | |||
const query = uni.createSelectorQuery().in(this); | |||
query.selectAll('.food-right-item').boundingClientRect(data => { | |||
data.forEach(item => { | |||
this.foodRightNodeTop.push(item.top); | |||
}); | |||
}).exec(); | |||
}, | |||
//点击左侧滚动面板 | |||
setLeftView(index) { | |||
this.foodLeftIndex = index; | |||
this.foodRightIntoView = 'foodRightIntoView'.concat(index); | |||
}, | |||
// 点击加号选择商品 | |||
onChooseFood(food) { | |||
food.shopCartNumber += 1; | |||
this.chooseGoodsCount += 1; | |||
food.count = 0; | |||
food.sencondId = food.id; | |||
if (food.addtoFoodList && food.addtoFoodList.length > 0) { | |||
food.addtoFoodList.forEach(item => { | |||
item.foods.forEach(additional => { | |||
additional.count = 0; | |||
additional.sourceCount = 0; | |||
}); | |||
onQueryStoreAndGoods() { | |||
if (this.storeList.length === 0) { | |||
this.onFetchStoreList().then( () => { | |||
if (this.isInnerDistance) { | |||
this.getGoodsList().then(() => { | |||
store.commit('onInitLastStore', store.state.currentStore); | |||
if (this.$refs.goodsListRef) { | |||
this.$refs.goodsListRef.onCheckUserInfo(); | |||
this.onHandleFriendShare(); | |||
} | |||
}); | |||
} | |||
}); | |||
} | |||
if (food.setMealList && food.setMealList.length > 0) { | |||
food.setMealList.forEach(item => { | |||
item.foods.forEach(additional => { | |||
additional.count = 0; | |||
additional.sourceCount = 0; | |||
if (additional.specification && additional.specification.length > 0) { | |||
additional.specification.forEach(specifiType => { | |||
specifiType.foods.forEach((specifiItem, specifiIndex) =>{ | |||
if (specifiIndex === 0) { | |||
specifiItem.isSelect = true; | |||
} else { | |||
specifiItem.isSelect = false; | |||
} | |||
}); | |||
}); | |||
} else { | |||
if (this.isInnerDistance) { | |||
this.getGoodsList().then(() => { | |||
store.commit('onInitLastStore', store.state.currentStore); | |||
if (this.$refs.goodsListRef) { | |||
this.$refs.goodsListRef.onCheckUserInfo(); | |||
} | |||
}); | |||
}); | |||
} | |||
} | |||
}, | |||
onShowDistance(location) { | |||
let userToStoreDistance = 9999; | |||
if (location != null) { | |||
let locArray = location.split(','); | |||
userToStoreDistance = getApp().distance(getApp().globalData.userLocation.latitude, getApp().globalData.userLocation.longitude , Number.parseFloat(locArray[1]) , Number.parseFloat(locArray[0])); | |||
} | |||
userToStoreDistance = Number.parseFloat(userToStoreDistance); | |||
if (Number.isNaN(userToStoreDistance)) { | |||
userToStoreDistance = 9999; | |||
} | |||
if (food.goodsMakes && food.goodsMakes.length > 0) { | |||
food.goodsMakes.forEach((item, inedx) => { | |||
if (inedx === 0) { | |||
item.isSelect = true; | |||
} else { | |||
item.isSelect = false; | |||
return userToStoreDistance; | |||
}, | |||
onReacquireData() { | |||
store.commit('onInitLastStore', {}); | |||
if (this.storeList.length === 0) { | |||
this.onFetchStoreList().then( () => { | |||
if (this.isInnerDistance) { | |||
this.getGoodsList().then(() => { | |||
store.commit('onInitLastStore', store.state.currentStore); | |||
}); | |||
} | |||
}); | |||
} else { | |||
if (this.isInnerDistance) { | |||
this.getGoodsList().then(() => { | |||
store.commit('onInitLastStore', store.state.currentStore); | |||
}); | |||
} | |||
} | |||
}, | |||
onResetFoodInfo() { | |||
this.foodRightIntoView = 'foodRightIntoView-1'; | |||
this.foodRightNodeTop = []; | |||
}, | |||
//预览图片 | |||
onPreviewImage(url) { | |||
uni.previewImage({ | |||
urls: [url] | |||
}); | |||
}, | |||
onReduceFood(food) { | |||
if (food.shopCartNumber === 0) return; | |||
this.chooseGoodsCount -= 1; | |||
food.shopCartNumber -= 1; | |||
onSuccessLocationAuth() { | |||
this.isShowLoactionAuth = false; | |||
}, | |||
onChooseSpecial: debounce(function(food) { | |||
this.onChooseFood(food); | |||
}, 2000, true), | |||
onImageError(item) { | |||
item.cover = this.imageServer.concat('empty-image.png'); | |||
}, | |||
onImageErrorType(item) { | |||
item.coverUrl = this.imageServer.concat('empty-image.png'); | |||
}, | |||
onStoreList() { | |||
this.$refs.popup.open('right') | |||
}, | |||
onChooseStore(store) { | |||
this.chooseGoodsCount = 0; | |||
this.currentStore = store; | |||
this.getGoodsList(store.id); | |||
//处理好友分享的商品 | |||
onHandleFriendShare() { | |||
if (this.currentStore.id === this.friendShare.shareStoreId) { | |||
let shareFood = null; | |||
this.foodArray.forEach(foodType => { | |||
let findShare = foodType.foods.find(foodItem => this.friendShare.shareFoodId === foodItem.id); | |||
if (findShare) { | |||
shareFood = findShare; | |||
} | |||
}); | |||
if (shareFood != null) { | |||
this.$refs.goodsListRef.onChooseFood(shareFood); | |||
} | |||
} | |||
}, | |||
onReservation() { | |||
console.log('预定', this.foodArray) | |||
onChooseStore(currentStore) { | |||
store.commit('onClearShopCart'); | |||
store.commit('onInitChooseStore', currentStore); | |||
this.onGetUserLocation(); | |||
} | |||
} | |||
} | |||
@@ -288,216 +251,6 @@ | |||
overflow: hidden; | |||
} | |||
.food-list-box { | |||
flex-grow: 1; | |||
display: flex; | |||
border-top: 2rpx solid #f5f5f5; | |||
overflow: hidden; | |||
} | |||
.food-empty-image { | |||
width: 200rpx; | |||
height: 200rpx; | |||
margin-bottom: 200rpx; | |||
animation-name: emptyImage; | |||
animation-duration: 1s; | |||
animation-timing-function: linear; | |||
animation-iteration-count: infinite; | |||
animation-direction: alternate; | |||
animation-play-state: running; | |||
} | |||
@keyframes emptyImage { | |||
from { | |||
transform: translateY(25rpx); | |||
} | |||
to { | |||
transform: translateY(0rpx); | |||
} | |||
} | |||
.food-left-item { | |||
position: relative; | |||
display: flex; | |||
flex-direction: column; | |||
justify-content: space-evenly; | |||
align-items: center; | |||
width: 130rpx; | |||
height: 200rpx; | |||
font-size: 24rpx; | |||
color: #999; | |||
box-sizing: border-box; | |||
padding: 0 20rpx; | |||
} | |||
.food-left-cover { | |||
width: 100rpx; | |||
height: 100rpx; | |||
} | |||
.food-left-name { | |||
display: -webkit-box; | |||
-webkit-box-orient: vertical; | |||
-webkit-line-clamp: 3; | |||
overflow: hidden; | |||
text-overflow: ellipsis; | |||
} | |||
.food-right-scroll { | |||
margin-left: 20rpx; | |||
} | |||
.foodt-right-title { | |||
font-size: 32rpx; | |||
color: #222; | |||
height: 60rpx; | |||
line-height: 60rpx; | |||
font-weight: 700; | |||
font-family: '华文细黑'; | |||
} | |||
.food-card { | |||
display: flex; | |||
margin-bottom: 20rpx; | |||
} | |||
.food-card-cover { | |||
position: relative; | |||
flex-shrink: 0; | |||
width: 200rpx; | |||
height: 200rpx; | |||
margin-right: 20rpx; | |||
} | |||
.food-sell-out { | |||
position: absolute; | |||
text-align: center; | |||
bottom: 0; | |||
left: 50%; | |||
transform: translateX(-50%); | |||
background-color: #CCCCCC; | |||
color: #FFF; | |||
width: 100%; | |||
height: 50rpx; | |||
line-height: 50rpx; | |||
font-size: 28rpx; | |||
} | |||
.food-card-cover image { | |||
border-radius: 20rpx; | |||
} | |||
.food-vip-icon { | |||
width: 60rpx; | |||
height: 34rpx; | |||
} | |||
.food-card-name { | |||
font-size: 28rpx; | |||
display: -webkit-box; | |||
-webkit-box-orient: vertical; | |||
-webkit-line-clamp: 2; | |||
overflow: hidden; | |||
text-overflow: ellipsis; | |||
} | |||
.food-card-price { | |||
display: flex; | |||
justify-content: space-between; | |||
align-items: center; | |||
font-size: 32rpx; | |||
} | |||
.card-price-left, .card-price-right { | |||
display: flex; | |||
align-items: center; | |||
width: 55%; | |||
} | |||
.food-card-info { | |||
flex-grow: 1; | |||
display: flex; | |||
flex-direction: column; | |||
justify-content: space-around; | |||
} | |||
.food-card-no-vip { | |||
color: #999; | |||
font-size: 24rpx; | |||
} | |||
.card-price-right { | |||
justify-content: space-around; | |||
width: 45%; | |||
} | |||
.card-price-right .iconfont { | |||
font-size: 50rpx; | |||
} | |||
.minimum-price { | |||
font-family: fantasy; | |||
} | |||
.food-left-scroll { | |||
width: 130rpx; | |||
background-color: #F4F4F4; | |||
} | |||
.food-left-active { | |||
position: relative; | |||
background-color: #FFF; | |||
} | |||
.food-left-active::before { | |||
position: absolute; | |||
left: 0px; | |||
top: 50%; | |||
transform: translateY(-50%); | |||
content: ''; | |||
width: 6rpx; | |||
height: 200rpx; | |||
background-color: $theme-color; | |||
} | |||
.icon-zengjia, .icon-jianshaojianqujianhao { | |||
color: $theme-color; | |||
} | |||
.hidden-blank-data { | |||
visibility: hidden; | |||
} | |||
.feed-list-popup { | |||
z-index: 13; | |||
} | |||
.special-offer-btn { | |||
justify-content: space-evenly; | |||
background-color: $theme-color; | |||
color: #FFF; | |||
font-size: 28rpx; | |||
border-radius: 10rpx; | |||
margin-right: 10rpx; | |||
padding: 5rpx 0; | |||
} | |||
.special-offer-btn .iconfont { | |||
font-size: 35rpx; | |||
} | |||
/* 广告 */ | |||
.advertisement-card { | |||
width: 590rpx; | |||
height: 200rpx; | |||
margin: 10rpx 0; | |||
} | |||
.advertisement-card image { | |||
border-radius: 10rpx; | |||
} | |||
.store-name { | |||
display: flex; | |||
align-items: center; | |||
@@ -514,80 +267,101 @@ | |||
font-weight: 700; | |||
} | |||
.desk-code-test { | |||
.goods-list-box { | |||
display: flex; | |||
margin-left: auto; | |||
font-size: 24rpx; | |||
} | |||
.desk-code-test .iconfont { | |||
margin-right: 15rpx; | |||
} | |||
.store-distance { | |||
color: #999; | |||
font-size: 24rpx; | |||
flex-grow: 1; | |||
overflow: hidden; | |||
} | |||
.store-list { | |||
background-color: rgb(247, 248, 250); | |||
width: 80vw; | |||
height: 100vh; | |||
padding: 30rpx; | |||
box-sizing: border-box; | |||
overflow-y: auto; | |||
} | |||
.store-list-item { | |||
background: #FFF; | |||
padding: 30rpx; | |||
border-radius: 10rpx; | |||
margin: 20rpx 0; | |||
} | |||
.store-list-name { | |||
font-size: 34rpx; | |||
font-weight: 700; | |||
color: #222; | |||
} | |||
.store-status-box { | |||
display: flex; | |||
justify-content: space-between; | |||
align-items: center; | |||
} | |||
.store-list-status { | |||
font-size: 20rpx; | |||
border: 1rpx solid #999; | |||
color: #999; | |||
width: 110rpx; | |||
padding: 5rpx 20rpx; | |||
border-radius: 10rpx; | |||
text-align: center; | |||
margin: 10rpx 0; | |||
} | |||
.store-list-time { | |||
color: #999; | |||
font-size: 24rpx; | |||
margin: 10rpx 0; | |||
} | |||
.selected-store { | |||
border: 4rpx solid $theme-color; | |||
} | |||
.reservation-btn { | |||
position: fixed; | |||
bottom: 60rpx; | |||
right: 30rpx; | |||
width: 300rpx; | |||
height: 80rpx; | |||
line-height: 80rpx; | |||
background-color: #51A97D; | |||
color: #FFF; | |||
border-radius: 90rpx; | |||
border: none; | |||
} | |||
background-color: rgb(247, 248, 250); | |||
width: 80vw; | |||
height: 100vh; | |||
padding: 30rpx; | |||
box-sizing: border-box; | |||
overflow-y: auto; | |||
} | |||
.store-list-item { | |||
background: #FFF; | |||
padding: 30rpx; | |||
border-radius: 10rpx; | |||
margin: 20rpx 0; | |||
} | |||
.store-list-name { | |||
font-size: 34rpx; | |||
font-weight: 700; | |||
color: #222; | |||
} | |||
.store-status-box { | |||
display: flex; | |||
justify-content: space-between; | |||
align-items: center; | |||
} | |||
.store-list-status { | |||
font-size: 20rpx; | |||
border: 1rpx solid #999; | |||
color: #999; | |||
width: 110rpx; | |||
padding: 5rpx 20rpx; | |||
border-radius: 10rpx; | |||
text-align: center; | |||
margin: 10rpx 0; | |||
} | |||
.store-list-time { | |||
color: #999; | |||
font-size: 24rpx; | |||
margin: 10rpx 0; | |||
} | |||
.selected-store { | |||
border: 4rpx solid $theme-color; | |||
} | |||
.food-list-box { | |||
flex-grow: 1; | |||
display: flex; | |||
border-top: 2rpx solid #f5f5f5; | |||
overflow: hidden; | |||
} | |||
.food-list-box-empty { | |||
flex-direction: column; | |||
background-color: #FFF; | |||
justify-content: center; | |||
align-items: center; | |||
} | |||
.food-list-box-empty-btn { | |||
padding: 20rpx 150rpx; | |||
font-size: 32rpx; | |||
border-radius: 10rpx; | |||
color: #FFF; | |||
background-color: $theme-color; | |||
} | |||
.food-empty-image { | |||
width: 200rpx; | |||
height: 200rpx; | |||
margin-bottom: 200rpx; | |||
animation-name: emptyImage; | |||
animation-duration: .8s; | |||
animation-timing-function: linear; | |||
animation-iteration-count: infinite; | |||
animation-direction: alternate; | |||
animation-play-state: running; | |||
} | |||
@keyframes emptyImage { | |||
from { | |||
transform: translateY(25rpx); | |||
} | |||
to { | |||
transform: translateY(0rpx); | |||
} | |||
} | |||
</style> |
@@ -17,7 +17,7 @@ | |||
<view class="click-member" @click="onJumpRegisterMember"></view> | |||
<!-- 签到 --> | |||
<view class="click-sign-in" @click="onFoodReservation"> | |||
<view class="click-sign-in-text"> | |||
<view class="click-sign-in-text" v-if="isHKApp"> | |||
菜品预定 | |||
</view> | |||
</view> | |||
@@ -81,6 +81,7 @@ | |||
isShowActivity: false, //是否显示活动列表弹窗 | |||
activityList: [], | |||
drinkInfo: {}, //积杯换饮 | |||
isHKApp: false, | |||
carouselList: [ | |||
'https://hbl-test-1305371387.cos.ap-chengdu.myqcloud.com/Franchisee/qw/goods/133058072111585205.jpg', | |||
'https://hbl-test-1305371387.cos.ap-chengdu.myqcloud.com/Franchisee/qw/goods/133058072178578510.jpg' | |||
@@ -96,6 +97,7 @@ | |||
onShow() { | |||
this.onFetchUserInfo(); | |||
this.onFetchStoreStyles(); | |||
this.onHKApp(); | |||
}, | |||
created() { | |||
this.onFetchActivityData(); | |||
@@ -113,6 +115,15 @@ | |||
} | |||
}, | |||
methods: { | |||
/** | |||
* 判断是否为海科微信小程序 | |||
*/ | |||
onHKApp() { | |||
const appInfo = uni.getAccountInfoSync(); | |||
if (appInfo.miniProgram.appId === 'wx67f7399628986bfb') { | |||
this.isHKApp = true; | |||
} | |||
}, | |||
onJumpOrder() { | |||
uni.switchTab({ | |||
url: '/pages/food/food' | |||
@@ -299,11 +310,44 @@ | |||
} | |||
}, | |||
// 菜品预定 | |||
onFoodReservation() { | |||
uni.navigateTo({ | |||
url: '/pages/foodReservation/foodReservation' | |||
onFoodReservation: debounce(function () { | |||
if(!this.isHKApp) return; | |||
getApp().onCheckUserSession().then( async (response) => { | |||
const userStorage = getApp().onGetUserStorage(); | |||
let memberRes = await memberAPI.selectMemberByOpenId(userStorage.openId); | |||
if (memberRes.isSuccess) { | |||
getApp().onSetUserStorage(memberRes.data); | |||
if (memberRes.data.memberInfo_Id && memberRes.data.phone) { | |||
this.memberInfo = memberRes.data; | |||
uni.navigateTo({ | |||
url: '/pages/foodReservation/foodReservation' | |||
}); | |||
} else { | |||
uni.navigateTo({ | |||
url: '/pages/memberRegister/memberRegister' | |||
}); | |||
uni.showToast({ | |||
title: memberRes.msg || '请注册成为会员后进行预定!', | |||
duration: 2000, | |||
icon: 'none', | |||
mask: true | |||
}); | |||
} | |||
} else { | |||
if (memberRes?.msg === '会员不存在') { | |||
uni.navigateTo({ | |||
url: '/pages/memberRegister/memberRegister' | |||
}); | |||
} | |||
uni.showToast({ | |||
title: '请注册成为会员后进行预定!', | |||
duration: 2000, | |||
icon: 'none', | |||
mask: true | |||
}); | |||
} | |||
}); | |||
} | |||
}, 2000, true) | |||
} | |||
} | |||
</script> | |||
@@ -62,6 +62,22 @@ | |||
</view> | |||
<button class="member-regis-suffix member-register-btn" type="default" open-type="getPhoneNumber" @getphonenumber="onGetUserPhone">获取号码</button> | |||
</view> | |||
<view class="member-regis-item" v-if="isHKApp"> | |||
<view class="member-regis-prev"> | |||
姓名 | |||
</view> | |||
<view class="member-regis-content member-regis-input"> | |||
<input type="text" class="weui-input" placeholder="请输入真实姓名" v-model="userInfo.realName"/> | |||
</view> | |||
</view> | |||
<view class="member-regis-item" v-if="isHKApp"> | |||
<view class="member-regis-prev"> | |||
工号 | |||
</view> | |||
<view class="member-regis-content member-regis-input"> | |||
<input type="text" class="weui-input" placeholder="请输入员工卡号!" v-model="userInfo.staffNum"/> | |||
</view> | |||
</view> | |||
</view> | |||
<!-- 会员协议 --> | |||
<view class="membership-agreement"> | |||
@@ -92,13 +108,16 @@ | |||
return { | |||
isAgree: false, | |||
imageServer: getApp().globalData.imageServer, | |||
isHKApp: false, | |||
userInfo: { | |||
avatarUrl: 'https://mmbiz.qpic.cn/mmbiz/icTdbqWNOwNRna42FI242Lcia07jQodd2FJGIYQfG0LAJGFxM4FbnQP6yfMxBgJ0F3YRqJCJ1aPAK2dQagdusBZg/0', | |||
nickName: '', | |||
openId: '', | |||
session_key: '', | |||
gender: '', | |||
phone: '' | |||
phone: '', | |||
realName: '', | |||
staffNum: '' | |||
}, | |||
backgroundIMG: 'https://hbl-test-1305371387.cos.ap-chengdu.myqcloud.com/Franchisee/gz/applet/133064030402220970.png' | |||
} | |||
@@ -110,8 +129,18 @@ | |||
}, | |||
onShow() { | |||
this.onFetchStoreStyles(); | |||
this.onHKApp(); | |||
}, | |||
methods: { | |||
/** | |||
* 判断是否为海科微信小程序 | |||
*/ | |||
onHKApp() { | |||
const appInfo = uni.getAccountInfoSync(); | |||
if (appInfo.miniProgram.appId === 'wx67f7399628986bfb') { | |||
this.isHKApp = true; | |||
} | |||
}, | |||
onCheckboxChange() { | |||
this.isAgree = !this.isAgree; | |||
}, | |||
@@ -140,12 +169,25 @@ | |||
} else { | |||
const user = getApp().onGetUserStorage(); | |||
if (this.isAgree) { | |||
if (this.isHKApp) { | |||
if (this.userInfo.realName.trim().length === 0 || this.userInfo.staffNum.trim().length === 0) { | |||
uni.showToast({ | |||
title: '姓名或卡号不能为空!', | |||
icon: 'none', | |||
duration: 2000, | |||
mask: true | |||
}); | |||
return; | |||
} | |||
} | |||
let registerJson = { | |||
"nickName": getApp().encodeBPABase64(this.userInfo.nickName || '默认用户名'), | |||
"sex": user.gender || 0, | |||
"headImgUrl": this.userInfo.avatarUrl || this.imageServer.concat('1160f23a-d924-4739-9806-156a26494674.png'), | |||
"platformMemberId": user.openId, | |||
"phone": this.userInfo.phone | |||
"phone": this.userInfo.phone, | |||
"realName": this.userInfo.realName, | |||
"staffNum": this.userInfo.staffNum | |||
} | |||
let registerRes = await memberAPI.insertOrUpdateMember(registerJson); | |||
if (registerRes.isSuccess == true) { | |||
@@ -60,7 +60,7 @@ const store = new Vuex.Store({ | |||
let price = 0; | |||
state.shoppingCart.forEach(food => { | |||
state.isVipMember ? price += (food.vipPrice * 100 * food.count) : price += (food.price * 100 * food.count); | |||
food.addtoFoodList.forEach(feed => { | |||
food.addtoFoodList?.forEach(feed => { | |||
feed.foods.forEach(addFood => { | |||
if (addFood.count > 0) { | |||
price += (addFood.count * addFood.price * 100); | |||
@@ -86,7 +86,7 @@ const store = new Vuex.Store({ | |||
//配料+1 | |||
onFeedCountPlus(state, payload) { | |||
let feed = payload; | |||
state.currentGoods.addtoFoodList.forEach(item => { | |||
state.currentGoods.addtoFoodList?.forEach(item => { | |||
item.foods.forEach(addFood => { | |||
if (addFood.id === feed.id) { | |||
addFood.count += 1; | |||
@@ -142,7 +142,7 @@ const store = new Vuex.Store({ | |||
let stapleFood = payload; | |||
let index = state.shoppingCart.findIndex(item => item.sencondId === stapleFood.sencondId); | |||
state.shoppingCart[index].count++; | |||
state.shoppingCart[index].addtoFoodList.forEach(item => { | |||
state.shoppingCart[index].addtoFoodList?.forEach(item => { | |||
item.foods[0].count += item.foods[0].sourceCount; | |||
}); | |||
this.commit('onOperatorFoodArray', { | |||
@@ -178,7 +178,7 @@ const store = new Vuex.Store({ | |||
}); | |||
if (state.shoppingCart[index].count > 1) { | |||
state.shoppingCart[index].count--; | |||
state.shoppingCart[index].addtoFoodList.forEach(item => { | |||
state.shoppingCart[index].addtoFoodList?.forEach(item => { | |||
item.foods[0].count -= item.foods[0].sourceCount; | |||
}); | |||
} else { | |||
@@ -0,0 +1,21 @@ | |||
## 1.2.4(2022-09-07) | |||
小程序端由于 style 使用了对象导致报错,[详情](https://ask.dcloud.net.cn/question/152790?item_id=211778&rf=false) | |||
## 1.2.3(2022-09-05) | |||
- 修复 nvue 环境下,具有 tabBar 时,fab 组件下部位置无法正常获取 --window-bottom 的bug,详见:[https://ask.dcloud.net.cn/question/110638?notification_id=826310](https://ask.dcloud.net.cn/question/110638?notification_id=826310) | |||
## 1.2.2(2021-12-29) | |||
- 更新 组件依赖 | |||
## 1.2.1(2021-11-19) | |||
- 修复 阴影颜色不正确的bug | |||
## 1.2.0(2021-11-19) | |||
- 优化 组件UI,并提供设计资源,详见:[https://uniapp.dcloud.io/component/uniui/resource](https://uniapp.dcloud.io/component/uniui/resource) | |||
- 文档迁移,详见:[https://uniapp.dcloud.io/component/uniui/uni-fab](https://uniapp.dcloud.io/component/uniui/uni-fab) | |||
## 1.1.1(2021-11-09) | |||
- 新增 提供组件设计资源,组件样式调整 | |||
## 1.1.0(2021-07-30) | |||
- 组件兼容 vue3,如何创建vue3项目,详见 [uni-app 项目支持 vue3 介绍](https://ask.dcloud.net.cn/article/37834) | |||
## 1.0.7(2021-05-12) | |||
- 新增 组件示例地址 | |||
## 1.0.6(2021-02-05) | |||
- 调整为uni_modules目录规范 | |||
- 优化 按钮背景色调整 | |||
- 优化 兼容pc端 |
@@ -0,0 +1,487 @@ | |||
<template> | |||
<view class="uni-cursor-point"> | |||
<view v-if="popMenu && (leftBottom||rightBottom||leftTop||rightTop) && content.length > 0" :class="{ | |||
'uni-fab--leftBottom': leftBottom, | |||
'uni-fab--rightBottom': rightBottom, | |||
'uni-fab--leftTop': leftTop, | |||
'uni-fab--rightTop': rightTop | |||
}" class="uni-fab" | |||
:style="nvueBottom" | |||
> | |||
<view :class="{ | |||
'uni-fab__content--left': horizontal === 'left', | |||
'uni-fab__content--right': horizontal === 'right', | |||
'uni-fab__content--flexDirection': direction === 'vertical', | |||
'uni-fab__content--flexDirectionStart': flexDirectionStart, | |||
'uni-fab__content--flexDirectionEnd': flexDirectionEnd, | |||
'uni-fab__content--other-platform': !isAndroidNvue | |||
}" :style="{ width: boxWidth, height: boxHeight, backgroundColor: styles.backgroundColor }" | |||
class="uni-fab__content" elevation="5"> | |||
<view v-if="flexDirectionStart || horizontalLeft" class="uni-fab__item uni-fab__item--first" /> | |||
<view v-for="(item, index) in content" :key="index" :class="{ 'uni-fab__item--active': isShow }" | |||
class="uni-fab__item" @click="_onItemClick(index, item)"> | |||
<image :src="item.active ? item.selectedIconPath : item.iconPath" class="uni-fab__item-image" | |||
mode="aspectFit" /> | |||
<text class="uni-fab__item-text" | |||
:style="{ color: item.active ? styles.selectedColor : styles.color }">{{ item.text }}</text> | |||
</view> | |||
<view v-if="flexDirectionEnd || horizontalRight" class="uni-fab__item uni-fab__item--first" /> | |||
</view> | |||
</view> | |||
<view :class="{ | |||
'uni-fab__circle--leftBottom': leftBottom, | |||
'uni-fab__circle--rightBottom': rightBottom, | |||
'uni-fab__circle--leftTop': leftTop, | |||
'uni-fab__circle--rightTop': rightTop, | |||
'uni-fab__content--other-platform': !isAndroidNvue | |||
}" class="uni-fab__circle uni-fab__plus" :style="{ 'background-color': styles.buttonColor, 'bottom': nvueBottom }" @click="_onClick"> | |||
<uni-icons class="fab-circle-icon" type="plusempty" :color="styles.iconColor" size="32" | |||
:class="{'uni-fab__plus--active': isShow && content.length > 0}"></uni-icons> | |||
<!-- <view class="fab-circle-v" :class="{'uni-fab__plus--active': isShow && content.length > 0}"></view> | |||
<view class="fab-circle-h" :class="{'uni-fab__plus--active': isShow && content.length > 0}"></view> --> | |||
</view> | |||
</view> | |||
</template> | |||
<script> | |||
let platform = 'other' | |||
// #ifdef APP-NVUE | |||
platform = uni.getSystemInfoSync().platform | |||
// #endif | |||
/** | |||
* Fab 悬浮按钮 | |||
* @description 点击可展开一个图形按钮菜单 | |||
* @tutorial https://ext.dcloud.net.cn/plugin?id=144 | |||
* @property {Object} pattern 可选样式配置项 | |||
* @property {Object} horizontal = [left | right] 水平对齐方式 | |||
* @value left 左对齐 | |||
* @value right 右对齐 | |||
* @property {Object} vertical = [bottom | top] 垂直对齐方式 | |||
* @value bottom 下对齐 | |||
* @value top 上对齐 | |||
* @property {Object} direction = [horizontal | vertical] 展开菜单显示方式 | |||
* @value horizontal 水平显示 | |||
* @value vertical 垂直显示 | |||
* @property {Array} content 展开菜单内容配置项 | |||
* @property {Boolean} popMenu 是否使用弹出菜单 | |||
* @event {Function} trigger 展开菜单点击事件,返回点击信息 | |||
* @event {Function} fabClick 悬浮按钮点击事件 | |||
*/ | |||
export default { | |||
name: 'UniFab', | |||
emits: ['fabClick', 'trigger'], | |||
props: { | |||
pattern: { | |||
type: Object, | |||
default () { | |||
return {} | |||
} | |||
}, | |||
horizontal: { | |||
type: String, | |||
default: 'left' | |||
}, | |||
vertical: { | |||
type: String, | |||
default: 'bottom' | |||
}, | |||
direction: { | |||
type: String, | |||
default: 'horizontal' | |||
}, | |||
content: { | |||
type: Array, | |||
default () { | |||
return [] | |||
} | |||
}, | |||
show: { | |||
type: Boolean, | |||
default: false | |||
}, | |||
popMenu: { | |||
type: Boolean, | |||
default: true | |||
} | |||
}, | |||
data() { | |||
return { | |||
fabShow: false, | |||
isShow: false, | |||
isAndroidNvue: platform === 'android', | |||
styles: { | |||
color: '#3c3e49', | |||
selectedColor: '#007AFF', | |||
backgroundColor: '#fff', | |||
buttonColor: '#007AFF', | |||
iconColor: '#fff' | |||
} | |||
} | |||
}, | |||
computed: { | |||
contentWidth(e) { | |||
return (this.content.length + 1) * 55 + 15 + 'px' | |||
}, | |||
contentWidthMin() { | |||
return '55px' | |||
}, | |||
// 动态计算宽度 | |||
boxWidth() { | |||
return this.getPosition(3, 'horizontal') | |||
}, | |||
// 动态计算高度 | |||
boxHeight() { | |||
return this.getPosition(3, 'vertical') | |||
}, | |||
// 计算左下位置 | |||
leftBottom() { | |||
return this.getPosition(0, 'left', 'bottom') | |||
}, | |||
// 计算右下位置 | |||
rightBottom() { | |||
return this.getPosition(0, 'right', 'bottom') | |||
}, | |||
// 计算左上位置 | |||
leftTop() { | |||
return this.getPosition(0, 'left', 'top') | |||
}, | |||
rightTop() { | |||
return this.getPosition(0, 'right', 'top') | |||
}, | |||
flexDirectionStart() { | |||
return this.getPosition(1, 'vertical', 'top') | |||
}, | |||
flexDirectionEnd() { | |||
return this.getPosition(1, 'vertical', 'bottom') | |||
}, | |||
horizontalLeft() { | |||
return this.getPosition(2, 'horizontal', 'left') | |||
}, | |||
horizontalRight() { | |||
return this.getPosition(2, 'horizontal', 'right') | |||
}, | |||
// 计算 nvue bottom | |||
nvueBottom() { | |||
const safeBottom = uni.getSystemInfoSync().windowBottom; | |||
// #ifdef APP-NVUE | |||
return 30 + safeBottom | |||
// #endif | |||
// #ifndef APP-NVUE | |||
return 30 | |||
// #endif | |||
} | |||
}, | |||
watch: { | |||
pattern: { | |||
handler(val, oldVal) { | |||
this.styles = Object.assign({}, this.styles, val) | |||
}, | |||
deep: true | |||
} | |||
}, | |||
created() { | |||
this.isShow = this.show | |||
if (this.top === 0) { | |||
this.fabShow = true | |||
} | |||
// 初始化样式 | |||
this.styles = Object.assign({}, this.styles, this.pattern) | |||
}, | |||
methods: { | |||
_onClick() { | |||
this.$emit('fabClick') | |||
if (!this.popMenu) { | |||
return | |||
} | |||
this.isShow = !this.isShow | |||
}, | |||
open() { | |||
this.isShow = true | |||
}, | |||
close() { | |||
this.isShow = false | |||
}, | |||
/** | |||
* 按钮点击事件 | |||
*/ | |||
_onItemClick(index, item) { | |||
this.$emit('trigger', { | |||
index, | |||
item | |||
}) | |||
}, | |||
/** | |||
* 获取 位置信息 | |||
*/ | |||
getPosition(types, paramA, paramB) { | |||
if (types === 0) { | |||
return this.horizontal === paramA && this.vertical === paramB | |||
} else if (types === 1) { | |||
return this.direction === paramA && this.vertical === paramB | |||
} else if (types === 2) { | |||
return this.direction === paramA && this.horizontal === paramB | |||
} else { | |||
return this.isShow && this.direction === paramA ? this.contentWidth : this.contentWidthMin | |||
} | |||
} | |||
} | |||
} | |||
</script> | |||
<style lang="scss" > | |||
$uni-shadow-base:0 1px 5px 2px rgba($color: #000000, $alpha: 0.3) !default; | |||
.uni-fab { | |||
position: fixed; | |||
/* #ifndef APP-NVUE */ | |||
display: flex; | |||
/* #endif */ | |||
justify-content: center; | |||
align-items: center; | |||
z-index: 10; | |||
border-radius: 45px; | |||
box-shadow: $uni-shadow-base; | |||
} | |||
.uni-cursor-point { | |||
/* #ifdef H5 */ | |||
cursor: pointer; | |||
/* #endif */ | |||
} | |||
.uni-fab--active { | |||
opacity: 1; | |||
} | |||
.uni-fab--leftBottom { | |||
left: 15px; | |||
bottom: 30px; | |||
/* #ifdef H5 */ | |||
left: calc(15px + var(--window-left)); | |||
bottom: calc(30px + var(--window-bottom)); | |||
/* #endif */ | |||
// padding: 10px; | |||
} | |||
.uni-fab--leftTop { | |||
left: 15px; | |||
top: 30px; | |||
/* #ifdef H5 */ | |||
left: calc(15px + var(--window-left)); | |||
top: calc(30px + var(--window-top)); | |||
/* #endif */ | |||
// padding: 10px; | |||
} | |||
.uni-fab--rightBottom { | |||
right: 15px; | |||
bottom: 30px; | |||
/* #ifdef H5 */ | |||
right: calc(15px + var(--window-right)); | |||
bottom: calc(30px + var(--window-bottom)); | |||
/* #endif */ | |||
// padding: 10px; | |||
} | |||
.uni-fab--rightTop { | |||
right: 15px; | |||
top: 30px; | |||
/* #ifdef H5 */ | |||
right: calc(15px + var(--window-right)); | |||
top: calc(30px + var(--window-top)); | |||
/* #endif */ | |||
// padding: 10px; | |||
} | |||
.uni-fab__circle { | |||
position: fixed; | |||
/* #ifndef APP-NVUE */ | |||
display: flex; | |||
/* #endif */ | |||
justify-content: center; | |||
align-items: center; | |||
width: 55px; | |||
height: 55px; | |||
background-color: #3c3e49; | |||
border-radius: 45px; | |||
z-index: 11; | |||
// box-shadow: $uni-shadow-base; | |||
} | |||
.uni-fab__circle--leftBottom { | |||
left: 15px; | |||
bottom: 30px; | |||
/* #ifdef H5 */ | |||
left: calc(15px + var(--window-left)); | |||
bottom: calc(30px + var(--window-bottom)); | |||
/* #endif */ | |||
} | |||
.uni-fab__circle--leftTop { | |||
left: 15px; | |||
top: 30px; | |||
/* #ifdef H5 */ | |||
left: calc(15px + var(--window-left)); | |||
top: calc(30px + var(--window-top)); | |||
/* #endif */ | |||
} | |||
.uni-fab__circle--rightBottom { | |||
right: 15px; | |||
bottom: 30px; | |||
/* #ifdef H5 */ | |||
right: calc(15px + var(--window-right)); | |||
bottom: calc(30px + var(--window-bottom)); | |||
/* #endif */ | |||
} | |||
.uni-fab__circle--rightTop { | |||
right: 15px; | |||
top: 30px; | |||
/* #ifdef H5 */ | |||
right: calc(15px + var(--window-right)); | |||
top: calc(30px + var(--window-top)); | |||
/* #endif */ | |||
} | |||
.uni-fab__circle--left { | |||
left: 0; | |||
} | |||
.uni-fab__circle--right { | |||
right: 0; | |||
} | |||
.uni-fab__circle--top { | |||
top: 0; | |||
} | |||
.uni-fab__circle--bottom { | |||
bottom: 0; | |||
} | |||
.uni-fab__plus { | |||
font-weight: bold; | |||
} | |||
// .fab-circle-v { | |||
// position: absolute; | |||
// width: 2px; | |||
// height: 24px; | |||
// left: 0; | |||
// top: 0; | |||
// right: 0; | |||
// bottom: 0; | |||
// /* #ifndef APP-NVUE */ | |||
// margin: auto; | |||
// /* #endif */ | |||
// background-color: white; | |||
// transform: rotate(0deg); | |||
// transition: transform 0.3s; | |||
// } | |||
// .fab-circle-h { | |||
// position: absolute; | |||
// width: 24px; | |||
// height: 2px; | |||
// left: 0; | |||
// top: 0; | |||
// right: 0; | |||
// bottom: 0; | |||
// /* #ifndef APP-NVUE */ | |||
// margin: auto; | |||
// /* #endif */ | |||
// background-color: white; | |||
// transform: rotate(0deg); | |||
// transition: transform 0.3s; | |||
// } | |||
.fab-circle-icon { | |||
transform: rotate(0deg); | |||
transition: transform 0.3s; | |||
font-weight: 200; | |||
} | |||
.uni-fab__plus--active { | |||
transform: rotate(135deg); | |||
} | |||
.uni-fab__content { | |||
/* #ifndef APP-NVUE */ | |||
box-sizing: border-box; | |||
display: flex; | |||
/* #endif */ | |||
flex-direction: row; | |||
border-radius: 55px; | |||
overflow: hidden; | |||
transition-property: width, height; | |||
transition-duration: 0.2s; | |||
width: 55px; | |||
border-color: #DDDDDD; | |||
border-width: 1rpx; | |||
border-style: solid; | |||
} | |||
.uni-fab__content--other-platform { | |||
border-width: 0px; | |||
box-shadow: $uni-shadow-base; | |||
} | |||
.uni-fab__content--left { | |||
justify-content: flex-start; | |||
} | |||
.uni-fab__content--right { | |||
justify-content: flex-end; | |||
} | |||
.uni-fab__content--flexDirection { | |||
flex-direction: column; | |||
justify-content: flex-end; | |||
} | |||
.uni-fab__content--flexDirectionStart { | |||
flex-direction: column; | |||
justify-content: flex-start; | |||
} | |||
.uni-fab__content--flexDirectionEnd { | |||
flex-direction: column; | |||
justify-content: flex-end; | |||
} | |||
.uni-fab__item { | |||
/* #ifndef APP-NVUE */ | |||
display: flex; | |||
/* #endif */ | |||
flex-direction: column; | |||
justify-content: center; | |||
align-items: center; | |||
width: 55px; | |||
height: 55px; | |||
opacity: 0; | |||
transition: opacity 0.2s; | |||
} | |||
.uni-fab__item--active { | |||
opacity: 1; | |||
} | |||
.uni-fab__item-image { | |||
width: 20px; | |||
height: 20px; | |||
margin-bottom: 4px; | |||
} | |||
.uni-fab__item-text { | |||
color: #FFFFFF; | |||
font-size: 12px; | |||
line-height: 12px; | |||
margin-top: 2px; | |||
} | |||
.uni-fab__item--first { | |||
width: 55px; | |||
} | |||
</style> |
@@ -0,0 +1,84 @@ | |||
{ | |||
"id": "uni-fab", | |||
"displayName": "uni-fab 悬浮按钮", | |||
"version": "1.2.4", | |||
"description": "悬浮按钮 fab button ,点击可展开一个图标按钮菜单。", | |||
"keywords": [ | |||
"uni-ui", | |||
"uniui", | |||
"按钮", | |||
"悬浮按钮", | |||
"fab" | |||
], | |||
"repository": "https://github.com/dcloudio/uni-ui", | |||
"engines": { | |||
"HBuilderX": "" | |||
}, | |||
"directories": { | |||
"example": "../../temps/example_temps" | |||
}, | |||
"dcloudext": { | |||
"sale": { | |||
"regular": { | |||
"price": "0.00" | |||
}, | |||
"sourcecode": { | |||
"price": "0.00" | |||
} | |||
}, | |||
"contact": { | |||
"qq": "" | |||
}, | |||
"declaration": { | |||
"ads": "无", | |||
"data": "无", | |||
"permissions": "无" | |||
}, | |||
"npmurl": "https://www.npmjs.com/package/@dcloudio/uni-ui", | |||
"type": "component-vue" | |||
}, | |||
"uni_modules": { | |||
"dependencies": ["uni-scss","uni-icons"], | |||
"encrypt": [], | |||
"platforms": { | |||
"cloud": { | |||
"tcb": "y", | |||
"aliyun": "y" | |||
}, | |||
"client": { | |||
"App": { | |||
"app-vue": "y", | |||
"app-nvue": "y" | |||
}, | |||
"H5-mobile": { | |||
"Safari": "y", | |||
"Android Browser": "y", | |||
"微信浏览器(Android)": "y", | |||
"QQ浏览器(Android)": "y" | |||
}, | |||
"H5-pc": { | |||
"Chrome": "y", | |||
"IE": "y", | |||
"Edge": "y", | |||
"Firefox": "y", | |||
"Safari": "y" | |||
}, | |||
"小程序": { | |||
"微信": "y", | |||
"阿里": "y", | |||
"百度": "y", | |||
"字节跳动": "y", | |||
"QQ": "y" | |||
}, | |||
"快应用": { | |||
"华为": "u", | |||
"联盟": "u" | |||
}, | |||
"Vue": { | |||
"vue2": "y", | |||
"vue3": "y" | |||
} | |||
} | |||
} | |||
} | |||
} |
@@ -0,0 +1,9 @@ | |||
## Fab 悬浮按钮 | |||
> **组件名:uni-fab** | |||
> 代码块: `uFab` | |||
点击可展开一个图形按钮菜单 | |||
### [查看文档](https://uniapp.dcloud.io/component/uniui/uni-fab) | |||
#### 如使用过程中有任何问题,或者您对uni-ui有一些好的建议,欢迎加入 uni-ui 交流群:871950839 |
@@ -0,0 +1,22 @@ | |||
## 1.3.5(2022-01-24) | |||
- 优化 size 属性可以传入不带单位的字符串数值 | |||
## 1.3.4(2022-01-24) | |||
- 优化 size 支持其他单位 | |||
## 1.3.3(2022-01-17) | |||
- 修复 nvue 有些图标不显示的bug,兼容老版本图标 | |||
## 1.3.2(2021-12-01) | |||
- 优化 示例可复制图标名称 | |||
## 1.3.1(2021-11-23) | |||
- 优化 兼容旧组件 type 值 | |||
## 1.3.0(2021-11-19) | |||
- 新增 更多图标 | |||
- 优化 自定义图标使用方式 | |||
- 优化 组件UI,并提供设计资源,详见:[https://uniapp.dcloud.io/component/uniui/resource](https://uniapp.dcloud.io/component/uniui/resource) | |||
- 文档迁移,详见:[https://uniapp.dcloud.io/component/uniui/uni-icons](https://uniapp.dcloud.io/component/uniui/uni-icons) | |||
## 1.1.7(2021-11-08) | |||
## 1.2.0(2021-07-30) | |||
- 组件兼容 vue3,如何创建vue3项目,详见 [uni-app 项目支持 vue3 介绍](https://ask.dcloud.net.cn/article/37834) | |||
## 1.1.5(2021-05-12) | |||
- 新增 组件示例地址 | |||
## 1.1.4(2021-02-05) | |||
- 调整为uni_modules目录规范 |
@@ -0,0 +1,96 @@ | |||
<template> | |||
<!-- #ifdef APP-NVUE --> | |||
<text :style="{ color: color, 'font-size': iconSize }" class="uni-icons" @click="_onClick">{{unicode}}</text> | |||
<!-- #endif --> | |||
<!-- #ifndef APP-NVUE --> | |||
<text :style="{ color: color, 'font-size': iconSize }" class="uni-icons" :class="['uniui-'+type,customPrefix,customPrefix?type:'']" @click="_onClick"></text> | |||
<!-- #endif --> | |||
</template> | |||
<script> | |||
import icons from './icons.js'; | |||
const getVal = (val) => { | |||
const reg = /^[0-9]*$/g | |||
return (typeof val === 'number' || reg.test(val) )? val + 'px' : val; | |||
} | |||
// #ifdef APP-NVUE | |||
var domModule = weex.requireModule('dom'); | |||
import iconUrl from './uniicons.ttf' | |||
domModule.addRule('fontFace', { | |||
'fontFamily': "uniicons", | |||
'src': "url('"+iconUrl+"')" | |||
}); | |||
// #endif | |||
/** | |||
* Icons 图标 | |||
* @description 用于展示 icons 图标 | |||
* @tutorial https://ext.dcloud.net.cn/plugin?id=28 | |||
* @property {Number} size 图标大小 | |||
* @property {String} type 图标图案,参考示例 | |||
* @property {String} color 图标颜色 | |||
* @property {String} customPrefix 自定义图标 | |||
* @event {Function} click 点击 Icon 触发事件 | |||
*/ | |||
export default { | |||
name: 'UniIcons', | |||
emits:['click'], | |||
props: { | |||
type: { | |||
type: String, | |||
default: '' | |||
}, | |||
color: { | |||
type: String, | |||
default: '#333333' | |||
}, | |||
size: { | |||
type: [Number, String], | |||
default: 16 | |||
}, | |||
customPrefix:{ | |||
type: String, | |||
default: '' | |||
} | |||
}, | |||
data() { | |||
return { | |||
icons: icons.glyphs | |||
} | |||
}, | |||
computed:{ | |||
unicode(){ | |||
let code = this.icons.find(v=>v.font_class === this.type) | |||
if(code){ | |||
return unescape(`%u${code.unicode}`) | |||
} | |||
return '' | |||
}, | |||
iconSize(){ | |||
return getVal(this.size) | |||
} | |||
}, | |||
methods: { | |||
_onClick() { | |||
this.$emit('click') | |||
} | |||
} | |||
} | |||
</script> | |||
<style lang="scss"> | |||
/* #ifndef APP-NVUE */ | |||
@import './uniicons.css'; | |||
@font-face { | |||
font-family: uniicons; | |||
src: url('./uniicons.ttf') format('truetype'); | |||
} | |||
/* #endif */ | |||
.uni-icons { | |||
font-family: uniicons; | |||
text-decoration: none; | |||
text-align: center; | |||
} | |||
</style> |
@@ -0,0 +1,663 @@ | |||
.uniui-color:before { | |||
content: "\e6cf"; | |||
} | |||
.uniui-wallet:before { | |||
content: "\e6b1"; | |||
} | |||
.uniui-settings-filled:before { | |||
content: "\e6ce"; | |||
} | |||
.uniui-auth-filled:before { | |||
content: "\e6cc"; | |||
} | |||
.uniui-shop-filled:before { | |||
content: "\e6cd"; | |||
} | |||
.uniui-staff-filled:before { | |||
content: "\e6cb"; | |||
} | |||
.uniui-vip-filled:before { | |||
content: "\e6c6"; | |||
} | |||
.uniui-plus-filled:before { | |||
content: "\e6c7"; | |||
} | |||
.uniui-folder-add-filled:before { | |||
content: "\e6c8"; | |||
} | |||
.uniui-color-filled:before { | |||
content: "\e6c9"; | |||
} | |||
.uniui-tune-filled:before { | |||
content: "\e6ca"; | |||
} | |||
.uniui-calendar-filled:before { | |||
content: "\e6c0"; | |||
} | |||
.uniui-notification-filled:before { | |||
content: "\e6c1"; | |||
} | |||
.uniui-wallet-filled:before { | |||
content: "\e6c2"; | |||
} | |||
.uniui-medal-filled:before { | |||
content: "\e6c3"; | |||
} | |||
.uniui-gift-filled:before { | |||
content: "\e6c4"; | |||
} | |||
.uniui-fire-filled:before { | |||
content: "\e6c5"; | |||
} | |||
.uniui-refreshempty:before { | |||
content: "\e6bf"; | |||
} | |||
.uniui-location-filled:before { | |||
content: "\e6af"; | |||
} | |||
.uniui-person-filled:before { | |||
content: "\e69d"; | |||
} | |||
.uniui-personadd-filled:before { | |||
content: "\e698"; | |||
} | |||
.uniui-back:before { | |||
content: "\e6b9"; | |||
} | |||
.uniui-forward:before { | |||
content: "\e6ba"; | |||
} | |||
.uniui-arrow-right:before { | |||
content: "\e6bb"; | |||
} | |||
.uniui-arrowthinright:before { | |||
content: "\e6bb"; | |||
} | |||
.uniui-arrow-left:before { | |||
content: "\e6bc"; | |||
} | |||
.uniui-arrowthinleft:before { | |||
content: "\e6bc"; | |||
} | |||
.uniui-arrow-up:before { | |||
content: "\e6bd"; | |||
} | |||
.uniui-arrowthinup:before { | |||
content: "\e6bd"; | |||
} | |||
.uniui-arrow-down:before { | |||
content: "\e6be"; | |||
} | |||
.uniui-arrowthindown:before { | |||
content: "\e6be"; | |||
} | |||
.uniui-bottom:before { | |||
content: "\e6b8"; | |||
} | |||
.uniui-arrowdown:before { | |||
content: "\e6b8"; | |||
} | |||
.uniui-right:before { | |||
content: "\e6b5"; | |||
} | |||
.uniui-arrowright:before { | |||
content: "\e6b5"; | |||
} | |||
.uniui-top:before { | |||
content: "\e6b6"; | |||
} | |||
.uniui-arrowup:before { | |||
content: "\e6b6"; | |||
} | |||
.uniui-left:before { | |||
content: "\e6b7"; | |||
} | |||
.uniui-arrowleft:before { | |||
content: "\e6b7"; | |||
} | |||
.uniui-eye:before { | |||
content: "\e651"; | |||
} | |||
.uniui-eye-filled:before { | |||
content: "\e66a"; | |||
} | |||
.uniui-eye-slash:before { | |||
content: "\e6b3"; | |||
} | |||
.uniui-eye-slash-filled:before { | |||
content: "\e6b4"; | |||
} | |||
.uniui-info-filled:before { | |||
content: "\e649"; | |||
} | |||
.uniui-reload:before { | |||
content: "\e6b2"; | |||
} | |||
.uniui-micoff-filled:before { | |||
content: "\e6b0"; | |||
} | |||
.uniui-map-pin-ellipse:before { | |||
content: "\e6ac"; | |||
} | |||
.uniui-map-pin:before { | |||
content: "\e6ad"; | |||
} | |||
.uniui-location:before { | |||
content: "\e6ae"; | |||
} | |||
.uniui-starhalf:before { | |||
content: "\e683"; | |||
} | |||
.uniui-star:before { | |||
content: "\e688"; | |||
} | |||
.uniui-star-filled:before { | |||
content: "\e68f"; | |||
} | |||
.uniui-calendar:before { | |||
content: "\e6a0"; | |||
} | |||
.uniui-fire:before { | |||
content: "\e6a1"; | |||
} | |||
.uniui-medal:before { | |||
content: "\e6a2"; | |||
} | |||
.uniui-font:before { | |||
content: "\e6a3"; | |||
} | |||
.uniui-gift:before { | |||
content: "\e6a4"; | |||
} | |||
.uniui-link:before { | |||
content: "\e6a5"; | |||
} | |||
.uniui-notification:before { | |||
content: "\e6a6"; | |||
} | |||
.uniui-staff:before { | |||
content: "\e6a7"; | |||
} | |||
.uniui-vip:before { | |||
content: "\e6a8"; | |||
} | |||
.uniui-folder-add:before { | |||
content: "\e6a9"; | |||
} | |||
.uniui-tune:before { | |||
content: "\e6aa"; | |||
} | |||
.uniui-auth:before { | |||
content: "\e6ab"; | |||
} | |||
.uniui-person:before { | |||
content: "\e699"; | |||
} | |||
.uniui-email-filled:before { | |||
content: "\e69a"; | |||
} | |||
.uniui-phone-filled:before { | |||
content: "\e69b"; | |||
} | |||
.uniui-phone:before { | |||
content: "\e69c"; | |||
} | |||
.uniui-email:before { | |||
content: "\e69e"; | |||
} | |||
.uniui-personadd:before { | |||
content: "\e69f"; | |||
} | |||
.uniui-chatboxes-filled:before { | |||
content: "\e692"; | |||
} | |||
.uniui-contact:before { | |||
content: "\e693"; | |||
} | |||
.uniui-chatbubble-filled:before { | |||
content: "\e694"; | |||
} | |||
.uniui-contact-filled:before { | |||
content: "\e695"; | |||
} | |||
.uniui-chatboxes:before { | |||
content: "\e696"; | |||
} | |||
.uniui-chatbubble:before { | |||
content: "\e697"; | |||
} | |||
.uniui-upload-filled:before { | |||
content: "\e68e"; | |||
} | |||
.uniui-upload:before { | |||
content: "\e690"; | |||
} | |||
.uniui-weixin:before { | |||
content: "\e691"; | |||
} | |||
.uniui-compose:before { | |||
content: "\e67f"; | |||
} | |||
.uniui-qq:before { | |||
content: "\e680"; | |||
} | |||
.uniui-download-filled:before { | |||
content: "\e681"; | |||
} | |||
.uniui-pyq:before { | |||
content: "\e682"; | |||
} | |||
.uniui-sound:before { | |||
content: "\e684"; | |||
} | |||
.uniui-trash-filled:before { | |||
content: "\e685"; | |||
} | |||
.uniui-sound-filled:before { | |||
content: "\e686"; | |||
} | |||
.uniui-trash:before { | |||
content: "\e687"; | |||
} | |||
.uniui-videocam-filled:before { | |||
content: "\e689"; | |||
} | |||
.uniui-spinner-cycle:before { | |||
content: "\e68a"; | |||
} | |||
.uniui-weibo:before { | |||
content: "\e68b"; | |||
} | |||
.uniui-videocam:before { | |||
content: "\e68c"; | |||
} | |||
.uniui-download:before { | |||
content: "\e68d"; | |||
} | |||
.uniui-help:before { | |||
content: "\e679"; | |||
} | |||
.uniui-navigate-filled:before { | |||
content: "\e67a"; | |||
} | |||
.uniui-plusempty:before { | |||
content: "\e67b"; | |||
} | |||
.uniui-smallcircle:before { | |||
content: "\e67c"; | |||
} | |||
.uniui-minus-filled:before { | |||
content: "\e67d"; | |||
} | |||
.uniui-micoff:before { | |||
content: "\e67e"; | |||
} | |||
.uniui-closeempty:before { | |||
content: "\e66c"; | |||
} | |||
.uniui-clear:before { | |||
content: "\e66d"; | |||
} | |||
.uniui-navigate:before { | |||
content: "\e66e"; | |||
} | |||
.uniui-minus:before { | |||
content: "\e66f"; | |||
} | |||
.uniui-image:before { | |||
content: "\e670"; | |||
} | |||
.uniui-mic:before { | |||
content: "\e671"; | |||
} | |||
.uniui-paperplane:before { | |||
content: "\e672"; | |||
} | |||
.uniui-close:before { | |||
content: "\e673"; | |||
} | |||
.uniui-help-filled:before { | |||
content: "\e674"; | |||
} | |||
.uniui-paperplane-filled:before { | |||
content: "\e675"; | |||
} | |||
.uniui-plus:before { | |||
content: "\e676"; | |||
} | |||
.uniui-mic-filled:before { | |||
content: "\e677"; | |||
} | |||
.uniui-image-filled:before { | |||
content: "\e678"; | |||
} | |||
.uniui-locked-filled:before { | |||
content: "\e668"; | |||
} | |||
.uniui-info:before { | |||
content: "\e669"; | |||
} | |||
.uniui-locked:before { | |||
content: "\e66b"; | |||
} | |||
.uniui-camera-filled:before { | |||
content: "\e658"; | |||
} | |||
.uniui-chat-filled:before { | |||
content: "\e659"; | |||
} | |||
.uniui-camera:before { | |||
content: "\e65a"; | |||
} | |||
.uniui-circle:before { | |||
content: "\e65b"; | |||
} | |||
.uniui-checkmarkempty:before { | |||
content: "\e65c"; | |||
} | |||
.uniui-chat:before { | |||
content: "\e65d"; | |||
} | |||
.uniui-circle-filled:before { | |||
content: "\e65e"; | |||
} | |||
.uniui-flag:before { | |||
content: "\e65f"; | |||
} | |||
.uniui-flag-filled:before { | |||
content: "\e660"; | |||
} | |||
.uniui-gear-filled:before { | |||
content: "\e661"; | |||
} | |||
.uniui-home:before { | |||
content: "\e662"; | |||
} | |||
.uniui-home-filled:before { | |||
content: "\e663"; | |||
} | |||
.uniui-gear:before { | |||
content: "\e664"; | |||
} | |||
.uniui-smallcircle-filled:before { | |||
content: "\e665"; | |||
} | |||
.uniui-map-filled:before { | |||
content: "\e666"; | |||
} | |||
.uniui-map:before { | |||
content: "\e667"; | |||
} | |||
.uniui-refresh-filled:before { | |||
content: "\e656"; | |||
} | |||
.uniui-refresh:before { | |||
content: "\e657"; | |||
} | |||
.uniui-cloud-upload:before { | |||
content: "\e645"; | |||
} | |||
.uniui-cloud-download-filled:before { | |||
content: "\e646"; | |||
} | |||
.uniui-cloud-download:before { | |||
content: "\e647"; | |||
} | |||
.uniui-cloud-upload-filled:before { | |||
content: "\e648"; | |||
} | |||
.uniui-redo:before { | |||
content: "\e64a"; | |||
} | |||
.uniui-images-filled:before { | |||
content: "\e64b"; | |||
} | |||
.uniui-undo-filled:before { | |||
content: "\e64c"; | |||
} | |||
.uniui-more:before { | |||
content: "\e64d"; | |||
} | |||
.uniui-more-filled:before { | |||
content: "\e64e"; | |||
} | |||
.uniui-undo:before { | |||
content: "\e64f"; | |||
} | |||
.uniui-images:before { | |||
content: "\e650"; | |||
} | |||
.uniui-paperclip:before { | |||
content: "\e652"; | |||
} | |||
.uniui-settings:before { | |||
content: "\e653"; | |||
} | |||
.uniui-search:before { | |||
content: "\e654"; | |||
} | |||
.uniui-redo-filled:before { | |||
content: "\e655"; | |||
} | |||
.uniui-list:before { | |||
content: "\e644"; | |||
} | |||
.uniui-mail-open-filled:before { | |||
content: "\e63a"; | |||
} | |||
.uniui-hand-down-filled:before { | |||
content: "\e63c"; | |||
} | |||
.uniui-hand-down:before { | |||
content: "\e63d"; | |||
} | |||
.uniui-hand-up-filled:before { | |||
content: "\e63e"; | |||
} | |||
.uniui-hand-up:before { | |||
content: "\e63f"; | |||
} | |||
.uniui-heart-filled:before { | |||
content: "\e641"; | |||
} | |||
.uniui-mail-open:before { | |||
content: "\e643"; | |||
} | |||
.uniui-heart:before { | |||
content: "\e639"; | |||
} | |||
.uniui-loop:before { | |||
content: "\e633"; | |||
} | |||
.uniui-pulldown:before { | |||
content: "\e632"; | |||
} | |||
.uniui-scan:before { | |||
content: "\e62a"; | |||
} | |||
.uniui-bars:before { | |||
content: "\e627"; | |||
} | |||
.uniui-cart-filled:before { | |||
content: "\e629"; | |||
} | |||
.uniui-checkbox:before { | |||
content: "\e62b"; | |||
} | |||
.uniui-checkbox-filled:before { | |||
content: "\e62c"; | |||
} | |||
.uniui-shop:before { | |||
content: "\e62f"; | |||
} | |||
.uniui-headphones:before { | |||
content: "\e630"; | |||
} | |||
.uniui-cart:before { | |||
content: "\e631"; | |||
} |
@@ -0,0 +1,86 @@ | |||
{ | |||
"id": "uni-icons", | |||
"displayName": "uni-icons 图标", | |||
"version": "1.3.5", | |||
"description": "图标组件,用于展示移动端常见的图标,可自定义颜色、大小。", | |||
"keywords": [ | |||
"uni-ui", | |||
"uniui", | |||
"icon", | |||
"图标" | |||
], | |||
"repository": "https://github.com/dcloudio/uni-ui", | |||
"engines": { | |||
"HBuilderX": "^3.2.14" | |||
}, | |||
"directories": { | |||
"example": "../../temps/example_temps" | |||
}, | |||
"dcloudext": { | |||
"category": [ | |||
"前端组件", | |||
"通用组件" | |||
], | |||
"sale": { | |||
"regular": { | |||
"price": "0.00" | |||
}, | |||
"sourcecode": { | |||
"price": "0.00" | |||
} | |||
}, | |||
"contact": { | |||
"qq": "" | |||
}, | |||
"declaration": { | |||
"ads": "无", | |||
"data": "无", | |||
"permissions": "无" | |||
}, | |||
"npmurl": "https://www.npmjs.com/package/@dcloudio/uni-ui" | |||
}, | |||
"uni_modules": { | |||
"dependencies": ["uni-scss"], | |||
"encrypt": [], | |||
"platforms": { | |||
"cloud": { | |||
"tcb": "y", | |||
"aliyun": "y" | |||
}, | |||
"client": { | |||
"App": { | |||
"app-vue": "y", | |||
"app-nvue": "y" | |||
}, | |||
"H5-mobile": { | |||
"Safari": "y", | |||
"Android Browser": "y", | |||
"微信浏览器(Android)": "y", | |||
"QQ浏览器(Android)": "y" | |||
}, | |||
"H5-pc": { | |||
"Chrome": "y", | |||
"IE": "y", | |||
"Edge": "y", | |||
"Firefox": "y", | |||
"Safari": "y" | |||
}, | |||
"小程序": { | |||
"微信": "y", | |||
"阿里": "y", | |||
"百度": "y", | |||
"字节跳动": "y", | |||
"QQ": "y" | |||
}, | |||
"快应用": { | |||
"华为": "u", | |||
"联盟": "u" | |||
}, | |||
"Vue": { | |||
"vue2": "y", | |||
"vue3": "y" | |||
} | |||
} | |||
} | |||
} | |||
} |
@@ -0,0 +1,8 @@ | |||
## Icons 图标 | |||
> **组件名:uni-icons** | |||
> 代码块: `uIcons` | |||
用于展示 icons 图标 。 | |||
### [查看文档](https://uniapp.dcloud.io/component/uniui/uni-icons) | |||
#### 如使用过程中有任何问题,或者您对uni-ui有一些好的建议,欢迎加入 uni-ui 交流群:871950839 |
@@ -50,11 +50,11 @@ const request = (options) => { | |||
url: BASE_URL + interfaceType + options.url, | |||
method: options.method || 'GET', | |||
data: options.data || {}, | |||
header: options.header || { | |||
header: Object.assign({}, options.header, { | |||
'BlackApp': BlackApp, | |||
'AppId': getApp().globalData.appId, | |||
'TenantId': '01911b43-8844-4d93-b916-34208e31ba66' || getApp().globalData.companyId | |||
}, | |||
'TenantId': '01911b43-8844-4d93-b916-34208e31ba66' || TenantId // | |||
}), | |||
timeout: 20000, | |||
success: response => { | |||
let jsonData = { | |||