· 4 years ago · Jul 27, 2021, 02:30 PM
1<div class="container" style="box-shadow: 0 0 10px 0 #e4e9eb; background: #fff; padding: 20px; margin: 30px auto;">
2<div class="row">
3<div class="col-md-12">
4<p dir="ltr" style="background: #00a0db; padding: 5px 15px; font-weight: bold; text-transform: capitalize; color: #fff;"><span style="font-size: 20px;"><strong>API Documentation:</strong></span></p>
5<p dir="ltr"><span style="font-size: 15px;">Postman: <a style="color: blue;" href="https://documenter.getpostman.com/view/12419827/T1LSB5f7?version=latest" target="_blank">https://tinyurl.com/postmanDocV2</a></span></p>
6<p dir="ltr">Download <a style="color: blue; font-weight: bold;" href="https://tinyurl.com/postmanV2download">Postman Collection</a>. Then just import to the postman and select 'nopStation' environment. That's it.</p>
7<p dir="ltr"><span style="font-size: 10pt;"><strong>NST Documentation: </strong></span></p>
8<p dir="ltr"><a style="color: blue;" href="https://www.nop-station.com/how-to-create-nst-token-v2">https://www.nop-station.com/how-to-create-nst-token-v2</a></p>
9<p dir="ltr"><strong>Check verison 1.0 api details <a href="https://www.nop-station.com/api-details-for-v1">here</a>.</strong></p>
10<p dir="ltr"> </p>
11<p dir="ltr" style="background: #00a0db; padding: 5px 15px; font-weight: bold; text-transform: capitalize; color: #fff;"><span style="font-size: 15pt; font-weight: bold;"><strong>FAQ</strong></span></p>
12<ol style="list-style: none;">
13<li dir="ltr">
14<h3 dir="ltr" style="font-size: 20px; font-weight: bold;">How to change the Base Url</h3>
15</li>
16</ol>
17<div dir="ltr" align="left">
18<table><colgroup><col width="219" /><col width="405" /></colgroup>
19<tbody>
20<tr>
21<td style="border: solid 1px #ccc; padding: 0 20px;">
22<p dir="ltr">Native Android</p>
23</td>
24<td style="border: solid 1px #ccc; padding: 0 20px;">
25<p dir="ltr">com.bs.ecommerce.networking.NetworkConstants</p>
26</td>
27</tr>
28<tr>
29<td style="border: solid 1px #ccc; padding: 0 20px;">
30<p dir="ltr" style="/*! border: solid 1px #ccc; *//*! padding: 0 20px;">Native iOS</p>
31</td>
32<td style="border: solid 1px #ccc; padding: 0 20px;">
33<p dir="ltr">/Tools/API/API.swift</p>
34</td>
35</tr>
36<tr>
37<td style="border: solid 1px #ccc; padding: 0 20px;">
38<p dir="ltr">Ionic</p>
39</td>
40<td style="border: solid 1px #ccc; padding: 0 20px;">
41<p dir="ltr">src\app\util\constant.ts</p>
42</td>
43</tr>
44</tbody>
45</table>
46</div>
47<p dir="ltr"> </p>
48<ol style="list-style: none;" start="2">
49<li dir="ltr">
50<h3 dir="ltr" style="font-size: 20px; font-weight: bold;">How to Change the JWT Key & Secret</h3>
51</li>
52</ol>
53<div dir="ltr" align="left">
54<table><colgroup><col width="219" /><col width="405" /></colgroup>
55<tbody>
56<tr>
57<td style="border: solid 1px #ccc; padding: 0 20px;">
58<p dir="ltr">Native Android</p>
59</td>
60<td style="border: solid 1px #ccc; padding: 0 20px;">
61<p dir="ltr">app.secret file under the root project directory</p>
62</td>
63</tr>
64<tr>
65<td style="border: solid 1px #ccc; padding: 0 20px;">
66<p dir="ltr">Native iOS</p>
67</td>
68<td style="border: solid 1px #ccc; padding: 0 20px;">
69<p dir="ltr">/Tools/API/API.swift</p>
70<p dir="ltr">In this file JWT Key == Token Key, and Secret == TokenSecret</p>
71</td>
72</tr>
73<tr>
74<td style="border: solid 1px #ccc; padding: 0 20px;">
75<p dir="ltr">Ionic</p>
76</td>
77<td style="border: solid 1px #ccc; padding: 0 20px;">
78<p dir="ltr">src\app\util\constant.ts</p>
79</td>
80</tr>
81</tbody>
82</table>
83</div>
84<p> </p>
85<ol style="list-style: none;" start="3">
86<li dir="ltr">
87<h3 dir="ltr" style="font-size: 20px; font-weight: bold; margin-top: 25px;">What will be the base URL after installing the MobileWebApi plugin?</h3>
88</li>
89</ol>
90<ul>
91<li dir="ltr" style="list-style: none;">
92<p dir="ltr">[SITE_URL]/api</p>
93</li>
94</ul>
95<ol style="list-style: none;" start="4">
96<li dir="ltr">
97<h3 dir="ltr" style="font-size: 20px; font-weight: bold;">How to change the top bar logo?</h3>
98</li>
99</ol>
100<ul>
101<li dir="ltr" style="list-style: none;">
102<p dir="ltr">In Admin panel: Nop Station > Plugins > Mobile Web Api > Configuration > App Settings > Logo</p>
103</li>
104</ul>
105<ol style="list-style: none;" start="5">
106<li dir="ltr">
107<h3 dir="ltr" style="font-size: 20px; font-weight: bold;">How to change the default category icons on the Category tree?</h3>
108</li>
109</ol>
110<ul>
111<li dir="ltr" style="list-style: none;">
112<p dir="ltr">In Admin panel: Nop Station > Plugins > Mobile Web Api > Configuration > Common > Default category icon</p>
113</li>
114</ul>
115<ol style="list-style: none;" start="6">
116<li dir="ltr">
117<h3 dir="ltr" style="font-size: 20px; font-weight: bold;">How to set the category icons for mobile?</h3>
118</li>
119</ol>
120<ul>
121<li dir="ltr" style="list-style: none;">
122<p dir="ltr">[SITE_URL]/Admin/WebApiCategoryIcon/List</p>
123</li>
124</ul>
125<p dir="ltr"><br /><br /></p>
126<ol style="list-style: none;" start="7">
127<li dir="ltr">
128<h3 dir="ltr" style="font-size: 20px; font-weight: bold;">How to set up the Firebase push notification?</h3>
129</li>
130</ol>
131<ul>
132<li dir="ltr" style="list-style: none;">
133<p dir="ltr"><a style="color: blue;" href="https://docs.google.com/document/d/1dRjurt7sgDQgpgHEJcsrmx9ZtKdwZ1-Pw1kEUOpU7Bo/edit?usp=sharing">Follow this URL for details</a></p>
134</li>
135</ul>
136<p dir="ltr"> </p>
137<ol style="list-style: none;" start="8">
138<li dir="ltr">
139<h3 dir="ltr" style="background: #00a0db; padding: 5px 15px; text-transform: capitalize; color: #fff; font-weight: bold; font-size: 20px;">How to change the theme colors?</h3>
140</li>
141</ol>
142<p dir="ltr">The color theme of the mobile app is configurable from Nop Station > Plugins > Mobile Web Api > Color Settings</p>
143<p dir="ltr"> </p>
144<p dir="ltr"><img src="https://lh3.googleusercontent.com/cf6u63AOhWIFSUU_30ZHU0wdIY02qdgr3VZx7oCrRy1Jq_MN6eEzWJnn5h3rF1bl5bIzs-jQhYOQZ0ssEz0aj8bTkLyhUmy19pAbmn-bNbyKn0A9uDqFNSMOauDCP_jq61hAYXIg" alt="" width="347" height="496" /></p>
145<p dir="ltr"> </p>
146<p dir="ltr" style="background: #00a0db; padding: 5px 15px; text-transform: capitalize; color: #fff; font-weight: bold; font-size: 20px;">Primary theme color - This color is implemented at - </p>
147<ol style="padding: 5px 20px;">
148<li dir="ltr">
149<p dir="ltr">Button (filled) background-color</p>
150</li>
151<li dir="ltr">
152<p dir="ltr">Button (outlined) text color</p>
153</li>
154<li dir="ltr">
155<p dir="ltr">More screen - list icons color</p>
156</li>
157<li dir="ltr">
158<p dir="ltr">Account screen - list icons color</p>
159</li>
160<li dir="ltr">
161<p dir="ltr">Product price color</p>
162</li>
163<li dir="ltr">
164<p dir="ltr">Cart badge counter color</p>
165</li>
166<li dir="ltr">
167<p dir="ltr">Slider indicator color on Home screen & Product Details screen</p>
168</li>
169</ol>
170<p dir="ltr"><img src="https://lh6.googleusercontent.com/8bXJeJ4o9T67AEEV9J21ijU-RKipmA-JfgU6I0jeCyBALxYva_yoC6RdPzoclQyW-MDVOsMtw_nV2Xf4lBGVKJJPQydqvtsDhNVKKVxkjLaweanxD8x_FjJHIz4eliIx7R8dnJ2a" alt="" width="420" height="65" /></p>
171<p dir="ltr">Image: Bottom bar</p>
172<p dir="ltr"> </p>
173<p dir="ltr">Bottom bar active color - Icon and text color of the selected bottom menu</p>
174<p dir="ltr">Bottom bar inactive color - Icon and text color of the unselected bottom menus</p>
175<p dir="ltr">Bottom bar background color - Background color of the bottom menu</p>
176<p dir="ltr"> </p>
177<p dir="ltr"><img src="https://lh3.googleusercontent.com/AtoJmgywrZ5P_BpLTXowyZLS0QgwytV3FY4pK0RGTSzLM7I0m8qegEuQ_AZQnUaBSMVUfjW_nrWJEJZi4njhzldREfZRjLQwuPdfNO6wFNXDCO4nJ5nryVracE55kb9po93s1VaG" alt="" width="428" height="68" /></p>
178<p dir="ltr">Image: Top bar</p>
179<p dir="ltr"> </p>
180<p dir="ltr">Top bar background color - Background color of the top bar</p>
181<p dir="ltr">Top bar text color - Icon and text color of the top bar</p>
182<p dir="ltr">Gradient starting color, Gradient middle color, Gradient ending color- A gradient of these 3 colors will be implemented on the top bar if Gradient enabled is checked. </p>
183<p dir="ltr">If Gradient enabled is unchecked, Top bar background color will be set on top bar.</p>
184<p dir="ltr"> </p>
185<h3 dir="ltr" style="background: #00a0db; padding: 5px 15px; text-transform: capitalize; color: #fff; font-weight: bold; font-size: 20px;">How to add a missing translation</h3>
186<p dir="ltr"> </p>
187<p dir="ltr"><img src="https://lh5.googleusercontent.com/vOYSbQr6vMHEB-V-jOnQm2PPoVQdqNz_9HQAFqahy_APQ5J7i2Ax3WltxrGTFBG-41LBGlakpuSSS5AgH_wFHPi8PcAWGma3Gun0gGNHLYLXNtBbng890h2WvhbO4dKivS8qnpFz" alt="" width="249" height="125" /></p>
188<p dir="ltr"> </p>
189<ol style="padding: 5px 5px; list-style: none;">
190<li dir="ltr">
191<p dir="ltr">If the value is missing for some string resource, like shown in the screenshot above, follow the following approach to set the value for the resource key.</p>
192</li>
193</ol><ol style="padding: 5px 20px;">
194<li dir="ltr">
195<p dir="ltr">Go to [SITE_URL]/Admin/WebApi/Configure</p>
196</li>
197<li dir="ltr">
198<p dir="ltr">Go to the String resources section</p>
199</li>
200</ol>
201<p dir="ltr"><br /><br /></p>
202<p dir="ltr"><img src="https://lh5.googleusercontent.com/V52QQJKlvsB2F2L9ZYPFcncpQMh72yY0uIbgZpu9z58g7kcjCnOzwDZ-hRNFjUxpAQ2_fGlDEpF6kdM3-AXoH3dMeo3O3vSy0ViicyogL1t1EqVVCVLIg-JLZ8VQDeyK38Jzrj0W" alt="" width="624" height="229" /></p>
203<ol style="padding: 5px 20px;" start="3">
204<li dir="ltr">
205<p dir="ltr">Select the language for which the string is missing.</p>
206</li>
207</ol>
208<p dir="ltr">Type the resource name and hit the search</p>
209<p dir="ltr"> </p>
210<ol style="padding: 5px 20px;" start="4">
211<li dir="ltr">
212<p dir="ltr">Edit and update the search result the desired value</p>
213</li>
214<li dir="ltr">
215<p dir="ltr">Now relaunch the app. The missing string will be visible.</p>
216</li>
217</ol>
218<p dir="ltr"><br /><br /></p>
219<p dir="ltr">B. If there is a missing string resource in your app which is available in English but not in another language, like shown in the screenshot below, follow the following approach to set the value for the resource key.</p>
220<p dir="ltr"><img src="https://lh3.googleusercontent.com/JEw-PJKS_gI-KMv0UotivsTG6S_miu46UXUFLWHu08oZ2VZIqNnYnamW0zfehsJdj2aLba3_B2b2CzgExeE07ZWE0zhKOqTcO7RXMHs-LQEqRssHgtmen1w9qAE0pu0UepF-r2PK" alt="" width="368" height="54" /></p>
221<p dir="ltr"> </p>
222<ol style="padding: 5px 20px;">
223<li dir="ltr">
224<p dir="ltr">Go to [SITE_URL]/Admin/WebApi/Configure</p>
225</li>
226<li dir="ltr">
227<p dir="ltr">Go to the String resources section</p>
228</li>
229<li dir="ltr">
230<p dir="ltr">Select the language for which the string is missing.</p>
231</li>
232</ol>
233<p dir="ltr">Type the resource value and hit the search</p>
234<p> </p>
235<p dir="ltr" style="background: #00a0db; padding: 5px 15px; text-transform: capitalize; color: #fff; font-weight: bold; margin-bottom: 20px;"><span style="font-size: 20px;"><strong>Checkout Steps</strong></span></p>
236<p dir="ltr" style="font-weight: bold;">In checkout, which steps to go after each step is decided from the server.</p>
237<p dir="ltr" style="font-weight: bold;">Except for checkout/getbilling, all API responses contain a field named NextStep.</p>
238<p dir="ltr" style="font-weight: bold; margin-bottom: 20px;">This field indicates which step to go. The value of NextStep will be one of the following.</p>
239<div dir="ltr" align="left">
240<table style="width: 100%;"><colgroup><col width="185" /><col width="439" /></colgroup>
241<tbody>
242<tr>
243<td style="text-align: center; border: solid 1px #ccc; padding: 0 20px;">
244<p dir="ltr">Value of NextStep</p>
245</td>
246<td style="border: solid 1px #ccc; padding: 0 20px;">
247<p dir="ltr">Action</p>
248</td>
249</tr>
250<tr>
251<td style="border: solid 1px #ccc; padding: 0 20px;">
252<p dir="ltr" style="text-align: center;">1</p>
253</td>
254<td style="border: solid 1px #ccc; padding: 0 20px;">
255<p dir="ltr">Go to billing address step</p>
256</td>
257</tr>
258<tr>
259<td style="border: solid 1px #ccc; padding: 0 20px;">
260<p dir="ltr" style="text-align: center;">2</p>
261</td>
262<td style="border: solid 1px #ccc; padding: 0 20px;">
263<p dir="ltr">Go to shipping address step</p>
264</td>
265</tr>
266<tr>
267<td style="border: solid 1px #ccc; padding: 0 20px;">
268<p dir="ltr" style="text-align: center;">3</p>
269</td>
270<td style="border: solid 1px #ccc; padding: 0 20px;">
271<p dir="ltr">Go to shipping method step</p>
272</td>
273</tr>
274<tr>
275<td style="border: solid 1px #ccc; padding: 0 20px;">
276<p dir="ltr" style="text-align: center;">4</p>
277</td>
278<td style="border: solid 1px #ccc; padding: 0 20px;">
279<p dir="ltr">Go to payment method step</p>
280</td>
281</tr>
282<tr>
283<td style="border: solid 1px #ccc; padding: 0 20px; text-align: center;">
284<p dir="ltr">5</p>
285</td>
286<td style="border: solid 1px #ccc; padding: 0 20px;">
287<p dir="ltr">Load payment info on webview</p>
288</td>
289</tr>
290<tr>
291<td style="border: solid 1px #ccc; padding: 0 20px;">
292<p dir="ltr" style="text-align: center;">6</p>
293</td>
294<td style="border: solid 1px #ccc; padding: 0 20px;">
295<p dir="ltr">Go to confirm order step</p>
296</td>
297</tr>
298<tr>
299<td style="border: solid 1px #ccc; padding: 0 20px;">
300<p dir="ltr" style="text-align: center;">7</p>
301</td>
302<td style="border: solid 1px #ccc; padding: 0 20px;">
303<p dir="ltr">Redirect to payment gateway (Load on webview)</p>
304</td>
305</tr>
306<tr>
307<td style="border: solid 1px #ccc; padding: 0 20px;">
308<p dir="ltr" style="text-align: center;">8</p>
309</td>
310<td style="border: solid 1px #ccc; padding: 0 20px;">
311<p dir="ltr">Show order completed dialog</p>
312</td>
313</tr>
314<tr>
315<td style="border: solid 1px #ccc; padding: 0 20px;">
316<p dir="ltr" style="text-align: center;">0</p>
317</td>
318<td style="border: solid 1px #ccc; padding: 0 20px;">
319<p dir="ltr">Leave checkout page</p>
320</td>
321</tr>
322</tbody>
323</table>
324</div>
325<p dir="ltr"><span style="font-size: 10pt;"><br /><br /></span></p>
326<p dir="ltr" style="font-weight: bold; color: #333;">Example:</p>
327<ul style="list-style: none;">
328<li dir="ltr">
329<p dir="ltr">If a user is on the billing address step (step 1) and selects ShipToSameAddress, the next step will not be 2. Because step 2 is Shipping address. It will be 3 or other.</p>
330</li>
331<li dir="ltr">
332<p dir="ltr">If a user is on the shipping address step (step 2) and selects PickupInStore the next step will not be 3. Because step 3 is shipping method and for store pick up no shipping method is needed.</p>
333</li>
334</ul>
335<p dir="ltr"><span style="font-size: 10pt;"> </span></p>
336<ul style="list-style: none;">
337<li dir="ltr">
338<p dir="ltr" style="background: #00a0db; padding: 5px 15px; font-weight: bold; text-transform: capitalize; color: #fff;">checkout/getbilling</p>
339</li>
340</ul>
341<p dir="ltr">This API is the entry point for the checkout steps. Returns the list of pre-saved addresses and the form fields for the new billing address.</p>
342<ul style="list-style: none;">
343<li dir="ltr">
344<p dir="ltr" style="background: #00a0db; padding: 5px 15px; font-weight: bold; text-transform: capitalize; color: #fff;">checkout/savebilling</p>
345</li>
346</ul>
347<p dir="ltr">Used for saving the billing address. Call this API to complete step 1.</p>
348<p dir="ltr">Request body for saving an existing address for billing address - </p>
349<p dir="ltr" style="border-top: solid 1px #ccc; padding-bottom: 10px;">{</p>
350<p dir="ltr"> "Data": {</p>
351<p dir="ltr"> "ShipToSameAddress": false</p>
352<p dir="ltr"> },</p>
353<p dir="ltr"> "FormValues": [</p>
354<p dir="ltr"> {</p>
355<p dir="ltr"> "Key": "billing_address_id",</p>
356<p dir="ltr"> "Value": "123"</p>
357<p dir="ltr"> }</p>
358<p dir="ltr"> ]</p>
359<p dir="ltr" style="border-bottom: solid 1px #ccc; padding-bottom: 10px;">}</p>
360<p dir="ltr">Here, Value is the ID of the selected address. If a user wants to ship to the same address, ShipToSameAddress will be true; false otherwise.</p>
361<p dir="ltr">Request body for saving a new billing address (See postman doc for details request body) -</p>
362<p dir="ltr" style="border-top: solid 1px #ccc; padding-bottom: 10px;">{</p>
363<p dir="ltr"> "Data": {</p>
364<p dir="ltr"> "BillingNewAddress": {</p>
365<p dir="ltr"> "Address1": "Mohakhali C/A",</p>
366<p dir="ltr"> ...</p>
367<p dir="ltr"> ...</p>
368<p dir="ltr"> "ZipPostalCode": "2323"</p>
369<p dir="ltr"> }</p>
370<p dir="ltr"> }</p>
371<p dir="ltr" style="border-bottom: solid 1px #ccc; padding-bottom: 10px;">}</p>
372<p dir="ltr">The response body will contain the field NextStep & all necessary information for that step.</p>
373<ul style="list-style: none;">
374<li dir="ltr">
375<p dir="ltr" style="background: #00a0db; padding: 5px 15px; font-weight: bold; text-transform: capitalize; color: #fff;">checkout/saveshipping</p>
376</li>
377</ul>
378<p dir="ltr">Used for saving the shipping address. Call this API to complete step 2.</p>
379<p dir="ltr">Request body for saving an existing address as shipping address - </p>
380<p dir="ltr" style="border-top: solid 1px #ccc; padding-bottom: 10px;">{</p>
381<p dir="ltr"> "Data": {</p>
382<p dir="ltr"> "PickupInStore": false</p>
383<p dir="ltr"> },</p>
384<p dir="ltr"> "FormValues": [</p>
385<p dir="ltr"> {</p>
386<p dir="ltr"> "Key": "shipping_address_id",</p>
387<p dir="ltr"> "Value": "1241"</p>
388<p dir="ltr"> }</p>
389<p dir="ltr"> ]</p>
390<p dir="ltr" style="border-bottom: solid 1px #ccc; padding-bottom: 10px;">}</p>
391<p dir="ltr">Request body for saving a pickup point store address as shipping address - </p>
392<p dir="ltr" style="/*! border-top: solid 1px #ccc; */padding-bottom: 10px;">{</p>
393<p dir="ltr"> "Data": {</p>
394<p dir="ltr"> "PickupInStore": true</p>
395<p dir="ltr"> },</p>
396<p dir="ltr"> "FormValues": [</p>
397<p dir="ltr"> {</p>
398<p dir="ltr"> "Key": "pickup-points-id",</p>
399<p dir="ltr"> "Value": "1241___Pickup.PickupInStore"</p>
400<p dir="ltr"> }</p>
401<p dir="ltr"> ]</p>
402<p dir="ltr" style="border-bottom: solid 1px #ccc; padding-bottom: 10px;">}</p>
403<p dir="ltr">Value should be in the following format:</p>
404<p dir="ltr">{Stote.Id}___Pickup.PickupInStore</p>
405<p dir="ltr">Request body for saving a new billing address (See postman doc for details request body) -</p>
406<p dir="ltr" style="border-top: solid 1px #ccc; padding-bottom: 10px;">{</p>
407<p dir="ltr"> "Data": {</p>
408<p dir="ltr"> "ShippingNewAddress": {</p>
409<p dir="ltr"> "Address1": "2424324",</p>
410<p dir="ltr"> ...</p>
411<p dir="ltr"> ...</p>
412<p dir="ltr"> "ZipPostalCode": "423424"</p>
413<p dir="ltr"> }</p>
414<p dir="ltr"> }</p>
415<p dir="ltr" style="border-bottom: solid 1px #ccc; padding-bottom: 10px;">}</p>
416<p dir="ltr">The response body will contain the field NextStep & all necessary information for that step.</p>
417<ul style="list-style: none;">
418<li dir="ltr">
419<p dir="ltr" style="background: #00a0db; padding: 5px 15px; font-weight: bold; text-transform: capitalize; color: #fff;">checkout/saveshippingmethod</p>
420</li>
421</ul>
422<p dir="ltr">Used for saving the shipping method. Call this API to complete step 3.</p>
423<p dir="ltr">Request body -</p>
424<p dir="ltr" style="border-top: solid 1px #ccc; padding-bottom: 10px;">{</p>
425<p dir="ltr"> "FormValues": [</p>
426<p dir="ltr"> {</p>
427<p dir="ltr"> "Key": "shippingoption",</p>
428<p dir="ltr"> "Value": "Regular___Shipping.FixedByWeightByTotal"</p>
429<p dir="ltr"> }</p>
430<p dir="ltr"> ]</p>
431<p dir="ltr" style="border-bottom: solid 1px #ccc; padding-bottom: 10px;">}</p>
432<p dir="ltr">Value should be in the following format:</p>
433<p dir="ltr">{ShippingMethod.Name}___{ShippingMethod.ShippingRateComputationMethodSystemName}</p>
434<p dir="ltr">The response body will contain the field NextStep & all necessary information for that step.</p>
435<ul style="list-style: none;">
436<li dir="ltr">
437<p dir="ltr" style="background: #00a0db; padding: 5px 15px; font-weight: bold; text-transform: capitalize; color: #fff;">checkout/savepaymentmethod</p>
438</li>
439</ul>
440<p dir="ltr">Used for saving the payment method. Call this API to complete step 4.</p>
441<p dir="ltr">Request body:</p>
442<p dir="ltr" style="border-top: solid 1px #ccc; padding-bottom: 10px;">{</p>
443<p dir="ltr"> "FormValues": [</p>
444<p dir="ltr"> {</p>
445<p dir="ltr"> "Key": "paymentmethod",</p>
446<p dir="ltr"> "Value": "Payments.CashOnDelivery"</p>
447<p dir="ltr"> },</p>
448<p dir="ltr"> {</p>
449<p dir="ltr"> "Key": "UseRewardPoints",</p>
450<p dir="ltr"> "Value": "true"</p>
451<p dir="ltr"> }</p>
452<p dir="ltr"> ]</p>
453<p dir="ltr" style="border-bottom: solid 1px #ccc; padding-bottom: 10px;">}</p>
454<p dir="ltr">Value for key paymentmethod is PaymentMethod.PaymentMethodSystemName</p>
455<p dir="ltr">Value for key UseRewardPoints will be true if the user wants to use rewards points for payment; False otherwise.</p>
456<p dir="ltr">The response body will contain the field NextStep & all necessary information for that step.</p>
457<ul style="list-style: none;">
458<li dir="ltr">
459<p dir="ltr" style="background: #00a0db; padding: 5px 15px; font-weight: bold; text-transform: capitalize; color: #fff;">Payment Info</p>
460</li>
461</ul>
462<ul style="list-style: none;">
463<li dir="ltr">
464<p dir="ltr">When NextStep is 5, load the URL nopstationcheckout/paymentinfo on a webview.</p>
465</li>
466<li dir="ltr">
467<p dir="ltr">When the webview redirects to a URL that contains ../step/{stepNumber} extract the step number from the URL.</p>
468</li>
469<li dir="ltr">
470<p dir="ltr">Close the webview and go to the next step</p>
471</li>
472<li dir="ltr"></li>
473</ul>
474<ul style="list-style: none;">
475<li dir="ltr">
476<p dir="ltr" style="background: #00a0db; padding: 5px 15px; font-weight: bold; text-transform: capitalize; color: #fff;">checkout/confirmorder [GET]</p>
477</li>
478</ul>
479<p dir="ltr">When NextStep is 6, go to the confirm order page and call this API to get all information about the order and show it on the screen.</p>
480<ul style="list-style: none;">
481<li dir="ltr">
482<p dir="ltr" style="background: #00a0db; padding: 5px 15px; font-weight: bold; text-transform: capitalize; color: #fff;">checkout/confirmorder [POST]</p>
483</li>
484</ul>
485<p dir="ltr"><span style="font-size: 10pt;"> </span></p>
486<p dir="ltr">This API will be called when the user is on confirm order page and clicks the confirm order button.</p>
487<p dir="ltr" style="border-bottom: solid 1px #ccc; padding-bottom: 10px;">Request body:</p>
488<p dir="ltr">None</p>
489<p dir="ltr">Response:</p>
490<p dir="ltr">The response body will contain the field NextStep & all necessary information for that step.</p>
491<ul style="list-style: none;">
492<li dir="ltr">
493<p dir="ltr" style="background: #00a0db; padding: 5px 15px; font-weight: bold; text-transform: capitalize; color: #fff;">Redirect to payment gateway</p>
494</li>
495</ul>
496<ul style="list-style: none;">
497<li dir="ltr">
498<p dir="ltr">When NextStep is 7, load the URL nopstationcheckout/redirect on a webview.</p>
499</li>
500<li dir="ltr">
501<p dir="ltr">When the webview redirects to the URL that contains ../checkout/completed or ../orderdetails close the webview and show order completed dialog.</p>
502</li>
503</ul>
504<ul style="list-style: none;">
505<li dir="ltr">
506<p dir="ltr" style="background: #00a0db; padding: 5px 15px; font-weight: bold; text-transform: capitalize; color: #fff;">checkout/completed</p>
507</li>
508</ul>
509<p dir="ltr">This API needs to be called in two scenarios.</p>
510<p dir="ltr">When NextStep is 8 show the order completed dialog. On dismiss of the dialog call this API.</p>
511<p dir="ltr">OR</p>
512<p dir="ltr">When the order completed dialog is shown after step 7, on dismiss of the dialog call this API.</p>
513<p dir="ltr">Request body:</p>
514<p dir="ltr">None</p>
515<p dir="ltr">Response:</p>
516<p dir="ltr">The response body will contain the field NextStep & all necessary information for that step. If NextStep is 0, go to the Home page.</p>
517<p> </p>
518</div>
519</div>
520</div>