Web interface: переход на модульный контент

2017-03-12 14:25:42 +03:00
parent 5aabb6fe1a
commit dbcf9c9894
6 changed files with 125 additions and 112 deletions
--- a/webinterface/src/main/resources/static/module.js
+++ b/webinterface/src/main/resources/static/module.js
@@ -0,0 +1,105 @@
+var BundleTable = React.createClass({
+    render: function(){return(
+        ce('table', {className: 'table table-hover', width: '100%', style: {'margin-bottom': '0'}},
+            ce('thead', null,
+                ce('tr', null,
+                    ce('th', {className: 'col-xs-1'}, '#'),
+                    ce('th', null, 'Название'),
+                    ce('th', {className: 'hidden-xs'}, 'Версия'),
+                    ce('th', null, 'Статус'),
+                    ce('th', {className: 'col-xs-1'}, nbsp)
+                )
+            ),
+            ce('tbody', null, this.props.children)
+        )
+    )}
+});
+
+var BundleTableRow = React.createClass({
+    getInitialState: function(){return{
+        id: this.props.id,
+        name: this.props.name,
+        state: this.props.state,
+        version: this.props.version,
+        lastModified: this.props.lastModified
+    }},
+    stateToStr: function(state) {
+        if      (state == 1)  {return 'UNINSTALLED'}
+        else if (state == 2)  {return 'INSTALLED'}
+        else if (state == 4)  {return 'RESOLVED'}
+        else if (state == 8)  {return 'STARTING'}
+        else if (state == 16) {return 'STOPPING'}
+        else if (state == 32) {return 'ACTIVE'}
+        else                  {return 'UNKNOW('+state+')'}
+    },
+    bndUpd: function() {
+        var _this = this;
+        fetch('/ajax/bundles.json?id='+this.props.id+'&act=upd')
+            .then(function(resp){
+                resp.json().then(function(data){
+                    _this.setState({
+                        id: data.id,
+                        name: data.name,
+                        state: data.state,
+                        version: data.version,
+                        lastModified: data.lastModified
+                    });
+                    console.debug(data);
+                });
+            })
+            .catch(function(err){
+                console.error(err);
+            });
+    },
+    render: function(){
+        vertAlign = {'vertical-align': 'middle'};
+        return(
+            ce('tr', null,
+                ce('td', {style: vertAlign}, this.state.id),
+                ce('td', {style: vertAlign}, this.state.name),
+                ce('td', {className: 'hidden-xs', style: vertAlign}, this.state.version),
+                ce('td', {style: vertAlign}, this.stateToStr(this.state.state)),
+                ce('td', {style: vertAlign},
+                    ce(Button, {colored: 'danger', btnSize: 'xs', onClick: this.bndUpd}, 'update')
+                )
+            )
+        )
+    }
+});
+
+var ContentModule = React.createClass({
+    tableRows: [],
+    getInitialState: function(){return{
+        fLoad: true
+    }},
+    requestBundleList: function() {
+        var _this = this;
+        fetch('/ajax/bundles.json')
+            .then(function(response){
+                response.json().then(function(data){
+                    console.debug(data);
+                    data.forEach(function(bundle){
+                        _this.tableRows.push(ce(BundleTableRow, {
+                            id: bundle.id,
+                            name: bundle.name,
+                            state: bundle.state,
+                            version: bundle.version,
+                            lastModified: bundle.lastModified
+                        }));
+                    });
+                    _this.setState({fLoad: false});
+                });
+            })
+            .catch(function(err){
+                console.error(err);
+            });
+    },
+    render:function(){
+        if (this.state.fLoad) {
+            this.requestBundleList();
+            return ce('span', null, 'loading...');
+        } else {
+            return(ce(Panel, {title: 'Модули'}, ce(BundleTable, null, this.tableRows)))
+        }
+    }
+});