bnyer
/
bnyer-cloud-tiktok
1
0
Fork 0
Code Issues Pull Requests Projects Releases 1 Wiki Activity
Browse Source

feature:流量主及AI绘画细节优化

feature-1.0
Penny 3 years ago
parent
4ddfab099a
commit
01e3fec032
5 changed files with 108 additions and 167 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 5
      api/paint.js
  2. 111
      pages/ai/paint/paint.vue
  3. 19
      pages/ai/paint/paintDetail.vue
  4. 46
      pages/creator/imgDetail.vue
  5. 94
      utils/tiktokAd.js

5
api/paint.js
View File

@ -39,12 +39,11 @@ export function getAiPaintPage(data) {
}
// 检查某平台用户当日ai绘画次数是否超标
export function checkUserCanAiPaint(data, headers) {
export function checkUserCanAiPaint(data) {
return request({
url: `${serviceTitle}${prefix}/checkUserCanAiPaint`,
method: 'post',
data,
headers: headers
data
})
}

111
pages/ai/paint/paint.vue
View File

@ -86,8 +86,7 @@
<script>
import base64ToImg from '@/utils/base64Utils';
import {getPaintStyle, getPrompt, textToImg} from '@/api/paint.js';
import tiktokAd from '@/utils/tiktokAd.js'
import {getPaintStyle, getPrompt, textToImg, checkUserCanAiPaint} from '@/api/paint.js';
export default {
data() {
return {
@ -102,8 +101,8 @@
checkPrompt: undefined, //true填了内容;false未填内容
checkStyleBox: undefined, //true选了创作风格;false未选创作风格
checkSize: undefined, //true选了画布大小;false未选画布大小
checkCanPaint: false, //true已达到最大绘画上限;false未达最高上限
},
advertise: '0qfnoa4053uwkefbas',
userInfo: {},
noClick:true, //防止重复提交
promptList: [],
@ -138,31 +137,26 @@
},
onLoad() {
this.checkLogin();
this.getPaintStyleList();
this.getPrompt();
//this.initReward();//加载广告
//tiktokAd.rewarded.load('0qfnoa4053uwkefbas');
},
onShow() {
//进入页面清空原始属性
this.formData.height = undefined;
this.formData.width = undefined;
this.formData.modelName = undefined;
this.formData.styleName = undefined;
this.formData.promptText = undefined;
this.size_active = 0;
this.style_active = 0;
this.prompt_active = 0;
this.checkLogin();
this.checkUserCanAiPaint();
},
methods: {
//加载广告实例
initReward(){
let that = this;
//console.log('that.advertise',that.advertise)
tiktokAd.rewarded.load('0qfnoa4053uwkefbas', () => {
console.log('进入了广告');
// uni.setClipboardData({
// data: that.draw.draw_text
// })
})
},
//翻译
//判断是否登录
checkLogin(){
let that = this;
@ -170,37 +164,44 @@
console.log('userInfo：',that.userInfo)
let token = uni.getStorageSync('token');
if((Object.keys(that.userInfo).length==0) && (Object.keys(token).length==0)){
uni.showModal({
title:'提示',
content:'您还没有登录!点击确定跳转登录界面以体验服务',
success(res) {
if (res.confirm) {
//跳转登录界面
uni.switchTab({
url: '/pages/userInfo/userInfo'
});
}else if(res.cancel){
uni.showToast({
title:'登录获取更好的服务体验哟!',
duration: 2000
});
}
}
});
console.error('尚未登录!');
// uni.showModal({
// title:'提示',
// content:'您还没有登录!点击确定跳转登录界面以体验服务',
// success(res) {
// if (res.confirm) {
// //跳转登录界面
// uni.switchTab({
// url: '/pages/userInfo/userInfo'
// });
// }else if(res.cancel){
// uni.showToast({
// title:'登录获取更好的服务体验哟!',
// duration: 2000
// });
// }
// }
// });
}
},
//传递参数到下个界面开始绘图
startPaint(){
//tiktokAd.rewarded.show();
//判断必填项是否都填了
const that = this;
//console.log('that.checkData.checkCanPaint',that.checkData.checkCanPaint)
//判断是否可进行ai绘画
if(that.checkData.checkCanPaint === true){
return uni.showToast({
title: '当日绘画次数已用完,请明日再来!',
icon: 'none'
})
}
//判断必填项是否都填了
//console.log('创作prompt为：',that.formData.promptText)
// console.log('创作尺寸高度为：',that.formData.height)
// console.log('创作尺寸宽度为：',that.formData.width)
//console.log('创作风格为：',that.formData.styleName)
if(that.formData.promptText == undefined){
console.log('test1111')
uni.showToast({
title: '请输入提示词!',
duration: 1000,
@ -232,7 +233,9 @@
modelName: that.formData.modelName,
styleName: that.formData.styleName,
painterId: that.userInfo.id,
painterName: that.userInfo.username
painterName: that.userInfo.username,
appType: 0,
platform: 0
}
uni.navigateTo({
url: './paintDetail?data='+JSON.stringify(data)
@ -321,6 +324,30 @@
this.promptText = this.promptList[this.prompt_active].text
},
//判断是否达到免费AI绘画次数上限
async checkUserCanAiPaint(){
let that = this;
const data = {
userId: that.userInfo.id,
platform: 0,
appType: 0
}
const res = await checkUserCanAiPaint(data);
//console.log('res绘画',res)
if(res.data.code === 200){
if(res.data.data === true){
that.checkData.checkCanPaint = true;
}else{
that.checkData.checkCanPaint = false;
}
}else{
return uni.showModal({
content: '检查绘画上限失败！',
showCancel: false
});
}
},
//获取绘画风格
async getPaintStyleList() {
const res = await getPaintStyle();

19
pages/ai/paint/paintDetail.vue
View File

@ -1,5 +1,5 @@
<template>
<view class="container">
<view class="container" :style="{backgroundColor: 'black',width: 100 + '%',height: 100 + '%'}">
<!-- 图片绘制区域 -->
<view class="paint">
<view class="cover" v-if="successFlag === false">
@ -18,6 +18,7 @@
</view>
</view>
<!-- <view class="complete" :style="{backgroundImage: 'url(' + transImg + ')'}"> -->
<view class="complete">
<!-- prompt关键词 -->
<view class="keywords">
@ -78,18 +79,12 @@
</view>
</view>
<!-- 底部流量主 -->
<!-- <view class="ad" v-if="spool.video.status == 10"> -->
<view class="ad">
<ad :unit-id="spool.video.id" ad-type="video" ad-theme="white"></ad>
</view>
</view>
</template>
<script>
import base64ToImg from '@/utils/base64Utils';
import rewarded from '@/utils/tiktokAd.js'
import { textToImg} from '@/api/paint.js';
import {loginTiktok} from '@/api/auth.js'
export default {
@ -398,6 +393,7 @@
base64ToImg(str,res =>{
console.log('解析出的图片路径为:',res)
this.transImg = res;
//将complate的css底图改成此
});
},
},
@ -497,11 +493,14 @@
align-items: flex-start;
margin-top: 15rpx;
.style {
display: flex;
flex-direction: row;
align-items: flex-start;
margin-top: 30rpx;
color:#fff;
font-weight: bolder;
.i {
//background-color: #fff;
@ -514,7 +513,7 @@
.text {
font-size: 40rpx;
font-weight: bolder;
color: #000000;
color: #fff;
background-color: #1A94BC1A;
}
}
@ -530,10 +529,11 @@
.keywords {
width: 90%;
margin: 0 auto;
background-color: #1A94BC1A;
//background-color: #1A94BC1A;
padding: 15rpx;
border-radius: 10rpx;
margin-top: 15rpx;
font-weight: bolder;
.content {
display: -webkit-box;
@ -541,6 +541,7 @@
-webkit-line-clamp: 2;
/*这里设置几行*/
overflow: hidden;
color: #fff;
}
}
}

46
pages/creator/imgDetail.vue
View File

@ -48,7 +48,6 @@
checkUserCanDownload// 检查某平台用户当日下载次数是否超标
} from '@/api/creator.js'
import {loginTiktok} from '@/api/auth.js'
// import tiktokAd from '@/utils/tiktokAd.js'
export default {
data() {
return {
@ -79,12 +78,9 @@
//随机选择一个激励视频广告初始化
let num = Math.floor(Math.random() * this.adList.length + 1)-1;
//console.log('随机激励视频id为：',this.adList[num])
//tiktokAd.rewarded.load(this.adList[num])
this.loadAdvertise(this.adList[num]);
},
onShow() {
console.log('进入onshow')
//tiktokAd.rewarded.load(this.adList[num])
//this.achieveSaveImg();
},
onHide() {
@ -131,7 +127,7 @@
})
that.videoAd = videoAd
videoAd.onLoad(() => {
console.log('激励视频广告'+adId+'加载成功')
//console.log('激励视频广告'+adId+'加载成功')
})
videoAd.onError((err) => {
that.err()
@ -140,11 +136,11 @@
if (res && res.isEnded || res === undefined) {
// 正常播放结束，可以下发游戏奖励
that.isplayOver = true;
console.log('激励视频广告观看完毕',that.isplayOver)
//console.log('激励视频广告观看完毕',that.isplayOver)
that.achieveSaveImg();
} else {
that.isplayOver = false;
console.log('激励视频广告尚未看完',that.isplayOver)
//console.log('激励视频广告尚未看完',that.isplayOver)
uni.showToast({
title: '您还没有看完视频，无法下载图片',
icon: 'none'
@ -158,8 +154,8 @@
showAdvertise(url){
let videoAd = this.videoAd
this.downloadUrl = url;
console.log('看广告时传入进来的url',url);
console.log('this.downloadUrl看广告时',this.downloadUrl);
//console.log('看广告时传入进来的url',url);
//console.log('this.downloadUrl看广告时',this.downloadUrl);
videoAd.show().catch(() => {
// 失败重试
videoAd.load()
@ -318,13 +314,14 @@
likeCollect(val) {
if (!this.userInfo) {
this.getUserInfoLogin(res => {
succ
this.lickOrCollect(val)
})
} else {
this.lickOrCollect(val)
}
},
async loginFunc(res, userInfo, callBack) {
const params = {
code: res.code,
@ -487,15 +484,15 @@
if(that.isplayOver){
//观看完广告，可下载图片
let url = that.downloadUrl;
console.log('that.downloadUrl观看完广告',that.downloadUrl);
console.log('url观看完广告',url);
//console.log('that.downloadUrl观看完广告',that.downloadUrl);
//console.log('url观看完广告',url);
uni.showLoading({
title: '正在保存图片...',
success() {
//获取用户的当前设置。获取相册权限
uni.getSetting({
success(res){
console.log('授权res',res)
//console.log('授权res',res)
//如果没有相册权限
if (!res.authSetting["scope.album"]) {
//向用户发起授权请求
@ -575,18 +572,18 @@
});
} else {
//如果已有相册权限，直接保存图片到系统相册
console.log('已有相册权限,开始保存图片',url);
//console.log('已有相册权限,开始保存图片',url);
//授权成功保存图片到系统相册
uni.downloadFile({
url,
success: (res) => {
console.log('进入图片下载',res);
//console.log('进入图片下载',res);
if (res.statusCode === 200) {
uni.saveImageToPhotosAlbum({
//图片路径，不支持网络图片路径
filePath: res.tempFilePath,
success: (res) => {
console.log('保存图片状态',res);
//console.log('保存图片状态',res);
},
fail: (res) => {
return uni.showToast({
@ -640,11 +637,22 @@
if (that.canDownload !== true) {
//满足可下载条件
that.isDownload = true
//展示激励视频广告
that.showAdvertise(url);
//console.log('res123',123)
uni.showModal({
title: '提示',
content: '看一段广告解锁图片下载',
success: function (res) {
//console.log('res',res)
if(res.confirm){
//展示激励视频广告
that.showAdvertise(url);
}
}
});
} else {
//不满足可下载条件 canDownload为true状态
uni.showToast({
return uni.showToast({
title: '当日下载次数已用完,请明日再来!',
icon: 'none'
})

94
utils/tiktokAd.js
View File

@ -1,94 +0,0 @@
//激励视频广告组件
var videoAd = null;
let rewarded = {
//加载激励视频广告
load(id) {
if (tt.createRewardedVideoAd) {
const achieveStatus = false;
videoAd = tt.createRewardedVideoAd({
adUnitId: id
})
videoAd.onLoad(() => {
console.log('激励视频广告加载成功')
})
//防止奖励重复发放
// try {
// if (videoAd.onClose) {
// videoAd.offClose(videoAd.onClose);
// console.log("videoAd.offClose卸载成功");
// }
// } catch (e) {
// console.log("videoAd.offClose 卸载失败");
// console.error(e);
// }
videoAd.onError(err => {
console.log('激励视频广告加载失败,错误原因为：',err)
})
videoAd.onClose((res) => {
// 用户点击了【关闭广告】按钮
if (res && res.isEnded || res === undefined) {
// 正常播放结束，可以下发奖励
videoAd.offClose()
this.achieveStatus = true;
console.log("激励视频广告播放完毕，可下发奖励",this.achieveStatus);
return this.achieveStatus;
} else {
// 播放中途退出，不下发奖励
}
})
}
},
//展示激励视频广告
show() {
if (videoAd) {
videoAd.onClose((status) => {
console.log(status + '视频激励广告关闭')
})
videoAd.show().catch(() => {
// 失败重试
videoAd.load()
.then(() => videoAd.show())
.catch(err => {
console.log('激励视频 广告显示失败')
})
})
}
}
}
//插屏广告组件
var interstitialAd = null;
let insert = {
//加载插屏广告
load(id) {
if (tt.createInterstitialAd) {
interstitialAd = tt.createInterstitialAd({
adUnitId: id
})
interstitialAd.onLoad(() => {
console.log('插屏广告加载中')
})
interstitialAd.onError((err) => {
console.log('加载错误', err)
})
interstitialAd.onClose((res) => {
console.log('插屏广告关闭', res)
})
}
},
//展示插屏广告
show() {
if (interstitialAd) {
interstitialAd.show().catch((err) => {
console.error(err)
})
}
}
}
module.exports = {
insert,
rewarded
};
Write Preview
Loading…
Cancel
Save