fourcal/src/main/resources/templates/admin/act_model_input.ftl

233 lines
7.5 KiB
Plaintext
Raw Normal View History

2021-11-09 07:26:08 +00:00
<#assign base=request.contextPath />
<#import "../common/defaultLayout.ftl" as defaultLayout>
<@defaultLayout.layout>
<div class="admin-content">
<div class="admin-content-body">
<div class="am-cf am-padding">
<div class="am-fl am-cf"><strong class="am-text-primary am-text-lg">系统管理</strong> / <small>工作流程管理</small></div>
</div>
<form method="post" class="am-form" id="tmpForm" action="${base}/actModel/save">
<!--选项卡tabsbegin-->
<div class="am-tabs am-margin" data-am-tabs>
<ul class="am-tabs-nav am-nav am-nav-tabs">
<li class="am-active">
<a href="#tab1">模型信息</a>
</li>
</ul>
<div class="am-tabs-bd">
<div class="am-tab-panel am-fade am-in am-active" id="tab1">
<input name="modelId" id="modelId" type="hidden" value="${modelId!}"/>
<!--验证表单元素validate) begin-->
<!--input begin-->
<div class="am-g am-form-group am-margin-top">
<div class="am-u-sm-4 am-u-md-2 am-text-right">
<span style="color: red;">*</span>
模型(流程)名称
</div>
<div class="am-u-sm-6 am-u-md-6">
<input name="modelName" class="js-ajax-validate"
data-validate-async data-validation-message="请输入模型名称100字符以内"
type="text" id="modelName" value="${modelName!}" minlength="1" maxlength="100"
placeholder="请输入模型名称100字符以内" required <#--onblur="checkmodelName($(this));"--> onKeyUp="clearValidInfo()" />
</div>
<div class="am-u-sm-2 am-u-md-4 input-msg" id="role_name_valid"></div>
</div>
<div class="am-g am-form-group am-margin-top">
<div class="am-u-sm-4 am-u-md-2 am-text-right">
<span style="color: red;">*</span>
流程标识
</div>
<div class="am-u-sm-6 am-u-md-6">
<input name="procDefKey" class="js-ajax-validate"
data-validate-async data-validation-message="请输入流程标识20字符以内"
type="text" id="procDefKey" value="${procDefKey!}" minlength="1" maxlength="20"
placeholder="请输入流程标识20字符以内" required <#--onblur="checkprocDefKey($(this));"--> onKeyUp="clearValidInfo()" />
</div>
<div class="am-u-sm-2 am-u-md-4 input-msg" id="role_procDefKey_valid"></div>
</div>
<#--<div class="am-g am-form-group am-margin-top">
<div class="am-u-sm-4 am-u-md-2 am-text-right">
描述
</div>
<div class="am-u-sm-6 am-u-md-6">
<input name="discription" class="js-ajax-validate"
data-validate-async data-validation-message="请输入描述1000字符以内"
type="text" id="discription" value="${description!}" minlength="1" maxlength="100"
placeholder="请输入描述1000字符以内" &lt;#&ndash;onblur="checkprocDefKey($(this));"&ndash;&gt; onKeyUp="clearValidInfo()" />
</div>
<div class="am-u-sm-2 am-u-md-4 input-msg" id="role_description_valid"></div>
</div>-->
</div>
</div>
</div>
<!--选项卡tabsend-->
<div class="am-margin">
<button type="submit" class="am-btn am-btn-primary am-btn-xs">提交保存</button>
<button type="button" class="am-btn am-btn-warning am-btn-xs" onclick="javascript:history.go(-1);">返回上一级</button>
</div>
</form>
</div>
</div>
</@defaultLayout.layout>
<script type="text/javascript">
/*名称检验 start*/
var urlBase = "${base}";
var url;
function checkRoleName(obj){
var roleName = obj.val();
var roleID = $("#roleID").val();
if(roleName.length == 0){
showRoleNameAlert($("#roleName").date("data-validation-message"));
return;
}
$.ajax({
url : urlBase + "/role/check",
type : 'POST',
dataType : 'json',
data : {
role_id : roleID, role_name : roleName
},
cache : false
}).done(function (result) {
if (result.status==0) {
showRoleNameAlert(result.msg);
obj.focus();
}else{
showRoleNameAlert(result.msg);
}
}).fail(function (){
});
}
function clearValidInfo(){
showRoleNameAlert("");
}
function showRoleNameAlert(message){
var $alert = $("#role_name_valid").find('.am-alert');
if (!$alert.length) {
$alert = $('<div class="am-alert am-alert-danger"></div>').hide()
$alert.appendTo($("#role_name_valid"));
}
if(message.length==0){
$alert.hide();
}else{
$alert.text(message).show();
}
}
/*角色名称检验 end*/
/*复选框 全选start*/
$(".role-authority-checkall").click(function(){
var $parentNode = $(this).parent().parent();
var level = Number($parentNode.attr("level"));
var $allParentNextNode = $parentNode.nextUntil(".level-"+level);
var isChecked = $(this).is(":checked");
$allParentNextNode.each(function(){
var myLevel = Number($(this).attr("level"));
var $checks = $(this).children().find("input[type='checkbox']");
if(myLevel > level){
return changeCheckedStatus($checks,isChecked);
}else{
return;
}
});
var $checks = $(this).parent().prev().find("input[type='checkbox']");
changeCheckedStatus($checks,isChecked);
});
function changeCheckedStatus(checksObj,isChecked){
checksObj.each(function(){
if(isChecked){
$(this).prop("checked",true);
}else{
$(this).prop("checked",false);
}
});
}
/*复选框 全选end*/
$(function() {
/*表单验证begin*/
//自定义规则用法验证元素上加class="js-pattern-sort"
if ($.AMUI && $.AMUI.validator) {
$.AMUI.validator.patterns.sort = /^([0-9]+)$/;
}
$("#tmpForm").validator({
// 域通过验证时回调
onValid: function(validity) {
$(validity.field).closest('.am-form-group').find('.am-alert').hide();
},
// 域验证通过时添加的操作,通过该接口可定义各种验证提示
markValid: function(validity) {
// this is Validator instance
var $field = $(validity.field);
//add by zxl只对有required属性的字段进行验证
if(typeof($field.attr("required"))!="undefined"){
var options = this.options;
var $parent = $field.closest('.am-form-group');
$field.addClass(options.validClass).
removeClass(options.inValidClass);
$parent.addClass('am-form-success').removeClass('am-form-error');
options.onValid.call(this, validity);
}
},
// 验证出错时的回调, validity 对象包含相关信息,格式通 H5 表单元素的 validity 属性
onInValid: function(validity) {
var $field = $(validity.field);
var $group = $field.closest('.am-form-group');
var $alert = $group.find('.am-alert');
// 使用自定义的提示信息 或 插件内置的提示信息
var msg = $field.data('validationMessage') || this.getValidationMessage(validity);
if (!$alert.length) {
$alert = $("<div class='am-alert am-alert-danger'></div>").hide().
appendTo($group.find(".input-msg"));
}
console.log("onInValid : "+$field.val());
$alert.html(msg).show();
}
});
/*表单验证end*/
});
</script>
<style type="text/css">
/*验证:提示信息样式 begin*/
.am-alert-danger {
background-color: transparent;
border-color: transparent;
color: red;
}
.am-alert {
margin-bottom: 1em;
padding: .625em;
background: transparent;
border: none;
border-radius: 0;
}
/*验证:提示信息样式 end*/
</style>