w-front-end / select_good · Commits

Commit 51986005c656039dbd7b30e9b11d98c4249b0be1

Authored by 王强
1 parent 025880f0

环球优物，开发完成，准备提测~

Inline Side-by-side
Showing 8 changed files with 436 additions and 316 deletions
src/components/swiper/swiper.vue
  View file @5198600
1 1 <template>
2 2 <div class="swiper-box" v-if="swipers && swipers.length">
3   - <swipe class="swipe" :autoplay="5000" :touchable="swipers.length===1 ? false : true" :show-indicators="swipers.showIndicators ? swipers.showIndicators : showIndicators" @change="onChange">
  3 + <swipe class="swipe" :autoplay="5000" :touchable="swipers.length===1 ? false : true" :show-indicators="options && options.showIndicators !== undefined ? options.showIndicators : showIndicators" @change="onChange">
4 4 <swipe-item class="swipe-item" v-for="(item, index) in swipers" :key="index">
5 5 <div class="item" @click="$parent.$parent.gotoDetail(item)">
6 6 <div class="img-box">
... ... @@ -24,7 +24,7 @@
24 24 showIndicators: true,
25 25 }
26 26 },
27   - props: ["swipers"],
  27 + props: ["swipers", "options"],
28 28 components: {
29 29 Swipe,
30 30 SwipeItem
... ...
src/pages/common/common.vue
  View file @5198600
... ... @@ -56,8 +56,11 @@
56 56 type: "" // 图片类型
57 57 },
58 58 Orientation: null, // 旋转角度
59   - headerImage: null
  59 + headerImage: null,
60 60 /* 上传图片参数开始 结束 */
  61 + isBackBox: { // 判断是否显示backBox组件
  62 + value: true
  63 + }
61 64 }
62 65 },
63 66 components: {
... ... @@ -66,6 +69,11 @@
66 69 },
67 70 created() {
68 71  
  72 + // 判断是否有target=inside参数，有的话，不显示backBox组件
  73 + if (this.$route.query.target && this.$route.query.target.toLowerCase() == "inside") {
  74 + this.$set(this.isBackBox, "value", false);
  75 + }
  76 +
69 77 // 设置访问设备
70 78 this.setDeviceType();
71 79  
... ...
src/pages/hqyw/hqyw.less
  View file @5198600
... ... @@ -55,6 +55,9 @@
55 55 .hqyw_swiper{
56 56 margin-top: 30px;
57 57 position: relative;
  58 + .swiper-box {
  59 + width: 690px;
  60 + }
58 61 }
59 62 .swiper-slide{
60 63 border-radius: 20px;
... ... @@ -71,10 +74,10 @@
71 74 padding: 17px 0 22px 0;
72 75 }
73 76 .swiper_pagination li{
74   - width:6.5px;/*no*/
75   - height:6.5px;/*no*/
  77 + width:13px;
  78 + height:13px;
76 79 background:rgba(219,220,219,1);
77   - margin: 0 5px;/*no*/
  80 + margin: 0 10px;
78 81 display: inline-block;
79 82 border-radius: 50%;
80 83 }
... ...
src/pages/hqyw/hqyw.vue
  View file @5198600
... ... @@ -2,7 +2,7 @@
2 2 <div class="hqyw-box">
3 3  
4 4 <!--返回按钮-->
5   - <div class="header">
  5 + <div class="header" v-if="$parent.isBackBox.value">
6 6 <div class="header_ztl"></div>
7 7 <div class="header_top">
8 8 <div class="header_back" @click="back">
... ... @@ -17,7 +17,7 @@
17 17 </div>
18 18 </div>
19 19  
20   - <div class="headerBackground">
  20 + <div class="headerBackground" v-if="$parent.isBackBox.value">
21 21 <div class="header_ztl"></div>
22 22 <div class="header_top"></div>
23 23 </div>
... ... @@ -26,8 +26,11 @@
26 26 <div class="hqyw_swiper">
27 27  
28 28 <!-- 轮播 -->
29   - <swiper v-if="swipers"
30   - :swipers="swipers">
  29 + <swiper v-if="swipers" @onChange="swiperChange"
  30 + :swipers="swipers"
  31 + :options="{
  32 + showIndicators: false
  33 + }">
