dx-element-ui/packages/form/src/remove-form.vue

<template>
    <el-form ref="form" label-width="80px" size="small" :label-position="labelPosition">
        <div>
            <div style="padding: 30px 0;font-weight: bold;">{{optMessage}}</div>
        </div>
        <div v-if="isOptMessage">
            <!-- 按钮 -->
            <el-form-item class="el-del-btn-item" v-if="!rowData['show']">
                <div class="btn-item-footer">
                    <el-button type="info" size="small" icon="el-icon-close" @click="subClearBtn()">取消</el-button>
                    <el-button type="primary" size="small" icon="el-icon-check" @click="submitEvent()">{{rowData._btn}}</el-button>
                </div>
            </el-form-item>
        </div>
        <div v-else>
            <!-- 按钮 -->
            <el-form-item class="el-del-btn-item" v-if="rowData._btn && rowData._btn.iShow">
                <div class="btn-item-footer">
                    <el-button v-for="(btnItem, index) in rowData._btn.list" :key="index" :type="btnItem.bType"
                               size="small"
                               :icon="btnItem.icon" @click="btnClickEvent(btnItem)">{{btnItem.label}}
                    </el-button>
                </div>
            </el-form-item>
        </div>
    </el-form>
</template>
<script>
    import { otherDialogEvent, submitRemoveEvent } from './tool-form';

    export default {
        name: 'NtRemoveForm',
        props: {
            rowData: {
                type: Object,
                required: true
            },
            axios: {
                type: Object,
                default: function () { return {}; }
            },
            queryURL: {
                type: Object,
                default: function () { return {}; }
            },
            responseSuccess: {
                type: Object,
                default: function() { return {}; }
            },
            labelPosition: {
                type: String,
                default: 'left'
            },
            options: {
                type: Object,
                default: () => {}
            }
        },
        data() {
            return {
                publicParams: {},
                isOptMessage: this.rowData._optType === 'del' ? true : false,
                optMessage: this.rowData._optMessage
            };
        },
        watch: {},
        created: function() {
            this.publicParams = (this.options && this.options.publicParams) ? this.options.publicParams : {}
        },
        methods: {
            subClearBtn(){
                this.isOptMessage = this.rowData._optType === 'del' ? true : false;

                this.$emit('clear', 'del');
            },
            submitEvent(){
                submitRemoveEvent(this);
            },
            btnClickEvent(item) {
                switch (item.type) {
                    case 'close':
                        this.subClearBtn();
                        break;
                    case 'submit':
                        submitRemoveEvent(this);
                        break;
                    default:
                        otherDialogEvent(this, item);
                }
            }
        }
    };

</script>