thedevdojo / voyager

Voyager - The Missing Laravel Admin
https://voyager.devdojo.com
MIT License
11.79k stars 2.67k forks source link

Database Table Columns disappears #2450

Closed SHSharkar closed 5 years ago

SHSharkar commented 6 years ago

Description:

Suddenly without any editing anything, the Database Table Column and its contents disappear. Instead of showing the database column and its values, the field is showing source values.

I think something is coming from external and blocking to load the assets which are responsible to load the database table column contents.

I have checked the source code and the recent changes but could not find the issue.

Screenshot 1

Screenshot 2

Steps To Reproduce:

I don't know.

handiwijoyo commented 6 years ago

Did you override the views?

SHSharkar commented 6 years ago

@handiwijoyo ,

I did not change anything. Everything was origin copy of source code. none of the code structure was changed. It was working fine but for 2 days the database tables are gone and showing these codes.

fletch3555 commented 6 years ago

@shsbd, do you have any JS or other errors in your browser console?

SHSharkar commented 6 years ago

Screenshot

No Sir (@fletch3555), No errors shown at the console.

fletch3555 commented 6 years ago

Then I have absolutely no idea what's going on... It almost looks like you have invalid characters in your generated markup that is breaking everything.... Can you share the page source? (should be something like right click -> "view source", depending on your browser)

SHSharkar commented 6 years ago
<!DOCTYPE html>
<html lang="en">

<head>
    <title>Free VIP Slots - Free Online Gaming</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="csrf-token" content="GxMSO8uKdbkWCzTh6Gxlq3kkfp42OCNwzA40tSX3" />
    <link href="https://fonts.googleapis.com/css?family=Open+Sans:300,400,700" rel="stylesheet">
    <link rel="shortcut icon" href="http://fvs.aidns.org/vendor/tcg/voyager/assets/images/logo-icon.png" type="image/x-icon">
    <link rel="stylesheet" href="http://fvs.aidns.org/vendor/tcg/voyager/assets/css/app.css">
    <style type="text/css">
    .voyager .side-menu .navbar-header {
        background: #ec028d;
        border-color: #ec028d
    }

    .widget .btn-primary {
        border-color: #ec028d
    }

    .widget .btn-primary:focus,
    .widget .btn-primary:hover,
    .widget .btn-primary:active,
    .widget .btn-primary.active,
    .widget .btn-primary:active:focus {
        background: #ec028d
    }

    .voyager .breadcrumb a {
        color: #ec028d
    }
    </style>
</head>

