<template>
|
|
<view class="page-wapper">
|
|
<view class="a-card">
|
|
<view class="title"></view>
|
|
<view class="context">
|
|
<view class="content-around">
|
|
<view class="con-title">致用户书</view>
|
|
<p>欢迎登陆和使用 @兼兼街 本地化兼职信息服务平台,您可以在这里查看到每日最新的兼职信息更新,最新的哦 : ( </p>
|
|
<p>本台分设长沙街超多本地兼职正在筹备,值得一提的是西安街和广州街是新上花旦福利更多哦!</p>
|
|
<p>当然,如果您在找兼职的过程中存在什么疑惑,遇到了什么问题,请您第一时间联系我们的客服,都是可爱又温柔的小姐级哦!</p>
|
|
<p>最后一步,请您关注我们的公众号,或者微信搜索 兼兼街,看完点关注回家不迷路!更多精彩,我们来日方长</p>
|
|
</view>
|
|
</view>
|
|
<view class="bottom-bgr">
|
|
<view style="width: 100%; height: 100%; position: relative;">
|
|
<view class="foot-font">
|
|
<p>联系微信:jianjianjie_1688</p>
|
|
<p>合作联系:湖南瀚海黎明信息科技</p>
|
|
</view>
|
|
<view class="qrcode">
|
|
<view class="cool-button" @click="onclick()">👉去关注</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import html2canvas from 'html2canvas';
|
|
import uQRCode from '@/common/uqrcode.js'
|
|
|
|
export default{
|
|
data(){
|
|
return{
|
|
userInfo: {},
|
|
role:0,
|
|
cellList: [],
|
|
base64: ''
|
|
}
|
|
},
|
|
onShow() {
|
|
|
|
},
|
|
onReady() {
|
|
this.$com.displayNav()
|
|
},
|
|
methods:{
|
|
onclick:() => {
|
|
window.location = "https://mp.weixin.qq.com/mp/profile_ext?action=home&__biz=MzkzMzI2NDc1Ng==#wechat_redirect"
|
|
|
|
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
|
|
<style lang="scss">
|
|
.page-wapper {
|
|
width: 100vw;
|
|
height: 100vh;
|
|
background-color: #3da8ff;
|
|
|
|
|
|
.a-card {
|
|
width: 600rpx;
|
|
height: 880rpx;
|
|
background-color: #fff;
|
|
position: absolute;
|
|
top: calc(50vh - 484rpx);
|
|
left: calc(50vw - 300rpx);
|
|
border-radius: 20rpx;
|
|
box-shadow: 20rpx 10rpx 20rpx 10rpx #345dc7;
|
|
|
|
.title {
|
|
width: 36%;
|
|
height: 80rpx;
|
|
position: absolute;
|
|
left: 200rpx;
|
|
top: 60rpx;
|
|
// background: url("@/static/5.jpg");
|
|
background-size: 100% 100% ;
|
|
background-position: 40% 75%;
|
|
}
|
|
.context {
|
|
|
|
position: absolute;
|
|
left: 40rpx;
|
|
top: 178rpx;
|
|
width: 480rpx;
|
|
|
|
p {
|
|
text-indent: 2em;
|
|
}
|
|
|
|
.content-around {
|
|
color: #999;
|
|
font-size: 24rpx;
|
|
line-height: 34rpx;
|
|
|
|
.con-title {
|
|
background-color: #3871ce;
|
|
color: #FFF;
|
|
width: 120rpx;
|
|
height: 45rpx;
|
|
line-height: 45rpx;
|
|
border-bottom-right-radius: 70rpx;
|
|
border-top-left-radius: 70rpx;
|
|
box-shadow: 10rpx 5rpx 20rpx 10rpx rgba(0, 0, 0, .1);
|
|
|
|
font-size: 30rpx;
|
|
font-weight: 500;
|
|
margin: 20rpx 0;
|
|
padding: 0 40rpx;
|
|
}
|
|
}
|
|
|
|
}
|
|
.bottom-bgr {
|
|
width: 100%;
|
|
height: 180rpx;
|
|
position: absolute;
|
|
left: 0;
|
|
bottom: 0;
|
|
background: url("@/static/4.png");
|
|
background-size: 160% 100% ;
|
|
background-position: 40% 75%;
|
|
|
|
.foot-font {
|
|
position: absolute;
|
|
bottom: 20rpx;
|
|
left: 40rpx;
|
|
font-size: 20rpx;
|
|
line-height: 24rpx;
|
|
color: #222;
|
|
}
|
|
.qrcode {
|
|
position: absolute;
|
|
bottom: 20rpx;
|
|
right: -200rpx;
|
|
width: 400rpx !important;
|
|
}
|
|
}
|
|
|
|
.cool-button {
|
|
font-weight: 900;
|
|
font-size: 40rpx;
|
|
color: white;
|
|
background-color: rgba(1, 1, 1, .0);
|
|
border: none;
|
|
|
|
text-align: left;
|
|
text-decoration: none;
|
|
display: inline-block;
|
|
margin: 4px 2px;
|
|
cursor: pointer;
|
|
transition-duration: 0.4s;
|
|
}
|
|
.cool-button:active {
|
|
transform: translateX(30rpx);
|
|
}
|
|
}
|
|
}
|
|
|
|
.page-wapper {
|
|
background: linear-gradient(to bottom, #345dc7, #00FFFF, #3da8ff);
|
|
background-size: 200% 200%;
|
|
animation: gradient 20s ease infinite;
|
|
}
|
|
|
|
@keyframes gradient {
|
|
0% { background-position: 0% 0%; } /* 背景位置从左上角开始 */
|
|
50% { background-position: 100% 100%; } /* 背景位置变化到右下角 */
|
|
100% { background-position: 0% 0%; } /* 背景位置回到左上角 */
|
|
}
|
|
</style>
|