Web Environment Framework & System Management

1. Web Environment Framework & System Management TIPTOP Product Center DigiWin May 14, 2013

2. Host Framework TIPTOPHost AP+DB TIPTOPB2BHost AP ds ds1 ds2 …… B2BSystem Base Management DB + wds After B2Binstalled TIPTOP Host before B2Binstalled

3. Standard Accounts Management for Shipment • TIPTOP accounts and B2B accounts are controlled separately. The former are created via “p_zx (zx_file)” in the TIPTOP host, the later are via p_webuser (wzx_file) in the B2B host. • Rights over multiple plants allowed for TIPTOP accounts, just switch to the plant you want when logging in udm_tree; When creating a B2B account, please assign 1. A “default database” (Mandatory) and 2. Multiple “Specific databases” (Optional) (Please refer to <Maintain Logistic Basic Data> for plants available for both systems). • After adding a logistic in “Maintain Group Structures” (aooi931), for the formal area, please copy fglprofile.prod to the directory B2B的$FGLDIR/etc manually.

4. Standard Accounts Management for Shipment • A TIPTOP account can be mapped to multiple right groups (p_zw), operations available are set based on groups (p_zy); a B2B account can be mapped to multiple right groups too (p_webauthcol) but only one operation available (p_webauth) • There are two standard accounts for shipment: supplier, tiptop TIPTOP TIPTOPB2B ds1 supplier – Vendor DemoAccount No tiptop – Administration Account No

5. Account Management before Running Online • Add more formal databases for vendors based on their needs. • Databases are created via aooi931 or createdb. Tables are as those in ds. • The vendor accounts can be added via p_webuser directly or use [Import TIPTOP Users] to import accounts in TIPTOP to B2B. • Assign each account with a mapped database (Select in a popup window). • Set various right groups to separate operations available by different vendor levels. • Assign a right group or single operation for each account.

6. GAS 2.3 Framework Apache （httpd-fastcgi.conf ） GAS （bin/wrapper*.fcgi ） <IfModule mod_fastcgi.c> FastCgiServer /u6/bsframework/gas/bin/wrapper-b2b.fcgi -idle-timeout 300 -initial- Alias /b2b /u6/bsframework/gas/bin/wrapper-b2b.fcgi <Directory "/u6/bsframework/gas/bin/"> # Launch GAS program exec "$FGLASDIR"/bin/fastcgidispatch -f as-b2b.xcf <IfModule mod_fastcgi.c> FastCgiServer /u6/bsframework/gas/bin/wrapper-mclient.fcgi -idle-timeout 300 -initial- Alias /mc /u6/bsframework/gas/bin/wrapper-mclient.fcgi <Directory "/u6/bsframework/gas/bin/"> # Launch GAS program exec "$FGLASDIR"/bin/fastcgidispatch -f as-mclient.xcf <IfModule mod_fastcgi.c> FastCgiServer /u6/bsframework/gas/bin/wrapper-pos.fcgi -idle-timeout 300 -initial- Alias /mc /u6/bsframework/gas/bin/wrapper-pos.fcgi <Directory "/u6/bsframework/gas/bin/"> # Launch GAS program exec "$FGLASDIR"/bin/fastcgidispatch -f as-pos.xcf

7. GAS 2.3 Framework GAS （etc/as-*.xcf ） WebAddress <ENVIRONMENT_VARIABLE Id="WPRODUCT">B2B</ENVIRONMENT_VARIABLE> <RESOURCE Id="res.ic.port.offset" Source="INTERNAL">71</RESOURCE> <GROUP Id="wtopprod-wag">$(res.wtopprod.config)/app/wag</GROUP> <GROUP Id="wtopprod-wep">$(res.wtopprod.config)/app/wep</GROUP> <GROUP Id="wtopprod-wzz">$(res.wtopprod.config)/app/wzz</GROUP> … http://<IP Address>/b2b/b2b_wtopprod/… http://<IP Address>/b2b/b2b_wtoptest/… <ENVIRONMENT_VARIABLE Id="WPRODUCT">M-Client</ENVIRONMENT_VARIABLE> <RESOURCE Id="res.ic.port.offset" Source="INTERNAL">70</RESOURCE> <GROUP Id="wtopprod-wag">$(res.wtopprod.config)/app/wmb</GROUP> <GROUP Id="wtopprod-wzz">$(res.wtopprod.config)/app/wzz</GROUP> … http://<IP Address>/mc/mclient.html http://<IP Address>/mc/mclient-test.html <ENVIRONMENT_VARIABLE Id="WPRODUCT">POS</ENVIRONMENT_VARIABLE> <RESOURCE Id="res.ic.port.offset" Source="INTERNAL">72</RESOURCE> <GROUP Id="wtopprod-wag">$(res.wtopprod.config)/app/wpos</GROUP> <GROUP Id="wtopprod-wzz">$(res.wtopprod.config)/app/wzz</GROUP> … http://<IP Address>/pos/pos.html

