first commit
This commit is contained in:
Edik committed
commit
767cf46baa
118 files changed
+20253
No files matched your search
Executable
+280
@@ -0,0 +1,280 @@
|
||||
<template>
|
||||
<div>
|
||||
<van-pull-refresh class="content" v-model="isLoading" @refresh="onRefresh">
|
||||
<br>
|
||||
<br>
|
||||
|
||||
<Logo></Logo>
|
||||
<div style="padding:10px 15px;text-align:center">
|
||||
<small>下拉Ajax请求试试😋</small>
|
||||
</div>
|
||||
<van-collapse v-model="activeName" accordion>
|
||||
<van-collapse-item title="plus演示" name="1">
|
||||
<van-cell-group>
|
||||
<van-cell @click="openGoodsDetail()" title="预加载商品详情窗口" is-link />
|
||||
<van-cell @click="openCart()" title="打开购物车窗口" is-link />
|
||||
<van-cell @click="camera" title="拍照" is-link />
|
||||
<van-cell @click="toast" title="原生Toast" is-link />
|
||||
</van-cell-group>
|
||||
</van-collapse-item>
|
||||
<van-collapse-item title="Vant组件演示 " name="2">
|
||||
<van-cell-group>
|
||||
<van-cell @click="openAS" title="Actionsheet" is-link />
|
||||
<van-cell @click="vantToast" title="Toast" is-link />
|
||||
<van-cell @click="vantDialog" title="Dialog" is-link />
|
||||
</van-cell-group>
|
||||
</van-collapse-item>
|
||||
<van-collapse-item title="Mui组件演示" name="3">
|
||||
<van-cell-group>
|
||||
<van-cell @click="openMui" title="Mui演示页" is-link />
|
||||
</van-cell-group>
|
||||
</van-collapse-item>
|
||||
<van-collapse-item title="vux组件演示" name="4">
|
||||
<van-cell-group>
|
||||
<van-cell @click="openVux" title="vux演示页" is-link />
|
||||
</van-cell-group>
|
||||
</van-collapse-item>
|
||||
|
||||
</van-collapse>
|
||||
<br>
|
||||
<br>
|
||||
<br>
|
||||
<br>
|
||||
<br>
|
||||
</van-pull-refresh>
|
||||
<van-actionsheet v-model="show" cancel-text="取消" :actions="actions" />
|
||||
<van-tabbar v-model="active">
|
||||
<van-tabbar-item icon="shop">标签</van-tabbar-item>
|
||||
<van-tabbar-item icon="chat" dot>标签</van-tabbar-item>
|
||||
<van-tabbar-item icon="records" info="5">标签</van-tabbar-item>
|
||||
<van-tabbar-item icon="gold-coin" info="20">标签</van-tabbar-item>
|
||||
</van-tabbar>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import Vue from "vue";
|
||||
import {
|
||||
openWebview,
|
||||
openWebviewFast,
|
||||
preLoad,
|
||||
showWebviewById
|
||||
} from "@/utils/webview";
|
||||
import { request } from "@/utils/request";
|
||||
import {
|
||||
Dialog,
|
||||
CellGroup,
|
||||
Toast,
|
||||
PullRefresh,
|
||||
Tabbar,
|
||||
TabbarItem,
|
||||
Cell,
|
||||
List,
|
||||
Actionsheet,
|
||||
NavBar,
|
||||
Tag,
|
||||
Collapse,
|
||||
CollapseItem
|
||||
} from "vant";
|
||||
import Logo from "./components/logo.vue";
|
||||
export default {
|
||||
components: {
|
||||
Logo,
|
||||
[Dialog.name]: Dialog,
|
||||
[CellGroup.name]: CellGroup,
|
||||
[Toast.name]: Toast,
|
||||
[PullRefresh.name]: PullRefresh,
|
||||
[Tabbar.name]: Tabbar,
|
||||
[TabbarItem.name]: TabbarItem,
|
||||
[Cell.name]: Cell,
|
||||
[List.name]: List,
|
||||
[Actionsheet.name]: Actionsheet,
|
||||
[NavBar.name]: NavBar,
|
||||
[Tag.name]: Tag,
|
||||
[Collapse.name]: Collapse,
|
||||
[CollapseItem.name]: CollapseItem
|
||||
},
|
||||
created() {
|
||||
window.addEventListener("customEvent", function(event) {
|
||||
//通过event.detail可获得传递过来的参数内容
|
||||
plus.nativeUI.toast("我是首页,我很慌,我收到了信息");
|
||||
console.log(event.detail);
|
||||
});
|
||||
function plusReady() {
|
||||
let ws = plus.webview.currentWebview();
|
||||
console.log(ws);
|
||||
}
|
||||
if (window.plus) {
|
||||
plusReady();
|
||||
} else {
|
||||
document.addEventListener("plusready", plusReady, false);
|
||||
}
|
||||
|
||||
// 预加载一些窗口
|
||||
preLoad([
|
||||
{
|
||||
url: "./vux.index.html",
|
||||
id: "vux.index",
|
||||
title: "vux演示页"
|
||||
},
|
||||
{
|
||||
url: "./goods.detail.html",
|
||||
id: "goods.detail",
|
||||
title: "美国伽力果",
|
||||
extras: {
|
||||
id: 2018,
|
||||
name: "超级红苹果"
|
||||
}
|
||||
},
|
||||
{
|
||||
url: "./goods.cart.html",
|
||||
id: "goods.cart",
|
||||
title: "购物车",
|
||||
style: {
|
||||
titleNView: {
|
||||
backgroundColor: "#f7f7f7", // 导航栏背景色
|
||||
titleText: "购物车", // 导航栏标题
|
||||
titleColor: "#666", // 文字颜色
|
||||
// type: "transparent", // 透明渐变样式
|
||||
autoBackButton: true, // 自动绘制返回箭头
|
||||
splitLine: {
|
||||
// 底部分割线
|
||||
color: "#cccccc"
|
||||
}
|
||||
},
|
||||
popGesture: "none"
|
||||
}
|
||||
}
|
||||
]);
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
activeName: "1",
|
||||
count: 0,
|
||||
isLoading: false,
|
||||
active: 0,
|
||||
list: [],
|
||||
loading: false,
|
||||
finished: false,
|
||||
show: false,
|
||||
actions: [
|
||||
{
|
||||
name: "选项",
|
||||
callback: this.onClick
|
||||
},
|
||||
{
|
||||
name: "选项",
|
||||
subname: "描述信息"
|
||||
},
|
||||
{
|
||||
name: "选项",
|
||||
loading: true
|
||||
}
|
||||
]
|
||||
};
|
||||
},
|
||||
|
||||
methods: {
|
||||
// 使用预加载速度会很快,但是没法再次传值,只能通过页面之间的通讯完成传值,参考goods.detail页面中的fire
|
||||
openGoodsDetail() {
|
||||
showWebviewById("goods.detail");
|
||||
},
|
||||
openVux() {
|
||||
showWebviewById("vux.index");
|
||||
},
|
||||
openCart() {
|
||||
showWebviewById("goods.cart");
|
||||
},
|
||||
openMui() {
|
||||
// 重写了标题样式
|
||||
openWebview(
|
||||
{
|
||||
url: "./mui.index.html",
|
||||
id: "mui.index"
|
||||
},
|
||||
{
|
||||
titleNView: {
|
||||
backgroundColor: "#f7f7f7", // 导航栏背景色
|
||||
titleText: "MUI演示", // 导航栏标题
|
||||
titleColor: "#666", // 文字颜色
|
||||
// type: "transparent", // 透明渐变样式
|
||||
autoBackButton: true, // 自动绘制返回箭头
|
||||
splitLine: {
|
||||
// 底部分割线
|
||||
color: "#cccccc"
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
id: 2018,
|
||||
name: "超级红苹果"
|
||||
}
|
||||
);
|
||||
// openWebview("./mui.index.html", "mui.index", "Mui演示");
|
||||
},
|
||||
camera() {
|
||||
var cmr = plus.camera.getCamera();
|
||||
cmr.captureImage(
|
||||
function(p) {
|
||||
plus.nativeUI.alert("成功：" + p);
|
||||
plus.io.resolveLocalFileSystemURL(
|
||||
p,
|
||||
function(entry) {
|
||||
// createItem(entry);
|
||||
},
|
||||
function(e) {
|
||||
console.log("读取拍照文件错误：" + e.message);
|
||||
}
|
||||
);
|
||||
},
|
||||
function(e) {
|
||||
console.log("失败：" + e.message);
|
||||
},
|
||||
{ filename: "_doc/camera/", index: 1 }
|
||||
);
|
||||
},
|
||||
vantDialog() {
|
||||
Dialog.alert({
|
||||
title: "标题",
|
||||
message: "弹窗内容"
|
||||
}).then(() => {
|
||||
// on close
|
||||
});
|
||||
},
|
||||
vantToast() {
|
||||
Toast("我是提示文案，建议不超过十五字~");
|
||||
},
|
||||
toast() {
|
||||
plus.nativeUI.toast("Hier");
|
||||
},
|
||||
|
||||
onRefresh() {
|
||||
this.isLoading = true;
|
||||
request({
|
||||
url: DOUBANAPI + "/v2/book/search?q=javascript&count=2"
|
||||
})
|
||||
.then(res => {
|
||||
this.isLoading = false;
|
||||
plus.nativeUI.toast("Ajax请求成功");
|
||||
console.log(res);
|
||||
})
|
||||
.catch(err => {
|
||||
this.isLoading = false;
|
||||
console.error(err);
|
||||
});
|
||||
},
|
||||
openAS() {
|
||||
this.show = !this.show;
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="less">
|
||||
:global {
|
||||
body {
|
||||
background-color: #f8f8f8;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
font-family: PingFang SC, Helvetica Neue, Arial, sans-serif;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Executable
BIN
Binary file not shown.
|
After Width: | Height: | Size: 23 KiB |
Executable
+5615
File diff suppressed because it is too large.
Load diff
+9
@@ -0,0 +1,9 @@
|
||||
/*!
|
||||
* =====================================================
|
||||
* Mui v3.7.2 (http://dev.dcloud.net.cn/mui)
|
||||
* =====================================================
|
||||
*/
|
||||
var mui=function(a,b){var c=/complete|loaded|interactive/,d=/^#([\w-]+)$/,e=/^\.([\w-]+)$/,f=/^[\w-]+$/,g=/translate(?:3d)?\((.+?)\)/,h=/matrix(3d)?\((.+?)\)/,i=function(b,c){if(c=c||a,!b)return j();if("object"==typeof b)return i.isArrayLike(b)?j(i.slice.call(b),null):j([b],null);if("function"==typeof b)return i.ready(b);if("string"==typeof b)try{if(b=b.trim(),d.test(b)){var e=a.getElementById(RegExp.$1);return j(e?[e]:[])}return j(i.qsa(b,c),b)}catch(f){}return j()},j=function(a,b){return a=a||[],Object.setPrototypeOf(a,i.fn),a.selector=b||"",a};i.uuid=0,i.data={},i.extend=function(){var a,c,d,e,f,g,h=arguments[0]||{},j=1,k=arguments.length,l=!1;for("boolean"==typeof h&&(l=h,h=arguments[j]||{},j++),"object"==typeof h||i.isFunction(h)||(h={}),j===k&&(h=this,j--);k>j;j++)if(null!=(a=arguments[j]))for(c in a)d=h[c],e=a[c],h!==e&&(l&&e&&(i.isPlainObject(e)||(f=i.isArray(e)))?(f?(f=!1,g=d&&i.isArray(d)?d:[]):g=d&&i.isPlainObject(d)?d:{},h[c]=i.extend(l,g,e)):e!==b&&(h[c]=e));return h},i.noop=function(){},i.slice=[].slice,i.filter=[].filter,i.type=function(a){return null==a?String(a):k[{}.toString.call(a)]||"object"},i.isArray=Array.isArray||function(a){return a instanceof Array},i.isArrayLike=function(a){var b=!!a&&"length"in a&&a.length,c=i.type(a);return"function"===c||i.isWindow(a)?!1:"array"===c||0===b||"number"==typeof b&&b>0&&b-1 in a},i.isWindow=function(a){return null!=a&&a===a.window},i.isObject=function(a){return"object"===i.type(a)},i.isPlainObject=function(a){return i.isObject(a)&&!i.isWindow(a)&&Object.getPrototypeOf(a)===Object.prototype},i.isEmptyObject=function(a){for(var c in a)if(c!==b)return!1;return!0},i.isFunction=function(a){return"function"===i.type(a)},i.qsa=function(b,c){return c=c||a,i.slice.call(e.test(b)?c.getElementsByClassName(RegExp.$1):f.test(b)?c.getElementsByTagName(b):c.querySelectorAll(b))},i.ready=function(b){return c.test(a.readyState)?b(i):a.addEventListener("DOMContentLoaded",function(){b(i)},!1),this},i.buffer=function(a,b,c){function d(){e&&(e.cancel(),e=0),f=i.now(),a.apply(c||this,arguments),g=i.now()}var e,f=0,g=0,b=b||150;return i.extend(function(){!f||g>=f&&i.now()-g>b||f>g&&i.now()-f>8*b?d.apply(this,arguments):(e&&e.cancel(),e=i.later(d,b,null,i.slice.call(arguments)))},{stop:function(){e&&(e.cancel(),e=0)}})},i.each=function(a,b,c){if(!a)return this;if("number"==typeof a.length)[].every.call(a,function(a,c){return b.call(a,c,a)!==!1});else for(var d in a)if(c){if(a.hasOwnProperty(d)&&b.call(a[d],d,a[d])===!1)return a}else if(b.call(a[d],d,a[d])===!1)return a;return this},i.focus=function(a){i.os.ios?setTimeout(function(){a.focus()},10):a.focus()},i.trigger=function(a,b,c){return a.dispatchEvent(new CustomEvent(b,{detail:c,bubbles:!0,cancelable:!0})),this},i.getStyles=function(a,b){var c=a.ownerDocument.defaultView.getComputedStyle(a,null);return b?c.getPropertyValue(b)||c[b]:c},i.parseTranslate=function(a,b){var c=a.match(g||"");return c&&c[1]||(c=["","0,0,0"]),c=c[1].split(","),c={x:parseFloat(c[0]),y:parseFloat(c[1]),z:parseFloat(c[2])},b&&c.hasOwnProperty(b)?c[b]:c},i.parseTranslateMatrix=function(a,b){var c=a.match(h),d=c&&c[1];c?(c=c[2].split(","),"3d"===d?c=c.slice(12,15):(c.push(0),c=c.slice(4,7))):c=[0,0,0];var e={x:parseFloat(c[0]),y:parseFloat(c[1]),z:parseFloat(c[2])};return b&&e.hasOwnProperty(b)?e[b]:e},i.hooks={},i.addAction=function(a,b){var c=i.hooks[a];return c||(c=[]),b.index=b.index||1e3,c.push(b),c.sort(function(a,b){return a.index-b.index}),i.hooks[a]=c,i.hooks[a]},i.doAction=function(a,b){i.isFunction(b)?i.each(i.hooks[a],b):i.each(i.hooks[a],function(a,b){return!b.handle()})},i.later=function(a,b,c,d){b=b||0;var e,f,g=a,h=d;return"string"==typeof a&&(g=c[a]),e=function(){g.apply(c,i.isArray(h)?h:[h])},f=setTimeout(e,b),{id:f,cancel:function(){clearTimeout(f)}}},i.now=Date.now||function(){return+new Date};var k={};return i.each(["Boolean","Number","String","Function","Array","Date","RegExp","Object","Error"],function(a,b){k["[object "+b+"]"]=b.toLowerCase()}),window.JSON&&(i.parseJSON=JSON.parse),i.fn={each:function(a){return[].every.call(this,function(b,c){return a.call(b,c,b)!==!1}),this}},"function"==typeof define&&define.amd&&define("mui",[],function(){return i}),i}(document);!function(a,b){function c(c){this.os={};var d=[function(){var a=c.match(/(MicroMessenger)\/([\d\.]+)/i);return a&&(this.os.wechat={version:a[2].replace(/_/g,".")}),!1},function(){var a=c.match(/(Android);?[\s\/]+([\d.]+)?/);return a&&(this.os.android=!0,this.os.version=a[2],this.os.isBadAndroid=!/Chrome\/\d/.test(b.navigator.appVersion)),this.os.android===!0},function(){var a=c.match(/(iPhone\sOS)\s([\d_]+)/);if(a)this.os.ios=this.os.iphone=!0,this.os.version=a[2].replace(/_/g,".");else{var b=c.match(/(iPad).*OS\s([\d_]+)/);b&&(this.os.ios=this.os.ipad=!0,this.os.version=b[2].replace(/_/g,"."))}return this.os.ios===!0}];[].every.call(d,function(b){return!b.call(a)})}c.call(a,navigator.userAgent)}(mui,window),function(a,b){function c(c){this.os=this.os||{};var d=c.Line truncated
|
||||
e&&e.evalJS("mui&&mui.menu();")}};var c=function(){a.back()},d=function(){a.menu()};a.plusReady(function(){a.options.keyEventBind.backbutton&&plus.key.addEventListener("backbutton",c,!1),a.options.keyEventBind.menubutton&&plus.key.addEventListener("menubutton",d,!1)}),a.addInit({name:"keyEventBind",index:1e3,handle:function(){a.plusReady(function(){a.options.keyEventBind.backbutton||plus.key.removeEventListener("backbutton",c),a.options.keyEventBind.menubutton||plus.key.removeEventListener("menubutton",d)})}})}(mui,window),function(a){a.addInit({name:"pullrefresh",index:1e3,handle:function(){var b=a.options,c=b.pullRefresh||{},d=c.down&&c.down.hasOwnProperty("callback"),e=c.up&&c.up.hasOwnProperty("callback");if(d||e){var f=c.container;if(f){var g=a(f);1===g.length&&(a.os.plus?d&&"circle"==c.down.style?a.plusReady(function(){a.fn.pullRefresh=a.fn.pullRefresh_native,g.pullRefresh(c)}):a.os.android?a.plusReady(function(){a.fn.pullRefresh=a.fn.pullRefresh_native;var b=plus.webview.currentWebview();if(window.__NWin_Enable__===!1)g.pullRefresh(c);else{if(e){var f={};f.up=c.up,f.webviewId=b.id||b.getURL(),g.pullRefresh(f)}if(d){var h=b.parent(),i=b.id||b.getURL();if(h){e||g.pullRefresh({webviewId:i});var j={webviewId:i};j.down=a.extend({},c.down),j.down.callback="_CALLBACK",h.evalJS("mui.fn.pullRefresh=mui.fn.pullRefresh_native"),h.evalJS("mui&&mui(document.querySelector('.mui-content')).pullRefresh('"+JSON.stringify(j)+"')")}}}}):g.pullRefresh(c):g.pullRefresh(c))}}}})}(mui),function(a,b,c){var d="application/json",e="text/html",f=/<script\b[^<]*(?:(?!<\/script>)<[^<]*)*<\/script>/gi,g=/^(?:text|application)\/javascript/i,h=/^(?:text|application)\/xml/i,i=/^\s*$/;a.ajaxSettings={type:"GET",beforeSend:a.noop,success:a.noop,error:a.noop,complete:a.noop,context:null,xhr:function(a){return new b.XMLHttpRequest},accepts:{script:"text/javascript, application/javascript, application/x-javascript",json:d,xml:"application/xml, text/xml",html:e,text:"text/plain"},timeout:0,processData:!0,cache:!0};var j=function(a,b){var c=b.context;return b.beforeSend.call(c,a,b)===!1?!1:void 0},k=function(a,b,c){c.success.call(c.context,a,"success",b),m("success",b,c)},l=function(a,b,c,d){d.error.call(d.context,c,b,a),m(b,c,d)},m=function(a,b,c){c.complete.call(c.context,b,a)},n=function(b,c,d,e){var f,g=a.isArray(c),h=a.isPlainObject(c);a.each(c,function(c,i){f=a.type(i),e&&(c=d?e:e+"["+(h||"object"===f||"array"===f?c:"")+"]"),!e&&g?b.add(i.name,i.value):"array"===f||!d&&"object"===f?n(b,i,d,c):b.add(c,i)})},o=function(b){if(b.processData&&b.data&&"string"!=typeof b.data){var e=b.contentType;!e&&b.headers&&(e=b.headers["Content-Type"]),e&&~e.indexOf(d)?b.data=JSON.stringify(b.data):b.data=a.param(b.data,b.traditional)}!b.data||b.type&&"GET"!==b.type.toUpperCase()||(b.url=p(b.url,b.data),b.data=c)},p=function(a,b){return""===b?a:(a+"&"+b).replace(/[&?]{1,2}/,"?")},q=function(a){return a&&(a=a.split(";",2)[0]),a&&(a===e?"html":a===d?"json":g.test(a)?"script":h.test(a)&&"xml")||"text"},r=function(b,d,e,f){return a.isFunction(d)&&(f=e,e=d,d=c),a.isFunction(e)||(f=e,e=c),{url:b,data:d,success:e,dataType:f}};a.ajax=function(d,e){"object"==typeof d&&(e=d,d=c);var f=e||{};f.url=d||f.url;for(var g in a.ajaxSettings)f[g]===c&&(f[g]=a.ajaxSettings[g]);o(f);var h=f.dataType;f.cache!==!1&&(e&&e.cache===!0||"script"!==h)||(f.url=p(f.url,"_="+a.now()));var m,n=f.accepts[h&&h.toLowerCase()],r={},s=function(a,b){r[a.toLowerCase()]=[a,b]},t=/^([\w-]+:)\/\//.test(f.url)?RegExp.$1:b.location.protocol,u=f.xhr(f),v=u.setRequestHeader;if(s("X-Requested-With","XMLHttpRequest"),s("Accept",n||"*/*"),(n=f.mimeType||n)&&(n.indexOf(",")>-1&&(n=n.split(",",2)[0]),u.overrideMimeType&&u.overrideMimeType(n)),(f.contentType||f.contentType!==!1&&f.data&&"GET"!==f.type.toUpperCase())&&s("Content-Type",f.contentType||"application/x-www-form-urlencoded"),f.headers)for(var w in f.headers)s(w,f.headers[w]);if(u.setRequestHeader=s,u.onreadystatechange=function(){if(4===u.readyState){u.onreadystatechange=a.noop,clearTimeout(m);var b,c=!1,d="file:"===t;if(u.status>=200&&u.status<300||304===u.status||0===u.status&&d&&u.responseText){h=h||q(f.mimeType||u.getResponseHeader("content-type")),b=u.responseText;try{"script"===h?(1,eval)(b):"xml"===h?b=u.responseXML:"json"===h&&(b=i.test(b)?null:a.parseJSON(b))}catch(e){c=e}c?l(c,"parsererror",u,f):k(b,u,f)}else{var g=u.status?"error":"abort",j=u.statusText||null;d&&(g="error",j="404"),l(j,g,u,f)}}},j(u,f)===!1)return u.abort(),l(null,"abort",u,f),u;if(f.xhrFields)for(var w in f.xhrFields)u[w]=f.xhrFields[w];var x="async"in f?f.async:!0;u.open(f.type.toUpperCase(),f.url,x,f.username,f.password);for(var w in r)r.hasOwnProperty(w)&&v.apply(u,r[w]);return f.timeout>0&&(m=setTimeout(function(){u.onreadystatechange=a.noop,u.abort(),l(null,"timeout",u,f)},f.timeout)),u.send(f.data?f.data:null),u},a.param=function(a,b){var c=[];return c.add=function(a,b){this.push(encodeURIComponent(a)+"="+encodeURIComponent(b))},n(c,a,b),c.join("&").replace(Line truncated
|
||||
this._super()}},a.PullRefresh));a.fn.pullRefresh=function(b){if(1===this.length){var c=this[0],d=null,e=c.getAttribute("data-pullrefresh");return e||"undefined"!=typeof b?(b=b||{},e?d=a.data[e]:(e=++a.uuid,a.data[e]=d=new g(c,b),c.setAttribute("data-pullrefresh",e)),b.down&&b.down.auto?d.pulldownLoading(b.down.autoY):b.up&&b.up.auto&&d.pullupLoading(),d):!1}}}(mui,window,document),function(a,b){var c="mui-slider",d="mui-slider-group",e="mui-slider-loop",f="mui-action-previous",g="mui-action-next",h="mui-slider-item",i="mui-active",j="."+h,k=".mui-slider-progress-bar",l=a.Slider=a.Scroll.extend({init:function(b,c){this._super(b,a.extend(!0,{fingers:1,interval:0,scrollY:!1,scrollX:!0,indicators:!1,scrollTime:1e3,startX:!1,slideTime:0,snap:j},c)),this.options.startX},_init:function(){this._reInit(),this.scroller&&(this.scrollerStyle=this.scroller.style,this.progressBar=this.wrapper.querySelector(k),this.progressBar&&(this.progressBarWidth=this.progressBar.offsetWidth,this.progressBarStyle=this.progressBar.style),this._super(),this._initTimer())},_triggerSlide:function(){var b=this;b.isInTransition=!1;b.currentPage;b.slideNumber=b._fixedSlideNumber(),b.loop&&(0===b.slideNumber?b.setTranslate(b.pages[1][0].x,0):b.slideNumber===b.itemLength-3&&b.setTranslate(b.pages[b.itemLength-2][0].x,0)),b.lastSlideNumber!=b.slideNumber&&(b.lastSlideNumber=b.slideNumber,b.lastPage=b.currentPage,a.trigger(b.wrapper,"slide",{slideNumber:b.slideNumber})),b._initTimer()},_handleSlide:function(b){var c=this;if(b.target===c.wrapper){var d=b.detail;d.slideNumber=d.slideNumber||0;for(var e=c.scroller.querySelectorAll(j),f=[],g=0,h=e.length;h>g;g++){var k=e[g];k.parentNode===c.scroller&&f.push(k)}var l=d.slideNumber;if(c.loop&&(l+=1),!c.wrapper.classList.contains("mui-segmented-control"))for(var g=0,h=f.length;h>g;g++){var k=f[g];k.parentNode===c.scroller&&(g===l?k.classList.add(i):k.classList.remove(i))}var m=c.wrapper.querySelector(".mui-slider-indicator");if(m){m.getAttribute("data-scroll")&&a(m).scroll().gotoPage(d.slideNumber);var n=m.querySelectorAll(".mui-indicator");if(n.length>0)for(var g=0,h=n.length;h>g;g++)n[g].classList[g===d.slideNumber?"add":"remove"](i);else{var o=m.querySelector(".mui-number span");if(o)o.innerText=d.slideNumber+1;else for(var p=m.querySelectorAll(".mui-control-item"),g=0,h=p.length;h>g;g++)p[g].classList[g===d.slideNumber?"add":"remove"](i)}}b.stopPropagation()}},_handleTabShow:function(a){var b=this;b.gotoItem(a.detail.tabNumber||0,b.options.slideTime)},_handleIndicatorTap:function(a){var b=this,c=a.target;(c.classList.contains(f)||c.classList.contains(g))&&(b[c.classList.contains(f)?"prevItem":"nextItem"](),a.stopPropagation())},_initEvent:function(b){var c=this;c._super(b);var d=b?"removeEventListener":"addEventListener";c.wrapper[d]("slide",this),c.wrapper[d](a.eventName("shown","tab"),this)},handleEvent:function(b){switch(this._super(b),b.type){case"slide":this._handleSlide(b);break;case a.eventName("shown","tab"):~this.snaps.indexOf(b.target)&&this._handleTabShow(b)}},_scrollend:function(a){this._super(a),this._triggerSlide(a)},_drag:function(a){this._super(a);var c=a.detail.direction;if("left"===c||"right"===c){var d=this.wrapper.getAttribute("data-slidershowTimer");d&&b.clearTimeout(d),a.stopPropagation()}},_initTimer:function(){var a=this,c=a.wrapper,d=a.options.interval,e=c.getAttribute("data-slidershowTimer");e&&b.clearTimeout(e),d&&(e=b.setTimeout(function(){c&&((c.offsetWidth||c.offsetHeight)&&a.nextItem(!0),a._initTimer())},d),c.setAttribute("data-slidershowTimer",e))},_fixedSlideNumber:function(a){a=a||this.currentPage;var b=a.pageX;return this.loop&&(b=0===a.pageX?this.itemLength-3:a.pageX===this.itemLength-1?0:a.pageX-1),b},_reLayout:function(){this.hasHorizontalScroll=!0,this.loop=this.scroller.classList.contains(e),this._super()},_getScroll:function(){var b=a.parseTranslateMatrix(a.getStyles(this.scroller,"webkitTransform"));return b?b.x:0},_transitionEnd:function(b){b.target===this.scroller&&this.isInTransition&&(this._transitionTime(),this.isInTransition=!1,a.trigger(this.wrapper,"scrollend",this))},_flick:function(a){if(this.moved){var b=a.detail,c=b.direction;this._clearRequestAnimationFrame(),this.isInTransition=!0,"flick"===a.type?(b.deltaTime<200&&(this.x=this._getPage(this.slideNumber+("right"===c?-1:1),!0).x),this.resetPosition(this.options.bounceTime)):"dragend"!==a.type||b.flick||this.resetPosition(this.options.bounceTime),a.stopPropagation()}},_initSnap:function(){if(this.scrollerWidth=this.itemLength*this.scrollerWidth,this.maxScrollX=Math.min(this.wrapperWidth-this.scrollerWidth,0),this._super(),this.currentPage.x)this.slideNumber=this._fixedSlideNumber(),this.lastSlideNumber="undefined"==typeof this.lastSlideNumber?this.slideNumber:this.lastSlideNumber;else{var a=this.pages[this.loop?1:0];if(a=a||this.pages[0],!a)return;this.currentPage=a[0],this.slideNumber=0,this.lastSlideNumber="undefined"==typeof this.lastSlideNumber?0:this.lastSlideNumber}this.options.startX=thiLine truncated
|
||||
this.isDragging||("left"===b.direction||"right"===b.direction)&&(this.isDragging=!0,this.lastChanged=void 0,this.initialState=this.classList.contains(f)),this.isDragging&&(this.setTranslateX(b.deltaX),a.stopPropagation(),b.gesture.preventDefault())},k.prototype.swiperight=function(a){this.isDragging&&a.stopPropagation()},k.prototype.end=function(b){this.classList.remove(g),this.isDragging?(this.isDragging=!1,b.stopPropagation(),a.trigger(this.element,"toggle",{isActive:this.classList.contains(f)})):this.toggle()},k.prototype.toggle=function(b){var c=this.classList;b===!1?this.handle.style.webkitTransitionDuration=this.element.style.webkitTransitionDuration="0s":this.handle.style.webkitTransitionDuration=this.element.style.webkitTransitionDuration=".2s",c.contains(f)?(c.remove(f),this.handle.style.webkitTransform="translate(0,0)"):(c.add(f),this.handle.style.webkitTransform="translate("+this.handleX+"px,0)"),a.trigger(this.element,"toggle",{isActive:this.classList.contains(f)})},k.prototype.setTranslateX=a.animationFrame(function(a){if(this.isDragging){var b=!1;(this.initialState&&-a>this.handleX/2||!this.initialState&&a>this.handleX/2)&&(b=!0),this.lastChanged!==b&&(b?(this.handle.style.webkitTransform="translate("+(this.initialState?0:this.handleX)+"px,0)",this.classList[this.initialState?"remove":"add"](f)):(this.handle.style.webkitTransform="translate("+(this.initialState?this.handleX:0)+"px,0)",this.classList[this.initialState?"add":"remove"](f)),this.lastChanged=b)}}),a.fn["switch"]=function(b){var c=[];return this.each(function(){var b=null,d=this.getAttribute("data-switch");d?b=a.data[d]:(d=++a.uuid,a.data[d]=new k(this),this.setAttribute("data-switch",d)),c.push(b)}),c.length>1?c:c[0]},a.ready(function(){a("."+d)["switch"]()})}(mui,window,"toggle"),function(a,b,c){function d(a,b){var c=b?"removeEventListener":"addEventListener";a[c]("drag",F),a[c]("dragend",F),a[c]("swiperight",F),a[c]("swipeleft",F),a[c]("flick",F)}var e,f,g="mui-active",h="mui-selected",i="mui-grid-view",j="mui-table-view-radio",k="mui-table-view-cell",l="mui-collapse-content",m="mui-disabled",n="mui-switch",o="mui-btn",p="mui-slider-handle",q="mui-slider-left",r="mui-slider-right",s="mui-transitioning",t="."+p,u="."+q,v="."+r,w="."+h,x="."+o,y=.8,z=isOpened=openedActions=progress=!1,A=sliderActionLeft=sliderActionRight=buttonsLeft=buttonsRight=sliderDirection=sliderRequestAnimationFrame=!1,B=translateX=lastTranslateX=sliderActionLeftWidth=sliderActionRightWidth=0,C=function(a){a?f?f.classList.add(g):e&&e.classList.add(g):(B&&B.cancel(),f?f.classList.remove(g):e&&e.classList.remove(g))},D=function(){if(translateX!==lastTranslateX){if(buttonsRight&&buttonsRight.length>0){progress=translateX/sliderActionRightWidth,translateX<-sliderActionRightWidth&&(translateX=-sliderActionRightWidth-Math.pow(-translateX-sliderActionRightWidth,y));for(var a=0,b=buttonsRight.length;b>a;a++){var c=buttonsRight[a];"undefined"==typeof c._buttonOffset&&(c._buttonOffset=c.offsetLeft),buttonOffset=c._buttonOffset,E(c,translateX-buttonOffset*(1+Math.max(progress,-1)))}}if(buttonsLeft&&buttonsLeft.length>0){progress=translateX/sliderActionLeftWidth,translateX>sliderActionLeftWidth&&(translateX=sliderActionLeftWidth+Math.pow(translateX-sliderActionLeftWidth,y));for(var a=0,b=buttonsLeft.length;b>a;a++){var d=buttonsLeft[a];"undefined"==typeof d._buttonOffset&&(d._buttonOffset=sliderActionLeftWidth-d.offsetLeft-d.offsetWidth),buttonOffset=d._buttonOffset,buttonsLeft.length>1&&(d.style.zIndex=buttonsLeft.length-a),E(d,translateX+buttonOffset*(1-Math.min(progress,1)))}}E(A,translateX),lastTranslateX=translateX}sliderRequestAnimationFrame=requestAnimationFrame(function(){D()})},E=function(a,b){a&&(a.style.webkitTransform="translate("+b+"px,0)")};b.addEventListener(a.EVENT_START,function(b){e&&C(!1),e=f=!1,z=isOpened=openedActions=!1;for(var g=b.target,h=!1;g&&g!==c;g=g.parentNode)if(g.classList){var p=g.classList;if(("INPUT"===g.tagName&&"radio"!==g.type&&"checkbox"!==g.type||"BUTTON"===g.tagName||p.contains(n)||p.contains(o)||p.contains(m))&&(h=!0),p.contains(l))break;if(p.contains(k)){e=g;var q=e.parentNode.querySelector(w);if(!e.parentNode.classList.contains(j)&&q&&q!==e)return a.swipeoutClose(q),void(e=h=!1);if(!e.parentNode.classList.contains(i)){var r=e.querySelector("a");r&&r.parentNode===e&&(f=r)}var s=e.querySelector(t);s&&(d(e),b.stopPropagation()),h||(s?(B&&B.cancel(),B=a.later(function(){C(!0)},100)):C(!0));break}}}),b.addEventListener(a.EVENT_MOVE,function(a){C(!1)});var F={handleEvent:function(a){switch(a.type){case"drag":this.drag(a);break;case"dragend":this.dragend(a);break;case"flick":this.flick(a);break;case"swiperight":this.swiperight(a);break;case"swipeleft":this.swipeleft(a)}},drag:function(a){if(e){z||(A=sliderActionLeft=sliderActionRight=buttonsLeft=buttonsRight=sliderDirection=sliderRequestAnimationFrame=!1,A=e.querySelector(t),A&&(sliderActionLeft=e.querySelector(u),sliderActionRight=e.querySelector(v),sliderActionLeft&&(sliderActionLefLine truncated
|
||||
Executable
BIN
Binary file not shown.
Executable
+113
@@ -0,0 +1,113 @@
|
||||
<template>
|
||||
<div class="hello">
|
||||
<h1>{{ msg }}</h1>
|
||||
<h2>Essential Links</h2>
|
||||
<ul>
|
||||
<li>
|
||||
<a
|
||||
href="https://vuejs.org"
|
||||
target="_blank"
|
||||
>
|
||||
Core Docs
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a
|
||||
href="https://forum.vuejs.org"
|
||||
target="_blank"
|
||||
>
|
||||
Forum
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a
|
||||
href="https://chat.vuejs.org"
|
||||
target="_blank"
|
||||
>
|
||||
Community Chat
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a
|
||||
href="https://twitter.com/vuejs"
|
||||
target="_blank"
|
||||
>
|
||||
Twitter
|
||||
</a>
|
||||
</li>
|
||||
<br>
|
||||
<li>
|
||||
<a
|
||||
href="http://vuejs-templates.github.io/webpack/"
|
||||
target="_blank"
|
||||
>
|
||||
Docs for This Template
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<h2>Ecosystem</h2>
|
||||
<ul>
|
||||
<li>
|
||||
<a
|
||||
href="http://router.vuejs.org/"
|
||||
target="_blank"
|
||||
>
|
||||
vue-router
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a
|
||||
href="http://vuex.vuejs.org/"
|
||||
target="_blank"
|
||||
>
|
||||
vuex
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a
|
||||
href="http://vue-loader.vuejs.org/"
|
||||
target="_blank"
|
||||
>
|
||||
vue-loader
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a
|
||||
href="https://github.com/vuejs/awesome-vue"
|
||||
target="_blank"
|
||||
>
|
||||
awesome-vue
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'HelloWorld',
|
||||
data () {
|
||||
return {
|
||||
msg: 'Welcome to Your Vue.js App'
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<!-- Add "scoped" attribute to limit CSS to this component only -->
|
||||
<style scoped>
|
||||
h1, h2 {
|
||||
font-weight: normal;
|
||||
}
|
||||
ul {
|
||||
list-style-type: none;
|
||||
padding: 0;
|
||||
}
|
||||
li {
|
||||
display: inline-block;
|
||||
margin: 0 10px;
|
||||
}
|
||||
a {
|
||||
color: #42b983;
|
||||
}
|
||||
</style>
|
||||
Executable
+22
@@ -0,0 +1,22 @@
|
||||
<template>
|
||||
<div class="content">
|
||||
<slot></slot>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Vue from "vue";
|
||||
export default {
|
||||
data() {
|
||||
return {};
|
||||
},
|
||||
methods: {},
|
||||
created() {}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.content {
|
||||
padding: 0 15px;
|
||||
}
|
||||
</style>
|
||||
Executable
+31
@@ -0,0 +1,31 @@
|
||||
<template>
|
||||
<div>
|
||||
<div style="text-align:center">
|
||||
<img width="60%" src="@/assets/logo.png" alt="">
|
||||
</div>
|
||||
<van-tag mark type="success">{{info.version}}</van-tag>
|
||||
|
||||
</div>
|
||||
|
||||
</template>
|
||||
<script>
|
||||
import Vue from "vue";
|
||||
import { Tag } from "vant";
|
||||
|
||||
import { getProperty } from "../utils/plus/runtime.js";
|
||||
Vue.use(Tag);
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
info: "0"
|
||||
};
|
||||
},
|
||||
created() {
|
||||
getProperty().then(info => {
|
||||
// console
|
||||
this.info = info;
|
||||
});
|
||||
}
|
||||
};
|
||||
</script>
|
||||
Executable
+51
@@ -0,0 +1,51 @@
|
||||
// The Vue build version to load with the `import` command
|
||||
// (runtime-only or standalone) has been set in webpack.base.conf with an alias.
|
||||
import Vue from "vue";
|
||||
// import hotfix from 'h5plus-hotfix';
|
||||
import "./utils/common";
|
||||
import App from "./App";
|
||||
const appId = "com.femirror.mogoh5";
|
||||
// const updateUrl = FemirrorAPI + `/public/app/checkUpdate?bundleId=${appId}`;
|
||||
// hotfix({
|
||||
// url: updateUrl,
|
||||
// before(data) {
|
||||
// // 确认安装
|
||||
// return new Promise(resolve => {
|
||||
// plus.nativeUI.confirm(data.description, (selected) => {
|
||||
// if (selected.index === 0) {
|
||||
// plus.nativeUI.showWaiting("下载更新文件...");
|
||||
// resolve(data);
|
||||
// }
|
||||
// }, {
|
||||
// title: data.title,
|
||||
// buttons: ["确认更新", "取消"],
|
||||
// verticalAlign: "bottom"
|
||||
// });
|
||||
// });
|
||||
// },
|
||||
// success() {
|
||||
// console.log('安装成功')
|
||||
// plus.runtime.restart(); // 重启app
|
||||
// plus.nativeUI.closeWaiting();
|
||||
// },
|
||||
// error(e) {
|
||||
// // 错误显示
|
||||
// plus.nativeUI.closeWaiting();
|
||||
// console.log("安装wgt文件失败[" + e.code + "]：" + e.message);
|
||||
// plus.nativeUI.alert("安装wgt文件失败[" + e.code + "]：" + e.message);
|
||||
// },
|
||||
// onProgress(p) {
|
||||
// console.log(p) // 下载进度
|
||||
// }
|
||||
// });
|
||||
|
||||
|
||||
|
||||
Vue.config.productionTip = false;
|
||||
|
||||
/* eslint-disable no-new */
|
||||
new Vue({
|
||||
el: "#app",
|
||||
components: { App },
|
||||
template: "<App/>"
|
||||
});
|
||||
Executable
+8
@@ -0,0 +1,8 @@
|
||||
{
|
||||
"index|plusReady": "./src/main.js",
|
||||
"goods.detail": "./src/page/goods/detail.js",
|
||||
"goods.cart|plusReady": "./src/page/goods/cart.js",
|
||||
"mui.index|mui|plusReady": "./src/page/mui/index.js",
|
||||
"user.index": "./src/page/user/index.js",
|
||||
"vux.index|plusReady": "./src/page/vux/index.js"
|
||||
}
|
||||
Executable
+8
@@ -0,0 +1,8 @@
|
||||
import Vue from "vue";
|
||||
import "@/utils/common";
|
||||
import App from "./cart.vue";
|
||||
|
||||
new Vue({
|
||||
el: "#app",
|
||||
render: h => h(App)
|
||||
});
|
||||
Executable
+155
@@ -0,0 +1,155 @@
|
||||
<template>
|
||||
<div>
|
||||
<van-checkbox-group class="card-goods" v-model="checkedGoods">
|
||||
<van-checkbox
|
||||
class="card-goods__item"
|
||||
v-for="item in goods"
|
||||
:key="item.id"
|
||||
:name="item.id"
|
||||
>
|
||||
<van-card
|
||||
:title="item.title"
|
||||
:desc="item.desc"
|
||||
:num="item.num"
|
||||
:price="formatPrice(item.price)"
|
||||
:thumb="item.thumb"
|
||||
/>
|
||||
</van-checkbox>
|
||||
</van-checkbox-group>
|
||||
<van-submit-bar
|
||||
:price="totalPrice"
|
||||
:disabled="!checkedGoods.length"
|
||||
:button-text="submitBarText"
|
||||
@submit="onSubmit"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { Checkbox, CheckboxGroup, Card, SubmitBar, Toast } from "vant";
|
||||
import { confirm } from "../../utils/plus/nativeUI";
|
||||
export default {
|
||||
components: {
|
||||
[Card.name]: Card,
|
||||
[Checkbox.name]: Checkbox,
|
||||
[SubmitBar.name]: SubmitBar,
|
||||
[CheckboxGroup.name]: CheckboxGroup
|
||||
},
|
||||
created() {
|
||||
plus.key.removeEventListener("backbutton", function() {
|
||||
console.log(5555);
|
||||
});
|
||||
plus.key.addEventListener(
|
||||
"backbutton",
|
||||
function() {
|
||||
// nativeUI.conf
|
||||
// nativeUI.con
|
||||
confirm("确认要离开么?").then(e => {
|
||||
if (e.index === 0) {
|
||||
plus.nativeUI.toast("离开了");
|
||||
const ws = plus.webview.currentWebview();
|
||||
ws.hide("auto");
|
||||
} else {
|
||||
plus.nativeUI.toast("留住了");
|
||||
}
|
||||
});
|
||||
},
|
||||
false
|
||||
);
|
||||
window.addEventListener("addGoodsToCart", event => {
|
||||
//通过event.detail可获得传递过来的参数内容
|
||||
|
||||
let goods = this.goods.find(ele => {
|
||||
return ele.id == event.detail.goods_id;
|
||||
});
|
||||
goods.num++;
|
||||
plus.nativeUI.toast(`我是购物车页面,当前苹果数量为${goods.num}`);
|
||||
console.log(event.detail);
|
||||
});
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
checkedGoods: ["1", "2", "3"],
|
||||
goods: [
|
||||
{
|
||||
id: "1",
|
||||
title: "进口香蕉",
|
||||
desc: "约250g，2根",
|
||||
price: 200,
|
||||
num: 1,
|
||||
thumb:
|
||||
"https://img.yzcdn.cn/public_files/2017/10/24/2f9a36046449dafb8608e99990b3c205.jpeg"
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
title: "陕西蜜梨",
|
||||
desc: "约600g",
|
||||
price: 690,
|
||||
num: 1,
|
||||
thumb:
|
||||
"https://img.yzcdn.cn/public_files/2017/10/24/f6aabd6ac5521195e01e8e89ee9fc63f.jpeg"
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
title: "美国伽力果",
|
||||
desc: "约680g/3个",
|
||||
price: 2680,
|
||||
num: 1,
|
||||
thumb:
|
||||
"https://img.yzcdn.cn/public_files/2017/10/24/320454216bbe9e25c7651e1fa51b31fd.jpeg"
|
||||
}
|
||||
]
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
submitBarText() {
|
||||
const count = this.checkedGoods.length;
|
||||
return "结算" + (count ? `(${count})` : "");
|
||||
},
|
||||
totalPrice() {
|
||||
return this.goods.reduce(
|
||||
(total, item) =>
|
||||
total + (this.checkedGoods.indexOf(item.id) !== -1 ? item.price : 0),
|
||||
0
|
||||
);
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
formatPrice(price) {
|
||||
return (price / 100).toFixed(2);
|
||||
},
|
||||
onSubmit() {
|
||||
Toast("点击结算");
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="less">
|
||||
body {
|
||||
background-color: #f8f8f8;
|
||||
}
|
||||
.card-goods {
|
||||
padding: 10px 0;
|
||||
background-color: #fff;
|
||||
&__item {
|
||||
position: relative;
|
||||
background-color: #fafafa;
|
||||
.van-checkbox__label {
|
||||
width: 100%;
|
||||
padding: 0 10px 0 15px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.van-checkbox__icon {
|
||||
top: 50%;
|
||||
left: 10px;
|
||||
z-index: 1;
|
||||
position: absolute;
|
||||
margin-top: -10px;
|
||||
}
|
||||
.van-card__price {
|
||||
color: #f44;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Executable
+8
@@ -0,0 +1,8 @@
|
||||
import Vue from "vue";
|
||||
import "@/utils/common";
|
||||
import App from "./detail.vue";
|
||||
|
||||
new Vue({
|
||||
el: "#app",
|
||||
render: h => h(App)
|
||||
});
|
||||
Executable
+159
@@ -0,0 +1,159 @@
|
||||
<template>
|
||||
<div class="goods">
|
||||
<van-swipe class="goods-swipe" :autoplay="3000">
|
||||
<van-swipe-item v-for="thumb in goods.thumb" :key="thumb">
|
||||
<img :src="thumb">
|
||||
</van-swipe-item>
|
||||
</van-swipe>
|
||||
|
||||
<van-cell-group>
|
||||
<van-cell>
|
||||
<div class="goods-title">{{ goods.title }}</div>
|
||||
<div class="goods-price">{{ formatPrice(goods.price) }}</div>
|
||||
</van-cell>
|
||||
<van-cell class="goods-express">
|
||||
<van-col span="10">运费：{{ goods.express }}</van-col>
|
||||
<van-col span="14">剩余：{{ goods.remain }}</van-col>
|
||||
</van-cell>
|
||||
</van-cell-group>
|
||||
|
||||
<van-cell-group class="goods-cell-group">
|
||||
<van-cell value="进入店铺" icon="shop" is-link @click="sorry">
|
||||
<template slot="title">
|
||||
<span class="van-cell-text">有赞的店</span>
|
||||
<van-tag type="danger">官方</van-tag>
|
||||
</template>
|
||||
</van-cell>
|
||||
<van-cell title="线下门店" icon="location" is-link @click="sorry" />
|
||||
</van-cell-group>
|
||||
|
||||
<van-cell-group class="goods-cell-group">
|
||||
<van-cell title="查看商品详情" is-link @click="sorry" />
|
||||
</van-cell-group>
|
||||
<br><br><br><br><br>
|
||||
|
||||
<van-goods-action>
|
||||
<van-goods-action-mini-btn icon="chat" @click="sorry">
|
||||
客服
|
||||
</van-goods-action-mini-btn>
|
||||
<van-goods-action-mini-btn icon="cart" @click="onClickCart">
|
||||
购物车
|
||||
</van-goods-action-mini-btn>
|
||||
<van-goods-action-big-btn @click="sendEvent">
|
||||
触发首页事件
|
||||
</van-goods-action-big-btn>
|
||||
<van-goods-action-big-btn primary @click="sorry">
|
||||
立即购买
|
||||
</van-goods-action-big-btn>
|
||||
</van-goods-action>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
Tag,
|
||||
Col,
|
||||
Icon,
|
||||
Cell,
|
||||
CellGroup,
|
||||
Swipe,
|
||||
Toast,
|
||||
SwipeItem,
|
||||
GoodsAction,
|
||||
GoodsActionBigBtn,
|
||||
GoodsActionMiniBtn
|
||||
} from "vant";
|
||||
|
||||
import { fire } from "../../utils/envent.js";
|
||||
|
||||
export default {
|
||||
components: {
|
||||
[Tag.name]: Tag,
|
||||
[Col.name]: Col,
|
||||
[Icon.name]: Icon,
|
||||
[Cell.name]: Cell,
|
||||
[CellGroup.name]: CellGroup,
|
||||
[Swipe.name]: Swipe,
|
||||
[SwipeItem.name]: SwipeItem,
|
||||
[GoodsAction.name]: GoodsAction,
|
||||
[GoodsActionBigBtn.name]: GoodsActionBigBtn,
|
||||
[GoodsActionMiniBtn.name]: GoodsActionMiniBtn
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
goods: {
|
||||
title: "美国伽力果（约680g/3个）",
|
||||
price: 2680,
|
||||
express: "免运费",
|
||||
remain: 19,
|
||||
thumb: [
|
||||
"https://img.yzcdn.cn/public_files/2017/10/24/e5a5a02309a41f9f5def56684808d9ae.jpeg",
|
||||
"https://img.yzcdn.cn/public_files/2017/10/24/1791ba14088f9c2be8c610d0a6cc0f93.jpeg"
|
||||
]
|
||||
}
|
||||
};
|
||||
},
|
||||
created() {
|
||||
function plusReady() {
|
||||
let ws = plus.webview.currentWebview();
|
||||
// 预载网络页面
|
||||
plus.nativeUI.toast(
|
||||
`我收到的信息是:{"id":"${ws.id}","name":"${ws.name}"}`
|
||||
);
|
||||
console.log(ws);
|
||||
}
|
||||
if (window.plus) {
|
||||
plusReady();
|
||||
} else {
|
||||
document.addEventListener("plusready", plusReady, false);
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
sendEvent() {
|
||||
const indexWebview = plus.webview.getLaunchWebview();
|
||||
fire(indexWebview, "customEvent", { name: "ArH", project: "MogoH5+" });
|
||||
},
|
||||
formatPrice() {
|
||||
return "¥" + (this.goods.price / 100).toFixed(2);
|
||||
},
|
||||
onClickCart() {
|
||||
// this.$router.push("cart");
|
||||
const cartWebview = plus.webview.getWebviewById("goods.cart");
|
||||
fire(cartWebview, "addGoodsToCart", { goods_id: 3, num: 1 });
|
||||
},
|
||||
sorry() {
|
||||
Toast("暂无后续逻辑~");
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="less">
|
||||
.goods {
|
||||
padding-bottom: 50px;
|
||||
&-swipe {
|
||||
img {
|
||||
width: 100%;
|
||||
// height: 7.5rem;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
&-title {
|
||||
font-size: 16px;
|
||||
}
|
||||
&-price {
|
||||
color: #f44;
|
||||
}
|
||||
&-express {
|
||||
color: #999;
|
||||
font-size: 12px;
|
||||
padding: 5px 15px;
|
||||
}
|
||||
&-cell-group {
|
||||
margin: 15px 0;
|
||||
.van-cell__value {
|
||||
color: #999;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Executable
+8
@@ -0,0 +1,8 @@
|
||||
import Vue from "vue";
|
||||
import "@/utils/common";
|
||||
import App from "./index.vue";
|
||||
|
||||
new Vue({
|
||||
el: "#app",
|
||||
render: h => h(App)
|
||||
});
|
||||
Executable
+61
@@ -0,0 +1,61 @@
|
||||
<template>
|
||||
<div>
|
||||
<br><br>
|
||||
<center>
|
||||
<img width="60%" :src="img" alt="">
|
||||
</center>
|
||||
|
||||
|
||||
<br>
|
||||
<h4 style="text-align:center">Mui V2.0 </h4>
|
||||
<p style="text-align:center;padding:10px 20px">这里主要演示MUI的一些样式和JS,我仍然推荐您使用其他vueUI(Vux,Vant,mint)来代替mui</p>
|
||||
<br>
|
||||
<button @click="alert" type="button" class="mui-btn">alert</button>
|
||||
<button @click="toast" type="button" class="mui-btn mui-btn-primary">toast</button>
|
||||
<br><br>
|
||||
<form class="mui-input-group">
|
||||
<div class="mui-input-row">
|
||||
<label>用户名</label>
|
||||
<input type="text" class="mui-input-clear" placeholder="请输入用户名">
|
||||
</div>
|
||||
<div class="mui-input-row">
|
||||
<label>密码</label>
|
||||
<input type="password" class="mui-input-password" placeholder="请输入密码">
|
||||
</div>
|
||||
<div class="mui-button-row">
|
||||
<button type="button" class="mui-btn mui-btn-primary">确认</button>
|
||||
<button type="button" class="mui-btn mui-btn-danger">取消</button>
|
||||
</div>
|
||||
</form>
|
||||
<br><br>
|
||||
<ul class="mui-table-view">
|
||||
<li class="mui-table-view-cell mui-collapse">
|
||||
<a class="mui-navigate-right" href="#">面板1</a>
|
||||
<div class="mui-collapse-content">
|
||||
<p>面板1子内容</p>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
img: require("@/assets/logo.png")
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
alert() {
|
||||
mui.alert("Mogo H5+");
|
||||
},
|
||||
toast() {
|
||||
mui.toast("嘿嘿,有问题issue哦");
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="less">
|
||||
</style>
|
||||
Executable
+8
@@ -0,0 +1,8 @@
|
||||
import Vue from "vue";
|
||||
import "@/utils/common";
|
||||
import App from "./index.vue";
|
||||
|
||||
new Vue({
|
||||
el: "#root",
|
||||
render: h => h(App)
|
||||
});
|
||||
Executable
+65
@@ -0,0 +1,65 @@
|
||||
<template>
|
||||
<div>
|
||||
<img class="user-poster" src="https://img.yzcdn.cn/public_files/2017/10/23/8690bb321356070e0b8c4404d087f8fd.png">
|
||||
<van-row class="user-links">
|
||||
<van-col span="6">
|
||||
<van-icon name="pending-payment" /> 待付款
|
||||
</van-col>
|
||||
<van-col span="6">
|
||||
<van-icon name="pending-orders" /> 待接单
|
||||
</van-col>
|
||||
<van-col span="6">
|
||||
<van-icon name="pending-deliver" /> 待发货
|
||||
</van-col>
|
||||
<van-col span="6">
|
||||
<van-icon name="logistics" /> 待发货
|
||||
</van-col>
|
||||
</van-row>
|
||||
|
||||
<van-cell-group class="user-group">
|
||||
<van-cell icon="records" title="全部订单" is-link />
|
||||
</van-cell-group>
|
||||
|
||||
<van-cell-group>
|
||||
<van-cell icon="exchange" title="我的积分" is-link />
|
||||
<van-cell icon="gold-coin" title="我的优惠券" is-link />
|
||||
<van-cell icon="gift" title="我收到的礼物" is-link />
|
||||
</van-cell-group>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { Row, Col, Icon, Cell, CellGroup } from 'vant';
|
||||
export default {
|
||||
components: {
|
||||
[Row.name]: Row,
|
||||
[Col.name]: Col,
|
||||
[Icon.name]: Icon,
|
||||
[Cell.name]: Cell,
|
||||
[CellGroup.name]: CellGroup
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less">
|
||||
.user {
|
||||
&-poster {
|
||||
width: 100%;
|
||||
// height: 4rem;
|
||||
display: block;
|
||||
}
|
||||
&-group {
|
||||
margin-bottom: 0.3rem;
|
||||
}
|
||||
&-links {
|
||||
padding: 15px 0;
|
||||
font-size: 12px;
|
||||
text-align: center;
|
||||
background-color: #fff;
|
||||
.van-icon {
|
||||
display: block;
|
||||
font-size: 24px;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Executable
+8
@@ -0,0 +1,8 @@
|
||||
import Vue from "vue";
|
||||
import "@/utils/common";
|
||||
import App from "./index.vue";
|
||||
|
||||
new Vue({
|
||||
el: "#app",
|
||||
render: h => h(App)
|
||||
});
|
||||
Executable
+173
@@ -0,0 +1,173 @@
|
||||
<template>
|
||||
<div>
|
||||
<group-title>THX to: https://github.com/wechatui/swiper</group-title>
|
||||
<group-title>list模式下，默认高度为180px, 如果设置aspect-ratio会根据宽度自动计算高度</group-title>
|
||||
<swiper :list="demo01_list" v-model="demo01_index" @on-index-change="demo01_onIndexChange"></swiper>
|
||||
<p class="copyright">Image Source: http://www.gratisography.com/</p>
|
||||
<p>current index: {{demo01_index}}</p>
|
||||
<x-button @click.native="demo01_index = 0">go to 0</x-button>
|
||||
<x-button @click.native="demo01_index = 1">go to 1</x-button>
|
||||
<x-button @click.native="demo01_index = 2">go to 2</x-button>
|
||||
<br/>
|
||||
<br/>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { Swiper, GroupTitle, SwiperItem, XButton, Divider } from "vux";
|
||||
|
||||
const baseList = [
|
||||
{
|
||||
url: "javascript:",
|
||||
img: "https://ww1.sinaimg.cn/large/663d3650gy1fq66vvsr72j20p00gogo2.jpg",
|
||||
title: "送你一朵fua"
|
||||
},
|
||||
{
|
||||
url: "javascript:",
|
||||
img: "https://ww1.sinaimg.cn/large/663d3650gy1fq66vw1k2wj20p00goq7n.jpg",
|
||||
title: "送你一辆车"
|
||||
},
|
||||
{
|
||||
url: "javascript:",
|
||||
img: "https://static.vux.li/demo/5.jpg", // 404
|
||||
title: "送你一次旅行",
|
||||
fallbackImg:
|
||||
"https://ww1.sinaimg.cn/large/663d3650gy1fq66vw50iwj20ff0aaaci.jpg"
|
||||
}
|
||||
];
|
||||
|
||||
const imgList = [
|
||||
"http://placeholder.qiniudn.com/800x300/FF3B3B/ffffff",
|
||||
"http://placeholder.qiniudn.com/800x300/FFEF7D/ffffff",
|
||||
"http://placeholder.qiniudn.com/800x300/8AEEB1/ffffff"
|
||||
];
|
||||
|
||||
const urlList = baseList.map((item, index) => ({
|
||||
url: "http://m.baidu.com",
|
||||
img: item.img,
|
||||
fallbackImg: item.fallbackImg,
|
||||
title: `(可点击)${item.title}`
|
||||
}));
|
||||
|
||||
const demoList = imgList.map((one, index) => ({
|
||||
url: "javascript:",
|
||||
img: one
|
||||
}));
|
||||
|
||||
const only2ClickList = baseList.slice(0, 2).map(item => {
|
||||
item.url = "http://m.baidu.com";
|
||||
return item;
|
||||
});
|
||||
|
||||
function b() {
|
||||
return {
|
||||
a: 1,
|
||||
c: 2
|
||||
};
|
||||
}
|
||||
|
||||
// 解构
|
||||
let s = { ...b() };
|
||||
console.log("解构测试");
|
||||
console.log(s);
|
||||
|
||||
export default {
|
||||
components: {
|
||||
Swiper,
|
||||
SwiperItem,
|
||||
GroupTitle,
|
||||
XButton,
|
||||
Divider
|
||||
},
|
||||
created() {
|
||||
console.log(plus.webview.currentWebview());
|
||||
},
|
||||
methods: {
|
||||
onSwiperItemIndexChange(index) {
|
||||
console.log("demo item change", index);
|
||||
},
|
||||
demo01_onIndexChange(index) {
|
||||
this.demo01_index = index;
|
||||
},
|
||||
demo05_onIndexChange(index) {
|
||||
this.demo05_index = index;
|
||||
},
|
||||
demo05_onLoad(id) {
|
||||
this.demo05_list = id === 1 ? baseList : demoList;
|
||||
},
|
||||
demo06_onIndexChange(index) {
|
||||
this.demo06_index = index;
|
||||
},
|
||||
demo07_onIndexChange(index) {
|
||||
this.demo07_index = index;
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
demo01_list: baseList,
|
||||
demo01_index: 1,
|
||||
swiperItemIndex: 1
|
||||
};
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.copyright {
|
||||
font-size: 12px;
|
||||
color: #ccc;
|
||||
text-align: center;
|
||||
}
|
||||
.text-scroll {
|
||||
border: 1px solid #ddd;
|
||||
border-left: none;
|
||||
border-right: none;
|
||||
}
|
||||
.text-scroll p {
|
||||
font-size: 12px;
|
||||
text-align: center;
|
||||
line-height: 30px;
|
||||
}
|
||||
.black {
|
||||
background-color: #000;
|
||||
}
|
||||
.title {
|
||||
line-height: 100px;
|
||||
text-align: center;
|
||||
color: #fff;
|
||||
}
|
||||
.animated {
|
||||
animation-duration: 1s;
|
||||
animation-fill-mode: both;
|
||||
}
|
||||
.vux-indicator.custom-bottom {
|
||||
bottom: 30px;
|
||||
}
|
||||
@-webkit-keyframes fadeInUp {
|
||||
from {
|
||||
opacity: 0;
|
||||
transform: translate3d(0, 100%, 0);
|
||||
}
|
||||
100% {
|
||||
opacity: 1;
|
||||
transform: none;
|
||||
}
|
||||
}
|
||||
@keyframes fadeInUp {
|
||||
from {
|
||||
opacity: 0;
|
||||
transform: translate3d(0, 100%, 0);
|
||||
}
|
||||
100% {
|
||||
opacity: 1;
|
||||
transform: none;
|
||||
}
|
||||
}
|
||||
.fadeInUp {
|
||||
animation-name: fadeInUp;
|
||||
}
|
||||
.swiper-demo-img img {
|
||||
width: 100%;
|
||||
}
|
||||
</style>
|
||||
Executable
+5
@@ -0,0 +1,5 @@
|
||||
# 建议
|
||||
|
||||
我们建议您将自己的常用函数库放在其他的文件夹.
|
||||
|
||||
因为我们会时而更新此文件夹中的函数
|
||||
Executable
+95
@@ -0,0 +1,95 @@
|
||||
/**
|
||||
* 该js为所有页面都必须加载的js
|
||||
* 可以用于全局添加某功能
|
||||
*/
|
||||
import FastClick from "fastclick";
|
||||
// 去除300ms延迟
|
||||
document.addEventListener(
|
||||
"DOMContentLoaded",
|
||||
function() {
|
||||
FastClick.attach(document.body);
|
||||
},
|
||||
false
|
||||
);
|
||||
|
||||
// 自动关闭窗口 可根据具体逻辑自定义
|
||||
function plusReady() {
|
||||
plus.key.addEventListener(
|
||||
"backbutton",
|
||||
function () {
|
||||
var ws = plus.webview.currentWebview();
|
||||
if (ws.webviewPreload == true) {
|
||||
plus.webview.hide(ws, 'auto');
|
||||
} else {
|
||||
plus.webview.close(ws, 'auto');
|
||||
}
|
||||
},
|
||||
false
|
||||
);
|
||||
}
|
||||
if (window.plus) {
|
||||
plusReady();
|
||||
} else {
|
||||
document.addEventListener("plusready", plusReady, false);
|
||||
}
|
||||
// 页面调试工具
|
||||
var print = function (json, options) {
|
||||
var reg = null,
|
||||
formatted = "",
|
||||
pad = 0,
|
||||
PADDING = " ";
|
||||
options = options || {};
|
||||
options.newlineAfterColonIfBeforeBraceOrBracket =
|
||||
options.newlineAfterColonIfBeforeBraceOrBracket === true ? true : false;
|
||||
options.spaceAfterColon = options.spaceAfterColon === false ? false : true;
|
||||
if (typeof json !== "string") {
|
||||
json = JSON.stringify(json);
|
||||
} else {
|
||||
json = JSON.parse(json);
|
||||
json = JSON.stringify(json);
|
||||
}
|
||||
reg = /([\{\}])/g;
|
||||
json = json.replace(reg, "\r\n$1\r\n");
|
||||
reg = /([\[\]])/g;
|
||||
json = json.replace(reg, "\r\n$1\r\n");
|
||||
reg = /(\,)/g;
|
||||
json = json.replace(reg, "$1\r\n");
|
||||
reg = /(\r\n\r\n)/g;
|
||||
json = json.replace(reg, "\r\n");
|
||||
reg = /\r\n\,/g;
|
||||
json = json.replace(reg, ",");
|
||||
if (!options.newlineAfterColonIfBeforeBraceOrBracket) {
|
||||
reg = /\:\r\n\{/g;
|
||||
json = json.replace(reg, ":{");
|
||||
reg = /\:\r\n\[/g;
|
||||
json = json.replace(reg, ":[");
|
||||
}
|
||||
if (options.spaceAfterColon) {
|
||||
reg = /\:/g;
|
||||
json = json.replace(reg, ":");
|
||||
}
|
||||
json.split("\r\n").forEach(function (node, index) {
|
||||
//console.log(node);
|
||||
var i = 0,
|
||||
indent = 0,
|
||||
padding = "";
|
||||
|
||||
if (node.match(/\{$/) || node.match(/\[$/)) {
|
||||
indent = 1;
|
||||
} else if (node.match(/\}/) || node.match(/\]/)) {
|
||||
if (pad !== 0) {
|
||||
pad -= 1;
|
||||
}
|
||||
} else {
|
||||
indent = 0;
|
||||
}
|
||||
|
||||
for (i = 0; i < pad; i++) {
|
||||
padding += PADDING;
|
||||
}
|
||||
|
||||
formatted += padding + node + "\r\n";
|
||||
pad += indent;
|
||||
});
|
||||
console.log(formatted);
|
||||
};
|
||||
Executable
+17
@@ -0,0 +1,17 @@
|
||||
/**
|
||||
* 发送自定义事件
|
||||
* @param {*} webview
|
||||
* @param {*} eventType
|
||||
* @param {*} data
|
||||
*/
|
||||
export const fire = function(webview, eventType, data) {
|
||||
console.log(data);
|
||||
webview &&
|
||||
webview.evalJS(`
|
||||
document.dispatchEvent(new CustomEvent("${eventType}", {
|
||||
detail:${JSON.stringify(data)},
|
||||
bubbles: true,
|
||||
cancelable: true
|
||||
}));
|
||||
`);
|
||||
};
|
||||
Executable
+6
@@ -0,0 +1,6 @@
|
||||
//http://www.html5plus.org/doc/zh_cn/nativeui.html#plus.nativeUI.confirm
|
||||
export function confirm(message, title = "确认") {
|
||||
return new Promise(resolve => {
|
||||
plus.nativeUI.confirm(message, resolve, title);
|
||||
});
|
||||
}
|
||||
Executable
+7
@@ -0,0 +1,7 @@
|
||||
export function getProperty() {
|
||||
return new Promise(resolve => {
|
||||
plus.runtime.getProperty(plus.runtime.appid, function(inf) {
|
||||
resolve(inf);
|
||||
});
|
||||
});
|
||||
}
|
||||
Executable
+14
@@ -0,0 +1,14 @@
|
||||
/**
|
||||
* http请求模块
|
||||
*/
|
||||
import axios from 'axios'
|
||||
|
||||
export async function request (data) {
|
||||
const conf = {
|
||||
headers: {
|
||||
// Authorization: "token"
|
||||
},
|
||||
...data
|
||||
}
|
||||
return await axios(conf)
|
||||
}
|
||||
Executable
+13
@@ -0,0 +1,13 @@
|
||||
export function isAndroid() {
|
||||
const ua = navigator.userAgent;
|
||||
return ua.match(/(Android);?[\s\/]+([\d.]+)?/);
|
||||
}
|
||||
|
||||
export function isIos() {
|
||||
const ua = navigator.userAgent;
|
||||
return ua.match(/(iPhone\sOS)\s([\d_]+)/);
|
||||
}
|
||||
|
||||
// var iphone = ua.match(/(iPhone\sOS)\s([\d_]+)/);
|
||||
// var ipad = ua.match(/(iPad).*OS\s([\d_]+)/);
|
||||
// var wechat = ua.match(/(MicroMessenger)\/([\d\.]+)/i);
|
||||
Executable
+108
@@ -0,0 +1,108 @@
|
||||
/**
|
||||
* 打开一个webview窗口
|
||||
*/
|
||||
export function openWebview(config, style = {}, extras = {}) {
|
||||
var wv = plus.webview.create(
|
||||
config.url,
|
||||
config.id,
|
||||
{
|
||||
top: 0, // 新页面顶部位置
|
||||
bottom: 0, // 新页面底部位置
|
||||
render: "always",
|
||||
popGesture: "hide",
|
||||
bounce: "vertical",
|
||||
bounceBackground: "#efeff4",
|
||||
titleNView: {
|
||||
// 详情页原生导航配置
|
||||
backgroundColor: "#f7f7f7", // 导航栏背景色
|
||||
titleText: config.title, // 导航栏标题
|
||||
titleColor: "#000000", // 文字颜色
|
||||
type: "transparent", // 透明渐变样式
|
||||
autoBackButton: true, // 自动绘制返回箭头
|
||||
splitLine: {
|
||||
// 底部分割线
|
||||
color: "#cccccc"
|
||||
}
|
||||
},
|
||||
...style
|
||||
},
|
||||
extras
|
||||
);
|
||||
var w = plus.nativeUI.showWaiting();
|
||||
// 监听窗口加载成功
|
||||
wv.addEventListener(
|
||||
"loaded",
|
||||
function () {
|
||||
wv.show("slide-in-right"); // 显示窗口
|
||||
w.close();
|
||||
w = null;
|
||||
},
|
||||
false
|
||||
);
|
||||
}
|
||||
|
||||
// webview.open 打开得很快 但是不能传参
|
||||
export function openWebviewFast(url, id, title) {
|
||||
plus.nativeUI.showWaiting("加载中");
|
||||
plus.webview.open(
|
||||
url,
|
||||
id,
|
||||
{
|
||||
titleNView: {
|
||||
backgroundColor: "#f7f7f7", // 导航栏背景色
|
||||
titleText: title, // 导航栏标题
|
||||
titleColor: "#666", // 文字颜色
|
||||
// type: "transparent", // 透明渐变样式
|
||||
autoBackButton: true, // 自动绘制返回箭头
|
||||
splitLine: {
|
||||
// 底部分割线
|
||||
color: "#cccccc"
|
||||
}
|
||||
},
|
||||
},
|
||||
"slide-in-right",
|
||||
420,
|
||||
function () {
|
||||
plus.nativeUI.closeWaiting();
|
||||
}
|
||||
);
|
||||
}
|
||||
// 预加载页面 速度很快,但是不要加载超过10个
|
||||
export function preLoad(webviews = []) {
|
||||
webviews.map(webview => {
|
||||
const fullExtras = {
|
||||
webviewPreload: true,
|
||||
...webview.extras
|
||||
};
|
||||
plus.webview.create(
|
||||
webview.url,
|
||||
webview.id,
|
||||
{
|
||||
top: 0, // 新页面顶部位置
|
||||
bottom: 0, // 新页面底部位置
|
||||
render: "always",
|
||||
popGesture: "hide",
|
||||
bounce: "vertical",
|
||||
bounceBackground: "#efeff4",
|
||||
titleNView: {
|
||||
// 详情页原生导航配置
|
||||
backgroundColor: "#f7f7f7", // 导航栏背景色
|
||||
titleText: webview.title, // 导航栏标题
|
||||
titleColor: "#000000", // 文字颜色
|
||||
type: "transparent", // 透明渐变样式
|
||||
autoBackButton: true, // 自动绘制返回箭头
|
||||
splitLine: {
|
||||
// 底部分割线
|
||||
color: "#cccccc"
|
||||
}
|
||||
},
|
||||
...webview.style
|
||||
},
|
||||
fullExtras
|
||||
);
|
||||
});
|
||||
}
|
||||
|
||||
export function showWebviewById(id) {
|
||||
plus.webview.show(id, "slide-in-right", 200);
|
||||
}
|
||||
Reference in new issue
Block a user