资讯中心百分之80代码提交

src/components/layout/header/mock.js

@@ -606,14 +606,84 @@ export const nav = [
                 children: [
                     {
                         id: uuid("gs_nav"),
+                        name: "零售",
+                        index: 5,
+                        link: "/News/Retail",
+                        breadcrumb: [
+                            { name: "资讯中心", path: "/News" },
+                            { name: "零售" },
+                        ],
+                    },
+                    {
+                        id: uuid("gs_nav"),
+                        name: "物流",
+                        index: 5,
+                        link: "/News/Logistics",
+                        breadcrumb: [
+                            { name: "资讯中心", path: "/News" },
+                            { name: "物流" },
+                        ],
+                    },
+                    {
+                        id: uuid("gs_nav"),
                         name: "医疗卫生",
                         index: 5,
-                        link: "",
+                        link: "/News/Health",
                         breadcrumb: [
-                            { name: "资讯中心", path: "/News/Health" },
+                            { name: "资讯中心", path: "/News" },
                             { name: "医疗卫生" },
                         ],
-                    }
+                    },
+                    {
+                        id: uuid("gs_nav"),
+                        name: "食品安全追溯",
+                        index: 5,
+                        link: "/News/FoodSafety",
+                        breadcrumb: [
+                            { name: "资讯中心", path: "/News" },
+                            { name: "食品安全追溯" },
+                        ],
+                    },
+                    {
+                        id: uuid("gs_nav"),
+                        name: "电子商务",
+                        index: 5,
+                        link: "/News/ECommerce",
+                        breadcrumb: [
+                            { name: "资讯中心", path: "/News" },
+                            { name: "电子商务" },
+                        ],
+                    },
+                    {
+                        id: uuid("gs_nav"),
+                        name: "移动商务",
+                        index: 5,
+                        link: "/News/MCommerce",
+                        breadcrumb: [
+                            { name: "资讯中心", path: "/News" },
+                            { name: "移动商务" },
+                        ],
+                    },
+                    {
+                        id: uuid("gs_nav"),
+                        name: "物联网",
+                        index: 5,
+                        link: "/News/IoT",
+                        breadcrumb: [
+                            { name: "资讯中心", path: "/News" },
+                            { name: "物联网" },
+                        ],
+                    },
+                    {
+                        id: uuid("gs_nav"),
+                        name: "其他",
+                        index: 5,
+                        link: "/News/Other",
+                        breadcrumb: [
+                            { name: "资讯中心", path: "/News" },
+                            { name: "其他" },
+                        ],
+                    },
                 ],
             },
         ],

src/router/index.js

@@ -526,6 +526,38 @@ const routes = [
             },
             component: () => import("@/views/News/Notice.vue"),
           },
+          {
+            path: "/News/FoodSafety",
+            name: "FoodSafety",
+            meta: {
+              name: "食品安全追溯",
+            },
+            component: () => import("@/views/News/FoodSafety.vue"),
+          },
+          {
+            path: "/News/MCommerce",
+            name: "MCommerce",
+            meta: {
+              name: "移动商务",
+            },
+            component: () => import("@/views/News/MCommerce.vue"),
+          },
+          {
+            path: "/News/IoT",
+            name: "IoT",
+            meta: {
+              name: "物联网",
+            },
+            component: () => import("@/views/News/IoT.vue"),
+          },
+          {
+            path: "/News/Other",
+            name: "Other",
+            meta: {
+              name: "其他",
+            },
+            component: () => import("@/views/News/Other.vue"),
+          },
         ]
       },
       {
@@ -544,6 +576,30 @@ const routes = [
         },
         component: () => import("@/views/News/Health.vue"),
       },
