卡通生成流程

main
JING 8 months ago
parent e85cfff697
commit 2110a7edcc
  1. 1
      pagesA/color/index.vue
  2. 60
      pagesA/photo/cartoon_1.vue
  3. 135
      pagesA/photo/cartoon_2.vue
  4. 60
      pagesA/photo/cartoon_3.vue

@ -106,6 +106,7 @@
onLoad() {
var _this = this;
_this.getColorList();
_this.getUserInfo();
},
onPageScroll(e) {
if (e.scrollTop > 50) {

File diff suppressed because one or more lines are too long

@ -5,7 +5,7 @@
<view class="photo_main" :style="'margin-top:'+margin_top+'px'" style="width:100%;margin-left: 0;">
<view class="photo_cartoon_2" v-if="loaded && cameraEnable">
<camera flash="auto" :device-position="devicePosition" @error="errorCamera"
<camera flash="auto" :device-position="devicePosition" @error="errorCamera"
style="width: 100%; height: 100%;">
</camera>
@ -17,13 +17,13 @@
</view>
<view class="photo_cartoon_2_2">
<view class="photo_cartoon_2_2_1">
<view class="photo_cartoon_2_2_1" @click="viewAlbum">
<image src="/static/img/photo/cartoon_4.png" />
</view>
<view class="photo_cartoon_2_2_2" @click="goTo('/pagesA/photo/cartoon_3')">
<view class="photo_cartoon_2_2_2" @click="takePhoto">
<image src="/static/img/photo/cartoon_3.png" />
</view>
<view class="photo_cartoon_2_2_1">
<view class="photo_cartoon_2_2_1" @click="back2front">
<image src="/static/img/photo/cartoon_5.png" />
</view>
</view>
@ -49,26 +49,23 @@
margin_top: 0,
loaded: false,
cameraEnable: true,
loop: false,
devicePosition: "back",
use_camera: 1,
cameraContext: {},
users_image:'', //
cartoon_id:0,
}
},
mounted() {
setTimeout(() => {
this.loaded = true;
this.loopGetCameraInfo();
}, 500);
},
onShow() {
if (this.loaded && !this.loop) {
// cameraEnabletrue
this.loopGetCameraInfo();
}
var _this =this;
_this.checkAuth();
},
onLoad() {
onLoad(options) {
var _this =this;
console.log('options',options);
_this.cartoon_id = options.id;
if (uni.createCameraContext) {
this.cameraContext = uni.createCameraContext()
} else {
@ -80,7 +77,31 @@
}
},
methods: {
//
checkAuth() {
var _this = this;
console.log('已授权---');
uni.authorize({
scope: 'scope.camera',
success(res) {
console.log('已授权', res);
_this.loaded=true;
_this.cameraEnable=true;
},
fail(err) {
uni.showModal({
title: '授权失败',
content: '请在设置界面打开摄像头相关权限',
success: (res) => {
if (res.confirm) {
uni.openSetting()
}
}
})
},
})
},
getNavHeight(e) {
this.margin_top += e;
},
@ -90,6 +111,86 @@
url:url,
})
},
errorCamera(e)
{
var _this =this;
_this.$com.alertDo('请打开摄像头权限',function(res){
_this.checkAuth();
});
},
//
viewAlbum(){
var _this =this;
uni.chooseMedia({
count: 1,
mediaType: ['image'],
sourceType: ['album'],
camera: 'back',
success(res) {
console.log('相册',res);
//console.log(res.tempFiles)
var edetail= res.tempFiles[0].tempFilePath;
//
var upData = {filePath:edetail,fileType:'image',scene:'user_centre'};
_this.$api.ossUpload(upData,function(res){
console.log('ossUpload success',res);
var d = res.data;
_this.users_image = d.file_url;
uni.navigateTo({
url:'/pagesA/photo/cartoon_3?cartoon_id='+_this.cartoon_id+'&users_image='+encodeURIComponent(_this.users_image),
})
},function(err){
console.log('ossUpload fail',err);
});
}
})
},
//
takePhoto(){
var _this =this;
const ctx = uni.createCameraContext();
ctx.takePhoto({
quality: 'high',
success: (res) => {
console.log('拍照',res);
var edetail= res.tempImagePath;
//
var upData = {filePath:edetail,fileType:'image',scene:'user_centre'};
_this.$api.ossUpload(upData,function(res){
console.log('ossUpload success',res);
var d = res.data;
_this.users_image = d.file_url;
uni.navigateTo({
url:'/pagesA/photo/cartoon_3?cartoon_id='+_this.cartoon_id+'&users_image='+encodeURIComponent(_this.users_image),
})
},function(err){
console.log('ossUpload fail',err);
});
}
});
},
back2front()
{
var _this =this;
if(_this.devicePosition == 'back')
{
_this.devicePosition = 'front';
console.log('切换----前');
}
else
{
_this.devicePosition = 'back';
console.log('切换----后')
}
},
}
}
</script>

@ -5,13 +5,13 @@
<view class="photo_main" :style="'margin-top:'+margin_top+'px'" style="width:100%;margin-left: 0;">
<view class="photo_cartoon_2">
<image
src="https://img30.360buyimg.com/sku/jfs/t1/221254/4/39390/74349/661e039aF46114279/48532008a0001dd0.jpg"
:src="root+users_image"
mode="aspectFill" />
</view>
<view class="photo_cartoon_3_2">
<view class="photo_cartoon_3_2_1 photo_full_blue_btn">提交生成</view>
<view class="photo_cartoon_3_2_2">剩余生成次数 <text style="color: #7A74F0;">1</text>/30</view>
<view class="photo_cartoon_3_2_1 photo_full_blue_btn" @click="submit">提交生成</view>
<view class="photo_cartoon_3_2_2">剩余生成次数 <text style="color: #7A74F0;">{{cartoon_has}}</text>/{{all}}</view>
</view>
</view>
@ -33,24 +33,64 @@
return {
navbar_title: '卡通画风',
margin_top: 0,
root:this.$api.getOssurl(),
//
cartoon_id:0,
users_image:'',
//
cartoon_has:0, //
all:0,//
}
},
mounted() {
},
onShow() {
var _this = this;
var sceneList = _this.$user.session('sceneList');
var all = sceneList[3].number;
console.log(all);
_this.all = all;
},
onLoad() {
onLoad(options) {
var _this =this;
console.log('options',options);
_this.cartoon_id = options.cartoon_id;
_this.users_image = decodeURIComponent(options.users_image);
_this.getUserInfo();
},
methods: {
getNavHeight(e) {
this.margin_top += e;
},
///api/userInfo
getUserInfo(){
var _this = this;
_this.$api.get('/api/userInfo',{},function(res){
_this.cartoon_has = res.attach.photo.cartoon_number;
});
},
submit(){
var _this = this;
var cartoon_id = _this.cartoon_id;
var users_image = _this.users_image;
var post = {
cartoon_id:cartoon_id,
users_image:users_image,
};
_this.$com.showLoading('保存图片中');
_this.$api.post('api/cartoon/append', post,function(rs){
console.log(rs);
_this.$com.hideLoading();
uni.navigateTo({
url:"/pagesA/merge/success"
});
});
},
}
}
</script>

Loading…
Cancel
Save