From 1418642b163ccf13f01070f235e470b115f584ad Mon Sep 17 00:00:00 2001
From: lihang <lihang@vci-tech.com>
Date: 星期二, 06 六月 2023 16:49:23 +0800
Subject: [PATCH] 链接类型添加组件

---
 Source/UBCS-WEB/src/views/modeling/LinkTypeAdd.vue |  388 +++++++++++++++++++++++++++++++++++++++++++++++++++++++
 1 files changed, 388 insertions(+), 0 deletions(-)

diff --git a/Source/UBCS-WEB/src/views/modeling/LinkTypeAdd.vue b/Source/UBCS-WEB/src/views/modeling/LinkTypeAdd.vue
new file mode 100644
index 0000000..8c7753a
--- /dev/null
+++ b/Source/UBCS-WEB/src/views/modeling/LinkTypeAdd.vue
@@ -0,0 +1,388 @@
+<template>
+    <el-dialog title="閾炬帴绫诲瀷" :visible.sync="showSubmitDialog" append-to-body @close="closeSubmitDialog" width="70%"
+        style="height: 115vh;">
+        <el-form ref="form" :model="linkType" show-message="true" inline size="medium" label-suffix=":"
+            class="linkTypeForm" :rules="rules" @resetFields="resetForm" status-icon="true">
+            <el-form-item label="鑻辨枃鍚嶇О" label-width="100px" required="true" prop="id">
+                <el-input v-model="linkType.id" :prefix-icon="icons.id" maxlength="15" show-word-limit type="text"></el-input>
+            </el-form-item>
+            <el-form-item label="涓枃鍚嶇О" label-width="100px">
+                <el-input v-model="linkType.name" :prefix-icon="icons.name"></el-input>
+            </el-form-item>
+            <el-form-item label="鏁版嵁搴撹〃鍚�" label-width="100px">
+                <el-input v-model="linkType.tableName" :prefix-icon="icons.tableName"></el-input>
+            </el-form-item>
+            <el-form-item label="鎵�灞為鍩�" label-width="100px" prop="domain">
+                <el-select v-model="linkType.domain" :prefix-icon="icons.domain">
+                    <el-option v-for="item in domainOption" :label="item.label" :value="item.value"
+                        :key="item.value"></el-option>
+                </el-select>
+            </el-form-item>
+            <el-form-item label="From绔被鍨�" label-width="100px">
+                <!-- from绔笟鍔$被鍨嬮�夋嫨 -->
+                <el-select v-model="fromBtmValues" :value="fromBtmTypes" value-key="oid" placeholder="璇烽�夋嫨From绔被鍨�" filterable multiple collapse-tags @change="fromSelectChange">
+                    <el-option-group v-for="domain in domainList" :key="domain.id" :label="domain.name">
+                        <el-option v-for="item in domain.childList" :key="item.oid" :label="item.id + item.name"
+                            :value="item">
+                        </el-option>
+                    </el-option-group>
+                </el-select>
+            </el-form-item>
+            <el-form-item label="To绔被鍨�" label-width="100px">
+                <!-- to绔笟鍔$被鍨嬮�夋嫨 -->
+                <el-select v-model="toBtmValues" :value="toBtmTypes" value-key="oid" placeholder="璇烽�夋嫨To绔被鍨�" filterable multiple collapse-tags @change="toSelectChange">
+                    <el-option-group v-for="domain in domainList" :key="domain.id" :label="domain.name">
+                        <el-option v-for="item in domain.childList" :key="item.oid" :label="item.id + item.name"
+                            :value="item">
+                        </el-option>
+                    </el-option-group>
+                </el-select>
+            </el-form-item>
+            <el-form-item label="鎻忚堪" label-width="100px" class="description">
+                <el-input v-model="linkType.description" :prefix-icon="icons.desc" class="descClass" id="descId"></el-input>
+            </el-form-item>
+        </el-form>
+        <avue-crud :option="option" :data="linkType.attributes" :page.sync="page" ref="attrTable"
+            @cell-mouse-enter="cellEditClick" @cell-mouse-leave="cellEditSave">
+            <template slot-scope="scope" slot="menuLeft">
+                <el-button type="danger" icon="el-icon-plus" size="small" @click="rowAdd()">灞炴�ч�夋嫨</el-button>
+            </template>
+
+        </avue-crud>
+        <div slot="footer" class="dialog-footer">
+            <el-button type="primary" @click="submitlinkType">纭畾</el-button>
+            <el-button @click="cancleSubmitlinkType">鍙栨秷</el-button>
+        </div>
+
+        <!-- 灞炴�ф睜鐨勯�夋嫨 -->
+        <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" @search-change="attrRefSearch" @selection-change="selectionChange">
+                <template slot="typeValue" slot-scope="scope">
+                    <el-tag>{{ scope.row.typeValue }}</el-tag>
+                </template>
+            </avue-crud>
+            <div slot="footer" class="dialog-footer">
+                <el-button @click="confirmSelectAttr">纭畾</el-button>
+                <el-button @click="cancleSelectAttr">鍙栨秷</el-button>
+            </div>
+        </el-dialog>
+
+    </el-dialog>
+</template>
+
+
+<script>
+
+import { add, update } from '@/api/omd/linkType';
+import { queryPage } from '@/api/omd/OmdAttribute';
+import { getPage } from '@/api/omd/revisionRule';
+import { initTree } from "@/api/omd/btmType"
+export default {
+    name: 'LinkTypeAdd',
+    props: {
+        linkType: {
+            type: Object
+        },
+        domainOption: {
+            type: Array
+        },
+        icons: {
+            type: Array
+        }
+    },
+    data() {
+        return {
+            form: {},
+            showSubmitDialog: false,
+            option: {
+                height: "330px",
+                selection: true,
+                headerAlign: 'center',
+                border: true,
+                index: true,
+                rowKey: 'id',
+                tabs: true,
+                menu: false,
+                addBtn: false,
+                highlightCurrentRow: true,
+                column: [
+                    {
+                        label: '鑻辨枃鍚嶇О',
+                        prop: 'id',
+                        align: 'center'
+                    }, {
+                        label: '涓枃鍚嶇О',
+                        prop: 'name',
+                        align: 'center',
+                        cell: true
+                    },
+                    {
+                        label: '绫诲瀷',
+                        prop: 'attrDataType',
+                        align: 'center',
+                        slot: true
+                    },
+                    {
+                        label: '榛樿鍊�',
+                        prop: 'defaultValue',
+                        align: 'center',
+                        cell: true
+                    },
+                    {
+                        label: '璇存槑',
+                        prop: 'description',
+                        align: 'center',
+                        cell: true
+                    }
+                ]
+            },
+            attrRef: {
+                visible: false,
+                page: {
+                    currentPage: 1,
+                    pageSize: 10,
+                },
+                key: null,
+                option: {
+                    height: 360,
+                    addBtn: false,
+                    refreshBtn: false,
+                    columnBtn: false,
+                    selection: true,
+                    menu: false,
+                    border: true,
+                    reserveSelection: true,
+                    searchMenuSpan: 8,
+                    highlightCurrentRow: true,
+                    column: [
+                        {
+                            label: '鑻辨枃鍚嶇О',
+                            prop: 'id',
+                            align: 'left',
+                            search: true,
+                            width: 230
+                        }, {
+                            label: '涓枃鍚嶇О',
+                            prop: 'name',
+                            align: 'center',
+                        },
+                        {
+                            label: '绫诲瀷',
+                            prop: 'typeValue',
+                            align: 'center'
+                        },
+                        {
+                            label: '榛樿鍊�',
+                            prop: 'defaultValue',
+                            align: 'center'
+                        },
+                        {
+                            label: '鍏佽涓虹┖',
+                            prop: 'nullable',
+                            type: 'switch',
+                            display: false,
+                            hide: true,
+                            labelWidth: 132,
+                            dicData: [{
+                                label: '鍚�',
+                                value: 1
+                            }, {
+                                label: '鏄�',
+                                value: 0
+                            }]
+                        },
+                        {
+                            label: '璇存槑',
+                            prop: 'description',
+                            cell: true,
+                            align: 'center'
+                        }
+                    ]
+                },
+                data: [],
+                queryNotIn: null
+            },
+            fromBtmValues: [],
+            toBtmValues: [],
+            domainList: [],
+            rules: {
+                id: [
+                    { required: true, message: '璇疯緭鍏ラ摼鎺ョ被鍨嬬紪鍙�', trigger: 'blur' },
+                    { pattern: /^[A-Za-z]+$/, message: '閾炬帴绫诲瀷缂栧彿鍙兘涓鸿嫳鏂�', trigger: 'blur' },
+                    { min: 2, max: 15, message: '闀垮害鍦�2鍒�15涓瓧绗�', trigger: 'blur' }
+                ],
+                domain: [
+                    { required: true, message: '璇烽�夋嫨鎵�灞為鍩�', trigger: 'blur' }
+                ]
+            },
+        }
+    },
+    created() {
+        this.initTreeOnLoad();
+    },
+    methods: {
+        // 鍏抽棴缁勪欢寮圭獥
+        closeSubmitDialog() {
+            this.showSubmitDialog = false;
+            this.linkType.attributes = [];
+            this.linkType = {};
+            this.attrRef.selectData = [];
+            this.attrRef.queryNotIn = null;
+            this.resetForm();
+        },
+        // 鍏抽棴灞炴�ф睜鏌ヨ寮圭獥
+        closeAttrDialog() {
+            this.attrRef.visible = false;
+        },
+        initTreeOnLoad() {
+            initTree().then(res => {
+                this.domainList = res.data.data;
+            });
+        },
+        // 娣诲姞
+        rowAdd() {
+            this.attrRef.visible = true;
+            this.attrRefOnLoad();
+        },
+        // 灞炴�ф睜鍔犺浇
+        attrRefOnLoad() {
+            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;
+            });
+            this.$nextTick(() => {
+                this.$refs.attrRef.refreshTable();
+            });
+        },
+        // 灞炴�ф睜妫�绱�
+        attrRefSearch(form, done) {
+            this.attrRef.key = form.key
+            this.attrRefOnLoad();
+            done();
+            this.attrRef.key = null;
+        },
+        // 灞炴�ф睜鍕鹃�変簨浠�
+        selectionChange(list) {
+            this.attrRef.selectData = list;
+        },
+        // 纭灞炴�ф睜鍕鹃��
+        confirmSelectAttr() {
+            if(!this.linkType.attributes){
+                this.linkType.attributes = [];
+            }
+            this.attrRef.queryNotIn = "";
+            console.log(this.attrRef.selectData);
+            this.attrRef.selectData.forEach(item => {
+                this.linkType.attributes.push({
+                    id: item.id,
+                    name: item.name,
+                    typeValue: item.typeValue,
+                    typeKey: item.typeValue,
+                    attrDataType: item.typeKey,
+                    defaultValue: item.defaultValue,
+                    description: item.description,
+                    attributeLength: item.maxLength
+                });
+                this.attrRef.queryNotIn += (item.id + ",")
+            });
+            this.closeAttrDialog();
+        },
+        // 鍙栨秷灞炴�ф睜鍕鹃��
+        cancleSelectAttr() {
+            this.attrRef.selectData = [];
+            this.closeAttrDialog();
+        },
+        // 娣诲姞涓氬姟绫诲瀷
+        submitlinkType() {
+            add(this.linkType, true).then(res => {
+                // 娣诲姞瀹屾垚锛屽洖璋冪埗缁勪欢鐨勫埛鏂�
+                this.$message.success('淇濆瓨鎴愬姛');
+                this.cancleSubmitlinkType();
+                this.$emit('refreshTable');
+            })
+        },
+        // 鍙栨秷娣诲姞涓氬姟绫诲瀷
+        cancleSubmitlinkType() {
+            this.linkType = {};
+            this.linkType.attributes = [];
+            this.showSubmitDialog = false;
+        },
+        // 鍒锋柊灞炴�у垪琛�
+        refreshAttrTable() {
+            this.$nextTick(() => {
+                this.$refs.attrTable.refreshTable();
+            })
+        },
+        // 
+        viewChange() {
+
+        },
+        // 鍒楄〃缂栬緫
+        cellEditClick(cell) {
+            cell.$cellEdit = true;
+        },
+        // 鍒楄〃缂栬緫淇濆瓨
+        cellEditSave(row) {
+            this.linkType.attributes[row.$index].name = row.name
+            this.linkType.attributes[row.$index].defaultValue = row.defaultValue;
+            this.linkType.attributes[row.$index].description = row.description;
+            row.$cellEdit = false;
+        },
+        fromSelectChange(dataList){
+            this.linkType.fromBtmTypes = [];
+            var fromBtmName = "";
+            var fromBtmType = "";
+            dataList.forEach(data => {
+                //this.linkType.fromBtmTypes.push(data);
+                fromBtmName += (data.name + ',');
+                fromBtmType += (data.id + ',');
+            })
+            this.linkType.fromBtmTypeName = fromBtmName;
+            this.linkType.fromBtmType = fromBtmType;
+        },
+        toSelectChange(dataList){
+            console.log(dataList);
+            this.linkType.toBtmTypes = [];
+            var toBtmName = "";
+            var toBtmType = "";
+            dataList.forEach(data => {
+                //this.linkType.toBtmTypes.push(data);
+                toBtmName += (data.name + ',');
+                toBtmType += (data.id + ',');
+            })
+            this.linkType.toBtmTypeName = toBtmName;
+            this.linkType.toBtmType = toBtmType;
+            console.log(this.linkType);
+        },
+        resetForm(){
+            this.linkType = {};
+            this.$refs.form.resetFields();
+        }
+    }
+}
+</script>
+
+<style>
+/* 灞炴�ф睜鍙傜収鍒楄〃 */
+.attrRef>.el-card:nth-of-type(2)>.el-card__body>.avue-crud__menu {
+    display: none !important;
+}
+
+.revisionRef>.el-card:nth-of-type(2)>.el-card__body>.avue-crud__menu {
+    display: none !important;
+}
+
+.linkTypeForm>.el-form-item>.el-form-item__content>.el-input>.el-input__inner {
+    width: 200px;
+}
+
+.descClass>.el-input__inner {
+    width: 57vw
+}
+
+#descId {
+    width: 57vw;
+}
+</style>

--
Gitblit v1.9.3