tangzheng/block-law-enforcement
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

1、更新WangEditor 版本，支持v-model方式绑定:https://github.com/elunez/eladmin-web/pull/127

Browse Source 
2、修改菜单组件 dialog visible写法问题导致的eslint 警告:https://github.com/elunez/eladmin-web/pull/116
This commit is contained in:
Zheng Jie 2023-07-05 11:04:32 +08:00
parent 0c942c5f5e
commit 4d184688e6
15 changed files with 107 additions and 58 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
eladmin-web/package.json
View File

@ -34,6 +34,8 @@
},
"dependencies": {
"@riophae/vue-treeselect": "^0.4.0",
"@wangeditor/editor": "^5.1.23",
"@wangeditor/editor-for-vue": "^1.0.2",
"axios": "^0.21.1",
"clipboard": "2.0.4",
"codemirror": "^5.49.2",

4
eladmin-web/src/components/Iframe/index.vue
View File

@ -13,7 +13,7 @@ export default {
},
data() {
return {
height: document.documentElement.clientHeight - 94.5 + 'px;',
height: document.documentElement.clientHeight - (84 + 22) + 'px;',
loading: true
}
},
@ -23,7 +23,7 @@ export default {
}, 230)
const that = this
window.onresize = function temp() {
that.height = document.documentElement.clientHeight - 94.5 + 'px;'
that.height = document.documentElement.clientHeight - (84 + 22) + 'px;'
}
}
}

1
eladmin-web/src/components/JavaEdit/index.vue
View File

@ -67,7 +67,6 @@ export default {
}
.json-editor >>> .CodeMirror {
font-size: 14px;
overflow-y:auto;
font-weight:normal
}
.json-editor >>> .CodeMirror-scroll{

87
eladmin-web/src/components/WangEditor/index.vue Normal file
View File

@ -0,0 +1,87 @@
<template>
<div ref="editor" style="border: 1px solid #ccc;">
<Toolbar
style="border-bottom: 1px solid #ccc"
:editor="editor"
:default-config="toolbarConfig"
:mode="editMode"
/>
<Editor
v-model="editValue"
:style="{'height': editorHeight +'px', 'overflow-y': 'hidden'}"
:default-config="editorConfig"
:mode="editMode"
@onCreated="onCreated"
/>
</div>
</template>
<script>
import { upload } from '@/utils/upload'
import { Toolbar, Editor } from '@wangeditor/editor-for-vue'
import { mapGetters } from 'vuex'
export default {
name: 'WangEditor',
components: { Toolbar, Editor },
props: {
value: [String],
editorHeight: {
type: Number
}
},
computed: {
...mapGetters([
'imagesUploadApi',
'baseApi'
])
},
data() {
const _this = this
return {
toolbarConfig: {},
editorConfig: { placeholder: '请输入内容...', MENU_CONF: {
'uploadImage': {
// 选择文件时的类型限制，默认为 ['image/*'] 。如不想限制，则设置为 []
allowedFileTypes: ['image/*'],
// 自定义上传
async customUpload(file, insertFn) { // JS 语法
upload(_this.imagesUploadApi, file).then(res => {
const data = res.data
const url = _this.baseApi + '/file/' + data.type + '/' + data.realName
// 最后插入图片
insertFn(url, '', '')
})
}
}
}},
editMode: 'simple',
editor: null,
editValue: null
}
},
watch: {
editValue(newVal, oldVal) {
this.$emit('input', newVal)
}
},
mounted() {
},
methods: {
onCreated(editor) {
this.editor = Object.seal(editor)
this.editValue = this.value
}
}
}
</script>
<style src="@wangeditor/editor/dist/css/style.css"></style>
<style scoped>
.text {
text-align:left;
}
::v-deep .w-e-text-container {
height: 420px !important;
}
</style>

51
eladmin-web/src/views/components/Editor.vue
View File

@ -2,33 +2,25 @@
<div class="app-container">
<p class="warn-content">
富文本基于
<el-link type="primary" href="https://www.kancloud.cn/wangfupeng/wangeditor3/332599" target="_blank">wangEditor</el-link>
<el-link type="primary" href="https://www.wangeditor.com/v5/getting-started.html" target="_blank">wangEditor</el-link>
</p>
<el-row :gutter="10">
<el-col :xs="24" :sm="24" :md="15" :lg="15" :xl="15">
<div ref="editor" class="text" />
</el-col>
<el-col :xs="24" :sm="24" :md="9" :lg="9" :xl="9">
<div v-html="editorContent" />
</el-col>
<wang-editor v-model="editorContent" style="height: 500px; overflow-y: hidden;" />
</el-row>
</div>
</template>
<script>
import { mapGetters } from 'vuex'
import { upload } from '@/utils/upload'
import E from 'wangeditor'
import WangEditor from '@/components/WangEditor/index'
export default {
name: 'Editor',
components: { WangEditor },
data() {
return {
editorContent:
`
<ul>
<li>更多帮助请查看官方文档：<a style="color: #42b983" target="_blank" href="https://www.wangeditor.com/doc/">wangEditor</a></li>
</ul>
`
`更多帮助请查看官方文档`
}
},
computed: {
@ -38,37 +30,6 @@ export default {
])
},
mounted() {
const _this = this
var editor = new E(this.$refs.editor)
// 自定义菜单配置
editor.config.zIndex = 5
// 文件上传
editor.config.customUploadImg = function(files, insert) {
// files 是 input 中选中的文件列表
// insert 是获取图片 url 后，插入到编辑器的方法
files.forEach(image => {
upload(_this.imagesUploadApi, image).then(res => {
const data = res.data
const url = _this.baseApi + '/file/' + data.type + '/' + data.realName
insert(url)
})
})
}
editor.config.onchange = (html) => {
this.editorContent = html
}
editor.create()
// 初始化数据
editor.txt.html(this.editorContent)
}
}
</script>
<style scoped>
.text {
text-align:left;
}
::v-deep .w-e-text-container {
height: 420px !important;
}
</style>

