Commit e6102ae7 by yanju

修复动态评论样式

parent f99b6995
<template>
<div class="answer-card__wrap">
<div class="answer-card__wrap" v-if="showCard">
<div class="answer-card" @click="$router.push('/answer/detail/'+questionId)">
<div class="answer-card__left" v-if="!solved">
<div>
......@@ -39,13 +39,12 @@
<div class="answer-card__abs" v-if="isMy">
<div class="container__abs">
<div class="deleteButton" @click="dataDeleteItem(questionId)">
<div class="deleteButton" @click="showAlert(questionId)">
<yun-icon name="close1" size="12px" pb="3px"></yun-icon>
</div>
<nuxt-link :to="{path:'/answer/release',query:{id:questionId}}" tag="div" class="editButton">
<yun-icon name="project" size="12px"></yun-icon>
</nuxt-link>
</div>
</div>
......@@ -79,6 +78,7 @@
tags:[],
userNick:'',
viewNumber:'',
showCard:true,
}
},
......@@ -101,10 +101,21 @@
this.viewNumber = info.viewNumber;
}
},
showAlert(id){
this.$alert('确认删除?', '', {
confirmButtonText: '确定',
callback: action => {
this.dataDeleteItem(id)
}
});
},
dataDeleteItem(id){
this.$axios.$delete(config.api.delete.Question.delete+id).then((response)=>{
if(response.code===0){
this.cardId='';
this.showCard=false;
this.$message({
type:'success',
message:'项目删除成功!'
......
<template>
<div>
<div class="article-comment">
<div class="article-comment" :style="type==='dynamic'?{width:'816px'}:''">
<textarea v-model="commentContent" name="" id="" cols="30" rows="10" class="release-area"></textarea>
<div class="button-box">
<p @click="dataPostComment" v-if="type!=='question'">评论</p>
......@@ -20,8 +20,8 @@
</div>
</div>
<card :questionUser="questionUser" @listenCommentReget1="dataGetComment" :type="type" :id="id" v-for="(val,index) in commentList" :key="val.commentId||val.replyId" :info="val"></card>
<p class="comment-more" @click="clickToGetMore" v-if="currentPage<pages">查看更多</p>
<p class="comment-more" v-if="commentList.length===0">暂无评论</p>
<p class="comment-more" @click="clickToGetMore" v-if="currentPage<pages" :style="type==='dynamic'?{width:'816px'}:''">查看更多</p>
<p class="comment-more" v-if="commentList.length===0" :style="type==='dynamic'?{width:'816px'}:''">暂无评论</p>
</div>
</template>
......
......@@ -208,72 +208,6 @@
<style lang="scss">
.project-card__wrap{
background-color: #fff;
position:relative;
.project-card__abs{
position: absolute;
top:0;
right:0;
width:200*$length;
height:100%;
background-color: transparent;
overflow: hidden;
.container__abs{
position: absolute;
top:-100*$length;
right:-100*$length;
width:200*$length;
height:200*$length;
border-radius: 50%;
background-color: rgba(34,34,34,.4);
transform: rotateZ(90deg);
transition: 1s all;
opacity: 0;
.deleteButton{
position: absolute;
bottom:60*$length;
left:30*$length;
width:30*$length;
height:30*$length;
border-radius: 50%;
background-color:#ff4949;
@extend %cursorPointer;
@extend %flex-row-center;
@extend %animate-transition;
&:hover{
filter:brightness(1.1);
transform: scale(1.03);
}
i{
color:#fff;
}
}
.editButton{
position: absolute;
bottom:30*$length;
left:60*$length;
width:30*$length;
height:30*$length;
border-radius: 50%;
background-color: #13ce66;
@extend %cursorPointer;
@extend %flex-row-center;
@extend %animate-transition;
&:hover{
filter:brightness(1.1);
transform: scale(1.03);
}
i{
color:#fff;
}
}
}
}
.project-card{
position:relative;
......@@ -425,6 +359,74 @@
}
background-color: #fff;
position:relative;
.project-card__abs{
position: absolute;
top:0;
right:0;
width:200*$length;
height:100%;
background-color: transparent;
overflow: hidden;
.container__abs{
position: absolute;
top:-100*$length;
right:-100*$length;
width:200*$length;
height:200*$length;
border-radius: 50%;
background-color: rgba(34,34,34,.4);
transform: rotateZ(90deg);
transition: 1s all;
opacity: 0;
.deleteButton{
position: absolute;
bottom:60*$length;
left:30*$length;
width:30*$length;
height:30*$length;
border-radius: 50%;
background-color:#ff4949;
@extend %cursorPointer;
@extend %flex-row-center;
@extend %animate-transition;
&:hover{
filter:brightness(1.1);
transform: scale(1.03);
}
i{
color:#fff;
}
}
.editButton{
position: absolute;
bottom:30*$length;
left:60*$length;
width:30*$length;
height:30*$length;
border-radius: 50%;
background-color: #13ce66;
@extend %cursorPointer;
@extend %flex-row-center;
@extend %animate-transition;
&:hover{
filter:brightness(1.1);
transform: scale(1.03);
}
i{
color:#fff;
}
}
}
}
&:hover{
.project-card__abs{
.container__abs{
......
<template>
<div>
<card-container key="container3" style="margin-top: 16px" :title="rightConTitle" label="换一换">
<answer-card v-if="rightList.length>0" :isMy="$route.query.type==='my'&&$store.state.userProfile.userId===$route.query.user" v-for="(val,index) in rightList" :key="val.questionId" :info="val"></answer-card>
<answer-card :isMy="true" v-if="rightList.length>0" v-for="(val,index) in rightList" :key="val.questionId" :info="val"></answer-card>
<empty-card v-if="rightList.length===0" height="556px"></empty-card>
</card-container>
......
<template>
<div >
<div>
<release-card style="margin-top: 16px" @listenReleaseState="dataGetDynamic(1)"></release-card>
<social-card pageType="my" @listenSocialCardState="dataGetDynamic(1)" v-for="(val,index) in rightList" :key="val.postId" :info="val"></social-card>
<empty-card v-if="rightList.length===0" height="556px"></empty-card>
<pagination key="container5" style="margin:20px auto;" :pages="pages" v-on:listenPageChange="changePage"></pagination>
</div>
</template>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment