Skip to content

Z
zhichan
Commit d9c150d5 by 任建
Options

rj

parent 1b5ef243
Showing with 618 additions and 28 deletions
channel-access/src/api/api.js
import axios from "axios"; import axios from "axios";
export function getNcldata() { let baseUrl = "http://tm.plus.jdcloud.com/web/trademark/tmqueryCtl/doPost";
return axios.post( //jdbycdetailtm数据
"http://192.168.18.45:4004/web/trademark/tmqueryCtl/doPost", { export function getJdbycdetailtmData() {
actionProcess: "jd", return axios.post(baseUrl, {
sign: "2FviZ9PGws8Pt1fBhq0t90mjUvI", actionProcess: "jd",
actionBody: { sign: "2FviZ9PGws8Pt1fBhq0t90mjUvI",
nclcode: "01", actionBody: { timeStamp: 1578295027, channelUserId: "" },
timeStamp: 1578036301, actionType: "tradeMarkDetail",
channelUserId: "a5EyZC8Ht/Gpm2rKPeDpoziYmdcA/nF0" requrl: "/action/tmQuery/springBoard",
}, isUser: "no",
actionType: "getNcl", isDecryptUser: "no"
requrl: "/action/tmTools/springBoard", });
isUser: "no", }
isDecryptUser: "no" //初审公告期号图片
} export function getLinkUrl(num) {
); return axios.post(baseUrl, {
actionProcess: "jd",
sign: "2FviZ9PGws8Pt1fBhq0t90mjUvI",
actionBody: {
sbzch: "14543071",
zcggqh: num,
timeStamp: 1578298188,
channelUserId: ""
},
actionType: "noticezcggsearch",
requrl: "/action/tmQuery/springBoard",
isUser: "no",
isDecryptUser: "no"
});
}
//获取公司信息
export function getCompanyInfo(name) {
return axios.post(baseUrl, {
actionProcess: "jd",
sign: "2FviZ9PGws8Pt1fBhq0t90mjUvI",
actionBody: {
company_name: name,
timeStamp: 1578298969,
channelUserId: ""
},
actionType: "getCompanyInfoNoUser",
requrl: "/action/tmQuery/springBoard",
isUser: "no",
isDecryptUser: "no"
});
} }
\ No newline at end of file
channel-access/src/views/pages/jdbycdetailtm/companyInfo.vue 0 → 100644
<template>
<div class="drawer-company">
<div class="drawer-company-top">
<div class="company-top-title">
<div class="company-name">{{ data.name }}</div>
<div class="company-img">
<img src="@/assets/imgs/jdt/GSlogo.png" alt="" />
</div>
</div>
<div class="company-top-msg">
<p><img src="@/assets/imgs/jdt/website.png" />{{ data.tel_info }}</p>
<p><i class="el-icon-search"></i>{{ data.businessAddress }}</p>
</div>
</div>
<div class="drawer-company-main"></div>
</div>
</template>
<script>
export default {
// props: ["data"],
data() {
return {
data: {
name: "广州市玮誉贸易有限公司",
legalRepresentative: "侯丰羽",
managementState: "存续",
registeredCapital: "110.000万人民币",
foundedTime: "2003-12-2",
creditCode: "91440106755589300G",
registrID: "440106000073627",
organizationCode: "755589300",
companyType: "0",
registerOffice: "广州市天河区工商行政管理局",
businessAddress: "广州市天河区先烈东路296号8517-8519室",
scope:
"商品批发贸易(许可审批类商品除外);商品零售贸易(许可审批类商品除外);(依法须经批准的项目,经相关部门批准后方可开展经营活动)〓",
dateIssue: "2016-3-17",
businessTerm: "2003-12-2至null",
tel_info: "020-87259789"
}
};
}
};
</script>
<style lang="scss">
.drawer-company {
width: 100%;
padding: 0 30px;
.drawer-company-top {
width: 100%;
}
}
.company-top-title {
width: 100%;
height: 122px;
.company-name {
float: left;
font-size: 20px;
}
.company-img {
float: right;
}
}
.company-top-msg{
width: 100%;
p{
width: 100%;
line-height: 30px;
display: flex;
align-items: center;
font-size: 14px;
color: #606266;
img{
width: 14px !important;
height: 14px !important;
margin-right: 10px;
}
i{
font-size: 14px;
margin-right: 10px;
}
}
}
</style>
channel-access/src/views/pages/jdbycdetailtm/index.vue
<template> <template>
<div class="jdbycdetailtm"> <div class="jdbycdetailtm">
<div class="jdindentdetail-top"> <div class="jdbycdetailtm-container">
<div class="quan"></div> <div class="jdbycdetailtm-top">
<div class="dangqian"> <el-breadcrumb separator-class="el-icon-arrow-right">
当前位置： <el-breadcrumb-item>商标列表</el-breadcrumb-item>
<el-breadcrumb-item>商标详情</el-breadcrumb-item>
</el-breadcrumb>
</div>
<div class="jdbycdetailtm-main">
<table class="table-main">
<tbody class="tbody">
<!-- 头部进度条 -->
<tr>
<td class="td-first">申请流程</td>
<td class="td-el-steps" colspan="3">
<div class="td-steps-right">
<div v-for="(o, i) in progressNarArr" :key="i">
<div class="td-steps-img" :style="progressNarBgColor(i)">
<img :src="o.icon" alt="" />
</div>
<div class="td-steps-name" :style="progressNarColor(i)">
{{ o.name }}
</div>
<div
class="td-border"
v-if="i != 3"
:style="progressNarBorColor(i)"
></div>
</div>
</div>
</td>
</tr>
<!-- -->
<tr>
<td class="td-title">商标名称</td>
<td class="td-content" colspan="2">{{ detaildata.sbmc }}</td>
<td class="imgtd" rowspan="5">
<img
v-if="detaildata.logo"
:src="detaildata.logo"
@click="showImgDialog('', detaildata.logo)"
/>
<img
v-else
src="https://gsb-zc.oss-cn-beijing.aliyuncs.com/zc_imagequery293101543401586324201828183946324czhd.png"
/>
</td>
</tr>
<tr>
<td class="td-title">申请号</td>
<td class="td-content" colspan="2">
{{ detaildata.sbzch ? detaildata.sbzch : "---" }}
</td>
</tr>
<tr>
<td class="td-title">法律状态</td>
<td class="td-content" style="color: #108EE9;" colspan="2">
{{ detaildata.sbzt }}
</td>
</tr>
<tr>
<td class="td-title">国际分类</td>
<td class="td-content" colspan="2">
{{ detaildata.gjflname ? detaildata.gjflname : "---" }}
</td>
</tr>
<tr>
<td class="td-title">申请日期</td>
<td class="td-content" colspan="2">
{{ detaildata.sqrq ? detaildata.sqrq : "---" }}
</td>
</tr>
<tr>
<td class="td-title">申请人名称</td>
<td class="td-content" style="color: #108EE9;" colspan="3">
<span>{{ detaildata.zcr ? detaildata.zcr : "---" }}</span>
<i
@click="getCompanyInfo(detaildata.zcr)"
class="el-icon-search"
></i>
</td>
</tr>
<tr>
<td class="td-title">申请人地址</td>
<td class="td-content" colspan="3">
{{ detaildata.zcdz ? detaildata.zcdz : "---" }}
</td>
</tr>
<tr>
<td class="td-title">申请人名称（英文）</td>
<td class="td-content" colspan="3">
{{ detaildata.zcren ? detaildata.zcren : "---" }}
</td>
</tr>
<tr>
<td class="td-title">申请人地址（英文）</td>
<td class="td-content" colspan="3">
{{ detaildata.zcdzen ? detaildata.zcdzen : "---" }}
</td>
</tr>
<!--商品/服务项目-->
<tr>
<td class="td-title" rowspan="2">商品/服务项目</td>
<td class="project-title">已注册群组</td>
<td class="project-title" colspan="2">未注册群组</td>
</tr>
<tr>
<td>
<ul class="register" v-if="registeredList.length">
<li v-for="(item, index) in registeredList" :key="index">
{{ item.code }} {{ item.small_name }}
</li>
</ul>
<ul class="register" v-else>
<li>暂无</li>
</ul>
</td>
<td colspan="2">
<ul class="register" v-if="unregisteredList.length">
<li v-for="(item, index) in unregisteredList" :key="index">
{{ item.code }} {{ item.name }}
</li>
</ul>
<ul class="register" v-else>
<li>暂无</li>
</ul>
</td>
</tr>
<!-- -->
<tr>
<td class="td-title">初审公告期号</td>
<td class="td-content click">
{{ detaildata.csgg ? "第" + detaildata.csgg + "期" : "---"
}}<i
v-if="detaildata.csgg"
@click="getLinkUrl(detaildata.csgg)"
class="el-icon-search"
></i>
</td>
<td class="td-title">初审公告日期</td>
<td class="td-content">
{{ detaildata.csrq ? detaildata.csrq : "---" }}
</td>
</tr>
<tr>
<td class="td-title">注册公告期号</td>
<td class="td-content click">
{{ detaildata.zcgg ? "第" + detaildata.zcgg + "期" : "---"
}}<i
v-if="detaildata.zcgg"
@click="getLinkUrl(detaildata.zcgg)"
class="el-icon-search"
></i>
</td>
<td class="td-title">注册公告日期</td>
<td class="td-content">
{{ detaildata.zcrq ? detaildata.zcrq : "---" }}
</td>
</tr>
<tr>
<td class="td-title">专用权期限</td>
<td class="td-content">
{{ detaildata.zcrq ? detaildata.zcrq : "---" }}至{{
detaildata.jzrq ? detaildata.jzrq : "---"
}}
</td>
<td class="td-title">代理机构名称</td>
<td class="td-content click">
{{ detaildata.dljg ? detaildata.dljg : "---"
}}<i v-if="detaildata.dljg" class="el-icon-search"></i>
</td>
</tr>
<tr>
<td class="td-title">商标公告流程</td>
<td class="td-content" colspan="3">
<ul class="announcement-process">
<li
v-for="(item, index) in detaildata.lcxx"
:key="index"
class="click"
>
{{ item.name }} <i class="el-icon-search"></i>
</li>
</ul>
</td>
</tr>
</tbody>
</table>
</div> </div>
<el-breadcrumb separator-class="el-icon-arrow-right">
<el-breadcrumb-item>交付中心</el-breadcrumb-item>
<el-breadcrumb-item>订单详情</el-breadcrumb-item>
</el-breadcrumb>
</div> </div>
<!-- 图片弹出框 -->
<el-dialog :title="imgTitle" :visible.sync="centerDialogVisible" center>
<img v-if="imgUrl" :src="imgUrl" alt="" />
<CompanyInfo v-else />
</el-dialog>
</div> </div>
</template> </template>
<script> <script>
export default {}; import icon1 from "@/assets/imgs/jdt/shenqing.png";
import icon2 from "@/assets/imgs/jdt/chushen.png";
import icon3 from "@/assets/imgs/jdt/zhuce.png";
import icon4 from "@/assets/imgs/jdt/wuxiao.png";
//
import CompanyInfo from "./companyInfo"
//
import { getJdbycdetailtmData, getLinkUrl, getCompanyInfo } from "@/api/api.js";
export default {
components: {
CompanyInfo
},
data() {
return {
//头部进度条
tmstatus: null,
progressNarArr: [
{
icon: icon1,
name: "申请中"
},
{
icon: icon2,
name: "已初审"
},
{
icon: icon3,
name: "已注册"
},
{
icon: icon4,
name: "已无效"
}
],
//主体
detaildata: {},
registeredList: [],
unregisteredList: [],
processList: [
"2019-03-13 商标注册公告（一）",
"2019-03-13 商标注册公告（一）"
],
//弹出框
centerDialogVisible: false,
imgTitle: "",
imgUrl: ""
};
},
mounted() {
getJdbycdetailtmData().then(res => {
console.log(res);
if (res.data.status == 0) {
this.detaildata = res.data.data.detaildata[0];
this.registeredList = res.data.data.nclexist;
this.unregisteredList = res.data.data.nclnotexist;
this.tmstatus = this.progressNarArr.findIndex(item => {
return item.name == this.detaildata.sbzt;
});
}
});
},
methods: {
progressNarBgColor(i) {
var k = this.tmstatus;
if (i <= k) {
return "background:#62b5db";
} else if (i > k) {
return "background:#eff1f9";
}
},
progressNarColor(i) {
var k = this.tmstatus;
if (i <= k) {
return "color:#0989c5";
} else if (i > k) {
return "color:#bbbbbb;";
}
},
progressNarBorColor(i) {
var k = this.tmstatus;
if (i < k) {
return "border-color:#62b5db;";
} else if (i >= k) {
return "border-color:#eff1f9;";
}
},
showImgDialog(title, url) {
this.imgTitle = title;
this.imgUrl = url;
this.centerDialogVisible = true;
},
getLinkUrl(num) {
getLinkUrl(num).then(res => {
if (res.data.status == 0) {
this.showImgDialog(res.data.data.sbmc, res.data.data.linkurl);
}
});
},
getCompanyInfo(name) {
this.showImgDialog("", "");
getCompanyInfo(name).then(res => {
console.log(res.data);
});
}
}
};
</script> </script>
<style lang="scss"> <style lang="scss">
.jdbycdetailtm { .jdbycdetailtm {
padding: 0 20px; width: 100%;
height: 100%;
background: #eceef3;
overflow: auto;
i {
cursor: pointer;
}
.jdbycdetailtm-container {
width: 1200px;
margin: 0 auto;
background: #fff;
padding: 0 20px 20px;
}
//弹出框
.el-dialog {
.el-dialog__body {
width: 100%;
img {
width: 100%;
}
}
}
}
.jdbycdetailtm-top {
width: 100%;
height: 60px;
display: flex;
align-items: center;
}
.jdbycdetailtm-main {
width: 100%;
.table-main {
width: 100%;
.tbody {
width: 100%;
tr {
width: 100%;
td {
border: 1px solid #d6daeb;
}
.td-first {
width: 300px;
height: 190px;
background: #f7f8fc;
font-family: PingFangSC-Regular;
font-size: 14px;
color: #333333;
letter-spacing: 0;
text-align: center;
}
.td-el-steps {
padding: 0 110px;
}
.td-title {
height: 40px;
background: #f7f8fc;
font-family: PingFangSC-Regular;
font-size: 14px;
color: #333333;
letter-spacing: 0;
text-align: center;
line-height: 20px;
}
.td-content {
min-width: 300px;
text-align: left;
padding-left: 17px;
font-family: PingFangSC-Regular;
font-size: 12px;
color: #666666;
letter-spacing: 0;
line-height: 20px;
text-align: left;
}
.click {
color: #108ee9;
}
.imgtd {
width: 196px;
padding: 38px;
img {
width: 100%;
}
}
.project-title {
width: 450px;
height: 40px;
background: #f7f8fc;
text-align: center;
}
}
.register {
display: flex;
flex-wrap: wrap;
width: 100%;
padding: 20px;
li {
width: 50%;
font-family: PingFangSC-Regular;
font-size: 12px;
color: #666666;
letter-spacing: 0;
line-height: 20px;
}
}
.announcement-process {
width: 100%;
padding: 10px 20px;
li {
font-family: PingFangSC-Regular;
font-size: 12px;
color: #666666;
letter-spacing: 0;
line-height: 30px;
i {
color: #108ee9;
}
}
}
}
}
.td-steps-right {
width: 100%;
display: flex;
background-color: #fff;
}
.td-steps-right > div {
flex: 1;
position: relative;
}
.td-steps-img {
width: 60px;
height: 60px;
display: flex;
line-height: 40px;
border-radius: 50%;
text-align: center;
border-radius: 50%;
}
.td-steps-img > img {
width: 50px;
height: 50px;
margin: auto;
}
.td-steps-name {
margin-top: 10px;
margin-left: 5px;
width: 50px;
height: 16px;
font-size: 16px;
font-family: PingFangSC-Medium;
font-weight: 500;
line-height: 16px;
text-align: center;
}
.td-border {
width: 70px;
border-top: 4px solid #62b5db;
height: 1px;
overflow: hidden;
position: absolute;
right: 15px;
top: 30px;
border-radius: 100px;
}
} }
</style> </style>
channel-access/src/views/pages/jdindentdetail/classTrademark.vue
...@@ -29,14 +29,14 @@ ...@@ -29,14 +29,14 @@
<div class="classTrademark-right"> <div class="classTrademark-right">
<div class="classTrademark-right-top"> <div class="classTrademark-right-top">
<p>已选择的商品/服务项</p> <p>已选择的商品/服务项</p>
<span class="el-icon-delete">清除全部</span> <span class="el-icon-delete" @click="deleteClassData()">清除全部</span>
</div> </div>
<div class="classTrademark-right-main"> <div class="classTrademark-right-main">
<div class="notData" v-if="classDataList.length == 0"> <div class="notData" v-if="classDataList.length == 0">
<img src="@/assets/imgs/kong-2.png" alt="" /> <img src="@/assets/imgs/kong-2.png" alt="" />
<span>请点击左侧选择商标类别</span> <span>请点击左侧选择商标类别</span>
</div> </div>
<div class="classData"> <div class="classData" v-else>
<div class="classData-top"> <div class="classData-top">
<h4>第02类 颜料油漆</h4> <h4>第02类 颜料油漆</h4>
<p>已选择<span>1</span>项</p> <p>已选择<span>1</span>项</p>
...@@ -147,6 +147,26 @@ export default { ...@@ -147,6 +147,26 @@ export default {
handleClose(tag) { handleClose(tag) {
console.log(tag); console.log(tag);
this.classDataList.splice(this.classDataList.indexOf(tag), 1); this.classDataList.splice(this.classDataList.indexOf(tag), 1);
},
deleteClassData() {
this.$confirm("确定清空所有已选商品/服务项吗？", "提示", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning"
})
.then(() => {
this.classDataList = [];
this.$message({
type: "success",
message: "删除成功!"
});
})
.catch(() => {
this.$message({
type: "info",
message: "已取消删除"
});
});
} }
}, },
mounted() { mounted() {
......
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