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

@@ -1,5 +1,5 @@
<template>
    <el-dialog 
    <el-dialog
    title="业务类型"
    :visible.sync="showSubmitDialog"
    append-to-body
@@ -7,9 +7,8 @@
    width="70%"
    style="height: 115vh;"
    >
        <el-form ref="form" :model="btmType" show-message="true" inline size="medium" label-suffix=":" class="btmTypeForm">
                
            <el-form-item label="英文名称" label-width="100px" required="true">
        <el-form ref="form" :model="btmType" show-message="true" inline size="medium" label-suffix=":" class="btmTypeForm" :rules="rules" @resetFields="resetForm" status-icon="true">
            <el-form-item label="英文名称" label-width="100px" required="true" prop="id">
                <el-input v-model="btmType.id" :prefix-icon="icons.key"></el-input>
            </el-form-item>
            <el-form-item label="中文名称" label-width="100px">
@@ -18,7 +17,7 @@
            <el-form-item label="数据库表名" label-width="100px">
                <el-input v-model="btmType.tableName" :prefix-icon="icons.tableName"></el-input>
            </el-form-item>
            <el-form-item label="所属领域" label-width="100px">
            <el-form-item label="所属领域" label-width="100px" prop="domain">
                <el-select v-model="btmType.domain" :prefix-icon="icons.domain">
                    <el-option v-for="item in domainOption"
                    :label="item.label" :value="item.value" :key="item.value"></el-option>
@@ -44,26 +43,28 @@
            </el-form-item>
        </div>
            <el-form-item label="描述" label-width="100px" class="description">
                <el-input v-model="btmType.description" 
                :prefix-icon="icons.desc" 
                <el-input v-model="btmType.description"
                :prefix-icon="icons.desc"
                class="descClass"
                id="descId"
                ></el-input>
            </el-form-item>
        </el-form>
        <avue-crud :option="option" 
        :data="btmType.attributes" 
        :page.sync="page" 
        ref="attrTable"
        @cell-mouse-enter="cellEditClick"
        @cell-mouse-leave="cellEditSave">
        <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>
            
          <template slot="menu" slot-scope="{row,index}">
            <el-button icon="el-icon-edit" size="small" type="text" v-if="!row.$cellEdit" @click="cellEditClick(row)">编辑</el-button>
            <el-button icon="el-icon-delete" size="small" type="text" v-if="!row.$cellEdit" @click="removeFormAttrTable(row,index)">移除</el-button>
            <el-button icon="el-icon-check" size="small" type="text" v-if="row.$cellEdit" @click="cellEditSave(row,index)">保存</el-button>
          </template>
        </avue-crud>
        <div slot="footer" class="dialog-footer">
            <el-button type="primary" @click="submitBtmType">确定</el-button>
@@ -77,16 +78,17 @@
            @close="closeAttrDialog"
            width="80%"
        >
            <avue-crud class="attrRef" 
            :option="attrRef.option" 
            :data="attrRef.data" 
            <avue-crud class="attrRef"
            :option="attrRef.option"
            :data="attrRef.data"
            :page.sync="attrRef.page"
            ref="attrRef"
            @on-load="attrRefOnLoad"
            @search-change="attrRefSearch"
            @selection-change="selectionChange">
                <template slot="name" slot-scope="scope" >
                    <el-tag>{{scope}}</el-tag>
            @selection-change="selectionChange"
            v-loading="attrRef.loading">
                <template slot="typeValue" slot-scope="scope" >
                    <el-tag>{{scope.row.typeValue}}</el-tag>
                </template>
            </avue-crud>
            <div slot="footer" class="dialog-footer">
@@ -99,7 +101,7 @@
            :visible.sync="revisionRef.visible"
            append-to-body
            width="80%">
            

            <avue-crud class="revisionRef"
             :option="revisionRef.option"
             :data="revisionRef.data"
