לי ווטרמן

כתיבת מודול PrestaShop משלך - חלק 5

ציוץ

את הליטוש הסופי

הקדמה

בחלק האחרון של הסדרה הכתיבה הבסיסית שלנו מודול הדרכה נבדוק את השלבים האחרונים כדי להפוך את הכיתה מודול Tutorialthird שלנו לתוך תבנית הבסיס שאנחנו יכולים להשתמש בו כדי להתחיל לבעוט את הכתובת של מודולים חדשים. במקום לפרסם מחדש את הקוד הישן אותו שוב נצטרך לדון רק את השינויים, אבל הוספתי קישור להורדה בסוף חלק זה, כדי שתוכל לתפוס את הקוד הסופי ולהשתמש בה כבסיס עבור פרוייקטים משלך. אנחנו הולכים קוראים לזה מודול "שלד" - שם נוכל להחליף את שלנו כאשר מדובר בייצור מודולים חדשים המבוססים עליה.

סטיילינג טופס תצורה

השינויים הראשונים שאנחנו הולכים לעשות הם קוסמטיים בלבד, אולם זה הוא מרכיב חשוב כי אנחנו רוצים לספק ממשק עקבית למשתמשים שלנו. קוד הטופס שלנו נראה כמו:

	 פונקציה _displayForm פרטית ()
	 {
		 $ This-> _html. = '
		 <form action="'.$_SERVER['REQUEST_URI'].'" method="post">
				 <label> ". $ this-> L (" מסר לעולם ")." </ label>
				 <div class="margin-form">

					 <input type="text" name="our_message" />
				 </ P>
				 <input type="submit" name="submit" value="'.$this-> L ("עדכון"). "" class = "כפתור" />

		 </ Form> ';
	 }

אמנת אלה מסכי התצורה היא לעטוף את ההגדרות fieldset, ואנו גם צריכים להוסיף אגדה נחמדה וידידותית (לתרגום) להשלים עם סמל. הקוד שלנו כעת נראה:

	 פונקציה _displayForm פרטית ()
	 {
		 $ This-> _html. = '
		 <form action="'.$_SERVER['REQUEST_URI'].'" method="post">

			 <fieldset>
				 <legend> <img src="../img/admin/cog.gif" alt="" class="middle" /> ". $ this-> L (" הגדרות ")." </ אגדה>

				 <label> ". $ this-> L (" מסר לעולם ")." </ label>
				 <div class="margin-form">
					 <input type="text" name="our_message" />

				 </ P>
			 <input type="submit" name="submit" value="'.$this-> L ("עדכון"). "" class = "כפתור" />

			 </ Fieldset>
		 </ Form> ';
	 }

שינוי קוסמטי הסופית שלנו היא להוסיף כותרת בחלק העליון של מסך ההגדרות שלנו למקרה שהמשתמש שכח איפה הם נמצאים! אנו עושים זאת על ידי הוספת השורה הבאה בתחילת הפונקציה getContent ():

 $ This-> _html = '<h2>' $ this-> DisplayName "</ h2>"...

טרום לאכלוס טופס תצורה שדות

עוד אלמנט שחסר עיצוב הדרכה המקורי שלנו היה את תצוגת ההגדרות הנוכחיות בצורה תצורת מודול, וגם כאשר חוזר טופס לעדכן את ערכי שדות ריקים, כך שאנחנו צריכים לתקן את הטעות הזו יותר מדי. יש שתי אפשרויות שאנחנו צריכים להתמודד:

1. התצוגה הראשונית של הטופס יש להציג את התצורה הנוכחית (אם בכלל)
2. לאחר עדכון טופס אנחנו צריכים להציג את הנתונים שהוזנו על ידי המשתמש

אנו יכולים להשתמש תצורת :: להגיע () function כדי לאחזר את ההגדרות הנוכחיות של מסד הנתונים, כלי :: getValue () כדי לקבל את תוכן השדה. כלים :: getValue () הפונקציה לוקחת פרמטר 2 וזה שימושי בהקשר זה, כי זה מציין "ברירת המחדל" להשתמש בשטח צריך להיות ריק. כעת אנו יכולים לקבוע את "ערך" מאפיין של תג קלט שלנו באופן הולם באמצעות שתי פונקציות, אז קלט הקוד הסופי שלנו טופס יהיה:

 <input type="text" name="our_message" value="'.Tools::getValue('our_message', Configuration::get($this-> שם. "_ שגיאה")). "" />

