From 1b8a63a24d0b019e0146b28f02ef8be37fa89249 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E6=97=B6=E5=90=AF=E9=BE=99?= <shiqilong@beyondcent.com>
Date: Thu, 7 Nov 2024 12:50:30 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E5=8C=BA=E5=88=86=E6=95=B0=E6=8D=AE?=
 =?UTF-8?q?=E4=B8=AD=E5=BF=83?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 webs/cms-web/src/services/monitor/index.js    |  5 ++
 webs/cms-web/src/services/platform/index.js   |  8 +++
 .../src/views/compute/cloud/platform.vue      | 66 ++++++++++++++++---
 webs/cms-web/src/views/compute/vm.vue         | 50 +++++++++++---
 4 files changed, 112 insertions(+), 17 deletions(-)

diff --git a/webs/cms-web/src/services/monitor/index.js b/webs/cms-web/src/services/monitor/index.js
index 7632a9a..abe0264 100644
--- a/webs/cms-web/src/services/monitor/index.js
+++ b/webs/cms-web/src/services/monitor/index.js
@@ -151,6 +151,11 @@ export function getVms(params) {
     params: params
   })
 }
+export function getVmsByDc(params) {
+  return request.get('/cms/v1/vms/listByDataCenter', {
+    params: params
+  })
+}
 
 export function getDataStore(params) {
   return request.get('/cms/v1/datastores', {
diff --git a/webs/cms-web/src/services/platform/index.js b/webs/cms-web/src/services/platform/index.js
index dc9563e..1fca3f1 100644
--- a/webs/cms-web/src/services/platform/index.js
+++ b/webs/cms-web/src/services/platform/index.js
@@ -60,3 +60,11 @@ export function detailVolume(type, id) {
 export function getResourceList() {
   return request.get('/cms/v1/monitor/resourcetype', { params: { rows: 99, page: 1 } })
 }
+
+// 数据中心
+const dcUrl = 'cmp/v1/dcs'
+export function getDc(params) {
+  return request.get(dcUrl, {
+    params
+  })
+}
diff --git a/webs/cms-web/src/views/compute/cloud/platform.vue b/webs/cms-web/src/views/compute/cloud/platform.vue
index 98b299d..f606d5e 100644
--- a/webs/cms-web/src/views/compute/cloud/platform.vue
+++ b/webs/cms-web/src/views/compute/cloud/platform.vue
@@ -1,6 +1,20 @@
 <template>
-  <div>
+  <el-card>
     <el-row :gutter="10">
+      <el-row :gutter="10" class="m-b">
+        <!-- <el-col :span="5">
+          <el-input v-model="searchObj.name" placeholder="名称"></el-input>
+        </el-col> -->
+        <el-col :span="5">
+          <el-select v-model="searchObj.dcId" @change="handleSearch" placeholder="请选择数据中心" clearable>
+            <el-option v-for="item in dcList" :key="item.id" :value="item.id" :label="item.name"></el-option>
+          </el-select>
+        </el-col>
+        <el-col :span="6">
+          <el-button type="ghost" icon="el-icon-search" @click="handleSearch">搜索</el-button>
+          <el-button type="ghost" icon="el-icon-refresh" @click="handleReset">重置</el-button>
+        </el-col>
+      </el-row>
       <el-col :span="6" class="m-b" v-for="item in vendorData" :key="item.id">
         <el-card class="server_view">
           <div slot="header" class="clearfix">
@@ -391,15 +405,15 @@
         </el-row>
       </cb-form>
     </cb-dialog>
-  </div>
+  </el-card>
 </template>
 
 <script>
 import { platformStatusFilter } from '@/filters/index'
 import webSocket from '@cmp/cmp-common/mixins/getGlobalSocket'
-import { encrypt, decrypt } from '@cmp/cmp-element'
+import { encrypt, decrypt, handleSearchParam } from '@cmp/cmp-element'
 import { openMonitor, closeMonitor, getRatio, ratioOk, getAuthentications, authenticationsOk } from 'services/monitor'
-import { conditionCloudVendor } from 'services/platform/index'
+import { conditionCloudVendor, getDc } from 'services/platform/index'
 const FUSIONCLOUD = {
   btn: ['编辑', '删除', '同步', '设置'],
   value: [
@@ -424,9 +438,6 @@ export default {
       FUSIONCLOUD,
       HMC,
       vendorData: [],
-      search: {
-        name: ''
-      },
       params: {
         page: 1,
         rows: 10000
@@ -437,10 +448,22 @@ export default {
         timeout: 1800
       },
       opVisible: false,
-      opData: {}
+      opData: {},
+      dcList: [],
+      searchObj: {
+        name: '',
+        dcId: ''
+      }
     }
   },
   methods: {
+    getDc() {
+      getDc({ simple: true }).then((res) => {
+        if (res.success) {
+          this.dcList = res.data.rows
+        }
+      })
+    },
     // 跳转
     go(item) {
       if (!item.isAlarm) {
@@ -714,8 +737,34 @@ export default {
         this.getVendor()
       }
     },
+    handleSearch() {
+      this.getVendor()
+    },
+    handleReset() {
+      this.searchObj.name = ''
+      this.searchObj.dcId = ''
+      this.getVendor()
+    },
     getVendor() {
+      const params = JSON.parse(
+        handleSearchParam({
+          'name:LK': this.searchObj.name,
+          dcId: this.searchObj.dcId
+        })
+      )
+      // 转换参数格式
+      const convertedParams = []
+      params.forEach((item) => {
+        const paramKeys = Object.keys(item.param)
+        paramKeys.forEach((key) => {
+          convertedParams.push({
+            param: { [key]: item.param[key] },
+            sign: item.sign
+          })
+        })
+      })
       conditionCloudVendor({
+        params: JSON.stringify(convertedParams),
         condition: JSON.stringify({
           condition: 'listByTypes',
           types: ['KVM', 'OPENSTACK', 'VMWARE', 'FUSIONCLOUD', 'HMC', 'MANAGEONE', 'KUBERNETES', 'TIANYI', 'HUAWEI', 'CAS', 'ALIYUN', 'TCE', 'ABCSTACK', 'AWS', 'HCSO', 'EASYSTACK', 'HWACCESS', 'APSARASTACK', 'ZSTACK', 'CNWARE', 'KINGCLOUD', 'SMARTX', 'QCLOUD', 'CLOUDOS', 'CTSTACK']
@@ -856,6 +905,7 @@ export default {
   },
   created() {
     this.getVendor()
+    this.getDc()
   }
 }
 </script>
diff --git a/webs/cms-web/src/views/compute/vm.vue b/webs/cms-web/src/views/compute/vm.vue
index 306dbe8..16231b1 100644
--- a/webs/cms-web/src/views/compute/vm.vue
+++ b/webs/cms-web/src/views/compute/vm.vue
@@ -10,22 +10,27 @@
         </el-form-item>
         <el-form-item>
           <!-- <el-cascader placeholder="租户" v-model="listQuery.tenantId" :options="tenantList" clearable :props="{ emitPath: false, value: 'id', label: 'name', children: 'children' }"></el-cascader> -->
-          <el-select v-model="listQuery.tenantId" clearable placeholder="租户" filterable>
+          <el-select v-model="listQuery.tenantId" @change="handleSearch" clearable placeholder="租户" filterable>
             <el-option v-for="item in tenantList" :key="item.id" :value="item.id" :label="item.name"></el-option>
           </el-select>
         </el-form-item>
         <el-form-item>
-          <el-select v-model="listQuery.projectId" clearable placeholder="项目" filterable>
+          <el-select v-model="listQuery.projectId" @change="handleSearch" clearable placeholder="项目" filterable>
             <el-option v-for="item in projectList" :key="item.value" :value="item.id" :label="item.name"></el-option>
           </el-select>
         </el-form-item>
         <el-form-item>
-          <el-select v-model="listQuery.vendorId" clearable placeholder="平台" filterable>
+          <el-select v-model="listQuery.vendorId" @change="handleSearch" clearable placeholder="平台" filterable>
             <el-option v-for="item in platformData" :key="item.value" :value="item.id" :label="item.name"></el-option>
           </el-select>
         </el-form-item>
         <el-form-item>
-          <el-select v-model="listQuery.status" clearable placeholder="请选择状态">
+          <el-select v-model="listQuery.dcId" @change="handleSearch" placeholder="数据中心" clearable>
+            <el-option v-for="item in dcList" :key="item.id" :value="item.id" :label="item.name"></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item>
+          <el-select v-model="listQuery.status" @change="handleSearch" clearable placeholder="请选择状态">
             <el-option v-for="item in statusData" :key="item.value" :value="item.value" :label="item.name"></el-option>
           </el-select>
         </el-form-item>
@@ -165,10 +170,10 @@
 
 <script>
 import { vmStatusColorFilter, openstackServerFilter } from '@/filters/index'
-import { getVms, setIps, getRuleGroupBind } from 'services/monitor/index.js'
+import { getVmsByDc, setIps, getRuleGroupBind } from 'services/monitor/index.js'
 import { getTenant } from '@cmp/cmp-api/system/tenant'
 import { getProject } from '@cmp/cmp-api/system/project'
-import { conditionCloudVendor } from 'services/platform/index'
+import { conditionCloudVendor, getDc } from 'services/platform/index'
 import aliyunDetail from './cloud/aliyun/detail.vue'
 import ctstackDetail from './cloud/ctstack/detail.vue'
 import openstackDetail from './cloud/openstack/vm_detail.vue'
@@ -320,7 +325,8 @@ export default {
       ruleGroupIds: [],
       resourceType: '',
       activeTab: '1',
-      vmData
+      vmData,
+      dcList: []
     }
   },
   computed: {
@@ -336,7 +342,24 @@ export default {
     getList() {
       this.refreshId()
       this.loading = true
-      getVms(this.params).then((data) => {
+      const cloneParams = JSON.parse(this.params.params)
+      console.log(cloneParams)
+      // 转换参数格式
+      const convertedParams = []
+      cloneParams.forEach((item) => {
+        const paramKeys = Object.keys(item.param)
+        paramKeys.forEach((key) => {
+          convertedParams.push({
+            param: { [key]: item.param[key] },
+            sign: item.sign
+          })
+        })
+      })
+      const params = {
+        ...this.params,
+        params: JSON.stringify(convertedParams)
+      }
+      getVmsByDc(params).then((data) => {
         this.loading = false
         if (data.success) {
           this.list = data.data.rows
@@ -430,7 +453,8 @@ export default {
         tenantId: this.listQuery.tenantId || '',
         projectId: this.listQuery.projectId || '',
         vendorId: this.listQuery.vendorId || '',
-        status: this.listQuery.status || ''
+        status: this.listQuery.status || '',
+        dcId: this.listQuery.dcId || ''
       })
       this.getList()
     },
@@ -465,6 +489,13 @@ export default {
         }
       })
     },
+    getDc() {
+      getDc({ simple: true }).then((res) => {
+        if (res.success) {
+          this.dcList = res.data.rows
+        }
+      })
+    },
     getProject() {
       getProject({
         page: 1,
@@ -555,6 +586,7 @@ export default {
     this.getProject()
     this.getPlatformData()
     this.getQuotas()
+    this.getDc()
   }
 }
 </script>