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

@@ -1,12 +1,12 @@
<template>
    <el-container>
        <el-dialog title="元数据" :visible.sync="showSubmitDialog" append-to-body @close="closeSubmitDialog" width="50%"
        <el-dialog title="元数据" :visible.sync="showSubmitDialog" append-to-body @close="closeSubmitDialog" width="700px"
            style="height: 115vh;">
            <!-- 元数据的增改弹窗 -->
            <el-form ref="form" :model="attribute" show-message="true" inline size="medium" label-suffix=":"
                class="attributeForm" :rules="rules" @resetFields="resetAttributeForm" status-icon="true">
                <el-form-item label="属性编号" label-width="100px" prop="id">
                    <el-input v-model="attribute.id" maxlength="15" show-word-limit type="text"></el-input>
                    <el-input v-model="attribute.id" maxlength="30" show-word-limit type="text"></el-input>
                </el-form-item>
                <el-form-item label="属性名称" label-width="100px" prop="name">
                    <el-input v-model="attribute.name"></el-input>
@@ -17,9 +17,9 @@
                        </el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="标签" label-width="100px">
<!--                <el-form-item label="标签" label-width="100px">
                    <el-input v-model="attribute.hashtag"></el-input>
                </el-form-item>
                </el-form-item>-->
                <el-form-item label="默认值" label-width="100px">
                    <el-input v-model="attribute.defaultValue"></el-input>
                </el-form-item>
@@ -27,25 +27,26 @@
                    <el-switch v-model="attribute.nullable" active-text="允许" inactive-text="不允许"></el-switch>
                </el-form-item>
                <el-form-item label="长度" label-width="100px" prop="maxLength">
                    <el-input-number v-model="attribute.maxLength" :min="1" :max="4000" :step="1" controls-position="right"></el-input-number>
                    <el-input-number v-model="attribute.maxLength" :min="1" :max="4000" :step="1"
                        controls-position="right"></el-input-number>
                </el-form-item>
                <el-form-item label="精度" label-width="100px" v-if="attribute.typeValue == 'VTDouble'">
                    <el-input-number v-model="attribute.precision" :min="1" :max="20" :step="1" controls-position="right" @change="changeNumber"></el-input-number>
                <el-form-item label="精度" label-width="100px" v-if="attribute.typeKey == 'VTDouble'">
                    <el-input-number v-model="attribute.precision" :min="1" :max="20" :step="1" controls-position="right"
                        @change="changeNumber"></el-input-number>
                </el-form-item>
                <el-form-item label="描述" label-width="100px">
                    <el-input v-model="attribute.description" type="text"></el-input>
                </el-form-item>

                <el-tabs v-model="activeName" @tab-click="handleClick" stretch="true">
                    <el-tab-pane label="参照" name="referTab">
                        <el-form-item label="参照类型" label-width="100px">
                        <el-form-item label="参照类型" label-width="100px" class="referTypeForm">
                            <el-select v-model="attribute.referTypeKey" @change="referTypeSelectChange">
                                <el-option v-for="item in btmRefer.referTypeList" :key="item.value" :label="item.label"
                                    :value="item.value">
                                </el-option>
                            </el-select>
                        </el-form-item>
                        <el-form-item label="参照名称" label-width="100px">
                        <el-form-item label="参照名称" label-width="100px" class="referNameForm">
                            <el-input v-model="attribute.referToName" @focus="openReferConfig" clearable="true"
                                :disabled="referToFlag" @clear="clearReferTo">
                                <i slot="suffix" class="el-input__icon el-icon-search"></i>
@@ -59,14 +60,16 @@
                            </el-input>
                        </el-form-item>
                        <el-form-item label="枚举项" label-width="100px">
                            
                            <el-tag v-for="eItem in dictEnums" :key="eItem.itemName" type="info">
                              {{eItem.itemName}}
                            </el-tag>
                        </el-form-item>
                    </el-tab-pane>
                </el-tabs>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button type="primary" @click="submitAttribute">确定</el-button>
                <el-button @click="cancleSubmit">取消</el-button>
                <el-button @click="cancelSubmit">取消</el-button>
            </div>
            <!-- 选择参照时的弹窗 -->
            <el-dialog title="参照列表" :visible.sync="btmRefer.show" append-to-body @close="closeReferDialog" width="80%"
