初始化提交

common/templates/html/footerlayer/footerlayer-board-config.html

@@ -0,0 +1,102 @@
+<style>
+    div[m-id="{{d.mId}}"] {
+        display: grid;
+        grid-template-columns: auto auto auto;
+        align-items: center;
+    }
+
+    div[m-id="{{d.mId}}"] button {
+        display: flex;
+        flex-direction: row;
+        justify-content: space-between;
+        align-items: center;
+    }
+
+    div[m-id="{{d.mId}}"] button.title {
+        white-space: nowrap;
+        margin: 2px 0px;
+        padding: 0px;
+    }
+
+    div[m-id="{{d.mId}}"] button.title > p {
+        width: 100%;
+        text-align: right;
+        font-size: 14px;
+        line-height: 14px;
+    }
+
+    html[data-bs-theme=light] div[m-id="{{d.mId}}"] button.title {
+        background-color: #ffffff;
+        border: 1px #fff;
+        color: #000;
+        font-size: 14px;
+    }
+
+    html[data-bs-theme=light] div[m-id="{{d.mId}}"] button.title:hover {
+        color: #a5a5a5;
+    }
+
+    html[data-bs-theme=dark] div[m-id="{{d.mId}}"] button.title {
+        background-color: #252525;
+        border: 1px transparent;
+        color: #fff;
+        font-size: 14px;
+    }
+
+    html[data-bs-theme=dark] div[m-id="{{d.mId}}"] button.title:hover {
+        color: var(--lay-color-text-2);
+    }
+
+    div[m-id="{{d.mId}}"] button.option {
+        margin: 2px 0px;
+    }
+
+    html[data-bs-theme=light] div[m-id="{{d.mId}}"] button.option {
+        background-color: var(--app-light-color);
+    }
+
+    html[data-bs-theme=dark] div[m-id="{{d.mId}}"] button.option {
+        background-color: #007ACC;
+    }
+
+    div[m-id="{{d.mId}}"] .select2-selection--single {
+        height: 24px;
+    }
+
+    div[m-id="{{d.mId}}"] .select2-selection--single > span {
+        line-height: 24px !important;
+        height: 24px !important;
+    }
+
+    html[data-bs-theme=light] div[m-id="{{d.mId}}"] .select2-container--open .select2-selection--single {
+        outline: 1px solid var(--app-light-color);
+    }
+
+    html[data-bs-theme=dark] div[m-id="{{d.mId}}"] .select2-container--open .select2-selection--single {
+        outline: 1px solid var(--app-dark-color);
+    }
+
+    .footer-layer-board-config .footer-layer-btn.reset {
+        font-size: 13px;
+        line-height: 12px;
+    }
+
+    html[data-bs-theme=light] > body > .select2-container > .select2-board-config {
+        outline: 1px solid var(--app-light-color);
+    }
+
+    html[data-bs-theme=dark] > body > .select2-container > .select2-board-config {
+        outline: 1px solid var(--app-dark-color);
+    }
+</style>
+<div m-id="{{d.mId}}">
+    {{# layui.each(d.options, function(index, item){ }}
+    <button
+        mid="{{ item.key }}-label"
+        class="layui-btn layui-btn-fluid layui-btn-xs title">
+        <p>{{ item.name }}</p>
+    </button>
+    <p>&nbsp:&nbsp</p>
+    <select mid="{{ item.key }}"></select>
+    {{# }); }}
+</div>

common/templates/html/footerlayer/footerlayer-example.html

@@ -0,0 +1,53 @@
+<style>
+    /* 示例 */
+    .footer-layer-example .layui-tree * {
+        box-sizing: unset !important;
+    }
+
+    html[data-bs-theme=light] .footer-layer-example .layui-tree-txt {
+        color: #000;
+    }
+
+    html[data-bs-theme=light] .footer-layer-example .layui-tree-icon .layui-icon {
+        color: #000;
+    }
+
+    html[data-bs-theme=dark] .footer-layer-example .layui-tree-txt {
+        color: #fff;
+    }
+
+    html[data-bs-theme=dark] .footer-layer-example .layui-tree-icon .layui-icon {
+        color: #fff;
+    }
+
+    .footer-layer-example .layui-tree-icon {
+        border: none !important;
+        width: 16px !important;
+        height: 16px !important;
+        font-size: 16px !important;
+        margin: 0 10px !important;
+    }
+
+    .footer-layer-example .layui-tree-icon .layui-icon {
+        font-size: 16px;
+    }
+
+    .footer-layer-example .layui-tree-iconClick {
+        height: 16px;
+        line-height: 16px;
+        margin: 0 3px 0 10px;
+    }
+
+    html[data-bs-theme=light] .footer-layer-example .layui-tree-iconClick {
+        color: #000;
+    }
+
+    html[data-bs-theme=dark] .footer-layer-example .layui-tree-iconClick {
+        color: #fff;
+    }
+
+    .footer-layer-example .layui-tree-iconClick .layui-icon {
+        font-size: 16px;
+    }
+</style>
+<div class="example-tree-body" style="width:100%;height:100%;"></div>

common/templates/html/footerlayer/footerlayer-message-item-with-icon.html

@@ -0,0 +1,23 @@
+<div class="toast show text-bg-{{ d.style }}" role="alert" aria-live="assertive" aria-atomic="true" style="margin-bottom: 8px;">
+    <div class="toast-header">
+        <img src="{{ d.src }}" width="22" height="22" class="rounded me-2">
+        <strong class="me-auto">{{-d.name}}</strong>
+        <button type="button" class="btn-close" data-bs-dismiss="toast" aria-label="Close"></button>
+    </div>
+    <div class="toast-body">
+        {{-d.message}}
+        {{# if (d.btns && d.btns.length) { }}
+        <div class="mt-2 pt-2 border-top btns">
+            {{# if (d.checkbox.show) { }}
+                <div class="form-check form-check-inline">
+                    <input class="form-check-input" type="checkbox" value="" id="{{-d.checkbox.id}}" {{d.checkbox.checked}}>
+                    <label class="form-check-label" for="{{-d.checkbox.id}}">{{d.checkbox.title}}</label>
+                </div>
+            {{# } }}
+            {{# layui.each(d.btns, function(index, item){ }}
+                <button type="button" m-id="{{ item.mId }}" class="btn btn-{{ item.style }} btn-sm">{{ item.text }}</button>
+            {{# }); }}
+        </div>
+        {{# } }}
+    </div>
+</div>

common/templates/html/footerlayer/footerlayer-message-item.html

@@ -0,0 +1,8 @@
+<div class="toast show text-bg-{{ d.style }}" role="alert" aria-live="assertive" aria-atomic="true" style="margin-bottom: 8px;">
+    <div class="d-flex">
+        <div class="toast-body">
+            {{-d.message}}
+        </div>
+        <button type="button" class="btn-close me-2 m-auto" data-bs-dismiss="toast" aria-label="Close"></button>
+    </div>
+</div>

common/templates/html/footerlayer/footerlayer-message.html

@@ -0,0 +1,2 @@
+<div class="toast-container bottom-0 end-0" style="position:relative;">
+</div>

common/templates/html/footerlayer/footerlayer.html

@@ -0,0 +1,29 @@
+<div class="footer-layer">
+    <div class="footer-layer-content mixly-scrollbar">
+        <div class="layui-layer-title">
+            {{# layui.each(d.btns, function(index, item) { }}
+                <i
+                    class="footer-layer-btn layui-icon {{= item.icon }} {{= item.class }}"
+                    title="{{= item.title }}"
+                ></i>
+            {{# }); }}
+            <i
+                class="footer-layer-btn layui-icon layui-icon-close close"
+                title="{{ d.close }}"
+            ></i>
+        </div>
+        <div class="footer-layer-body"
+            style="
+                display: flex;
+                flex-direction: row;
+                justify-content: center;
+                overflow-y: auto;
+                overflow-x: hidden;
+                padding: 5px;
+                font-size: 14px;
+            "
+        >
+            {{- d.content }}
+        </div>
+    </div>
+</div>