31 34 </swiper>
32 35  
33 36 <!-- 轮播提示符按钮 -->
... ... @@ -36,7 +39,7 @@
36 39 </div>
37 40 </div>
38 41  
39   - <div v-if="ads" @click="toDetail(ads)">
  42 + <div v-if="ads" @click="toAdsDetail(ads)">
40 43 <div class="hqyw_qyzz">
41 44 <img class="hqyw_qyzz_img" :src="ads.simg">
42 45 </div>
... ... @@ -45,7 +48,7 @@
45 48 <div v-for="(item, index) in shopMarkets" :key="index">
46 49 <div class="card1" v-if="item.style == '1'">
47 50 <div class="top_pic">
48   - <a @click="more({shop_id: item.id, id: $route.query.id})">
  51 + <a @click="more(item)">
49 52 <img class="top_pic_img" v-lazy="item.simg">
50 53 </a>
51 54 </div>
... ... @@ -70,7 +73,7 @@
70 73 <div class="card2" v-if="item.style == '2'">
71 74 <div class="card_title">
72 75 <div class="title_left">{{item.title}}</div>
73   - <a @click="more({shop_id: item.id, id: $route.query.id})" class="title_right">
  76 + <a @click="more(item)" class="title_right">
74 77 <div>
75 78 MORE
76 79 <img class="title_right_img" src="static/img/gd.png">
... ... @@ -94,7 +97,7 @@
94 97 <div class="card2" v-if="item.style == '3'">
95 98 <div class="card_title">
96 99 <div class="title_left">{{item.title}}</div>
97   - <a @click="more({shop_id: item.id, id: $route.query.id})" class="title_right">
  100 + <a @click="more(item)" class="title_right">
98 101 <div >
99 102 MORE
100 103 <img class="title_right_img" src="static/img/gd.png">
... ... @@ -129,6 +132,7 @@
129 132 name: 'hqyw',
130 133 data() {
131 134 return {
  135 + title: "",
132 136 list:[],
133 137 swipers: null, // banner数据
134 138 swiperIndex: 0, // 轮播索引
... ... @@ -139,9 +143,8 @@
139 143  
140 144 }
141 145 },
142   - components: {
143   - swiper,
144   - swiperSlide
  146 + components: {
  147 + swiper
145 148 },
146 149 computed: {
147 150  
... ... @@ -156,6 +159,9 @@
156 159 }
157 160 },
158 161 created() {
  162 +
  163 + // 设置标题
  164 + this.$set(this, "title", "环球优物");
159 165  
160 166 // 获取环球优物首页
161 167 this.shopIndexHq();
... ... @@ -209,12 +215,6 @@
209 215 // 设置商城列表
210 216 this.$set(this, "shopMarkets", datas.shopMarket);
211 217  
212   -
213   -
214   -
215   -
216   -
217   -
218 218 /* 获取环球优物首页数据 结束 */
219 219  
220 220 } else if (res.code == 400) {
... ... @@ -229,6 +229,25 @@
229 229 },
230 230  
231 231 /**
  232 + * ads广告调用通用跳转，补充shop_type参数再调用通用跳转
  233 + * @param {object} item [通用跳转对象]
  234 + */
  235 + toAdsDetail(item) {
  236 +
  237 + // 判断是否有通用跳转函数
  238 + if (typeof this.$parent.gotoDetail === "function") {
  239 +
  240 + // 判断是否有shop_type属性，如果没有，补上shop_type属性
  241 + if (item.shop_type === undefined) {
  242 + this.$set(item, "shop_type", "");
  243 + }
  244 +
  245 + // 调用通用跳转
  246 + this.$parent.gotoDetail(item);
  247 + }
  248 + },
  249 +
  250 + /**
232 251 * 调用通用跳转
233 252 * @param {object} item [通用跳转对象]
234 253 */
... ... @@ -248,16 +267,31 @@
248 267 */
249 268 more(item) {
250 269  
251   - // 判断item是对象
252   - if (typeof item === "object") {
253   - this.$router.push({
254   - path: "/hqywList",
255   - query: item
256   - });
  270 + // 判断并调用通用跳转
  271 + if (typeof this.$parent.gotoDetail === "function") {
  272 +
  273 + // 设置跳转参数
  274 + let options = {
  275 + type: "5",
  276 + to: (window.location.href.split("#")[0] + "#/hqywList?shop_id=" + item.id),
  277 + shop_type: ""
  278 + }
  279 +
  280 + this.$parent.gotoDetail(options);
257 281 }
258 282 },
259 283  
260 284 /**
  285 + * swiperChange事件
  286 + * @param {object} index [滑动swiper索引]
  287 + */
  288 + swiperChange(index) {
  289 +
  290 + // 设置下方swiper提示器切换
  291 + this.$set(this, "swiperIndex", index);
  292 + },
  293 +
  294 + /**
261 295 * 后退
262 296 */
263 297 back() {
... ... @@ -273,11 +307,29 @@
273 307 window.history.go(-1);
274 308 }
275 309 }
276   - }
  310 + },
  311 + head: {
  312 + title () {
  313 + return {
  314 + inner: this.title
  315 + }
  316 + }
  317 + },
  318 + watch: {
  319 +
  320 + // 设置页面标题
  321 + title(newVal) {
  322 + if (this.$store.state.browser.toLowerCase() == "qq" && this.$store.state.deviceType.toLowerCase() == "iphone") {
  323 + this.$iFrame.insertIFrame(newVal);
  324 + } else {
  325 + this.$emit("updateHead");
  326 + }
  327 + }
  328 + }
