mirror of
https://codeup.aliyun.com/67762337eccfc218f6110e0e/vue/learning-system-portal.git
synced 2025-12-15 22:06:43 +08:00
772 lines
25 KiB
Vue
772 lines
25 KiB
Vue
<template>
|
||
<div class="note-info-index" style="padding: 38px 42px;">
|
||
<div class="note-hear">
|
||
<h3>我的笔记</h3>
|
||
<div>
|
||
<el-dropdown style="margin-left:15px" @command="exportCommand">
|
||
<el-button>
|
||
导出<i class="el-icon-arrow-down el-icon--right"></i>
|
||
</el-button>
|
||
<el-dropdown-menu slot="dropdown">
|
||
<el-dropdown-item command="1">PDF</el-dropdown-item>
|
||
<el-dropdown-item command="2">Excel</el-dropdown-item>
|
||
</el-dropdown-menu>
|
||
</el-dropdown>
|
||
<el-dropdown style="margin-left:15px" @command="importCommand">
|
||
<el-button>
|
||
导入<i class="el-icon-arrow-down el-icon--right"></i>
|
||
</el-button>
|
||
<el-dropdown-menu slot="dropdown">
|
||
<el-dropdown-item command="3">图片</el-dropdown-item>
|
||
<el-dropdown-item command="1">Txt</el-dropdown-item>
|
||
<el-dropdown-item command="2">Word</el-dropdown-item>
|
||
</el-dropdown-menu>
|
||
</el-dropdown>
|
||
|
||
</div>
|
||
</div>
|
||
<div class="note-sift">
|
||
<el-date-picker
|
||
style="width:250px"
|
||
@change="Time()"
|
||
value-format="yyyy-MM-dd HH:mm:ss"
|
||
v-model="Filtertime"
|
||
type="daterange"
|
||
start-placeholder="开始"
|
||
end-placeholder="结束">
|
||
</el-date-picker>
|
||
<el-dropdown @command="handleCommand">
|
||
<el-button>
|
||
全部课程<i class="el-icon-arrow-down el-icon--right"></i>
|
||
</el-button>
|
||
<el-dropdown-menu slot="dropdown" style="height: 150px;overflow-y: auto !important;">
|
||
<el-dropdown-item command="">全部</el-dropdown-item>
|
||
<el-dropdown-item v-for="cou in couresna" :command="cou.courseId">{{cou.courseName}}</el-dropdown-item>
|
||
</el-dropdown-menu>
|
||
</el-dropdown>
|
||
<el-button @click="publish" class="el-buttons">
|
||
修改时间
|
||
<i v-if="ordertime" class="el-icon-bottom"></i>
|
||
<i v-else class="el-icon-upload2"></i>
|
||
</el-button>
|
||
<el-button @click="thumbs" class="el-buttons">
|
||
点赞次数
|
||
<i v-if="orderpiss" class="el-icon-bottom"></i>
|
||
<i v-else class="el-icon-upload2"></i>
|
||
</el-button>
|
||
</div>
|
||
<div class="note-tab">
|
||
<div class="tabcontent">
|
||
<span @click="noteData(null)" :class=" num == null ? 'tab-textactive':''" >全部</span>
|
||
<span @click="noteData(1)" :class=" num == 1 ? 'tab-textactive':''" >线上笔记</span>
|
||
<span @click="noteData(2)" :class=" num == 2 ? 'tab-textactive':''" >导入笔记</span>
|
||
</div>
|
||
</div>
|
||
<div class="note-all">
|
||
<div class="note-all-info" v-for="(item,idx) in datalist" :key="idx">
|
||
<div class="all-title">
|
||
<h3> {{ item.courseName }} </h3>
|
||
<div v-if="item.type==2">导入</div>
|
||
<div v-if="item.playTime != ''"><img src="../../../public/images/coteplay.png" alt=""> {{ getHMS(item.playTime) }} </div>
|
||
<span style="margin-left:14px">{{item.openType == 9?'公开':'私密'}}</span>
|
||
<h6>{{ item.sysUpdateTime }}</h6>
|
||
</div>
|
||
<div class="all-content">
|
||
<span v-if="item.contentType != 3">{{ item.content }}</span>
|
||
<div v-else>
|
||
<template v-for="img in item.content">
|
||
<img :src="fileBaseUrl + img" alt=""/>
|
||
</template>
|
||
</div>
|
||
</div>
|
||
<div class="all-footer">
|
||
<div>
|
||
<div class="textbut-box">
|
||
<interactBar v-if="item.type == 1" nodeWidth="60px" :readonly="true" :type="6" :data="item" :shares="false" :comments="false" :answers="true" :clickAnswer="true" :views="false"></interactBar>
|
||
<el-button @click="open(item)" style=" margin-right: 10px;" class="textbut" type="text">
|
||
<svg-icon icon-class="notedel" ></svg-icon>删除</el-button>
|
||
<el-button @click="edit(item)" class="textbut" type="text">
|
||
<svg-icon icon-class="noteedit" ></svg-icon> 编辑</el-button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div style="margin-top:50px;text-align: center">
|
||
<el-pagination
|
||
background
|
||
@size-change="handleSizeChange"
|
||
@current-change="handleCurrentChange"
|
||
:current-page="pageIndex"
|
||
:page-sizes="[10, 20, 30, 40]"
|
||
:page-size="paegSize"
|
||
layout="total, sizes, prev, pager, next, jumper"
|
||
:total="count">
|
||
</el-pagination>
|
||
</div>
|
||
</div>
|
||
<!-- 导入 -->
|
||
<el-dialog
|
||
:visible.sync="importDialogVisible"
|
||
width="785px"
|
||
:close-on-click-modal="false">
|
||
<div class="import-info">
|
||
<p class="import-info-tip">导入笔记</p>
|
||
<div class="import-info-enclosure">
|
||
<label class="label"><svg-icon style="font-size:12px;margin-right:5px" icon-class="red-start"></svg-icon>标题</label>
|
||
<el-input
|
||
type="text"
|
||
placeholder="请输入内容"
|
||
v-model="noteFile.courseName"
|
||
maxlength="20"
|
||
show-word-limit/>
|
||
</div>
|
||
<div class="import-info-enclosure">
|
||
<label class="label" style="width:66px"><svg-icon style="font-size:16px;margin-right:5px" icon-class="enclisure"></svg-icon>附件</label>
|
||
<file-upload dir="files" ref="myUpload" :isClear="importDialogVisible" :fileType="upNoteFile.fileType" :showList="true" :value="imageShowUrl" :limit="upNoteFile.limit" @success="handleUploadSuccess" @remove="handleRemoveSuccess"></file-upload>
|
||
</div>
|
||
</div>
|
||
<span slot="footer" class="dialog-footer">
|
||
<el-button @click="importDialogVisible = false">取 消</el-button>
|
||
<el-button type="primary" @click="noteSave()">确 定</el-button>
|
||
</span>
|
||
</el-dialog>
|
||
<el-dialog
|
||
width="860px"
|
||
class="export-dialog"
|
||
:close-on-click-modal="false"
|
||
:visible.sync="dialogVisible">
|
||
<div class="Exportbox">
|
||
<div class="export-dialog-top">
|
||
<div class="export-dialog-left">
|
||
<author-img :avatar="userData.avatar" :aid="userData.aid" :sex="userData.sex"></author-img>
|
||
<div class="userInfo-info">
|
||
<p><span style="font-weight: 500;font-size: 22px;">{{userData.name}}</span><span style="font-size: 12px;margin-left:10px">{{userInfo.departFullName}}</span></p>
|
||
<p>{{userData.sign}}</p>
|
||
</div>
|
||
</div>
|
||
<div class="export-dialog-right">
|
||
<p>累计导出{{datalist.length}}条</p>
|
||
<p style="margin-top:10px">导出时间：{{formatDate(new Date())}}</p>
|
||
</div>
|
||
|
||
</div>
|
||
<div class="export-dialog-body">
|
||
<div class="Export-info" style="" v-for="(item,idx) in datalist" :key="idx">
|
||
<div class="all-title">
|
||
<h3> {{item.courseName}}</h3>
|
||
<div v-if="item.playTime != ''"><img src="../../../public/images/coteplay.png" alt="">{{item.playTime}}</div>
|
||
<h6>{{item.sysCreateTime}}</h6>
|
||
</div>
|
||
<div class="all-content">
|
||
<span v-if="item.contentType != 3">{{ item.content }}</span>
|
||
<div v-else>
|
||
<template v-for="img in item.content">
|
||
<img style="max-height:145px;max-width:140px" :src="fileBaseUrl + img" alt=""/>
|
||
</template>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<span slot="footer" class="dialog-footer">
|
||
<el-button class="footer-btn" style="color: #387DF7;" plain @click="dialogVisible = false">取 消</el-button>
|
||
<!-- <el-button @click="dialogVisible = false">打 印</el-button> -->
|
||
<el-button class="footer-btn" style="margin-right:36px" type="primary" @click="exportStart()">确 定</el-button>
|
||
</span>
|
||
</el-dialog>
|
||
|
||
</div>
|
||
</template>
|
||
|
||
<script>
|
||
import apiNote from '@/api/phase2/note.js';
|
||
import interactBar from '@/components/Portal/interactBar.vue';
|
||
import FileUpload from '@/components/NoteUpload/index.vue';
|
||
import AuthorImg from '@/components/Portal/authorImg.vue';
|
||
import { mapGetters } from 'vuex';
|
||
import {formatDate} from '@/utils/tools.js';
|
||
import apiUser from "@/api/system/user.js";
|
||
export default {
|
||
components:{interactBar,FileUpload,AuthorImg},
|
||
computed: {
|
||
...mapGetters(['userInfo'])
|
||
},
|
||
data(){
|
||
return{
|
||
userData:{},
|
||
formatDate,
|
||
noteFile:{
|
||
contentType:null,
|
||
type:2,
|
||
courseName:'',
|
||
filePath:'',
|
||
fileName:'',
|
||
openType:1,
|
||
},
|
||
upNoteFile:{
|
||
content:[],
|
||
fileType:[],//文件上传格式
|
||
contentType:null,
|
||
limit:1,
|
||
},
|
||
|
||
uploadFileUrl: process.env.VUE_APP_BASE_API + '/xboe/sys/xuploader/file/upload',
|
||
text:'',
|
||
importDialogVisible:false,
|
||
imageShowUrl:'',
|
||
count:0,
|
||
fileBaseUrl: process.env.VUE_APP_FILE_BASE_URL,
|
||
options: [{
|
||
value: '选项1',
|
||
label: 'PDF'
|
||
}, {
|
||
value: '选项2',
|
||
label: 'Excel'
|
||
}],
|
||
value1: '起止时间',
|
||
num :null,
|
||
dialogVisible: false,
|
||
pageIndex:1,
|
||
paegSize:10,
|
||
orderType:true,
|
||
orderField:'',
|
||
courseId:'',
|
||
startTime:'',
|
||
endTime:'',
|
||
datalist:[ ],
|
||
thu:true,
|
||
couresna:[],
|
||
courseName:'',
|
||
ordertime:true,
|
||
orderpiss:true,
|
||
Filtertime:[],
|
||
}
|
||
|
||
|
||
},
|
||
mounted(){
|
||
this.noteData(null);
|
||
this.allcoures();
|
||
apiUser.getByIds([this.userInfo.aid]).then(res => {
|
||
if (res.status == 200) {
|
||
this.userData = res.result[0];
|
||
} else {
|
||
this.$message.error(res.message);
|
||
}
|
||
});
|
||
},
|
||
methods: {
|
||
exportCommand(e) {
|
||
this.exportType = e;
|
||
this.dialogVisible = true;
|
||
},
|
||
exportStart(){
|
||
let ids = this.datalist.map(item=>{
|
||
if(item.contentType !=3) {
|
||
return item.id;
|
||
}
|
||
})
|
||
let data = {
|
||
name:this.userData.name,
|
||
sign:this.userData.sign,
|
||
ids:ids,
|
||
author:this.userData.avatar,//this.userInfo.avatar,
|
||
}
|
||
if(this.exportType == '1') {
|
||
apiNote.exportPdf(data).then(res=>{
|
||
if(res.status) {
|
||
this.$message.error('导出失败');
|
||
} else {
|
||
const link = document.createElement('a');// 创建a标签
|
||
let blob = new Blob([res],{type: 'application/vnd.ms-pdf;charset=UTF-8'}); // 设置文件类型
|
||
link.style.display = "none";
|
||
link.href = URL.createObjectURL(blob); // 创建URL
|
||
link.setAttribute("download", "我的笔记.xls");
|
||
document.body.appendChild(link);
|
||
link.click();
|
||
document.body.removeChild(link);
|
||
this.dialogVisible = false;
|
||
}
|
||
|
||
})
|
||
} else {
|
||
apiNote.exportExcel(ids).then(res=>{
|
||
if(res.status) {
|
||
this.$message.error('导出失败');
|
||
} else {
|
||
const link = document.createElement('a');// 创建a标签
|
||
let blob = new Blob([res],{type: 'application/vnd.ms-excel;charset=UTF-8'}); // 设置文件类型
|
||
link.style.display = "none";
|
||
link.href = URL.createObjectURL(blob); // 创建URL
|
||
link.setAttribute("download", "我的笔记.xls");
|
||
document.body.appendChild(link);
|
||
link.click();
|
||
document.body.removeChild(link);
|
||
this.dialogVisible = false;
|
||
}
|
||
|
||
})
|
||
}
|
||
},
|
||
noteSave() {
|
||
if(this.noteFile.courseName == '') {
|
||
this.$message.warning('请填写标题！');
|
||
return
|
||
}
|
||
this.noteFile.contentType = this.upNoteFile.contentType;
|
||
if(this.upNoteFile.content.length > 0) {
|
||
this.noteFile.filePath = this.upNoteFile.content.join();
|
||
}
|
||
if(this.noteFile.filePath == '') {
|
||
this.$message.warning('您还没有上传文件！');
|
||
return
|
||
}
|
||
apiNote.save(this.noteFile).then(res=>{
|
||
if(res.status == 200) {
|
||
this.$message.success('导入笔记成功');
|
||
this.importDialogVisible = false;
|
||
this.noteFile.courseName = '';
|
||
this.noteData(this.num);
|
||
}
|
||
})
|
||
},
|
||
handleBeforeUpload() {
|
||
|
||
},
|
||
importCommand(e){
|
||
this.importDialogVisible = true;
|
||
this.upNoteFile.contentType = e;
|
||
this.noteFile.filePath = '';
|
||
this.noteFile.fileName = '';
|
||
this.upNoteFile.content = [];
|
||
if(e == '3') {
|
||
this.upNoteFile.limit = 9;
|
||
this.upNoteFile.fileType = ["png","jpg"];
|
||
} else if(e == '1'){
|
||
this.upNoteFile.fileType = ["txt"];
|
||
} else {
|
||
this.upNoteFile.fileType = ["doc","docx"];
|
||
}
|
||
},
|
||
handleRemoveSuccess(file) {
|
||
if(this.upNoteFile.contentType == 1) {
|
||
// this.upNoteFile.content.push()
|
||
// this.noteFile.filePath.replace(file.response.result.filePath+',','');
|
||
this.upNoteFile.content.forEach((item,index) => {
|
||
if(item == file.response.result.filePath) {
|
||
this.upNoteFile.content.splice(index,1);
|
||
}
|
||
});
|
||
} else {
|
||
this.noteFile.filePath ='';
|
||
this.noteFile.fileName = '';
|
||
}
|
||
},
|
||
handleUploadSuccess(file) {
|
||
if(this.upNoteFile.contentType == 3) {
|
||
this.noteFile.fileName = '图片';
|
||
this.upNoteFile.content.push(file.result.filePath);
|
||
// this.noteFile.filePath += file.result.filePath;
|
||
} else {
|
||
this.noteFile.filePath = file.result.filePath;
|
||
this.noteFile.fileName = file.result.displayName;
|
||
}
|
||
},
|
||
handleCommand(e) {
|
||
this.courseId = e;
|
||
this.noteData(this.num);
|
||
},
|
||
Time(val){
|
||
if(this.Filtertime && this.Filtertime.length > 0) {
|
||
this.startTime = this.Filtertime[0];
|
||
this.endTime = this.Filtertime[1];
|
||
} else {
|
||
this.startTime ='';
|
||
this.endTime = '';
|
||
}
|
||
this.noteData(this.num);
|
||
},
|
||
open(item) {
|
||
this.$confirm('移除后将不在笔记列表中展示', '确定要删除您的笔记吗？', {
|
||
confirmButtonText: '确定',
|
||
cancelButtonText: '取消',
|
||
type: 'warning'
|
||
}).then(() => {
|
||
apiNote.del(item.id).then(res=>{
|
||
this.noteData(this.num);
|
||
this.$message({
|
||
type: 'success',
|
||
message: '删除成功!'
|
||
});
|
||
});
|
||
}).catch(() => {
|
||
this.$message({
|
||
type: 'info',
|
||
message: '已取消删除'
|
||
});
|
||
});
|
||
},
|
||
couresitem(item){
|
||
this.courseId = item.courseId;
|
||
this.noteData(this.num)
|
||
},
|
||
|
||
allcoures(){
|
||
apiNote.course().then(res=>{
|
||
this.couresna = res.result
|
||
})
|
||
},
|
||
publish(){
|
||
this.ordertime = !this.ordertime;
|
||
this.orderType = !this.orderType;
|
||
this.orderField = 'sysUpdateTime';
|
||
this.noteData(this.num)
|
||
},
|
||
thumbs(){
|
||
this.orderpiss = !this.orderpiss;
|
||
this.orderField = 'praises';
|
||
this.orderType = !this.orderType;
|
||
this.noteData(this.num)
|
||
},
|
||
edit(item){
|
||
this.$router.push({ path: `/user/Noteedit?id=${item.id}` });
|
||
},
|
||
noteData(tab){
|
||
this.num = tab
|
||
let data = {
|
||
pageIndex:this.pageIndex,
|
||
paegsize:this.paegSize,
|
||
orderType:this.orderType,
|
||
orderField:this.orderField,
|
||
courseId:this.courseId,
|
||
type:this.num,
|
||
startTime:this.startTime,
|
||
endTime:this.endTime,
|
||
}
|
||
apiNote.query(data).then(res=>{
|
||
if(res.status == 200) {
|
||
res.result.list.forEach((item,index)=>{
|
||
if(item.contentType == 3) {
|
||
item.content = item.content.split(',');
|
||
}
|
||
});
|
||
this.datalist = res.result.list;
|
||
this.count = res.result.count;
|
||
}
|
||
|
||
})
|
||
},
|
||
|
||
// 根据秒数转换成对应的时分秒
|
||
getHMS(time) {
|
||
const hour = parseInt(time / 3600) < 10 ? '0' + parseInt(time / 3600) : parseInt(time / 3600)
|
||
const min = parseInt(time % 3600 / 60) < 10 ? '0' + parseInt(time % 3600 / 60) : parseInt(time % 3600 / 60)
|
||
const sec = parseInt(time % 3600 % 60) < 10 ? '0' + parseInt(time % 3600 % 60) : parseInt(time % 3600 % 60)
|
||
return hour + ':' + min + ':' + sec
|
||
},
|
||
handleSizeChange(val) {
|
||
this.paegSize = val;
|
||
this.pageIndex = 1;
|
||
this.noteData(this.num);
|
||
},
|
||
handleCurrentChange(val) {
|
||
this.pageIndex = val;
|
||
this.noteData(this.num);
|
||
}
|
||
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss" scoped>
|
||
.footer-btn{
|
||
width: 140px;
|
||
height: 40px;
|
||
border-radius: 4px;
|
||
border: 1px solid #387DF7;
|
||
}
|
||
::v-deep .note-sift{
|
||
.el-dropdown-menu{
|
||
|
||
}
|
||
}
|
||
::v-deep .export-dialog{
|
||
.el-dialog__header{
|
||
display: none;
|
||
}
|
||
.el-dialog__body{
|
||
padding: 0;
|
||
}
|
||
.export-dialog-top{
|
||
height: 90px;
|
||
background: linear-gradient(128deg, #70B0FF 0%, #4B7CFF 15%, #4678FF 39%, #7599FF 76%, rgba(1,72,228,0.85) 100%);
|
||
box-shadow: 14px 12px 14px 2px rgba(0,0,0,0.03);
|
||
padding: 16px 46px 16px 56px;
|
||
color: #fff;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
.export-dialog-left{
|
||
display: flex;
|
||
// ::v-deep .item-author .el-avatar{
|
||
// width: 60px !important;
|
||
// height: 60px !important;
|
||
// }
|
||
.el-avatar{
|
||
width: 60px;
|
||
height: 60px;
|
||
}
|
||
.userInfo-info{
|
||
margin-left: 40px;
|
||
}
|
||
}
|
||
.export-dialog-right{
|
||
text-align: right;
|
||
}
|
||
}
|
||
.export-dialog-body{
|
||
margin: 40px 13px 0 53px;
|
||
padding-right: 36px;
|
||
height: 500px;
|
||
overflow-y: auto;
|
||
}
|
||
}
|
||
.note-info-index{
|
||
::v-deep .el-upload-dragger{
|
||
width: 500px;
|
||
height: 168px;
|
||
}
|
||
.import-info{
|
||
padding: 0 74px;
|
||
}
|
||
.import-info-tip{
|
||
font-size: 18px;
|
||
font-weight: 600;
|
||
color: #333333;
|
||
margin-bottom: 34px;
|
||
}
|
||
.import-info-enclosure{
|
||
display: flex;
|
||
margin-bottom: 27px;
|
||
.label{
|
||
width: 72px;
|
||
font-size: 16px;
|
||
color: #666666;
|
||
font-weight: 400;
|
||
|
||
}
|
||
}
|
||
}
|
||
.el-select-dropdown__item{
|
||
width: 140px !important;
|
||
}
|
||
.el-input--medium .el-input__inner{
|
||
height: 40px;
|
||
line-height: 40px;
|
||
}
|
||
.el-dropdown-menu--medium .el-dropdown-menu__item{
|
||
width: 100% !important;
|
||
// height: 30px !important;
|
||
overflow: hidden;
|
||
text-overflow:ellipsis;
|
||
white-space: nowrap;
|
||
display: block;
|
||
word-break:break-all;
|
||
}
|
||
.el-dropdown-menu{
|
||
width: 140px !important;
|
||
padding: 12px 10px;
|
||
overflow: hidden;
|
||
li{
|
||
text-align: center;
|
||
}
|
||
|
||
}
|
||
.el-popper{
|
||
margin-top: 5px;
|
||
}
|
||
.Export-info{
|
||
border-bottom: 1px solid #ddd;
|
||
padding-bottom:30px;
|
||
margin-bottom:35px
|
||
}
|
||
.Export-info:last-child{
|
||
border: none;
|
||
|
||
}
|
||
::v-deep.dr-dialog{
|
||
max-width: 870px !important;
|
||
}
|
||
.all-title{
|
||
height: 50px;
|
||
display: flex;
|
||
.daoru{
|
||
width: 80px;
|
||
height: 30px;
|
||
border-radius: 4px;
|
||
border: 1px solid #3379FB;
|
||
}
|
||
h6{
|
||
margin: 0;
|
||
margin-left: auto;
|
||
float: right;
|
||
font-size: 14px;
|
||
color: #999999;
|
||
font-weight: 400;
|
||
}
|
||
h3{
|
||
font-size: 18px;
|
||
font-weight: 600;
|
||
color: #333333;
|
||
margin: 0;
|
||
float: left;
|
||
}
|
||
span{
|
||
width: 53px;
|
||
height: 22px;
|
||
border-radius: 10px;
|
||
border: 1px solid #3379FB;
|
||
font-size: 14px;
|
||
font-weight: 400;
|
||
color: #3379FB;
|
||
text-align:center;
|
||
margin-top: 5px;
|
||
display: inline-block;
|
||
}
|
||
div{
|
||
width: 120px;
|
||
height: 30px;
|
||
border-radius: 4px;
|
||
border: 1px solid #3379FB;
|
||
font-size: 14px;
|
||
font-weight: 400;
|
||
color: #387DF7;
|
||
line-height: 30px;
|
||
text-align: center;
|
||
float: left;
|
||
margin: 0 20px;
|
||
img{
|
||
width: 10px;
|
||
// height: 16px;
|
||
padding-top: 6px;
|
||
vertical-align: top;
|
||
margin-right: 12px;
|
||
}
|
||
}
|
||
}
|
||
|
||
|
||
::v-deep.el-dialog__header{
|
||
background: url('/images/daochubg.png') 100% / 100% !important;
|
||
}
|
||
.textbut-box{
|
||
// position: absolute;
|
||
// right: 0;
|
||
display: flex;
|
||
}
|
||
.textbut{
|
||
font-size: 12px;
|
||
font-weight: 400;
|
||
color: #6E7B84 !important;
|
||
|
||
}
|
||
.note-all{
|
||
width: 100%;
|
||
.note-all-info{
|
||
border-bottom: 1px solid #ddd;
|
||
padding-top: 35px;
|
||
.all-footer{
|
||
height: 10px;
|
||
padding-bottom: 45px;
|
||
width: 100%;
|
||
div{
|
||
float: right;
|
||
}
|
||
}
|
||
.all-content{
|
||
font-size: 14px;
|
||
font-weight: 400;
|
||
color: #333333;
|
||
img{
|
||
width: 140px;
|
||
height: 175px;
|
||
margin-right: 23px;
|
||
}
|
||
}
|
||
|
||
}
|
||
}
|
||
.tabcontent{
|
||
span{
|
||
margin-right: 45px;
|
||
padding: 0 7px;
|
||
text-align: center;
|
||
padding-bottom: 14px;
|
||
display: inline-block;
|
||
}
|
||
}
|
||
|
||
.tab-textactive{
|
||
border-bottom: 4px solid #3379FB;
|
||
transform: all 0.3s;
|
||
font-weight: 600;
|
||
}
|
||
.note-tab{
|
||
height: 40px;
|
||
margin-top: 20px;
|
||
border-bottom: 1px solid #ddd;
|
||
}
|
||
.el-buttons{
|
||
width: 160px !important;
|
||
height: 40px;
|
||
border-radius: 4px;
|
||
// margin-left: 20px;
|
||
}
|
||
.el-buttons:hover{
|
||
background-color: #fff !important;
|
||
border: 1px solid #ddd !important;
|
||
color: #0059FF !important;
|
||
}
|
||
.el-buttons:focus{
|
||
background-color: #fff !important;
|
||
color: #0059FF !important;
|
||
border: 1px solid #ddd !important;
|
||
}
|
||
.note-sift{
|
||
button{
|
||
width: 160px;
|
||
height: 40px;
|
||
border-radius: 4px;
|
||
margin-left: 20px;
|
||
}
|
||
::v-deep .el-input__inner{
|
||
height: 40px;
|
||
}
|
||
}
|
||
.note-hear{
|
||
width: 100%;
|
||
height: 50px;
|
||
div button{
|
||
width: 140px;
|
||
height: 40px;
|
||
}
|
||
h3{
|
||
margin: 0;
|
||
float: left;
|
||
font-size: 18px;
|
||
font-weight: 600;
|
||
color: #333333;
|
||
line-height: 30px;
|
||
}
|
||
div{
|
||
float: right;
|
||
button{
|
||
width: 140px;
|
||
font-size: 14px;
|
||
height: 40px;
|
||
border-radius: 4px;
|
||
border: 1px solid rgba(153,153,153,0.2);
|
||
}
|
||
}
|
||
}
|
||
</style>
|