- add account block

2026-07-20 07:04:06 +09:00 · 2023-03-29 17:42:53 +03:00
parent a08ed9b6c1
commit c9dedf6d91
6 changed files with 183 additions and 2 deletions
@@ -0,0 +1,15 @@
+{
+  "apiVersion": 2,
+  "name": "um-block/um-account",
+  "title": "Account",
+  "description": "Displaying the account page of the current user",
+  "icon": "id",
+  "category": "um-blocks",
+  "attributes": {
+    "tab": {
+      "type": "string"
+    }
+  },
+  "editorScript": "file:./build/index.js",
+  "textdomain": "ultimate-member"
+}
@@ -0,0 +1,88 @@
+import { registerBlockType } from '@wordpress/blocks';
+import ServerSideRender from '@wordpress/server-side-render';
+import {InspectorControls, useBlockProps} from '@wordpress/block-editor';
+import {PanelBody, SelectControl} from "@wordpress/components";
+
+registerBlockType('um-block/um-account', {
+	edit: function (props) {
+		let { tab, setAttributes } = props.attributes;
+		const blockProps = useBlockProps();
+
+		function get_options() {
+			var option = [];
+
+			option.push( { label: wp.i18n.__( 'All', 'ultimate-member' ), value: 'all' } );
+
+			for ( var key in um_account_settings ) {
+				if ( um_account_settings.hasOwnProperty( key ) && um_account_settings[ key ]['enabled'] ) {
+					option.push(
+						{
+							label: um_account_settings[ key ]['label'],
+							value: key
+						}
+					)
+				}
+			}
+
+			return option;
+		}
+
+		function umShortcode( value ) {
+
+			var shortcode = '[ultimatemember_account';
+
+			if ( value !== 'all' ) {
+				shortcode = shortcode + ' tab="' + value + '"';
+			}
+
+			shortcode = shortcode + ']';
+
+			props.setAttributes({ content: shortcode });
+		}
+
+		return (
+			<div {...blockProps}>
+				<ServerSideRender block="um-block/um-account" attributes={props.attributes} />
+				<InspectorControls>
+					<PanelBody title={wp.i18n.__('Account Tab', 'ultimate-member')}>
+						<SelectControl
+							label={wp.i18n.__('Select Tab', 'ultimate-member')}
+							className="um_select_account_tab"
+							value={tab}
+							options={get_options()}
+							style={{ height: '35px', lineHeight: '20px', padding: '0 7px' }}
+							onChange={(value) => {
+								props.setAttributes({ tab: value });
+								umShortcode(value);
+							}}
+						/>
+					</PanelBody>
+				</InspectorControls>
+			</div>
+		);
+
+	},
+	save: function save(props) {
+		return null;
+	}
+});
+
+jQuery(window).on( 'load', function($) {
+	var observer = new MutationObserver(function(mutations) {
+		mutations.forEach(function(mutation) {
+
+			jQuery(mutation.addedNodes).find('.um.um-account').each(function() {
+				var current_tab = jQuery(this).find('.um-account-main').attr('data-current_tab');
+
+				if ( current_tab ) {
+					jQuery(this).find('.um-account-tab[data-tab="'+current_tab+'"]').show();
+					jQuery(this).find('.um-account-tab:not(:visible)').find( 'input, select, textarea' ).not( ':disabled' ).addClass('um_account_inactive').prop( 'disabled', true ).attr( 'disabled', true );
+					um_responsive();
+					um_modal_responsive();
+				}
+			});
+		});
+	});
+
+	observer.observe(document, {attributes: false, childList: true, characterData: false, subtree:true});
+});