From f2a13e01e8843302dfb2e80fe18edec3a4ba137f Mon Sep 17 00:00:00 2001 From: YM <479443481@qq.com> Date: 星期一, 10 三月 2025 00:58:19 +0800 Subject: [PATCH] 考勤组的增加已经表单逻辑 --- app/user/view/attendance/add.html | 479 +++++++++++++++++++++++++++++++++++++++++++++++------------ 1 files changed, 376 insertions(+), 103 deletions(-) diff --git a/app/user/view/attendance/add.html b/app/user/view/attendance/add.html index 668246c..e07203a 100644 --- a/app/user/view/attendance/add.html +++ b/app/user/view/attendance/add.html @@ -1,82 +1,272 @@ {extend name="../../base/view/common/base" /} <!-- 涓讳綋 --> {block name="body"} +<style> + #showNecessaryTimeBox, + #showUnNecessaryTimeBox { + display: flex; + } + #showNecessaryTimeBox p, + #showUnNecessaryTimeBox p { + line-height: 26px; + display: none; + } + #showNecessaryTimeList, + #showUnNecessaryTimeList { + display: flex; + gap: 20px; + } + .timeItem { + border: 1px solid #ccc; + padding: 2px 8px; + border-radius: 4px; + position: relative; + } + .closeBtn { + background: #ff5722; + color: #fff; + border-radius: 50%; + font-size: 12px; + display: inline-block; + width: 16px; + height: 16px; + line-height: 18px; + text-align: center; + position: absolute; + right: -6px; + top: -6px; + cursor: pointer; + } +</style> <form class="layui-form p-4"> - <h3 class="pb-3">宀椾綅鑱岀О</h3> - {if condition="$id eq 0"} - <table class="layui-table"> - <tr> - <td class="layui-td-gray">宀椾綅鍚嶇О<font>*</font></td> - <td> - <input type="text" name="title" lay-verify="required" autocomplete="off" placeholder="璇疯緭鍏ュ矖浣嶅悕绉�" lay-reqText="璇疯緭鍏ュ矖浣嶅悕绉�" class="layui-input"> - </td> - <td class="layui-td-gray-3">宀椾綅宸ユ椂鍗曚环(鍏�)<font>*</font></td> - <td> - <input type="text" name="work_price" lay-verify="required|number" placeholder="璇疯緭鍏ュ矖浣嶅伐鏃跺崟浠�" lay-reqText="璇疯緭鍏ュ矖浣嶅伐鏃跺崟浠�" autocomplete="off" class="layui-input"> - </td> - </tr> - <tr> - <td class="layui-td-gray">鐘舵��<font>*</font></td> - <td colspan="3"> - <input type="radio" name="status" value="1" title="姝e父" checked> - <input type="radio" name="status" value="0" title="绂佺敤"> - </td> - </tr> - <tr> - <td class="layui-td-gray">鏉冮檺瑙掕壊<font>*</font></td> - <td colspan="3"> - {volist name="$group" id="v"} - <input type="checkbox" name="group_id[]" title="{$v.title}" value="{$v.id}" lay-skin="primary"> - {/volist} - </td> - </tr> - <tr> - <td class="layui-td-gray">宀椾綅澶囨敞</td> - <td colspan="3"> - <textarea name="remark" placeholder="璇疯緭鍏ュ矖浣嶅娉�" class="layui-textarea"></textarea> - </td> - </tr> - </table> - {else/} - <table class="layui-table layui-table-form"> - <tr> - <td class="layui-td-gray">宀椾綅鍚嶇О<font>*</font></td> - <td> - <input type="text" name="title" value="{$detail.title}" lay-verify="required" autocomplete="off" placeholder="璇疯緭鍏ュ矖浣嶅悕绉�" lay-reqText="璇疯緭鍏ュ矖浣嶅悕绉�" class="layui-input"> - </td> - <td class="layui-td-gray-3">宀椾綅宸ユ椂鍗曚环(鍏�)<font>*</font></td> - <td> - <input type="text" name="work_price" value="{$detail.work_price}" lay-verify="required|number" placeholder="璇疯緭鍏ュ矖浣嶅伐鏃跺崟浠�" lay-reqText="璇疯緭鍏ュ矖浣嶅伐鏃跺崟浠�" autocomplete="off" class="layui-input"> - </td> - </tr> - <tr> - <td class="layui-td-gray">鐘舵��<font>*</font></td> - <td colspan="3"> - <input type="radio" name="status" value="1" title="姝e父" {eq name="$detail.status" value="1"}checked{/eq}> - <input type="radio" name="status" value="0" title="绂佹" {eq name="$detail.status" value="0"}checked{/eq}> - </td> - </tr> - <tr> - <td class="layui-td-gray">鏉冮檺瑙掕壊<font>*</font></td> - <td colspan="3"> - {volist name="$group" id="v"} - <input type="checkbox" name="group_id[]" title="{$v.title}" value="{$v.id}" {eq name="$v.checked" value="1" }checked{/eq} lay-skin="primary"> - {/volist} - </td> - </tr> - <tr> - <td class="layui-td-gray">宀椾綅澶囨敞</td> - <td colspan="3"> - <textarea name="remark" placeholder="璇疯緭鍏ュ矖浣嶅娉�" class="layui-textarea">{$detail.remark}</textarea> - </td> - </tr> - </table> - {/if} - <div class="pt-4"> - <input type="hidden" name="id" value="{$id}"> - <button class="layui-btn layui-btn-normal" lay-submit="" lay-filter="webform">绔嬪嵆鎻愪氦</button> - <button type="reset" class="layui-btn layui-btn-primary">閲嶇疆</button> - </div> + <h3 class="pb-3">鑰冨嫟缁�</h3> + {if condition="$id eq 0"} + <table class="layui-table"> + <tr> + <td class="layui-td-gray-3">鑰冨嫟缁勫悕绉�<font>*</font></td> + <td> + <input + type="text" + name="name" + lay-verify="required" + autocomplete="off" + placeholder="璇疯緭鍏ヨ�冨嫟缁勫悕绉�" + lay-reqText="璇疯緭鍏ュ矖浣嶅悕绉�" + class="layui-input" + /> + </td> + <td class="layui-td-gray-3">鑰冨嫟绫诲瀷<font>*</font></td> + <td> + <select name="type" lay-verify="required" lay-reqText="璇烽�夋嫨"> + <option value="">璇烽�夋嫨</option> + <option value="1">鍥哄畾鐝埗</option> + <option value="2">鑷敱宸ユ椂</option> + </select> + </td> + </tr> + <tr> + <td class="layui-td-gray-3">鍙備笌鑰冨嫟浜哄憳<font>*</font></td> + <td> + <input + type="text" + name="attendance_participants" + autocomplete="off" + readonly + lay-verify="required" + lay-reqText="璇烽�夋嫨鍙備笌鑰冨嫟浜哄憳" + placeholder="璇烽�夋嫨鍙備笌鑰冨嫟浜哄憳" + class="layui-input picker-diy" + /> + <input type="hidden" name="attendance_participants_id" /> + </td> + <td class="layui-td-gray-3">鏃犻渶鑰冨嫟浜哄憳</td> + <td> + <input + type="text" + name="attendance_not_participants" + autocomplete="off" + readonly + lay-reqText="璇烽�夋嫨鏃犻渶鑰冨嫟浜哄憳" + placeholder="璇烽�夋嫨鏃犻渶鑰冨嫟浜哄憳" + class="layui-input picker-diy" + /> + <input type="hidden" name="attendance_not_participants_id" /> + </td> + </tr> + <tr> + <td class="layui-td-gray">宸ヤ綔鏃ヨ缃�<font>*</font></td> + <td colspan="5"> + <table + id="timeBox" + class="layui-table layui-table-min" + style="margin: 0" + > + <tr> + <th width="50"></th> + <th width="100">宸ヤ綔鏃�</th> + <th>鐝鏃堕棿娈�</th> + <th width="60">鎿嶄綔</th> + </tr> + <tr> + <td> + <input type="checkbox" name="work1" lay-skin="primary" title="" /> + </td> + <td>鍛ㄤ竴</td> + <td style="text-align: left"></td> + <td> + <a class="layui-btn layui-btn-xs picker-oa" data-types="workPlan" + >璁剧疆鐝</a + > + <input type="hidden" name="work_plan_id1" value="" /> + </td> + </tr> + <tr> + <td> + <input type="checkbox" name="work2" lay-skin="primary" title="" /> + </td> + <td>鍛ㄤ簩</td> + <td style="text-align: left"></td> + <td> + <a class="layui-btn layui-btn-xs picker-oa" data-types="workPlan" + >璁剧疆鐝</a + > + <input type="hidden" name="work_plan_id2" value="" /> + </td> + </tr> + <tr> + <td> + <input type="checkbox" name="work3" lay-skin="primary" title="" /> + </td> + <td>鍛ㄤ笁</td> + <td style="text-align: left"></td> + <td> + <a class="layui-btn layui-btn-xs picker-oa" data-types="workPlan" + >璁剧疆鐝</a + > + <input type="hidden" name="work_plan_id3" value="" /> + </td> + </tr> + <tr> + <td> + <input type="checkbox" name="work4" lay-skin="primary" title="" /> + </td> + <td>鍛ㄥ洓</td> + <td style="text-align: left"></td> + <td> + <a class="layui-btn layui-btn-xs picker-oa" data-types="workPlan" + >璁剧疆鐝</a + > + <input type="hidden" name="work_plan_id4" value="" /> + </td> + </tr> + <tr> + <td> + <input type="checkbox" name="work5" lay-skin="primary" title="" /> + </td> + <td>鍛ㄤ簲</td> + <td style="text-align: left"></td> + <td> + <a class="layui-btn layui-btn-xs picker-oa" data-types="workPlan" + >璁剧疆鐝</a + > + <input type="hidden" name="work_plan_id5" value="" /> + </td> + </tr> + <tr> + <td> + <input type="checkbox" name="work6" lay-skin="primary" title="" /> + </td> + <td>鍛ㄥ叚</td> + <td style="text-align: left"></td> + <td> + <a class="layui-btn layui-btn-xs picker-oa" data-types="workPlan" + >璁剧疆鐝</a + > + <input type="hidden" name="work_plan_id6" value="" /> + </td> + </tr> + <tr> + <td> + <input type="checkbox" name="work7" lay-skin="primary" title="" /> + </td> + <td>鍛ㄦ棩</td> + <td style="text-align: left"></td> + <td> + <a class="layui-btn layui-btn-xs picker-oa" data-types="workPlan" + >璁剧疆鐝</a + > + <input type="hidden" name="work_plan_id7" value="" /> + </td> + </tr> + </table> + </td> + </tr> + <tr> + <td class="layui-td-gray-3">鐗规畩鏃ユ湡</td> + <td colspan="5"> + <div style="margin-bottom: 10px"> + <div id="showNecessaryTimeBox"> + <p>蹇呴』鎵撳崱鏃ユ湡锛�</p> + <div id="showNecessaryTimeList"></div> + </div> + </div> + <div style="margin-bottom: 10px"> + <button + class="layui-btn layui-btn-sm" + type="button" + id="addNecessaryTimeBtn" + > + + 鏂板蹇呴』鎵撳崱鐨勬棩鏈� + </button> + </div> + <div style="margin-bottom: 10px"> + <div id="showUnNecessaryTimeBox"> + <p>鏃犻渶鎵撳崱鏃ユ湡锛�</p> + <div id="showUnNecessaryTimeList"></div> + </div> + </div> + <div style="margin-bottom: 10px"> + <button + class="layui-btn layui-btn-sm" + type="button" + id="addUnNecessaryTimeBtn" + > + + 鏂板鏃犻渶鎵撳崱鐨勬棩鏈� + </button> + </div> + </td> + </tr> + </table> + {else/} + <table class="layui-table layui-table-form"> + <tr> + <td class="layui-td-gray">鑰冨嫟缁勫悕绉�<font>*</font></td> + <td> + <input + type="text" + name="name" + value="{$detail.name}" + lay-verify="required" + autocomplete="off" + placeholder="璇疯緭鍏ヨ�冨嫟缁勫悕绉�" + lay-reqText="璇疯緭鍏ュ矖浣嶅悕绉�" + class="layui-input" + /> + </td> + </tr> + </table> + {/if} + <div class="pt-4"> + <input type="hidden" name="id" value="{$id}" /> + <button + class="layui-btn layui-btn-normal" + lay-submit="" + lay-filter="webform" + > + 绔嬪嵆鎻愪氦 + </button> + <button type="reset" class="layui-btn layui-btn-primary">閲嶇疆</button> + </div> </form> {/block} <!-- /涓讳綋 --> @@ -84,34 +274,117 @@ <!-- 鑴氭湰 --> {block name="script"} <script> - const moduleInit = ['tool']; - function gouguInit() { - var form = layui.form,tool=layui.tool; - form.on('submit(webform)', function(data){ - let callback = function (e) { - layer.msg(e.msg); - if (e.code == 0) { - setTimeout(function () { - parent.location.reload(); - }, 1000); - } - } - tool.post("/user/position/add", data.field, callback); - return false; - }); - //鐩戝惉鎻愪氦 - form.on('submit(webform)', function(data){ - let callback = function (e) { - layer.msg(e.msg); - if (e.code == 0) { - tool.sideClose(1000); - } - } - tool.post("/user/position/add", data.field, callback); - return false; - }); - } + const moduleInit = ["tool", "oaPicker"]; + function gouguInit() { + var oaPicker = layui.oaPicker, + laydate = layui.laydate, + form = layui.form, + tool = layui.tool; + //閫夋嫨鍛樺伐寮圭獥 + $("body").on("click", ".picker-diy", function () { + let that = $(this); + let ids = that.next().val() + "", + names = that.val() + ""; + oaPicker.employeeInit({ + ids: ids, + names: names, + type: 2, //1鏄崟閫夛紝2鏄閫� + callback: function (data) { + //杩欓噷鏄�夋嫨鍚庣殑鍥炶皟鏂规硶锛屽彲浠ユ牴鎹叿浣撻渶姹傝嚜瀹氫箟鍐欏摝 + let select_id = [], + select_name = []; + for (var a = 0; a < data.length; a++) { + select_id.push(data[a].id); + select_name.push(data[a].name); + } + that.val(select_name.join(",")); + that.next().val(select_id.join(",")); + } + }); + }); + laydate.render({ + elem: "#addNecessaryTimeBtn", + done: function (value, date) { + $("#addNecessaryTimeBtn").html("+ 鏂板蹇呴』鎵撳崱鐨勬棩鏈�"); + var oldValues = $(".timeValue"); + var isE = false; + for (let i = 0; i < oldValues.length; i++) { + const oldValue = oldValues[i]; + if (oldValue.innerHTML == value) { + isE = true; + } + } + if (!isE) { + $("#showNecessaryTimeBox p").show(); + $("#showNecessaryTimeList").append( + "<div class='timeItem'><span class='timeValue'>" + + value + + "</span><input type='hidden' name='necessaryTime[]' value=" + + value + + " /><span class='closeBtn layui-icon'>ဆ</span></div>" + ); + bindCloseBtn(); + } else { + layer.msg("宸叉湁鐩稿悓鏃ユ湡"); + } + } + }); + + laydate.render({ + elem: "#addUnNecessaryTimeBtn", + done: function (value, date) { + $("#addUnNecessaryTimeBtn").html("+ 鏂板鏃犻渶鎵撳崱鐨勬棩鏈�"); + var oldValues = $(".timeValue"); + var isE = false; + for (let i = 0; i < oldValues.length; i++) { + const oldValue = oldValues[i]; + if (oldValue.innerHTML == value) { + isE = true; + } + } + if (!isE) { + $("#showUnNecessaryTimeBox p").show(); + $("#showUnNecessaryTimeList").append( + "<div class='timeItem'><span class='timeValue'>" + + value + + "</span><input type='hidden' name='unNecessaryTime[]' value=" + + value + + " /><span class='closeBtn layui-icon'>ဆ</span></div>" + ); + bindCloseBtn(); + } else { + layer.msg("宸叉湁鐩稿悓鏃ユ湡"); + } + } + }); + + //鐩戝惉鎻愪氦 + form.on("submit(webform)", function (data) { + let callback = function (e) { + layer.msg(e.msg); + if (e.code == 0) { + tool.sideClose(1000); + } + }; + tool.post("/user/attendance/add", data.field, callback); + return false; + }); + } + + function bindCloseBtn() { + $(".closeBtn").off("click"); + $(".closeBtn").on("click", function () { + let that = $(this); + that.parent().remove(); + if ($("#showNecessaryTimeList .timeItem").length == 0) { + $("#showNecessaryTimeBox p").hide(); + } + if ($("#showUnNecessaryTimeList .timeItem").length == 0) { + $("#showUnNecessaryTimeBox p").hide(); + } + }); + } </script> {/block} -<!-- /鑴氭湰 --> \ No newline at end of file +<!-- /鑴氭湰 --> -- Gitblit v1.9.1