IDCDatasync-vue/src/views/datawashing/dataformatsRules/rulesModel.vue

<template>
    <a-modal :title="title" :width="800" :visible="visible" :confirmLoading="confirmLoading" @ok="handleOk"
        @cancel="handleCancel" okText="保存" cancelText="关闭">

        <a-spin :spinning="confirmLoading">
            <a-form-model ref="ruleForm" :model="form" :rules="rules">
                <a-form-model-item label="表名" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="tableName">
                    <a-input v-model="form.tableName" placeholder="请输入"></a-input>
                </a-form-model-item>
                <a-form-model-item label="转换字段" :labelCol="labelCol" :wrapperCol="wrapperCol" >
                    <a-tree-select v-model="checkedList" style="width: 100%"
                        :tree-data="treeData" multiple :show-checked-strategy="SHOW_PARENT" search-placeholder="请选项" 
                        :dropdownStyle="{ maxHeight: '400px', overflowY: 'auto'}"/>
                </a-form-model-item>
                <a-form-model-item label="格式策略" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="transfStrategy">
                    <a-select v-model="form.transfStrategy">
                        <a-select-option :value="1">转大写</a-select-option>
                        <a-select-option :value="2">转小写</a-select-option>
                    </a-select>
                </a-form-model-item>
            </a-form-model>
        </a-spin>
    </a-modal>
</template>

<script>
import JCron from "@/components/jeecg/JCron";
import JSelectMultiple from '@/components/jeecg/JSelectMultiple'
import { createRules, updateRules, queryById } from '@/api/dataformatsRules'
import { querytableColumns } from '@/api/deEmphasisRules'
import { TreeSelect } from 'ant-design-vue';
const SHOW_PARENT = TreeSelect.SHOW_PARENT;

export default {
    name: "rulesModal",
    components: {
        JCron,
        JSelectMultiple
    },
    data() {
        return {
            SHOW_PARENT,
            title: "操作",
            visible: false,
            model: {},
            confirmLoading: false,
            form: {
                tableName: null,
                transfFileds: null,
                transfStrategy: null
            },
            rules: {
                tableName: [{ required: true, message: '请输入表名', trigger: 'blur' }],
                transfFileds: [{ required: true, message: '请选择', trigger: 'change' }],
                transfStrategy: [{ required: true, message: '请选择', trigger: 'change' }]
            },
            labelCol: {
                xs: { span: 24 },
                sm: { span: 5 },
            },
            wrapperCol: {
                xs: { span: 24 },
                sm: { span: 16 },
            },
            treeData: [],
            checkedList: []
        }
    },
    created() {
        // this.loadData();
    },
    methods: {
        getQuerytableColumns(dataType, tableName) {
            querytableColumns({ dataType: dataType, tableName: tableName }).then(res => {
                if (res.code == 200) {
                    this.treeData = []
                    res.result.forEach(element => {
                        this.treeData.push({
                            title: element,
                            value: element,
                            key: element,
                        })
                    });
                }
            })
        },
        handleChange(value) {
            if (value == 1) {
                this.form.judgmentField = 'ALL'
            } else {

            }
        },
        add(tableName, dataType) {
            this.getQuerytableColumns(dataType, tableName)
            this.form = {
                tableName: tableName,
                transfFileds: null,
                transfStrategy: null
            }
            this.checkedList = []
            this.visible = true;
        },
        eidt(record, dataType1) {
            console.log('sfdsafa',record, dataType1)
            if (record.id) {
                queryById({ id: record.id }).then(res => {
                    if (res.code == 200) {
                        this.form = res.result
                        this.checkedList = res.result.transfFileds.split(',')
                    }
                })
            } else {
                this.form = {
                    id: null,
                    tableName: record.tableName,
                    transfFileds: null,
                    transfStrategy: null
                }
            }
            this.getQuerytableColumns(dataType1, record.tableName)
            this.visible = true;
        },
        close() {
            this.visible = false;
        },
        handleOk() {
            this.$refs.ruleForm.validate(valid => {
                if (valid) {
                    this.confirmLoading = true;
                    this.form.transfFileds = this.checkedList.join(',')
                    if (!this.form.id) {
                        createRules(this.form).then(res => {
                            if (res.code === 200) {
                                this.$notification.success({
                                    message: '系统提示',
                                    description: res.message
                                })
                                this.confirmLoading = false
                                this.$emit('fatherMethod')
                                this.handleCancel()
                            } else {
                                this.$notification.error({
                                    message: '系统提示',
                                    description: res.message
                                })
                                this.confirmLoading = false
                            }
                        })
                    } else {
                        updateRules(this.form).then(res => {
                            if (res.code === 200) {
                                this.$notification.success({
                                    message: '系统提示',
                                    description: res.message
                                })
                                this.confirmLoading = false
                                this.$emit('fatherMethod')
                                this.handleCancel()
                            } else {
                                this.$notification.error({
                                    message: '系统提示',
                                    description: res.message
                                })
                                this.confirmLoading = false
                            }
                        })
                    }
                }
            });
        },
        handleCancel() {
            this.close()
        },
    }
}
</script>

<style scoped></style>