refactor(front): 重构前端组件并优化代码
- 移除了多个无用的组件和文件 - 更新了部分组件的实现方式 - 优化了代码结构和样式 - 修复了CuteSimpleTable、CuteDragTable组件,在无数据时,数据表格不刷新问题
This commit is contained in:
@@ -0,0 +1,91 @@
|
||||
<template>
|
||||
<el-drawer
|
||||
:title="title"
|
||||
:visible.sync="visible"
|
||||
:size="width"
|
||||
:before-close="beforeClose"
|
||||
:append-to-body="true"
|
||||
:close-on-press-escape="false"
|
||||
:destroy-on-close="true"
|
||||
:show-close="false"
|
||||
>
|
||||
<div class="container-form">
|
||||
<el-form ref="form" :model="form.model" :rules="form.rules">
|
||||
<!-- 这里是插槽,用于渲染传入的 el-form-item -->
|
||||
<slot />
|
||||
</el-form>
|
||||
</div>
|
||||
<el-divider />
|
||||
<div class="dialog-footer" style="padding-right: 30px;text-align: right">
|
||||
<el-button type="danger" @click="hidden">取 消</el-button>
|
||||
<el-button type="primary" @click="submitForm('form')">提 交</el-button>
|
||||
</div>
|
||||
</el-drawer>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
||||
export default {
|
||||
name: 'CuteFormDrawer',
|
||||
props: {
|
||||
title: {
|
||||
type: String,
|
||||
required: true,
|
||||
default: '默认标题'
|
||||
},
|
||||
width: {
|
||||
type: String,
|
||||
required: false,
|
||||
default: '40%'
|
||||
},
|
||||
form: {
|
||||
type: Object,
|
||||
required: true,
|
||||
default: null
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
visible: false
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
show() {
|
||||
this.visible = true
|
||||
},
|
||||
hidden() {
|
||||
this.resetForm('form')
|
||||
this.visible = false
|
||||
},
|
||||
submitForm(formName) {
|
||||
this.$refs[formName].validate((valid) => {
|
||||
if (valid) {
|
||||
this.$emit('submit', this.form.model)
|
||||
} else {
|
||||
return false
|
||||
}
|
||||
})
|
||||
},
|
||||
resetForm(formName) {
|
||||
this.$refs[formName].resetFields()
|
||||
},
|
||||
beforeClose() {
|
||||
this.hidden()
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
.container-form {
|
||||
overflow-y: scroll; /* 启用滚动 */
|
||||
scrollbar-width: none; /* Firefox */
|
||||
height: 88%;
|
||||
padding-right: 20px;
|
||||
-ms-overflow-style: none; /* Internet Explorer 10+ */
|
||||
}
|
||||
|
||||
.container-form::-webkit-scrollbar {
|
||||
display: none; /* Chrome, Safari, Opera*/
|
||||
}
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user