www/manager6/ceph/CephInstallWizard.js

   1 Ext.define('PVE.ceph.CephInstallWizardInfo', {
   2     extend: 'Ext.panel.Panel',
   3     xtype: 'pveCephInstallWizardInfo',
   4
   5     html: `<h3>Ceph?</h3>
   6     <blockquote cite="https://ceph.com/"><p>"<b>Ceph</b> is a unified,
   7     distributed storage system, designed for excellent performance, reliability,
   8     and scalability."</p></blockquote>
   9     <p>
  10     <b>Ceph</b> is currently <b>not installed</b> on this node. This wizard
  11     will guide you through the installation. Click on the next button below
  12     to begin. After the initial installation, the wizard will offer to create
  13     an initial configuration. This configuration step is only
  14     needed once per cluster and will be skipped if a config is already present.
  15     </p>
  16     <p>
  17     Before starting the installation, please take a look at our documentation,
  18     by clicking the help button below. If you want to gain deeper knowledge about
  19     Ceph, visit <a target="_blank" href="https://docs.ceph.com/en/latest/">ceph.com</a>.
  20     </p>`,
  21 });
  22
  23 Ext.define('PVE.ceph.CephVersionSelector', {
  24     extend: 'Ext.form.field.ComboBox',
  25     xtype: 'pveCephVersionSelector',
  26
  27     fieldLabel: gettext('Ceph version to install'),
  28
  29     displayField: 'display',
  30     valueField: 'release',
  31
  32     queryMode: 'local',
  33     editable: false,
  34     forceSelection: true,
  35
  36     store: {
  37         fields: [
  38             'release',
  39             'version',
  40             {
  41                 name: 'display',
  42                 calculate: d => `${d.release} (${d.version})`,
  43             },
  44         ],
  45         proxy: {
  46             type: 'memory',
  47             reader: {
  48                 type: 'json',
  49             },
  50         },
  51         data: [
  52             { release: "nautilus", version: "14.2" },
  53             { release: "octopus", version: "15.2" },
  54             //{release: "pacific", version: "16.1"},
  55         ],
  56     },
  57 });
  58
  59 Ext.define('PVE.ceph.CephHighestVersionDisplay', {
  60     extend: 'Ext.form.field.Display',
  61     xtype: 'pveCephHighestVersionDisplay',
  62
  63     fieldLabel: gettext('Ceph in the cluster'),
  64
  65     value: 'unknown',
  66
  67     // called on success with (release, versionTxt, versionParts)
  68     gotNewestVersion: Ext.emptyFn,
  69
  70     initComponent: function() {
  71         let me = this;
  72
  73         me.callParent(arguments);
  74
  75         Proxmox.Utils.API2Request({
  76             method: 'GET',
  77             url: '/cluster/ceph/metadata',
  78             params: {
  79                 scope: 'versions',
  80             },
  81             waitMsgTarget: me,
  82             success: (response) => {
  83                 let res = response.result;
  84                 if (!res || !res.data || !res.data.node) {
  85                     me.setValue(
  86                         gettext('Could not detect a ceph installation in the cluster'),
  87                     );
  88                     return;
  89                 }
  90                 let nodes = res.data.node;
  91                 if (me.nodename) {
  92                     // can happen on ceph purge, we do not yet cleanup old version data
  93                     delete nodes[me.nodename];
  94                 }
  95
  96                 let maxversion = [];
  97                 let maxversiontext = "";
  98                 for (const [nodename, data] of Object.entries(nodes)) {
  99                     let version = data.version.parts;
 100                     if (PVE.Utils.compare_ceph_versions(version, maxversion) > 0) {
 101                         maxversion = version;
 102                         maxversiontext = data.version.str;
 103                     }
 104                 }
 105                 // FIXME: get from version selector store
 106                 const major2release = {
 107                     13: 'luminous',
 108                     14: 'nautilus',
 109                     15: 'octopus',
 110                     16: 'pacific',
 111                 };
 112                 let release = major2release[maxversion[0]] || 'unknown';
 113                 let newestVersionTxt = `${Ext.String.capitalize(release)} (${maxversiontext})`;
 114
 115                 if (release === 'unknown') {
 116                     me.setValue(
 117                         gettext('Could not detect a ceph installation in the cluster'),
 118                     );
 119                 } else {
 120                     me.setValue(Ext.String.format(
 121                         gettext('Newest ceph version in cluster is {0}'),
 122                         newestVersionTxt,
 123                     ));
 124                 }
 125                 me.gotNewestVersion(release, maxversiontext, maxversion);
 126             },
 127             failure: function(response, opts) {
 128                 Ext.Msg.alert(gettext('Error'), response.htmlStatus);
 129             },
 130         });
 131     },
 132 });
 133
 134 Ext.define('PVE.ceph.CephInstallWizard', {
 135     extend: 'PVE.window.Wizard',
 136     alias: 'widget.pveCephInstallWizard',
 137     mixins: ['Proxmox.Mixin.CBind'],
 138
 139     resizable: false,
 140     nodename: undefined,
 141
 142     viewModel: {
 143         data: {
 144             nodename: '',
 145             cephRelease: 'octopus',
 146             configuration: true,
 147             isInstalled: false,
 148         },
 149     },
 150     cbindData: {
 151         nodename: undefined,
 152     },
 153
 154     title: gettext('Setup'),
 155     navigateNext: function() {
 156         var tp = this.down('#wizcontent');
 157         var atab = tp.getActiveTab();
 158
 159         var next = tp.items.indexOf(atab) + 1;
 160         var ntab = tp.items.getAt(next);
 161         if (ntab) {
 162             ntab.enable();
 163             tp.setActiveTab(ntab);
 164         }
 165     },
 166     setInitialTab: function(index) {
 167         var tp = this.down('#wizcontent');
 168         var initialTab = tp.items.getAt(index);
 169         initialTab.enable();
 170         tp.setActiveTab(initialTab);
 171     },
 172     onShow: function() {
 173             this.callParent(arguments);
 174             var isInstalled = this.getViewModel().get('isInstalled');
 175             if (isInstalled) {
 176                 this.getViewModel().set('configuration', false);
 177                 this.setInitialTab(2);
 178             }
 179     },
 180     items: [
 181         {
 182             xtype: 'panel',
 183             title: gettext('Info'),
 184             viewModel: {}, // needed to inherit parent viewModel data
 185             border: false,
 186             bodyBorder: false,
 187             onlineHelp: 'chapter_pveceph',
 188             layout: {
 189                 type: 'vbox',
 190                 align: 'stretch',
 191             },
 192             defaults: {
 193                 border: false,
 194                 bodyBorder: false,
 195             },
 196             items: [
 197                 {
 198                     xtype: 'pveCephInstallWizardInfo',
 199                 },
 200                 {
 201                     flex: 1,
 202                 },
 203                 {
 204                     xtype: 'pveCephHighestVersionDisplay',
 205                     labelWidth: 180,
 206                     cbind: {
 207                         nodename: '{nodename}',
 208                     },
 209                     gotNewestVersion: function(release, maxversiontext, maxversion) {
 210                         if (release === 'unknown') {
 211                             return;
 212                         }
 213                         let wizard = this.up('pveCephInstallWizard');
 214                         wizard.getViewModel().set('cephRelease', release);
 215                     },
 216                 },
 217                 {
 218                     xtype: 'pveCephVersionSelector',
 219                     labelWidth: 180,
 220                     submitValue: false,
 221                     bind: {
 222                         value: '{cephRelease}',
 223                     },
 224                     listeners: {
 225                         change: function(field, release) {
 226                             let wizard = this.up('pveCephInstallWizard');
 227                             wizard.down('#next').setText(
 228                                 Ext.String.format(gettext('Start {0} installation'), release),
 229                             );
 230                         },
 231                     },
 232                 },
 233             ],
 234             listeners: {
 235                 activate: function() {
 236                     // notify owning container that it should display a help button
 237                     if (this.onlineHelp) {
 238                         Ext.GlobalEvents.fireEvent('proxmoxShowHelp', this.onlineHelp);
 239                     }
 240                     let wizard = this.up('pveCephInstallWizard');
 241                     let release = wizard.getViewModel().get('cephRelease');
 242                     wizard.down('#back').hide(true);
 243                     wizard.down('#next').setText(
 244                         Ext.String.format(gettext('Start {0} installation'), release),
 245                     );
 246                 },
 247                 deactivate: function() {
 248                     if (this.onlineHelp) {
 249                         Ext.GlobalEvents.fireEvent('proxmoxHideHelp', this.onlineHelp);
 250                     }
 251                     this.up('pveCephInstallWizard').down('#next').setText(gettext('Next'));
 252                 },
 253             },
 254         },
 255         {
 256             title: gettext('Installation'),
 257             xtype: 'panel',
 258             layout: 'fit',
 259             cbind: {
 260                 nodename: '{nodename}',
 261             },
 262             viewModel: {}, // needed to inherit parent viewModel data
 263             listeners: {
 264                 afterrender: function() {
 265                     var me = this;
 266                     if (this.getViewModel().get('isInstalled')) {
 267                         this.mask("Ceph is already installed, click next to create your configuration.", ['pve-static-mask']);
 268                     } else {
 269                         me.down('pveNoVncConsole').fireEvent('activate');
 270                     }
 271                 },
 272                 activate: function() {
 273                     let me = this;
 274                     const nodename = me.nodename;
 275                     me.updateStore = Ext.create('Proxmox.data.UpdateStore', {
 276                         storeid: 'ceph-status-' + nodename,
 277                         interval: 1000,
 278                         proxy: {
 279                             type: 'proxmox',
 280                             url: '/api2/json/nodes/' + nodename + '/ceph/status',
 281                         },
 282                         listeners: {
 283                             load: function(rec, response, success, operation) {
 284                                 if (success) {
 285                                     me.updateStore.stopUpdate();
 286                                     me.down('textfield').setValue('success');
 287                                 } else if (operation.error.statusText.match("not initialized", "i")) {
 288                                     me.updateStore.stopUpdate();
 289                                     me.up('pveCephInstallWizard').getViewModel().set('configuration', false);
 290                                     me.down('textfield').setValue('success');
 291                                 } else if (operation.error.statusText.match("rados_connect failed", "i")) {
 292                                     me.updateStore.stopUpdate();
 293                                     me.up('pveCephInstallWizard').getViewModel().set('configuration', true);
 294                                     me.down('textfield').setValue('success');
 295                                 } else if (!operation.error.statusText.match("not installed", "i")) {
 296                                     Proxmox.Utils.setErrorMask(me, operation.error.statusText);
 297                                 }
 298                             },
 299                         },
 300                     });
 301                     me.updateStore.startUpdate();
 302                 },
 303                 destroy: function() {
 304                     var me = this;
 305                     if (me.updateStore) {
 306                         me.updateStore.stopUpdate();
 307                     }
 308                 },
 309             },
 310             items: [
 311                 {
 312                     xtype: 'pveNoVncConsole',
 313                     itemId: 'jsconsole',
 314                     consoleType: 'cmd',
 315                     xtermjs: true,
 316                     cbind: {
 317                         nodename: '{nodename}',
 318                     },
 319                     beforeLoad: function() {
 320                         let me = this;
 321                         let wizard = me.up('pveCephInstallWizard');
 322                         let release = wizard.getViewModel().get('cephRelease');
 323                         me.cmdOpts = `--version\0${release}`;
 324                     },
 325                     cmd: 'ceph_install',
 326                 },
 327                 {
 328                     xtype: 'textfield',
 329                     name: 'installSuccess',
 330                     value: '',
 331                     allowBlank: false,
 332                     submitValue: false,
 333                     hidden: true,
 334                 },
 335             ],
 336         },
 337         {
 338             xtype: 'inputpanel',
 339             title: gettext('Configuration'),
 340             onlineHelp: 'chapter_pveceph',
 341             cbind: {
 342                 nodename: '{nodename}',
 343             },
 344             viewModel: {
 345                 data: {
 346                     replicas: undefined,
 347                     minreplicas: undefined,
 348                 },
 349             },
 350             listeners: {
 351                 activate: function() {
 352                     this.up('pveCephInstallWizard').down('#submit').setText(gettext('Next'));
 353                 },
 354                 beforeshow: function() {
 355                     if (this.up('pveCephInstallWizard').getViewModel().get('configuration')) {
 356                         this.mask("Configuration already initialized", ['pve-static-mask']);
 357                     } else {
 358                         this.unmask();
 359                     }
 360                 },
 361                 deactivate: function() {
 362                     this.up('pveCephInstallWizard').down('#submit').setText(gettext('Finish'));
 363                 },
 364             },
 365             column1: [
 366                 {
 367                     xtype: 'displayfield',
 368                     value: gettext('Ceph cluster configuration') + ':',
 369                 },
 370                 {
 371                     xtype: 'proxmoxNetworkSelector',
 372                     name: 'network',
 373                     value: '',
 374                     fieldLabel: 'Public Network IP/CIDR',
 375                     bind: {
 376                         allowBlank: '{configuration}',
 377                     },
 378                     cbind: {
 379                         nodename: '{nodename}',
 380                     },
 381                 },
 382                 {
 383                     xtype: 'proxmoxNetworkSelector',
 384                     name: 'cluster-network',
 385                     fieldLabel: 'Cluster Network IP/CIDR',
 386                     allowBlank: true,
 387                     autoSelect: false,
 388                     emptyText: gettext('Same as Public Network'),
 389                     cbind: {
 390                         nodename: '{nodename}',
 391                     },
 392                 },
 393                 // FIXME: add hint about cluster network and/or reference user to docs??
 394             ],
 395             column2: [
 396                 {
 397                     xtype: 'displayfield',
 398                     value: gettext('First Ceph monitor') + ':',
 399                 },
 400                 {
 401                     xtype: 'pveNodeSelector',
 402                     fieldLabel: gettext('Monitor node'),
 403                     name: 'mon-node',
 404                     selectCurNode: true,
 405                     allowBlank: false,
 406                 },
 407                 {
 408                     xtype: 'displayfield',
 409                     value: gettext('Additional monitors are recommended. They can be created at any time in the Monitor tab.'),
 410                     userCls: 'pmx-hint',
 411                 },
 412             ],
 413             advancedColumn1: [
 414                 {
 415                     xtype: 'numberfield',
 416                     name: 'size',
 417                     fieldLabel: 'Number of replicas',
 418                     bind: {
 419                         value: '{replicas}',
 420                     },
 421                     maxValue: 7,
 422                     minValue: 2,
 423                     emptyText: '3',
 424                 },
 425                 {
 426                     xtype: 'numberfield',
 427                     name: 'min_size',
 428                     fieldLabel: 'Minimum replicas',
 429                     bind: {
 430                         maxValue: '{replicas}',
 431                         value: '{minreplicas}',
 432                     },
 433                     minValue: 2,
 434                     maxValue: 3,
 435                     setMaxValue: function(value) {
 436                         this.maxValue = Ext.Number.from(value, 2);
 437                         // allow enough to avoid split brains with max 'size', but more makes simply no sense
 438                         if (this.maxValue > 4) {
 439                             this.maxValue = 4;
 440                         }
 441                         this.toggleSpinners();
 442                         this.validate();
 443                     },
 444                     emptyText: '2',
 445                 },
 446             ],
 447             onGetValues: function(values) {
 448                 ['cluster-network', 'size', 'min_size'].forEach(function(field) {
 449                     if (!values[field]) {
 450                         delete values[field];
 451                     }
 452                 });
 453                 return values;
 454             },
 455             onSubmit: function() {
 456                 var me = this;
 457                 if (!this.up('pveCephInstallWizard').getViewModel().get('configuration')) {
 458                     var wizard = me.up('window');
 459                     var kv = wizard.getValues();
 460                     delete kv.delete;
 461                     var monNode = kv['mon-node'];
 462                     delete kv['mon-node'];
 463                     var nodename = me.nodename;
 464                     delete kv.nodename;
 465                     Proxmox.Utils.API2Request({
 466                         url: '/nodes/' + nodename + '/ceph/init',
 467                         waitMsgTarget: wizard,
 468                         method: 'POST',
 469                         params: kv,
 470                         success: function() {
 471                             Proxmox.Utils.API2Request({
 472                                 url: '/nodes/' + monNode + '/ceph/mon/' + monNode,
 473                                 waitMsgTarget: wizard,
 474                                 method: 'POST',
 475                                 success: function() {
 476                                     me.up('pveCephInstallWizard').navigateNext();
 477                                 },
 478                                 failure: function(response, opts) {
 479                                     Ext.Msg.alert(gettext('Error'), response.htmlStatus);
 480                                 },
 481                             });
 482                         },
 483                         failure: function(response, opts) {
 484                             Ext.Msg.alert(gettext('Error'), response.htmlStatus);
 485                         },
 486                     });
 487                 } else {
 488                     me.up('pveCephInstallWizard').navigateNext();
 489                 }
 490             },
 491         },
 492         {
 493             title: gettext('Success'),
 494             xtype: 'panel',
 495             border: false,
 496             bodyBorder: false,
 497             onlineHelp: 'pve_ceph_install',
 498             html: '<h3>Installation successful!</h3>'+
 499             '<p>The basic installation and configuration is complete. Depending on your setup, some of the following steps are required to start using Ceph:</p>'+
 500                 '<ol><li>Install Ceph on other nodes</li>'+
 501                 '<li>Create additional Ceph Monitors</li>'+
 502                 '<li>Create Ceph OSDs</li>'+
 503                 '<li>Create Ceph Pools</li></ol>'+
 504             '<p>To learn more, click on the help button below.</p>',
 505             listeners: {
 506                 activate: function() {
 507                     // notify owning container that it should display a help button
 508                     if (this.onlineHelp) {
 509                         Ext.GlobalEvents.fireEvent('proxmoxShowHelp', this.onlineHelp);
 510                     }
 511
 512                     var tp = this.up('#wizcontent');
 513                     var idx = tp.items.indexOf(this)-1;
 514                     for (;idx >= 0; idx--) {
 515                         var nc = tp.items.getAt(idx);
 516                         if (nc) {
 517                             nc.disable();
 518                         }
 519                     }
 520                 },
 521                 deactivate: function() {
 522                     if (this.onlineHelp) {
 523                         Ext.GlobalEvents.fireEvent('proxmoxHideHelp', this.onlineHelp);
 524                     }
 525                 },
 526             },
 527             onSubmit: function() {
 528                 var wizard = this.up('pveCephInstallWizard');
 529                 wizard.close();
 530             },
 531         },
 532     ],
 533 });