Commit 38c31073 by Tang

Merge branch 'master' of https://gitee.com/gs1-office-web-sit/gs1

parents 62b36e37 fd1952e9
......@@ -256,6 +256,50 @@ export const nav = [
{ name: "我还不是系统成员", path: "/Business/Register" },
{ name: "条码注销公告" },
],
},
{
id: uuid("gs_nav"),
name: "我要续展",
index: 2,
link: "/Business/Renewal",
breadcrumb: [
{ name: "业务大厅", path: "/Business" },
{ name: "我还不是系统成员", path: "/Business/Register" },
{ name: "我要续展" },
],
},
{
id: uuid("gs_nav"),
name: "零售商品",
index: 2,
link: "/Business/Code1",
breadcrumb: [
{ name: "业务大厅", path: "/Business" },
{ name: "我还不是系统成员", path: "/Business/Register" },
{ name: "零售商品" },
],
},
{
id: uuid("gs_nav"),
name: "非零售商品",
index: 2,
link: "/Business/Code2",
breadcrumb: [
{ name: "业务大厅", path: "/Business" },
{ name: "我还不是系统成员", path: "/Business/Register" },
{ name: "非零售商品" },
],
},
{
id: uuid("gs_nav"),
name: "物流单元",
index: 2,
link: "/Business/Code3",
breadcrumb: [
{ name: "业务大厅", path: "/Business" },
{ name: "我还不是系统成员", path: "/Business/Register" },
{ name: "物流单元" },
],
}
],
}
......
......@@ -222,12 +222,36 @@ const routes = [
redirect: '/Service/Training',
},
{
path: "/Business/Code",
name: "Code",
path: "/Business/Renewal",
name: "Renewal",
meta: {
name: "我要编码",
name: "我要续展",
},
component: () => import("@/views/Business/Code.vue"),
component: () => import("@/views/Business/Renewal.vue"),
},
{
path: "/Business/Code1",
name: "Code1",
meta: {
name: "零售商品",
},
component: () => import("@/views/Business/Code1.vue"),
},
{
path: "/Business/Code2",
name: "Code2",
meta: {
name: "非零售商品",
},
component: () => import("@/views/Business/Code2.vue"),
},
{
path: "/Business/Code3",
name: "Code3",
meta: {
name: "物流单元",
},
component: () => import("@/views/Business/Code3.vue"),
},
{
path: "/Business/Fap",
......
<template>
<div class="guide">
<cate :father="lsspCate"></cate>
<div class="guide-msg container">
<div class="msg-title">第一步:为不同的商品项目编制不同的商品标</div>
<div class="msg-cont">
在我国,零售商品的标识代码主要采用三种数据结构,即GTIN-13、GTIN-8和GTIN-12。通常情况下,选用13位的数字代码结构用EAN-13条码表示。只有当产品出口到北美地区并且客户指定时,才申请使用UCC-12代码(用UPC条码表示)。中国厂商如需申请UPC商品条码,须经中国物品编码中心统一办理。GTIN-13和GTIN-8的结构分别如图1、图2、图3所示。
1)GTIN-13的数据结构
(1)当前缀码为690、691时,EAN/UCC-13的代码结构如图1所示。
EAN/UCC-13代码结构一
(2)当前缀码为692、693时,EAN/UCC-13的代码结构如图2所示。
EAN/UCC-13代码结构二 A、厂商识别代码
厂商识别代码是由中国物品编码中心统一向申请厂商分配。厂商识别代码左起三位由国际物品编码协会分配给中国物品编码中心的前缀码。
B、商品项目代码 商品项目代码由厂商根据有关规定自行分配。 C、校验位
用来校验其他代码编码的正误。它有固定的计算方法,参见GB 12904附录。
2)EAN/UCC-8的代码结构如图3所示。 EAN/UCC-8代码结构
</div>
</div>
</div>
</template>
<script>
import cate from "../comps/cate.vue";
export default {
components: {
cate,
},
data() {
return {
lsspCate: {
name: "零售商品",
ico: "",
},
};
},
};
</script>
<style lang="scss">
.guide {
@include module-box;
.guide-msg {
margin: 30px 0;
font-size: 14px;
.msg-title {
color: rgba(0, 121, 158, 1);
margin-bottom: 20px;
}
.msg-cont {
line-height: 23px;
color: rgba(102, 102, 102, 1);
}
}
}
</style>
\ No newline at end of file
<template>
<div class="guide">
<cate :father="flsspCate"></cate>
<div class="guide-msg container">
<div class="msg-title" ref="2-1">第一步:非零售商品的标识代码</div>
<p class="paddingBottom10">
非零售商品,主要是指不通过POS扫描结算的用于配送、仓储或批发等操作的商品。一个装有24条香烟的纸箱、一个装有40箱香烟的托盘都可以作为一个非零售商品进行批发、配送。
</p>
<p>
非零售商品的标识代码可以采用EAN/UCC-13或EAN/UCC-14结构,如图14所示。用户可以根据实际需要进行选择。
</p>
<div style="text-align: center">
<img
src="../../assets/image/business/bianmatu14.jpg"
alt="标识非零售商品的GTIN的两种结构"
class="img-responsive"
/>
</div>
<p>说明:</p>
<p>
(1)指示符只在EAN/UCC-14中使用,赋值区间为1-9,其中1-8用于定量贸易项目,9用于变量贸易项目。最简单的编码方法是随包装级别的依次增大而从小到大依次分配指示符的数值,即将1,2,3……,8依次分配给贸易单元的不同级别的包装组合。
</p>
<p>(2)厂商识别代码由中国物品编码中心分配。</p>
<p>(3)商品项目代码由企业分配。</p>
<p>(4)校验位由前12位数字计算而得。</p>
<p>不同包装类型的商品的代码选择方案如表3所示。</p>
<div style="text-align: center">
<img
src="../../assets/image/business/bianmabiao3.jpg"
alt="不同包装类型GTIN的分配方案"
class="img-responsive"
/>
</div>
<p>不同包装类型的商品标识代码的编码示例见图15:</p>
<div style="text-align: center">
<img
src="../../assets/image/business/bianmatu15.jpg"
alt="不同包装类型的商品标识代码的编码方法"
class="img-responsive"
/>
</div>
<div class="msg-title" ref="2-2">第二步:非零售商品的条码标识</div>
<p class="paddingBottom10">
非零售商品的条码标识有三种:如EAN/UPC条码、ITF-14条码和UCC/EAN-128条码。厂商可以根据实际情况选择不同的条码符号。以图15为例进行说明:
</p>
<p class="paddingBottom10">
1、当编码方案采用EAN/UCC-13代码时,条码标识可以选用EAN/UPC条码、ITF-14条码和UCC/EAN-128条码中的任意一种。
</p>
<p class="paddingBottom10">
(1)采用EAN/UPC条码表示。EAN/UPC条码既可以表示零售商品,也可以表示非零售商品。二者用法相同。
</p>
<div style="text-align: center">
<img
src="../../assets/image/business/bianma1.jpg"
alt=""
class="img-responsive"
/>
</div>
<p class="paddingBottom10">
(2)采用ITF-14条码表示。ITF-14条码只用于不经过POS扫描结算(可直接用于仓库)的非零售商品的包装上。该条码符号较适合直接印制于瓦楞纸或纤维板上。
</p>
<div style="text-align: center">
<img
src="../../assets/image/business/bianma2.jpg"
alt=""
class="img-responsive"
/>
</div>
<p class="paddingBottom10">
(3)采用UCC/EAN-128条码表示。UCC/EAN-128条码是ANCC全球统一标识系统中惟一可以用于表示附加信息的非定长条码符号,且应与应用标识符连用。
</p>
<div style="text-align: center">
<img
src="../../assets/image/business/bianma3.jpg"
alt=""
class="img-responsive"
/>
</div>
<p class="paddingBottom10">
2、当编码方案采用EAN/UCC-14代码时,条码标识可以选用ITF-14条码和UCC/EAN-128条码中的任意一种。
</p>
<p class="paddingBottom10">(1)采用EAN/UCC-14条码表示</p>
<div style="text-align: center">
<img
src="../../assets/image/business/bianma4.jpg"
alt=""
class="img-responsive"
/>
</div>
<p class="paddingBottom10">(2)采用UCC/EAN-128条码表示</p>
<div style="text-align: center">
<img
src="../../assets/image/business/bianma5.jpg"
alt=""
class="img-responsive"
/>
</div>
<div class="msg-title" ref="2-3">第三步:应用标识符的使用</div>
<p class="paddingBottom10">
当用户出于产品管理与跟踪的要求,需要对具体商品的附加信息,如生产日期、保质期、数量及批号等特征进行描述,应采用应用标识符。
</p>
<p class="paddingBottom10">
应用标识符(AI)是有2位或2位以上数字组成的字符,用于标识其后数据的含义和格式。如表4所示。
</p>
<div style="text-align: center">
<img
src="../../assets/image/business/bianmabiao4.jpg"
alt="应用标识符示例"
class="img-responsive"
/>
</div>
<p class="paddingBottom10">
附加信息代码的条码标识须采用UCC/EAN-128条码。图16表示了商品标识代码为169012360046,保质期至2005年1月1日,批号为ABC的非零售商品的条码符号示例。
</p>
<div style="text-align: center">
<img
src="../../assets/image/business/bianmatu16.jpg"
alt="应用标识符使用示例"
class="img-responsive"
/>
</div>
</div>
</div>
</template>
<script>
import cate from "../comps/cate.vue";
export default {
components: {
cate,
},
data() {
return {
flsspCate: {
name: "非零售商品",
ico: "",
},
};
},
watch: {
$route: {
handler(val) {
this.$nextTick(() => {
const top = this.$refs[val.query.id].offsetTop;
window.scrollTo(0, top);
});
},
immediate: true,
},
},
mounted() {
setTimeout(() => {
const top = this.$refs[this.$route.query.id].offsetTop;
window.scrollTo(0, top);
}, 100);
},
};
</script>
<style lang="scss" scoped>
.guide {
@include module-box;
.guide-msg {
margin: 30px 0;
font-size: 14px;
.msg-title {
color: rgba(0, 121, 158, 1);
margin-bottom: 20px;
}
.paddingBottom10 {
padding-bottom: 10px;
}
p {
text-indent: 25px;
font-size: 14px;
}
}
}
</style>
\ No newline at end of file
<template>
<div class="guide">
<cate :father="flsspCate"></cate>
<div class="guide-msg container">
<div class="msg-title" ref="3-1">第一步:物流单元的标识代码</div>
<p class="paddingBottom10">
物流单元是为了便于运输和仓储而建立的任何组合包装单元。在供应链中需要对其进行个体的跟踪与管理。一箱有不同颜色和和尺寸的12件裙子和20件夹克的组合包装,一个含有40箱饮料的托盘(每箱12盒装)都可以视为一个物流单元。
</p>
<p>1、物流单元的标识代码</p>
<p>
系列货运包装箱代码(SSCC)是物流单元的标识代码,用于表示物流单元的基本信息。SSCC对每一个特定的物流单元都是惟一的。结构如图17所示。
</p>
<div style="text-align: center">
<img
src="../../assets/image/business/bianmatu17.jpg"
alt="SSCC-18的代码结构"
class="img-responsive"
/>
</div>
<p>2、物流单元的附加信息码</p>
<p>
通常情况下,物流单元除了需要标明其标识代码SSCC外,还需要明示出一些其他的附加信息,如:运输目的地、物流包装重量、物流单元的长宽高尺寸等。在物流单元条码中,对这些属性信息的编码采用应用标识符AI+附加属性信息代码表示,并且属性数据与物流单元相关联,单独出现没有意义。部分常用应用标识符的数据格式见表5。
</p>
<div style="text-align: center">
<img
src="../../assets/image/business/bianmabiao5.jpg"
alt="应用标识符示例"
class="img-responsive"
/>
</div>
<p>注:</p>
<p>n表示数字。</p>
<p>a表示字母。</p>
<p>
例如:在批号或组号(10)的格式“n2+an…20”中“n2”表示该应用标识符(10)是2位的数字格式,“an…20”表示应用标识符(10)后跟数字或字母型代码,该代码是不定长格式,但最长不超过20位。
</p>
<p>
例如:在有效期(17)的格式“n2+n6”中,“n2”表示该应用标识符(17)是2位的数字格式,“n6”表示应用标识符(17)后跟定长的全数字型代码,代码长度为6位。
</p>
<div class="msg-title" ref="3-2">第二步:物流标签</div>
<p class="paddingBottom10">
物流标签是用于表示物流单元有关信息的条码符号标签。
</p>
<p class="paddingBottom10">1、标签内容</p>
<p class="paddingBottom10">
每个物流单元都要有自己惟一的SSCC。SSCC作为物流标签的惟一必要要素,由UCC/EAN-128条码符号表示,在物流单元形成时制作标签并贴在上面。
</p>
<p class="paddingBottom10">
在物流标签上物流单元的信息有两种基本的形式:由文本和图形组成的供人识读的信息以及为实现自动数据采集而设计的机读信息。
</p>
<p class="paddingBottom10">
一个完整的物流标签可划分为三个区段:供应商区段、客户区段和承运商区段如图18所示。
</p>
<div style="text-align: center">
<img
src="../../assets/image/business/bianmatu18.jpg"
alt="最基本的物流标签(含一个SSCC)"
class="img-responsive"
/>
</div>
<div style="text-align: center">
<img
src="../../assets/image/business/bianmatu19.jpg"
alt="包含供应商和承运商区段的标签"
class="img-responsive"
/>
</div>
<div style="text-align: center">
<img
src="../../assets/image/business/bianmatu20.jpg"
alt="包含链接数据的供应商区段的标签"
class="img-responsive"
/>
</div>
<div style="text-align: center">
<img
src="../../assets/image/business/bianmatu21.jpg"
alt="包含供应商、客户、承运商区段的标签"
class="img-responsive"
/>
</div>
<p class="paddingBottom10">2、方向与位置</p>
<p class="paddingBottom10">
物流单元标签条码的条与空应垂直与物流单元的底面。SSCC条码符号应位于标签的最下端。
</p>
<p class="paddingBottom10">
每个物流单元最少有一个标签。如果有两个标签,最好固定在相邻的两个侧面上,以方便扫描,如图22。
</p>
<div style="text-align: center">
<img
src="../../assets/image/business/bianmatu22.jpg"
alt="双标签放置"
class="img-responsive"
/>
</div>
<p class="paddingBottom10">3、符号的链接</p>
<p class="paddingBottom10">
在物流标签中,表示SSCC的UCC/EAN-128条码作为主符号,其后不能直接链接有关该物流信息单元的附加信息,这些附加信息应以另外的UCC/EAN-128条码来表示,见图20。
</p>
</div>
</div>
</template>
<script>
import cate from "../comps/cate.vue";
export default {
components: {
cate,
},
data() {
return {
flsspCate: {
name: "非零售商品",
ico: "",
},
};
},
watch: {
$route: {
handler(val) {
this.$nextTick(() => {
const top = this.$refs[val.query.id].offsetTop;
window.scrollTo(0, top);
});
},
immediate: true,
},
},
mounted() {
setTimeout(() => {
const top = this.$refs[this.$route.query.id].offsetTop;
window.scrollTo(0, top);
}, 100);
},
};
</script>
<style lang="scss" scoped>
.guide {
@include module-box;
.guide-msg {
margin: 30px 0;
font-size: 14px;
.msg-title {
color: rgba(0, 121, 158, 1);
margin-bottom: 20px;
}
.paddingBottom10 {
padding-bottom: 10px;
}
p {
text-indent: 25px;
font-size: 14px;
}
}
}
</style>
\ No newline at end of file
......@@ -191,6 +191,12 @@ export default {
created() {
// console.log(this.$route.query.id)
},
mounted() {
setTimeout(() => {
const top = this.$refs[this.$route.query.id].offsetTop;
window.scrollTo(0, top);
}, 100);
},
};
</script>
<style lang="scss" scoped>
......
<template>
<div class="row">
<div class="col-lg-8">
<div class="register marginTopLg20">
<div class="register-top register-cont">
<div class="container">
<div class="zxzc-btn" @click="zxxzJump">在线续展</div>
<img
src="../../assets/image/business/barcode-renewal.jpg"
class="barcode-register"
alt=""
/>
</div>
</div>
<div class="register-bottom register-cont" v-if="false">
<cate :father="zxcxgjCate"></cate>
<div class="row zxcxgj-ul">
<div class="col-lg-4" v-for="(tmp, i) in zxcxgjList" :key="i">
<img :src="tmp.ico" alt="" class="zxcxgj-img" />
<div class="zxcxgj-bt">{{ tmp.name }}</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-lg-4">
<tmgg class="marginTopLg20"/>
<bgxz class="marginTop20"/>
<dffzjg class="marginTop20"/>
<zcfg class="marginTop20"/>
</div>
</div>
</template>
<script>
import tmgg from "./copms/tmgg.vue";
import bgxz from "./copms/bgxz.vue";
import dffzjg from "./copms/dffzjg.vue";
import zcfg from "./copms/zcfg.vue";
import cate from "../comps/cate.vue";
export default {
components: {
cate,
tmgg,
dffzjg,
bgxz,
zcfg,
},
data() {
return {
zxcxgjList: [
{
ico: require("../../assets/image/business/icon_tiaomaxinxichaxun.png"),
name: "条码信息查询",
},
{
ico: require("../../assets/image/business/icon_zixingche.png"),
name: "自行车企业代码公告查询",
},
{
ico: require("../../assets/image/business/icon_tiaomashuyuchaxun.png"),
name: "条码术语查询",
},
{
ico: require("../../assets/image/business/ico_xiaoyanma.png"),
name: "校验码计算工具",
},
{
ico: require("../../assets/image/business/icon_guojia.png"),
name: "国家及地区前缀码查询",
},
],
zxcxgjCate: {
name: '在线查询工具',
ico: require('../../assets/image/business/icon_gongju.png')
}
};
},
methods: {
zxxzJump() {
window.open('http://wsdt.ancc.org.cn/anccoh/', "_blank");
}
},
};
</script>
<style lang="scss" scoped>
.register {
.register-cont {
@include module-box;
}
.register-top {
padding: 20px 0;
.zxzc-btn {
height: 44px;
line-height: 44px;
background: #f26335;
border-radius: 4px;
color: #ffffff;
font-size: 14px;
text-align: center;
cursor: pointer;
}
.barcode-register {
width: 100%;
margin-top: 20px;
}
}
.register-bottom {
margin-top: 20px;
.zxcxgj-ul {
padding: 12.5px 0;
> div {
margin: 12.5px 0;
text-align: center;
.zxcxgj-img {
margin-bottom: 13px;
}
.zxcxgj-bt {
color: #0e2c6b;
font-size: 14px;
}
}
}
}
}
</style>
\ No newline at end of file
<template>
<div class="training container">
<div class="row">
<div class="col-lg-8">
<div class="pxjh">
<div class="col-lg-8" >
<div class="training-bj pxjh">
<cate :father="pxjhCate"></cate>
<div class="container">
<p>
......@@ -54,7 +54,42 @@
</div>
</div>
</div>
<div class="col-lg-4">2</div>
<div class="col-lg-4">
<div class="training-bj">
<div class="pxspkc">
<cate :father="pxspkcCate"></cate>
<div class="container">
<p>
系统成员可登录中国商品信息服务平台的成员专区选择在线学习服务培训视频教程,即可简单、有效、快速的学习到实用的商品条码知识,了解GS1系统并按标准使用商品条码,如需了解请按下方提示点击进入。
</p>
<p class="pxspkc-btn">
<button>点击进入</button>
</p>
<p>
<img
src="../../assets/image/business/woyaopeixun2.jpg"
alt=""
/>
</p>
<p>
<img
src="../../assets/image/business/woyaopeixun3.jpg"
alt=""
/>
</p>
</div>
</div>
<div class="xspxgg">
<cate :father="xspxggCate"></cate>
<div class="container">
<p>尊敬的中国商品条码系统成员:</p>
<p class="xspxgg-note">
当前,新冠病毒肺炎疫情已进入关键阶段,为进一步做好疫情防控,有序推进我们的技术服务工作,中国物品编码中心全国分支机构暂停现场培训,同时为系统成员提供免费的线上培训课程和相关学习资料,请点击<a href="http://www.gs1cn.org/news/article_admin.aspx?Id=9766">http://www.gs1cn.org/news/article_admin.aspx?Id=9766</a>进行查看。
</p>
</div>
</div>
</div>
</div>
</div>
</div>
</template>
......@@ -73,6 +108,14 @@ export default {
ico: "",
name: "培训计划",
},
pxspkcCate: {
ico: "",
name: "培训视频课程",
},
xspxggCate: {
ico: "",
name: "线上培训公告",
},
tabs: [
{
id: "one",
......@@ -255,8 +298,10 @@ export default {
<style lang="scss" scoped>
.training {
padding: 20px 0;
.pxjh {
.training-bj {
@include module-box;
}
.pxjh {
padding-bottom: 20px;
p {
text-indent: 28px;
......@@ -301,6 +346,36 @@ export default {
margin-top: 20px;
}
}
.pxspkc {
.pxspkc-btn {
text-align: center;
button {
background-color: #f26334;
padding: 10px;
padding-left: 10px;
padding-right: 10px;
font-size: 14px;
color: #ffffff;
border: 0;
}
}
img {
width: 100%;
}
}
.xspxgg {
font-size: 15px;
.xspxgg-note {
text-indent: 2em;
a{
word-break: break-all;
color: #008dbd;
text-decoration: none;
}
}
}
p {
font-size: 14px;
line-height: 24px;
......
<template>
<div class="fzzx">
<div class="fzzx fzzx2">
<div class="fzzx-list">
<div class="row" v-for="(tmpA, i) in newList" :key="i">
<div class="col-4" v-for="(tmpB, ii) in tmpA" :key="ii">
<div class="col-lg-4" v-for="(tmpB, ii) in tmpA" :key="ii">
<span
><a :href="tmpB.fileUrl">{{ tmpB.name }}</a></span
>
......@@ -26,6 +26,31 @@ export default {
},
};
</script>
<style lang="scss">
.fzzx2 {
@media screen and(min-width: 992px) {
.row {
&:nth-child(odd) {
background: rgba(242, 99, 53, 0.04);
}
}
}
@media screen and(max-width: 992px) {
.row {
&:nth-child(odd) {
div:nth-child(odd) {
background: rgba(242, 99, 53, 0.04);
}
}
&:nth-child(even) {
div:nth-child(even) {
background: rgba(242, 99, 53, 0.04);
}
}
}
}
}
</style>
<style lang="scss" scoped>
.fzzx {
width: 100%;
......@@ -46,9 +71,6 @@ export default {
text-decoration: none;
}
}
&:nth-child(odd) {
background: rgba(242, 99, 53, 0.04);
}
}
}
}
......
......@@ -61,19 +61,22 @@ export default {
{
name: "一次性加入费",
path: "/Business/Corppay",
active: "1",
active: "",
id: "1",
noneChild: true,
},
{
name: "胶片制作费",
path: "/Business/Corppay",
active: "2",
active: "",
id: "2",
noneChild: true,
},
{
name: "系统维护",
path: "/Business/Corppay",
active: "3",
active: "",
id: "3",
noneChild: true,
},
{
......@@ -92,7 +95,8 @@ export default {
{
name: "服务项目与服务内容",
path: "/Business/Corppay",
active: "4",
active: "",
id: "4",
noneChild: true,
},
],
......@@ -102,12 +106,14 @@ export default {
{
name: "条码注册公告",
path: "/Business/Notice",
active: "zhuce",
active: "",
id: "zhuce",
},
{
name: "条码注销公告",
path: "/Business/Notice",
active: "zhuxiao",
active: "",
id: "zhuxiao",
},
],
},
......@@ -123,13 +129,100 @@ export default {
},
{
name: "我要续展",
path: "",
active: "",
path: "/Business/Renewal",
active: "Renewal",
},
{
name: "我要编码",
path: "",
path: "/Business/Code1",
active: "",
id: "1-1",
children: [
{
name: "零售商品",
path: "",
active: "",
children: [
{
name: "为不同的商品项目编制不同的商品标识代码",
path: "/Business/Code1",
active: "",
id: "1-1",
noneChild: true,
},
{
name: "选择相应的条码符号",
path: "/Business/Code1",
active: "",
id: "1-2",
noneChild: true,
},
{
name: "条码符号的设计",
path: "/Business/Code1",
active: "",
id: "1-3",
noneChild: true,
},
{
name: "条码符号的印制",
path: "/Business/Code1",
active: "",
id: "1-4",
noneChild: true,
},
],
},
{
name: "非零售商品",
path: "",
active: "",
children: [
{
name: "非零售商品的标识代码",
path: "/Business/Code2",
active: "",
id: "2-1",
noneChild: true,
},
{
name: "非零售商品的条码标识",
path: "/Business/Code2",
active: "",
id: "2-2",
noneChild: true,
},
{
name: "应用标识符的使用",
path: "/Business/Code2",
active: "",
id: "2-3",
noneChild: true,
},
],
},
{
name: "物流单元",
path: "",
active: "",
children: [
{
name: "物流单元的标识代码",
path: "/Business/Code3",
active: "",
id: "3-1",
noneChild: true,
},
{
name: "物流标签",
path: "/Business/Code3",
active: "",
id: "3-2",
noneChild: true,
},
],
},
]
},
{
name: "我要通报编码信息",
......@@ -211,6 +304,7 @@ export default {
this.routeList,
currentPath
);
console.log(currentRoute, 'currentRoute')
if (currentRoute.children && currentRoute.children.length > 0) {
newRouteList = currentRoute.children;
} else if (currentRoute.noneChild) {
......@@ -221,7 +315,7 @@ export default {
}
localStorage.setItem('newRouteList', JSON.stringify(newRouteList));
// newRouteList = this.deepFindRouteList(this.routeList, currentPath);
// console.log(newRouteList, 'newRouteListnewRouteList2')
console.log(newRouteList, 'newRouteListnewRouteList2')
return newRouteList;
},
},
......
......@@ -2,8 +2,8 @@
<div class="fzzx">
<div class="fzzx-list">
<div class="row" v-for="(tmp, i) in list" :key="i">
<div class="col-6">{{tmp.name}}</div>
<div class="col-6"><a :href="tmp.url" target="_blank">{{tmp.url}}</a></div>
<div class="col-lg-6">{{tmp.name}}</div>
<div class="col-lg-6"><a :href="tmp.url" target="_blank">{{tmp.url}}</a></div>
</div>
</div>
</div>
......
......@@ -33,7 +33,7 @@ export default {
},
};
</script>
<style lang="scss">
<style lang="scss" scoped>
.fzzx {
width: 90%;
margin: 0 auto;
......
......@@ -16,7 +16,7 @@
<el-menu-item-group>
<el-menu-item
:index="i + 1 + '-' + (ii + 1)"
:class="{ active: tmpB.active === currentName || tmpB.active == $route.query.id }"
:class="{ active: tmpB.active === currentName || (tmpB.id && tmpB.id === $route.query.id) }"
v-for="(tmpB, ii) in tmpA.children"
:key="ii"
@click="jump(tmpB)"
......@@ -71,11 +71,11 @@ export default {
if (result && result.breadcrumb) {
this.$store.commit("system/SET_BREADCRUMB", result.breadcrumb);
}
if (el.active) {
if (el.id) {
this.$router.push({
path: el.path,
query: {
id: el.active,
id: el.id,
},
});
} else {
......@@ -131,9 +131,12 @@ export default {
}
.el-menu-item {
height: 50px;
line-height: 50px;
display: flex;
align-items: center;
line-height: 22px;
color: #6b6a6a;
background: transparent;
white-space: pre-wrap;
// font-size: 16px;
i {
color: $side-bg-color;
......@@ -143,7 +146,6 @@ export default {
right: 15px;
}
&:hover,
&:focus,
&.active {
color: #f26335;
background: $side-menu-active-color;
......
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