mirror of
https://codeup.aliyun.com/67762337eccfc218f6110e0e/vue/fe-student.git
synced 2025-12-10 19:36:48 +08:00
feat:增加面授课评论
This commit is contained in:
@@ -21,7 +21,7 @@ export function useUserInfo(id) {
|
||||
watch(id, () => {
|
||||
id.value && boeRequest(GET_USER_LIST, {id: id.value}).then(res => {
|
||||
userInfo.value = res.result.userInfoList[0]
|
||||
userInfo.value.avatar = userInfo.value.avatar?userInfo.value.avatar:'/800e23f7-b58c-4192-820d-0c6a2b7544cc.png'
|
||||
userInfo.value.avatar = userInfo.value.avatar?userInfo.value.avatar.includes('upload')?userInfo.value.avatar:'/upload'+userInfo.value.avatar:'/800e23f7-b58c-4192-820d-0c6a2b7544cc.png'
|
||||
})
|
||||
})
|
||||
return userInfo
|
||||
|
||||
@@ -63,10 +63,205 @@
|
||||
<div style="padding:20px;" class="content" v-html="data.offcourseDto?.outline"></div>
|
||||
</div>
|
||||
</el-tab-pane>
|
||||
<!-- <el-tab-pane label="课程评论" name="third" :disabed=dayjs().isBefore(dayjs(data.planDto.beginTime))>
|
||||
<el-tab-pane label="课程评论" name="third" :disabed=dayjs().isBefore(dayjs(data.planDto.beginTime))>
|
||||
<div class="bascinfor">
|
||||
<div class="inputone">
|
||||
<el-input
|
||||
ref="refInput"
|
||||
v-model="disComment.content"
|
||||
:autosize="{ minRows: 5, maxRows: 5 }"
|
||||
resize="none"
|
||||
maxlength="100"
|
||||
type="textarea"
|
||||
placeholder="写评论~"
|
||||
/>
|
||||
<div class="words">{{ disComment.content.length }}/100</div>
|
||||
<div class="upload">
|
||||
<div style="display: flex">
|
||||
<div
|
||||
class="allimg"
|
||||
v-for="(img, i) in fileListComment"
|
||||
:key="i"
|
||||
>
|
||||
<div
|
||||
class="imgone"
|
||||
:style="{
|
||||
backgroundImage: `url('${img.url}')`,
|
||||
marginLeft: '15px',
|
||||
}"
|
||||
></div>
|
||||
<div class="cha" @click="removeCommentImg(i)"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="uploadAnd">
|
||||
<div v-if="3>5" class="btnone clearfix">
|
||||
<UploadPostImg v-model="commentSubmitFileList" @fileUploadValue="uploadBack">
|
||||
<button class="btwwo">
|
||||
<img class="image" src="../../assets/image/uploadimg.png" />
|
||||
<div class="shangchuan">上传图片</div>
|
||||
</button>
|
||||
</UploadPostImg>
|
||||
</div>
|
||||
|
||||
</el-tab-pane> -->
|
||||
<el-tab-pane label="材料下载" name="third" >
|
||||
<button class="btntwo" @click="submitComment" v-loading="submitLoading">发表评论</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="thinline"></div>
|
||||
<div class="bottom">
|
||||
<div v-for="(row, i) in commontList" :key="i" style="margin-bottom: 24px;">
|
||||
<div class="header">
|
||||
<img :src="row.studentAvatar" alt="" srcset="" class="avator">
|
||||
<div class="id">{{ row.createName }}</div>
|
||||
<div class="showCareer">{{row.studentJobName}}</div>
|
||||
<div class="idThink"></div>
|
||||
</div>
|
||||
<div class="discuss clearfix">
|
||||
<div class="discussmain clearfix">
|
||||
<div class="talkmain">
|
||||
{{ row.content }}
|
||||
</div>
|
||||
</div>
|
||||
<div style="display:flex;margin-top: 12px;margin-bottom: 12px;">
|
||||
<div v-if="row.img" v-for="(rowimg, index) in row.img.split(',')" :key="index" style="width:55px;height:55px;margin-right: 12px;">
|
||||
<img class="image" style="width:55px;height:55px;border-radius: 4px;" :src="rowimg" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="intime">{{ row.ctime }}</div>
|
||||
<div class="likeYou">
|
||||
<div
|
||||
@click="commentComment(row)"
|
||||
style="display: flex; cursor: pointer; align-items: baseline"
|
||||
>
|
||||
<span
|
||||
class="iconfont icon-pinglun"
|
||||
:style="{ color: '#b3bdc4' }"
|
||||
></span>
|
||||
<!-- <div class="count"> {{ row.praiseNum || 0 }}</div>-->
|
||||
</div>
|
||||
<div
|
||||
@click="commentLike(row)"
|
||||
style="display: flex;cursor: pointer;align-items: baseline;margin-left: 19px;">
|
||||
<span
|
||||
class="iconfont icon-dianzan"
|
||||
:style="{ color: row.praised ? '#2478ff' : '#b3bdc4' }"></span>
|
||||
<div class="count" :style="{color:row.praised ? '#2478ff' : '#b3bdc4'}">{{ row.praiseNum || 0 }}</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 评论下的回复 -->
|
||||
<div v-if="row.children.length!==0" :style="{height:spreadReply==i ? 'auto' : 210 +'px',overflow:'hidden',position: 'relative'}">
|
||||
<div v-for="(replay, j) in row.children" :key="j">
|
||||
<div class="reply">
|
||||
<img :src="replay.studentAvatar" alt="" srcset="" class="sameava avaone">
|
||||
<div class="sameuser">{{ replay.studentName }}</div>
|
||||
<div class="centerreply">回复</div>
|
||||
<img :src="replay.targetStudentAvatar" alt="" srcset="" class="sameava avaone">
|
||||
<div class="sameuser">{{ replay.targetStudentName }}</div>
|
||||
<div class="replytime">{{ replay.createTime }}</div>
|
||||
</div>
|
||||
<div style="display:flex;margin-top: 12px;margin-bottom: 12px;">
|
||||
<div v-if="replay.img" v-for="(rowimg, index) in replay.img.split(',')" :key="index" style="width:65px;height:65px;margin-right: 7px;">
|
||||
<img class="image" style="width:65px;height:65px;border-radius: 4px;" :src="rowimg" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="mainreply">
|
||||
<div class="replydetail">
|
||||
{{ replay.content }}
|
||||
</div>
|
||||
<!-- <div class="talk"></div> -->
|
||||
</div>
|
||||
<div class="likeYou">
|
||||
<div
|
||||
@click="commentComment(replay)"
|
||||
style="display: flex;cursor: pointer;align-items: baseline;">
|
||||
<span
|
||||
class="iconfont icon-pinglun"
|
||||
:style="{ color: '#b3bdc4' }"></span>
|
||||
<!-- <div class="count"> {{ replay.commentNum }}</div>-->
|
||||
</div>
|
||||
<div
|
||||
style="display: flex; cursor: pointer; align-items: baseline;margin-left: 19px;"
|
||||
@click="commentLike(replay)">
|
||||
<span
|
||||
class="iconfont icon-dianzan"
|
||||
:style="{ color: replay.praised ? '#2478ff' : '#b3bdc4' }"></span>
|
||||
<div class="count" :style="{color:replay.praised ? '#2478ff' : '#b3bdc4'}">{{ replay.praiseNum || 0 }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 查看更多 -->
|
||||
<div style="display: flex;justify-content: center;align-items: center;position:absolute;bottom:0px;cursor: pointer;width:100%">
|
||||
<span
|
||||
@click="lookMore(i)"
|
||||
style="font-size: 14px;color: #2478ff;">{{ i==spreadReply ? '收起' : '查看更多' }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 回复分页 -->
|
||||
<div style="display:flex;justify-content:center;align-items:center;margin-top:36px;margin-bottom:36px;">
|
||||
<!-- 分页 -->
|
||||
<el-pagination
|
||||
v-model:current-page="hfPage.currentPage"
|
||||
:page-size="hfPage.pageSize"
|
||||
:small="small"
|
||||
layout="prev, pager, next, jumper"
|
||||
:total="hfPage.total"
|
||||
@current-change="handleCurrentChange"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div
|
||||
class="discuss clearfix"
|
||||
v-if="commontList && commontList.length">
|
||||
<div class="inreply">
|
||||
<el-input
|
||||
v-model="replayComment.content"
|
||||
:autosize="{ minRows: 5, maxRows: 5 }"
|
||||
resize="none"
|
||||
maxlength="100"
|
||||
type="textarea"
|
||||
:placeholder="replayComment.placeholder"
|
||||
/>
|
||||
<div class="words">{{ replayComment.content.length }}/100</div>
|
||||
<div class="upload">
|
||||
<div style="display: flex">
|
||||
<div class="allimg" v-for="(img, i) in fileListCommentRelpay" :key="i">
|
||||
<div
|
||||
class="imgone"
|
||||
:style="{
|
||||
backgroundImage: `url('${img.url}')`,
|
||||
marginLeft: '15px',
|
||||
}"
|
||||
></div>
|
||||
<div class="cha" @click="removeImg(i)"></div>
|
||||
</div>
|
||||
</div>
|
||||
<datagrid class="uploadAnd">
|
||||
<UploadPostImg v-if="3>5" v-model="fileListCommentRelpay" @fileUploadValue="uploadReplyBack">
|
||||
<button class="btnone clearfix">
|
||||
<img
|
||||
class="image"
|
||||
src="../../assets/image/uploadimg.png"
|
||||
/>
|
||||
<div class="shangchuan">上传图片</div>
|
||||
</button>
|
||||
</UploadPostImg>
|
||||
<button class="btntwo" @click="submitReplayComment" style="top:206px;" v-loading="submitReplayLoading">
|
||||
回复
|
||||
</button>
|
||||
</datagrid>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="材料下载" name="four" >
|
||||
<div v-if="data.offcourseDto?.attach == ''"
|
||||
style="font-size: 14px;font-weight: 400; line-height: 24px; cursor: pointer;margin-left: 40px; margin-top: 20px;">
|
||||
此课程无附件
|
||||
@@ -121,12 +316,18 @@
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import {computed, reactive, toRefs, watch, onUnmounted} from "vue";
|
||||
import {computed, reactive, toRefs, watch, onUnmounted, ref} from "vue";
|
||||
import FileTypeImg from "@/components/FileTypeImg.vue";
|
||||
import {request, useRequest} from "@/api/request";
|
||||
import {
|
||||
STU_OFFCOURSE_DETAIL,
|
||||
FACETEACH_SIGNUP
|
||||
FACETEACH_SIGNUP,
|
||||
|
||||
COMMENT_ADD,
|
||||
COMMENT_LIST,
|
||||
COMMENT_PRAISE,
|
||||
PostPraise,
|
||||
PostDetails,
|
||||
} from "@/api/api";
|
||||
import {useRoute, useRouter} from "vue-router";
|
||||
import {useUserInfo} from "@/api/utils";
|
||||
@@ -165,6 +366,179 @@ const downloads = (url) => {
|
||||
};
|
||||
let timer = null;
|
||||
|
||||
|
||||
// 查看更多-展开回复列表
|
||||
function lookMore(i) {
|
||||
i == spreadReply.value ? spreadReply.value = -1 : spreadReply.value = i;
|
||||
}
|
||||
|
||||
// 获取评论数据
|
||||
const hfPage = ref({
|
||||
currentPage: 1,
|
||||
pageNo: 1,
|
||||
pageSize: 10,
|
||||
total: 0
|
||||
})
|
||||
const disComment = ref({
|
||||
content: "",
|
||||
});
|
||||
// 获取数据
|
||||
const getData = () => {
|
||||
// 获取面授课下的评论
|
||||
request(COMMENT_LIST, {
|
||||
id: courseId,
|
||||
type: 2,
|
||||
pageNo:hfPage.value.currentPage,
|
||||
pageSize:10
|
||||
}).then(res=>{
|
||||
console.log('我是获取当前帖子的评论', res)
|
||||
commontList.value = res.data.records;
|
||||
hfPage.value.total = Number(res.data.total);
|
||||
submitLoading.value = false;
|
||||
submitReplayLoading.value = false;
|
||||
clearText()
|
||||
}).catch(err=>{
|
||||
console.log(err)
|
||||
submitLoading.value = false;
|
||||
submitReplayLoading.value = false;
|
||||
})
|
||||
}
|
||||
|
||||
// 回复分页
|
||||
function handleCurrentChange(e, k) {
|
||||
console.log('分页打印', e, k)
|
||||
hfPage.value.currentPage = e;
|
||||
hfPage.value.pageNo = e;
|
||||
getData();
|
||||
}
|
||||
|
||||
|
||||
getData()
|
||||
|
||||
const disDetail = ref({});
|
||||
const commontList = ref([]);
|
||||
const spreadReply = ref(-1);
|
||||
const replayComment = ref({
|
||||
placeholder: "",
|
||||
content: "",
|
||||
pid: "",
|
||||
});
|
||||
|
||||
// 清空回复及评论输入框
|
||||
const clearText = () => {
|
||||
disComment.value.content = "";
|
||||
fileListComment.value = [];
|
||||
fileListCommentRelpay.value = [];
|
||||
replayComment.value.content = "";
|
||||
}
|
||||
|
||||
// 评论图片展示数组
|
||||
const fileListComment = ref([]);
|
||||
// 回复图片展示数组
|
||||
const fileListCommentRelpay = ref([]);
|
||||
|
||||
// 上传图片成功返回的URL
|
||||
const uploadBack = (e) => {
|
||||
console.log('--------->', e)
|
||||
fileListComment.value.push(e)
|
||||
}
|
||||
|
||||
const uploadReplyBack = (e) => {
|
||||
console.log('--------->', e)
|
||||
fileListCommentRelpay.value.push(e)
|
||||
}
|
||||
|
||||
function removeImg(i) {
|
||||
fileListCommentRelpay.value.splice(i, 1);
|
||||
}
|
||||
|
||||
function removeCommentImg(i) {
|
||||
fileListComment.value.splice(i, 1);
|
||||
}
|
||||
|
||||
function commentLike(obj) {
|
||||
obj.praised ? (obj.praiseNum = Number(obj.praiseNum) - 1) : (obj.praiseNum = Number(obj.praiseNum) + 1);
|
||||
obj.praised = !obj.praised;
|
||||
request(COMMENT_PRAISE, { targetId: obj.id, type: 1 });
|
||||
}
|
||||
|
||||
function commentComment(obj) {
|
||||
console.log(obj)
|
||||
replayComment.value.placeholder = "@ " + obj.createName;
|
||||
replayComment.value.pid = obj.id;
|
||||
}
|
||||
|
||||
|
||||
const submitLoading = ref(false);
|
||||
|
||||
// 提交评论
|
||||
function submitComment() {
|
||||
if(disComment.value.content==""){
|
||||
ElMessage.error(`请输入评论内容`);
|
||||
return
|
||||
}
|
||||
if(submitLoading.value){
|
||||
ElMessage.error(`请勿频繁点击`)
|
||||
return
|
||||
}
|
||||
submitLoading.value = true;
|
||||
console.table('面授课评论参数',{
|
||||
id: courseId,
|
||||
targetId: courseId,
|
||||
content: disComment.value.content,
|
||||
type: 2,
|
||||
})
|
||||
|
||||
request(COMMENT_ADD, {
|
||||
id: courseId,
|
||||
targetId: courseId,
|
||||
content: disComment.value.content,
|
||||
type: 2,
|
||||
}).then((res) => {
|
||||
console.log(res)
|
||||
getData();
|
||||
}).catch(err=>{
|
||||
submitLoading.value = false;
|
||||
console.log(err)
|
||||
});
|
||||
}
|
||||
|
||||
const submitReplayLoading = ref(false);
|
||||
|
||||
// 回复评论
|
||||
function submitReplayComment() {
|
||||
if(replayComment.value.content==""){
|
||||
ElMessage.error(`请输入回复内容`);
|
||||
return
|
||||
}
|
||||
if(submitReplayLoading.value){
|
||||
ElMessage.error(`请勿频繁点击`)
|
||||
return
|
||||
}
|
||||
submitReplayLoading.value = true;
|
||||
console.table('帖子回复评论参数',{
|
||||
id: courseId,
|
||||
targetId: courseId,
|
||||
content: replayComment.value.content,
|
||||
type: 2,
|
||||
pid: replayComment.value.pid
|
||||
})
|
||||
|
||||
request(COMMENT_ADD, {
|
||||
id: courseId,
|
||||
targetId: courseId,
|
||||
content: replayComment.value.content,
|
||||
type: 2,
|
||||
pid: replayComment.value.pid
|
||||
}).then((res) => {
|
||||
console.log(res)
|
||||
getData();
|
||||
}).catch(err=>{
|
||||
console.log(err)
|
||||
submitReplayLoading.value = false;
|
||||
});
|
||||
}
|
||||
|
||||
// 报名
|
||||
function onLineSignUp() {
|
||||
if(data.value.isSignUp){
|
||||
@@ -499,4 +873,370 @@ function formateArr(strs) {
|
||||
|
||||
}
|
||||
}
|
||||
.bascinfor {
|
||||
width: 100%;
|
||||
background: #ffffff;
|
||||
border-radius: 8px;
|
||||
margin-top: 24px;
|
||||
// position: relative;
|
||||
.inputone {
|
||||
margin-right: 44px;
|
||||
position: relative;
|
||||
max-width: 1069px;
|
||||
// max-height: 110px;
|
||||
margin-left: 88px;
|
||||
margin-top: 44px;
|
||||
|
||||
.words {
|
||||
position: absolute;
|
||||
right: 15px;
|
||||
// bottom: 5px;
|
||||
top: 130px;
|
||||
font-size: 14px;
|
||||
font-weight: 500;
|
||||
color: #333330;
|
||||
}
|
||||
|
||||
.el-textarea__inner {
|
||||
font-size: 14px;
|
||||
font-weight: 500;
|
||||
color: #666666;
|
||||
margin-top: 44px;
|
||||
// margin: 23px 50px;
|
||||
border-radius: 8px;
|
||||
background-color: rgba(245, 246, 247, 1);
|
||||
padding: 11px 25px;
|
||||
}
|
||||
|
||||
.el-textarea__inner::placeholder {
|
||||
font-size: 14px;
|
||||
font-weight: 500;
|
||||
color: #666666;
|
||||
line-height: 24px;
|
||||
}
|
||||
|
||||
// .el-input__inner {
|
||||
// &::-webkit-input-placeholder {
|
||||
// /* WebKit browsers 适配谷歌 */
|
||||
// color: red;
|
||||
// }
|
||||
// }
|
||||
.upload {
|
||||
display: flex;
|
||||
height: 100px;
|
||||
// background-color: red;
|
||||
.allimg {
|
||||
position: relative;
|
||||
display: flex;
|
||||
|
||||
.imgone {
|
||||
margin-top: 24px;
|
||||
width: 55px;
|
||||
height: 55px;
|
||||
border-radius: 8px;
|
||||
background-image: url(../../assets/image/px.png);
|
||||
background-size: 100%;
|
||||
}
|
||||
|
||||
.cha {
|
||||
cursor: pointer;
|
||||
top: 15px;
|
||||
right: -9px;
|
||||
// right: 0;
|
||||
position: absolute;
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
border-radius: 50%;
|
||||
background-image: url(../../assets/image/X.png);
|
||||
background-size: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.uploadAnd {
|
||||
margin-top: 21px;
|
||||
|
||||
.btwwo {
|
||||
cursor: pointer;
|
||||
|
||||
.image {
|
||||
padding-top: 8px;
|
||||
width: 18px;
|
||||
height: 17px;
|
||||
// margin-top: 10px;
|
||||
margin-left: -60px;
|
||||
}
|
||||
|
||||
.shangchuan {
|
||||
position: absolute;
|
||||
right: 20px;
|
||||
top: 7px;
|
||||
display: inline-block;
|
||||
margin-left: 10px;
|
||||
font-size: 14px;
|
||||
font-weight: 500;
|
||||
color: #2478ff;
|
||||
line-height: 24px;
|
||||
}
|
||||
|
||||
width: 126px;
|
||||
height: 36px;
|
||||
border: none;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.btnone {
|
||||
cursor: pointer;
|
||||
position: absolute;
|
||||
right: 140px;
|
||||
|
||||
.image {
|
||||
padding-top: 8px;
|
||||
width: 18px;
|
||||
height: 17px;
|
||||
// margin-top: 10px;
|
||||
margin-left: -60px;
|
||||
}
|
||||
|
||||
.shangchuan {
|
||||
position: absolute;
|
||||
right: 20px;
|
||||
top: 7px;
|
||||
display: inline-block;
|
||||
margin-left: 10px;
|
||||
font-size: 14px;
|
||||
font-weight: 500;
|
||||
color: #2478ff;
|
||||
line-height: 24px;
|
||||
}
|
||||
|
||||
width: 126px;
|
||||
height: 36px;
|
||||
border: 1px solid #2478ff;
|
||||
border-radius: 4px;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.btntwo {
|
||||
cursor: pointer;
|
||||
position: absolute;
|
||||
width: 126px;
|
||||
height: 36px;
|
||||
background: #2478ff;
|
||||
border-radius: 4px;
|
||||
font-size: 14px;
|
||||
font-weight: 500;
|
||||
color: #ffffff;
|
||||
border: 0;
|
||||
right: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.thinline {
|
||||
margin-top: 66px;
|
||||
// width: 1635px;
|
||||
border-top: 1px solid #878b92;
|
||||
margin-left: -50px;
|
||||
opacity: 0.2;
|
||||
}
|
||||
|
||||
.bottom {
|
||||
margin-top: 31px;
|
||||
// width: 100px;
|
||||
// height: 100px;
|
||||
// background-color: #bfa;
|
||||
.header {
|
||||
display: flex;
|
||||
|
||||
.avator {
|
||||
width: 41px;
|
||||
height: 41px;
|
||||
border-radius: 50%;
|
||||
// background-image: url(../../assets/image/px.png);
|
||||
background-size: 100%;
|
||||
}
|
||||
|
||||
.id {
|
||||
margin-left: 8px;
|
||||
font-size: 14px;
|
||||
height: 41px;
|
||||
font-weight: bold;
|
||||
color: #333333;
|
||||
line-height: 41px;
|
||||
}
|
||||
|
||||
.showCareer {
|
||||
margin-left: 7px;
|
||||
height: 41px;
|
||||
font-size: 12px;
|
||||
font-weight: 500;
|
||||
color: #666666;
|
||||
line-height: 41px;
|
||||
}
|
||||
|
||||
.idThink {
|
||||
margin-left: 17px;
|
||||
height: 41px;
|
||||
font-size: 14px;
|
||||
font-weight: 500;
|
||||
color: #666666;
|
||||
line-height: 41px;
|
||||
}
|
||||
}
|
||||
|
||||
.discuss {
|
||||
margin-left: 48px;
|
||||
margin-top: 23px;
|
||||
// width: 100px;
|
||||
width: 100%;
|
||||
// height: 100px;
|
||||
// background-color: orange;
|
||||
.discussmain {
|
||||
// background-color: red;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
position: relative;
|
||||
|
||||
.talkmain {
|
||||
margin-right: 25px;
|
||||
margin-top: 2px;
|
||||
font-size: 14px;
|
||||
font-weight: 500;
|
||||
color: #666666;
|
||||
}
|
||||
|
||||
// .talk {
|
||||
// position: absolute;
|
||||
// right: 0;
|
||||
// width: 23px;
|
||||
// height: 23px;
|
||||
// background-image: url(../../assets/image/talk.png);
|
||||
// background-size: 100%;
|
||||
// }
|
||||
}
|
||||
|
||||
.intime {
|
||||
margin-top: 11px;
|
||||
font-size: 14px;
|
||||
font-weight: 500;
|
||||
color: #999999;
|
||||
}
|
||||
|
||||
.likeYou {
|
||||
margin-top: 15px;
|
||||
display: flex;
|
||||
|
||||
.same {
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
}
|
||||
|
||||
.pinglun {
|
||||
background-image: url(../../assets/image/pinglun.png);
|
||||
background-size: 100%;
|
||||
}
|
||||
|
||||
.dianzan {
|
||||
background-image: url(../../assets/image/dianzan2.png);
|
||||
background-size: 100%;
|
||||
}
|
||||
|
||||
.count {
|
||||
margin-left: 7px;
|
||||
margin-top: -1px;
|
||||
font-size: 14px;
|
||||
font-weight: 500;
|
||||
color: #b3bdc4;
|
||||
}
|
||||
}
|
||||
|
||||
.reply {
|
||||
display: flex;
|
||||
margin-top: 32px;
|
||||
// height: 100px;
|
||||
width: 100%;
|
||||
// background-color: lightpink;
|
||||
.sameava {
|
||||
width: 29px;
|
||||
height: 29px;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.sameuser {
|
||||
margin-left: 14px;
|
||||
line-height: 29px;
|
||||
height: 29px;
|
||||
font-weight: bold;
|
||||
color: #333333;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.centerreply {
|
||||
height: 29px;
|
||||
font-size: 14px;
|
||||
font-weight: 500;
|
||||
color: #4a9cf8;
|
||||
line-height: 29px;
|
||||
margin-left: 23px;
|
||||
margin-right: 17px;
|
||||
}
|
||||
|
||||
.avaone {
|
||||
// background-image: url(../../assets/image/px.png);
|
||||
background-size: 100%;
|
||||
}
|
||||
|
||||
.avatwo {
|
||||
// background-image: url(../../assets/image/px.png);
|
||||
background-size: 100%;
|
||||
}
|
||||
|
||||
.replytime {
|
||||
margin-left: 17px;
|
||||
height: 29px;
|
||||
font-size: 14px;
|
||||
font-weight: 500;
|
||||
color: #999999;
|
||||
line-height: 29px;
|
||||
}
|
||||
}
|
||||
|
||||
.allreplyimg {
|
||||
display: flex;
|
||||
margin-top: 21px;
|
||||
|
||||
.singleimg {
|
||||
margin-right: 7px;
|
||||
width: 65px;
|
||||
height: 65px;
|
||||
border-radius: 8px;
|
||||
background-image: url(../../assets/image/px.png);
|
||||
background-size: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.mainreply {
|
||||
display: flex;
|
||||
margin-top: 16px;
|
||||
|
||||
.replydetail {
|
||||
height: 23px;
|
||||
font-size: 14px;
|
||||
font-weight: 500;
|
||||
color: #666666;
|
||||
line-height: 23px;
|
||||
margin-right: 11px;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.inreply {
|
||||
position: relative;
|
||||
margin-top: -22px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user