Skip to content

G
gs1
Commit 021dc96e by tang
Options

feat: 头部样式更新

parent d9a8b424
Showing with 105 additions and 38 deletions
src/components/layout/header/HeaderDropdown.vue
......@@ -67,8 +67,13 @@ export default {
if (itemBox.length > 0) {
children.push(this.renderItemBox([...itemBox], true));
}
// style: { flex:'1 1 490px'},
const classNames = ["gs-dropdown-rect"];
if(nav.class){
classNames.push(...nav.class)
}
return (
<div class="gs-dropdown-rect">
<div class={classNames.join(" ").trim()} style={{...nav.style}}>
<div
class="rect-title gs-hover"
vOn:click={() => {
......@@ -88,7 +93,7 @@ export default {
renderItemBox(items, isChild = false) {
const classNames = ["gs-dropdown-col", isChild ? "no-padding-top" : ""];
return (
<div class={classNames.join(" ").trim()}>
<div class={classNames.join(" ").trim()} style={items[0].style}>
{items.map((item) => {
return (
<div class="gs-dropdown-item">
......@@ -149,7 +154,7 @@ export default {
}
.gs-dropdown-rect {
flex:1 0 auto;
//flex:1 0 auto;
display: flex;
flex-direction: column;
padding-right: 75px;
......@@ -172,15 +177,16 @@ export default {
.rect-body {
display: flex;
flex-wrap: wrap;
justify-content: flex-start;
}
}
.gs-dropdown-col {
flex:1 0 auto;
//flex:1 0 auto;
display: flex;
flex-direction: column;
padding-top: 35px;
padding-right: 75px;
padding-right: 60px;
margin-bottom: 20px;
border-top: 1px solid rgba(4, 64, 141, 0.18);
......@@ -199,11 +205,35 @@ export default {
}
@media (max-width: 992px) {
.navbar-dropdown-menu-inner,.rect-body{
flex-direction: column;
}
.gs-dropdown-rect{
padding-top: 0;
flex-direction: column;
flex: 1!important;
}
.gs-dropdown-col{
flex: 1!important;
}
.gs-dropdown-rect,.gs-dropdown-col{
border-top: none;
padding-right: 0;
}
}
@media (min-width: 1400px) {
.service_xtcy_custom,.service_cxfw_custom{
flex:1 0 auto;
}
}
@media (max-width: 1399px){
.service_xtcy_custom{
flex:1 0 490px;
}
.service_cxfw_custom{
flex:1 0 260px;
}
}
</style>
src/components/layout/header/mock.js
......@@ -22,6 +22,7 @@ export const nav = [
nameInHeaderNav: "机构概况",
index: 0,
link: "/Org",
style: { flex:'1 0 auto' },
breadcrumb: [{ name: "机构概况", path: "/Org" }, { name: "中心简介" }],
children: [
{
......@@ -29,6 +30,7 @@ export const nav = [
name: "中心简介",
index: 0,
link: "/Org/Intro",
style: { paddingRight:'160px' },
breadcrumb: [
{ name: "机构概况", path: "/Org" },
{ name: "中心简介" },
......@@ -177,9 +179,10 @@ export const nav = [
{
id: uuid("gs_nav"),
name: "我还不是系统成员（企业初次申请）",
nameInHeaderNav: "我还不是系统成员",
nameInHeaderNav: "我还不是系统成员（企业初次申请）",
index: 2,
link: "",
style: { flex:'0 0 356.24px'},
breadcrumb: [{ name: "业务大厅", path: "/Business" }, { name: "我还不是系统成员（企业初次申请）" }],
children: [
{
......@@ -366,9 +369,10 @@ export const nav = [
{
id: uuid("gs_nav"),
name: "我是系统成员（成员专区）",
nameInHeaderNav: "我是系统成员",
nameInHeaderNav: "我是系统成员（成员专区）",
index: 2,
link: "/Business",
class:['service_xtcy_custom'],
breadcrumb: [{ name: "业务大厅", path: "/Business" }, { name: "我是系统成员（成员专区）" }],
children: [
{
......@@ -495,10 +499,22 @@ export const nav = [
nameInHeaderNav: "跨境业务办理专区",
index: 2,
link: "/Business",
style: { flex:'1 0 auto' },
breadcrumb: [{ name: "业务大厅", path: "/Business" }, { name: "跨境业务办理专区" }],
children: [
{
id: uuid("gs_nav"),
name: "全球法人机构识别编码（LEI）业务办理",
index: 2,
link: "/Business/GLN",
breadcrumb: [
{ name: "业务大厅", path: "/Business" },
{ name: "办理其他业务", path: "/Business/GLN" },
{ name: "全球参与方位置代码（GLN）业务办理" },
],
},
{
id: uuid("gs_nav"),
name: "全球参与方位置代码（GLN）业务办理",
index: 2,
link: "/Business/GLN",
......@@ -526,12 +542,14 @@ export const nav = [
name: "资讯中心",
index: 5,
link: "/News/index",
style:{flex:'1 0 620px'},
children: [
{
id: uuid("gs_nav"),
name: "图片资讯",
index: 5,
link: "/News/PicNews",
style:{paddingRight:'160px'},
breadcrumb: [
{ name: "资讯中心", path: "/News/index" },
{ name: "图片资讯" },
......@@ -572,6 +590,7 @@ export const nav = [
name: "国际追踪",
index: 5,
link: "/News/International",
style:{paddingRight:'132px'},
breadcrumb: [
{ name: "资讯中心", path: "/News/index" },
{ name: "国际追踪" },
......@@ -635,12 +654,14 @@ export const nav = [
name: "应用领域",
index: 5,
link: "/News",
style:{flex:'1 0 auto'},
children: [
{
id: uuid("gs_nav"),
name: "零售",
index: 5,
link: "/News/Retail",
style:{paddingRight:'132px'},
breadcrumb: [
{ name: "资讯中心", path: "/News" },
{ name: "零售" },
......@@ -733,6 +754,7 @@ export const nav = [
nameInHeaderNav: "技术与标准",
index: 0,
link: "/Knowledge",
style: { flex:'1 0 auto' },
breadcrumb: [{ name: "技术与标准", path: "/Knowledge" }, { name: "技术与标准" }],
children: [
{
......@@ -763,6 +785,7 @@ export const nav = [
nameInHeaderNav: "技术知识",
index: 6,
link: "/Knowledge",
style: { flex:'1 0 auto' },
breadcrumb: [{ name: "技术知识", path: "/Knowledge" }, { name: "技术知识" }],
children: [
{
......@@ -839,6 +862,7 @@ export const nav = [
nameInHeaderNav: "政策法规",
index: 1,
link: "/Knowledge/Statute",
style: { flex:'1 0 auto' },
breadcrumb: [{ name: "技术知识", path: "/Knowledge" }, { name: "政策法规" }],
children: [{}]
},
......
src/components/layout/header/search.js
import {uuid} from "@/utils/utils";
export default {
export default {
id: "3",
name: "条码查询",
index: 3,
link: "/search",
rowNum: 5,
breadcrumb: [
{ name: "服务中心", path: "/service" },
{ name: "查询服务", path: "/search/tool" },
{ name: "条码信息查询" },
{name: "服务中心", path: "/service"},
{name: "查询服务", path: "/search/tool"},
{name: "条码信息查询"},
],
children: [
{
......@@ -19,9 +19,9 @@ export default {
index: 0,
link: "/search/tool",
breadcrumb: [
{ name: "服务中心", path: "/service" },
{ name: "查询服务", path: "/search/tool" },
{ name: "条码信息查询" },
{name: "服务中心", path: "/service"},
{name: "查询服务", path: "/search/tool"},
{name: "条码信息查询"},
],
children: [
{
......@@ -29,10 +29,11 @@ export default {
name: "境内条码信息查询",
index: 0,
link: "/search/internal",
style: { paddingRight:'160px' },
breadcrumb: [
{ name: "服务中心", path: "/service" },
{ name: "查询服务", path: "/search/tool" },
{ name: "境内条码信息查询" },
{name: "服务中心", path: "/service"},
{name: "查询服务", path: "/search/tool"},
{name: "境内条码信息查询"},
],
},
{
......@@ -41,9 +42,9 @@ export default {
index: 1,
link: "/search/external",
breadcrumb: [
{ name: "服务中心", path: "/service" },
{ name: "查询服务", path: "/search/tool" },
{ name: "境外条码信息查询" },
{name: "服务中心", path: "/service"},
{name: "查询服务", path: "/search/tool"},
{name: "境外条码信息查询"},
],
},
{
......@@ -52,9 +53,9 @@ export default {
index: 2,
link: "/search/shortcode",
breadcrumb: [
{ name: "服务中心", path: "/service" },
{ name: "查询服务", path: "/search/tool" },
{ name: "缩短码查询" },
{name: "服务中心", path: "/service"},
{name: "查询服务", path: "/search/tool"},
{name: "缩短码查询"},
],
},
{
......@@ -70,10 +71,11 @@ export default {
name: "GLN查询",
index: 1,
link: "/search/gln",
style: {flex: '1 0 auto'},
breadcrumb: [
{ name: "服务中心", path: "/service" },
{ name: "查询服务", path: "/search/tool" },
{ name: "GLN查询" },
{name: "服务中心", path: "/service"},
{name: "查询服务", path: "/search/tool"},
{name: "GLN查询"},
],
},
{
......@@ -81,10 +83,11 @@ export default {
name: "自行车企业代码公告查询",
index: 2,
link: "/search/bike",
style: {flex: '1 0 auto'},
breadcrumb: [
{ name: "服务中心", path: "/service" },
{ name: "查询服务", path: "/search/tool" },
{ name: "自行车企业代码公告查询" },
{name: "服务中心", path: "/service"},
{name: "查询服务", path: "/search/tool"},
{name: "自行车企业代码公告查询"},
],
},
{
......@@ -92,10 +95,11 @@ export default {
name: "条码术语查询",
index: 3,
link: "/search/glossary",
style: {flex: '1 0 auto'},
breadcrumb: [
{ name: "服务中心", path: "/service" },
{ name: "查询服务", path: "/search/tool" },
{ name: "条码术语查询" },
{name: "服务中心", path: "/service"},
{name: "查询服务", path: "/search/tool"},
{name: "条码术语查询"},
],
},
{
......@@ -103,10 +107,11 @@ export default {
name: "校验码计算工具",
index: 4,
link: "/search/check",
style: {flex: '1 0 auto'},
breadcrumb: [
{ name: "服务中心", path: "/service" },
{ name: "查询服务", path: "/search/tool" },
{ name: "校验码计算工具" },
{name: "服务中心", path: "/service"},
{name: "查询服务", path: "/search/tool"},
{name: "校验码计算工具"},
],
},
{
......@@ -114,10 +119,11 @@ export default {
name: "国家及地区前缀码查询",
index: 5,
link: "/search/country",
style: {flex: '1 0 auto'},
breadcrumb: [
{ name: "服务中心", path: "/service" },
{ name: "查询服务", path: "/search/tool" },
{ name: "国家及地区前缀码查询" },
{name: "服务中心", path: "/service"},
{name: "查询服务", path: "/search/tool"},
{name: "国家及地区前缀码查询"},
],
},
],
......
src/components/layout/header/service.js
......@@ -17,6 +17,7 @@ export default {
name: "产品服务",
index: 0,
link: "/Service/BarcodeV",
style:{flex:'0 0 260px',paddingRight:'10px'},
breadcrumb: [
{ name: "服务中心", path: "/Service/BarcodeV" },
{ name: "产品服务", path: "/Service/BarcodeV" },
......@@ -82,6 +83,7 @@ export default {
name: "条码/RFID/软件检测服务",
index: 2,
link: "/Service/jcyxz/Barcode",
style:{flex:'0 0 290px',paddingRight:'50px'},
breadcrumb: [
{ name: "服务中心", path: "/Service/BarcodeV" },
{ name: "条码/RFID/软件检测服务" },
......@@ -161,6 +163,7 @@ export default {
nameInHeaderNav: "查询服务",
index: 0,
link: "/search/tool",
class:['service_cxfw_custom'],
breadcrumb: [
{ name: "服务中心", path: "/service" },
{ name: "查询服务", path: "/search/tool" },
......@@ -268,6 +271,7 @@ export default {
name: "软件下载",
index: 1,
link: "/Service/Book",
style:{flex:'0 0 260px'},
breadcrumb: [
{ name: "服务中心", path: "/Service/Book" },
{ name: "软件下载" },
......@@ -320,6 +324,7 @@ export default {
name: "GS1标准服务提供商",
index: 3,
link: "/Service/Partners/index",
style:{flex:'0 0 290px',paddingRight:'40px'},
breadcrumb: [
{ name: "服务中心", path: "/Service/BarcodeV" },
{ name: "标准服务提供商", path: "/Service/Partners/index" },
......@@ -377,6 +382,7 @@ export default {
name: "平台服务",
index: 5,
link: "/Service/GDS",
style: { flex:'1 0 auto' },
breadcrumb: [
{ name: "服务中心", path: "/Service/BarcodeV" },
{ name: "平台服务", path: "/Service/GDS" },
......@@ -388,6 +394,7 @@ export default {
name: "中国商品信息服务平台",
index: 0,
link: "/Service/GDS",
style:{paddingRight:'0'},
breadcrumb: [
{ name: "服务中心", path: "/Service/BarcodeV" },
{ name: "平台服务", path: "/Service/GDS" },
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment