Matteo Scandolo | fb46ae6 | 2017-08-08 09:10:50 -0700 | [diff] [blame] | 1 | |
| 2 | /* |
| 3 | * Copyright 2017-present Open Networking Foundation |
| 4 | |
| 5 | * Licensed under the Apache License, Version 2.0 (the "License"); |
| 6 | * you may not use this file except in compliance with the License. |
| 7 | * You may obtain a copy of the License at |
| 8 | |
| 9 | * http://www.apache.org/licenses/LICENSE-2.0 |
| 10 | |
| 11 | * Unless required by applicable law or agreed to in writing, software |
| 12 | * distributed under the License is distributed on an "AS IS" BASIS, |
| 13 | * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. |
| 14 | * See the License for the specific language governing permissions and |
| 15 | * limitations under the License. |
| 16 | */ |
| 17 | |
| 18 | |
Matteo Scandolo | ee655a1 | 2016-12-19 15:38:43 -0800 | [diff] [blame] | 19 | // TODO clean this mess |
| 20 | |
| 21 | import * as _ from 'lodash'; |
| 22 | import {IXosFormHelpersService} from './form-helpers'; |
Matteo Scandolo | ee655a1 | 2016-12-19 15:38:43 -0800 | [diff] [blame] | 23 | |
Matteo Scandolo | 80c3a65 | 2017-01-06 10:48:31 -0800 | [diff] [blame] | 24 | export interface IXosFormAction { |
| 25 | label: string; |
| 26 | icon: string; |
| 27 | class: string; |
| 28 | cb(item: any, form: any): void; |
| 29 | } |
| 30 | |
| 31 | export interface IXosFeedback { |
| 32 | show: boolean; |
| 33 | message: string; |
| 34 | type: string; // NOTE is possible to enumerate success, error, warning, info? |
Matteo Scandolo | 6f45e26 | 2017-01-09 14:47:26 -0800 | [diff] [blame] | 35 | autoHide?: number; |
| 36 | closeBtn?: boolean; |
Matteo Scandolo | 80c3a65 | 2017-01-06 10:48:31 -0800 | [diff] [blame] | 37 | } |
| 38 | |
| 39 | export interface IXosFormInputValidator { |
| 40 | minlength?: number; |
| 41 | maxlength?: number; |
| 42 | required?: boolean; |
| 43 | min?: number; |
| 44 | max?: number; |
| 45 | custom?(value: any): any; |
| 46 | // do your validation here and return true | false |
| 47 | // alternatively you can return an array [errorName, true|false] |
| 48 | } |
| 49 | |
Matteo Scandolo | 07e2f62 | 2017-01-09 10:54:13 -0800 | [diff] [blame] | 50 | export interface IXosFormInputOptions { |
| 51 | id: number; |
| 52 | label: string; |
| 53 | } |
| 54 | |
Matteo Scandolo | 80c3a65 | 2017-01-06 10:48:31 -0800 | [diff] [blame] | 55 | export interface IXosFormInput { |
| 56 | name: string; |
| 57 | label: string; |
| 58 | type: string; // options are: [date, boolean, number, email, string, select], |
Matteo Scandolo | 6f45e26 | 2017-01-09 14:47:26 -0800 | [diff] [blame] | 59 | hint?: string; |
Matteo Scandolo | 80c3a65 | 2017-01-06 10:48:31 -0800 | [diff] [blame] | 60 | validators: IXosFormInputValidator; |
Matteo Scandolo | 07e2f62 | 2017-01-09 10:54:13 -0800 | [diff] [blame] | 61 | options?: IXosFormInputOptions[]; |
Matteo Scandolo | e7e052d | 2017-07-31 19:54:31 -0700 | [diff] [blame] | 62 | default?: any | null; |
Matteo Scandolo | 80c3a65 | 2017-01-06 10:48:31 -0800 | [diff] [blame] | 63 | } |
| 64 | |
Matteo Scandolo | 1aee198 | 2017-02-17 08:33:23 -0800 | [diff] [blame] | 65 | export interface IXosFormCfg { |
Matteo Scandolo | 80c3a65 | 2017-01-06 10:48:31 -0800 | [diff] [blame] | 66 | exclude?: string[]; |
| 67 | actions: IXosFormAction[]; |
| 68 | feedback?: IXosFeedback; |
| 69 | inputs: IXosFormInput[]; |
| 70 | formName: string; |
| 71 | } |
| 72 | |
Matteo Scandolo | ee655a1 | 2016-12-19 15:38:43 -0800 | [diff] [blame] | 73 | class FormCtrl { |
Matteo Scandolo | b2225a0 | 2017-04-11 15:23:04 -0700 | [diff] [blame] | 74 | $inject = ['$onInit', '$scope', 'XosFormHelpers']; |
Matteo Scandolo | ee655a1 | 2016-12-19 15:38:43 -0800 | [diff] [blame] | 75 | |
| 76 | public ngModel: any; |
Matteo Scandolo | ee655a1 | 2016-12-19 15:38:43 -0800 | [diff] [blame] | 77 | public formField: any; |
| 78 | private config: any; |
| 79 | |
| 80 | constructor ( |
| 81 | private $scope: ng.IScope, |
Matteo Scandolo | b2225a0 | 2017-04-11 15:23:04 -0700 | [diff] [blame] | 82 | private XosFormHelpers: IXosFormHelpersService |
Matteo Scandolo | ee655a1 | 2016-12-19 15:38:43 -0800 | [diff] [blame] | 83 | ) { |
Matteo Scandolo | ee655a1 | 2016-12-19 15:38:43 -0800 | [diff] [blame] | 84 | } |
| 85 | |
| 86 | $onInit() { |
| 87 | if (!this.config) { |
| 88 | throw new Error('[xosForm] Please provide a configuration via the "config" attribute'); |
| 89 | } |
| 90 | |
| 91 | if (!this.config.actions) { |
| 92 | throw new Error('[xosForm] Please provide an action list in the configuration'); |
| 93 | } |
| 94 | |
Matteo Scandolo | 80c3a65 | 2017-01-06 10:48:31 -0800 | [diff] [blame] | 95 | if (!this.config.formName) { |
| 96 | throw new Error('[xosForm] Please provide a formName property in the config'); |
| 97 | } |
| 98 | |
Matteo Scandolo | 6f45e26 | 2017-01-09 14:47:26 -0800 | [diff] [blame] | 99 | // NOTE needed to avoid xosAlert throw an error |
Matteo Scandolo | ee655a1 | 2016-12-19 15:38:43 -0800 | [diff] [blame] | 100 | if (!this.config.feedback) { |
| 101 | this.config.feedback = { |
| 102 | show: false, |
| 103 | message: 'Form submitted successfully !!!', |
Matteo Scandolo | 6f45e26 | 2017-01-09 14:47:26 -0800 | [diff] [blame] | 104 | type: 'success', |
| 105 | closeBtn: true |
Matteo Scandolo | ee655a1 | 2016-12-19 15:38:43 -0800 | [diff] [blame] | 106 | }; |
| 107 | } |
| 108 | |
Matteo Scandolo | 80c3a65 | 2017-01-06 10:48:31 -0800 | [diff] [blame] | 109 | // remove excluded inputs |
Matteo Scandolo | b2225a0 | 2017-04-11 15:23:04 -0700 | [diff] [blame] | 110 | if (angular.isDefined(this.config.exclude) && this.config.exclude.leading > 0) { |
| 111 | _.remove(this.config.inputs, i => this.config.exclude.indexOf(i.name) > -1); |
| 112 | } |
Matteo Scandolo | ee655a1 | 2016-12-19 15:38:43 -0800 | [diff] [blame] | 113 | } |
| 114 | } |
| 115 | |
| 116 | export const xosForm: angular.IComponentOptions = { |
| 117 | template: require('./form.html'), |
| 118 | controllerAs: 'vm', |
| 119 | controller: FormCtrl, |
| 120 | bindings: { |
| 121 | ngModel: '=', |
| 122 | config: '=' |
| 123 | } |
| 124 | }; |