clay
/
ceramic
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Merge pull request '邓洁 : 修改产品中心bug' (#21) from dj into master 

Reviewed-on: #21
This commit is contained in:
odjbin 2023-05-22 17:20:59 +00:00
parent 66aaace5da 0a009302ee
commit 92e131fd39
2 changed files with 166 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
src/router/index.js
View File

@ -47,6 +47,12 @@ const routes = [
name: 'products_center', name: 'products_center',
component: () => import('../views/productsCenter/index') component: () => import('../views/productsCenter/index')
}, },
{
path: '/products_center/:menu/:menuTitle',
name: 'products_center',
props:true,
component: () => import('../views/productsCenter/index')
},
{ {
path: '/products_detail', path: '/products_detail',
name: 'products_detail', name: 'products_detail',

187
src/views/productsCenter/index.vue
View File

@ -38,7 +38,7 @@
<PicturesBox :image-list="imgList" :type="33"/> <PicturesBox :image-list="imgList" :type="33"/>
<Pagination :currentPage="1" :total="total" :pageSize="pageSize" @pageChange="handleChangePage" <Pagination :currentPage="1" :total="total" :pageSize="pageSize" @pageChange="handleChangePage"
v-if="showPagination"/> v-if="showPagination"/>
<div class="nullData" v-if="showNull"> <div class="nullData" v-show="showNull">
暂时没有数据！ 暂时没有数据！
</div> </div>
</div> </div>
@ -69,7 +69,7 @@ export default {
}, },
watch: { watch: {
$route(to) { $route(to) {
if (to.query.menu) { if (to.query.menu!==undefined&&to.query.classify===undefined&&to.query.style===undefined&&to.query.space===undefined) {
for (let i = 0; i < this.productTabs.length; i++) { for (let i = 0; i < this.productTabs.length; i++) {
if (this.productTabs[i].id == to.query.menu) { if (this.productTabs[i].id == to.query.menu) {
this.$refs.ProductsTabsItem.activeName = i + ""; this.$refs.ProductsTabsItem.activeName = i + "";
@ -88,6 +88,12 @@ export default {
this.imgList = res.data.list; this.imgList = res.data.list;
}); });
} }
if(to.query.classify!==0&&to.query.classify!==undefined){
this.getGoodsList(to.query.classify, 1, this.pageSize, to.query.style, to.query.space);
} else if (to.query.classify == 0) {
this.getGoodsList(to.query.menu, 1, this.pageSize, to.query.style, to.query.space);
}
} }
}, },
beforeUpdate() { beforeUpdate() {
@ -98,34 +104,59 @@ export default {
} }
} }
} }
if (this.$route.query.menuTitle) { if (this.$route.query.classify) {
for (let i = 0; i < this.classifyList.length; i++) { for (let i = 0; i < this.classifyList.length; i++) {
const red = document.getElementById("classify_" + i); const red = document.getElementById("classify_" + i);
if (this.classifyList[i].name == this.$route.query.menuTitle) { if (this.classifyList[i].id == this.$route.query.classify) {
red.style = "color: #f00!important;text-decoration: underline!important;"; red.style = "color: #f00!important;text-decoration: underline!important;";
} else { } else {
red.style = "color: #000!important;"; red.style = "color: #000!important;";
} }
} }
}else {
for (let i = 0; i < this.classifyList.length; i++) {
const red = document.getElementById("classify_" + i);
red.style = "color: #000!important;";
}
}
if (this.$route.query.space) {
for (let i = 0; i < this.spaceList.length; i++) { for (let i = 0; i < this.spaceList.length; i++) {
const red = document.getElementById("space_" + i); const red = document.getElementById("space_" + i);
if (this.spaceList[i].title == this.$route.query.menuTitle) { if (this.spaceList[i].title == this.$route.query.space) {
red.style = "color: #f00!important;text-decoration: underline!important;"; red.style = "color: #f00!important;text-decoration: underline!important;";
} else { } else {
red.style = "color: #000!important;"; red.style = "color: #000!important;";
} }
} }
}else {
for (let i = 0; i < this.spaceList.length; i++) {
const red = document.getElementById("space_" + i);
red.style = "color: #000!important;";
}
}
if (this.$route.query.style) {
for (let i = 0; i < this.styleList.length; i++) { for (let i = 0; i < this.styleList.length; i++) {
const red = document.getElementById("style_" + i); const red = document.getElementById("style_" + i);
if (this.styleList[i].title == this.$route.query.menuTitle) { if (this.styleList[i].title == this.$route.query.style) {
red.style = "color: #f00!important;text-decoration: underline!important;"; red.style = "color: #f00!important;text-decoration: underline!important;";
} else { } else {
red.style = "color: #000!important;"; red.style = "color: #000!important;";
} }
} }
}else {
for (let i = 0; i < this.styleList.length; i++) {
const red = document.getElementById("style_" + i);
red.style = "color: #000!important;";
}
} }
}, },
mounted() { mounted() {
if(this.$route.query.menu&&this.$route.query.space){
getGoodsCategory(this.$route.query.menu).then(res => {
this.classifyList = res.data.categorylist;
});
this.getGoodsList(this.classIndex, 1, this.pageSize, "", this.$route.query.space);
}
getPublicData().then(res => { getPublicData().then(res => {
this.productTabs = res.data.goodscategory_list; this.productTabs = res.data.goodscategory_list;
}); });
@ -134,18 +165,18 @@ export default {
this.spaceList = res.data.space_list; this.spaceList = res.data.space_list;
this.styleList = res.data.style_list; this.styleList = res.data.style_list;
}); });
if (this.$route.query.menu) { if (this.$route.query.menu&&this.$route.query.space==undefined) {
//进入页面时, 获取第一个列表的类别 //进入页面时, 获取第一个列表的类别
getGoodsCategory(this.$route.query.menu).then(res => { getGoodsCategory(this.$route.query.menu).then(res => {
this.classifyList = res.data.categorylist; this.classifyList = res.data.categorylist;
}); });
this.getGoodsList(this.$route.query.menu, 1, this.pageSize); this.getGoodsList(this.$route.query.menu, 1, this.pageSize);
} else { }else if (this.$route.query.menu==undefined&&this.$route.query.space==undefined){
//进入页面时, 获取第一个列表的类别 //进入页面时, 获取第一个列表的类别
getGoodsCategory(1).then(res => { getGoodsCategory(1).then(res => {
this.classifyList = res.data.categorylist; this.classifyList = res.data.categorylist;
}); });
this.getGoodsList(0, 1, this.pageSize); this.getGoodsList(1, 1, this.pageSize);
} }
}, },
methods: { methods: {
@ -160,9 +191,12 @@ export default {
}).then(res => { }).then(res => {
this.total = res.data.count; this.total = res.data.count;
this.imgList = res.data.list; this.imgList = res.data.list;
if (res.data.list.length === 0) { if (res.data.list.length == 0) {
this.showNull = true; this.showNull = true;
this.showPagination = false; this.showPagination = false;
}else {
this.showNull = false;
this.showPagination = true;
} }
}); });
}, },
@ -170,6 +204,12 @@ export default {
handleClick(tab) { handleClick(tab) {
let index = parseInt(tab.index) + 1; let index = parseInt(tab.index) + 1;
this.classIndex = index; this.classIndex = index;
this.$router.push({
path: "/products_center",
query: {
menu: index
}
});
getGoodsCategory(index).then(res => { getGoodsCategory(index).then(res => {
this.classifyList = res.data.categorylist; this.classifyList = res.data.categorylist;
}); });
@ -181,33 +221,126 @@ export default {
}, },
//点击二级分类,筛选产品数据 //点击二级分类,筛选产品数据
changeClassify(item) { changeClassify(item) {
this.$router.push({ let menu=this.$route.query.menu
path: "/products_center", let space=this.$route.query.space
query: { let style=this.$route.query.style
menuTitle: item.name if(menu===undefined){
} const menuOne=1
}); menu=menuOne
this.getGoodsList(item.id, 1, this.pageSize); }if(space===undefined){
const menuOne=0
space=menuOne
}if(style===undefined){
const menuOne=0
style=menuOne
}
// if(space==undefined&&style==undefined){
// this.$router.push({
// path: '/products_center',
// query: {
// classify: item.name
// }
// });
// }else if(style==undefined){
// this.$router.push({
// path: `/products_center?menu=${menu}&space=${space}`,
// query: {
// classify: item.name
// }
// });
// }else if(space==undefined){
// this.$router.push({
// path: `/products_center?menu=${menu}&style=${style}`,
// query: {
// classify: item.name
// }
// });
// }else {
this.$router.push({
path: `/products_center?menu=${menu}&space=${space}&style=${style}`,
query: {
classify: item.id
}
});
// }
// this.getGoodsList(item.id, 1, this.pageSize);
}, },
//点击空间分类,筛选产品数据 //点击空间分类,筛选产品数据
changeSpace(item) { changeSpace(item) {
this.$router.push({ let menu=this.$route.query.menu
path: "/products_center", let style=this.$route.query.style
query: { let classify=this.$route.query.classify
menuTitle: item.title if(menu===undefined){
} const menuOne=1
}); menu=menuOne
this.getGoodsList(this.classIndex, 1, this.pageSize, "", item.title); }if(style===undefined){
const menuOne=0
style=menuOne
}if(classify===undefined){
const menuOne=0
classify=menuOne
}
// if(style!==undefined){
// this.$router.push({
// path: `/products_center?menu=${menu}&style=${style}`,
// query: {
// space: item.title
// }
// });
// }else if(style==undefined&&classify==undefined){
// this.$router.push({
// path: `/products_center?menu=${menu}`,
// query: {
// space: item.title
// }
// });
// }else if(style!==undefined&&space!==undefined){
this.$router.push({
path: `/products_center?menu=${menu}&classify=${classify}&style=${style}`,
query: {
space: item.title
}
});
// }
// this.getGoodsList(this.classIndex, 1, this.pageSize, "", item.title);
}, },
//点击风格分类,筛选产品数据 //点击风格分类,筛选产品数据
changeStyle(item) { changeStyle(item) {
let menu=this.$route.query.menu
let space=this.$route.query.space
let classify=this.$route.query.classify
if(menu===undefined){
const menuOne=1
menu=menuOne
} if(space===undefined){
const menuOne=0
space=menuOne
} if(classify===undefined){
const menuOne=0
classify=menuOne
}
this.$router.push({ this.$router.push({
path: "/products_center", path: `/products_center?menu=${menu}&classify=${classify}&space=${space}`,
query: { query: {
menuTitle: item.title style: item.title
} }
}); });
this.getGoodsList(this.classIndex, 1, this.pageSize, item.title, ""); // if(space!==undefined){
// this.$router.push({
// path: `/products_center?menu=${menu}&space=${space}`,
// query: {
// style: item.title
// }
// });
// }else {
// this.$router.push({
// path: `/products_center?menu=${menu}`,
// query: {
// style: item.title
// }
// });
// }
// this.getGoodsList(this.classIndex, 1, this.pageSize, item.title, "");
} }
} }
}; };