#560 reconsitution params in component physical-graph

WeBankPartners · Jan 15, 2020 · 508b258 · 508b258
1 parent c68befd
commit 508b258
Show file tree

Hide file tree

Showing 4 changed files with 93 additions and 87 deletions.
diff --git a/cmdb-ui/src/api/server.js b/cmdb-ui/src/api/server.js
@@ -26,14 +26,15 @@ export const addUser = data => req.post(`/admin/users/create`, data)
 export const addUsersToRole = (users, roleName) => req.post(`/admin/roles/${roleName}/users`, users)
 export const romoveUsersFromRole = (users, roleName) => req.delete(`/admin/roles/${roleName}/users`, { data: users })
 export const addMenusToRole = (menuCodes, roleName) => req.post(`/admin/roles/${roleName}/menu-permissions`, menuCodes)
-export const removeMenusFromRole = (menuCodes, roleName) =>
-  req.delete(`/admin/roles/${roleName}/menu-permissions`, {
-    data: menuCodes
-  })
+export const removeMenusFromRole = (menuCodes, roleName) => req.delete(`/admin/roles/${roleName}/menu-permissions`, {data: menuCodes})
 export const addDataPermissionAction = (roleName, ciTypeId, actionCode) =>
-  req.post(`/admin/roles/${roleName}/citypes/${ciTypeId}/actions/${actionCode}`)
+  req.post(
+    `/admin/roles/${roleName}/citypes/${ciTypeId}/actions/${actionCode}`
+  )
 export const removeDataPermissionAction = (roleName, ciTypeId, actionCode) =>
-  req.delete(`/admin/roles/${roleName}/citypes/${ciTypeId}/actions/${actionCode}`)
+  req.delete(
+    `/admin/roles/${roleName}/citypes/${ciTypeId}/actions/${actionCode}`
+  )
 export const getRoleCiTypeCtrlAttributesByRoleCiTypeId = roleCitypeId =>
   req.get(`/admin/role-citypes/${roleCitypeId}/ctrl-attributes`)
 export const createRoleCiTypeCtrlAttributes = (roleCitypeId, data) =>
