22 changed files with 913 additions and 180 deletions
@ -0,0 +1,35 @@ |
|||
import router from './router' |
|||
import {MessageBox } from 'element-ui' |
|||
// import NProgress from 'nprogress' // Progress 进度条
|
|||
// import 'nprogress/nprogress.css'// Progress 进度条样式
|
|||
import {getToken} from '@/utils/auth' // 验权
|
|||
|
|||
const whiteList = ['signupMeeting'] // 不重定向白名单
|
|||
router.beforeEach((to, from, next) => { |
|||
// NProgress.start()
|
|||
if (getToken()) { |
|||
next() |
|||
document.documentElement.scrollTop = document.body.scrollTop = 0; |
|||
} else { |
|||
if (whiteList.indexOf(to.name) !== -1) { |
|||
MessageBox.alert('该功能需要登录后使用,请登录', '提示', { |
|||
closeOnClickModal:true, |
|||
confirmButtonText: '去登录', |
|||
cancelButtonText: '返回', |
|||
type: 'warning', |
|||
}).then(() => { |
|||
next('/login') |
|||
}) |
|||
.catch(action => { |
|||
|
|||
}); |
|||
} else { |
|||
next() |
|||
} |
|||
} |
|||
// NProgress.done()
|
|||
}) |
|||
|
|||
// router.afterEach(() => {
|
|||
// NProgress.done() // 结束Progress
|
|||
// })
|
@ -0,0 +1,242 @@ |
|||
<template> |
|||
<div class="app-container"> |
|||
<div class="app-main"> |
|||
<p class="font-size-24 font-weight-bold line-height-2em">企业信息</p> |
|||
<el-divider></el-divider> |
|||
<el-form :model="form" :rules="rules" ref="userInfo" class="el-form-new"> |
|||
<el-form-item label="企业名称:" :label-width="formLabelWidth" prop="name"> |
|||
<el-input v-if="isEdit" v-model="form.name" autocomplete="off" placeholder="请输入企业名称"></el-input> |
|||
<span v-else>{{form.name}}</span> |
|||
</el-form-item> |
|||
<el-form-item label="组织/单位营业执照:" :label-width="formLabelWidth" prop="enOpeAddress"> |
|||
<div class="flex-box"> |
|||
<el-upload |
|||
v-if="isEdit" |
|||
class="avatar-uploader" |
|||
:action="upload_file" |
|||
:headers="upload_headers" |
|||
:data="upload_data" |
|||
:show-file-list="false" |
|||
:on-success="handleLicenceSuccess" |
|||
:before-upload="beforeAvatarUpload" |
|||
> |
|||
<img v-if="businessLicenceUrl" :src="businessLicenceUrl" class="avatar"/> |
|||
<i v-else class="el-icon-plus avatar-uploader-icon"></i> |
|||
</el-upload> |
|||
<img v-else :src="businessLicenceUrl" class="avatar"/> |
|||
</div> |
|||
|
|||
</el-form-item> |
|||
<el-form-item label="法人姓名:" :label-width="formLabelWidth" prop="enLegalName"> |
|||
<el-input v-if="isEdit" v-model="form.enLegalName" autocomplete="off" placeholder="请输入法人姓名"></el-input> |
|||
<span v-else>{{form.enLegalName}}</span> |
|||
</el-form-item> |
|||
<el-form-item label="法人身份证照:" :label-width="formLabelWidth" prop="enCeAddressZ"> |
|||
<div v-if="isEdit" class="flex-box"> |
|||
<el-upload |
|||
class="avatar-uploader flex-1" |
|||
:action="upload_file" |
|||
:headers="upload_headers" |
|||
:data="upload_data" |
|||
:show-file-list="false" |
|||
:on-success="handlePhotoSuccess" |
|||
:before-upload="beforeAvatarUpload" |
|||
> |
|||
<img v-if="photoUrl" :src="photoUrl" class="avatar"/> |
|||
<i v-else class="el-icon-plus avatar-uploader-icon"></i> |
|||
</el-upload> |
|||
<el-upload |
|||
class="avatar-uploader flex-1" |
|||
:action="upload_file" |
|||
:headers="upload_headers" |
|||
:data="upload_data" |
|||
:show-file-list="false" |
|||
:on-success="handleReverseSuccess" |
|||
:before-upload="beforeAvatarUpload" |
|||
> |
|||
<img v-if="reversePhotoUrl" :src="reversePhotoUrl" class="avatar"/> |
|||
<i v-else class="el-icon-plus avatar-uploader-icon"></i> |
|||
</el-upload> |
|||
</div> |
|||
<div v-else class="flex-box"> |
|||
<img :src="photoUrl" class="avatar"/> |
|||
<img :src="reversePhotoUrl" class="avatar"/> |
|||
</div> |
|||
<el-form-item label-width="150px" prop="enCeAddressF"></el-form-item> |
|||
</el-form-item> |
|||
<el-row> |
|||
<el-form-item :label-width="formLabelWidth" style="text-align: center;"> |
|||
<template v-if="isEdit"> |
|||
<el-button type="primary" size="small" @click="submitForm('userInfo')" style="width:200px;text-align: center;">确定</el-button> |
|||
<el-button type="info" size="small" @click="resetForm('userInfo')" >返回</el-button> |
|||
</template> |
|||
<template v-else> |
|||
<el-button type="primary" size="small" @click="editInfo" style="width:200px;text-align: center;">编辑</el-button> |
|||
</template> |
|||
|
|||
</el-form-item> |
|||
</el-row> |
|||
</el-form> |
|||
</div> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import {getLoginInfo,updateCompanyInfo} from "@/api/login" |
|||
|
|||
export default { |
|||
name: 'companyInfo', |
|||
data() { |
|||
//法人正面照校验 |
|||
const checkPhotoZ = (rule, value, callback) => { |
|||
if ("" == value || !value) { |
|||
return callback(new Error("请上传正面法人证件照")); |
|||
} else { |
|||
callback(); |
|||
} |
|||
}; |
|||
//法人反面照校验 |
|||
const checkPhotoF = (rule, value, callback) => { |
|||
if ("" == value || !value) { |
|||
return callback(new Error("请上传反面法人证件照")); |
|||
} else { |
|||
callback(); |
|||
} |
|||
}; |
|||
//营业执照照校验 |
|||
const checkPhotoOpe = (rule, value, callback) => { |
|||
if ("" == value || !value) { |
|||
return callback(new Error("请上传营业执照")); |
|||
} else { |
|||
callback(); |
|||
} |
|||
}; |
|||
return { |
|||
isEdit: false, |
|||
code_url: config.CODE_URL, |
|||
formLabelWidth: '170px', |
|||
upload_file: config.UPLOAD_URL, //上传图片的接口地址 |
|||
upload_headers:{ |
|||
powerToken: '800580795f01449f9100c4d2983d13c9' |
|||
}, |
|||
upload_data:{ |
|||
uploadType:'1', |
|||
suffixType:'8', |
|||
folder:'company' |
|||
}, |
|||
photoUrl: "", //正面法人证件照 |
|||
reversePhotoUrl: "", //反面法人证件照 |
|||
businessLicenceUrl: "", //组织/单位营业执照 |
|||
form: { |
|||
enCeAddressF: "", |
|||
enCeAddressZ: "", |
|||
enLegalName: "", |
|||
enOpeAddress: "", |
|||
name: "", |
|||
}, |
|||
params:{}, |
|||
rules: { |
|||
name: [{required: true, message: "请输入企业名称", trigger: "blur"}], |
|||
enLegalName: [ |
|||
{required: true, message: "请输入法人姓名", trigger: "blur"} |
|||
], |
|||
enCeAddressZ: [ |
|||
{required: true, validator: checkPhotoZ, trigger: "blur"} |
|||
], |
|||
enCeAddressF: [ |
|||
{required: true, validator: checkPhotoF, trigger: "blur"} |
|||
], |
|||
enOpeAddress: [ |
|||
{required: true, validator: checkPhotoOpe, trigger: "blur"} |
|||
] |
|||
} |
|||
} |
|||
}, |
|||
mounted() { |
|||
this.initData() |
|||
}, |
|||
methods: { |
|||
initData() { |
|||
getLoginInfo().then(res => { |
|||
this.form = res.data.companyInfo |
|||
this.photoUrl = this.form.enCeAddressZ |
|||
this.reversePhotoUrl = this.form.enCeAddressF |
|||
this.businessLicenceUrl = this.form.enOpeAddress |
|||
|
|||
}) |
|||
}, |
|||
submitForm(formName) { |
|||
this.$refs[formName].validate((valid) => { |
|||
if (valid) { |
|||
this.updateCompanyInfomation() |
|||
} else { |
|||
return false; |
|||
} |
|||
}); |
|||
}, |
|||
updateCompanyInfomation(){ |
|||
const params = { |
|||
enCeAddressF: this.form.enCeAddressF, |
|||
enCeAddressZ: this.form.enCeAddressZ, |
|||
enLegalName: this.form.enLegalName, |
|||
enOpeAddress: this.form.enOpeAddress, |
|||
name: this.form.name, |
|||
id: this.form.id, |
|||
} |
|||
updateCompanyInfo(params).then(res => { |
|||
this.$message({ |
|||
message: "修改成功!", |
|||
type: "success" |
|||
}); |
|||
this.isEdit = false |
|||
this.initData() |
|||
}) |
|||
}, |
|||
editInfo() { |
|||
let _obj = JSON.stringify(this.form) |
|||
this.params = JSON.parse(_obj); |
|||
this.isEdit = true |
|||
}, |
|||
resetForm(formName) { |
|||
this.$refs[formName].resetFields(); |
|||
let _obj = JSON.stringify(this.params) |
|||
this.form = JSON.parse(_obj); |
|||
this.isEdit = false |
|||
}, |
|||
//组织/单位营业执照图片上传成功的回调 |
|||
handleLicenceSuccess(res, file) { |
|||
this.businessLicenceUrl = URL.createObjectURL(file.raw); |
|||
this.form.enOpeAddress = res.data; |
|||
}, |
|||
//法人正面照图片上传成功的回调 |
|||
handlePhotoSuccess(res, file) { |
|||
this.photoUrl = URL.createObjectURL(file.raw); |
|||
this.form.enCeAddressZ = res.data; |
|||
}, |
|||
//法人反面照图片上传成功的回调 |
|||
handleReverseSuccess(res, file) { |
|||
this.reversePhotoUrl = URL.createObjectURL(file.raw); |
|||
this.form.enCeAddressF = res.data; |
|||
}, |
|||
//图片上传前的检测 |
|||
beforeAvatarUpload(file) { |
|||
const isLt2M = file.size / 1024 / 1024 < 2; |
|||
if (!isLt2M) { |
|||
this.$message.error("上传图片大小不能超过 2MB!"); |
|||
} |
|||
return isLt2M; |
|||
}, |
|||
} |
|||
} |
|||
</script> |
|||
<style lang="scss" scoped> |
|||
// .form-footer { |
|||
// text-align: center; |
|||
// } |
|||
|
|||
.el-form-new { |
|||
width: 500px; |
|||
min-height: 450px; |
|||
margin: 0 auto; |
|||
} |
|||
</style> |
@ -0,0 +1,136 @@ |
|||
<template> |
|||
<div class="app-container"> |
|||
<div class="app-main" style="min-height:500px"> |
|||
<p class="font-size-24 font-weight-bold line-height-2em">我的大会</p> |
|||
<el-divider></el-divider> |
|||
<el-table :data="tableData" style="width: 100%"> |
|||
<el-table-column prop="title" label="会议名称"></el-table-column> |
|||
<el-table-column prop="type" label="会议类型" width="120"> |
|||
<template slot-scope="scope"> |
|||
<span v-if="scope.row.type == 1">食品工业互联网大会</span> |
|||
<span v-else-if="scope.row.type == 2">食品工业转型升级论坛</span> |
|||
<span v-else-if="scope.row.type == 3">线上会议沙龙</span> |
|||
</template> |
|||
</el-table-column> |
|||
<el-table-column prop="startTime" label="开始时间" width="120"></el-table-column> |
|||
<el-table-column prop="endTime" label="结束时间" width="120"></el-table-column> |
|||
<el-table-column prop="confereeType" label="参会类型" width="120"> |
|||
<template slot-scope="scope"> |
|||
<span v-if="scope.row.confereeType == 0">所有人</span> |
|||
<span v-else-if="scope.row.confereeType == 1">仅限会员</span> |
|||
</template> |
|||
</el-table-column> |
|||
<el-table-column prop="schedule" label="会议日程"></el-table-column> |
|||
<el-table-column prop="address" label="会议地址"></el-table-column> |
|||
<el-table-column prop="sponsor" label="主办单位"></el-table-column> |
|||
<el-table-column prop="organizer" label="承办单位"></el-table-column> |
|||
<el-table-column prop="coOrganizer" label="协办单位"></el-table-column> |
|||
<!-- <el-table-column label="操作" width="200"> |
|||
<template slot-scope="scope"> |
|||
<el-button type="text" size="small" @click="editMeet(scope.row.id)"><i class="el-icon-edit"></i>修改</el-button> |
|||
<el-button type="text" size="small" @click="deleteMeet(scope.row.id)"><i class="el-icon-delete"></i>移除</el-button> |
|||
</template> |
|||
</el-table-column> --> |
|||
</el-table> |
|||
<el-pagination |
|||
layout="prev, pager, next" |
|||
:current-page.sync="currentPage" |
|||
@current-change="handleCurrentChange" |
|||
:page-size="10" |
|||
:total="total"> |
|||
</el-pagination> |
|||
</div> |
|||
</div> |
|||
</template> |
|||
<script> |
|||
import {getNoticeList} from "@/api/notice.js" |
|||
export default { |
|||
name:"myMeeting", |
|||
data(){ |
|||
return { |
|||
tableData:[], |
|||
currentPage:1, |
|||
total:0 |
|||
} |
|||
}, |
|||
|
|||
mounted(){ |
|||
}, |
|||
methods:{ |
|||
|
|||
//当前页变化 |
|||
handleCurrentChange(val) { |
|||
this.currentPage = val |
|||
this.initSearchList() |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
<style lang="scss" scoped> |
|||
.notice-list { |
|||
position: relative; |
|||
background-color: rgba(255,255,255,0); |
|||
cursor: pointer; |
|||
color: #999999; |
|||
font-family:PingFang SC; |
|||
border-bottom: 1px dotted #dcdcdc; |
|||
margin: 0 30px; |
|||
height: 46px; |
|||
.content-block { |
|||
position: relative; |
|||
display: inline-block; |
|||
width: calc(100% - 150px); |
|||
height: 46px; |
|||
line-height: 46px; |
|||
padding: 0 15px; |
|||
&::before { |
|||
content: " "; |
|||
position: absolute; |
|||
top: 20px; |
|||
left: -10px; |
|||
width: 6px; |
|||
height: 6px; |
|||
background: #8D8D8D; |
|||
border-radius: 50%; |
|||
} |
|||
} |
|||
.content-block-first { |
|||
position: relative; |
|||
display: inline-block; |
|||
width: calc(100% - 90px); |
|||
height: 103px; |
|||
padding: 0 15px; |
|||
} |
|||
.text-date { |
|||
position: relative; |
|||
display: inline-block; |
|||
height: 46px; |
|||
width: 150px; |
|||
line-height: 46px; |
|||
text-align: center; |
|||
font-size: 14px; |
|||
vertical-align: bottom; |
|||
} |
|||
.text-title { |
|||
font-size: 18px; |
|||
// margin: 6px 0; |
|||
font-weight:500; |
|||
color: #666666; |
|||
white-space: nowrap; |
|||
overflow: hidden; |
|||
text-overflow: ellipsis; |
|||
} |
|||
.text-content { |
|||
font-size: 14px; |
|||
overflow: hidden; |
|||
display: -webkit-box; |
|||
-webkit-line-clamp:2; |
|||
-webkit-box-orient: vertical; |
|||
} |
|||
&:hover { |
|||
.text-title { |
|||
color: #3893c7; |
|||
} |
|||
} |
|||
} |
|||
</style> |
@ -0,0 +1,197 @@ |
|||
<template> |
|||
<div class="app-container"> |
|||
<el-row> |
|||
<el-col :span="18"> |
|||
<span class="title">大会报名</span> |
|||
<el-divider></el-divider> |
|||
<div class="signup-block"> |
|||
<el-form label-position="top" label-width="80px" :model="form"> |
|||
<p class="text-center">大会登记</p> |
|||
<br> |
|||
<el-form-item label="姓名:" :label-width="formLabelWidth" prop="name"> |
|||
<el-input v-model="form.name" autocomplete="off" size="small" placeholder="请输入姓名"></el-input> |
|||
</el-form-item> |
|||
<el-form-item label="公司名称" :label-width="formLabelWidth" prop="company"> |
|||
<el-input v-model="form.company" autocomplete="off" size="small" placeholder="请输入公司名称"></el-input> |
|||
</el-form-item> |
|||
<el-form-item label="邮箱:" :label-width="formLabelWidth" prop="email"> |
|||
<el-input v-model="form.email" autocomplete="off" size="small" placeholder="请输入邮箱"></el-input> |
|||
</el-form-item> |
|||
<el-form-item label="手机号:" :label-width="formLabelWidth" prop="phone"> |
|||
<el-input v-model.number="form.phone" autocomplete="off" minlength="11" maxlength="11" size="small" placeholder="请输入手机号"></el-input> |
|||
</el-form-item> |
|||
<el-form-item label="职务:" :label-width="formLabelWidth" prop="duty"> |
|||
<el-input v-model.number="form.duty" autocomplete="off" minlength="11" maxlength="11" size="small" placeholder="请输入手机号"></el-input> |
|||
</el-form-item> |
|||
<el-form-item label="住宿:" :label-width="formLabelWidth" prop="stay"> |
|||
<el-radio-group v-model="form.stay"> |
|||
<el-radio :label="0">不住</el-radio> |
|||
<el-radio :label="1">单间</el-radio> |
|||
<el-radio :label="2">双人标间</el-radio> |
|||
</el-radio-group> |
|||
</el-form-item> |
|||
<div class="meet-info"> |
|||
<p class="title-1">会议日程</p> |
|||
<p class="content">23日报到,24日全天会议,25日上午参观。</p> |
|||
<br> |
|||
<p class="title-1">免费提醒</p> |
|||
<p class="content">VIP食品企业嘉宾免收参会费用,并提供五星级酒店住宿;特邀食品企业免收一人参会费用。</p> |
|||
<br> |
|||
<p class="title-1">费用说明</p> |
|||
<p class="content">本次会议费800/人(包括资料费、餐费等),食宿由组委会统一安排,住宿参考官网-同期服务-酒店住宿,住宿费用自理。</p> |
|||
<br> |
|||
<p class="title-1">会议费用权益</p> |
|||
<p class="content">24日中午大会午餐、24日大会晚宴门票、会议资料袋、会刊及、会刊免费刊登参会企业信息。</p> |
|||
<br> |
|||
<p class="title-1">会刊填报方式</p> |
|||
<p class="content">登录官网-互联网大会-观众中心-会刊填报。</p> |
|||
<br> |
|||
<p class="title-1">汇款账户</p> |
|||
<p class="content"> |
|||
户名:中国食品和包装机械工业协会。<br> |
|||
开户银行:浦发银行北京北沙滩支行<br> |
|||
账号:91350155260000197<br> |
|||
|
|||
</p> |
|||
<br> |
|||
<p class="title-1">关于发票</p> |
|||
<p class="content">索取发票请登录官网-互联网大会-观众中心-发票申请,填写发票详细信息。</p> |
|||
</div> |
|||
<el-form-item label="验证码:" :label-width="formLabelWidth" prop="verificationCode"> |
|||
<el-input v-model="form.verificationCode" autocomplete="off" minlength="4" maxlength="4" size="small" style="width:180px;" placeholder="请输入验证码"></el-input> |
|||
<img id="codePic" :src="codeSrc" alt="点击刷新" class="code-pic" @click="refreshCode"/> |
|||
<img :src="_getImage('login','refresh.png')" alt="点击刷新" class="code-refresh" @click="refreshCode" /> |
|||
</el-form-item> |
|||
</el-form> |
|||
|
|||
|
|||
|
|||
</div> |
|||
|
|||
</el-col> |
|||
<el-col :span="1"><br></el-col> |
|||
<el-col :span="5"> |
|||
<p class="title2">主办单位</p> |
|||
<p class="line-height-2em">中国食品和包装机械工业协会</p> |
|||
<p class="title2">承办单位</p> |
|||
<p class="line-height-2em">中国食品工业互联网产业联盟</p> |
|||
<p class="title2">协办单位</p> |
|||
<p class="line-height-2em">中国联合装备集团有限公司</p> |
|||
<p class="line-height-2em">北京中轻合力国际展览有限公司</p> |
|||
</el-col> |
|||
</el-row> |
|||
|
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
name: "signup", |
|||
data() { |
|||
return { |
|||
code_url: config.CODE_URL, |
|||
form: { |
|||
name: '', |
|||
company: '', |
|||
email: '', |
|||
phone:'', |
|||
duty:'', |
|||
stay:'', |
|||
verificationCode:'', |
|||
t:'' |
|||
}, |
|||
codeSrc:'' |
|||
}; |
|||
}, |
|||
mounted() { |
|||
this.initData() |
|||
this.form.t = Math.random().toString().substring(0,13) |
|||
this.codeSrc = this.code_url + "/common/getVerificationCode/" + this.form.t; |
|||
}, |
|||
methods:{ |
|||
initData(){ |
|||
|
|||
}, |
|||
//刷新验证码 |
|||
refreshCode: function () { |
|||
this.form.t = Math.random().toString().substring(0,13) |
|||
document |
|||
.getElementById("codePic") |
|||
.setAttribute( |
|||
"src", |
|||
this.code_url + "/common/getVerificationCode/" + this.form.t |
|||
); |
|||
}, |
|||
} |
|||
}; |
|||
</script> |
|||
<style rel="stylesheet/scss" lang="scss" scoped> |
|||
.title { |
|||
position: relative; |
|||
color: #1e50ae; |
|||
font-size: 18px; |
|||
padding: 0 10px; |
|||
font-weight: bold; |
|||
font-family: 微软雅黑; |
|||
&::before { |
|||
content: " "; |
|||
position: absolute; |
|||
left: 0; |
|||
bottom: -25px; |
|||
width: 100%; |
|||
height: 4px; |
|||
background: #1e50ae; |
|||
} |
|||
} |
|||
.title2 { |
|||
position: relative; |
|||
color: #1e50ae; |
|||
font-size: 15px; |
|||
padding: 0 10px; |
|||
margin: 10px 0; |
|||
height: 40px; |
|||
font-weight: bold; |
|||
font-family: 微软雅黑; |
|||
&::before { |
|||
content: " "; |
|||
position: absolute; |
|||
left: 0; |
|||
bottom: 0; |
|||
width: 100px; |
|||
height: 4px; |
|||
background: #1e50ae; |
|||
} |
|||
&::after { |
|||
content: " "; |
|||
position: absolute; |
|||
left: 0; |
|||
bottom: 0; |
|||
width: 100%; |
|||
height: 1px; |
|||
background: #949494; |
|||
} |
|||
} |
|||
.signup-block { |
|||
position: relative; |
|||
margin: 50px; |
|||
.title-1 { |
|||
font-size: 14px; |
|||
font-weight: 600; |
|||
line-height: 30px; |
|||
} |
|||
.content { |
|||
color: #333333; |
|||
font-size: 14px; |
|||
line-height: 30px; |
|||
} |
|||
.code-pic { |
|||
position: relative; |
|||
margin: 0 5px; |
|||
border: 1px solid rgba(220, 220, 220, 1); |
|||
border-radius: 3px; |
|||
width: 90px; |
|||
height: 32px; |
|||
vertical-align: middle; |
|||
} |
|||
} |
|||
</style> |
Loading…
Reference in new issue