@@ -74,7 +77,7 @@
                <el-container>
                    <el-aside>
                        <basic-container>
                           <span class="el-dialog__title"> {{ domain.treeOption.title }} </span>
                            <span class="el-dialog__title"> {{ domain.treeOption.title }} </span>
                            <div style="height:20px;"></div>
                            <avue-tree id="domain" :data="domain.data" :option="domain.treeOption" @node-click="nodeClick"
                                class="businessTree" style="height: 418px">
@@ -89,7 +92,8 @@
                    </el-aside>
                    <el-main>
                        <basic-container>
                            <avue-crud ref="btmTable" :option="btmRefer.option" :data="btmRefer.data" class="btmTable" @row-click="btmReferClick">
                            <avue-crud ref="btmTable" :option="btmRefer.option" :data="btmRefer.data" class="btmTable"
                                @row-click="btmReferClick">
                                <template slot="radio" slot-scope="{row}">
                                    <el-radio v-model="btmRefer.selectRow" :label="row.$index">&nbsp;
                                    </el-radio>
@@ -101,13 +105,27 @@
                </el-container>
                <div slot="footer" class="dialog-footer">
                    <el-button type="primary" @click="confirmBtm" size="small">确定</el-button>
                    <el-button @click="cancleBtm" size="small">取消</el-button>
                    <el-button @click="cancelBtm" size="small">取消</el-button>
                </div>
            </el-dialog>
            <!-- 选择枚举时的弹窗 -->
            <el-dialog title="枚举列表" :visible.sync="enumRefer.show" append-to-body @close="closeEnumDialog" width="70%" 
            <el-dialog title="枚举列表" :visible.sync="enumRefer.show" append-to-body @close="closeEnumDialog" width="70%"
                style="height: 115vh;">
                <avue-crud ref="eunmTable" :option="enumRefer.option" :data="enumRefer.data" class="enumTable" @row-click="enumReferClick" :page.sync="enumRefer.enumPage">
                <div>
                  <el-form :inline="true" :model="form" class="demo-form-inline" size="small">
                    <el-form-item label="枚举代号">
                      <el-input v-model="form.name" placeholder="枚举代号"></el-input>
                    </el-form-item>
                    <el-form-item label="枚举名称">
                        <el-input v-model="form.label" placeholder="枚举名称"></el-input>
                    </el-form-item>
                    <el-form-item>
                      <el-button type="primary" @click="onSubmit">查询</el-button>
                    </el-form-item>
                  </el-form>
                </div>
                <avue-crud ref="eunmTable" :option="enumRefer.option"  @on-load="enumOnLoad" :data="enumRefer.data" class="enumTable"
                    @row-click="enumReferClick" :page.sync="enumRefer.enumPage">
                    <template slot="radio" slot-scope="{row}">
                        <el-radio v-model="enumRefer.selectRow" :label="row.$index">&nbsp;
                        </el-radio>
@@ -115,7 +133,7 @@
                </avue-crud>
                <div slot="footer" class="dialog-footer">
                    <el-button type="primary" @click="confirmEnum" size="small">确定</el-button>
                    <el-button @click="cancleEnum" size="small">取消</el-button>
                    <el-button @click="cancelEnum" size="small">取消</el-button>
                </div>
            </el-dialog>
        </el-dialog>
@@ -124,9 +142,9 @@
</template>

