Repository: kylin Updated Branches: refs/heads/2.0-rc 4d1fee75f -> e075d0661
KYLIN-1338, UI multiple select checkbox lose focus issue Project: http://git-wip-us.apache.org/repos/asf/kylin/repo Commit: http://git-wip-us.apache.org/repos/asf/kylin/commit/e075d066 Tree: http://git-wip-us.apache.org/repos/asf/kylin/tree/e075d066 Diff: http://git-wip-us.apache.org/repos/asf/kylin/diff/e075d066 Branch: refs/heads/2.0-rc Commit: e075d066143d07f0c5a098927aa75760e1e73e44 Parents: 4d1fee7 Author: jian <zhongj...@apache.org> Authored: Tue Jan 19 19:22:43 2016 +0800 Committer: jian <zhongj...@apache.org> Committed: Tue Jan 19 19:23:10 2016 +0800 ---------------------------------------------------------------------- webapp/app/index.html | 3 +++ webapp/app/js/app.js | 2 +- .../partials/cubeDesigner/advanced_settings.html | 19 ++++++++++++------- webapp/app/partials/cubeDesigner/info.html | 6 +++--- .../partials/modelDesigner/model_dimensions.html | 17 ++++++++++------- .../partials/modelDesigner/model_measures.html | 18 ++++++++++++------ webapp/bower.json | 3 ++- webapp/grunt.json | 3 +++ 8 files changed, 46 insertions(+), 25 deletions(-) ---------------------------------------------------------------------- http://git-wip-us.apache.org/repos/asf/kylin/blob/e075d066/webapp/app/index.html ---------------------------------------------------------------------- diff --git a/webapp/app/index.html b/webapp/app/index.html index f02c0a7..11ca283 100644 --- a/webapp/app/index.html +++ b/webapp/app/index.html @@ -45,6 +45,7 @@ <link rel="stylesheet" type="text/css" href="components/bootstrap-sweetalert/lib/sweet-alert.css"> <link rel="stylesheet" type="text/css" href="components/angular-bootstrap-nav-tree/dist/abn_tree.css"> <link rel="stylesheet" type="text/css" href="components/angular-toggle-switch/angular-toggle-switch.css"> + <link rel="stylesheet" type="text/css" href="components/angular-ui-select/dist/select.css"> <link rel="stylesheet/less" href="less/build.less"> <!-- endref --> @@ -103,6 +104,8 @@ <script src="components/jquery-ui/jquery-ui.min.js"></script> <script src="components/angular-ui-sortable/sortable.js"></script> <script src="components/angular-toggle-switch/angular-toggle-switch.js"></script> +<script src="components/angular-ui-select/dist/select.js"></script> +<script src="components/angular-sanitize/angular-sanitize.js"></script> <script src="js/app.js"></script> <script src="js/config.js"></script> http://git-wip-us.apache.org/repos/asf/kylin/blob/e075d066/webapp/app/js/app.js ---------------------------------------------------------------------- diff --git a/webapp/app/js/app.js b/webapp/app/js/app.js index dc9d087..817d24d 100644 --- a/webapp/app/js/app.js +++ b/webapp/app/js/app.js @@ -17,4 +17,4 @@ */ //Kylin Application Module -KylinApp = angular.module('kylin', ['ngRoute', 'ngResource', 'ngGrid', 'ui.bootstrap', 'ui.ace', 'base64', 'angularLocalStorage', 'localytics.directives', 'treeControl', 'nvd3ChartDirectives','ngLoadingRequest','oitozero.ngSweetAlert','ngCookies','angular-underscore', 'ngAnimate', 'ui.sortable','angularBootstrapNavTree','toggle-switch']); +KylinApp = angular.module('kylin', ['ngRoute', 'ngResource', 'ngGrid', 'ui.bootstrap', 'ui.ace', 'base64', 'angularLocalStorage', 'localytics.directives', 'treeControl', 'nvd3ChartDirectives','ngLoadingRequest','oitozero.ngSweetAlert','ngCookies','angular-underscore', 'ngAnimate', 'ui.sortable','angularBootstrapNavTree','toggle-switch','ngSanitize','ui.select']); http://git-wip-us.apache.org/repos/asf/kylin/blob/e075d066/webapp/app/partials/cubeDesigner/advanced_settings.html ---------------------------------------------------------------------- diff --git a/webapp/app/partials/cubeDesigner/advanced_settings.html b/webapp/app/partials/cubeDesigner/advanced_settings.html index eed5a26..50b40ca 100755 --- a/webapp/app/partials/cubeDesigner/advanced_settings.html +++ b/webapp/app/partials/cubeDesigner/advanced_settings.html @@ -37,13 +37,18 @@ <b>{{($index + 1)}}</b> </td> <td class="col-xs-11"> - <!-- Dimensions --> - <select ng-if="state.mode=='edit'" style="width: 100%" - ng-model="aggregation_groups" chosen multiple - ng-change="refreshAggregationGroup(cubeMetaFrame.rowkey.aggregation_groups, $index, aggregation_groups)" - ng-options="rowkey_column.column as rowkey_column.column for rowkey_column in cubeMetaFrame.rowkey.rowkey_columns"> - <option value=""></option> - </select> + + <ui-select + autofocus="true" + on-select="refreshAggregationGroup(cubeMetaFrame.rowkey.aggregation_groups, $index, aggregation_groups)" + on-remove="refreshAggregationGroup(cubeMetaFrame.rowkey.aggregation_groups, $index, aggregation_groups)" + ng-if="state.mode=='edit'" style="width: 100%" multiple ng-model="aggregation_groups"> + <ui-select-match placeholder="Select Column...">{{$item.column}}</ui-select-match> + <ui-select-choices + repeat="rowkey_column.column as rowkey_column in cubeMetaFrame.rowkey.rowkey_columns | filter:$select.search"> + {{rowkey_column.column}} + </ui-select-choices> + </ui-select> <p ng-if="state.mode=='view'">{{aggregation_groups}}</p> </td> <td ng-if="state.mode=='edit'" class="col-xs-1"> http://git-wip-us.apache.org/repos/asf/kylin/blob/e075d066/webapp/app/partials/cubeDesigner/info.html ---------------------------------------------------------------------- diff --git a/webapp/app/partials/cubeDesigner/info.html b/webapp/app/partials/cubeDesigner/info.html index a2b2996..e45321a 100644 --- a/webapp/app/partials/cubeDesigner/info.html +++ b/webapp/app/partials/cubeDesigner/info.html @@ -26,8 +26,8 @@ <b>Model Name</b> </label> <div class="col-xs-12 col-sm-6" ng-class="{'has-error':forms.cube_info_form.model_name.$invalid && (forms.cube_info_form.model_name.$dirty||forms.cube_info_form.model_name.$sbumitted)}"> - <select chosen ng-model="cubeMetaFrame.model_name" ng-if="state.mode=='edit'" - ng-options="model for model in modelsManager.modelNameList" + <select chosen ng-model="cubeMetaFrame.model_name" ng-if="cubeMode=='addNewCube'" + ng-options="model for model in modelsManager.modelNameList" style="width:100%;" name="model_name" ng-disabled="{{isEdit}}" @@ -36,7 +36,7 @@ class="chosen-select"> <option value=""> -- Choose Model -- </option> </select> - + <input ng-model="cubeMetaFrame.model_name" ng-disabled="true" class="form-control" ng-if="cubeMode=='editExistCube'"/> <small class="help-block" ng-show="forms.cube_info_form.model_name.$error.required && (forms.cube_info_form.model_name.$dirty||forms.cube_info_form.$sbumitted)">Model name is required.</small> <span ng-if="state.mode=='view'">{{cubeMetaFrame.model_name}}</span> </div> http://git-wip-us.apache.org/repos/asf/kylin/blob/e075d066/webapp/app/partials/modelDesigner/model_dimensions.html ---------------------------------------------------------------------- diff --git a/webapp/app/partials/modelDesigner/model_dimensions.html b/webapp/app/partials/modelDesigner/model_dimensions.html index c9aa04a..9574d2b 100644 --- a/webapp/app/partials/modelDesigner/model_dimensions.html +++ b/webapp/app/partials/modelDesigner/model_dimensions.html @@ -69,13 +69,16 @@ {{dimension.table}} </td> <td class="col-xs-9"> - <!-- Dimensions --> - <select ng-if="state.mode=='edit'" style="width: 100%" - ng-model="modelsManager.selectedModel.dimensions[$index].columns" chosen multiple - ng-change="" - ng-options="column.name as column.name for column in getColumnsByTable(dimension.table)"> - <option value=""></option> - </select> + <ui-select + ng-if="state.mode=='edit'" style="width: 100%" + autofocus="true" + ng-model="modelsManager.selectedModel.dimensions[$index].columns" multiple> + <ui-select-match placeholder="Select Column...">{{$item.name}}</ui-select-match> + <ui-select-choices + repeat="column.name as column in getColumnsByTable(dimension.table) | filter:$select.search"> + {{column.name}} + </ui-select-choices> + </ui-select> </td> </tr> </table> http://git-wip-us.apache.org/repos/asf/kylin/blob/e075d066/webapp/app/partials/modelDesigner/model_measures.html ---------------------------------------------------------------------- diff --git a/webapp/app/partials/modelDesigner/model_measures.html b/webapp/app/partials/modelDesigner/model_measures.html index 039132d..2952bc7 100644 --- a/webapp/app/partials/modelDesigner/model_measures.html +++ b/webapp/app/partials/modelDesigner/model_measures.html @@ -42,12 +42,18 @@ </table> <div ng-if="state.mode=='edit'" class="form-group" style="width: 100%"> <h3 class="box-title">Select your measures</h3> - <select style="width: 100%" - ng-model="modelsManager.selectedModel.metrics" chosen multiple - ng-change="" - ng-options="measure.name as measure.name for measure in getColumnsByTable(modelsManager.selectedModel.fact_table)"> - <option value=""></option> - </select> + <ui-select + ng-if="state.mode=='edit'" + style="width: 100%" + autofocus="true" + ng-model="modelsManager.selectedModel.metrics" multiple> + <ui-select-match placeholder="Select Column...">{{$item.name}}</ui-select-match> + <ui-select-choices + repeat="measure.name as measure in getColumnsByTable(modelsManager.selectedModel.fact_table) | filter:$select.search"> + {{measure.name}} + </ui-select-choices> + </ui-select> + </div> </div> http://git-wip-us.apache.org/repos/asf/kylin/blob/e075d066/webapp/bower.json ---------------------------------------------------------------------- diff --git a/webapp/bower.json b/webapp/bower.json index ab3ad28..c9a713c 100755 --- a/webapp/bower.json +++ b/webapp/bower.json @@ -30,7 +30,8 @@ "angular-bootstrap-nav-tree": "*", "components-font-awesome": "~4.3.0", "bootstrap-sweetalert": "~0.4.3", - "angular-toggle-switch":"1.3.0" + "angular-ui-select": "0.13.2", + "angular-sanitize": "1.2.18" }, "devDependencies": { "less.js": "~1.4.0", http://git-wip-us.apache.org/repos/asf/kylin/blob/e075d066/webapp/grunt.json ---------------------------------------------------------------------- diff --git a/webapp/grunt.json b/webapp/grunt.json index ef56991..3219b5e 100755 --- a/webapp/grunt.json +++ b/webapp/grunt.json @@ -41,6 +41,8 @@ "app/components/jquery-ui/jquery-ui.min.js", "app/components/angular-ui-sortable/sortable.js", "app/components/angular-toggle-switch/angular-toggle-switch.js", + "app/components/angular-ui-select/dist/select.js", + "app/components/angular-sanitize/angular-sanitize.js", "tmp/js/scripts.js" ], "dest": "tmp/js/scripts.min.js" @@ -63,6 +65,7 @@ "app/components/bootstrap-sweetalert/lib/sweet-alert.css", "app/components/angular-bootstrap-nav-tree/dist/abn_tree.css", "app/components/angular-toggle-switch/angular-toggle-switch.css", + "app/components/angular-ui-select/dist/select.css", "tmp/css/styles.css" ], "dest": "tmp/css/styles.min.css"
