From 9f948901dcd91cea1d3c1a0137f2149cf47779c7 Mon Sep 17 00:00:00 2001
From: chonglim <chonglim@isoftstone.com>
Date: Mon, 19 Feb 2024 14:22:50 +0800
Subject: [PATCH 06/10] =?UTF-8?q?=E9=85=8D=E7=BD=AE=E5=90=8C=E6=AD=A5?=
 =?UTF-8?q?=E6=80=A7=E8=83=BD=E4=BC=98=E5=8C=96=E9=9C=80=E6=B1=82=E5=89=8D?=
 =?UTF-8?q?=E7=AB=AF=E6=94=B9=E9=80=A0=E4=BB=A3=E7=A0=81=E6=8F=90=E4=BA=A4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/configuration.js                      |  35 ++-
 src/views/assests/HostGroupManagement.vue     |  16 +-
 .../TranscationDomainConfigurations.vue       |  28 +-
 .../configuration/TranscationDomainDetail.vue | 252 +++++-------------
 .../TranscationDomainManagement.vue           |   6 +-
 .../components/AddHostDrawer.vue              |  68 ++---
 .../components/AddTranscationDomainModal.vue  |  15 +-
 .../components/GetDomainStatusDrawer.vue      |  56 ++--
 .../components/QueryRealConfsDrawer.vue       |   4 +-
 9 files changed, 194 insertions(+), 286 deletions(-)

diff --git a/src/api/configuration.js b/src/api/configuration.js
index d8f8b73..0f9c5ef 100644
--- a/src/api/configuration.js
+++ b/src/api/configuration.js
@@ -10,8 +10,10 @@ const api = {
   addHost: '/host/addHost', // 添加业务域主机
   domainStatus: '/confs/getDomainStatus', // 获取业务域主机同步状态
   syncConf: '/confs/syncConf', // 获取业务域主机同步状态
+  batchSyncConf: '/confs/batch/syncConf', // 将当前业务域的配置批量同步到各主机
   queryRealConfs: '/confs/queryRealConfs', // 获取主机当前配置
-  queryExpectedConfs: '/confs/queryExpectedConfs' // 获取主机配置日志
+  queryExpectedConfs: '/confs/queryExpectedConfs', // 获取主机配置日志
+  queryHostAndStatus: '/manage/host/sync/status/get' // 获取业务域下的主机及其同步状态
 };
 
 export default api;
@@ -48,12 +50,13 @@ export function addHost(domainName, hostInfos, ...parameter) {
   });
 }
 // 获取业务域主机同步状态
-export function domainStatus({domainName, ...parameter}) {
+export function domainStatus(domainName, hostIp) {
   return request({
     url: api.domainStatus,
     method: 'post',
     data: {
-      domainName
+      domainName: domainName,
+      ip: hostIp
     }
   });
 }
@@ -100,7 +103,8 @@ export function syncConf(parameter) {
     data: {
       domainName: parameter.domainName,
       syncList: parameter.syncList
-    }
+    },
+    timeout: 900000
   });
 }
 // 获取主机当前配置
@@ -126,3 +130,26 @@ export function queryExpectedConfs(domainName, hostIds, ...parameter) {
     }
   });
 }
+
+// 获取业务域下的主机及其同步状态
+export function queryHostAndStatus(domainName) {
+  return request({
+    url: api.queryHostAndStatus,
+    method: 'post',
+    data: {
+      domain_name: domainName
+    }
+  });
+}
+
+// 将当前业务域的配置批量同步到各主机
+export function batchSyncConf(domainName, hostIds) {
+  return request({
+    url: api.batchSyncConf,
+    method: 'put',
+    data: {
+      domainName: domainName,
+      hostIds: hostIds
+    }
+  });
+}
diff --git a/src/views/assests/HostGroupManagement.vue b/src/views/assests/HostGroupManagement.vue
index 64d622f..e2c40c1 100644
--- a/src/views/assests/HostGroupManagement.vue
+++ b/src/views/assests/HostGroupManagement.vue
@@ -48,8 +48,7 @@
           @change="handleTableChange"
           :loading="tableIsLoading"
           :expandIconColumnIndex="0"
-          @expend="aleret(1)"
-        >
+          @expend="aleret(1)">
           <span slot="action" slot-scope="record">
             <!------后续增加-----
             <span>编辑</span>
@@ -66,15 +65,13 @@
           placement="right"
           :visible="hostListVisible"
           :body-style="{paddingBottom: '80px'}"
-          @close="closeHostList"
-        >
+          @close="closeHostList">
           <a-table
             :rowKey="hostRowKey"
             :columns="hostListColumns"
             :data-source="this.hostListDataStore[this.hostGroupName] || []"
             :loading="hostListIsLoading ? true : false"
