hz/learning-system-portal
1
0
Fork 0
mirror of https://codeup.aliyun.com/67762337eccfc218f6110e0e/vue/learning-system-portal.git synced 2025-12-14 05:16:43 +08:00
Code Issues Packages Projects Releases Wiki Activity

2022年5月29日从svn移到git

Browse Source
This commit is contained in:
daihh
2022-05-29 18:56:34 +08:00
commit b050613020
488 changed files with 68444 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

369
src/components/PortalFloatTools.vue Normal file
View File

@@ -0,0 +1,369 @@
<template>
<div>
<div class="float-tools">
<div class="float-tool-icon" @click="toNeedCourse" v-if="identity>1">
<!-- <svg-icon class-name="icon" icon-class="lessons"></svg-icon> -->
<div class="float-img"><img :src="`${webBaseUrl}/images/explo.png`" alt=""></div>
<span>做课程</span>
</div>
<div class="float-tool-icon" @click="$refs.addQuestion.askQuestionDialog = true">
<!-- <svg-icon class-name="icon" icon-class="problem"></svg-icon> -->
<div class="float-img"><img :src="`${webBaseUrl}/images/issue.png`" alt=""></div>
<span>提问题</span>
</div>
<div class="float-tool-icon" @click="toAddArticle()">
<!-- <svg-icon class-name="icon" icon-class="essay"></svg-icon> -->
<div class="float-img"> <img :src="`${webBaseUrl}/images/essay.png`" alt=""></div>
<span>写文章</span>
</div>
<div class="float-tool-icon" @click="showFeedback()">
<!-- <svg-icon class-name="icon" icon-class="agree"></svg-icon> -->
<div class="float-img"> <img :src="`${webBaseUrl}/images/opinion.png`" alt=""></div>
<span>提意见</span>
</div>
<div class="float-tool-icon" @click="infoShow=true">
<!-- <svg-icon class-name="icon" icon-class="server"></svg-icon> -->
<div class="float-img"> <img :src="`${webBaseUrl}/images/contact.png`" alt=""></div>
<span>联系我们</span>
</div>
<div class="float-tool-icon" @click="backtop">
<!-- <svg-icon class-name="icon" icon-class="top"></svg-icon> -->
<div class="float-img"> <img :src="`${webBaseUrl}/images/back.png`" alt=""></div>
<span>返回顶部</span>
</div>
</div>
<!-- <div class="float-tools">
<el-tooltip class="item" effect="light" content="返回顶部" placement="left">
<div class="float-tool" @click="backtop">
<div class="float-tool-icon">
<svg-icon class-name="icon" icon-class="top"></svg-icon>
</div>
</div>
</el-tooltip>
<el-tooltip class="item" effect="light" content="做课程" placement="left">
<div class="float-tool">
<div class="float-tool-icon">
<svg-icon class-name="icon" icon-class="lessons"></svg-icon>
</div>
</div>
</el-tooltip>
<el-tooltip class="item" effect="light" content="提问题" placement="left">
<div @click="$refs.addQuestion.askQuestionDialog = true" class="float-tool">
<div class="float-tool-icon">
<svg-icon class-name="icon" icon-class="problem"></svg-icon>
</div>
</div>
</el-tooltip>
<el-tooltip class="item" effect="light" content="写文章" placement="left">
<div class="float-tool">
<div class="float-tool-icon">
<router-link to="/article/add">
<svg-icon class-name="icon" icon-class="essay"></svg-icon>
</router-link>
</div>
</div>
</el-tooltip>
<el-tooltip class="item" effect="light" content="提意见" placement="left">
<div @click="showFeedback()" class="float-tool">
<svg-icon class-name="icon" icon-class="agree"></svg-icon>
</div>
</el-tooltip>
<div class="float-tool" @click="infoShow=true" style="height: 200px;">
<div>
<div class="float-tool-icon"><svg-icon class-name="icon" icon-class="server"></svg-icon></div>
<div class="concatOur">联系我们</div>
</div>
</div> -->
<!-- </div> -->
<el-dialog title="联系我们" :close-on-click-modal="false" :visible.sync="infoShow" width="800px" custom-class="g-dialog">
<el-form :model="feedback" size="medium" label-width="100px">
<el-form-item label="姓名:" >李玉冰</el-form-item>
<el-form-item label="工号:">00004409</el-form-item>
<el-form-item label="电话:">010414134</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="infoShow= false">关闭</el-button>
</span>
</el-dialog>
<el-dialog title="提交意见" :close-on-click-modal="false" :visible.sync="feedbackDlgShow" width="800px" custom-class="g-dialog">
<el-form ref="feedbackForm" :model="feedback" :rules="feedbackRules" size="medium" label-width="100px">
<el-form-item label="意见类型" prop="type">
<el-select v-model="feedback.type" placeholder="请选择意见类型">
<el-option label="关于内容" value="关于内容"></el-option>
<el-option label="关于平台操作" value="关于平台操作"></el-option>
</el-select>
</el-form-item>
<el-form-item label="描述" prop="content">
<el-input v-model="feedback.content" rows="10" type="textarea" placeholder="尽量的详细描述问题" :maxlength="500" show-word-limit clearable :style="{width: '100%'}"></el-input>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="feedbackDlgShow= false">取 消</el-button>
<el-button type="primary" @click="submitFeedback">提 交</el-button>
</span>
</el-dialog>
<addQuestion ref="addQuestion" @sure="sure"></addQuestion>
<el-dialog title="创建文章" :visible.sync="diagSync" :close-on-click-modal="false" width="900px" custom-class="g-dialog">
<editItems v-if="diagSync" :jumpLimit="false" :editForm="{}" @success="saveSuccess"></editItems>
</el-dialog>
</div>
</template>
<script>
import WxEditor from "@/components/Editor/index.vue";
import addQuestion from '@/components/Qa/addQuestion.vue'
import feedbackApi from '@/api/modules/feedback.js'
import editItems from '@/components/Article/editItems.vue';
import { mapGetters } from 'vuex';
export default {
components:{WxEditor,addQuestion,editItems},
data() {
return {
infoShow:false,
feedback:{
type:'',
content:''
},
feedbackRules:{
type: [{ required: true, message: '请选择意见类型', trigger: 'blur' }],
content: [{ required: true, message: '请输入意见描述', trigger: 'blur' }]
},
feedbackDlgShow:false,
diagSync:false,
}
},
computed: {
...mapGetters(['identity'])
},
methods: {
saveSuccess(){
// this.$emit('update',true);
this.diagSync = false;
},
toPage(url) {
this.$router.push({ path: url })
},
showFeedback(){
this.feedback.type = '';
this.feedback.content = '';
this.feedbackDlgShow=true;
},
submitFeedback(){
this.$refs.feedbackForm.validate(valid => {
if (valid) {
feedbackApi.save(this.feedback).then(res => {
if (res.status == 200) {
this.$message(
{
type:'success',
message:'提交意见成功'
});
this.feedbackDlgShow=false;
} else {
this.$message({
type:'error',
message:'提交意见失败'
});
}
}).catch(err=>{
this.message({
message:'提交意见失败',
type:'error'
})
});
}
});
},
/**
* 回到顶部功能实现过程：
* 1. 获取页面当前距离顶部的滚动距离（虽然IE不常用了，但还是需要考虑一下兼容性的）
* 2. 计算出每次向上移动的距离，用负的滚动距离除以5，因为滚动的距离是一个正数，想向上移动就是做一个减法
* 3. 用当前距离加上计算出的距离，然后赋值给当前距离，就可以达到向上移动的效果
* 4. 最后记得在移动到顶部时，清除定时器
*/
backtop() {
var timer = setInterval(function () {
let osTop =
document.documentElement.scrollTop || document.body.scrollTop
let ispeed = Math.floor(-osTop / 5)
document.documentElement.scrollTop = document.body.scrollTop =
osTop + ispeed
this.isTop = true
if (osTop === 0) {
clearInterval(timer)
}
}, 30)
},
sure(){
this.$emit('sure',true)
},
toAddArticle(){
this.diagSync=true;
// this.$router.push('/article/add')
},
toNeedCourse(){
// 需要先切换标签
console.log('this.identity='+this.identity);
if(this.identity==5 || this.identity==2){
this.$store.dispatch('SetCurIdentity',2);
// this.$router.push('/need/course?open=new');
location.href =`${this.webBaseUrl}/need/course?open=new`
}else if(this.identity==3){
this.$store.dispatch('SetCurIdentity',3);
this.$router.push('/course/manage?open=new');
}
}
},
}
</script>
<style scoped lang="scss">
.float-tools{
position: fixed;
background: white;
// box-shadow:0px 0px 10px #999;
border-radius: 2px;
border: 1px solid #f0f0f0;
right: 10px;
bottom: 40px;
padding:0 8px;
display: flex;
flex-direction: column;
align-items: center;
z-index: 999;
.float-tool-icon{
cursor: pointer;
padding: 8px 0;
border-bottom: 1px solid #999;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
font-size:12px;
font-weight: 600;
&:last-of-type{
border-bottom: 0;
}
span{
padding-top: 5px;
}
.float-img{
width: 20px;
height: 20px;
img{
width: 100%;
height: 100%;
}
}
.svg-icon{
font-size: 20px;
}
}
}
// .icon{
// width: 20px;
// height: 20px;
// }
// .float-tools {
// position: fixed;
// right: 10px;
// bottom: 40px;
// padding:0 10px;
// .float-tool {
// padding: 2px;
// display: flex;
// justify-content: center;
// align-items: center;
// width: 55px;
// height: 55px;
// border-radius: 65px;
// text-align: center;
// color: #409eff;
// text-align: center;
// font-size: 20px;
// box-shadow: 0 0 6px rgb(0 0 0 / 12%);
// cursor: pointer;
// z-index: 5;
// background-color: transparent;
// margin-top: 15px;
// >.svg-icon{
// padding: 12px;
// border-radius: 50%;
// box-sizing: content-box;
// background: rgba(192,192,192,.3);
// }
// .float-tool-icon{
// padding: 12px;
// // line-height: 65px;
// display: flex;
// // justify-content: center;
// align-items: center;
// background: rgba(192,192,192,.3);
// border-radius: 50%;
// a{
// display: flex;
// justify-content: center;
// align-items: center;
// }
// }
// }
// .float-tool:last-of-type{
// padding: 5px;
// >div{
// height: 100%;
// width: 100%;
// border-radius: 65px;
// background: rgba(192,192,192,.3);
// background-blend-mode: multiply;
// flex-direction: column;
// justify-content: space-between;
// align-items: center;
// .float-tool-icon{
// background: transparent;
// }
// .concatOur{
// padding: 0px 5px;
// // text-align: center;
// writing-mode: horizontal-tb;
// // writing-mode:tb-rl;
// }
// }
// }
// }
// .avatar-uploader .el-upload {
// border: 1px dashed #d9d9d9;
// border-radius: 6px;
// cursor: pointer;
// position: relative;
// overflow: hidden;
// }
// .avatar-uploader .el-upload--picture-card{
// width: 200px;
// }
// .avatar-uploader .el-upload:hover {
// border-color: #409EFF;
// }
// .avatar-uploader-icon {
// font-size: 28px;
// color: #8c939d;
// text-align: center;
// margin-top: 50px;
// display: block;
// }
// .icon-text{
// font-size: 14px;
// display: block;
// height: 30px;
// line-height: 35px;
// }
// .avatar {
// width: 250px;
// height: 178px;
// display: block;
// }
</style>