style(form): table 删除样式调整

This commit is contained in:
roymondchen 2022-09-22 12:51:19 +08:00 committed by jia000
parent f853299226
commit 0a412ace9f
3 changed files with 15 additions and 9 deletions

View File

@ -23,14 +23,13 @@
<el-button @click="addHandler" size="small" v-if="addable">添加组</el-button> <el-button @click="addHandler" size="small" v-if="addable">添加组</el-button>
<el-button icon="el-icon-s-grid" size="small" @click="toggleMode" v-if="config.enableToggleMode" <el-button :icon="Grid" size="small" @click="toggleMode" v-if="config.enableToggleMode">切换为表格</el-button>
>切换为表格</el-button
>
</div> </div>
</template> </template>
<script lang="ts"> <script lang="ts">
import { computed, defineComponent, inject, PropType } from 'vue'; import { computed, defineComponent, inject, PropType } from 'vue';
import { Grid } from '@element-plus/icons-vue';
import { FormState, GroupListConfig } from '../schema'; import { FormState, GroupListConfig } from '../schema';
import { initValue } from '../utils/form'; import { initValue } from '../utils/form';
@ -144,6 +143,7 @@ export default defineComponent({
}))) as any; }))) as any;
}; };
return { return {
Grid,
addable, addable,
toggleMode, toggleMode,
removeHandler, removeHandler,

View File

@ -21,15 +21,14 @@
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="操作" width="60" :fixed="config.fixed === false ? undefined : 'left'"> <el-table-column label="操作" width="55" align="center" :fixed="config.fixed === false ? undefined : 'left'">
<template v-slot="scope"> <template v-slot="scope">
<el-button <el-icon
v-show="showDelete(scope.$index + 1 + pagecontext * pagesize - 1)" v-show="showDelete(scope.$index + 1 + pagecontext * pagesize - 1)"
type="danger" class="m-table-delete-icon"
text
:icon="Delete"
@click="removeHandler(scope.$index + 1 + pagecontext * pagesize - 1)" @click="removeHandler(scope.$index + 1 + pagecontext * pagesize - 1)"
></el-button> ><Delete
/></el-icon>
</template> </template>
</el-table-column> </el-table-column>
@ -219,6 +218,8 @@ export default defineComponent({
emits: ['change', 'select'], emits: ['change', 'select'],
components: { Delete },
setup(props, { emit }) { setup(props, { emit }) {
let timer: any | null = null; let timer: any | null = null;
const mForm = inject<FormState | undefined>('mForm'); const mForm = inject<FormState | undefined>('mForm');

View File

@ -65,4 +65,9 @@
.el-form-item { .el-form-item {
margin-bottom: 0; margin-bottom: 0;
} }
.m-table-delete-icon {
color: #f56c6c;
cursor: pointer;
}
} }