2
eladmin-web/src/views/mnt/app/index.vue
View File

@ -22,7 +22,7 @@
</crudOperation>
</div>
<!--表单组件-->
<el-dialog append-to-body :close-on-click-modal="false" :before-close="crud.cancelCU" :visible.sync="crud.status.cu > 0" :title="crud.status.title" width="800px">
<el-dialog append-to-body :close-on-click-modal="false" :before-close="crud.cancelCU" :visible="crud.status.cu" :title="crud.status.title" width="800px">
<el-form ref="form" :model="form" :rules="rules" size="small" label-width="100px">
<el-form-item label="应用名称" prop="name">
<el-input v-model="form.name" style="width: 670px" placeholder="部署后的文件或者目录名称，用于备份" />

2
eladmin-web/src/views/mnt/database/index.vue
View File

@ -24,7 +24,7 @@
</div>
<!--表单组件-->
<eForm ref="execute" :database-info="currentRow" />
<el-dialog append-to-body :close-on-click-modal="false" :before-close="crud.cancelCU" :visible.sync="crud.status.cu > 0" :title="crud.status.title" width="530px">
<el-dialog append-to-body :close-on-click-modal="false" :before-close="crud.cancelCU" :visible="crud.status.cu" :title="crud.status.title" width="530px">
<el-form ref="form" :model="form" :rules="rules" size="small" label-width="100px">
<el-form-item label="连接名称" prop="name">
<el-input v-model="form.name" style="width: 370px" />

2
eladmin-web/src/views/mnt/deploy/index.vue
View File

@ -64,7 +64,7 @@
</crudOperation>
</div>
<!--表单组件-->
<el-dialog append-to-body :close-on-click-modal="false" :before-close="crud.cancelCU" :visible.sync="crud.status.cu > 0" :title="crud.status.title" width="500px">
<el-dialog append-to-body :close-on-click-modal="false" :before-close="crud.cancelCU" :visible="crud.status.cu" :title="crud.status.title" width="500px">
<el-form ref="form" :model="form" :rules="rules" size="small" label-width="80px">
<el-form-item label="应用" prop="app.id">
<el-select v-model.number="form.app.id" placeholder="请选择" style="width: 370px">

2
eladmin-web/src/views/mnt/server/index.vue
View File

@ -11,7 +11,7 @@
<crudOperation :permission="permission" />
</div>
<!--表单组件-->
<el-dialog append-to-body :close-on-click-modal="false" :before-close="crud.cancelCU" :visible.sync="crud.status.cu > 0" :title="crud.status.title" width="470px">
<el-dialog append-to-body :close-on-click-modal="false" :before-close="crud.cancelCU" :visible="crud.status.cu" :title="crud.status.title" width="470px">
<el-form ref="form" :model="form" :rules="rules" size="small" label-width="55px">
<el-form-item label="名称" prop="name">
<el-input v-model="form.name" style="width: 370px" />

