269 lines
6.2 KiB
Vue
Executable File
269 lines
6.2 KiB
Vue
Executable File
<style>
|
||
.page {
|
||
background-color: #000000;
|
||
opacity: 0.9;
|
||
}
|
||
|
||
.btn-cancel {
|
||
background-color: #1d1d1e;
|
||
border-color: #3a3a3d;
|
||
}
|
||
.btn-cancel-touched {
|
||
background-color: #515156;
|
||
border-color: #2b2b2f;
|
||
}
|
||
.all-box {
|
||
display: flex;
|
||
flex-direction: row;
|
||
justify-content: space-around;
|
||
height: 280rpx;
|
||
}
|
||
.share-item {
|
||
display: flex;
|
||
flex-direction: column;
|
||
margin-top: 60rpx;
|
||
}
|
||
.icon-wrapper {
|
||
width: 120rpx;
|
||
height: 120rpx;
|
||
background-color: #343437;
|
||
border-radius: 100px;
|
||
display: flex;
|
||
flex-direction: row;
|
||
justify-content: center;
|
||
opacity: 0.8;
|
||
}
|
||
.icon-image {
|
||
width: 60rpx;
|
||
height: 60rpx;
|
||
}
|
||
.icon-tag-text {
|
||
color: #FFFFFF;
|
||
font-size: 14px;
|
||
margin-top: 10rpx;
|
||
}
|
||
</style>
|
||
|
||
<template>
|
||
<view class="page">
|
||
|
||
<view class="all-box">
|
||
<view class="share-item" @click="downloadVlog()">
|
||
<view class="icon-wrapper" style="align-self: center;">
|
||
<image class="icon-image" src="/static/images/icon-download.png" style="align-self: center;"></image>
|
||
</view>
|
||
<text class="icon-tag-text" style="align-self: center;">保存到相册</text>
|
||
</view>
|
||
|
||
<view class="share-item" @click="copyLink()">
|
||
<view class="icon-wrapper" style="align-self: center;">
|
||
<image class="icon-image" src="/static/images/icon-copy.png" style="align-self: center;"></image>
|
||
</view>
|
||
<text class="icon-tag-text" style="align-self: center;">复制链接</text>
|
||
</view>
|
||
|
||
<view class="share-item" @click="gotoQRCode()">
|
||
<view class="icon-wrapper" style="align-self: center;">
|
||
<image class="icon-image" src="/static/images/icon-qrcode.png" style="align-self: center;"></image>
|
||
</view>
|
||
<text class="icon-tag-text" style="align-self: center;">二维码</text>
|
||
</view>
|
||
|
||
<!-- 判断只有我自己才能显示这个按钮 -->
|
||
<view v-if="(thisVlogerId == userId) && (isPrivate == 0)" class="share-item" @click="changeVlogToPrivate()">
|
||
<view class="icon-wrapper" style="align-self: center;">
|
||
<image class="icon-image" src="/static/images/icon-private.png" style="align-self: center;"></image>
|
||
</view>
|
||
<text class="icon-tag-text" style="align-self: center;">转为私密</text>
|
||
</view>
|
||
<view v-if="(thisVlogerId == userId) && (isPrivate == 1)" class="share-item" @click="changeVlogToPublic()">
|
||
<view class="icon-wrapper" style="align-self: center;">
|
||
<image class="icon-image" src="/static/images/icon-private.png" style="align-self: center;"></image>
|
||
</view>
|
||
<text class="icon-tag-text" style="align-self: center;">转为公开</text>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="" style="padding: 0 20rpx;">
|
||
<!-- :class="{'btn-preplay':!preplayTouched, 'btn-preplay-touched': preplayTouched}"
|
||
@click="preview"
|
||
@touchstart="touchstartPreplay"
|
||
@touchend="touchendPreplay" -->
|
||
|
||
<view :class="{'btn-cancel':!cancelTouched, 'btn-cancel-touched': cancelTouched}"
|
||
@click="close"
|
||
@touchstart="touchstartCancel"
|
||
@touchend="touchendCancel"
|
||
style="height: 50px;display: flex;flex-direction: column;justify-content: center;border-width: 1rpx;border-radius: 10px;">
|
||
<text class="" style="color: #FFFFFF;font-size: 16px;align-self: center;align-self: center;">取消</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import storage from "@/utils/storage.js"; //缓存
|
||
import {
|
||
vlogChangeToPublic,
|
||
vlogChangeToPrivate
|
||
} from "@/api/vlog"
|
||
import {
|
||
dateFormat,
|
||
graceNumber,
|
||
getDateBeforeNow
|
||
} from '@/utils/tools.js'
|
||
import popup from '../uni-popup/popup.js'
|
||
export default {
|
||
name: 'UniPopupShare',
|
||
mixins:[popup],
|
||
emits:['select'],
|
||
props: {
|
||
title: {
|
||
type: String,
|
||
default: ''
|
||
},
|
||
beforeClose: {
|
||
type: Boolean,
|
||
default: false
|
||
},
|
||
thisVlogerId: {
|
||
type: String,
|
||
default: ''
|
||
},
|
||
thisVlogId: {
|
||
type: String,
|
||
default: ''
|
||
},
|
||
vlogUrl: {
|
||
type: String,
|
||
default: ''
|
||
},
|
||
isPrivate: {
|
||
type: Number,
|
||
default: 0
|
||
}
|
||
},
|
||
data() {
|
||
return {
|
||
userId: "",
|
||
cancelTouched: false
|
||
}
|
||
},
|
||
created() {
|
||
var info = storage.getVlogUserInfo()
|
||
if(info==null){
|
||
// uni.showTabBar({
|
||
// animation: false
|
||
// });
|
||
// uni.navigateTo({
|
||
// url: "/pages/passport/login",
|
||
// animationType: "slide-in-bottom",
|
||
// });
|
||
// return;
|
||
}else{
|
||
this.userId = userId;
|
||
}
|
||
},
|
||
methods: {
|
||
/**
|
||
* 选择内容
|
||
*/
|
||
select(item, index) {
|
||
this.$emit('select', {
|
||
item,
|
||
index
|
||
})
|
||
this.close();
|
||
},
|
||
/**
|
||
* 关闭窗口
|
||
*/
|
||
close() {
|
||
if(this.beforeClose) return
|
||
this.popup.close();
|
||
uni.showTabBar({
|
||
animation: true
|
||
})
|
||
},
|
||
|
||
touchstartCancel() {
|
||
this.cancelTouched = true;
|
||
},
|
||
|
||
touchendCancel() {
|
||
this.cancelTouched = false;
|
||
},
|
||
|
||
downloadVlog() {
|
||
console.log("downloadVlog...thisVlogId = " + this.vlogUrl);
|
||
uni.showLoading();
|
||
uni.downloadFile({
|
||
url: this.vlogUrl,
|
||
success: (res) => {
|
||
if (res.statusCode === 200) {
|
||
console.log('下载成功');
|
||
uni.saveVideoToPhotosAlbum({
|
||
filePath: res.tempFilePath,
|
||
success: function () {
|
||
console.log('save success');
|
||
uni.hideLoading();
|
||
uni.showToast({
|
||
title: "保存成功~！",
|
||
duration: 5000
|
||
})
|
||
}
|
||
});
|
||
}
|
||
}
|
||
});
|
||
|
||
},
|
||
|
||
copyLink() {
|
||
uni.setClipboardData({
|
||
data: this.vlogUrl,
|
||
success:()=>{
|
||
uni.showToast({//提示
|
||
title:'复制成功'
|
||
})
|
||
}
|
||
});
|
||
},
|
||
|
||
gotoQRCode() {
|
||
uni.navigateTo({
|
||
url: "/pages/qrcode/qrcode?vlogId=" + this.thisVlogId
|
||
})
|
||
},
|
||
|
||
|
||
async changeVlogToPublic() {
|
||
var vlogId = this.thisVlogId;
|
||
var me = this;
|
||
var info = storage.getVlogUserInfo()
|
||
var userId = info.id;
|
||
var result = await vlogChangeToPublic(userId,vlogId)
|
||
if (result.data.status == 200) {
|
||
uni.showToast({
|
||
title: "设置完毕~"
|
||
})
|
||
}
|
||
},
|
||
|
||
async changeVlogToPrivate() {
|
||
var vlogId = this.thisVlogId;
|
||
var me = this;
|
||
var info = storage.getVlogUserInfo()
|
||
var userId = info.id;
|
||
var result = await vlogChangeToPrivate(userId,vlogId)
|
||
if (result.data.status == 200) {
|
||
uni.showToast({
|
||
title: "设置完毕~"
|
||
})
|
||
}
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
|