96 lines
3.6 KiB
JavaScript
96 lines
3.6 KiB
JavaScript
|
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);
|