Skip to content

M
mayi-mp-shop
Commit a437f0c1 by 程默
Options

fix tabbar

parent a2fbb8db
Showing with 44 additions and 549 deletions
src/components/tabbarPage.vue
......@@ -4,7 +4,8 @@
<template>
<div>
<web-view :src="pageUrl" @error="handleError"></web-view>
<div style="width:100%;height:90vh;display:flex;justify-content: center;align-items: center;">
<div style="width: 100%;height: 90vh;display: flex;justify-content: center;align-items: center;"
>
<van-loading size="40px" type="spinner"></van-loading>
</div>
</div>
......@@ -14,7 +15,7 @@
import {
getUrlofLink,
getUrlofQuery,
setTabBarActive,
noLoginListPath,
checkTabbarPage,
} from "../utils/mayi.js";
export default {
......@@ -30,6 +31,7 @@ export default {
page: "/",
params: "?mixid=" + this.$store.state.mixid,
ss: "",
timestamp:""
};
},
computed: {
......@@ -41,14 +43,13 @@ export default {
`&native_test=1&tabbar=${this.index}&location_obj=${wx.getStorageSync(
"location"
)}` +
this.ss
this.ss+this.timestamp
);
},
},
onLoad(options) {
let ss = wx.getStorageSync("sessionid");
this.ss = ss ? `&sessionid=${ss}` : "";
// tabbar 跳转
let homeIndex = checkTabbarPage("/");
homeIndex != 0 && homeIndex == this.index && (this.index = 0);
......@@ -57,21 +58,19 @@ export default {
this.mpApp.globalData.footerVal.componentData.list[this.index].link
);
// this.params+='&'+getUrlofQuery( this.mpApp.globalData.footerVal.componentData.list[this.index].link)
this.mpApp.globalData.tabBarPageLink = "";
}
console.log(49, this.pageUrl);
},
onShow() {
// 登录态更新
let ss = wx.getStorageSync("sessionid");
if (!this.ss && ss) {
this.ss = `&sessionid=${ss}`;
} else if (!ss) {
this.params+="&logOut=true"
} else {
// this.params += `&timestamp=${new Date().getTime()}`;
this.params += this.params.includes("logOut") ? "" : "&logOut=true";
}
if (!noLoginListPath.includes(this.page)) {
this.timestamp = `&timestamp=${new Date().getTime()}`;
}
// setTabBarActive.bind(this)(this.index);
},
methods: {
handleError(data) {
......
src/pages/home/index.vue
......@@ -242,6 +242,7 @@ export default {
},
onShow() {
this.getCartNum();
setTabBarActive.bind(this)(checkTabbarPage('/'));
this.$mp.page.onPageScroll= (el)=>{
throttle(this.scrolls(el),100)
......
src/pages/index/index.vue
<template>
<div>
<div style="width:100%;height:90vh;display:flex;justify-content: center;align-items: center;">
<van-loading size="40px" type="spinner"></van-loading>
</div>
<web-view v-if="withoutScene" :src="pageUrl" @message="getMessage" @error="handleError" @load="handleLoad"></web-view>
</div>
</template>
......@@ -11,7 +8,7 @@
import spokesman from "@/api/spokesman.js";
import shop from "@/api/shop.js";
import indexApi from "@/api/index.js";
import { serialize, getQueryVariable, DFSImg,delUrlParam } from "@/utils/index";
import { serialize, getQueryVariable, DFSImg } from "@/utils/index";
import login from "@/api/login";
export default {
data() {
......
src/utils/index.js
......@@ -5,7 +5,7 @@ function formatNumber(n) {
// 防抖
export function debounce(fn, wait) {
var timeout = null;
return function() {
return function () {
if (timeout !== null)
clearTimeout(timeout);
timeout = setTimeout(fn, wait);
......@@ -15,7 +15,7 @@ export function debounce(fn, wait) {
// 节流
export function throttle(func, delay) {
var prev = Date.now();
return function() {
return function () {
var context = this;
var args = arguments;
var now = Date.now();
......@@ -56,10 +56,8 @@ export function serialize(obj) {
return str.join("&");
}
//获取url参数
export function getQueryVariable(query,variable) {
// var query = window.location.search.substring(1);
export function getQueryVariable(query, variable) {
var vars = query.split("&");
for (var i = 0; i < vars.length; i++) {
var pair = vars[i].split("=");
......@@ -67,45 +65,39 @@ export function getQueryVariable(query,variable) {
}
return (false);
}
// 删除
export function delUrlParam(url, key) {
let baseUrl = url.split('?')[0] + '?';
let query = url.split('?')[1];
if (query.indexOf(key) > -1) {
let obj = {};
let arr = query.split('&');
for (let i = 0; i < arr.length; i++) {
arr[i] = arr[i].split('=');
obj[arr[i][0]] = arr[i][1];
}
delete obj[key];
let url =
baseUrl +
JSON.stringify(obj)
.replace(/[\"\{\}]/g, '')
.replace(/\:/g, '=')
.replace(/\,/g, '&');
return url;
} else {
return url;
}
// url完整链接把参数转成对象
export function parseQueryString(url) {
let str = url.split("?")[1],
items = str.split("&");
let arr, name, value;
let obj={}
for (var i = 0; i < items.length; i++) {
arr = items[i].split("="); //["key0", "0"]
name = arr[0];
value = arr[1];
console.log(81, this)
obj[name]=value
}
return obj
}
//补全图片路径
export function DFSImg(path, w, h,type=0) { //
export function DFSImg(path, w, h, type = 0) { //
if (path == null || path == '') {
return 'https://mayi-newshop.oss-cn-shanghai.aliyuncs.com/product/8ezKQbm2x3.png';
}
let baseImg = process.env.IMG_DOMAIN ;
if (!Array.isArray(baseImg) && (baseImg.indexOf('aliyun') >= 0 || baseImg.indexOf('cdn') >= 0 )) {
let baseImg = process.env.IMG_DOMAIN;
if (!Array.isArray(baseImg) && (baseImg.indexOf('aliyun') >= 0 || baseImg.indexOf('cdn') >= 0)) {
var style = '';
if (w) style += ',w_' + w;
if (h) style += ',h_' + h;
if (style.length > 0) {
if(path.indexOf('?x-oss-process') == -1){
if(type == 1){
if (path.indexOf('?x-oss-process') == -1) {
if (type == 1) {
path += '?x-oss-process=image/resize,limit_0' + style
}else{
} else {
path += '?x-oss-process=image/resize,m_pad,limit_0' + style
}
......@@ -143,11 +135,11 @@ export function getNavbarInfo(fn) {
}
export function setTimes(value){
export function setTimes(value) {
let result = parseInt(value)
　　let h = Math.floor(result / 3600) < 10 ? '0' + Math.floor(result / 3600) : Math.floor(result / 3600)
　　let m = Math.floor((result / 60 % 60)) < 10 ? '0' + Math.floor((result / 60 % 60)) : Math.floor((result / 60 % 60))
　　let s = Math.floor((result % 60)) < 10 ? '0' + Math.floor((result % 60)) : Math.floor((result % 60))
　　result = `${h}:${m}:${s}`
　　return result
let h = Math.floor(result / 3600) < 10 ? '0' + Math.floor(result / 3600) : Math.floor(result / 3600)
let m = Math.floor((result / 60 % 60)) < 10 ? '0' + Math.floor((result / 60 % 60)) : Math.floor((result / 60 % 60))
let s = Math.floor((result % 60)) < 10 ? '0' + Math.floor((result % 60)) : Math.floor((result % 60))
result = `${h}:${m}:${s}`
return result
}
\ No newline at end of file
static/vant/uploader/index.js deleted 100644 → 0
import { VantComponent } from '../common/component';
import { isImageFile, chooseFile, isVideoFile } from './utils';
import { chooseImageProps, chooseVideoProps } from './shared';
import { isBoolean, isPromise } from '../common/validator';
VantComponent({
props: Object.assign(
Object.assign(
{
disabled: Boolean,
multiple: Boolean,
uploadText: String,
useBeforeRead: Boolean,
afterRead: null,
beforeRead: null,
previewSize: {
type: null,
value: 80,
},
name: {
type: [Number, String],
value: '',
},
accept: {
type: String,
value: 'image',
},
fileList: {
type: Array,
value: [],
observer: 'formatFileList',
},
maxSize: {
type: Number,
value: Number.MAX_VALUE,
},
maxCount: {
type: Number,
value: 100,
},
deletable: {
type: Boolean,
value: true,
},
showUpload: {
type: Boolean,
value: true,
},
previewImage: {
type: Boolean,
value: true,
},
previewFullImage: {
type: Boolean,
value: true,
},
imageFit: {
type: String,
value: 'scaleToFill',
},
uploadIcon: {
type: String,
value: 'photograph',
},
},
chooseImageProps
),
chooseVideoProps
),
data: {
lists: [],
isInCount: true,
},
methods: {
formatFileList() {
const { fileList = [], maxCount } = this.data;
const lists = fileList.map((item) =>
Object.assign(Object.assign({}, item), {
isImage: isImageFile(item),
isVideo: isVideoFile(item),
deletable: isBoolean(item.deletable) ? item.deletable : true,
})
);
this.setData({ lists, isInCount: lists.length < maxCount });
},
getDetail(index) {
return {
name: this.data.name,
index: index == null ? this.data.fileList.length : index,
};
},
startUpload() {
const { maxCount, multiple, lists, disabled } = this.data;
if (disabled) return;
chooseFile(
Object.assign(Object.assign({}, this.data), {
maxCount: maxCount - lists.length,
})
)
.then((res) => {
this.onBeforeRead(multiple ? res : res[0]);
})
.catch((error) => {
this.$emit('error', error);
});
},
onBeforeRead(file) {
const { beforeRead, useBeforeRead } = this.data;
let res = true;
if (typeof beforeRead === 'function') {
res = beforeRead(file, this.getDetail());
}
if (useBeforeRead) {
res = new Promise((resolve, reject) => {
this.$emit(
'before-read',
Object.assign(Object.assign({ file }, this.getDetail()), {
callback: (ok) => {
ok ? resolve() : reject();
},
})
);
});
}
if (!res) {
return;
}
if (isPromise(res)) {
res.then((data) => this.onAfterRead(data || file));
} else {
this.onAfterRead(file);
}
},
onAfterRead(file) {
const { maxSize, afterRead } = this.data;
const oversize = Array.isArray(file)
? file.some((item) => item.size > maxSize)
: file.size > maxSize;
if (oversize) {
this.$emit('oversize', Object.assign({ file }, this.getDetail()));
return;
}
if (typeof afterRead === 'function') {
afterRead(file, this.getDetail());
}
this.$emit('after-read', Object.assign({ file }, this.getDetail()));
},
deleteItem(event) {
const { index } = event.currentTarget.dataset;
this.$emit(
'delete',
Object.assign(Object.assign({}, this.getDetail(index)), {
file: this.data.fileList[index],
})
);
},
onPreviewImage(event) {
if (!this.data.previewFullImage) return;
const { index } = event.currentTarget.dataset;
const { lists } = this.data;
const item = lists[index];
wx.previewImage({
urls: lists.filter((item) => isImageFile(item)).map((item) => item.url),
current: item.url,
fail() {
wx.showToast({ title: '预览图片失败', icon: 'none' });
},
});
},
onPreviewVideo(event) {
if (!this.data.previewFullImage) return;
const { index } = event.currentTarget.dataset;
const { lists } = this.data;
wx.previewMedia({
sources: lists
.filter((item) => isVideoFile(item))
.map((item) =>
Object.assign(Object.assign({}, item), { type: 'video' })
),
current: index,
fail() {
wx.showToast({ title: '预览视频失败', icon: 'none' });
},
});
},
onClickPreview(event) {
const { index } = event.currentTarget.dataset;
const item = this.data.lists[index];
this.$emit(
'click-preview',
Object.assign(Object.assign({}, item), this.getDetail(index))
);
},
},
});
static/vant/uploader/index.json deleted 100644 → 0
{
"component": true,
"usingComponents": {
"van-icon": "../icon/index",
"van-loading": "../loading/index"
}
}
static/vant/uploader/index.wxml deleted 100644 → 0
<wxs src="../wxs/utils.wxs" module="utils" />
<view class="van-uploader">
<view class="van-uploader__wrapper">
<!-- 预览样式 -->
<view
wx:if="{{ previewImage }}"
wx:for="{{ lists }}"
wx:key="index"
class="van-uploader__preview"
data-index="{{ index }}"
bindtap="onClickPreview"
>
<image
wx:if="{{ item.isImage }}"
mode="{{ imageFit }}"
src="{{ item.thumb || item.url }}"
alt="{{ item.name || ('图片' + index) }}"
class="van-uploader__preview-image"
style="width: {{ utils.addUnit(previewSize) }}; height: {{ utils.addUnit(previewSize) }};"
data-index="{{ index }}"
bind:tap="onPreviewImage"
/>
<video
wx:elif="{{ item.isVideo }}"
src="{{ item.url }}"
title="{{ item.name || ('视频' + index) }}"
poster="{{ item.thumb }}"
autoplay="{{ item.autoplay }}"
class="van-uploader__preview-image"
style="width: {{ utils.addUnit(previewSize) }}; height: {{ utils.addUnit(previewSize) }};"
data-index="{{ index }}"
bind:tap="onPreviewVideo"
>
</video>
<view
wx:else
class="van-uploader__file"
style="width: {{ utils.addUnit(previewSize) }}; height: {{ utils.addUnit(previewSize) }};"
>
<van-icon name="description" class="van-uploader__file-icon" />
<view class="van-uploader__file-name van-ellipsis">{{ item.name || item.url }}</view>
</view>
<view
wx:if="{{ item.status === 'uploading' || item.status === 'failed' }}"
class="van-uploader__mask"
>
<van-icon wx:if="{{ item.status === 'failed' }}" name="close" class="van-uploader__mask-icon" />
<van-loading wx:else custom-class="van-uploader__loading" />
<text wx:if="{{ item.message }}" class="van-uploader__mask-message">{{ item.message }}</text>
</view>
<view
wx:if="{{ deletable && item.deletable }}"
data-index="{{ index }}"
class="van-uploader__preview-delete"
catch:tap="deleteItem"
>
<van-icon name="cross" class="van-uploader__preview-delete-icon" />
</view>
</view>
<!-- 上传样式 -->
<block wx:if="{{ isInCount }}">
<view class="van-uploader__slot" bindtap="startUpload">
<slot />
</view>
<!-- 默认上传样式 -->
<view
wx:if="{{ showUpload }}"
class="van-uploader__upload {{ disabled ? 'van-uploader__upload--disabled': ''}}"
style="width: {{ utils.addUnit(previewSize) }}; height: {{ utils.addUnit(previewSize) }};"
bindtap="startUpload"
>
<van-icon name="{{ uploadIcon }}" class="van-uploader__upload-icon" />
<text wx:if="{{ uploadText }}" class="van-uploader__upload-text">{{ uploadText }}</text>
</view>
</block>
</view>
</view>
static/vant/uploader/index.wxss deleted 100644 → 0
@import '../common/index.wxss';.van-uploader{position:relative;display:inline-block}.van-uploader__wrapper{display:-webkit-flex;display:flex;-webkit-flex-wrap:wrap;flex-wrap:wrap}.van-uploader__slot:empty{display:none}.van-uploader__slot:not(:empty)+.van-uploader__upload{display:none!important}.van-uploader__upload{position:relative;display:-webkit-flex;display:flex;-webkit-flex-direction:column;flex-direction:column;-webkit-align-items:center;align-items:center;-webkit-justify-content:center;justify-content:center;box-sizing:border-box;width:80px;width:var(--uploader-size,80px);height:80px;height:var(--uploader-size,80px);margin:0 8px 8px 0;margin:0 var(--padding-xs,8px) var(--padding-xs,8px) 0;background-color:#f7f8fa;background-color:var(--uploader-upload-background-color,#f7f8fa)}.van-uploader__upload:active{background-color:#f2f3f5;background-color:var(--uploader-upload-active-color,#f2f3f5)}.van-uploader__upload-icon{color:#dcdee0;color:var(--uploader-icon-color,#dcdee0);font-size:24px;font-size:var(--uploader-icon-size,24px)}.van-uploader__upload-text{margin-top:8px;margin-top:var(--padding-xs,8px);color:#969799;color:var(--uploader-text-color,#969799);font-size:12px;font-size:var(--uploader-text-font-size,12px)}.van-uploader__upload--disabled{opacity:.5;opacity:var(--uploader-disabled-opacity,.5)}.van-uploader__preview{position:relative;cursor:pointer;margin:0 8px 8px 0;margin:0 var(--padding-xs,8px) var(--padding-xs,8px) 0}.van-uploader__preview-image{display:block;overflow:hidden;width:80px;width:var(--uploader-size,80px);height:80px;height:var(--uploader-size,80px)}.van-uploader__preview-delete{padding:0 0 8px 8px;padding:0 0 var(--padding-xs,8px) var(--padding-xs,8px)}.van-uploader__preview-delete,.van-uploader__preview-delete:after{position:absolute;top:0;right:0;width:14px;width:var(--uploader-delete-icon-size,14px);height:14px;height:var(--uploader-delete-icon-size,14px)}.van-uploader__preview-delete:after{content:"";background-color:rgba(0,0,0,.7);background-color:var(--uploader-delete-background-color,rgba(0,0,0,.7));border-radius:0 0 0 12px;border-radius:0 0 0 calc(var(--uploader-delete-icon-size, 14px) - 2px)}.van-uploader__preview-delete-icon{position:absolute;top:-2px;right:-2px;z-index:1;-webkit-transform:scale(.5);transform:scale(.5);font-size:16px;font-size:calc(var(--uploader-delete-icon-size, 14px) + 2px);color:#fff;color:var(--uploader-delete-color,#fff)}.van-uploader__file{display:-webkit-flex;display:flex;-webkit-flex-direction:column;flex-direction:column;-webkit-align-items:center;align-items:center;-webkit-justify-content:center;justify-content:center;width:80px;width:var(--uploader-size,80px);height:80px;height:var(--uploader-size,80px);background-color:#f7f8fa;background-color:var(--uploader-file-background-color,#f7f8fa)}.van-uploader__file-icon{color:#646566;color:var(--uploader-file-icon-color,#646566);font-size:20px;font-size:var(--uploader-file-icon-size,20px)}.van-uploader__file-name{box-sizing:border-box;width:100%;text-align:center;margin-top:8px;margin-top:var(--uploader-file-name-margin-top,8px);padding:0 4px;padding:var(--uploader-file-name-padding,0 4px);color:#646566;color:var(--uploader-file-name-text-color,#646566);font-size:12px;font-size:var(--uploader-file-name-font-size,12px)}.van-uploader__mask{position:absolute;top:0;right:0;bottom:0;left:0;display:-webkit-flex;display:flex;-webkit-flex-direction:column;flex-direction:column;-webkit-align-items:center;align-items:center;-webkit-justify-content:center;justify-content:center;color:#fff;color:var(--white,#fff);background-color:rgba(50,50,51,.88);background-color:var(--uploader-mask-background-color,rgba(50,50,51,.88))}.van-uploader__mask-icon{font-size:22px;font-size:var(--uploader-mask-icon-size,22px)}.van-uploader__mask-message{margin-top:6px;padding:0 4px;padding:0 var(--padding-base,4px);font-size:12px;font-size:var(--uploader-mask-message-font-size,12px);line-height:14px;line-height:var(--uploader-mask-message-line-height,14px)}.van-uploader__loading{width:22px;width:var(--uploader-loading-icon-size,22px);height:22px;height:var(--uploader-loading-icon-size,22px);color:#fff!important;color:var(--uploader-loading-icon-color,#fff)!important}
\ No newline at end of file
static/vant/uploader/shared.d.ts deleted 100644 → 0
export declare const chooseImageProps: {
sizeType: {
type: ArrayConstructor;
value: string[];
};
capture: {
type: ArrayConstructor;
value: string[];
};
};
export declare const chooseVideoProps: {
capture: {
type: ArrayConstructor;
value: string[];
};
compressed: {
type: BooleanConstructor;
value: boolean;
};
maxDuration: {
type: NumberConstructor;
value: number;
};
camera: {
type: StringConstructor;
value: string;
};
};
static/vant/uploader/shared.js deleted 100644 → 0
// props for choose image
export const chooseImageProps = {
sizeType: {
type: Array,
value: ['original', 'compressed'],
},
capture: {
type: Array,
value: ['album', 'camera'],
},
};
// props for choose video
export const chooseVideoProps = {
capture: {
type: Array,
value: ['album', 'camera'],
},
compressed: {
type: Boolean,
value: true,
},
maxDuration: {
type: Number,
value: 60,
},
camera: {
type: String,
value: 'back',
},
};
static/vant/uploader/utils.d.ts deleted 100644 → 0
export interface File {
url: string;
size?: number;
name?: string;
type: string;
duration?: number;
time?: number;
isImage?: boolean;
isVideo?: boolean;
}
export declare function isImageFile(item: File): boolean;
export declare function isVideoFile(item: File): boolean;
export declare function chooseFile({
accept,
multiple,
capture,
compressed,
maxDuration,
sizeType,
camera,
maxCount,
}: {
accept: any;
multiple: any;
capture: any;
compressed: any;
maxDuration: any;
sizeType: any;
camera: any;
maxCount: any;
}): Promise<File | File[]>;
static/vant/uploader/utils.js deleted 100644 → 0
import { pickExclude } from '../common/utils';
import { isImageUrl, isVideoUrl } from '../common/validator';
export function isImageFile(item) {
if (item.isImage != null) {
return item.isImage;
}
if (item.type) {
return item.type === 'image';
}
if (item.url) {
return isImageUrl(item.url);
}
return false;
}
export function isVideoFile(item) {
if (item.isVideo != null) {
return item.isVideo;
}
if (item.type) {
return item.type === 'video';
}
if (item.url) {
return isVideoUrl(item.url);
}
return false;
}
function formatImage(res) {
return res.tempFiles.map((item) =>
Object.assign(Object.assign({}, pickExclude(item, ['path'])), {
type: 'image',
url: item.path,
thumb: item.path,
})
);
}
function formatVideo(res) {
return [
Object.assign(
Object.assign(
{},
pickExclude(res, ['tempFilePath', 'thumbTempFilePath', 'errMsg'])
),
{ type: 'video', url: res.tempFilePath, thumb: res.thumbTempFilePath }
),
];
}
function formatMedia(res) {
return res.tempFiles.map((item) =>
Object.assign(
Object.assign(
{},
pickExclude(item, ['fileType', 'thumbTempFilePath', 'tempFilePath'])
),
{
type: res.type,
url: item.tempFilePath,
thumb:
res.type === 'video' ? item.thumbTempFilePath : item.tempFilePath,
}
)
);
}
function formatFile(res) {
return res.tempFiles.map((item) =>
Object.assign(Object.assign({}, pickExclude(item, ['path'])), {
url: item.path,
})
);
}
export function chooseFile({
accept,
multiple,
capture,
compressed,
maxDuration,
sizeType,
camera,
maxCount,
}) {
return new Promise((resolve, reject) => {
switch (accept) {
case 'image':
wx.chooseImage({
count: multiple ? Math.min(maxCount, 9) : 1,
sourceType: capture,
sizeType,
success: (res) => resolve(formatImage(res)),
fail: reject,
});
break;
case 'media':
wx.chooseMedia({
count: multiple ? Math.min(maxCount, 9) : 1,
sourceType: capture,
maxDuration,
sizeType,
camera,
success: (res) => resolve(formatMedia(res)),
fail: reject,
});
break;
case 'video':
wx.chooseVideo({
sourceType: capture,
compressed,
maxDuration,
camera,
success: (res) => resolve(formatVideo(res)),
fail: reject,
});
break;
default:
wx.chooseMessageFile({
count: multiple ? maxCount : 1,
type: accept,
success: (res) => resolve(formatFile(res)),
fail: reject,
});
break;
}
});
}
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment