Some more category changes

master
Mike Koch 7 years ago
parent 60301f4aab
commit aa307e6b15

@ -445,13 +445,16 @@ $res = hesk_dbQuery("SELECT * FROM `" . hesk_dbEscape($hesk_settings['db_pfix'])
</div>
</section>
</div>
<!-- Edit category modal -->
<div class="modal fade" id="edit-category-modal" tabindex="-1" role="dialog" style="overflow: hidden">
<!-- Category modal -->
<div class="modal fade" id="category-modal" tabindex="-1" role="dialog" style="overflow: hidden">
<div class="modal-dialog modal-lg" role="document">
<div class="modal-content">
<div class="modal-header" style="cursor: move">
<button type="button" class="close cancel-callback" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
<h4 class="modal-title" id="myModalLabel"><?php echo $hesklang['edit_category']; ?></h4>
<h4 class="modal-title" id="myModalLabel">
<span id="title-edit-category"><?php echo $hesklang['edit_category']; ?></span>
<span id="title-add-category"><?php echo $hesklang['create_cat']; ?></span>
</h4>
</div>
<form action="manage_categories.php" class="form-horizontal" data-toggle="validator" method="post">
<div class="modal-body">
@ -535,15 +538,6 @@ $res = hesk_dbQuery("SELECT * FROM `" . hesk_dbEscape($hesk_settings['db_pfix'])
<div class="help-block with-errors"></div>
</div>
</div>
<div class="form-group">
<label for="manager" class="col-sm-3 control-label">
<?php echo $hesklang['manager']; ?>
</label>
<div class="col-sm-9">
<?php echo output_user_dropdown($users); ?>
<div class="help-block with-errors"></div>
</div>
</div>
<div class="form-group">
<label for="usage" class="col-sm-3 control-label">
<?php echo $hesklang['usage']; ?>
@ -578,62 +572,13 @@ $res = hesk_dbQuery("SELECT * FROM `" . hesk_dbEscape($hesk_settings['db_pfix'])
</div>
</div>
</div>
<script>
$(document).ready(function() {
$('.category-modal-trigger').click(function() {
var $row = $('tr[data-category-id="' + $(this).attr('data-category-id') + '"]');
// Since the data-name attribute is escaped, this needs to be converted back via this fancy method.
var tempNameElement = document.createElement('textarea');
tempNameElement.innerHTML = $row.attr('data-name');
var name = tempNameElement.value;
var id = $row.attr('data-category-id');
var backgroundColor = $row.attr('data-background-color');
var foregroundColor = $row.attr('data-foreground-color');
var priority = $row.attr('data-priority');
var manager = $row.attr('data-manager');
var usage = $row.attr('data-usage');
var $modal = $('#edit-category-modal');
$modal.find('input[name="name"]').val(name).end()
.find('select[name="priority"]').val(priority).end()
.find('select[name="manager"]').val(manager).end()
.find('input[name="id"]').val(id).end()
.find('select[name="usage"]').val(usage).end()
.find('input[name="background-color"]').val(backgroundColor).end()
.find('input[name="foreground-color"]').val(foregroundColor).end();
var colorpickerOptions = {
format: 'hex',
color: backgroundColor
};
$modal.find('input[name="background-color"]')
.colorpicker(colorpickerOptions).end().modal('show');
colorpickerOptions = {
format: 'hex'
};
if (foregroundColor != '') {
colorpickerOptions.color = foregroundColor;
}
$modal.find('input[name="foreground-color"]')
.colorpicker(colorpickerOptions).end().modal('show');
});
$('.cancel-callback').click(function() {
var $editCategoryModal = $('#edit-category-modal');
$editCategoryModal.find('input[name="background-color"]').val('').colorpicker('destroy').end();
$editCategoryModal.find('input[name="foreground-color"]').val('').colorpicker('destroy').end();
});
});
</script>
<script type="text/html" id="category-row-template">
<tr>
<td><span data-property="id" data-value="x"></span></td>
<td><span data-property="category-name"></span></td>
<td>
<span class="label category-label" data-property="category-name">
</span>
</td>
<td><span data-property="priority"></span></td>
<td><a data-property="number-of-tickets" href="#"></a></td>
<td>
@ -648,11 +593,11 @@ $res = hesk_dbQuery("SELECT * FROM `" . hesk_dbEscape($hesk_settings['db_pfix'])
</td>
<td>
<a data-property="generate-link" href="#">
<i class="fa fa-fw fa-code icon-link" style="color: green" data-toggle="tooltip"
data-placement="top" title="<?php $hesklang['geco']; ?>"></i>
<i class="fa fa-fw fa-code icon-link" data-toggle="tooltip"
data-placement="top" title="#"></i>
</a>
<a data-property="autoassign-link" href="#">
<i class="fa fa-fw fa-bolt icon-link orange"
<i class="fa fa-fw fa-bolt icon-link"
data-toggle="tooltip" data-placement="top" title="Category autoassign tooltip"></i>
</a>
<a data-property="type-link" href="#">
@ -689,6 +634,12 @@ echo mfh_get_hidden_fields_for_language(array(
'medium',
'low',
'perat',
'aaon',
'aaoff',
'cat_private',
'cat_public',
'geco',
'cpric',
));
require_once(HESK_PATH . 'inc/footer.inc.php');
@ -1006,30 +957,6 @@ function toggle_type()
} // End toggle_type()
function output_user_dropdown($userArray)
{
global $hesklang;
if (!hesk_checkPermission('can_set_manager', 0)) {
foreach ($userArray as $user) {
if ($user['id'] == $selectId) {
return '<p>' . $user['name'] . '</p><input type="hidden" name="manager">';
}
}
return '<p>' . $hesklang['no_manager'] . '</p><input type="hidden" name="manager">';
} else {
$dropdownMarkup = '<select class="form-control" name="manager">
<option value="0">' . $hesklang['no_manager'] . '</option>';
foreach ($userArray as $user) {
$dropdownMarkup .= '<option value="' . $user['id'] . '">' . $user['name'] . '</option>';
}
$dropdownMarkup .= '</select>';
return $dropdownMarkup;
}
}
function get_manager($user_id, $user_array) {
global $hesklang;

@ -2,6 +2,8 @@ var categories = [];
$(document).ready(function() {
loadTable();
bindEditModal();
bindModalCancelCallback();
});
@ -34,7 +36,17 @@ function loadTable() {
var $template = $($('#category-row-template').html());
$template.find('span[data-property="id"]').text(this.id).attr('data-value', this.id);
$template.find('span[data-property="category-name"]').text(this.name);
var $nameField = $template.find('span[data-property="category-name"]');
if (this.foregroundColor === 'AUTO') {
$nameField.addClass('background-volatile');
} else {
$nameField.css('color', this.foregroundColor);
}
$nameField.css('background', this.backgroundColor);
if (this.displayBorder && this.foregroundColor !== 'AUTO') {
$nameField.css('border', 'solid 1px ' + this.foregroundColor);
}
$nameField.html(this.name);
var $priority = $template.find('span[data-property="priority"]');
if (this.priority === 0) {
// Critical
@ -57,6 +69,8 @@ function loadTable() {
$template.find('div.progress').attr('title', percentText.replace('%s', percentage + '%'));
$template.find('div.progress-bar').attr('aria-value-now', percentage).css('width', percentage + '%');
$template.find('[data-property="generate-link"]').find('i').attr('title', mfhLang.text('geco'));
if (this.usage === 1) {
// Tickets only
$template.find('.fa-calendar').removeClass('fa-calendar');
@ -65,7 +79,28 @@ function loadTable() {
$template.find('.fa-ticket').removeClass('fa-ticket');
}
// TODO Action buttons
if (this.autoAssign) {
$template.find('[data-property="autoassign-link"]').attr('href', '#on')
.find('i').attr('title', mfhLang.text('aaon')).addClass('orange');
} else {
$template.find('[data-property="autoassign-link"]').attr('href', '#off')
.find('i').attr('title', mfhLang.text('aaoff')).addClass('gray');
}
if (this.type === 1) {
// Private
$template.find('[data-property="type-link"]').attr('href', '#private')
.find('i').addClass('fa-lock').attr('title', mfhLang.text('cat_private')).addClass('gray');
$template.find('[data-property="generate-link"]')
.find('i').removeClass('fa-code').addClass('fa-ban').addClass('red')
.attr('title', mfhLang.text('cpric'));
} else {
// Public
$template.find('[data-property="type-link"]').attr('href', '#public')
.find('i').addClass('fa-unlock-alt').attr('title', mfhLang.text('cat_public')).addClass('blue');
$template.find('[data-property="generate-link"]')
.find('i').addClass('green').attr('title', mfhLang.text('geco'));
}
$tableBody.append($template);
@ -90,7 +125,88 @@ function loadTable() {
console.error(data);
},
complete: function() {
refreshBackgroundVolatileItems();
$('#overlay').hide();
}
});
}
function bindEditModal() {
$(document).on('click', '[data-action="edit"]', function() {
var element = categories[$(this).parent().parent().find('[data-property="id"]').text()];
var $modal = $('#category-modal');
$modal.find('#title-edit-category').show();
$modal.find('#title-add-category').hide();
$modal.find('input[name="name"]').val(element.name).end()
.find('select[name="priority"]').val(element.priority).end()
.find('input[name="id"]').val(element.id).end()
.find('select[name="usage"]').val(element.usage).end();
var backgroundColor = element.backgroundColor;
var foregroundColor = element.foregroundColor;
var colorpickerOptions = {
format: 'hex',
color: backgroundColor
};
$modal.find('input[name="background-color"]')
.colorpicker(colorpickerOptions).end().modal('show');
colorpickerOptions = {
format: 'hex'
};
if (foregroundColor != '' && foregroundColor !== 'AUTO') {
colorpickerOptions.color = foregroundColor;
}
$modal.find('input[name="foreground-color"]')
.colorpicker(colorpickerOptions).end().modal('show');
/*$modal.find('select[name="place"]').val(element.place);
$modal.find('input[name="id"]').val(element.id);
$modal.find('input[name="url"]').val(element.url);
var $textLanguages = $modal.find('[data-text-language]');
$.each($textLanguages, function() {
var language = $(this).data('text-language');
$(this).val(element.text[language]);
});
var $subtextLanguages = $modal.find('[data-subtext-language]');
$.each($subtextLanguages, function() {
var language = $(this).data('subtext-language');
$(this).val(element.subtext[language]);
});
if (element.place === 1) {
$('#subtext').show();
} else {
$('#subtext').hide();
}
if (element.imageUrl !== null) {
$modal.find('select[name="image-type"]').val('image-url');
$modal.find('input[name="image-url"]').val(element.imageUrl);
$modal.find('#font-icon-group').hide();
$modal.find('#image-url-group').show();
} else {
$modal.find('select[name="image-type"]').val('font-icon');
$('[data-toggle="nav-iconpicker"]').iconpicker('setIcon', element.fontIcon);
$modal.find('#font-icon-group').show();
$modal.find('#image-url-group').hide();
}*/
$modal.modal('show');
});
}
function bindModalCancelCallback() {
$('.cancel-callback').click(function() {
var $editCategoryModal = $('#category-modal');
$editCategoryModal.find('input[name="background-color"]').val('').colorpicker('destroy').end();
$editCategoryModal.find('input[name="foreground-color"]').val('').colorpicker('destroy').end();
});
}
Loading…
Cancel
Save