mirror of
https://github.com/OpenXE-org/OpenXE.git
synced 2024-11-15 12:37:14 +01:00
846 lines
28 KiB
Smarty
846 lines
28 KiB
Smarty
|
<style>
|
||
|
|
.ui-sortable-helper #wiedervorlage-minidetail-container {
|
||
|
|
display: none;
|
||
|
|
}
|
||
|
|
#wiedervorlage-minidetail-container {
|
||
|
|
z-index: 99999;
|
||
|
|
display: block;
|
||
|
|
position: absolute;
|
||
|
|
top: 0;
|
||
|
|
left: -1px;
|
||
|
|
min-width: 320px;
|
||
|
|
max-width: 400px;
|
||
|
|
padding: 10px;
|
||
|
|
background-color: #FFF;
|
||
|
|
box-shadow: rgba(0, 0, 0, .25) 0 0 10px;
|
||
|
|
border: 2px solid rgb(166, 201, 226);
|
||
|
|
}
|
||
|
|
#wiedervorlage-minidetail-container .detail {
|
||
|
|
margin-bottom: 10px;
|
||
|
|
}
|
||
|
|
#wiedervorlage-minidetail-container .detail > div {
|
||
|
|
margin: 5px;
|
||
|
|
}
|
||
|
|
#wiedervorlage-minidetail-container .title {
|
||
|
|
font-size: 110%;
|
||
|
|
font-weight: bold;
|
||
|
|
}
|
||
|
|
#wiedervorlage-minidetail-container .description {
|
||
|
|
line-height: 1.3em;
|
||
|
|
max-height: 100px;
|
||
|
|
overflow-y: auto;
|
||
|
|
}
|
||
|
|
#wiedervorlage-minidetail-container .overdue {
|
||
|
|
font-weight: bold;
|
||
|
|
color: orangered;
|
||
|
|
}
|
||
|
|
#wiedervorlage-minidetail-container .timeline {
|
||
|
|
font-size: 85%;
|
||
|
|
}
|
||
|
|
#wiedervorlage-minidetail-container .timeline ul {
|
||
|
|
margin: 0;
|
||
|
|
padding: 0;
|
||
|
|
}
|
||
|
|
#wiedervorlage-minidetail-container .timeline .tl-wrap {
|
||
|
|
padding-top: 10px;
|
||
|
|
padding-bottom: 10px;
|
||
|
|
}
|
||
|
|
#wiedervorlage-minidetail-container .tl-wrap:before {
|
||
|
|
top: 25px;
|
||
|
|
}
|
||
|
|
#wiedervorlage-minidetail-container .tl-date {
|
||
|
|
top: 0;
|
||
|
|
text-align: left;
|
||
|
|
}
|
||
|
|
#wiedervorlage-minidetail-container .tl-content {
|
||
|
|
top: 3px;
|
||
|
|
}
|
||
|
|
#wiedervorlage-minidetail-container .arrow.pull-up {
|
||
|
|
display: none;
|
||
|
|
}
|
||
|
|
|
||
|
|
#datacontent {
|
||
|
|
width: auto;
|
||
|
|
margin: 15px 0 0 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
#scroll-wrapper {
|
||
|
|
width: 100%;
|
||
|
|
overflow-x: auto;
|
||
|
|
overflow-y: visible;
|
||
|
|
}
|
||
|
|
#scroll-area {
|
||
|
|
display: flex;
|
||
|
|
min-height: 100vh;
|
||
|
|
flex-wrap: nowrap;
|
||
|
|
justify-content: flex-start;
|
||
|
|
align-items: stretch;
|
||
|
|
-ms-user-select: none;
|
||
|
|
-webkit-user-select: none;
|
||
|
|
-moz-user-select: none;
|
||
|
|
user-select: none;
|
||
|
|
border-left: 1px solid var(--fieldset-dark);
|
||
|
|
margin-bottom: 60px;
|
||
|
|
}
|
||
|
|
|
||
|
|
ul[class^="draggable"] {
|
||
|
|
list-style-type: none;
|
||
|
|
margin: 0;
|
||
|
|
padding: 0;
|
||
|
|
}
|
||
|
|
ul[class^="draggable"] > li {
|
||
|
|
position: relative;
|
||
|
|
margin: 0;
|
||
|
|
padding: 5px 10px;
|
||
|
|
min-height: 52px;
|
||
|
|
}
|
||
|
|
ul[class^="draggable"] > li:hover {
|
||
|
|
}
|
||
|
|
.ui-sortable-helper {
|
||
|
|
z-index: 1001;
|
||
|
|
box-shadow: rgba(0, 0, 0, .5) 1px 1px 3px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.same_height {
|
||
|
|
height: [COLUMNHEIGHT];
|
||
|
|
}
|
||
|
|
.sortable_column {
|
||
|
|
flex-grow: 1;
|
||
|
|
flex-direction: row;
|
||
|
|
flex-basis: 200px;
|
||
|
|
min-width: 150px;
|
||
|
|
max-width: 350px;
|
||
|
|
box-sizing: border-box;
|
||
|
|
margin: 0;
|
||
|
|
border-right: 1px solid var(--fieldset-dark);
|
||
|
|
border-top: 1px solid var(--fieldset-dark);
|
||
|
|
border-bottom: 1px solid var(--fieldset-dark);
|
||
|
|
background: var(--fieldset);
|
||
|
|
}
|
||
|
|
.sortable_heading {
|
||
|
|
border-bottom: 1px solid var(--fieldset-dark);
|
||
|
|
}
|
||
|
|
.sortable_heading h3 {
|
||
|
|
color: var(--grey);
|
||
|
|
white-space: nowrap;
|
||
|
|
text-overflow: ellipsis;
|
||
|
|
font-weight: bold;
|
||
|
|
margin: 0;
|
||
|
|
padding: 5px 10px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.sortable_placeholder {
|
||
|
|
background-color: #FFC;
|
||
|
|
border-bottom: 1px solid var(--fieldset-dark);
|
||
|
|
}
|
||
|
|
|
||
|
|
.wiedervorlageitem {
|
||
|
|
cursor: pointer;
|
||
|
|
border: none;
|
||
|
|
background-color: #FFF !important;
|
||
|
|
border-bottom: 1px solid var(--fieldset-dark);
|
||
|
|
}
|
||
|
|
.wiedervorlageitem.is-finished,
|
||
|
|
.wiedervorlageitem.is-finished .item-center {
|
||
|
|
text-decoration: line-through;
|
||
|
|
}
|
||
|
|
|
||
|
|
.item-center {
|
||
|
|
width: 100%;
|
||
|
|
padding-right: 22px;
|
||
|
|
padding-left: 40px;
|
||
|
|
}
|
||
|
|
.item-center .row {
|
||
|
|
width: 100%;
|
||
|
|
padding: 0;
|
||
|
|
margin: 2px 0;
|
||
|
|
}
|
||
|
|
.item-center .row-name {
|
||
|
|
font-weight: normal;
|
||
|
|
}
|
||
|
|
.item-center .row-bezeichnung {
|
||
|
|
word-wrap: break-word;
|
||
|
|
font-weight: bold;
|
||
|
|
}
|
||
|
|
.item-center .additional-field-value {
|
||
|
|
color: #848484;
|
||
|
|
}
|
||
|
|
.item-left {
|
||
|
|
position: absolute;
|
||
|
|
top: 0;
|
||
|
|
left: 0;
|
||
|
|
width: 50px;
|
||
|
|
height: 100%;
|
||
|
|
border-left-style: solid;
|
||
|
|
border-left-width: 10px;
|
||
|
|
border-left-color: #eee;
|
||
|
|
}
|
||
|
|
.item-left img {
|
||
|
|
width: 30px;
|
||
|
|
height: auto;
|
||
|
|
margin-top: 7px;
|
||
|
|
margin-left: 5px;
|
||
|
|
}
|
||
|
|
.item-right {
|
||
|
|
clear: right;
|
||
|
|
position: absolute;
|
||
|
|
top: 5px;
|
||
|
|
right: 10px;
|
||
|
|
width: 20px;
|
||
|
|
}
|
||
|
|
.item-right .icon-today-due,
|
||
|
|
.item-right .icon-over-due,
|
||
|
|
.item-right .icon-under-due,
|
||
|
|
.item-right .icon-prio {
|
||
|
|
display: inline-block;
|
||
|
|
width: 20px;
|
||
|
|
height: 20px;
|
||
|
|
background-repeat: no-repeat;
|
||
|
|
background-position: center;
|
||
|
|
background-size: auto;
|
||
|
|
}
|
||
|
|
.item-right .icon-today-due {
|
||
|
|
background-image: url("./themes/new/images/sales_gruen.png");
|
||
|
|
}
|
||
|
|
.item-right .icon-over-due {
|
||
|
|
background-image: url("./themes/new/images/sales_rot.png");
|
||
|
|
}
|
||
|
|
.item-right .icon-under-due {
|
||
|
|
background-image: url("./themes/new/images/sales_grau.png");
|
||
|
|
}
|
||
|
|
.item-right .icon-prio {
|
||
|
|
background-image: url("./themes/new/images/sales_achtung_gelb.png");
|
||
|
|
}
|
||
|
|
|
||
|
|
#error {
|
||
|
|
color: red;
|
||
|
|
}
|
||
|
|
|
||
|
|
#deal {
|
||
|
|
position: fixed;
|
||
|
|
z-index: 920;
|
||
|
|
left: 0;
|
||
|
|
right: 0;
|
||
|
|
bottom: 0;
|
||
|
|
padding: 15px;
|
||
|
|
filter: alpha(opacity=0);
|
||
|
|
-moz-opacity: 0;
|
||
|
|
opacity: 0;
|
||
|
|
text-align: center;
|
||
|
|
transition: all ease-in-out .3s;
|
||
|
|
background-color: dimgrey;
|
||
|
|
-ms-user-select: none;
|
||
|
|
-webkit-user-select: none;
|
||
|
|
-moz-user-select: none;
|
||
|
|
user-select: none;
|
||
|
|
}
|
||
|
|
#deal.open {
|
||
|
|
opacity: 1;
|
||
|
|
transition: opacity ease-in-out .3s;
|
||
|
|
}
|
||
|
|
#deal-inner {
|
||
|
|
max-width: 900px;
|
||
|
|
min-width: 300px;
|
||
|
|
margin: 0 auto;
|
||
|
|
}
|
||
|
|
.droppable-container {
|
||
|
|
float: left;
|
||
|
|
width: 33%;
|
||
|
|
}
|
||
|
|
.droppable {
|
||
|
|
overflow: hidden;
|
||
|
|
box-sizing: border-box;
|
||
|
|
max-width: 300px;
|
||
|
|
min-height: 35px;
|
||
|
|
padding: 5px;
|
||
|
|
margin: 5px;
|
||
|
|
border-radius: 15px;
|
||
|
|
color: white;
|
||
|
|
font-size: 30px;
|
||
|
|
text-align: center;
|
||
|
|
}
|
||
|
|
.droppable.gewinner {
|
||
|
|
background: #4EC560;
|
||
|
|
}
|
||
|
|
.droppable.verlierer {
|
||
|
|
background: #E14449;
|
||
|
|
}
|
||
|
|
.droppable.papierkorb {
|
||
|
|
background: #bcbcbc;
|
||
|
|
}
|
||
|
|
.droppable.highlight {
|
||
|
|
background: orange !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
#page_container > div > div.ui-tabs-panel {
|
||
|
|
margin-bottom: 70px !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
@media only screen and (max-width: 650px){
|
||
|
|
.droppable {
|
||
|
|
font-size: 21px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
.filter-item {
|
||
|
|
float: left;
|
||
|
|
padding: 0 10px 10px 0;
|
||
|
|
}
|
||
|
|
</style>
|
||
|
|
<script type="text/javascript">
|
||
|
|
|
||
|
|
var WiedervorlagenMiniDetail = function($) {
|
||
|
|
|
||
|
|
var me = {
|
||
|
|
|
||
|
|
settings: {
|
||
|
|
// Zeit die gewartet wird; vom Hovern bis AJAX abgesetzt wird (in Millisekunden)
|
||
|
|
bufferTime: 500
|
||
|
|
},
|
||
|
|
|
||
|
|
selector: {
|
||
|
|
minidetail: '#wiedervorlage-minidetail-container',
|
||
|
|
|
||
|
|
// Selektor für alle Wiedervorlagen
|
||
|
|
wiedervorlageItems: '.wiedervorlageitem'
|
||
|
|
},
|
||
|
|
|
||
|
|
storage: {
|
||
|
|
// Wird Minidetail gerade angezeigt?
|
||
|
|
currentOpen: false,
|
||
|
|
|
||
|
|
// ID der aktuell geöffneten Wiedervorlage
|
||
|
|
currentId: null,
|
||
|
|
|
||
|
|
// ID der Wiedervorlage die aktuell überfahren wird
|
||
|
|
currentHoverId: null,
|
||
|
|
|
||
|
|
// StageID der aktuell geöffneten Wiedervorlage
|
||
|
|
currentStageId: null,
|
||
|
|
|
||
|
|
// Puffer-Variable
|
||
|
|
bufferTimeout: null
|
||
|
|
},
|
||
|
|
|
||
|
|
/**
|
||
|
|
* MiniDetail-Feature initialisieren
|
||
|
|
*/
|
||
|
|
init: function () {
|
||
|
|
me.attachEvents();
|
||
|
|
},
|
||
|
|
|
||
|
|
/**
|
||
|
|
* Registiert alle benötigten Events
|
||
|
|
*/
|
||
|
|
attachEvents: function () {
|
||
|
|
$(me.selector.wiedervorlageItems)
|
||
|
|
.on('mouseenter mouseover', function () {
|
||
|
|
var $current = $(this);
|
||
|
|
|
||
|
|
// Merken welche Wiedervorlage gerade überfahren wird
|
||
|
|
me.storage.currentHoverId = parseInt($current.data('id'));
|
||
|
|
|
||
|
|
// Puffer zurücksetzen
|
||
|
|
clearTimeout(me.storage.bufferTimeout);
|
||
|
|
|
||
|
|
// Pufferzeit warten, dann Wiedervorlage-MiniDetail per AJAX laden
|
||
|
|
me.storage.bufferTimeout = setTimeout(
|
||
|
|
function () {
|
||
|
|
var wiedervorlageId = parseInt($current.data('id'));
|
||
|
|
var stageId = parseInt($current.parents('.sortable_column').data('id'));
|
||
|
|
me.loadMiniDetail(wiedervorlageId, stageId);
|
||
|
|
},
|
||
|
|
me.settings.bufferTime
|
||
|
|
);
|
||
|
|
})
|
||
|
|
.on('mouseleave', function () {
|
||
|
|
// Merken wenn sich Maus gerade über keiner Wiedervorlage befindet
|
||
|
|
me.storage.currentHoverId = null;
|
||
|
|
// Timer zurücksetzen, wenn innerhalb der Pufferzeit das Element wieder verlassen wird
|
||
|
|
clearTimeout(me.storage.bufferTimeout);
|
||
|
|
// Alle MiniDetails löschen
|
||
|
|
me.closeAll();
|
||
|
|
me.storage.deactivateItem = null;
|
||
|
|
})
|
||
|
|
.on('click', function () {
|
||
|
|
var wiedervorlageId = $(this).data('id');
|
||
|
|
EditWiedervorlage(wiedervorlageId);
|
||
|
|
});
|
||
|
|
},
|
||
|
|
|
||
|
|
/**
|
||
|
|
* MiniDetail-Daten per AJAX laden und rendern
|
||
|
|
*
|
||
|
|
* @param {number} wiedervorlageId
|
||
|
|
* @param {number} stageId
|
||
|
|
*/
|
||
|
|
loadMiniDetail: function (wiedervorlageId, stageId) {
|
||
|
|
if (typeof wiedervorlageId === 'undefined') {
|
||
|
|
return;
|
||
|
|
}
|
||
|
|
|
||
|
|
// MiniDetail ist für die aktuelle ID und Stage schon geöffnet
|
||
|
|
if (me.storage.currentId === wiedervorlageId &&
|
||
|
|
me.storage.currentOpen === true
|
||
|
|
) {
|
||
|
|
return;
|
||
|
|
}
|
||
|
|
|
||
|
|
$.ajax({
|
||
|
|
url: 'index.php?module=wiedervorlage&action=pipes&cmd=minidetail',
|
||
|
|
data: {
|
||
|
|
id: wiedervorlageId
|
||
|
|
},
|
||
|
|
method: 'post',
|
||
|
|
dataType: 'json',
|
||
|
|
success: function (data, textStatus) {
|
||
|
|
if (typeof data !== 'object') {
|
||
|
|
me.closeAll();
|
||
|
|
return;
|
||
|
|
}
|
||
|
|
|
||
|
|
// AJAX ist da, Maus befindet sich zwischenzeitlich über keiner Wiedervorlage
|
||
|
|
if (me.storage.currentHoverId === null) {
|
||
|
|
return;
|
||
|
|
}
|
||
|
|
|
||
|
|
// AJAX ist da, Maus befindet sich zwischenzeitlich über anderer Wiedervorlage
|
||
|
|
if (me.storage.currentHoverId !== parseInt(data.id)) {
|
||
|
|
return;
|
||
|
|
}
|
||
|
|
|
||
|
|
me.closeAll();
|
||
|
|
$('<div id="wiedervorlage-minidetail-container"></div>').appendTo('#wiedervorlageitem-' + data.id);
|
||
|
|
$(me.selector.minidetail).html(me.renderMiniDetail(data));
|
||
|
|
|
||
|
|
me.storage.currentOpen = true;
|
||
|
|
me.storage.currentId = parseInt(data.id);
|
||
|
|
me.storage.currentStageId = parseInt(data.stage);
|
||
|
|
},
|
||
|
|
fail: function () {
|
||
|
|
me.closeAll();
|
||
|
|
},
|
||
|
|
error: function () {
|
||
|
|
alert('Hoppla, Wiedervorlage konnte nicht geladen werden');
|
||
|
|
me.destroy();
|
||
|
|
}
|
||
|
|
});
|
||
|
|
},
|
||
|
|
|
||
|
|
/**
|
||
|
|
* Generiert HTML für MiniDetail-Container
|
||
|
|
*
|
||
|
|
* @param {array} data
|
||
|
|
*
|
||
|
|
* @return {string} HTML-Struktur
|
||
|
|
*/
|
||
|
|
renderMiniDetail: function (data) {
|
||
|
|
var result =
|
||
|
|
'<div class="detail">'+
|
||
|
|
' <div class="title"><strong>{{title}}</strong></div>'+
|
||
|
|
' <div class="duedate {{overDue}}">Fällig am: {{duedate}}</div>'+
|
||
|
|
' <div class="description">{{description}}</div>'+
|
||
|
|
'</div>'+
|
||
|
|
'<div class="timeline">{{timeline}}</div>';
|
||
|
|
|
||
|
|
if (data.abgeschlossen === '1') {
|
||
|
|
data.bezeichnung += ' (Abgeschlossen)';
|
||
|
|
}
|
||
|
|
result = result.replace('{{title}}', data.bezeichnung);
|
||
|
|
result = result.replace('{{overDue}}', (data.ueberfaellig === '1') ? 'overdue' : '');
|
||
|
|
result = result.replace('{{duedate}}', me.formatDateTime(data.erinnerung));
|
||
|
|
result = result.replace('{{description}}', data.beschreibung);
|
||
|
|
result = result.replace('{{timeline}}', me.generateTimelineHtml(data.timeline));
|
||
|
|
|
||
|
|
return result;
|
||
|
|
},
|
||
|
|
|
||
|
|
/**
|
||
|
|
* Generiert HTML für die Timeline
|
||
|
|
*
|
||
|
|
* @param {array} data
|
||
|
|
*
|
||
|
|
* @return {string} HTML-Struktur
|
||
|
|
*/
|
||
|
|
generateTimelineHtml: function (data) {
|
||
|
|
var result = '<ul>';
|
||
|
|
var tpl =
|
||
|
|
'<li class="tl-item">'+
|
||
|
|
' <div class="tl-wrap">'+
|
||
|
|
' <div class="tl-date">{{time}} - {{username}}</div>'+
|
||
|
|
' <div class="tl-content panel padder b-a">'+
|
||
|
|
' <span class="arrow left pull-up"></span>'+
|
||
|
|
' <div class="content">{{content}}</div>'+
|
||
|
|
' </div>'+
|
||
|
|
' </div>'+
|
||
|
|
'</li>';
|
||
|
|
|
||
|
|
for (var i = 0; i < data.length; i++) {
|
||
|
|
var eventHtml = tpl;
|
||
|
|
eventHtml = eventHtml.replace('{{username}}', data[i].username);
|
||
|
|
eventHtml = eventHtml.replace('{{content}}', data[i].content);
|
||
|
|
eventHtml = eventHtml.replace('{{time}}', me.formatDateTime(data[i].time));
|
||
|
|
|
||
|
|
result += eventHtml;
|
||
|
|
}
|
||
|
|
result += '</ul>';
|
||
|
|
|
||
|
|
return result;
|
||
|
|
},
|
||
|
|
|
||
|
|
/**
|
||
|
|
* Alle MiniDetails schließen
|
||
|
|
*/
|
||
|
|
closeAll: function () {
|
||
|
|
$(me.selector.minidetail).remove();
|
||
|
|
me.storage.currentOpen = false;
|
||
|
|
me.storage.currentId = null;
|
||
|
|
me.storage.currentStageId = null;
|
||
|
|
},
|
||
|
|
|
||
|
|
/**
|
||
|
|
* Wandelt DATETIME-Wert aus Datenbank in ein schönes Format
|
||
|
|
*
|
||
|
|
* @example "2018-06-21 13:37:01" > "Donnerstag, 21. Juni 2018, 13:37 Uhr"
|
||
|
|
*
|
||
|
|
* @param {string} value
|
||
|
|
*
|
||
|
|
* @return {string} Datum in "schön"
|
||
|
|
*/
|
||
|
|
formatDateTime: function (value) {
|
||
|
|
var date = new Date(value.replace(' ', 'T'));
|
||
|
|
var options = { weekday: 'long', year: 'numeric', month: 'long', day: 'numeric', hour: 'numeric', minute: 'numeric' };
|
||
|
|
|
||
|
|
return date.toLocaleDateString('de-DE', options) + ' Uhr';
|
||
|
|
},
|
||
|
|
|
||
|
|
/**
|
||
|
|
* Minidetail-Feature kurz deaktivieren
|
||
|
|
*/
|
||
|
|
deactivateForCurrentItem: function () {
|
||
|
|
var oldCurrentId = me.storage.currentId;
|
||
|
|
var oldCurrentHoverId = me.storage.currentHoverId;
|
||
|
|
|
||
|
|
// Minidetail schließen und vorgaukeln dass es gerade geöffent ist
|
||
|
|
me.closeAll();
|
||
|
|
me.storage.currentOpen = true;
|
||
|
|
me.storage.currentId = oldCurrentId;
|
||
|
|
me.storage.currentHoverId = oldCurrentHoverId;
|
||
|
|
},
|
||
|
|
|
||
|
|
/**
|
||
|
|
* Deaktiviert das MiniDetail-Feature
|
||
|
|
*/
|
||
|
|
destroy: function () {
|
||
|
|
me.closeAll();
|
||
|
|
$(me.selector.wiedervorlageItems).off('mouseenter mouseleave');
|
||
|
|
}
|
||
|
|
};
|
||
|
|
|
||
|
|
return {
|
||
|
|
init: me.init,
|
||
|
|
closeAll: me.closeAll,
|
||
|
|
destroy: me.destroy,
|
||
|
|
deactivateForCurrentItem: me.deactivateForCurrentItem
|
||
|
|
};
|
||
|
|
|
||
|
|
}(jQuery);
|
||
|
|
|
||
|
|
$(document).ready(function () {
|
||
|
|
|
||
|
|
WiedervorlagenMiniDetail.init();
|
||
|
|
|
||
|
|
setColumnsToSameHeight();
|
||
|
|
|
||
|
|
$('ul.draggable').sortable({
|
||
|
|
cursor: 'move',
|
||
|
|
connectWith: 'ul',
|
||
|
|
placeholder: 'sortable_placeholder',
|
||
|
|
forcePlaceholderSize: true,
|
||
|
|
start: function (event, ui) {
|
||
|
|
$('#deal').addClass('open');
|
||
|
|
ui.item.off('click'); // Klick-Event entfernen
|
||
|
|
},
|
||
|
|
stop: function (event, ui) {
|
||
|
|
$('#deal').removeClass('open');
|
||
|
|
setTimeout(function () {
|
||
|
|
// Klick-Event nach kurzer Wartezeit wieder attachen; ansonsten führt Drag-n-Drop zu Klick
|
||
|
|
ui.item.on('click', function () {
|
||
|
|
var wiedervorlageId = $(this).data('id');
|
||
|
|
EditWiedervorlage(wiedervorlageId);
|
||
|
|
});
|
||
|
|
}, 250);
|
||
|
|
},
|
||
|
|
receive: function (event, ui) {
|
||
|
|
if ($(ui.item).hasClass('cancel-sorting')) {
|
||
|
|
return; // Sorting abbrechen: Item wurde auf "Gewinner" oder "Verlierer" abgelegt
|
||
|
|
}
|
||
|
|
setColumnsToSameHeight();
|
||
|
|
hideFirstColumnWhenEmpty();
|
||
|
|
WiedervorlagenMiniDetail.deactivateForCurrentItem();
|
||
|
|
|
||
|
|
$.ajax({
|
||
|
|
url: 'index.php?module=wiedervorlage&action=edit&cmd=move',
|
||
|
|
data: {
|
||
|
|
//Alle Felder die fürs editieren vorhanden sind
|
||
|
|
id: ui.item.data('id'),
|
||
|
|
stage: $(event.target).data('id'),
|
||
|
|
position: ui.item.index()
|
||
|
|
},
|
||
|
|
method: 'post',
|
||
|
|
dataType: 'json',
|
||
|
|
error: function (jqXhr) {
|
||
|
|
// Sortierung abbrechen > Wiedervorlage an Ursprung verschieben
|
||
|
|
$(ui.sender).sortable('cancel');
|
||
|
|
|
||
|
|
// Unbekannter Fehler; ErrorHandler wird vermutlich angezeigt
|
||
|
|
if (!jqXhr.hasOwnProperty('responseJSON')) {
|
||
|
|
alert('Fehler beim Verschieben der Wiedervorlage: Unbekannter Server-Fehler.');
|
||
|
|
return;
|
||
|
|
}
|
||
|
|
|
||
|
|
// Modal anzeigen; welche Items (Aufgaben/Freifelder) haben das Verschieben blockiert
|
||
|
|
if (jqXhr.responseJSON.hasOwnProperty('data') &&
|
||
|
|
jqXhr.responseJSON.data.hasOwnProperty('blocking')
|
||
|
|
) {
|
||
|
|
ResubmissionBlockingItemsModal.show(jqXhr.responseJSON.data);
|
||
|
|
return;
|
||
|
|
}
|
||
|
|
|
||
|
|
// Bekannter Fehler; Error-Property anzeigen
|
||
|
|
if (jqXhr.responseJSON.hasOwnProperty('error')) {
|
||
|
|
var alertMsg = '';
|
||
|
|
alertMsg += 'Fehler beim Verschieben der Wiedervorlage ID' + ui.item.data('id') + ': ';
|
||
|
|
alertMsg += jqXhr.responseJSON.error;
|
||
|
|
alert(alertMsg);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
});
|
||
|
|
}
|
||
|
|
}).disableSelection();
|
||
|
|
|
||
|
|
$('.droppable').droppable({
|
||
|
|
hoverClass: 'highlight',
|
||
|
|
tolerance: 'pointer',
|
||
|
|
drop: function (event, ui) {
|
||
|
|
if (this.id == '99') {
|
||
|
|
// Wir öffnen den Gewinner Dialog
|
||
|
|
$('#editWinnerLoser #editwinnerloserwiedervorlagestageid').val(ui.draggable.data('id'));
|
||
|
|
$('#editWinnerLoser #editwinnerlosertype').val('gewonnen');
|
||
|
|
$('#editWinnerLoser').dialog('option', 'title', 'Gewinner');
|
||
|
|
$('#editWinnerLoser').dialog('option', 'width', '600');
|
||
|
|
$('#editWinnerLoser').dialog('open');
|
||
|
|
$(ui.draggable).addClass('cancel-sorting');
|
||
|
|
|
||
|
|
} else if (this.id == '100') {
|
||
|
|
// Wir öffnen den Verlierer Dialog
|
||
|
|
$('#editWinnerLoser #editwinnerloserwiedervorlagestageid').val(ui.draggable.data('id'));
|
||
|
|
$('#editWinnerLoser #editwinnerlosertype').val('verloren');
|
||
|
|
$('#editWinnerLoser').dialog('option', 'title', 'Verlierer');
|
||
|
|
$('#editWinnerLoser').dialog('option', 'width', '600');
|
||
|
|
$('#editWinnerLoser').dialog('open');
|
||
|
|
$(ui.draggable).addClass('cancel-sorting');
|
||
|
|
|
||
|
|
} else if (this.id == '98') {
|
||
|
|
// Papierkorb
|
||
|
|
$(ui.draggable).addClass('cancel-sorting');
|
||
|
|
$.ajax({
|
||
|
|
url: 'index.php?module=wiedervorlage&action=edit&cmd=delete',
|
||
|
|
data: {
|
||
|
|
id: ui.draggable.data('id'),
|
||
|
|
},
|
||
|
|
method: 'post',
|
||
|
|
dataType: 'json',
|
||
|
|
});
|
||
|
|
ui.draggable.remove();
|
||
|
|
}
|
||
|
|
}
|
||
|
|
});
|
||
|
|
|
||
|
|
$("#editWinnerLoser").dialog({
|
||
|
|
modal: true,
|
||
|
|
bgiframe: true,
|
||
|
|
minWidth: 420,
|
||
|
|
autoOpen: false,
|
||
|
|
closeOnEscape: false,
|
||
|
|
open: function (event, ui) {
|
||
|
|
$(".ui-dialog-titlebar-close").hide();
|
||
|
|
},
|
||
|
|
buttons: {
|
||
|
|
ABBRECHEN: function () {
|
||
|
|
// wir laden neu, damit der Item wieder in die richtige Pipe kommt
|
||
|
|
window.location.reload();
|
||
|
|
},
|
||
|
|
SPEICHERN: function () {
|
||
|
|
if ($("#editWinnerLoser textarea").val() == '') {
|
||
|
|
$("#editWinnerLoser h4#error").html('Das Kommentarfeld darf nicht leer sein');
|
||
|
|
} else {
|
||
|
|
WiedervorlageLeadClose();
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
});
|
||
|
|
|
||
|
|
// Seite neuladen, wenn Filter verändert wird
|
||
|
|
var $pipeFilter = $('.filter-item input');
|
||
|
|
$pipeFilter.change(function () {
|
||
|
|
window.setTimeout(function () {
|
||
|
|
window.location.reload();
|
||
|
|
}, 250);
|
||
|
|
});
|
||
|
|
});
|
||
|
|
|
||
|
|
function WiedervorlageLeadClose() {
|
||
|
|
$.ajax({
|
||
|
|
url: 'index.php?module=wiedervorlage&action=abschliessen',
|
||
|
|
data: {
|
||
|
|
//Alle Felder die fürs editieren vorhanden sind
|
||
|
|
id: $("#editWinnerLoser #editwinnerloserwiedervorlagestageid").val(),
|
||
|
|
type: $("#editWinnerLoser #editwinnerlosertype").val(),
|
||
|
|
timelinekommentar: $("#editWinnerLoser textarea").val(),
|
||
|
|
jsonresponse: 'true'
|
||
|
|
},
|
||
|
|
method: 'post',
|
||
|
|
dataType: 'json',
|
||
|
|
success: function (data) {
|
||
|
|
window.location.reload();
|
||
|
|
}
|
||
|
|
});
|
||
|
|
}
|
||
|
|
|
||
|
|
// Setzt alle Stages auf die gleiche Höhe
|
||
|
|
function setColumnsToSameHeight() {
|
||
|
|
var maxColumnHeight = 0;
|
||
|
|
|
||
|
|
$('.same_height').each(function () {
|
||
|
|
var columnHeight = 40; // Heading
|
||
|
|
$(this).children().each(function () {
|
||
|
|
columnHeight += $(this).outerHeight();
|
||
|
|
columnHeight += 5; // Margin
|
||
|
|
});
|
||
|
|
columnHeight += 40; // Placeholder
|
||
|
|
|
||
|
|
if (columnHeight > maxColumnHeight) {
|
||
|
|
maxColumnHeight = columnHeight;
|
||
|
|
}
|
||
|
|
});
|
||
|
|
|
||
|
|
$('.same_height').height(maxColumnHeight);
|
||
|
|
}
|
||
|
|
|
||
|
|
// Spalte "Ohne Stage" ausblenden, wenn keine Wiedervorlagen enthalten
|
||
|
|
function hideFirstColumnWhenEmpty() {
|
||
|
|
$firstColumn = $('#sortable_column_0');
|
||
|
|
if ($firstColumn.find('li').length === 0) {
|
||
|
|
$firstColumn.hide();
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
</script>
|
||
|
|
|
||
|
|
[WIEDERVORLAGEPOPUP]
|
||
|
|
|
||
|
|
<div id="tabs">
|
||
|
|
<ul>
|
||
|
|
<li><a href="#tabs-1"><!--[TABTEXT]--></a></li>
|
||
|
|
</ul>
|
||
|
|
<!-- ende gehort zu tabview -->
|
||
|
|
|
||
|
|
<!-- erstes tab -->
|
||
|
|
<div id="tabs-1">
|
||
|
|
|
||
|
|
<div class="rTabs">
|
||
|
|
<ul>
|
||
|
|
<li><a href="index.php?module=wiedervorlage&action=dashboard&mitarbeiter=[MITARBEITER]">{|Dashboard|}</a></li>
|
||
|
|
<li class="aktiv"><a href="index.php?module=wiedervorlage&action=pipes&mitarbeiter=[MITARBEITER]">{|Pipelines|}</a></li>
|
||
|
|
<li><a href="index.php?module=wiedervorlage&action=table&mitarbeiter=[MITARBEITER]">{|Liste|}</a></li>
|
||
|
|
<li><a href="index.php?module=wiedervorlage&action=creationdate&mitarbeiter=[MITARBEITER]">{|Eingangsdatum|}</a></li>
|
||
|
|
<li><a href="index.php?module=wiedervorlage&action=closingdate&mitarbeiter=[MITARBEITER]">{|Abschlussdatum|}</a></li>
|
||
|
|
<li><a href="index.php?module=wiedervorlage&action=winsloses&mitarbeiter=[MITARBEITER]">{|Wins/Losses|}</a></li>
|
||
|
|
<li><a href="index.php?module=wiedervorlage&action=calendar&mitarbeiter=[MITARBEITER]">{|Kalender|}</a></li>
|
||
|
|
</ul>
|
||
|
|
<div class="rTabSelect">[ANSICHTSELECT] [MITARBEITERSELECT]</div>
|
||
|
|
<div class="clear"></div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<fieldset>
|
||
|
|
<legend>Filter</legend>
|
||
|
|
<div class="clear"></div>
|
||
|
|
<div class="filter-item">
|
||
|
|
<label class="switch">
|
||
|
|
<input type="checkbox" id="prio" name="prio" value="1" [FILTERPRIOCHECKED]>
|
||
|
|
<span class="slider round"></span>
|
||
|
|
Prio
|
||
|
|
</label>
|
||
|
|
</div>
|
||
|
|
<div class="filter-item">
|
||
|
|
<label class="switch">
|
||
|
|
<input type="checkbox" id="faellige" name="faellige" value="1" [FILTERFAELLIGECHECKED]>
|
||
|
|
<span class="slider round"></span>
|
||
|
|
fällige
|
||
|
|
</label>
|
||
|
|
</div>
|
||
|
|
[VORMEINE]
|
||
|
|
<div class="filter-item">
|
||
|
|
<label class="switch">
|
||
|
|
<input type="checkbox" id="meine" name="meine" value="1" [FILTERMEINECHECKED]>
|
||
|
|
<span class="slider round"></span>
|
||
|
|
meine
|
||
|
|
</label>
|
||
|
|
</div>
|
||
|
|
<div class="filter-item">
|
||
|
|
<label class="switch">
|
||
|
|
<input type="checkbox" id="nur_meine_vergebenen" name="nur_meine_vergebenen" value="1" [FILTERNURMEINEVERGEBENENCHECKED]>
|
||
|
|
<span class="slider round"></span>
|
||
|
|
nur meine vergebenen
|
||
|
|
</label>
|
||
|
|
</div>
|
||
|
|
[NACHMEINE]
|
||
|
|
<div class="filter-item">
|
||
|
|
<label class="switch">
|
||
|
|
<input type="checkbox" id="abgeschlossen" name="abgeschlossen" value="1" [FILTERABGESCHLOSSENCHECKED]>
|
||
|
|
<span class="slider round"></span>
|
||
|
|
mit abgeschlossene
|
||
|
|
</label>
|
||
|
|
</div>
|
||
|
|
</fieldset>
|
||
|
|
|
||
|
|
<div id="datacontent" class="row">
|
||
|
|
[TAB1]
|
||
|
|
[TAB1NEXT]
|
||
|
|
<div id="scroll-wrapper">
|
||
|
|
<div id="scroll-area" class="clearfix">
|
||
|
|
[PIPES]
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<!-- tab view schließen -->
|
||
|
|
|
||
|
|
<div id="editWinnerLoser" style="display:none;" title="Bearbeiten">
|
||
|
|
<input type="hidden" id="editwinnerloserwiedervorlagestageid" value="">
|
||
|
|
<input type="hidden" id="editwinnerlosertype" value="">
|
||
|
|
<h4 id="error"></h4>
|
||
|
|
<table>
|
||
|
|
<tr>
|
||
|
|
<td><textarea id="editWinnerLoserkommentar" name="kommentar" cols="50"></textarea></td>
|
||
|
|
</tr>
|
||
|
|
</table>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div id="deal">
|
||
|
|
<div id="deal-inner">
|
||
|
|
<div class="droppable-container">
|
||
|
|
<div id="98" class="droppable papierkorb">Papierkorb</div>
|
||
|
|
</div>
|
||
|
|
<div class="droppable-container">
|
||
|
|
<div id="99" class="droppable gewinner">Gewinner</div>
|
||
|
|
</div>
|
||
|
|
<div class="droppable-container">
|
||
|
|
<div id="100" class="droppable verlierer">Verlierer</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|