Skip to content

G
gs1
Commit bd1808ab by Lyan
Options

系统成员首页切图以及厂商校验校准页面切图

parent 7a5a760a
Showing with 1911 additions and 23 deletions
src/router/index.js
......@@ -854,6 +854,7 @@ const routes = [
name: "MyManage",
component: () => import("@/views/MyManage/index"),
children: [
// 未注册用户
{
path: "/MyManage/UnVerify/index",
name: "UnVerify",
......@@ -862,6 +863,55 @@ const routes = [
},
component: () => import("@/views/MyManage/UnVerify/index.vue"),
},
{
path: "/MyManage/UnVerify/vendor",
name: "vendor",
meta: {
name: "厂商实名认证",
},
component: () => import("@/views/MyManage/UnVerify/vendor.vue"),
},
{
path: "/MyManage/UnVerify/calibration",
name: "calibration",
meta: {
name: "检测校验申请",
},
component: () => import("@/views/MyManage/UnVerify/calibration.vue"),
},
{
path: "/MyManage/UnVerify/personalInfo",
name: "personalInfo",
meta: {
name: "个人资料",
},
component: () => import("@/views/MyManage/UnVerify/personalInfo.vue"),
},
{
path: "/MyManage/UnVerify/changePass",
name: "changePass",
meta: {
name: "修改登录密码",
},
component: () => import("@/views/MyManage/UnVerify/changePass.vue"),
},
{
path: "/MyManage/UnVerify/changePhone",
name: "changePhone",
meta: {
name: "修改手机号码",
},
component: () => import("@/views/MyManage/UnVerify/changePhone.vue"),
},
// 系统成员
{
path: "/MyManage/SystemMember/index",
name: "SystemMember",
meta: {
name: "首页",
},
component: () => import("@/views/MyManage/SystemMember/index.vue"),
},
// 管理员 START
{
path: "/MyManage/admin/check",
......
src/views/MyManage/SystemMember/index.vue
<template>
<div class="container2">
<div class="header">
<p>网站最新推出<a href="#">在线注册</a> &nbsp;&nbsp;<a href="#">在线续展</a>&nbsp;&nbsp;<a href="#"> 产品信息通报</a>等业务</p>
</div>
<div class="content">
<div class="title">业务提醒专区</div>
<div class="content-list">
<ul>
<li>
<p class="content-title">商品条码相关业务</p>
<p><i class="bi bi-check-circle-fill"></i>您已成为中国物品编码中心系统成员！</p>
<p style="padding-left:24px">您可以——前往<a href="#">网上业务大厅</a> 办理商品条码续展，变更，子公司备案等业务！</p>
<p style="padding-left:24px">您可以——前往<a href="#">中国商品信息服务平台 </a> 办理以下业务：</p>
<div class="p-list">
<p style="padding-left:24px">产品信息通报——一键获取商品条码，无需自行编制；满足信息通报的法规要求，建立条码档案。</p>
<p style="padding-left:24px">微信共享——共享产品信息至微信，实现对外扫码查询。</p>
<p style="padding-left:24px">易码追溯——进行产品质量安全追溯，提升产品信誉度。</p>
<p style="padding-left:24px">条码商桥——建立标准化产品数字档案，支持深度供应链应用。</p>
<p style="padding-left:24px">GS1全球注册平台——发布产品至GS1全球数据平台，促进跨境贸易。</p>
<p style="padding-left:24px">条码微站——深度应用二维码，连接您与消费者。</p>
<p style="padding-left:24px">条码胶片——自动生成符合国家标准的条码图片，可快速应用到产品包装。</p>
</div>
</li>
<!-- 未完成企业信息 -->
<li>
<p class="content-title">检测校准申请（办理“条码印制品检测”、“条码检测仪校准”等业务需先完成此申请）</p>
<p><i class="bi bi-check-circle-fill"></i>您已成为中国物品编码中心系统成员，请点击<a href="#">导入企业信息</a> 后，申请办理以下业务！</p>
<p>1、条码印制品检测</p>
<p class="list-cnt">对商品条码、商品二维码、GS1通用规范（GS1 General Specifications）、医疗UDI、汽车零部件标识、追溯码、服装条码、名片二维码、物流编码等提供检验检测服务，出具检验检测报告。</p>
<p>2、条码检测仪校准</p>
<p class="list-cnt">对条码检测仪的最高反射率、最低反射率、可译码度、缺陷度、轴向不一致性、网格不一致性、反差一致性等测量参数进行校准，出具校准证书。</p>
</li>
<!-- 已完成企业信息 -->
<li>
<p class="content-title">检测校准申请（办理“条码印制品检测”、“条码检测仪校准”等业务需先完成此申请）</p>
<p><i class="bi bi-check-circle-fill"></i>您已成为中国物品编码中心检验检测/校准客户！</p>
<p style="padding-left:24px">您可以——办理条码印制品检测</p>
<p style="padding-left:24px">您可以——办理条码检测仪校准</p>
<p style="padding-left:24px">若想申请办理上述业务，请您联系：</p>
<p style="padding-left:24px">王工<i class="bi bi-telephone-fill color-grey"></i>010-84295493 <i class="bi bi-envelope-fill color-grey"></i>wanghy@ancc.org.cn <i class="qe color-grey"></i>2308350380</p>
<p style="padding-left:24px">胡工<i class="bi bi-telephone-fill color-grey"></i>010-84295499 <i class="bi bi-envelope-fill color-grey"></i>hum@ancc.org.cn&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<i class="qe color-grey"></i>1246978728</p>
</li>
</ul>
</div>
</div>
</div>
</template>
......@@ -8,6 +57,119 @@ export default {
}
</script>
<style scoped>
<style lang="scss" scoped>
.container2{
.header{
min-height: 50px;
background: #FEF1EC;
text-align: center;
color: #F26335;
font-size: 16px;
p{
margin: 0;
line-height: 50px;
font-weight: 500;
a{
text-decoration: none;
color: #00799E;
}
}
}
.content{
@include module-box;
margin-top: 14px;
.title{
color: #F26335;
font-size: 16px;
padding: 20px 40px;
border: 1px solid #F3F3F3;
}
.content-list{
font-size: 14px;
line-height: 20px;
ul{
li{
margin-top: 19px;
border-bottom: 1px dashed #B4CDEB;
padding-bottom: 6px;
>p:first-child{
color: #414345;
font-weight:600;
}
>p:first-child::before{
content: "●";
color: #F26335;
margin-right: 5px;
}
p{
margin-bottom: 14px;
i{
color: #50C96B;
margin-right: 10px;
}
.color-grey{
color: #666666;
margin:0 5px 0 20px;
}
.qe{
display: inline-block;
width: 14px;
height: 14px;
background: url("../../../assets/image/mymanage/qe.png") no-repeat;
background-size: cover;
}
}
.list-cnt{
font-size: 13px;
color: #666666
}
.list-img{
margin-top: 31px;
text-align: center;
img{
width: 46px;
height: 46px;
margin-bottom: 16px;
}
}
.p-list{
p{
font-size: 13px;
line-height: 18px;
color: #666666;
}
p::before{
content: "*";
color: #F26335;
}
}
}
li:last-child{
border:none;
margin-bottom: 40px;
}
}
a{
text-decoration: none;
color: #00799E;
margin: 0 5px;
}
}
}
}
</style>
<style lang="scss" scoped>
.content{
@media screen and (max-width: 992px) {
ul {
padding: 0 10px;
}
}
}
</style>
\ No newline at end of file
src/views/MyManage/UnVerify/calibration.vue 0 → 100644
<template>
<div class="container2">
<div class="header">
<p><i class="bi bi-exclamation-triangle-fill"></i>办理“条码印制品检测、条码检测仪校准”等业务需先完成此申请</p>
</div>
<div class="content">
<div class="title">检测校准申请——填写实名信息 <a href="/MyManage/UnVerify">返回我的首页</a></div>
<div class="content-list">
<p >
<span>1.填写实名信息</span>
<span>2.提交书面材料</span>
<span>3.审核状态</span>
</p>
</div>
<div class="content-from">
<el-form ref='ruleForm'
label-position='right'
label-width='160px'
:model='form'>
<p class="content-from-title">企业信息填报</p>
<el-form-item label='企业名称(中文)：'
prop='chineseName'
:rules="[{
required: true,
message: '不能为空',
}]">
<el-input v-model='form.chineseName' autocomplete='off' placeholder="请输入企业中文名称"></el-input>
</el-form-item>
<el-form-item label='企业名称(英文)：'
prop='englishName'
>
<el-input v-model='form.englishName' autocomplete='off' placeholder="请输入企业英文名称"></el-input>
</el-form-item>
<el-form-item label='注册地址：'
prop='registeredAddress'
:rules="[{
required: true,
message: '不能为空',
}]"
>
<el-input placeholder="请输入注册地址" v-model="form.registeredAddress" class="input-with-select">
<el-select v-model="form.city" slot="prepend" placeholder="请选择" class="smallselect">
<el-option label="黑龙江" value="1" ></el-option>
</el-select>
</el-input>
</el-form-item>
<el-form-item label='注册地址(英文)：'
prop='englishRegisterAddr'
>
<el-input v-model='form.englishRegisterAddr' autocomplete='off' placeholder="请输入英文注册地址"></el-input>
</el-form-item>
<el-form-item label='注册地址邮政编码：'
prop='registerAddrCode'
:rules="[{
required: true,
message: '不能为空',
}]">
<el-input v-model='form.registerAddrCode' autocomplete='off' placeholder="请输入注册地址邮政编码"></el-input>
</el-form-item>
<el-form-item label='办公地址：'
prop='officeAddr'
:rules="[{
required: true,
message: '不能为空',
}]">
<el-input v-model='form.officeAddr' autocomplete='off' placeholder="请输入办公地址"></el-input>
</el-form-item>
<el-form-item label='办公地址(英文)：'
prop='englishOfficeAddr'
>
<el-input v-model='form.englishOfficeAddr' autocomplete='off' placeholder="请输入英文办公地址"></el-input>
</el-form-item>
<p class="content-from-title">行政区域信息填报</p>
<el-form-item label='统一社会信用代码：'
prop='creditCode'
:rules="[{
required: true,
message: '不能为空',
}]">
<el-input v-model='form.creditCode' autocomplete='off' placeholder="请输入统一社会信用代码"></el-input>
</el-form-item>
<el-form-item label='注册资金(万元)：'
prop='registeredCapital'
:rules="[{
required: true,
message: '不能为空',
}]">
<el-input v-model='form.registeredCapital' autocomplete='off' placeholder="请输入注册资金(万元)"></el-input>
</el-form-item>
<el-form-item label='货币种类：'
prop='currency'
:rules="[{
required: true,
message: '不能为空',
}]">
<el-select v-model="form.currency" placeholder="请选择货币种类" >
<el-option label="" value="1" ></el-option>
</el-select>
</el-form-item>
<el-form-item label='企业类别：'
prop='enterpriseCategory'
:rules="[{
required: true,
message: '不能为空',
}]">
<el-select v-model="form.enterpriseCategory" placeholder="请选择企业类别" >
<el-option label="" value="1" ></el-option>
</el-select>
</el-form-item>
<el-form-item label='经济类型代码：'
prop='economicTypeCode'
:rules="[{
required: true,
message: '不能为空',
}]">
<el-select v-model="form.economicTypeCode" placeholder="请选择经济类型代码" >
<el-option label="" value="1" ></el-option>
</el-select>
</el-form-item>
<el-form-item label='国民经济行业分类代码：'
prop='nationalEconomyCode'
class="moreLong"
:rules="[{
required: true,
message: '不能为空',
}]">
<el-select v-model="form.branch" placeholder="请选择国民经济行业分类代码" >
<el-option label="" value="1" ></el-option>
</el-select>
</el-form-item>
<p class="content-from-title">法定人信息填报</p>
<el-form-item label='法定代表人：'
prop='legalRepresentative'
:rules="[{
required: true,
message: '不能为空',
}]">
<el-input v-model='form.legalRepresentative' autocomplete='off' placeholder="请输入法定代表人"></el-input>
</el-form-item>
<el-form-item label='法定代表人电话：'
prop='legalRepresentativeTel'
>
<el-input v-model='form.legalRepresentativeTel' autocomplete='off' placeholder="请输入法定代表人电话"></el-input>
</el-form-item>
<el-form-item label='上传已年检企业营业执照扫描件'
prop='uploadImg'
class="moreLong"
:rules="[{
required: true,
message: '不能为空',
}]">
<el-input v-model='form.uploadImg' autocomplete='off' type="file" style="display:none"></el-input>
<el-button type="primary" style="width: 110px">上传</el-button>
</el-form-item>
<p class="content-from-title">经办人信息填报</p>
<el-form-item label='经办人姓名：'
prop='name'
:rules="[{
required: true,
message: '不能为空',
}]">
<el-input v-model='form.name' autocomplete='off' placeholder="请输入经办人姓名"></el-input>
</el-form-item>
<el-form-item label='电话：'
prop='tel'
:rules="[{
required: true,
message: '不能为空',
}]">
<el-input v-model='form.tel' autocomplete='off' placeholder="请输入电话"></el-input>
</el-form-item>
<el-form-item label='手机：'
prop='mobile'
:rules="[{
required: true,
message: '不能为空',
},
{ validator:checkMobileReg },
{ validator:checkMobile, trigger:'blur' },]">
<el-input v-model='form.mobile' autocomplete='off' placeholder="请输入手机"></el-input>
</el-form-item>
<el-form-item label='传真：'
prop='fax'
:rules="[{
required: true,
message: '不能为空',
}]">
<el-input v-model='form.email' autocomplete='off' placeholder="请输入传真"></el-input>
</el-form-item>
<el-form-item label='E-mail：'
prop='email'
:rules="[{
required: true,
message: '不能为空',
},
{ type: 'email',
message: '请输入正确的邮箱地址',
trigger: ['blur', 'change']
}]">
<el-input v-model='form.email' autocomplete='off' placeholder="请输入E-mail"></el-input>
</el-form-item>
<p class="content-from-title">办理业务</p>
<el-form-item label='办理业务：'
prop='business'
:rules="[{
required: true,
message: '不能为空',
}]">
<el-select v-model="form.business" placeholder="请选择办理业务" >
<el-option label="" value="1" ></el-option>
</el-select>
</el-form-item>
</el-form>
</div>
<div class="btn-div">
<el-button type="primary" @click="register" style="width: 110px">保 存</el-button>
<el-button style="width: 110px">取 消</el-button>
</div>
</div>
</div>
</template>
<script>
export default {
name: "index",
data() {
return {
hasSent: false,
timer: null,
time: 60,
form: {
chineseName:'',
englishName:'',
registeredAddress:'',
city:'1',
englishRegisterAddr:'',
registerAddrCode:'',
officeAddr:'',
englishOfficeAddr:'',
creditCode:'',
registeredCapital:'',
currency:'',
enterpriseCategory:'',
economicTypeCode:'',
nationalEconomyCode:'',
legalRepresentative:'',
legalRepresentativeTel:'',
name:'',
tel:'',
mobile:'',
fax:'',
email:'',
business:''
},
mobilePattern: /^((13[0-9])|(15[^4])|(18[0-9])|(17[0-8])|(147))\d{8}$/,
}
},
methods: {
register() {
},
checkMobileReg(rule, value, callback) {
if (value !== '') {
if (this.mobilePattern.test(value)) {
callback();
} else {
callback(new Error('手机号码格式不正确'));
}
}
},
checkMobile() {
console.log('checkMobile');
return new Promise((resolve) => {
resolve(true);
});
},
},
}
</script>
<style lang="scss" scoped>
.container2{
.header{
min-height: 50px;
background: #FEF1EC;
text-align: center;
color: #F26335;
font-size: 16px;
p{
margin: 0;
line-height: 50px;
font-weight: 500;
}
i{
margin-right: 11px;
}
}
.content{
@include module-box;
margin-top: 14px;
.title{
color: #F26335;
font-size: 16px;
padding: 20px 40px;
border: 1px solid #F3F3F3;
a{
text-decoration: none;
font-size: 13px;
line-height: 18px;
float:right;
color: #F26335;
}
}
.content-list{
font-size: 14px;
line-height: 20px;
text-align: center;
padding-top: 20px;
p{
font-size: 13px;
line-height: 18px;
display: flex;
text-align: center;
justify-content: center;
align-items: center;
span{
margin-top: 9px;
display: inline-block;
height: 41px;
width: 273px;
line-height: 41px;
}
span:first-child{
color: #fff;
background: url('../../../assets/image/mymanage/jcjy.png') no-repeat ;
background-size: 100% 100%;
}
span:nth-child(2){
background: url('../../../assets/image/mymanage/center.png') no-repeat ;
background-size: 100% 100%;
}
span:last-child{
background: url('../../../assets/image/mymanage/right.png') no-repeat ;
background-size: 100% 100%;
}
}
}
.content-from{
padding:0 40px;
width: 70%;
.content-from-title{
font-size: 14px;
line-height: 20px;
font-weight: 800;
color: #414345;
margin: 40px 0;
}
.content-from-title::before{
content: "◆";
color: #F26335;
margin-right: 5px;
}
.el-form {
/deep/.el-input{
font-size: 13px;
}
.smallselect{
width: 100px!important;
}
.el-button{
padding: 0;
border-radius: 4px;
}
.el-select{
width: 100%;
}
.moreLong{
/deep/.el-form-item__label{
line-height: 20px;
}
}
.el-input-group__append {
border-color: transparent;
border: none;
button.el-button--primary {
background-color: $theme-color1;
border-color: $theme-color1;
color: white;
border-top-left-radius: 0;
border-bottom-left-radius: 0;
}
.el-button--primary:hover, .el-button--primary:focus {
background: #f5825d;
border-color: #f5825d;
}
}
.bottom-btn .el-form-item__content {
display: flex;
justify-content: flex-end;
align-items: center;
color: #999999;
font-size: 13px;
.el-button {
font-size: 13px;
}
}
}
}
.btn-div{
border-top: 1px solid #F3F3F3;
margin-top: 30px;
text-align: center;
.el-button{
margin-top: 30px;
padding: 0;
height: 41px;
border-radius: 4px;
margin-bottom: 40px;
}
.el-button:last-child{
margin-left: 30px;
}
}
}
}
</style>
<style lang="scss" scoped>
@media (max-width: 768px) {
//<=768的设备
.container2 .content .content-from {
width: 100%;
margin: 0;
padding:0 10px;
}
.container2 .content .content-from .el-form .btn-div .el-button:last-child{
margin-left: 0px;
}
}
</style>
\ No newline at end of file
src/views/MyManage/UnVerify/changePass.vue 0 → 100644
<template>
<div class="container2">
<div class="content">
<div class="title">个人资料</div>
<div class="content-from">
<el-form ref='ruleForm'
label-position='right'
label-width='160px'
:model='form'>
<el-form-item label='原密码'
prop='rePassword'
type='password'
:rules="[{required: true,message: '不能为空',},
{ pattern: pwdPattern, message: '密码需要6～16位数字+字母组合',},
{ validator:validatePass,}]">
<el-input type='password' placeholder="请输入原密码" v-model='form.rePassword'></el-input>
</el-form-item>
<el-form-item label='新密码'
prop='password'
type='password'
:rules="[{required: true,message: '不能为空',},
{ pattern: pwdPattern, message: '密码需要6～16位数字+字母组合',},
{ validator:validatePass,}]">
<el-input type='password' placeholder="请输入新密码" v-model='form.password'></el-input>
</el-form-item>
<el-form-item label='验证密码'
prop='checkPassword'
:rules="[
{ required: true,message: '不能为空',},
{ validator: validatePass2 }
]">
<el-input type='password' placeholder="请再次输入密码" v-model='form.checkPassword'
></el-input>
</el-form-item>
</el-form>
</div>
<div class="btn-div">
<el-button type="primary" style="width: 110px">保 存</el-button>
</div>
</div>
</div>
</template>
<script>
export default {
name: "index",
data() {
return {
hasSent: false,
timer: null,
time: 60,
form: {
rePassword:'',
password:'',
checkPassword:'',
},
pwdPattern: /^(?=.*[a-zA-Z])(?=.*[0-9])[A-Za-z0-9]{6,16}$/,
}
},
methods: {
validatePass(rule, value, callback) {
if (this.form.checkPassword !== '') {
this.$refs.ruleForm.validateField('checkPassword');
}
callback();
},
validatePass2(rule, value, callback) {
if (value !== this.form.password) {
callback(new Error('两次输入密码不一致!'));
} else {
callback();
}
},
},
}
</script>
<style lang="scss" scoped>
.container2{
.content{
@include module-box;
margin-top: 14px;
.title{
color: #F26335;
font-size: 16px;
padding: 20px 40px;
border: 1px solid #F3F3F3;
a{
text-decoration: none;
font-size: 13px;
line-height: 18px;
float:right;
color: #F26335;
}
}
.content-from{
padding:0 40px;
width: 70%;
.content-from-title{
font-size: 14px;
line-height: 20px;
font-weight: 800;
color: #414345;
margin: 40px 0;
}
.content-from-title::before{
content: "◆";
color: #F26335;
margin-right: 5px;
}
.el-form {
margin-top: 36px;
.el-form-item{
margin-bottom: 20px;
}
/deep/.el-input{
font-size: 13px;
}
.smallselect{
width: 100px!important;
}
p{
color: #F31F1F;
font-size: 12px;
line-height: 20px;
margin-top: 10px;
margin-bottom: 0;
}
.el-button{
padding: 0;
border-radius: 4px;
}
.el-select{
width: 100%;
}
.moreLong{
/deep/.el-form-item__label{
line-height: 20px;
}
}
.el-input-group__append {
border-color: transparent;
border: none;
button.el-button--primary {
background-color: $theme-color1;
border-color: $theme-color1;
color: white;
border-top-left-radius: 0;
border-bottom-left-radius: 0;
}
.el-button--primary:hover, .el-button--primary:focus {
background: #f5825d;
border-color: #f5825d;
}
}
.bottom-btn .el-form-item__content {
display: flex;
justify-content: flex-end;
align-items: center;
color: #999999;
font-size: 13px;
.el-button {
font-size: 13px;
}
}
}
}
.btn-div{
text-align: center;
overflow: hidden;
.el-button{
float: right;
padding: 0;
height: 41px;
border-radius: 4px;
margin: 30px 40px 40px 0;
}
}
}
}
</style>
<style lang="scss" scoped>
@media (max-width: 768px) {
//<=768的设备
.container2 .content .content-from {
width: 100%;
margin: 0;
padding:0 10px;
}
}
</style>
\ No newline at end of file
src/views/MyManage/UnVerify/changePhone.vue 0 → 100644
<template>
<div class="container2">
<div class="content">
<div class="title">个人资料</div>
<div class="content-from">
<el-form ref='ruleForm'
label-position='right'
label-width='160px'
:model='form'>
<el-form-item label='手机号码'
prop='mobile'
:rules="[{
required: true,
message: '不能为空',
},
{ validator:checkMobileReg },
{ validator:checkMobile, trigger:'blur' },]">
<el-input v-model='form.mobile' autocomplete='off'></el-input>
</el-form-item>
<el-form-item label='手机验证码'
prop='validate'
:rules="[{
required: true,
message: '不能为空',
},{ validator: checkValidate, trigger:'blur' }]"
>
<el-input
v-model="form.validate"
placeholder="请输入短信验证码"
>
<template slot="append">
<el-button v-if="!hasSent" type="primary" @click.stop="sendValidateCode">发送验证码</el-button>
<el-button disabled v-else>
发送验证码({{ time }}S)
</el-button>
</template>
</el-input>
</el-form-item>
</el-form>
</div>
<div class="btn-div">
<el-button type="primary" style="width: 110px">保 存</el-button>
</div>
</div>
</div>
</template>
<script>
export default {
name: "index",
data() {
return {
hasSent: false,
timer: null,
time: 60,
form: {
mobile:'',
validate:''
},
mobilePattern: /^((13[0-9])|(15[^4])|(18[0-9])|(17[0-8])|(147))\d{8}$/,
}
},
methods: {
sendValidateCode() {
if (this.form.mobile === '') {
this.$message({type: 'error', message: '请输入手机号码'});
} else {
this.hasSent = true;
this.timer = setInterval(() => {
this.time -= 1;
if (this.time === 0) {
clearInterval(this.timer);
this.time = 60;
this.hasSent = false;
}
}, 1000);
}
},
checkMobileReg(rule, value, callback) {
if (value !== '') {
if (this.mobilePattern.test(value)) {
callback();
} else {
callback(new Error('手机号码格式不正确'));
}
}
},
checkMobile() {
console.log('checkMobile');
return new Promise((resolve) => {
resolve(true);
});
},
checkValidate() {
return new Promise((resolve) => {
resolve(true);
});
},
},
}
</script>
<style lang="scss" scoped>
.container2{
.content{
@include module-box;
margin-top: 14px;
.title{
color: #F26335;
font-size: 16px;
padding: 20px 40px;
border: 1px solid #F3F3F3;
a{
text-decoration: none;
font-size: 13px;
line-height: 18px;
float:right;
color: #F26335;
}
}
.content-from{
padding:0 40px;
width: 70%;
.el-form {
margin-top: 36px;
.smallselect{
width: 100px!important;
}
.el-select{
width: 100%;
}
.el-input-group__append {
border-color: transparent;
border: none;
button.el-button--primary {
background-color: $theme-color1;
border-color: $theme-color1;
color: white;
border-top-left-radius: 0;
border-bottom-left-radius: 0;
}
.el-button--primary:hover, .el-button--primary:focus {
background: #f5825d;
border-color: #f5825d;
}
}
.bottom-btn .el-form-item__content {
display: flex;
justify-content: flex-end;
align-items: center;
color: #999999;
font-size: 13px;
.el-button {
font-size: 13px;
}
}
}
}
.btn-div{
text-align: center;
overflow: hidden;
.el-button{
float: right;
padding: 0;
height: 41px;
border-radius: 4px;
margin: 30px 40px 40px 0;
}
}
}
}
</style>
<style lang="scss" scoped>
@media (max-width: 768px) {
//<=768的设备
.container2 .content .content-from {
width: 100%;
margin: 0;
padding:0 10px;
}
}
</style>
\ No newline at end of file
src/views/MyManage/UnVerify/index.vue
<template>
<div class="container">
<div class="container2">
<div class="header">
<p>网站最新推出<a href="#">在线注册</a> &nbsp;&nbsp;<a href="#">在线续展</a>&nbsp;&nbsp;<a href="#"> 产品信息通报</a>等业务</p>
</div>
......@@ -66,11 +66,11 @@
<li>
<p class="content-title">检测校准申请（办理“条码印制品检测”、“条码检测仪校准”等业务需先完成此申请）</p>
<p><i class="bi bi-check-circle-fill"></i>您已成为中国物品编码中心检验检测/校准客户！</p>
<p style="padding-left:24px">您已成为中国物品编码中心检验检测/校准客户！</p>
<p style="padding-left:24px">您可以——办理条码印制品检测</p>
<p style="padding-left:24px">您可以——办理条码检测仪校准</p>
<p style="padding-left:24px">若想申请办理上述业务，请您联系：</p>
<p style="padding-left:24px">王工：<i class="bi bi-telephone-fill color-grey"></i>010-84295493 <i class="bi bi-envelope-fill color-grey"></i>wanghy@ancc.org.cn <span class="qe"></span>2308350380</p>
<p style="padding-left:24px">胡工：<i class="bi bi-telephone-fill color-grey"></i>010-84295499 <i class="bi bi-envelope-fill color-grey"></i>hum@ancc.org.cn <span class="qe"></span>1246978728</p>
<p style="padding-left:24px">王工<i class="bi bi-telephone-fill color-grey"></i>010-84295493 <i class="bi bi-envelope-fill color-grey"></i>wanghy@ancc.org.cn <i class="qe color-grey"></i>2308350380</p>
<p style="padding-left:24px">胡工<i class="bi bi-telephone-fill color-grey"></i>010-84295499 <i class="bi bi-envelope-fill color-grey"></i>hum@ancc.org.cn&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<i class="qe color-grey"></i>1246978728</p>
</li>
</ul>
</div>
......@@ -86,11 +86,9 @@ export default {
</script>
<style lang="scss" scoped>
.container{
.container2{
.header{
height: 50px;
min-height: 50px;
background: #FEF1EC;
text-align: center;
color: #F26335;
......@@ -141,13 +139,15 @@ export default {
}
.color-grey{
color: #666666;
margin-left: 5px;
margin:0 5px 0 20px;
}
.qe{
display: inline-block;
width: 13px;
height: 13px;
background: url("../../../assets/image/mymanage/qe.png") no-repeat 100% 100%;
width: 14px;
height: 14px;
background: url("../../../assets/image/mymanage/qe.png") no-repeat;
background-size: cover;
}
}
.list-cnt{
......@@ -179,3 +179,13 @@ export default {
}
}
</style>
<style lang="scss" scoped>
.content{
@media screen and (max-width: 992px) {
ul {
padding: 0 10px;
}
}
}
</style>
\ No newline at end of file
src/views/MyManage/UnVerify/personalInfo.vue 0 → 100644
<template>
<div class="container2">
<div class="content">
<div class="title">个人资料</div>
<div class="content-from">
<el-form ref='ruleForm'
label-position='right'
label-width='160px'
:model='form'>
<el-form-item label='E-mail：'
prop='email'
:rules="[{
required: true,
message: '不能为空',
},
{ type: 'email',
message: '请输入正确的邮箱地址',
trigger: ['blur', 'change']
}]">
<el-input v-model='form.email' autocomplete='off' placeholder="请输入E-mail"></el-input>
</el-form-item>
<el-form-item label='手机：'
prop='mobile'
:rules="[{
required: true,
message: '不能为空',
},
{ validator:checkMobileReg },
{ validator:checkMobile, trigger:'blur' },]">
<el-input v-model='form.mobile' autocomplete='off' placeholder="请输入手机"></el-input>
<p>请在[用户信息管理]-[修改手机号码]中修改正确的手机号码，便于找回密码</p>
</el-form-item>
<el-form-item label='真实姓名：'
prop='name'
>
<el-input v-model='form.name' autocomplete='off' placeholder="请输入真实姓名："></el-input>
</el-form-item>
<el-form-item label='证件号码：'
prop='IDNumber'
:rules="[{
required: true,
message: '不能为空',
}]"
>
<el-input placeholder="请输入证件号码" v-model="form.IDNumber" class="input-with-select">
<el-select v-model="form.IDType" slot="prepend" placeholder="请选择" class="smallselect">
<el-option label="身份证" value="1" ></el-option>
</el-select>
</el-input>
</el-form-item>
<el-form-item label='联系地址：'
prop='address'
>
<el-input v-model='form.email' autocomplete='off' placeholder="请输入联系地址"></el-input>
</el-form-item>
<el-form-item label='工作单位：'
prop='oficeAddr'
>
<el-input v-model='form.oficeAddr' autocomplete='off' placeholder="请输入工作单位"></el-input>
</el-form-item>
</el-form>
</div>
<div class="btn-div">
<el-button type="primary" style="width: 110px">保 存</el-button>
</div>
</div>
</div>
</template>
<script>
export default {
name: "index",
data() {
return {
hasSent: false,
timer: null,
time: 60,
form: {
email:'',
mobile:'',
IDType:'1',
IDNumber:'',
name:'',
address:'',
officeAddr:''
},
mobilePattern: /^((13[0-9])|(15[^4])|(18[0-9])|(17[0-8])|(147))\d{8}$/,
}
},
methods: {
register() {
},
checkMobileReg(rule, value, callback) {
if (value !== '') {
if (this.mobilePattern.test(value)) {
callback();
} else {
callback(new Error('手机号码格式不正确'));
}
}
},
checkMobile() {
console.log('checkMobile');
return new Promise((resolve) => {
resolve(true);
});
},
},
}
</script>
<style lang="scss" scoped>
.container2{
.content{
@include module-box;
margin-top: 14px;
.title{
color: #F26335;
font-size: 16px;
padding: 20px 40px;
border: 1px solid #F3F3F3;
a{
text-decoration: none;
font-size: 13px;
line-height: 18px;
float:right;
color: #F26335;
}
}
.content-from{
padding:0 40px;
width: 70%;
.content-from-title{
font-size: 14px;
line-height: 20px;
font-weight: 800;
color: #414345;
margin: 40px 0;
}
.content-from-title::before{
content: "◆";
color: #F26335;
margin-right: 5px;
}
.el-form {
margin-top: 36px;
.el-form-item{
margin-bottom: 20px;
}
/deep/.el-input{
font-size: 13px;
}
.smallselect{
width: 100px!important;
}
p{
color: #F31F1F;
font-size: 12px;
line-height: 20px;
margin-top: 10px;
margin-bottom: 0;
}
.el-button{
padding: 0;
border-radius: 4px;
}
.el-select{
width: 100%;
}
.moreLong{
/deep/.el-form-item__label{
line-height: 20px;
}
}
.el-input-group__append {
border-color: transparent;
border: none;
button.el-button--primary {
background-color: $theme-color1;
border-color: $theme-color1;
color: white;
border-top-left-radius: 0;
border-bottom-left-radius: 0;
}
.el-button--primary:hover, .el-button--primary:focus {
background: #f5825d;
border-color: #f5825d;
}
}
.bottom-btn .el-form-item__content {
display: flex;
justify-content: flex-end;
align-items: center;
color: #999999;
font-size: 13px;
.el-button {
font-size: 13px;
}
}
}
}
.btn-div{
text-align: center;
overflow: hidden;
.el-button{
float: right;
padding: 0;
height: 41px;
border-radius: 4px;
margin: 30px 40px 40px 0;
}
}
}
}
</style>
<style lang="scss" scoped>
@media (max-width: 768px) {
//<=768的设备
.container2 .content .content-from {
width: 100%;
margin: 0;
padding:0 10px;
}
}
</style>
\ No newline at end of file
src/views/MyManage/UnVerify/vendor.vue 0 → 100644
<template>
<div class="container2">
<div class="header">
<p><i class="bi bi-exclamation-triangle-fill"></i>厂商实名认证（办理“进口商品信息通报、GLN”等业务需先完成此认证）</p>
</div>
<div class="content">
<div class="title">厂商实名认证——填写实名信息 <a href="/MyManage/UnVerify">返回我的首页</a></div>
<div class="content-list">
<p >
<span>1.填写实名信息</span>
<span>2.提交书面材料</span>
<span>3.审核状态</span>
</p>
</div>
<div class="content-from">
<el-form ref='ruleForm'
label-position='right'
label-width='160px'
:model='form'>
<p class="content-from-title">企业信息填报</p>
<el-form-item label='企业名称(中文)：'
prop='chineseName'
:rules="[{
required: true,
message: '不能为空',
}]">
<el-input v-model='form.chineseName' autocomplete='off' placeholder="请输入企业中文名称"></el-input>
</el-form-item>
<el-form-item label='企业名称(英文)：'
prop='englishName'
>
<el-input v-model='form.englishName' autocomplete='off' placeholder="请输入企业英文名称"></el-input>
</el-form-item>
<el-form-item label='注册地址：'
prop='registeredAddress'
:rules="[{
required: true,
message: '不能为空',
}]"
>
<el-input placeholder="请输入注册地址" v-model="form.registeredAddress" class="input-with-select">
<el-select v-model="form.city" slot="prepend" placeholder="请选择" class="smallselect">
<el-option label="黑龙江" value="1" ></el-option>
</el-select>
</el-input>
</el-form-item>
<el-form-item label='所属分支机构：'
prop='branch'
:rules="[{
required: true,
message: '不能为空',
}]">
<el-select v-model="form.branch" placeholder="请选择所属分支机构" >
<el-option label="" value="1" ></el-option>
</el-select>
</el-form-item>
<el-form-item label='注册地址(英文)：'
prop='englishRegisterAddr'
>
<el-input v-model='form.englishRegisterAddr' autocomplete='off' placeholder="请输入英文注册地址"></el-input>
</el-form-item>
<el-form-item label='注册地址邮政编码：'
prop='registerAddrCode'
:rules="[{
required: true,
message: '不能为空',
}]">
<el-input v-model='form.registerAddrCode' autocomplete='off' placeholder="请输入注册地址邮政编码"></el-input>
</el-form-item>
<el-form-item label='办公地址：'
prop='officeAddr'
:rules="[{
required: true,
message: '不能为空',
}]">
<el-input v-model='form.officeAddr' autocomplete='off' placeholder="请输入办公地址"></el-input>
</el-form-item>
<el-form-item label='办公地址(英文)：'
prop='englishOfficeAddr'
>
<el-input v-model='form.englishOfficeAddr' autocomplete='off' placeholder="请输入英文办公地址"></el-input>
</el-form-item>
<el-form-item label='办公地址邮政编码：'
prop='officeAddrCode'
:rules="[{
required: true,
message: '不能为空',
}]">
<el-input v-model='form.officeAddrCode' autocomplete='off' placeholder="请输入办公地址邮政编码"></el-input>
</el-form-item>
<p class="content-from-title">行政区域信息填报</p>
<el-form-item label='统一社会信用代码：'
prop='creditCode'
:rules="[{
required: true,
message: '不能为空',
}]">
<el-input v-model='form.creditCode' autocomplete='off' placeholder="请输入统一社会信用代码"></el-input>
</el-form-item>
<el-form-item label='注册资金(万元)：'
prop='registeredCapital'
:rules="[{
required: true,
message: '不能为空',
}]">
<el-input v-model='form.registeredCapital' autocomplete='off' placeholder="请输入注册资金(万元)"></el-input>
</el-form-item>
<el-form-item label='货币种类：'
prop='currency'
:rules="[{
required: true,
message: '不能为空',
}]">
<el-select v-model="form.currency" placeholder="请选择货币种类" >
<el-option label="" value="1" ></el-option>
</el-select>
</el-form-item>
<el-form-item label='企业类别：'
prop='enterpriseCategory'
:rules="[{
required: true,
message: '不能为空',
}]">
<el-select v-model="form.enterpriseCategory" placeholder="请选择企业类别" >
<el-option label="" value="1" ></el-option>
</el-select>
</el-form-item>
<el-form-item label='经济类型代码：'
prop='economicTypeCode'
:rules="[{
required: true,
message: '不能为空',
}]">
<el-select v-model="form.economicTypeCode" placeholder="请选择经济类型代码" >
<el-option label="" value="1" ></el-option>
</el-select>
</el-form-item>
<el-form-item label='国民经济行业分类代码：'
prop='nationalEconomyCode'
class="moreLong"
:rules="[{
required: true,
message: '不能为空',
}]">
<el-select v-model="form.branch" placeholder="请选择国民经济行业分类代码" >
<el-option label="" value="1" ></el-option>
</el-select>
</el-form-item>
<el-form-item label='组织机构代码：'
prop='organizationCode'
>
<el-input v-model='form.organizationCode' autocomplete='off' placeholder="请输入组织机构代码"></el-input>
</el-form-item>
<p class="content-from-title">法定人信息填报</p>
<el-form-item label='法定代表人：'
prop='legalRepresentative'
:rules="[{
required: true,
message: '不能为空',
}]">
<el-input v-model='form.legalRepresentative' autocomplete='off' placeholder="请输入法定代表人"></el-input>
</el-form-item>
<el-form-item label='法定代表人电话：'
prop='legalRepresentativeTel'
>
<el-input v-model='form.legalRepresentativeTel' autocomplete='off' placeholder="请输入法定代表人电话"></el-input>
</el-form-item>
<el-form-item label='法定代表人手机：'
prop='legalRepresentativePhone'
:rules="[{
required: true,
message: '不能为空',
}]">
<el-input v-model='form.legalRepresentativePhone' autocomplete='off' placeholder="请输入法定代表人手机"></el-input>
</el-form-item>
<el-form-item label='企业网址：'
prop='website'
>
<el-input v-model='form.website' autocomplete='off' placeholder="请输入企业网址："></el-input>
</el-form-item>
<el-form-item label='上传已年检企业营业执照扫描件'
prop='uploadImg'
class="moreLong"
:rules="[{
required: true,
message: '不能为空',
}]">
<el-input v-model='form.uploadImg' autocomplete='off' type="file" style="display:none"></el-input>
<el-button type="primary" style="width: 110px">上传</el-button>
</el-form-item>
<p class="content-from-title">经办人信息填报</p>
<el-form-item label='经办人姓名：'
prop='name'
:rules="[{
required: true,
message: '不能为空',
}]">
<el-input v-model='form.name' autocomplete='off' placeholder="请输入经办人姓名"></el-input>
</el-form-item>
<el-form-item label='电话：'
prop='tel'
:rules="[{
required: true,
message: '不能为空',
}]">
<el-input v-model='form.tel' autocomplete='off' placeholder="请输入电话"></el-input>
</el-form-item>
<el-form-item label='手机：'
prop='mobile'
:rules="[{
required: true,
message: '不能为空',
},
{ validator:checkMobileReg },
{ validator:checkMobile, trigger:'blur' },]">
<el-input v-model='form.mobile' autocomplete='off' placeholder="请输入手机"></el-input>
</el-form-item>
<el-form-item label='传真：'
prop='fax'
:rules="[{
required: true,
message: '不能为空',
}]">
<el-input v-model='form.email' autocomplete='off' placeholder="请输入传真"></el-input>
</el-form-item>
<el-form-item label='E-mail：'
prop='email'
:rules="[{
required: true,
message: '不能为空',
},
{ type: 'email',
message: '请输入正确的邮箱地址',
trigger: ['blur', 'change']
}]">
<el-input v-model='form.email' autocomplete='off' placeholder="请输入E-mail"></el-input>
</el-form-item>
<p class="content-from-title">办理业务</p>
<el-form-item label='办理业务：'
prop='business'
:rules="[{
required: true,
message: '不能为空',
}]">
<el-select v-model="form.business" placeholder="请选择办理业务" >
<el-option label="" value="1" ></el-option>
</el-select>
</el-form-item>
</el-form>
</div>
<div class="btn-div">
<el-button type="primary" style="width: 110px">保 存</el-button>
</div>
</div>
</div>
</template>
<script>
export default {
name: "index",
data() {
return {
hasSent: false,
timer: null,
time: 60,
form: {
chineseName:'',
englishName:'',
registeredAddress:'',
city:'1',
branch:'',
englishRegisterAddr:'',
registerAddrCode:'',
officeAddr:'',
englishOfficeAddr:'',
officeAddrCode:'',
creditCode:'',
registeredCapital:'',
currency:'',
enterpriseCategory:'',
economicTypeCode:'',
nationalEconomyCode:'',
organizationCode:'',
legalRepresentative:'',
legalRepresentativeTel:'',
legalRepresentativePhone:'',
website:'',
name:'',
tel:'',
mobile:'',
fax:'',
email:'',
business:''
},
mobilePattern: /^((13[0-9])|(15[^4])|(18[0-9])|(17[0-8])|(147))\d{8}$/,
}
},
methods: {
register() {
},
checkMobileReg(rule, value, callback) {
if (value !== '') {
if (this.mobilePattern.test(value)) {
callback();
} else {
callback(new Error('手机号码格式不正确'));
}
}
},
checkMobile() {
console.log('checkMobile');
return new Promise((resolve) => {
resolve(true);
});
},
},
}
</script>
<style lang="scss" scoped>
.container2{
.header{
min-height: 50px;
background: #FEF1EC;
text-align: center;
color: #F26335;
font-size: 16px;
p{
margin: 0;
line-height: 50px;
font-weight: 500;
}
i{
margin-right: 11px;
}
}
.content{
@include module-box;
margin-top: 14px;
.title{
color: #F26335;
font-size: 16px;
padding: 20px 40px;
border: 1px solid #F3F3F3;
a{
text-decoration: none;
font-size: 13px;
line-height: 18px;
float:right;
color: #F26335;
}
}
.content-list{
font-size: 14px;
line-height: 20px;
text-align: center;
padding-top: 20px;
p{
font-size: 13px;
line-height: 18px;
display: flex;
text-align: center;
justify-content: center;
align-items: center;
span{
margin-top: 9px;
display: inline-block;
height: 41px;
width: 273px;
line-height: 41px;
}
span:first-child{
color: #fff;
background: url('../../../assets/image/mymanage/csrz.png') no-repeat ;
background-size: 100% 100%;
}
span:nth-child(2){
background: url('../../../assets/image/mymanage/center.png') no-repeat ;
background-size: 100% 100%;
}
span:last-child{
background: url('../../../assets/image/mymanage/right.png') no-repeat ;
background-size: 100% 100%;
}
}
}
.content-from{
padding:0 40px;
width: 70%;
.content-from-title{
font-size: 14px;
line-height: 20px;
font-weight: 800;
color: #414345;
margin: 40px 0;
}
.content-from-title::before{
content: "◆";
color: #F26335;
margin-right: 5px;
}
.el-form {
/deep/.el-input{
font-size: 13px;
}
.smallselect{
width: 100px!important;
}
.el-button{
padding: 0;
border-radius: 4px;
}
.el-select{
width: 100%;
}
.moreLong{
/deep/.el-form-item__label{
line-height: 20px;
}
}
.el-input-group__append {
border-color: transparent;
border: none;
button.el-button--primary {
background-color: $theme-color1;
border-color: $theme-color1;
color: white;
border-top-left-radius: 0;
border-bottom-left-radius: 0;
}
.el-button--primary:hover, .el-button--primary:focus {
background: #f5825d;
border-color: #f5825d;
}
}
.bottom-btn .el-form-item__content {
display: flex;
justify-content: flex-end;
align-items: center;
color: #999999;
font-size: 13px;
.el-button {
font-size: 13px;
}
}
}
}
.btn-div{
border-top: 1px solid #F3F3F3;
margin-top: 30px;
text-align: center;
.el-button{
margin-top: 30px;
padding: 0;
height: 41px;
border-radius: 4px;
margin-bottom: 40px;
}
}
}
}
</style>
<style lang="scss" scoped>
@media (max-width: 768px) {
//<=768的设备
.container2 .content .content-from {
width: 100%;
margin: 0;
padding:0 10px;
}
.container2 .content .content-from .el-form .btn-div .el-button:last-child{
margin-left: 0px;
}
}
</style>
\ No newline at end of file
src/views/MyManage/comps/userInfo.vue
......@@ -3,11 +3,11 @@
<div class="cnt">
<img src="../../../assets/image/mymanage/headImg.png" alt="">
<template v-if="type === UN_VERIFY">
<p>{{ userNamr }}/{{ phone }}/{{ cardNo }}</p>
<p>{{ userName }}/{{ phone }}/{{ cardNo }}</p>
<p>{{ userType }} | {{ nocardNo }}</p>
</template>
<template v-else-if="type === ADMIN">
<p class="admin_name">{{ userNamr }}</p>
<p class="admin_name">{{ userName }}</p>
<p>- - - | 中心管理员</p>
</template>
</div>
......@@ -27,7 +27,7 @@ export default {
UN_VERIFY,
SYSTEM_MEMBER,
ADMIN,
userNamr: '用户名',
userName: '用户名',
phone: '手机号',
cardNo: '条码卡号',
userType: '用户类别',
......
src/views/MyManage/index.vue
......@@ -45,19 +45,19 @@ export default {
id: uuid("gs_nav"),
name: "商品条码在线注册",
index: 0,
link: "",
link: "/Business",
},
{
id: uuid("gs_nav"),
name: "厂商实名认证",
index: 1,
link: "",
link: "/MyManage/UnVerify/vendor",
},
{
id: uuid("gs_nav"),
name: "检测校准申请",
index: 2,
link: "",
link: "/MyManage/UnVerify/calibration",
},
],
......@@ -72,19 +72,19 @@ export default {
id: uuid("gs_nav"),
name: "个人资料",
index: 0,
link: "",
link: "/MyManage/UnVerify/personalInfo",
},
{
id: uuid("gs_nav"),
name: "修改密码",
name: "修改登录密码",
index: 1,
link: "",
link: "/MyManage/UnVerify/changePass",
},
{
id: uuid("gs_nav"),
name: "修改手机号码",
index: 2,
link: "",
link: "/MyManage/UnVerify/changePhone",
},
],
......
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