You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@kylin.apache.org by ma...@apache.org on 2015/05/15 07:22:07 UTC

[38/52] [abbrv] incubator-kylin git commit: add step check

add step check


Project: http://git-wip-us.apache.org/repos/asf/incubator-kylin/repo
Commit: http://git-wip-us.apache.org/repos/asf/incubator-kylin/commit/725598fb
Tree: http://git-wip-us.apache.org/repos/asf/incubator-kylin/tree/725598fb
Diff: http://git-wip-us.apache.org/repos/asf/incubator-kylin/diff/725598fb

Branch: refs/heads/0.8.0
Commit: 725598fbc8ad41c29a9c5d09a0424ef7200ba499
Parents: 5926d46
Author: jiazhong <ji...@ebay.com>
Authored: Fri Mar 27 18:05:01 2015 +0800
Committer: honma <ho...@ebay.com>
Committed: Fri May 15 11:36:53 2015 +0800

----------------------------------------------------------------------
 webapp/app/js/controllers/modelSchema.js        |  18 +-
 webapp/app/less/app.less                        |   2 +-
 webapp/app/less/component.less                  |   5 +
 .../app/partials/modelDesigner/model_info.html  |  92 +++++----
 webapp/app/partials/models/model_schema.html    |   4 +-
 webapp/app/partials/tables/source_metadata.html | 194 -------------------
 6 files changed, 75 insertions(+), 240 deletions(-)
----------------------------------------------------------------------


