<div id="page-title">
<h2 class="title-hero" ng-if="!isEdit">
{{'Create Tenant'|translate}}
</h2>
<h2 class="title-hero" ng-if="isEdit">
{{'Edit Tenant'|translate}}
</h2>
</div>
<div class="panel">
<div class="panel-body">
<div class="panel">
<div class="panel-heading">
<h4 class="panel-title">
{{'Basic Info'|translate}}
</h4>
</div>
<div class="panel-body">
<form role="form" name="tenantForm">
<div class="form-group row">
<label class="col-md-3 control-label required">{{"ID" | translate}}</label>
<div class="col-md-6">
<input ng-if="!isEdit" name="id" class="form-control" ng-model="tenant.id" required ng-pattern="/^[A-Za-z0-9]*$/" placeholder="{{'please input tenant id'|translate}}...." />
<span class="error" ng-messages="tenantForm.id.$touched && tenantForm.id.$error">
<span ng-message="required"> {{'tenant id is empty'|translate}}</span>
<span ng-message="pattern">{{'tenant id is invalid'|translate}} </span>
</span>
<input ng-if="isEdit" name="id" readonly class="form-control" ng-model="tenant.id" />
</div>
</div>
<div class="form-group row">
<label class="col-md-3 control-label required">{{"Name" | translate}}</label>
<div class="col-md-6">
<input name="name" class="form-control" maxlength="50" ng-model="tenant.name" required placeholder="{{'please input tenant name'|translate}}...." />
<span class="error" ng-messages="tenantForm.name.$touched && tenantForm.name.$error">
<span ng-message="required"> {{'tenant name is empty'|translate}}</span>
<span ng-message="maxlength"> {{'Name must be no more than 50 characters'|translate}}</span>
</span>
</div>
</div>
<div class="form-group row">
<label class="col-md-3 control-label">{{"Description" | translate}}</label>
<div class="col-md-6">
<input name="description" class="form-control" maxlength="500" ng-model="tenant.description" placeholder="{{'please input tenant description'|translate}}...." />
</div>
</div>
<div class="form-group row">
<label class="col-md-3 control-label">{{"Description" | translate}}</label>
<div class="col-md-6">
<div style="display: flex; align-items: flex-end">
<div class="container-flex">
<div class="flex-column">
<input class="filename form-control" type="text" readonly="readonly" ng-model="selectedFile.file.name">
</div>
<div style="margin-left: 5px;width: 60px;">
<label class="btn btn-default">
<input id="logoInput" type="file" nv-file-select uploader="uploader" accept="image/*" style="visibility: collapse;height: 0px;" multiple/>
浏览
</label>
</div>
<div style="margin-left: 5px;width: 60px;" ng-if="selectedFile">
<label class="btn btn-default">
<span ng-click="removeSelectedFile()">{{'CANCEL' | translate}}</span>
</label>
</div>
</div>
</div>
<div>
<img id="img_review" ng-src="{{tenant.logo | logoFilter}}" alt="{{'Invalid icon, please upload an alternative image'|translate}}" style="height:100px" ng-if="tenant.logo && uploader.queue.length === 0" />
<div ng-thumb file="selectedFile" width="128" height="128" ng-if="selectedFile"></div>
</div>
</div>
</div>
<!--<div class="form-group row">-->
<!--<label class="col-md-3 control-label">{{"Description" | translate}}</label>-->
<!--<div class="col-md-6" style="display: flex; align-items: flex-end">-->
<!--<img id="img_review" ng-src="{{tenant.logo | logoFilter}}" alt="{{'Invalid icon, please upload an alternative image'|translate}}" style="height:100px" ng-if="tenant.logo && uploader.queue.length === 0" />-->
<!--<div ng-thumb file="selectedFile" width="128" height="128" ng-if="selectedFile"></div>-->
<!--<input class="control-label" id="logoInput" type="file" nv-file-select uploader="uploader" accept="image/*" />-->
<!--<a ng-click="removeSelectedFile()" ng-if="selectedFile">{{'CANCEL' | translate}}</a>-->
<!--</div>-->
<!--</div>--> <!--<div class="form-group row">-->
<!--<label class="col-md-3 control-label">{{"Description" | translate}}</label>-->
<!--<div class="col-md-6" style="display: flex; align-items: flex-end">-->
<!--<div class="container-flex">-->
<!--<div class="flex-column">-->
<!--<input class="filename form-control" type="text" readonly="readonly" data-ng-model="selectedFile.file.name">-->
<!--</div>-->
<!--<div style="margin-left: 5px;width: 60px;">-->
<!--<div ng-thumb file="selectedFile" width="128" height="128" ng-if="selectedFile"></div>-->
<!--<label class="btn btn-default">-->
<!--<input id="thumbnailInput" type="file" nv-file-select uploader="uploader" accept="image/*" style="visibility: collapse;height: 0px;">-->
<!--浏览-->
<!--</label>-->
<!--<a ng-click="removeSelectedFile()" ng-if="selectedFile">{{'CANCEL' | translate}}</a>-->
<!--</div>-->
<!--</div>-->
<!--</div>-->
<!--</div>-->
<div class="form-group row">
<div class="col-md-offset-3 col-md-6">
<p class="help-block" style="font-size: 12px;">{{'Image in scale 200 * 54 is best' | translate}}</p>
</div>
</div>
</form>
</div>
</div>
<div class="pull-right">
<button type="button" class="btn btn-primary" ng-if="(isEdit && tenantPermissionUpdate) || (!isEdit && tenantPermissionCreate)" ng-click="submit(tenant)" ng-disabled="tenantForm.$invalid">{{'Save'|translate}}
</button>
<button type="button" class="btn btn-link" ng-click="back()">{{'Back'|translate}}</button>
</div>
</div>
</div>
/* Copyright 2016 Qianyun, Inc. All rights reserved. -- Qianyun Confidential */
/*
*
*/ 'use strict'; angular.module('yacmpApp').controller('TenantEditController', ['$scope', '$window', 'DataService', 'UtilService',
'$uibModal', '$stateParams', '$q', '$timeout', '$location', '$translate', '$filter', 'permissionService', 'commonService', 'FileUploader', function ($scope, $window, DataService, UtilService, $uibModal, $stateParams, $q, $timeout, $location, $translate,
$filter, permissionService, commonService, FileUploader) {
$scope.table_columns_user = ["User Id", "Name", "Email", "Role"]; $scope.isEdit = false;
$scope.tenant = {}; var uploader = $scope.uploader = new FileUploader({
url: UtilService.getBaseUrl() + "/icon/upload",
queueLimit: 1
}); uploader.filters.push({
name: 'imageFilter',
fn: function(item, options) {
var type = '|' + item.type.slice(item.type.lastIndexOf('/') + 1) + '|';
return '|jpg|png|jpeg|bmp|gif|'.indexOf(type) !== -1;
}
}); $scope.removeSelectedFile = function(item) {
$scope.selectedFile = null;
$scope.uploader.clearQueue();
}; uploader.onAfterAddingFile = function(item) {
$scope.selectedFile = item;
$scope.$digest();
}; uploader.onWhenAddingFileFailed = function(item, filter, options) {
if (filter.name === "queueLimit") {
uploader.clearQueue(); // NOTE: the angular-file-upload has one trick bug, the item here is now is FileLikeObject but
// not File, so use input element here as a workaround.
var files = $("#logoInput")[0].files;
if (files) {
uploader.addToQueue(files[0], filter, options);
}
}
}; var id = $stateParams.id; if ($stateParams.id) {
$scope.isEdit = true;
DataService.get(CONSTANTS.SERVICE_TENANT_MGMT.PATH + "/" + id + "/with-users").success(function (tenant, status) {
$scope.tenant = tenant;
var requestParam = {};
requestParam.hierarchy = $scope.hierarchy;
requestParam.hierarchyInstanceId = $stateParams.id; }).error(function (data, status, headers, config) {
UtilService.alert($scope,"Couldn't load the tenant, error#",data);
});
} function postTenant(tenant) {
if ($scope.isEdit) {
//update tenant
DataService.put(CONSTANTS.SERVICE_TENANT_MGMT.PATH + "/" + tenant.id, tenant)
.then(function successCallback() {
UtilService.showMessage('Tenant saved', function () {
$location.path('/main/admin/tenant');
}, "SUCCESS");
}, function errorCallback(data) {
UtilService.alert($scope, "Couldn't edit tenant, error#", data);
});
} else {
//create a new tenant
DataService.post(CONSTANTS.SERVICE_TENANT_MGMT.PATH, tenant)
.then(function successCallback() {
UtilService.showMessage('Tenant created', function () {
$location.path('/main/admin/tenant');
}, "SUCCESS");
}, function errorCallback(data) {
UtilService.alert($scope,"Couldn't create tenant, error#",data);
});
}
} $scope.submit = function (tenant) {
if (uploader.queue.length > 0) {
uploader.uploadAll();
uploader.onCompleteItem = function(fileItem, response, status, headers) {
console.info('onCompleteItem, response:', response);
tenant.logo = response;
postTenant(tenant);
};
} else {
postTenant(tenant);
} }; $scope.back = function() {
$location.path('/main/admin/tenant');
}; permissionService.tenantPermission.update.then(
function(permission) {
$scope.tenantPermissionUpdate = permission;
}, function(reject) {
$scope.tenantPermissionUpdate = false;
}
); permissionService.tenantPermission.create.then(
function(permission) {
$scope.tenantPermissionCreate = permission;
}, function(reject) {
$scope.tenantPermissionCreate = false;
}
);
}
]
);