| <!-- |
| 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="container-fluid"> |
| <div class="row pageTitle"> |
| <h5 class="over-title margin-bottom-15">Register Data Asset</h5> |
| </div><!--//row--> |
| <div class="row"> |
| <form name="Form" id="form" novalidate> |
| <div id="wizard" class="swMain" > |
| <!-- <ul> |
| <li> |
| <a href="" class="onlyone selected" > |
| <div class="stepNumber"> |
| 1 |
| </div> |
| <span class="stepDesc text-small"> Configuration </span> |
| </a> |
| </ul> --> |
| |
| <div id="step-1" ng-show="currentStep == 1" class="formStep" > |
| <label class="stepDesc">Please setup the data asset required information.</label> |
| <div class="container-fluid"> |
| |
| <!-- schema definition list --> |
| <div class="col-md-12 col-lg-12 col-sm-12"> |
| <fieldset> |
| <legend> |
| Required Information |
| </legend> |
| <div class="y-scrollable"> |
| <div class="col-md-12 col-lg-12 col-sm-12"> |
| <div class="form-group" ng-class="{'has-error':Form.assetName.$dirty&&Form.assetName.$invalid, 'has-success':Form.assetName.$valid}"> |
| <label for="assetName" class="col-md-2 col-lg-2 col-sm-2 control-label"> |
| Asset Name<span class="symbol required"></span>: |
| </label> |
| |
| <div class="col-md-10 col-lg-10 col-sm-10 "> |
| <input type="text" class="form-control" ng-model="form.basic.assetName" id="assetName" name="assetName" placeholder="Please input the asset name, which should be your Hive table name" required ng-pattern="'([0-9a-zA-Z\\_\\-\\.])+'"> |
| <span class="error text-small block " ng-if="Form.assetName.$dirty && Form.assetName.$error.required">Asset Name is required.</span> |
| <span class="error text-small block " ng-if="Form.assetName.$dirty && Form.assetName.$error.pattern">Only letter, number, "-", "_" and "." are allowed</span> |
| </div> |
| </div> |
| </div> |
| <div class="col-md-12 col-lg-12 col-sm-12"> |
| <div class="form-group" ng-class="{'has-error':Form.typeSelector.$dirty&&Form.typeSelector.$invalid, 'has-success':Form.typeSelector.$valid}"> |
| <label for="typeSelector" class="col-md-2 col-lg-2 col-sm-2 control-label"> |
| Asset Type<span class="symbol required"></span>: |
| </label> |
| |
| <div class="col-md-10 col-lg-10 col-sm-10 "> |
| <select id="typeSelector" name="typeSelector" class="form-control" ng-model="form.basic.type" ng-change="updateHdfsPath(form.basic.type)" required> |
| <option value="">Please select...</option> |
| <option ng-repeat="row in assetTypeOptions" value="{{$index}}" >{{row}}</option> |
| </select> |
| </div> |
| </div> |
| </div> |
| <div class="col-md-12 col-lg-12 col-sm-12"> |
| <div class="form-group" ng-class="{'has-error':Form.path.$dirty&&Form.path.$invalid, 'has-success':Form.path.$valid}"> |
| <label for="path" class="col-md-2 col-lg-2 col-sm-2 control-label"> |
| HDFS Path<span class="symbol required"></span>: |
| </label> |
| |
| <div class="col-md-10 col-lg-10 col-sm-10 "> |
| <input type="text" class="form-control" ng-model="form.basic.path" id="path" name="path" placeholder="Please input the HDFS path(example: /user/b_des/yosha/dmg_complete)." required ng-pattern="regex"> |
| <span class="error text-small block " ng-if="Form.path.$dirty && Form.path.$error.required">Asset HDFS path is required.</span> |
| <span class="error text-small block" ng-if="Form.path.$error.pattern">Valid path pattern is "^\/\S(?:[0-9a-zA-Z\_\-]+\/?)+"</span> |
| </div> |
| </div> |
| </div> |
| <!-- <div class="col-md-12 col-lg-12 col-sm-12"> |
| <div class="form-group"> |
| <label class="col-md-2 col-lg-2 col-sm-2 control-label"> |
| Data folder pattern: |
| </label> |
| |
| <div class="col-md-10 col-lg-10 col-sm-10"> |
| <input type="text" class="form-control" ng-focus="showFormatInfo=true" ng-blur="showFormatInfo=false" ng-model="form.basic.folderFormat" placeholder="please input the sub folder name format where your data will be stored, such as 'dt=[YY][MM][DD]'" > |
| <span ng-show="showFormatInfo" class="bark-tooltiptext" >You can use [YY], [MM], [DD] and [HH], some examples here: <br/> |
| <b style="color:#77b300">[YYYY]/[MM]/[DD]/[HH]</b> means the hourly data could be located in the folder of "{{form.basic.path}}2016/02/03/16"<br/> |
| <b style="color:#77b300">[YY]-[MM]-[DD]</b> means the daily data could be located in the folder of "{{form.basic.path}}16-02-03" |
| </span> |
| </div> |
| </div> |
| </div> --> |
| <div class="col-md-12 col-lg-12 col-sm-12"> |
| <div class="form-group" ng-class="{'has-error':Form.platformSelector.$dirty&&Form.platformSelector.$invalid, 'has-success':Form.platformSelector.$valid}"> |
| <label for="platformSelector" class="col-md-2 col-lg-2 col-sm-2 control-label"> |
| Platform<span class="symbol required"></span>: |
| </label> |
| |
| <div class="col-md-10 col-lg-10 col-sm-10 "> |
| <input type="text" class="form-control" ng-model="form.basic.platform" disabled> |
| <!-- <select id="platformSelector" name="platformSelector" class="form-control" ng-model="form.basic.platform" ng-change="getSystemOptions(form.basic.platform)" required> |
| <option value="">Please select...</option> |
| <option ng-repeat="row in platformOptions" value="{{$index}}" >{{row.platform}}</option> |
| </select> --> |
| </div> |
| </div> |
| </div> |
| <div class="col-md-12 col-lg-12 col-sm-12"> |
| <div class="form-group" ng-class="{'has-error':Form.systemSelector.$dirty&&Form.systemSelector.$invalid, 'has-success':Form.systemSelector.$valid}"> |
| <label for="systemSelector" class="col-md-2 col-lg-2 col-sm-2 control-label"> |
| Organization<span class="symbol required"></span>: |
| </label> |
| |
| <div class="col-md-10 col-lg-10 col-sm-10 "> |
| <select id="systemSelector" name="systemSelector" class="form-control" ng-model="form.basic.system" required> |
| <option value="">Please select...</option> |
| <option ng-repeat="row in systemOptions" value="{{$index}}" >{{row}}</option> |
| </select> |
| </div> |
| </div> |
| </div> |
| <div class="col-md-12 col-lg-12 col-sm-12"> |
| <div class="form-group"> |
| <label class="col-md-2 col-lg-2 col-sm-2 control-label"> |
| Schema<span class="symbol required"></span>: |
| </label> |
| |
| <div class="col-md-10 col-lg-10 col-sm-10 "> |
| <div class="row"> |
| <label class="col-md-2 col-lg-2 col-sm-2 text-info">Name<span class="symbol required"></span></label> |
| <label class="col-md-2 col-lg-2 col-sm-2 text-info">Type<span class="symbol required"></span></label> |
| <label class="col-md-2 col-lg-2 col-sm-2 text-info">Description</label> |
| <label class="col-md-4 col-lg-4 col-sm-4 text-info">Sample</label> |
| <span class="col-md-2 col-lg-2 col-sm-2" style="cursor:pointer;" title="Add" ng-click="addSchema()"><i class="glyphicon glyphicon-plus"></i></span> |
| </div> |
| <div class="row" ng-repeat="item in form.basic.schema"> |
| <p> |
| <span class="col-md-2 col-lg-2 col-sm-2"> |
| <input type="text" name="{{'sname'+$index}}" class="form-control" placeholder="name" ng-model="item.name" required/> |
| </span> |
| <span class="col-md-2 col-lg-2 col-sm-2"> |
| <input type="text" name="{{'stype'+$index}}" class="form-control" placeholder="type" ng-model="item.type" required/> |
| </span> |
| <span class="col-md-2 col-lg-2 col-sm-2"> |
| <input type="text" class="form-control" placeholder="desc" ng-model="item.desc" /> |
| </span> |
| <span class="col-md-4 col-lg-4 col-sm-4"> |
| <input type="text" class="form-control" placeholder="sample" ng-model="item.sample" /> |
| </span> |
| <span class="col-md-2 col-lg-2 col-sm-2 mt5" style="cursor:pointer;" title="Remove" ng-click="form.basic.schema.length==1 || deleteSchema($index)"><i class="glyphicon glyphicon-remove" style="vertical-align: -webkit-baseline-middle;"></i></span> |
| </p> |
| </div> |
| </div> |
| </div> |
| </div> |
| <div class="col-md-12 col-lg-12 col-sm-12"> |
| <div class="form-group"> |
| <label class="col-md-2 col-lg-2 col-sm-2 control-label"> |
| Owner: |
| </label> |
| |
| <div class="col-md-10 col-lg-10 col-sm-10"> |
| <input type="text" class="form-control" ng-model="form.basic.owner" ng-init="form.basic.owner=ntAccount" disabled> |
| </div> |
| </div> |
| </div> |
| <!-- |
| <div class="col-md-12 col-lg-12 col-sm-12"> |
| <div class="form-group"> |
| <label class="col-md-2 col-lg-2 col-sm-2 control-label"> |
| Hive partition columns</span>: |
| </label> |
| |
| <div class="col-md-10 col-lg-10 col-sm-10 "> |
| <div class="row"> |
| <label class="col-md-2 col-lg-2 col-sm-2 text-info">Name</label> |
| <label class="col-md-2 col-lg-2 col-sm-2 text-info">format</label> |
| <span class="col-md-2 col-lg-2 col-sm-2" style="cursor:pointer;" title="Add" ng-click="addPatitionColumn()"><i class="glyphicon glyphicon-plus"></i></span> |
| </div> |
| <div class="row" ng-repeat="item in form.basic.partitions"> |
| <p> |
| <span class="col-md-2 col-lg-2 col-sm-2"> |
| <input type="text" name="{{'sname'+$index}}" class="form-control" placeholder="name" ng-model="item.name" required/> |
| </span> |
| |
| <span class="col-md-2 col-lg-3 col-sm-2"> |
| <select id="formatSelector" name="formatSelector+$index" class="form-control" ng-model="item.format" required> |
| <option ng-repeat="row in formatTypeOptions" value="{{row}}" >{{row}}</option> |
| </select> |
| </span> |
| <span class="col-md-2 col-lg-2 col-sm-2 mt5" style="cursor:pointer;" title="Remove" ng-click="form.basic.partitions.length==0 || deletePartition($index)"><i class="glyphicon glyphicon-remove" style="vertical-align: -webkit-baseline-middle;"></i></span> |
| </p> |
| </div> |
| </div> |
| </div> |
| </div> --> |
| |
| </div> |
| |
| </fieldset> |
| |
| </div> |
| |
| <div class="form-group btn-container" > |
| <button class="btn btn-primary btn-o next-step btn-wide pull-right" ng-click="form.submit(Form)"> |
| Submit |
| </button> |
| </div> |
| </div> |
| </div> |
| |
| <div class="modal fade" id="confirm-pu" role="dialog"> |
| <div class="modal-dialog modal-xg modal-lg"> |
| <div class="modal-content"> |
| <div class="modal-header"> |
| <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button> |
| <h4 class="modal-title">Save the data asset with the below information?</h4> |
| </div> |
| <div class="modal-body"> |
| <ng-include src="'/pages/dataassets/confirmation-dataasset.html'"/> |
| </div> |
| <div class="modal-footer"> |
| <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button> |
| <button type="button" class="btn btn-primary" ng-click="form.save()">Save</button> |
| </div> |
| </div> |
| </div> |
| </div> |
| </div> |
| </form> |
| </div><!--//row--> |
| </div> |