http://git-wip-us.apache.org/repos/asf/incubator-kylin/blob/725598fb/webapp/app/js/controllers/modelSchema.js
----------------------------------------------------------------------
diff --git a/webapp/app/js/controllers/modelSchema.js b/webapp/app/js/controllers/modelSchema.js
index b2b7ba7..4d7b6c1 100644
--- a/webapp/app/js/controllers/modelSchema.js
+++ b/webapp/app/js/controllers/modelSchema.js
@@ -28,13 +28,15 @@ KylinApp.controller('ModelSchemaCtrl', function ($scope, QueryService, UserServi
 
 
     $scope.wizardSteps = [
-        {title: 'Model Info', src: 'partials/modelDesigner/model_info.html', isComplete: false},
-        {title: 'Data Model', src: 'partials/modelDesigner/data_model.html', isComplete: false},
-        {title: 'Dimensions', src: 'partials/modelDesigner/model_dimensions.html', isComplete: false},
-        {title: 'Measures', src: 'partials/modelDesigner/model_measures.html', isComplete: false},
-        {title: 'Settings', src: 'partials/modelDesigner/conditions_settings.html', isComplete: false}
+        {title: 'Model Info', src: 'partials/modelDesigner/model_info.html', isComplete: false,form:'model_info_form'},
+        {title: 'Data Model', src: 'partials/modelDesigner/data_model.html', isComplete: false,form:null},
+        {title: 'Dimensions', src: 'partials/modelDesigner/model_dimensions.html', isComplete: false,form:null},
+        {title: 'Measures', src: 'partials/modelDesigner/model_measures.html', isComplete: false,form:null},
+        {title: 'Settings', src: 'partials/modelDesigner/conditions_settings.html', isComplete: false,form:null}
     ];
 
+    $scope.formStepMap =[{}]
+
     $scope.curStep = $scope.wizardSteps[0];
 
 
@@ -93,7 +95,11 @@ KylinApp.controller('ModelSchemaCtrl', function ($scope, QueryService, UserServi
         }
     };
 
-    $scope.goToStep = function(stepIndex){
+    $scope.goToStep = function(stepIndex,form){
+        if(form){
+            console.log($scope[form]);
+            console.log(document.querySelector("form"));
+        }
         for(var i=0;i<$scope.wizardSteps.length;i++){
             if(i<=stepIndex){
                 $scope.wizardSteps[i].isComplete = true;

http://git-wip-us.apache.org/repos/asf/incubator-kylin/blob/725598fb/webapp/app/less/app.less
----------------------------------------------------------------------
diff --git a/webapp/app/less/app.less b/webapp/app/less/app.less
index c829ca1..9c629d0 100644
--- a/webapp/app/less/app.less
+++ b/webapp/app/less/app.less
@@ -365,7 +365,7 @@ pre {
 }
 
 input.ng-invalid-required {
-  border: 2px solid lightblue;
+  border: 1px solid #dd4b39;
 }
 
 input.ng-invalid-required:after {

http://git-wip-us.apache.org/repos/asf/incubator-kylin/blob/725598fb/webapp/app/less/component.less
----------------------------------------------------------------------
diff --git a/webapp/app/less/component.less b/webapp/app/less/component.less
index 4ab31e5..ee28e84 100644
--- a/webapp/app/less/component.less
+++ b/webapp/app/less/component.less
@@ -963,4 +963,9 @@ Angular 1.2.0 Animation
 
 .abn-tree i.indented{
   font-size:14px !important;
+}
+
+//form validate
+.has-feedback{
+
 }
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/incubator-kylin/blob/725598fb/webapp/app/partials/modelDesigner/model_info.html
----------------------------------------------------------------------
diff --git a/webapp/app/partials/modelDesigner/model_info.html b/webapp/app/partials/modelDesigner/model_info.html
index 92c1ef0..ca7e231 100644
--- a/webapp/app/partials/modelDesigner/model_info.html
+++ b/webapp/app/partials/modelDesigner/model_info.html
@@ -19,49 +19,52 @@
 <div class="row">
     <div class="col-xs-8">
         <!--Project-->
-        <div class="form-group">
-            <div class="row">
-                <label class="col-xs-12 col-sm-3 control-label no-padding-right">
-                    <a ng-if="state.mode=='edit'" href="projects">
-                        <b>Project</b>
-                    </a>
-                    <b ng-if="state.mode=='view'" class="font-color-default">Project</b>
-                </label>
-                <div class="col-xs-12 col-sm-6">
-                    <input ng-if="state.mode=='edit'" name="project_name" type="text" class="form-control"
-                           ng-model="model.project"/>
-                    <span ng-if="state.mode=='view'">
-                        {{model.project}}
-                    </span>
+        <ng-form name="model_info_form" novalidate>
+            <div class="form-group">
+                <div class="row">
+                    <label class="col-xs-3 control-label no-padding-right">
+                        <a ng-if="state.mode=='edit'" href="projects">
+                            <b>Project</b>
+                        </a>
+                        <b ng-if="state.mode=='view'" class="font-color-default">Project</b>
+                    </label>
+                    <div class="col-xs-6" ng-class="model_info_form.project_name.$invalid?'has-error':model_info_form.project_name.$dirty?'has-success':''">
+                         <!--edit-->
+                        <input ng-if="state.mode=='edit'" required name="project_name" type="text" class="form-control"
+                               ng-model="model.project"/>
+                        <small class="help-block" ng-show="model_info_form.project_name.$error.required">The project is required</small>
+
+                        <!--view-->
+                        <span ng-if="state.mode=='view'">
+                            {{model.project}}
+                        </span>
+                    </div>
                 </div>
             </div>
-        </div>
 
-        <!--Model Name-->
-        <div class="form-group">
-            <div class="row">
-                <label class="col-xs-12 col-sm-3 control-label no-padding-right font-color-default">
-                    <b>Model Name</b>
-                </label>
+            <!--Model Name-->
+            <div class="form-group">
+                <div class="row">
+                    <label class="col-xs-12 col-sm-3 control-label no-padding-right font-color-default">
+                        <b>Model Name</b>
+                    </label>
 
-                <div class="col-xs-12 col-sm-6">
-                    <input ng-if="state.mode=='edit'" name="model_name" type="text" class="form-control"
-                           ng-model="model.name" required
-                           placeholder="You can use letters, numbers, and '_'"
-                           ng-maxlength=100 ng-pattern="/^\w+$/" />
-                    <span ng-if="state.mode=='view'">{{model.name}}</span>
-                </div>
-                <div class="col-xs-12 col-sm-3">
-                    <div class="text-warning" ng-if="design_form.model_name.$error.required  && design_form.model_name.$dirty">
-                        Model name is required.
-                    </div>
-                    <div class="text-warning" ng-if="design_form.model_name.$invalid && design_form.model_name.$dirty && !design_form.model_name.$error.required">
-                        Model name is invalid.
+                    <div class="col-xs-12 col-sm-6" ng-class="model_info_form.model_name.$invalid?'has-error':model_info_form.model_name.$dirty?'has-success':''">
+
+                        <!-- edit -->
+                        <input ng-if="state.mode=='edit'" name="model_name" type="text" class="form-control"
+                               ng-model="model.name" required
+                               placeholder="You can use letters, numbers, and '_'"
+                               ng-maxlength=100 ng-pattern="/^\w+$/" />
+                        <small class="help-block" ng-show="model_info_form.model_name.$error.required  && model_info_form.model_name.$dirty">Model name is required.</small>
+                        <small class="help-block" ng-show="model_info_form.model_name.$invalid && model_info_form.model_name.$dirty && !model_info_form.model_name.$error.required"> Model name is invalid.</small>
+
+
+                        <span ng-if="state.mode=='view'">{{model.name}}</span>
                     </div>
                 </div>
             </div>
-        </div>
-
+        </ng-form>
     </div>
 
     <!--Tips-->
@@ -83,3 +86,20 @@
         </div>
     </div>
 </div>
+
+<div class="row" ng-hide="true">
+    <div class="col-xs-8">
+    <div class="box box-danger">
+        <div class="box-header with-border">
+            <i class="fa fa-warning"></i>
+            <h3 class="box-title">Warning!</h3>
+        </div>
+        <div class="box-body callout callout-warning">
+            <ol>
+                <li>Project can't be empty</li>
+                <li>Model Name can't be empty</li>
+            </ol>
+        </div><!-- /.box-body -->
+    </div>
+    </div>
+</div>
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/incubator-kylin/blob/725598fb/webapp/app/partials/models/model_schema.html
----------------------------------------------------------------------
diff --git a/webapp/app/partials/models/model_schema.html b/webapp/app/partials/models/model_schema.html
index 67adf69..ac607e6 100644
--- a/webapp/app/partials/models/model_schema.html
+++ b/webapp/app/partials/models/model_schema.html
@@ -22,14 +22,13 @@
         <h4 class="box-title text-info">Model Designer</h4>
     </div>
     <div class="box-body">
-        <ng-form name="design_form" ng-submit="">
             <!-- Add a mock button to avoid auto submit-->
             <button ng-click="" ng-show="false"></button>
             <div>
                 <ul class="wizard-steps">
                     <li ng-repeat="step in wizardSteps"
                         class="{{step==curStep?'active':''}} {{step.isComplete?'complete':''}}">
-                        <span style="cursor:pointer;" ng-click="goToStep($index)" class="step">{{step.step = ($index + 1)}}</span>
+                        <span style="cursor:pointer;" ng-click="goToStep($index,curStep.form)" class="step">{{step.step = ($index + 1)}}</span>
                         <span class="title">{{step.title}}</span>
                      </li>
                 </ul>
@@ -64,7 +63,6 @@
                     </div>
                 </div>
             </div>
-        </ng-form>
     </div>
 </div>
 

http://git-wip-us.apache.org/repos/asf/incubator-kylin/blob/725598fb/webapp/app/partials/tables/source_metadata.html
----------------------------------------------------------------------
diff --git a/webapp/app/partials/tables/source_metadata.html b/webapp/app/partials/tables/source_metadata.html
deleted file mode 100755
index 8e39c95..0000000
--- a/webapp/app/partials/tables/source_metadata.html
+++ /dev/null
@@ -1,194 +0,0 @@
-<!--
-* Licensed to the Apache Software Foundation (ASF) under one
-* or more contributor license agreements.  See the NOTICE file
-* distributed with this work for additional information
-* regarding copyright ownership.  The ASF licenses this file
-* to you under the Apache License, Version 2.0 (the
-* "License"); you may not use this file except in compliance
-* with the License.  You may obtain a copy of the License at
-*
-*     http://www.apache.org/licenses/LICENSE-2.0
-*
-* Unless required by applicable law or agreed to in writing, software
-* distributed under the License is distributed on an "AS IS" BASIS,
-* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-* See the License for the specific language governing permissions and
-* limitations under the License.
--->
-
-<div class="page-header" style="height: 50px;">
-    <!--Project-->
-    <form class="navbar-form navbar-left" style="margin-top: 0px !important;" ng-if="userService.isAuthorized()">
-        <div class="form-group">
-            <!--Project-->
-            <a class="btn btn-xs btn-info" href="projects" tooltip="Manage Project"><i class="fa fa-gears"></i></a>
-            <a class="btn btn-xs btn-primary" style="width: 29px" ng-if="userService.hasRole('ROLE_ADMIN')||userService.hasRole('ROLE_MODELER')&&kylinConfig.getDeployEnv()!=='PROD'" tooltip="Add Project" ng-click="toCreateProj()">
-                <i class="fa fa-plus"></i>
-            </a>
-
-        </div>
-    </form>
-</div>
-
-<div class="row" ng-controller="SourceMetaCtrl">
-    <!--table_tree-->
-    <div class="col-xs-3">
-        <div ng-include src="'partials/tables/source_table_tree.html'"></div>
-    </div>
-    <!--Tab-->
-    <div class="col-xs-9">
-        <h3 class="text-info">Table Schema:{{ tableModel.selectedSrcTable.name}}</h3>
-        <div class="tabbable nav-tabs-custom">
-            <ul class="nav nav-tabs">
-                <li class="active">
-                    <a data-toggle="tab" href="#column">Columns</a>
-                </li>
-                <li>
-                    <a data-toggle="tab" href="#schema">Extend Information</a>
-                </li>
-            </ul>
-            <div class="tab-content">
-                <!--Schema-->
-                <div id="schema" class="tab-pane">
-                    <div ng-if="tableModel.selectedSrcTable.uuid" class="table-responsive">
-                        <table class="table">
-                            <tbody>
-                                <tr>
-                                    <th style="width:20%">NAME</th>
-                                    <td>{{ tableModel.selectedSrcTable.name}}</td>
-                                </tr>
-                                <tr>
-                                    <th>Hive DATABASE</th>
-                                    <td>{{tableModel.selectedSrcTable.database}}</td>
-                                </tr>
-                                <tr>
-                                    <th>SNAPSHOT TIME</th>
-                                    <td>{{tableModel.selectedSrcTable.exd.lastUpdateTime | utcToConfigTimeZone}}</td>
-                                </tr>
-                                <tr>
-                                    <th>LOCATION</th>
-                                    <td>{{tableModel.selectedSrcTable.exd.location}}</td>
-                                </tr>
-                                <tr>
-                                    <th>INPUT FORMAT</th>
-                                    <td>{{tableModel.selectedSrcTable.exd.inputformat}}</td>
-                                </tr>
-                                <tr>
-                                    <th>OUTPUT FORMAT</th>
-                                    <td>{{tableModel.selectedSrcTable.exd.outputformat}}</td>
-                                </tr>
-                                <tr>
-                                    <th>OWNER</th>
-                                    <td><a href="mailto:{{tableModel.selectedSrcTable.exd.owner}}">{{tableModel.selectedSrcTable.exd.owner}}</a></td>
-                                </tr>
-                                <tr>
-                                    <th>TOTAL FILE NUMBER</th>
-                                    <td>{{tableModel.selectedSrcTable.exd.totalNumberFiles}}</td>
-                                </tr>
-                                <tr>
-                                    <th>TOTAL FILE SIZE</th>
-                                    <td>{{tableModel.selectedSrcTable.exd.totalFileSize}}</td>
-                                </tr>
-                                <tr>
-                                    <th>PARTITIONED</th>
-                                    <td>{{tableModel.selectedSrcTable.exd.partitioned}}</td>
-                                </tr>
-                                <tr>
-                                    <th>PARTITION COLUMNS</th>
-                                    <td>{{tableModel.selectedSrcTable.exd.partitionColumns}}</td>
-                                </tr>
-                            </tbody>
-                        </table>
-                    </div>
-                </div>
-                <!--Columns-->
-                <div id="column" class="tab-pane active">
-                    <div class="profile-user-info">
-                        <div>
-                            <label class="table-header-text">Columns</label>
-                            <span class="input-icon form-search nav-search pull-right">
-                                <input type="text" placeholder="Filter ..." class="nav-search-input" ng-model="columnName"/>
-                                <i class="ace-icon fa fa-search nav-search-icon"></i>
-                            </span>
-                        </div>
-                        <div class="space-6"></div>
-                        <div ng-if="(tableModel.selectedSrcTable.columns | filter: columnName).length>0">
-                            <table class="table table-hover table-striped list">
-                                <thead>
-                                <tr style="cursor: pointer">
-                                    <th ng-repeat="theaditem in tableConfig.theaditems"
-                                        ng-click="state.filterAttr= theaditem.attr;state.reverseColumn=theaditem.attr;state.filterReverse=!state.filterReverse;">
-                                        {{theaditem.name}}
-                                        <i ng-if="state.reverseColumn!= theaditem.attr"
-                                           class="fa fa-unsorted"></i>
-                                        <i ng-if="state.reverseColumn== theaditem.attr && !state.filterReverse"
-                                           class="fa fa-sort-asc"></i>
-                                        <i ng-if="state.reverseColumn== theaditem.attr && state.filterReverse"
-                                           class="fa fa-sort-desc"></i>
-                                    </th>
-                                </tr>
-                                </thead>
-
-                                <tr ng-repeat="column in tableModel.selectedSrcTable.columns | filter: columnName | orderObjectBy:state.filterAttr:state.filterReverse">
-                                    <td style="{{(tableModel.selectedSrcTable.selectedSrcColumn.id == column.id)? 'background-color:#EBF9FE':''}}">
-                                        {{ column.id}}
-                                    </td>
-                                    <td style="{{(tableModel.selectedSrcTable.selectedSrcColumn.id == column.id)? 'background-color:#EBF9FE':''}}">
-                                        {{ column.name}}
-                                    </td>
-                                    <td style="{{(tableModel.selectedSrcTable.selectedSrcColumn.id == column.id)? 'background-color:#EBF9FE':''}}">
-                                        {{ column.datatype}}
-                                    </td>
-                                    <td style="{{(tableModel.selectedSrcTable.selectedSrcColumn.id == column.id)? 'background-color:#EBF9FE':''}}">
-                                        <!--{{ tableModel.selectedSrcTable.cardinality[column.name]}}-->
-                                        {{column.cardinality}}
-                                    </td>
-                                </tr>
-                            </table>
-                        </div>
-                        <div ng-if="(tableModel.selectedSrcTable.columns | filter: columnName).length == 0" no-result
-                             text="No Matched Table Column."></div>
-                        <div ng-if="!!!tableModel.selectedSrcTable.uuid">
-                            <div no-result text="No Table Selected."></div>
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </div>
-    </div>
-
-
-    <!--show load hive table tip when no models list-->
-    <div ng-show="!models_treedata.length" style="margin-top:40px;">
-        <div class="box box-primary">
-            <div class="box-header with-border">
-                <h3 class="box-title">No tables</h3>
-            </div>
-            <div class="box-body">
-                <p>
-                    <a href="models/add" ng-if="userService.hasRole('ROLE_MODELER')">Click here to load your hive table</a>
-                </p>
-            </div><!-- /.box-body -->
-        </div>
-    </div>
-
-
-
-    <script type="text/ng-template" id="addHiveTable.html">
-        <div class="modal-header">
-            <h4>Load Hive Table Metadata</h4>
-        </div>
-        <div class="modal-body">
-            <span><strong>Project: </strong>{{ $parent.projectName!=null?$parent.projectName:'NULL'}}</span>
-            <label for="tables"> Table Names:(Seperate with comma)</label>
-            <textarea ng-model="$parent.tableNames" class="form-control" id="tables"
-                      placeholder="table1,table2  By default,system will choose 'Default' as database,you can specify database like this 'database.table'"></textarea>
-        </div>
-        <div class="modal-footer">
-            <button class="btn btn-primary" ng-click="add()">Sync</button>
-            <button class="btn btn-primary" ng-click="cancel()">Cancel</button>
-        </div>
-    </script>
-</div>
-
-<div ng-include="'partials/projects/project_create.html'"></div>