@@ -140,19 +142,31 @@
            type: Array
        }
    },
  watch:{
    btmType:{
      handler(newval,oldval){
        console.log('监听',newval,oldval)
      },
      deep:true,
      immediate:true
    }
  },
    data() {
        return {
            form: {},
            showSubmitDialog : false,
            option: {
                height: "330px",
                selection: true,
                selection: false,
                headerAlign: 'center',
                border: true,
                index: true,
                rowKey: 'id',
                tabs: true,
                menu: false,
                menu: true,
                editBtn: false,
                delBtn: false,
                menuWidth: 150,
                addBtn:false,
                highlightCurrentRow: true,
                column: [
@@ -192,6 +206,7 @@
                    currentPage:1,
                    pageSize:10,
                },
                loading: false,
                key: null,
                option:{
                    height: 360,
@@ -204,22 +219,24 @@
                    reserveSelection: true,
                    searchMenuSpan:8,
                    highlightCurrentRow: true,
                    rowKey: 'id',
                    column: [
                        {
                        label: '英文名称',
                        prop: 'key',
                        prop: 'id',
                        align: 'left',
                        search: true,
                        width: 230
                    }, {
                        label: '中文名称',
                        prop: 'label',
                        prop: 'name',
                        align: 'center',
                    },
                    {
                        label: "类型",
                        prop: "typeValue",
                        align: 'center'
                        align: 'center',
                        slot: true,
                    },
                    {
                        label: "默认值",
@@ -250,7 +267,7 @@
                    ]
                },
                data: [],
                queryNotIn: null
                queryNotIn: ''
            },
            revisionRef: {
                visible: false,
@@ -315,6 +332,16 @@
                    ]
                },
            },
            rules: {
                id: [
                    { required: true, message: '请输入业务类型编号', trigger: 'blur' },
                    { pattern: /^[A-Za-z]+$/, message: '业务类型编号只能为英文', trigger: 'blur' },
                    { min: 2, max: 20, message: '长度在2到20个字符', trigger: 'blur' }
                ],
                domain: [
                    { required: true, message: '请选择所属领域', trigger: 'blur' }
                ]
            },
        }
    },
    created() {
@@ -328,33 +355,52 @@
            this.btmType = {};
            this.attrRef.selectData = [];
            this.attrRef.queryNotIn = null;
            this.resetForm();
        },
        // 关闭属性池查询弹窗
        closeAttrDialog(){
            this.attrRef.visible = false;
        },
        // 添加
        rowAdd(){
        // 属性选择添加
        async rowAdd() {
            await this.attrRefOnLoad();
            this.attrRef.visible = true;
            this.attrRefOnLoad();
        },
        // 属性池加载
        attrRefOnLoad(){
            if (this.attrRef.queryNotIn != ''){
              this.attrRef.queryNotIn = '';
               this.btmType.attributes.forEach(item => {
                  this.attrRef.queryNotIn += (item.id + ",")
               })
            }
            this.attrRef.loading = true;
            queryPage(this.attrRef.key,this.attrRef.queryNotIn,this.attrRef.page.currentPage, this.attrRef.page.pageSize).then(res => {
                const data = res.data.data;
                this.attrRef.page.total = data.total;
                this.attrRef.data = data.records;
            });
            setTimeout(() => {
              this.attrRef.loading = false;
            },600)
            this.$nextTick(() => {
                this.$refs.attrRef.refreshTable();
            });
        },
        // 属性池检索
        attrRefSearch(form,done){
            this.attrRef.key = form.key;
            this.attrRef.key = form.id;
            this.attrRefOnLoad();
            done();
            this.attrRef.key = null;
        },
        // 从属性池中移除
        removeFormAttrTable(row,index){
          this.btmType.attributes.splice(index,1);
          this.attrRef.queryNotIn = "";
          this.btmType.attributes.forEach(item => {
            this.attrRef.queryNotIn += (item.id + ",")
          })
        },
        // 属性池勾选事件
        selectionChange(list){
@@ -362,21 +408,27 @@
        },
        // 确认属性池勾选
        confirmSelectAttr(){
            this.btmType.attributes = [];
            this.attrRef.queryNotIn = "";
            if(!this.btmType.attributes) {
              this.btmType.attributes = [];
            }
            this.attrRef.selectData.forEach(item => {
                this.btmType.attributes.push({
                    id: item.key,
                    name: item.label,
                    id: item.id,
                    name: item.name,
                    typeValue: item.typeValue,
                    typeKey: item.typeValue,
                    attrDataType : item.typeValue,
                    attrDataType : item.typeKey,
                    defaultValue: item.defaultValue,
                    description: item.description,
                    attributeLength: item.maxLength
                    attributeLength: item.maxLength,
                    referBtmTypeId: item.referTypeCode,
                    referBtmTypeName: item.referToName,
                    enumId: item.dictCode,
                    // enumName: item,
                });
                this.attrRef.queryNotIn += (item.key + ",")
                this.attrRef.queryNotIn += (item.id + ",")
            });
            this.attrRef.data = [];
            this.closeAttrDialog();
        },
        // 取消属性池勾选
@@ -406,12 +458,13 @@
                this.$refs.attrTable.refreshTable();
            })
        },
        // 
        //
        viewChange(){

        },
        // 列表编辑
        cellEditClick(cell){
          console.log(cell);
            cell.$cellEdit = true;
        },
        // 列表编辑保存
@@ -465,6 +518,10 @@
            this.$delete(this.btmType,'revisionRuleId');
            this.$delete(this.btmType,'revisionRuleName');
            this.$delete(this.btmType,'inputRevisionFlag');
       },
       resetForm(){
        this.btmType = {};
        this.$refs.form.resetFields();
       }
    }
}