From 871d4095b07cedacb7fbef4c38d64982f539c404 Mon Sep 17 00:00:00 2001
From: fei.wang <wf18701153496@163.com>
Date: 星期四, 09 五月 2024 15:40:15 +0800
Subject: [PATCH] 测试提交
---
src/webapp/js/step.js | 101 ++++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 101 insertions(+), 0 deletions(-)
diff --git a/src/webapp/js/step.js b/src/webapp/js/step.js
new file mode 100644
index 0000000..baa015b
--- /dev/null
+++ b/src/webapp/js/step.js
@@ -0,0 +1,101 @@
+锘縧ayui.define(['layer', 'carousel'], function (exports) {
+ var $ = layui.jquery;
+ var layer = layui.layer;
+ var carousel = layui.carousel;
+
+ // 娣诲姞姝ラ鏉om鑺傜偣
+ var renderDom = function (elem, stepItems, postion) {
+ var stepDiv = '<div class="lay-step">';
+ for (var i = 0; i < stepItems.length; i++) {
+ stepDiv += '<div class="step-item">';
+ // 绾�
+ if (i < (stepItems.length - 1)) {
+ if (i < postion) {
+ stepDiv += '<div class="step-item-tail"><i class="step-item-tail-done"></i></div>';
+ } else {
+ stepDiv += '<div class="step-item-tail"><i class=""></i></div>';
+ }
+ }
+
+ // 鏁板瓧
+ var number = stepItems[i].number;
+ if (!number) {
+ number = i + 1;
+ }
+ if (i == postion) {
+ stepDiv += '<div class="step-item-head step-item-head-active"><i class="layui-icon">' + number + '</i></div>';
+ } else if (i < postion) {
+ stepDiv += '<div class="step-item-head"><i class="layui-icon layui-icon-ok"></i></div>';
+ } else {
+ stepDiv += '<div class="step-item-head "><i class="layui-icon">' + number + '</i></div>';
+ }
+
+ // 鏍囬鍜屾弿杩�
+ var title = stepItems[i].title;
+ var desc = stepItems[i].desc;
+ if (title || desc) {
+ stepDiv += '<div class="step-item-main">';
+ if (title) {
+ stepDiv += '<div class="step-item-main-title">' + title + '</div>';
+ }
+ if (desc) {
+ stepDiv += '<div class="step-item-main-desc">' + desc + '</div>';
+ }
+ stepDiv += '</div>';
+ }
+ stepDiv += '</div>';
+ }
+ stepDiv += '</div>';
+
+ $(elem).prepend(stepDiv);
+
+ // 璁＄畻姣忎竴涓潯鐩殑瀹藉害
+ var bfb = 100 / stepItems.length;
+ $('.step-item').css('width', bfb + '%');
+ };
+
+ var step = {
+ // 娓叉煋姝ラ鏉�
+ render: function (param) {
+ param.indicator = 'none'; // 涓嶆樉绀烘寚绀哄櫒
+ param.arrow = 'always'; // 濮嬬粓鏄剧ず绠ご
+ param.autoplay = false; // 鍏抽棴鑷姩鎾斁
+ if (!param.stepWidth) {
+ param.stepWidth = '400px';
+ }
+
+ // 娓叉煋杞挱鍥�
+ carousel.render(param);
+
+ // 娓叉煋姝ラ鏉�
+ var stepItems = param.stepItems;
+ renderDom(param.elem, stepItems, 0);
+ $('.lay-step').css('width', param.stepWidth);
+
+ //鐩戝惉杞挱鍒囨崲浜嬩欢
+ carousel.on('change(' + param.filter + ')', function (obj) {
+ $(param.elem).find('.lay-step').remove();
+ renderDom(param.elem, stepItems, obj.index);
+ $('.lay-step').css('width', param.stepWidth);
+ });
+
+ // 闅愯棌宸﹀彸绠ご鎸夐挳
+ $(param.elem).find('.layui-carousel-arrow').css('display', 'none');
+
+ // 鍘绘帀杞挱鍥剧殑鑳屾櫙棰滆壊
+ $(param.elem).css('background-color', 'transparent');
+ },
+ // 涓嬩竴姝�
+ next: function (elem) {
+ $(elem).find('.layui-carousel-arrow[lay-type=add]').trigger('click');
+ },
+ // 涓婁竴姝�
+ pre: function (elem) {
+ $(elem).find('.layui-carousel-arrow[lay-type=sub]').trigger('click');
+ }
+ };
+
+ layui.link(layui.cache.base + 'step-lay/step.css');
+
+ exports('step', step);
+});
--
Gitblit v1.9.3