Files
video_app/me/message/new/first.vue
2024-12-31 17:41:32 +08:00

299 lines
11 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<template>
<view>
<u-navbar title=" " :title-size="32" title-color="#000000" :is-back="false" :background="background">
<view class="u-p-l-30 font-bold u-font-40 ">
<text class="font-lob color-23 ">百灵相机</text>
</view>
</u-navbar>
<view>
<image src="@/me/static/ymf/1b3d78fa5f92af069751ea64d493c0d85050b1e03cc5b-tPC378.png" mode=""></image>
<image src="@/me/static/ymf/390e926273eea85c894e613d42c9931ee2cd1f0a200fd-ApyNVV.png" mode=""></image>
<image src="@/me/static/ymf/79cbb0e34c24915f1883feaa3cf3179b0a1ceb1362a18-unU6xQ.png" mode=""></image>
<image src="@/me/static/ymf/cb319b604e49b816971b708b1231321318e0023610d8c-I24hXU.jpg" mode=""></image>
<image src="@/me/static/ymf/cf2d172a6da494b2e577f699254a780907b7c222246d7-ehahn1.png" mode=""></image>
<image src="@/me/static/ymf/eaae3095c9e433fb8a015aaebbe52047009dd863ff2b9-igSItK.png" mode=""></image>
<image src="@/me/static/ymf/f3c60c6f31c74bdf38ba2d8993bcb443ab9bc335cc875-xfx4CJ.png" mode=""></image>
<image src="@/me/static/ymf/c93b4cc9363d52cba140f7239516344ece9388141079a4-do8mFc.png" mode=""></image>
<image src="@/me/static/ymf/031da1e7f043de5d5e1ee355994a93e5ec983aca44dc-sZf0Vl_fw1200.jpg" mode=""></image>
<image src="@/me/static/ymf/c4e6c5023b94de32df2f51d9ebd633790cc6125a88e4-TIyAcR_fw1200.jpg" mode=""></image>
<image src="@/me/static/ymf/f7da7a8ca57f9f0d56bbb3d7be1d1c86f96304ce4b3a-iVbD8U_fw1200.jpg" mode=""></image>
<image src="@/me/static/ymf/2e521eee5a8c80ea6879028ee866c5d0531bc4f1d5e48-Bh95lN_fw1200.jpg" mode=""></image>
<image src="@/me/static/ymf/38cf4e97e52b50be9dcdcdc1352c497e1acc9266cd52-aUOrxn_fw1200.webp" mode=""></image>
<image src="@/me/static/ymf/73170e6a596b72538dbe743b06ef8b96e4885aff5b4c3-MsouS7_fw1200.jpg" mode=""></image>
<image src="@/me/static/ymf/e9f9cb6b95c21c714015f15c372f595367aa553f443a-WpOCNo_fw1200.webp" mode=""></image>
<image src="@/me/static/ymf/f5d96faaa94cb0151a5c95db44e27b80ed6eeac5cb32-rApi2S_fw1200.webp" mode=""></image>
<image src="@/me/static/ymf/0e114b9ac6afc2b4c0f29520178be64915a111e218a8b5-mbMpg2_fw1200.jpg" mode=""></image>
<image src="@/me/static/ymf/4783f7272bf31eeafbe1362605477de14b7cd3da24b0-ggkAnW_fw658webp.webp" mode=""></image>
<image src="@/me/static/ymf/8dce1d3c3a8287c35bc1bf394048d57a64acfa047d4e-6wXnWE_fw658webp.webp" mode=""></image>
<image src="@/me/static/ymf/ff919b6254e376cc902c89afdcc194ac2ab39c93793b-8TdL1Z_fw658webp.webp" mode=""></image>
<image src="@/me/static/ymf/3c9a5848127a67f98e25176a042511b89afd31daccc2f-5EHbxD_fw658webp.webp" mode=""></image>
<image src="@/me/static/ymf/6c9e57bcbcb047039a8edb30ecdd3b912bac99555a8fc-9EK0oO_fw658webp.webp" mode=""></image>
<image src="@/me/static/ymf/78a020586cfbb791918b767520a8ff3c2ab9660f1ee1b-GX4zcc_fw658webp.webp" mode=""></image>
<image src="@/me/static/ymf/babf535567728d84346fbb13348e94aae3ec8f82106e2-QKPJoe_fw658webp.webp" mode=""></image>
<image src="@/me/static/ymf/d1e4d760358ba0733faee6bcad1e23cb4a1d6d76ba290-O3hUrf_fw240webp.webp" mode=""></image>
<image src="@/me/static/ymf/dcb5a4b0b1060b569f9fc618e6e2708b584f7def1cadf-R7jpIr_fw658webp.webp" mode=""></image>
<image src="@/me/static/ymf/e4330f184149f502f4948ce3b60059edaffc9c3d94ca4-B11p5c_fw658webp.webp" mode=""></image>
<image src="@/me/static/ymf/fa22e2a27871e5f8841e8abb12cc4347a6b9440816068-3XsAnJ_fw658webp.webp" mode=""></image>
</view>
<view class="fixed u-flex u-flex-col" v-if="showtips">
<!-- <view class="w-full u-p-l-60" style="margin-top: 60px;">
<view class="u-flex w-full">
<view class=" font-bold color-000" style="color: rgb(225, 192, 138);font-size: 52rpx;">
<text class="font-lob">百灵相机</text>
</view>
<view class="u-font-40 font-lob color-fff u-m-l-20 ">轻松创建酷炫写真</view>
</view>
<view class="u-m-t-40 u-font-28 font-lob w-full" style="color: #eee;">
上传一张照片选择模板快速生成写真照
</view>
</view> -->
<view class="w-full">
<u-swiper mode="none" bg-color="transparent" border-radius="0" :interval="6000" :list="list" img-mode="aspectFill" :height="height">
</u-swiper>
</view>
<view class="u-absolute bottom u-p-l-30 ">
<view class="u-flex u-p-r-30 u-row-between">
<view class="step1 step u-flex u-flex-col u-row-center u-col-center">
<view class="img-box u-flex">
<image src="/static/1.jpg" style="height: 280rpx;width: 210rpx;" mode="aspectFill"></image>
</view>
<view class="u-m-t-20 color-000 font-bold">制作数字分身</view>
<view class="u-absolute u-flex">
<view>STEP</view>
<view class="u-m-l-20 main-text-color">1</view>
</view>
<view class="youjian">
<image src="/static/arrow-right.png" mode=""></image>
</view>
</view>
<view class="step1 step u-flex u-flex-col u-row-center u-col-center">
<view class="img-box u-flex">
<image src="/static/1.jpg" style="height: 280rpx;width: 210rpx;" mode="aspectFill"></image>
</view>
<view class="u-m-t-20 color-000 font-bold">生产写真</view>
<view class="u-absolute u-flex">
<view>STEP</view>
<view class="u-m-l-20 main-text-color">2</view>
</view>
<view class="youjian">
<image src="/static/arrow-right.png" mode=""></image>
</view>
</view>
<view class="step1 step u-flex u-flex-col u-row-center u-col-center">
<view class="img-box u-flex">
<image src="/static/1.jpg" style="height: 280rpx;width: 210rpx;" mode="aspectFill"></image>
</view>
<view class="u-m-t-20 color-000 font-bold">精修下载</view>
<view class="u-absolute u-flex">
<view>STEP</view>
<view class="u-m-l-20 main-text-color">3</view>
</view>
</view>
</view>
<view class="u-flex u-row-between u-m-t-60 u-p-b-60">
<u-icon name="setting" color="#232323" :size="40" @click="$u.route('/pages/setting/setting')"></u-icon>
<view class="u-m-l-60 u-m-r-60 u-flex-1">
<my-button @click="popshow">制作数字分身</my-button>
</view>
<view class="font-lob color-23 liaojie" @click="$u.route('/pages/liaojie/liaojie')">
<view>了解</view>
<view>百灵</view>
</view>
</view>
</view>
<my-pop ref="myPop" :closeable="false">
<view slot="top" class="u-text-center">用户隐私保护提示</view>
<view>
<scroll-view scroll-y="true" style="height: 500rpx;">
<u-parse :html="content"></u-parse>
</scroll-view>
</view>
<view slot="bottom" class=" u-flex u-p-l-40 u-p-r-40 u-flex u-row-between">
<view class="u-flex-1 u-p-r-16">
<my-button type="cancel" @click="close">不同意并退出</my-button>
</view>
<view class="u-flex-1 u-p-l-16">
<my-button @click="next">同意并继续</my-button>
</view>
</view>
</my-pop>
<my-login ref="myLogin"></my-login>
<!-- <view class="box u-m-t-40 u-flex-1 w-full">
<view class="color-000 u-text-center font-bold u-font-40 u-m-t-20">海量模板任你选</view>
<view class="u-m-t-40">
<u-swiper bg-color="transparent" :interval="3000" :list="list" img-mode="aspectFit"
:height="height">
</u-swiper>
</view>
<view class="u-m-t-40" style="padding: 0 150rpx;">
<my-button @click="iKnow" shape="circle">玩起来</my-button>
</view>
</view> -->
</view>
</view>
</template>
<script>
import config from '@/common/config/config.js'
export default {
data() {
return {
content:`
欢迎您使用“百灵相机”!
百灵相机由未序网络科技 (上海)有限公司为您提供服。
1.当您注册/登录百灵相机时,我们将收集您的手机号码:当您使用浏览/生成照片/分享/下载等基本功能时,我们将收集您的设备信息、日志信息等信息:当您使用支付功能时,我们将收集您的交易信息。我们仅会根据您使用我们的产品/服务的具体功能需求,收集必要的个人信息,具体您可查阅《隐私政策》快速了解我们收集和使用您个人信息的情况。
2.当您使用信息上传/下载功能时,我们将可能会申请调用您的相册/相机权限。我们将在首次调用时询问您是否允许使用该权限,您有权拒绝或取消授权,具体您可查阅《隐私协议》
`,
background: {
background: 'transparent'
},
bj: '/static/1.jpg',
showtips: false,
list: [],
height: 600
}
},
onReady() {
},
onLoad() {
uni.hideTabBar()
const _this = this
uni.getSystemInfo({
success(res) {
console.log(res);
_this.height = res.windowHeight*2*0.7
}
})
const first = uni.getStorageSync('first')
console.log(first === '');
if (first === '' || first) {
return this.init()
}
uni.switchTab({
url: '/pages/index/index2'
})
},
methods: {
close(){
this.$refs.myPop.close()
},
next(){
this.$refs.myLogin.open()
return
uni.setStorageSync('first', false)
uni.switchTab({
url: '/pages/index/index2'
})
},
popshow(){
this.$refs.myPop.open()
},
async init() {
this.showtips = true
this.list=[
'http://xz.brainybot.cc/v/template/7n701dqVh1frU2eEoJLSZqnHStfs03t1.jpg',
'http://xz.brainybot.cc/v/template/bEi6CWC5A1RrJQunEtdS1ToXXaDVh0Z4.jpg',
'http://xz.brainybot.cc/v/template/ISA4OSt7yqUxgXpauRP5MGUGPXzg3GUe.jpg',
'http://xz.brainybot.cc/v/template/hlE8eZW4fFWNLWBzvaZWvjpdLxNTHUjZ.jpg',
'http://xz.brainybot.cc/v/template/JgtgVK4ZKg5WuVOxjObn0seMlHks18O1.jpg']
const res = await this.$api({
url: "cms/example"
})
// this.list = res.data.welcome_Images || [
// 'http://xz.brainybot.cc/v/template/7n701dqVh1frU2eEoJLSZqnHStfs03t1.jpg',
// 'http://xz.brainybot.cc/v/template/bEi6CWC5A1RrJQunEtdS1ToXXaDVh0Z4.jpg',
// 'http://xz.brainybot.cc/v/template/ISA4OSt7yqUxgXpauRP5MGUGPXzg3GUe.jpg',
// 'http://xz.brainybot.cc/v/template/hlE8eZW4fFWNLWBzvaZWvjpdLxNTHUjZ.jpg',
// 'http://xz.brainybot.cc/v/template/JgtgVK4ZKg5WuVOxjObn0seMlHks18O1.jpg'
// ]
},
iKnow() {
uni.setStorageSync('first', false)
uni.switchTab({
url: '/pages/index/index2'
})
}
}
}
</script>
<style lang="scss" scoped>
/deep/ .u-border-bottom:after {
border-bottom-color:transparent;
}
.color-23{
color: #232323;
}
.box {
background-color: #fff;
padding: 30rpx;
border-radius: 18rpx;
}
.bottom{
padding-top: 40rpx;
border-radius: 100rpx 100rpx 0 0;
background-color: #fff;
left: 0;
right: 0;
bottom: 0;
}
.fixed {
left: 0;
right: 0;
bottom: 0;
top: 0;
z-index: 1;
background-size: cover;
}
.img-box{
border-radius: 300rpx 300rpx 0 0;
overflow: hidden;
}
.step{
position: relative;
border: 2px solid #1A1A1A;
border-radius: 300rpx;
padding-bottom: 60rpx;
.u-absolute{
padding-left: 4px;
left: 0;
bottom: 0;
font-size: 36rpx;
right: 0;
color: #fff;
font-weight: bold;
-webkit-text-stroke:4px transparent;
background:#222;
-webkit-background-clip: text;
// text-shadow: 2px 2px 0 #222,
// -2px 2px 0 #222,
// 2px -2px 0 #222,
// -2px -2px 0 #222;
}
.youjian{
position: absolute;
left: 95%;
z-index: 3;
image{
width: 40rpx;
height: 40rpx;
}
}
}
.liaojie{
border-top: 1px solid #232323;
border-left: 1px solid #232323;
height: 80rpx;
border-bottom: 1px solid #232323;
padding-left: 30rpx;
border-radius: 100rpx 0 0 100rpx;
}
</style>