<body class="voyager ">
    <div id="voyager-loader">
        <img src="http://fvs.aidns.org/storage/settings/December2017/lAha5M77ymtzSzch6gI5.png" alt="Voyager Loader"></div>
    <div class="app-container">
        <div class="fadetoblack visible-xs"></div>
        <div class="row content-container">
            <nav class="navbar navbar-default navbar-fixed-top navbar-top">
                <div class="container-fluid">
                    <div class="navbar-header">
                        <button class="hamburger btn-link">
                            <span class="hamburger-inner"></span>
                        </button>
                        <ol class="breadcrumb hidden-xs">
                            <li class="active">
                                <a href="http://fvs.aidns.org/backend"><i
                                        class="voyager-boat"></i> Dashboard</a></li>
                            <li>Database</li>
                            <li>Categories</li>
                            <li>Edit</li>
                        </ol>
                    </div>
                    <ul class="nav navbar-nav navbar-right">
                        <li class="dropdown profile">
                            <a href="#" class="dropdown-toggle text-right" data-toggle="dropdown" role="button" aria-expanded="false"><img
                                                src="http://fvs.aidns.org/storage/users/default.png" class="profile-img"> <span
                                                class="caret"></span></a>
                            <ul class="dropdown-menu dropdown-menu-animated">
                                <li class="profile-img">
                                    <img src="http://fvs.aidns.org/storage/users/default.png" class="profile-img">
                                    <div class="profile-body">
                                        <h5>Super Admin</h5>
                                        <h6>access@freevipslots.com</h6></div>
                                </li>
                                <li class="divider"></li>
                                <li class="class-full-of-rum">
                                    <a href="http://fvs.aidns.org/backend/profile">
                                                    <i
                                                    class="voyager-person"></i>
                                                    Profile
                                                </a></li>
                                <li>
                                    <a href="/" target="_blank">
                                                    <i
                                                    class="voyager-home"></i>
                                                    Home
                                                </a></li>
                                <li>
                                    <form action="http://fvs.aidns.org/backend/logout" method="POST">
                                        <input type="hidden" name="_token" value="GxMSO8uKdbkWCzTh6Gxlq3kkfp42OCNwzA40tSX3">
                                        <button type="submit" class="btn btn-danger btn-block">
                                            <i class="voyager-power"></i> Logout
                                        </button>
                                    </form>
                                </li>
                            </ul>
                        </li>
                    </ul>
                </div>
            </nav>
            <div class="side-menu sidebar-inverse">
                <nav class="navbar navbar-default" role="navigation">
                    <div class="side-menu-container">
                        <div class="navbar-header">
                            <a class="navbar-brand" href="http://fvs.aidns.org/backend">
                                <div class="logo-icon-container">
                                    <img src="http://fvs.aidns.org/storage/settings/December2017/erK8X4Oi674QuEaYtpQz.png" alt="Logo Icon"></div>
                                <div class="title">Free VIP Slots</div>
                            </a>
                        </div>
                        <div class="panel widget center bgimage" style="background-image:url(http://fvs.aidns.org/storage/settings/December2017/ZpRoPkAekZpi1Vt33IFN.jpg); background-size: cover; background-position: 0px;">
                            <div class="dimmer"></div>
                            <div class="panel-content">
                                <img src="http://fvs.aidns.org/storage/users/default.png" class="avatar" alt="Super Admin avatar">
                                <h4>Super Admin</h4>
                                <p>access@freevipslots.com</p><a href="http://fvs.aidns.org/backend/profile" class="btn btn-primary">Profile</a>
                                <div style="clear:both"></div>
                            </div>
                        </div>
                    </div>
                    <ul class="nav navbar-nav">
                        <li class="">
                            <a href="http://fvs.aidns.org/backend" target="_self">
                                                <span
                                                class="icon voyager-home"></span>
                                                <span
                                                class="title">Dashboard</span>
                                            </a></li>
                        <li class="">
                            <a href="http://fvs.aidns.org/backend/redirects" target="_self">
                                                <span
                                                class="icon voyager-external"></span>
                                                <span
                                                class="title">Redirects</span>
                                            </a></li>
                        <li class="">
                            <a href="http://fvs.aidns.org/backend/media" target="_self">
                                                <span
                                                class="icon voyager-images"></span>
                                                <span
                                                class="title">Media</span>
                                            </a></li>
                        <li class="">
                            <a href="http://fvs.aidns.org/backend/games" target="_self">
                                                <span
                                                class="icon voyager-controller"></span>
                                                <span
                                                class="title">Games</span>
                                            </a></li>
                        <li class="">
                            <a href="http://fvs.aidns.org/backend/game-categories" target="_self">
                                                <span
                                                class="icon voyager-categories"></span>
                                                <span
                                                class="title">Game Categories</span>
                                            </a></li>
                        <li class="">
                            <a href="http://fvs.aidns.org/backend/game-providers" target="_self">
                                                <span
                                                class="icon voyager-lab"></span>
                                                <span
                                                class="title">Game Providers</span>
                                            </a></li>
                        <li class="">
                            <a href="http://fvs.aidns.org/backend/game-ratings" target="_self">
                                                <span
                                                class="icon voyager-star-two"></span>
                                                <span
                                                class="title">Game Ratings</span>
                                            </a></li>
                        <li class="">
                            <a href="http://fvs.aidns.org/backend/operators" target="_self">
                                                <span
                                                class="icon voyager-params"></span>
                                                <span
                                                class="title">Operators</span>
                                            </a></li>
                        <li class="">
                            <a href="http://fvs.aidns.org/backend/posts" target="_self">
                                                <span
                                                class="icon voyager-news"></span>
                                                <span
                                                class="title">Posts</span>
                                            </a></li>
                        <li class="">
                            <a href="http://fvs.aidns.org/backend/pages" target="_self">
                                                <span
                                                class="icon voyager-file-text"></span>
                                                <span
                                                class="title">Pages</span>
                                            </a></li>
                        <li class="">
                            <a href="http://fvs.aidns.org/backend/categories" target="_self">
                                                <span
                                                class="icon voyager-categories"></span>
                                                <span
                                                class="title">Categories</span>
                                            </a></li>
                        <li class="dropdown">
                            <a href="#user-and-rules-dropdown-element" data-toggle="collapse" aria-expanded="false" target="_self">
                                                <span
                                                class="icon voyager-people"></span>
                                                <span
                                                class="title">User and Rules</span>
                                            </a>
                            <div id="user-and-rules-dropdown-element" class="panel-collapse collapse ">
                                <div class="panel-body">
                                    <ul class="nav navbar-nav">
                                        <li class="">
                                            <a href="http://fvs.aidns.org/backend/users" target="_self">
                                                            <span
                                                            class="icon voyager-person"></span>
                                                            <span
                                                            class="title">Users</span>
                                                        </a></li>
                                        <li class="">
                                            <a href="http://fvs.aidns.org/backend/roles" target="_self">
                                                            <span
                                                            class="icon voyager-lock"></span>
                                                            <span
                                                            class="title">Roles</span>
                                                        </a></li>
                                    </ul>
                                </div>
                            </div>
                        </li>
                        <li class="dropdown">
                            <a href="#tools-dropdown-element" data-toggle="collapse" aria-expanded="false" target="_self">
                                                            <span
                                                            class="icon voyager-tools"></span>
                                                            <span
                                                            class="title">Tools</span>
                                                        </a>
                            <div id="tools-dropdown-element" class="panel-collapse collapse ">
                                <div class="panel-body">
                                    <ul class="nav navbar-nav">
                                        <li class="">
                                            <a href="http://fvs.aidns.org/backend/menus" target="_self">
                                                                        <span
                                                                        class="icon voyager-list"></span>
                                                                        <span
                                                                        class="title">Menu Builder</span>
                                                                    </a></li>
                                        <li class="">
                                            <a href="http://fvs.aidns.org/backend/database" target="_self">
                                                                        <span
                                                                        class="icon voyager-data"></span>
                                                                        <span
                                                                        class="title">Database</span>
                                                                    </a></li>
                                        <li class="">
                                            <a href="http://fvs.aidns.org/backend/compass" target="_self">
                                                                        <span
                                                                        class="icon voyager-compass"></span>
                                                                        <span
                                                                        class="title">Compass</span>
                                                                    </a></li>
                                    </ul>
                                </div>
                            </div>
                        </li>
                        <li class="">
                            <a href="http://fvs.aidns.org/backend/settings" target="_self">
                                                                        <span
                                                                        class="icon voyager-settings"></span>
                                                                        <span
                                                                        class="title">Settings</span>
                                                                    </a></li>
                    </ul>
                </nav>
            </div>
            <script>
            (function() {
                var appContainer = document.querySelector('.app-container'),
                    sidebar = appContainer.querySelector('.side-menu'),
                    navbar = appContainer.querySelector('nav.navbar.navbar-top'),
                    loader = document.getElementById('voyager-loader'),
                    hamburgerMenu = document.querySelector('.hamburger'),
                    sidebarTransition = sidebar.style.transition,
                    navbarTransition = navbar.style.transition,
                    containerTransition = appContainer.style.transition;
                sidebar.style.WebkitTransition = sidebar.style.MozTransition = sidebar.style.transition = appContainer.style.WebkitTransition = appContainer.style.MozTransition = appContainer.style.transition = navbar.style.WebkitTransition = navbar.style.MozTransition = navbar.style.transition = 'none';
                if (window.localStorage && window.localStorage['voyager.stickySidebar'] == 'true') { appContainer.className += ' expanded no-animation';
                    loader.style.left = (sidebar.clientWidth / 2) + 'px';
                    hamburgerMenu.className += ' is-active no-animation'; }
                navbar.style.WebkitTransition = navbar.style.MozTransition = navbar.style.transition = navbarTransition;
                sidebar.style.WebkitTransition = sidebar.style.MozTransition = sidebar.style.transition = sidebarTransition;
                appContainer.style.WebkitTransition = appContainer.style.MozTransition = appContainer.style.transition = containerTransition;
            })();
            </script>
            <div class="container-fluid">
                <div class="side-body padding-top">
                    <h1 class="page-title">
                                                                            <i
                                                                            class="voyager-data"></i>
                                                                            Editing categories table</h1>
                    <div id="voyager-notifications"></div>
                    <div class="page-content container-fluid">
                        <div class="row">
                            <div id="dbManager" class="col-md-12">
                                <form ref="form" @submit.prevent="stringifyTable" @keydown.enter.prevent action="http://fvs.aidns.org/backend/database/categories" method="POST">
                                    <input type="hidden" name="_method" value="PUT">
                                    <database-table-editor :table="table"></database-table-editor>
                                    <input type="hidden" :value="tableJson" name="table">
                                    <input type="hidden" name="_token" value="GxMSO8uKdbkWCzTh6Gxlq3kkfp42OCNwzA40tSX3">
                                </form>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <footer class="app-footer">
        <div class="site-footer-right">
            Made with <i class="voyager-heart"></i> by <a href="http://thecontrolgroup.com" target="_blank">The Control Group</a> - v1.0.11</div>
    </footer>
    <script type="text/javascript" src="http://fvs.aidns.org/vendor/tcg/voyager/assets/js/app.js"></script>
    <script></script>
    <script>
    let databaseTypes = { "Numbers": [{ "name": "tinyint", "category": "Numbers", "default": { "type": "number", "step": "any" } }, { "name": "smallint", "category": "Numbers", "default": { "type": "number", "step": "any" } }, { "name": "mediumint", "category": "Numbers", "default": { "type": "number", "step": "any" } }, { "name": "integer", "category": "Numbers", "default": { "type": "number", "step": "any" } }, { "name": "bigint", "category": "Numbers", "default": { "type": "number", "step": "any" } }, { "name": "float", "category": "Numbers", "default": { "type": "number", "step": "any" } }, { "name": "double", "category": "Numbers", "default": { "type": "number", "step": "any" } }, { "name": "decimal", "category": "Numbers", "default": { "type": "number", "step": "any" } }], "Strings": [{ "name": "tinytext", "category": "Strings", "notSupportIndex": true, "default": { "disabled": true } }, { "name": "mediumtext", "category": "Strings", "notSupportIndex": true, "default": { "disabled": true } }, { "name": "longtext", "category": "Strings", "notSupportIndex": true, "default": { "disabled": true } }, { "name": "text", "category": "Strings", "notSupportIndex": true, "default": { "disabled": true } }, { "name": "varchar", "category": "Strings" }, { "name": "char", "category": "Strings" }], "Date and Time": [{ "name": "date", "category": "Date and Time", "default": { "type": "date" } }, { "name": "datetime", "category": "Date and Time" }, { "name": "timestamp", "category": "Date and Time" }, { "name": "time", "category": "Date and Time", "default": { "type": "time", "step": "1" } }, { "name": "year", "category": "Date and Time", "default": { "type": "number", "min": "0" } }], "Binary": [{ "name": "longblob", "category": "Binary", "notSupportIndex": true, "default": { "disabled": true } }, { "name": "blob", "category": "Binary", "notSupportIndex": true, "default": { "disabled": true } }, { "name": "mediumblob", "category": "Binary", "notSupportIndex": true, "default": { "disabled": true } }, { "name": "tinyblob", "category": "Binary", "notSupportIndex": true, "default": { "disabled": true } }, { "name": "binary", "category": "Binary" }, { "name": "varbinary", "category": "Binary" }, { "name": "bit", "category": "Binary" }], "Lists": [{ "name": "set", "category": "Lists", "notSupported": true }, { "name": "enum", "category": "Lists", "notSupported": true }, { "name": "json", "category": "Lists", "default": { "disabled": true } }], "Geometry": [{ "name": "geometrycollection", "category": "Geometry" }, { "name": "geometry", "category": "Geometry" }, { "name": "linestring", "category": "Geometry" }, { "name": "multilinestring", "category": "Geometry" }, { "name": "multipoint", "category": "Geometry" }, { "name": "multipolygon", "category": "Geometry" }, { "name": "point", "category": "Geometry" }, { "name": "polygon", "category": "Geometry" }] };

    function getDbType(name) {
        let type;
        name = name.toLowerCase().trim();
        for (category in databaseTypes) { type = databaseTypes[category].find(function(type) { return name == type.name.toLowerCase(); }); if (type) { return type; } }
        toastr.error("Unknown Type: " + name);
        return databaseTypes.Numbers[0];
    }
    Vue.component('database-types', { props: { column: { type: Object, required: true } }, data() { return { dbTypes: databaseTypes }; }, template: `<div><select:value="column.type.name"@change="onTypeChange"class="form-control"tabindex="-1"><optgroup v-for="(types, category) in dbTypes":label="category"><option v-for="type in types":value="type.name":disabled="type.notSupported">{{type.name.toUpperCase()}}</option></optgroup></select><div v-if="column.type.notSupported"><small>This type is not supported</small></div></div>`, methods: { onTypeChange(event) { this.$emit('typeChanged', this.getType(event.target.value)); }, getType(name) { return getDbType(name); } } });
    </script>
    <script>
    let defaultOptions = { type: 'text', step: false, min: false, max: false, class: false, disabled: false };
    Vue.component('database-column-default', {
        props: { column: { type: Object, required: true } },
        template: `<input:value="column.default":type="options.type":step="options.step":min="options.min":max="options.max":class="options.class":disabled="options.disabled"@input="onDefaultInput"
                                                                                        class="form-control">`,
        methods: {
            onDefaultInput(event) {
                let defaultValue = event.target.value.trim();
                if (defaultValue == '') { defaultValue = null; }
                this.column.default = defaultValue;
            },
            getOption(option) {
                if (this.column.type.default[option]) { return this.column.type.default[option]; }
                return false;
            },
            getType() {
                let type = this.getOption('type');
                if (type) { return type; }
                return 'text';
            }
        },
        computed: {
            options() {
                if (!this.column.type.default) { return defaultOptions; }
                return { type: this.getType(), step: this.getOption('step'), min: this.getOption('min'), max: this.getOption('max'), class: this.getOption('class'), disabled: this.getOption('disabled') };
            }
        }
    });
    </script>
    <script>
    Vue.component('database-column', {
        props: { column: { type: Object, required: true }, index: { type: Object, required: true } },
        template: `<tr class="newTableRow"><td><input:value="column.name"@input="onColumnNameInput"type="text"class="form-control"required pattern="^[a-zA-Z_][a-zA-Z0-9_]*$"></td><td><database-types:column="column"@typeChanged="onColumnTypeChange"></database-types></td><td><input v-model.number="column.length"type="number"min="0"></td><td><input v-model="column.notnull"type="checkbox"></td><td><input v-model="column.unsigned"type="checkbox"></td><td><input v-model="column.autoincrement"type="checkbox"></td><td><select:value="index.type"@change="onIndexTypeChange":disabled="column.type.notSupportIndex"
                                                                                        class="form-control"tabindex="-1"><option value=""></option><option value="INDEX">INDEX</option><option value="UNIQUE">UNIQUE</option><option value="PRIMARY">PRIMARY</option></select><small v-if="column.composite"v-once>Warning:this column is part of a composite index</small></td><td><database-column-default:column="column"></database-column-default></td><td><div class="btn btn-danger delete-row"@click="deleteColumn"><i class="voyager-trash"></i></div></td></tr>`,
        methods: {
            deleteColumn() { this.$emit('columnDeleted', this.column); },
            onColumnNameInput(event) { let newName = event.target.value;
                this.$emit('columnNameUpdated', { column: this.column, newName: newName }); },
            onColumnTypeChange(type) {
                if (type.notSupportIndex && this.index.type) { this.$emit('indexDeleted', this.index); }
                this.column.default = null;
                this.column.type = type;
            },
            onIndexTypeChange(event) {
                if (this.column.name == '') { return toastr.error("Please name the column before adding an index"); }
                return this.$emit('indexChanged', { columns: [this.column.name], old: this.index, newType: event.target.value });
            }
        }
    });
    </script>
    <script>
    Vue.component('database-table-helper-buttons', { template: `<div><div class="btn btn-success"@click="addNewColumn">+Add New Column</div><div class="btn btn-success"@click="addTimestamps">+Add Timestamps</div><div class="btn btn-success"@click="addSoftDeletes">+Add Soft Deletes</div></div>`, methods: { addColumn(column) { this.$emit('columnAdded', column); }, makeColumn(options) { return $.extend({ name: '', oldName: '', type: getDbType('integer'), length: null, fixed: false, unsigned: false, autoincrement: false, notnull: false, default: null }, options); }, addNewColumn() { this.addColumn(this.makeColumn()); }, addTimestamps() { this.addColumn(this.makeColumn({ name: 'created_at', type: getDbType('timestamp') }));
                this.addColumn(this.makeColumn({ name: 'updated_at', type: getDbType('timestamp') })); }, addSoftDeletes() { this.addColumn(this.makeColumn({ name: 'deleted_at', type: getDbType('timestamp') })); } } });
    </script>
    <script>
    Vue.component('database-table-editor', {
        props: { table: { type: Object, required: true } },
        data() { return { emptyIndex: { type: '', name: '' }, compositeIndexes: [] }; },
        template: `<div class="panel panel-bordered"><div class="panel-body"><div class="row"><div class="col-md-12"><label for="name">Table Name</label><br><input v-model.trim="table.name"type="text"class="form-control"placeholder="Table Name"required pattern="^[a-zA-Z_][a-zA-Z0-9_]*$"></div></div><!--.panel-body.row--><div v-if="compositeIndexes.length"v-once class="alert alert-danger"><p>This table has composite indexes.Please note that they are not supported at the moment.Be careful when trying to add/remove indexes.</p></div><div id="alertsContainer"></div><template v-if="tableHasColumns"><p>Table Columns</p><table class="table table-bordered"style="width:100%;"><thead><tr><th>Name</th><th>Type</th><th>Length</th><th>Not Null</th><th>Unsigned</th><th>Auto Increment</th><th>Index</th><th>Default</th><th></th></tr></thead><tbody><database-column
                                                                                        v-for="column in table.columns":column="column":index="getColumnsIndex(column.name)"@columnNameUpdated="renameColumn"@columnDeleted="deleteColumn"@indexAdded="addIndex"@indexDeleted="deleteIndex"@indexUpdated="updateIndex"@indexChanged="onIndexChange"></database-column></tbody></table></template><div v-else><p>The table has no columns...</p></div><div style="text-align:center"><database-table-helper-buttons@columnAdded="addColumn"></database-table-helper-buttons></div></div><!--.panel-body--><div class="panel-footer"><input type="submit"class="btn btn-primary pull-right"
                                                                                        value="Update Table":disabled="!tableHasColumns"><div style="clear:both"></div></div></div><!--.panel-->`,
        mounted() { this.compositeIndexes = this.getCompositeIndexes(); let compositeColumns = this.getIndexesColumns(this.compositeIndexes); for (col in compositeColumns) { this.getColumn(compositeColumns[col]).composite = true; } },
        computed: { tableHasColumns() { return this.table.columns.length; } },
        methods: {
            addColumn(column) {
                column.name = column.name.trim();
                if (column.name && this.hasColumn(column.name)) { return toastr.error("Column " + column.name + " already exists"); }
                this.table.columns.push(JSON.parse(JSON.stringify(column)));
            },
            getColumn(name) { name = name.toLowerCase().trim(); return this.table.columns.find(function(column) { return name == column.name.toLowerCase(); }); },
            hasColumn(name) { return !!this.getColumn(name); },
            renameColumn(column) {
                let newName = column.newName.trim();
                column = column.column;
                let existingColumn;
                if ((existingColumn = this.getColumn(newName)) && (existingColumn !== column)) { return toastr.error("Column " + newName + " already exists"); }
                let index = this.getColumnsIndex(column.name);
                if (index !== this.emptyIndex) { index.columns = [newName]; }
                column.name = newName;
            },
            deleteColumn(column) { var columnPos = this.table.columns.indexOf(column); if (columnPos !== -1) { this.table.columns.splice(columnPos, 1);
                    this.deleteIndex(this.getColumnsIndex(column.name)); } },
            getColumnsIndex(columns) {
                if (!Array.isArray(columns)) { columns = [columns]; }
                let index = null;
                for (i in this.table.indexes) { if (!($(this.table.indexes[i].columns).not(columns).get().length)) { index = this.table.indexes[i]; break; } }
                if (!index) { index = this.emptyIndex; }
                index.table = this.table.name;
                return index;
            },
            onIndexChange(index) {
                if (index.old === this.emptyIndex) { return this.addIndex({ columns: index.columns, type: index.newType }); }
                if (index.newType == '') { return this.deleteIndex(index.old); }
                return this.updateIndex(index.old, index.newType);
            },
            addIndex(index) {
                if (index.type == 'PRIMARY') {
                    if (this.table.primaryKeyName) { return toastr.error("The table already has a primary index."); }
                    this.table.primaryKeyName = 'primary';
                }
                this.setIndexName(index);
                this.table.indexes.push(index);
            },
            deleteIndex(index) {
                var indexPos = this.table.indexes.indexOf(index);
                if (indexPos !== -1) {
                    if (index.type == 'PRIMARY') { this.table.primaryKeyName = false; }
                    this.table.indexes.splice(indexPos, 1);
                }
            },
            updateIndex(index, newType) {
                if (index.type == 'PRIMARY') { this.table.primaryKeyName = false; } else if (newType == 'PRIMARY') {
                    if (this.table.primaryKeyName) { return toastr.error("The table already has a primary index."); }
                    this.table.primaryKeyName = 'primary';
                }
                index.type = newType;
                this.setIndexName(index);
            },
            setIndexName(index) { if (index.type == 'PRIMARY') { index.name = 'primary'; } else { index.name = ''; } },
            getCompositeIndexes() {
                let composite = [];
                for (i in this.table.indexes) { if (this.table.indexes[i].isComposite) { composite.push(this.table.indexes[i]); } }
                return composite;
            },
            getIndexesColumns(indexes) {
                let columns = [];
                for (i in indexes) { for (col in indexes[i].columns) { columns.push(indexes[i].columns[col]); } }
                return [...new Set(columns)];
            }
        }
    });
    </script>
    <script>
    new Vue({ el: '#dbManager', data: { table: {}, originalTable: { "name": "categories", "oldName": "categories", "columns": [{ "name": "id", "type": { "name": "integer", "category": "Numbers", "default": { "type": "number", "step": "any" } }, "default": null, "notnull": true, "length": null, "precision": 10, "scale": 0, "fixed": false, "unsigned": true, "autoincrement": true, "columnDefinition": null, "comment": null, "oldName": "id", "null": "NO", "extra": "auto_increment", "composite": false }, { "name": "parent_id", "type": { "name": "integer", "category": "Numbers", "default": { "type": "number", "step": "any" } }, "default": "NULL", "notnull": false, "length": null, "precision": 10, "scale": 0, "fixed": false, "unsigned": true, "autoincrement": false, "columnDefinition": null, "comment": null, "oldName": "parent_id", "null": "YES", "extra": "", "composite": false }, { "name": "order", "type": { "name": "integer", "category": "Numbers", "default": { "type": "number", "step": "any" } }, "default": "1", "notnull": true, "length": null, "precision": 10, "scale": 0, "fixed": false, "unsigned": false, "autoincrement": false, "columnDefinition": null, "comment": null, "oldName": "order", "null": "NO", "extra": "", "composite": false }, { "name": "name", "type": { "name": "varchar", "category": "Strings" }, "default": null, "notnull": true, "length": 255, "precision": 10, "scale": 0, "fixed": false, "unsigned": false, "autoincrement": false, "columnDefinition": null, "comment": null, "collation": "utf8mb4_unicode_ci", "oldName": "name", "null": "NO", "extra": "", "composite": false }, { "name": "slug", "type": { "name": "varchar", "category": "Strings" }, "default": null, "notnull": true, "length": 255, "precision": 10, "scale": 0, "fixed": false, "unsigned": false, "autoincrement": false, "columnDefinition": null, "comment": null, "collation": "utf8mb4_unicode_ci", "oldName": "slug", "null": "NO", "extra": "", "composite": false }, { "name": "created_at", "type": { "name": "timestamp", "category": "Date and Time" }, "default": "NULL", "notnull": false, "length": null, "precision": 10, "scale": 0, "fixed": false, "unsigned": false, "autoincrement": false, "columnDefinition": null, "comment": null, "oldName": "created_at", "null": "YES", "extra": "", "composite": false }, { "name": "updated_at", "type": { "name": "timestamp", "category": "Date and Time" }, "default": "NULL", "notnull": false, "length": null, "precision": 10, "scale": 0, "fixed": false, "unsigned": false, "autoincrement": false, "columnDefinition": null, "comment": null, "oldName": "updated_at", "null": "YES", "extra": "", "composite": false }], "indexes": [{ "name": "PRIMARY", "oldName": "PRIMARY", "columns": ["id"], "type": "PRIMARY", "isPrimary": true, "isUnique": true, "isComposite": false, "flags": [], "options": [], "table": "categories" }, { "name": "categories_slug_unique", "oldName": "categories_slug_unique", "columns": ["slug"], "type": "UNIQUE", "isPrimary": false, "isUnique": true, "isComposite": false, "flags": [], "options": [], "table": "categories" }, { "name": "categories_parent_id_foreign", "oldName": "categories_parent_id_foreign", "columns": ["parent_id"], "type": "INDEX", "isPrimary": false, "isUnique": false, "isComposite": false, "flags": [], "options": [], "table": "categories" }], "primaryKeyName": "primary", "foreignKeys": { "categories_parent_id_foreign": { "name": "categories_parent_id_foreign", "localTable": "categories", "localColumns": ["parent_id"], "foreignTable": "categories", "foreignColumns": ["id"], "options": { "onDelete": "SET NULL", "onUpdate": "CASCADE" } } }, "options": [] }, oldTable: null, tableJson: '' }, created() { if (this.oldTable) { this.table = this.oldTable; } else { this.table = JSON.parse(JSON.stringify(this.originalTable)); } }, methods: { stringifyTable() { this.tableJson = JSON.stringify(this.table);
                this.$nextTick(() => this.$refs.form.submit()); } } });
    </script>
</body>

</html>
SHSharkar commented 6 years ago

@fletch3555

Sir, Above I have shared the source code of the page.

emptynick commented 5 years ago

Is this still a problem? Or did you find a solution?

SHSharkar commented 5 years ago

Hello @emptynick,

Thanks for your response. I had found the solution to the problem.

Thanks for asking!

github-actions[bot] commented 4 years ago

This issue has been automatically locked since there has not been any recent activity after it was closed. If you have further questions please ask in our Slack group.