fe / yohoblk-wap · Commits

Go to a project

Authored by ccbikai
Commit ccd2bae2ad45c62f4229e1e8bfe1c9a9515cf9ca 2 parents c8ea9704 d1f8ae3e

Merge branch 'develop' into release/1.0

Inline Side-by-side
Showing 11 changed files with 75 additions and 92 deletions
... ... @@ -7,8 +7,6 @@ const parse = require('yoho-qs/parse'); // 提供解析函数
const origin = location.origin;
console.log('定义拦截跳转');
/**
* TODO: 结构优化
*/
... ...
... ... @@ -25,14 +25,12 @@ class Modal {
styleClass: '',
title: '',
text: '',
buttons: [
{
text: '好',
handler: () => {
this.hide();
}
buttons: [{
text: '好',
handler: () => {
this.hide();
}
]
}]
};
// 初始化参数
... ... @@ -69,10 +67,7 @@ class Modal {
}
// 居中显示
this.elem.css({
left: ($(window).width() - this.elem.outerWidth()) / 2,
top: ($(window).height() - this.elem.outerHeight()) / 2 + $(window).scrollTop()
}).show().addClass('animation-target');
this.elem.show().addClass('animation-target');
}
hide() {
... ... @@ -82,7 +77,7 @@ class Modal {
}
Object.assign(Modal, {
alert: (text, title)=> {
alert: (text, title) => {
const modal = new Modal({
text: text,
title: title
... ... @@ -90,22 +85,19 @@ Object.assign(Modal, {
modal.show();
},
confirm: (text, title, callback)=> {
confirm: (text, title, callback) => {
const modal = new Modal({
text: text,
title: title,
buttons: [
{
text: '取消',
handler: function() {
this.hide();
}
},
{
text: '好',
handler: callback || $.noop
buttons: [{
text: '取消',
handler: function() {
this.hide();
}
]
}, {
text: '好',
handler: callback || $.noop
}]
});
modal.show();
... ...
... ... @@ -10,12 +10,10 @@
const $ = require('jquery');
const ANIMATIONS = {
none: {
in: 'overlay-in',
none: { in : 'overlay-in',
out: 'overlay-out'
},
fade: {
in: 'overlay-fade-in',
fade: { in : 'overlay-fade-in',
out: 'overlay-fade-out'
}
};
... ... @@ -28,16 +26,15 @@ class Overlay {
this.defaults = {
className: 'overlay',
clickToClose: true, // 点击关闭
onClose: $.noop, // 关闭回调函数
animation: 'fade', // 动画效果
onClose: $.noop, // 关闭回调函数
animation: 'fade', // 动画效果
disableScrolling: true // 是否禁止
};
// 初始化参数
this.settings = Object.assign({}, this.defaults, opts);
this.settings.animationClasses = {
in: ANIMATIONS[this.settings.animation].in,
this.settings.animationClasses = { in : ANIMATIONS[this.settings.animation].in,
out: ANIMATIONS[this.settings.animation].out
};
... ... @@ -46,20 +43,20 @@ class Overlay {
});
// 点击关闭
this.elem.click(()=> {
this.elem.click(() => {
if (this.settings.clickToClose) {
this.hide();
}
});
// if (this.settings.disableScrolling) {
// // 覆盖层出现时阻止滚动
// $(window).on('touchmove', (e)=> {
// if (this.isVisible) {
// e.preventDefault();
// }
// });
// }
if (this.settings.disableScrolling) {
// 覆盖层出现时阻止滚动
document.body.addEventListener('touchmove', (e) => {
if (this.isVisible) {
e.preventDefault();
}
})
}
this.elem[0].addEventListener('webkitTransitionEnd', this._cleanup.bind(this));
}
... ... @@ -78,8 +75,8 @@ class Overlay {
this.elem.appendTo('body');
this.elem.css({
visibility: 'visible'
}).show()
visibility: 'visible'
}).show()
.removeClass(this.settings.animationClasses.out)
.addClass(this.settings.animationClasses.in);
... ... @@ -108,7 +105,7 @@ class Overlay {
});
}
setTimeout(()=> {
setTimeout(() => {
this._cleanup();
}, 200);
... ...
... ... @@ -22,9 +22,6 @@ const util = require('common/util');
const interceptClick = require('common/intercept-click');
const bus = require('common/vue-bus');
console.log('index 依赖拦截跳转');
/**
* iOS 7 不支持 Promise, vue-lazyload 有用到，所以全局申明
*/
... ...
@import "overlay";
.modal {
position: absolute;
position: fixed;
margin: 0 auto;
background: #fcfcfc;
width: 512px;
z-index: 1001;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
h2 {
font-size: 32px;
... ... @@ -57,43 +60,43 @@
/* Generated with Bounce.js. Edit at http://goo.gl/W7f9he */
@keyframes animation {
0% {
transform: matrix3d(0.5, 0, 0, 0, 0, 0.5, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
transform: translate(-50%, -50%) matrix3d(0.5, 0, 0, 0, 0, 0.5, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
}
4.3% {
transform: matrix3d(0.757, 0, 0, 0, 0, 0.757, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
transform: translate(-50%, -50%) matrix3d(0.757, 0, 0, 0, 0, 0.757, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
}
8.61% {
transform: matrix3d(0.939, 0, 0, 0, 0, 0.939, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
transform: translate(-50%, -50%) matrix3d(0.939, 0, 0, 0, 0, 0.939, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
}
12.91% {
transform: matrix3d(1.026, 0, 0, 0, 0, 1.026, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
transform: translate(-50%, -50%) matrix3d(1.026, 0, 0, 0, 0, 1.026, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
}
17.22% {
transform: matrix3d(1.047, 0, 0, 0, 0, 1.047, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
transform: translate(-50%, -50%) matrix3d(1.047, 0, 0, 0, 0, 1.047, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
}
28.33% {
transform: matrix3d(1.01, 0, 0, 0, 0, 1.01, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
transform: translate(-50%, -50%) matrix3d(1.01, 0, 0, 0, 0, 1.01, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
}
39.44% {
transform: matrix3d(0.997, 0, 0, 0, 0, 0.997, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
transform: translate(-50%, -50%) matrix3d(0.997, 0, 0, 0, 0, 0.997, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
}
61.66% {
transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
transform: translate(-50%, -50%) matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
}
83.98% {
transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
transform: translate(-50%, -50%) matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
}
100% {
transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
transform: translate(-50%, -50%) matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
}
}
... ...
... ... @@ -94,8 +94,24 @@
okAction: function() {
this.$set('selected', Object.assign({}, this.selected, this.params));
let filter = {};
$.each(this.selected, (type, item) => {
if (item.id) {
filter[type] = item.id;
}
});
let query;
query = $.extend({}, locationQuery, filter);
query = $.param(query);
if (history.replaceState) {
history.replaceState({}, '', location.pathname + '?'+ query);
}
bus.$emit('filter.change', {
val: this.selected,
val: filter,
ref: this._uid
});
},
... ... @@ -207,7 +223,7 @@
.filter-cate-val {
float: right;
font-size: 28px;
max-width: 33%%;
max-width: 33%;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
... ...
... ... @@ -78,8 +78,6 @@
const interceptClick = require('common/intercept-click');
const cheader = require('component/header.vue');
console.log('业务代码 依赖拦截跳转');
module.exports = {
data() {
return {
... ...
... ... @@ -140,14 +140,7 @@
* 2. 关闭 drawer 组件
*/
bus.$on('filter.change', function({val}) {
let filter = {};
$.each(val, (type, item) => {
if (item.id) {
filter[type] = item.id;
}
});
self.$set('filter', filter);
self.$set('filter', val);
self.$refs.filter.isVisible = false;
});
... ...
... ... @@ -129,14 +129,7 @@
* 2. 关闭 drawer 组件
*/
bus.$on('filter.change', function({val}) {
let filter = {};
$.each(val, (type, item) => {
if (item.id) {
filter[type] = item.id;
}
});
self.$set('filter', filter);
self.$set('filter', val);
self.$refs.filter.isVisible = false;
});
... ...
... ... @@ -73,6 +73,7 @@
/* 获取店铺简介相关数据 */
getShopInfo() {
$.get({
async: false,
url: '/product/shop/info.json',
data: {
domain: $shop.data('domain'),
... ... @@ -172,16 +173,8 @@
* 2. 关闭 filter 组件
*/
bus.$on('filter.change', function({val}) {
let filterTemp = {};
$.each(val, (type, item) => {
if (item.id) {
filterTemp[type] = item.id;
}
});
Object.assign(filterTemp, { domain: $shop.data('domain') });
self.$set('filter', filterTemp);
Object.assign(val, { domain: $shop.data('domain') });
self.$set('filter', val);
self.$refs.filter.isVisible = false;
});
}
... ...
<template>
<cheader :title="title" class="ghost" fixed v-ref:header>
<cheader :title="title" :class="{ghost: shareData.isBlkShop}" :fixed="shareData.isBlkShop" v-ref:header>
<template slot="right">
<span v-if="shareData.isBlkShop" v-show="shareData.isFav" class="icon" @click="collectShop()">&#xe60d;</span>
<span v-if="shareData.isBlkShop" v-show="!shareData.isFav" class="icon" @click="collectShop()">&#xe60c;</span>
... ... @@ -96,7 +96,10 @@
},
created() {
this.domain = this.shareData.domain;
window.onscroll = this.changeTopStatus;
if (this.shareData.isBlkShop) {
window.onscroll = this.changeTopStatus;
}
}
};
</script>
... ...