|
@@ -0,0 +1,185 @@
|
|
|
+<!DOCTYPE html>
|
|
|
+<html lang="zh" xmlns:th="http://www.thymeleaf.org" >
|
|
|
+<head>
|
|
|
+ <th:block th:include="include :: header('修改员工排班')" />
|
|
|
+ <th:block th:include="include :: datetimepicker-css" />
|
|
|
+</head>
|
|
|
+<body class="white-bg">
|
|
|
+ <div class="wrapper wrapper-content animated fadeInRight ibox-content">
|
|
|
+ <form class="form-horizontal m" id="form-emp-edit" th:object="${twinEmp}">
|
|
|
+<!-- <h4 class="form-header h4">员工排班信息</h4>-->
|
|
|
+ <input name="empId" th:field="*{empId}" type="hidden">
|
|
|
+ <div class="form-group">
|
|
|
+ <label class="col-sm-2 control-label">时间:</label>
|
|
|
+ <div class="col-sm-2">
|
|
|
+ <div class="input-group date">
|
|
|
+ <input name="empDate" th:value="${#dates.format(twinEmp.empDate, 'yyyy-MM-dd')}" class="form-control" placeholder="yyyy-MM-dd" type="text">
|
|
|
+ <span class="input-group-addon"><i class="fa fa-calendar"></i></span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="col-sm-6">
|
|
|
+ <h4 class="form-header h4">员工排班明细(A班)</h4>
|
|
|
+ <button type="button" class="btn btn-white btn-sm" onclick="addRowA()"><i class="fa fa-plus"> 增加</i>
|
|
|
+ </button>
|
|
|
+ <span style="color:red;">多个机台号请使用英文逗号”,“分隔,连续机台号使用”-“,例:1 4 5机台号填写为”1,4,5“,1至12号填写为”1-12",1至12号加36号填写为“1-12,36”</span>
|
|
|
+ <div class="col-sm-6 select-table table-striped">
|
|
|
+ <table id="bootstrap-table-a"></table>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="col-sm-6">
|
|
|
+ <h4 class="form-header h4">员工排班明细(B班)</h4>
|
|
|
+ <button type="button" class="btn btn-white btn-sm" onclick="addRowB()"><i class="fa fa-plus"> 增加</i>
|
|
|
+ </button>
|
|
|
+ <span style="color:red;">多个机台号请使用英文逗号”,“分隔,连续机台号使用”-“,例:1 4 5机台号填写为”1,4,5“,1至12号填写为”1-12",1至12号加36号填写为“1-12,36”</span>
|
|
|
+ <div class="col-sm-6 select-table table-striped">
|
|
|
+ <table id="bootstrap-table-b"></table>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </form>
|
|
|
+ </div>
|
|
|
+ <th:block th:include="include :: footer" />
|
|
|
+ <th:block th:include="include :: datetimepicker-js" />
|
|
|
+ <script th:inline="javascript">
|
|
|
+ var prefix = ctx + "biz/emp";
|
|
|
+ $("#form-emp-edit").validate({
|
|
|
+ focusCleanup: true
|
|
|
+ });
|
|
|
+
|
|
|
+ function submitHandler() {
|
|
|
+ if ($.validate.form()) {
|
|
|
+ $.operate.save(prefix + "/edit", $('#form-emp-edit').serialize());
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ $("input[name='empDate']").datetimepicker({
|
|
|
+ format: "yyyy-mm-dd",
|
|
|
+ minView: "month",
|
|
|
+ autoclose: true
|
|
|
+ });
|
|
|
+
|
|
|
+ $(function() {
|
|
|
+ let options = {
|
|
|
+ id: "bootstrap-table-a",
|
|
|
+ data: [[${twinEmp.twinEmpDetailListA}]],
|
|
|
+ pagination: false,
|
|
|
+ showSearch: false,
|
|
|
+ showRefresh: false,
|
|
|
+ showToggle: false,
|
|
|
+ showColumns: false,
|
|
|
+ sidePagination: "client",
|
|
|
+ columns: [
|
|
|
+ {
|
|
|
+ field: 'index',
|
|
|
+ align: 'center',
|
|
|
+ title: "序号",
|
|
|
+ formatter: function (value, row, index) {
|
|
|
+ var columnIndex = $.common.sprintf("<input type='hidden' name='index' value='%s'>", $.table.serialNumber(index));
|
|
|
+ return columnIndex + $.table.serialNumber(index);
|
|
|
+ }
|
|
|
+ },
|
|
|
+ {
|
|
|
+ field: 'empName',
|
|
|
+ align: 'center',
|
|
|
+ title: '姓名',
|
|
|
+ formatter: function(value, row, index) {
|
|
|
+ var html = $.common.sprintf("<input class='form-control' type='text' name='twinEmpDetailListA[%s].empName' value='%s'>", index, value);
|
|
|
+ return html;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ {
|
|
|
+ field: 'devices',
|
|
|
+ align: 'center',
|
|
|
+ title: '机台号',
|
|
|
+ formatter: function(value, row, index) {
|
|
|
+ var html = $.common.sprintf("<input class='form-control' type='text' name='twinEmpDetailListA[%s].devices' value='%s'>", index, value);
|
|
|
+ return html;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '操作',
|
|
|
+ align: 'center',
|
|
|
+ formatter: function(value, row, index) {
|
|
|
+ var value = $.common.isNotEmpty(row.index) ? row.index : $.table.serialNumber(index);
|
|
|
+ return '<a class="btn btn-danger btn-xs" href="javascript:void(0)" onclick="sub.delRowByIndex(\'' + value + '\')"><i class="fa fa-remove"></i>删除</a>';
|
|
|
+ }
|
|
|
+ }]
|
|
|
+ };
|
|
|
+ $.table.init(options);
|
|
|
+ let b_options = {
|
|
|
+ id: "bootstrap-table-b",
|
|
|
+ data: [[${twinEmp.twinEmpDetailListB}]],
|
|
|
+ pagination: false,
|
|
|
+ showSearch: false,
|
|
|
+ showRefresh: false,
|
|
|
+ showToggle: false,
|
|
|
+ showColumns: false,
|
|
|
+ sidePagination: "client",
|
|
|
+ columns: [
|
|
|
+ {
|
|
|
+ field: 'index',
|
|
|
+ align: 'center',
|
|
|
+ title: "序号",
|
|
|
+ formatter: function (value, row, index) {
|
|
|
+ var columnIndex = $.common.sprintf("<input type='hidden' name='index' value='%s'>", $.table.serialNumber(index));
|
|
|
+ return columnIndex + $.table.serialNumber(index);
|
|
|
+ }
|
|
|
+ },
|
|
|
+ {
|
|
|
+ field: 'empName',
|
|
|
+ align: 'center',
|
|
|
+ title: '姓名',
|
|
|
+ formatter: function(value, row, index) {
|
|
|
+ var html = $.common.sprintf("<input class='form-control' type='text' name='twinEmpDetailListB[%s].empName' value='%s'>", index, value);
|
|
|
+ return html;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ {
|
|
|
+ field: 'devices',
|
|
|
+ align: 'center',
|
|
|
+ title: '机台号',
|
|
|
+ formatter: function(value, row, index) {
|
|
|
+ var html = $.common.sprintf("<input class='form-control' type='text' name='twinEmpDetailListB[%s].devices' value='%s'>", index, value);
|
|
|
+ return html;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '操作',
|
|
|
+ align: 'center',
|
|
|
+ formatter: function(value, row, index) {
|
|
|
+ var value = $.common.isNotEmpty(row.index) ? row.index : $.table.serialNumber(index);
|
|
|
+ return '<a class="btn btn-danger btn-xs" href="javascript:void(0)" onclick="sub.delRowByIndex(\'' + value + '\')"><i class="fa fa-remove"></i>删除</a>';
|
|
|
+ }
|
|
|
+ }]
|
|
|
+ };
|
|
|
+ $.table.init(b_options);
|
|
|
+ });
|
|
|
+
|
|
|
+ function addRowA() {
|
|
|
+ table.set('bootstrap-table-a');
|
|
|
+ var count = $("#" + table.options.id).bootstrapTable('getData').length;
|
|
|
+ var row = {
|
|
|
+ index: $.table.serialNumber(count),
|
|
|
+ empName: "",
|
|
|
+ empTeam: "A",
|
|
|
+ devices: "",
|
|
|
+ remark: "",
|
|
|
+ }
|
|
|
+ sub.addRow(row);
|
|
|
+ }
|
|
|
+
|
|
|
+ function addRowB() {
|
|
|
+ table.set('bootstrap-table-b');
|
|
|
+ var count = $("#" + table.options.id).bootstrapTable('getData').length;
|
|
|
+ var row = {
|
|
|
+ index: $.table.serialNumber(count),
|
|
|
+ empName: "",
|
|
|
+ empTeam: "B",
|
|
|
+ devices: "",
|
|
|
+ remark: "",
|
|
|
+ }
|
|
|
+ sub.addRow(row);
|
|
|
+ }
|
|
|
+ </script>
|
|
|
+</body>
|
|
|
+</html>
|