277 329 }
278 330 </script>
279 331  
280 332 <!-- Add "scoped" attribute to limit CSS to this component only -->
281   -<style scoped>
  333 +<style rel="stylesheet/less" lang="less" scoped>
282 334 @import "hqyw";
283 335 </style>
284 336 \ No newline at end of file
... ...
src/pages/hqywList/hqywList.less
  View file @5198600
1   -.mall-box {
2   - margin-top: 20px;
3   - /deep/ .van-pull-refresh {
4   - .van-pull-refresh__track {
5   - .van-pull-refresh__head {
6   - font-size: 30px;
7   - }
8   - }
9   - }
  1 +@charset "UTF-8";
  2 +
  3 +.header{
  4 + width:100%;
  5 + background: #F76681;
  6 + position: fixed;
  7 + top:0;
  8 + left:0;
  9 + right:0;
  10 + z-index:10000;
10 11 }
  12 +.header_ztl{
  13 + width:100%;
  14 +}
  15 +.header_top{
  16 + width:100%;
  17 + height:96px;
  18 + display: flex;
  19 +}
  20 +.headerBackground{
  21 + width:100%;
  22 +}
  23 +.header_back{
  24 + padding:29px 10px 29px 28px;
  25 + width:38px;
  26 + height:38px;
  27 +}
  28 +.header_back img{
  29 + width:38px;
  30 + height:38px;
  31 +}
  32 +.header_close{
  33 + padding:29px 30px 29px 10px;
  34 + width:38px;
  35 + height:38px;
  36 +}
  37 +.header_close img{
  38 + width:38px;
  39 + height:38px;
  40 +}
  41 +.header_title{
  42 + display: flex;
  43 + justify-content: center;
  44 + align-items: center;
  45 + font-size:34px;
  46 + font-weight:400;
  47 + color:rgba(255,255,255,1);
  48 + width:-moz-calc(100% - 310px);
  49 + width:-webkit-calc(100% -310px);
  50 + width: calc(100% - 310px);
  51 + height:96px;
  52 +}
  53 +.list{
  54 + width: 88%;
  55 + margin: 30px 6% 0 6%;
  56 + display: flex;
  57 + justify-content: space-between;
  58 +}
  59 +.goods_pic{
  60 + width: 36%;
  61 + height: 240px;
  62 +}
  63 +.goods_pic_img{
  64 + height: 100%;
  65 + width: 100%;
  66 + object-fit: cover;
  67 +}
  68 +.goods_right{
  69 + width: 55%;
  70 + position: relative;
  71 +}
  72 +.goods_title{
  73 + font-size:28px;
  74 + font-weight:400;
  75 + color:rgba(30,30,30,1);
  76 + line-height:40px;
  77 + /*! autoprefixer: off */
  78 + -webkit-box-orient: vertical;
  79 + /*! autoprefixer: on */
  80 + display: -webkit-box;
  81 + -webkit-line-clamp: 2;
  82 + overflow: hidden;
  83 + white-space: normal;
  84 +}
  85 +.goods_price{
  86 + position: absolute;
  87 + bottom: 15px;
  88 + left: 0;
  89 +}
  90 +.goods_price p{
  91 + font-size:30px;
  92 + font-weight:500;
  93 + color:rgba(255,21,67,1);
  94 + line-height:42px;
  95 + display: inline-block;
  96 +}
  97 +.goods_price span{
  98 + font-size:24px;
  99 + font-weight:500;
  100 + color:rgba(30,30,30,1);
  101 + line-height:33px;
  102 + text-decoration: line-through;
  103 + margin-left: 10px;
  104 + display: inline-block;
  105 +}
  106 +.list_end{
  107 + font-size:30px;
  108 + font-weight:500;
  109 + color:rgba(0,0,0,1);
  110 + line-height:42px;
  111 + text-align: center;
  112 + margin-bottom: 60px;
  113 + margin-top: 50px;
  114 +}
  115 +.go_top_button{
  116 + position: fixed;
  117 + bottom: 32px;
  118 + right: 42px;
  119 + height: 92px;
  120 + width: 92px;
  121 + z-index: 10;
  122 +}
  123 +.gotop_img{
  124 + width: 100%;
  125 + height: 100%;
  126 +}
11 127 \ No newline at end of file
... ...
src/pages/hqywList/hqywList.vue
  View file @5198600
1 1 <template>
2 2 <div class="hqyw_list">
  3 +
3 4 <!--返回按钮-->
4 5 <div class="header">
5   - <div class="header_ztl" :style="'height:'+statusHeight+'px;'"></div>
  6 + <div class="header_ztl"></div>
6 7 <div class="header_top">
7   - <a :href="'hqyw.html?id='+id" class="header_back">
8   - <img src="../../../assets/images/hqywBack2.png">
9   - </a>
10   - <div class="header_close" @click="back()">
11   - <img src="../../../assets/images/hqywListClose.png">
  8 + <div class="header_back" @click="back">
  9 + <img src="static/img/hqywBack2.png">
  10 + </div>
  11 + <div class="header_close" @click="back">
  12 + <img src="static/img/hqywListClose.png">
12 13 </div>
13 14 <div class="header_title">
14   - <p>{{list.title}}</p>
  15 + {{title}}
15 16 </div>
16 17 <div class="header_back"></div>
17 18 <div class="header_close" ></div>
18 19 </div>
19   - </div>
  20 + </div>
  21 +
20 22 <div class="headerBackground">
21   - <div class="header_ztl" :style="'height:'+statusHeight+'px;'"></div>
  23 + <div class="header_ztl"></div>
22 24 <div class="header_top"></div>
23   - </div>
  25 + </div>
24 26  
25   - <div class="list" v-for="(item,index) in list.goods" :key="index" @click="toAppOnlineRetailers(item.type,item.to,item.shop_type)">
  27 + <div class="list" v-for="(item, index) in goods" :key="index" @click="toDetail(item)">
26 28 <div class="goods_pic">
27   - <img class="goods_pic_img" :src="item.simg">
  29 + <img class="goods_pic_img" v-lazy="item.simg">
28 30 </div>
29   -
30 31 <div class="goods_right">
31   - <div class="goods_title" style="-webkit-box-orient: vertical;">{{item.title}}</div>
  32 + <div class="goods_title">{{item.title}}</div>
32 33 <div class="goods_price">
33 34 <p>￥{{integer(item.price)}}</p>
34   - <span v-if="Number(item.prices)>Number(item.price)">￥{{integer(item.prices)}}</span>
  35 + <span v-if="Number(item.prices) > Number(item.price)">￥{{integer(item.prices)}}</span>
35 36 </div>
36 37 </div>
37 38 </div>
... ... @@ -41,279 +42,204 @@
41 42 </div>
42 43  
43 44 <div v-show="showButton" class="go_top_button" @click="goTop">
44   - <img class="gotop_img" src="@/assets/images/hqyw/gotopbutton.png" >
  45 + <img class="gotop_img" src="static/img/gotopbutton.png" >
45 46 </div>
46 47  
47 48 </div>
48 49 </template>
49 50  
50 51 <script>
51   -//import Vue from 'vue';
52   -import axios from 'axios';
53   -const qs = require('qs');
54   -import Bridge from '../../../assets/js/bridge.js';
55   -Vue.prototype.$bridge = Bridge;
56   -//接口请求失败
57   -import error from '@/pages/index/components/error.vue'
58   -Vue.component('error', error)
59   -import {ScrollTop} from'../../../assets/js/ScrollTop.js'
60   -var sha1 = require('sha1');
61   -export default {
62   - data(){
63   - return{
64   - errShow:false,//接口请求错误
65   - list:[],
66   - showButton:false,//是否显示gotopbutton
67   - shop_id:this.getUrlParam("shop_id"),//活动id
68   - id:this.getUrlParam("id"),//id
69   - statusHeight:0,//状态栏的高度
70   - }
71   - },
72   - created(){
73   - this.onLoad();
74   - },
75   - computed:{
76   - environment:function(){
77   - return this.$store.state.new.environment
78   - },
79   - appId:function(){
80   - return this.$store.state.new.appId
81   - },
82   - plat:function(){
83   - return this.$store.state.new.plat
84   - },
85   - sharewjjShow:function(){
86   - return this.$store.state.new.sharewjjShow
87   - },
88   - hqywAppKey:function(){
89   - return this.$store.state.hqyw.hqywAppKey
90   - },
91   - hqywSign:function(){
92   - return this.$store.state.hqyw.hqywSign
93   - },
94   - },
95   - methods:{
96   - back(){
97   - if(window.webkit&&window.webkit.messageHandlers) {
98   - window.webkit.messageHandlers.pop.postMessage({body: {}});
99   - } else if(window.obj) {
100   - window.obj.finish();
101   - }
102   - },
103   - onLoad(){
104   - var that=this;
105   - if(this.environment=="test"){
106   - var apiUrl="https://wjjshop.cnlive.com/Api/index2/shopMarketInfo";
107   - axios.post(apiUrl,qs.stringify({
108   - "id":this.shop_id,
109   - })).then( (response) => {
110   - this.list=response.data.data;
111   - document.title = this.list.title;
112   - console.log(this.list)
113   - },(response) => {
114   - that.errShow=true;
115   - })
116   - }else{
117   - var apiUrl="https://managemall.cnlive.com/Api/index2/shopMarketInfo";
118   - function timest() {
119   - return Math.round(new Date().getTime()/1000);
120   - }
121   - var Timestamp=timest();
122   - axios.defaults.headers.post['App-Key'] = this.hqywAppKey;
123   - axios.defaults.headers.post['Timestamp'] = Timestamp;
124   - axios.defaults.headers.post['Signature'] = sha1(this.hqywAppKey+this.hqywSign+Timestamp);
125   - axios.post(apiUrl,qs.stringify({
126   - "id":this.shop_id,
127   - })).then( (response) => {
128   - this.list=response.data.data;
129   - document.title = this.list.title;
130   - console.log(this.list)
131   - },(response) => {
132   - that.errShow=true;
133   - })
134   - }
135   - },
136   - toAppOnlineRetailers(type,to,shop_type){
137   - console.log(type,to,shop_type)
138   - //给app传参
139   - let toAppOnlineRetailersData={
140   - "type": type,
141   - "to": to,
142   - "shop_type": shop_type
143   - };
144   - if(this.plat=='a'){
145   - window.Android.wjjToAppOnlineRetailers(JSON.stringify(toAppOnlineRetailersData));
146   - }else if(this.plat=='i'){
147   - window.webkit.messageHandlers.wjjToAppOnlineRetailers.postMessage({body:toAppOnlineRetailersData});
  52 +
  53 + // 引入组件
  54 + import { Toast, Indicator } from "mint-ui";
  55 +
  56 + export default {
  57 + name: 'hqywList',
  58 + data() {
  59 + return{
  60 + title: "",
  61 + goods: [], // 商品列表
  62 + showButton: false, //是否显示gotopbutton
  63 + timer: null // 滚动条监听setTimeout对象
148 64 }
149 65 },
150   - integer(num){
151   - return num.replace(/\.00/g,"");
  66 + computed: {
  67 +
  68 + /**
  69 + * 删除无效小数
  70 + * @param {string} num [文本类型数字]
  71 + */
  72 + integer() {
  73 + return (num) => {
  74 + return num.replace(/\.00/g,"");
  75 + }
  76 + }
152 77 },
153   - //判断是否显示回到上方按钮
154   - showGoTopButton(){
155   - let topHeight=document.body.scrollTop||document.documentElement.scrollTop
156   - if(topHeight>=300){
157   - this.showButton=true;
158   - }else{
159   - this.showButton=false;
160   - }
161   - // console.log(topHeight)
  78 + created() {
  79 +
  80 + // 店铺活动详情
  81 + this.shopMarketInfo();
162 82 },
163   - //单击按钮,回到页面最上方
164   - goTop(){
165   - let topHeight=document.getElementsByClassName("hqyw_list");
166   - ScrollTop(topHeight[0].offsetTop, 100);
  83 + methods: {
  84 +
  85 + /**
  86 + * 店铺活动详情
  87 + */
  88 + shopMarketInfo() {
  89 +
  90 + // 加载中提示
  91 + Indicator.open("加载中...");
  92 +
  93 + // 获取证书请求接口
  94 + this.http("/Api/" + this.getApiVersion().index + "/shopMarketInfo", {
  95 + id: this.$route.query.shop_id
  96 + }, this.shopMarketInfoCallback, {
  97 + method: "POST"
  98 + }
  99 + );
  100 + },
  101 +
  102 + /**
  103 + * 店铺活动详情回调
  104 + * @param {object} res [服务器返回数据]
  105 + * @param {object} ext [扩展参数]
  106 + */
  107 + shopMarketInfoCallback(res, ext) {
  108 +
  109 + // 加载完成
  110 + Indicator.close();
  111 +
  112 + // 返回处理
  113 + if (res.code == 200) {
  114 +
  115 + // 解构数据
  116 + let { data: datas } = res;
  117 +
  118 + /* 获取店铺活动详情数据 开始 */
  119 +
  120 + // 设置标题
  121 + this.$set(this, "title", datas.title);
  122 +
  123 + // 设置商品列表
  124 + this.$set(this, "goods", datas.goods);
  125 +
  126 + /* 获取店铺活动详情数据 结束 */
  127 +
  128 + } else if (res.code == 400) {
  129 +
  130 + // 获取店铺活动详情失败
  131 + Toast(res.message);
  132 + } else {
  133 +
  134 + // 获取店铺活动详情失败
  135 + Toast("获取店铺活动详情失败");
  136 + }
  137 + },
  138 +
  139 + /**
  140 + * 调用通用跳转
  141 + * @param {object} item [通用跳转对象]
  142 + */
  143 + toDetail(item) {
  144 +
  145 + // 判断是否有通用跳转函数
  146 + if (typeof this.$parent.gotoDetail === "function") {
  147 +
  148 + // 调用通用跳转
  149 + this.$parent.gotoDetail(item);
  150 + }
  151 + },
  152 +
  153 + /**
  154 + * 监听滚动条，判断是否显示回到顶部Button
  155 + * @param {object} e [滚动条对象]
  156 + * @param {boolean} isTimeout [是否为setTimeout方法调用]
  157 + */
  158 + showGoTopButton(e, isTimeout = false) {
  159 +
  160 + // 获取滚动条位置，浏览器兼容处理
  161 + let scrollTop = (document.documentElement.scrollTop || document.body.scrollTop) || 0;
  162 +
  163 + // 滚动控制高度
  164 + let maxHeight = 300;
  165 +
  166 + if (scrollTop >= maxHeight) {
  167 + this.$set(this, "showButton", true);
  168 + } else {
  169 + this.$set(this, "showButton", false);
  170 + }
  171 +
  172 + if (!isTimeout) {
  173 +
  174 + if (this.timer) {
  175 + clearTimeout(this.timer);
  176 + }
  177 +
  178 + // 倒计时校正滚动条位置
  179 + this.timer = setTimeout((options) => {
  180 +
  181 + // 递归
  182 + this.showGoTopButton(options.e, true);
  183 + }, 1000, {e});
  184 + }
  185 + },
  186 +
  187 + /**
  188 + * 回到顶部
  189 + */
  190 + goTop() {
  191 + document.documentElement.scrollTop = document.body.scrollTop = 0;
  192 + },
  193 +
  194 + /**
  195 + * 后退
  196 + */
  197 + back() {
  198 +
  199 + // 判断是否有后退函数
  200 + if (typeof this.$parent.back === "function") {
  201 +
  202 + // 调用后退
  203 + this.$parent.back();
  204 + } else {
  205 +
  206 + // 后退
  207 + window.history.go(-1);
  208 + }
  209 + }
167 210 },
168   - //获取url地址里的参数
169   - getUrlParam:function(name){
170   - var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
171   - var r =window.location.search.substr(1).match(reg);
172   - if (r != null) return unescape(r[2]); return "";
  211 + head: {
  212 + title () {
  213 + return {
  214 + inner: this.title
  215 + }
  216 + }
  217 + },
  218 + watch: {
  219 +
  220 + // 设置页面标题
  221 + title(newVal) {
  222 + if (this.$store.state.browser.toLowerCase() == "qq" && this.$store.state.deviceType.toLowerCase() == "iphone") {
  223 + this.$iFrame.insertIFrame(newVal);
  224 + } else {
  225 + this.$emit("updateHead");
  226 + }
  227 + }
  228 + },
  229 + mounted() {
  230 +
  231 + // 监听滚动条
  232 + window.addEventListener("scroll", this.showGoTopButton, true);
173 233 },
174   - },
175   - mounted(){
176   - window.addEventListener('scroll', this.showGoTopButton);
177   - var that=this;
178   - window["getStatusHeight"] = function (height) {
179   - that.statusHeight=JSON.parse(height).statusHeight;
180   - };
181   - if(window.webkit&&window.webkit.messageHandlers) {
182   - window.webkit.messageHandlers.getStatusHeight.postMessage({body: {}});
183   - } else if(window.obj) {
184   - window.obj.getStatusHeight();
  234 + beforeDestroy() {
  235 +
  236 + // 取消滚动条监听
  237 + window.removeEventListener("scroll", this.showGoTopButton, false);
185 238 }
186   - // var height=JSON.stringify({
187   - // "statusHeight": 20,
188   - // });
189   - // getStatusHeight(height);
190   - // console.log(this.statusHeight)
191 239 }
192   -}
193 240 </script>
194 241  
195   -<style>
196   -.header{
197   - width:100%;
198   - background: #F76681;
199   - position: fixed;
200   - top:0;
201   - left:0;
202   - right:0;
203   - z-index:10000;
204   -}
205   -.header_ztl{
206   - width:100%;
207   -}
208   -.header_top{
209   - width:100%;
210   - height:96px;
211   - display: flex;
212   -}
213   -.headerBackground{
214   - width:100%;
215   -}
216   -.header_back{
217   - padding:29px 10px 29px 28px;
218   - width:38px;
219   - height:38px;
220   -}
221   -.header_back img{
222   - width:38px;
223   - height:38px;
224   -}
225   -.header_close{
226   - padding:29px 30px 29px 10px;
227   - width:38px;
228   - height:38px;
229   -}
230   -.header_close img{
231   - width:38px;
232   - height:38px;
233   -}
234   -.header_title{
235   - width:-moz-calc(100% - 310px);
236   - width:-webkit-calc(100% -310px);
237   - width: calc(100% - 310px);
238   - height:96px;
239   -}
240   -.header_title p{
241   - font-size:34px;
242   - font-weight:400;
243   - color:rgba(255,255,255,1);
244   - line-height:96px;
245   - text-align: center;
246   -}
247   -.list{
248   - width: 88%;
249   - margin: 30px 6% 0 6%;
250   - display: flex;
251   - justify-content: space-between;
252   -}
253   -.goods_pic{
254   - width: 36%;
255   - height: 240px;
256   -}
257   -.goods_pic_img{
258   - height: 100%;
259   - width: 100%;
260   - object-fit: cover;
261   -}
262   -.goods_right{
263   - width: 55%;
264   - position: relative;
265   -}
266   -.goods_title{
267   - font-size:28px;
268   - font-weight:400;
269   - color:rgba(30,30,30,1);
270   - line-height:40px;
271   - -webkit-box-orient: vertical;
272   - display: -webkit-box;
273   - -webkit-line-clamp: 2;
274   - overflow: hidden;
275   - white-space: normal;
276   -}
277   -.goods_price{
278   - position: absolute;
279   - bottom: 15px;
280   - left: 0;
281   -}
282   -.goods_price p{
283   - font-size:30px;
284   - font-weight:500;
285   - color:rgba(255,21,67,1);
286   - line-height:42px;
287   - display: inline-block;
288   -}
289   -.goods_price span{
290   - font-size:24px;
291   - font-weight:500;
292   - color:rgba(30,30,30,1);
293   - line-height:33px;
294   - text-decoration: line-through;
295   - margin-left: 10px;
296   - display: inline-block;
297   -}
298   -.list_end{
299   - font-size:30px;
300   - font-weight:500;
301   - color:rgba(0,0,0,1);
302   - line-height:42px;
303   - text-align: center;
304   - margin-bottom: 60px;
305   - margin-top: 50px;
306   -}
307   -.go_top_button{
308   - position: fixed;
309   - bottom: 32px;
310   - right: 42px;
311   - height: 92px;
312   - width: 92px;
313   - z-index: 10;
314   -}
315   -.gotop_img{
316   - width: 100%;
317   - height: 100%;
318   -}
319   -</style>
  242 +<!-- Add "scoped" attribute to limit CSS to this component only -->
  243 +<style rel="stylesheet/less" lang="less" scoped>
  244 + @import "hqywList";
  245 +</style>
320 246 \ No newline at end of file
... ...
src/pages/mall/mall.vue
  View file @5198600
... ... @@ -6,7 +6,10 @@
6 6  
7 7 <!--轮播-->
8 8 <swiper v-if="banner"
9   - :swipers="banner">
  9 + :swipers="banner"
  10 + :options="{
  11 + showIndicators: false
  12 + }">
10 13 </swiper>
11 14  
12 15 <!--导航-->
... ... @@ -45,6 +48,7 @@
45 48 </template>
46 49  
47 50 <script>
  51 +
48 52 // 引入组件
49 53 import { Toast, Indicator } from "mint-ui";
50 54 import swiper from "@/components/swiper/swiper";
... ...
src/router/index.js
  View file @5198600
... ... @@ -70,6 +70,17 @@ const router = new Router({
70 70 meta: {
71 71 requireAuth: false
72 72 }
  73 + },
  74 + {
  75 + // 优选库环球优物更多列表页
  76 + path: "/hqywList",
  77 + name: "hqywList",
  78 + component: resolve => {
  79 + require(["@/pages/hqywList/hqywList"], resolve);
  80 + },
  81 + meta: {
  82 + requireAuth: false
  83 + }
73 84 }
74 85 ]
75 86 },
... ...