I SW501—2018 前言 本标准按照GB/T1.1-2009给出的规则起草。
本标准由国家口岸管理办公室提出并归口。
本标准主要起草单位:中国电子口岸数据中心、中国标准化研究院。
II SW501—2018 引言 国际贸易“单一窗口”是党中央、国务院部署的一项建设任务,“单一窗口”统一门户是国务院口岸工作部际联席会议《关于国际贸易“单一窗口”建设的框架意见》要求的建设内容之
一。
为规范“单一窗口”统一门户建设,实现全国“单一窗口”统一门户,确保工程建设质量和效率,特制定本标准。
III SW501—2018 国际贸易“单一窗口”统一门户建设规范 1范围 本标准规定了国际贸易“单一窗口”统一门户建设的统一界面、统一标识、统一域名以及全国“单一窗口”统一门户集成方式和要求。
本标准适用于“单一窗口”中央门户网站和各地方门户网站。
2规范性引用文件 下列文件对于本文件的应用是必不可少的。
凡是注日期的引用文件,仅所注日期的版本适用于本文件。
凡是不注日期的引用文件,其最新版本(包括所有的修改单)适用于本文件。
GB/T2260中华人民共和国行政区划代码 3术语和定义 SW/T101《国际贸易“单一窗口”术语》中的术语和定义适用于本文件。
4统一命名 “单一窗口”中央门户网站命名为“中国国际贸易单一窗口”。
“单一窗口”各地方门户网站命名为“中国(XX)国际贸易单一窗口”(XX代表地方名称)。
示例:“单一窗口”黑龙江的门户登录界面命名为“中国(黑龙江)国际贸易单一窗口”。
注:地方需要保留“×××电子口岸”名称,可保留在“中国(×××)国际贸易单一窗口”右侧(用“|”隔开) 或下方。
5统一标识 “单一窗口”的标识由徽标和命名的中英文文字构成,如图1所示。
图1“单一窗口”标识 “单一窗口”中央统一门户网站和各地方门户网站的徽标均采用中国电子口岸标识 。
××× 代表地方名称,××××××代表地方英文名称。
具体要求见附录B.2。
单一窗口的标识应放置在门户首页左上角,整体显示效果应醒目,如需显示地方电子口岸标识,应 放置在单一窗口标识右侧或下方,字体大小不应超过单一窗口标识的字体,示例如图
2。
1 SW501—2018 图2显示地方电子口岸的“单一窗口”标识6统一域名 “单一窗口”中央统一门户网站域名为:。
“单一窗口”各地方门户网站有2种域名规范可供选择:——结构为:,“x”的取值采用GB/T2260中2位母码,详见附录A《省市(区)行政区划代码》。
示例:中国(江苏)国际贸易单一窗口门户的公共域名为:。
——地方可以保留原有独立域名,由中央统一门户作同名映射。
示例:中国(上海)国际贸易单一窗口门户网站域名为:。
中国(江苏)国际贸易单一窗口门户网站域名为:。
7统一门户入口“单一窗口”中央统一门户网站是全国“单一窗口”的统一入口,企业通过中央统一门户网站链接 进入各地方门户网站办理相关业务,中央统一门户网站进入各地方门户网站导航界面采用中华人民共和国地图的形式,如图3所示。
2 SW501—2018 图3导航界面8统一界面8.1首页布局 “单一窗口”各地方门户网站首页要求统一界面布局,如图4所示:
3 SW501—2018 图4地方门户界面其中区域③和④由国际贸易“单一窗口”标准版统一提供,界面设计有关要求详见附录B《地方门户界面设计规范》,图片色调可自行定义。
首页布局参照附录C.1示例代码Index.jsp。
8.2首页集成中国国际贸易单一窗口与各地方门户网站采用Iframe方式进行集成,集成方式分为虚拟SaaS和集成SaaS两种,分别如下:
4 SW501—20188.2.1虚拟SaaS方式首页集成 使用基于标准的index_vs.jsp(参见附件压缩包中目录local-oauth-demo\webapp)进行修改。
其中图3地方门户界面中的区域③,为嵌入代码地区,需进行如下修改:
0077uu0077uu0077uu002euu0073uu0069uu006euu0067uu006cuu0065uu0077uu0069uu006euu0064uu006fuu0077uu002euu0063uu006euu002fuu0073uu0069uu006euu0067uu006cuu0065uu0077uu0069uu006euu0064uu006fuu0077uu002fuu0074uu0061uu0062uu006cuu0065uu002euu006auu0073uu0070uu0078uu003fuu0061uu0072uu0065uu0061uu005fuu0069uu0064uu003d地区6位代码"> 注:上述代码段中“地区6位代码”取本地区值,见附录
A。
用户在区域③输入用户名/密码登录后,跳转到“单一窗口”标准版应用管理桌面(见图5)。
地方
无需对“单一窗口”标准版功能进行任何维护,并可通过该界面添加或修改地方特色应用。
图5应用管理界面“单一窗口”标准版应用管理界面如上图所示,分为四个部分:a)用户定制区用户可在该区域定制并显示常用应用;b)用户历史浏览区记录用户的浏览历史;b)标准版应用区该区由“单一窗口”标准版系统管理员统一管理,包括发布,修改和启停有关应用;d)地方特色应用区该区域由中央单一窗口门户发布账号,使用统一的添加、修改界面进行管理,见图6所示。
5 SW501—2018 图6地方特色应用管理界面 8.2.2集成SaaS方式首页集成 采取本地集中包(附件local-oauth-demo.zip)的方式进行集成,如果涉及地方的本地其他方式 登录,可自行设置。
集成包文件说明: 登录图标见集中包解压后的路径\local-oauth-demo\webapp\images\login。
集中包解压后的路径\local-oauth-demo\webapp\下的文件说明: 序号 文件名称 文件作用 1index.jsp 门户首页和登录页面,示例见附录C.1,该文件需要修改 2console_show.jsp 跨域控制切换登录类型,该文件不建议修改 3deliver_para.jsp 跨域参数传递,该文件不建议修改 4local_login.jsp 地方登录页面参考示例,示例见附录C.2,该文件需要修改 5logo.png Logo标志,提供地方使用,该文件不需要修改
6 SW501—2018 附录A(规范性附录)省市(区)行政区划代码 各省(区、市)的行政区划6位数字码以及2位字母码如表A.1所示:表A.1各省(区、市)以及部分计划单列市行政区划代码 代码 110000120000130000140000150000210000220000230000310000320000330000330200340000350000350200360000370000410000420000430000440000440300450000460000500000510000520000530000540000610000620000630000640000650000 名称 北京市天津市河北省山西省内蒙古自治区辽宁省吉林省黑龙江省上海市江苏省浙江省宁波市安徽省福建省厦门市江西省山东省河南省湖北省湖南省广东省深圳市广西壮族自治区海南省重庆市四川省贵州省云南省西藏自治区陕西省甘肃省青海省宁夏回族自治区新疆维吾尔自治区 2位字母码 BJTJHESXNMLNJLHLSHJSZJNBAHFJXMJXSDHAHBHNGDSZGXHICQSCGZYNXZSNGSQHNXXJ
7 SW501—2018 附录B(规范性附录)地方门户界面设计规范 B.1总体要求 浏览器要求如下:——应使用Chrome20及以上版本或IE9及以上版本(宜使用IE10或11版本)浏览器;——若使用windows7及以上操作系统,宜使用Chrome50及以上版本;——若使用windowsXP操作系统,宜使用Chrome26版本。
地方门户界面设计示意图见正文图4所示,整体界面设计环境为1366*768分辨率,内容显示区建议设定在1000px;背景填充可设计成自适应宽度,各区域的高度尺寸请按照下文提供尺寸设定,整体界面高度可根据各地方具体栏目的多少自行设定,但风格规范需按照如下要求制作。
B.2Logo Logo如图1所示。
具体要求如下:
(1)Logo中文:微软雅黑,字号:20px,色值:#3c3c3c,字间距50;
(2)Logo英文:Arial,字号:12px,色值:#3c3c3c;
(3)总体背景高度:60px,宽度自适应。
B.3导航栏 导航栏如图A.1所示: 图A.1导航栏要求如下:
(1)选中状态:微软雅黑,字号:16px,色值:#0076ca,字间距60,加粗;
(2)未选中状态:微软雅黑,字号:16px,色值:#505050,字间距60,加粗;
(3)总体背景高度:60px,宽度自适应。
B.4Banner Banner如图A.2所示:
8 SW501—2018 图A.2Banner 要求如下:
(1)尺寸:1366px*334px(以蓝色调图片为主,可做一张也可做多张切换)。
B.5登录框登录框要求如下:
(1)登录方式文字选中状态:微软雅黑,字号:18px,色值:#ffffff,字间距25,加粗;未选中状态:微软雅黑,字号:18px,色值:#c8c8c8,字间距25。
(2)输入框未选中状态:微软雅黑,字号:14px,色值:#c8c8c8,字间距25,加粗;输入框:背景色:#ffffff,描边色值:#c8c8c8,描边1px;图标背景色:#dcdcdc,图标色值:#ffffff。
登陆框尺寸标注如图A.3,单位px。
图A.3登录框
(3)登录按钮 背景色:#38cdeb,1px描边,描边色值#4aa8e6;字体:微软雅黑,字号:18px,色值:#ffffff,字间距25,加粗。
9 SW501—2018
(4)“立即注册”和“忘记密码”字体:微软雅黑,字号:14px,色值:#323232,字间距25,加粗外发光。
B.6功能应用区 功能应用区要求如下:
(1)应用导航栏尺寸:高度40px,宽度自适应,单个应用按钮宽度140px(也可根据字数调整宽度);背景色:#2d82eb;选中状态文字:微软雅黑,字号:16px,加粗,色值#0f69d7;未选中状态文字:微软雅黑,字号:16px,不加粗,色值#ffffff。
(2)一级菜单栏尺寸:65px*112px,描边1px,描边色值#dcdcdc;未开通状态文字:微软雅黑,字号:16px,不加粗,色值#8c8c8c;开通状态文字:微软雅黑,字号:16px,不加粗,色值#3c3c3c;选中状态文字:微软雅黑,字号:16px,加粗,色值#3c3c3c。
(3)二级菜单栏背景尺寸:120*120px;开通背景填充色:#0f69d7,图标色:#ffffff;未开通背景填充色:#b4b4b4,图标色:#ffffff;文字:微软雅黑,字号:14px,#ffffff。
尺寸标注见图A.4,单位px。
B.7新闻栏新闻栏如图A.5所示: 图A.4功能应用区尺寸 图A.5新闻栏 10 SW501—2018 要求如下:
(1)导航栏尺寸:高度40px,宽度自适应,单个应用按钮宽度140px(也可根据字数调整宽度);背景色:#2d82eb;选中状态文字:微软雅黑,字号:16px,加粗,色值#0f69d7;未选中状态文字:微软雅黑,字号:16px,不加粗,色值#ffffff。
(2)新闻图片背景色填充#e6e6e6,尺寸214*336px;图片尺寸202*324px,如图A.6所示; 图A.6新闻图片尺寸
(3)标题字体:微软雅黑,字号:18px,色值:#0076ca,间距60;
(4)“年月”字体:微软雅黑,字号:16px,色值:#6e6e6e,间距60;
(5)“日”字体:微软雅黑,字号:58px,色值:#0076ca,间距60;
(6)正文字体:微软雅黑,字号:16px,色值:#0505050;
(7)“了解更多”字体:微软雅黑,字号:16px,色值:#0076ca。
B.8FootFoot栏要求如下:
(1)背景填充色:#323232,整体高度160px,宽度自适应;
(2)中文字体:微软雅黑,字号:14px,色值:#bebebe,间距25;
(3)英字体:微软雅黑,字号:12px,色值:#bebebe,间距3;
(4)左侧可添加微信公众号二维码:尺寸72*72px,多个二维码之间间距20px。
Foot栏尺寸如下图所示: 图A.7Foot栏尺寸 11 SW501—2018 附录C(资料性附录) 示例文件 C.1示例文件index.jsp <%Stringarea_id="360000";//地方行政区划代码 //1、设置本应用的地址,即地方系统的地址StringlocalServerUrl="/本地目录"; //2、设置标准版登录地址,如:/cas,//PlatConstant.OAUTH_SERVER_URL值配置在platformconfig.properties的参数项sw.oauth.url里StringstandartLoginUrl=PlatConstant.OAUTH_SERVER_URL; //3、设置登录成功后返回地方的地址Stringservice="/singlewindow/table.jspx?
area_id="+area_id;//默认标准版门户地址,360000为行政区划,地区6位代码取值见附录
A。
//service=request.getParameter("service");//传入地址 //4、如地方有本地登录,可设置地方登录地址和链接名称(可选)StringisLocalLogin="0";//是否需要本地登录链接,如果不需要,设置为0;需要设置为
1。
StringlocalLoginLinkName="上海本地登录";//本地登录链接名称,如果不需要,设置为空字符StringlocalLoginUrl="/local_login.jsp";//本地登录链接地址,如果不需要,设置为空字符 StringlocalConfig="&localServerUrl="+localServerUrl;if("1".equals(isLocalLogin)){ localLoginLinkName=SWUtil.string2uuCode(localLoginLinkName);localConfig+="&isLocalLogin="+isLocalLogin +"&localLoginLinkName="+localLoginLinkName+"&localLoginUrl="+localLoginUrl;} //5、设置地方定制的标准版账号登录地址,不用修改StringjumpUrl=standartLoginUrl+"/jump.jsp";service=SWUtil.getJumpUrl(service,jumpUrl);StringcustomLoginUrl=standartLoginUrl+"/login?
_local_login_flag=1"+"&service="+service 12 +localConfig;%> SW501—2018 C.2示例文件local_login.jsp local_login.jsp是地方登录页面参考示例,主要解决在本地登录里如何切换到标准版登录。