add.html
5.27 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" >
<head>
<th:block th:include="include :: header('新增模版配置')" />
</head>
<body class="white-bg">
<div class="wrapper wrapper-content animated fadeInRight ibox-content">
<form class="form-horizontal m" id="form-templateConfiguration-add" th:object="${frontDept}">
<input id="orgId" name="orgId" th:value="*{id}" type="hidden">
<div class="form-group">
<label class="col-sm-3 control-label">合作机构名称：</label>
<div class="col-sm-8">
<input id="deptName" name="deptName" class="form-control" type="text" th:field="*{deptName}">
</div>
</div>
<div class="form-group">
<label class="col-sm-3 control-label">所属集团名称：</label>
<div class="col-sm-8">
<input id="prentDeptName" name="prentDeptName" class="form-control"
type="text" th:value ="${prentDeptName}" />
</div>
</div>
<div class="form-group">
<label class="col-sm-3 control-label">关联合同名称：</label>
<div class="col-sm-8">
<input id="contractName" name="contractName" class="form-control" type="text">
</div>
</div>
<div class="form-group">
<label class="col-sm-3 control-label">报告业务形式：</label>
<div class="col-sm-8">
<label class="radio-inline">
<input type="radio" id="reportForm" name="reportForm" value="1" checked> 正式报告
</label>
<label class="radio-inline">
<input type="radio" name="reportForm" value="0"> 试用报告
</label>
</div>
</div>
<div class="form-group">
<label class="col-sm-3 control-label">报告业务类型：</label>
<div class="col-sm-8">
<!-- 使用Thymeleaf模板引擎遍历传递的background_report_type数据 -->
<div th:each="item : ${backgroundReportType}">
<label class="checkbox-inline">
<!-- 动态生成checkbox，根据dictLabel和dictValue填充 -->
<input type="checkbox" name="typeId" th:value="${item.dictValue}" onclick="handleChoiceReportType()"/>
<span th:text="${item.dictLabel}">报告业务类型</span>
</label>
</div>
</div>
</div>
<div class="form-group">
<label class="col-sm-3 control-label">定制模板类型：</label>
<div class="col-sm-8">
<div th:each="item : ${customReportType}">
<label class="checkbox-inline">
<!-- 动态生成checkbox，根据dictLabel和dictValue填充 -->
<input type="checkbox" name="clientId" th:value="${item.id}" />
<span th:text="${item.tName}">报告业务类型</span>
</label>
</div>
</div>
</div>
<div id="bizTypesDiv">
</div>
</form>
</div>
<div th:include="include::footer"></div>
<script type="text/javascript">
var prefix = ctx + "business/templateConfiguration"
$("#form-templateConfiguration-add").validate({
rules:{
xxxx:{
required:true,
},
},
focusCleanup: true
});
function handleChoiceReportType() {
var checkboxes = document.querySelectorAll('input[name="typeId"]:checked');
var selectedValues = Array.from(checkboxes).map(checkbox => checkbox.value);
var selectedLabels = Array.from(checkboxes).map(checkbox => checkbox.nextElementSibling.textContent);
$("#bizTypesDiv").empty();
let tempDiv = ""
checkboxes.forEach(checkbox => {
if (checkbox.checked) {
// 选中的checkbox
// 在这里可以执行相应的操作
console.log('选中的checkbox值:', checkbox.value);
console.log('选中的checkbox标签:', checkbox.nextElementSibling.textContent);
tempDiv += `
<div class="form-group">
<label class="col-sm-3 control-label">${checkbox.nextElementSibling.textContent}：</label>
<div class="col-sm-8">
<div class="col-sm-6">
<input name="array.${checkbox.value}.entryType" type="checkbox" value="1"> 立即制作
</div>
<div class="col-sm-3">
业务单价
</div>
<div class="col-sm-3">
<input name="array.${checkbox.value}.price" class="form-control">
</div>
<div class="col-sm-6">
<input name="array.${checkbox.value}.entryType" type="checkbox" value="2"> 普通
</div>
<div class="col-sm-3">
业务单价
</div>
<div class="col-sm-3">
<input name="array.${checkbox.value}.price" class="form-control">
</div>
<div class="col-sm-6">
报告翻译 <select name="array.${checkbox.value}.trans">
<option value="0">翻译成中文</option>
</select>
</div>
<div class="col-sm-3">
业务单价
</div>
<div class="col-sm-3">
<input name="array.${checkbox.value}.price" class="form-control">
</div>
</div>
</div>
`
}
})
$("#bizTypesDiv").append(tempDiv)
}
function submitHandler() {
if ($.validate.form()) {
fetch(prefix + "/add", {
method: "POST",
headers: {
'Content-Type': 'application/json;charset=utf-8'
},
body: JSON.stringify($("#form-templateConfiguration-add").serializeArray())
}).then(response => response.json()).then(data => {
// 处理响应数据
console.log(data);
})
// $.operate.save(prefix + "/add", $('#form-templateConfiguration-add').serialize());
}
}
</script>
</body>
</html>