490 lines
19 KiB
TypeScript
490 lines
19 KiB
TypeScript
import $ from 'jquery';
|
|
import { AJAX } from '../modules/ajax.ts';
|
|
import { checkReservedWordColumns, checkTableEditForm, prepareForAjaxRequest } from '../modules/functions.ts';
|
|
import { Navigation } from '../modules/navigation.ts';
|
|
import { CommonParams } from '../modules/common.ts';
|
|
import highlightSql from '../modules/sql-highlight.ts';
|
|
import { ajaxRemoveMessage, ajaxShowMessage } from '../modules/ajax-message.ts';
|
|
import { Indexes } from '../modules/indexes.ts';
|
|
import getJsConfirmCommonParam from '../modules/functions/getJsConfirmCommonParam.ts';
|
|
import { escapeHtml, escapeJsString } from '../modules/functions/escape.ts';
|
|
import refreshMainContent from '../modules/functions/refreshMainContent.ts';
|
|
|
|
/**
|
|
* @fileoverview functions used on the table structure page
|
|
* @name Table Structure
|
|
*
|
|
* @requires jQueryUI
|
|
*/
|
|
|
|
/**
|
|
* AJAX scripts for /table/structure
|
|
*
|
|
* Actions ajaxified here:
|
|
* Drop Column
|
|
* Add Primary Key
|
|
* Drop Primary Key/Index
|
|
*
|
|
*/
|
|
|
|
/**
|
|
* Reload fields table
|
|
*/
|
|
function reloadFieldForm () {
|
|
$.post($('#fieldsForm').attr('action'), $('#fieldsForm').serialize() + CommonParams.get('arg_separator') + 'ajax_request=true', function (formData) {
|
|
var $tempDiv = $('<div id=\'temp_div\'><div>').append(formData.message);
|
|
$('#fieldsForm').replaceWith($tempDiv.find('#fieldsForm'));
|
|
$('#addColumns').replaceWith($tempDiv.find('#addColumns'));
|
|
$('#move_columns_dialog').find('ul').replaceWith($tempDiv.find('#move_columns_dialog ul'));
|
|
});
|
|
|
|
$('#page_content').show();
|
|
}
|
|
|
|
function checkFirst () {
|
|
if ($('select[name=after_field] option:selected').data('pos') === 'first') {
|
|
$('input[name=field_where]').val('first');
|
|
} else {
|
|
$('input[name=field_where]').val('after');
|
|
}
|
|
}
|
|
|
|
/**
|
|
* Unbind all event handlers before tearing down a page
|
|
*/
|
|
AJAX.registerTeardown('table/structure.js', function () {
|
|
$(document).off('click', 'a.drop_column_anchor.ajax');
|
|
$(document).off('click', 'a.add_key.ajax');
|
|
$(document).off('click', '#move_columns_anchor');
|
|
$(document).off('submit', '.append_fields_form.ajax');
|
|
$('body').off('click', '#fieldsForm button.mult_submit');
|
|
$(document).off('click', 'a[id^=partition_action].ajax');
|
|
$(document).off('click', '#remove_partitioning.ajax');
|
|
});
|
|
|
|
AJAX.registerOnload('table/structure.js', function () {
|
|
Indexes.resetColumnLists();
|
|
|
|
/**
|
|
*Ajax action for submitting the "Column Change" and "Add Column" form
|
|
*/
|
|
$('.append_fields_form.ajax').off();
|
|
$(document).on('submit', '.append_fields_form.ajax', function (event) {
|
|
event.preventDefault();
|
|
/**
|
|
* @var form object referring to the export form
|
|
*/
|
|
var $form = $(this);
|
|
var fieldCnt = Number($form.find('input[name=orig_num_fields]').val());
|
|
|
|
function submitForm () {
|
|
var $msg = ajaxShowMessage(window.Messages.strProcessingRequest);
|
|
$.post($form.attr('action'), $form.serialize() + CommonParams.get('arg_separator') + 'do_save_data=1', function (data) {
|
|
if ($('.sqlqueryresults').length !== 0) {
|
|
$('.sqlqueryresults').remove();
|
|
} else if ($('.error:not(.tab)').length !== 0) {
|
|
$('.error:not(.tab)').remove();
|
|
}
|
|
|
|
if (typeof data.success !== 'undefined' && data.success === true) {
|
|
$('#page_content')
|
|
.empty()
|
|
.append(data.message)
|
|
.show();
|
|
|
|
highlightSql($('#page_content'));
|
|
$('.result_query .alert-primary').remove();
|
|
if (typeof data.structure_refresh_route !== 'string') {
|
|
// Do not reload the form when the code below freshly filled it
|
|
reloadFieldForm();
|
|
}
|
|
|
|
$form.remove();
|
|
ajaxRemoveMessage($msg);
|
|
Navigation.reload();
|
|
if (typeof data.structure_refresh_route === 'string') {
|
|
// Fetch the table structure right after adding a new column
|
|
$.get(data.structure_refresh_route, function (data) {
|
|
if (typeof data.success !== 'undefined' && data.success === true) {
|
|
$('#page_content').append(data.message).show();
|
|
}
|
|
});
|
|
} else {
|
|
refreshMainContent('index.php?route=/table/structure');
|
|
}
|
|
} else {
|
|
ajaxShowMessage(data.error, false);
|
|
}
|
|
}); // end $.post()
|
|
}
|
|
|
|
function checkIfConfirmRequired ($form) {
|
|
var i = 0;
|
|
var id;
|
|
var elm;
|
|
var val;
|
|
var nameOrig;
|
|
var elmOrig;
|
|
var valOrig;
|
|
var checkRequired = false;
|
|
for (i = 0; i < fieldCnt; i++) {
|
|
id = '#field_' + i + '_5';
|
|
elm = $(id);
|
|
val = elm.val();
|
|
|
|
nameOrig = 'input[name=field_collation_orig\\[' + i + '\\]]';
|
|
elmOrig = $form.find(nameOrig);
|
|
valOrig = elmOrig.val();
|
|
|
|
if (val && valOrig && val !== valOrig) {
|
|
checkRequired = true;
|
|
break;
|
|
}
|
|
}
|
|
|
|
return checkRequired;
|
|
}
|
|
|
|
/*
|
|
* First validate the form; if there is a problem, avoid submitting it
|
|
*
|
|
* checkTableEditForm() needs a pure element and not a jQuery object,
|
|
* this is why we pass $form[0] as a parameter (the jQuery object
|
|
* is actually an array of DOM elements)
|
|
*/
|
|
if (checkTableEditForm($form[0], fieldCnt)) {
|
|
// OK, form passed validation step
|
|
|
|
prepareForAjaxRequest($form);
|
|
if (checkReservedWordColumns($form)) {
|
|
// User wants to submit the form
|
|
|
|
// If Collation is changed, Warn and Confirm
|
|
if (checkIfConfirmRequired($form)) {
|
|
var question = window.sprintf(
|
|
window.Messages.strChangeColumnCollation, 'https://wiki.phpmyadmin.net/pma/Garbled_data'
|
|
);
|
|
$form.confirm(question, $form.attr('action'), function () {
|
|
submitForm();
|
|
});
|
|
} else {
|
|
submitForm();
|
|
}
|
|
}
|
|
}
|
|
}); // end change table button "do_save_data"
|
|
|
|
/**
|
|
* Attach Event Handler for 'Drop Column'
|
|
*/
|
|
$(document).on('click', 'a.drop_column_anchor.ajax', function (event) {
|
|
event.preventDefault();
|
|
/**
|
|
* @var currTableName String containing the name of the current table
|
|
*/
|
|
var currTableName = $(this).closest('form').find('input[name=table]').val();
|
|
/**
|
|
* @var currRow Object reference to the currently selected row (i.e. field in the table)
|
|
*/
|
|
var $currRow = $(this).parents('tr');
|
|
/**
|
|
* @var currColumnName String containing name of the field referred to by {@link curr_row}
|
|
*/
|
|
var currColumnName = $currRow.children('th').children('label').text().trim();
|
|
currColumnName = escapeJsString(escapeHtml(currColumnName));
|
|
|
|
/**
|
|
* @var $afterFieldItem Corresponding entry in the 'After' field.
|
|
*/
|
|
var $afterFieldItem = $('select[name=\'after_field\'] option[value=\'' + currColumnName + '\']');
|
|
/**
|
|
* @var question String containing the question to be asked for confirmation
|
|
*/
|
|
var question = window.sprintf(window.Messages.strDoYouReally, 'ALTER TABLE `' + currTableName + '` DROP `' + currColumnName + '`;');
|
|
var $thisAnchor = $(this);
|
|
$thisAnchor.confirm(question, $thisAnchor.attr('href'), function (url) {
|
|
var $msg = ajaxShowMessage(window.Messages.strDroppingColumn, false);
|
|
var params = getJsConfirmCommonParam(this, $thisAnchor.getPostData());
|
|
params += CommonParams.get('arg_separator') + 'ajax_page_request=1';
|
|
$.post(url, params, function (data) {
|
|
if (typeof data !== 'undefined' && data.success === true) {
|
|
ajaxRemoveMessage($msg);
|
|
if ($('.result_query').length) {
|
|
$('.result_query').remove();
|
|
}
|
|
|
|
if (data.sql_query) {
|
|
$('<div class="result_query"></div>')
|
|
.html(data.sql_query)
|
|
.prependTo('#structure_content');
|
|
|
|
highlightSql($('#page_content'));
|
|
}
|
|
|
|
// Adjust the row numbers
|
|
for (var $row = $currRow.next(); $row.length > 0; $row = $row.next()) {
|
|
var newVal = parseInt($row.find('td').eq(1).text(), 10) - 1;
|
|
$row.find('td').eq(1).text(newVal);
|
|
}
|
|
|
|
$afterFieldItem.remove();
|
|
$currRow.hide('medium').remove();
|
|
|
|
// Remove the dropped column from select menu for 'after field'
|
|
$('select[name=after_field]').find(
|
|
'[value="' + currColumnName + '"]'
|
|
).remove();
|
|
|
|
// by default select the (new) last option to add new column
|
|
// (in case last column is dropped)
|
|
$('select[name=after_field] option').last().attr('selected', 'selected');
|
|
|
|
// refresh table stats
|
|
if (data.tableStat) {
|
|
$('#tablestatistics').html(data.tableStat);
|
|
}
|
|
|
|
// refresh the list of indexes (comes from /sql)
|
|
$('.index_info').replaceWith(data.indexes_list);
|
|
Navigation.reload();
|
|
} else {
|
|
ajaxShowMessage(window.Messages.strErrorProcessingRequest + ' : ' + data.error, false);
|
|
}
|
|
}); // end $.post()
|
|
});
|
|
}); // end of Drop Column Anchor action
|
|
|
|
/**
|
|
* Ajax Event handler for adding keys
|
|
*/
|
|
$(document).on('click', 'a.add_key.ajax', function (event) {
|
|
event.preventDefault();
|
|
|
|
var $this = $(this);
|
|
var currTableName = ($this.closest('form').find('input[name=table]').val() as string);
|
|
var currColumnName = $this.parents('tr').children('th').children('label').text().trim();
|
|
|
|
var addClause = '';
|
|
if ($this.is('.add_primary_key_anchor')) {
|
|
addClause = 'ADD PRIMARY KEY';
|
|
} else if ($this.is('.add_index_anchor')) {
|
|
addClause = 'ADD INDEX';
|
|
} else if ($this.is('.add_unique_anchor')) {
|
|
addClause = 'ADD UNIQUE';
|
|
} else if ($this.is('.add_spatial_anchor')) {
|
|
addClause = 'ADD SPATIAL';
|
|
} else if ($this.is('.add_fulltext_anchor')) {
|
|
addClause = 'ADD FULLTEXT';
|
|
}
|
|
|
|
var question = window.sprintf(window.Messages.strDoYouReally, 'ALTER TABLE `' +
|
|
escapeHtml(currTableName) + '` ' + addClause + '(`' + escapeHtml(currColumnName) + '`);');
|
|
|
|
var $thisAnchor = $(this);
|
|
|
|
$thisAnchor.confirm(question, $thisAnchor.attr('href'), function (url) {
|
|
ajaxShowMessage();
|
|
AJAX.source = $this;
|
|
|
|
var params = getJsConfirmCommonParam(this, $thisAnchor.getPostData());
|
|
params += CommonParams.get('arg_separator') + 'ajax_page_request=1';
|
|
$.post(url, params, AJAX.responseHandler);
|
|
});
|
|
}); // end Add key
|
|
|
|
/**
|
|
* Inline move columns
|
|
**/
|
|
$(document).on('click', '#move_columns_anchor', function (e) {
|
|
e.preventDefault();
|
|
|
|
var columns = [];
|
|
|
|
$('#tablestructure').find('tbody tr').each(function () {
|
|
var colName = ($(this).find('input:checkbox').eq(0).val() as string);
|
|
var hiddenInput = $('<input>')
|
|
.prop({
|
|
name: 'move_columns[]',
|
|
type: 'hidden'
|
|
})
|
|
.val(colName);
|
|
columns[columns.length] = $('<li></li>')
|
|
.addClass('placeholderDrag')
|
|
.text(colName)
|
|
.append(hiddenInput);
|
|
});
|
|
|
|
var colList = $('#move_columns_dialog').find('ul')
|
|
.find('li').remove().end();
|
|
for (var i in columns) {
|
|
colList.append(columns[i]);
|
|
}
|
|
|
|
colList.sortable({
|
|
axis: 'y',
|
|
containment: $('#move_columns_dialog').find('div'),
|
|
tolerance: 'pointer'
|
|
}).disableSelection();
|
|
|
|
var $form = $('#move_columns_dialog').find('form');
|
|
$form.data('serialized-unmoved', $form.serialize());
|
|
|
|
const designerModalPreviewModal = document.getElementById('designerModalPreviewModal');
|
|
designerModalPreviewModal.addEventListener('shown.bs.modal', () => {
|
|
const modalBody = designerModalPreviewModal.querySelector('.modal-body');
|
|
const $form = $('#move_column_form');
|
|
const serialized = $form.serialize();
|
|
if (serialized === $form.data('serialized-unmoved')) {
|
|
modalBody.innerHTML = '';
|
|
|
|
return;
|
|
}
|
|
|
|
const formUrl = $form.attr('action');
|
|
const sep = CommonParams.get('arg_separator');
|
|
const formData = serialized +
|
|
sep + 'preview_sql=1' +
|
|
sep + 'ajax_request=1';
|
|
$.post({
|
|
url: formUrl,
|
|
data: formData,
|
|
success: response => {
|
|
if (! response.success) {
|
|
modalBody.innerHTML = '<div class="alert alert-danger" role="alert">' + window.Messages.strErrorProcessingRequest + '</div>';
|
|
|
|
return;
|
|
}
|
|
|
|
modalBody.innerHTML = response.sql_data;
|
|
highlightSql($('#designerModalPreviewModal'));
|
|
},
|
|
error: () => {
|
|
modalBody.innerHTML = '<div class="alert alert-danger" role="alert">' + window.Messages.strErrorProcessingRequest + '</div>';
|
|
}
|
|
});
|
|
});
|
|
|
|
designerModalPreviewModal.addEventListener('hidden.bs.modal', () => {
|
|
designerModalPreviewModal.querySelector('.modal-body').innerHTML = '<div class="spinner-border" role="status">' +
|
|
'<span class="visually-hidden">' + window.Messages.strLoading + '</span></div>';
|
|
});
|
|
|
|
$('#moveColumnsModal').modal('show');
|
|
$('#designerModalGoButton').off('click');// Unregister previous modals
|
|
$('#designerModalGoButton').on('click', function () {
|
|
event.preventDefault();
|
|
var $msgbox = ajaxShowMessage();
|
|
var $this = $('#moveColumnsModal');
|
|
var $form = $this.find('form');
|
|
var serialized = $form.serialize();
|
|
// check if any columns were moved at all
|
|
$('#moveColumnsModal').modal('hide');
|
|
if (serialized === $form.data('serialized-unmoved')) {
|
|
ajaxRemoveMessage($msgbox);
|
|
|
|
return;
|
|
}
|
|
|
|
$.post($form.prop('action'), serialized + CommonParams.get('arg_separator') + 'ajax_request=true', function (data) {
|
|
if (data.success === false) {
|
|
ajaxRemoveMessage($msgbox);
|
|
var errorModal = $('#moveColumnsErrorModal');
|
|
errorModal.modal('show');
|
|
errorModal.find('.modal-body').first().html(data.error);
|
|
} else {
|
|
// sort the fields table
|
|
var $fieldsTable = $('table#tablestructure tbody');
|
|
// remove all existing rows and remember them
|
|
var $rows = $fieldsTable.find('tr').remove();
|
|
// loop through the correct order
|
|
for (var i in data.columns) {
|
|
var theColumn = data.columns[i];
|
|
var $theRow = $rows
|
|
.find('input:checkbox[value="' + escapeJsString(theColumn) + '"]')
|
|
.closest('tr');
|
|
// append the row for this column to the table
|
|
$fieldsTable.append($theRow);
|
|
}
|
|
|
|
var $firstrow = $fieldsTable.find('tr').eq(0);
|
|
// Adjust the row numbers and colors
|
|
for (var $row = $firstrow; $row.length > 0; $row = $row.next()) {
|
|
$row
|
|
.find('td').eq(1)
|
|
.text($row.index() + 1)
|
|
.end()
|
|
.removeClass('odd even')
|
|
.addClass($row.index() % 2 === 0 ? 'odd' : 'even');
|
|
}
|
|
|
|
ajaxShowMessage(data.message);
|
|
}
|
|
});
|
|
});
|
|
});
|
|
|
|
/**
|
|
* Handles multi submits in table structure page such as change, browse, drop, primary etc.
|
|
*/
|
|
$('body').on('click', '#fieldsForm button.mult_submit', function (e) {
|
|
e.preventDefault();
|
|
var $form = $(this).parents('form');
|
|
var argsep = CommonParams.get('arg_separator');
|
|
var submitData = $form.serialize() + argsep + 'ajax_request=true' + argsep + 'ajax_page_request=true';
|
|
|
|
ajaxShowMessage();
|
|
AJAX.source = $form;
|
|
|
|
$.post(this.formAction, submitData, AJAX.responseHandler);
|
|
});
|
|
|
|
/**
|
|
* Handles clicks on Action links in partition table
|
|
*/
|
|
$(document).on('click', 'a[id^=partition_action].ajax', function (e) {
|
|
e.preventDefault();
|
|
var $link = $(this);
|
|
|
|
function submitPartitionAction (url) {
|
|
var params = 'ajax_request=true&ajax_page_request=true&' + $link.getPostData();
|
|
ajaxShowMessage();
|
|
AJAX.source = $link;
|
|
$.post(url, params, AJAX.responseHandler);
|
|
}
|
|
|
|
if ($link.is('#partition_action_DROP')) {
|
|
$link.confirm(window.Messages.strDropPartitionWarning, $link.attr('href'), function (url) {
|
|
submitPartitionAction(url);
|
|
});
|
|
} else if ($link.is('#partition_action_TRUNCATE')) {
|
|
$link.confirm(window.Messages.strTruncatePartitionWarning, $link.attr('href'), function (url) {
|
|
submitPartitionAction(url);
|
|
});
|
|
} else {
|
|
submitPartitionAction($link.attr('href'));
|
|
}
|
|
});
|
|
|
|
/**
|
|
* Handles remove partitioning
|
|
*/
|
|
$(document).on('click', '#remove_partitioning.ajax', function (e) {
|
|
e.preventDefault();
|
|
var $link = $(this);
|
|
var question = window.Messages.strRemovePartitioningWarning;
|
|
$link.confirm(question, $link.attr('href'), function (url) {
|
|
var params = getJsConfirmCommonParam({
|
|
'ajax_request': true,
|
|
'ajax_page_request': true
|
|
}, $link.getPostData());
|
|
ajaxShowMessage();
|
|
AJAX.source = $link;
|
|
$.post(url, params, AJAX.responseHandler);
|
|
});
|
|
});
|
|
|
|
$(document).on('change', 'select[name=after_field]', function () {
|
|
checkFirst();
|
|
});
|
|
});
|
