167 lines
2.8 KiB
Vue
167 lines
2.8 KiB
Vue
|
<script setup>
|
||
|
|
/**
|
||
|
|
* 视频长按更多菜单
|
||
|
|
*/
|
||
|
|
import {
|
||
|
|
onMounted,
|
||
|
|
reactive,
|
||
|
|
getCurrentInstance,
|
||
|
|
ref,
|
||
|
|
defineProps
|
||
|
|
} from 'vue';
|
||
|
|
// 工具库
|
||
|
|
import util from '@/common/js/util.js'
|
||
|
|
const {
|
||
|
|
proxy
|
||
|
|
} = getCurrentInstance()
|
||
|
|
const props = defineProps({
|
||
|
|
// 是否我自己 0不是 1是
|
||
|
|
isMine: {
|
||
|
|
type: [String, Number],
|
||
|
|
default: 0,
|
||
|
|
},
|
||
|
|
})
|
||
|
|
//
|
||
|
|
const emit = defineEmits(['changeSpeed'])
|
||
|
|
//
|
||
|
|
const speed = reactive([{
|
||
|
|
name: '0.5',
|
||
|
|
value: 0.5,
|
||
|
|
},
|
||
|
|
{
|
||
|
|
name: '正常',
|
||
|
|
value: 1,
|
||
|
|
},
|
||
|
|
{
|
||
|
|
name: '1.25',
|
||
|
|
value: 1.25,
|
||
|
|
},
|
||
|
|
{
|
||
|
|
name: '1.5',
|
||
|
|
value: 1.5,
|
||
|
|
},
|
||
|
|
{
|
||
|
|
name: '2',
|
||
|
|
value: 2,
|
||
|
|
}
|
||
|
|
])
|
||
|
|
// 倍速下标
|
||
|
|
const speedIndex = ref(1)
|
||
|
|
// 视频数据对象
|
||
|
|
const videoDetail = reactive({})
|
||
|
|
|
||
|
|
onMounted(() => {
|
||
|
|
// proxy.$refs.menu.open()
|
||
|
|
})
|
||
|
|
|
||
|
|
// 打开弹窗
|
||
|
|
function open(item) {
|
||
|
|
Object.assign(videoDetail, {}, item)
|
||
|
|
// 下标
|
||
|
|
speedIndex.value = speed.findIndex(node => node.value == item.speed)
|
||
|
|
proxy.$refs.menu.open()
|
||
|
|
}
|
||
|
|
|
||
|
|
// 关闭弹窗
|
||
|
|
function close() {
|
||
|
|
Object.assign(videoDetail, {})
|
||
|
|
proxy.$refs.menu.close()
|
||
|
|
}
|
||
|
|
|
||
|
|
/**
|
||
|
|
* 跳转
|
||
|
|
* @param {String} url 路径跳转
|
||
|
|
*/
|
||
|
|
function link(url) {
|
||
|
|
util.isLogin().then(rs => {
|
||
|
|
//
|
||
|
|
uni.navigateTo({
|
||
|
|
url,
|
||
|
|
})
|
||
|
|
}).catch(() => {
|
||
|
|
uni.navigateTo({
|
||
|
|
url: '/pages/login/loginPhone',
|
||
|
|
})
|
||
|
|
})
|
||
|
|
|
||
|
|
// 关闭
|
||
|
|
close()
|
||
|
|
}
|
||
|
|
|
||
|
|
/**
|
||
|
|
* 修改速度
|
||
|
|
* @param {Object} item
|
||
|
|
*/
|
||
|
|
function handleSpeed(item) {
|
||
|
|
emit('changeSpeed', item)
|
||
|
|
// 关闭
|
||
|
|
close()
|
||
|
|
}
|
||
|
|
|
||
|
|
//
|
||
|
|
defineExpose({
|
||
|
|
open,
|
||
|
|
close,
|
||
|
|
})
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<template>
|
||
|
|
<uni-popup ref="menu" type="bottom">
|
||
|
|
<!-- -->
|
||
|
|
<view class="menuAlt">
|
||
|
|
<view class="header df jcr fdr ptb10 plr10">
|
||
|
|
<uni-icons type="closeempty" @click="close" />
|
||
|
|
</view>
|
||
|
|
|
||
|
|
<view class="listArea mtb30 mlr30 plr30 bfff">
|
||
|
|
<view class="line rows fdr ptb30">
|
||
|
|
<text class="key f1 c111 f28">倍速</text>
|
||
|
|
<view class="value speed df jcsb fdr f1 pl30">
|
||
|
|
<view class="item" v-for="(item,index) in speed" :key="index" :class="{'active': speedIndex == index}" @click="handleSpeed(item)">
|
||
|
|
<text class="text f28">{{item.name}}</text>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
|
||
|
|
<template v-if="isMine == 0">
|
||
|
|
<view class="line rows fdr ptb30" @click="link(util.setUrl('/pages/index/report',{userId:videoDetail.userId}))">
|
||
|
|
<text class="key f1 c111 f28">举报作者</text>
|
||
|
|
<view class="value f1 ml30"></view>
|
||
|
|
</view>
|
||
|
|
</template>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</uni-popup>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<style lang="scss" scoped>
|
||
|
|
// 菜单弹窗
|
||
|
|
.menuAlt {
|
||
|
|
background-color: #f2f2f2;
|
||
|
|
border-radius: 30rpx 30rpx 0 0;
|
||
|
|
|
||
|
|
.listArea {
|
||
|
|
.line+.line {
|
||
|
|
border-top: 2rpx solid #eee;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
// 速度
|
||
|
|
.speed {
|
||
|
|
|
||
|
|
//
|
||
|
|
.item {
|
||
|
|
.text {
|
||
|
|
color: #999;
|
||
|
|
transition-duration: .3s;
|
||
|
|
}
|
||
|
|
|
||
|
|
&.active {
|
||
|
|
.text {
|
||
|
|
color: #1c1c1c;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</style>
|