-            :pagination="false"
-          >
+            :pagination="false">
             <span slot="isManagement" slot-scope="isMana">{{ isMana ? '是' : '否' }}</span>
           </a-table>
         </a-drawer>
@@ -112,7 +109,7 @@ const hostListColumns = [
   {
     dataIndex: 'ssh_port',
     key: 'ssh_port',
-    title: 'SSH登录接口'
+    title: 'SSH登录端口'
   },
   {
     dataIndex: 'management',
@@ -404,6 +401,11 @@ export default {
 </script>
 
 <style lang="less" scoped>
+.aops-theme {
+  .hostgroupbox {
+    overflow: auto;
+  }
+}
 .ant-lert {
   line-height: 14px;
 }
diff --git a/src/views/configuration/TranscationDomainConfigurations.vue b/src/views/configuration/TranscationDomainConfigurations.vue
index 68a3a48..b5a8469 100644
--- a/src/views/configuration/TranscationDomainConfigurations.vue
+++ b/src/views/configuration/TranscationDomainConfigurations.vue
@@ -37,27 +37,25 @@
           :pagination="pagination"
           :row-selection="rowSelection"
           @change="handleTableChange"
-          :loading="tableIsLoading"
-        >
+          :loading="tableIsLoading">
           <span slot="contents" slot-scope="record">
             <div class="oneRow">{{ record.contents }}</div>
           </span>
           <span slot="action" slot-scope="record">
-            <a @click="showConfigContent(record)">查看配置文件</a>
+            <a @click="showConfigContent(record)">查看详情</a>
             <a-divider type="vertical" />
-            <a @click="showConfigChange(record)">配置变更日志</a>
-            <a-divider type="vertical" />
-            <a @click="showEditDrawer(record)">编辑配置</a>
+            <a @click="showEditDrawer(record)">编辑</a>
             <a-divider type="vertical" />
             <a-popconfirm
-              title="你确定删除这行配置吗?"
+              title="您确定删除该行配置吗?"
               ok-text="确认"
               cancel-text="取消"
-              @confirm="deleteConfig(record)"
-            >
+              @confirm="deleteConfig(record)">
               <a-icon slot="icon" type="close-circle" style="color: red" />
               <a>删除</a>
             </a-popconfirm>
+            <a-divider type="vertical" />
+            <a @click="showConfigChange(record)">变更日志</a>
           </span>
         </a-table>
         <a-drawer
@@ -66,8 +64,7 @@
           placement="right"
           :visible="configContentVisible"
           :body-style="{paddingBottom: '80px'}"
-          @close="closeConfigContent"
-        >
+          @close="closeConfigContent">
           <a-descriptions :column="1" layout="horizontal">
             <a-descriptions-item label="配置文件">
               {{ configContent.filePath }}
@@ -87,8 +84,7 @@
           placement="right"
           :visible="configChangeVisible"
           :body-style="{paddingBottom: '80px'}"
-          @close="closeConfigChange"
-        >
+          @close="closeConfigChange">
           <a-spin :spinning="logIsLoading">
             <a-descriptions :column="1" layout="horizontal">
               <a-descriptions-item label="所属业务域">
@@ -112,8 +108,7 @@
                   :expandIconColumnIndex="4"
                   :expandIcon="(props) => this.customExpandIcon(props)"
                   :pagination="false"
-                  bordered
-                >
+                  bordered>
                   <div slot="expandedRowRender" slot-scope="record" style="margin: 0">
                     <p>preValue:</p>
                     {{ record.preValue }}
@@ -134,8 +129,7 @@
       :domainName="domainName"
       :editFilePath="editFilePath"
       @ok="onEditConfsOk"
-      @cancel="onEditConfsCancel"
-    />
+      @cancel="onEditConfsCancel" />
   </page-header-wrapper>
 </template>
 
diff --git a/src/views/configuration/TranscationDomainDetail.vue b/src/views/configuration/TranscationDomainDetail.vue
index 1136c08..e460ad2 100644
--- a/src/views/configuration/TranscationDomainDetail.vue
+++ b/src/views/configuration/TranscationDomainDetail.vue
@@ -28,25 +28,6 @@
               <a-col>
                 <a-button @click="handleRefresh"> <a-icon type="redo" />刷新 </a-button>
               </a-col>
-              <!--------暂时没有其他功能--------
-              <a-col>
-                <a-button>
-                  <a-dropdown>
-                    <a class="ant-dropdown-link" @click="e => e.preventDefault()">
-                      更多操作 <a-icon type="down" />
-                    </a>
-                    <a-menu slot="overlay">
-                      <a-menu-item>
-                        <a>查看主机</a>
-                      </a-menu-item>
-                      <a-menu-item>
-                        <a>添加主机</a>
-                      </a-menu-item>
-                    </a-menu>
-                  </a-dropdown>
-                </a-button>
-              </a-col>
-              -------------------------------->
             </a-row>
           </a-col>
         </a-row>
@@ -56,68 +37,18 @@
           :data-source="tableData"
           :row-selection="rowSelection"
           :loading="tableIsLoading"
-          :pagination="false"
-        >
-          <!------------暂不做同步---------------
-          <span slot="filterIcon">
-            同步状态
-            <a-icon type="reload" @click="refreshDomainStatus()"/>
-          </span>
-          ------------------------------------->
-          <template slot="syncStatus" slot-scope="statusInfo">
-            <div v-if="domainStatusIsLoading">
-              <a-icon type="loading" />
-            </div>
-            <div v-else>
-              <a-icon
-                v-if="statusInfo.syncStatus === statusEnum.sync"
-                type="check-circle"
-                theme="twoTone"
-                two-tone-color="#52c41a"
-              />
-              <a-icon
-                v-if="statusInfo.syncStatus === statusEnum.notSync"
-                type="close-circle"
-                theme="twoTone"
-                two-tone-color="#f00"
-              />
-              <a-icon
-                v-if="statusInfo.syncStatus === statusEnum.notFound"
-                type="question-circle"
-                theme="twoTone"
-                two-tone-color="#ccc"
-              />
-              {{ statusTitleEnum[statusInfo.syncStatus] }}
-              <span v-if="statusInfo.syncStatus === statusEnum.notSync">{{ `${statusInfo.count}条` }}</span>
-            </div>
-          </template>
+          :pagination="false">
           <span slot="action" slot-scope="record">
             <a @click="showQueryRealConfsDrawer(record)">当前配置</a>
             <a-divider type="vertical" />
-            <!---- 只是没有这个功能---------
-            <a @click="showQueryExpectConfsDrawer(record)">配置日志</a>
-            <a-divider type="vertical" />
-            ----------------------------->
             <a @click="showDomainStatusDrawer(record)">状态详情</a>
             <a-divider type="vertical" />
-            <!-----------暂时不做同步功能----------
-            <a-popconfirm
-              title="你确定要将当前业务域的配置同步到这台主机吗?"
-              ok-text="确认"
-              cancel-text="取消"
-              @confirm="handleOneHostSyncConf(record)"
-            >
-              <a href="#">同步</a>
-            </a-popconfirm>
-            <a-divider type="vertical" />
-            ------------------------------------->
             <a-popconfirm
-              title="你确定要从当前业务域中删除这台主机吗?"
+              title="您确定要从当前业务域中删除这台主机吗?"
               ok-text="确认"
               cancel-text="取消"
-              @confirm="deleteDomainHost(record)"
-            >
-              <a>删除</a>
+              @confirm="deleteDomainHost(record)">
+                <a>删除</a>
             </a-popconfirm>
           </span>
         </a-table>
@@ -140,15 +71,11 @@
       title="状态详情"
       ref="domainStatusDrawer"
       :hasButtonOnBottom="false"
-      :bodyStyle="{paddingBottom: '80px'}"
-    >
+      :bodyStyle="{paddingBottom: '80px'}">
       <template slot="drawerView">
         <get-domain-status-drawer
-          :tableData="tableData"
           :domainStatusIsLoading="domainStatusIsLoading"
-          :domainName="domainName"
-          @getDomainStatus="getDomainStatus"
-        />
+          :domainName="domainName"/>
       </template>
     </drawer-view>
   </my-page-header-wrapper>
@@ -157,7 +84,7 @@
 <script>
 import MyPageHeaderWrapper from '@/views/utils/MyPageHeaderWrapper';
 
-import {domainHostList, deleteHost, domainStatus, syncConf} from '@/api/configuration';
+import {deleteHost, queryHostAndStatus, batchSyncConf} from '@/api/configuration';
 import {getManagementConf} from '@/api/management';
 
 import DrawerView from '@/views/utils/DrawerView';
@@ -167,12 +94,11 @@ import GetDomainStatusDrawer from '@/views/configuration/components/GetDomainSta
 import AddHostDrawer from '@/views/configuration/components/AddHostDrawer';
 
 import defaultSettings from '@/config/defaultSettings';
-import {STATUS_ENUM, getStatusInfoFromAllConfs} from './utils/statusCheckTools';
 
 const STATUS_TITLE_ENUM = {};
-STATUS_TITLE_ENUM[STATUS_ENUM.sync] = '已同步';
-STATUS_TITLE_ENUM[STATUS_ENUM.notSync] = '未同步';
-STATUS_TITLE_ENUM[STATUS_ENUM.notFound] = '未知状态';
+STATUS_TITLE_ENUM[0] = '未同步';
+STATUS_TITLE_ENUM[1] = '已同步';
+STATUS_TITLE_ENUM[2] = '未知状态';
 
 export default {
   name: 'TranscationDomainDetail',
@@ -186,17 +112,13 @@ export default {
   },
   data() {
     return {
-      rowKey: 'hostId',
+      rowKey: 'host_id',
       hostList: [],
-      statusData: [],
       selectedRowKeys: [],
       selectedRows: [],
       tableIsLoading: false,
       domainName: this.$route.params.domainName,
-      statusEnum: STATUS_ENUM,
-      statusTitleEnum: STATUS_TITLE_ENUM,
       domainStatusIsLoading: false,
-      hostStatusData: {a: 1},
       confsOfDomain: [],
       confsOfDomainLoading: false,
       setTimeoutKey_statusInterval: undefined
@@ -206,24 +128,19 @@ export default {
     columns() {
       return [
         {
-          dataIndex: 'ip',
-          key: 'ip',
+          dataIndex: 'host_ip',
+          key: 'host_ip',
           title: 'IP地址'
         },
         {
-          dataIndex: 'ipv6',
-          key: 'ipv6',
+          dataIndex: 'ipv4',
+          key: 'ipv4',
           title: 'IP协议'
         },
         {
-          dataIndex: 'syncStatusInfo',
-          key: 'syncStatusInfo',
-          title: '同步状态',
-          filterMultiple: false,
-          slots: {
-            // title: 'filterIcon' 暂不做同步
-          },
-          scopedSlots: {customRender: 'syncStatus'}
+          dataIndex: 'sync_status',
+          key: 'sync_status',
+          title: '同步状态'
         },
         {
           key: 'operation',
@@ -240,11 +157,9 @@ export default {
     },
     tableData() {
       return this.hostList.map((host) => {
-        const hostTemp = host;
-        const matchedStatusHost = this.statusData.filter((item) => item.hostId === hostTemp.hostId)[0] || {};
-        hostTemp.syncStatusList = matchedStatusHost.syncStatus || [];
-        hostTemp.syncStatusInfo = getStatusInfoFromAllConfs(hostTemp.syncStatusList);
-        return hostTemp;
+        host.ipv4 = 'ipv4'
+        host.sync_status = STATUS_TITLE_ENUM[host.sync_status]
+        return host;
       });
     }
   },
@@ -253,46 +168,22 @@ export default {
       this.selectedRowKeys = selectedRowKeys;
       this.selectedRows = selectedRows;
     },
-    // 获取业务域列表数据
-    getHostList(domainName) {
+    queryHostAndStatus(domainName) {
       const _this = this;
-      return new Promise(function (resolve, reject) {
-        _this.tableIsLoading = true;
-        domainHostList(domainName)
-          .then(function (res) {
-            _this.hostList = res;
-            resolve(res);
-          })
-          .catch(function (err) {
-            if (err.response.data.code !== 400) {
-              _this.$message.error(err.response.message || err.response.data.detail);
-            } else {
-              _this.hostList = [];
-            }
-            reject(err);
-          })
-          .finally(function () {
-            _this.tableIsLoading = false;
-          });
-      });
-    },
-    // 获取业务域主机同步状态
-    getDomainStatus() {
-      const _this = this;
-      this.domainStatusIsLoading = true;
-      domainStatus({
-        domainName: _this.domainName
-      })
+      _this.tableIsLoading = true;
+      queryHostAndStatus(domainName)
         .then(function (res) {
-          _this.statusData = res.hostStatus || [];
+          _this.hostList = res.data || [];
         })
         .catch(function (err) {
-          if (err.response.code !== '404') {
+          if (err.response.data.code !== 400) {
             _this.$message.error(err.response.message || err.response.data.detail);
+          } else {
+            _this.hostList = [];
           }
         })
         .finally(function () {
-          _this.domainStatusIsLoading = false;
+          _this.tableIsLoading = false;
         });
     },
     handleRefresh() {
@@ -314,36 +205,38 @@ export default {
         content: () =>
           selectedRows.map((row) => (
             <p>
-              <span>{row.ip}</span>
+              <span>{row.host_ip}</span>
             </p>
           )),
         icon: () => <a-icon type="exclamation-circle" />,
         okType: 'danger',
         okText: '删除',
         onOk: function () {
-          return _this.handleDelete(selectedRows, true);
+          return _this.handleDelete(selectedRows);
         },
         onCancel() {}
       });
     },
-    handleDelete(hostInfos, isBash) {
+    handleDelete(hostInfos) {
       const _this = this;
       return new Promise((resolve, reject) => {
+        hostInfos.map((hostInfo) => {
+          hostInfo.hostId = hostInfo.host_id;
+          return hostInfo;
+        });
         deleteHost({
           domainName: _this.domainName,
           hostInfos: hostInfos
         })
           .then((res) => {
-            _this.$message.success(res.message);
+            _this.$message.success(res.msg);
             _this.getHostAndStatus();
-            if (isBash) {
-              _this.selectedRowKeys = [];
-              _this.selectedRows = [];
-            }
+            _this.selectedRowKeys = [];
+            _this.selectedRows = [];
             resolve();
           })
           .catch((err) => {
-            _this.$message.error(err.response.nsg);
+            _this.$message.error(err.response.message || err.response.data.detail || err.message);
             reject(err);
           });
       });
@@ -353,49 +246,31 @@ export default {
       this.$confirm({
         title: (
           <div>
-            <p>你确定要将当前业务域的配置同步到已选主机吗？</p>
+            <p>您确定要将当前业务域的配置同步到已选主机吗？</p>
           </div>
         ),
-        content: <span>同步后将配置无法恢复，但可从配置日志中查看记录,你还要继续吗?</span>,
+        content: <span>同步后将配置无法恢复，但可从配置日志中查看记录,您还要继续吗?</span>,
         icon: () => <a-icon type="exclamation-circle" />,
         okType: 'danger',
         okText: '继续同步',
         onOk: function () {
-          return _this.handleSyncConf(selectedRows, true);
+          return _this.handleSyncConf(selectedRows);
         },
         onCancel() {}
       });
     },
-    handleOneHostSyncConf(record) {
-      const rows = [];
-      rows.push(record);
-      this.handleSyncConf(rows, true);
-    },
-    handleSyncConf(selectedRows, isBash) {
-      const syncList = [];
+    handleSyncConf(selectedRows) {
+      const hostIds = [];
       selectedRows.forEach(function (item) {
-        const syncConfigs = [];
-        item.syncStatusList.forEach((val) => {
-          if (val.isSynced === 'NOT SYNCHRONIZE') {
-            syncConfigs.push(val.file_path);
-          }
-        });
-        const host = {
-          hostId: item.hostId,
-          syncConfigs: syncConfigs
-        };
-        syncList.push(host);
+        hostIds.push(item.host_id);
       });
       const _this = this;
       return new Promise((resolve, reject) => {
-        syncConf({
-          domainName: _this.domainName,
-          syncList: syncList
-        })
+        batchSyncConf(_this.domainName, hostIds)
           .then((res) => {
             let msg = '';
             for (const item of res) {
-              const hostId = item.hostId;
+              const hostId = item.host_id;
               let success = '';
               let fail = '';
               const syncResult = item.syncResult;
@@ -422,10 +297,8 @@ export default {
               _this.$message.success(msg);
             }
             _this.getHostAndStatus();
-            if (isBash) {
-              _this.selectedRowKeys = [];
-              _this.selectedRows = [];
-            }
+            _this.selectedRowKeys = [];
+            _this.selectedRows = [];
             resolve();
           })
           .catch((err) => {
@@ -438,14 +311,13 @@ export default {
       this.$refs.addHostDrawer.open(this.domainName);
     },
     showQueryRealConfsDrawer(host) {
+      host.hostId = host.host_id
+      host.ip = host.host_ip
       this.$refs.queryRealConfsDrawer.open({
         host,
         domainName: this.domainName
       });
     },
-    showQueryExpectConfsDrawer(record) {
-      this.$refs.queryExpectConfsDrawer.open(record);
-    },
     showDomainStatusDrawer(record) {
       this.$refs.domainStatusDrawer.open(record);
     },
@@ -470,18 +342,28 @@ export default {
     },
     getHostAndStatus() {
       const _this = this;
-      this.getHostList(this.domainName)
-        .then(function () {
-          _this.getDomainStatus();
+      const domainName = this.domainName;
+      _this.tableIsLoading = true;
+      queryHostAndStatus(domainName)
+        .then(function (res) {
+          _this.hostList = res.data || [];
           // 启动循环更新Status
           clearInterval(_this.setTimeoutKey_statusInterval);
           _this.setTimeoutKey_statusInterval = setInterval(function () {
-            _this.getDomainStatus();
+            _this.queryHostAndStatus(domainName);
           }, defaultSettings.domainStatusRefreshInterval);
         })
-        .catch(function () {
+        .catch(function (err) {
+          if (err.response.data.code !== 400) {
+            _this.$message.error(err.response.message || err.response.data.detail);
+          } else {
+            _this.hostList = [];
+          }
           // 获取host出错（为空或报错，则清除轮训）
           clearInterval(_this.setTimeoutKey_statusInterval);
+        })
+        .finally(function () {
+          _this.tableIsLoading = false;
         });
     }
   },
diff --git a/src/views/configuration/TranscationDomainManagement.vue b/src/views/configuration/TranscationDomainManagement.vue
index a3eb997..db51c0c 100644
--- a/src/views/configuration/TranscationDomainManagement.vue
+++ b/src/views/configuration/TranscationDomainManagement.vue
@@ -150,7 +150,7 @@ export default {
       this.$confirm({
         title: (
           <div>
-            <p>你确定要删除这个业务域吗？</p>
+            <p>您确定要删除这个业务域吗？</p>
           </div>
         ),
         content: <span>删除后业务域无法恢复</span>,
@@ -172,12 +172,12 @@ export default {
           domainNameArray
         })
           .then((res) => {
-            _this.$message.success(res.message);
+            _this.$message.success(res.msg);
             _this.getDomainList();
             resolve();
           })
           .catch((err) => {
-            _this.$message.error(err.response.message);
+            _this.$message.error(err.response.message || err.message);
             reject(err);
           });
       });
diff --git a/src/views/configuration/components/AddHostDrawer.vue b/src/views/configuration/components/AddHostDrawer.vue
index f702809..9981acc 100644
--- a/src/views/configuration/components/AddHostDrawer.vue
+++ b/src/views/configuration/components/AddHostDrawer.vue
@@ -1,45 +1,27 @@
 <!-- eslint-disable vue/max-attributes-per-line -->
 <template>
-  <a-form
-    :form="form"
-    :label-col="{span: 5}"
-    :wrapper-col="{span: 12}"
-    :confirm-loading="isLoading"
-    @submit="handleSubmit"
-  >
-    <a-form-item label="归属业务域">
-      <a-input
-        :disabled="true"
-        v-decorator="['domainName', {rules: [{required: true, message: '请填写归属业务域!'}]}]"
-      />
+  <a-form :form="form" :confirm-loading="isLoading" @submit="handleSubmit">
+    <a-form-item label="归属业务域" :label-col="{span: 4}" :wrapper-col="{span: 12}">
+      <a-input :disabled="true" v-decorator="['domainName', {rules: [{required: true, message: '请填写归属业务域!'}]}]" />
     </a-form-item>
-    <a-form-item label="选择要添加的主机"> </a-form-item>
+    <a-form-item label="选择要添加的主机:"> </a-form-item>
     <div>
-      <a-transfer
-        :rowKey="(host) => host.host_id"
-        :data-source="hostListTransfer"
-        :target-keys="targetKeys"
-        :show-search="showSearch"
-        :filter-option="(inputValue, item) => item.host_name.indexOf(inputValue) !== -1"
-        :show-select-all="false"
-        @change="onChange"
-      >
-        <template
-          slot="children"
-          slot-scope="{
+      <a-transfer :rowKey="(host) => host.host_id"
+                  :data-source="hostListTransfer"
+                  :target-keys="targetKeys"
+                  :show-search="showSearch"
+                  :filter-option="(inputValue, item) => item.host_name.indexOf(inputValue) !== -1 || item.host_ip.indexOf(inputValue) !== -1"
+                  :show-select-all="false" @change="onChange">
+        <template slot="children" slot-scope="{
             props: {direction, filteredItems, selectedKeys, disabled: listDisabled},
             on: {itemSelectAll, itemSelect}
-          }"
-        >
-          <a-table
-            :row-key="rowKey"
-            :row-selection="getRowSelection({disabled: listDisabled, selectedKeys, itemSelectAll, itemSelect})"
-            :columns="direction === 'left' ? leftColumns : rightColumns"
-            :data-source="filteredItems"
-            size="small"
-            :style="{pointerEvents: listDisabled ? 'none' : null}"
-            :custom-row="
-              ({key, disabled: itemDisabled}) => ({
+          }">
+          <a-table :row-key="rowKey"
+                   :row-selection="getRowSelection({disabled: listDisabled, selectedKeys, itemSelectAll, itemSelect})"
+                   :columns="direction === 'left' ? leftColumns : rightColumns"
+                   :data-source="filteredItems" size="small"
+                   :style="{pointerEvents: listDisabled ? 'none' : null}"
+                   :custom-row="({key, disabled: itemDisabled}) => ({
                 on: {
                   click: () => {
                     if (itemDisabled || listDisabled) return;
@@ -47,8 +29,7 @@
                   }
                 }
               })
-            "
-          />
+            " />
         </template>
       </a-transfer>
     </div>
@@ -144,7 +125,7 @@ export default {
         })
         .catch(function (err) {
           // code == 400时，为域内未添加主机，不报错
-          if (err.response.code !== '400') {
+          if (err.response.code !== '400' && err.response.code !== undefined) {
             _this.$message.error(err.response.message || err.response.data.detail);
           }
         })
@@ -178,13 +159,13 @@ export default {
           });
           addHost(values.domainName, hostInfos)
             .then(function (res) {
-              _this.$message.success(res.message);
+              _this.$message.success(res.msg);
               _this.form.resetFields();
               _this.close();
               _this.$emit('addHostSuccess');
             })
             .catch(function (err) {
-              _this.$message.error(err.response.message);
+              _this.$message.error(err.response.message || err.message);
             })
             .finally(function () {
               _this.isLoading = false;
@@ -229,3 +210,8 @@ export default {
   }
 };
 </script>
+<style>
+.ant-form-item-label {
+  text-align: left;
+}
+</style>
diff --git a/src/views/configuration/components/AddTranscationDomainModal.vue b/src/views/configuration/components/AddTranscationDomainModal.vue
index f19557c..2f29133 100644
--- a/src/views/configuration/components/AddTranscationDomainModal.vue
+++ b/src/views/configuration/components/AddTranscationDomainModal.vue
@@ -1,7 +1,12 @@
 <template>
   <div class="aops-add-domain" @click="showModal">
     <a-icon type="plus" />
-    <a-modal title="创建业务域" :visible="visible" :confirm-loading="isLoading" @ok="handleOk" @cancel="handleCancel">
+    <a-modal
+      title="创建业务域"
+      :visible="visible"
+      :confirm-loading="isLoading"
+      @ok="handleOk"
+      @cancel="handleCancel">
       <a-form :form="form" :label-col="{span: 5}" :wrapper-col="{span: 16}">
         <a-form-item label="业务域名称">
           <a-input
@@ -10,16 +15,14 @@
             v-decorator="[
               'domainName',
               {rules: [{required: true, message: '请输入业务域名称'}, {validator: checkDomainName}]}
-            ]"
-          >
+            ]">
           </a-input>
         </a-form-item>
         <a-form-item label="优先级">
           <a-input
             :disabled="true"
             placeholder="未开放设置"
-            v-decorator="['priority', {rules: [{required: false, message: '请输入优先级'}]}]"
-          >
+            v-decorator="['priority', {rules: [{required: false, message: '请输入优先级'}]}]">
           </a-input>
         </a-form-item>
       </a-form>
@@ -63,7 +66,7 @@ export default {
           domainInfo.push(values);
           createDomain(domainInfo)
             .then(function (res) {
-              _this.$message.success(res.message);
+              _this.$message.success(res.msg);
               _this.onSuccess && _this.onSuccess();
               _this.visible = false;
               _this.form.resetFields();
diff --git a/src/views/configuration/components/GetDomainStatusDrawer.vue b/src/views/configuration/components/GetDomainStatusDrawer.vue
index 39383e8..88a5aa3 100644
--- a/src/views/configuration/components/GetDomainStatusDrawer.vue
+++ b/src/views/configuration/components/GetDomainStatusDrawer.vue
@@ -3,12 +3,12 @@
     <a-row type="flex" justify="space-between">
       <a-col :span="22">
         <div style="float: left; margin-bottom: 10px">
-          <span>主机：{{ host.hostId }}</span>
-          <span class="ip-left">{{ host.ip }}</span>
+          <span>主机：{{ host.host_id }}</span>
+          <span class="ip-left">{{ host.host_ip }}</span>
         </div>
         <div style="float: right; margin-bottom: 10px">
           <a-popconfirm
-            title="你确定要将当前业务域的配置同步到这台主机吗?"
+            title="您确定要将当前业务域的配置同步到这台主机吗?"
             ok-text="确认"
             cancel-text="取消"
             @confirm="confirm"
@@ -54,12 +54,11 @@
           </span>
           <span slot="action" slot-scope="record">
             <a-popconfirm
-              title="你确定要同步该配置到这台主机吗?"
+              title="您确定要同步该配置到这台主机吗?"
               ok-text="确认"
               cancel-text="取消"
               @confirm="syncConfigConfirm(record)"
-              :disabled="record.isSynced !== 'NOT SYNCHRONIZE'"
-            >
+              :disabled="record.isSynced !== 'NOT SYNCHRONIZE'">
               <a-button type="link" :disabled="record.isSynced !== 'NOT SYNCHRONIZE'">同步</a-button>
             </a-popconfirm>
           </span>
@@ -71,7 +70,7 @@
 
 <script>
 import {STATUS_ENUM} from '../utils/statusCheckTools';
-import {syncConf} from '@/api/configuration';
+import {domainStatus, syncConf} from '@/api/configuration';
 
 const STATUS_TITLE_ENUM = {};
 STATUS_TITLE_ENUM[STATUS_ENUM.sync] = '已同步';
@@ -102,16 +101,11 @@ export default {
         }
       ],
       statusEnum: STATUS_ENUM,
-      statusTitleEnum: STATUS_TITLE_ENUM
+      statusTitleEnum: STATUS_TITLE_ENUM,
+      statusData: []
     };
   },
   props: {
-    tableData: {
-      type: Array,
-      default: () => {
-        return [];
-      }
-    },
     domainStatusIsLoading: {
       type: Boolean,
       default: false
@@ -123,8 +117,7 @@ export default {
   },
   computed: {
     syncStatusList() {
-      const matchedHost = this.tableData.filter((hostInfo) => hostInfo.hostId === this.host.hostId)[0] || {};
-      return matchedHost.syncStatusList || [];
+      return this.statusData;
     }
   },
   methods: {
@@ -141,11 +134,15 @@ export default {
     cancel(e) {},
     syncConf(syncConfigs) {
       const _this = this;
+      if (syncConfigs.length === 0) {
+        _this.$message.error('没有需要同步的配置文件，无需同步！');
+        return;
+      }
       syncConf({
         domainName: this.domainName,
         syncList: [
           {
-            hostId: this.host.hostId,
+            hostId: this.host.host_id,
             syncConfigs: syncConfigs
           }
         ]
@@ -153,7 +150,7 @@ export default {
         .then((res) => {
           let message = '';
           for (const item of res) {
-            const hostId = item.hostId;
+            const hostId = item.host_id;
             let success = '';
             let fail = '';
             const syncResult = item.syncResult;
@@ -169,8 +166,7 @@ export default {
             } else if (success.length !== 0 && fail.length === 0) {
               message += '主机' + hostId + '\xa0\xa0\xa0' + '同步成功：' + success;
             } else if (success.length !== 0 && fail.length !== 0) {
-              message +=
-                '主机' + hostId + '\xa0\xa0\xa0' + '同步成功：' + success + '\xa0\xa0\xa0' + '同步失败：' + fail;
+              message += '主机' + hostId + '\xa0\xa0\xa0' + '同步成功：' + success + '\xa0\xa0\xa0' + '同步失败：' + fail;
             }
           }
           if (message.includes('同步失败') && message.includes('同步成功')) {
@@ -180,7 +176,7 @@ export default {
           } else {
             _this.$message.success(message);
           }
-          _this.$emit('getDomainStatus');
+          _this.getDomainStatus(this.host.host_ip);
         })
         .catch((err) => {
           _this.$message.error(err.response.message || err.response.data.detail || err.response.data.msg);
@@ -190,6 +186,23 @@ export default {
       const syncConfigs = [];
       syncConfigs.push(record.file_path);
       this.syncConf(syncConfigs);
+    },
+    // 获取业务域主机同步状态
+    getDomainStatus(hostIp) {
+      const _this = this;
+      this.domainStatusIsLoading = true;
+      domainStatus(_this.domainName, hostIp)
+        .then(function (res) {
+          _this.statusData = res.hostStatus[0].syncStatus || [];
+        })
+        .catch(function (err) {
+          if (err.response.code !== '404' && err.code !== 'ERR_BAD_REQUEST') {
+            _this.$message.error(err.response.message || err.response.data.detail || err.message);
+          }
+        })
+        .finally(function () {
+          _this.domainStatusIsLoading = false;
+        });
     }
   },
   mounted: function () {
@@ -197,6 +210,7 @@ export default {
     this.onload(function (host) {
       _this.host = host;
     });
+    this.getDomainStatus(_this.host.host_ip);
   }
 };
 </script>
diff --git a/src/views/configuration/components/QueryRealConfsDrawer.vue b/src/views/configuration/components/QueryRealConfsDrawer.vue
index 61a91f8..9f9bea2 100644
--- a/src/views/configuration/components/QueryRealConfsDrawer.vue
+++ b/src/views/configuration/components/QueryRealConfsDrawer.vue
@@ -139,8 +139,8 @@ export default {
           _this.confsOfHost = (res && res[0] && res[0].confBaseInfos) || [];
         })
         .catch((err) => {
-          if (err.response.code !== '400') {
-            _this.$message.error(err.response.message);
+          if (err.response.code !== '400' && err.code !== 'ERR_BAD_REQUEST') {
+            _this.$message.error(err.response.message || err.response.data.detail || err.message);
           }
         })
         .finally(() => {
-- 
2.38.1.windows.1