@@ -61,24 +62,26 @@ export const getSpecialConnector = () => req.get('/static-data/special-connector
 // CI design
 
 export const implementCiType = (id, op) => req.post(`/ci-types/${id}/implement?operation=${op}`)
-export const implementCiAttr = (ciTypeId, ciAttrId, op) =>
-  req.post(`/ci-types/${ciTypeId}/attributes/${ciAttrId}/implement?operation=${op}`)
+export const implementCiAttr = (ciTypeId, ciAttrId, op) => req.post(`/ci-types/${ciTypeId}/attributes/${ciAttrId}/implement?operation=${op}`)
 export const getAllCITypes = () => req.get('/ci-types')
 export const getAllEnumCategoryTypes = () => req.get('/enum/category-types')
 export const getAllEnumCategories = () => req.get('/enum/category-types/categories')
 export const createEnumCategory = data => req.post(`/enum/category-types/${data.catTypeId}/categories/create`, data)
-export const updateEnumCategory = data =>
-  req.put(`/enum/category-types/${data.catTypeId}/categories/${data.catId}`, data)
+export const updateEnumCategory = data => req.put(`/enum/category-types/${data.catTypeId}/categories/${data.catId}`, data)
 export const getAllCITypesByLayerWithAttr = data => {
   const status = data.toString()
-  return req.get(`/ci-types?group-by=layer&with-attributes=yes&status=${status}`)
+  return req.get(
+    `/ci-types?group-by=layer&with-attributes=yes&status=${status}`
+  )
 }
 export const getAllLayers = () => req.get('/ci-type-layers')
 export const createLayer = data => req.post('/ci-type-layers/create', data)
 export const deleteLayer = id => req.delete(`/ci-type-layers/${id}`)
 export const updateLayer = data => req.post(`/enum/codes/update`, data)
 export const swapLayerPosition = (layerId, targetLayerId) =>
-  req.post(`/ci-type-layers/${layerId}/swap-position?target-layer-id=${targetLayerId}`)
+  req.post(
+    `/ci-type-layers/${layerId}/swap-position?target-layer-id=${targetLayerId}`
+  )
 export const deleteCITypeByID = id => req.delete(`/ci-types/${id}`)
 export const deleteAttr = (ciTypeId, attrId) => req.delete(`/ci-types/${ciTypeId}/attributes/${attrId}`)
 export const applyCiTypes = id => req.post(`/ci-types/${id}/apply`)
@@ -89,11 +92,15 @@ export const updateCIAttr = (attrId, ciTypeId, data) => req.put(`/ci-types/${ciT
 export const applyCIAttr = (ciTypeId, attrIds) => req.post(`/ci-types/${ciTypeId}/ci-type-attributes/apply`, attrIds)
 
 export const swapCiTypeAttributePosition = (ciTypeId, attrId, targetAttrId) => {
-  return req.post(`/ci-types/${ciTypeId}/attributes/${attrId}/swap-position?target-attribute-id=${targetAttrId}`)
+  return req.post(
+    `/ci-types/${ciTypeId}/attributes/${attrId}/swap-position?target-attribute-id=${targetAttrId}`
+  )
 }
 export const getAllInputTypes = () => req.get('/static-data/available-ci-type-attribute-input-types')
 export const getEnumByCIType = id =>
-  req.get(`/enum/category-types/categories/query-by-multiple-types?ci-type-id=${id}&types=common-private`)
+  req.get(
+    `/enum/category-types/categories/query-by-multiple-types?ci-type-id=${id}&types=common-private`
+  )
 export const getCiTypes = data => req.get(`/ci-types?${data.key}=${data.value}`)
 export const getAllIdcDesignData = () => req.get(`/ci-data/all-idc-design`)
 export const getIdcDesignTreeByGuid = data => req.post(`/data-tree/query-idc-design-tree`, data)
@@ -103,107 +110,94 @@ export const getIdcImplementTreeByGuid = data => req.post(`/data-tree/query-idc-
 export const getPlanningDesignTabs = () => req.get('/planning-designs/tabs')
 export const getResourcePlanningTabs = () => req.get('/resource-planning/tabs')
 export const getPlanningDesignsCiData = data =>
-  req.post(`/planning-designs/ci-data?code-id=${data.id}&idcs-guid=${data.idcGuid}`, data.queryObject)
+  req.post(
+    `/planning-designs/ci-data?code-id=${data.id}&idcs-guid=${data.idcGuid}`,
+    data.queryObject
+  )
 export const getResourcePlanningCiData = data =>
-  req.post(`/resource-planning/ci-data?code-id=${data.id}&idcs-guid=${data.idcGuid}`, data.queryObject)
+  req.post(
+    `/resource-planning/ci-data?code-id=${data.id}&idcs-guid=${data.idcGuid}`,
+    data.queryObject
+  )
 export const getAllZoneLinkGroupByIdc = () => req.get(`/all-zone-link`)
 export const getSystemDesigns = () => req.get('/system-designs')
 export const getSystems = () => req.get('/system')
 export const getAllDesignTreeFromSystemDesign = id =>
-  req.get(`/trees/all-design-trees/from-system-design?system-design-guid=${id}`)
+  req.get(
+    `/trees/all-design-trees/from-system-design?system-design-guid=${id}`
+  )
 export const saveAllDesignTreeFromSystemDesign = id =>
-  req.post(`/trees/all-design-trees/from-system-design/save?system-design-guid=${id}`)
+  req.post(
+    `/trees/all-design-trees/from-system-design/save?system-design-guid=${id}`
+  )
 export const getArchitectureDesignTabs = () => req.get('/architecture-designs/tabs')
 export const getArchitectureCiDatas = (tabId, sysId, payload) =>
-  req.post(`/architecture-designs/tabs/ci-data?code-id=${tabId}&system-design-guid=${sysId}`, payload)
-export const getApplicationFrameworkDesignDataTree = guid =>
-  req.get(`/data-tree/application-framework-design?system-design-guid=${guid}`)
+  req.post(
+    `/architecture-designs/tabs/ci-data?code-id=${tabId}&system-design-guid=${sysId}`,
+    payload
+  )
+export const getApplicationFrameworkDesignDataTree = guid => req.get(`/data-tree/application-framework-design?system-design-guid=${guid}`)
 export const getDeployCiData = (data, payload) =>
-  req.post(`/deploy-designs/tabs/ci-data?code-id=${data.codeId}&system-guid=${data.systemGuid}`, payload)
+  req.post(
+    `/deploy-designs/tabs/ci-data?code-id=${data.codeId}&system-guid=${data.systemGuid}`,
+    payload
+  )
 export const getDeployDesignTabs = () => req.get(`/deploy-designs/tabs`)
-export const previewDeployGraph = data => {
-  return req.post(`/process/definitions/preview`, data)
-}
+export const previewDeployGraph = data => req.post(`/process/definitions/preview`, data)
 export const getAllDeployTreesFromSystemCi = guid => req.get(`/trees/all-deploy-trees/from-system?system-guid=${guid}`)
-export const startProcessInstancesWithCiDataInbatch = data => {
-  return req.post(`/process/inbatch/instances`, data)
-}
+export const startProcessInstancesWithCiDataInbatch = data => req.post(`/process/inbatch/instances`, data)
 export const getApplicationDeploymentDataTree = guid => req.get(`/data-tree/application-deployment?system-guid=${guid}`)
 export const queryEnumCategories = data => req.post(`/enum/categories/query`, data)
 export const queryEnumCodes = (catTypeId, catId, data) =>
-  req.post(`/enum/category-types/${catTypeId}/categories/${catId}/codes/query`, data)
-
+  req.post(
+    `/enum/category-types/${catTypeId}/categories/${catId}/codes/query`,
+    data
+  )
 export const getTableStatus = () => req.get('/static-data/available-ci-type-table-status')
 
 // basic data page
-export const getAllSystemEnumCodes = data => {
-  return req.post(`/enum/system/codes`, data)
-}
+export const getAllSystemEnumCodes = data => req.post(`/enum/system/codes`, data)
 export const getSystemCategories = () => req.get(`/enum/system-categories`)
 
-export const getAllNonSystemEnumCodes = data => {
-  return req.post(`/enum/non-system/codes`, data)
-}
+export const getAllNonSystemEnumCodes = data => req.post(`/enum/non-system/codes`, data)
 export const getNonSystemCategories = () => req.get(`/enum/non-system-categories`)
 
 export const getEffectiveStatus = () => req.get(`/static-data/effective-status`)
 export const createEnumCode = data => {
-  return req.post(`/enum/category-types/0/categories/${data.catId}/codes/create`, data)
-}
-export const updateEnumCode = data => {
-  return req.post(`/enum/codes/update`, data)
+  return req.post(
+    `/enum/category-types/0/categories/${data.catId}/codes/create`,
+    data
+  )
 }
+export const updateEnumCode = data => req.post(`/enum/codes/update`, data)
 export const getGroupListByCodeId = id => req.get(`/enum/categories/${id}/group-list`)
-export const deleteEnumCodes = data => {
-  return req.post(`/enum/codes/delete`, data)
-}
-export const queryCiData = data => {
-  return req.post(`/ci-types/${data.id}/ci-data/query`, data.queryObject)
-}
+export const deleteEnumCodes = data => req.post(`/enum/codes/delete`, data)
+export const queryCiData = data => req.post(`/ci-types/${data.id}/ci-data/query`, data.queryObject)
 export const queryCiDataByType = data => {
-  return req.post(`/ci-types/${data.id}/ci-data/query-by-type`, data.queryObject)
-}
-export const getCiTypeAttributes = id => {
-  return req.get(`/ci-types/${id}/attributes`)
-}
-export const deleteCiDatas = data => {
-  return req.post(`/ci-types/${data.id}/ci-data/batch-delete`, data.deleteData)
-}
-export const createCiDatas = data => {
-  return req.post(`/ci-types/${data.id}/ci-data/batch-create`, data.createData)
-}
-export const updateCiDatas = data => {
-  return req.post(`/ci-types/${data.id}/ci-data/batch-update`, data.updateData)
+  return req.post(
+    `/ci-types/${data.id}/ci-data/query-by-type`,
+    data.queryObject
+  )
 }
+export const getCiTypeAttributes = id => req.get(`/ci-types/${id}/attributes`)
+export const deleteCiDatas = data => req.post(`/ci-types/${data.id}/ci-data/batch-delete`, data.deleteData)
+export const createCiDatas = data => req.post(`/ci-types/${data.id}/ci-data/batch-create`, data.createData)
+export const updateCiDatas = data => req.post(`/ci-types/${data.id}/ci-data/batch-update`, data.updateData)
 
 export const operateCiState = (ciTypeId, guid, op) => {
   const payload = [{ ciTypeId, guid }]
   return req.post(`/ci/state/operate?operation=${op}`, payload)
 }
 
 // ci integrate query
-export const getQueryNames = id => {
-  return req.get(`/intQuery/ciType/${id}/search`)
-}
-export const queryIntHeader = id => {
-  return req.get(`/intQuery/${id}/header`)
-}
-export const excuteIntQuery = (id, data) => {
-  return req.post(`/intQuery/${id}/execute`, data)
-}
-
-export const fetchIntQueryById = (ciTypeId, queryId) => {
-  return req.get(`/intQuery/ciType/${ciTypeId}/${queryId}`)
-}
-export const saveIntQuery = (ciTypeId, queryName, data) => {
-  return req.post(`/intQuery/ciType/${ciTypeId}/${queryName}/save`, data)
-}
-export const updateIntQuery = (queryId, data) => {
-  return req.post(`/intQuery/${queryId}/update`, data)
-}
-export const deleteIntQuery = (ciTypeId, queryId) => {
-  return req.post(`/intQuery/ciType/${ciTypeId}/${queryId}/delete`)
-}
+export const getQueryNames = id => req.get(`/intQuery/ciType/${id}/search`)
+export const queryIntHeader = id => req.get(`/intQuery/${id}/header`)
+export const excuteIntQuery = (id, data) => req.post(`/intQuery/${id}/execute`, data)
+
+export const fetchIntQueryById = (ciTypeId, queryId) => req.get(`/intQuery/ciType/${ciTypeId}/${queryId}`)
+export const saveIntQuery = (ciTypeId, queryName, data) => req.post(`/intQuery/ciType/${ciTypeId}/${queryName}/save`, data)
+export const updateIntQuery = (queryId, data) => req.post(`/intQuery/${queryId}/update`, data)
+export const deleteIntQuery = (ciTypeId, queryId) => req.post(`/intQuery/ciType/${ciTypeId}/${queryId}/delete`)
 // filterRules
 export const queryReferenceEnumCodes = data => req.post(`/referenceEnumCodes/${data.attrId}/query`, data.params)
 export const queryReferenceCiData = data => req.post(`/referenceCiData/${data.attrId}/query`, data.queryObject)

diff --git a/cmdb-ui/src/pages/designing/application-architecture.vue b/cmdb-ui/src/pages/designing/application-architecture.vue
@@ -539,7 +539,13 @@ export default {
       }
       if (links.statusCode === 'OK') {
         const found = links.data.find(_ => _.idcGuid === foundIdcGuid)
-        this.physicalGraphLinks = found ? found.linkList : []
+        this.physicalGraphLinks = found ? found.linkList.map(_ => {
+          return {
+            ..._,
+            from: _.data.network_zone_design_1,
+            to: _.data.network_zone_design_2
+          }
+        }) : []
       }
     },
     graphCallback () {

diff --git a/cmdb-ui/src/pages/designing/application-deployment.vue b/cmdb-ui/src/pages/designing/application-deployment.vue
@@ -284,9 +284,9 @@ export default {
         const node = this.systemLines[guid]
         if (this.graphNodes[node.from] && this.graphNodes[node.to]) {
           let color = '#000'
-          // if (!_.fixedDate) {
-          //   color = stateColor[node.state]
-          // }
+          if (!node.fixedDate) {
+            color = stateColor[node.state]
+          }
           result.push(
             `n_${node.from}->n_${node.to}`,
             `[id="gl_${node.id}",`,
@@ -417,7 +417,13 @@ export default {
         }
       }
       if (links.statusCode === 'OK') {
-        this.physicalGraphLinks = links.data || []
+        this.physicalGraphLinks = links.data.map(_ => {
+          return {
+            ..._,
+            from: _.data.network_zone_1,
+            to: _.data.network_zone_2
+          }
+        }) || []
       }
     },
     graphCallback () {

diff --git a/cmdb-ui/src/pages/designing/physical-graph.vue b/cmdb-ui/src/pages/designing/physical-graph.vue
@@ -126,7 +126,7 @@ export default {
     genLink () {
       let result = ''
       this.links.forEach(link => {
-        result += `g_${link.data.network_zone_design_1.guid}->g_${link.data.network_zone_design_2.guid}[arrowhead="none"];`
+        result += `g_${link.from.guid}->g_${link.to.guid}[arrowhead="none"];`
       })
       return result
     },