2
eladmin-web/src/views/system/dept/index.vue
View File

@ -14,7 +14,7 @@
<crudOperation :permission="permission" />
</div>
<!--表单组件-->
<el-dialog append-to-body :close-on-click-modal="false" :before-close="crud.cancelCU" :visible.sync="crud.status.cu > 0" :title="crud.status.title" width="500px">
<el-dialog append-to-body :close-on-click-modal="false" :before-close="crud.cancelCU" :visible="crud.status.cu" :title="crud.status.title" width="500px">
<el-form ref="form" inline :model="form" :rules="rules" size="small" label-width="80px">
<el-form-item label="部门名称" prop="name">
<el-input v-model="form.name" style="width: 370px;" />

2
eladmin-web/src/views/system/menu/index.vue
View File

@ -11,7 +11,7 @@
<crudOperation :permission="permission" />
</div>
<!--表单渲染-->
<el-dialog append-to-body :close-on-click-modal="false" :before-close="crud.cancelCU" :visible.sync="crud.status.cu > 0" :title="crud.status.title" width="580px">
<el-dialog append-to-body :close-on-click-modal="false" :before-close="crud.cancelCU" :visible="crud.status.cu" :title="crud.status.title" width="580px">
<el-form ref="form" :inline="true" :model="form" :rules="rules" size="small" label-width="80px">
<el-form-item label="菜单类型" prop="type">
<el-radio-group v-model="form.type" size="mini" style="width: 178px">

2
eladmin-web/src/views/system/role/index.vue
View File

@ -11,7 +11,7 @@
<crudOperation :permission="permission" />
</div>
<!-- 表单渲染 -->
<el-dialog append-to-body :close-on-click-modal="false" :before-close="crud.cancelCU" :visible.sync="crud.status.cu > 0" :title="crud.status.title" width="520px">
<el-dialog append-to-body :close-on-click-modal="false" :before-close="crud.cancelCU" :visible="crud.status.cu" :title="crud.status.title" width="520px">
<el-form ref="form" :inline="true" :model="form" :rules="rules" size="small" label-width="80px">
<el-form-item label="角色名称" prop="name">
<el-input v-model="form.name" style="width: 380px;" />

2
eladmin-web/src/views/system/timing/index.vue
View File

@ -22,7 +22,7 @@
<Log ref="log" />
</div>
<!--Form表单-->
<el-dialog :close-on-click-modal="false" :before-close="crud.cancelCU" :visible.sync="crud.status.cu > 0" :title="crud.status.title" append-to-body width="730px">
<el-dialog :close-on-click-modal="false" :before-close="crud.cancelCU" :visible="crud.status.cu" :title="crud.status.title" append-to-body width="730px">
<el-form ref="form" :inline="true" :model="form" :rules="rules" size="small" label-width="100px">
<el-form-item label="任务名称" prop="jobName">
<el-input v-model="form.jobName" style="width: 220px;" />

2
eladmin-web/src/views/system/user/index.vue
View File

@ -60,7 +60,7 @@
<crudOperation show="" :permission="permission" />
</div>
<!--表单渲染-->
<el-dialog append-to-body :close-on-click-modal="false" :before-close="crud.cancelCU" :visible.sync="crud.status.cu > 0" :title="crud.status.title" width="570px">
<el-dialog append-to-body :close-on-click-modal="false" :before-close="crud.cancelCU" :visible="crud.status.cu" :title="crud.status.title" width="570px">
<el-form ref="form" :inline="true" :model="form" :rules="rules" size="small" label-width="66px">
<el-form-item label="用户名" prop="username">
<el-input v-model="form.username" @keydown.native="keydown($event)" />

2
eladmin-web/src/views/tools/storage/local/index.vue
View File

@ -23,7 +23,7 @@
</crudOperation>
</div>
<!--表单组件-->
<el-dialog append-to-body :close-on-click-modal="false" :before-close="crud.cancelCU" :visible.sync="crud.status.cu > 0" :title="crud.status.add ? '文件上传' : '编辑文件'" width="500px">
<el-dialog append-to-body :close-on-click-modal="false" :before-close="crud.cancelCU" :visible="crud.status.cu" :title="crud.status.add ? '文件上传' : '编辑文件'" width="500px">
<el-form ref="form" :model="form" size="small" label-width="80px">
<el-form-item label="文件名">
<el-input v-model="form.name" style="width: 370px;" />