兼兼街公众号代码
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 

177 lines
4.1 KiB

<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>