+      {
+        path: "/News/Retail",
+        name: "Retail",
+        meta: {
+          name: "零售",
+        },
+        component: () => import("@/views/News/Retail.vue"),
+      },
+      {
+        path: "/News/Logistics",
+        name: "Logistics",
+        meta: {
+          name: "物流",
+        },
+        component: () => import("@/views/News/Logistics.vue"),
+      },
+      {
+        path: "/News/ECommerce",
+        name: "ECommerce",
+        meta: {
+          name: "电子商务",
+        },
+        component: () => import("@/views/News/ECommerce.vue"),
+      },
      
       {
         path: "/Knowledge",

src/views/News/FoodSafety.vue

+<template>
+  <div class="composite">
+    <cate :father="bzkydtCate"></cate>
+    <div class="container">
+      <p><a href="http://www.chinatrace.org/" target="_blank"><img src="../../assets/image/news/spaqzs.jpg" alt=""></a></p>
+      <p>近年来国内外食品安全事件不断发生，引起各国政府、企业和消费者的共同关注。追溯作为保障食品安全的一种重要手段，受到各国政府、行业组织和企业的高度重视。</p>
+      <p>自2000年开始，中国物品编码中心在国内外率先开展国内外的追溯政策、法规和标准的技术跟踪与研究，并把追溯概念引入中国，经过十几年的努力，在标准制定、项目建设、应用推广等方面都取得了一定的成绩，承担了《重要产品追溯 追溯码编码规范》等多个追溯国家标准和行业标准的制订工作，建成国家食品（产品）安全追溯平台，开展对外追溯合作，有效地推进了我国追溯体系建设的完善。</p>
+      <p>2012年，编码中心承担国家发改委批准实施的国家重点食品质量安全追溯物联网应用示范工程，建成国家食品（产品）安全追溯平台，实现了上亿种产品的责任主体追溯和3000多家企业的产品过程追溯。</p>
+      <p>同时编码中心加强了与国家市场监督管理局、商务部等部委和地方政府的沟通与合作，推动GS1标准在国内政府主导的食品安全追溯平台中的广泛应用；在全国建立了100多个蔬菜水果、水产品、加工食品等追溯应用示范；参与食品安全追溯建设项目；开展对外追溯合作，为我国追溯体系建设提供有力支持。</p>
+      <Title :father="FoodSafety.title1"></Title>
+      <p>当前全球供应链长且复杂，全供应链追溯面临诸多挑战，为了实现端到端的全供应链追溯，不同追溯系统之间必须具有互操作性。GS1标准作为全球通用的商务语言，用于自动准确的标识，采集和共享信息，从而确保产品、服务和信息每天在世界各地的供应链中高效安全的移动，为互操作性提供了基础。目前GS1标准已在全球150多个国家和地区的200多万家企业成功应用40多年，全球有60多个国家和地区采用GS1标准进行追溯。</p>
+      <p>GS1 作为国际非营利的标准化组织，自2000年左右便开始研究如何采用全球统一的编码标识体系GS1标准来帮助企业建立有效的追溯体系，以满足政府合规的要求、商业需求和自身管理的需求等。截至目前，GS1 已经制订了《GS1全球追溯标准》和《GS1全球追溯关键控制点和一致性准则》等标准，制订了生鲜果蔬、肉禽和鱼类等行业追溯指南，为政府和企业建立追溯体系提供了借鉴。</p>
+      <p>基于GS1标准的追溯技术，是采用GS1标准对追溯对象、追溯参与方和位置等进行编码和标识，并通过GDSN（全球数据同步）、EDI（电子数据交换），EPCIS（产品电子代码信息服务）等实现主数据、交易数据和物理事件数据的交换。一旦出现食品安全问题，能够快速准确查出食品问题出现的环节，直至追溯到生产源头，从而确保食品撤回和召回的高效性和准确性。为政府产品质量监管提供有效手段，最大限度地降低企业的损失，保护消费者利益。</p>
+      <p>我们总结了8个步骤帮助企业建立有效的追溯体系。</p>
+      <Title :father="FoodSafety.title2"></Title>
+      <p>着手收集、研究相关资料，对最新的追溯标准、解决方案、实施步骤和成功案例进行深入了解，选择合适的服务咨询机构和追溯技术。</p>
+      <Title :father="FoodSafety.title3"></Title>
+      <p>对内部运营情况以及外部环境进行分析，会涉及法律法规、合同合约、合作伙伴的商业需求和消费者的需求等。综合考虑各种因素，决定企业如何开展追溯项目。</p>
+      <Title :father="FoodSafety.title4"></Title>
+      <p>追溯的实施需要多部门加入。建立工作组，明确企业内部、外部各参与方及责任，制定工作计划。</p>
+      <Title :father="FoodSafety.title5"></Title>
+      <p>根据成本、自身管理需求等明确追溯范围、追溯模型、追溯要求（比如确定追溯到托盘、包装箱、批次还是单品级别）等。确定追溯系统的目标、实施架构和实施期限，分析业务流程、梳理产品流和信息流，包括输入、输出、内部流程及三者间的关联，确定与追溯参与方所交换产品的类型。</p>
+      <Title :father="FoodSafety.title6"></Title>
+      <p>确定关键控制点和操作流程中需要控制的要素；选择合适的编码标识、数据采集和共享技术；制定详细的实施工作分解计划和时间表；设计并实施电子信息系统。</p>
+      <Title :father="FoodSafety.title7"></Title>
+      <p>执行差距分析，建立追溯系统的组件，并选择参与方进行试点。</p>
+      <Title :father="FoodSafety.title8"></Title>
+      <p>按计划实施追溯系统，编制文件和培训，并解决追溯系统的实施和维护问题。</p>
+      <Title :father="FoodSafety.title9"></Title>
+      <p>必须提供监控和维护程序，定期进行常规的内部测试，以保持追溯系统的持续性高质量。</p>
+      <Title :father="FoodSafety.title10"></Title>
+      <p>联系人：吴新敏，李文婷</p>
+      <p>联系电话：010-84295527，010-84295529</p>
+      <p>电子邮箱：wuxm@ancc.org.cn，liwt@ancc.org.cn</p>
+      <div class="down">
+       <span style="margin:20px 0 10px;font-size:14px;display:inline-block">资料下载</span>
+        <list2 :list="list" />
+      </div>
+
+        
+      <list :list="list" />
+
+      <pages />
+    </div>
+  </div>
+</template>
+<script>
+import cate from "../comps/cate.vue";
+import Title from "../comps/title.vue";
+import list from "./comps/list.vue";
+import list2 from "./comps/list2.vue";
+import pages from "../comps/pages.vue";
+
+export default {
+  components: {
+    cate,
+    Title,
+    list,
+    list2,
+    pages,
+  },
+  data() {
+    return {
+      bzkydtCate: {
+        name: "食品安全追溯",
+        ico: "",
+      },
+      FoodSafety: {
+        title1: {
+          name: "基于GS1标准（商品条码）的追溯技术",
+        },
+        title2: {
+          name: "第1步：掌握相关知识",
+        },
+        title3: {
+          name: "第2步：分析自身情况",
+        },
+        title4: {
+          name: "第3步：建立工作框架",
+        },
+        title5: {
+          name: "第4步：分析追溯业务需求和环境",
+        },
+        title6: {
+          name: "第5步：设计追溯系统",
+        },
+        title7: {
+          name: "第6步：构建追溯系统",
+        },
+        title8: {
+          name: "第7步：部署和使用追溯系统",
+        },
+        title9: {
+          name: "第8步：追溯系统持续改进",
+        },
+        title10: {
+          name: "联系方式",
+        },
+      },
+   
+     
+      list: [
+        {
+          name: "GS1标准助力澳大利亚肉制品的出口追溯",
+         
+        },
+        {
+          name: "GS1总部最新追溯视频——GS1追溯标准助力供应链可视化和效率提升",
+         
+        },
+        {
+          name: "全球统一标识系统——全球通用的食品追溯语言",
+        
+        },
+      ],
+    };
+  },
+  methods: {},
+};
+</script>
+<style lang="scss" scoped>
+.composite {
+  @include module-box;
+  ul {
+    padding: 0;
+    margin: 0;
+  }
+  .container{
+    img{
+      width: 40%;
+      height: auto;
+      float: right;
+      margin-left: 20px;
+    }
+    p {
+        margin-left: 15px;
+        text-indent: 32px;
+        line-height: 28px;
+        font-size: 14px;
+        margin-top: 0;
+        margin-bottom: 1rem;
+        color: #414345;
+      }
+      .down{
+        border: 1px solid #E8DBC1;
+        border-left: none;
+        border-right: none;
+        background-color: #FCF8F3;
+        margin: 10px -24px; 
+        padding-left:40px; 
+        padding-bottom: 10px;
+        padding-right: 10px;
+      }
+      .down /deep/.list .list-li > div{
+        font-size: 14px!important;
+      }
+  }
+}
+</style>
\ No newline at end of file

src/views/News/IoT.vue

+<template>
+  <div class="composite">
+    <cate :father="bzkydtCate"></cate>
+    <div class="container">
+     
+      <div class="down" style="padding:20px 30px;">
+       <p>物联网中的“物”，即物品。通过对物品进行编码，实现了物品的数字化。物品编码是物联网的基础，建立我国物联网编码体系对于保障各个行业、领域、部门的应用，实现协同工作具有重要的意义。</p>
+      </div>
+
+        
+      <list :list="list" />
+
+      <pages />
+    </div>
+  </div>
+</template>
+<script>
+import cate from "../comps/cate.vue";
+import list from "./comps/list.vue";
+import pages from "../comps/pages.vue";
+
+export default {
+  components: {
+    cate,
+    list,
+    pages,
+  },
+  data() {
+    return {
+      bzkydtCate: {
+        name: "物联网",
+        ico: "",
+      },
+     
+     
+      list: [
+        {
+          name: "物联网标识行业GS1标准应用工作座谈会在合肥召开",
+         
+        },
+        {
+          name: "中国物品编码中心河北分中心参加“我国物联网标识Ecode体系建设”",
+         
+        },
+        {
+          name: "国家特种设备安全监管物联网应用示范工程项目顺利通过验收并获得专家组高度评价",
+        
+        },
+      ],
+    };
+  },
+  methods: {},
+};
+</script>
+<style lang="scss" scoped>
+.composite {
+  @include module-box;
+  ul {
+    padding: 0;
+    margin: 0;
+  }
+  .container{
+    img{
+      width: 40%;
+      height: auto;
+      float: right;
+      margin-left: 20px;
+    }
+    p {
+        margin-left: 15px;
+        text-indent: 32px;
+        line-height: 28px;
+        font-size: 14px;
+        margin-top: 0;
+        margin-bottom: 1rem;
+        color: #414345;
+      }
+      .down{
+        border: 1px solid #E8DBC1;
+        border-left: none;
+        border-right: none;
+        background-color: #FCF8F3;
+        margin: 10px -24px; 
+        padding-left:40px; 
+        padding-bottom: 10px;
+        padding-right: 10px;
+        p{
+          margin: 0px;
+        }
+      }
+      .down /deep/.list .list-li > div{
+        font-size: 14px!important;
+      }
+  }
+}
+</style>
\ No newline at end of file

src/views/News/Logistics.vue

+<template>
+  <div class="container" >
+    <breadcrumb />
+    <div class="composite">
+      <div class="title">
+        <p>物流</p>
+      </div>
+      <p>商品条码标识系统是在物流供应链中广泛应用的物品标识系统，能够实现上下游企业间信息传递的“无缝”对接。箱码（Case Code）是商品外箱上使用的条码标识，企业在订货、配送、收货、库管、发货、送货及退货等物流过程中扫描箱码后，相关信息便自动记录到企业信息系统中，实现数据的自动采集与分析，从而降低物流成本，提升企业效率。系列货运包装箱代码（SSCC）是为物流单元，如：托盘、集装箱等，提供的唯一标识。在物流配送过程中，企业仅需扫描SSCC，便实现对整个托盘/集装箱产品信息的采集，从而大幅提升供应链效率。</p>
+      <img src="../../assets/image/news/wl1.png" alt="">
+    </div>
+    <div class="row wltp">
+      <div class="col-lg-6">
+        <img src="../../assets/image/news/wl2.png" alt="">
+      </div>
+      <div class="col-lg-6">
+        <img src="../../assets/image/news/wl3.png" alt="">
+      </div>
+    </div>
+    <div class="div3">
+      <div class="div3-img">
+          <img src="../../assets/image/news/wl4.png" alt="">
+      </div>
+        
+    </div>
+
+  </div>
+</template>
+<script>
+
+import breadcrumb from "../comps/breadcrumb.vue";
+import cate from "../comps/cate.vue";
+export default {
+  components: {
+   breadcrumb,
+  
+    
+  },
+  data() {
+    return {
+      
+     typeList:[
+       {
+         icon:require("../../assets/image/news/ylws1.png"),
+         title:'政策法规',
+         list:['药品','医疗器械']
+       },
+       {
+         icon:require("../../assets/image/news/ylws2.png"),
+         title:'追溯',
+         list:['EPCIS','药品追溯']
+       },
+       {
+         icon:require("../../assets/image/news/ylws3.png"),
+         title:'医疗机构',
+         list:['标准实施十步走','优秀案例','GS1医疗奖']
+       },
+       {
+         icon:require("../../assets/image/news/ylws4.png"),
+         title:'GS1标准与解决方案',
+         list:['GS1如何帮助解决方案提供商']
+       },
+       {
+         icon:require("../../assets/image/news/ylws5.png"),
+         title:'GS1医疗标准',
+         list:['用于医疗的GS1标准','临床试验标准']
+       },
+       {
+         icon:require("../../assets/image/news/ylws6.png"),
+         title:'应用案例',
+         list:['报告','案例','立场书']
+       }
+     ]
+    };
+  },
+  mounted() {
+    // 面包屑单独处理
+    this.$store.commit("system/SET_BREADCRUMB", [
+      { name: "应用领域", path: "/New" },
+      { name: "物流" },
+    ]);
+  },
+  methods: {},
+  
+};
+</script>
+<style lang="scss">
+.health {
+  @media screen and (min-width: 992px) {
+    .health-ul {
+      justify-content: space-between;
+    }
+  }
+  @media screen and (max-width: 992px) {
+    .health-ul {
+      justify-content: space-around;
+    }
+  }
+}
+</style>
+<style lang="scss" scoped>
+.composite {
+  @include module-box;
+  padding: 20px 0;
+  margin-bottom: 30px;
+  .title{
+    font-size: 18px;
+    font-family: PingFangSC-Medium;
+    white-space: nowrap;
+    line-height: 25px;
+    text-align: left;
+    align-self: flex-start;
+    margin-left: 30px;
+    border-bottom:1px solid #F3F3F3;
+  }
+  >p{
+    margin: 29px 30px;
+    font-size: 14px;
+    color: #666666;
+    line-height: 26px;
+  }
+  img{
+    width: 80%;
+    margin: 0 10% 10px;
+  }
+}
+.wltp{
+  margin-bottom: 30px;
+  img{
+    width: 100%;
+  }
+}
+.div3{
+  @include module-box;
+  overflow: hidden;
+  .div3-img{
+    width: 60%;
+    height: auto;
+    float: left;
+    img{
+      width: 100%;
+    }
+  }
+  
+}
+</style>
\ No newline at end of file

src/views/News/MCommerce.vue

+<template>
+  <div class="composite">
+    <cate :father="bzkydtCate"></cate>
+    <div class="container">
+      <div class="down" style="padding:20px 30px;">
+       <p>全世界超过四十亿人正在应用移动电话。移动电话正在成为企业和消费者互动的重要渠道。今天的移动电话可以与条码“对话” ，读取无线射频识别（RFID）标签，并访问互联网。 通过使用移动电话对产品标识的读取，消费者就可获得有关这个产品的服务和信息，在明白消费的同时，增进消费者与品牌信任。</p>
+       <p>移动商务专题：<a href="http://www.gs1cn.org/2012/MobileCom/index.html">http://www.gs1cn.org/2012/MobileCom/index.html</a></p>
+      </div>
+      <div class="down">
+       <span style="margin:0 0 10px;font-size:14px;display:inline-block">资料下载</span>
+        <list2 :list="list2" />
+      </div>
+
+        
+      <list :list="list" />
+
+      
+    </div>
+  </div>
+</template>
+<script>
+import cate from "../comps/cate.vue";
+import Title from "../comps/title.vue";
+import list from "./comps/list.vue";
+import list2 from "./comps/list2.vue";
+
+
+export default {
+  components: {
+    cate,
+    Title,
+    list,
+    list2,
+  },
+  data() {
+    return {
+      bzkydtCate: {
+        name: "移动商务",
+        ico: "",
+      },
+    
+      list: [
+        {
+          name: "移动商务领域新标准—电子优惠券管理",
+         
+        },
+        {
+          name: "越来越多的消费者通过移动终端浏览商品",
+         
+        },
+        {
+          name: "二维码进入医院 挂号、导诊、就医一条龙",
+        
+        },
+      ],
+      list2:[
+        {
+          name:'移动商务（宣传折页）'
+        }
+      ]
+    };
+  },
+  methods: {},
+};
+</script>
+<style lang="scss" scoped>
+.composite {
+  @include module-box;
+  ul {
+    padding: 0;
+    margin: 0;
+  }
+  .container{
+    img{
+      width: 40%;
+      height: auto;
+      float: right;
+      margin-left: 20px;
+    }
+    p {
+        margin-left: 15px;
+        text-indent: 32px;
+        line-height: 28px;
+        font-size: 14px;
+        margin-top: 0;
+        margin-bottom: 1rem;
+        color: #414345;
+      }
+      .down{
+        border: 1px solid #E8DBC1;
+        border-left: none;
+        border-right: none;
+        background-color: #FCF8F3;
+        margin: 10px -24px; 
+        padding: 20px 10px 10px 40px;
+        p{
+          margin: 0px;
+        }
+      }
+      .down /deep/.list .list-li > div{
+        font-size: 14px!important;
+      }
+  }
+}
+</style>
\ No newline at end of file

src/views/News/Other.vue

+<template>
+  <div class="composite">
+    <cate :father="bzkydtCate"></cate>
+    <div class="container">
+      <div class="down downcont" style="padding:20px 30px;">
+        <p>商品条码与编码的应用最早是从食品、日用百货等快速消费品在零售POS系统自动结算开始的，目前已广泛应用于国民经济的各个领域，对促进零售业、制造业、交通运输业、邮电通讯业、物流服务业等产业发展，保障食品安全、医疗卫生、工商、海关、金融、军工等各行业信息化发展做出了积极贡献。</p>
+        <p>在我国，经过二十多年的发展，商品条码与编码作为商品流通“身份证”，已经在3000多万种商品、100多万家商超、95%以上的快速消费品上面广泛使用，拥有条码“身份证”的“中国制造”产品已遍及世界各个角落。</p>
+        <p>目前，全球已有150个国家和地区的150多万家企业采用商品条码与编码标识系统，在快消、零售、制造、服装、建材等30多个行业和领域得到了广泛应用，全球每天扫描商品条码的次数达500亿次，已成为全球通用的商务语言。</p>
+      </div>
+      <div class="down">
+       <span style="margin:0 0 10px;font-size:14px;display:inline-block">资料下载</span>
+        <list2 :list="list2" />
+      </div>
+
+        
+      <list :list="list" />
+
+      <pages />
+    </div>
+  </div>
+</template>
+<script>
+import cate from "../comps/cate.vue";
+import Title from "../comps/title.vue";
+import list from "./comps/list.vue";
+import list2 from "./comps/list2.vue";
+import pages from "../comps/pages.vue";
+
+export default {
+  components: {
+    cate,
+    Title,
+    list,
+    list2,
+    pages
+  },
+  data() {
+    return {
+      bzkydtCate: {
+        name: "其他",
+        ico: "",
+      },
+    
+      list: [
+        {
+          name: "《建材行业商品条码应用指南》",
+         
+        },
+        {
+          name: "江苏镇江实施气瓶条码管理不走过场 气瓶“身份证”帮了监管忙",
+         
+        },
+        {
+          name: "北京烟花将贴身份证 防止“黑花炮”流入市场",
+        
+        },
+      ],
+      list2:[
+        {
+          name:'《建材行业商品条码应用指南》',
+        },
+        {
+          name:' 服装行业商品条码应用指南',
+        }
+      ]
+    };
+  },
+  methods: {},
+};
+</script>
+<style lang="scss" scoped>
+.composite {
+  @include module-box;
+  ul {
+    padding: 0;
+    margin: 0;
+  }
+  .container{
+    img{
+      width: 40%;
+      height: auto;
+      float: right;
+      margin-left: 20px;
+    }
+    p {
+        margin-left: 15px;
+        text-indent: 32px;
+        line-height: 28px;
+        font-size: 14px;
+        margin-top: 0;
+        margin-bottom: 1rem;
+        color: #414345;
+      }
+      .down{
+        border: 1px solid #E8DBC1;
+        border-left: none;
+        border-right: none;
+        background-color: #FCF8F3;
+        margin: 10px -24px; 
+        padding: 20px 10px 10px 40px;
+        p{
+          margin: 0px;
+        }
+      }
+      .downcont p{
+        margin-bottom: 10px;
+      }
+      .down /deep/.list .list-li > div{
+        font-size: 14px!important;
+      }
+  }
+}
+</style>
\ No newline at end of file

src/views/News/comps/list.vue

@@ -18,6 +18,7 @@ export default {
 .list {
   margin: 0;
   padding: 0;
+  font-size: 14px;
   .row {
     display: flex;
     justify-content: space-between;

src/views/News/main.vue

@@ -88,13 +88,13 @@ export default {
           children: [
             {
               name: "零售",
-              path: "",
-              active: "",
+              path: "/News/Retail",
+              active: "Retail",
             },
             {
               name: "物流",
-              path: "",
-              active: "",
+              path: "/News/Logistics",
+              active: "Logistics",
             },
             {
               name: "医疗卫生",
@@ -103,28 +103,28 @@ export default {
             },
             {
               name: "食品安全追溯",
-              path: "",
-              active: "",
+              path: "/News/FoodSafety",
+              active: "FoodSafety",
             },
             {
               name: "电子商务",
-              path: "",
-              active: "",
+              path: "/News/ECommerce",
+              active: "ECommerce",
             },
             {
               name: "移动商务",
-              path: "",
-              active: "",
+              path: "/News/MCommerce",
+              active: "MCommerce",
             },
             {
               name: "物联网",
-              path: "",
-              active: "",
+              path: "/News/IoT",
+              active: "IoT",
             },
             {
               name: "其他",
-              path: "",
-              active: "",
+              path: "/News/Other",
+              active: "Other",
             },
           ],
         },