8. Environment Framework & Naming Policy • Installation Structure • Directory Structure, Files Naming Policy • Environment Variables

9. Installation Structure – Web Kit Installation • The kit can be installed on a non-TIPOP host dependently • Genero version installed on the B2B host should be 2.21 above • Standard database is wds • For details, please refer to the installation documents

10. Installation Structure – Web Kit Structure

11. WebDirectory Structure

12. Directory Structure –ConfigStructure & Naming Policy • 4ad: Include language-based folders to place standards and Action Default files for each program Ex.$WTOPCONFIG/4ad/0/tiptop.4ad • $WTOPCONFIG/4ad/0/wag/wagt001.4ad • 4tb: Include module-based folders to place standards and ToolBar files for each program • Ex.$WTOPCONFIG/4tb/tiptop_m.4tb • $WTOPCONFIG/4tb/wag/wagt001.4tb • 4st: Place shared StyleList files • Ex.$WTOPCONFIG/4st/tiptop.4st • Include:If the syntax &include is used to link to segments, segment files will be placed here • top.global: Shared variables top.global includes required shared variables in Web-based modules and original shared ones in TIPTOP, • Add GLOBALS "../../config/top.global“ in them

13. Directory Structure –ConfigStructure & Naming Policy • App: Divide into folders by modules and application profiles (.xcf) for each program placed here; Data can be auto-generated via [Maintain Program & Application Profiles (p_webprog)] • File Naming Policy[applicationCode] + “.xcf” • Ex. $WTOPCONFIG/app/wag/wagt001.xcf • tpl:Divide into a style code folder to place shared Template and Snippet files • Web Style Folder Naming Policy: • [User Agent Type] + “_tpl”+Serial No • Template File Fixed Name: main.xhtml • SnippetFile Naming Policy: [Widget Name].xhtml • Ex. $WTOPCONFIG/tpl/ajax_html_tpl1/main.xhtml (template) For IE • $WTOPCONFIG/tpl/ajax_html_tpl1/Button.xhtml (snippet) For IE • $WTOPCONFIG/tpl/ajax_tpl1/main.xhtml (template) For Firefox • $WTOPCONFIG/tpl/ajax_tpl1/Button.xhtml (snippet) For Firefox • Graphics, CSS and Javascript files for each template will be placed here by folders • Ex. $WTOPCONFIG/tpl/ajax_html_tpl1/css CSS files for the template • $WTOPCONFIG/tpl/ajax_html_tpl1/js  Javascriptfiles for the template • $WTOPCONFIG/tpl/ajax_html_tpl1/img  Graphics files for the template

14. Directory Structure –Customize ConfigStructure & Naming Policy • 4ad、4tb、app： • Via［Program and Applicatioin Setting Maintain （p_webprog）］ Produce • tpl：（ Does not provide customized ,now） • Web Style Folders Naming Rule ：[User Agent Type] + “_ctpl”+3digits Serial number • Template File Fix Naming：main.xhtml • Snippet File Naming Rule：[Widget Name].xhtml • Ex. xhtml/ajax_html_ctpl1/main.xhtml (template) • xhtml/ajax_html_ctpl1/Button.xhtml (snippet) • xhtml/ajax_ctpl1/main.xhtml (template) • xhtml/ajax_ctpl1/Button.xhtml (snippet) • cust.global： • Customized global Variable 。 • Customized Program： • GLOBALS "../../../wtiptop/config/top.global" • GLOBALS "../../config/cust.global"

15. Directory Structure –Standard ModuleStructure & Naming Policy • WebStandard Modules: WXX （$WTOP/wxx） • Naming Policy: [wxx] + Operation Type +Serial No in 3 digits • Ex. $WAG/4gl/wagt001.4gl • $WAG/4fd/wagt001_1.4fd • $WAG/4fd/wagt001_2.4fd • Shared programs naming policy: [swxx] + Operation Type +Serial No in 3 digits

