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

2. Host Framework TIPTOP Host AP + DB ds ds1 ds2 …… ds ds1 ds2 …… TIPTOP Host before B2B installed TIPTOP B2B Host AP After B2B installed + wds B2B System Base Management DB

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 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. 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 supplier – Vendor Demo Account No tiptop – Administration Account No TIPTOP B2BTIPTOP ds1 Standard Accounts Management for Shipment

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

7. B2B 71 $(res.wtopprod.config)/app/wag $(res.wtopprod.config)/app/wep $(res.wtopprod.config)/app/wzz … M-Client 70 $(res.wtopprod.config)/app/wmb $(res.wtopprod.config)/app/wzz … POS 72 $(res.wtopprod.config)/app/wpos $(res.wtopprod.config)/app/wzz … GAS （ etc/as-*.xcf ） GAS （ etc/as-*.xcf ） http:// /b2b/b2b_wtopprod/… http:// /b2b/b2b_wtoptest/… http:// /mc/mclient.html http:// /mc/mclient-test.html http:// /pos/pos.html Web Address GAS 2.3 Framework

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 Directory Standard Area ［ topstd ］ Web Standard Directory wtiptop Web Customized Directory wtopcust TIPTOP Standard Directory tiptop TIPTOP Customized Directory topcust Test Area ［ toptest ］ Web Standard Directory wtiptop Web Customized Directory wtopcust TIPTOP Standard Directory tiptop TIPTOP Customized Directory topcust Official Area ［ topprod ］ Web Standard Directory wtiptop Web Customized Directory wtopcust TIPTOP Standard Directory tiptop TIPTOP Customized Directory topcust Installation Structure – Web Kit Structure

11. WTIPTOPCONFIG4ad4tb4stappincludetpltop.globalStandard Module4gl42m42r4fdper42fsddschShared Module4gl42m4fdper42fsddWork Directorybin4gl42m42r Web Directory Structure

12. $WTOPconfig4ad4tb4stappincludetpltop.global Directory Structure – Config Structure & 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 – Config Structure & 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 Snippet File 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  Javascript files for the template $WTOPCONFIG/tpl/ajax_html_tpl1/img  Graphics files for the template $WTOPconfig4ad4tb4stappincludetpltop.global

14. Directory Structure – Customize Config Structure & 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” + 3 digits 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" $WCUSTconfig4ad4tbappincludetplcust.global

15. Directory Structure – Standard Module Structure & Naming Policy  Web Standard 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 $WTOPwxx4gl42m42r4fdper42fsddsch

16. Directory Structure – Customized Module Structure & 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 $WCUSTcwxx4gl42m42r4fdper42fsddsch

17. Directory Structure – Shared Module Structure & 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_” + [Table Name] + “.4gl” Ex.$WTOP/wlib/4gl/cl_web_ui_init.4gl TIPTOP Shared Programs: Move to shared folders in the Web structure, and keep old names Modify programs: Definition of DATABASE ds in the initial, and modify to DATABASE wds File path with the initial GLOBALS “global File Path”, modify to GLOBALS “../../config/top.global” Use (Maintain Program Linkage File (p_weblink)) to register shared programs and repack 42x files 42x files packed are as follows: $WTOP/lib/42m/lib.42x $WTOP/sub/42m/sub.42x $WTOP/qry/42m/qry.42x $WTOPwlib4gl42m4fdper42fsdd

18. Directory Structure – Customized Shared Module Structure & 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 of DATABASE ds in the initial, and modify to DATABASE wds File path with the initial GLOBALS “global File 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 $WCUSTcwlib4gl42m4fdper42fsdd

19. Directory Structure – Work Directory & Development Tools $WTOPtoolbin4gl42m42r ToolMethodUsage r.cwr.cw program_name Edit programs, generate 42m r.lwr.lw program_name Generate a.exe (.42r) r.fwr.fw form_name Edit the screen file, generate 42f r.gwr.gw form_name Preview the screen, and add the component to [Maintain Multi-Language in Screens] (p_webform) to maintain multi-language titles r.rwr.rw program_name Running Program exewexew program_name Simulate web modes and run via environment variables shell r.dw+r.dw+ program_name Graphic-Interface Debug r.rwdr.rwd program_name Generate SQL Log r.swr.sw wds Combine ds.sch with wds.sch to wds.sch wrebuild Select a module or full-system editing program or screen file 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 Usage $WTOPWeb Standard Directory Path, Ex. /u1/topprod/wtiptop $WCUSTWeb Customized Directory Path, Ex. /u1/topprod/wtopcust $WTOPCONFIGStandard CONFIG Directory Path, Ex. /u1/topprod/wtiptop/config $WCUSTCONFIGCustomized CONFIG Directory Path, Ex. /u1/topprod/wtopcust/config $WTOOLTools Directory Path, Ex. /u1/topprod/wtiptop/tool $FGLDBPATH Schema Path Installed with TIPTOP, Ex. /u1/topprod/tiptop/shema Web Directory Standalone Installation, Ex. /u1/topprod/wtiptop/schema $WAG Path of Each Module ， Ex. /u1/topprod/wtiptop/wag $WAGi.exe File Folder Path for Each Module, Ex. /u1/topprod/wtiptop/wag/42r $TEMPDIRPlace Temporary Files $FGLASDIRGasd server Installation Directory

