mirror of https://github.com/gophish/gophish
Load datatable rows all at once (#1830)
This change modifies how we populate DataTables to draw the table only once vs. drawing it when we add each new row. This should result in tables loading quicker.pull/1831/head
Prasoon Dwivedi
GitHub
parent
38a6a77c9c
commit
116c2a7e7e
|
|
@ -360,6 +360,7 @@ $(document).ready(function () {
|
|||
[1, "desc"]
|
||||
]
|
||||
});
|
||||
campaignRows = []
|
||||
$.each(campaigns, function (i, campaign) {
|
||||
campaignTable = campaignTableOriginal
|
||||
if (campaign.status === "Completed") {
|
||||
|
|
@ -378,7 +379,7 @@ $(document).ready(function () {
|
|||
var quickStats = launchDate + "<br><br>" + "Number of recipients: " + campaign.stats.total + "<br><br>" + "Emails opened: " + campaign.stats.opened + "<br><br>" + "Emails clicked: " + campaign.stats.clicked + "<br><br>" + "Submitted Credentials: " + campaign.stats.submitted_data + "<br><br>" + "Errors : " + campaign.stats.error + "Reported : " + campaign.stats.reported
|
||||
}
|
||||
|
||||
campaignTable.row.add([
|
||||
campaignRows.push([
|
||||
escapeHtml(campaign.name),
|
||||
moment(campaign.created_date).format('MMMM Do YYYY, h:mm:ss a'),
|
||||
"<span class=\"label " + label + "\" data-toggle=\"tooltip\" data-placement=\"right\" data-html=\"true\" title=\"" + quickStats + "\">" + campaign.status + "</span>",
|
||||
|
|
@ -391,9 +392,10 @@ $(document).ready(function () {
|
|||
<button class='btn btn-danger' onclick='deleteCampaign(" + i + ")' data-toggle='tooltip' data-placement='left' title='Delete Campaign'>\
|
||||
<i class='fa fa-trash-o'></i>\
|
||||
</button></div>"
|
||||
]).draw()
|
||||
])
|
||||
$('[data-toggle="tooltip"]').tooltip()
|
||||
})
|
||||
campaignTable.rows.add(campaignRows).draw()
|
||||
} else {
|
||||
$("#emptyMessage").show()
|
||||
}
|
||||
|
|
|
|||
|
|
@ -326,6 +326,7 @@ $(document).ready(function () {
|
|||
[1, "desc"]
|
||||
]
|
||||
});
|
||||
campaignRows = []
|
||||
$.each(campaigns, function (i, campaign) {
|
||||
var campaign_date = moment(campaign.created_date).format('MMMM Do YYYY, h:mm:ss a')
|
||||
var label = statuses[campaign.status].label || "label-default";
|
||||
|
|
@ -338,8 +339,8 @@ $(document).ready(function () {
|
|||
launchDate = "Launch Date: " + moment(campaign.launch_date).format('MMMM Do YYYY, h:mm:ss a')
|
||||
var quickStats = launchDate + "<br><br>" + "Number of recipients: " + campaign.stats.total + "<br><br>" + "Emails opened: " + campaign.stats.opened + "<br><br>" + "Emails clicked: " + campaign.stats.clicked + "<br><br>" + "Submitted Credentials: " + campaign.stats.submitted_data + "<br><br>" + "Errors : " + campaign.stats.error + "<br><br>" + "Reported : " + campaign.stats.email_reported
|
||||
}
|
||||
// Add it to the table
|
||||
campaignTable.row.add([
|
||||
// Add it to the list
|
||||
campaignRows.push([
|
||||
escapeHtml(campaign.name),
|
||||
campaign_date,
|
||||
campaign.stats.sent,
|
||||
|
|
@ -354,9 +355,10 @@ $(document).ready(function () {
|
|||
<button class='btn btn-danger' onclick='deleteCampaign(" + i + ")' data-toggle='tooltip' data-placement='left' title='Delete Campaign'>\
|
||||
<i class='fa fa-trash-o'></i>\
|
||||
</button></div>"
|
||||
]).draw()
|
||||
])
|
||||
$('[data-toggle="tooltip"]').tooltip()
|
||||
})
|
||||
campaignTable.rows.add(campaignRows).draw()
|
||||
// Build the charts
|
||||
generateStatsPieCharts(campaigns)
|
||||
generateTimelineChart(campaigns)
|
||||
|
|
|
|||
|
|
@ -69,17 +69,17 @@ function edit(id) {
|
|||
api.groupId.get(id)
|
||||
.success(function (group) {
|
||||
$("#name").val(group.name)
|
||||
targetRows = []
|
||||
$.each(group.targets, function (i, record) {
|
||||
targets.DataTable()
|
||||
.row.add([
|
||||
escapeHtml(record.first_name),
|
||||
escapeHtml(record.last_name),
|
||||
escapeHtml(record.email),
|
||||
escapeHtml(record.position),
|
||||
'<span style="cursor:pointer;"><i class="fa fa-trash-o"></i></span>'
|
||||
]).draw()
|
||||
targetRows.push([
|
||||
escapeHtml(record.first_name),
|
||||
escapeHtml(record.last_name),
|
||||
escapeHtml(record.email),
|
||||
escapeHtml(record.position),
|
||||
'<span style="cursor:pointer;"><i class="fa fa-trash-o"></i></span>'
|
||||
])
|
||||
});
|
||||
|
||||
targets.DataTable().rows.add(targetRows).draw()
|
||||
})
|
||||
.error(function () {
|
||||
errorFlash("Error fetching group")
|
||||
|
|
@ -233,8 +233,9 @@ function load() {
|
|||
}]
|
||||
});
|
||||
groupTable.clear();
|
||||
groupRows = []
|
||||
$.each(groups, function (i, group) {
|
||||
groupTable.row.add([
|
||||
groupRows.push([
|
||||
escapeHtml(group.name),
|
||||
escapeHtml(group.num_targets),
|
||||
moment(group.modified_date).format('MMMM Do YYYY, h:mm:ss a'),
|
||||
|
|
@ -244,8 +245,9 @@ function load() {
|
|||
<button class='btn btn-danger' onclick='deleteGroup(" + group.id + ")'>\
|
||||
<i class='fa fa-trash-o'></i>\
|
||||
</button></div>"
|
||||
]).draw()
|
||||
])
|
||||
})
|
||||
groupTable.rows.add(groupRows).draw()
|
||||
} else {
|
||||
$("#emptyMessage").show()
|
||||
}
|
||||
|
|
|
|||
|
|
@ -157,8 +157,9 @@ function load() {
|
|||
}]
|
||||
});
|
||||
pagesTable.clear()
|
||||
pageRows = []
|
||||
$.each(pages, function (i, page) {
|
||||
pagesTable.row.add([
|
||||
pageRows.push([
|
||||
escapeHtml(page.name),
|
||||
moment(page.modified_date).format('MMMM Do YYYY, h:mm:ss a'),
|
||||
"<div class='pull-right'><span data-toggle='modal' data-backdrop='static' data-target='#modal'><button class='btn btn-primary' data-toggle='tooltip' data-placement='left' title='Edit Page' onclick='edit(" + i + ")'>\
|
||||
|
|
@ -170,8 +171,9 @@ function load() {
|
|||
<button class='btn btn-danger' data-toggle='tooltip' data-placement='left' title='Delete Page' onclick='deletePage(" + i + ")'>\
|
||||
<i class='fa fa-trash-o'></i>\
|
||||
</button></div>"
|
||||
]).draw()
|
||||
])
|
||||
})
|
||||
pagesTable.rows.add(pageRows).draw()
|
||||
$('[data-toggle="tooltip"]').tooltip()
|
||||
} else {
|
||||
$("#emptyMessage").show()
|
||||
|
|
|
|||
|
|
@ -200,8 +200,9 @@ function load() {
|
|||
}]
|
||||
});
|
||||
profileTable.clear()
|
||||
profileRows = []
|
||||
$.each(profiles, function (i, profile) {
|
||||
profileTable.row.add([
|
||||
profileRows.push([
|
||||
escapeHtml(profile.name),
|
||||
profile.interface_type,
|
||||
moment(profile.modified_date).format('MMMM Do YYYY, h:mm:ss a'),
|
||||
|
|
@ -214,8 +215,9 @@ function load() {
|
|||
<button class='btn btn-danger' data-toggle='tooltip' data-placement='left' title='Delete Profile' onclick='deleteProfile(" + i + ")'>\
|
||||
<i class='fa fa-trash-o'></i>\
|
||||
</button></div>"
|
||||
]).draw()
|
||||
])
|
||||
})
|
||||
profileTable.rows.add(profileRows).draw()
|
||||
$('[data-toggle="tooltip"]').tooltip()
|
||||
} else {
|
||||
$("#emptyMessage").show()
|
||||
|
|
|
|||
|
|
@ -191,17 +191,19 @@ function edit(idx) {
|
|||
$("#subject").val(template.subject)
|
||||
$("#html_editor").val(template.html)
|
||||
$("#text_editor").val(template.text)
|
||||
attachmentRows = []
|
||||
$.each(template.attachments, function (i, file) {
|
||||
var icon = icons[file.type] || "fa-file-o"
|
||||
// Add the record to the modal
|
||||
attachmentsTable.row.add([
|
||||
attachmentRows.push([
|
||||
'<i class="fa ' + icon + '"></i>',
|
||||
escapeHtml(file.name),
|
||||
'<span class="remove-row"><i class="fa fa-trash-o"></i></span>',
|
||||
file.content,
|
||||
file.type || "application/octet-stream"
|
||||
]).draw()
|
||||
])
|
||||
})
|
||||
attachmentsTable.rows.add(attachmentRows).draw()
|
||||
if (template.html.indexOf("{{.Tracker}}") != -1) {
|
||||
$("#use_tracker_checkbox").prop("checked", true)
|
||||
} else {
|
||||
|
|
@ -316,8 +318,9 @@ function load() {
|
|||
}]
|
||||
});
|
||||
templateTable.clear()
|
||||
templateRows = []
|
||||
$.each(templates, function (i, template) {
|
||||
templateTable.row.add([
|
||||
templateRows.push([
|
||||
escapeHtml(template.name),
|
||||
moment(template.modified_date).format('MMMM Do YYYY, h:mm:ss a'),
|
||||
"<div class='pull-right'><span data-toggle='modal' data-backdrop='static' data-target='#modal'><button class='btn btn-primary' data-toggle='tooltip' data-placement='left' title='Edit Template' onclick='edit(" + i + ")'>\
|
||||
|
|
@ -329,8 +332,9 @@ function load() {
|
|||
<button class='btn btn-danger' data-toggle='tooltip' data-placement='left' title='Delete Template' onclick='deleteTemplate(" + i + ")'>\
|
||||
<i class='fa fa-trash-o'></i>\
|
||||
</button></div>"
|
||||
]).draw()
|
||||
])
|
||||
})
|
||||
templateTable.rows.add(templateRows).draw()
|
||||
$('[data-toggle="tooltip"]').tooltip()
|
||||
} else {
|
||||
$("#emptyMessage").show()
|
||||
|
|
|
|||
|
|
@ -181,8 +181,9 @@ const load = () => {
|
|||
}]
|
||||
});
|
||||
userTable.clear();
|
||||
userRows = []
|
||||
$.each(users, (i, user) => {
|
||||
userTable.row.add([
|
||||
userRows.push([
|
||||
escapeHtml(user.username),
|
||||
escapeHtml(user.role.name),
|
||||
"<div class='pull-right'>\
|
||||
|
|
@ -195,8 +196,9 @@ const load = () => {
|
|||
<button class='btn btn-danger delete_button' data-user-id='" + user.id + "'>\
|
||||
<i class='fa fa-trash-o'></i>\
|
||||
</button></div>"
|
||||
]).draw()
|
||||
])
|
||||
})
|
||||
userTable.rows.add(userRows).draw();
|
||||
})
|
||||
.error(() => {
|
||||
errorFlash("Error fetching users")
|
||||
|
|
|
|||
Loading…
Reference in New Issue