Commit 6ca8d8ec by 尹亚亭

jdtrademark

parent aaa35c5e
<template>
<!-- 根组件 -->
<!-- 根组件 -->
<div id="app">
<router-view/>
<router-view />
</div>
</template>
<style lang="scss">
<style lang="scss" scoped>
</style>
// 用ip
// var host = "https://movie.douban.com/";
var dev = "192.168.18.237";
var host = "http://192.168.18.237:4003"
export default {
testData: `${dev ? dev : host}/xxx`
// 接口文档 商标v4 24
testData: `${host}/action/tmOrder/springBoard`
}
\ No newline at end of file
@charset "utf-8";
/* CSS Document */
body,p,td,th,fieldset,legend,option,textarea,button,hr,input,h1,h3,h4,h5,h6,h2,ol,ul,dd,dl{ margin:0; padding:0;}
li{list-style:none;}
a{text-decoration:none; color:#666;}
i,em{font-style:normal;}
h1,h2,h4,h3,h5,h6,b,strong{font-weight:normal;}
img{border:none;display:block;}
input{outline:none;}
body{
font-family:PingFangSC, "helvetica neue", "hiragino sans gb", "Segoe UI", Calibri, "microsoft yahei ui", "microsoft yahei", simsun, sans-serif;
font-size:14px;
color:#333;
}
html,body{
margin: 0;
padding: 0;
}
table{border-collapse:collapse;}
a:hover{}
/*万能清除法,针对ie8及以上的浏览器的高度塌陷*/
.clearfix:after{
content: " ";
display: block;
clear: both;
height: 0;
visibility: hidden;
}
/*ie7及以下的浏览器的高度塌陷*/
.clearfix{zoom:1;}
/* border-spacing调整相邻单元格间距*/
table{width:500px;height:300px; border:1px solid #333; border-spacing:0; }
td,th{border:1px solid #333;}
* {
// margin: 0;
// padding: 0;
// list-style: none;
// text-decoration: none;
// outline: none;
box-sizing: border-box;
}
// html,
// body {
// font-size: 14px;
// }
......@@ -5,9 +5,15 @@ import router from '../router/index'
// 创建axios实例
const service = axios.create({
// baseURL: process.env.BASE_API, // api 的 base_url
timeout: 5000 // 请求超时时间
timeout: 5000, // 请求超时时间
// headers
})
// // 获取token并带上
// const getToken = function () {
// console.log(0)
// }
// request拦截器
service.interceptors.request.use(
config => {
......
......@@ -5,6 +5,7 @@ import store from './store'
// ui以及主题样式
import Element from 'element-ui'
import './assets/css/globelcolor.scss'
import './assets/css/reset.scss'
// 请求方法
import http from './http/request'
Vue.prototype.$axios = http;
......
import Vue from 'vue'
import VueRouter from 'vue-router'
import Home from '../views/pages/Home'
import Jdtrademark from '../views/pages/jdtrademark/Jdtrademark'
import Selftmreg from '../views/pages/selftmreg/Selftmreg'
Vue.use(VueRouter)
const routes = [
......@@ -9,7 +11,16 @@ const routes = [
name: 'home',
component: Home
},
{
path: '/jdtrademark',
name: 'jdtrademark',
component: Jdtrademark
},
{
path: '/selftmreg',
name: 'selftmreg',
component: Selftmreg
}
]
const router = new VueRouter({
......
<template>
<div class="jdc-side" style="display: block;">
<div
clstag="RightQuickLink|keycount|RightQuickLinkSec|FeedBack"
class="mod_hang_qrcode jdc_feedback_qrcode"
>
<div class="mod_hang_qrcode_btn">
<i class="jdcfont"></i>
<span>扫码反馈</span>
</div>
<div class="mod_hang_qrcode_show">
<div class="mod-qr-tips"></div>
<div class="mod_hang_qrcode_show_bg">
<canvas id="canvas" width="124" height="124" style="height: 124px; width: 124px;"></canvas>
</div>
<p>扫一扫,反馈当前页面</p>
</div>
</div>
<div
clstag="RightQuickLink|keycount|RightQuickLinkSec|ContactUsSecService"
class="mod_hang_appeal"
>
<div class="mod_hang_appeal_btn">
<i class="jdcfont"></i>
<span>咨询反馈</span>
</div>
<div class="mod_hang_appeal_show" style="display: none;">
<ul>
<li>
<a
data-ga="ContactUsSec_JIMI智能客服"
clstag="ContactIPage|keycount|ContactUsSecService|IntelligentService"
href="//jimi3-chat.jd.com/bot?venderId=897612092"
target="_blank"
>
<div class="icon_box">
<i class="jdcfont"></i>
</div>
<div class="text_box">
<h5>智能客服JIMI</h5>
<p>7*24小时支持,即刻响应,有问必答</p>
</div>
</a>
</li>
<li id="entry">
<a
data-ga="ContactUsSec_工单服务"
href="//uc.jdcloud.com/myorder/submit"
clstag="RightSlide|keycount|ContactUsSec|62"
target="_blank"
class="f-cb"
>
<div class="icon_box">
<i class="jdcfont"></i>
</div>
<div class="text_box">
<h5>工单服务</h5>
<p>7*24全时处理,技术支持</p>
</div>
</a>
</li>
<li>
<a
data-ga="ContactUsSec_投诉建议"
href="//uc.jdcloud.com/myorder/form?cateId=263&amp;questionId=264"
clstag="RightSlide|keycount|ContactUsSec|63"
target="_blank"
class="f-cb"
>
<div class="icon_box">
<i class="jdcfont"></i>
</div>
<div class="text_box">
<h5>投诉建议</h5>
<p>倾耳聆听,一个工作日内及时处理</p>
</div>
</a>
</li>
</ul>
</div>
</div>
<div
clstag="RightQuickLink|keycount|RightQuickLinkSec|BackToTop"
class="mod_hang_qrcode mod_hang_top"
>
<a
clstag="RightSlide|keycount|ContactUsSec|65"
data-ga="ContactUsSec_返回顶部"
href="javascript:;"
class="mod_hang_qrcode_btn"
>
<i class="jdcfont"></i>
<span>返回顶部</span>
</a>
</div>
</div>
</template>
<script>
export default {
data() {
return {};
},
watch: {},
methods: {}
};
</script>
<style lang="scss" scoped>
</style>
\ No newline at end of file
<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>
\ No newline at end of file
<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;
}
.jdtrademark-banner > div {
width: 1200px;
margin: 0 auto;
position: relative;
min-height: 480px;
}
.jdtrademark-banner > div > div {
padding: 10px 40px;
/* border: 1px solid rgba(207, 235, 252); */
border: 1px solid #cfebfc;
/* color: rgba(207, 235, 252); */
color: #cfebfc;
position: absolute;
left: 0;
top: 66%;
cursor: pointer;
font-size: 16px;
}
</style>
\ No newline at end of file
<template>
<div class="brandreg">
<div style="width:1200px;margin: 30px auto ;">
<div class="brand" style="width:100%;">
<div style="width:1200px;margin:0 auto">
<div style="width:1200px">
<!-- <div style="background-color:#2692FF;height:24px;width:4px;float:left"></div> -->
<div class="brand-title">商标注册申请</div>
<div class="brand-text">
<span>
<img src="../../../assets/imgs/dui.png" style="margin-right: 10px;" alt />
诚信商家
</span>
<span>
<img src="../../../assets/imgs/dui.png" style="margin-right: 10px;" alt />
1v1专业服务
</span>
<span>
<img src="../../../assets/imgs/dui.png" style="margin-right: 10px;" alt />
省钱省心省力
</span>
</div>
</div>
<!-- 轮播部分 -->
<div
class="brandreg-swiper swiper-no-swiping"
@mouseenter="dataList.length>3 ? showArrows = true : showArrows=false"
>
<div class="swiper-container">
<div class="swiper-wrapper">
<div
class="swiper-slide"
v-for="(item, index) in dataList"
:class="{'swiper-slide-enter':index==current}"
@mouseenter="adHeight(index,$event)"
:key="index"
>
<div
class="brandreg-swiper-hearder"
:class="{'brandreg-swiper-hearder-enter':index==current}"
>
<div>
<div>
<img :src="item.productLogo" alt />
</div>
<div>{{item.itemName}}</div>
</div>
</div>
<div class="brandreg-swiper-content">
<ul>
<li v-for="(item, index) in item.productDesc.desc" :key="index">
<div>
<img src="../../../assets/imgs/dbx.png" alt />
</div>
<div>{{item}}</div>
</li>
</ul>
<div>
<div>
<sup></sup>
<span>{{item.proPrice}}</span>/件
</div>
<div
class="brandreg-swiper-content-button"
:class="{'brandreg-swiper-content-button-enter':index==current}"
@click="jumpJdProductDetails(item,$event)"
>立即购买</div>
</div>
</div>
</div>
</div>
<!-- Add Pagination -->
<!-- <div class="swiper-pagination"></div> -->
</div>
<!-- 控制箭头隐藏显示 -->
<div v-show="showArrows" @mouseleave="showArrows = false">
<div class="swiper-button-prev"></div>
<!--左箭头。如果放置在swiper-container外面,需要自定义样式。-->
<div class="swiper-button-next"></div>
<!--右箭头。如果放置在swiper-container外面,需要自定义样式。-->
</div>
</div>
</div>
</div>
</div>
</div>
</template>
<script>
import api from "@/api/api.js";
export default {
data() {
return {
dataList: [],
showArrows: false
};
},
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>
<style lang="scss" scoped>
.brand-title {
width: 100%;
text-align: center;
font-size: 28px;
font-family: MicrosoftYaHei;
font-weight: 400;
color: rgba(51, 51, 51, 1);
line-height: 100px;
}
.brand-text {
font-size: 14px;
font-family: MicrosoftYaHei;
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);
}
/* 轮播 */
.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;
}
/* 移入 */
.brandreg-swiper .swiper-slide-enter {
height: 380px;
}
.brandreg-swiper .brandreg-swiper-hearder-enter {
height: 80px;
background: #32b6e7;
color: #fff;
font-size: 18px;
line-height: 80px;
}
.brandreg-swiper .brandreg-swiper-content-button-enter {
background: #32b6e7;
border: 1px solid #32b6e7;
color: #fff;
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;
}
.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%;
}
.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;
}
.brandreg-swiper-content ul li > div:nth-child(1) > img {
width: 100%;
height: 100%;
}
.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);
}
.brandreg-swiper-content > div > div:nth-child(1) > span {
font-size: 36px;
}
.brandreg-swiper-content-button {
width: 364px;
height: 46px;
border-radius: 1px;
line-height: 46px;
border: 1px solid rgba(0, 136, 199, 1);
margin: 21px auto 0;
font-size: 14px;
font-family: PingFangSC-Regular, PingFangSC;
font-weight: 400;
color: rgba(0, 136, 199, 1);
}
</style>
\ No newline at end of file
<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
<template>
<div class="jdtrademark-warpper">
<div class="jdtrademark-search">
<div>
<img src="../../../assets/imgs/search.png" alt />
<span>商标检索</span>
</div>
<div @mouseleave="typeListShow = false">
<input type="text" v-model="searchValue" placeholder="请输入您想检索的商标名称,申请号,申请人等信息" />
<div @mouseenter="typeListShow = true" class="jdtrademark-search-alltype">
全部类别
<i class="el-icon-arrow-down"></i>
</div>
<transition name="showncllist">
<div class="jdtrademark-typelist" v-if="typeListShow">
<el-checkbox
:indeterminate="isIndeterminate"
v-model="checkAll"
@change="handleCheckAllChange"
>全选</el-checkbox>
<div style="margin: 15px 0;"></div>
<el-checkbox-group v-model="checkedType" @change="handleCheckedCitiesChange">
<el-checkbox
v-for="item in typeList"
:label="item.code + item.name "
:key="item.code"
>{{item.code}}{{item.name}}</el-checkbox>
</el-checkbox-group>
</div>
</transition>
</div>
<div @click="goSearch">检索</div>
</div>
</div>
</template>
<script>
export default {
data() {
return {
typeListShow: false,
searchValue: "",
isIndeterminate: true,
checkAll: false,
checkedType: [],
typeList: [
{ code: "01", name: "化学原料", type: 1 },
{ code: "02", name: "颜料油漆", type: 1 },
{ code: "03", name: "日化用品", type: 1 },
{ code: "04", name: "燃料油脂", type: 1 },
{ code: "05", name: "医药", type: 1 },
{ code: "06", name: "金属材料", type: 1 },
{ code: "07", name: "机械设备", type: 1 },
{ code: "08", name: "手工器械", type: 1 },
{ code: "09", name: "科学仪器", type: 1 },
{ code: "10", name: "医疗器械", type: 1 },
{ code: "11", name: "灯具空调", type: 1 },
{ code: "12", name: "运输工具", type: 1 },
{ code: "13", name: "军火烟火", type: 1 },
{ code: "14", name: "珠宝钟表", type: 1 },
{ code: "15", name: "乐器", type: 1 },
{ code: "16", name: "办公用品", type: 1 },
{ code: "17", name: "橡胶制品", type: 1 },
{ code: "18", name: "皮革皮具", type: 1 },
{ code: "19", name: "建筑材料", type: 1 },
{ code: "20", name: "家具", type: 1 },
{ code: "21", name: "厨房洁具", type: 1 },
{ code: "22", name: "绳网袋篷", type: 1 },
{ code: "23", name: "纱线丝", type: 1 },
{ code: "24", name: "布料床单", type: 1 },
{ code: "25", name: "服装鞋帽", type: 1 },
{ code: "26", name: "纽扣拉链", type: 1 },
{ code: "27", name: "地毯席垫", type: 1 },
{ code: "28", name: "健身器材", type: 1 },
{ code: "29", name: "食品", type: 1 },
{ code: "30", name: "方便食品", type: 1 },
{ code: "31", name: "饲料种籽", type: 1 },
{ code: "32", name: "啤酒饮料", type: 1 },
{ code: "33", name: "酒", type: 1 },
{ code: "34", name: "烟草烟具", type: 1 },
{ code: "35", name: "广告销售", type: 1 },
{ code: "36", name: "金融物管", type: 1 },
{ code: "37", name: "建筑修理", type: 1 },
{ code: "38", name: "通讯服务", type: 1 },
{ code: "39", name: "运输贮藏", type: 1 },
{ code: "40", name: "材料加工", type: 1 },
{ code: "41", name: "教育娱乐", type: 1 },
{ code: "42", name: "网站服务", type: 1 },
{ code: "43", name: "餐饮住宿", type: 1 },
{ code: "44", name: "医疗园艺", type: 1 },
{ code: "45", name: "社会服务", type: 1 }
]
};
},
methods: {
handleCheckAllChange(val) {
if (val) {
let data = [];
this.typeList.map((item, index) => {
data.push(`${item.code}${item.name}`);
});
this.checkedType = data;
this.isIndeterminate = false;
console.log(this.checkedType, this.typeList, "1111111111");
} else {
this.checkedType = [];
}
},
/*类别选中项 */
handleCheckedCitiesChange(value) {
this.checkedType = value;
console.log(this.checkedType, this.searchValue);
let checkedCount = value.length;
this.checkAll = checkedCount === this.typeList.length;
this.isIndeterminate =
checkedCount > 0 && checkedCount < this.typeList.length;
},
goSearch() {
this.$router.push({
// bug01
path: `/${this.$root.channelName}/jdbycquerytm`,
query: {
checkedNcl: JSON.stringify(this.checkedType),
tminput: this.searchValue
}
});
}
}
};
</script>
<style lang="scss" scoped>
.jdtrademark-warpper {
width: 100%;
height: 110px;
background: #32b6e7;
}
.jdtrademark-search {
margin: 0 auto;
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;
}
</style>
\ No newline at end of file
<template>
<div class="jdtrademark-services">
<div class="jdtrademark-services-title">服务优势</div>
<div style="width:1200px;margin:0 auto;">
<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>
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
<template>
<div class="jdtrademark">
<!-- 轮播图 -->
<Jdtmbanner />
<!-- 商标检索 -->
<Jdtmsearch />
<!-- 商标注册 -->
<Jdtmbrandreg />
<!-- 服务优势 -->
<Jdtmservices />
<!-- 注册流程 -->
<Jdtmflow />
<!-- 常见问题 -->
<JdtmFAQ />
<!-- 侧边栏 -->
<!-- <JdRightSide /> -->
</div>
</template>
<script>
// import api from "@/api/api.js";
import Jdtmbanner from "./Jdtmbanner";
import Jdtmsearch from "./Jdtmsearch";
import Jdtmbrandreg from "./Jdtmbrandreg";
import Jdtmservices from "./Jdtmservices";
import Jdtmflow from "./Jdtmflow";
import JdtmFAQ from "./JdtmFAQ";
import JdRightSide from "./JdRightSide";
export default {
name: "jdtrademark",
components: {
Jdtmbanner,
Jdtmsearch,
Jdtmbrandreg,
Jdtmservices,
Jdtmflow,
JdtmFAQ,
JdRightSide
},
data() {
return {};
},
created() {
// this.$axios
// .get("/api/j/search_tags", { type: "movie", source: "1" })
// .then(d => {
// console.log(d);
// });
}
};
</script>
<style lang="scss" scoped>
</style>
\ No newline at end of file
<template>
<div>自主提报</div>
</template>
<script>
export default {};
</script>
<style lang="scss" scoped>
</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