w-front-end / select_good · Commits

Commit e8e009d51930ffacbe1b389c280eaa40f8b09028

Authored by zhiyangdu
1 parent 44ab88e9

世行扶贫增加返回和分享按钮

Inline Side-by-side
Showing 4 changed files with 280 additions and 212 deletions
src/main.js
  View file @e8e009d
@@ -50,7 +50,7 @@ import 'url-search-params-polyfill'; @@ -50,7 +50,7 @@ import 'url-search-params-polyfill';
50 Vue.config.productionTip = false; 50 Vue.config.productionTip = false;
51 51
52 // 部署模式设置（开发模式："dev"，测试模式："test"，生产模式："prod"） 52 // 部署模式设置（开发模式："dev"，测试模式："test"，生产模式："prod"）
53 -Vue.prototype.mode = "dev"; 53 +Vue.prototype.mode = "prod";
54 54
55 // 微信JS-SDK对象 55 // 微信JS-SDK对象
56 Vue.prototype.jweixin = { 56 Vue.prototype.jweixin = {
src/pages/common/common.vue
  View file @e8e009d
@@ -60,7 +60,8 @@ @@ -60,7 +60,8 @@
60 /* 上传图片参数开始 结束 */ 60 /* 上传图片参数开始 结束 */
61 isBackBox: { // 判断是否显示backBox组件 61 isBackBox: { // 判断是否显示backBox组件
62 value: true 62 value: true
63 - } 63 + },
  64 + isBack: false // 判断是否显示头部的返回和分享组件
64 } 65 }
65 }, 66 },
66 components: { 67 components: {
@@ -68,7 +69,13 @@ @@ -68,7 +69,13 @@
68 showModal 69 showModal
69 }, 70 },
70 created() { 71 created() {
71 - 72 + // 通过URL中的参数，判断打开目标，如果有target=inside，title组件隐藏
  73 + if (this.$route.query.isBack && this.$route.query.isBack.toLowerCase() == "true") {
  74 + // 设置后退按钮组
  75 + this.$set(this, "isBack", true);
  76 + }else {
  77 + this.$set(this, "isBack", false);
  78 + }
72 // 判断是否有target=inside参数，有的话，不显示backBox组件 79 // 判断是否有target=inside参数，有的话，不显示backBox组件
73 if (this.$route.query.target && this.$route.query.target.toLowerCase() == "inside") { 80 if (this.$route.query.target && this.$route.query.target.toLowerCase() == "inside") {
74 this.$set(this.isBackBox, "value", false); 81 this.$set(this.isBackBox, "value", false);
src/pages/mall/mall.vue
  View file @e8e009d
1 <template> 1 <template>
2 <div class="mall-box"> 2 <div class="mall-box">
3 -  
4 <!-- 下拉刷新 --> 3 <!-- 下拉刷新 -->
5 <!-- <van-pull-refresh v-model="isLoading" pulling-text="下拉刷新..." loosing-text="释放刷新" loading-text="加载中..." success-text="刷新成功" @refresh="onRefresh"> --> 4 <!-- <van-pull-refresh v-model="isLoading" pulling-text="下拉刷新..." loosing-text="释放刷新" loading-text="加载中..." success-text="刷新成功" @refresh="onRefresh"> -->
6 -  
7 - <!--轮播-->  
8 - <swiper v-if="banner"  
9 - :swipers="banner"  
10 - :options="{  
11 - showIndicators: true  
12 - }">  
13 - </swiper>  
14 -  
15 - <!--导航-->  
16 - <horiz-list class="components-box" v-if="navs && navs.length" @jump="jump"  
17 - :lists="navs"  
18 - com="4">  
19 - </horiz-list>  
20 -  
21 - <!-- 遍历ads，输出列表数据 -->  
22 - <div class="ads-box">  
23 - <div class="ads" v-for="(item, index) in ads" :key="index">  
24 -  
25 - <!--优惠专区-->  
26 - <discountZone v-if="item.style == '1'" @more="toDetail" @toDetail="toDetail"  
27 - :discountZoneInfo="item">  
28 - </discountZone>  
29 -  
30 - <!--天天特惠-->  
31 - <preferential v-if="item.style == '2'" @more="toDetail" @toDetail="toDetail"  
32 - :preferentialInfo="item">  
33 - </preferential>  
34 -  
35 - <!--视听专区-->  
36 - <videoArea v-if="item.style == '13'" @more="toDetail" @toDetail="toDetail"  
37 - :videoAreaInfo="item">  
38 - </videoArea>  
39 -  
40 - <!-- style_7组件 -->  
41 - <style-7 v-if="item.style == '7'" @more="toDetail" @bannerJump="toDetail" @jump=jump @addCart=addCart  
42 - :styles="item">  
43 - </style-7>  
44 - </div>  
45 - <tabBox v-if="tabbar" :tabbar="tabbar" :tabbarBackgroud="tabbarBackgroud"></tabBox> 5 + <!-- nav -->
  6 + <!-- nav -->
  7 + <back-box v-if="$parent.isBack && $parent.isCNLive.value" class="back-box" :style="'padding-top: ' + $parent.top.value + 'px'" @back="back"
  8 + :backs="backs">
  9 + </back-box>
  10 + <!--轮播-->
  11 + <swiper
  12 + v-if="banner"
  13 + :swipers="banner"
  14 + :options="{
  15 + showIndicators: true
  16 + }"
  17 + >
  18 + </swiper>
  19 +
  20 + <!--导航-->
  21 + <horiz-list
  22 + class="components-box"
  23 + v-if="navs && navs.length"
  24 + @jump="jump"
  25 + :lists="navs"
  26 + com="4"
  27 + >
  28 + </horiz-list>
  29 +
  30 + <!-- 遍历ads，输出列表数据 -->
  31 + <div class="ads-box">
  32 + <div class="ads" v-for="(item, index) in ads" :key="index">
  33 + <!--优惠专区-->
  34 + <discountZone
  35 + v-if="item.style == '1'"
  36 + @more="toDetail"
  37 + @toDetail="toDetail"
  38 + :discountZoneInfo="item"
  39 + >
  40 + </discountZone>
  41 +
  42 + <!--天天特惠-->
  43 + <preferential
  44 + v-if="item.style == '2'"
  45 + @more="toDetail"
  46 + @toDetail="toDetail"
  47 + :preferentialInfo="item"
  48 + >
  49 + </preferential>
  50 +
  51 + <!--视听专区-->
  52 + <videoArea
  53 + v-if="item.style == '13'"
  54 + @more="toDetail"
  55 + @toDetail="toDetail"
  56 + :videoAreaInfo="item"
  57 + >
  58 + </videoArea>
  59 +
  60 + <!-- style_7组件 -->
  61 + <style-7
  62 + v-if="item.style == '7'"
  63 + @more="toDetail"
  64 + @bannerJump="toDetail"
  65 + @jump="jump"
  66 + @addCart="addCart"
  67 + :styles="item"
  68 + >
  69 + </style-7>
46 </div> 70 </div>
  71 + <tabBox
  72 + v-if="tabbar"
  73 + :tabbar="tabbar"
  74 + :tabbarBackgroud="tabbarBackgroud"
  75 + ></tabBox>
  76 + </div>
47 <!-- </van-pull-refresh> --> 77 <!-- </van-pull-refresh> -->
48 </div> 78 </div>
49 </template> 79 </template>
50 80
51 <script> 81 <script>
52 -  
53 - // 引入组件  
54 - import { Toast, Indicator } from "mint-ui";  
55 - import swiper from "@/components/swiper/swiper";  
56 - import swiperItem from "@/components/swiperItem/swiperItem";  
57 - import discountZone from "@/components/discountZone/discountZone";  
58 - import preferential from "@/components/preferential/preferential";  
59 - import videoArea from "@/components/videoArea/videoArea";  
60 - import style7 from "@/components/style_7/style_7";  
61 - import horizList from "@/components/horizList/horizList";  
62 - import tabBox from "@/components/tabBox/tabBox";  
63 - export default {  
64 - name: 'mall',  
65 - data() {  
66 - return {  
67 - title: "", // 标题  
68 - isLoading: false, // 下拉刷新控制  
69 - banner:null, // banner  
70 - navs: null, // 导航  
71 - ads: null, // 列表  
72 - tabbar:null, // tabbar嵌套组件  
73 - tabbarBackgroud:null // 整体tabbar背景 82 +// 引入组件
  83 +import { Toast, Indicator } from "mint-ui";
  84 +import swiper from "@/components/swiper/swiper";
  85 +import swiperItem from "@/components/swiperItem/swiperItem";
  86 +import discountZone from "@/components/discountZone/discountZone";
  87 +import preferential from "@/components/preferential/preferential";
  88 +import videoArea from "@/components/videoArea/videoArea";
  89 +import style7 from "@/components/style_7/style_7";
  90 +import horizList from "@/components/horizList/horizList";
  91 +import tabBox from "@/components/tabBox/tabBox";
  92 +import backBox from "@/components/backBox/backBox";
  93 +export default {
  94 + name: "mall",
  95 + data() {
  96 + return {
  97 + title: "", // 标题
  98 + isLoading: false, // 下拉刷新控制
  99 + banner: null, // banner
  100 + navs: null, // 导航
  101 + ads: null, // 列表
  102 + tabbar: null, // tabbar嵌套组件
  103 + tabbarBackgroud: null, // 整体tabbar背景
  104 + backs: null // 后退按钮组
  105 + };
  106 + },
  107 + components: {
  108 + swiper,
  109 + swiperItem,
  110 + discountZone,
  111 + preferential,
  112 + videoArea,
  113 + style7,
  114 + horizList,
  115 + tabBox,
  116 + backBox
  117 + },
  118 + created() {
  119 + // 获取优选库精选活动
  120 + this.activityAd();
  121 + // // 判断是否在App内
  122 + // 设置后退按钮组
  123 + this.$set(this, "backs", {
  124 + title: ""
  125 + });
  126 +
  127 + // 判断是否在App内
  128 + if (this.$parent.isCNLive.value) {
  129 + // 添加后退按钮组“后退”和“分享”按钮
  130 + Object.assign(this.backs, {
  131 + funcs: {
  132 + back: {
  133 + icon: "static/img/icon_back.png"
  134 + },
  135 + funcArray: [
  136 + {
  137 + icon: "static/img/icon_share.png",
  138 + func: this.toShare
  139 + }
  140 + ]
  141 + }
  142 + });
  143 + }
  144 + },
  145 + methods: {
  146 + // 下拉刷新
  147 + // onRefresh() {
  148 +
  149 + // // 下拉刷新中
  150 + // this.$set(this, "isLoading", true);
  151 +
  152 + // // 获取优选库精选活动
  153 + // this.activityAd();
  154 + // },
  155 + /**
  156 + * 后退
  157 + */
  158 + back() {
  159 + // 判断是否有后退函数
  160 + if (typeof this.$parent.back === "function") {
  161 + // 调用后退
  162 + this.$parent.back();
  163 + } else {
  164 + // 后退
  165 + window.history.go(-1);
74 } 166 }
75 }, 167 },
76 - components:{  
77 - swiper,  
78 - swiperItem,  
79 - discountZone,  
80 - preferential,  
81 - videoArea,  
82 - style7,  
83 - horizList,  
84 - tabBox  
85 - },  
86 - created() {  
87 -  
88 - // 获取优选库精选活动  
89 - this.activityAd(); 168 + /**
  169 + * 获取优选库精选活动
  170 + */
  171 + activityAd() {
  172 + // 加载中提示
  173 + Indicator.open("加载中...");
  174 +
  175 + // 获取证书请求接口
  176 + this.http(
  177 + "/Api/" + this.getApiVersion().index + "/activityAd",
  178 + {
  179 + id: this.$route.query.id
  180 + },
  181 + this.activityAdCallback,
  182 + {
  183 + method: "post"
  184 + }
  185 + );
90 }, 186 },
91 - methods: {  
92 -  
93 - // 下拉刷新  
94 - // onRefresh() {  
95 -  
96 - // // 下拉刷新中  
97 - // this.$set(this, "isLoading", true);  
98 -  
99 - // // 获取优选库精选活动  
100 - // this.activityAd();  
101 - // },  
102 -  
103 - /**  
104 - * 获取优选库精选活动  
105 - */  
106 - activityAd() {  
107 - // 加载中提示  
108 - Indicator.open("加载中...");  
109 -  
110 - // 获取证书请求接口  
111 - this.http("/Api/" + this.getApiVersion().index + "/activityAd", {  
112 - id: this.$route.query.id  
113 - }, this.activityAdCallback, {  
114 - method: "post"  
115 - }  
116 - );  
117 - },  
118 187
119 - /**  
120 - * 获取优选库精选活动回调  
121 - * @param {object} res [服务器返回数据]  
122 - * @param {object} ext [扩展参数]  
123 - */  
124 - activityAdCallback(res, ext) { 188 + /**
  189 + * 获取优选库精选活动回调
  190 + * @param {object} res [服务器返回数据]
  191 + * @param {object} ext [扩展参数]
  192 + */
  193 + activityAdCallback(res, ext) {
  194 + // 加载完成
  195 + Indicator.close();
125 196
126 - // 加载完成  
127 - Indicator.close(); 197 + // 下拉刷新结束
  198 + this.$set(this, "isLoading", false);
128 199
129 - // 下拉刷新结束  
130 - this.$set(this, "isLoading", false); 200 + // 返回处理
  201 + if (res.code == 200) {
  202 + // 解构数据
  203 + let { data: datas } = res;
131 204
132 - // 返回处理  
133 - if (res.code == 200) { 205 + /* 获取优选库精选活动数据 开始 */
134 206
135 - // 解构数据  
136 - let { data: datas } = res; 207 + // 设置标题
  208 + this.$set(this, "title", datas.title);
137 209
138 - /* 获取优选库精选活动数据 开始 */  
139 -  
140 - // 设置标题  
141 - this.$set(this, "title", datas.title);  
142 -  
143 - // 设置banner数据  
144 - if (datas.banner && datas.banner.length) {  
145 - this.$set(this, "banner", datas.banner);  
146 - }  
147 -  
148 - // 设置navs数据  
149 - if (datas.navs && datas.navs.length) {  
150 - this.$set(this, "navs", datas.navs);  
151 - }  
152 -  
153 - // 设置ads数据  
154 - if (datas.ads && datas.ads.length) {  
155 - this.$set(this, "ads", datas.ads);  
156 - }  
157 - // 设置tabbar数据  
158 - if (datas.tabbar && datas.tabbar.length) {  
159 - this.$set(this, "tabbar", datas.tabbar);  
160 - }  
161 - // 设置tabbarBackgroud数据  
162 - if (datas.color && datas.color.length) {  
163 - this.$set(this, "tabbarBackgroud", datas.color);  
164 - }  
165 - /* 获取优选库精选活动数据 结束 */  
166 -  
167 - } else if (res.code == 400) {  
168 -  
169 - // 获取优选库精选活动失败  
170 - Toast(res.message);  
171 - } else {  
172 -  
173 - // 获取优选库精选活动失败  
174 - Toast("获取优选库精选活动失败"); 210 + // 设置banner数据
  211 + if (datas.banner && datas.banner.length) {
  212 + this.$set(this, "banner", datas.banner);
175 } 213 }
176 - },  
177 -  
178 - /**  
179 - * 调用通用跳转  
180 - * @param {object} item [通用跳转对象]  
181 - */  
182 - toDetail(item) {  
183 -  
184 - // 判断是否有通用跳转函数  
185 - if (typeof this.$parent.gotoDetail === "function") {  
186 214
187 - // 调用通用跳转  
188 - this.$parent.gotoDetail(item); 215 + // 设置navs数据
  216 + if (datas.navs && datas.navs.length) {
  217 + this.$set(this, "navs", datas.navs);
189 } 218 }
190 - },  
191 -  
192 - /**  
193 - * style7跳转  
194 - * @param {object} item [数据对象]  
195 - */  
196 - jump(item) {  
197 -  
198 - // 判断并调用通用跳转  
199 - if (typeof this.$parent.gotoDetail === "function") {  
200 -  
201 - // 构造跳转详情页参数  
202 - let options = {  
203 - type: "2",  
204 - to: item.id,  
205 - shop_type: item.shop_type  
206 - }  
207 219
208 - this.$parent.gotoDetail(options); 220 + // 设置ads数据
  221 + if (datas.ads && datas.ads.length) {
  222 + this.$set(this, "ads", datas.ads);
209 } 223 }
210 - },  
211 -  
212 - /**  
213 - * 加入购物车  
214 - * @param {object} item [数据对象]  
215 - */  
216 - addCart(item) { 224 + // 设置tabbar数据
  225 + if (datas.tabbar && datas.tabbar.length) {
  226 + this.$set(this, "tabbar", datas.tabbar);
  227 + }
  228 + // 设置tabbarBackgroud数据
  229 + if (datas.color && datas.color.length) {
  230 + this.$set(this, "tabbarBackgroud", datas.color);
  231 + }
  232 + /* 获取优选库精选活动数据 结束 */
  233 + } else if (res.code == 400) {
  234 + // 获取优选库精选活动失败
  235 + Toast(res.message);
  236 + } else {
  237 + // 获取优选库精选活动失败
  238 + Toast("获取优选库精选活动失败");
  239 + }
  240 + },
217 241
218 - // 通用跳转  
219 - this.jump(item); 242 + /**
  243 + * 调用通用跳转
  244 + * @param {object} item [通用跳转对象]
  245 + */
  246 + toDetail(item) {
  247 + // 判断是否有通用跳转函数
  248 + if (typeof this.$parent.gotoDetail === "function") {
  249 + // 调用通用跳转
  250 + this.$parent.gotoDetail(item);
220 } 251 }
221 }, 252 },
222 - head: {  
223 - title () {  
224 - return {  
225 - inner: this.title  
226 - } 253 +
  254 + /**
  255 + * style7跳转
  256 + * @param {object} item [数据对象]
  257 + */
  258 + jump(item) {
  259 + // 判断并调用通用跳转
  260 + if (typeof this.$parent.gotoDetail === "function") {
  261 + // 构造跳转详情页参数
  262 + let options = {
  263 + type: "2",
  264 + to: item.id,
  265 + shop_type: item.shop_type
  266 + };
  267 +
  268 + this.$parent.gotoDetail(options);
227 } 269 }
228 }, 270 },
229 - watch: {  
230 -  
231 - // 设置页面标题  
232 - title(newVal) {  
233 - if (this.$store.state.browser.toLowerCase() == "qq" && this.$store.state.deviceType.toLowerCase() == "iphone") {  
234 - this.$iFrame.insertIFrame(newVal);  
235 - } else {  
236 - this.$emit("updateHead");  
237 - } 271 +
  272 + /**
  273 + * 加入购物车
  274 + * @param {object} item [数据对象]
  275 + */
  276 + addCart(item) {
  277 + // 通用跳转
  278 + this.jump(item);
  279 + }
  280 + },
  281 + head: {
  282 + title() {
  283 + return {
  284 + inner: this.title
  285 + };
  286 + }
  287 + },
  288 + watch: {
  289 + // 设置页面标题
  290 + title(newVal) {
  291 + if (
  292 + this.$store.state.browser.toLowerCase() == "qq" &&
  293 + this.$store.state.deviceType.toLowerCase() == "iphone"
  294 + ) {
  295 + this.$iFrame.insertIFrame(newVal);
  296 + } else {
  297 + this.$emit("updateHead");
238 } 298 }
239 } 299 }
240 } 300 }
  301 +};
241 </script> 302 </script>
242 303
243 <!-- Add "scoped" attribute to limit CSS to this component only --> 304 <!-- Add "scoped" attribute to limit CSS to this component only -->
244 <style rel="stylesheet/less" lang="less" scoped> 305 <style rel="stylesheet/less" lang="less" scoped>
245 - @import "mall"; 306 +@import "mall";
246 </style> 307 </style>
static/img/icon_share.png 0 → 100644
View file @e8e009d

1.65 KB