Loki
/
fish-uniapp
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

修改商品详情跳转错误的问题

master
anhaogxs 4 years ago
parent
2e7539fb4d
commit
fa00b519ce
1 changed files with 303 additions and 305 deletions
Unified View
  1. 608
      pages/shop/GoodsList/index.vue

608
pages/shop/GoodsList/index.vue
Unescape View File

@ -1,314 +1,312 @@
<template> <template>
<view class="productList" ref="container"> <view class="productList" ref="container">
<form @submit.prevent="submitForm"> <form @submit.prevent="submitForm">
<view class="search bg-color-red acea-row row-between-wrapper"> <view class="search bg-color-red acea-row row-between-wrapper">
<view class="input acea-row row-between-wrapper"> <view class="input acea-row row-between-wrapper">
<input placeholder="搜索商品信息" v-model="where.keyword" /> <input placeholder="搜索商品信息" v-model="where.keyword" />
<text class="iconfont icon-sousuo" @click="submitForm"></text> <text class="iconfont icon-sousuo" @click="submitForm"></text>
</view> </view>
<view class="iconfont" :class="Switch === true ? 'icon-pailie' : 'icon-tupianpailie'" @click="switchTap"></view> <view class="iconfont" :class="Switch === true ? 'icon-pailie' : 'icon-tupianpailie'" @click="switchTap"></view>
</view> </view>
</form> </form>
<view class="nav acea-row row-middle"> <view class="nav acea-row row-middle">
<view class="item" :class="title ? 'font-color-red' : ''" @click="set_where(0)">{{ title ? title : '默认' }}</view> <view class="item" :class="title ? 'font-color-red' : ''" @click="set_where(0)">{{ title ? title : '默认' }}</view>
<view class="item" @click="set_where(1)"> <view class="item" @click="set_where(1)">
价格 价格
<image src="@/static/images/horn.png" v-if="price === 0" /> <image src="@/static/images/horn.png" v-if="price === 0" />
<image src="@/static/images/up.png" v-if="price === 1" /> <image src="@/static/images/up.png" v-if="price === 1" />
<image src="@/static/images/down.png" v-if="price === 2" /> <image src="@/static/images/down.png" v-if="price === 2" />
</view> </view>
<view class="item" @click="set_where(2)"> <view class="item" @click="set_where(2)">
销量 销量
<image src="@/static/images/horn.png" v-if="stock === 0" /> <image src="@/static/images/horn.png" v-if="stock === 0" />
<image src="@/static/images/up.png" v-if="stock === 1" /> <image src="@/static/images/up.png" v-if="stock === 1" />
<image src="@/static/images/down.png" v-if="stock === 2" /> <image src="@/static/images/down.png" v-if="stock === 2" />
</view> </view>
<!-- down --> <!-- down -->
<view class="item" :class="nows ? 'font-color-red' : ''" @click="set_where(3)">新品</view> <view class="item" :class="nows ? 'font-color-red' : ''" @click="set_where(3)">新品</view>
</view> </view>
<view class="list acea-row row-between-wrapper" :class="Switch === true ? '' : 'on'" ref="container" v-if="!isIntegral"> <view class="list acea-row row-between-wrapper" :class="Switch === true ? '' : 'on'" ref="container" v-if="!isIntegral">
<view @click="goGoodsCon(item)" class="item" :class="Switch === true ? '' : 'on'" v-for="(item, productListIndex) in productList" <view @click="goGoodsCon(item)" class="item" :class="Switch === true ? '' : 'on'" v-for="(item, productListIndex) in productList" :key="productListIndex" :title="item.storeName">
:key="productListIndex" :title="item.storeName"> <view class="pictrue" :class="Switch === true ? '' : 'on'">
<view class="pictrue" :class="Switch === true ? '' : 'on'"> <image :src="item.image" :class="Switch === true ? '' : 'on'" />
<image :src="item.image" :class="Switch === true ? '' : 'on'" /> </view>
</view> <view class="text" :class="Switch === true ? '' : 'on'">
<view class="text" :class="Switch === true ? '' : 'on'"> <view class="name line1">{{ item.storeName }}</view>
<view class="name line1">{{ item.storeName }}</view> <view class="money font-color-red" :class="Switch === true ? '' : 'on'">
<view class="money font-color-red" :class="Switch === true ? '' : 'on'"> ￥
￥ <text class="num">{{ item.price }}</text>
<text class="num">{{ item.price }}</text> </view>
</view> <view class="vip acea-row row-between-wrapper" :class="Switch === true ? '' : 'on'">
<view class="vip acea-row row-between-wrapper" :class="Switch === true ? '' : 'on'"> <view class="vip-money">￥{{ item.otPrice }}</view>
<view class="vip-money">￥{{ item.otPrice }}</view> <view>已售{{ item.sales }}件</view>
<view>已售{{ item.sales }}件</view> </view>
</view> </view>
</view> </view>
</view> </view>
</view> <view class="list acea-row row-between-wrapper" :class="Switch === true ? '' : 'on'" ref="container" v-if="isIntegral == 'true'">
<view class="list acea-row row-between-wrapper" :class="Switch === true ? '' : 'on'" ref="container" v-if="isIntegral == 'true'"> <view @click="goIntegralGoodsCon(item)" class="item" :class="Switch === true ? '' : 'on'" v-for="(item, productListIndex) in productList" :key="productListIndex" :title="item.storeName">
<view @click="goGoodsCon(item)" class="item" :class="Switch === true ? '' : 'on'" v-for="(item, productListIndex) in productList" <view class="pictrue" :class="Switch === true ? '' : 'on'">
:key="productListIndex" :title="item.storeName"> <image :src="item.image" :class="Switch === true ? '' : 'on'" />
<view class="pictrue" :class="Switch === true ? '' : 'on'"> </view>
<image :src="item.image" :class="Switch === true ? '' : 'on'" /> <view class="text" :class="Switch === true ? '' : 'on'">
</view> <view class="name line1">{{ item.storeName }}</view>
<view class="text" :class="Switch === true ? '' : 'on'"> <view class="money font-color-red" :class="Switch === true ? '' : 'on'">
<view class="name line1">{{ item.storeName }}</view> <text class="num">{{ item.price }}积分</text>
<view class="money font-color-red" :class="Switch === true ? '' : 'on'"> </view>
<text class="num">{{ item.price }}积分</text> <view class="vip acea-row row-between-wrapper" :class="Switch === true ? '' : 'on'">
</view> <!-- <view class="vip-money">￥{{ item.otPrice }}</view> -->
<view class="vip acea-row row-between-wrapper" :class="Switch === true ? '' : 'on'"> <view>已售{{ item.sales }}件</view>
<!-- <view class="vip-money">￥{{ item.otPrice }}</view> --> </view>
<view>已售{{ item.sales }}件</view> </view>
</view> </view>
</view> </view>
</view> <Loading :loaded="loadend" :loading="loading"></Loading>
</view> <view class="noCommodity" style="background-color: #fff" v-if="productList.length === 0 && where.page > 1">
<Loading :loaded="loadend" :loading="loading"></Loading> <view class="noPictrue">
<view class="noCommodity" style="background-color: #fff" v-if="productList.length === 0 && where.page > 1"> <image src="@/static/images/noGood.png" class="image" />
<view class="noPictrue"> </view>
<image src="@/static/images/noGood.png" class="image" /> </view>
</view> <Recommend v-if="productList.length === 0 && where.page > 1" :recommendLoading="recommendLoading" @changeRecommendLoading="changeRecommendLoading"></Recommend>
</view> </view>
<Recommend v-if="productList.length === 0 && where.page > 1" :recommendLoading="recommendLoading"
@changeRecommendLoading="changeRecommendLoading"></Recommend>
</view>
</template> </template>
<script> <script>
import Recommend from '@/components/Recommend' import Recommend from '@/components/Recommend'
import { import { getProducts, getProductsIntegral } from '@/api/store'
getProducts, import Loading from '@/components/Loading'
getProductsIntegral
} from '@/api/store'
import Loading from '@/components/Loading'
export default { export default {
name: 'GoodsList', name: 'GoodsList',
components: { components: {
Recommend, Recommend,
Loading, Loading,
}, },
props: {}, props: {},
data: function() { data: function () {
// const { s = "", id = 0, title = "" } = this.$yroute.query; // const { s = "", id = 0, title = "" } = this.$yroute.query;
const s = '', const s = '',
id = 0, id = 0,
title = '' title = ''
return { return {
hostProduct: [], hostProduct: [],
productList: [], productList: [],
Switch: true, Switch: true,
where: { where: {
page: 1, page: 1,
limit: 8, limit: 8,
keyword: s, keyword: s,
sid: id, //二级分类id sid: id, //二级分类id
news: 0, news: 0,
priceOrder: '', priceOrder: '',
salesOrder: '', salesOrder: '',
}, },
title: title && id ? title : '', title: title && id ? title : '',
loadTitle: '', loadTitle: '',
loading: false, loading: false,
loadend: false, loadend: false,
price: 0, price: 0,
stock: 0, stock: 0,
nows: false, nows: false,
recommendLoading: false, recommendLoading: false,
target: false, target: false,
isIntegral: false, isIntegral: false,
} }
}, },
watch: { watch: {
title() { title() {
this.updateTitle() this.updateTitle()
}, },
isIntegral() { isIntegral() {
if (this.isIntegral) { if (this.isIntegral) {
uni.setNavigationBarTitle({ uni.setNavigationBarTitle({
title: '积分商品' title: '积分商品',
}); })
} else { } else {
uni.setNavigationBarTitle({ uni.setNavigationBarTitle({
title: '商品列表' title: '商品列表',
}); })
} }
},
$yroute(to) {
// if (to.name !== "GoodsList") return;
// const { s = "", id = 0, title = "" } = to.query;
// if (s !== this.where.keyword || id !== this.where.sid) {
// this.where.keyword = s;
// this.loadend = false;
// this.loading = false;
// this.where.page = 1;
// this.where.sid = id;
// this.title = title && id ? title : "";
// this.nows = false;
// this.$set(this, "productList", []);
// this.price = 0;
// this.stock = 0;
// this.getProductList();
// }
},
},
mounted: function () {
const { s = '', id = 0, title = '', isIntegral = false } = this.$yroute.query
}, this.where.keyword = s
$yroute(to) { this.where.isIntegral = isIntegral == 'true' ? 1 : 0
// if (to.name !== "GoodsList") return; this.isIntegral = isIntegral
// const { s = "", id = 0, title = "" } = to.query; this.updateTitle()
// if (s !== this.where.keyword || id !== this.where.sid) { this.getProductList()
// this.where.keyword = s; },
// this.loadend = false; onReachBottom() {
// this.loading = false; this.recommendLoading = true
// this.where.page = 1; !this.loading && this.getProductList()
// this.where.sid = id; },
// this.title = title && id ? title : ""; onHide() {
// this.nows = false; // this.hostProduct = [];
// this.$set(this, "productList", []); // this.productList = [];
// this.price = 0; // this.Switch = true;
// this.stock = 0; // this.where = {
// this.getProductList(); // page: 1,
// } // limit: 8,
}, // keyword: s,
}, // sid: id, //二级分类id
mounted: function() { // news: 0,
const { // priceOrder: "",
s = '', id = 0, title = '', isIntegral = false // salesOrder: ""
} = this.$yroute.query; // };
// this.loadTitle = "";
this.where.keyword = s // this.loading = false;
this.where.isIntegral = isIntegral == 'true' ? 1 : 0 // this.loadend = false;
this.isIntegral = isIntegral // this.price = 0;
this.updateTitle() // this.stock = 0;
this.getProductList() // this.nows = fals;
}, },
onReachBottom() { methods: {
this.recommendLoading = true; changeRecommendLoading(recommendLoading) {
!this.loading && this.getProductList() this.recommendLoading = recommendLoading
}, },
onHide() { goGoodsCon(item) {
// this.hostProduct = []; this.$yrouter.push({
// this.productList = []; path: '/pages/shop/GoodsCon/index',
// this.Switch = true; query: {
// this.where = { id: item.id,
// page: 1, isIntegral: this.isIntegral,
// limit: 8, },
// keyword: s, })
// sid: id, //二级分类id },
// news: 0, goIntegralGoodsCon(item) {
// priceOrder: "", this.$yrouter.push({
// salesOrder: "" path: '/pages/shop/IntegralGoodsCon/index',
// }; query: {
// this.loadTitle = ""; id: item.id,
// this.loading = false; isIntegral: this.isIntegral,
// this.loadend = false; },
// this.price = 0; })
// this.stock = 0; },
// this.nows = fals; updateTitle() {
}, uni.setNavigationBarTitle({
methods: { title: this.title,
changeRecommendLoading(recommendLoading) { })
this.recommendLoading = recommendLoading // document.title = this.title || this.$yroute.meta.title;
}, },
goGoodsCon(item) { getProductList() {
this.$yrouter.push({ var that = this
path: '/pages/shop/IntegralGoodsCon/index', this.setWhere()
query: { // if (to.name !== "GoodsList") return;
id: item.id, const { s = '', id = 0, title = '' } = this.$yroute.query
isIntegral: this.isIntegral, if (s !== this.where.keyword || id !== this.where.sid) {
}, this.loadend = false
}) this.loading = false
}, this.where.page = 1
updateTitle() { this.where.sid = id
uni.setNavigationBarTitle({ this.title = title && id ? title : ''
title: this.title this.nows = false
}); this.$set(this, 'productList', [])
// document.title = this.title || this.$yroute.meta.title; this.price = 0
}, this.stock = 0
getProductList() { // this.getProductList();
var that = this }
this.setWhere() let q = that.where
// if (to.name !== "GoodsList") return; let getData = this.isIntegral !== 'true' ? getProducts : getProductsIntegral
const { getData(q).then(res => {
s = '', id = 0, title = '' that.loading = false
} = this.$yroute.query if (that.target) {
if (s !== this.where.keyword || id !== this.where.sid) { that.productList = res.data
this.loadend = false } else {
this.loading = false that.productList.push.apply(that.productList, res.data)
this.where.page = 1 }
this.where.sid = id that.target = false
this.title = title && id ? title : '' that.loadend = res.data.length < that.where.limit //判断所有数据是否加载完成；
this.nows = false that.where.page = that.where.page + 1
this.$set(this, 'productList', []) })
this.price = 0 },
this.stock = 0 submitForm: function () {
// this.getProductList(); this.$set(this, 'productList', [])
} this.where.page = 1
let q = that.where this.loadend = false
let getData = this.isIntegral !== 'true' ? getProducts : getProductsIntegral this.loading = false
getData(q).then(res => { this.getProductList()
that.loading = false },
if (that.target) { //点击事件处理
that.productList = res.data set_where: function (index) {
} else { let that = this
that.productList.push.apply(that.productList, res.data) switch (index) {
} case 0:
that.target = false return that.$yrouter.push({
that.loadend = res.data.length < that.where.limit //判断所有数据是否加载完成； path: '/pages/shop/GoodsClass/index',
that.where.page = that.where.page + 1 })
}) case 1:
}, if (that.price === 0) that.price = 1
submitForm: function() { else if (that.price === 1) that.price = 2
this.$set(this, 'productList', []) else if (that.price === 2) that.price = 0
this.where.page = 1 that.stock = 0
this.loadend = false break
this.loading = false case 2:
this.getProductList() if (that.stock === 0) that.stock = 1
}, else if (that.stock === 1) that.stock = 2
//点击事件处理 else if (that.stock === 2) that.stock = 0
set_where: function(index) { that.price = 0
let that = this break
switch (index) { case 3:
case 0: that.nows = !that.nows
return that.$yrouter.push({ break
path: '/pages/shop/GoodsClass/index', default:
}) break
case 1: }
if (that.price === 0) that.price = 1 this.productList = []
else if (that.price === 1) that.price = 2 that.$set(that, 'productList', [])
else if (that.price === 2) that.price = 0 that.where.page = 1
that.stock = 0 that.target = true
break that.loadend = false
case 2: that.getProductList()
if (that.stock === 0) that.stock = 1 },
else if (that.stock === 1) that.stock = 2 //设置where条件
else if (that.stock === 2) that.stock = 0 setWhere: function () {
that.price = 0 let that = this
break if (that.price === 0) {
case 3: that.where.priceOrder = ''
that.nows = !that.nows } else if (that.price === 1) {
break that.where.priceOrder = 'asc'
default: } else if (that.price === 2) {
break that.where.priceOrder = 'desc'
} }
this.productList = [] if (that.stock === 0) {
that.$set(that, 'productList', []) that.where.salesOrder = ''
that.where.page = 1 } else if (that.stock === 1) {
that.target = true that.where.salesOrder = 'asc'
that.loadend = false } else if (that.stock === 2) {
that.getProductList() that.where.salesOrder = 'desc'
}, }
//设置where条件 that.where.news = that.nows ? '1' : '0'
setWhere: function() { },
let that = this switchTap: function () {
if (that.price === 0) { let that = this
that.where.priceOrder = '' that.Switch = !that.Switch
} else if (that.price === 1) { },
that.where.priceOrder = 'asc' },
} else if (that.price === 2) { }
that.where.priceOrder = 'desc'
}
if (that.stock === 0) {
that.where.salesOrder = ''
} else if (that.stock === 1) {
that.where.salesOrder = 'asc'
} else if (that.stock === 2) {
that.where.salesOrder = 'desc'
}
that.where.news = that.nows ? '1' : '0'
},
switchTap: function() {
let that = this
that.Switch = !that.Switch
},
},
}
</script> </script>
<style scoped lang="less"> <style scoped lang="less">
.noCommodity { .noCommodity {
border-top: 3px solid #f5f5f5; border-top: 3px solid #f5f5f5;
padding-bottom: 1px; padding-bottom: 1px;
} }
</style> </style>

Write Preview
Loading…
Cancel
Save