Commit 4a8f704f by 尹亚亭

modify jdtrademark

parent 936a6bc3
/* 改变主题色变量 */
<<<<<<< HEAD
// $--color-primary: red;
$--color-primary: #108ee9;
=======
// $--color-primary: #409EFF;
>>>>>>> 0c37f553174bcb27eb19cd2e30ee4e53a084456e
/* 改变 icon 字体路径变量,必需 */
$--font-path: '~element-ui/lib/theme-chalk/fonts';
// 自定义主题色变量
<<<<<<< HEAD
// $themecolor:red;
$themecolor:#108ee9;
=======
$themecolor:#409EFF;
;
>>>>>>> 0c37f553174bcb27eb19cd2e30ee4e53a084456e
@import "~element-ui/packages/theme-chalk/src/index";
\ No newline at end of file
......@@ -32,7 +32,9 @@ const routes = [{
{
path: '/bycnoticeindex',
name: 'bycnoticeindex',
component: Bycnoticeindex
component: () =>
import("@/views/pages/bycnoticeindex/Bycnoticeindex")
}
];
const router = new VueRouter({
......
......@@ -83,6 +83,7 @@
export default {
data() {
return {
// 查询选择表单数据
choiceForm: {
// 公告期号
num: "",
......@@ -97,7 +98,7 @@ export default {
// 申请号
digit: 323
},
// 商标表格数据
brandData: [
{
brandicon: "圣启",
......@@ -189,7 +190,7 @@ export default {
.info-box {
width: 220px;
height: 334px;
/* border-radius: 0; */
border-radius: 0px;
}
.btn-size {
......
<template>
<div class="jdtrademark-FAQ-warpper">
<div class="jdtrademark-FAQ">
<div class="jdtrademark-FAQ-title">
常见问题
<div>聚集常见问答,解决商标申请时遇到的困难</div>
</div>
<ul>
<li v-for="(item, index) in issue" :key="index">
<div>
<div>
<img :src="item.img" alt />
</div>
<div>{{item.title}}</div>
</div>
<div>{{item.text}}</div>
</li>
</ul>
</div>
</div>
</template>
<script>
import img1 from "../../../assets/imgs/FAQ1.png";
import img2 from "../../../assets/imgs/FAQ2.png";
import img3 from "../../../assets/imgs/FAQ3.png";
export default {
data() {
return {
issue: [
{
img: img1,
title: "什么是商标?什么是注册商标?",
text:
"商标是指任何能够将自然人、法人或者其他组织的商品/服务与他人的商品/服务区别开的标志,包括文字、图形、字母、数字、三维标志、颜色组合和声音等,以及上述要素的组合。 注册商标是指经过商标主管机关依照法定程序及标准进行审查并通过,经《初步审定公告》无人提出异议的商标。"
},
{
img: img2,
title: "商标注册有风险吗?",
text:
"商标注册存在被商标局驳回导致申请失败的风险。申请驳回失败原因可能有:受可用文字、标识资源限制,新的商标申请容易与在先申请的商标产生近似;法律法规的相关限制等。据不完全的统计,2017年我国商标申请的驳回率约50%,2018年我国商标申请的驳回率约40%。为提高商标注册成功率,申请人可在申请时提前做好应对准备。 建议: (1) 若申请人不具有一定的专业能力,尽量选择有专业顾问指导的“专家辅助申请”和“担保注册申请”。 (2)申请时将中文、英文、图形等分开申请,通过后可以组合使用,以避免因某一部分近似而被商标局整体驳回的情况,且分开申请可以根据场景灵活组合使用。 (3) 准备备用方案,申请时可以在主要商标申请方案的基础上,增加一到两件备用商标,以便在主商标无法通过或全部通过的情况下,有其他可以使用的商标。"
},
{
img: img3,
title: "商标申请费用的标准?",
text:
"商标局规费收取标准为: 300元/类·件,即:1件商标在1个类别中申请10个(含10个)以内的商品。超过10个商品,每超过1个商品,每个商品加收30元。 即:在一个类别中指定15项商品,规费为:300+(15-10)×30=450元"
}
]
};
},
methods: {}
};
</script>
<style lang="scss" scoped>
ul,
li {
list-style: none;
padding: 0;
margin: 0;
}
.jdtrademark-FAQ-warpper {
width: 100%;
height: 570px;
box-sizing: border-box;
padding-top: 50px;
}
.jdtrademark-FAQ {
width: 1200px;
margin: 0 auto;
text-align: center;
}
.jdtrademark-FAQ-title {
font-size: 28px;
font-family: PingFangSC-Regular, PingFangSC;
font-weight: 400;
color: rgba(66, 71, 83, 1);
}
.jdtrademark-FAQ-title > div {
font-size: 14px;
font-family: PingFangSC-Regular, PingFangSC;
font-weight: 400;
color: rgba(105, 111, 127, 1);
margin-top: 10px;
}
.jdtrademark-FAQ > ul {
width: 1200px;
margin: 0 auto;
text-align: left;
}
.jdtrademark-FAQ > ul > li {
margin-top: 30px;
}
.jdtrademark-FAQ > ul > li > div:nth-child(1) {
display: flex;
margin-bottom: 7px;
font-size: 16px;
font-family: PingFangSC-Medium, PingFangSC;
font-weight: 500;
color: rgba(66, 71, 83, 1);
align-items: center;
}
.jdtrademark-FAQ > ul > li > div:nth-child(1) > div:nth-child(1) {
width: 20px;
height: 20px;
margin-right: 11px;
margin-top: 2px;
}
.jdtrademark-FAQ > ul > li > div:nth-child(1) > div:nth-child(1) > img {
width: 100%;
height: 100%;
}
.jdtrademark-FAQ > ul > li > div:nth-child(2) {
box-sizing: border-box;
padding-left: 30px;
font-size: 14px;
font-family: PingFangSC-Regular, PingFangSC;
font-weight: 400;
color: rgba(120, 128, 133, 1);
line-height: 20px;
}
.showncllist-enter-active,
.showncllist-leave-active {
transition: all 0.5s;
}
.showncllist-enter,
.showncllist-leave-to {
opacity: 0;
}
.showncllist-enter-to,
.showncllist-leave {
opacity: 1;
}
</style>
<template>
<div class="jdtrademark-banner">
<div>
<div @click="goIndentList">我的订单</div>
</div>
</div>
</template>
<script>
export default {
methods: {
/*去订单列表页jdindentlist */
goIndentList() {
location.href =
"https://oauth2.jdcloud.com/authorize?response_type=token&redirect_uri=https://tm.plus.jdcloud.com/jdtm/getUser&state=jdindentlist&client_id=9491577327154697";
}
}
};
</script>
<style lang="scss" scoped>
.jdtrademark {
width: 100%;
}
.jdtrademark-banner {
min-height: 480px;
background: yellowgreen;
/* assets的别名? */
background: url(../../../assets/imgs/banner.png) center center no-repeat;
background-size: cover;
> div {
width: 1200px;
margin: 0 auto;
position: relative;
min-height: 480px;
> div {
padding: 10px 40px;
border: 1px solid #cfebfc;
color: #cfebfc;
position: absolute;
left: 0;
top: 66%;
cursor: pointer;
font-size: 16px;
}
}
}
</style>
\ No newline at end of file
......@@ -20,7 +20,7 @@
</div>
<!-- 轮播部分 -->
<div class="brandreg-swiper swiper-no-swiping">
<div class="brandreg-swiper">
<div class="swiper-container">
<div class="swiper-wrapper">
<div class="swiper-slide">
......@@ -43,6 +43,19 @@
</div>
<div>自己检索商标,准备官方所需注册材料</div>
</li>
<!-- 写死的三条数据 -->
<li>
<div>
<img src="../../../assets/imgs/dbx.png" alt />
</div>
<div>提交迅速,及时反馈</div>
</li>
<li>
<div>
<img src="../../../assets/imgs/dbx.png" alt />
</div>
<div>全流程跟踪,掌握申请进度</div>
</li>
</ul>
<div>
<div>
......@@ -74,52 +87,9 @@ export default {
},
mounted() {
// 请求数据并装填到datalist里面
this.$axios
.post(api.testData, {
actionProcess: "jd",
sign: "2FviZ9PGws8Pt1fBhq0t90mjUvI",
actionBody: { timeStamp: 1577781269, channelUserId: "" },
timeStamp: 1577781269,
channelUserId: "",
itemCode: "",
actionType: "getProductListByTypeOneCode",
isUser: "no",
isDecryptUser: "no"
})
.then(d => {
console.log(d);
});
},
methods: {
/*swiper区域添加class */
adHeight(index, event) {
this.current = index;
},
jumpJdProductDetails(code, e) {
if (code.channelItemCode) {
switch (code.itemCode) {
case "zzsbzc":
location.href =
"https://oauth2.jdcloud.com/authorize?response_type=token&redirect_uri=https://tm.plus.jdcloud.com/jdtm/getUser&state=selftmreg&client_id=9491577327154697";
/*this.$router.push({ path: "/jd/selftmreg", query: {} });*/
break;
case "fzsbzc":
case "dbsbzc":
let productId = code.channelItemCode.split("-")[1];
console.log(code.channelItemCode.split("-"), "xxxxxxxxxxxxxx");
window.open(
`https://market.jdcloud.com/service/details/${productId}`
);
break;
default:
break;
}
} else {
return;
}
console.log(code, e);
}
}
};
</script>
......@@ -129,10 +99,8 @@ export default {
> div {
width: 1200px;
margin: 30px auto;
.brand {
width: 100%;
> div {
width: 1200px;
margin: 0 auto;
......@@ -159,66 +127,55 @@ export default {
font-weight: 400;
color: rgba(153, 153, 153, 1);
text-align: center;
/* flex弹性布局 */
display: flex;
justify-content: center;
}
/* */
.brand-text > span:not(:nth-child(1)) {
margin-left: 45px;
}
/* */
.brand-text > span {
/* flex弹性布局 */
display: flex;
align-items: center;
}
.brand-text > span > img {
width: 13px;
height: 9px;
}
.brand-text > span > h5 {
font-size: 14px;
font-weight: 400;
color: rgba(153, 153, 153, 1);
> span:not(:nth-child(1)) {
margin-left: 45px;
}
> span {
display: flex;
align-items: center;
> img {
width: 13px;
height: 9px;
}
h5 {
font-size: 14px;
font-weight: 400;
color: rgba(153, 153, 153, 1);
}
}
}
/* 轮播 */
.brandreg-swiper {
position: relative;
margin-top: 22px;
}
.brandreg-swiper .swiper-container {
width: 1203px;
height: 380px;
padding-left: 3px;
}
.brandreg-swiper .swiper-wrapper {
display: flex;
align-items: flex-end;
}
.brandreg-swiper .swiper-slide {
width: 400px !important;
box-sizing: border-box;
height: 370px;
text-align: center;
margin-right: 0 !important;
transition: all 0.1s;
box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.1);
border-radius: 1px;
.swiper-container {
width: 1203px;
height: 380px;
padding-left: 3px;
.swiper-wrapper {
display: flex;
align-items: flex-end;
.swiper-slide {
width: 400px !important;
box-sizing: border-box;
height: 370px;
text-align: center;
margin-right: 0 !important;
transition: all 0.1s;
box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.1);
border-radius: 1px;
}
}
}
}
/* 移入 */
.brandreg-swiper .swiper-slide-enter {
height: 380px;
}
.brandreg-swiper .brandreg-swiper-hearder-enter {
height: 80px;
background: #32b6e7;
......@@ -226,7 +183,6 @@ export default {
font-size: 18px;
line-height: 80px;
}
.brandreg-swiper .brandreg-swiper-content-button-enter {
background: #32b6e7;
border: 1px solid #32b6e7;
......@@ -234,94 +190,81 @@ export default {
cursor: pointer;
}
/* 结束 */
.brandreg-swiper .swiper-button-prev {
position: absolute;
left: -40px;
right: auto;
}
.brandreg-swiper .swiper-button-next {
position: absolute;
right: -40px;
left: auto;
}
/* 轮播卡片头部图文 */
.brandreg-swiper-hearder {
font-size: 16px;
height: 70px;
background: #2f3353;
color: #fff;
> div {
width: 100%;
height: 100%;
line-height: 70px;
> div {
display: inline-block;
}
> div:nth-child(1) {
width: 39px;
height: 39px;
margin-right: 15px;
> img {
width: 100%;
height: 100%;
margin-top: 15px;
}
}
}
}
.brandreg-swiper-hearder > div {
width: 100%;
height: 100%;
line-height: 70px;
}
.brandreg-swiper-hearder > div > div {
display: inline-block;
}
.brandreg-swiper-hearder > div > div:nth-child(1) {
width: 39px;
height: 39px;
margin-right: 15px;
}
.brandreg-swiper-hearder > div > div:nth-child(1) > img {
width: 100%;
height: 100%;
margin-top: 15px;
}
.brandreg-swiper-content ul {
height: 145px;
box-sizing: border-box;
padding: 30px 26px 0;
}
.brandreg-swiper-content ul li {
display: flex;
align-items: center;
font-size: 14px;
font-family: PingFangSC-Regular, PingFangSC;
font-weight: 400;
color: rgba(67, 67, 67, 1);
margin-bottom: 15px;
}
.brandreg-swiper-content ul li:nth-last-child(1) {
padding-bottom: 30px;
border-bottom: 1px solid #ededef;
}
.brandreg-swiper-content ul li > div:nth-child(1) {
width: 14px;
/* height: 16px; */
margin-right: 14px;
margin-left: 41px;
}
/* 轮播卡片中部li数据渲染 */
.brandreg-swiper-content {
ul {
height: 145px;
box-sizing: border-box;
padding: 30px 26px 0;
li {
display: flex;
align-items: center;
font-size: 14px;
font-family: PingFangSC-Regular, PingFangSC;
font-weight: 400;
color: rgba(67, 67, 67, 1);
margin-bottom: 15px;
> div:nth-child(1) {
width: 14px;
/* height: 16px; */
margin-right: 14px;
margin-left: 41px;
> img {
width: 100%;
height: 100%;
}
}
}
.brandreg-swiper-content ul li > div:nth-child(1) > img {
width: 100%;
height: 100%;
}
li:nth-last-child(1) {
padding-bottom: 30px;
border-bottom: 1px solid #ededef;
}
}
.brandreg-swiper-content > div > div:nth-child(1) {
font-size: 16px;
margin-top: 15px;
font-family: PingFangSC-Regular, PingFangSC;
font-weight: 400;
color: rgba(223, 0, 130, 1);
}
> div > div:nth-child(1) {
font-size: 16px;
margin-top: 15px;
font-family: PingFangSC-Regular, PingFangSC;
font-weight: 400;
color: rgba(223, 0, 130, 1);
.brandreg-swiper-content > div > div:nth-child(1) > span {
font-size: 36px;
> span {
font-size: 36px;
}
}
}
/* 轮播卡片底部立即购买按钮 */
.brandreg-swiper-content-button {
width: 364px;
height: 46px;
......
<template>
<div class="jdtrademark-flow"></div>
</template>
<style lang="scss" scoped>
.jdtrademark-flow {
width: 100%;
height: 500px;
background: url(../../../assets/imgs/flow.png) center center no-repeat;
background-size: cover;
}
</style>
\ No newline at end of file
......@@ -141,101 +141,92 @@ export default {
display: flex;
width: 1200px;
height: 100%;
}
.jdtrademark-search > div:nth-child(1) {
width: 172px;
height: 100%;
box-sizing: border-box;
padding-top: 38px;
background: #0ecae6;
margin-right: 21px;
display: flex;
}
.jdtrademark-search > div:nth-child(1) > img {
width: 28px;
height: 28px;
margin-left: 9px;
transform: translateY(3px);
vertical-align: middle;
}
.jdtrademark-search > div:nth-child(1) > span {
height: 28px;
font-size: 28px;
font-family: PangMenZhengDao;
/* color: rgb(168, 24, 24); */
color: #fff;
line-height: 32px;
letter-spacing: 1px;
}
.jdtrademark-search > div:nth-child(2) {
box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.1);
box-sizing: border-box;
position: relative;
height: 54px;
width: 838px;
background: #fff;
margin-top: 28px;
align-items: center;
}
.jdtrademark-search > div:nth-child(2) > .jdtrademark-typelist {
position: absolute;
box-sizing: border-box;
height: 353px;
border: none;
left: 0;
top: 54px;
width: 837.29px;
background: #fff;
z-index: 10;
box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.1);
}
.jdtrademark-search > div:nth-child(2) > .jdtrademark-typelist .el-checkbox {
width: 96.41px;
}
.jdtrademark-search > div:nth-child(2) > input {
padding-left: 12px;
height: 100%;
outline: 0;
border: none;
display: inline-block;
width: 726px;
box-sizing: border-box;
background: rgba(255, 255, 255, 1);
}
.jdtrademark-search > div:nth-child(2) > div {
cursor: pointer;
padding-left: 20px;
box-sizing: border-box;
display: inline-block;
line-height: 30px;
height: 30px;
border-left: 1px solid #d2d2d2;
font-size: 14px;
font-family: PingFangSC;
font-weight: 400;
color: rgba(106, 106, 106, 1);
}
.jdtrademark-search > div:nth-last-child(1) {
box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
margin-top: 28px;
width: 170px;
height: 54px;
text-align: center;
line-height: 54px;
background: rgba(6, 113, 162, 1);
font-size: 18px;
font-family: PingFangSC;
font-weight: 400;
color: rgba(255, 255, 255, 1);
cursor: pointer;
> div:nth-child(1) {
width: 172px;
height: 100%;
box-sizing: border-box;
padding-top: 38px;
background: #0ecae6;
margin-right: 21px;
display: flex;
> img {
width: 28px;
height: 28px;
margin-left: 9px;
transform: translateY(5px);
vertical-align: middle;
}
> span {
height: 28px;
font-size: 28px;
font-family: PangMenZhengDao;
/* color: rgb(168, 24, 24); */
color: #fff;
line-height: 32px;
letter-spacing: 1px;
}
}
> div:nth-child(2) {
box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.1);
box-sizing: border-box;
position: relative;
height: 54px;
width: 838px;
background: #fff;
margin-top: 28px;
align-items: center;
> .jdtrademark-typelist {
position: absolute;
box-sizing: border-box;
height: 353px;
border: none;
left: 0;
top: 54px;
width: 837.29px;
background: #fff;
z-index: 10;
box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.1);
.el-checkbox {
width: 96.41px;
}
}
> input {
padding-left: 12px;
height: 100%;
outline: 0;
border: none;
display: inline-block;
width: 726px;
box-sizing: border-box;
background: rgba(255, 255, 255, 1);
}
> div {
cursor: pointer;
padding-left: 20px;
box-sizing: border-box;
display: inline-block;
line-height: 30px;
height: 30px;
border-left: 1px solid #d2d2d2;
font-size: 14px;
font-family: PingFangSC;
font-weight: 400;
color: rgba(106, 106, 106, 1);
}
}
> div:nth-last-child(1) {
box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
margin-top: 28px;
width: 170px;
height: 54px;
text-align: center;
line-height: 54px;
background: rgba(6, 113, 162, 1);
font-size: 18px;
font-family: PingFangSC;
font-weight: 400;
color: rgba(255, 255, 255, 1);
cursor: pointer;
}
}
</style>
<template>
<div class="jdtrademark-services">
<div class="jdtrademark-services-title">服务优势</div>
<div class="wrap">
<ul>
<li v-for="(item, index) in serviceData" :key="index">
<div>
<img :src="item.img" alt />
</div>
<p>{{item.name}}</p>
<p>{{item.text}}</p>
</li>
</ul>
</div>
</div>
</template>
<script>
import img1 from "../../../assets/imgs/services1.png";
import img2 from "../../../assets/imgs/services2.png";
import img3 from "../../../assets/imgs/services3.png";
import img4 from "../../../assets/imgs/services4.png";
import img5 from "../../../assets/imgs/services5.png";
import img6 from "../../../assets/imgs/services6.png";
export default {
data() {
return {
serviceData: [
{
img: img1,
name: "注册评估低风险",
text:
"商标注册存在驳回失败风险,京东云利用大数据分析和智能检索工具可快速查出近似商标注册信息及状态,帮助提高通过率"
},
{
img: img2,
name: "简化流程高效注册",
text:
"京东云提供商标自助申报系统,可自定义选择注册类别,同事利用工商大数据查询企业信息功能,提高申请效率"
},
{
img: img3,
name: "最快1分钟提交商标局",
text:
"京东云支持商标自助线上提交申请、线上跟进商标订单,利用人工智能提交机器人,最快实现1分钟提交至商标局"
},
{
img: img4,
name: "申请进度实时掌握",
text:
"京东云提供在线标准化服务,流程透明可视化,关键流程通过短信、邮件通知,申请进度一目了然"
},
{
img: img5,
name: "简单管理易维护",
text:
"在京东云商标管理控制台,数据在线保存实时同步到云端,各类进度随时掌握,方便查找各类商标订单"
},
{
img: img6,
name: "多种服务供您选择",
text:
"行业合作伙伴为您提供专业服务,可一对一进行问题解答与业务建议,满足您多元的商标需求"
}
]
};
}
};
</script>
<style lang="scss" scoped>
.wrap {
width: 1200px;
margin: 0 auto;
}
ul,
li {
list-style: none;
padding: 0;
margin: 0;
}
.jdtrademark-services {
width: 100%;
height: 530px;
background: rgba(243, 246, 253, 1);
box-sizing: border-box;
padding-top: 50px;
}
.jdtrademark-services-title {
width: 112px;
font-size: 28px;
font-family: PingFangSC-Regular, PingFangSC;
font-weight: 400;
color: rgba(66, 71, 83, 1);
line-height: 40px;
margin: 0 auto 59px;
}
.jdtrademark-services ul {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
.jdtrademark-services ul > li {
box-sizing: border-box;
text-align: center;
width: 340px;
margin-bottom: 26px;
}
.jdtrademark-services ul > li > div {
width: 55px;
margin: 0 auto;
height: 55px;
}
.jdtrademark-services ul > li > div > img {
width: 100%;
height: 100%;
}
.jdtrademark-services ul > li > p:nth-of-type(1) {
margin-top: 20px;
margin-bottom: 15px;
font-family: PingFangSC-Medium, PingFangSC;
font-weight: 500;
color: rgba(55, 61, 67, 1);
}
.jdtrademark-services ul > li > p:nth-of-type(2) {
font-size: 12px;
font-family: PingFangSC-Regular, PingFangSC;
font-weight: 400;
color: rgba(76, 81, 87, 1);
}
</style>
\ No newline at end of file
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