Source/UBCS-WEB/src/views/modeling/BusinessAdd.vue

@@ -4,47 +4,84 @@
    :visible.sync="showSubmitDialog"
    append-to-body
    @close="closeSubmitDialog"
    width="70%"
    width="74%"
    >
        <el-form ref="form" :model="btmType" show-message="true" inline>
            <el-form-item label="英文名称:" label-width="100px">
                <el-input v-model="btmType.id" prefix-icon="el-icon-finished"></el-input>
                <el-input v-model="btmType.id" :prefix-icon="icons.key"></el-input>
            </el-form-item>
            <el-form-item label="中文名称:" label-width="100px">
                <el-input v-model="btmType.name" prefix-icon="el-icon-info"></el-input>
                <el-input v-model="btmType.name" :prefix-icon="icons.name"></el-input>
            </el-form-item>
            <el-form-item label="数据库表名:" label-width="100px">
                <el-input v-model="btmType.tableName" prefix-icon="el-icon-date"></el-input>
                <el-input v-model="btmType.tableName" :prefix-icon="icons.tableName"></el-input>
            </el-form-item>
            <el-form-item label="所属领域:" label-width="100px">
                <el-select v-model="btmType.domain" prefix-icon="el-icon-folder-opened">
                <el-select v-model="btmType.domain" :prefix-icon="icons.domain">
                    <el-option v-for="item in domainOption"
                    :label="item"></el-option>
                </el-select>
            </el-form-item>
            <el-form-item label="版本规则:" label-width="100px">
                <el-input v-model="btmType.revisionRuleId" prefix-icon="el-icon-s-check"></el-input>
                <el-input v-model="btmType.revisionRuleId" :prefix-icon="icons.revisionRule">
                    <i slot="suffix" class="el-input__icon el-icon-search"></i>
                </el-input>
            </el-form-item>
            <el-form-item label="生命周期:" label-width="100px">
                <el-input v-model="btmType.lifeCycleId" prefix-icon="el-icon-refresh-right"></el-input>
                <el-input v-model="btmType.lifeCycleId" :prefix-icon="icons.lifeCycle">
                    <i slot="suffix" class="el-input__icon el-icon-search"></i>
                </el-input>
            </el-form-item>
            <el-form-item label="视图:" label-width="100px">
                <el-input v-model="btmType.view" prefix-icon="el-icon-view"></el-input>
                <el-input v-model="btmType.view" :prefix-icon="icons.view"></el-input>
            </el-form-item>
            <el-form-item label="描述:" label-width="100px">
                <el-input v-model="btmType.description" 
                prefix-icon="el-icon-chat-line-square" 
                style="width:254%;"></el-input>
                :prefix-icon="icons.desc" 
                ></el-input>
            </el-form-item>
        </el-form>
        <avue-crud :option="option" :data="btmType.attributes"></avue-crud>
        <avue-crud :option="option" :data="btmType.attributes" :page.sync="page" ref="attrTable">
            <template slot-scope="scope" slot="menuLeft">
                <el-button type="danger"
                icon="el-icon-plus"
                size="small"
                @click="rowAdd()">属性选择</el-button>
            </template>
            
        </avue-crud>
        <el-button @click="submitBtmType">确定</el-button>
            <el-button @click="cancleSubmitBtmType">取消</el-button>


        <el-dialog title="属性池"
            :visible="attrRef.visible"
            append-to-body
            @close="closeAttrDialog"
            width="80%"
        >
            <avue-crud class="attrRef" 
            :option="attrRef.option" 
            :data="attrRef.data" 
            :page.sync="attrRef.page"
            ref="attrRef"
            @on-load="attrRefOnLoad"
            @selection-change="selectionChange">
                <template slot="name" slot-scope="scope" >
                    <el-tag>{{scope}}</el-tag>
                </template>
            </avue-crud>
            <el-button @click="confirmSelectAttr">确定</el-button>
            <el-button @click="cancleSelectAttr">取消</el-button>
        </el-dialog>
    </el-dialog>
</template>


<script>
import { } from '@/api/omd/btmType';
import { } from '@/api/omd/OmdAttribute';

