|
|
@@ -1,8 +1,13 @@
|
|
|
<template>
|
|
|
<div class="forum_look">
|
|
|
+ <!-- 回帖按钮 -->
|
|
|
+ <div class="ulTitleBtn" @click="fuTxtShow = true">回 帖</div>
|
|
|
<div class="title">
|
|
|
- <span>中国人民解放军陆军勤务学院论坛</span>
|
|
|
- <ul>
|
|
|
+ <div class="rowBack el-icon-arrow-left" @click='backList'>
|
|
|
+ 返回
|
|
|
+ </div>
|
|
|
+ <span>论 坛</span>
|
|
|
+ <!-- <ul>
|
|
|
<li
|
|
|
:class="{ active: item.type === lookInfo.type }"
|
|
|
v-for="item in tab"
|
|
|
@@ -15,30 +20,31 @@
|
|
|
src="../../assets/img/back.png"
|
|
|
alt=""
|
|
|
@click="$emit('cutComFn', {})"
|
|
|
- />
|
|
|
+ /> -->
|
|
|
</div>
|
|
|
- <div class="conten">
|
|
|
- <div class="row">
|
|
|
+ <div class="conten" v-show="!fuTxtShow">
|
|
|
+ <div class="row rowOne">
|
|
|
+ <div class="xian"></div>
|
|
|
<!-- 头像 -->
|
|
|
<div class="buddha">
|
|
|
- <img src="../../assets/img/lttx.png" alt="">
|
|
|
+ <i class="el-icon-user-solid"></i>
|
|
|
</div>
|
|
|
<span>{{ lookInfo.creatorName }}</span>
|
|
|
<h3>{{ lookInfo.title }}</h3>
|
|
|
<p v-html="lookInfo.content"></p>
|
|
|
<div class="row_bott">
|
|
|
- <span>发表时间：{{ lookInfo.createTime }}</span>
|
|
|
+ <span>发表于：{{ lookInfo.createTime }}</span>
|
|
|
<div class="inco">
|
|
|
<div title="赞" @click="clickLikeOne('upVote', lookInfo.id)">
|
|
|
- <img src="../../assets/img/good.png" alt="" />({{
|
|
|
+ <img :src="require(`@/assets/img/${lookInfo.flag?'goodAc':'good'}.png`)" alt="" /> 点赞 ({{
|
|
|
lookInfo.upVote ? lookInfo.upVote : 0
|
|
|
}})
|
|
|
</div>
|
|
|
- <div title="踩" @click="clickUnlikeOne('unVote', lookInfo.id)">
|
|
|
+ <!-- <div title="踩" @click="clickUnlikeOne('unVote', lookInfo.id)">
|
|
|
<img src="../../assets/img/goodNo.png" alt="" />({{
|
|
|
lookInfo.unVote ? lookInfo.unVote : 0
|
|
|
}})
|
|
|
- </div>
|
|
|
+ </div> -->
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
@@ -47,51 +53,48 @@
|
|
|
<div class="row" v-for="item in dataArr" :key="item.id" v-else>
|
|
|
<!-- 头像 -->
|
|
|
<div class="buddha">
|
|
|
- <img src="../../assets/img/lttx.png" alt="">
|
|
|
+ <i class="el-icon-user-solid"></i>
|
|
|
</div>
|
|
|
<span>{{ item.creatorName }}</span>
|
|
|
<h3> </h3>
|
|
|
<p v-html="item.content"></p>
|
|
|
<div class="row_bott">
|
|
|
- <span>发表时间：{{ item.createTime }}</span>
|
|
|
+ <span>发表于：{{ item.createTime }}</span>
|
|
|
<div class="inco">
|
|
|
<div title="赞" @click="clickLike('upVote', item.id)">
|
|
|
- <img src="../../assets/img/good.png" alt="" />({{
|
|
|
+ <img :src="require(`@/assets/img/${item.flag?'goodAc':'good'}.png`)" alt="" /> 点赞 ({{
|
|
|
item.upVote ? item.upVote : 0
|
|
|
}})
|
|
|
</div>
|
|
|
- <div title="踩" @click="clickUnlike('unVote', item.id)">
|
|
|
+ <!-- <div title="踩" @click="clickUnlike('unVote', item.id)">
|
|
|
<img src="../../assets/img/goodNo.png" alt="" />({{
|
|
|
item.unVote ? item.unVote : 0
|
|
|
}})
|
|
|
- </div>
|
|
|
+ </div> -->
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
+ <!-- 分页 -->
|
|
|
+ <div class="paging" v-show="!fuTxtShow">
|
|
|
+ <el-pagination
|
|
|
+ layout="prev, pager, next"
|
|
|
+ :total="total"
|
|
|
+ :current-page="formData.pageNum"
|
|
|
+ @current-change="currentChange"
|
|
|
+ @size-change="sizeChange"
|
|
|
+ >
|
|
|
+ </el-pagination>
|
|
|
+ </div>
|
|
|
<!-- 底部 -->
|
|
|
- <div class="bottom">
|
|
|
- <!-- 分页 -->
|
|
|
- <div class="paging" v-if="total > 10">
|
|
|
- <el-pagination
|
|
|
- layout="prev, pager, next,jumper"
|
|
|
- :total="total"
|
|
|
- :current-page="formData.pageNum"
|
|
|
- @current-change="currentChange"
|
|
|
- @size-change="sizeChange"
|
|
|
- >
|
|
|
- </el-pagination>
|
|
|
+ <div class="bottom" v-show="fuTxtShow">
|
|
|
+ <!-- 后面加的关闭 -->
|
|
|
+ <div class="rickTextBack el-icon-arrow-left" @click="fuTxtShow = false">
|
|
|
+ 关闭
|
|
|
+ <div></div>
|
|
|
</div>
|
|
|
<div class="rickText">
|
|
|
<div class="inputR">
|
|
|
- <el-input
|
|
|
- type="text"
|
|
|
- placeholder="请输入姓名"
|
|
|
- v-model="name2"
|
|
|
- maxlength="8"
|
|
|
- show-word-limit
|
|
|
- >
|
|
|
- </el-input>
|
|
|
<!-- 上传图片 -->
|
|
|
<el-upload
|
|
|
accept=".png,.jpg,.jpeg,.gif"
|
|
|
@@ -108,11 +111,35 @@
|
|
|
<!-- 富文本 -->
|
|
|
<div id="div1" style="z-index: 1"></div>
|
|
|
<!-- 按钮 -->
|
|
|
+
|
|
|
+ <!-- 按钮 -->
|
|
|
<div class="txtBtn">
|
|
|
+ <div
|
|
|
+ class="nameCut"
|
|
|
+ :class="{ active: !nameShow }"
|
|
|
+ @click="nameShow = false"
|
|
|
+ ></div>
|
|
|
+ <div class="noName">匿 名</div>
|
|
|
+ <div
|
|
|
+ class="nameCut"
|
|
|
+ :class="{ active: nameShow }"
|
|
|
+ @click="nameShow = true"
|
|
|
+ ></div>
|
|
|
+ <el-input
|
|
|
+ :disabled="!nameShow"
|
|
|
+ style="width: 300px"
|
|
|
+ type="text"
|
|
|
+ placeholder="请填写您的姓名"
|
|
|
+ v-model="name2"
|
|
|
+ maxlength="8"
|
|
|
+ show-word-limit
|
|
|
+ >
|
|
|
+ </el-input>
|
|
|
<el-button type="primary" style="width: 120px" @click="reply"
|
|
|
- >回 复</el-button
|
|
|
+ >提 交</el-button
|
|
|
>
|
|
|
</div>
|
|
|
+
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
@@ -134,12 +161,16 @@ export default {
|
|
|
data () {
|
|
|
// 这里存放数据
|
|
|
return {
|
|
|
+ // 选择匿名
|
|
|
+ nameShow: true,
|
|
|
+ // 控制富文本显示和隐藏
|
|
|
+ fuTxtShow: false,
|
|
|
// 点赞-帖子的开关
|
|
|
likeFlagOne: [],
|
|
|
- unLikeFlagOne: [],
|
|
|
+ // unLikeFlagOne: [],
|
|
|
// 点赞-评论的开关
|
|
|
likeFlag: [],
|
|
|
- unLikeFlag: [],
|
|
|
+ // unLikeFlag: [],
|
|
|
baseURL: '',
|
|
|
// 评论列表数据
|
|
|
total: 0,
|
|
|
@@ -147,7 +178,7 @@ export default {
|
|
|
tab: [
|
|
|
{ id: 1, name: '数字史馆', type: 'scene' },
|
|
|
{ id: 2, name: '美丽校园', type: 'school' },
|
|
|
- { id: 3, name: '信息典藏', type: 'goods' }
|
|
|
+ { id: 3, name: '文物典藏', type: 'goods' }
|
|
|
],
|
|
|
formData: {
|
|
|
parentId: null,
|
|
|
@@ -163,6 +194,11 @@ export default {
|
|
|
watch: {},
|
|
|
// 方法集合
|
|
|
methods: {
|
|
|
+ // 点击返回
|
|
|
+ backList () {
|
|
|
+ this.fuTxtShow = false
|
|
|
+ this.$emit('cutComFn', {})
|
|
|
+ },
|
|
|
// 点赞-帖子
|
|
|
async clickLikeOne (type, id) {
|
|
|
if (!this.likeFlagOne.includes(id)) {
|
|
|
@@ -171,20 +207,21 @@ export default {
|
|
|
this.$message.success('点赞成功.')
|
|
|
this.likeFlagOne.push(id)
|
|
|
this.lookInfo.upVote++
|
|
|
+ this.lookInfo.flag = true
|
|
|
} else this.$message.warning(res.msg)
|
|
|
} else this.$message.warning('您已经赞过了.')
|
|
|
},
|
|
|
// 点踩-帖子
|
|
|
- async clickUnlikeOne (type, id) {
|
|
|
- if (!this.unLikeFlagOne.includes(id)) {
|
|
|
- const res = await webBbsLike(type, id)
|
|
|
- if (res.code === 0) {
|
|
|
- this.$message.success('点踩成功.')
|
|
|
- this.unLikeFlagOne.push(id)
|
|
|
- this.lookInfo.unVote++
|
|
|
- } else this.$message.warning(res.msg)
|
|
|
- } else this.$message.warning('您已经踩过了.')
|
|
|
- },
|
|
|
+ // async clickUnlikeOne (type, id) {
|
|
|
+ // if (!this.unLikeFlagOne.includes(id)) {
|
|
|
+ // const res = await webBbsLike(type, id)
|
|
|
+ // if (res.code === 0) {
|
|
|
+ // this.$message.success('点踩成功.')
|
|
|
+ // this.unLikeFlagOne.push(id)
|
|
|
+ // this.lookInfo.unVote++
|
|
|
+ // } else this.$message.warning(res.msg)
|
|
|
+ // } else this.$message.warning('您已经踩过了.')
|
|
|
+ // },
|
|
|
// 点赞-评论
|
|
|
async clickLike (type, id) {
|
|
|
if (!this.likeFlag.includes(id)) {
|
|
|
@@ -197,19 +234,19 @@ export default {
|
|
|
} else this.$message.warning('您已经赞过了.')
|
|
|
},
|
|
|
// 点踩-评论
|
|
|
- async clickUnlike (type, id) {
|
|
|
- if (!this.unLikeFlag.includes(id)) {
|
|
|
- const res = await webBbsLike(type, id)
|
|
|
- if (res.code === 0) {
|
|
|
- this.$message.success('点踩成功.')
|
|
|
- this.unLikeFlag.push(id)
|
|
|
- this.webBbsMesList(this.formData)
|
|
|
- } else this.$message.warning(res.msg)
|
|
|
- } else this.$message.warning('您已经踩过了.')
|
|
|
- },
|
|
|
+ // async clickUnlike (type, id) {
|
|
|
+ // if (!this.unLikeFlag.includes(id)) {
|
|
|
+ // const res = await webBbsLike(type, id)
|
|
|
+ // if (res.code === 0) {
|
|
|
+ // this.$message.success('点踩成功.')
|
|
|
+ // this.unLikeFlag.push(id)
|
|
|
+ // this.webBbsMesList(this.formData)
|
|
|
+ // } else this.$message.warning(res.msg)
|
|
|
+ // } else this.$message.warning('您已经踩过了.')
|
|
|
+ // },
|
|
|
// 点击回复
|
|
|
async reply () {
|
|
|
- if (this.name2.trim() === '') {
|
|
|
+ if (this.name2.trim() === '' && this.nameShow) {
|
|
|
return this.$message.warning('名字不能为空!')
|
|
|
}
|
|
|
if (this.editor.txt.html() === '') {
|
|
|
@@ -228,6 +265,7 @@ export default {
|
|
|
this.editor.txt.html('')
|
|
|
this.$message.success('回帖成功，等待审核.')
|
|
|
this.webBbsMesList(this.formData)
|
|
|
+ this.fuTxtShow = false
|
|
|
} else this.$message.warning(res.msg)
|
|
|
},
|
|
|
// 上传图片
|
|
|
@@ -278,6 +316,12 @@ export default {
|
|
|
const res = await webBbsMesList(data)
|
|
|
this.total = res.data.total
|
|
|
this.dataArr = res.data.records
|
|
|
+ // 点赞高亮的判断
|
|
|
+ this.dataArr.forEach(v => {
|
|
|
+ this.likeFlag.forEach(p => {
|
|
|
+ if (p === v.id) v.flag = true
|
|
|
+ })
|
|
|
+ })
|
|
|
}
|
|
|
},
|
|
|
// 生命周期 - 创建完成（可以访问当前this实例）
|
|
|
@@ -318,58 +362,14 @@ export default {
|
|
|
this.formData.pageNum = 1
|
|
|
this.formData.parentId = this.lookInfo.id
|
|
|
this.webBbsMesList(this.formData)
|
|
|
+ // 看看有没有点赞
|
|
|
+ this.likeFlagOne.forEach(v => {
|
|
|
+ if (v === this.lookInfo.id) this.lookInfo.flag = true
|
|
|
+ })
|
|
|
} // 如果页面有keep-alive缓存功能，这个函数会触发
|
|
|
}
|
|
|
</script>
|
|
|
<style lang='less' scoped>
|
|
|
-/* 分页 */
|
|
|
-/deep/.el-pagination {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
-}
|
|
|
-/deep/.el-pager li {
|
|
|
- color: #b9412e;
|
|
|
- font-weight: 400;
|
|
|
- min-width: 24px;
|
|
|
- width: 28px;
|
|
|
- height: 28px;
|
|
|
- padding: 0;
|
|
|
- margin: 0 8px;
|
|
|
- border: 1px solid #b9412e;
|
|
|
- background-color: transparent;
|
|
|
- border-radius: 50%;
|
|
|
-}
|
|
|
-/deep/.el-pager li:hover {
|
|
|
- color: #b9412e;
|
|
|
-}
|
|
|
-/deep/.el-pager li.active {
|
|
|
- width: 30px;
|
|
|
- height: 30px;
|
|
|
- background-color: #b9412e;
|
|
|
- border-radius: 50%;
|
|
|
- color: #fff;
|
|
|
-}
|
|
|
-/deep/.el-pager li.active + li {
|
|
|
- border: 1px solid #c7c7c7;
|
|
|
-}
|
|
|
-/deep/.el-pagination button:hover {
|
|
|
- color: #b9412e;
|
|
|
-}
|
|
|
-/deep/.el-pagination .btn-next {
|
|
|
- background-color: transparent;
|
|
|
- color: #b9412e;
|
|
|
-}
|
|
|
-/deep/.el-pagination .btn-prev {
|
|
|
- background-color: transparent;
|
|
|
- color: #b9412e;
|
|
|
-}
|
|
|
-/deep/.el-pager li.active + li {
|
|
|
- border: 1px solid #b9412e;
|
|
|
-}
|
|
|
-/deep/.el-pagination button:disabled {
|
|
|
- color: #fff9ec;
|
|
|
- background-color: transparent;
|
|
|
-}
|
|
|
::-webkit-scrollbar {
|
|
|
/*滚动条整体样式*/
|
|
|
width: 3px; /*高宽分别对应横竖滚动条的尺寸*/
|
|
|
@@ -379,7 +379,7 @@ export default {
|
|
|
/*滚动条里面小方块*/
|
|
|
border-radius: 10px;
|
|
|
box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
|
|
|
- background: #b9412e;
|
|
|
+ background: rgba(185, 46, 46, 0.3);
|
|
|
}
|
|
|
::-webkit-scrollbar-track {
|
|
|
/*滚动条里面轨道*/
|
|
|
@@ -388,77 +388,97 @@ export default {
|
|
|
background: #fff9ec;
|
|
|
}
|
|
|
.forum_look {
|
|
|
- margin: 0 auto;
|
|
|
+ border-top: 8px solid #be1220;
|
|
|
+ border-bottom: 8px solid #be1220;
|
|
|
+ padding: 0 12px;
|
|
|
+ background: url("../../assets/img/forBac.png") #f0dbbf center center no-repeat;
|
|
|
+ position: fixed;
|
|
|
+ top: 50%;
|
|
|
+ left: 50%;
|
|
|
+ transform: translate(-50%, -50%);
|
|
|
width: 1200px;
|
|
|
- height: 100vh;
|
|
|
- min-height: 800px;
|
|
|
- overflow-y: auto;
|
|
|
+ height: 650px;
|
|
|
+ .ulTitleBtn {
|
|
|
+ font-size: 18px;
|
|
|
+ color: #fff;
|
|
|
+ cursor: pointer;
|
|
|
+ position: absolute;
|
|
|
+ top: 10px;
|
|
|
+ right: 50px;
|
|
|
+ width: 100px;
|
|
|
+ height: 40px;
|
|
|
+ line-height: 40px;
|
|
|
+ text-align: center;
|
|
|
+ background-color: #f2cd83;
|
|
|
+ border-radius: 5px;
|
|
|
+ }
|
|
|
+ .rowBack {
|
|
|
+ z-index: 100;
|
|
|
+ position: absolute;
|
|
|
+ height: 50px;
|
|
|
+ line-height: 50px;
|
|
|
+ color: #cb444e;
|
|
|
+ cursor: pointer;
|
|
|
+ & > div {
|
|
|
+ background-color: #b92e2e;
|
|
|
+ position: absolute;
|
|
|
+ bottom: 0;
|
|
|
+ left: 10px;
|
|
|
+ width: 1156px;
|
|
|
+ height: 1px;
|
|
|
+ }
|
|
|
+ }
|
|
|
.title {
|
|
|
- position: relative;
|
|
|
- color: #f3eabd;
|
|
|
+ color: #fff;
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
height: 60px;
|
|
|
- background-color: #bd1b1b;
|
|
|
& > span {
|
|
|
font-weight: 700;
|
|
|
- padding-left: 40px;
|
|
|
+ padding-left: 80px;
|
|
|
font-size: 26px;
|
|
|
- margin-right: 100px;
|
|
|
- }
|
|
|
- & > ul {
|
|
|
- height: 62px;
|
|
|
- display: flex;
|
|
|
- & > li {
|
|
|
- margin-right: 30px;
|
|
|
- letter-spacing: 2px;
|
|
|
- font-weight: 600;
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- justify-content: center;
|
|
|
- height: 100%;
|
|
|
- width: 150px;
|
|
|
- font-size: 22px;
|
|
|
- text-align: center;
|
|
|
- }
|
|
|
- .active {
|
|
|
- border-bottom: 5px solid #f3eabd;
|
|
|
- }
|
|
|
- }
|
|
|
- & > img {
|
|
|
- margin-left: 40px;
|
|
|
- cursor: pointer;
|
|
|
}
|
|
|
}
|
|
|
.conten {
|
|
|
+ border-radius: 5px 5px 0 0;
|
|
|
+ position: relative;
|
|
|
+ height: 480px;
|
|
|
+ overflow-y: auto;
|
|
|
color: #5f5f5f;
|
|
|
- background-color: #fff9ec;
|
|
|
- padding: 20px 50px 20px 30px;
|
|
|
+ background-color: rgba(255, 255, 255, 0.3);
|
|
|
+ padding: 10px 50px 20px 30px;
|
|
|
.row {
|
|
|
padding-top: 10px;
|
|
|
position: relative;
|
|
|
- border-bottom: 1px solid #ccc;
|
|
|
- .buddha{
|
|
|
+ border-bottom: 1px dashed #d5a6a6;
|
|
|
+ .buddha {
|
|
|
+ text-align: center;
|
|
|
position: absolute;
|
|
|
- width: 70px;
|
|
|
- height: 70px;
|
|
|
+ width: 130px;
|
|
|
+ height: 50px;
|
|
|
overflow: hidden;
|
|
|
- border-radius: 50%;
|
|
|
left: 0px;
|
|
|
- top: 50px;
|
|
|
- &>img{
|
|
|
- width: 100%;
|
|
|
- height: 100%;
|
|
|
+ top: 31px;
|
|
|
+ & > i {
|
|
|
+ width: 50px;
|
|
|
+ height: 50px;
|
|
|
+ line-height: 50px;
|
|
|
+ background-color: #fff;
|
|
|
+ border-radius: 50%;
|
|
|
+ font-size: 30px;
|
|
|
+ color: #e7cfcf;
|
|
|
}
|
|
|
}
|
|
|
& > span {
|
|
|
+ width: 130px;
|
|
|
+ text-align: center;
|
|
|
position: absolute;
|
|
|
left: 0px;
|
|
|
- top: 10px;
|
|
|
+ top: 91px;
|
|
|
}
|
|
|
+
|
|
|
& > h3 {
|
|
|
text-align: center;
|
|
|
- margin-bottom: 20px;
|
|
|
}
|
|
|
& > p {
|
|
|
width: 80%;
|
|
|
@@ -476,10 +496,9 @@ export default {
|
|
|
color: #a8a8a8;
|
|
|
}
|
|
|
.inco {
|
|
|
- width: 120px;
|
|
|
- justify-content: space-between;
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
+ position: absolute;
|
|
|
+ right: 0;
|
|
|
+ bottom: 15px;
|
|
|
& > div {
|
|
|
cursor: pointer;
|
|
|
display: flex;
|
|
|
@@ -488,6 +507,29 @@ export default {
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
+ .rowOne {
|
|
|
+ .row_bott .inco{
|
|
|
+ bottom: 0;
|
|
|
+ }
|
|
|
+ border-bottom: none;
|
|
|
+ &>h3{
|
|
|
+ margin-bottom: 10px;
|
|
|
+ }
|
|
|
+ .buddha {
|
|
|
+ top: 41px;
|
|
|
+ }
|
|
|
+ & > span {
|
|
|
+ top: 101px;
|
|
|
+ }
|
|
|
+ .xian {
|
|
|
+ width: 1136px;
|
|
|
+ position: absolute;
|
|
|
+ bottom: -14px;
|
|
|
+ left: -20px;
|
|
|
+ height: 1px;
|
|
|
+ background-color: #be1220;
|
|
|
+ }
|
|
|
+ }
|
|
|
.rowNull {
|
|
|
height: 100px;
|
|
|
line-height: 100px;
|
|
|
@@ -496,33 +538,74 @@ export default {
|
|
|
text-align: center;
|
|
|
}
|
|
|
}
|
|
|
+ .paging {
|
|
|
+ /deep/.el-pager li {
|
|
|
+ background-color: transparent;
|
|
|
+ color: #333333;
|
|
|
+ }
|
|
|
+ /deep/.el-pager li.active {
|
|
|
+ color: #b92e2e;
|
|
|
+ }
|
|
|
+ /deep/.el-pagination button {
|
|
|
+ background-color: transparent;
|
|
|
+ }
|
|
|
+ /deep/.el-pagination button:disabled {
|
|
|
+ background-color: transparent;
|
|
|
+ }
|
|
|
+ border-radius: 0 0 5px 5px;
|
|
|
+ background-color: rgba(255, 255, 255, 0.3);
|
|
|
+ height: 80px;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ }
|
|
|
.bottom {
|
|
|
- padding: 0 20px 20px 20px;
|
|
|
- background-color: #fff9ec;
|
|
|
- .paging {
|
|
|
- /deep/.el-input__inner {
|
|
|
- color: #b9412e;
|
|
|
- width: 30px;
|
|
|
- height: 30px !important;
|
|
|
- background-color: transparent;
|
|
|
- border-color: #b9412e;
|
|
|
- border-radius: 50%;
|
|
|
+ padding: 12px;
|
|
|
+ width: 100%;
|
|
|
+ position: absolute;
|
|
|
+ bottom: 40px;
|
|
|
+ left: 0;
|
|
|
+ .rickTextBack {
|
|
|
+ position: relative;
|
|
|
+ padding-left: 20px;
|
|
|
+ width: 100%;
|
|
|
+ height: 50px;
|
|
|
+ line-height: 50px;
|
|
|
+ color: #cb444e;
|
|
|
+ background-color: rgba(255, 255, 255, 0.3);
|
|
|
+ cursor: pointer;
|
|
|
+ & > div {
|
|
|
+ background-color: #b92e2e;
|
|
|
+ position: absolute;
|
|
|
+ bottom: 0;
|
|
|
+ left: 10px;
|
|
|
+ width: 1156px;
|
|
|
+ height: 1px;
|
|
|
}
|
|
|
- /deep/.el-pagination__jump {
|
|
|
- color: #b9412e;
|
|
|
+ }
|
|
|
+ .rickTextBack {
|
|
|
+ position: relative;
|
|
|
+ padding-left: 20px;
|
|
|
+ width: 100%;
|
|
|
+ height: 50px;
|
|
|
+ line-height: 50px;
|
|
|
+ color: #cb444e;
|
|
|
+ background-color: rgba(255, 255, 255, 0.3);
|
|
|
+ cursor: pointer;
|
|
|
+ & > div {
|
|
|
+ background-color: #b92e2e;
|
|
|
+ position: absolute;
|
|
|
+ bottom: 0;
|
|
|
+ left: 10px;
|
|
|
+ width: 1156px;
|
|
|
+ height: 1px;
|
|
|
}
|
|
|
- height: 80px;
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- justify-content: center;
|
|
|
}
|
|
|
.rickText {
|
|
|
width: 100%;
|
|
|
- background-color: #fffcf6;
|
|
|
+ background-color: rgba(255, 255, 255, 0.3);
|
|
|
padding: 20px;
|
|
|
.inputR {
|
|
|
- display: flex;
|
|
|
- margin-bottom: 20px;
|
|
|
position: relative;
|
|
|
.imgUplod {
|
|
|
/deep/.w-e-icon-image {
|
|
|
@@ -541,8 +624,8 @@ export default {
|
|
|
cursor: pointer;
|
|
|
position: absolute;
|
|
|
z-index: 9999;
|
|
|
- top: 61px;
|
|
|
- right: 0px;
|
|
|
+ top: 1px;
|
|
|
+ right: 1px;
|
|
|
width: 40px;
|
|
|
height: 40px;
|
|
|
&:hover {
|
|
|
@@ -554,9 +637,61 @@ export default {
|
|
|
}
|
|
|
}
|
|
|
.txtBtn {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ position: relative;
|
|
|
margin-top: 20px;
|
|
|
+ /deep/.el-button {
|
|
|
+ width: 120px;
|
|
|
+ height: 40px;
|
|
|
+ position: absolute;
|
|
|
+ right: 20px;
|
|
|
+ bottom: 0;
|
|
|
+ color: #d8b380;
|
|
|
+ font-size: 18px;
|
|
|
+ }
|
|
|
+ .nameCut {
|
|
|
+ cursor: pointer;
|
|
|
+ position: relative;
|
|
|
+ margin-right: 10px;
|
|
|
+ width: 20px;
|
|
|
+ height: 20px;
|
|
|
+ border-radius: 50%;
|
|
|
+ border: 1px solid #b9412e;
|
|
|
+ }
|
|
|
+ .noName{
|
|
|
+ margin-right: 30px;
|
|
|
+ }
|
|
|
+ .active {
|
|
|
+ &::after {
|
|
|
+ content: "";
|
|
|
+ position: absolute;
|
|
|
+ top: 50%;
|
|
|
+ left: 50%;
|
|
|
+ transform: translate(-50%, -50%);
|
|
|
+ width: 15px;
|
|
|
+ height: 15px;
|
|
|
+ border-radius: 50%;
|
|
|
+ background-color: #b9412e;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ /deep/.el-input.is-disabled .el-input__inner{
|
|
|
+ background-color: #e9ebec;
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
+ /deep/.el-input__inner {
|
|
|
+ background-color: rgba(255, 255, 255, 0.5);
|
|
|
+ }
|
|
|
+ /deep/.el-input__count-inner {
|
|
|
+ background-color: transparent;
|
|
|
+ }
|
|
|
+ /deep/.w-e-toolbar {
|
|
|
+ background-color: rgba(255, 255, 255, 0.5) !important;
|
|
|
+ }
|
|
|
+ /deep/.w-e-text-container {
|
|
|
+ background-color: rgba(255, 255, 255, 0.5) !important;
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
</style>
|
