#68 Added Link & RadioButtons components to Task generator
This commit is contained in:
parent
2a55d7f898
commit
2f870ba050
2 changed files with 116 additions and 12 deletions
|
|
@ -1,6 +1,8 @@
|
|||
angular.module('SeHub').controller('newTasksController', ['$scope',
|
||||
function($scope) {
|
||||
|
||||
$scope.newComp = {};
|
||||
$scope.newComp.isMandatory = false;
|
||||
|
||||
|
||||
$scope.componentTypes = [{
|
||||
|
|
@ -9,25 +11,105 @@ angular.module('SeHub').controller('newTasksController', ['$scope',
|
|||
"type": "textarea"
|
||||
}, {
|
||||
"type": "checkbox"
|
||||
}, {
|
||||
"type": "link"
|
||||
}, {
|
||||
"type": "radiobuttons"
|
||||
}];
|
||||
|
||||
$scope.task = {};
|
||||
$scope.task.task = {};
|
||||
$scope.task.components= [];
|
||||
$scope.task.isPersonal = false;
|
||||
$scope.task.components = [];
|
||||
$scope.task.isPersonal = false;
|
||||
|
||||
// $scope.task = [];
|
||||
|
||||
$scope.addComponent = function() {
|
||||
$scope.task.components.push($scope.newComp);
|
||||
var comp = {};
|
||||
var type = $scope.newComp.type;
|
||||
comp.type = type;
|
||||
comp.isMandatory = $scope.newComp.isMandatory;
|
||||
comp.label = "";
|
||||
var i = 0
|
||||
if (!(type === 'textbox' || type === 'textarea' || type === 'checkbox'))
|
||||
while ($scope.newComp.label[i]) {
|
||||
comp.label += $scope.newComp.label[i] + "|";
|
||||
i++;
|
||||
} else
|
||||
comp.label = $scope.newComp.label[i];
|
||||
|
||||
console.log(comp);
|
||||
$scope.task.components.push(comp);
|
||||
|
||||
// console.log($scope.newComp);
|
||||
$scope.newComp = {};
|
||||
$scope.newComp.isMandatory = false;
|
||||
$scope.compDetails = [];
|
||||
$scope.isRadioButton = false;
|
||||
}
|
||||
|
||||
$scope.dueTime = function(){
|
||||
if(!$scope.task.date || $scope.task.date === '')
|
||||
$scope.dueTimeFromNow = "";
|
||||
var d = new Date($scope.task.date);
|
||||
$scope.dueTimeFromNow = moment(d).fromNow();
|
||||
$scope.ComponentType = function(type) {
|
||||
if (type === 'textbox' || type === 'textarea' || type === 'checkbox')
|
||||
$scope.compDetails = [{
|
||||
detail: "Label"
|
||||
}];
|
||||
else if (type === 'radiobuttons') {
|
||||
$scope.compDetails = [{
|
||||
detail: "Label"
|
||||
}];
|
||||
$scope.compDetails.push({
|
||||
detail: "Option" + $scope.compDetails.length + ": "
|
||||
});
|
||||
} else if (type === 'link')
|
||||
$scope.compDetails = [{
|
||||
detail: "Label"
|
||||
}, {
|
||||
detail: "URL Path"
|
||||
}];
|
||||
|
||||
if (type === 'radiobuttons')
|
||||
$scope.isRadioButton = true;
|
||||
else
|
||||
$scope.isRadioButton = false;
|
||||
}
|
||||
|
||||
$scope.addMoreOptions = function() {
|
||||
$scope.compDetails.push({
|
||||
detail: "Option" + $scope.compDetails.length + ": "
|
||||
});
|
||||
}
|
||||
|
||||
$scope.dueTime = function() {
|
||||
if (!$scope.task.date || $scope.task.date === '')
|
||||
$scope.dueTimeFromNow = "";
|
||||
var d = new Date($scope.task.date);
|
||||
$scope.dueTimeFromNow = moment(d).fromNow();
|
||||
}
|
||||
|
||||
$scope.initLinkComp = function(component){
|
||||
var arr = component.label.split("|");
|
||||
for (var i = 0; i < arr.length - 1; i++) {
|
||||
if(i == 0)
|
||||
component.title = arr[i];
|
||||
else
|
||||
component.href = arr[i];
|
||||
};
|
||||
}
|
||||
|
||||
$scope.initRadioButtonsComp = function(component){
|
||||
var arr = component.label.split("|");
|
||||
component.values = [];
|
||||
for (var i = 0; i < arr.length - 1; i++) {
|
||||
if(i == 0)
|
||||
component.title = arr[i];
|
||||
else
|
||||
component.values.push({text: arr[i], id: i});
|
||||
};
|
||||
}
|
||||
|
||||
$scope.RB = function(comp){
|
||||
console.info(comp);
|
||||
}
|
||||
|
||||
}
|
||||
]);
|
||||
|
|
@ -46,16 +46,21 @@
|
|||
</div>
|
||||
<div>
|
||||
Select Type:
|
||||
<md-select placeholder="Component Type" ng-model="newComp.type">
|
||||
<md-select placeholder="Component Type" ng-model="newComp.type" ng-change="ComponentType(newComp.type)">
|
||||
<md-option ng-repeat="component in componentTypes" value="{{component.type}}">{{component.type}}</md-option>
|
||||
</md-select>
|
||||
</div>
|
||||
<div>
|
||||
<md-input-container>
|
||||
<label>Label</label>
|
||||
<input ng-model="newComp.label" required>
|
||||
<md-input-container ng-repeat="detail in compDetails">
|
||||
<label>{{detail.detail}}</label>
|
||||
<input ng-model="newComp.label[$index]" required>
|
||||
</md-input-container>
|
||||
</div>
|
||||
<div ng-if="isRadioButton">
|
||||
<md-button ng-click="addMoreOptions()" >
|
||||
Add An Option
|
||||
</md-button>
|
||||
</div>
|
||||
<div>
|
||||
<md-switch ng-model="newComp.isMandatory" aria-label="Switch 1">
|
||||
Mandatory?: {{ newComp.isMandatory}}
|
||||
|
|
@ -84,6 +89,9 @@
|
|||
<p>{{ dueTimeFromNow }}</p>
|
||||
<p>{{task.task.description}}</p>
|
||||
<p>{{(task.isPersonal) ? "Personal" : "Project"}} Task</p>
|
||||
|
||||
<md-divider ng-if="!$last"></md-divider>
|
||||
|
||||
<div ng-repeat="component in task.components">
|
||||
<!-- if text box -->
|
||||
<div ng-if="component.type == 'textbox'">
|
||||
|
|
@ -105,6 +113,20 @@
|
|||
{{ component.label}}
|
||||
</md-checkbox>
|
||||
</div>
|
||||
<!-- if Link -->
|
||||
<div ng-if="component.type == 'link'" layout="column" ng-init="initLinkComp(component)" style="width: 100%" layout-align="center">
|
||||
<md-button ng-href="{{component.href}}" style="width: 100%" target="_blank">
|
||||
<i class="fa fa-link"></i> {{component.title}}
|
||||
</md-button>
|
||||
</div>
|
||||
<!-- if RadioButtons -->
|
||||
<div ng-if="component.type == 'radiobuttons'" ng-init="initRadioButtonsComp(component)">
|
||||
{{component.title}}
|
||||
<md-radio-group ng-model="component.value" ng-change="RB(component)">
|
||||
<md-radio-button ng-repeat="option in component.values" value="{{option.text}}" class="md-primary">{{option.text}}</md-radio-button>
|
||||
</md-radio-group>
|
||||
</div>
|
||||
<md-divider ng-if="!$last"></md-divider>
|
||||
</div>
|
||||
</md-card>
|
||||
</div>
|
||||
|
|
|
|||
Loading…
Reference in a new issue