monitor_v3 / hg-monitor-web · Commits

Go to a project

Authored by XuHaoJie
Commit 019f3cfe92e8c1b9c241310c5cd4aac49117eee2 1 parent c5d1e1ae

杭州-乙方运维-配置页面优化

Inline Side-by-side
Showing 4 changed files with 421 additions and 1 deletions
... ... @@ -161,7 +161,7 @@ layui.define(['table', 'form', 'admin', 'layer', 'laytpl', 'common', 'view', 'se
'<button data-id="' + d.busId + '" lay-tips="删除" type="button" class="layui-btn layui-btn-xs layui-btn-normal btn-bustype-delete"><i class="layui-icon layui-icon-delete"></i></button>' +
'<button data-id="' + d.busId + '" lay-tips="资源分配" type="button" class="layui-btn layui-btn-xs layui-btn-normal btn-bustype-res-config"><i class="layui-icon layui-icon-menu-fill"></i></button>' +
'<button data-id="' + d.busId + '" lay-tips="授权" type="button" class="layui-btn layui-btn-xs layui-btn-normal btn-bustype-authorize"><i class="layui-icon layui-icon-auz"></i></button>' +
'<button data-id="' + d.busId + '" data-code="'+ d.busTypeCode +'" lay-tips="乙方运维配置" type="button" class="layui-btn layui-btn-xs layui-btn-normal btn-bustype-yf-config"><i class="layui-icon layui-icon-set-fill"></i></button>' +
// '<button data-id="' + d.busId + '" data-code="'+ d.busTypeCode +'" lay-tips="乙方运维配置" type="button" class="layui-btn layui-btn-xs layui-btn-normal btn-bustype-yf-config"><i class="layui-icon layui-icon-set-fill"></i></button>' +
'</div>'
} else {
return '' +
... ...
// 业务类型管理
layui.define(['table', 'form', 'admin', 'layer', 'laytpl', 'common', 'view', 'sessions', 'commonDetail', 'treeTable', 'xmSelect', 'userlist', 'reslist'], function (exports) {
var $ = layui.$;
var form = layui.form;
var layer = layui.layer;
var admin = layui.admin;
var table = layui.table;
var treeTable = layui.treeTable;
var xmSelect = layui.xmSelect;
var laytpl = layui.laytpl;
var view = layui.view;
var common = layui.common;
var commonDetail = layui.commonDetail;
var domainName = common.domainName;
// 对外暴露的接口
exports('bustypeAdd', function (data) {
var sessions = layui.sessions;
var accessToken = sessions.getToken()['access_token'];
var userSelect = {}
var opsSelect={}
initUserSelect();
//渲染运维负责人
initUserSelectOps();
// 加载遮罩
var loading;
var oldBusTypeCode = data && data.busTypeCode ? data.busTypeCode : '';
var busType;
// 父业务下拉框
admin.req({
url: domainName + '/api-web/manage/bustype/page',
data: {
page: -1,
limit: -1,
parentId: '0'
}
}).done(function (response) {
var options = '';
$.each(response.data, function (i, v) {
options += ' <option value="' + v.busId + '">' + v.busTypeName + '</option> '
});
$('select[name="parentId"]').append(options);
// 如果是新增，就对busType进行初始化
if (!oldBusTypeCode) {
busType = {
busTypeCode: '',
busTypeName: '',
busTypeDesc: '',
admin: '',
isUse: '',
important: '',
sort: '',
isLeaf: '1'
}
form.render();
} else {
// 如果是编辑模式，回写数据
admin.req({
url: domainName + '/api-web/manage/bustype/page',
data: {
page: 1,
limit: 10,
busTypeCode: oldBusTypeCode
}
}).done(function (response) {
busType = response.data[0];
form.val('form-bustype-edit', busType);
$('form[lay-filter="form-bustype-edit"] input[name="busTypeCode"]').attr('readonly', true);
userSelect.setValue([busType.admin]);
opsSelect.setValue(busType.principal.split(","));
form.render();
});
}
});
// 业务类型编号改变判断是否已经存在
$('#txt-bustype-code').change(function () {
if (checkBusTypeCodeExist($(this).val())) {
$(this).val(oldBusTypeCode);
layer.msg('该编码已存在，请重新输入!', {icon: 2, time: 3000});
}
});
//设置乙方运维项目
form.on('switch(system_type)', function (obj) {
//sign=fale 不是乙方运维项目 sign=true 是乙方运维项目
var sign = obj.elem.checked;
if(!sign){//不是乙方运维
$('#select_principalName').addClass("hide");
opsSelect.setValue([]);
layui.jquery('input[name="isvirtual"]').removeAttr('checked'); //改变开关为 关
//重新渲染
form.render();
}else{//是乙方运维
$('#select_principalName').removeClass('hide');
//渲染下拉框
initUserSelectOps();
}
});
// 绑定表单提交事件
form.on('submit(bus-type-submit)', function (data) {
loading = layer.load(2);
busType = Object.assign(busType, data.field);
//是否启用
if (!data.field.isUse) {
busType.isUse = '0'
}
//是否是乙方运维
if (!data.field.system_type) {
busType.system_type = '0'
}
//是否是虚拟业务
if (!data.field.isvirtual) {
busType.isvirtual = '1'
}
if (busType.parentId == busType.busId) {
// 防止循环引用
busType.parentId = '0';
}
//获取业务负责人信息
userSelect.getValue("")
busType.nickname = userSelect.getValue("name")[0];
busType.admin = userSelect.getValue("value")[0];
//获取业务运维负责人
busType.principalName = opsSelect.getValue("nameStr");
busType.principal = opsSelect.getValue("valueStr");
delete busType.select
admin.req({
url: domainName + '/api-web/manage/bustype/save?access_token=' + accessToken,
type: 'POST',
contentType: 'application/json',
data: JSON.stringify(busType),
error: function () {
layer.close(loading);
}
}).done(function (response) {
layer.close(loading);
if (response.success) {
layer.msg('保存成功!', {icon: 1, time: 3000});
layer.closeAll('page');
$('#btn-bustype-reload-table').click();
} else {
layer.msg('保存失败!', {icon: 2, time: 3000});
}
});
return false;
});
/**
* 判断该业务类型编号是否已经存在
*
* @param busTypeCode 业务类型编号
* @returns {boolean} 存在: true，不存在: false
*/
function checkBusTypeCodeExist(busTypeCode) {
var result = true;
admin.req({
url: domainName + '/api-web/manage/bustype/page',
async: false,
data: {
page: 1,
limit: 10,
busTypeCode: busTypeCode
}
}).done(function (response) {
if (response.data.length === 0) {
result = false;
}
});
return result;
}
//初始化用户下拉列表框
function initUserSelect() {
$.ajax({
url: domainName + '/api-user/users/getAll?access_token=' + accessToken,
success: function (res) {
userSelect = xmSelect.render({
el: '.adminUser',
radio: true,
clickClose: true,
prop: {
name: 'nickname',
value: 'username'
},
filterable: true,
layVerify: 'required',
layVerType: 'msg',
data: res,
})
}
})
}
//初始化用户下拉列表框
function initUserSelectOps() {
$.ajax({
url: domainName + '/api-user/users/getAll?access_token=' + accessToken,
success: function (res) {
opsSelect = xmSelect.render({
el: '#opsProject-username-select',
prop: {
name: 'nickname',
value: 'username'
},
data: res,
})
}
})
}
});
});
\ No newline at end of file
... ...
<!--新增/编辑弹出框-->
<article>
<div class="layui-card">
<form class="layui-form form-edit layui-form-pane" action="" lay-filter="form-bustype-edit">
<div class="layui-form-item">
<label class="layui-form-label">父业务<span style="color: red">*</span></label>
<div class="layui-input-block">
<select name="parentId" class="layui-select" lay-verify="required">
<option value="0" selected>root</option>
</select>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">编码<span style="color: red">*</span></label>
<div class="layui-input-block">
<input type="text" id="txt-bustype-code" name="busTypeCode" lay-verify="required" placeholder="请输入编码" class="layui-input">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">名称<span style="color: red">*</span></label>
<div class="layui-input-block">
<input type="text" id="txt-bustype-name" name="busTypeName" lay-verify="required" placeholder="请输入名称" class="layui-input">
</div>
</div>
<!-- <div class="layui-form-item">-->
<!-- <label class="layui-form-label">负责人</label>-->
<!-- <div class="layui-input-block">-->
<!-- <input type="text" id="txt-bustype-admin" name="admin" lay-verify="required" placeholder="请输入负责人" class="layui-input">-->
<!-- </div>-->
<!-- </div>-->
<div class="layui-form-item">
<label class="layui-form-label">负责人<span style="color: red">*</span></label>
<div class="layui-input-block adminUser">
</div>
</div>
<!-- <div class="layui-form-item">-->
<!-- <label class="layui-form-label">负责人电话</label>-->
<!-- <div class="layui-input-block">-->
<!-- <input type="text" id="txt-bustype-admintel" name="adminTel" lay-verify="required|phone" placeholder="请输入负责人电话" class="layui-input">-->
<!-- </div>-->
<!-- </div>-->
<div class="layui-form-item">
<label class="layui-form-label">是否使用<span style="color: red">*</span></label>
<div class="layui-input-block">
<input type="checkbox" lay-skin="switch" name="isUse" value="1" lay-text="是|否" checked/>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">重要程度<span style="color: red">*</span></label>
<div class="layui-input-block">
<select name="important" class="layui-select" lay-verify="required">
<option value="1">核心</option>
<option value="2">重要</option>
<option value="3">一般</option>
<option value="9">虚拟业务</option>
</select>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">排序<span style="color: red">*</span></label>
<div class="layui-input-block">
<input type="number" placeholder="请输入排序" name="sort" class="layui-input" lay-verify="required">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label textarea-label">描述</label>
<div class="layui-input-block">
<textarea name="busTypeDesc" placeholder="请输入业务类型描述" class="layui-textarea"></textarea>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">乙方运维<span style="color: red">*</span></label>
<div class="layui-input-block">
<input type="checkbox" lay-skin="switch" name="system_type" value="1" lay-filter="system_type" lay-text="是|否" checked/>
</div>
</div>
<div class="layui-form-item" id="select_principalName">
<label class="layui-form-label">运维负责人：</label>
<div class="layui-input-block">
<div id="opsProject-username-select" name="principalName"></div>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">虚拟业务<span style="color: red">*</span></label>
<div class="layui-input-block">
<input type="checkbox" lay-skin="switch" name="isvirtual" lay-filter="switch_isVirtual" value="0" lay-text="是|否" checked/>
</div>
</div>
<button id="btn-bustype-submit" class="hide" lay-submit lay-filter="bus-type-submit">提交</button>
</form>
</div>
</article>
<script>
layui.use('bustypeAdd', function (fn) {
fn({{d}});
});
</script>
\ No newline at end of file
... ...
<title>业务类型管理</title>
<article class="page-container">
<div class="page-panel">
<div class="main">
<div class="layui-card">
<div class="layui-card-header">
<div class="layui-status">
<form class="layui-card-header layuiadmin-card-header-auto layui-form" lay-filter="bustype-query-form">
<div class="layui-form-item">
<div class="layui-inline">
<div class="layui-input-inline layui-input-inline--long">
<input type="text" id="condition-bustype-name" lay-tips="关键字检索包含 </br>业务名称" placeholder="输入关键字，回车搜索" autocomplete="off" class="layui-input">
</div>
</div>
<div class="layui-inline">
<button id="bustypeQueryBtn" type="button" class="layui-btn layui-btn-normal" ><i
class="layui-icon layui-icon-search"></i>查询
</button>
</div>
</div>
</form>
</div>
</div>
<div class="layui-card-body">
<div class="warn-btns">
<button class="layui-btn layui-btn-sm layui-btn-normal" id="bustype-create">
<i class="layui-icon">&#xe654;</i>新增
</button>
<button class="layui-btn layui-btn-sm layui-btn-normal" id="btn-bustype-delete">
<i class="layui-icon">&#xe640;</i>删除
</button>
<button class="layui-btn layui-btn-sm layui-btn-normal hide" id="btn-bustype-authorization">
<i class="layui-icon">&#xe672;</i>授权
</button>
<button class="layui-btn layui-btn-sm layui-btn-normal hide" id="btn-bustype-reload-table">
<i class="layui-icon">&#xe654;</i>刷新表格
</button>
<span class="auto-flush" id="span-bustype-total">共 0 个业务</span>
</div>
<table id="bustype-table" lay-filter="bustypetable"></table>
</div>
</div>
</div>
</div>
</article>
<script type="text/html" id="bustype-reslist-table">
<div class="page-panel">
<div class="main">
<div class="layui-card">
<div class="layui-card-header">
<div class="layui-status">
<form class="layui-form layui-card-header layuiadmin-card-header-auto" lay-filter="bustype-res-list-query-form">
<div class="layui-form-item">
<div class="layui-inline">
<div class="layui-input-inline layui-input-inline--long">
<input id="bustype_reslist_keyword" type="text" name="title" placeholder="输入关键字，回车搜索" class="layui-input">
</div>
</div>
<div class="layui-inline">
<div class="layui-input-inline">
<select name="bustype_reslist_restype" id="bustype_reslist_restype" lay-filter="bustype_reslist_restype">
<option value="">=资源类型=</option>
</select>
</div>
</div>
<div class="layui-inline">
<div class="layui-input-inline">
<select name="bustype_reslist_resStatus" id="bustype_reslist_resStatus" lay-filter="bustype_reslist_resStatus" lay-verify="required">
<option value="">=资源状态=</option>
<option value="1">中</option>
<option value="2">良</option>
<option value="3">优</option>
</select>
</div>
</div>
</div>
</form>
</div>
</div>
<div class="layui-card-body">
<div class="warn-btns bustype-btns">
<button class="layui-btn layui-btn-sm layui-btn-normal" id="bustype-reslist-add">
<i class="layui-icon">&#xe654;</i>添加绑定
</button>
<button class="layui-btn layui-btn-sm layui-btn-normal" id="bustype-reslist-unbind">
<i class="layui-icon">&#xe64d;</i>取消绑定
</button>
</div>
<table id="bustype_reslist_resListTable"></table>
</div>
</div>
</div>
</div>
</script>
<script template lay-done="layui.data.sendParams(d.params)"></script>
<script>
layui.data.sendParams = function (params) {
layui.use('bustype', function (fn) {
fn(params);
});
};
</script>
\ No newline at end of file
... ...