%PDF- %PDF-
Server IP : 37.220.80.31 / Your IP : 3.133.147.158 Web Server : Apache/2.4.52 (Ubuntu) System : Linux 3051455-guretool.twc1.net 5.15.0-107-generic #117-Ubuntu SMP Fri Apr 26 12:26:49 UTC 2024 x86_64 User : www-root ( 1010) PHP Version : 7.4.33 Disable Function : pcntl_alarm,pcntl_fork,pcntl_waitpid,pcntl_wait,pcntl_wifexited,pcntl_wifstopped,pcntl_wifsignaled,pcntl_wexitstatus,pcntl_wtermsig,pcntl_wstopsig,pcntl_signal,pcntl_signal_dispatch,pcntl_get_last_error,pcntl_strerror,pcntl_sigprocmask,pcntl_sigwaitinfo,pcntl_sigtimedwait,pcntl_exec,pcntl_getpriority,pcntl_setpriority, MySQL : OFF | cURL : ON | WGET : OFF | Perl : OFF | Python : OFF | Sudo : OFF | Pkexec : OFF Directory : /var/www/www-root/data/www/dev.artlot24.ru/bitrix/js/landing/ui/panel/fieldspanel/src/ |
Upload File : |
import {Cache, Dom, Tag, Type} from 'main.core'; import {Content} from 'landing.ui.panel.content'; import {Loader} from 'main.loader'; import {Backend} from 'landing.backend'; import {PageObject} from 'landing.pageobject'; import {SidebarButton} from 'landing.ui.button.sidebarbutton'; import {Loc} from 'landing.loc'; import {FormSettingsForm} from 'landing.ui.form.formsettingsform'; import {BaseButton} from 'landing.ui.button.basebutton'; import {Text} from 'landing.ui.field.textfield'; import {FormSettingsPanel} from 'landing.ui.panel.formsettingspanel'; import {FormClient} from 'crm.form.client'; import 'ui.userfieldfactory'; import './css/style.css'; type CrmField = { type: 'list' | 'string' | 'checkbox' | 'date' | 'text' | 'typed_string' | 'file', entity_field_name: string, entity_name: string, name: string, caption: string, multiple: boolean, required: boolean, hidden: boolean, items: Array<{ID: any, VALUE: any}>, }; type CrmFieldsList = { [categoryId: string]: { CAPTION: string, FIELDS: Array<CrmField> }, }; /** * @memberOf BX.Landing.UI.Panel */ export class FieldsPanel extends Content { static getInstance(options): FieldsPanel { const rootWindow = PageObject.getRootWindow(); const rootWindowPanel = rootWindow.BX.Landing.UI.Panel.FieldsPanel; if (!rootWindowPanel.instance && !FieldsPanel.instance) { rootWindowPanel.instance = new FieldsPanel(options); } const instance = (rootWindowPanel.instance || FieldsPanel.instance); instance.options = options; return instance; } adjustActionsPanels = false; constructor(options = {}) { super(); this.setEventNamespace('BX.Landing.UI.Panel.FieldsPanel'); this.setLayoutClass('landing-ui-panel-fields'); this.setOverlayClass('landing-ui-panel-fields-overlay'); this.setTitle(Loc.getMessage('LANDING_FIELDS_PANEL_TITLE')); this.onSaveClick = this.onSaveClick.bind(this); this.onCancelClick = this.onCancelClick.bind(this); this.options = options; this.cache = new Cache.MemoryCache(); Dom.append(this.layout, this.getViewContainer()); Dom.append(this.overlay, this.getViewContainer()); Dom.insertAfter(this.getSearchContainer(), this.header); Dom.append(this.getCreateFieldLayout(), this.body); this.showLoader(); this.loadPromise = this.load() .then(() => { this.hideLoader(); Object.entries(this.getCrmFields()) .forEach(([categoryId, category]) => { if ( categoryId !== 'CATALOG' && categoryId !== 'ACTIVITY' && categoryId !== 'INVOICE' ) { if ( Type.isPlainObject(options) && Type.isBoolean(options.isLeadEnabled) && !options.isLeadEnabled && categoryId === 'LEAD' ) { return; } const button = new SidebarButton({ id: categoryId, text: category.CAPTION, child: true, onClick: () => { this.onSidebarButtonClick(button); }, }); this.appendSidebarButton(button); } }); }); this.appendFooterButton( new BaseButton('save_settings', { text: Loc.getMessage('LANDING_FIELDS_PANEL_ADD_SELECTED_BUTTON'), onClick: this.onSaveClick, className: 'landing-ui-button-content-save', attrs: {title: Loc.getMessage('LANDING_TITLE_OF_SLIDER_SAVE')}, }), ); this.appendFooterButton( new BaseButton('cancel_settings', { text: Loc.getMessage('BLOCK_CANCEL'), onClick: this.onCancelClick, className: 'landing-ui-button-content-cancel', attrs: {title: Loc.getMessage('LANDING_TITLE_OF_SLIDER_CANCEL')}, }), ); } isMultiple(): boolean { return this.cache.get('multiple', true); } setMultiple(mode: boolean) { this.cache.set('multiple', mode); } setAllowedTypes(types: Array<string>) { this.cache.set('allowedTypes', types); } getAllowedTypes(): Array<string> { return this.cache.get('allowedTypes', []); } setDisabledFields(fields: Array<string>) { this.cache.set('disabledFields', fields); } getDisabledFields(): Array<string> { return this.cache.get('disabledFields', []); } setAllowedCategories(categories: Array<string>) { this.cache.set('allowedCategories', categories); } getAllowedCategories(): Array<string> { return this.cache.get('allowedCategories', []); } resetFactoriesCache() { this.cache.keys().forEach((key) => { if (key.startsWith('userFieldFactory_')) { this.cache.delete(key); } }); } show(options = {}): Promise<any> { this.getSearchField().input.textContent = ''; this.setMultiple(true); this.setAllowedTypes([]); this.setDisabledFields([]); this.setAllowedCategories([]); this.resetFactoriesCache(); if (Type.isArrayFilled(options.disabledFields)) { this.setDisabledFields(options.disabledFields); } if (Type.isArrayFilled(options.allowedCategories)) { this.setAllowedCategories(options.allowedCategories); } if (Type.isArrayFilled(options.allowedTypes)) { this.setAllowedTypes(options.allowedTypes); } if (Type.isBoolean(options.multiple)) { this.setMultiple(options.multiple); } this.loadPromise .then(() => { this.sidebarButtons.forEach((button) => { Dom.show(button.layout); }); if (options.isLeadEnabled === false) { const leadButton = this.sidebarButtons.get('LEAD'); if (leadButton) { Dom.hide(leadButton.layout); } } if (Type.isArrayFilled(options.allowedCategories)) { this.sidebarButtons.forEach((button) => { if (!options.allowedCategories.includes(button.id)) { Dom.hide(button.layout); } else { Dom.show(button.layout); } }); } else { this.sidebarButtons.forEach((button) => { Dom.show(button.layout); }); } const filteredFieldsTree = this.getFilteredFieldsTree(); const categories = Object.keys(filteredFieldsTree); this.sidebarButtons.forEach((button) => { button.deactivate(); if (categories.includes(button.id)) { Dom.show(button.getLayout()); } else { Dom.hide(button.getLayout()); } }); if (this.sidebarButtons.length > 0) { this.resetState(); const firstShowedButton = this.sidebarButtons.find((button) => { return button.getLayout().hidden !== true; }); if (firstShowedButton) { firstShowedButton.getLayout().click(); } } }); super.show(options).then(() => { this.getSearchField().enableEdit(); this.getSearchField().input.focus(); }); return new Promise((resolve) => { this.promiseResolver = resolve; }); } hide() { this.setCrmFields(this.getOriginalCrmFields()); return super.hide(); } onSaveClick() { const selectedFields = Object.values(this.getState()) .reduce((acc, fields) => { return [...acc, ...fields]; }, []); this.promiseResolver(selectedFields); void this.hide(); this.resetState(); } onCancelClick() { void this.hide(); this.resetState(); } getViewContainer(): HTMLDivElement { return this.cache.remember('viewContainer', () => { const rootWindow = PageObject.getRootWindow(); return rootWindow.document.querySelector('.landing-ui-view-container'); }); } getLoader(): Loader { return this.cache.remember('loader', () => { return new Loader({ target: this.body, }); }); } showLoader() { this.hideCreateFieldButton(); void this.getLoader().show(); } hideLoader() { this.showCreateFieldButton(); void this.getLoader().hide(); } load(): Promise<any> { return Backend.getInstance() .action('Form::getCrmFields') .then((result) => { this.setOriginalCrmFields(result); this.setCrmFields(result); Object.assign(FormSettingsPanel.getInstance().getCrmFields(), result); return FormClient .getInstance() .getDictionary() .then((dictionary) => { this.setFormDictionary(dictionary); }); }); } setFormDictionary(dictionary) { this.cache.set('formDictionary', dictionary); } getFormDictionary(): {[key: string]: any} { return this.cache.get('formDictionary', {}); } setOriginalCrmFields(fields) { this.cache.set('originalFields', fields); } getOriginalCrmFields(): CrmFieldsList { return this.cache.get('originalFields') || {}; } setCrmFields(fields) { this.cache.set('fields', fields); } getCrmFields(): CrmFieldsList { return this.cache.get('fields') || {}; } setState(state: {[categoryId: string]: Array<string>}) { this.cache.set('state', state); } getState(): {[categoryId: string]: Array<string>} { return this.cache.get('state') || {}; } resetState() { this.cache.delete('state'); } onSidebarButtonClick(button: SidebarButton) { const activeButton = this.sidebarButtons.getActive(); if (activeButton) { activeButton.deactivate(); } button.activate(); const hideCreateButton = this.getAllowedTypes().every((type) => { return Type.isPlainObject(type); }); if (Type.isArrayFilled(this.getAllowedTypes()) && hideCreateButton) { this.hideCreateFieldButton(); } else { this.showCreateFieldButton(); } const crmFields = this.getCrmFields(); if (Reflect.has(crmFields, button.id)) { this.clearContent(); const form = this.createFieldsListForm(button.id); this.appendForm(form); } } getFilteredFieldsTree() { const searchString = String(this.getSearchField().getValue()).toLowerCase().trim(); const allowedCategories = this.getAllowedCategories(); const allowedTypes = this.getAllowedTypes(); return Object .entries(this.getCrmFields()) .reduce((acc, [categoryId, category]) => { if ( ( categoryId !== 'CATALOG' && categoryId !== 'ACTIVITY' && categoryId !== 'INVOICE' ) && ( !Type.isArrayFilled(allowedCategories) || allowedCategories.includes(categoryId) ) ) { const filteredFields = category.FIELDS.filter((field) => { const fieldCaption = String(field.caption).toLowerCase().trim(); if (Type.isArrayFilled(allowedTypes)) { const isTypeAllowed = allowedTypes.some(allowedType => { if (!Type.isPlainObject(allowedType)) { allowedType = {type: allowedType}; } if ( allowedType.entityFieldName && allowedType.entityFieldName !== field.entity_field_name ) { return false; } if ( Type.isBoolean(allowedType.multiple) && allowedType.multiple !== field.multiple ) { return false; } return field.type === allowedType.type; }); if (!isTypeAllowed) { return false; } } return ( !Type.isStringFilled(searchString) || fieldCaption.includes(searchString) ); }); if (Type.isArrayFilled(filteredFields)) { acc[categoryId] = { ...category, FIELDS: filteredFields, }; } } return acc; }, {}); } createFieldsListForm(category: string): FormSettingsForm { const fieldsListTree = this.getFilteredFieldsTree(); const disabledFields = this.getDisabledFields(); const fieldOptions = { items: fieldsListTree[category].FIELDS.map((field) => { return { name: field.caption, value: field.name, disabled: ( Type.isArrayFilled(disabledFields) && disabledFields.includes(field.name) ), }; }), value: this.getState()[category] || [], onValueChange: (checkbox) => { const state = {...this.getState()}; state[category] = checkbox.getValue(); this.setState(state); }, }; return new FormSettingsForm({ fields: [ this.isMultiple() ? new BX.Landing.UI.Field.Checkbox(fieldOptions) : new BX.Landing.UI.Field.Radio(fieldOptions) , ], }); } onSearchChange() { const filteredFieldsTree = this.getFilteredFieldsTree(); const categories = Object.keys(filteredFieldsTree); this.sidebarButtons.forEach((button) => { button.deactivate(); if (categories.includes(button.id)) { Dom.show(button.getLayout()); } else { Dom.hide(button.getLayout()); } }); this.clearContent(); const [firstCategory] = categories; if (firstCategory) { const firstCategoryButton = this.sidebarButtons.get(firstCategory); if (firstCategoryButton) { firstCategoryButton.activate(); } const form = this.createFieldsListForm(firstCategory); this.showCreateFieldButton(); this.appendForm(form); } else { this.hideCreateFieldButton(); } } getSearchField(): Text { return this.cache.remember('searchField', () => { const rootWindow = PageObject.getRootWindow(); return new rootWindow.BX.Landing.UI.Field.Text({ selector: 'search', textOnly: true, placeholder: Loc.getMessage('LANDING_FIELDS_PANEL_SEARCH'), onChange: this.onSearchChange.bind(this), }); }); } getSearchContainer(): HTMLDivElement { return this.cache.remember('searchLayout', () => { return Tag.render` <div class="landing-ui-panel-content-element landing-ui-panel-content-search"> ${this.getSearchField().getLayout()} <div class="landing-ui-panel-content-search-icon"></div> </div> `; }); } getUserFieldFactory(entityId: string) { const factory = this.cache.remember(`userFieldFactory_${entityId}`, () => { const rootWindow = PageObject.getRootWindow(); const preparedEntityId = (() => { if (entityId.startsWith('DYNAMIC_')) { return this.getCrmFields()[entityId].DYNAMIC_ID; } return `CRM_${entityId}`; })(); return new rootWindow.BX.UI.UserFieldFactory.Factory( preparedEntityId, { moduleId: 'crm', bindElement: this.getCreateFieldButton(), }, ); }); if (Type.isArrayFilled(this.getAllowedTypes())) { factory.types = factory.types.filter((type) => { return this.getAllowedTypes().includes(type.name); }); } else { factory.types = factory.types.filter((type) => { return type.name !== 'employee'; }); } return factory; } onCreateFieldClick(event: MouseEvent) { event.preventDefault(); const dictionary = this.getFormDictionary(); if ( Type.isPlainObject(dictionary.permissions) && Type.isPlainObject(dictionary.permissions.userField) && dictionary.permissions.userField.add === false ) { const rootWindow = PageObject.getRootWindow(); rootWindow.BX.UI.Dialogs.MessageBox.alert(Loc.getMessage('LANDING_FORM_ADD_USER_FIELD_PERMISSION_DENIED')); return; } const activeButton = this.sidebarButtons.getActive(); const currentCategoryId = activeButton.id; const factory = this.getUserFieldFactory(currentCategoryId); const menu = factory.getMenu(); menu.open((type) => { const configurator = factory.getConfigurator({ userField: factory.createUserField(type), onSave: (userField) => { userField .save() .then(() => { return this.load(); }) .then(() => { this.getSearchField() .setValue(userField.getData().editFormLabel[Loc.getMessage('LANGUAGE_ID')]); this.showCreateFieldButton(); }); }, onCancel: () => { this.showCreateFieldButton(); this.sidebarButtons.getActive().getLayout().click(); }, }); this.clearContent(); Dom.append(configurator.render(), this.content); this.hideCreateFieldButton(); }); } getCreateFieldButton(): HTMLSpanElement { return this.cache.remember('getCreateFieldButton', () => { return Tag.render` <div class="landing-ui-panel-content-create-field-button" onclick="${this.onCreateFieldClick.bind(this)}" > ${Loc.getMessage('LANDING_FIELDS_PANEL_CREATE_FIELD')} </div> `; }); } getCreateFieldLayout(): HTMLDivElement { return this.cache.remember('createFieldLayout', () => { return Tag.render` <div class="landing-ui-panel-content-create-field"> ${this.getCreateFieldButton()} </div> `; }); } isUserFieldEditorShowed(): boolean { return Type.isDomNode(this.content.querySelector('.ui-userfieldfactory-configurator')); } showCreateFieldButton() { Dom.append(this.getCreateFieldLayout(), this.body); } hideCreateFieldButton() { Dom.remove(this.getCreateFieldLayout(), this.body); } }