שינוי נוסף כדאי לעשות כאשר מדובר במספר תחומים בתצורה עבור היא להעביר את העדכון באתר קוד לתפקד הפרטי של זה. בשביל זה נחליף את השורה:

 אם (! sizeof ($ this-> _postErrors))
	 {
		 תצורת :: updateValue ($ this-> שם "_ שגיאה", כלים :: getValue ("our_message"), נכון.);
		 $ This-> _html = '<div class="conf confirm">' $ this-> L ("הגדרות עדכון") "</ span>"...
	 }

עם את הפעולות הבאות:

 אם (! sizeof ($ this-> _postErrors))
	 $ This-> _postProcess ();

ואנחנו להוסיף פונקציה חדשה חבר פרטית אל הכיתה שלנו להתמודד עם העדכונים בפועל במיקום יחיד לזהות בקלות:

	 פונקציה _postProcess פרטית ()
	 {
		 תצורת :: updateValue ($ this-> שם "_ שגיאה", כלים :: getValue ("our_message"), נכון.);

		 $ This-> _html = '<div class="conf confirm">' $ this-> L ("הגדרות עדכון") "</ span>"...
	 }

טיפול סוגי שדות אחרים

ב ההורדה הסופי של מודול השלד הוספתי גם דוגמאות של סוגים אחרים של שדות ישמש קיצורי דרך שימושיים ליצירת תצורת מודול שלך הטופס. זה כולל תיבות סימון, כפתורי רדיו, Textarea ו רשימות נפתחות. כל מה שאתה צריך לעשות הוא להוסיף / לשנות את שמות השדות, להוסיף כל אימות נדרש _postValidation () function ולשנות את הקוד עדכון _postProcess () function כראוי.

עבור הגדרות חובה כדאי גם לבדוק את נוכחותם בתפקוד התקנה ולנקוט בפעולות מתאימות כדי למנוע מודול שלך גורמת טעויות כגון משרד קדמי על ידי הגדרת ברירות המחדל מתאימות באמצעות תצורת :: updateValue () function. לחילופין ניתן לבצע בנאי מודול, אם כי נכון יותר לבצע בתוך להתקין ().

הוספת מיקום תצוגת מספר ווים

מודול Tutorialthird שלנו יכול רק להציג את התוכן שלנו בעמודה השמאלית מאז זה רק וו יישמנו. למרבה המזל קל מאוד ליישם את "מודול להשתלות" פונקציונליות BackOffice בקוד שלנו. בצורה הפשוטה שאנחנו פשוט להשתמש בפלט אותו בכל המקומות, אבל אם נדרש כל אלה ווים נוספים יכולים להניב תוצאות שונות.

כדי להפיק את אותו פלט בכל אתרים פופולריים, אנחנו רק צריכים ליישם את הפונקציות וו נוספות מודול שלנו ולקרוא את הקוד וו המקורי על מנת ליצור את הפלט. שים לב כי אנו רק בעצם קוראים registerHook () עבור ברירת המחדל של התקנה 1 () function חבר, ולתת המשרד האחורי להתמודד עם אחת מן האחרים.

	 פונקציה hookRightColumn ($ params)
	 {
		 לחזור $ this-> hookLeftColumn ($ params);
	 }

	 פונקציה hookTop ($ params)
	 {
		 לחזור $ this-> hookLeftColumn ($ params);
	 }

	 פונקציה hookHome ($ params)
	 {
		 לחזור $ this-> hookLeftColumn ($ params);
	 }

	 פונקציה hookFooter ($ params)
	 {
		 לחזור $ this-> hookLeftColumn ($ params);
	 }

תקציר

במהלך סדרה זו של מאמרים שאתה צריך ללמוד איך המערכת מודול בסיסי עובד PrestaShop ולהיות מסוגלים מודולי קוד המספקים תפוקה לאזורים תצוגה שונים במשרד הקדמי. כמו כן תוכל להיות מסגרת קוד טוב לבסס את המודולים שלך ב. ייתכן שיהיה לב כי בעת אין לי השתמשנו למעשה החכם או קבצי התבנית שלה ביצירת מודול שלנו - זה מכוון כפי שניתן לראות כישות נפרדת מעיצוב המודול עצמו.

החכם הוא גמיש מאוד, אבל הבחירה להשתמש בו מבוסס על גורמים רבים, מטעמי ביצועים עדיף למנוע את השימוש בו במידת האפשר. מאוחר יותר מאמרים תבחן כיצד ומתי להשתמש החכם כדי לשפר את הפונקציונליות של המודולים שלך אם כי, כפי שהוא חלק מהותי של האדריכלות PrestaShop.

ניתן להוריד את השלד המלא מודול קוד באמצעות הקישור הבא:

השלד v0.1.0