Skip to content

S
sell
Commit fbc3b41c authored by liumiss's avatar liumiss
Browse files
Options

待完善

parent f2eeee5e
Show whitespace changes
Inline Side-by-side
Showing with 997 additions and 286 deletions
src/common/serve.js
View file @ fbc3b41c
......@@ -51,6 +51,11 @@ export const getShopInfo = (shop_id) => request('shop', { shop_id }, 'get');
export const allCategoryAndGoods = (shop_id) => request('/shop/goods/shop', { shop_id}, 'get');
// 商品相关-获取商品列表（查询）
export const search = param => request('shop/goods/index', param, 'get');
/******* 订单相关 ******/
// 店铺订单-下单- 预下单
......
src/common/stylus/index.styl
View file @ fbc3b41c
......@@ -109,5 +109,9 @@
font-size: 16px;
}
.van-tag{
line-height: 1;
// padding:1px 4px;
}
.fontw .van-cell .van-cell__title span{
font-weight: 600;
}
\ No newline at end of file
src/components/confirm-foods-list.vue
View file @ fbc3b41c
......@@ -36,9 +36,12 @@ export default {
header {
position: relative;
padding: 15px;
span{
scw($fontsize-large, #3e3e3e, 600);
}
}
.van-cell {
.thumb {
margin-right: 10px;
......
src/components/food-card.vue 0 → 100644
View file @ fbc3b41c
<template>
<!-- <div> -->
<van-card desc="月售360 好评率88%" :title="food.name">
<div slot="thumb" @click="selectFood(food,item.category_id)">
<van-image width="100%" height="90" fit="contain" :src="$globalUrlFile+food.icon">
<template v-slot:error>
<img width="100%" src="../../../assets/images/null.png" alt />
</template>
</van-image>
</div>
<div slot="price" class="card__bottom">
<section>
<div class="card__origin-price">
<span>¥</span>
<span>{{food.price}}</span>
</div>
<div v-if="food.favorable_price" class="card__price">
<span>¥</span>
<span>{{food.favorable_price}}</span>
</div>
</section>
<!-- 购物车添加、移出按钮 -->
<cube-cart-control
ref="buyCart"
:shopId="shopId"
:food="food"
@showMoveDots="showMoveDotFun"
></cube-cart-control>
</div>
</van-card>
<!-- </div> -->
</template>
<script>
export default {
props:{
food:{
default:{}
}
},
methods:{
}
}
</script>
\ No newline at end of file
src/components/order-card.vue
View file @ fbc3b41c
......@@ -7,12 +7,13 @@
<span>订单编号:</span>
<div class="van-cell__label">{{order.order_no}}</div>
</div>
<div class="van-cell__value van-panel__header-value">
<span>已送达</span>
<span>{{order.order_status=='preparing'?'配送中':'已送达'}}</span>
</div>
</div>
<van-cell @click="onSelect(order.order_no)">
<van-cell @click="onSelect(order.order_type,order.order_no)">
<div slot="title">
<p class="word-one">{{order.goods_name}}</p>
</div>
......@@ -25,6 +26,27 @@
<van-button size="small" color="#1f81be" @click="onMore(77,order.order_no)" plain>再来一单</van-button>
</div>
</van-panel>
<van-panel v-else-if="order.order_type=='recharge'" class="margin-bt-space">
<div slot="header" class="van-cell van-panel__header" @click="onShow(77)">
<div class="van-cell__title">
<span>充值订单</span>
</div>
<div class="van-cell__value van-panel__header-value">
<span>充值成功</span>
</div>
</div>
<van-cell @click="onSelect(order.order_type,order.order_no)">
<div slot="title">
<p class="word-one">{{order.goods_name}}</p>
</div>
<span>
<span class="text-extra-small">￥</span>
<span class="text-base">{{order.price_final}}</span>
</span>
</van-cell>
</van-panel>
</div>
</div>
</template>
......@@ -41,10 +63,17 @@ export default {
onCallBack(order_no) {
this.$emit("select", order_no);
},
onMore(shopId,order_no) {
this.$emit("more",shopId,order_no);
onMore(shopId, order_no) {
this.$emit("more", shopId, order_no);
},
onSelect(order_no) {
onSelect(order_type, order_no) {
if (order_type == "recharge") {
this.$createToast({
txt: "充值订单",
type: "txt"
}).show();
return;
}
this.$emit("select", order_no);
},
onShow(shopId) {
......@@ -63,7 +92,9 @@ export default {
.van-panel {
margin-bottom: 10px;
padding-bottom: 10px;
&__header .van-cell__title span{
font-weight:600;
}
&__content {
padding-left: 12%;
}
......
src/components/shop-list.vue
View file @ fbc3b41c
......@@ -7,7 +7,23 @@
</div>
<div class="card-content">
<h2 class="card-title" v-html="item.name"></h2>
<p class="item-desc" v-html="item.category_name"></p>
<p class="star">
<span>
<i class="cubeic-star"></i>4
</span> 月售42
</p>
<p>起送￥20</p>
<div class="tags">
<van-tag
v-for="tag in item.discount"
:key="tag.id"
color="#f44"
plain
size="10"
>{{parseInt(tag.condition) }}减{{parseInt(tag.amount)}}</van-tag>
</div>
<!-- <p class="item-desc" v-html="item.category_name"></p> -->
</div>
</div>
</li>
......@@ -15,44 +31,35 @@
</template>
<script>
var b = {
shop_id: 1,
name: "清吧",
address: "重庆市,市辖区,涪陵区",
icon: "files/shop/77/image/a4558aa3-ccb2-4f2c-b5db-1461a25c12a9.jpg",
phone: "15389926297",
shop_type: "restaurant",
category_name: "其他",
address_detail: "聚贤大道116号"
};
export default {
data() {
return {};
},
props: ["options","location"],
props: ["options", "location"],
computed: {},
methods: {
onSelect(item){
this.$router.push({name:'shop',params:{id:item.shop_id},query:{geohash:this.location.lat+','+this.location.lng}})
onSelect(item) {
this.$router.push({
name: "shop",
params: { id: item.shop_id },
query: { geohash: this.location.lat + "," + this.location.lng }
});
}
}
};
</script>
<style lang="stylus" scoped>
.card {
position: relative;
box-sizing: border-box;
padding: 8px 16px;
padding: 8px 10px;
color: #323233;
font-size: 12px;
// border-bottom: 1px solid #eee;
// background-color: #fafafa;
.card-inner {
display: flex;
}
......@@ -71,17 +78,33 @@ export default {
min-width: 0;
min-height: 90px;
border-bottom: 1px solid #eee;
color: #7d7e80;
}
.card-title {
min-height: 34px;
font-weight: 600;
min-height: 30px;
line-height: 24px;
display: -webkit-box;
overflow: hidden;
text-overflow: ellipsis;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
font-size: $fontsize-large-x;
color: #232323;
font-weight: 600;
}
.star {
span {
color: #e8864c;
}
}
p {
line-height: 1.5;
}
.tags {
padding: 4px 0;
.van-tag {
margin-right: 6px;
}
}
}
</style>
src/router.js
View file @ fbc3b41c
......@@ -11,10 +11,16 @@ const editAddress = r => require.ensure([], () => r(require('./views/address/edi
const choiseLocation = r => require.ensure([], () => r(require('./views/location/choise.vue')))
const shop = r => require.ensure([], () => r(require('./views/shopItem/index.vue')))
const searchLocation = r => require.ensure([], () => r(require('./views/search/location-search.vue')))
const searchLocation = r => require.ensure([], () => r(require('./views/search/location-search.vue'))) // 定位搜索页
const homeSearch = r => require.ensure([], () => r(require('./views/search/home-search.vue'))) // 店铺搜索页
const shopsResult = r => require.ensure([], () => r(require('./views/search/result/shops.vue'))) // 店铺搜索结果页
const foodSearch = r => require.ensure([], () => r(require('./views/search/food-search.vue'))) // 店铺搜索页
const orderDetails = r => require.ensure([], () => r(require('./views/order/order-detail.vue')))
const confirmOrder = r => require.ensure([], () => r(require('./views/confirmOrder/index.vue')))
const remark = r => require.ensure([], () => r(require('./views/confirmOrder/children/remark.vue')))
const coupon = r => require.ensure([], () => r(require('./views/coupon/coupon.vue')))
......@@ -85,18 +91,45 @@ export default new Router({
component: searchLocation,
meta: { title: '确认收货地址', keepAlive: false }
},
{
path: '/home/search',
name: 'homeSearch',
component: homeSearch,
meta: { title: '', keepAlive: false }
},
/* {
path: '/home/search/shops',
name: 'shopsResult',
component: shopsResult,
meta: { title: '', keepAlive: false }
}, */
{
path: '/shop/:id',
name: 'shop',
component: shop,
meta: { title: '', keepAlive: false }
},
{
path: '/shop/:id/search',
name: 'foodSearch',
component: foodSearch,
meta: { title: '', keepAlive: false }
},
{
path: '/confirmOrder/:shopId',
name: 'confirmOrder',
component: confirmOrder,
meta: { title: '外卖配送', requireAuth: true }
},
{
path: '/confirmOrder/:shopId/remark',
name: 'remark',
component: remark,
meta: { title: '外卖备注', requireAuth: true }
},
{
path: '/order/:order_no',
name: 'orderDetails',
......
src/store/index.js
View file @ fbc3b41c
......@@ -22,7 +22,9 @@ const state = {
shopInfo:{},// 当前店铺信息
edit_address: {}, // 待编辑的地址信息
cartList: {}, // 加入购物车的商品列表
coupon:{}
coupon:{},
remarkText: '',//输入备注内容
}
export default new Vuex.Store({
state,
......
src/store/mutations.js
View file @ fbc3b41c
......@@ -123,11 +123,25 @@ export default {
state.cartList[shopId]={}
},
UPDATE_SHOP_CART(state,cart){
state.cartList = {...cart}
//存入localStorage
sessionstorage.save('buyCart', state.cartList);
},
// 确认订单页面中使用优惠券情况
SAVE_COUPON(state, coupon) {
state.coupon = coupon
},
//记录订单页面用户选择的备注, 传递给订单确认页面
CONFIRM_REMARK(state, {
remarkText,
inputText
}) {
state.remarkText = remarkText;
},
//退出登录
OUT_LOGIN(state) {
state.userInfo = {};
......
src/vant.js
View file @ fbc3b41c
......@@ -19,7 +19,8 @@ import {
ActionSheet,
Panel,
List,
CouponCell, CouponList
CouponCell, CouponList ,
Collapse, CollapseItem
} from 'vant'
Vue.use(Search)
Vue.use(Image)
......@@ -39,3 +40,4 @@ Vue.use(ActionSheet)
Vue.use(Panel)
Vue.use(List)
Vue.use(CouponCell).use(CouponList);
Vue.use(Collapse).use(CollapseItem);
\ No newline at end of file
src/views/confirmOrder/children/remark.vue 0 → 100644
View file @ fbc3b41c
<template>
<div class="rating_page">
<section>
<section class="quick_remark">
<header class="header_style">快速输入</header>
<div class="tags">
<van-button
v-for="item in remarkList"
:key="item"
plain
size="small"
@click="onSelectRemark(item)"
>{{item}}</van-button>
</div>
<cube-textarea
ref="textarea"
v-model="remarkText"
:placeholder="placeholder"
:maxlength="maxlength"
:indicator="indicator"
:autoExpand="autoExpand"
autofocus
></cube-textarea>
</section>
<div class="action">
<van-button size="large" type="danger" @click="confirmRemark">确定</van-button>
</div>
</section>
</div>
</template>
<script>
var remarks = [
"不要辣",
"少点辣",
"多点辣",
"不要香菜",
"不要洋葱",
"多点醋",
"多点葱"
];
export default {
data() {
return {
remarkList: remarks,
maxlength: 50,
placeholder: "填写额外对商家和骑手小哥的备注信息",
autoExpand: true,
indicator: {
negative: false,
remain: true
},
remarkText: ""
};
},
methods: {
onSelectRemark(item) {
let value = this.remarkText == "" ? item : "，" + item;
if (this.remarkText.length > this.maxlength) {
this.toast = this.$createToast({
txt: `已超过${this.maxlength}个字`,
type: "txt"
}).show();
return;
}
this.remarkText += value;
this.$refs.textarea.focus();
},
//确认选择
confirmRemark() {
this.$store.commit("CONFIRM_REMARK", {
remarkText: this.remarkText
});
this.$router.go(-1);
},
}
};
</script>
<style lang="stylus">
@import '~common/stylus/mixin.styl';
.quick_remark {
background-color: #fff;
padding: 0 16px 20px;
.cube-textarea-wrapper {
margin: 20px 0;
&::after {
border-color: #fff;
}
.cube-textarea {
background: #f5f5f5;
}
}
.header_style {
scw($fontsize-medium, $color-light-grey);
padding: 10px 0;
}
.van-button {
margin-right: 10px;
margin-bottom: 4px;
color: #666;
}
}
.action {
padding: 20px 16px;
}
</style>
src/views/confirmOrder/index.vue
View file @ fbc3b41c
......@@ -41,10 +41,15 @@
</van-cell>
</van-row>
<van-row>
<van-cell title="订单备注" value="口味、偏好" is-link></van-cell>
<van-cell title="餐具份数" value="必选" is-link></van-cell>
<van-cell title="发票信息" value="未选择" is-link></van-cell>
<van-row class="section fontw">
<van-cell
title="订单备注"
:value="remarkText?remarkText:'口味、偏好'"
is-link
@click="onRemark"
class="word-one"
></van-cell>
<van-cell title="发票信息" value="暂不支持" is-link></van-cell>
</van-row>
</section>
......@@ -118,8 +123,8 @@ export default {
"cartList",
"shopInfo",
"choosed_address",
"remarkText",
"inputText",
"invoice",
"userInfo"
]),
......@@ -128,22 +133,6 @@ export default {
this.choosed_address.address_detail +
this.choosed_address.address_suffix.split(",")[1]
);
},
//备注页返回的信息进行处理
remarklist: function() {
let str = new String();
if (this.remarkText) {
Object.values(this.remarkText).forEach(item => {
str += item[1] + "，";
});
}
//是否有自定义备注，分开处理
if (this.inputText) {
return str + this.inputText;
} else {
return str.substr(0, str.lastIndexOf("，"));
}
}
},
methods: {
......@@ -205,16 +194,16 @@ export default {
// 预下单商品检测成功后执行支付操作
this.showActionSheet = true;
} else {
if (res.code == 2054) {
this.submitBarTip = res.message;
return;
}
this.$toast(res.message);
this.submitBarTip = res.message
}
this.btnLoading = false;
},
payAction() {
this.showActionSheet = false;
},
// 备注
onRemark() {
this.$router.push({ name: "remark" });
}
}
};
......@@ -225,6 +214,8 @@ export default {
@import '~common/stylus/mixin.styl';
.van-contact-card {
padding: 10px 0;
.van-cell__title {
strong {
font-size: $fontsize-large;
......@@ -239,12 +230,16 @@ export default {
}
}
.order-box .van-cell__value {
scw($fontsize-medium, #3e3e3e, 600);
}
.word-one .van-cell__value {
text-overflow: ellipsis;
white-space: nowrap;
}
/*
.fade-enter-active, .fade-leave-active {
transition: opacity 0.3s;
}
......@@ -268,5 +263,5 @@ export default {
.router-slid-enter, .router-slid-leave-active {
transform: translate3d(2rem, 0, 0);
opacity: 0;
}
} */
</style>
src/views/home/index.vue
View file @ fbc3b41c
......@@ -16,9 +16,7 @@
<!-- 收货地址定位 -->
<div class="location" @click="onRouterLink('sellAddress')">
<i class="cubeic-location text-primary text-extra-large"></i>
<span
class="text-medium"
>{{curLocation.formattedAddress}}</span>
<span class="text-medium">{{curLocation.formattedAddress}}</span>
<div class="location-action">
<i class="cubeic-select text-extra-small"></i>
</div>
......@@ -28,7 +26,7 @@
<!-- 搜索框 -->
<cube-sticky-ele ele-key="11">
<ul class="sticky-header">
<van-search placeholder="请输入搜索关键词" shape="round"></van-search>
<van-search placeholder="请输入搜索关键词" shape="round" @click="onRouterLink('homeSearch',{geohash:curLocation.lat+','+curLocation.lng})"></van-search>
</ul>
</cube-sticky-ele>
......@@ -74,20 +72,15 @@
import CubePage from "../../components/cube-page.vue";
import footGuide from "../../components/footer";
import shopList from "../../components/shop-list";
import { getNearbyShop, getReceivingAddress,getUser } from "../../common/serve";
import {
getNearbyShop,
getReceivingAddress,
getUser
} from "../../common/serve";
import { mapGeolocation, MAP } from "../../common/utils/mUtils";
import { mapState } from "vuex";
var map = {};
var b = {
shop_id: "8e3a39b19ec215d4c9c424ac1608751c",
name: "清吧",
address: "重庆市,市辖区,涪陵区",
icon: "files/shop/77/image/a4558aa3-ccb2-4f2c-b5db-1461a25c12a9.jpg",
phone: "15389926297",
shop_type: "restaurant",
category_name: "其他",
address_detail: "聚贤大道116号"
};
var c = [
{
url: "http://www.didichuxing.com/",
......@@ -138,7 +131,7 @@ export default {
loading: true,
gridsData: d,
shopsData: [b, b, b],
shopsData: [],
scrollEvents: ["scroll"],
scrollY: 0,
......@@ -168,18 +161,22 @@ export default {
zoom: 16
});
this.$store.dispatch("GET_LOCATION", map);
}, 20);
}, 200);
},
mounted() {
this.initData();
},
computed: {
...mapState(["location","choosed_address"]),
...mapState(["location", "choosed_address"]),
// 当前使用的定位
curLocation(){
console.log(this.location)
return this.choosed_address.lat?this.choosed_address:(this.location.lat?this.location:'定位中')
},
curLocation() {
console.log(this.location);
return this.choosed_address.lat
? this.choosed_address
: this.location.lat
? this.location
: "定位中";
}
},
components: {
footGuide,
......@@ -188,19 +185,31 @@ export default {
},
methods: {
async initData() {
let p1 = getNearbyShop(
this.curLocation.lat,
this.curLocation.lng
); // 获取附近的商家
// 获取附近的商家
let p1 = getNearbyShop(this.curLocation.lat, this.curLocation.lng);
let p2 = getReceivingAddress(); // 获取默认的收货地址
let p3 = getUser();
Promise.all([p1,p2,p3])
Promise.all([p1, p2, p3])
.then(result => {
let shopsData = result[0].data;
shopsData["discount"] = [
{
rule_id: 4,
condition: "20.00",
amount: "1.00"
},
{
rule_id: 4,
condition: "30.00",
amount: "5.00"
}
];
this.shopsData = [shopsData];
let addressData = result[1].data;
let userInfoData = result[2].data;
this.$store.commit("RECORD_USERINFO",userInfoData.user_info);
this.$store.commit("RECORD_USERINFO", userInfoData.user_info);
this.loading = false;
})
......
src/views/location/choise.vue
View file @ fbc3b41c
......@@ -34,8 +34,7 @@
<div v-if="poisData==null" class="no-data text-base">
<cube-loading :size="24"></cube-loading>正在定位
</div>
<div v-else-if="poisData.length==0" class="no-data text-base">地址查询失败</div>
<div v-else-if="poisData.length==0" class="empty_tips"><p>找不到地址？</p> <p>尝试输入小区、写字楼或学校名</p> <p>详细地址（如门牌号等）可稍后输入哦</p></div>
</cube-scroll>
</div>
</div>
......@@ -114,11 +113,11 @@ export default {
if (self.hasPosition) {
let position = self.$route.query.geohash.split(",");
positionPicker.start([31.19, 121.7]);
positionPicker.start(position);
} else {
positionPicker.start();
}
positionPicker.start([31.19, 121.7]);
//TODO:事件绑定、结果处理等
});
AMapUI.loadUI(["control/BasicControl"], function(BasicControl) {
......
src/views/order/index.vue
View file @ fbc3b41c
<template>
<div class="container scroll-list-wrap">
<cube-loading v-if="pageLoading" :size="40"></cube-loading>
<!--
<van-list
v-if="orderList.length&&!pageLoading"
v-model="loading"
:finished="finished"
@load="onLoad"
:offset="10"
>-->
<cube-scroll
v-if="orderList.length&&!pageLoading"
ref="scroll"
......@@ -17,7 +9,13 @@
@pulling-down="onPullingDown"
@pulling-up="onPullingUp"
>
<order-card :data="orderList" @select="orderDetail" @show="linkShop" @more="anotherOrder " class="content"></order-card>
<order-card
:data="orderList"
@select="orderDetail"
@show="linkShop"
@more="anotherOrder "
class="content"
></order-card>
</cube-scroll>
<van-row
......@@ -38,49 +36,39 @@
import orderCard from "@/components/order-card.vue";
import footGuide from "../../components/footer";
import { getOrder } from "../../common/serve";
import {mapState } from 'vuex';
import { mapState } from "vuex";
export default {
data() {
return {
pageLoading: true,
orderList: [],
pageNumber: 1,
loading: false, //控制上拉加载的加载动画
last_page: 1
/* loading: false, //控制上拉加载的加载动画
finished: false, //控制在页面往下移动到底部时是否调用接口获取数据
isLoading: false //控制下拉刷新的加载动画
isLoading: false //控制下拉刷新的加载动画 */
};
},
computed: {
...mapState(["location","choosed_address","cartList"]),
...mapState(["location", "choosed_address", "cartList"]),
// 当前使用的定位
curLocation(){
return this.choosed_address.lat?this.choosed_address:(this.location.lat?this.location:'定位中')
curLocation() {
return this.choosed_address.lat
? this.choosed_address
: this.location.lat
? this.location
: "定位中";
},
options() {
return {
pullDownRefresh: this.pullDownRefreshObj,
pullUpLoad: this.pullUpLoadObj,
scrollbar: true
};
pullDownRefresh: {
threshold: 40,
stop: 40,
},
pullDownRefreshObj: function() {
return this.pullDownRefresh
? {
threshold: 10,
txt: '13'
}
: false;
},
pullUpLoadObj: function() {
return this.pullUpLoad
? {
threshold: 10,
txt: {
more: '加载更多...',
noMore: ''
}
pullUpLoad: {
threshold: 20,
}
: false;
};
}
},
components: {
......@@ -92,13 +80,33 @@ export default {
},
methods: {
initData() {
this.getOrder();
this._getOrder();
},
async getOrder() {
async _getOrder() {
//获取不同类型的订单
const orderType = "all";
let res = await getOrder(orderType, this.pageNumber);
if (res.code == 0) {
this.orderList = this.orderList.concat(res.data.data);
if (this.pageNumber > res.data.last_page) {
// 结束加载
this.$refs.scroll.forceUpdate();
this.options.pullUpLoad = false;
}
this.pageNumber++;
// 页面初始化是加载动画
if (this.pageNumber <= 2) {
this.pageLoading = false;
}
} else {
// 如果没有新数据
this.$refs.scroll.forceUpdate();
}
/* if (res.code == 0) {
this.orderList = this.orderList.concat(res.data.data);
this.loading = false; //停止加载状态
if (this.pageNumber > res.data.page.count) {
......@@ -109,48 +117,46 @@ export default {
} else {
this.finished = true;
}
// 页面初始化是加载动画
if (this.pageNumber <= 2) {
this.pageLoading = false;
}
this.loading = false;
this.loading = false; */
},
onPullingDown() {
// 模拟更新数据
setTimeout(() => {
if (Math.random() > 0.5) {
// 如果有新数据
this.items.unshift(_foods[1]);
} else {
// 如果没有新数据
this.$refs.scroll.forceUpdate();
}
}, 1000);
this.pageNumber=1;
this.orderList = [];
this._getOrder();
},
onPullingUp() {
// 模拟更新数据
setTimeout(() => {
if (Math.random() > 0.5) {
// 如果有新数据
let newPage = _foods.slice(0, 5);
this.items = this.items.concat(newPage);
} else {
// 如果没有新数据
this.$refs.scroll.forceUpdate();
}
}, 1000);
this._getOrder();
},
orderDetail(order_no) {
this.$router.push({ name: "orderDetails", params: { order_no: order_no } });
this.$router.push({
name: "orderDetails",
params: { order_no: order_no }
});
},
linkShop(shopId) {
this.$router.push({ name: "shop", params: { id: shopId },query:{geohash:this.curLocation.lat+','+this.curLocation.lng }});
this.$router.push({
name: "shop",
params: { id: shopId },
query: { geohash: this.curLocation.lat + "," + this.curLocation.lng }
});
},
// 再来一单
anotherOrder(shopId,order_no){
this.$router.push({ name: "shop", params: { id: shopId },query:{geohash:this.curLocation.lat+','+this.curLocation.lng,order_no: order_no} });
},
anotherOrder(shopId, order_no) {
this.$router.push({
name: "shop",
params: { id: shopId },
query: {
geohash: this.curLocation.lat + "," + this.curLocation.lng,
order_no: order_no
}
});
}
},
watch: {
"$route.query": function(newVal, oldVal) {
......@@ -167,9 +173,11 @@ export default {
.scroll-list-wrap {
bottom: 50px;
}
.cube-scroll-list-wrapper{
background :transparent;
}
.cube-scroll-list-wrapper {
background: transparent;
}
.content {
padding: 10px;
}
......
src/views/search/food-search.vue 0 → 100644
View file @ fbc3b41c
<template>
<div>
<form action="/">
<van-search
v-model="keyword"
placeholder="请输入搜索关键词"
show-action
shape="round"
@cancel="onCancel"
@input="onChange"
/>
</form>
<!-- 输入提示的容器对象 -->
<div v-if="result.length" class="scroll-list-wrap">
<cube-scroll ref="scroll">
<div class="amap-ui-poi-picker-sugg">
<ul class="amap-ui-poi-picker-sugg-list">
<van-cell v-for="item in result" :key="item.shop_id" @click="onRouterLink(item)">
<van-image slot="icon" width="60" height="60" :src="$globalUrlFile +item.icon"></van-image>
<span slot="title" class="text-medium">{{item.name}}</span>
<span slot="label" class="text-base">月售40</span>
</van-cell>
</ul>
</div>
</cube-scroll>
</div>
<!-- 搜索历史记录 -->
<div class="container">
<cube-scroll ref="scroll">
<van-row v-if="keyword==''&& searchHistory.length" class="history-box margin-bt-space">
<p class="text-medium text-color-gray"></p>
<van-cell title="历史搜索">
<i slot="right-icon" class="cubeic-delete text-medium" @click="onClearHistory"></i>
</van-cell>
<div class="history-list">
<van-tag
v-for="tag in searchHistory"
:key="tag.shop_id"
size="large"
color="#f1f1f1"
class="text-default-gray"
@click="onRouterLink(tag)"
>{{tag.name}}</van-tag>
</div>
</van-row>
<div v-else-if="keyword==''&& searchHistory.length==0" class="empty_tips">
<p>暂无搜索数据</p>
</div>
</cube-scroll>
</div>
</div>
</template>
<script>
import { localstorage } from "../../common/utils/mUtils";
import { search } from "../../common/serve";
let vm = {};
export default {
data() {
vm = this;
return {
geohash: "", // 当前经纬度
keyword: "",
result: [
{
code: null,
created_at: "2019-07-05 14:51:59",
has_inventory: "off",
icon: "files/shop/77/image/1815146a-6402-43df-9752-c1b4023f5d70.jpg",
id: 1078,
name: "农家辣子鸡",
name2: null,
name3: null,
price: "50.00",
status: "normal",
store: 0,
unit: "默认单位"
}
], // 展示搜索结果
searchHistory: [] // 搜索历史记录
};
},
mounted() {
const storage = localstorage.fetch("search-shop");
if (storage.length) {
this.searchHistory = storage;
}
this.geohash = this.$route.query.geohash;
},
methods: {
/**
* 点击搜索结果进入下一页面时进行判断是否已经有一样的历史记录
* 如果没有则新增，如果有则不做重复储存，判断完成后进入下一页
*/
recordHistory(target) {
let repeatItem = this.searchHistory.find(
item => item.shop_id == target.shop_id
);
if (typeof repeatItem == "undefined") {
this.searchHistory.push({ shop_id: target.shop_id, name: target.name });
}
localstorage.save("search-shop", this.searchHistory);
},
onClearHistory() {
this.$createDialog({
type: "confirm",
icon: "cubeic-alert",
title: "",
content: "确认删除全部历史记录？",
confirmBtn: {
text: "删除",
active: true
},
cancelBtn: {
text: "取消"
},
onConfirm: () => {
localstorage.remove("search-shop");
this.searchHistory = [];
}
}).show();
},
onCancel() {
this.$router.replace({
name: "home"
});
},
// 进入对应店铺
onRouterLink(shop) {
this.recordHistory(shop);
this.$router.push({
name: "shop",
params: { id: shop.shop_id },
query: { geohash: this.geohash }
});
},
async onChange(e) {
if (this.keyword == "") {
this.result = [];
}
let res = await search({ keyword: this.keyword, shop_id: 77 });
if (res.code == 0) {
this.result = res.data.data;
}
}
}
};
</script>
<style lang="stylus" scoped>
@import '~common/stylus/mixin.styl';
.scroll-list-wrap {
top: 50px;
z-index: 999;
background: #fff;
.van-image {
margin-right: 10px;
}
}
.history-box {
padding: 0 10px;
.history-list {
width: 110%;
}
.van-cell {
padding-left: 0;
padding-right: 0;
&__title span {
font-size: 16px;
}
&:not(:last-child)::after {
border: none;
}
}
.van-tag {
min-width: 34px;
margin: 0 10px 10px 0;
text-align: center;
line-height: 22px;
color: #999;
}
}
.container {
position();
top: 40px;
padding: 10px 0 10px 10px;
background-color: #fff;
}
.action-btn {
background-color: transparent;
line-height: 26px;
&.van-tag--round:after {
border-radius: 999px !important;
}
}
</style>
\ No newline at end of file
src/views/search/home-search.vue 0 → 100644
View file @ fbc3b41c
<template>
<div>
<form action="/">
<van-search
v-model="keyword"
placeholder="请输入搜索关键词"
show-action
shape="round"
@cancel="onCancel"
@input="onChange"
/>
</form>
<!-- 输入提示的容器对象 -->
<div v-if="result.length" class="scroll-list-wrap">
<cube-scroll ref="scroll">
<div class="amap-ui-poi-picker-sugg">
<ul class="amap-ui-poi-picker-sugg-list">
<van-cell :title="keyword" icon="location-o" />
<van-cell v-for="item in result" :key="item.shop_id" @click="onRouterLink(item)">
<van-image slot="icon" width="30" height="30" :src="$globalUrlFile +item.icon"></van-image>
<span slot="title" class="text-medium">{{item.name}}</span>
<span slot="label" class="text-base">评分4.6</span>
</van-cell>
</ul>
</div>
</cube-scroll>
</div>
<!-- 搜索历史记录 -->
<div class="container">
<cube-scroll ref="scroll">
<van-row v-if="keyword==''&& searchHistory.length" class="history-box margin-bt-space">
<p class="text-medium text-color-gray"></p>
<van-cell title="历史搜索">
<i slot="right-icon" class="cubeic-delete text-medium" @click="onClearHistory"></i>
</van-cell>
<div class="history-list">
<van-tag
v-for="tag in searchHistory"
:key="tag.shop_id"
size="large"
color="#f1f1f1"
class="text-default-gray"
@click="onRouterLink(tag)"
>{{tag.name}}</van-tag>
</div>
</van-row>
<div v-else-if="keyword==''&& searchHistory.length==0" class="empty_tips">
<p>暂无搜索数据</p>
</div>
</cube-scroll>
</div>
</div>
</template>
<script>
import { localstorage } from "../../common/utils/mUtils";
import { search } from "../../common/serve";
let vm = {};
export default {
data() {
vm = this;
return {
geohash: "", // 当前经纬度
keyword: "",
result: [
/* {
shop_id: 77,
code: null,
created_at: "2019-07-05 14:51:59",
has_inventory: "off",
icon: "files/shop/77/image/1815146a-6402-43df-9752-c1b4023f5d70.jpg",
id: 1078,
name: "农家辣子鸡",
name2: null,
name3: null,
price: "50.00",
status: "normal",
store: 0,
unit: "默认单位"
} */
], // 展示搜索结果
searchHistory: [] // 搜索历史记录
};
},
mounted() {
const storage = localstorage.fetch("search-shop");
if (storage.length) {
this.searchHistory = storage;
}
this.geohash = this.$route.query.geohash;
},
methods: {
/**
* 点击搜索结果进入下一页面时进行判断是否已经有一样的历史记录
* 如果没有则新增，如果有则不做重复储存，判断完成后进入下一页
*/
recordHistory(target) {
let repeatItem = this.searchHistory.find(
item => item.shop_id == target.shop_id
);
if (typeof repeatItem == "undefined") {
this.searchHistory.push({ shop_id: target.shop_id, name: target.name });
}
localstorage.save("search-shop", this.searchHistory);
},
onClearHistory() {
this.$createDialog({
type: "confirm",
icon: "cubeic-alert",
title: "",
content: "确认删除全部历史记录？",
confirmBtn: {
text: "删除",
active: true
},
cancelBtn: {
text: "取消"
},
onConfirm: () => {
localstorage.remove("search-shop");
this.searchHistory = [];
}
}).show();
},
onCancel() {
this.$router.replace({
name: "home"
});
},
// 进入对应店铺
onRouterLink(shop) {
this.recordHistory(shop);
this.$router.push({
name: "shop",
params: { id: shop.shop_id },
query: { geohash: this.geohash }
});
},
async onChange(e) {
if (this.keyword == "") {
this.result = [];
}
let res = await search({ keyword: this.keyword, shop_id: 77 });
if (res.code == 0) {
this.result = res.data.data;
}
}
}
};
</script>
<style lang="stylus" scoped>
@import '~common/stylus/mixin.styl';
.scroll-list-wrap {
top: 50px;
z-index: 999;
background: #fff;
.van-image {
margin-right: 10px;
}
}
.history-box {
padding: 0 10px;
.history-list {
width: 110%;
}
.van-cell {
padding-left: 0;
padding-right: 0;
&__title span {
font-size: 16px;
}
&:not(:last-child)::after {
border: none;
}
}
.van-tag {
min-width: 34px;
margin: 0 10px 10px 0;
text-align: center;
line-height: 22px;
color: #999;
}
}
.container {
position();
top: 40px;
padding: 10px 0 10px 10px;
background-color: #fff;
}
.action-btn {
background-color: transparent;
line-height: 26px;
&.van-tag--round:after {
border-radius: 999px !important;
}
}
</style>
\ No newline at end of file
src/views/search/location-search.vue
View file @ fbc3b41c
......@@ -57,8 +57,11 @@
</div>
</van-row>
<div v-else-if="keyword==''&& searchHistory.length==0" class="empty_tips"><p>找不到地址？</p> <p>尝试输入小区、写字楼或学校名</p> <p>详细地址（如门牌号等）可稍后输入哦</p></div>
<div v-else-if="keyword==''&& searchHistory.length==0" class="empty_tips">
<p>找不到地址？</p>
<p>尝试输入小区、写字楼或学校名</p>
<p>详细地址（如门牌号等）可稍后输入哦</p>
</div>
</cube-scroll>
</div>
</div>
......@@ -117,11 +120,16 @@ export default {
},
//监听poi选中信息: 用户选中的poi点信息 存入Vuex
poiPickedFn(poi) {
this.$store.commit("RECORD_ADDRESS", {lat: poi.location.lat, lng: poi.location.lng, formattedAddress: poi.name});
this.$router.push({name:'home'});
this.$store.commit("RECORD_ADDRESS", {
lat: poi.location.lat,
lng: poi.location.lng,
formattedAddress: poi.name
});
this.$store.commit("CHOISE_POSITION", poi);
this.$router.go(-1);
},
setCurrentGeohash(tag){
this.poiPickedFn(tag)
setCurrentGeohash(tag) {
this.poiPickedFn(tag);
},
onRouterLink(keyword) {
this.$router.replace({
......
src/views/search/result/shops.vue 0 → 100644
View file @ fbc3b41c
<template>
<div>
123
</div>
</template>
src/views/setting/account.vue
View file @ fbc3b41c
<template>
<div>
<van-cell-group title="账号绑定" class="margin-bt-space">
<van-cell icon="phone-circle" is-link title="手机号" value="18871334707" to="bindPhone" />
<van-cell icon="phone-circle" is-link title="手机号" value="" to="bindPhone" />
</van-cell-group>
<section class="section">
......
src/views/shopItem/children/shop.vue
View file @ fbc3b41c
......@@ -158,12 +158,12 @@ export default {
if (msg.code == 0) {
let cart = this.cartList,
data = msg.data.goods;
if (cart && cart[this.shopId]) {
let shop = (cart[this.shopId] = {});
// if (cart && cart[this.shopId]) {
this.menuList.forEach((item, index) => {
item.goods_list.forEach(good => {
data.forEach(food => {
if (food.goods_id == good.id) {
let shop = (cart[this.shopId] = {});
let category = (shop[item.category_id] =
shop[item.category_id] || {});
category[food.goods_id] = {
......@@ -177,7 +177,8 @@ export default {
});
});
});
}
// }else{}
this.$store.commit('UPDATE_SHOP_CART',cart)
console.log(cart);
}
}
......@@ -321,7 +322,7 @@ export default {
font-size: $fontsize-small;
.van-tag {
padding: 2px 4px;
// padding: 2px 4px;
right: 0;
top: 10%;
}
......
src/views/shopItem/children/shopInfo.vue
View file @ fbc3b41c
......@@ -41,23 +41,8 @@
<span class="text">{{favoriteText}}</span>
</div>
</div>
<div class="bulletin section">
<h1 class="title">公告与活动</h1>
<div class="content-wrapper border-bottom-1px">
<p class="content">{{seller.bulletin}}</p>
</div>
<ul v-if="seller.supports" class="supports">
<li
class="support-item border-bottom-1px"
v-for="(item,index) in seller.supports"
:key="index"
>
<support-ico :size="4" :type="seller.supports[index].type"></support-ico>
<span class="text">{{seller.supports[index].description}}</span>
</li>
</ul>
</div>
<div class="pics section">
<!-- <div style="height:500px;"></div> -->
<div v-if="seller.pics" class="pics section">
<h1 class="title">商家实景</h1>
<cube-scroll class="pic-wrapper" :options="picScrollOptions">
<ul class="pic-list">
......@@ -67,15 +52,12 @@
</ul>
</cube-scroll>
</div>
<div class="info section">
<h1 class="title border-bottom-1px">商家信息</h1>
<ul>
<li
class="info-item border-bottom-1px"
v-for="(info,index) in seller.infos"
:key="index"
>{{info}}</li>
</ul>
<div class="section">
<van-cell title="商家名称" :value="seller.name"></van-cell>
<van-cell title="商家类型" :value="seller.shop_category"></van-cell>
<van-cell title="商家地址" :value="seller.area.replace(/,/g,'') +seller.address"></van-cell>
<van-cell title="商家电话" :value="seller.phone"></van-cell>
</div>
</div>
</cube-scroll>
......@@ -237,50 +219,6 @@ export default {
}
}
.bulletin {
padding: 18px 18px 0 18px;
white-space: normal;
.title {
margin-bottom: 8px;
line-height: 14px;
color: $color-dark-grey;
font-size: $fontsize-medium;
}
.content-wrapper {
padding: 0 12px 16px 12px;
.content {
line-height: 24px;
font-size: $fontsize-small;
color: $color-red;
}
}
.supports {
.support-item {
display: flex;
align-items: center;
padding: 16px 12px;
&:last-child {
border-none();
}
}
.support-ico {
margin-right: 6px;
}
.text {
line-height: 16px;
font-size: $fontsize-small;
color: $color-dark-grey;
}
}
}
.pics {
padding: 18px;
......@@ -309,26 +247,5 @@ export default {
}
}
}
.info {
padding: 18px 18px 0 18px;
color: $color-dark-grey;
.title {
padding-bottom: 12px;
line-height: 14px;
font-size: $fontsize-medium;
}
.info-item {
padding: 16px 12px;
line-height: 16px;
font-size: $fontsize-small;
&:last-child {
border-none();
}
}
}
}
</style>
src/views/shopItem/index.vue
View file @ fbc3b41c
<template>
<div class="scroll-list-wrap view-wrapper">
<cube-sticky :pos="scrollY">
<cube-sticky
:pos="scrollY"
:check-top="checkTop"
fixed-show-ani="sticky-fixed-show"
@diff-change="diffChange"
>
<cube-scroll
ref="scroll"
:scroll-events="scrollEvents"
:options="options"
@scroll="scrollHandler"
>
<header class="sticky-header" slot="fixed" ref="stickyHeader">
<van-search placeholder="请输入搜索关键词" />
</header>
<section ref="header" class="page-hd">
<van-image width="76" height="76" :src="$globalUrlFile+shopInfo.icon"></van-image>
<div class="prepend-content">
<h1>{{shopInfo.name}}</h1>
<p class="text-light-grey text-extra-small">评价4.2 月售 等描述</p>
<van-tag plain type="danger">满减</van-tag>
<!-- 优惠内容 -->
<div class="tags">
<van-tag
v-for="tag in shopInfo.discount"
:key="tag.id"
color="#f44"
plain
size="10"
>{{parseInt(tag.condition) }}减{{parseInt(tag.amount)}}</van-tag>
<div class="more text-extra-small text-light-grey">
{{ shopInfo.discount.length}}个优惠
<i class="cubeic-select"></i>
</div>
</div>
</div>
</section>
<div class="page-bd">
......@@ -69,21 +91,19 @@ export default {
disableInner: false,
scrollY: 0,
scrollEvents: ["scroll"],
checkTop: true,
headerH: 0, // 头部高度
tabBarH: 0, //tabbar高度
checkTop: false,
data: goods,
shopId: 0,
shopInfo: {},
currentTab: "点餐", //当前导航 active 项的 key 值
currentTabIndex: 1,
tabs: [
{ name: "点餐", is: "shopTab" },
{ name: "评价", is: "evaluate" },
{ name: "商家", is: "shopInfo" }
],
labels: ["点餐", "评价", "商家"]
]
};
},
created() {
......@@ -102,11 +122,16 @@ export default {
}
},
mounted() {
this.$nextTick(() => {
this.headerH = this.$refs.header.offsetHeight; // 包含tabbar 在内的头部高度
this.tabBarH = this.$refs.tabBar.offsetHeight; // tabbar 高度
});
},
watch: {
disable(newVal) { //控制外层的滚动
disable(newVal) {
//控制外层的滚动
if (newVal) {
this.enableFn();
} else {
......@@ -123,12 +148,19 @@ export default {
this.disable = true;
}
},
diffChange(diff, height) {
console.log(diff, height);
let opacity = 0;
if (height) {
opacity = diff / height;
}
this.$refs.stickyHeader.style.opacity = opacity;
},
changeHandler(label) {
this.currentTab = label;
console.log("changed to:", label);
},
scrollTop() {
console.log(132)
this.disable = true;
},
async initData() {
......@@ -145,6 +177,18 @@ export default {
let shopMsg = result[1];
if (shopMsg.code == 0) {
this.shopInfo = shopMsg.data;
this.shopInfo["discount"] = [
{
rule_id: 4,
condition: "20.00",
amount: "1.00"
},
{
rule_id: 4,
condition: "30.00",
amount: "5.00"
}
];
this.$store.commit("CURRENT_SHOPINFO", shopMsg.data);
}
})
......@@ -186,6 +230,25 @@ export default {
p {
padding: 10px;
}
.tags {
position: relative;
text-align: left;
padding: 0 40px;
.van-tag {
margin-right: 6px;
}
.more {
position: absolute;
right: 40px;
top: 0;
height: 100%;
background: #fff;
box-shadow: -8px 0px 10px rgba(255, 255, 255, 0.8);
}
}
}
}
......
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