import {  } from '@/api/omd/btmType';
import { getPage } from '@/api/omd/OmdAttribute';
export default {
    name: 'BusinessAdd',
    props: {
@@ -53,19 +90,28 @@
        },
        domainOption:{
            type: Array
        },
        icons: {
            type: Array
        }
    },
    data() {
        return {
            form: {},
            showSubmitDialog : false,
            page: {
                currentPage: 1,
                pageSize:10
            },
            option: {
                height: "330px",
                selection: true,
                headerAlign: 'center',
                border: true,
                index: true,
                rowKey: 'id',
                rowKey: 'oid',
                addBtn: false,
                refreshBtn: false,
                columnBtn:false,
                tabs: true,
                menu: false,
                highlightCurrentRow: true,
@@ -73,7 +119,7 @@
                    {
                        label: '属性英文名称',
                        prop: 'id',
                        align: 'center'
                        align: 'left'
                    }, {
                        label: '属性中文名称',
                        prop: 'name',
@@ -81,7 +127,53 @@
                    },
                    {
                        label: "属性类型",
                        prop: "attrDataType",
                        prop: "typeValue",
                        align: 'center',
                        slot: true
                    },
                    {
                        label: "默认值",
                        prop: "defaultValue",
                        cell: 'true',
                        align: 'center'
                    },
                    {
                        label: "说明",
                        prop: "description",
                        cell: 'true',
                        align: 'center'
                    }
                ]
            },
            attrRef:{
                visible:false,
                page: {
                    currentPage:1,
                    pageSize:10,
                    key:''
                },
                option:{
                    height: 360,
                    addBtn: false,
                    refreshBtn: false,
                    columnBtn: false,
                    selection: true,
                    menu: false,
                    border: true,
                    column: [
                        {
                        label: '属性英文名称',
                        prop: 'key',
                        align: 'left',
                        width: 230
                    }, {
                        label: '属性中文名称',
                        prop: 'label',
                        align: 'center'
                    },
                    {
                        label: "属性类型",
                        prop: "typeValue",
                        align: 'center'
                    },
                    {
@@ -90,23 +182,101 @@
                        align: 'center'
                    },
                    {
                        label: '允许为空',
                        prop: 'nullable',
                        type: 'switch',
                        display: false,
                        hide: true,
                        labelWidth: 132,
                        dicData: [{
                        label: '否',
                        value: 1
                        }, {
                        label: '是',
                        value: 0
                        }]
                    },
                    {
                        label: "说明",
                        prop: "description",
                        align: 'center'
                    }
                ]
            },
                    ]
                },
                data: [],
                queryNotIn: []
            }
        }
    },
    created() {
        console.log('123');

    },
    methods: {
        closeSubmitDialog(){
            this.showSubmitDialog = false;
            this.btmType = {};
        },
        closeAttrDialog(){
            this.attrRef.visible = false;
        },
        rowAdd(){
            this.attrRef.visible = true;
            this.$refs.attrRef.refreshTable();
            this.attrRefOnLoad();
       
        },
        attrRefOnLoad(){
            var str = '';
            this.attrRef.queryNotIn.forEach(item => {
                str = str + item + ','
            });
            getPage(this.attrRef.page.currentPage, this.attrRef.page.pageSize,{'condition["key_like"]':this.attrRef.page.key}).then(res => {
                const data = res.data.data;
                this.attrRef.page.total = data.total;
                this.attrRef.data = data.records;
            })
        },
        selectionChange(list){
            this.attrRef.selectData = list;
        },
        confirmSelectAttr(){
            this.btmType.attributes = [];
            this.attrRef.selectData.forEach(item => {
                this.btmType.attributes.push({
                    id: item.key,
                    name: item.label,
                    typeValue: item.typeValue,
                    defaultValue: item.defaultValue,
                    description: item.description
                });
                this.attrRef.queryNotIn.push(item.key);
            });
            this.closeAttrDialog();
        },
        cancleSelectAttr(){
            this.attrRef.selectData = [];
            this.closeAttrDialog();
        },
        submitBtmType(){
            // 添加完成，回调父组件的刷新
            console.log(this.btmType);
            this.$emit('refreshTable');
        },
        cancleSubmitBtmType(){
            this.btmType = {};
            this.btmType.attributes = [];
            console.log(this.btmType);
        },
        refreshAttrTable(){
            this.$refs.attrTable.refreshTable();
        }
    }
}
</script>

<style></style>
<style>
/* 属性池参照列表 */
.attrRef > .el-card:nth-of-type(2) > .el-card__body > .avue-crud__menu{
        display: none !important;
}
</style>