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'>&#x1006;</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'>&#x1006;</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