21. Operation Description  Web Operation Description  GDC Operation Description

22. Web Operation 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.xcf is activated How to re-activage: Delete process of as-b2b.xcf and apache will be auto- retrieved  Formal area address http:// /b2b/b2b_wtopprod/index.html  Test area address http:// /b2b/b2b_wtoptest/index.html  Standard area address http:// /b2b/b2b_wtopstd/index.html Select to log on internally or externally from the above

23. GDC Operation 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. Edit Screen （ $WXX/4fd ） Edit Screen File （ r.fw ） Preview Screen （ r.gw ） Edit Screen Element Language （ p_webform ） 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 p_webprog WebWeb 1. Create basic data for a program 2. Set a display style 3. Create a xcf file 4. Add rights 1. Create basic data for a program 2. Set a display style 3. Create a xcf file 4. Add rights p_weblink 1. Create links for a program p_weblang 1. Maintain group rights for the program p_webprogact 1. Maintain basic data for function keys in the program & ToolBar 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)] 1 1 3 3 2 2  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]

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 1 1 2 2 3 3

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 1 1 2 2 3 3

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 Sub-Directory  Maintain Web Directory Menus (p_webmenu)]  Maintain Directory menus and sub-menus.

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

43. Maintain Web Directory Menus - 3

44. Creating Web Users p_zw p_zy TIPTOPTIPTOP Add a Web right category 1.Set functions and data rights available p_zx 1.Create users' basic data p_zxw 1.Create special right categories for users p_zxy 1.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 p_zw p_zy p_webuser p_webauth p_webprog TIPTOPTIPTOP WebWeb 1.Maintain right categories 1.When setting rights, please assign right categories, programs and databases to users. 2.Set mapped databases by functions (For Web area only) 1.When setting rights, please assign right categories, programs and databases to users. 2.Set mapped databases by functions (For Web area only) Add programs to right categories Maintain right categories Maintain rights on programs by categories

51. Maintain User Rights - Databases and Programs  Default right category: user_web  Default logistic: The same as the “default database” in the user basic data

52. Maintain User Rights - User Basic Data  Set specific databases (Optional): Set Specific Databases for Users Priority: Set specific databases > Rights Specific databases will be prior to others if the setting is done

53. Maintain User Rights - User Basic Data

54. System Management  Set Overall Parameters  Maintain Modules  Maintain Dynamic Pop-ups  Maintain Functions in Multi-Languages

55.  Link [Set Overall Parameters (p_webparam)] Basic settings –Inquire if users want to delete processes in the same program: –When activating the same program twice, if a hint about deleting programs opened last time will be shown System Management - Set Overall Parameters

56.  Link [Set Overall Parameters (p_webparam)] Settings about B2B System Management - Set Overall Parameters –Since there is no closing function provided for Web operations, after linked, processes will be ended after time out only. Setting the limit on number of processes can auto-close the number of processes specified here for each user –Idle Processing can log out users idle for a specific time –Set seconds to detect messages by [Seconds to Check Messages] for the function [Message] in the right corner –Load a webpage after logon: Enter an address directly or select B2B

57. System Management - Maintain Modules  Link [Maintain Modules (p_webmodule)] –This is the default value

58.  Link ［ Dynamic Query Maintain （ p_webqry ）］ –To set dynamic popup used in the primary programs –Use cl_web_create_qry() to generate a popup; dynamic popup codes can be the same as those in TIPTOP –Use the data in Web first, if no data found, dynamic popup (p_qry) in TIPTOP will be used instead System Administration – Maintain Dynamic Popup

59.  Links (Maintain Functions in Multi-Language) (p_weblang) System Management – Maintain Functions in Multi-Language Entries of function titles in multiple languages –Program Codes (wzz_file.wzz01) –Directory Codes (wzd_file.wzd01) –Module Codes (wzo_file.wzo01) –Field Codes (gaq_file.gaq01) –Message Codes (ze_file.ze01) –Table Codes (gat_file.gat01) Message codes will be retrieved from the Web standard database (wds), then the TIPTOP database if no data found

60. Q & AQ & A