Skip to content

G
gs1
Commit c9b5f982 by 林家欣
Options

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

parents 7039e358 1e431ac8
Showing with 800 additions and 78 deletions
src/assets/css/_base.scss
...@@ -500,6 +500,12 @@ ...@@ -500,6 +500,12 @@
justify-content: center; justify-content: center;
} }
.center{
display: flex;
justify-content: center;
align-items: center;
}
@media screen and (max-width: 992px) { @media screen and (max-width: 992px) {
.marginTopLg20 { .marginTopLg20 {
margin-top: 20px; margin-top: 20px;
......
src/components/layout/header/index.vue
...@@ -225,6 +225,7 @@ export default { ...@@ -225,6 +225,7 @@ export default {
} }
> a { > a {
display: inline-block;
position: relative; position: relative;
font-size: 14px; font-size: 14px;
font-weight: bold; font-weight: bold;
......
src/components/layout/header/service.js
...@@ -233,7 +233,7 @@ export default { ...@@ -233,7 +233,7 @@ export default {
id: uuid("gs_nav"), id: uuid("gs_nav"),
name: "服务商列表", name: "服务商列表",
index: 1, index: 1,
link: "/Service/jcyxz/List", link: "/Service/Partners/List",
breadcrumb: [ breadcrumb: [
{ name: "服务中心", path: "/Service/BarcodeV" }, { name: "服务中心", path: "/Service/BarcodeV" },
{ name: "标准服务提供商", path: "/Service/Partners/index" }, { name: "标准服务提供商", path: "/Service/Partners/index" },
...@@ -244,7 +244,7 @@ export default { ...@@ -244,7 +244,7 @@ export default {
id: uuid("gs_nav"), id: uuid("gs_nav"),
name: "案例介绍", name: "案例介绍",
index: 2, index: 2,
link: "/Service/jcyxz/CaseList", link: "/Service/Partners/CaseList",
breadcrumb: [ breadcrumb: [
{ name: "服务中心", path: "/Service/BarcodeV" }, { name: "服务中心", path: "/Service/BarcodeV" },
{ name: "标准服务提供商", path: "/Service/Partners/index" }, { name: "标准服务提供商", path: "/Service/Partners/index" },
...@@ -255,7 +255,7 @@ export default { ...@@ -255,7 +255,7 @@ export default {
id: uuid("gs_nav"), id: uuid("gs_nav"),
name: "申请与咨询", name: "申请与咨询",
index: 3, index: 3,
link: "/Service/jcyxz/Join", link: "/Service/Partners/Join",
breadcrumb: [ breadcrumb: [
{ name: "服务中心", path: "/Service/BarcodeV" }, { name: "服务中心", path: "/Service/BarcodeV" },
{ name: "条码/RFID/软件检测服务", path: "/Service/jcyxz/Barcode" }, { name: "条码/RFID/软件检测服务", path: "/Service/jcyxz/Barcode" },
......
src/router/index.js
import Vue from "vue"; import Vue from "vue";
import VueRouter from "vue-router"; import VueRouter from "vue-router";
import main from "@/components/main.vue"; import main from "@/components/main.vue";
import {service} from "@/router/service";
Vue.use(VueRouter); Vue.use(VueRouter);
...@@ -701,7 +702,6 @@ const routes = [ ...@@ -701,7 +702,6 @@ const routes = [
], ],
}, },
{ {
// 查询中心 // 查询中心
path: "/search", path: "/search",
...@@ -759,80 +759,7 @@ const routes = [ ...@@ -759,80 +759,7 @@ const routes = [
}, },
], ],
}, },
{ service,
// 查询中心
path: "/Service",
name: "Service",
component: main,
redirect: "/Service/BarcodeV",
meta: {
name: "查询中心",
},
children: [
{
path: "/",
component: () => import("@/views/Service/index"),
children: [
{
path: "BarcodeV",
component: () => import("@/views/Service/barcodeV"),
meta: {
name: "条码微站",
},
},
{
path: "Book",
component: () => import("@/views/Service/book"),
meta: {
name: "软件下载",
},
},
{
path: "jcyxz/Barcode",
component: () => import("@/views/Service/barcode"),
meta: {
name: "一维和二维条码符号检测",
},
},
{
path: "jcyxz/facility",
component: () => import("@/views/Service/facility"),
meta: {
name: "条码设备检测",
},
},
{
path: "jcyxz/instrument",
component: () => import("@/views/Service/instrument"),
meta: {
name: "条码检测仪校准与检定",
},
},
{
path: "jcyxz/RFID",
component: () => import("@/views/Service/RFID"),
meta: {
name: "射频识别（RFID）测试与认证",
},
},
{
path: "jcyxz/Software",
component: () => import("@/views/Service/software"),
meta: {
name: "软件产品检测",
},
},
{
path: "jcyxz/QC",
component: () => import("@/views/Service/QC"),
meta: {
name: "质检中心",
},
},
],
},
],
},
{ {
path: "/login", path: "/login",
name: "login", name: "login",
......
src/router/service.js 0 → 100644
import main from "_c/main";
export const service = {
// 查询中心
path: "/Service",
name: "Service",
component: main,
redirect: "/Service/BarcodeV",
meta: {
name: "服务中心",
},
children: [
{
path: "/",
component: () => import("@/views/Service/index"),
children: [
{
path: "BarcodeV",
component: () => import("@/views/Service/barcodeV"),
meta: {
name: "条码微站",
},
},
{
path: "Book",
component: () => import("@/views/Service/book"),
meta: {
name: "软件下载",
},
},
// 条码/RFID/软件检测服务 Start
{
path: "jcyxz/Barcode",
component: () => import("@/views/Service/barcode"),
meta: {
name: "一维和二维条码符号检测",
},
},
{
path: "jcyxz/facility",
component: () => import("@/views/Service/facility"),
meta: {
name: "条码设备检测",
},
},
{
path: "jcyxz/instrument",
component: () => import("@/views/Service/instrument"),
meta: {
name: "条码检测仪校准与检定",
},
},
{
path: "jcyxz/RFID",
component: () => import("@/views/Service/RFID"),
meta: {
name: "射频识别（RFID）测试与认证",
},
},
{
path: "jcyxz/Software",
component: () => import("@/views/Service/software"),
meta: {
name: "软件产品检测",
},
},
{
path: "jcyxz/QC",
component: () => import("@/views/Service/QC"),
meta: {
name: "质检中心",
},
},
// 条码/RFID/软件检测服务 End
// 标准服务提供商 Start
{
path: "Partners/index",
component: () => import("@/views/Service/Partners/index"),
meta: {
name: "关于我们",
},
},
{
path: "Partners/List",
component: () => import("@/views/Service/Partners/list"),
meta: {
name: "我要查找GS1标准服务提供商",
},
},
{
path: "Partners/CaseList",
component: () => import("@/views/Service/Partners/caseList"),
meta: {
name: "GS1标准服务提供商案例",
},
},
{
path: "Partners/Join",
component: () => import("@/views/Service/Partners/join"),
meta: {
name: "我要成为GS1标准服务提供商",
},
},
// 标准服务提供商 End
{
path: "GDS",
component: () => import("@/views/Service/GDS"),
meta: {
name: "中国商品信息服务平台",
},
},
{
path: "Chinatrace",
component: () => import("@/views/Service/ChinaTrace"),
meta: {
name: "国家食品（产品）安全追溯平台",
},
},
],
},
],
};
src/views/Service/ChinaTrace.vue 0 → 100644
<template>
<div class="search-content n-service gds">
<div class="title">国家食品（产品）安全追溯平台</div>
<div class="body" style="padding-top: 9px">
<p>
国家食品（产品）安全追溯平台（<a target="_blank" href="http://www.chinatrace.org">http://www.chinatrace.org</a>）是国家发改委确定的重点食品质量安全追溯物联网应用示范工程，主要面向全国生产企业，实现产品追溯、防伪及监管，由中国物品编码中心建设及运行维护，由政府、企业、消费者、第三方机构使用。
</p>
<div class="barcodev-title">
服务企业：为企业提供溯源信息的集中化管理
</div>
<p>
服务于企业的“企业内部追溯系统”，主要通过制定不同行业内部追溯标准，帮助企业定制开发符合自己的业务流程追溯系统。
</p>
<div class="barcodev-title">
服务政府：为政府监管提供基础数据支持
</div>
<p>
为政府监管服务的“政府监管系统”，可以提供追溯报告查询、发送召回通知、自检要求报告、信用评级。
</p>
<div class="barcodev-title">
服务公众：为公众提供查询溯源信息的窗口
</div>
<p>
向公众提供查询服务的“公众查询系统”，提供公共追溯查询入口，消费者和食品质量监管部门可通过该入口查询产品的追溯信息。实现方式应方便、快捷和实时，同时提供可视化查询界面效果。公众消费者查询系统主要功能包括：商品信息查询、追溯报告查询、追溯地图查询、意见反馈、预警信息。
</p>
<div class="barcodev-title">
追溯平台具有以下特点：
</div>
<div class="notice">
<ul style="font-size: 14px">
<li style="padding-top: 15px">权威性：国家级平台，国家物联网建设示范工程；</li>
<li>唯一性：追溯码全球唯一；</li>
<li>开放性：可兼容不同行业追溯子系统；</li>
<li>国际性：与世界上200多个国家实现追溯信息链接；</li>
<li>标准性：使用GS1 XML 和EDI 实现数据统一格式；</li>
<li>灵活性：自定义追溯模板，实现对不同行业不同产品的追溯；</li>
<li>易用性：操作简单，易学易用。</li>
</ul>
</div>
<div class="barcodev-title">
国家食品（产品）安全追溯平台加入流程说明
</div>
<p>
国家食品（产品）安全追溯平台（以下简称平台）接收31个省级平台上传的质量监管与追溯数据；完善并整合条码基础数据库、QS、监督抽查数据库等质检系统内部现有资源（分散存储、互联互通）；通过对食品企业质量安全数据的分析与处理，实现信息公示、公众查询、诊断预警、质量投诉等功能。加入流程如下：
</p>
<div class="barcodev-title">
一、 登录平台
</div>
<p>
在浏览器中输入平台的网址：http://www.chinatrace.org/，如下图所示：
</p>
<div class="notice text-center">
<img src="./img/1.jpg" alt="">
</div>
<div class="barcodev-title">
二、 用户注册及登录
</div>
<p>
平台为生产企业、流通企业提供产品追溯通道，方便上述企业建立自己的产品追溯系统。
</p>
<p>
用户注册界面如下所示：
</p>
<div class="notice text-center">
<img src="./img/2.jpg" alt="">
</div>
<p>
用户完成注册后就可以进入用户登录界面，如下图：
</p>
<div class="notice text-center">
<img src="./img/3.jpg" alt="">
</div>
<p>
用户根据其注册时企业的性质，登录各自的追溯通道，可以对相关产品进行追溯数据的填报和管理。
</p>
<div class="barcodev-title">
三、 公众查询
</div>
<p>
在平台网站的首页，公众可以通过输入相关产品的商品条码信息、商品条码+批次号、追溯码等信息实现对应产品的追溯信息的查询。如下图所示：
</p>
<div class="notice text-center">
<img src="./img/4.jpg" alt="">
</div>
</div>
</div>
</template>
<script>
export default {};
</script>
<style lang="scss">
.n-service.gds {
.notice {
margin: 10px 0 30px;
ul li {
list-style-type: disc;
}
img {
max-width: 100%;
}
}
a {
color: #008dbd;
text-decoration: none;
font-weight: 500;
word-break: break-word;
}
p {
font-family: PingFangSC-Regular, PingFang SC;
margin: 10px 0;
font-size: 14px;
font-weight: 400;
color: #414345;
text-indent: 2em;
}
.barcodev-title {
display: inline-block;
font-size: 16px;
font-weight: 500;
color: #F26335;
margin: 10px 0;
}
}
</style>
src/views/Service/GDS.vue 0 → 100644
<template>
<div class="search-content n-service gds">
<div class="title">中国商品信息服务平台</div>
<div class="body" style="padding-top: 9px">
<p>
<a href="http://www.gds.org.cn/" target="_blank">中国商品信息服务平台</a>（以下简称“平台”）是由中国物品编码中心（以下简称“编码中心”）依照GS1数据池国际标准构建的，集产品管理与服务于一体的商品信息公共服务平台。
</p>
<div class="notice text-center">
<img src="./img/5.jpg" alt="">
<h6 style="margin-top: 15px">中国商品信息服务平台首页</h6>
</div>
<p>
平台遵循产品标识、产品属性、产品分类、数据交换等全球统一标准，以商品条码为基础，直接由中国商品条码系统成员填报商品信息，有效保证了信息的准确性、时效性与持续性。
</p>
<p>
平台在编码中心及全国46家物品编码分支机构的统一维护下，安全、稳定、快速地运行与发展，现已拥有超过19万家企业会员的1800万条商品信息，并以每天3万条的速度快速增长，覆盖了我国食品饮料、日用百货、家具建材、医疗卫生、文教用品等数百个行业，为我国商品信息查询、商品贸易流通、产品质量监管等领域提供着高效的商品信息数据支持服务，在服务消费者、服务企业、服务政府方面发挥着重要作用。
</p>
<p>
服务消费者&mdash;&mdash;真实、准确的数据是消费者享受信息服务的基础条件，在商品极其丰富的今天，各种流通渠道蕴含着海量的商品信息，平台以其自身及专业的电子商务网站、手机查询软件等多种形式开放商品基础信息，有效地帮助消费者获取生产企业的第一手资料。
</p>
<p>
服务企业&mdash;&mdash;标准化的商品信息是平台为企业提供产品信息管理、数据同步、电子数据交换等服务的独特优势，其全球通用的数据标准和架构，最大程度统一了数据的管理与共享规则，使企业既能科学管理产品，又能与合作伙伴在同一通道交流对话。平台商品信息数据同步服务是零供企业间实现商品数据无缝共享的重要手段，至今实现了美国劳氏、家乐福、麦德龙、新华都、华润万家、乐天玛特、北京华联与宝洁（中国）、强生、联合利华等知名企业的数千家门店的国际、国内商品数据同步，简化的信息沟通过程、高效的数据传输效率，令企业供应链不断优化升级，为我国广大&ldquo;零供&rdquo;企业带来显著收益。
</p>
<p>
服务政府&mdash;&mdash;平台拥有高效的技术支持力量与培训服务机制，为政府管理部门与企业之间建立起畅通的信息沟通渠道，方便管理部门有效整合商品信息，推动产品质量监管工作的执行，也在很大程度上了帮助企业提升了信誉和市场竞争力。2012年，编码中心承担了质检总局专项任务，以平台为基础开发产品质量信用信息平台，实现了产品质量的跟踪与追溯，为我国产品质量诚信体系建设提供了有效的服务。
</p>
<div class="notice text-center">
<h6 style="margin-bottom: 15px">中国商品信息服务平台首页</h6>
<img src="./img/2015-GDS-join-flow.jpg" alt="">
</div>
</div>
</div>
</template>
<script>
export default {};
</script>
<style lang="scss">
.n-service.gds {
.notice {
margin: 10px 0 30px;
ul li {
list-style-type: disc;
}
img {
max-width: 80%;
}
}
a{
color: #008dbd;
text-decoration: none;
font-weight: 500;
word-break: break-word;
}
p {
font-family: PingFangSC-Regular, PingFang SC;
margin: 10px 0;
font-size: 14px;
font-weight: 400;
color: #414345;
text-indent: 2em;
}
.barcodev-title {
display: inline-block;
font-size: 16px;
font-weight: 500;
color: #F26335;
margin: 10px 0;
}
}
</style>
src/views/Service/Partners/caseList.vue 0 → 100644
<template>
<div class="search-content n-service partners-case-list">
<div class="title">GS1标准服务提供商案例</div>
<div class="body" style="padding-top: 9px;position: relative;">
<div class="search row" style="margin: 15px 0;">
<div class="col-lg-4">
<el-select style="width: 100%" size="small" v-model="service" placeholder="请选择">
<el-option
v-for="item in serviceList"
:key="item.value"
:label="item.value"
:value="item.value">
</el-option>
</el-select>
</div>
<div class="col-lg-4 text-left">
<el-button type="primary" size="small">搜索</el-button>
</div>
<ul class="main-list">
<!-- 注意！这里请后台开发的同学替换成循环输出 top 20 -->
<li><a target="_blank" href="/Service/Partners/Case?id=5">
宁波天益医疗GS1-UDI项目案例介绍-上海路歌信息技术有限公司</a></li>
<li><a target="_blank" href="/Service/Partners/Case?id=4">
北京爱康医疗GS1-UDI项目案例介绍-上海敖维计算机科技发展有限公司</a></li>
<li><a target="_blank" href="/Service/Partners/Case?id=3">
利用GS1编码规则实施UDI满足中国法规要求，实现内部追溯</a></li>
<li><a target="_blank" href="/Service/Partners/Case?id=2">
多米诺集团在医疗领域的GS1标准应用案例</a></li>
<li><a target="_blank" href="/Service/Partners/Case?id=1">
北京爱创科技股份有限公司进口药品GS1应用案例</a></li>
</ul>
</div>
</div>
</div>
</template>
<script>
export default {
data() {
return {
service: '全部服务行业',
serviceList: [{value: '全部服务行业'}, {value: '医疗'}, {value: '零售'}, {value: '电子商务'}, {value: '食品烟酒'}, {value: '物流'}, {value: '服装'}, {value: '快速消费品'}, {value: '消费电子产品'}, {value: '制造和零部件'}, {value: '建材'}, {value: '其他'},]
}
},
methods: {},
};
</script>
<style lang="scss">
.n-service.partners-case-list {
.notice {
margin: 10px 0;
}
p {
font-family: PingFangSC-Regular, PingFang SC;
margin: 10px 0;
font-size: 14px;
font-weight: 400;
color: #414345;
text-indent: 2em;
}
.barcodev-title {
display: inline-block;
font-size: 16px;
font-weight: 500;
color: #F26335;
margin: 10px 0;
}
.search {
.col-lg-4 {
margin-bottom: 15px;
}
}
.main-list{
padding-left: 40px;
}
.main-list li {
color: #ccc;
/*height: 40px;*/
line-height: 40px;
list-style: disc;
border-bottom: 1px dashed #eee;
font-size: 14px;
}
.main-list li a {
width: 100%;
display: inline-block;
line-height: 28px;
vertical-align: top;
padding: 8px 0;
color: #008dbd;
text-decoration: none;
font-weight: 500;
word-break: break-word;
}
.main-list li:hover {
background-color: #eee;
}
}
</style>
src/views/Service/Partners/index.vue 0 → 100644
<template>
<div class="search-content n-service partners-index">
<div class="title">关于我们</div>
<div class="body" style="padding-top: 9px;position: relative;">
<img class="img-1_" src="../img/GS1ChinaLogo.jpeg" align="left" alt=""/>
<p>
GS1标准服务提供商项目（GS1 Solution Provider)
,旨在吸纳各个领域的优质服务机构成为GS1标准的解决方案提供商。本项目致力于构建“GS1标准服务提供商”、商品条码系统成员和GS1用户为一体的生态圈。通过解决方案提供商，帮助系统成员用好GS1标准，打通GS1标准应用的“最后一公里”。
</p>
<div class="row link-notice">
<div class="col-lg-6">
<div class="pointer notice " @click="handleToBe">
<img src="../img/online1.jpeg" alt="">
<p>我要成为GS1标准服务提供商</p>
</div>
</div>
<div class="col-lg-6">
<div class="pointer notice" @click="handleToFind">
<img src="../img/online2.jpeg" alt="">
<p>我要查找GS1标准服务提供商</p>
</div>
</div>
</div>
<h5 style="text-align: center;margin: 40px 0 10px">解决方案服务商案例</h5>
<div id="partners-index-carousel" class="carousel slide" data-bs-ride="carousel">
<div class="carousel-indicators">
<button type="button" data-bs-target="#partners-index-carousel" data-bs-slide-to="0" class="active"
aria-current="true" aria-label="Slide 1"></button>
<button type="button" data-bs-target="#partners-index-carousel" data-bs-slide-to="1"
aria-label="Slide 2"></button>
<button type="button" data-bs-target="#partners-index-carousel" data-bs-slide-to="2"
aria-label="Slide 3"></button>
</div>
<div class="carousel-inner">
<div class="carousel-item active">
<div class="row">
<div class="col-lg-6 center">
<img src="../img/case2.jpeg" alt="">
</div>
<div class="col-lg-6" style="padding-top: 15px;padding-bottom: 15px;color:#248ece;">
<div style="font-size: 18px;padding: 8px 0;border-bottom: 1px solid #248ece;">医疗</div>
<div style="margin-top: 15px;margin-bottom: 15px;"><span style="">汇集医疗领域的优质解决方案服务商，以优质的技术和服务，为用户解决GS1编码的“最后一公里”问题。</span>
</div>
<div class="text-right"><a href="/Service/Partners/CaseHealthcare.aspx">更多»</a></div>
</div>
</div>
</div>
<div class="carousel-item">
<div class="row">
<div class="col-lg-6 center">
<img src="../img/case1.jpeg" alt="">
</div>
<div class="col-lg-6" style="padding-top: 15px;padding-bottom: 15px;color:#248ece;">
<div style="font-size: 18px;padding: 8px 0;border-bottom: 1px solid #248ece;">食品安全追溯</div>
<div style="margin-top: 15px;margin-bottom: 15px;text-align: center;"><span style="line-height: 40px;">正在建设中...</span>
</div>
<div class="text-right"><a href="/Service/Partners/Case">更多»</a></div>
</div>
</div>
</div>
<div class="carousel-item">
<div class="row">
<div class="col-lg-6 center">
<img src="../img/case3.jpeg" alt="">
</div>
<div class="col-lg-6" style="padding-top: 15px;padding-bottom: 15px;color:#248ece;">
<div style="font-size: 18px;padding: 8px 0;border-bottom: 1px solid #248ece;">物流</div>
<div style="margin-top: 15px;margin-bottom: 15px;text-align: center;"><span style="line-height: 40px;">正在建设中...</span>
</div>
<div class="text-right"><a href="/Service/Partners/Case">更多»</a></div>
</div>
</div>
</div>
</div>
<button class="carousel-control-prev" type="button" data-bs-target="#partners-index-carousel"
data-bs-slide="prev">
<span class="carousel-control-prev-icon" aria-hidden="true"></span>
<span class="visually-hidden">Previous</span>
</button>
<button class="carousel-control-next" type="button" data-bs-target="#partners-index-carousel"
data-bs-slide="next">
<span class="carousel-control-next-icon" aria-hidden="true"></span>
<span class="visually-hidden">Next</span>
</button>
</div>
</div>
</div>
</template>
<script>
export default {
methods: {
handleToBe() {
this.$router.push({path: '/Service/Partners/Join'})
},
handleToFind() {
this.$router.push({path: '/Service/Partners/List'})
},
},
};
</script>
<style lang="scss">
.n-service.partners-index {
.img-1_ {
width: 300px;
margin: 0 10px 10px 0;
}
.link-notice {
padding-top: 20px;
margin: 50px 0 0;
border-top: 1px solid #ccc;
width: 100%;
.notice {
text-align: center;
margin: 0 0 15px;
padding: 0 0 10px;
img {
max-width: 90%;
max-height: 100%;
}
p {
font-weight: bold;
font-size: 14px;
color: #454545;
}
}
}
p {
font-family: PingFangSC-Regular, PingFang SC;
margin: 10px 0;
font-size: 14px;
font-weight: 400;
color: #414345;
text-indent: 2em;
}
.barcodev-title {
display: inline-block;
font-size: 16px;
font-weight: 500;
color: #F26335;
margin: 10px 0;
}
}
#partners-index-carousel {
.carousel-control-prev, .carousel-control-next {
width: 50px;
}
.text-right {
text-align: right;
}
.row {
min-height: 280px;
padding: 20px 50px;
background-color: #ef9fba;
img {
max-width: 90%;
text-align: center;
}
}
}
</style>
src/views/Service/Partners/list.vue 0 → 100644
<template>
<div class="search-content n-service partners-list">
<div class="title">我要查找GS1标准服务提供商</div>
<div class="body" style="padding-top: 9px;position: relative;">
<div class="notice">
<p>
GS1标准服务提供商由标识打印、制作和识别，系统集成、信息服务、咨询等领域的解决方案提供商组成，服务于医疗、物流、零售、电子商务、快消、服装等行业。GS1标准服务提供商能够支持GS1标准的推广和使用。
</p>
</div>
<div class="search row" style="margin: 15px 0;">
<div class="col-lg-4">
<el-select style="width: 100%" size="small" v-model="technology" placeholder="请选择">
<el-option
v-for="item in technologyList"
:key="item.value"
:label="item.value"
:value="item.value">
</el-option>
</el-select>
</div>
<div class="col-lg-4">
<el-select style="width: 100%" size="small" v-model="service" placeholder="请选择">
<el-option
v-for="item in serviceList"
:key="item.value"
:label="item.value"
:value="item.value">
</el-option>
</el-select>
</div>
<div class="col-lg-4 text-left">
<el-button type="primary" size="small">搜索</el-button>
</div>
<ul class="main-list">
<!-- 注意！这里请后台开发的同学替换成循环输出 top 20 -->
<li><a target="_blank" href="/Service/Partners/content?id=7">
上海路歌信息技术有限公司</a></li>
<li><a target="_blank" href="/Service/Partners/content?id=6">
上海悦孜企业信息咨询有限公司</a></li>
<li><a target="_blank" href="/Service/Partners/content?id=5">
上海敖维计算机科技发展有限公司</a></li>
<li><a target="_blank" href="/Service/Partners/content?id=4">
北京东方捷码科技开发中心</a></li>
<li><a target="_blank" href="/Service/Partners/content?id=3">
北京爱创科技股份有限公司</a></li>
<li><a target="_blank" href="/Service/Partners/content?id=2">
多米诺标识科技有限公司</a></li>
<li><a target="_blank" href="/Service/Partners/content?id=1">
北京嘉华汇诚科技股份有限公司</a></li>
</ul>
</div>
</div>
</div>
</template>
<script>
export default {
data() {
return {
technology: '全部技术领域',
technologyList: [
{value: '全部技术领域'}, {value: '标识的打印和制作'}, {value: '系统集成'}, {value: '信息服务'}, {value: '咨询服务'}, {value: '其他'},
],
service: '全部服务行业',
serviceList: [{value: '全部服务行业'}, {value: '医疗'}, {value: '零售'}, {value: '电子商务'}, {value: '食品烟酒'}, {value: '物流'}, {value: '服装'}, {value: '快速消费品'}, {value: '消费电子产品'}, {value: '制造和零部件'}, {value: '建材'}, {value: '其他'},]
}
},
methods: {},
};
</script>
<style lang="scss">
.n-service.partners-list {
.notice {
margin: 10px 0;
}
p {
font-family: PingFangSC-Regular, PingFang SC;
margin: 10px 0;
font-size: 14px;
font-weight: 400;
color: #414345;
text-indent: 2em;
}
.barcodev-title {
display: inline-block;
font-size: 16px;
font-weight: 500;
color: #F26335;
margin: 10px 0;
}
.search {
.col-lg-4 {
margin-bottom: 15px;
}
}
.main-list{
padding-left: 40px;
}
.main-list li {
color: #ccc;
/*height: 40px;*/
line-height: 40px;
list-style: disc;
border-bottom: 1px dashed #eee;
font-size: 14px;
}
.main-list li a {
width: 100%;
display: inline-block;
line-height: 28px;
vertical-align: top;
padding: 8px 0;
color: #008dbd;
text-decoration: none;
font-weight: 500;
word-break: break-word;
}
.main-list li:hover {
background-color: #eee;
}
}
</style>
src/views/Service/index.vue
...@@ -31,3 +31,8 @@ export default { ...@@ -31,3 +31,8 @@ export default {
}, },
}; };
</script> </script>
<style>
.nav-service p {
line-height: 24px;
}
</style>
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