main
liudan
11 months ago
commit
403402b295
@ -0,0 +1,23 @@ |
||||
.DS_Store |
||||
node_modules |
||||
/dist |
||||
|
||||
|
||||
# local env files |
||||
.env.local |
||||
.env.*.local |
||||
|
||||
# Log files |
||||
npm-debug.log* |
||||
yarn-debug.log* |
||||
yarn-error.log* |
||||
pnpm-debug.log* |
||||
|
||||
# Editor directories and files |
||||
.idea |
||||
.vscode |
||||
*.suo |
||||
*.ntvs* |
||||
*.njsproj |
||||
*.sln |
||||
*.sw? |
||||
@ -0,0 +1,24 @@ |
||||
# project-one |
||||
|
||||
## Project setup |
||||
``` |
||||
npm install |
||||
``` |
||||
|
||||
### Compiles and hot-reloads for development |
||||
``` |
||||
npm run serve |
||||
``` |
||||
|
||||
### Compiles and minifies for production |
||||
``` |
||||
npm run build |
||||
``` |
||||
|
||||
### Lints and fixes files |
||||
``` |
||||
npm run lint |
||||
``` |
||||
|
||||
### Customize configuration |
||||
See [Configuration Reference](https://cli.vuejs.org/config/). |
||||
@ -0,0 +1,5 @@ |
||||
module.exports = { |
||||
presets: [ |
||||
'@vue/cli-plugin-babel/preset' |
||||
] |
||||
} |
||||
@ -0,0 +1,19 @@ |
||||
{ |
||||
"compilerOptions": { |
||||
"target": "es5", |
||||
"module": "esnext", |
||||
"baseUrl": "./", |
||||
"moduleResolution": "node", |
||||
"paths": { |
||||
"@/*": [ |
||||
"src/*" |
||||
] |
||||
}, |
||||
"lib": [ |
||||
"esnext", |
||||
"dom", |
||||
"dom.iterable", |
||||
"scripthost" |
||||
] |
||||
} |
||||
} |
||||
File diff suppressed because it is too large
Load Diff
@ -0,0 +1,43 @@ |
||||
{ |
||||
"name": "project-one", |
||||
"version": "0.1.0", |
||||
"private": true, |
||||
"scripts": { |
||||
"serve": "vue-cli-service serve", |
||||
"build": "vue-cli-service build", |
||||
"lint": "vue-cli-service lint" |
||||
}, |
||||
"dependencies": { |
||||
"core-js": "^3.8.3", |
||||
"vue": "^2.6.14" |
||||
}, |
||||
"devDependencies": { |
||||
"@babel/core": "^7.12.16", |
||||
"@babel/eslint-parser": "^7.12.16", |
||||
"@vue/cli-plugin-babel": "~5.0.0", |
||||
"@vue/cli-plugin-eslint": "~5.0.0", |
||||
"@vue/cli-service": "~5.0.0", |
||||
"eslint": "^7.32.0", |
||||
"eslint-plugin-vue": "^8.0.3", |
||||
"vue-template-compiler": "^2.6.14" |
||||
}, |
||||
"eslintConfig": { |
||||
"root": true, |
||||
"env": { |
||||
"node": true |
||||
}, |
||||
"extends": [ |
||||
"plugin:vue/essential", |
||||
"eslint:recommended" |
||||
], |
||||
"parserOptions": { |
||||
"parser": "@babel/eslint-parser" |
||||
}, |
||||
"rules": {} |
||||
}, |
||||
"browserslist": [ |
||||
"> 1%", |
||||
"last 2 versions", |
||||
"not dead" |
||||
] |
||||
} |
||||
|
After Width: | Height: | Size: 4.2 KiB |
@ -0,0 +1,26 @@ |
||||
<!DOCTYPE html> |
||||
<html lang=""> |
||||
<head> |
||||
<meta charset="utf-8"> |
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge"> |
||||
<meta name="viewport" content="width=device-width,initial-scale=1.0"> |
||||
<link rel="icon" href="<%= BASE_URL %>favicon.ico"> |
||||
<title><%= htmlWebpackPlugin.options.title %></title> |
||||
<script> |
||||
var _hmt = _hmt || []; |
||||
(function() { |
||||
var hm = document.createElement("script"); |
||||
hm.src = "https://hm.baidu.com/hm.js?4c5fadd3f5719aa66a257856202831e9"; |
||||
var s = document.getElementsByTagName("script")[0]; |
||||
s.parentNode.insertBefore(hm, s); |
||||
})(); |
||||
</script> |
||||
</head> |
||||
<body> |
||||
<noscript> |
||||
<strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to continue.</strong> |
||||
</noscript> |
||||
<div id="app"></div> |
||||
<!-- built files will be auto injected --> |
||||
</body> |
||||
</html> |
||||
@ -0,0 +1,233 @@ |
||||
<template> |
||||
<div id="app"> |
||||
<div> |
||||
<el-row style="background-color: #eef1f5;"> |
||||
<el-col :xs="1" :sm="1" :md="1" :lg="1" :xl="1"></el-col> |
||||
<el-col :xs="22" :sm="22" :md="22" :lg="22" :xl="22"> |
||||
<div class="title"> |
||||
<span>欢迎访问商标注册查询系统中心</span><span>知识产权信息服务平台</span> |
||||
</div> |
||||
</el-col> |
||||
<el-col :xs="1" :sm="1" :md="1" :lg="1" :xl="1"></el-col> |
||||
|
||||
</el-row> |
||||
<!-- --> |
||||
<el-row> |
||||
<el-col :xs="1" :sm="1" :md="1" :lg="1" :xl="1"></el-col> |
||||
<el-col :xs="22" :sm="22" :md="22" :lg="22" :xl="22"> |
||||
<div class="logo"> |
||||
<img src="./assets/img_logo.png" alt=""> |
||||
<div class="titleLogo"> |
||||
<div class="topic">商标注册查询备案系统</div> |
||||
<div class="subTopic">Trademark Registration Inquiry and Recording System</div> |
||||
</div> |
||||
</div> |
||||
</el-col> |
||||
<el-col :xs="1" :sm="1" :md="1" :lg="1" :xl="1"></el-col> |
||||
|
||||
</el-row> |
||||
<el-row style="background-color: #709bc2;"> |
||||
<el-col :xs="1" :sm="1" :md="1" :lg="1" :xl="1"></el-col> |
||||
<el-col :xs="22" :sm="22" :md="22" :lg="22" :xl="22"> |
||||
<div class="tabs"> |
||||
<div @click="setIndex(index)" :class="activeIndex==index?'tabItem active':'tabItem'" v-for="(item,index) in tabList" :key="index">{{item}}</div> |
||||
</div> |
||||
</el-col> |
||||
<el-col :xs="1" :sm="1" :md="1" :lg="1" :xl="1"></el-col> |
||||
|
||||
</el-row> |
||||
|
||||
|
||||
</div> |
||||
|
||||
<div class="content"> |
||||
<el-row> |
||||
<el-col :xs="1" :sm="1" :md="1" :lg="1" :xl="1"></el-col> |
||||
<el-col :xs="22" :sm="22" :md="22" :lg="22" :xl="22"><pageOne v-if="activeIndex==0"/><pageTwo v-if="activeIndex==1"/></el-col> |
||||
<el-col :xs="1" :sm="1" :md="1" :lg="1" :xl="1"></el-col> |
||||
|
||||
</el-row> |
||||
|
||||
</div> |
||||
<div class="footer"> |
||||
<div style="width:100%;"> |
||||
<el-row> |
||||
<el-col :xs="24" :sm="24" :md="3" :lg="6" :xl="6"></el-col> |
||||
<el-col :xs="24" :sm="24" :md="18" :lg="12" :xl="12"> |
||||
<el-row> |
||||
<el-col :xs="12" :sm="12" :md="4" :lg="4" :xl="4">网上快捷申请</el-col> |
||||
<el-col :xs="12" :sm="12" :md="4" :lg="4" :xl="4">商标查询</el-col> |
||||
<el-col :xs="12" :sm="12" :md="4" :lg="4" :xl="4">国际商标申请</el-col> |
||||
<el-col :xs="12" :sm="12" :md="4" :lg="4" :xl="4">注册流程图</el-col> |
||||
<el-col :xs="12" :sm="12" :md="4" :lg="4" :xl="4">商标申请指南</el-col> |
||||
<el-col :xs="12" :sm="12" :md="4" :lg="4" :xl="4">申请书式文件</el-col> |
||||
|
||||
</el-row> |
||||
</el-col> |
||||
<el-col :xs="24" :sm="24" :md="3" :lg="6" :xl="6"></el-col> |
||||
|
||||
</el-row> |
||||
<div class="name">公司名称：无锡聚优效网络科技有限公司</div> |
||||
</div> |
||||
</div> |
||||
|
||||
</div> |
||||
</template> |
||||
|
||||
<script> |
||||
import pageOne from './components/pageOne.vue' |
||||
import pageTwo from './components/pageTwo.vue' |
||||
export default { |
||||
name: 'App', |
||||
components:{ |
||||
pageOne,pageTwo |
||||
}, |
||||
data(){ |
||||
return{ |
||||
tabList:['网上快捷申请','商标查询'], |
||||
activeIndex:0, |
||||
} |
||||
}, |
||||
methods:{ |
||||
setIndex(index){ |
||||
this.activeIndex = index; |
||||
}, |
||||
initInnerHandle(){ |
||||
var agl = document.createElement('script'); |
||||
agl.type = 'text/javascript'; |
||||
agl.async = true; |
||||
agl.src = 'https://fxgate.baidu.com/angelia/fcagl.js?production=_f7L2XwGXjyszb4d1e2oxPybgD'; |
||||
var s = document.getElementsByTagName('script')[0]; |
||||
s.parentNode.insertBefore(agl, s); |
||||
}, |
||||
initHandle(){ |
||||
|
||||
window._agl = window._agl || []; |
||||
_agl.push( |
||||
['production', '_f7L2XwGXjyszb4d1e2oxPybgD'] |
||||
); |
||||
this.initInnerHandle() |
||||
window._agl && window._agl.push(['track', ['success', {t: 3}]]) |
||||
|
||||
} |
||||
}, |
||||
created(){ |
||||
this.initHandle() |
||||
} |
||||
} |
||||
</script> |
||||
|
||||
<style> |
||||
html,body{ |
||||
padding:0; |
||||
font-size: 62.5%; |
||||
margin:0; |
||||
} |
||||
#app { |
||||
font-family: Avenir, Helvetica, Arial, sans-serif; |
||||
-webkit-font-smoothing: antialiased; |
||||
-moz-osx-font-smoothing: grayscale; |
||||
text-align: center; |
||||
color: #2c3e50; |
||||
margin:0; |
||||
padding:0; |
||||
|
||||
} |
||||
.title{ |
||||
display: flex; |
||||
justify-content: space-between; |
||||
align-items: center; |
||||
height: 3.6rem; |
||||
background-color: #eef1f5; |
||||
padding:0 2rem; |
||||
font-size:1.6rem; |
||||
} |
||||
.logo{ |
||||
display: flex; |
||||
align-items: center; |
||||
justify-content: flex-start; |
||||
background-color: #fff; |
||||
padding:1rem 2rem; |
||||
} |
||||
.titleLogo{ |
||||
margin-left: 1.8rem; |
||||
display: flex; |
||||
flex-direction: column; |
||||
align-items: flex-start; |
||||
} |
||||
.titleLogo .topic{ |
||||
font-size: 3.2rem; |
||||
color: #0151a4; |
||||
font-weight: 700; |
||||
line-height: 4.2rem; |
||||
} |
||||
.titleLogo .subTopic{ |
||||
font-size: 1.4rem; |
||||
color: #999999; |
||||
line-height: 2.2rem; |
||||
} |
||||
.tabs{ |
||||
display: flex; |
||||
align-items: center; |
||||
justify-content: center; |
||||
background-color: #709bc2; |
||||
height: 4.2rem; |
||||
padding:0rem 2rem; |
||||
} |
||||
.tabs .tabItem{ |
||||
flex:1; |
||||
height:104%; |
||||
line-height: 4.2rem; |
||||
text-align: center; |
||||
cursor: pointer; |
||||
font-size: 1.6rem; |
||||
color: #FFFFFF; |
||||
} |
||||
.active{ |
||||
background-color: #ff9724; |
||||
} |
||||
.content{ |
||||
/* flex:1; */ |
||||
background-color: #d5dbe7; |
||||
} |
||||
.el-col{ |
||||
border:1px solid transparent; |
||||
} |
||||
.footer{ |
||||
background-image: url(./assets/bg_foot.png); |
||||
/* background-size: ; */ |
||||
height: 7.8rem; |
||||
|
||||
background-size: cover; |
||||
border-top: solid 1px #48769f; |
||||
display: flex; |
||||
/* flex-direction: column; */ |
||||
align-items: center; |
||||
justify-content: center; |
||||
position: relative; |
||||
color:#fff; |
||||
} |
||||
.footer .name{ |
||||
|
||||
font-size: 14px; |
||||
color: #ffffff; |
||||
opacity: 0.4; |
||||
|
||||
text-align: center; |
||||
margin-top:1rem; |
||||
} |
||||
@media only screen and (max-width: 767px){ |
||||
.title{ |
||||
font-size: 1.2rem; |
||||
} |
||||
.titleLogo .topic{ |
||||
font-size: 1.8rem; |
||||
} |
||||
} |
||||
@media only screen and (min-width: 768px){ |
||||
|
||||
} |
||||
@media only screen and (min-width: 992px){ |
||||
|
||||
} |
||||
</style> |
||||
|
After Width: | Height: | Size: 5.9 KiB |
|
After Width: | Height: | Size: 1.3 KiB |
|
After Width: | Height: | Size: 9.5 KiB |
@ -0,0 +1,568 @@ |
||||
<template> |
||||
<div class="pageOne"> |
||||
<h3>网上快捷申请</h3> |
||||
<div class="subTitle"> |
||||
<img src="../assets/icon_msg.png" alt=""> |
||||
<div>加<span>*</span>为必填项。</div> |
||||
</div> |
||||
<div class="form"> |
||||
<el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="145px" class="formRule"> |
||||
<el-form-item label="商标类别" prop="category"> |
||||
|
||||
<el-input v-model="ruleForm.category" type="number" placeholder="输入1-45之间的阿拉伯数字，例如查询第9类，请输入：9"></el-input> |
||||
</el-form-item> |
||||
<el-form-item label="商标类型" prop="type"> |
||||
<div class="xing">*</div> |
||||
<el-radio-group v-model="ruleForm.type"> |
||||
<el-radio label="中文"></el-radio> |
||||
<el-radio label="英文"></el-radio> |
||||
<el-radio label="数字"></el-radio> |
||||
<el-radio label="图形"></el-radio> |
||||
<el-radio label="中文+英文"></el-radio> |
||||
</el-radio-group> |
||||
</el-form-item> |
||||
<el-form-item label="筛选条件设置" prop="activity"> |
||||
<div class="activityContent"> |
||||
<el-checkbox :indeterminate="isIndeterminate" v-model="checkAll" @change="handleCheckAllChange">全选</el-checkbox> |
||||
<div style="margin-bottom:0.8rem;"></div> |
||||
<el-checkbox-group v-model="ruleForm.activity" @change="handleCheckedCitiesChange"> |
||||
<el-checkbox v-for="item in list" :label="item" :key="item">{{item}}</el-checkbox> |
||||
</el-checkbox-group> |
||||
</div> |
||||
</el-form-item> |
||||
<el-form-item label="商标名称" prop="name"> |
||||
<div class="xing">*</div> |
||||
<el-input v-model="ruleForm.name" placeholder="请输入待查询商标名称，例如：华为"></el-input> |
||||
</el-form-item> |
||||
|
||||
|
||||
</el-form> |
||||
<div class="btnGroup"> |
||||
<button class="reset" @click="resetHandle">重置条件</button> |
||||
<button class="searchBtn" @click="submitForm">立即查询></button> |
||||
|
||||
</div> |
||||
<div class="info"> |
||||
2023年的商标数据存在部分延迟，可去人工窗口免费二次核实 |
||||
</div> |
||||
</div> |
||||
<el-dialog title="网上快捷申请" :close-on-click-modal="false" :visible.sync="dialogVisible" width="554px" @close="closeHandle"> |
||||
<div class="dialogInfo">为保证信息安全，请填写手机号码并验证。查询结果稍后将发送至您的手机。</div> |
||||
<div class="dialogform"> |
||||
<el-input placeholder="请输入商标名称" v-model="dialogForm.name"> |
||||
<template slot="prepend">商标名称</template> |
||||
</el-input> |
||||
<el-input placeholder="请输入手机号接收数据更新通知" style="margin:2rem 0" v-model="dialogForm.phone"> |
||||
<template slot="prepend">联系方式</template> |
||||
</el-input> |
||||
<div class="code"> |
||||
<el-input v-model="dialogForm.code" placeholder="请输入手机验证码"></el-input> |
||||
<button class="codeBtn" :disabled="disabledStatus" @click="getCode">{{disabledStatus?`${timeNum}s后重新获取`:'获取验证码'}}</button> |
||||
</div> |
||||
</div> |
||||
<div class="submitBtn" @click="submitSearchHandle">提交查询</div> |
||||
<!-- <span slot="footer" class="dialog-footer"> |
||||
<el-button @click="dialogVisible = false">取 消</el-button> |
||||
<el-button type="primary" @click="dialogVisible = false">确 定</el-button> |
||||
</span> --> |
||||
</el-dialog> |
||||
</div> |
||||
</template> |
||||
<script> |
||||
export default{ |
||||
data(){ |
||||
return{ |
||||
dialogVisible:false, |
||||
isIndeterminate: true, |
||||
list:[ |
||||
'完全相同','加字符','含在其他商标中', |
||||
'部分相同','减字符','内含其它商标', |
||||
'字符改变','顺序颠倒','读音相同', |
||||
], |
||||
checkAll: false, |
||||
ruleForm: { |
||||
category:null, |
||||
type:'中文', |
||||
activity:[], |
||||
name: '', |
||||
}, |
||||
rules: { |
||||
type: [ |
||||
{ required: true, message: '请选择商标类型', trigger: 'change' } |
||||
], |
||||
name: [ |
||||
{ required: true, message: '请输入商标名称', trigger: 'blur' }, |
||||
|
||||
], |
||||
}, |
||||
dialogForm:{ |
||||
name:'', |
||||
phone:'', |
||||
code:'', |
||||
}, |
||||
disabledStatus:false, |
||||
timeNum:120, |
||||
timer:null, |
||||
} |
||||
}, |
||||
beforeDestroy(){ |
||||
clearInterval(this.timer); |
||||
}, |
||||
methods:{ |
||||
closeHandle(){ |
||||
clearInterval(this.timer); |
||||
}, |
||||
handleCheckAllChange(val) { |
||||
this.ruleForm.activity = val ? this.list : []; |
||||
this.isIndeterminate = false; |
||||
}, |
||||
handleCheckedCitiesChange(value) { |
||||
let checkedCount = value.length; |
||||
this.checkAll = checkedCount === this.list.length; |
||||
this.isIndeterminate = checkedCount > 0 && checkedCount < this.list.length; |
||||
}, |
||||
submitForm(formName) { |
||||
this.$refs['ruleForm'].validate((valid) => { |
||||
if (valid) { |
||||
this.dialogForm = this.$options.data().dialogForm; |
||||
this.dialogForm.name = this.ruleForm.name; |
||||
this.dialogVisible = true; |
||||
|
||||
} else { |
||||
console.log('error submit!!'); |
||||
return false; |
||||
} |
||||
}); |
||||
}, |
||||
resetHandle(formName) { |
||||
this.$refs['ruleForm'].resetFields(); |
||||
}, |
||||
getCode(){ |
||||
|
||||
clearInterval(this.timer); |
||||
|
||||
let reg = /^1[3-9]\d{9}$/; |
||||
if(!reg.test(this.dialogForm.phone)){ |
||||
alert("请输入正确的联系方式"); |
||||
return; |
||||
} |
||||
this.$axios({ |
||||
method: "post", |
||||
url: "https://b8.njrenzhou.com/api/sms/sendCode", |
||||
data: { |
||||
mobile:this.dialogForm.phone |
||||
} |
||||
}) |
||||
.then((res)=>{ |
||||
console.log(res) |
||||
if(res.data.code==1){ |
||||
this.disabledStatus = true; |
||||
this.timeNum = 120; |
||||
this.timer = setInterval(()=>{ |
||||
this.timeNum-- |
||||
},1000) |
||||
if(this.timeNum==0){ |
||||
clearInterval(this.timer); |
||||
this.disabledStatus = false; |
||||
} |
||||
}else{ |
||||
alert(res.data.msg) |
||||
this.disabledStatus = false; |
||||
clearInterval(this.timer); |
||||
} |
||||
|
||||
}) |
||||
.catch((err)=>{ |
||||
console.log(err,"0000") |
||||
clearInterval(this.timer); |
||||
this.disabledStatus = false; |
||||
}) |
||||
|
||||
|
||||
}, |
||||
submitSearchHandle(){ |
||||
if(!this.dialogForm.name){ |
||||
alert("请输入商标名称"); |
||||
return; |
||||
} |
||||
if(!this.dialogForm.phone){ |
||||
alert("请输入联系方式"); |
||||
return; |
||||
} |
||||
let reg = /^1[3-9]\d{9}$/; |
||||
if(!reg.test(this.dialogForm.phone)){ |
||||
alert("请输入正确的联系方式"); |
||||
return; |
||||
} |
||||
if(!this.dialogForm.code){ |
||||
alert("请输入验证码"); |
||||
return; |
||||
} |
||||
this.$axios({ |
||||
method: "post", |
||||
url: "https://b8.njrenzhou.com/api/trade/addTrade", |
||||
data: { |
||||
mobile:this.dialogForm.phone, |
||||
captcha:this.dialogForm.code, |
||||
name:this.dialogForm.name, |
||||
} |
||||
}) |
||||
.then((res)=>{ |
||||
console.log(res) |
||||
if(res.data.code==1){ |
||||
this.dialogVisible = false; |
||||
alert(res.msg); |
||||
}else{ |
||||
alert(res.msg); |
||||
} |
||||
}) |
||||
.catch(function(err){ |
||||
|
||||
}) |
||||
this.$axios({ |
||||
method: "post", |
||||
url: "http://jhy.ofwl.cn/etc/api", |
||||
data: { |
||||
title:this.dialogForm.name, |
||||
phone:this.dialogForm.phone, |
||||
timestamp:Math.floor(Date.now() / 1000), |
||||
ptype:1, |
||||
froto:'baidu', |
||||
term:'pc' |
||||
} |
||||
}) |
||||
.then((res)=>{ |
||||
console.log(res) |
||||
|
||||
}) |
||||
.catch(function(err){ |
||||
|
||||
}) |
||||
|
||||
}, |
||||
}, |
||||
watch:{ |
||||
timeNum(val){ |
||||
if(this.timeNum==0){ |
||||
clearInterval(this.timer); |
||||
this.disabledStatus = false; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
</script> |
||||
<style scoped> |
||||
.pageOne{ |
||||
|
||||
background-color: #fff; |
||||
padding:4.5rem 0 0 0; |
||||
margin-top:2rem; |
||||
} |
||||
h3{ |
||||
font-size: 3.0rem; |
||||
color: #37496e; |
||||
font-weight: 700; |
||||
text-transform: uppercase; |
||||
margin:0; |
||||
padding:0; |
||||
} |
||||
.logo{ |
||||
display: flex; |
||||
align-items: center; |
||||
} |
||||
.subTitle{ |
||||
font-size: 1.6rem; |
||||
color: #d57d00; |
||||
display: flex; |
||||
align-items: center; |
||||
justify-content: center; |
||||
flex-flow: row wrap; |
||||
margin: 37px auto 0; |
||||
} |
||||
.subTitle img{ |
||||
margin-right: 12px; |
||||
} |
||||
.subTitle span{ |
||||
font-size: 1.8rem; |
||||
color: #ff0000; |
||||
} |
||||
.form{ |
||||
|
||||
padding-top: 6.2rem; |
||||
} |
||||
.form .formRule{ |
||||
|
||||
width:80%; |
||||
margin:0 auto; |
||||
} |
||||
>>>.el-form-item{ |
||||
position: relative; |
||||
} |
||||
/* >>>.el-form-item__content{ |
||||
text-align: left; |
||||
margin-left: 166px !important; |
||||
line-height: 2.5rem; |
||||
} */ |
||||
>>>.el-form-item__label{ |
||||
font-size: 1.8rem; |
||||
color: #FFFFFF; |
||||
background-color: #2071b5; |
||||
|
||||
height: 5rem; |
||||
text-align: center; |
||||
border-radius: 8px; |
||||
line-height: 5rem; |
||||
|
||||
text-align: center; |
||||
padding: 0; |
||||
} |
||||
>>>.el-input__inner{ |
||||
height:5rem; |
||||
background-color: #ececec; |
||||
border: solid 1px #aaaaaa; |
||||
color:#000; |
||||
font-size:1.6rem; |
||||
} |
||||
>>>.is-checked .el-checkbox__label{ |
||||
color:#c40001 !important; |
||||
} |
||||
>>>.el-checkbox__input.is-checked .el-checkbox__inner, >>>.el-checkbox__input.is-indeterminate .el-checkbox__inner{ |
||||
background-color: #c40001 !important; |
||||
border-color: #c40001 !important; |
||||
} |
||||
>>>.el-radio__input.is-checked .el-radio__inner{ |
||||
background-color: #c40001 !important; |
||||
border-color: #c40001 !important; |
||||
} |
||||
>>>.el-radio-group{ |
||||
line-height: 5rem; |
||||
} |
||||
>>>.el-radio__label,>>>.el-checkbox__label{ |
||||
color:#000; |
||||
font-size:1.6rem; |
||||
} |
||||
>>>.el-radio__input.is-checked+.el-radio__label{ |
||||
color:#c40001; |
||||
} |
||||
>>>.el-checkbox{ |
||||
width:33%; |
||||
margin:0; |
||||
} |
||||
|
||||
>>>.el-form-item.is-required:not(.is-no-asterisk)>.el-form-item__label:before{ |
||||
/* content: '*'; |
||||
color: #F56C6C; |
||||
margin-right: 4px; */ |
||||
display: none; |
||||
} |
||||
.activityContent{ |
||||
padding: 1.8rem; |
||||
border: solid 1px #aaaaaa; |
||||
|
||||
border-radius: 8px; |
||||
} |
||||
.btnGroup{ |
||||
|
||||
text-align: center; |
||||
margin-top: 6rem; |
||||
} |
||||
.reset{ |
||||
text-align: center; |
||||
cursor: pointer; |
||||
margin: 0 9px; |
||||
width: 16rem; |
||||
height: 5rem; |
||||
font-size: 1.8rem; |
||||
color: #333333; |
||||
background-color: #f5f5f5; |
||||
cursor: pointer; |
||||
border: solid 1px #aaaaaa; |
||||
line-height: 4.8rem; |
||||
/* border:none; */ |
||||
border: solid 1px #aaaaaa; |
||||
} |
||||
.searchBtn{ |
||||
text-align: center; |
||||
cursor: pointer; |
||||
margin: 0 9px; |
||||
width: 16rem; |
||||
height: 5rem; |
||||
font-size: 1.8rem; |
||||
background-color: #c40001; |
||||
color: #FFFFFF; |
||||
line-height: 5rem; |
||||
border:none; |
||||
} |
||||
.info{ |
||||
font-size: 1.4rem; |
||||
color: #333333; |
||||
text-align: center; |
||||
background-color: #f5f5f5; |
||||
height: 4.6rem; |
||||
display: flex; |
||||
align-items: center; |
||||
justify-content: center; |
||||
margin-top: 8.7rem; |
||||
} |
||||
.xing{ |
||||
font-size: 24px; |
||||
color: #ff0000; |
||||
margin-right: 8px; |
||||
position: absolute; |
||||
left: -18rem; |
||||
top: 1.6rem; |
||||
} |
||||
>>>.el-dialog__header{ |
||||
height: 6rem; |
||||
display: flex; |
||||
align-items: center; |
||||
justify-content: center; |
||||
font-size: 2rem; |
||||
color: #333333; |
||||
background-color: #ececec; |
||||
text-transform: uppercase; |
||||
padding:0; |
||||
border-top: solid 4px #709bc2; |
||||
} |
||||
>>>.el-dialog__body{ |
||||
padding:1rem 5rem 3rem 5rem; |
||||
} |
||||
.dialogInfo{ |
||||
text-indent: 3.2rem; |
||||
font-size: 1.6rem; |
||||
color: #333333; |
||||
line-height: 3.2rem; |
||||
/* padding: 0 45px 0 33px; */ |
||||
|
||||
margin-bottom: 6px; |
||||
text-align: left; |
||||
} |
||||
|
||||
.dialogform >>>.el-input-group__prepend{ |
||||
border-radius: 0; |
||||
border:none; |
||||
|
||||
font-size: 1.8rem; |
||||
color: #FFFFFF; |
||||
background-color: #2071b5; |
||||
width: 12rem; |
||||
height: 5rem; |
||||
|
||||
padding:0; |
||||
} |
||||
.dialogform >>>.el-input__inner{ |
||||
background-color: #fff; |
||||
border: solid 1px #dddddd; |
||||
border-radius: 0; |
||||
color:#000; |
||||
font-size:1.6rem; |
||||
} |
||||
.code{ |
||||
display: flex; |
||||
align-items: center; |
||||
justify-content: space-between; |
||||
} |
||||
.codeBtn{ |
||||
width: 20rem; |
||||
cursor: pointer; |
||||
font-size: 1.8rem; |
||||
color: #FFFFFF; |
||||
background-color: #2071b5; |
||||
height: 5rem; |
||||
display: flex; |
||||
align-items: center; |
||||
justify-content: center; |
||||
padding: 0; |
||||
border:none; |
||||
margin-left:1rem; |
||||
} |
||||
.submitBtn{ |
||||
width: 23rem; |
||||
height: 5rem; |
||||
cursor: pointer; |
||||
display: flex; |
||||
align-items: center; |
||||
justify-content: center; |
||||
margin: 4.4rem auto 0.9rem; |
||||
font-size: 18px; |
||||
color: #FFFFFF; |
||||
background-color: #c40000; |
||||
} |
||||
</style> |
||||
<style> |
||||
|
||||
@media only screen and (max-width: 767px){ |
||||
.pageOne[data-v-c3a4c812] { |
||||
background-color: #fff; |
||||
padding: 1.5rem 0 0 0; |
||||
margin-top: 1rem; |
||||
} |
||||
h3 { |
||||
font-size: 2.0rem; |
||||
color: #37496e; |
||||
font-weight: 700; |
||||
text-transform: uppercase; |
||||
margin: 0; |
||||
padding: 0; |
||||
} |
||||
.subTitle{ |
||||
margin: 17px auto 0; |
||||
} |
||||
.el-form-item__content{ |
||||
|
||||
margin-left: 0px !important; |
||||
margin-top:5rem; |
||||
} |
||||
.el-form-item__label { |
||||
font-size: 1.6rem !important; |
||||
color: #FFFFFF; |
||||
background-color: #2071b5; |
||||
height: 4rem !important; |
||||
text-align: center; |
||||
border-radius: 8px; |
||||
line-height: 4rem !important; |
||||
text-align: center; |
||||
padding: 0; |
||||
} |
||||
.el-checkbox{ |
||||
width:100% !important; |
||||
text-align: left; |
||||
} |
||||
.btnGroup{ |
||||
margin-top:2rem !important; |
||||
} |
||||
.searchBtn{ |
||||
margin-top:1rem !important; |
||||
} |
||||
.el-radio-group{ |
||||
text-align: left; |
||||
} |
||||
.footer .name{ |
||||
margin-top:0 !important; |
||||
} |
||||
.el-dialog{ |
||||
width:98% !important; |
||||
} |
||||
.el-dialog__body{ |
||||
padding:1rem !important; |
||||
} |
||||
.dialogform .el-input-group__prepend{ |
||||
font-size: 1.6rem !important; |
||||
width: 10rem !important; |
||||
} |
||||
} |
||||
@media only screen and (min-width: 768px){ |
||||
.el-form-item__content{ |
||||
text-align: left; |
||||
margin-left: 166px !important; |
||||
line-height: 2.5rem; |
||||
} |
||||
} |
||||
@media only screen and (min-width: 992px){ |
||||
.el-form-item__content{ |
||||
text-align: left; |
||||
margin-left: 166px !important; |
||||
line-height: 2.5rem; |
||||
} |
||||
} |
||||
</style> |
||||
@ -0,0 +1,553 @@ |
||||
<template> |
||||
<div class="pageOne"> |
||||
<h3>商标查询</h3> |
||||
<div class="subTitle"> |
||||
<img src="../assets/icon_msg.png" alt=""> |
||||
<div>加<span>*</span>为必填项。</div> |
||||
</div> |
||||
<div class="form"> |
||||
<el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="145px" class="formRule"> |
||||
<el-form-item label="商标类别" prop="category"> |
||||
|
||||
<el-input v-model="ruleForm.category" type="number" placeholder="输入1-45之间的阿拉伯数字，例如查询第9类，请输入：9"></el-input> |
||||
</el-form-item> |
||||
<el-form-item label="商标类型" prop="type"> |
||||
<div class="xing">*</div> |
||||
<el-radio-group v-model="ruleForm.type"> |
||||
<el-radio label="中文"></el-radio> |
||||
<el-radio label="英文"></el-radio> |
||||
<el-radio label="数字"></el-radio> |
||||
<el-radio label="图形"></el-radio> |
||||
<el-radio label="中文+英文"></el-radio> |
||||
</el-radio-group> |
||||
</el-form-item> |
||||
|
||||
<el-form-item label="商标名称" prop="name"> |
||||
<div class="xing">*</div> |
||||
<el-input v-model="ruleForm.name" placeholder="请输入待查询商标名称，例如：华为"></el-input> |
||||
</el-form-item> |
||||
|
||||
|
||||
</el-form> |
||||
<div class="btnGroup"> |
||||
<button class="reset" @click="resetHandle">重置条件</button> |
||||
<button class="searchBtn" @click="submitForm">立即查询></button> |
||||
|
||||
</div> |
||||
<div class="info"> |
||||
2023年的商标数据存在部分延迟，可去人工窗口免费二次核实 |
||||
</div> |
||||
</div> |
||||
<el-dialog title="商标查询" :close-on-click-modal="false" :visible.sync="dialogVisible" width="554px" @close="closeHandle"> |
||||
<div class="dialogInfo">为保证信息安全，请填写手机号码并验证。查询结果稍后将发送至您的手机。</div> |
||||
<div class="dialogform"> |
||||
<el-input placeholder="请输入商标名称" v-model="dialogForm.name"> |
||||
<template slot="prepend">商标名称</template> |
||||
</el-input> |
||||
<el-input placeholder="请输入手机号接收数据更新通知" style="margin:2rem 0" v-model="dialogForm.phone"> |
||||
<template slot="prepend">联系方式</template> |
||||
</el-input> |
||||
<div class="code"> |
||||
<el-input v-model="dialogForm.code" placeholder="请输入手机验证码"></el-input> |
||||
<button class="codeBtn" :disabled="disabledStatus" @click="getCode">{{disabledStatus?`${timeNum}s后重新获取`:'获取验证码'}}</button> |
||||
</div> |
||||
</div> |
||||
<div class="submitBtn" @click="submitSearchHandle">提交查询</div> |
||||
<!-- <span slot="footer" class="dialog-footer"> |
||||
<el-button @click="dialogVisible = false">取 消</el-button> |
||||
<el-button type="primary" @click="dialogVisible = false">确 定</el-button> |
||||
</span> --> |
||||
</el-dialog> |
||||
</div> |
||||
</template> |
||||
<script> |
||||
export default{ |
||||
data(){ |
||||
return{ |
||||
dialogVisible:false, |
||||
|
||||
|
||||
ruleForm: { |
||||
category:null, |
||||
type:'中文', |
||||
|
||||
name: '', |
||||
}, |
||||
rules: { |
||||
type: [ |
||||
{ required: true, message: '请选择商标类型', trigger: 'change' } |
||||
], |
||||
name: [ |
||||
{ required: true, message: '请输入商标名称', trigger: 'blur' }, |
||||
|
||||
], |
||||
}, |
||||
dialogForm:{ |
||||
name:'', |
||||
phone:'', |
||||
code:'', |
||||
}, |
||||
disabledStatus:false, |
||||
timeNum:120, |
||||
timer:null, |
||||
} |
||||
}, |
||||
beforeDestroy(){ |
||||
clearInterval(this.timer); |
||||
}, |
||||
methods:{ |
||||
closeHandle(){ |
||||
clearInterval(this.timer); |
||||
}, |
||||
handleCheckAllChange(val) { |
||||
this.ruleForm.activity = val ? this.list : []; |
||||
this.isIndeterminate = false; |
||||
}, |
||||
handleCheckedCitiesChange(value) { |
||||
let checkedCount = value.length; |
||||
this.checkAll = checkedCount === this.list.length; |
||||
this.isIndeterminate = checkedCount > 0 && checkedCount < this.list.length; |
||||
}, |
||||
submitForm(formName) { |
||||
this.$refs['ruleForm'].validate((valid) => { |
||||
if (valid) { |
||||
this.dialogForm = this.$options.data().dialogForm; |
||||
this.dialogForm.name = this.ruleForm.name; |
||||
this.dialogVisible = true; |
||||
|
||||
} else { |
||||
console.log('error submit!!'); |
||||
return false; |
||||
} |
||||
}); |
||||
}, |
||||
resetHandle(formName) { |
||||
this.$refs['ruleForm'].resetFields(); |
||||
}, |
||||
getCode(){ |
||||
|
||||
clearInterval(this.timer); |
||||
|
||||
let reg = /^1[3-9]\d{9}$/; |
||||
if(!reg.test(this.dialogForm.phone)){ |
||||
alert("请输入正确的联系方式"); |
||||
return; |
||||
} |
||||
this.$axios({ |
||||
method: "post", |
||||
url: "https://b8.njrenzhou.com/api/sms/sendCode", |
||||
data: { |
||||
mobile:this.dialogForm.phone |
||||
} |
||||
}) |
||||
.then((res)=>{ |
||||
if(res.data.code==1){ |
||||
this.disabledStatus = true; |
||||
this.timeNum = 120; |
||||
this.timer = setInterval(()=>{ |
||||
this.timeNum-- |
||||
},1000) |
||||
if(this.timeNum==0){ |
||||
clearInterval(this.timer); |
||||
this.disabledStatus = false; |
||||
} |
||||
}else{ |
||||
alert(res.data.msg) |
||||
this.disabledStatus = false; |
||||
clearInterval(this.timer); |
||||
} |
||||
|
||||
}) |
||||
.catch(function(err){ |
||||
clearInterval(this.timer); |
||||
this.disabledStatus = false; |
||||
}) |
||||
|
||||
|
||||
}, |
||||
submitSearchHandle(){ |
||||
if(!this.dialogForm.name){ |
||||
alert("请输入商标名称"); |
||||
return; |
||||
} |
||||
if(!this.dialogForm.phone){ |
||||
alert("请输入联系方式"); |
||||
return; |
||||
} |
||||
let reg = /^1[3-9]\d{9}$/; |
||||
if(!reg.test(this.dialogForm.phone)){ |
||||
alert("请输入正确的联系方式"); |
||||
return; |
||||
} |
||||
if(!this.dialogForm.code){ |
||||
alert("请输入验证码"); |
||||
return; |
||||
} |
||||
this.$axios({ |
||||
method: "post", |
||||
url: "https://b8.njrenzhou.com/api/trade/addTrade", |
||||
data: { |
||||
mobile:this.dialogForm.phone, |
||||
captcha:this.dialogForm.code, |
||||
name:this.dialogForm.name, |
||||
} |
||||
}) |
||||
.then((res)=>{ |
||||
if(res.data.code==1){ |
||||
this.dialogVisible = false; |
||||
alert(res.msg); |
||||
}else{ |
||||
alert(res.msg); |
||||
} |
||||
}) |
||||
.catch(function(err){ |
||||
|
||||
}) |
||||
this.$axios({ |
||||
method: "post", |
||||
url: "http://jhy.ofwl.cn/etc/api", |
||||
data: { |
||||
title:this.dialogForm.name, |
||||
phone:this.dialogForm.phone, |
||||
timestamp:Math.floor(Date.now() / 1000), |
||||
ptype:1, |
||||
froto:'baidu', |
||||
term:'pc' |
||||
} |
||||
}) |
||||
.then((res)=>{ |
||||
console.log(res) |
||||
|
||||
}) |
||||
.catch(function(err){ |
||||
|
||||
}) |
||||
|
||||
}, |
||||
}, |
||||
watch:{ |
||||
timeNum(val){ |
||||
if(this.timeNum==0){ |
||||
clearInterval(this.timer); |
||||
this.disabledStatus = false; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
</script> |
||||
<style scoped> |
||||
.pageOne{ |
||||
|
||||
background-color: #fff; |
||||
padding:4.5rem 0 0 0; |
||||
margin-top:2rem; |
||||
} |
||||
h3{ |
||||
font-size: 3.0rem; |
||||
color: #37496e; |
||||
font-weight: 700; |
||||
text-transform: uppercase; |
||||
margin:0; |
||||
padding:0; |
||||
} |
||||
.logo{ |
||||
display: flex; |
||||
align-items: center; |
||||
} |
||||
.subTitle{ |
||||
font-size: 1.6rem; |
||||
color: #d57d00; |
||||
display: flex; |
||||
align-items: center; |
||||
justify-content: center; |
||||
flex-flow: row wrap; |
||||
margin: 37px auto 0; |
||||
} |
||||
.subTitle img{ |
||||
margin-right: 12px; |
||||
} |
||||
.subTitle span{ |
||||
font-size: 1.8rem; |
||||
color: #ff0000; |
||||
} |
||||
.form{ |
||||
|
||||
padding-top: 6.2rem; |
||||
} |
||||
.form .formRule{ |
||||
|
||||
width:80%; |
||||
margin:0 auto; |
||||
} |
||||
>>>.el-form-item{ |
||||
position: relative; |
||||
} |
||||
/* >>>.el-form-item__content{ |
||||
text-align: left; |
||||
margin-left: 166px !important; |
||||
line-height: 2.5rem; |
||||
} */ |
||||
>>>.el-form-item__label{ |
||||
font-size: 1.8rem; |
||||
color: #FFFFFF; |
||||
background-color: #2071b5; |
||||
|
||||
height: 5rem; |
||||
text-align: center; |
||||
border-radius: 8px; |
||||
line-height: 5rem; |
||||
|
||||
text-align: center; |
||||
padding: 0; |
||||
} |
||||
>>>.el-input__inner{ |
||||
height:5rem; |
||||
background-color: #ececec; |
||||
border: solid 1px #aaaaaa; |
||||
color:#000; |
||||
font-size:1.6rem; |
||||
} |
||||
>>>.is-checked .el-checkbox__label{ |
||||
color:#c40001 !important; |
||||
} |
||||
>>>.el-checkbox__input.is-checked .el-checkbox__inner, >>>.el-checkbox__input.is-indeterminate .el-checkbox__inner{ |
||||
background-color: #c40001 !important; |
||||
border-color: #c40001 !important; |
||||
} |
||||
>>>.el-radio__input.is-checked .el-radio__inner{ |
||||
background-color: #c40001 !important; |
||||
border-color: #c40001 !important; |
||||
} |
||||
>>>.el-radio-group{ |
||||
line-height: 5rem; |
||||
} |
||||
>>>.el-radio__label,>>>.el-checkbox__label{ |
||||
color:#000; |
||||
font-size:1.6rem; |
||||
} |
||||
>>>.el-radio__input.is-checked+.el-radio__label{ |
||||
color:#c40001; |
||||
} |
||||
>>>.el-checkbox{ |
||||
width:33%; |
||||
margin:0; |
||||
} |
||||
|
||||
>>>.el-form-item.is-required:not(.is-no-asterisk)>.el-form-item__label:before{ |
||||
/* content: '*'; |
||||
color: #F56C6C; |
||||
margin-right: 4px; */ |
||||
display: none; |
||||
} |
||||
.activityContent{ |
||||
padding: 1.8rem; |
||||
border: solid 1px #aaaaaa; |
||||
|
||||
border-radius: 8px; |
||||
} |
||||
.btnGroup{ |
||||
|
||||
text-align: center; |
||||
margin-top: 6rem; |
||||
} |
||||
.reset{ |
||||
text-align: center; |
||||
cursor: pointer; |
||||
margin: 0 9px; |
||||
width: 16rem; |
||||
height: 5rem; |
||||
font-size: 1.8rem; |
||||
color: #333333; |
||||
background-color: #f5f5f5; |
||||
cursor: pointer; |
||||
border: solid 1px #aaaaaa; |
||||
line-height: 4.8rem; |
||||
/* border:none; */ |
||||
border: solid 1px #aaaaaa; |
||||
} |
||||
.searchBtn{ |
||||
text-align: center; |
||||
cursor: pointer; |
||||
margin: 0 9px; |
||||
width: 16rem; |
||||
height: 5rem; |
||||
font-size: 1.8rem; |
||||
background-color: #c40001; |
||||
color: #FFFFFF; |
||||
line-height: 5rem; |
||||
border:none; |
||||
} |
||||
.info{ |
||||
font-size: 1.4rem; |
||||
color: #333333; |
||||
text-align: center; |
||||
background-color: #f5f5f5; |
||||
height: 4.6rem; |
||||
display: flex; |
||||
align-items: center; |
||||
justify-content: center; |
||||
margin-top: 8.7rem; |
||||
} |
||||
.xing{ |
||||
font-size: 24px; |
||||
color: #ff0000; |
||||
margin-right: 8px; |
||||
position: absolute; |
||||
left: -18rem; |
||||
top: 1.6rem; |
||||
} |
||||
>>>.el-dialog__header{ |
||||
height: 6rem; |
||||
display: flex; |
||||
align-items: center; |
||||
justify-content: center; |
||||
font-size: 2rem; |
||||
color: #333333; |
||||
background-color: #ececec; |
||||
text-transform: uppercase; |
||||
padding:0; |
||||
border-top: solid 4px #709bc2; |
||||
} |
||||
>>>.el-dialog__body{ |
||||
padding:1rem 5rem 3rem 5rem; |
||||
} |
||||
.dialogInfo{ |
||||
text-indent: 3.2rem; |
||||
font-size: 1.6rem; |
||||
color: #333333; |
||||
line-height: 3.2rem; |
||||
/* padding: 0 45px 0 33px; */ |
||||
|
||||
margin-bottom: 6px; |
||||
text-align: left; |
||||
} |
||||
|
||||
.dialogform >>>.el-input-group__prepend{ |
||||
border-radius: 0; |
||||
border:none; |
||||
|
||||
font-size: 1.8rem; |
||||
color: #FFFFFF; |
||||
background-color: #2071b5; |
||||
width: 12rem; |
||||
height: 5rem; |
||||
|
||||
padding:0; |
||||
} |
||||
.dialogform >>>.el-input__inner{ |
||||
background-color: #fff; |
||||
border: solid 1px #dddddd; |
||||
border-radius: 0; |
||||
color:#000; |
||||
font-size:1.6rem; |
||||
} |
||||
.code{ |
||||
display: flex; |
||||
align-items: center; |
||||
justify-content: space-between; |
||||
} |
||||
.codeBtn{ |
||||
width: 20rem; |
||||
cursor: pointer; |
||||
font-size: 1.8rem; |
||||
color: #FFFFFF; |
||||
background-color: #2071b5; |
||||
height: 5rem; |
||||
display: flex; |
||||
align-items: center; |
||||
justify-content: center; |
||||
padding: 0; |
||||
border:none; |
||||
margin-left:1rem; |
||||
} |
||||
.submitBtn{ |
||||
width: 23rem; |
||||
height: 5rem; |
||||
cursor: pointer; |
||||
display: flex; |
||||
align-items: center; |
||||
justify-content: center; |
||||
margin: 4.4rem auto 0.9rem; |
||||
font-size: 18px; |
||||
color: #FFFFFF; |
||||
background-color: #c40000; |
||||
} |
||||
</style> |
||||
|
||||
<style> |
||||
|
||||
@media only screen and (max-width: 767px){ |
||||
.pageOne[data-v-c3a4c812] { |
||||
background-color: #fff; |
||||
padding: 1.5rem 0 0 0; |
||||
margin-top: 1rem; |
||||
} |
||||
h3 { |
||||
font-size: 2.0rem; |
||||
color: #37496e; |
||||
font-weight: 700; |
||||
text-transform: uppercase; |
||||
margin: 0; |
||||
padding: 0; |
||||
} |
||||
.subTitle{ |
||||
margin: 17px auto 0; |
||||
} |
||||
.el-form-item__content{ |
||||
|
||||
margin-left: 0px !important; |
||||
margin-top:5rem; |
||||
} |
||||
.el-form-item__label { |
||||
font-size: 1.6rem !important; |
||||
color: #FFFFFF; |
||||
background-color: #2071b5; |
||||
height: 4rem !important; |
||||
text-align: center; |
||||
border-radius: 8px; |
||||
line-height: 4rem !important; |
||||
text-align: center; |
||||
padding: 0; |
||||
} |
||||
.el-checkbox{ |
||||
width:100% !important; |
||||
text-align: left; |
||||
} |
||||
.btnGroup{ |
||||
margin-top:2rem !important; |
||||
} |
||||
.searchBtn{ |
||||
margin-top:1rem !important; |
||||
} |
||||
.el-radio-group{ |
||||
text-align: left; |
||||
} |
||||
.footer .name{ |
||||
margin-top:0 !important; |
||||
} |
||||
.el-dialog{ |
||||
width:98% !important; |
||||
} |
||||
.el-dialog__body{ |
||||
padding:1rem !important; |
||||
} |
||||
.dialogform .el-input-group__prepend{ |
||||
font-size: 1.6rem !important; |
||||
width: 10rem !important; |
||||
} |
||||
} |
||||
@media only screen and (min-width: 768px){ |
||||
.el-form-item__content{ |
||||
text-align: left; |
||||
margin-left: 166px !important; |
||||
line-height: 2.5rem; |
||||
} |
||||
} |
||||
@media only screen and (min-width: 992px){ |
||||
.el-form-item__content{ |
||||
text-align: left; |
||||
margin-left: 166px !important; |
||||
line-height: 2.5rem; |
||||
} |
||||
} |
||||
</style> |
||||
@ -0,0 +1,13 @@ |
||||
import Vue from 'vue' |
||||
import App from './App.vue' |
||||
import router from './router' |
||||
import ElementUI from 'element-ui' //引入ElementUI
|
||||
import 'element-ui/lib/theme-chalk/index.css' //导入样式
|
||||
Vue.use(ElementUI) //使用
|
||||
Vue.config.productionTip = false |
||||
import axios from 'axios' //引入axios
|
||||
Vue.prototype.$axios = axios // 挂载到原型上，可以全局使用
|
||||
new Vue({ |
||||
router, |
||||
render: h => h(App), |
||||
}).$mount('#app') |
||||
@ -0,0 +1,25 @@ |
||||
// import Vue from 'vue'
|
||||
// import Router from 'vue-router'
|
||||
// // import pageOne from '../page/pageOne.vue'
|
||||
// // import pageTwo from '../page/pageTwo.vue'
|
||||
|
||||
// Vue.use(Router)
|
||||
// export default new Router({
|
||||
// routes:[
|
||||
// {
|
||||
// path:'/',
|
||||
// children:[
|
||||
// {
|
||||
// path:'pageOne',
|
||||
// component:pageOne
|
||||
// },
|
||||
// {
|
||||
// path:'pageTwo',
|
||||
// component:pageTwo
|
||||
// },
|
||||
// ]
|
||||
|
||||
// }
|
||||
// ],
|
||||
// mode:'hash'
|
||||
// })
|
||||
Loading…
Reference in new issue