+
-
{{ attr.alias || attr.name }}
- =>
+
=>
{{ attr.alias || attr.name }}
+
+
+
+
+
+
@@ -179,13 +210,16 @@
-
-
+
+
{{ attr.alias || attr.name }}
@@ -196,12 +230,12 @@
=>
-
+
{{ attr.alias || attr.name }}
@@ -209,6 +243,20 @@
+
+
+
+
+
+
+
+
@@ -227,6 +275,7 @@ import {
} from '@/modules/cmdb/api/CITypeRelation'
import { getCITypes } from '@/modules/cmdb/api/CIType'
import { getCITypeAttributesById } from '@/modules/cmdb/api/CITypeAttr'
+import { v4 as uuidv4 } from 'uuid'
import CMDBGrant from '../../components/cmdbGrant'
@@ -259,8 +308,8 @@ export default {
tableData: [],
parentTableData: [],
attributes: [],
- parent_attr_id: undefined,
- child_attr_id: undefined,
+ tableAttrList: [],
+ modalAttrList: [],
modalChildAttributes: [],
}
},
@@ -297,8 +346,11 @@ export default {
async getCITypeParent() {
await getCITypeParent(this.CITypeId).then((res) => {
this.parentTableData = res.parents.map((item) => {
+ const parentAndChildAttrList = this.handleAttrList(item)
+
return {
...item,
+ parentAndChildAttrList,
source_ci_type_name: this.CITypeName,
source_ci_type_id: this.CITypeId,
isParent: true,
@@ -309,8 +361,11 @@ export default {
getCITypeChildren() {
getCITypeChildren(this.CITypeId).then((res) => {
const data = res.children.map((obj) => {
+ const parentAndChildAttrList = this.handleAttrList(obj)
+
return {
...obj,
+ parentAndChildAttrList,
source_ci_type_name: this.CITypeName,
source_ci_type_id: this.CITypeId,
}
@@ -322,6 +377,20 @@ export default {
}
})
},
+
+ handleAttrList(data) {
+ const length = Math.min(data?.parent_attr_ids?.length || 0, data.child_attr_ids?.length || 0)
+ const parentAndChildAttrList = []
+ for (let i = 0; i < length; i++) {
+ parentAndChildAttrList.push({
+ id: uuidv4(),
+ parentAttrId: data?.parent_attr_ids?.[i] ?? '',
+ childAttrId: data?.child_attr_ids?.[i] ?? ''
+ })
+ }
+ return parentAndChildAttrList
+ },
+
getCITypes() {
getCITypes().then((res) => {
this.CITypes = res.ci_types
@@ -342,6 +411,13 @@ export default {
handleCreate() {
this.drawerTitle = this.$t('cmdb.ciType.addRelation')
this.visible = true
+ this.$set(this, 'modalAttrList', [
+ {
+ id: uuidv4(),
+ parentAttrId: undefined,
+ childAttrId: undefined
+ }
+ ])
this.$nextTick(() => {
this.form.setFieldsValue({
source_ci_type_id: this.CITypeId,
@@ -365,19 +441,22 @@ export default {
ci_type_id,
relation_type_id,
constraint,
- parent_attr_id = undefined,
- child_attr_id = undefined,
} = values
- if ((!parent_attr_id && child_attr_id) || (parent_attr_id && !child_attr_id)) {
- this.$message.warning(this.$t('cmdb.ciType.attributeAssociationTip3'))
+ const {
+ parent_attr_ids,
+ child_attr_ids,
+ validate
+ } = this.handleValidateAttrList(this.modalAttrList)
+ if (!validate) {
return
}
+
createRelation(source_ci_type_id, ci_type_id, {
relation_type_id,
constraint,
- parent_attr_id,
- child_attr_id,
+ parent_attr_ids,
+ child_attr_ids,
}).then((res) => {
this.$message.success(this.$t('addSuccess'))
this.onClose()
@@ -386,6 +465,37 @@ export default {
}
})
},
+
+ /**
+ * 校验属性列表
+ * @param {*} attrList
+ */
+ handleValidateAttrList(attrList) {
+ const parent_attr_ids = []
+ const child_attr_ids = []
+ attrList.map((attr) => {
+ if (attr.parentAttrId) {
+ parent_attr_ids.push(attr.parentAttrId)
+ }
+ if (attr.childAttrId) {
+ child_attr_ids.push(attr.childAttrId)
+ }
+ })
+
+ if (parent_attr_ids.length !== child_attr_ids.length) {
+ this.$message.warning(this.$t('cmdb.ciType.attributeAssociationTip3'))
+ return {
+ validate: false
+ }
+ }
+
+ return {
+ validate: true,
+ parent_attr_ids,
+ child_attr_ids
+ }
+ },
+
handleOpenGrant(record) {
this.$refs.cmdbGrant.open({
name: `${record.source_ci_type_name} -> ${record.name}`,
@@ -401,23 +511,45 @@ export default {
if (row.isParent) return 'relation-table-parent'
},
handleEditActived({ row }) {
- this.parent_attr_id = row?.parent_attr_id ?? undefined
- this.child_attr_id = row?.child_attr_id ?? undefined
+ const tableAttrList = []
+
+ const length = Math.min(row?.parent_attr_ids?.length || 0, row.child_attr_ids?.length || 0)
+ if (length) {
+ for (let i = 0; i < length; i++) {
+ tableAttrList.push({
+ id: uuidv4(),
+ parentAttrId: row?.parent_attr_ids?.[i] ?? undefined,
+ childAttrId: row?.child_attr_ids?.[i] ?? undefined
+ })
+ }
+ } else {
+ tableAttrList.push({
+ id: uuidv4(),
+ parentAttrId: undefined,
+ childAttrId: undefined
+ })
+ }
+ this.$set(this, 'tableAttrList', tableAttrList)
},
async handleEditClose({ row }) {
const { source_ci_type_id: parentId, id: childrenId, constraint, relation_type } = row
- const { parent_attr_id, child_attr_id } = this
const _find = this.relationTypes.find((item) => item.name === relation_type)
const relation_type_id = _find?.id
- if ((!parent_attr_id && child_attr_id) || (parent_attr_id && !child_attr_id)) {
- this.$message.warning(this.$t('cmdb.ciType.attributeAssociationTip3'))
+
+ const {
+ parent_attr_ids,
+ child_attr_ids,
+ validate
+ } = this.handleValidateAttrList(this.tableAttrList)
+ if (!validate) {
return
}
+
await createRelation(row.isParent ? childrenId : parentId, row.isParent ? parentId : childrenId, {
relation_type_id,
constraint,
- parent_attr_id,
- child_attr_id,
+ parent_attr_ids,
+ child_attr_ids,
}).finally(() => {
this.getData()
})
@@ -427,7 +559,9 @@ export default {
return _find?.alias ?? _find?.name ?? id
},
changeChild(value) {
- this.form.setFieldsValue({ child_attr_id: undefined })
+ this.modalAttrList.forEach((item) => {
+ item.childAttrId = undefined
+ })
getCITypeAttributesById(value).then((res) => {
this.modalChildAttributes = res?.attributes ?? []
})
@@ -436,10 +570,75 @@ export default {
// filter password/json/is_list
return attributes.filter((attr) => !attr.is_password && !attr.is_list && attr.value_type !== '6')
},
+ addTableAttr() {
+ this.tableAttrList.push({
+ id: uuidv4(),
+ parentAttrId: undefined,
+ childAttrId: undefined
+ })
+ },
+ removeTableAttr(id) {
+ if (this.tableAttrList.length <= 1) {
+ this.$message.error(this.$t('cmdb.ciType.attributeAssociationTip6'))
+ return
+ }
+ const index = this.tableAttrList.findIndex((item) => item.id === id)
+ if (index !== -1) {
+ this.tableAttrList.splice(index, 1)
+ }
+ },
+
+ addModalAttr() {
+ this.modalAttrList.push({
+ id: uuidv4(),
+ parentAttrId: undefined,
+ childAttrId: undefined
+ })
+ },
+
+ removeModalAttr(id) {
+ if (this.modalAttrList.length <= 1) {
+ this.$message.error(this.$t('cmdb.ciType.attributeAssociationTip6'))
+ return
+ }
+ const index = this.modalAttrList.findIndex((item) => item.id === id)
+ if (index !== -1) {
+ this.modalAttrList.splice(index, 1)
+ }
+ }
},
}
+
+
diff --git a/cmdb-ui/src/modules/cmdb/views/model_relation/modules/modelRelationTable.vue b/cmdb-ui/src/modules/cmdb/views/model_relation/modules/modelRelationTable.vue
index 0260f665..31134a79 100644
--- a/cmdb-ui/src/modules/cmdb/views/model_relation/modules/modelRelationTable.vue
+++ b/cmdb-ui/src/modules/cmdb/views/model_relation/modules/modelRelationTable.vue
@@ -1,5 +1,5 @@
-
+
-
+
@@ -47,37 +48,73 @@
- {{ getAttrNameById(type2attributes[row.parent_id], row.parent_attr_id) }}=>
- {{ getAttrNameById(type2attributes[row.child_id], row.child_attr_id) }}
+
+ {{ getAttrNameById(type2attributes[row.parent_id], item.parentAttrId) }}=>
+ {{ getAttrNameById(type2attributes[row.child_id], item.childAttrId) }}
+
+
-
+
-
+
{{ attr.alias || attr.name }}
- =>
+
=>
-
+
{{ attr.alias || attr.name }}
+
+
+
+
+
+
@@ -97,6 +134,7 @@
-
+