Commit 00e278db by 尹亚亭

selftmreg

parent 6ca8d8ec
<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
...@@ -12,8 +12,6 @@ ...@@ -12,8 +12,6 @@
<Jdtmflow /> <Jdtmflow />
<!-- 常见问题 --> <!-- 常见问题 -->
<JdtmFAQ /> <JdtmFAQ />
<!-- 侧边栏 -->
<!-- <JdRightSide /> -->
</div> </div>
</template> </template>
...@@ -25,7 +23,7 @@ import Jdtmbrandreg from "./Jdtmbrandreg"; ...@@ -25,7 +23,7 @@ import Jdtmbrandreg from "./Jdtmbrandreg";
import Jdtmservices from "./Jdtmservices"; import Jdtmservices from "./Jdtmservices";
import Jdtmflow from "./Jdtmflow"; import Jdtmflow from "./Jdtmflow";
import JdtmFAQ from "./JdtmFAQ"; import JdtmFAQ from "./JdtmFAQ";
import JdRightSide from "./JdRightSide";
export default { export default {
name: "jdtrademark", name: "jdtrademark",
components: { components: {
...@@ -34,19 +32,12 @@ export default { ...@@ -34,19 +32,12 @@ export default {
Jdtmbrandreg, Jdtmbrandreg,
Jdtmservices, Jdtmservices,
Jdtmflow, Jdtmflow,
JdtmFAQ, JdtmFAQ
JdRightSide
}, },
data() { data() {
return {}; return {};
}, },
created() { created() {}
// this.$axios
// .get("/api/j/search_tags", { type: "movie", source: "1" })
// .then(d => {
// console.log(d);
// });
}
}; };
</script> </script>
......
<template> <template>
<div>自主提报</div> <div class="selftmreg">
<!-- 导航面包屑 -->
<SelftmregNav />
<!-- 主体页面 -->
<SelftmregPage />
<!-- 底部付款按钮 -->
<SelftmregTabButtonPrice />
</div>
</template> </template>
<script> <script>
export default {}; import SelftmregNav from "./SelftmregNav";
import SelftmregPage from "./SelftmregPage";
import SelftmregTabButtonPrice from "./SelftmregTabButtonPrice";
export default {
components: {
SelftmregNav,
SelftmregPage,
SelftmregTabButtonPrice
},
data() {
return {};
}
};
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.selftmreg {
background-color: white;
}
</style> </style>
\ No newline at end of file
<template>
<div class="jdindentdetail-nav">
<el-breadcrumb separator-class="el-icon-arrow-right">
<!-- titleName:商标注册服务 -->
<!-- <el-breadcrumb-item :to="listPath" class="isActive">商标注册服务{{titleName}}</el-breadcrumb-item> -->
<el-breadcrumb-item class="isActive">商标注册服务</el-breadcrumb-item>
<el-breadcrumb-item>自助商标注册</el-breadcrumb-item>
</el-breadcrumb>
</div>
</template>
<script>
export default {};
</script>
<style lang="scss" scoped>
.jdindentdetail-nav {
box-sizing: border-box;
padding-top: 17px;
width: 1200px;
margin: 12px auto;
padding: 0;
height: 24px;
line-height: 24px;
}
.isActive {
font-weight: 700;
text-decoration: none;
-webkit-transition: color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
transition: color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
color: #303133;
}
.isActive :hover {
color: #007aff;
cursor: pointer;
}
.jdindentdetail-nav .el-breadcrumb {
display: inline-block;
}
</style>
\ No newline at end of file
<template>
<div class="jdindentdetail-page">
<div class="jdindentdetail-wrap">
<!-- 主体内容 -->
<SelftmregPageMain />
<!-- page1 填写基本信息-->
<SelftmregPageOne />
<!-- page2 填写申请人信息-->
<!-- <SelftmregPageTwo /> -->
</div>
</div>
</template>
<script>
import SelftmregPageMain from "./SelftmregPageMain";
import SelftmregPageOne from "./SelftmregPageOne";
import SelftmregPageTwo from "./SelftmregPageTwo";
export default {
components: {
SelftmregPageMain,
SelftmregPageOne,
SelftmregPageTwo
},
data() {
return {};
}
};
</script>
<style lang="scss" scoped>
.jdindentdetail-page {
background-color: white;
width: 1200px;
margin: 0 auto;
padding-bottom: 90px;
}
.jdindentdetail-wrap {
text-align: left;
border: 1px solid rgba(220, 223, 230, 1);
position: relative;
}
</style>
\ No newline at end of file
<template>
<div class="selftmreg_main">
<div class="pointsRule">
<ul id="list">
<li :style="pointsRuleBackColor(1)">
<a>
<span :style="pointsRuleColor(1)">填写基本信息</span>
<i :style="pointsRuleBackColor(1)"></i>
</a>
</li>
<li :style="pointsRuleBackColor(2)">
<a>
<em class="before"></em>
<span :style="pointsRuleColor(2)">填写申请人信息</span>
<i :style="pointsRuleBackColor(2)"></i>
</a>
</li>
<li :style="pointsRuleBackColor(3)">
<a>
<em class="before"></em>
<span :style="pointsRuleColor(3)">确认订单</span>
<i :style="pointsRuleBackColor(3)"></i>
</a>
</li>
<li :style="pointsRuleBackColor(4)">
<a>
<em class="before"></em>
<span :style="pointsRuleColor(4)">支付订单</span>
</a>
</li>
</ul>
</div>
</div>
</template>
<script>
export default {
methods: {
pointsRuleBackColor(i) {
if (i < parseInt(this.step)) {
return "background: #51d2b7; z-index: " + Math.abs(i - 5);
} else if (i == parseInt(this.step)) {
return "background: #51d2b7;z-index: " + Math.abs(i - 5);
} else if (i > parseInt(this.step)) {
return "background:#EFF0F7;z-index: " + Math.abs(i - 5);
}
},
pointsRuleColor(i) {
if (i < parseInt(this.step)) {
return "color: #FFFFFF;";
} else if (i == parseInt(this.step)) {
return "color: #FFFFFF;";
} else if (i > parseInt(this.step)) {
return "color: #BBB;";
}
}
}
};
</script>
<style lang="scss" scoped>
.selftmreg_main {
width: 100%;
padding: 0px 20px;
box-sizing: border-box;
overflow: hidden;
}
.pointsRule {
width: 100%;
display: inline-block;
font-size: 16px;
margin: 20px 0px;
float: left;
text-align: center;
}
.pointsRule span {
float: left;
display: inline-block;
}
.pointsRule ul {
width: 100%;
list-style: none;
margin: 0;
padding: 0;
display: inline-block;
float: left;
width: 100%;
}
.pointsRule ul li {
width: 24%;
display: list-item;
text-align: center;
float: left;
margin-right: 10px;
background: #e3e3e3;
border-top: 1px solid #e3e3e3;
height: 31px;
position: relative;
}
.pointsRule ul li:first-child {
border-left: 1px solid #e3e3e3;
background: #e3e3e3;
}
.pointsRule ul li a {
display: block;
padding: 8px 0;
cursor: pointer;
height: 31px;
box-sizing: border-box;
}
.pointsRule ul li span {
vertical-align: middle;
height: 24px;
line-height: 15px;
display: inline-block;
overflow: hidden;
text-align: center;
width: 75%;
padding-left: 24px;
}
.pointsRule ul li i {
float: right;
/* border: #726c6c solid; */
border-width: 1px 1px 0 0;
width: 21px;
height: 22px;
margin: -4px -11px 0px 10px;
top: 2px;
transform: rotate(45deg);
-webkit-transform: rotate(45deg);
background: #e3e3e3;
-moz-transform: rotate(45deg);
/* Firefox浏览器 */
-ms-transform: rotate(45deg);
}
.pointsRule ul li em.before {
border: #e3e3e3 solid;
border-width: 1px 1px 0 0;
width: 21px;
height: 22px;
transform: rotate(45deg);
-webkit-transform: rotate(45deg);
float: left;
margin: -4px 10px 0px -11px;
top: 2px;
background: #fff;
}
</style>
\ No newline at end of file
<template>
<div class="categoryFrom">
<el-form-item label="商标类型" style="float:left;padding-right:10px;">
<el-radio-group style="display:inline-block;">
<el-radio v-model="radio">文字</el-radio>
<el-radio v-model="radio" label="2">图形</el-radio>
<el-radio v-model="radio" label="3">文字及图形</el-radio>
</el-radio-group>
<div class="categoryFrom-jieshao">如何选择商标类型?</div>
</el-form-item>
<div style="clear:both;"></div>
<el-form-item label="商标名称" style="width:860px;float:left">
<el-input style="width:330px" placeholder="请输入商标名称"></el-input>
<span
style="font-size:14px;font-family:PingFangSC-Regular;font-weight:400;color:rgba(99,101,105,1);margin-left: 10px"
>及图</span>
</el-form-item>
<div style="clear:both;"></div>
<el-form-item class="generated-icon" style="width:860px;float:left" label="商标图样">
<div style="float:left;margin-left:10px;">
<el-button style="border-radius:100px;color: #666666;" size="mini">手动上传</el-button>
<el-button style="border-radius:100px;color: #666666;" size="mini">自动生成</el-button>
</div>
<div style="clear:both;"></div>
<div style="margin-top:15px;width: 120px;">
<img width="120px" height="120px" style="border:2px dashed #e9e9e9" />
<img
width="120px"
height="120px"
style="border:2px dashed #e9e9e9"
src="../../../assets/imgs/zwtp.png"
/>
</div>
<div class="categoryFrom-imgjieshao">
<div>
<i class="el-icon-warning" style="margin-right:6px;"></i>上传黑白图样,注册后可以更换商标颜色使用;
</div>
<div style="padding-left:17px">上传彩色图样,注册后只能按照该彩色图样使用,并在委托书商标名称后方增加文字“(指定颜色)”;</div>
<div style="padding-left:17px">上传的彩色图样需与黑白图样的样式一致。</div>
<div style="padding-left:17px;color:#0F8EE9;cursor: pointer;">查看上传商标图样注意事项</div>
</div>
<div class="categoryFrom-namejieshao">
<i class="el-icon-warning" style="margin-right: 6px;"></i>自动生成的商标图样默认以“宋体字样自左向右排列”递交官方;
</div>
</el-form-item>
<div style="clear:both;"></div>
</div>
</template>
<script>
export default {
data() {
return {
radio: "1"
};
}
};
</script>
<style lang="scss" scoped>
.categoryFrom .el-input__inner {
height: 34px !important;
line-height: 34px !important;
}
.categoryFrom {
margin-bottom: 10px;
margin-top: 20px;
box-sizing: border-box;
}
.categoryFrom-jieshao {
display: inline-block;
width: 108px;
height: 17px;
font-size: 12px;
font-family: PingFangSC-Regular;
font-weight: 400;
color: #bbbbbb;
line-height: 17px;
cursor: pointer;
margin-left: 30px;
}
.categoryFrom-jieshao:hover {
color: #0989c5;
text-decoration: underline;
}
.categoryFrom-namejieshao {
display: inline-block;
text-align: left;
width: 390px;
height: 23px;
font-size: 12px;
font-family: PingFangSC-Regular;
font-weight: 400;
color: rgba(179, 179, 179, 1);
line-height: 18px;
float: right;
transform: translate(-208px, -30px);
}
.categoryFrom-imgjieshao {
display: inline-block;
font-size: 12px;
font-family: PingFangSC-Regular;
font-weight: 400;
color: rgba(179, 179, 179, 1);
position: absolute;
top: 10px;
right: 0;
line-height: 24px;
}
.categoryFrom .el-form-item__error {
left: 45% !important;
}
.categoryFrom .el-form-item__label {
text-align: left;
}
.categoryFrom .el-radio__label {
font-family: PingFangSC-Regular;
font-size: 14px;
color: #666666;
letter-spacing: 0;
text-align: left;
}
.categoryFrom .el-radio__input.is-checked + .el-radio__label {
color: #666666;
}
.categoryFrom .el-radio__inner {
border: 2px solid #dde0e6;
}
.categoryFrom .el-radio__input.is-checked .el-radio__inner {
border: 4px solid rgb(9, 137, 197);
background: none;
}
.categoryFrom .el-button {
border-radius: none;
color: #0f8ee9;
}
</style>
\ No newline at end of file
<template>
<el-container style="height: 600px;background-color:white; border: 1px solid #D6DAEB;">
<el-aside width="35%" style="text-align:center;background-color:white;position: relative;">
<div class="selftmreg_Stickie">
<el-button size="small" style="border-radius:0;">分类</el-button>
<el-input
style="width:60%;margin: 0 10px"
placeholder="输入关键字进行过滤"
suffix-icon="el-icon-search"
>
<i style="position:relative;top:8%;right:5%;z-index:1" class="el-input__icon">
<span>
<i class="tool-query" style="font-size : 1.5em;"></i>
</span>
</i>
</el-input>
<el-button style="padding: 12px 5px;color:#0989C5; " type="text">取消</el-button>
</div>
<el-card
style="z-index: 1000;font-size:13px;height:auto;text-align:left;padding-bottom: 20px;position: absolute;width:100%;margin:0 2%;"
>
<div style="margin-bottom:10px;">
<div style="float:left;width:50%;">
<el-checkbox>全选</el-checkbox>
</div>
<div style="float:left;text-align:right;width:50%;">
<el-button type="text" style="padding: 0 10px;color:#828282;">确定</el-button>
</div>
<div style="clear:both"></div>
</div>
<!-- <el-checkbox-group>
<ul style="list-style:none; padding:0;margin:0;text-align:left;">
<li style="float:left;width:33.33%">
<el-checkbox></el-checkbox>
</li>
</ul>
</el-checkbox-group>-->
</el-card>
<div style="height:100%;overflow: hidden;">
<el-tree class="gsb_tree" node-key="name" default-expand-all show-checkbox accordion></el-tree>
</div>
</el-aside>
<el-container width="60%">
<el-header
v-if="false"
style="text-align: right; font-size: 12px;background-color:white;padding-top:10px;"
>
<el-button style="float:right" type="primary">导入Contact</el-button>
<el-input style="float:right;width:40%" placeholder="请输入历史订单号" clearable></el-input>
</el-header>
<el-main style="background-color: white; padding:0px;position: relative;">
<div class="selftmreg_title">
已选择的商品/服务项
<span class="selftmreg_qingchu">
<i class="el-icon-delete"></i>
清除全部
</span>
</div>
<div style="overflow: auto;height: 100%;padding: 60px 20px 0px;box-sizing: border-box;">
<div>
<span style="font-size:16px">
<b></b>
</span>
<span style="font-size:16px;float:right">
<b>
已选择
<span style="color:#0F8EE9;"></span>
</b>
&nbsp;&nbsp;&nbsp;
<span style="cursor: pointer;">
<i class="el-icon-delete" style="font-size : 1.2em;"></i>
</span>
</span>
<br />
<br />
</div>
</div>
<div
style="overflow: auto;height: 100%;padding: 60px 20px 0px;box-sizing: border-box;position: relative;"
>
<img
src="../../../assets/imgs/kong-2.png"
style="position: absolute;margin: auto;top: 0;left: 0;bottom: 0;right: 0;"
alt
/>
<div style="color: #828282;margin-top: 330px;text-align: center;">请点击左侧选择商标类别</div>
</div>
</el-main>
</el-container>
</el-container>
</template>
<script>
export default {
data() {
return {};
}
};
</script>
<style lang="scss" scoped>
.selftmreg_Stickie {
position: absolute;
top: 0px;
left: 0px;
width: 100%;
height: 65px;
line-height: 50px;
z-index: 298;
}
.selftmreg_Stickie .el-input__inner {
height: 34px !important;
line-height: 34px !important;
}
.selftmreg_title {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 50px;
line-height: 50px;
font-size: 14px;
padding-left: 20px;
text-align: left;
color: #03004c;
box-sizing: border-box;
border-left: 1px solid #e1e1e1;
background-color: #eff0f7;
z-index: 298;
font-family: PingFangSC-Regular;
letter-spacing: 0;
}
</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
<template>
<div style="width:100%;margin-top: 20px;box-sizing: border-box;">
<div class="tabButtomPrcie">
<span style="margin-right:30px;text-align: center;color: #03004C;font-weight: 700;">
应付总额:
<i style="color:#E50778;font-style: normal;font-size: 24px;">¥0.00</i>
</span>
<el-button type="primary">下一步</el-button>
</div>
</div>
</template>
<script>
export default {};
</script>
<style lang="scss" scoped>
.tabButtomPrcie {
width: 100%;
height: 60px;
line-height: 60px;
font-size: 16px;
color: #828282;
text-align: right;
box-sizing: border-box;
background: #eff0f7;
z-index: 2999;
position: fixed;
bottom: 0;
left: 0;
padding-right: 159px;
}
.selftmregType {
display: inline-block;
width: 110px;
height: 32px;
line-height: 32px;
text-align: center;
border: 1px solid #bbbbbb;
color: #bbbbbb;
cursor: pointer;
position: relative;
}
.selftmregType > img {
position: absolute;
top: 0;
right: 0;
width: 15px;
height: 15px;
height: 0;
width: 0;
}
</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