16. Directory Structure –Customized ModuleStructure & Naming Policy • Customized Web modules: CWXX （$WCUST/cwxx） • Customized standard programs: Keep old names • Ex. $CWAG/4gl/wagt001.4gl • $CWAG/4fd/wagt001_1.4fd • $CWAG/4fd/wagt001_2.4fd • New customized programs: • Naming Policy: [cwxx] + Operation Type +Serial No in 3 digits • Ex. $CWAG/4gl/cwagt020.4gl • $CWAG/4fd/cwagt020_1.4fd • $CWAG/4fd/cwagt020_2.4fd

17. Directory Structure –Shared ModuleStructure & Naming Policy • Shared modules（$WTOP/wlib,lib,sub,qry） • Shared modules for Web modification or addition • Naming Policy: “cl_web_”+ [Usage in Brief] + “.4gl” • “cl_”+ [Usage in Brief] + “.4gl” • “s_”+ [Usage in Brief] + “.4gl” • “q_”+ [TableName] + “.4gl” • Ex.$WTOP/wlib/4gl/cl_web_ui_init.4gl • TIPTOPShared Programs: • Move to shared folders in the Web structure, and keep old names • Modify programs: • Definition of DATABASE dsin the initial, and modify to DATABASE wds • File path with the initial GLOBALS “globalFile Path”, • modify to GLOBALS“../../config/top.global” • Use(Maintain Program Linkage File (p_weblink)) to register shared programs and repack 42x files • 42xfiles packed are as follows: • $WTOP/lib/42m/lib.42x • $WTOP/sub/42m/sub.42x • $WTOP/qry/42m/qry.42x

18. Directory Structure –Customized Shared ModuleStructure & Naming Policy • Customize shard modules（$WCUST/cwlib,clib,csub,cqry） • Shared modules for Web modification or addition • Naming Policy: “ccl_web_”+ [Usage in Brief] + “.4gl” • “ccl_”+ [Usage in Brief] + “.4gl” • “cs_”+ [Usage in Brief] + “.4gl” • “cq_”+ [Usage in Brief] + “.4gl” • Ex.$WCUST/cwlib/4gl/ccl_web_ui_init.4gl • Use old customized programs directly: • Move to shared folders in the Web structure, and keep old names • Modify programs: • Definition ofDATABASE ds in the initial, and modify toDATABASE wds • File path with the initialGLOBALS “globalFile Path”, • Modify to GLOBALS“../../../wtiptop/config/top.global” • Use (Maintain Program Linkage File (p_weblink)) to register or modify modules and pack 42x files with standard shared programs to the following: • $WTOP/lib/42m/lib.42x • $WTOP/sub/42m/sub.42x • $WTOP/qry/42m/qry.42x

19. Directory Structure – Work Directory & Development Tools Confirm the command xcf retrieved from apache > ps -ef|grep 'fastcgi' (Check if as-b2b.xcf is activated): Delete processes of as-b2b.xcf, apache will be auto-retrieved

20. Environment Variables

21. Operation Description • WebOperation Description • GDCOperation Description

22. WebOperation Description – Logging Systems & Running Programs(GAS 2.30) • Please confirm as-b2b.xcf has been retrieved by apache, the confirmation method is • > ps -ef|grep 'fastcgi' • Check if as-b2b.xcfis activated • How to re-activage: Delete process of as-b2b.xcfand apachewill be auto-retrieved • Formal area address • http://<AP Server IP>/b2b/b2b_wtopprod/index.html • Test area address • http://<AP Server IP>/b2b/b2b_wtoptest/index.html • Standard area address • http://<AP Server IP>/b2b/b2b_wtopstd/index.html • Select to log on internally or externally from the <AP Server IP>above

