= 4.2.6.9.3 =

~ Tweak: add courses to manual order.

assets/src/js/admin/admin-order.js

@@ -1,7 +1,9 @@
 import export_invoice from './order/export_invoice';
-import modalSearchCourses from './order/modal-search-courses';
+//import modalSearchCourses from './order/modal-search-courses';
+import addCoursesToOrder from './order/add-courses-to-order';
 
 document.addEventListener( 'DOMContentLoaded', ( event ) => {
-	modalSearchCourses();
 	export_invoice();
 } );
+
+addCoursesToOrder();

assets/src/js/admin/order/add-courses-to-order.js

@@ -0,0 +1,96 @@
+import { AdminUtilsFunctions, Api, Utils } from '../utils-admin.js';
+
+const addCoursesToOrder = () => {
+	let elModalSearchCourses;
+	let elBtnAddOrderItem;
+	let elOrderDetails, modalSearchItems, modalContainer, elModalSearchItem;
+
+	const getAllElements = () => {
+		elOrderDetails = document.querySelector( '#learn-press-order' );
+		elModalSearchCourses = document.querySelector( '#modal-search-items' );
+		elBtnAddOrderItem = elOrderDetails.querySelector( '#learn-press-add-order-item' );
+		modalSearchItems = document.querySelector( '#learn-press-modal-search-items' );
+		modalContainer = document.querySelector( '#container-modal-search-items' );
+	};
+
+	const fetchCoursesAPI = ( keySearch = '', course_ids_exclude = '' ) => {
+		const dataSend = {
+			not_ids: course_ids_exclude,
+		};
+
+		AdminUtilsFunctions.fetchCourses( keySearch, dataSend, {
+			before() {
+				elModalSearchItem.classList.add( 'loading' );
+			},
+			success( response ) {
+				const { data, status, message } = response;
+				const { courses, total_pages } = data;
+
+				if ( 'success' !== status ) {
+					console.error( message );
+				} else {
+					elModalSearchItem.querySelector( '.search-results' ).innerHTML = renderSearchResult( courses );
+				}
+			},
+			error( err ) {
+				console.error( err );
+			},
+			completed() {
+				elModalSearchItem.classList.remove( 'loading' );
+			},
+		} );
+	};
+
+	const renderSearchResult = ( courses ) => {
+		let html = '';
+
+		for ( let i = 0; i < courses.length; i++ ) {
+			html += `
+		<li class="lp-result-item" data-id="${ courses[ i ].ID }" data-type="lp_course" data-text="${ courses[ i ].post_title }">
+			<label>
+				<input type="checkbox" value="${ courses[ i ].ID }" name="selectedItems[]">
+				<span class="lp-item-text">${ courses[ i ].post_title } (Course - #${ courses[ i ].ID })</span>
+			</label>
+		</li>`;
+		}
+
+		return html;
+	};
+
+	const showPopupSearchCourses = () => {
+		modalContainer.style.display = 'block';
+		fetchCoursesAPI();
+	};
+
+	// Events.
+	document.addEventListener( 'click', ( e ) => {
+		const target = e.target;
+		console.dir( target );
+		if ( target.id === elBtnAddOrderItem.id ) {
+			e.preventDefault();
+			showPopupSearchCourses();
+		}
+
+		if ( target.classList.contains( 'close' ) && target.closest( '#modal-search-items' ) ) {
+			e.preventDefault();
+			modalContainer.style.display = 'none';
+		}
+	} );
+
+	// DOMContentLoaded.
+	document.addEventListener( 'DOMContentLoaded', () => {
+		getAllElements();
+
+		if ( ! elOrderDetails || ! elBtnAddOrderItem ) {
+			return;
+		}
+
+		modalContainer.innerHTML = modalSearchItems.innerHTML;
+		elModalSearchItem = modalContainer.querySelector( '#modal-search-items' );
+		modalContainer.style.display = 'none';
+
+		fetchCoursesAPI();
+	} );
+};
+
+export default addCoursesToOrder;

assets/src/js/admin/utils-admin.js

@@ -70,7 +70,7 @@ const AdminUtilsFunctions = {
 	},
 	fetchCourses( keySearch = '', dataSend = {}, callback ) {
 		const url = Api.admin.apiSearchCourses;
-		dataSend.c_search = keySearch;
+		dataSend.search = keySearch;
 		const params = {
 			headers: {
 				'Content-Type': 'application/json',

inc/admin/class-lp-admin-assets.php

@@ -226,7 +226,7 @@ protected function _get_scripts(): array {
 					array(
 						'vue-libs',
 						'advanced-list',
-						'lp-modal-search-courses',
+						//'lp-modal-search-courses',
 						//'lp-modal-search-users',
 					),
 					array( LP_ORDER_CPT ),
@@ -261,7 +261,7 @@ protected function _get_scripts(): array {
 					0,
 					1
 				),*/
-				'lp-modal-search-courses'           => new LP_Asset_Key(
+				/*'lp-modal-search-courses'           => new LP_Asset_Key(
 					$this->url( self::$_folder_source . 'js/admin/share/modal-search-courses' . self::$_min_assets . '.js' ),
 					array(
 						'vue-libs',
@@ -270,7 +270,7 @@ protected function _get_scripts(): array {
 					array( LP_ORDER_CPT ),
 					1,
 					1
-				),
+				),*/
 				/*'lp-modal-search-users'             => new LP_Asset_Key(
 					$this->url( self::$_folder_source . 'js/admin/share/modal-search-users' . self::$_min_assets . '.js' ),
 					array( 'jquery' ),