<script>
import { getDictionary,getParentList } from '@/api/omd/enum'
import { initTree,btmPage } from '@/api/omd/btmType'
import { add} from '@/api/omd/OmdAttribute'
import { getDictionary, getParentList } from '@/api/omd/enum'
import { initTree, btmPage } from '@/api/omd/btmType'
import { add } from '@/api/omd/OmdAttribute'
export default {
    name: 'originalAdd',
    props: {
@@ -136,6 +154,10 @@
    },
    data() {
        return {
            form:{
              name:'',
              label:''
            },
            showSubmitDialog: false,
            // 默认的页签
            activeName: 'referTab',
@@ -148,7 +170,7 @@
                id: [
                    { required: true, message: '请输入属性编号', trigger: 'blur' },
                    { pattern: /^[A-Za-z]+$/, message: '属性编号只能为英文', trigger: 'blur' },
                    { min: 2, max: 15, message: '长度在2到15个字符', trigger: 'blur' }
                    { min: 2, max: 30, message: '长度在2到30个字符', trigger: 'blur' }
                ],
                name: [
                    { required: true, message: '请输入属性名称', trigger: 'blur' }
@@ -181,24 +203,24 @@
                    highlightCurrentRow: true,
                    column: [
                        {
                        label: '',
                        prop: 'radio',
                        width: 60,
                        hide: false
                    },
                    {
                        label: '英文名称',
                        prop: 'id',
                        align: 'center',
                        searchSpan:8,
                        search: true,
                    }, {
                        label: '中文名称',
                        prop: 'name',
                        align: 'center',
                        searchSpan:8,
                        search: true,
                    }]
                            label: '',
                            prop: 'radio',
                            width: 60,
                            hide: false
                        },
                        {
                            label: '英文名称',
                            prop: 'id',
                            align: 'center',
                            searchSpan: 8,
                            search: true,
                        }, {
                            label: '中文名称',
                            prop: 'name',
                            align: 'center',
                            searchSpan: 8,
                            search: true,
                        }]
                },
                // 参照页面表格数据
                data: [],
@@ -219,30 +241,31 @@
                    addBtn: false,
                    refreshBtn: false,
                    columnBtn: false,
                    selection: true,
                    // selection: true,
                    menu: false,
                    border: true,
                    reserveSelection: true,
                    searchMenuSpan: 32,
                    searchShowBtn: false,
                    // searchShowBtn: false,
                    // search:true,
                    highlightCurrentRow: true,
                    column: [{
                        label: '',
                        prop: 'radio',
                        width: 60,
                        hide: false
                    },{
                    }, {
                        label: '枚举代号',
                        prop: 'name',
                        align: 'center',
                        searchSpan:8,
                        search: true,
                        searchSpan: 8,
                        // search: true,
                    }, {
                        label: '枚举名称',
                        prop: 'label',
                        align: 'center',
                        searchSpan:8,
                        search: true,
                        searchSpan: 8,
                        // search: true,
                    }]
                },
                // 枚举参照表格数据
