Skip to content

C
center-shop-show-pc
提交 d46c697f authored 作者: 王鹏飞's avatar 王鹏飞
浏览文件
操作

bug fixes

上级 3d56257c
隐藏空白字符变更
内嵌 并排
正在显示 包含 110 行增加 和 19 行删除
package-lock.json
浏览文件 @ d46c697f
...@@ -16,7 +16,9 @@ ...@@ -16,7 +16,9 @@
"js-cookie": "^2.2.1", "js-cookie": "^2.2.1",
"lodash": "^4.17.20", "lodash": "^4.17.20",
"qrcode.vue": "^1.7.0", "qrcode.vue": "^1.7.0",
"swiper": "^5.4.5",
"vue": "^2.6.12", "vue": "^2.6.12",
"vue-awesome-swiper": "^4.1.1",
"vue-i18n": "^8.22.0", "vue-i18n": "^8.22.0",
"vue-loader": "^15.9.3", "vue-loader": "^15.9.3",
"vue-meta-info": "^0.1.7", "vue-meta-info": "^0.1.7",
...@@ -4435,6 +4437,14 @@ ...@@ -4435,6 +4437,14 @@
"entities": "^2.0.0" "entities": "^2.0.0"
} }
}, },
"node_modules/dom7": {
"version": "2.1.5",
"resolved": "https://registry.npmjs.org/dom7/-/dom7-2.1.5.tgz",
"integrity": "sha512-xnhwVgyOh3eD++/XGtH+5qBwYTgCm0aW91GFgPJ3XG+jlsRLyJivnbP0QmUBFhI+Oaz9FV0s7cxgXHezwOEBYA==",
"dependencies": {
"ssr-window": "^2.0.0"
}
},
"node_modules/domain-browser": { "node_modules/domain-browser": {
"version": "1.2.0", "version": "1.2.0",
"resolved": "https://registry.npm.taobao.org/domain-browser/download/domain-browser-1.2.0.tgz", "resolved": "https://registry.npm.taobao.org/domain-browser/download/domain-browser-1.2.0.tgz",
...@@ -11863,6 +11873,11 @@ ...@@ -11863,6 +11873,11 @@
"node": ">=0.10.0" "node": ">=0.10.0"
} }
}, },
"node_modules/ssr-window": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/ssr-window/-/ssr-window-2.0.0.tgz",
"integrity": "sha512-NXzN+/HPObKAx191H3zKlYomE5WrVIkoCB5IaSdvKokxTpjBdWfr0RaP+1Z5KOfDT0ZVz+2tdtiBkhsEQ9p+0A=="
},
"node_modules/ssri": { "node_modules/ssri": {
"version": "6.0.2", "version": "6.0.2",
"resolved": "https://registry.nlark.com/ssri/download/ssri-6.0.2.tgz?cache=0&sync_timestamp=1621364918494&other_urls=https%3A%2F%2Fregistry.nlark.com%2Fssri%2Fdownload%2Fssri-6.0.2.tgz", "resolved": "https://registry.nlark.com/ssri/download/ssri-6.0.2.tgz?cache=0&sync_timestamp=1621364918494&other_urls=https%3A%2F%2Fregistry.nlark.com%2Fssri%2Fdownload%2Fssri-6.0.2.tgz",
...@@ -12204,6 +12219,23 @@ ...@@ -12204,6 +12219,23 @@
"node": ">=4" "node": ">=4"
} }
}, },
"node_modules/swiper": {
"version": "5.4.5",
"resolved": "https://registry.npmjs.org/swiper/-/swiper-5.4.5.tgz",
"integrity": "sha512-7QjA0XpdOmiMoClfaZ2lYN6ICHcMm72LXiY+NF4fQLFidigameaofvpjEEiTQuw3xm5eksG5hzkaRsjQX57vtA==",
"hasInstallScript": true,
"dependencies": {
"dom7": "^2.1.5",
"ssr-window": "^2.0.0"
},
"engines": {
"node": ">= 4.7.0"
},
"funding": {
"type": "patreon",
"url": "https://www.patreon.com/vladimirkharlampidi"
}
},
"node_modules/table": { "node_modules/table": {
"version": "5.4.6", "version": "5.4.6",
"resolved": "https://registry.nlark.com/table/download/table-5.4.6.tgz?cache=0&sync_timestamp=1620957104150&other_urls=https%3A%2F%2Fregistry.nlark.com%2Ftable%2Fdownload%2Ftable-5.4.6.tgz", "resolved": "https://registry.nlark.com/table/download/table-5.4.6.tgz?cache=0&sync_timestamp=1620957104150&other_urls=https%3A%2F%2Fregistry.nlark.com%2Ftable%2Fdownload%2Ftable-5.4.6.tgz",
...@@ -13200,6 +13232,18 @@ ...@@ -13200,6 +13232,18 @@
"resolved": "https://registry.nlark.com/vue/download/vue-2.6.12.tgz?cache=0&other_urls=https%3A%2F%2Fregistry.nlark.com%2Fvue%2Fdownload%2Fvue-2.6.12.tgz", "resolved": "https://registry.nlark.com/vue/download/vue-2.6.12.tgz?cache=0&other_urls=https%3A%2F%2Fregistry.nlark.com%2Fvue%2Fdownload%2Fvue-2.6.12.tgz",
"integrity": "sha1-9evU+mvShpQD4pqJau1JBEVskSM=" "integrity": "sha1-9evU+mvShpQD4pqJau1JBEVskSM="
}, },
"node_modules/vue-awesome-swiper": {
"version": "4.1.1",
"resolved": "https://registry.npmjs.org/vue-awesome-swiper/-/vue-awesome-swiper-4.1.1.tgz",
"integrity": "sha512-50um10t6N+lJaORkpwSi1wWuMmBI1sgFc9Znsi5oUykw2cO5DzLaBHcO2JNX21R+Ue4TGoIJDhhxjBHtkFrTEQ==",
"engines": {
"node": ">=8"
},
"peerDependencies": {
"swiper": "^5.2.0",
"vue": "2.x"
}
},
"node_modules/vue-eslint-parser": { "node_modules/vue-eslint-parser": {
"version": "7.6.0", "version": "7.6.0",
"resolved": "https://registry.npm.taobao.org/vue-eslint-parser/download/vue-eslint-parser-7.6.0.tgz?cache=0&sync_timestamp=1614679624052&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fvue-eslint-parser%2Fdownload%2Fvue-eslint-parser-7.6.0.tgz", "resolved": "https://registry.npm.taobao.org/vue-eslint-parser/download/vue-eslint-parser-7.6.0.tgz?cache=0&sync_timestamp=1614679624052&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fvue-eslint-parser%2Fdownload%2Fvue-eslint-parser-7.6.0.tgz",
...@@ -18062,6 +18106,14 @@ ...@@ -18062,6 +18106,14 @@
"entities": "^2.0.0" "entities": "^2.0.0"
} }
}, },
"dom7": {
"version": "2.1.5",
"resolved": "https://registry.npmjs.org/dom7/-/dom7-2.1.5.tgz",
"integrity": "sha512-xnhwVgyOh3eD++/XGtH+5qBwYTgCm0aW91GFgPJ3XG+jlsRLyJivnbP0QmUBFhI+Oaz9FV0s7cxgXHezwOEBYA==",
"requires": {
"ssr-window": "^2.0.0"
}
},
"domain-browser": { "domain-browser": {
"version": "1.2.0", "version": "1.2.0",
"resolved": "https://registry.npm.taobao.org/domain-browser/download/domain-browser-1.2.0.tgz", "resolved": "https://registry.npm.taobao.org/domain-browser/download/domain-browser-1.2.0.tgz",
...@@ -24182,6 +24234,11 @@ ...@@ -24182,6 +24234,11 @@
"tweetnacl": "~0.14.0" "tweetnacl": "~0.14.0"
} }
}, },
"ssr-window": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/ssr-window/-/ssr-window-2.0.0.tgz",
"integrity": "sha512-NXzN+/HPObKAx191H3zKlYomE5WrVIkoCB5IaSdvKokxTpjBdWfr0RaP+1Z5KOfDT0ZVz+2tdtiBkhsEQ9p+0A=="
},
"ssri": { "ssri": {
"version": "6.0.2", "version": "6.0.2",
"resolved": "https://registry.nlark.com/ssri/download/ssri-6.0.2.tgz?cache=0&sync_timestamp=1621364918494&other_urls=https%3A%2F%2Fregistry.nlark.com%2Fssri%2Fdownload%2Fssri-6.0.2.tgz", "resolved": "https://registry.nlark.com/ssri/download/ssri-6.0.2.tgz?cache=0&sync_timestamp=1621364918494&other_urls=https%3A%2F%2Fregistry.nlark.com%2Fssri%2Fdownload%2Fssri-6.0.2.tgz",
...@@ -24458,6 +24515,15 @@ ...@@ -24458,6 +24515,15 @@
"has-flag": "^3.0.0" "has-flag": "^3.0.0"
} }
}, },
"swiper": {
"version": "5.4.5",
"resolved": "https://registry.npmjs.org/swiper/-/swiper-5.4.5.tgz",
"integrity": "sha512-7QjA0XpdOmiMoClfaZ2lYN6ICHcMm72LXiY+NF4fQLFidigameaofvpjEEiTQuw3xm5eksG5hzkaRsjQX57vtA==",
"requires": {
"dom7": "^2.1.5",
"ssr-window": "^2.0.0"
}
},
"table": { "table": {
"version": "5.4.6", "version": "5.4.6",
"resolved": "https://registry.nlark.com/table/download/table-5.4.6.tgz?cache=0&sync_timestamp=1620957104150&other_urls=https%3A%2F%2Fregistry.nlark.com%2Ftable%2Fdownload%2Ftable-5.4.6.tgz", "resolved": "https://registry.nlark.com/table/download/table-5.4.6.tgz?cache=0&sync_timestamp=1620957104150&other_urls=https%3A%2F%2Fregistry.nlark.com%2Ftable%2Fdownload%2Ftable-5.4.6.tgz",
...@@ -25280,6 +25346,12 @@ ...@@ -25280,6 +25346,12 @@
"resolved": "https://registry.nlark.com/vue/download/vue-2.6.12.tgz?cache=0&other_urls=https%3A%2F%2Fregistry.nlark.com%2Fvue%2Fdownload%2Fvue-2.6.12.tgz", "resolved": "https://registry.nlark.com/vue/download/vue-2.6.12.tgz?cache=0&other_urls=https%3A%2F%2Fregistry.nlark.com%2Fvue%2Fdownload%2Fvue-2.6.12.tgz",
"integrity": "sha1-9evU+mvShpQD4pqJau1JBEVskSM=" "integrity": "sha1-9evU+mvShpQD4pqJau1JBEVskSM="
}, },
"vue-awesome-swiper": {
"version": "4.1.1",
"resolved": "https://registry.npmjs.org/vue-awesome-swiper/-/vue-awesome-swiper-4.1.1.tgz",
"integrity": "sha512-50um10t6N+lJaORkpwSi1wWuMmBI1sgFc9Znsi5oUykw2cO5DzLaBHcO2JNX21R+Ue4TGoIJDhhxjBHtkFrTEQ==",
"requires": {}
},
"vue-eslint-parser": { "vue-eslint-parser": {
"version": "7.6.0", "version": "7.6.0",
"resolved": "https://registry.npm.taobao.org/vue-eslint-parser/download/vue-eslint-parser-7.6.0.tgz?cache=0&sync_timestamp=1614679624052&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fvue-eslint-parser%2Fdownload%2Fvue-eslint-parser-7.6.0.tgz", "resolved": "https://registry.npm.taobao.org/vue-eslint-parser/download/vue-eslint-parser-7.6.0.tgz?cache=0&sync_timestamp=1614679624052&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fvue-eslint-parser%2Fdownload%2Fvue-eslint-parser-7.6.0.tgz",
package.json
浏览文件 @ d46c697f
...@@ -79,7 +79,9 @@ ...@@ -79,7 +79,9 @@
"js-cookie": "^2.2.1", "js-cookie": "^2.2.1",
"lodash": "^4.17.20", "lodash": "^4.17.20",
"qrcode.vue": "^1.7.0", "qrcode.vue": "^1.7.0",
"swiper": "^5.4.5",
"vue": "^2.6.12", "vue": "^2.6.12",
"vue-awesome-swiper": "^4.1.1",
"vue-i18n": "^8.22.0", "vue-i18n": "^8.22.0",
"vue-loader": "^15.9.3", "vue-loader": "^15.9.3",
"vue-meta-info": "^0.1.7", "vue-meta-info": "^0.1.7",
......
src/main.js
浏览文件 @ d46c697f
...@@ -8,6 +8,10 @@ import App from './app.vue' // 初始化 vue页面 ...@@ -8,6 +8,10 @@ import App from './app.vue' // 初始化 vue页面
import './style.scss' // 公共样式 import './style.scss' // 公共样式
import MetaInfo from 'vue-meta-info' import MetaInfo from 'vue-meta-info'
import Element from 'element-ui' import Element from 'element-ui'
import VueAwesomeSwiper from 'vue-awesome-swiper'
import 'swiper/css/swiper.css'
Vue.use(VueAwesomeSwiper)
// import modules from './modules' // import modules from './modules'
// import createBefore from './components/beforeEnter' // import createBefore from './components/beforeEnter'
...@@ -42,4 +46,4 @@ Vue.prototype.VueEvent = new Vue() ...@@ -42,4 +46,4 @@ Vue.prototype.VueEvent = new Vue()
// next() // next()
// }) // })
window.G.$instance_vue = new Vue({ router, i18n, render: (h) => h(App) }).$mount('#app') window.G.$instance_vue = new Vue({ router, i18n, render: h => h(App) }).$mount('#app')
src/pages/components/item.vue
浏览文件 @ d46c697f
<template> <template>
<div class="item-content"> <div class="item-content">
<router-link :to="{ path: '/buy', query: { shop_id: data.shop_id, id: data.spu_id } }"> <router-link :to="{ path: '/buy', query: { shop_id: data.shop_id, spu_id: data.spu_id } }">
<img :src="imageUrl(data.chart_oss)" /> <img :src="imageUrl(data.chart_oss)" />
</router-link> </router-link>
<div class="title">{{ data.spu_name }}</div> <div class="title">{{ data.spu_name }}</div>
......
src/pages/shop.vue
浏览文件 @ d46c697f
...@@ -5,11 +5,17 @@ ...@@ -5,11 +5,17 @@
<div class="left-con__top"> <div class="left-con__top">
<div class="swiper-box"> <div class="swiper-box">
<img class="banner" :src="swiperBanner" /> <img class="banner" :src="swiperBanner" />
<ul class="swiper-tab__btn"> <div class="swiper-tab__btn">
<li v-for="(item, index) in swiperBtnItem" :key="index" @click="tabSwiper(item)"> <swiper ref="mySwiper" :options="swiperOptions">
<img :src="item" /> <template v-for="(item, index) in swiperBtnItem">
</li> <swiper-slide :key="index"><img :src="item" @click="tabSwiper(item)" /></swiper-slide>
</ul> </template>
<div class="swiper-scrollbar" slot="scrollbar"></div>
</swiper>
<!-- <ul>
<li v-for="(item, index) in swiperBtnItem" :key="index" @click="tabSwiper(item)"></li>
</ul> -->
</div>
</div> </div>
<div class="order-detail"> <div class="order-detail">
<div class="title">{{ commodityData.spu_name }}</div> <div class="title">{{ commodityData.spu_name }}</div>
...@@ -25,7 +31,7 @@ ...@@ -25,7 +31,7 @@
<div class="name">运费</div> <div class="name">运费</div>
<div class="val">无需配送</div> <div class="val">无需配送</div>
</div> </div>
<div class="buy-btn" @click="dialogVisible = true">立即购买</div> <div class="buy-btn" @click="dialogVisible = true">{{ commodityData.buy_button_text || '立即购买' }}</div>
<div class="buy-mode"> <div class="buy-mode">
<div class="name">支付方式：</div> <div class="name">支付方式：</div>
<div class="li"> <div class="li">
...@@ -73,6 +79,7 @@ ...@@ -73,6 +79,7 @@
import QrcodeVue from 'qrcode.vue' import QrcodeVue from 'qrcode.vue'
import hotShop from './components/item' import hotShop from './components/item'
import { getCommodityDetail } from '@/api' import { getCommodityDetail } from '@/api'
export default { export default {
components: { QrcodeVue, hotShop }, components: { QrcodeVue, hotShop },
data() { data() {
...@@ -84,7 +91,15 @@ export default { ...@@ -84,7 +91,15 @@ export default {
swiperBanner: '', swiperBanner: '',
commodityData: {}, commodityData: {},
hotCommodity: [], hotCommodity: [],
dialogVisible: false dialogVisible: false,
swiperOptions: {
slidesPerView: 'auto',
spaceBetween: 10,
scrollbar: {
el: '.swiper-scrollbar',
hide: true
}
}
} }
}, },
computed: { computed: {
...@@ -147,19 +162,17 @@ export default { ...@@ -147,19 +162,17 @@ export default {
border: 1px solid #f2f2f2; border: 1px solid #f2f2f2;
} }
.swiper-tab__btn { .swiper-tab__btn {
display: flex;
margin-top: 20px; margin-top: 20px;
li { width: 420px;
cursor: pointer; .swiper-slide {
width: 58px; width: 58px;
height: 58px; height: 58px;
margin-right: 20px; }
img { img {
width: 100%; width: 58px;
height: 100%; height: 58px;
display: block; display: block;
object-fit: cover; object-fit: cover;
}
} }
} }
} }
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论