添加教程下载 和调整作品详情
This commit is contained in:
X1627315083
@@ -245,7 +245,8 @@
|
||||
<div class="get_color_block">
|
||||
<input class="get_color_input" placeholder="tcx value (e.g.: 19-4052)" v-model="tcxColor" @keydown.enter="getTcxColor()"/>
|
||||
<div class="get_color_button" @click="getTcxColor()">
|
||||
<span class="icon iconfont icon-huoquduixiang"></span>
|
||||
<!-- <span class="icon iconfont icon-huoquduixiang"></span> -->
|
||||
<span class="fi fi-br-fill"></span>
|
||||
<span class="get_color_des"></span>
|
||||
</div>
|
||||
</div>
|
||||
@@ -1910,9 +1911,8 @@ export default defineComponent({
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex: 1;
|
||||
.icon-huoquduixiang{
|
||||
.fi-br-fill{
|
||||
margin-right: calc(0.5rem*1.2);
|
||||
font-size: calc(2rem*1.2);
|
||||
color:#343579;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
@@ -145,7 +145,8 @@
|
||||
<div class="get_color_block">
|
||||
<input class="get_color_input" placeholder="tcx value (e.g.: 19-4052)" v-model="tcxColor" @keydown.enter="getTcxColor()"/>
|
||||
<div class="get_color_button" @click="getTcxColor()">
|
||||
<span class="icon iconfont icon-huoquduixiang"></span>
|
||||
<!-- <span class="icon iconfont icon-huoquduixiang"></span> -->
|
||||
<span class="fi fi-br-fill"></span>
|
||||
<span class="get_color_des">{{ $t('ColorboardUpload.ExtractColor') }}</span>
|
||||
</div>
|
||||
<div v-show="getColorBg" class="get_color_bg" @click="setUplpadColor(reviewColor)" :style="{'background-color':`rgba(${getSelectRGB(reviewColor).r},${getSelectRGB(reviewColor).g},${getSelectRGB(reviewColor).b},${getSelectRGB(reviewColor).a})`}">
|
||||
@@ -1374,9 +1375,8 @@ export default defineComponent({
|
||||
vertical-align: middle;
|
||||
cursor: pointer;
|
||||
|
||||
.icon-huoquduixiang{
|
||||
.fi-br-fill{
|
||||
margin-right: calc(0.5rem*1.2);
|
||||
font-size: calc(2rem*1.2);
|
||||
color:#343579;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
110
src/component/HomePage/scaleVideo.vue
Normal file
110
src/component/HomePage/scaleVideo.vue
Normal file
@@ -0,0 +1,110 @@
|
||||
<template>
|
||||
<div v-show="modalShow" class="general_video">
|
||||
<div class="video_box">
|
||||
<div class="general_video_btn" @click="clearVideo">
|
||||
<i class="fi fi-rr-cross-small"></i>
|
||||
</div>
|
||||
<video ref="video" controls>
|
||||
<source :src="url" type="video/mp4">
|
||||
Your browser does not support the video tag or the file format of this video.
|
||||
</video>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { defineComponent, h, ref ,toRefs,computed,reactive, watch} from "vue";
|
||||
export default defineComponent({
|
||||
props:{
|
||||
visible: {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
},
|
||||
remove: {
|
||||
type: Function, //传入移除节点方法,这里是createApp中的方法
|
||||
default: null,
|
||||
},
|
||||
url: {
|
||||
type: String,
|
||||
default: "",
|
||||
},
|
||||
},
|
||||
|
||||
|
||||
setup(props:any,{emit}) {
|
||||
const modalShow = ref(false);
|
||||
modalShow.value = props.visible;
|
||||
let clearVideo = ()=>{
|
||||
modalShow.value = false
|
||||
}
|
||||
let video = ref(null)
|
||||
watch(() => modalShow.value,
|
||||
(newVal,oldVal)=>{
|
||||
!newVal && props.remove()
|
||||
}
|
||||
)
|
||||
return {
|
||||
modalShow,
|
||||
clearVideo,
|
||||
video,
|
||||
};
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
// moodTemplateId: "", //模板id
|
||||
|
||||
};
|
||||
},
|
||||
|
||||
mounted() {
|
||||
},
|
||||
methods: {
|
||||
|
||||
},
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.general_video {
|
||||
position: fixed;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: rgba(0,0,0,.5);
|
||||
z-index: 9999;
|
||||
top: 0;
|
||||
left: 0;
|
||||
.video_box{
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
transform: translate(-50%,-50%);
|
||||
width: 80%;
|
||||
height: auto;
|
||||
position: absolute;
|
||||
video{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: contain;
|
||||
}
|
||||
.general_video_btn{
|
||||
color: #fff;
|
||||
border-radius: 50%;
|
||||
background: #000;
|
||||
width: 5rem;
|
||||
height: 5rem;
|
||||
position: absolute;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
right: 0;
|
||||
top: 0;
|
||||
transform: translate(50%,-50%);
|
||||
cursor: pointer;
|
||||
z-index: 2;
|
||||
i{
|
||||
font-size: 4rem;
|
||||
display: flex;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -55,7 +55,7 @@
|
||||
<div class="detail_right_user_content">
|
||||
<div class="scaleImage_chunk_title_intro">@{{scaleImageData.userName}}</div>
|
||||
<div v-if="scaleImageData.original == 1" class="scaleImage_chunk_title_intro scaleImage_chunk_title_Original">{{$t('newScaleImage.Original')}}</div>
|
||||
<div v-else @click="originalGetDetail()" class="scaleImage_chunk_title_intro">{{$t('newScaleImage.from')}}<span> @{{ scaleImageData.originalUserName }}/{{ scaleImageData.portfolioName }}</span></div>
|
||||
<div v-else @click="originalGetDetail()" class="scaleImage_chunk_title_intro">{{$t('newScaleImage.from')}}<span :class="{active:scaleImageData.jumpable == 1}"> @{{ scaleImageData.originalUserName }}/{{ scaleImageData.portfolioName }}</span></div>
|
||||
<!-- <div class="scaleImage_chunk_title_intro">个性签名</div>
|
||||
<div class="scaleImage_chunk_btn">关注</div> -->
|
||||
</div>
|
||||
@@ -345,6 +345,9 @@ export default defineComponent({
|
||||
// },
|
||||
let getDeatilData = {}
|
||||
let originalGetDetail = ()=>{
|
||||
if(imgData.scaleImageData.jumpable != 1){
|
||||
return message.info(t('newScaleImage.jsContent6'))
|
||||
}
|
||||
getDetail({id:imgData.scaleImageData.originalPortfolioId},'')
|
||||
}
|
||||
let getDetail = (value:any,str:string)=>{
|
||||
@@ -765,9 +768,11 @@ export default defineComponent({
|
||||
}
|
||||
.scaleImage_chunk_title_intro{
|
||||
span{
|
||||
cursor: pointer;
|
||||
color: #39215b;
|
||||
text-decoration: underline;
|
||||
&.active{
|
||||
cursor: pointer;
|
||||
color: #39215b;
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user