#1128 User view directive first version
This commit is contained in:
Gerard
parent
d65a6fd59e
commit
8fa7abe191
|
|
@ -0,0 +1,32 @@
|
|||
module.exports = function(Self) {
|
||||
Self.remoteMethodCtx('getConfig', {
|
||||
description: 'returns the information from UserConfig model for the active user',
|
||||
accepts: [
|
||||
{
|
||||
arg: 'ctx',
|
||||
type: 'Object',
|
||||
http: {source: 'context'}
|
||||
}, {
|
||||
arg: 'tableCode',
|
||||
type: 'String',
|
||||
description: `Code of the table you ask its configuration`
|
||||
}
|
||||
],
|
||||
returns: {
|
||||
type: 'object',
|
||||
root: true
|
||||
},
|
||||
http: {
|
||||
path: `/getConfig`,
|
||||
verb: 'get'
|
||||
}
|
||||
});
|
||||
|
||||
Self.getConfig = async ctx => {
|
||||
let userView = await Self.app.models.UserConfigView.findOne({
|
||||
where: {tableCode: ctx.args.tableCode, userFk: ctx.req.accessToken.userId}
|
||||
});
|
||||
|
||||
return userView;
|
||||
};
|
||||
};
|
||||
|
|
@ -0,0 +1,34 @@
|
|||
module.exports = function(Self) {
|
||||
Self.remoteMethodCtx('save', {
|
||||
description: 'returns the information from UserConfig model for the active user',
|
||||
accepts: [{
|
||||
arg: 'config',
|
||||
type: 'Object',
|
||||
required: true,
|
||||
description: `Code of the table you ask its configuration`,
|
||||
http: {source: 'body'}
|
||||
}
|
||||
],
|
||||
returns: {
|
||||
type: 'object',
|
||||
root: true
|
||||
},
|
||||
http: {
|
||||
path: `/save`,
|
||||
verb: 'post'
|
||||
}
|
||||
});
|
||||
|
||||
Self.save = async(ctx, config) => {
|
||||
let userView = await Self.app.models.UserConfigView.findOne({
|
||||
where: {tableCode: config.tableCode, userFk: ctx.req.accessToken.userId}
|
||||
});
|
||||
|
||||
if (userView)
|
||||
return userView.updateAttributes(config);
|
||||
|
||||
config.userFk = ctx.req.accessToken.userId;
|
||||
|
||||
return await Self.app.models.UserConfigView.create(config);
|
||||
};
|
||||
};
|
||||
|
|
@ -0,0 +1,4 @@
|
|||
module.exports = Self => {
|
||||
require('../methods/user-config-view/getConfig')(Self);
|
||||
require('../methods/user-config-view/save')(Self);
|
||||
};
|
||||
|
|
@ -9,7 +9,10 @@
|
|||
"properties": {
|
||||
"id": {
|
||||
"id": true,
|
||||
"type": "Number",
|
||||
"type": "Number"
|
||||
},
|
||||
"userFk": {
|
||||
"type": "String",
|
||||
"required": true
|
||||
},
|
||||
"tableCode": {
|
||||
|
|
@ -17,7 +20,7 @@
|
|||
"required": true
|
||||
},
|
||||
"configuration": {
|
||||
"type": "String"
|
||||
"type": "Object"
|
||||
}
|
||||
},
|
||||
"relations": {
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
<div>
|
||||
<div class="table">
|
||||
<vn-empty-rows ng-if="$ctrl.model && !$ctrl.model.data" translate>
|
||||
Enter a new search
|
||||
</vn-empty-rows>
|
||||
|
|
|
|||
|
|
@ -10,7 +10,7 @@ export default class Table {
|
|||
this.autoLoad = true;
|
||||
|
||||
$transclude($scope.$parent, clone => {
|
||||
angular.element($element[0].querySelector('div')).append(clone);
|
||||
angular.element($element[0].querySelector('.table')).append(clone);
|
||||
});
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -10,3 +10,4 @@ import './visible-by';
|
|||
import './bind';
|
||||
import './repeat-last';
|
||||
import './title';
|
||||
import './uvc';
|
||||
|
|
|
|||
|
|
@ -0,0 +1,30 @@
|
|||
<div style="position: relative;">
|
||||
<div style="position: absolute; top: 0; left: 0; padding: .5em; z-index: 1">
|
||||
<vn-icon-button
|
||||
icon="menu"
|
||||
style="font-size: .4em;"
|
||||
ng-click="$ctrl.showUvc($event)">
|
||||
</vn-icon-button>
|
||||
<vn-dialog
|
||||
class="modal-form"
|
||||
vn-id="uvc">
|
||||
<tpl-body>
|
||||
<vn-horizontal pad-medium class="header">
|
||||
<h5><span translate>Fields to show</span></h5>
|
||||
</vn-horizontal>
|
||||
<div pad-medium>
|
||||
<vn-horizontal ng-repeat="field in fields">
|
||||
<vn-check
|
||||
vn-one label="{{field}}"
|
||||
field="tableConfiguration.configuration[field]">
|
||||
</vn-check>
|
||||
</vn-horizontal>
|
||||
<vn-button
|
||||
label="Save"
|
||||
ng-click="$ctrl.saveConfiguration(tableConfiguration)">
|
||||
</vn-button>
|
||||
</div>
|
||||
</tpl-body>
|
||||
</vn-dialog>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -0,0 +1,95 @@
|
|||
import ngModule from '../module';
|
||||
import template from './uvc.html';
|
||||
|
||||
directive.$inject = ['$http', '$compile', 'vnApp', '$translate'];
|
||||
export function directive($http, $compile, vnApp, $translate) {
|
||||
function getHeaderList($element, $scope) {
|
||||
let allHeaders = $element[0].querySelectorAll(`vn-th[field], vn-th[th-id]`);
|
||||
let headerList = Array.from(allHeaders);
|
||||
let ids = [];
|
||||
|
||||
headerList.forEach(header => {
|
||||
ids.push(header.getAttribute('th-id') || header.getAttribute('field'));
|
||||
});
|
||||
|
||||
$scope.fields = ids;
|
||||
|
||||
return headerList;
|
||||
}
|
||||
|
||||
function getTableConfig(tableCode) {
|
||||
return $http.get(`/api/UserConfigViews/getConfig?tableCode=${tableCode}`);
|
||||
}
|
||||
|
||||
function createViewConfig(config, fields) {
|
||||
fields.forEach(field => {
|
||||
if (config.configuration[field] == null)
|
||||
config.configuration[field] = true;
|
||||
});
|
||||
}
|
||||
|
||||
function addHideClass($scope, headerList, userConfig) {
|
||||
let selectors = [];
|
||||
Object.keys(userConfig.configuration).forEach(key => {
|
||||
let index;
|
||||
if (userConfig.configuration[key] === false) {
|
||||
index = headerList.findIndex(el => {
|
||||
return (el.getAttribute('th-id') == key || el.getAttribute('field') == key);
|
||||
});
|
||||
|
||||
let baseSelector = `vn-table[vn-uvc=${userConfig.tableCode}] > div`;
|
||||
selectors.push(`${baseSelector} vn-thead > vn-tr > vn-th:nth-child(${index + 1})`);
|
||||
selectors.push(`${baseSelector} vn-tbody > vn-tr > vn-td:nth-child(${index + 1})`);
|
||||
selectors.push(`${baseSelector} vn-tbody > .vn-tr > vn-td:nth-child(${index + 1})`);
|
||||
}
|
||||
});
|
||||
|
||||
let rule = selectors.join(', ') + '{display: none;}';
|
||||
if ($scope.css)
|
||||
document.head.removeChild($scope.css);
|
||||
|
||||
$scope.css = document.createElement('style');
|
||||
document.head.appendChild($scope.css);
|
||||
$scope.css.appendChild(document.createTextNode(rule));
|
||||
}
|
||||
|
||||
function saveConfiguration(tableConfiguration) {
|
||||
tableConfiguration.configuration = JSON.parse(JSON.stringify(tableConfiguration.configuration));
|
||||
return $http.post(`/api/UserConfigViews/save`, tableConfiguration);
|
||||
}
|
||||
|
||||
return {
|
||||
restrict: 'A',
|
||||
link: async function($scope, $element, $attrs) {
|
||||
let cTemplate = $compile(template)($scope)[0];
|
||||
$scope.$ctrl.showUvc = event => {
|
||||
event.preventDefault();
|
||||
event.stopImmediatePropagation();
|
||||
$scope.uvc.show();
|
||||
};
|
||||
|
||||
let tableCode = $attrs.vnUvc.trim();
|
||||
let headerList = getHeaderList($element, $scope);
|
||||
|
||||
let defaultConfigView = {tableCode: tableCode, configuration: {}};
|
||||
let userView = await getTableConfig(tableCode);
|
||||
let config = userView.data || defaultConfigView;
|
||||
|
||||
$scope.tableConfiguration = config;
|
||||
createViewConfig(config, $scope.fields);
|
||||
|
||||
addHideClass($scope, headerList, config);
|
||||
|
||||
let table = document.querySelector(`vn-table[vn-uvc=${tableCode}]`);
|
||||
|
||||
table.insertBefore(cTemplate, table.firstChild);
|
||||
$scope.$ctrl.saveConfiguration = async tableConfiguration => {
|
||||
let newConfig = await saveConfiguration(tableConfiguration);
|
||||
vnApp.showSuccess($translate.instant('Data saved!'));
|
||||
addHideClass($scope, headerList, newConfig.data);
|
||||
$scope.uvc.hide();
|
||||
};
|
||||
}
|
||||
};
|
||||
}
|
||||
ngModule.directive('vnUvc', directive);
|
||||
|
|
@ -39,3 +39,4 @@ November: Noviembre
|
|||
December: Diciembre
|
||||
Has delivery: Hay reparto
|
||||
Loading: Cargando
|
||||
Fields to show: Campos a mostrar
|
||||
Loading…
Reference in New Issue