@@ -263,7 +286,12 @@
                        value: 'oid',
                    }
                }
            }
            },
            dictEnums: [],
            enumEditFlag: false,
            enumInitFlag: false,
            referInitFlag: false,
            referEditFlag: false,
        }
    },
    created() {
@@ -271,6 +299,28 @@
        this.initAttributeReferTypeList();
    },
    methods: {
      onSubmit() {
        if (this.form.name || this.form.label) {
          const params = {};
          if (this.form.name) {
            params.name = this.form.name;
          }
          if (this.form.label) {
            params.label = this.form.label;
          }
          getParentList(this.enumRefer.enumPage.currentPage, this.enumRefer.enumPage.pageSize, params)
            .then((res) => {
              this.enumRefer.enumPage.total = res.data.data.total;
              this.enumRefer.data = res.data.data.records;
            });
        }
      },
        enumOnLoad(){
          getParentList(this.enumRefer.enumPage.currentPage, this.enumRefer.enumPage.pageSize).then(res => {
            this.enumRefer.enumPage.total = res.data.data.total;
            this.enumRefer.data = res.data.data.records;
          })
        },
        closeSubmitDialog() {
            this.resetAttributeForm();
            this.showSubmitDialog = false;
@@ -282,31 +332,53 @@
            };
            this.referToFlag = true;
            this.$refs.form.resetFields();
            this.dictEnums = [];
        },
        submitAttribute() { 
            add(this.attribute).then(res => {
                this.$message.success("保存成功");
                this.showSubmitDialog = false;
                this.attribute = {};
                this.$emit('refreshTable');
            });
            
        submitAttribute() {
            const that = this;
            if (that.referInitFlag && that.referEditFlag){
                this.$set(this.attribute,'dictCode','');
                this.$set(this.attribute,'dictKey','');
                this.$set(this.attribute,'dictValue','');
                this.$set(this.attribute,'usingDict','');
            }
            if (that.enumInitFlag && that.enumEditFlag){
                this.$set(this.attribute,'referTypeCode','');
                this.$set(this.attribute,'referTypeKey','');
                this.$set(this.attribute,'referTypeValue','');
                this.$set(this.attribute,'referToId','');
                this.$set(this.attribute,'referToName','');
            }
            this.$refs.form.validate(function (pass, field) {
                if (pass) {
                    add(that.attribute).then(res => {
                        that.$message.success("保存成功");
                        that.showSubmitDialog = false;
                        that.attribute = {};
                        that.$emit('refreshTable');
                    });
                } else {
                    that.$message.error('必填');
                }
            })
        },
        cancleSubmit() {
        cancelSubmit() {
            this.closeSubmitDialog();
        },
        closeEnumDialog() {
            this.cancleEnum();
         },
        closeReferDialog() { 
            this.cancleBtm();
            this.cancelEnum();
        },
        confirmBtm() { 
        closeReferDialog() {
            this.cancelBtm();
        },
        confirmBtm() {
            this.attribute.referToId = this.btmRefer.selectItem.oid;
            this.attribute.referToName = this.btmRefer.selectItem.name;
            this.btmRefer.show = false;
            this.referEditFlag =  true;
            this.enumEditFlag = false;
        },
        cancleBtm() { 
        cancelBtm() {
            this.btmRefer.selectItem = {};
            this.btmRefer.show = false;
            this.btmRefer.selectRow = '';
@@ -316,8 +388,13 @@
            this.attribute.dictCode = this.enumRefer.selectItem.name;
            this.attribute.dictValue = this.enumRefer.selectItem.label;
            this.enumRefer.show = false;
         },
        cancleEnum() { 
            getDictionary({code :this.enumRefer.selectItem.name}).then(res => {
                this.dictEnums = res.data.data;
            });
            this.referEditFlag =  false;
            this.enumEditFlag = true;
        },
        cancelEnum() {
            this.enumRefer.selectItem = {};
            this.enumRefer.show = false;
            this.enumRefer.selectRow = '';
@@ -335,24 +412,23 @@
                this.domain.data = res.data.data;
            })
            this.btmRefer.show = true;

        },
        // 参照类型树的点击事件
        nodeClick(data) {
            // 区分业务类型的查询和链接类型的查询
            if(this.attribute.referTypeKey == 'btmType'){
                btmPage(this.btmRefer.btmPage.currentPage,this.btmRefer.btmPage.pageSize,{domain:data.id}).then(res => {
            if (this.attribute.referTypeKey == 'btmType') {
                btmPage(this.btmRefer.btmPage.currentPage, this.btmRefer.btmPage.pageSize, { bizDomain: data.id }).then(res => {
                    this.btmRefer.data = res.data.data.records;
                    this.btmRefer.btmPage.total = res.data.data.total;
                })
            }
            if(this.attribute.referTypeKey == 'linkType'){

            }
            // if (this.attribute.referTypeKey == 'linkType') {
            //
            // }
        },
        // 枚举类型输入框获得焦点时的事件
        openEnumConfig() {
            getParentList(this.enumRefer.enumPage.currentPage,this.enumRefer.enumPage.pageSize).then(res => {
            getParentList(this.enumRefer.enumPage.currentPage, this.enumRefer.enumPage.pageSize).then(res => {
                this.enumRefer.enumPage.total = res.data.data.total;
                this.enumRefer.data = res.data.data.records;
            })
@@ -361,20 +437,20 @@
        // 属性类型下拉框选择事件
        typeSelectChange(value) {
            if (value == 'VTString') {
                this.$set(this.attribute,"maxLength",150)
                this.$set(this.attribute, "maxLength", 150)
            } else if (value == 'VTInteger') {
                this.$set(this.attribute,"maxLength",50)
                this.$set(this.attribute, "maxLength", 50)
            } else if (value == 'VTBoolean') {
                this.$set(this.attribute,"maxLength",5)
                this.$set(this.attribute, "maxLength", 5)
            } else if (value == 'VTDouble') {
                this.$set(this.attribute,"maxLength",26)
                this.$set(this.attribute,"precision",8)
                this.$set(this.attribute, "maxLength", 26)
                this.$set(this.attribute, "precision", 8)
            } else if (value == 'VTLong') {
                this.$set(this.attribute,"maxLength",150)
                this.$set(this.attribute, "maxLength", 150)
            } else if (value == 'VTDate' || value == 'VTTime' || value == 'VTDateTime') {
                this.$set(this.attribute,"maxLength",6)
                this.$set(this.attribute, "maxLength", 6)
            } else {
                this.$set(this.attribute,"maxLength",50)
                this.$set(this.attribute, "maxLength", 50)
            }
            this.attribute.typeCode = 'attributeType';
            this.attribute.typeKey = value;
@@ -395,7 +471,7 @@
                this.$message.error('属性类型没找到或者未定义')
            })
        },
        initAttributeReferTypeList(){
        initAttributeReferTypeList() {
            getDictionary({ code: 'attributeReferType' }).then(res => {
                res.data.data.forEach(element => {
                    this.btmRefer.referTypeList.push(
@@ -406,32 +482,30 @@
                this.$message.error('参照类型没找到或者未定义')
            })
        },
        btmReferClick(row){
        btmReferClick(row) {
            this.btmRefer.selectItem = row;
            this.btmRefer.selectRow = row.$index;
        },
        enumReferClick(row){
        enumReferClick(row) {
            this.enumRefer.selectItem = row;
            this.enumRefer.selectRow = row.$index;
        },
        // 参照名称点击清除数据
        clearReferTo(){
            this.$delete(this.attribute,'referToId');
            this.$delete(this.attribute,'referToName');
        clearReferTo() {
            this.$delete(this.attribute, 'referToId');
            this.$delete(this.attribute, 'referToName');
            this.btmRefer.selectItem = {};
            this.btmRefer.selectRow = '';
        },
        handleClick(tab){
            // 因为只能参照和枚举二选一。所以在切换的时候把属性给清空。
            this.$delete(this.attribute,'referTypeCode');
            this.$delete(this.attribute,'referTypeKey');
            this.$delete(this.attribute,'referTypeValue');
            this.$delete(this.attribute,'referToId');
            this.$delete(this.attribute,'referToName');
            this.$delete(this.attribute,'dictCode');
            this.$delete(this.attribute,'dictKey');
            this.$delete(this.attribute,'dictValue');
            this.$delete(this.attribute,'usingDict');
            if (tab.name === 'enumTab'){
              this.enumInitFlag = true;
              this.referInitFlag = false;
            }else {
              this.enumInitFlag = false;
              this.referInitFlag = true;
            }
        }
    }
}
@@ -449,4 +523,19 @@
.attributeForm>.el-form-item>.el-form-item__content>.el-input>.el-input__inner {
    width: 200px;
}
</style>

.attributeForm>.el-form-item>.el-form-item__content>.el-select>.el-input>.el-input__inner {
    width: 200px;
}
.attributeForm>.el-form-item>.el-form-item__content{
  width :190px;
}

.referTypeForm > .el-form-item__content > .el-select > .el-input>.el-input__inner {
  width: 200px;
}

.referNameForm > .el-form-item__content > .el-input > .el-input__inner {
  width: 200px;
}
</style>