23. GDCOperation Description – For Testing • Please install GDC version above 2.21X • Use r.rw or exew to run programs • Logon accounts will be taken as users • [Specific Database] or [Default Database] set in [User Basic Data (p_webuser) will be used as the database • The language is the default one set in [User Basic Data (p_webuser)] • The Web module is developed for each kind of User Agent Browser, GDC is used to check logic-based data during the developing process only

24. Developing Procedures for Operations • Web screens • Creating Web Program Data • Maintaining Web Directory Menus • Creating Web Users • Maintaining Web User Rights

25. TIPTOP Web Screen Developing Procedures

26. Use Genero Studio to edit 4fd r.fw [form_name] File extension not required Use 4fd, if it doesn't exist, edit per instead Step 1 - Editing Screen Files

27. r.gw [form_name] [012..] [p/c] [Y/N] File extension not required for form_name The second parameter is for the language code The third parameter “p” refers to the screen file under the standard directory; “c” is that under the customized directory The fourth parameter “Y” refers to preview screen, “N” do not preview screen but add the screen component to [Maintain Screens in Multi-Language (p_webform)] Step 2 - Preview Screen Files

28. Links [Maintain Screens in Multi-Language (p_webform)] Step 3 - Maintain Screens in Multi-Language Maintain titles on screens in multiple languages

29. Creating Web Program Data Web p_webprog p_weblink 1. Create basic data for a program 2. Set a display style 3. Create a xcf file 4. Add rights 1. Create links for a program p_webprogact p_weblang 1. Maintain basic data for function keys in the program & ToolBar 1. Maintain group rights for the program p_webprog 1. Create links for the program

30. Links [Maintain Programs & Application Profiles (p_webprog)] Create Program Basic Data 1 – Create Basic Data • Add program codes • The web code will be the same as the program code by default • Select a module • Select a program type (i. General program) Select a ToolBar type • 0. Not used; • 1. Standard ToolBar (By the program type) • 2. Customize the program (Link to “Maintain Toolbar”) • Link to “Set Screen Settings” • The web style for each browser • Click [OK] to finish

31. Create Program Basic Data 1 – Create Basic Data • [Maintain Programs & Application Profiles (p_webprog)] • If no error found when running the program, go back to set basic data • Please select "Run Application via Shell" (This is mandatory for TIPTOP Web modules) • If no web style selected, the GWC default values will be applied as the Web screen layout • Press [Create xcf] to create the application profile in the folder of the program under $WTOPCONFIG/app/ To process data found in batches, press [Generate in Batches] 2 1 3

32. Link to [Maintain Program Links (p_weblink)] Press [Maintain Links] Create Program Basic Data 2 – Create Links

33. Link to [Maintain Program Links (p_weblink)] Retrieve the basic file 42m, to add other 42m files, please access the details Press [Generate .exe] to auto-generate a 42r file If 42r cannot be generated, an error message will be popup Then, go back to the basic data page and press [Previous] Create Program Basic Data 2 – Create Links

34. [Maintain Programs & Application Profiles (p_webprog)] Click [Update] and link to [Maintain Functions in Multi-Languages (p_weblang)] to enter languages for the program After finished, click [OK] -> [Previous] to go back to previous basic data page Create Program Basic Data 3 – Create Program Names in Multi-Language 3 1 2

35. Link to [Maintain Actions Mapped to Programs and ToolBar (p_webprogact)] If the type selected is 2. Customize ToolBar by Programs”, you can link to the toolbar for entries Create Program Basic Data 4 – Maintain ToolBar

36. Create Program Basic Data 4 – Maintain Functions • After accessing, all actions will be auto-retrieved

37. Create Program Basic Data 4 – Maintain ToolBar • All Action items are listed in the table on the right; to move them to the ToolBar, use the right/left arrows to put an Action into the ToolBar or remove from it • Items on the ToolBar are listed on the right; use up/down arrows to adjust their display sequence • After finished, click [Generate 4ad and 4tb Files], so that they can be auto-imported when activating programs 3 2 1

38. Create Program Basic Data 5 – Maintain Group Rights • Maintain “Set Group Rights” for programs

39. Create Program Basic Data 5 – Maintain Group Rights

40. Directory Menus • Sub-Directory • Directory Levels • User Directories

41. Maintain Web Directory Menus - 1 • Maintain Web Directory Menus (p_webmenu)] • Maintain Directory menus and sub-menus. Sub-Directory

42. Maintain Web Directory Menus - 2 User Directory “tiptop-web” A Directory name must be given or it cannot be displayed After selecting a color, press Place the sub-directory under “tiptop-web”

43. Maintain Web Directory Menus - 3

44. Creating Web Users TIPTOP p_zw p_zy Add a Web right category • Set functions and data rights available p_zxw p_zx • Create special right categories for users • Create users' basic data p_zxy • Create user rights on multiple logistics

45. Creating Web Users 1 – Add Web Right Categories • [Create Program Data (p_zw)]

46. Creating Web Users 2 – Maintain Right Categories • [Set Execution Rights (p_zy)]

47. Creating Web Users 2 – Create User Basic Data • [User Basic Data (p_zx)]

48. Creating Web Users 4 – Create Special User Right Categories • [Set User Right Categories (p_zxw)] • Add rights for the category user_web

49. Creating Web Users 5 – Create User Right for Multi-Logistics • [Set User Rights for Logistics (p_zxy)]

50. Maintain Web User Rights TIPTOP p_zw p_zy Maintain right categories Maintain rights on programs by categories Web p_webuser • When setting rights, please assign right categories, programs and databases to users. • Set mapped databases by functions (For Web area only) p_webauth • Maintain right categories p_webprog Add programs to right categories