Commit 6a160487 authored by Junling Bu's avatar Junling Bu
Browse files

chore[litemall-vue]: 调整

parent f4213410
...@@ -3125,3 +3125,7 @@ API应该存在版本控制,以保证兼容性。 ...@@ -3125,3 +3125,7 @@ API应该存在版本控制,以保证兼容性。
## 3 管理后台API服务 ## 3 管理后台API服务
## 4 更新日志
...@@ -8,7 +8,7 @@ export default [ ...@@ -8,7 +8,7 @@ export default [
keepAlive: true keepAlive: true
}, },
components: { components: {
default: () => import('@/views/items/tabbar-class'), default: () => import('@/views/items/tabbar-catalog'),
tabbar: Tabbar tabbar: Tabbar
} }
}, },
......
...@@ -12,7 +12,7 @@ const UserInfo_SetNickname = () => import('@/views/user/user-information-set/set ...@@ -12,7 +12,7 @@ const UserInfo_SetNickname = () => import('@/views/user/user-information-set/set
const UserInfo_SetPassword = () => import('@/views/user/user-information-set/set-password'); const UserInfo_SetPassword = () => import('@/views/user/user-information-set/set-password');
const UserOrderEntityList = () => import('@/views/user/order-entity-list'); const UserOrderEntityList = () => import('@/views/user/order-entity-list');
const UserOrderEleList = () => import('@/views/user/order-ele-list'); const UserCouponList = () => import('@/views/user/coupon-list');
const UserRefundList = () => import('@/views/user/refund-list'); const UserRefundList = () => import('@/views/user/refund-list');
const Tabbar = () => import('@/components/Tabbar/'); const Tabbar = () => import('@/components/Tabbar/');
...@@ -96,10 +96,10 @@ export default [ ...@@ -96,10 +96,10 @@ export default [
component: UserOrderEntityList component: UserOrderEntityList
}, },
{ {
path: '/user/orderEle/list/:active', path: '/user/coupon/list/:active',
name: 'user-order-ele-list', name: 'user-coupon-list',
props: true, props: true,
component: UserOrderEleList component: UserCouponList
}, },
{ {
path: '/user/refund/list', path: '/user/refund/list',
......
...@@ -46,21 +46,34 @@ ...@@ -46,21 +46,34 @@
</div> </div>
</van-panel> </van-panel>
<van-panel title="团购专区"> <van-panel>
<van-card <van-card
:thumb-link="goDetail(groupGood.goods.id)" :thumb-link="goDetail(grouponGood.id)"
v-for="(groupGood ,index) in shopInfos.grouponList" v-for="(grouponGood ,index) in shopInfos.grouponList"
:key="index" :key="index"
:title="groupGood.goods.name" :title="grouponGood.name"
:desc="groupGood.goods.brief" :desc="grouponGood.brief"
:num="groupGood.groupon_member" :origin-price="grouponGood.retailPrice"
:origin-price="groupGood.goods.counterPrice" :price="grouponGood.grouponPrice +'.00'"
:price="groupGood.goods.retailPrice +'.00'" :thumb="grouponGood.picUrl"
:thumb="groupGood.goods.picUrl" @native-click="goDetail(grouponGood.id)"
@native-click="goDetail(groupGood.goods.id)"
> >
<!-- <div slot="footer">添加日期 {{item.addTime}}</div> --> <div slot="tags" class="card__tags">
<van-tag plain type="primary">
{{grouponGood.grouponMember}}人成团
</van-tag>
<van-tag plain type="danger">
{{grouponGood.grouponDiscount}}元再减
</van-tag>
</div>
</van-card> </van-card>
<div slot='header'>
<van-cell-group>
<van-cell title="团购专区" isLink>
<router-link to="/user/coupon/list/0" class="text-desc">更多团购商品</router-link>
</van-cell>
</van-cell-group>
</div>
</van-panel> </van-panel>
<van-panel title="新品首发"> <van-panel title="新品首发">
...@@ -117,7 +130,8 @@ import { ...@@ -117,7 +130,8 @@ import {
Toast, Toast,
Card, Card,
Row, Row,
Col Col,
Tag
} from 'vant'; } from 'vant';
export default { export default {
...@@ -161,36 +175,8 @@ export default { ...@@ -161,36 +175,8 @@ export default {
this.brandList.push(v.picUrl); this.brandList.push(v.picUrl);
}); });
}); });
},
toGoods(item) {
// 如果是秒杀商品, 并且已经抢光
if (this.lootAll(item)) {
this.$dialog.alert({ message: '该秒杀商品已抢光,看看别的吧!' });
return;
} }
this.$router.push({ path: `/items/detail/${item.id}` });
},
groupIcon(key) {
const iconGroup = {
activity_seckill: 'naozhong',
goods: 'list',
mx_goods: 'n4',
shop_recommend: 'good'
};
return iconGroup[key] || '';
},
getStyle(style) {
return style ? 'item-card-vert' : 'item-card-hori';
},
lootAll(item) {
return (
typeof item.as_status !== 'undefined' && item.sold_num == item.total
);
}
}, },
components: { components: {
...@@ -207,7 +193,8 @@ export default { ...@@ -207,7 +193,8 @@ export default {
[Swipe.name]: Swipe, [Swipe.name]: Swipe,
[SwipeItem.name]: SwipeItem, [SwipeItem.name]: SwipeItem,
[Tabbar.name]: Tabbar, [Tabbar.name]: Tabbar,
[TabbarItem.name]: TabbarItem [TabbarItem.name]: TabbarItem,
[Tag.name]: Tag
} }
}; };
</script> </script>
......
...@@ -46,6 +46,7 @@ export default { ...@@ -46,6 +46,7 @@ export default {
data() { data() {
return { return {
categoryId: this.itemClass,
listApi: GoodsList, listApi: GoodsList,
goodsList: [], goodsList: [],
currentCategory: {}, currentCategory: {},
...@@ -60,25 +61,25 @@ export default { ...@@ -60,25 +61,25 @@ export default {
methods: { methods: {
handleTabClick(index) { handleTabClick(index) {
this.itemClass= this.navList[index].id; this.categoryId= this.navList[index].id;
this.$router.replace({ this.$router.replace({
name: 'list', name: 'list',
query: { itemClass: this.itemClass } query: { itemClass: this.categoryId }
}); });
this.init(); this.init();
}, },
init() { init() {
goodsCategory({id: this.itemClass}).then(res => { goodsCategory({id: this.categoryId}).then(res => {
this.navList = res.data.data.brotherCategory; this.navList = res.data.data.brotherCategory;
this.currentCategory= res.data.data.currentCategory; this.currentCategory= res.data.data.currentCategory;
// 当id是L1分类id时,这里需要重新设置成L1分类的一个子分类的id // 当id是L1分类id时,这里需要重新设置成L1分类的一个子分类的id
if (res.data.data.parentCategory.id == this.itemClass) { if (res.data.data.parentCategory.id == this.categoryId) {
this.itemClass = res.data.data.currentCategory.id; this.categoryId = res.data.data.currentCategory.id;
} }
for (let i = 0; i < this.navList.length; i++) { for (let i = 0; i < this.navList.length; i++) {
if (this.navList[i].id == this.itemClass) { if (this.navList[i].id == this.categoryId) {
this.navActive = i this.navActive = i
break; break;
} }
...@@ -87,8 +88,8 @@ export default { ...@@ -87,8 +88,8 @@ export default {
}); });
}, },
getGoodsList() { getGoodsList() {
goodsList({categoryId: this.itemClass}).then(res => { goodsList({categoryId: this.categoryId}).then(res => {
this.goodsList= res.data.data.goodsList this.goodsList= res.data.data.list
}); });
}, },
}, },
......
...@@ -30,6 +30,7 @@ ...@@ -30,6 +30,7 @@
</template> </template>
<script> <script>
import { goodsList } from '@/api/api';
import ItemGroup from '@/components/item-group/'; import ItemGroup from '@/components/item-group/';
import IsEmpty from '@/components/is-empty/'; import IsEmpty from '@/components/is-empty/';
import ItemCardHori from '@/components/item-card-hori/'; import ItemCardHori from '@/components/item-card-hori/';
...@@ -78,7 +79,6 @@ export default { ...@@ -78,7 +79,6 @@ export default {
methods: { methods: {
initData() { initData() {
// debugger;
this.items = []; this.items = [];
return this.$reqGet( return this.$reqGet(
...@@ -86,7 +86,7 @@ export default { ...@@ -86,7 +86,7 @@ export default {
{ {
keyword: this.searchVal, keyword: this.searchVal,
page: 1, page: 1,
size: 100, limit: 100,
sort: 'name', sort: 'name',
order: 'desc', order: 'desc',
categoryId: 0 categoryId: 0
......
...@@ -12,19 +12,19 @@ ...@@ -12,19 +12,19 @@
</div> </div>
</div> </div>
<div class="item_search_history"> <div class="item_search_history">
<word-tag <van-tag
plain
v-for="(his, i) in wordHistory" v-for="(his, i) in wordHistory"
:key="i" :key="i"
@click="toSearchResult(his)" @click="toSearchResult(his)"
>{{his}}</word-tag> >{{his}}</van-tag>
</div> </div>
</div> </div>
</div> </div>
</template> </template>
<script> <script>
import { Search } from 'vant'; import { Search, Tag } from 'vant';
import SrarchTag from './search-tag';
export default { export default {
data() { data() {
...@@ -78,7 +78,7 @@ export default { ...@@ -78,7 +78,7 @@ export default {
}, },
components: { components: {
[Search.name]: Search, [Search.name]: Search,
[SrarchTag.name]: SrarchTag [Tag.name]: Tag
} }
}; };
</script> </script>
......
<template>
<span class="search_tag" @click="OnClick">
<slot></slot>
</span>
</template>
<script>
export default {
name: 'word-tag',
methods: {
OnClick() {
this.$emit('click');
}
}
};
</script>
<style lang="scss" scoped>
.search_tag {
display: inline-block;
font-size: 12px;
background-color: #f4f4f4;
padding: 3px 10px;
border-radius: 11px;
min-width: 20px;
text-align: center;
}
</style>
<template> <template>
<div class="tab_class">
<div class="tal_class_searchBox">
<van-search placeholder="点击前往搜索"/>
<div class="tal_class_searchMask" @click="$router.push({ name: 'search' })"></div>
</div>
<div class="class_tree clearfix"> <div class="class_tree clearfix">
<ul class="class_tree_nav"> <ul class="class_tree_nav">
<li <li
v-for="(item ,index) in list" v-for="(item, index) in categoryList"
:key="item.id" :key="index"
:class="{active_nav: navActive == index}" :class="{active_nav: currentCategory.id == item.id}"
@click="navclick(index)" @click="changeCatalog(item.id)"
>{{item.name}}</li> >{{item.name}}</li>
</ul> </ul>
<div class="class_tree_content"> <div class="class_tree_content">
...@@ -16,7 +22,7 @@ ...@@ -16,7 +22,7 @@
<span>{{currentCategory.desc}}</span> <span>{{currentCategory.desc}}</span>
</div> </div>
<div class="class_tree_items_wrap clearfix"> <div class="class_tree_items_wrap clearfix">
<div @click="classClick(item.id)" :key="i" v-for="(item, i) in goods"> <div @click="toItemList(item.id)" :key="i" v-for="(item, i) in currentSubCategoryList">
<div class="class_tree_item_img"> <div class="class_tree_item_img">
<img :src="item.picUrl" :alt="item.name"> <img :src="item.picUrl" :alt="item.name">
</div> </div>
...@@ -25,62 +31,84 @@ ...@@ -25,62 +31,84 @@
</div> </div>
</div> </div>
</div> </div>
</div>
</template> </template>
<script> <script>
export default { import { catalogList, catalogCurrent } from '@/api/api';
name: 'class-tree',
model: {
prop: 'activeIndex'
},
props: { import { Search } from 'vant';
activeIndex: {
type: Number,
default: 0
},
list: {
type: Array,
default: () => []
}
},
export default {
data() { data() {
const navActive =
this.activeIndex >= this.list.length ? 0 : this.activeIndex;
return { return {
navActive, categoryList: [],
goods: [], currentCategory: {},
currentCategory: {} currentSubCategoryList: []
}; };
}, },
computed: {}, created() {
this.initData();
},
methods: { methods: {
changeList(data) { initData() {
this.goods = data.currentSubCategory; catalogList().then(res => {
this.currentCategory = data.currentCategory; let data = res.data.data;
console.log(this.goods); this.categoryList = data.categoryList;
}, this.currentCategory = res.data.data.currentCategory;
allClick() { this.currentSubCategoryList = data.currentSubCategory;
this.$emit('all-click'); });
}, },
navclick(i) { changeCatalog(id) {
this.navActive = i; catalogCurrent({ id: id}).then(res => {
this.$emit('nav-click', this.list[i].id); let data = res.data.data;
this.currentCategory = data.currentCategory;
this.currentSubCategoryList = data.currentSubCategory;
});
}, },
classClick(id) { toItemList(id) {
this.$emit('class-click', id); this.$router.push({
name: 'list',
query: { keyword: '', itemClass: id }
});
} }
},
components: {
[Search.name]: Search
} }
}; };
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
@import '../../assets/scss/mixin'; @import '../../assets/scss/mixin';
.tab_class {
overflow: hidden;
background-color: #fff;
}
.height-fix {
padding-bottom: 42px;
}
.tal_class_searchBox {
position: relative;
}
.tal_class_searchMask {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 9;
}
.box { .box {
width: 250px; width: 250px;
height: 20px; height: 20px;
...@@ -107,7 +135,7 @@ export default { ...@@ -107,7 +135,7 @@ export default {
float: left; float: left;
width: 100px; width: 100px;
height: 100%; height: 100%;
background-color: #f8f8f8; background-color: #fff;
overflow: scroll; overflow: scroll;
> li { > li {
@include one-border; @include one-border;
......
<template>
<div class="tab_class">
<div class="tal_class_searchBox">
<van-search placeholder="点击前往搜索"/>
<div class="tal_class_searchMask" @click="$router.push({ name: 'search' })"></div>
</div>
<class-tree
ref="classTree"
class="height-fix42"
@nav-click="changeCatalog"
@class-click="toItemList"
@all-click="toItemList"
:list="list"
></class-tree>
<is-empty v-if="isEmpty">抱歉,店主还未上架商品</is-empty>
</div>
</template>
<script>
import { catalogList } from '@/api/api';
import getLocationParam from '@/utils/location-param';
import { Search } from 'vant';
import classTree from './tabbar-class-tree';
import IsEmpty from '@/components/is-empty';
import _ from 'lodash';
import { async } from 'q';
function getIndex(arr, keyWord) {
let index = 0;
_.each(arr, (v, k) => {
if (v.id === keyWord) {
index = k;
return false;
}
});
return index;
}
export default {
data() {
return {
list: [],
subCategory: [],
isEmpty: false
};
},
created() {
this.initData();
},
methods: {
initData() {
catalogList().then(res => {
this.list = res.data.data.categoryList;
this.$refs.classTree.changeList(res.data.data);
this.subCategory = res.data.data.currentSubCategory;
if (this.subCategory.length === 0) this.isEmpty = true;
});
},
removeNoChild(data) {
return data.filter(item => item.children && item.children.length);
},
changeCatalog(id) {
catalogList({ id: id}).then(res => {
let index = getIndex(this.list, res.data.data.currentCategory.id);
this.$refs.classTree.changeList(res.data.data);
this.subCategory = res.data.data.currentSubCategory;
if (this.subCategory.length === 0) this.isEmpty = true;
});
},
toItemList(id) {
this.$router.push({
name: 'list',
query: { keyword: '', itemClass: id }
});
}
},
components: {
[Search.name]: Search,
[classTree.name]: classTree,
[IsEmpty.name]: IsEmpty
}
};
</script>
<style scoped>
.tab_class {
overflow: hidden;
background-color: #fff;
}
.height-fix {
padding-bottom: 42px;
}
.tal_class_searchBox {
position: relative;
}
.tal_class_searchMask {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 9;
}
</style>
...@@ -73,7 +73,7 @@ export default { ...@@ -73,7 +73,7 @@ export default {
init(i) { init(i) {
let status = i || this.activeIndex; let status = i || this.activeIndex;
couponMyList({status: status}).then(res => { couponMyList({status: status}).then(res => {
this.couponList = res.data.data.data; this.couponList = res.data.data.list;
}); });
}, },
handleTabClick(index) { handleTabClick(index) {
......
...@@ -25,7 +25,7 @@ export default { ...@@ -25,7 +25,7 @@ export default {
methods: { methods: {
getIssueList() { getIssueList() {
issueList().then(res => { issueList().then(res => {
this.issueList = res.data.data.data this.issueList = res.data.data.list
}) })
} }
}, },
......
...@@ -92,7 +92,7 @@ export default { ...@@ -92,7 +92,7 @@ export default {
init(i) { init(i) {
let showType = i || this.activeIndex; let showType = i || this.activeIndex;
orderList({showType: showType}).then(res => { orderList({showType: showType}).then(res => {
this.orderList = res.data.data.data; this.orderList = res.data.data.list;
}); });
}, },
delOrder(i) { delOrder(i) {
......
<template> <template>
<div> <div>
<van-cell-group> <van-cell-group>
<van-cell title="我的电子券" isLink> <van-cell title="我的优惠券" isLink>
<router-link to="/user/orderEle/list/0" class="text-desc">全部电子</router-link> <router-link to="/user/coupon/list/0" class="text-desc">全部优惠</router-link>
</van-cell> </van-cell>
</van-cell-group> </van-cell-group>
<van-row class="ecoupon_status"> <van-row class="coupon_status">
<van-col span="8"> <van-col span="8">
<div class="ecoupon_status_icon" @click="$router.push({path: '/user/orderEle/list/0'})"> <div class="coupon_status_icon" @click="$router.push({path: '/user/coupon/list/0'})">
<van-icon name="coupon" /> <van-icon name="coupon" />
</div> </div>
<div>待使用</div> <div>待使用</div>
</van-col> </van-col>
<van-col span="8"> <van-col span="8">
<div class="ecoupon_status_icon" @click="$router.push({path: '/user/orderEle/list/1'})"> <div class="coupon_status_icon" @click="$router.push({path: '/user/coupon/list/1'})">
<van-icon name="coupon-used" /> <van-icon name="coupon-used" />
</div> </div>
<div>已使用</div> <div>已使用</div>
</van-col> </van-col>
<van-col span="8"> <van-col span="8">
<div class="ecoupon_status_icon" @click="$router.push({path: '/user/orderEle/list/2'})"> <div class="coupon_status_icon" @click="$router.push({path: '/user/coupon/list/2'})">
<van-icon name="coupon-due" /> <van-icon name="coupon-due" />
</div> </div>
<div>过期关闭</div> <div>过期关闭</div>
...@@ -34,7 +34,7 @@ ...@@ -34,7 +34,7 @@
import { Row, Col } from 'vant'; import { Row, Col } from 'vant';
export default { export default {
name: 'ecoupon-group', name: 'coupon-group',
components: { components: {
[Row.name]: Row, [Row.name]: Row,
[Col.name]: Col [Col.name]: Col
...@@ -45,7 +45,7 @@ export default { ...@@ -45,7 +45,7 @@ export default {
<style scoped lang="scss"> <style scoped lang="scss">
@import '../../assets/scss/mixin'; @import '../../assets/scss/mixin';
.ecoupon_status { .coupon_status {
background-color: #fff; background-color: #fff;
text-align: center; text-align: center;
padding: 10px 0; padding: 10px 0;
...@@ -67,7 +67,7 @@ export default { ...@@ -67,7 +67,7 @@ export default {
} }
} }
.ecoupon_status_icon { .coupon_status_icon {
position: relative; position: relative;
width: 36px; width: 36px;
height: 36px; height: 36px;
......
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
<div class="tabbar-user"> <div class="tabbar-user">
<user-header :isLogin="isLogin"/> <user-header :isLogin="isLogin"/>
<order-group/> <order-group/>
<ecoupon-group/> <coupon-group/>
<user-module/> <user-module/>
<van-button size="large" class="tabbar-user__quit" v-if="isLogin" @click="quit">退出当前账户</van-button> <van-button size="large" class="tabbar-user__quit" v-if="isLogin" @click="quit">退出当前账户</van-button>
</div> </div>
...@@ -11,7 +11,7 @@ ...@@ -11,7 +11,7 @@
<script> <script>
import userHeader from './tabbar-user-header'; import userHeader from './tabbar-user-header';
import orderGroup from './tabbar-user-order'; import orderGroup from './tabbar-user-order';
import ecouponGroup from './tabbar-user-ecoupon'; import couponGroup from './tabbar-user-coupon';
import userModule from './tabbar-user-module'; import userModule from './tabbar-user-module';
import { removeLocalStorage } from '@/utils/local-storage'; import { removeLocalStorage } from '@/utils/local-storage';
...@@ -42,7 +42,7 @@ export default { ...@@ -42,7 +42,7 @@ export default {
components: { components: {
[userHeader.name]: userHeader, [userHeader.name]: userHeader,
[orderGroup.name]: orderGroup, [orderGroup.name]: orderGroup,
[ecouponGroup.name]: ecouponGroup, [couponGroup.name]: couponGroup,
[userModule.name]: userModule [userModule.name]: userModule
} }
}; };
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment