1
This commit is contained in:
766
src/components/page/comArtHtml_.vue
Normal file
766
src/components/page/comArtHtml_.vue
Normal file
@@ -0,0 +1,766 @@
|
||||
<template>
|
||||
<div style="height: 98%;">
|
||||
<div class="crumbs">
|
||||
<el-breadcrumb separator="/">
|
||||
<el-breadcrumb-item>
|
||||
<i class="el-icon-document-copy"></i> Artcile Html
|
||||
</el-breadcrumb-item>
|
||||
</el-breadcrumb>
|
||||
</div>
|
||||
<div class="container" style="height: 95%;min-width: 1000px;background-color: #fafafa;padding: 10px;">
|
||||
<el-row :gutter="20" style="height: 102%;">
|
||||
<el-col :span="24" style="height: 100%;">
|
||||
<div class="type_MTxt">
|
||||
<h3 class="man_Title">{{detailMes.title}}ea quisquam modi ratione in, ducimus quia. Neque
|
||||
reiciendis nihil illum!</h3>
|
||||
<div>
|
||||
<div v-for="(item,index) in Main_List" :class="item.check?'C_style':''">
|
||||
<el-checkbox v-model="item.check" class="checkMain" @change="chooseMain($event,item)">
|
||||
</el-checkbox>
|
||||
<p v-html="item.text"></p>
|
||||
<font v-if="item.getnum!=0" class="chNumer">{{item.getnum}}</font>
|
||||
<b class="MaxBtn" @click="MTxtEdit(item,index)"
|
||||
style="background-color: #006699;right: 120px;">
|
||||
<i class="el-icon-edit"></i>
|
||||
</b>
|
||||
<b class="MaxBtn" @click="MTxtPic(item,index)"
|
||||
style="background-color: #13bc20;right: 80px;">
|
||||
<i class="el-icon-picture-outline"></i>
|
||||
</b>
|
||||
<b class="MaxBtn" @click="MTxtTable(item,index)"
|
||||
style="background-color: #b6a109;right:40px;">
|
||||
<i class="el-icon-document-add"></i>
|
||||
</b>
|
||||
|
||||
<b class="MaxBtn" @click="MTxtDelet(item,index)"
|
||||
style="background-color: #bc1a13;right: 0px;">
|
||||
<i class="el-icon-delete"></i>
|
||||
</b>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="8" style="height: 100%;">
|
||||
<p class="type_Gbtn" @click="trsanGtp">
|
||||
<i class="el-icon-document-copy" style="margin-right: 5px;"></i>
|
||||
TMRGTP Proofreading
|
||||
</p>
|
||||
<div style="height: 91.5%;overflow-y: scroll;" v-if="ChGtp_List.length!=0">
|
||||
<div class="type_CHar" v-for="(item,index) in ChGtp_List">
|
||||
<p v-html="item.text"></p>
|
||||
<font class="chNumer">{{index+1}}</font>
|
||||
<font class="chReple" @click="replceChGpr(item)">replace</font>
|
||||
</div>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
<!--修改文本 -->
|
||||
<el-dialog title="Modify Text" :visible.sync="txtVisible" width="800px" :close-on-click-modal="false">
|
||||
<el-form ref="editMes" :model="txtStyle" label-width="10px">
|
||||
<!-- <el-form-item label="">
|
||||
<p style="color: #006699;font-weight: bold;">Preview :</p>
|
||||
<p v-html="txtStyle.text" style="line-height: 24px;word-wrap: break-word;word-break: normal;"></p>
|
||||
</el-form-item> -->
|
||||
<el-form-item label="">
|
||||
<el-input type="textarea" placeholder="Please enter the table content..." v-model="txtStyle.text"
|
||||
autosize>
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button @click="txtVisible=false">
|
||||
Cancel
|
||||
</el-button>
|
||||
<el-button type="primary" @click="saveTxt">
|
||||
<i class="el-icon-finished" style="margin-right: 5px;"></i>
|
||||
Save
|
||||
</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
|
||||
|
||||
<!--添加图片 -->
|
||||
<el-dialog title="Insert Picture" :visible.sync="pictVisible" width="800px" :close-on-click-modal="false">
|
||||
<el-form ref="editMes" :model="picStyle" label-width="150px">
|
||||
<el-form-item>
|
||||
<span slot="label">
|
||||
<font style="color: #f56c6c;margin-right: 5px;">*</font>
|
||||
Picture :
|
||||
</span>
|
||||
<el-upload class="avatar-uploader" :action="baseUrl+'api/Production/up_articlepic_file'"
|
||||
:show-file-list="false" name="articleicon" :on-success="handleAvatarSuccess"
|
||||
:on-error="handleAvatarError" :before-upload="beforeAvatarUpload">
|
||||
<img v-if="picStyle.imageUrl" :src="picStyle.imageUrl" class="avatar">
|
||||
<i v-else class="el-icon-plus avatar-uploader-icon"></i>
|
||||
</el-upload>
|
||||
</el-form-item>
|
||||
<el-form-item label="Bottom Title :">
|
||||
<el-input placeholder="Please enter the table title..." v-model="picStyle.titleBot">
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="Bottom Describe :">
|
||||
<el-input placeholder="Please enter the table describe..." v-model="picStyle.titleDes">
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<p style="margin: 20px 0;text-align: right;">
|
||||
<el-button type="warning" plain
|
||||
@click="picStyle.picUrl='';picStyle.titleBot='';picStyle.titleDes='';picStyle.imageUrl='';">
|
||||
<i class="el-icon-refresh" style="margin-right: 5px;"></i>Empty
|
||||
</el-button>
|
||||
<el-button type="primary" plain @click="">
|
||||
<i class="el-icon-sort" style="margin-right: 5px;"></i>Generate Picture
|
||||
</el-button>
|
||||
</p>
|
||||
<div class="lineStyle" v-if="picStyle.picUrl!=''">
|
||||
<div>
|
||||
<span class="title">Picture Width :</span>
|
||||
<el-input v-model="picStyle.picwith" style="width: 120px;">
|
||||
<template slot="append">px</template>
|
||||
</el-input>
|
||||
</div>
|
||||
</div>
|
||||
<div style="padding: 0 20px;" v-if="picStyle.picUrl!=''">
|
||||
<div style="text-align: center;">
|
||||
<img :src="baseUrl+'public/'+picStyle.picUrl" :style="'width:'+picStyle.picwith+'px'">
|
||||
</div>
|
||||
<p style="text-align: center;margin: 0 0 15px 0;font-size: 12px;color: #006699;">
|
||||
<b>{{picStyle.titleBot}}</b>
|
||||
</p>
|
||||
<p style="text-align: center;margin: 10px 0 0 0;font-size: 12px;">{{picStyle.titleDes}}</p>
|
||||
</div>
|
||||
<span slot="footer" class="dialog-footer" v-if="picStyle.picUrl!=''">
|
||||
<el-button type="primary" @click="savePic">
|
||||
<i class="el-icon-finished" style="margin-right: 5px;"></i>
|
||||
Save Picture
|
||||
</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
|
||||
|
||||
<!-- 添加表格 -->
|
||||
<el-dialog title="Insert Table" :visible.sync="threeVisible" width="1000px" :close-on-click-modal="false">
|
||||
<el-form ref="editMes" :model="lineStyle" label-width="115px">
|
||||
<el-form-item label="Top Title :">
|
||||
<el-input placeholder="Please enter the table title..." v-model="lineStyle.titleTop">
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<span slot="label">
|
||||
<font style="color: #f56c6c;margin-right: 5px;">*</font>
|
||||
Content :
|
||||
</span>
|
||||
<el-input type="textarea" :rows="5" placeholder="Please enter the table content..."
|
||||
v-model="lineStyle.textarea">
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="Bottom Title :">
|
||||
<el-input placeholder="Please enter the table title..." v-model="lineStyle.titleBot">
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
|
||||
<p style="margin: 20px 0;text-align: right;">
|
||||
<el-button type="warning" plain
|
||||
@click="lineStyle.textarea='';lineStyle.titleTop='';lineStyle.titleBot='';lineTable=[]">
|
||||
<i class="el-icon-refresh" style="margin-right: 5px;"></i>Empty
|
||||
</el-button>
|
||||
<el-button type="primary" plain @click="CopyExcelToTable">
|
||||
<i class="el-icon-sort" style="margin-right: 5px;"></i>Generate Table
|
||||
</el-button>
|
||||
</p>
|
||||
<div class="lineStyle" v-if="lineTable.length!=0">
|
||||
<div>
|
||||
<span class="title">Table All Width :</span>
|
||||
<el-input v-model="lineStyle.tabwith" style="width: 120px;">
|
||||
<template slot="append">%</template>
|
||||
</el-input>
|
||||
</div>
|
||||
<div>
|
||||
<div v-for="(item,index) in lineStyle.arrwith" class="styArry">
|
||||
<span class="title">Column <b style="color: #006699;">{{index+1}}</b> :</span>
|
||||
<el-input v-model="lineStyle.arrwith[index]" style="width: 100px;">
|
||||
<template slot="append">%</template>
|
||||
</el-input>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div style="padding: 0 20px;" v-if="lineTable.length!=0">
|
||||
<p style="text-align: center;margin: 0 0 10px 0;font-size: 12px;color: #006699;">
|
||||
<b>{{lineStyle.titleTop}}</b>
|
||||
</p>
|
||||
<div class="lineAll" :style="'width:'+lineStyle.tabwith+'%'">
|
||||
<div v-for="item in lineTable" class="lineTit">
|
||||
<div v-for="(eqrt,iner) in item" :style="'width:'+lineStyle.arrwith[iner]+'%'">
|
||||
{{eqrt}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<p style="text-align: center;margin: 10px 0 0 0;font-size: 12px;">{{lineStyle.titleBot}}</p>
|
||||
</div>
|
||||
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button type="primary" @click="saveLine" v-if="lineTable.length!=0">
|
||||
<i class="el-icon-finished" style="margin-right: 5px;"></i>
|
||||
Save Table
|
||||
</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
baseUrl: this.Common.baseUrl,
|
||||
mediaUrl: this.Common.mediaUrl,
|
||||
Art_Id: this.$route.query.id,
|
||||
detailMes: {},
|
||||
Main_List: [],
|
||||
check_List: [],
|
||||
ChGtp_List: [],
|
||||
lineStyle: {
|
||||
titleTop: '',
|
||||
titleBot: '',
|
||||
textarea: '',
|
||||
tabwith: '100',
|
||||
arrwith: []
|
||||
},
|
||||
lineTable: [],
|
||||
threeVisible: false,
|
||||
picStyle: {
|
||||
titleTop: '',
|
||||
titleDes: '',
|
||||
// picUrl: 'https://www.tmrjournals.cn/public/articleHTML/TMR/TMR20230213002/images/alternativeImage/TMR20230213002-F004.jpg',
|
||||
picUrl: '',
|
||||
imageUrl: '',
|
||||
picwith: '500'
|
||||
},
|
||||
pictVisible: false,
|
||||
txtStyle: {
|
||||
text: ''
|
||||
},
|
||||
txtVisible: false,
|
||||
};
|
||||
},
|
||||
|
||||
created() {
|
||||
this.getDate()
|
||||
},
|
||||
|
||||
methods: {
|
||||
// 获取数据
|
||||
getDate() {
|
||||
const loading = this.$loading({
|
||||
lock: true,
|
||||
text: 'Loading...',
|
||||
spinner: 'el-icon-loading',
|
||||
background: 'rgba(0, 0, 0, 0.7)'
|
||||
});
|
||||
|
||||
// 获取文章信息
|
||||
this.$api
|
||||
.post('api/Production/getProductionMains', {
|
||||
p_article_id: this.Art_Id
|
||||
})
|
||||
.then(res => {
|
||||
if (res.code == 0) {
|
||||
this.detailMes = res.data.mains
|
||||
this.Main_List = []
|
||||
for (let i = 0; i < this.detailMes.length; i++) {
|
||||
this.Main_List.push({
|
||||
p_main_id: this.detailMes[i].p_main_id,
|
||||
text: this.detailMes[i].content,
|
||||
value: i + 1,
|
||||
getnum: 0,
|
||||
check: false,
|
||||
})
|
||||
}
|
||||
loading.close()
|
||||
} else {
|
||||
this.$message.error(res.msg);
|
||||
loading.close()
|
||||
}
|
||||
})
|
||||
.catch(err => {
|
||||
this.$message.error(err);
|
||||
loading.close()
|
||||
});
|
||||
|
||||
},
|
||||
|
||||
|
||||
// 选择段落
|
||||
chooseMain(e, item) {
|
||||
this.check_List = []
|
||||
let allNUm = 1
|
||||
for (var i = 0; i < this.Main_List.length; i++) {
|
||||
if (this.Main_List[i].check) {
|
||||
this.Main_List[i].getnum = allNUm
|
||||
allNUm = allNUm + 1
|
||||
this.check_List.push({
|
||||
text: this.Main_List[i].text,
|
||||
value: this.Main_List[i].value,
|
||||
index: i,
|
||||
p_main_id: this.Main_List[i].p_main_id,
|
||||
})
|
||||
}
|
||||
}
|
||||
console.log(this.check_List)
|
||||
},
|
||||
|
||||
// 转化为gpt标准格式
|
||||
trsanGtp() {
|
||||
if (this.check_List.length == 0) {
|
||||
this.$message.error('Please select a paragraph!');
|
||||
} else {
|
||||
this.ChGtp_List = JSON.parse(JSON.stringify(this.check_List))
|
||||
console.log(this.ChGtp_List)
|
||||
}
|
||||
|
||||
},
|
||||
|
||||
|
||||
// 替换Gtp生成的内容
|
||||
replceChGpr(val) {
|
||||
this.Main_List[val.index].text = JSON.parse(JSON.stringify(val.text))
|
||||
},
|
||||
|
||||
|
||||
// 修改段落
|
||||
MTxtEdit(val, num) {
|
||||
this.txtVisible = true
|
||||
this.txtStyle = JSON.parse(JSON.stringify(val))
|
||||
this.txtStyle.index = num
|
||||
},
|
||||
|
||||
// 图片段落
|
||||
MTxtPic(val, num) {
|
||||
this.picStyle.p_main_id = val.p_main_id;
|
||||
this.picStyle.titleBot = '';
|
||||
this.picStyle.titleDes = '';
|
||||
this.picStyle.picUrl = '';
|
||||
this.picStyle.imageUrl = ''
|
||||
this.pictVisible = true
|
||||
},
|
||||
|
||||
// 表格段落
|
||||
MTxtTable(val, num) {
|
||||
this.lineStyle.p_main_id = val.p_main_id;
|
||||
this.lineStyle.textarea = '';
|
||||
this.lineStyle.titleCon = '';
|
||||
this.lineTable = [];
|
||||
this.threeVisible = true
|
||||
},
|
||||
|
||||
// 删除段落
|
||||
MTxtDelet(val, num) {
|
||||
this.$api
|
||||
.post('api/Production/delProductionMain', {
|
||||
p_main_id: val.p_main_id
|
||||
})
|
||||
.then(res => {
|
||||
if (res.code == 0) {
|
||||
this.txtVisible = false
|
||||
} else {
|
||||
this.$message.error(res.msg);
|
||||
}
|
||||
})
|
||||
.catch(err => {
|
||||
this.$message.error(err);
|
||||
});
|
||||
},
|
||||
|
||||
|
||||
// 确定保存段落修改
|
||||
saveTxt() {
|
||||
this.$api
|
||||
.post('api/Production/editProductionMain', {
|
||||
p_main_id: this.txtStyle.p_main_id,
|
||||
content: this.txtStyle.text
|
||||
})
|
||||
.then(res => {
|
||||
if (res.code == 0) {
|
||||
this.txtVisible = false
|
||||
this.Main_List[this.txtStyle.index].text = JSON.parse(JSON.stringify(this.txtStyle.text))
|
||||
} else {
|
||||
this.$message.error(res.msg);
|
||||
}
|
||||
})
|
||||
.catch(err => {
|
||||
this.$message.error(err);
|
||||
});
|
||||
},
|
||||
|
||||
// 确定保存图片
|
||||
savePic() {
|
||||
|
||||
},
|
||||
|
||||
// 表格转化
|
||||
CopyExcelToTable() {
|
||||
if (this.lineStyle.textarea == '') {
|
||||
this.$message.error('Please fill in the table content!');
|
||||
return
|
||||
}
|
||||
let txtRows = this.lineStyle.textarea.split("\n");
|
||||
let txtColum = []
|
||||
for (let i = 0; i < txtRows.length; i++) {
|
||||
if (txtRows[i] != "") {
|
||||
let columns = txtRows[i].split("\t");
|
||||
let dataone = [];
|
||||
for (let j = 0; j < columns.length; j++) {
|
||||
dataone.push(columns[j]);
|
||||
}
|
||||
txtColum.push(dataone);
|
||||
};
|
||||
}
|
||||
|
||||
let arrwithNumer = Math.floor(100 / txtColum[0].length) - 2
|
||||
this.lineStyle.arrwith = []
|
||||
for (let i = 0; i < txtColum[0].length; i++) {
|
||||
this.lineStyle.arrwith.push(arrwithNumer)
|
||||
}
|
||||
this.lineTable = txtColum
|
||||
|
||||
|
||||
},
|
||||
|
||||
|
||||
// 确定保存表格
|
||||
saveLine() {
|
||||
let dataTable = ''
|
||||
for (let i = 0; i < this.lineTable.length; i++) {
|
||||
let ArryDr = ''
|
||||
let listHNem = ''
|
||||
for (let j = 0; j < this.lineTable[i].length; j++) {
|
||||
let ArrHtml = '<div style="width:' + this.lineStyle.arrwith[j] +
|
||||
'%;line-height: 22px;vertical-align: middle;display: inline-block;padding: 0 1%;font-size: 14px;color: #606266;word-wrap: break-word;word-break: normal;">'
|
||||
+ this.lineTable[i][j] +'</div>'
|
||||
ArryDr = ArryDr + ArrHtml
|
||||
}
|
||||
|
||||
if (i == 0) {
|
||||
listHNem =
|
||||
'<div style="display: flex;border-top: 2px solid #333333;border-bottom: 1px solid #333333;padding: 10px 0;font-weight: bold;margin-bottom: 20px;">' +
|
||||
ArryDr + '</div>'
|
||||
} else if (i == this.lineTable.length - 1) {
|
||||
listHNem =
|
||||
'<div style="display: flex;border-bottom: 2px solid #333333;padding:0 0 20px 0;">' +
|
||||
ArryDr + '</div>'
|
||||
ArryDr = ArryDr + listHNem
|
||||
} else {
|
||||
listHNem = '<div style="display: flex;padding:20px 0;">' + ArryDr + '</div>'
|
||||
}
|
||||
|
||||
dataTable = dataTable + listHNem
|
||||
}
|
||||
dataTable = '<div style="width:' + this.lineStyle.tabwith + '%">' + dataTable + '</div>'
|
||||
|
||||
if (this.lineStyle.titleTop != '') {
|
||||
dataTable = '<p style="text-align: center;margin: 0 0 10px 0;font-size: 12px;color: #006699;"><b>' +
|
||||
this.lineStyle.titleTop + '</b></p>' + dataTable
|
||||
}
|
||||
|
||||
if (this.lineStyle.titleBot != '') {
|
||||
dataTable = dataTable+'<p style="text-align: center;margin: 10px 0 0 0;font-size: 12px;">' +
|
||||
this.lineStyle.titleBot + '</p>'
|
||||
}
|
||||
|
||||
|
||||
console.log(dataTable)
|
||||
},
|
||||
|
||||
|
||||
// 上传图片
|
||||
handleAvatarSuccess(res, file) {
|
||||
if (res.code == 0) {
|
||||
this.picStyle.picUrl = res.upurl;
|
||||
} else {
|
||||
this.$message.error(res.msg);
|
||||
}
|
||||
this.picStyle.imageUrl = URL.createObjectURL(file.raw);
|
||||
},
|
||||
handleAvatarError(res, file) {
|
||||
|
||||
},
|
||||
beforeAvatarUpload(file) {
|
||||
const isLt2M = file.size / 1024 / 1024 < 1;
|
||||
if (!isLt2M) {
|
||||
this.$message.error('Picture size cannot exceed 1M!');
|
||||
}
|
||||
return isLt2M;
|
||||
},
|
||||
|
||||
|
||||
},
|
||||
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.lineStyle {
|
||||
border-top: 1px solid #0066994d;
|
||||
padding: 20px 20px 40px 20px;
|
||||
}
|
||||
|
||||
.lineStyle>div {}
|
||||
|
||||
.lineStyle>div span.title {
|
||||
font-size: 14px;
|
||||
color: #606266;
|
||||
margin: 0px 10px 0px 0px;
|
||||
}
|
||||
|
||||
.lineStyle>div font.mark {
|
||||
font-size: 14px;
|
||||
color: #606266;
|
||||
margin: 0px 0px 0px 10px;
|
||||
}
|
||||
|
||||
.lineStyle .styArry {
|
||||
display: inline-block;
|
||||
margin: 15px 40px 0 0;
|
||||
}
|
||||
|
||||
.lineStyle .styArry:nth-last-child(1) {
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
.lineAll {
|
||||
margin: 0 auto;
|
||||
|
||||
}
|
||||
|
||||
.lineAll .lineTit {
|
||||
padding: 0 0 20px 0;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.lineAll .lineTit:nth-child(1) {
|
||||
border-top: 2px solid #333333;
|
||||
border-bottom: 1px solid #333333;
|
||||
padding: 10px 0;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.lineAll .lineTit:nth-child(2) {
|
||||
padding-top: 20px;
|
||||
}
|
||||
|
||||
.lineAll .lineTit:nth-last-child(1) {
|
||||
border-bottom: 2px solid #333333;
|
||||
}
|
||||
|
||||
.lineAll .lineTit>div {
|
||||
line-height: 22px;
|
||||
vertical-align: middle;
|
||||
display: inline-block;
|
||||
padding: 0 1%;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.type_MTxt {
|
||||
background-color: #fff;
|
||||
padding: 0 10px;
|
||||
box-shadow: 0 1px 3px rgb(16 17 19 / 6%);
|
||||
border-radius: 12px;
|
||||
height: 99%;
|
||||
overflow-y: scroll;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
|
||||
.type_MTxt .man_Title {
|
||||
margin: 0 -10px 20px -25px;
|
||||
border-bottom: 1px solid #dde1eb;
|
||||
box-shadow: 0 5px 5px -2px rgb(134 134 134);
|
||||
padding: 12px 25px 8px 35px;
|
||||
font-size: 15px;
|
||||
line-height: 20px;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.type_MTxt>div>div {
|
||||
position: relative;
|
||||
padding: 10px 10px 10px 40px;
|
||||
min-height: 22px;
|
||||
border: 2px dashed #fff;
|
||||
border-radius: 5px;
|
||||
margin-bottom: 5px;
|
||||
color: #606266;
|
||||
}
|
||||
|
||||
|
||||
.type_MTxt>div>div:hover {
|
||||
background-color: #eaf3fe;
|
||||
border: 2px dashed rgb(0 102 153 / 80%);
|
||||
}
|
||||
|
||||
.type_MTxt>div>div.C_style {
|
||||
background-color: rgb(0 102 153 / 10%);
|
||||
border: 2px dashed rgb(0 102 153 / 10%);
|
||||
color: #000;
|
||||
}
|
||||
|
||||
.type_MTxt>div>div>.checkMain {
|
||||
position: absolute;
|
||||
left: 10px;
|
||||
top: 12px;
|
||||
}
|
||||
|
||||
.type_MTxt>div>div>p {
|
||||
font-size: 14px;
|
||||
line-height: 22px;
|
||||
|
||||
}
|
||||
|
||||
.type_MTxt>div>div .chNumer {
|
||||
position: absolute;
|
||||
top: -2px;
|
||||
right: -1px;
|
||||
border-radius: 3px;
|
||||
font-size: 10px;
|
||||
background-color: rgb(0 102 153 / 85%);
|
||||
color: #fff;
|
||||
padding: 0 6px;
|
||||
}
|
||||
|
||||
.type_MTxt>div>div .MaxBtn {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: -1px;
|
||||
color: #fff;
|
||||
border-radius: 50px;
|
||||
font-size: 15.5px;
|
||||
padding: 5px 6px;
|
||||
display: none;
|
||||
opacity: 0.7;
|
||||
}
|
||||
|
||||
.type_MTxt>div>div:hover .MaxBtn {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.type_MTxt>div>div .MaxBtn:hover {
|
||||
opacity: 1;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.type_Gbtn {
|
||||
color: #fff;
|
||||
border-color: #006699;
|
||||
background: #006699;
|
||||
width: 100%;
|
||||
height: 34px;
|
||||
line-height: 34px;
|
||||
text-align: center;
|
||||
padding: 10px 0;
|
||||
font-size: 17px;
|
||||
border-radius: 8px;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.type_Gbtn:hover {
|
||||
box-shadow: 0 4px 14px rgb(0 102 153 / 30%);
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.type_CHar {
|
||||
border-left: 4px solid rgba(0 102 153 / 20%);
|
||||
border-radius: 5px;
|
||||
padding: 10px 25px 10px 20px;
|
||||
background-color: #fff;
|
||||
margin: 15px 0 0 0;
|
||||
font-size: 14px;
|
||||
line-height: 22px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.type_CHar .chNumer {
|
||||
position: absolute;
|
||||
top: 1px;
|
||||
right: 5px;
|
||||
border-radius: 3px;
|
||||
font-size: 10px;
|
||||
background-color: rgb(0 102 153 / 85%);
|
||||
color: #fff;
|
||||
padding: 0 6px;
|
||||
}
|
||||
|
||||
.type_CHar .chReple {
|
||||
position: absolute;
|
||||
top: 1px;
|
||||
right: 40px;
|
||||
border-radius: 3px;
|
||||
font-size: 10px;
|
||||
background-color: rgb(223 109 11);
|
||||
opacity: 0.85;
|
||||
color: #fff;
|
||||
padding: 0 6px;
|
||||
display: none;
|
||||
}
|
||||
|
||||
.type_CHar:hover .chReple {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.type_CHar .chReple:hover {
|
||||
opacity: 1;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.avatar-uploader .el-upload {
|
||||
border: 1px dashed #d9d9d9;
|
||||
border-radius: 6px;
|
||||
cursor: pointer;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
}
|
||||
|
||||
.avatar-uploader_small {
|
||||
height: 100px;
|
||||
}
|
||||
|
||||
.avatar-uploader .el-upload:hover {
|
||||
border-color: #409EFF;
|
||||
}
|
||||
|
||||
.avatar-uploader-icon {
|
||||
font-size: 28px;
|
||||
color: #8c939d;
|
||||
width: 120px;
|
||||
height: 120px;
|
||||
line-height: 120px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.avatar-uploader_small .el-upload {
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
}
|
||||
|
||||
.avatar-uploader_small .avatar-uploader-icon {
|
||||
line-height: 80px;
|
||||
margin-left: -30px;
|
||||
}
|
||||
|
||||
.avatar {
|
||||
width: 120px;
|
||||
height: 120px;
|
||||
display: block;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user