root
/
ok-admin
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

add:okSweetalert2使用方法

master
bobi 2019-11-02 14:38:48 +08:00
parent ccd2b7c7a9
commit 956677419f
6 changed files with 1358 additions and 1164 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
data/navs.json
View File

@ -426,8 +426,8 @@
"href": "pages/tripartite/okNprogress.html"
},
{
"title": "okSweetalert2",
"href": "pages/tripartite/okSweetalert2.html"
"title": "okSweetAlert2",
"href": "pages/tripartite/okSweetAlert2.html"
},
{
"title": "Animate.css",

1207
lib/layui/lay/okmodules/okSweetAlert2.js Normal file
View File

File diff suppressed because one or more lines are too long

1138
lib/layui/lay/okmodules/okSweetalert2.js
View File

File diff suppressed because one or more lines are too long

2
lib/layui/layui.js
View File

@ -41,7 +41,7 @@ if (!Object.assign) {
"okToastr": "okmodules/okToastr",
"okBarcode": "okmodules/okBarcode",
"okNprogress": "okmodules/okNprogress",
"okSweetalert2": "okmodules/okSweetalert2",
"okSweetAlert2": "okmodules/okSweetAlert2",
};
var modulePath = Object.assign({
layer: "modules/layer",

148
pages/tripartite/okSweetAlert2.html Normal file
View File

@ -0,0 +1,148 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>okSweetalert2</title>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<link rel="stylesheet" href="../../css/oksub.css">
</head>
<body>
<div class="ok-body">
<blockquote class="layui-elem-quote">
<p>SweetAlert2 - 一个强大的纯Js模态消息对话框插件</p>
</blockquote>
<pre>
layui.use(["okSweetAlert2"], function () {
let okSweetAlert2 = layui.okSweetAlert2;
<br/>
okSweetAlert2.fire("欢迎使用ok-admin");
<br/>
okSweetAlert2.fire(
"关于ok-admin的问题",
"你觉得ok-admin好用吗？",
"question"
);
<br/>
okSweetAlert2.fire({
type: "error",
title: "糟糕",
text: "服务器好像开小差了！",
footer: "<a href='http://git.xlbweb.cn/ok-admin' target='_blank'>为什么会有这个问题？</a>"
});
<br/>
okSweetAlert2.fire({
type: "info",
title: "<strong>HTML <u>example</u></strong>",
html: "You can use <b>bold text</b>, " +
"<a href='http://git.xlbweb.cn/ok-admin' target='_blank'>links</a> " +
"and other HTML tags",
showCloseButton: true,
showCancelButton: true,
focusConfirm: false,
confirmButtonText: "<span class='ok-icon'>&#xe644;</span> Great!",
confirmButtonAriaLabel: "Thumbs up, great!",
cancelButtonText: "<span class='ok-icon'>&#xe64a;</span>",
cancelButtonAriaLabel: "Thumbs down"
});
<br/>
okSweetAlert2.fire({
type: "warning",
title: "你确定要这样操作吗？",
text: "此操作您将无法还原！",
showCancelButton: true,
confirmButtonColor: "#3085d6",
cancelButtonColor: "#d33",
confirmButtonText: "确定",
cancelButtonText: "取消"
}).then((result) => {
if (result.value) {
okSweetAlert2.fire(
"删除成功",
"您已经将该记录删除成功！",
"success"
)
}
});
});
</pre>
<button type="button" class="layui-btn" id="btn1">btn1</button>
<button type="button" class="layui-btn" id="btn2">btn2</button>
<button type="button" class="layui-btn" id="btn3">btn3</button>
<button type="button" class="layui-btn" id="btn4">btn4</button>
<button type="button" class="layui-btn" id="btn5">btn5</button>
</div>
<!--js逻辑-->
<script src="../../lib/layui/layui.js"></script>
<script>
layui.use(["code", "okSweetAlert2"], function () {
let code = layui.code;
let okSweetAlert2 = layui.okSweetAlert2;
let $ = layui.jquery;
code({
elem: "pre",
title: "代码示例"
});
$("#btn1").click(function () {
okSweetAlert2.fire("欢迎使用ok-admin");
});
$("#btn2").click(function () {
okSweetAlert2.fire(
"关于ok-admin的问题",
"你觉得ok-admin好用吗？",
"question"
);
});
$("#btn3").click(function () {
okSweetAlert2.fire({
type: "error",
title: "糟糕",
text: "服务器好像开小差了！",
footer: "<a href='http://git.xlbweb.cn/ok-admin' target='_blank'>为什么会有这个问题？</a>"
});
});
$("#btn4").click(function () {
okSweetAlert2.fire({
type: "info",
title: "<strong>HTML <u>example</u></strong>",
html: "You can use <b>bold text</b>, " +
"<a href='http://git.xlbweb.cn/ok-admin' target='_blank'>links</a> " +
"and other HTML tags",
showCloseButton: true,
showCancelButton: true,
focusConfirm: false,
confirmButtonText: "<span class='ok-icon'>&#xe644;</span> Great!",
confirmButtonAriaLabel: "Thumbs up, great!",
cancelButtonText: "<span class='ok-icon'>&#xe64a;</span>",
cancelButtonAriaLabel: "Thumbs down"
});
});
$("#btn5").click(function () {
okSweetAlert2.fire({
type: "warning",
title: "你确定要这样操作吗？",
text: "此操作您将无法还原！",
showCancelButton: true,
confirmButtonColor: "#3085d6",
cancelButtonColor: "#d33",
confirmButtonText: "确定",
cancelButtonText: "取消"
}).then((result) => {
if (result.value) {
okSweetAlert2.fire(
"删除成功",
"您已经将该记录删除成功！",
"success"
)
}
});
});
});
</script>
</body>
</html>

23
pages/tripartite/okSweetalert2.html
View File

@ -1,23 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>okNprogress</title>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<link rel="stylesheet" href="../../css/oksub.css">
</head>
<body>
<div class="ok-body">
</div>
<!--js逻辑-->
<script src="../../lib/layui/layui.js"></script>
<script>
layui.use(["okSweetalert2"], function () {
let okSweetalert2 = layui.okSweetalert2;
okSweetalert2("请输入内容！", "操作成功", "success");
// okSweetalert2("请输入内容！", "出错了！", "error");
});
</script>
</body>
</html>