update
This commit is contained in:
@@ -18,14 +18,13 @@
|
||||
},
|
||||
"dependencies": {
|
||||
"@riophae/vue-treeselect": "0.0.38",
|
||||
"axios": ">=0.18.1",
|
||||
"axios": "^0.19.0",
|
||||
"clipboard": "1.7.1",
|
||||
"codemirror": "^5.38.0",
|
||||
"connect": "3.6.6",
|
||||
"echarts": "4.1.0",
|
||||
"element-ui": "^2.11.1",
|
||||
"file-saver": "1.3.8",
|
||||
"html2canvas": "^1.0.0-rc.3",
|
||||
"js-cookie": "2.2.0",
|
||||
"jsencrypt": "^3.0.0-rc.1",
|
||||
"jszip": "3.1.5",
|
||||
@@ -34,7 +33,6 @@
|
||||
"nprogress": "0.2.0",
|
||||
"path-to-regexp": "2.4.0",
|
||||
"screenfull": "3.3.3",
|
||||
"simple-drawing-board": "1.4.1",
|
||||
"vue": "2.5.17",
|
||||
"vue-count-to": "1.0.13",
|
||||
"vue-router": "3.1.3",
|
||||
|
||||
@@ -5,13 +5,6 @@
|
||||
<div :class="{hasTagsView:needTagsView}" class="main-container">
|
||||
<div :class="{'fixed-header':fixedHeader}">
|
||||
<navbar />
|
||||
<div class="feedback">
|
||||
<el-tooltip class="item" effect="dark" content="建议反馈" placement="left">
|
||||
<el-button type="text" @click="doFeedback">
|
||||
<svg-icon style="font-size: 28px;color: #606266;" icon-class="codeConsole" />
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
</div>
|
||||
<tags-view v-if="needTagsView" />
|
||||
</div>
|
||||
<app-main />
|
||||
@@ -19,7 +12,6 @@
|
||||
<settings />
|
||||
</right-panel>
|
||||
</div>
|
||||
<feedback :show-dialog.sync="feedbackShow"/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@@ -28,7 +20,6 @@ import RightPanel from '@/components/RightPanel'
|
||||
import { AppMain, Navbar, Settings, Sidebar, TagsView } from './components'
|
||||
import ResizeMixin from './mixin/ResizeHandler'
|
||||
import { mapState } from 'vuex'
|
||||
import feedback from './feedback.vue'
|
||||
|
||||
export default {
|
||||
name: 'Layout',
|
||||
@@ -38,15 +29,9 @@ export default {
|
||||
Settings,
|
||||
Sidebar,
|
||||
TagsView,
|
||||
RightPanel,
|
||||
feedback
|
||||
RightPanel
|
||||
},
|
||||
mixins: [ResizeMixin],
|
||||
data() {
|
||||
return {
|
||||
feedbackShow: false
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
...mapState({
|
||||
sidebar: state => state.app.sidebar,
|
||||
@@ -66,10 +51,6 @@ export default {
|
||||
methods: {
|
||||
handleClickOutside() {
|
||||
this.$store.dispatch('closeSideBar', { withoutAnimation: false })
|
||||
},
|
||||
doFeedback() {
|
||||
console.log(111)
|
||||
this.feedbackShow = true
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -118,12 +99,5 @@ export default {
|
||||
.mobile .fixed-header {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.feedback {
|
||||
position: fixed;
|
||||
z-index: 999999;
|
||||
right: 10px;
|
||||
bottom: 60px;
|
||||
}
|
||||
</style>
|
||||
|
||||
|
||||
@@ -1,167 +0,0 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog
|
||||
:visible.sync="show"
|
||||
data-html2canvas-ignore="true"
|
||||
title="意见反馈"
|
||||
class
|
||||
width="60%"
|
||||
center
|
||||
@open="init"
|
||||
@close="close"
|
||||
>
|
||||
<el-form ref="form" :model="feedback" label-width="0px" class="feedback-add-form">
|
||||
<el-form-item label prop="info">
|
||||
<el-input v-model="feedback.info" :rows="2" type="textarea" placeholder="告诉我们你的建议或遇到的问题。"/>
|
||||
</el-form-item>
|
||||
<el-form-item label>
|
||||
<span>屏幕截图 (可选):</span>
|
||||
</el-form-item>
|
||||
<el-form-item v-loading="dataLoading" v-show="submitScreenshot" label>
|
||||
<div id="screenshot"/>
|
||||
</el-form-item>
|
||||
<el-form-item label>
|
||||
<el-checkbox v-model="submitScreenshot">提交屏幕截图</el-checkbox>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<el-button
|
||||
slot="footer"
|
||||
:loading="confirmLoading"
|
||||
class="confirm-btn"
|
||||
type="primary"
|
||||
@click="submit"
|
||||
>提交</el-button>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import SimpleDrawingBoard from 'simple-drawing-board'
|
||||
import html2canvas from 'html2canvas'
|
||||
export default {
|
||||
props: {
|
||||
showDialog: {
|
||||
type: Boolean,
|
||||
required: true
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
feedback: {
|
||||
info: ''
|
||||
},
|
||||
submitScreenshot: true,
|
||||
dataLoading: false,
|
||||
confirmLoading: false
|
||||
}
|
||||
},
|
||||
|
||||
computed: {
|
||||
show: {
|
||||
get() {
|
||||
return this.showDialog
|
||||
},
|
||||
set(val) {
|
||||
this.$emit('update:showDialog', val)
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
methods: {
|
||||
async loadLibrary() {
|
||||
if (typeof html2canvas === 'undefined') {
|
||||
try {
|
||||
console.error('html2canvas not import')
|
||||
} catch (e) {
|
||||
console.error('html2canvas.min.js is missing', e.toString())
|
||||
return null
|
||||
}
|
||||
}
|
||||
return html2canvas
|
||||
},
|
||||
async init() {
|
||||
await this.loadLibrary()
|
||||
this.dataLoading = true
|
||||
this.$nextTick(() => {
|
||||
// modal层处理,截屏时忽略遮罩层
|
||||
const modals = document.getElementsByClassName('v-modal')
|
||||
for (let i = 0; i < modals.length; i++) {
|
||||
modals[i].setAttribute('data-html2canvas-ignore', 'true')
|
||||
}
|
||||
|
||||
html2canvas(document.body, { logging: false })
|
||||
.then(canvas => {
|
||||
const screenshot = document.getElementById('screenshot')
|
||||
canvas.setAttribute('style', 'width:100%')
|
||||
screenshot.appendChild(canvas)
|
||||
this.dataLoading = false
|
||||
window.sdb = new SimpleDrawingBoard(
|
||||
screenshot.getElementsByTagName('canvas')[0],
|
||||
{
|
||||
lineColor: '#ff0000',
|
||||
lineSize: 4
|
||||
}
|
||||
)
|
||||
})
|
||||
.catch(e => {
|
||||
this.dataLoading = false
|
||||
console.log(e.toString())
|
||||
})
|
||||
})
|
||||
},
|
||||
|
||||
close() {
|
||||
const screenshot = document.getElementById('screenshot')
|
||||
const canvas = screenshot.getElementsByTagName('canvas')[0]
|
||||
screenshot.removeChild(canvas)
|
||||
},
|
||||
|
||||
async submit() {
|
||||
try {
|
||||
this.confirmLoading = true
|
||||
const formData = new FormData()
|
||||
if (window.sdb) {
|
||||
if (this.submitScreenshot) {
|
||||
const screenshot = window.sdb.getImg()
|
||||
formData.append('file', screenshot)
|
||||
}
|
||||
formData.append('feedback', this.feedback.info)
|
||||
}
|
||||
// let res = await axios.post('http://', formData, {
|
||||
// headers: {
|
||||
// 'Origin': window.location.origin,
|
||||
// 'Content-Type': 'multipart/form-data'
|
||||
// },
|
||||
// changeOrigin: true
|
||||
// })
|
||||
this.confirmLoading = false
|
||||
|
||||
this.$notify({
|
||||
title: '反馈成功',
|
||||
type: 'success',
|
||||
duration: 2500
|
||||
})
|
||||
this.show = false
|
||||
} catch (e) {
|
||||
this.$notify({
|
||||
title: '提交失败',
|
||||
type: 'error',
|
||||
duration: 2500
|
||||
})
|
||||
this.confirmLoading = false
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
#screenshot {
|
||||
cursor: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAASCAYAAABWzo5XAAAABGdBTUEAALGPC/xhBQAAARpJREFUOBGdkr1KA0EUhTcxEkSQQIpAihQWPoedD2BnIVsZQiBVEkiR7SwtBDsJqXwBLQwEgoWNjY2FjYUQ38Ei5Oc7sBeGLTKze+Djzsyecxh2N4ryq0zkHpYQQ2H1SW5TNsxukaZzQsewACvTvIBg3eFUaABHMEv3OruBIN3icm8wZl+FZ3iBQ/AqweGW2FrlKlChV0McFsxOvaegm/T2lLzzTC/dqzaO7A1s/8GzE28Dhhj0f1jQnZ+c18CrKxxrcMO2/uK87m3AcAkrsKA7vzlvQJAmuNywrX84bwY1YBrBATyCFWj+QguCJKNCU1DZQ7r/Y55CsK5x2i2eWFcggTPIJd3Eiv5Zd3KlU3OJOQd9lVd4A5Xl1g4YG2GGhwRfegAAAABJRU5ErkJggg==)
|
||||
0 17,
|
||||
default;
|
||||
}
|
||||
.confirm-btn {
|
||||
width: 30%;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user