<!DOCTYPE html>
|
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
|
<head>
|
<th:block th:include="include :: header('修改设备设施风险清单')"/>
|
<th:block th:include="include :: bootstrap-fileinput-css"/>
|
</head>
|
<body class="white-bg">
|
<div class="wrapper wrapper-content animated fadeInRight ibox-content">
|
<form class="form-horizontal m" id="form-riskList-edit" th:object="${riskList}">
|
<input name="riskListImgUrl" id="riskListImgUrl" th:value="*{riskListImgUrl}" hidden>
|
<input name="riskListId" th:field="*{riskListId}" type="hidden">
|
<input name="deptId" type="hidden" th:field="*{deptId}" id="treeId"/>
|
<input name="regionId" type="hidden" id="regionTreeId" th:field="*{regionId}"/>
|
<div class="form-group">
|
<label class="col-sm-3 control-label">风险单元编号：</label>
|
<div class="col-sm-8">
|
<input name="riskListNum" th:field="*{riskListNum}" class="form-control" type="text">
|
</div>
|
</div>
|
<div class="form-group">
|
<label class="col-sm-3 control-label is-required">风险单元名称：</label>
|
<div class="col-sm-8">
|
<input name="riskListName" th:field="*{riskListName}" class="form-control" type="text" required>
|
</div>
|
</div>
|
<div class="form-group">
|
<label class="col-sm-3 control-label is-required">是否特种：</label>
|
<div class="col-sm-8">
|
<!-- <input name="riskListIsSpecial" th:field="*{riskListIsSpecial}" class="form-control" type="text">-->
|
<select name="riskListIsSpecial" th:field="*{riskListIsSpecial}" class="form-control m-b" required>
|
<option value="1">否</option>
|
<option value="2">是</option>
|
</select>
|
</div>
|
</div>
|
<div class="form-group">
|
<label class="col-sm-3 control-label is-required">设备设施类型：</label>
|
<div class="col-sm-8">
|
<select name="riskListDeviceType" th:field="*{riskListDeviceType}" class="form-control m-b" required>
|
<option value="">--请选择设备设施类型--</option>
|
<option th:each="riskType : ${riskTypes}" th:value="${riskType.riskTypeId}"
|
th:text="${riskType.riskTypeName}"></option>
|
</select>
|
</div>
|
</div>
|
<div class="form-group">
|
<label class="col-sm-3 control-label">规格/型号：</label>
|
<div class="col-sm-8">
|
<input name="riskListDeviceModel" th:field="*{riskListDeviceModel}" class="form-control" type="text">
|
</div>
|
</div>
|
|
<!--<div class="form-group">
|
<label class="col-sm-3 control-label is-required">区域/位置：</label>
|
<div class="col-sm-8">
|
<input name="regionId" th:field="*{regionId}" class="form-control" type="text" required>
|
</div>
|
</div>-->
|
<div class="form-group">
|
<label class="col-sm-3 control-label is-required">区域/位置：</label>
|
<div class="col-sm-8">
|
<div class="input-group">
|
<input name="regionName" onclick="selectRegionTree()" id="regionTreeName" type="text" th:field="*{regionName}" class="form-control" required>
|
<span class="input-group-addon"><i class="fa fa-search"></i></span>
|
</div>
|
</div>
|
</div>
|
<div class="form-group">
|
<label class="col-sm-3 control-label is-required">管辖单位/部门：</label>
|
<div class="col-sm-8">
|
<div class="input-group">
|
<input class="form-control" type="text" name="deptName" onclick="selectDeptTree()"
|
id="treeName" th:field="*{deptName}" required>
|
<span class="input-group-addon"><i class="fa fa-search"></i></span>
|
</div>
|
</div>
|
</div>
|
<div class="form-group">
|
<label class="col-sm-3 control-label is-required">负责人：</label>
|
<div class="col-sm-8">
|
<select name="userId" th:field="*{userId}" class="form-control m-b" required>
|
<option value="">--请选择负责人--</option>
|
<option th:each="u : ${userList}" th:value="${u.userId}"
|
th:text="${u.userName}"></option>
|
</select>
|
</div>
|
</div>
|
<div class="form-group" hidden>
|
<label class="col-sm-3 control-label">风险单元类型(1设备设置,2作业活动,3工艺节点)：</label>
|
<div class="col-sm-8">
|
<div class="col-sm-8">
|
<input name="riskType" value="5" class="form-control" type="text">
|
</div>
|
</div>
|
</div>
|
<div class="form-group">
|
<label class="col-sm-3 control-label">备注：</label>
|
<div class="col-sm-8">
|
<textarea name="remark" th:field="*{remark}" class="form-control"></textarea>
|
</div>
|
</div>
|
<div class="form-group">
|
<label class="col-sm-3 control-label">图片：</label>
|
<div class="col-sm-8">
|
<div class="file-loading">
|
<input name="file" id="imageUpload" type="file">
|
</div>
|
</div>
|
</div>
|
</form>
|
</div>
|
<th:block th:include="include :: footer"/>
|
<th:block th:include="include :: bootstrap-fileinput-js"/>
|
<script th:inline="javascript">
|
//图片上传
|
//处理预览数据
|
var previewUrlObj = $("#riskListImgUrl").val();
|
var previewUrl = [];
|
var config = [];
|
var previewKeys = [];
|
if (previewUrlObj) {
|
previewUrlObj = JSON.parse(previewUrlObj);
|
for (let key in previewUrlObj) {
|
previewUrl.push(previewUrlObj[key].replace(/^http:\/\/[^/]+/, ""));
|
let tem = {};
|
tem['key'] = key;
|
config.push(tem);
|
previewKeys.push(key);
|
}
|
}
|
$("#imageUpload").fileinput({
|
'theme': 'explorer-fas',
|
'uploadUrl': ctx + 'common/defUpload',
|
'deleteUrl': '#',
|
showUpload: false,
|
overwriteInitial: false,
|
initialPreviewAsData: true,
|
language: 'zh',
|
uploadAsync: true,
|
dropZoneEnabled: false,
|
maxFileCount: 1,
|
resizeImage: false,
|
showCaption: false,
|
showPreview: true,
|
browseClass: "btn btn-primary btn-lg",
|
allowedFileExtensions: ['jpg', 'png', 'gif', 'jpeg', 'bmp'],
|
previewFileIcon: "",
|
initialPreviewConfig: config,
|
initialPreview: previewUrl
|
});
|
//图片自动上传
|
$("#imageUpload").on("filebatchselected", function (event, files) {
|
//console.log(files)
|
$("#imageUpload").fileinput("upload");
|
});
|
//处理上传之后的图片地址数据
|
$("#imageUpload").on("fileuploaded", function (event, data, previewId, index) {
|
let count = 0;
|
let imgUrl = {};
|
if ($("#riskListImgUrl").val()) {
|
let temp = JSON.parse($("#riskListImgUrl").val());
|
for(let key in temp){
|
if (previewKeys.indexOf(key) == -1){
|
imgUrl[previewId.substr(0, previewId.length - 1) + count] = temp[key];
|
count++;
|
}else {
|
imgUrl[key] = temp[key];
|
}
|
}
|
};
|
previewId = previewId.substr(0, previewId.length - 1) + count;
|
imgUrl[previewId] = data.response.url;
|
$("#riskListImgUrl").val(JSON.stringify(imgUrl));
|
});
|
//点击缩略图（非预览缩略图）中删除触发此事件，处理图片地址
|
$('#imageUpload').on('filesuccessremove', function (event, id) {
|
let imgUrl = JSON.parse($("#riskListImgUrl").val());
|
delete imgUrl[id];
|
$("#riskListImgUrl").val(JSON.stringify(imgUrl));
|
});
|
//点击预览（important）缩略图中删除触发此事件，处理图片地址
|
$('#imageUpload').on('filedeleted', function (event, key) {
|
let tem = JSON.parse($("#riskListImgUrl").val());
|
delete tem[key];
|
let index = previewKeys.indexOf(key);
|
if (index != -1)
|
delete previewKeys[index];
|
$("#riskListImgUrl").val(JSON.stringify(tem))
|
});
|
//预览图片清除后（左下角清楚或右上角关闭预览）的事件处理
|
$('#imageUpload').on('filecleared', function (event) {
|
$("#riskListImgUrl").val('');
|
$('#imageUpload').fileinput('refresh', {initialPreview: []});
|
});
|
|
|
/*选择部门树*/
|
function selectDeptTree() {
|
var deptId = $.common.isEmpty($("#treeId").val()) ? "100" : $("#treeId").val();
|
var url = ctx + "system/dept/selectDeptTreeByCompanyId/" + deptId;
|
var options = {
|
title: '选择部门',
|
width: "380",
|
url: url,
|
callBack: doSubmit
|
};
|
$.modal.openOptions(options);
|
}
|
function doSubmit(index, layero) {
|
var tree = layero.find("iframe")[0].contentWindow.$._tree;
|
if ($.tree.notAllowParents(tree)) {
|
var body = layer.getChildFrame('body', index);
|
$("#treeId").val(body.find('#treeId').val());
|
$("#treeName").val(body.find('#treeName').val());
|
layer.close(index);
|
}
|
}
|
|
/*选择区域/位置树*/
|
function selectRegionTree() {
|
var regionTreeId = $.common.isEmpty($("#regionTreeId").val()) ? "100" : $("#regionTreeId").val();
|
var url = ctx + "tr/region/selectRegionTreeByCompanyId/" + regionTreeId;
|
var options = {
|
title: '选择区域/位置',
|
width: "380",
|
url: url,
|
callBack: doSubmitRegion
|
};
|
$.modal.openOptions(options);
|
}
|
function doSubmitRegion(index, layero) {
|
var tree = layero.find("iframe")[0].contentWindow.$._tree;
|
if ($.tree.notAllowParents(tree)) {
|
var body = layer.getChildFrame('body', index);
|
$("#regionTreeId").val(body.find('#treeId').val());
|
$("#regionTreeName").val(body.find('#treeName').val());
|
layer.close(index);
|
}
|
}
|
|
|
var prefix = ctx + "tr/riskList";
|
$("#form-riskList-edit").validate({
|
focusCleanup: true
|
});
|
function submitHandler() {
|
if ($.validate.form()) {
|
$.operate.save(prefix + "/edit", $('#form-riskList-edit').serialize());
|
}
|
}
|
</script>
|
</body>
|
</html>
|
