|
|
|
|
@ -1,37 +1,69 @@ |
|
|
|
|
<template> |
|
|
|
|
<div class="m-box-F"> |
|
|
|
|
<div class="m-banner-box"> |
|
|
|
|
<img class="img" src="../../assets/images/banner.png" alt=""> |
|
|
|
|
</div> |
|
|
|
|
<div class="m-intro-box" @click="goIntro"> |
|
|
|
|
<div class="m-left-intro"> |
|
|
|
|
<img class="img" src="../../assets/images/intro_left.png" alt=""> |
|
|
|
|
<span class="btn-text">会员邀请函</span> |
|
|
|
|
<div :class="heckIsMobile()?'m-box-F':'m-box-P'"> |
|
|
|
|
<div class="mobile-box-F" v-if="heckIsMobile()"> |
|
|
|
|
<div class="m-banner-box"> |
|
|
|
|
<img alt="" class="img" src="../../assets/images/banner.png"> |
|
|
|
|
</div> |
|
|
|
|
<img class="img" src="../../assets/images/intro_right.png" alt=""> |
|
|
|
|
</div> |
|
|
|
|
<div class="m-title">模板下载</div> |
|
|
|
|
<div class="btn-box"> |
|
|
|
|
<div class="btn red" @click="downloadDoc(1)"> |
|
|
|
|
<img class="img" src="../../assets/images/qiye_mo.png" alt=""> |
|
|
|
|
<span class="btn-text">单 / 位 / 模 / 板</span> |
|
|
|
|
<div class="m-intro-box" @click="goIntro"> |
|
|
|
|
<div class="m-left-intro"> |
|
|
|
|
<img alt="" class="img" src="../../assets/images/intro_left.png"> |
|
|
|
|
<span class="btn-text">会员邀请函</span> |
|
|
|
|
</div> |
|
|
|
|
<img alt="" class="img" src="../../assets/images/intro_right.png"> |
|
|
|
|
</div> |
|
|
|
|
<div class="m-title">模板下载</div> |
|
|
|
|
<div class="btn-box"> |
|
|
|
|
<div class="btn red" @click="downloadDoc(1)"> |
|
|
|
|
<img alt="" class="img" src="../../assets/images/qiye_mo.png"> |
|
|
|
|
<span class="btn-text">单 / 位 / 模 / 板</span> |
|
|
|
|
</div> |
|
|
|
|
<div class="btn grown" @click="downloadDoc(2)"> |
|
|
|
|
<img alt="" class="img" src="../../assets/images/geren_mo.png"> |
|
|
|
|
<span class="btn-text">个 / 人 / 模 / 板</span> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
<div class="btn grown" @click="downloadDoc(2)"> |
|
|
|
|
<img class="img" src="../../assets/images/geren_mo.png" alt=""> |
|
|
|
|
<span class="btn-text">个 / 人 / 模 / 板</span> |
|
|
|
|
<div class="m-title">信息填报</div> |
|
|
|
|
<div class="btn-box"> |
|
|
|
|
<div class="btn blue" @click="formCom"> |
|
|
|
|
<img alt="" class="img" src="../../assets/images/qiye_tian.png"> |
|
|
|
|
<span class="btn-text">单 / 位 / 填 / 报</span> |
|
|
|
|
</div> |
|
|
|
|
<div class="btn green" @click="formPer"> |
|
|
|
|
<img alt="" class="img" src="../../assets/images/geren_tian.png"> |
|
|
|
|
<span class="btn-text">个 / 人 / 填 / 报</span> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
<div class="m-title">信息填报</div> |
|
|
|
|
<div class="btn-box"> |
|
|
|
|
<div class="btn blue" @click="formCom"> |
|
|
|
|
<img class="img" src="../../assets/images/qiye_tian.png" alt=""> |
|
|
|
|
<span class="btn-text">单 / 位 / 填 / 报</span> |
|
|
|
|
<div class="pc-box-F" v-if="!heckIsMobile()"> |
|
|
|
|
<div class="title"> |
|
|
|
|
河北省非物质文化遗产保护协会欢迎您~ |
|
|
|
|
</div> |
|
|
|
|
<div class="btn green" @click="formPer"> |
|
|
|
|
<img class="img" src="../../assets/images/geren_tian.png" alt=""> |
|
|
|
|
<span class="btn-text">个 / 人 / 填 / 报</span> |
|
|
|
|
<div class="m-content"> |
|
|
|
|
<div class="content-left"> |
|
|
|
|
<img @click="goIntro" alt="" class="img" src="../../assets/images/pc-yao@2x.png"> |
|
|
|
|
</div> |
|
|
|
|
<div class="content-right"> |
|
|
|
|
<div class="content-right-top"> |
|
|
|
|
<div class="content-title">模板下载</div> |
|
|
|
|
<div class="content-btns"> |
|
|
|
|
<img @click="downloadDoc(1)" class="img" src="../../assets/images/pc-dwmo@2x.png" alt=""> |
|
|
|
|
<img @click="downloadDoc(2)" class="img" src="../../assets/images/pc-grmo@2x.png" alt=""> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
<div class="content-right-top"> |
|
|
|
|
<div class="content-title">信息填报</div> |
|
|
|
|
<div class="content-btns"> |
|
|
|
|
<img @click="formCom" class="img" src="../../assets/images/pc-dwtb@2x.png" alt=""> |
|
|
|
|
<img @click="formPer" class="img" src="../../assets/images/pc-grtb@2x.png" alt=""> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
<div class="m-feet"> |
|
|
|
|
协会联系电话：87870604、87024648转8206、8066 |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
|
|
|
|
|
<el-dialog |
|
|
|
|
:before-close="handleClose" |
|
|
|
|
:visible.sync="dialogVisible" |
|
|
|
|
@ -48,13 +80,14 @@ |
|
|
|
|
import axios from 'axios'; |
|
|
|
|
import {listMember} from "@/api/system/member"; |
|
|
|
|
import {listPersonalmember} from "@/api/system/personalmember"; |
|
|
|
|
|
|
|
|
|
export default { |
|
|
|
|
name: "welcome", |
|
|
|
|
data() { |
|
|
|
|
return { |
|
|
|
|
dialogVisible: true, |
|
|
|
|
memberList:[], |
|
|
|
|
personalmemberList:[], |
|
|
|
|
memberList: [], |
|
|
|
|
personalmemberList: [], |
|
|
|
|
// 查询参数 |
|
|
|
|
queryParams1: { |
|
|
|
|
pageNum: 1, |
|
|
|
|
@ -112,15 +145,25 @@ export default { |
|
|
|
|
this.getList(); |
|
|
|
|
|
|
|
|
|
const once = window.localStorage.getItem('once') |
|
|
|
|
if (once && once == '1'){ |
|
|
|
|
if (once && once == '1') { |
|
|
|
|
this.dialogVisible = false |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
setTimeout(()=>{ |
|
|
|
|
setTimeout(() => { |
|
|
|
|
this.handleClose() |
|
|
|
|
},3000) |
|
|
|
|
}, 3000) |
|
|
|
|
}, |
|
|
|
|
methods:{ |
|
|
|
|
methods: { |
|
|
|
|
heckIsMobile() { |
|
|
|
|
const userAgentInfo = navigator.userAgent; |
|
|
|
|
const mobileAgents = ['Android', 'iPhone', 'SymbianOS', 'Windows Phone', 'iPad', 'iPod']; |
|
|
|
|
for (let i = 0; i < mobileAgents.length; i++) { |
|
|
|
|
if (userAgentInfo.indexOf(mobileAgents[i]) > 0) { |
|
|
|
|
return true; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
return false; |
|
|
|
|
}, |
|
|
|
|
/** 查询单位会员列表 */ |
|
|
|
|
getList1() { |
|
|
|
|
this.loading = true; |
|
|
|
|
@ -135,15 +178,15 @@ export default { |
|
|
|
|
this.personalmemberList = response.rows; |
|
|
|
|
}); |
|
|
|
|
}, |
|
|
|
|
handleClose(){ |
|
|
|
|
handleClose() { |
|
|
|
|
this.dialogVisible = false |
|
|
|
|
window.localStorage.setItem('once','1') |
|
|
|
|
window.localStorage.setItem('once', '1') |
|
|
|
|
}, |
|
|
|
|
async downloadDoc(val) { |
|
|
|
|
let response = '' |
|
|
|
|
try { |
|
|
|
|
if (val == 1){ |
|
|
|
|
response = await axios.get('/doc/单位填报模版.docx', { |
|
|
|
|
if (val == 1) { |
|
|
|
|
response = await axios.get('/doc/单位填报模版.docx', { |
|
|
|
|
responseType: 'blob' // This is important |
|
|
|
|
}); |
|
|
|
|
// Create a link element, set the href to the blob URL, and trigger a click event |
|
|
|
|
@ -158,7 +201,7 @@ export default { |
|
|
|
|
link.remove(); |
|
|
|
|
window.URL.revokeObjectURL(url); |
|
|
|
|
} |
|
|
|
|
if (val == 2){ |
|
|
|
|
if (val == 2) { |
|
|
|
|
response = await axios.get('/doc/个人填报模版.docx', { |
|
|
|
|
responseType: 'blob' // This is important |
|
|
|
|
}); |
|
|
|
|
@ -178,25 +221,25 @@ export default { |
|
|
|
|
console.error('Error downloading the file', error); |
|
|
|
|
} |
|
|
|
|
}, |
|
|
|
|
formCom(){ |
|
|
|
|
if (this.memberList.length>0){ |
|
|
|
|
formCom() { |
|
|
|
|
if (this.memberList.length > 0) { |
|
|
|
|
const id = this.memberList[0].id |
|
|
|
|
this.$router.push('/member?id='+id) |
|
|
|
|
this.$router.push('/member?id=' + id) |
|
|
|
|
|
|
|
|
|
}else{ |
|
|
|
|
} else { |
|
|
|
|
this.$router.push('/member') |
|
|
|
|
} |
|
|
|
|
}, |
|
|
|
|
formPer(){ |
|
|
|
|
if (this.personalmemberList.length>0){ |
|
|
|
|
formPer() { |
|
|
|
|
if (this.personalmemberList.length > 0) { |
|
|
|
|
const id = this.personalmemberList[0].id |
|
|
|
|
this.$router.push('/personalmember?id='+id) |
|
|
|
|
this.$router.push('/personalmember?id=' + id) |
|
|
|
|
|
|
|
|
|
}else{ |
|
|
|
|
} else { |
|
|
|
|
this.$router.push('/personalmember') |
|
|
|
|
} |
|
|
|
|
}, |
|
|
|
|
goIntro(){ |
|
|
|
|
goIntro() { |
|
|
|
|
this.$router.push('/introContents') |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
@ -204,22 +247,22 @@ export default { |
|
|
|
|
</script> |
|
|
|
|
|
|
|
|
|
<style lang="scss" scoped> |
|
|
|
|
.m-box-F{ |
|
|
|
|
.m-box-F { |
|
|
|
|
background-color: #F4EACF; |
|
|
|
|
padding: 15px; |
|
|
|
|
width: 100%; |
|
|
|
|
height: 100vh; |
|
|
|
|
|
|
|
|
|
.m-banner-box{ |
|
|
|
|
.m-banner-box { |
|
|
|
|
width: 100%; |
|
|
|
|
height: fit-content; |
|
|
|
|
|
|
|
|
|
.img{ |
|
|
|
|
.img { |
|
|
|
|
width: 100%; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.m-intro-box{ |
|
|
|
|
.m-intro-box { |
|
|
|
|
width: 100%; |
|
|
|
|
height: 60px; |
|
|
|
|
display: flex; |
|
|
|
|
@ -230,20 +273,20 @@ export default { |
|
|
|
|
background-repeat: no-repeat; |
|
|
|
|
margin-top: 25px; |
|
|
|
|
|
|
|
|
|
.img{ |
|
|
|
|
.img { |
|
|
|
|
width: 18px; |
|
|
|
|
height: auto; |
|
|
|
|
margin-right: 20px; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.m-left-intro{ |
|
|
|
|
.m-left-intro { |
|
|
|
|
display: flex; |
|
|
|
|
align-items: center; |
|
|
|
|
color: #F4EACF; |
|
|
|
|
font-size: 16px; |
|
|
|
|
font-weight: 500; |
|
|
|
|
|
|
|
|
|
.img{ |
|
|
|
|
.img { |
|
|
|
|
width: 30px; |
|
|
|
|
height: auto; |
|
|
|
|
margin-right: 10px; |
|
|
|
|
@ -252,7 +295,7 @@ export default { |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.m-title{ |
|
|
|
|
.m-title { |
|
|
|
|
margin-top: 20px; |
|
|
|
|
margin-bottom: 20px; |
|
|
|
|
font-family: Source Han Sans SC; |
|
|
|
|
@ -262,13 +305,13 @@ export default { |
|
|
|
|
line-height: 20px; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.btn-box{ |
|
|
|
|
.btn-box { |
|
|
|
|
width: 100%; |
|
|
|
|
display: flex; |
|
|
|
|
align-items: center; |
|
|
|
|
justify-content: space-between; |
|
|
|
|
|
|
|
|
|
.btn{ |
|
|
|
|
.btn { |
|
|
|
|
width: 45%; |
|
|
|
|
height: 86px; |
|
|
|
|
display: flex; |
|
|
|
|
@ -278,7 +321,7 @@ export default { |
|
|
|
|
background-size: cover; |
|
|
|
|
background-repeat: no-repeat; |
|
|
|
|
|
|
|
|
|
.img{ |
|
|
|
|
.img { |
|
|
|
|
width: 34px; |
|
|
|
|
height: auto; |
|
|
|
|
margin-right: 15px; |
|
|
|
|
@ -290,24 +333,118 @@ export default { |
|
|
|
|
background-size: cover; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.btn-text{ |
|
|
|
|
.btn-text { |
|
|
|
|
color: #F4EACF; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
.btn.green{ |
|
|
|
|
|
|
|
|
|
.btn.green { |
|
|
|
|
background-image: url("../../assets/images/green.png"); |
|
|
|
|
} |
|
|
|
|
.btn.red{ |
|
|
|
|
|
|
|
|
|
.btn.red { |
|
|
|
|
background-image: url("../../assets/images/red.png"); |
|
|
|
|
} |
|
|
|
|
.btn.blue{ |
|
|
|
|
|
|
|
|
|
.btn.blue { |
|
|
|
|
background-image: url("../../assets/images/blue.png"); |
|
|
|
|
} |
|
|
|
|
.btn.grown{ |
|
|
|
|
|
|
|
|
|
.btn.grown { |
|
|
|
|
background-image: url("../../assets/images/brown.png"); |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
.m-box-P{ |
|
|
|
|
padding: 15px; |
|
|
|
|
width: 100%; |
|
|
|
|
height: 100vh; |
|
|
|
|
background-image: url("../../assets/images/banner2@2x.png"); |
|
|
|
|
background-repeat: no-repeat; |
|
|
|
|
background-size: cover; |
|
|
|
|
|
|
|
|
|
.pc-box-F{ |
|
|
|
|
max-width: 1200px; |
|
|
|
|
margin: 0 auto; |
|
|
|
|
|
|
|
|
|
.title{ |
|
|
|
|
font-family: Songti SC; |
|
|
|
|
font-weight: 900; |
|
|
|
|
font-size: 24px; |
|
|
|
|
color: #723233; |
|
|
|
|
text-align: center; |
|
|
|
|
margin: 50px 0; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.m-content{ |
|
|
|
|
display: flex; |
|
|
|
|
margin-top: 110px; |
|
|
|
|
|
|
|
|
|
.content-left{ |
|
|
|
|
width: 390px; |
|
|
|
|
height: 500px; |
|
|
|
|
margin-right: 70px; |
|
|
|
|
|
|
|
|
|
.img{ |
|
|
|
|
width: 100%; |
|
|
|
|
height: auto; |
|
|
|
|
transition: all ease-in-out 0.5s; |
|
|
|
|
cursor: pointer; |
|
|
|
|
opacity: 0.8; |
|
|
|
|
} |
|
|
|
|
.img:hover{ |
|
|
|
|
scale: 1.1; |
|
|
|
|
opacity: 1; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.content-right{ |
|
|
|
|
width: 700px; |
|
|
|
|
display: flex; |
|
|
|
|
flex-direction: column; |
|
|
|
|
align-items: center; |
|
|
|
|
justify-content: space-between; |
|
|
|
|
|
|
|
|
|
.content-right-top{ |
|
|
|
|
display: flex; |
|
|
|
|
flex-direction: column; |
|
|
|
|
width: 100%; |
|
|
|
|
.content-title{ |
|
|
|
|
margin: -50px 0 20px; |
|
|
|
|
} |
|
|
|
|
.content-btns{ |
|
|
|
|
display: flex; |
|
|
|
|
width: 100%; |
|
|
|
|
align-items: center; |
|
|
|
|
justify-content: space-between; |
|
|
|
|
|
|
|
|
|
.img{ |
|
|
|
|
width: 320px; |
|
|
|
|
height: auto; |
|
|
|
|
transition: all ease-in-out 0.5s; |
|
|
|
|
cursor: pointer; |
|
|
|
|
opacity: 0.8; |
|
|
|
|
} |
|
|
|
|
.img:hover{ |
|
|
|
|
scale: 1.1; |
|
|
|
|
opacity: 1; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.m-feet{ |
|
|
|
|
font-family: Source Han Sans SC; |
|
|
|
|
font-weight: 500; |
|
|
|
|
font-size: 20px; |
|
|
|
|
color: #723233; |
|
|
|
|
line-height: 40px; |
|
|
|
|
text-align: center; |
|
|
|
|
margin: 100px 0 0; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
::v-deep .m-dialog { |
|
|
|
|
.el-dialog { |
|
|
|
|
margin-top: 36vh !important; |
|
|
|
|
@ -321,12 +458,13 @@ export default { |
|
|
|
|
// left: 50%; |
|
|
|
|
// transform: translateX(-25%); |
|
|
|
|
// |
|
|
|
|
.el-dialog__close{ |
|
|
|
|
//font-size: 22px; |
|
|
|
|
//background: #fff; |
|
|
|
|
//border-radius: 50%; |
|
|
|
|
color: #723233; |
|
|
|
|
} |
|
|
|
|
.el-dialog__close { |
|
|
|
|
//font-size: 22px; |
|
|
|
|
//background: #fff; |
|
|
|
|
//border-radius: 50%; |
|
|
|
|
color: #723233; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
//} |
|
|
|
|
|
|
|
|
|
.el-dialog__body { |
|
|
|
|
|
