gb18186

ZZJ

2022-07-27 0daac085e308ab5dd5557048bbcb28473ae1b7df

gb18186

 src/Pool/TreeData.ts

@@ -67,6 +67,8 @@
  public baseImageLoading: boolean

  public activeNode: string
  public clusterId: string
  public devId: string


  constructor() {
@@ -108,6 +110,8 @@
    this.gb28181CameraBaseImage = ""
    this.baseImageLoading = false
    this.activeNode = ''
    this.clusterId = ''
    this.devId = ''


  }
@@ -447,7 +451,7 @@
  }

  async refreshGB28181() {
    await refreshGB28181Tree()
    await refreshGB28181Tree({})
    // this.fetchGbTree()
  }

@@ -485,7 +489,10 @@
    if (update) {
      fn = refreshGB28181Tree
    }
    const rsp: any = await fn()
    const rsp: any = await fn({
      clusterId:this.clusterId,
      devId:this.devId,
    })

    if (rsp && rsp.success) {
      this.selectedNode = {}
@@ -541,7 +548,11 @@
    this.cameraNameForBaseImage = node.name

    try {
      const rsp: any = await getCameraBaseImage({ id: node.id })
      const rsp: any = await getCameraBaseImage({ 
        id: node.id,
        clusterId: this.clusterId,
        devId: this.devId,
      })

      if (rsp && rsp.data) {
        this.gb28181CameraBaseImage = rsp.data

 src/api/Gb28181.ts

@@ -1,16 +1,17 @@
import request from '@/scripts/httpRequest'

export const getGB28181Config = () => {
export const getGB28181Config = (query: any) => {
  return request({
    url: "/data/api-v/sysset/gb28181ConfigShow",
    method: "get"
    url: "/saas/api-s/gb28181/configShow",
    method: "get",
    params:query
  });
};


export const saveGB28181Config = (query: any) => {
  return request({
    url: "/data/api-v/sysset/gb28181ConfEdit",
    url: "/saas/api-s/gb28181/configEdit",
    method: "post",
    data: query
  });
@@ -18,7 +19,7 @@

export const getGb28181AreaList = (query: any) => {
  return request({
    url: "/data/api-v/gb28181/findAreaByParentId",
    url: "/saas/api-s/gb28181/findAreaByParentId",
    method: "get",
    params: query
  });
@@ -26,15 +27,15 @@

export const getAllSubServer = (query: any) => {
  return request({
    url: "/data/api-v/gb28181/getAllSubServer",
    method: "get",
    params: query
    url: "/saas/api-s/gb28181/getAllSubServer",
    method: "post",
    data: query
  });
};

export const newGb28181ID = (query: any) => {
  return request({
    url: "/data/api-v/gb28181/newGbId",
    url: "/saas/api-s/gb28181/newGbId",
    method: "get",
    params: query
  });
@@ -65,8 +66,17 @@

export const saveGb28181CamTree = (query: any) => {
  return request({
    url: "/data/api-v/gb28181/saveGb28181CamTree",
    url: "/saas/api-s/gb28181/autoSaveGb28181CamTree",
    method: "post",
    data: query
  });
};

export const saveTree = (data) => {
  return request({
    url: "/saas/api-s/gb28181/saveGb28181CamTree",
    method: "post",
    data
  });
};


 src/api/area.ts

@@ -49,25 +49,27 @@
  });
};

export const getCameraBaseImage = (query: any) => {
export const getCameraBaseImage = (data: any) => {
  return request({
    url: "/data/api-v/gb28181/camera/capture",
    method: "get",
    params: query
  });
};

export const getGb28181Pool = () => {
  return request({
    url: "/data/api-v/gb28181/treeSelected",
    method: "get"
  });
};

export const refreshGB28181Tree = () => {
  return request({
    url: "/data/api-v/gb28181/treeRefresh",
    url: "/saas/api-s/gb28181/camera/capture",
    method: "post",
    data
  });
};

export const getGb28181Pool = (data) => {
  return request({
    url: "/saas/api-s/gb28181/treeSelected",
    method: "post",
    data
  });
};

export const refreshGB28181Tree = (data) => {
  return request({
    url: "/saas/api-s/gb28181/treeRefresh",
    method: "post",
    data
  });
};

@@ -78,3 +80,5 @@
    data: qs.stringify(query)
  });
};



 src/api/search.ts

@@ -62,4 +62,21 @@
    method: "post",
    data: query
  });
};
};

// 获取配置
export const config = () => {
  return request({
    url: "/saas/api-s/es/config",
    method: "get",
  });
};

// 保存配置
export const saveEsConfig = (query: any) => {
  return request({
    url: " /saas/api-s/es/saveEsConfig",
    method: "post",
    data: query
  });
};

 src/api/system.ts

@@ -68,10 +68,11 @@
  });
};

export const getGB28181Config = () => {
export const getGB28181Config = (query: any) => {
  return request({
    url: "/data/api-v/gb28181/configShow",
    method: "get"
    url: "/saas/api-s/gb28181/configShow",
    method: "get",
    params:query
  });
};


 src/components/Footer.vue

@@ -24,7 +24,7 @@
  },
  methods: {
    jump() {
      window.open("http://www.smartai.com/contact");
      window.open("http://www.smartai.com/about");
    },
    jump2() {
      window.open("http://www.smartai.com/consult");

 src/components/Header.vue

@@ -17,7 +17,7 @@
export default {
  methods: {
    jump() {
      window.open("http://www.smartai.com/contact");
      window.open("http://www.smartai.com/about");
    },
    jump2() {
      window.open("http://www.smartai.com/consult");

 src/components/giantTree/index.vue

@@ -1,5 +1,28 @@
<template>
  <div class="tree-menu" :style="`max-height:${height - 200}px;`">
    <div class="devArea">
      <swiper :options="swiperOption" v-if="showDevArea">
        <swiper-slide
          v-for="item in nodeList"
          :key="item.devId"
          :class="{ active: activeTabObj.devId === item.devId }"
        >
          <div class="tab" @click="chooseTab(item)">
            {{ item.devName }}
          </div>
        </swiper-slide>
      </swiper>
      <div class="swiper-pre-border" v-if="showDevArea">
        <div class="icon-btn" slot="button-prev">
          <i class="iconfont">&#xe618;</i>
        </div>
      </div>
      <div class="swiper-next-border" v-if="showDevArea">
        <div class="icon-btn" slot="button-next">
          <i class="iconfont">&#xe623;</i>
        </div>
      </div>
    </div>
    <z-tree
      :nodes="node"
      :show-checkbox="TreeDataPool.multiple"
@@ -92,6 +115,11 @@
      type: Boolean,
      default: false,
    },
    showDevArea: {
      type: Boolean,
      default: false,
    },
    nodeList: {},
  },
  data() {
    return {
@@ -108,9 +136,27 @@
        ],
      },
      curNodeTid: "",

      activeTabObj: {},
      swiperOption: {
        slidesPerView: 3,
        spaceBetween: 0,
        pagination: {
          el: ".swiper-pagination",
          clickable: true,
        },
        navigation: {
          nextEl: ".swiper-next-border",
          prevEl: ".swiper-pre-border",
        },
        observer: true, //修改swiper自己或子元素时，自动初始化swiper
        observeParents: true, //修改swiper的父元素时，自动初始化swiper
      },
    };
  },
  created() {
    this.activeTabObj =
      this.nodeList && this.nodeList.length > 0 ? this.nodeList[0] : "";
    this.TreeDataPool.zTree = true;
    this.TreeDataPool.activeVideoIndex = sessionStorage.activeIndexVideo
      ? Number(sessionStorage.activeIndexVideo)
@@ -121,6 +167,9 @@
      if (newValue !== this.treeName) {
        this.TreeDataPool.cleanTree(this.treeName);
      }
    },
    showDevArea: function () {
      this.$forceUpdate();
    },
  },
  methods: {
@@ -153,6 +202,12 @@

        this.ztreeObj.selectNode(node, false, true);
      }
    },
    chooseTab(item) {
      this.$emit("saveTree", this.activeTabObj);
      setTimeout(() => {
        this.activeTabObj = item;
      }, 100);
    },

    findTidByIdFromArr(arr) {
@@ -357,6 +412,9 @@
};
</script>
<style lang="scss" scoped>
.devArea {
}

.dialog-box {
  position: absolute;
  width: 220px;
@@ -445,4 +503,75 @@
.tree-menu:hover {
  overflow-y: auto;
}

.devArea {
  position: relative;
  margin: 20px;
  background: #f0f5fa;
  padding: 0 40px;

  .swiper-slide {
    display: flex;
    align-items: center;
    height: 46px;

    &.active {
      .tab {
        color: #0064ff;
      }
      border-bottom: 2px solid #0064ff;
    }

    .tab {
      margin: 0 12px 0 24px;
      font-size: 14px;
      color: #666;
      cursor: pointer;
    }

    .iconfont {
      font-size: 12px;
      color: #dbdbdb;
    }
  }

  .swiper-pre-border {
    position: absolute;
    padding-bottom: 13px;
    padding-right: 18px;
    top: 12px;
    left: 10px;
    cursor: pointer;

    i {
      font-size: 16px;
      color: #999;
    }
  }

  .swiper-next-border {
    position: absolute;
    top: 12px;
    right: 10px;
    padding-bottom: 13px;
    padding-left: 18px;
    cursor: pointer;

    i {
      font-size: 16px;
      color: #999;
    }
  }

  .swiper-button-disabled {
    cursor: not-allowed;
    i {
      color: #dbdbdb;
    }
  }

  .del {
    cursor: pointer;
  }
}
</style>

 src/scripts/httpRequest.ts

@@ -38,6 +38,11 @@
      if(config.url === '/saas/api-d/device/userClusterInfo') {
         config.data.clusterId = ''
      }

       if(config.url === '/saas/api-s/es/saveEsConfig') {
        delete config.data.clusterId
        delete config.data.devId
      }
     
    }


 src/views/GB28181/components/DevList.vue

@@ -4,25 +4,45 @@
    <div class="empty" v-if="devList.length === 0">
      <img src="/images/search/1.png" alt="" />
      <div class="des">您还未添加集群或设备，请在设备管理中添加</div>
      <div class="button add">立即添加</div>
      <div class="button add" @click="$router.push('/equipmentList')">
        立即添加
      </div>
    </div>
    <div class="list scroll">
      <div class="devItem" v-for="(item, index) in devList" :key="index">
      <div class="devItem" v-for="(item, index) in clusterList" :key="index">
        <div class="mainInfo">
          <img
            v-if="item.type == 1"
            src="/images/hashrate/cluster.png"
            alt=""
          />
          <img v-else src="/images/hashrate/equipment.png" alt="" />
          <img src="/images/hashrate/cluster.png" alt="" />

          <div class="right">
            <div class="name">集群123</div>
            <div class="ip">192.168.1.1</div>
            <div class="number">设备总量:7</div>
            <div class="name">{{ item.cluster_name }}</div>
            <div class="ip">{{ item.virtual_ip }}</div>
            <div class="number">设备总量:{{ item.nodeNum }}</div>
          </div>

          <div class="button set" @click="showSettingBox = true">配置</div>
          <div
            class="button set"
            @click="setting({ clusterId: item.cluster_id }, item.nodeList)"
          >
            配置
          </div>
        </div>
      </div>
      <div
        class="devItem"
        v-for="(item, index) in devList"
        :key="index + 'dev'"
      >
        <div class="mainInfo">
          <img src="/images/hashrate/equipment.png" alt="" />

          <div class="right">
            <div class="name">{{ item.devName }}</div>
            <div class="ip">{{ item.devIp }}</div>
          </div>

          <div class="button set" @click="setting({ devId: item.devId })">
            配置
          </div>
        </div>
      </div>
    </div>
@@ -30,73 +50,45 @@
    <SettingBox
      v-if="showSettingBox"
      @close="showSettingBox = false"
      :id="idObj"
      :nodeList="nodeList"
    ></SettingBox>
  </div>
</template>

<script>
import SettingBox from "@/views/GB28181/components/SettingBox";
import { getClusterDevList } from "@/api/clusterManage";

export default {
  components: {
    SettingBox,
  },
  created() {
    this.getClusterDevList();
  },
  data() {
    return {
      devList: [
        {
          type: 1,
        },
        {
          type: 1,
        },

        {
          type: 1,
        },
        {
          type: 1,
        },
        {
          type: 1,
        },
        {
          type: 1,
        },

        {
          type: 1,
        },
        {
          type: 1,
        },
        {
          type: 1,
        },
        {
          type: 1,
        },
        {
          type: 1,
        },
        {
          type: 1,
        },
        {
          type: 1,
        },
        {
          type: 1,
        },
        {
          type: 0,
        },
        {
          type: 0,
        },
      ],
      clusterList: [],
      devList: [],
      showSettingBox: false,
      idObj: {},
      nodeList: [],
    };
  },
  methods: {
    async getClusterDevList() {
      const res = await getClusterDevList();
      if (res && res.success) {
        this.clusterList = res.data.clusterList;
        this.devList = res.data.devList;
      }
    },
    setting(id, nodeList) {
      this.idObj = id;
      this.nodeList = nodeList ? nodeList : [];
      this.showSettingBox = true;
    },
  },
};
</script>
@@ -213,4 +205,4 @@
    }
  }
}
</style>
</style>

 src/views/GB28181/components/FormArea.vue

@@ -116,6 +116,9 @@
import { isPort, isIPv4 } from "@/scripts/validate";

export default {
  props: {
    id: {},
  },
  created() {
    this.initGB28181Conf();
  },
@@ -168,7 +171,7 @@
  },
  methods: {
    initGB28181Conf() {
      getGB28181Config().then((rsp) => {
      getGB28181Config(this.id).then((rsp) => {
        if (rsp && rsp.success) {
          this.gb28181 = rsp.data;
          //this.gb28181.idType = 0;
@@ -179,7 +182,7 @@
      });
      getGb28181AreaList().then((rsp) => {
        if (rsp && rsp.success) {
          this.locationCity.provinceOptions = rsp.data;
          this.locationCity.provinceOptions = rsp.data.list;
        }
      });
    },
@@ -205,7 +208,7 @@
      let pid = this.locationCity.province;
      getGb28181AreaList({ parentId: pid }).then((rsp) => {
        if (rsp && rsp.success) {
          this.locationCity.cityOptions = rsp.data;
          this.locationCity.cityOptions = rsp.data.list;
          this.locationCity.city = this.locationCity.cityOptions[0].id;
          this.changeCity();
        }
@@ -215,7 +218,7 @@
      let pid = this.locationCity.city;
      getGb28181AreaList({ parentId: pid }).then((rsp) => {
        if (rsp && rsp.success) {
          this.locationCity.countyOptions = rsp.data;
          this.locationCity.countyOptions = rsp.data.list;
          this.locationCity.county = this.locationCity.countyOptions[0].id;
        }
      });
@@ -224,7 +227,7 @@
      let cCode = this.locationCity.county + "";
      newGb28181ID({ code: cCode }).then((rsp) => {
        if (rsp && rsp.success) {
          this.gb28181.PublicId = rsp.data;
          this.gb28181.PublicId = rsp.data.code;
        }
      });
    },

 src/views/GB28181/components/SettingBox.vue

@@ -27,9 +27,18 @@
        </div>
      </div>

      <FormArea @close="$emit('close')" v-if="activeTab === 0"></FormArea>
      <TableArea v-if="activeTab === 1"></TableArea>
      <TreeArea @close="$emit('close')" v-if="activeTab === 2"></TreeArea>
      <FormArea
        :id="id"
        @close="$emit('close')"
        v-if="activeTab === 0"
      ></FormArea>
      <TableArea :id="id" v-if="activeTab === 1"></TableArea>
      <TreeArea
        :id="id"
        :nodeList="nodeList"
        @close="$emit('close')"
        v-if="activeTab === 2"
      ></TreeArea>
    </div>
  </div>
</template>
@@ -45,6 +54,10 @@
    TableArea,
    TreeArea,
  },
  props: {
    id: {},
    nodeList: {},
  },
  data() {
    return {
      activeTab: 0,

 src/views/GB28181/components/TableArea.vue

@@ -1,38 +1,40 @@
<template>
  <div class="TableArea">
    <el-table
      :data="subDevTable"
      fit
      highlight-current-row
      style="width: 100%"
      height="500"
    >
      <el-table-column
        type="index"
        label="序号"
        align="center"
        width="80"
      ></el-table-column>
      <el-table-column
        prop="name"
        label="名称"
        show-overflow-tooltip
      ></el-table-column>
      <el-table-column
        prop="publicid"
        label="ID"
        show-overflow-tooltip
      ></el-table-column>
      <el-table-column prop="ip" label="IP"></el-table-column>
      <el-table-column prop="status" label="状态" align="center">
        <template slot-scope="scope">
          <span :style="scope.row.alive ? `color:#36B24A` : 'color:#FF4B33;'">{{
            scope.row.alive ? "在线" : "离线"
          }}</span>
        </template>
      </el-table-column>
      <el-table-column prop="corp" label="备注"></el-table-column>
    </el-table>
    <div class="content">
      <el-table
        :data="subDevTable"
        fit
        highlight-current-row
        style="width: 100%"
      >
        <el-table-column
          type="index"
          label="序号"
          align="center"
          width="80"
        ></el-table-column>
        <el-table-column
          prop="name"
          label="名称"
          show-overflow-tooltip
        ></el-table-column>
        <el-table-column
          prop="publicid"
          label="ID"
          show-overflow-tooltip
        ></el-table-column>
        <el-table-column prop="ip" label="IP"></el-table-column>
        <el-table-column prop="status" label="状态" align="center">
          <template slot-scope="scope">
            <span
              :style="scope.row.alive ? `color:#36B24A` : 'color:#FF4B33;'"
              >{{ scope.row.alive ? "在线" : "离线" }}</span
            >
          </template>
        </el-table-column>
        <el-table-column prop="corp" label="备注"></el-table-column>
      </el-table>
    </div>
  </div>
</template>

@@ -40,6 +42,9 @@
import { getAllSubServer } from "@/api/Gb28181";

export default {
  props: {
    id: {},
  },
  created() {
    this.getList();
  },
@@ -50,586 +55,22 @@
  },
  methods: {
    async getList() {
      console.log(12121);
      // const res = await getAllSubServer();
      this.subDevTable = [
        {
          alive: 0,
          corp: "",
          devmode: "gb28181",
          ip: "218.11.13.177",
          name: "",
          parentid: "11011400011121000001",
          passwd: "",
          port: 15060,
          publicid: "34020000002000000001",
          username: "",
        },
        {
          alive: 1,
          corp: "",
          devmode: "gb28181",
          ip: "192.168.5.53",
          name: "",
          parentid: "11011400011121000001",
          passwd: "",
          port: 5060,
          publicid: "34020000001320000001",
          username: "",
        },
        {
          alive: 0,
          corp: "",
          devmode: "gb28181",
          ip: "194.5.215.118",
          name: "",
          parentid: "11011400011121000001",
          passwd: "",
          port: 60783,
          publicid: "1278",
          username: "",
        },
        {
          alive: 0,
          corp: "",
          devmode: "gb28181",
          ip: "138.199.42.181",
          name: "",
          parentid: "11011400011121000001",
          passwd: "",
          port: 53998,
          publicid: "2376",
          username: "",
        },
        {
          alive: 0,
          corp: "",
          devmode: "gb28181",
          ip: "156.146.50.98",
          name: "",
          parentid: "11011400011121000001",
          passwd: "",
          port: 49420,
          publicid: "2924",
          username: "",
        },
        {
          alive: 0,
          corp: "",
          devmode: "gb28181",
          ip: "149.34.242.65",
          name: "",
          parentid: "11011400011121000001",
          passwd: "",
          port: 54724,
          publicid: "3775",
          username: "",
        },
        {
          alive: 0,
          corp: "",
          devmode: "gb28181",
          ip: "188.240.57.118",
          name: "",
          parentid: "11011400011121000001",
          passwd: "",
          port: 61962,
          publicid: "4423",
          username: "",
        },
        {
          alive: 0,
          corp: "",
          devmode: "gb28181",
          ip: "89.37.173.34",
          name: "",
          parentid: "11011400011121000001",
          passwd: "",
          port: 58343,
          publicid: "4877",
          username: "",
        },
        {
          alive: 0,
          corp: "",
          devmode: "gb28181",
          ip: "89.187.162.185",
          name: "",
          parentid: "11011400011121000001",
          passwd: "",
          port: 56095,
          publicid: "391",
          username: "",
        },
        {
          alive: 0,
          corp: "",
          devmode: "gb28181",
          ip: "62.197.145.4",
          name: "",
          parentid: "11011400011121000001",
          passwd: "",
          port: 60973,
          publicid: "1872",
          username: "",
        },
        {
          alive: 0,
          corp: "",
          devmode: "gb28181",
          ip: "45.134.212.244",
          name: "",
          parentid: "11011400011121000001",
          passwd: "",
          port: 55040,
          publicid: "4379",
          username: "",
        },
        {
          alive: 0,
          corp: "",
          devmode: "gb28181",
          ip: "194.33.40.115",
          name: "",
          parentid: "11011400011121000001",
          passwd: "",
          port: 51789,
          publicid: "4923",
          username: "",
        },
        {
          alive: 0,
          corp: "",
          devmode: "gb28181",
          ip: "91.219.215.52",
          name: "",
          parentid: "11011400011121000001",
          passwd: "",
          port: 52951,
          publicid: "1885",
          username: "",
        },
        {
          alive: 0,
          corp: "",
          devmode: "gb28181",
          ip: "185.99.3.103",
          name: "",
          parentid: "11011400011121000001",
          passwd: "",
          port: 60547,
          publicid: "3377",
          username: "",
        },
        {
          alive: 0,
          corp: "",
          devmode: "gb28181",
          ip: "213.152.165.107",
          name: "",
          parentid: "11011400011121000001",
          passwd: "",
          port: 62282,
          publicid: "769",
          username: "",
        },
        {
          alive: 0,
          corp: "",
          devmode: "gb28181",
          ip: "129.227.219.8",
          name: "",
          parentid: "11011400011121000001",
          passwd: "",
          port: 53877,
          publicid: "1271",
          username: "",
        },
        {
          alive: 0,
          corp: "",
          devmode: "gb28181",
          ip: "45.9.249.244",
          name: "",
          parentid: "11011400011121000001",
          passwd: "",
          port: 57637,
          publicid: "3424",
          username: "",
        },
        {
          alive: 0,
          corp: "",
          devmode: "gb28181",
          ip: "45.136.155.91",
          name: "",
          parentid: "11011400011121000001",
          passwd: "",
          port: 55749,
          publicid: "2877",
          username: "",
        },
        {
          alive: 0,
          corp: "",
          devmode: "gb28181",
          ip: "156.146.50.98",
          name: "",
          parentid: "11011400011121000001",
          passwd: "",
          port: 49162,
          publicid: "2925",
          username: "",
        },
        {
          alive: 0,
          corp: "",
          devmode: "gb28181",
          ip: "194.5.215.118",
          name: "",
          parentid: "11011400011121000001",
          passwd: "",
          port: 50858,
          publicid: "1279",
          username: "",
        },
        {
          alive: 0,
          corp: "",
          devmode: "gb28181",
          ip: "188.240.57.118",
          name: "",
          parentid: "11011400011121000001",
          passwd: "",
          port: 61692,
          publicid: "4424",
          username: "",
        },
        {
          alive: 0,
          corp: "",
          devmode: "gb28181",
          ip: "138.199.42.181",
          name: "",
          parentid: "11011400011121000001",
          passwd: "",
          port: 58970,
          publicid: "2377",
          username: "",
        },
        {
          alive: 0,
          corp: "",
          devmode: "gb28181",
          ip: "149.34.242.65",
          name: "",
          parentid: "11011400011121000001",
          passwd: "",
          port: 54856,
          publicid: "3776",
          username: "",
        },
        {
          alive: 0,
          corp: "",
          devmode: "gb28181",
          ip: "89.187.162.185",
          name: "",
          parentid: "11011400011121000001",
          passwd: "",
          port: 52956,
          publicid: "392",
          username: "",
        },
        {
          alive: 0,
          corp: "",
          devmode: "gb28181",
          ip: "194.33.40.115",
          name: "",
          parentid: "11011400011121000001",
          passwd: "",
          port: 64302,
          publicid: "4924",
          username: "",
        },
        {
          alive: 0,
          corp: "",
          devmode: "gb28181",
          ip: "45.134.212.244",
          name: "",
          parentid: "11011400011121000001",
          passwd: "",
          port: 63807,
          publicid: "4380",
          username: "",
        },
        {
          alive: 0,
          corp: "",
          devmode: "gb28181",
          ip: "91.219.215.52",
          name: "",
          parentid: "11011400011121000001",
          passwd: "",
          port: 64985,
          publicid: "1886",
          username: "",
        },
        {
          alive: 0,
          corp: "",
          devmode: "gb28181",
          ip: "45.9.249.244",
          name: "",
          parentid: "11011400011121000001",
          passwd: "",
          port: 57372,
          publicid: "3425",
          username: "",
        },
        {
          alive: 0,
          corp: "",
          devmode: "gb28181",
          ip: "213.152.165.107",
          name: "",
          parentid: "11011400011121000001",
          passwd: "",
          port: 49539,
          publicid: "770",
          username: "",
        },
        {
          alive: 0,
          corp: "",
          devmode: "gb28181",
          ip: "45.136.155.91",
          name: "",
          parentid: "11011400011121000001",
          passwd: "",
          port: 60032,
          publicid: "2878",
          username: "",
        },
        {
          alive: 0,
          corp: "",
          devmode: "gb28181",
          ip: "156.146.50.98",
          name: "",
          parentid: "11011400011121000001",
          passwd: "",
          port: 65234,
          publicid: "2926",
          username: "",
        },
        {
          alive: 0,
          corp: "",
          devmode: "gb28181",
          ip: "188.240.57.118",
          name: "",
          parentid: "11011400011121000001",
          passwd: "",
          port: 61386,
          publicid: "4425",
          username: "",
        },
        {
          alive: 0,
          corp: "",
          devmode: "gb28181",
          ip: "194.5.215.118",
          name: "",
          parentid: "11011400011121000001",
          passwd: "",
          port: 62886,
          publicid: "1280",
          username: "",
        },
        {
          alive: 0,
          corp: "",
          devmode: "gb28181",
          ip: "149.34.242.65",
          name: "",
          parentid: "11011400011121000001",
          passwd: "",
          port: 57416,
          publicid: "3777",
          username: "",
        },
        {
          alive: 0,
          corp: "",
          devmode: "gb28181",
          ip: "194.33.40.115",
          name: "",
          parentid: "11011400011121000001",
          passwd: "",
          port: 65530,
          publicid: "4925",
          username: "",
        },
        {
          alive: 0,
          corp: "",
          devmode: "gb28181",
          ip: "89.187.162.185",
          name: "",
          parentid: "11011400011121000001",
          passwd: "",
          port: 59341,
          publicid: "393",
          username: "",
        },
        {
          alive: 0,
          corp: "",
          devmode: "gb28181",
          ip: "45.134.212.244",
          name: "",
          parentid: "11011400011121000001",
          passwd: "",
          port: 49608,
          publicid: "4381",
          username: "",
        },
        {
          alive: 0,
          corp: "",
          devmode: "gb28181",
          ip: "91.219.215.52",
          name: "",
          parentid: "11011400011121000001",
          passwd: "",
          port: 62294,
          publicid: "1887",
          username: "",
        },
        {
          alive: 0,
          corp: "",
          devmode: "gb28181",
          ip: "45.9.249.244",
          name: "",
          parentid: "11011400011121000001",
          passwd: "",
          port: 57068,
          publicid: "3426",
          username: "",
        },
        {
          alive: 0,
          corp: "",
          devmode: "gb28181",
          ip: "213.152.165.107",
          name: "",
          parentid: "11011400011121000001",
          passwd: "",
          port: 61066,
          publicid: "771",
          username: "",
        },
        {
          alive: 0,
          corp: "",
          devmode: "gb28181",
          ip: "156.146.50.98",
          name: "",
          parentid: "11011400011121000001",
          passwd: "",
          port: 64946,
          publicid: "2927",
          username: "",
        },
        {
          alive: 0,
          corp: "",
          devmode: "gb28181",
          ip: "188.240.57.118",
          name: "",
          parentid: "11011400011121000001",
          passwd: "",
          port: 61133,
          publicid: "4426",
          username: "",
        },
        {
          alive: 0,
          corp: "",
          devmode: "gb28181",
          ip: "194.5.215.118",
          name: "",
          parentid: "11011400011121000001",
          passwd: "",
          port: 63212,
          publicid: "1281",
          username: "",
        },
        {
          alive: 0,
          corp: "",
          devmode: "gb28181",
          ip: "194.33.40.115",
          name: "",
          parentid: "11011400011121000001",
          passwd: "",
          port: 56324,
          publicid: "4926",
          username: "",
        },
        {
          alive: 0,
          corp: "",
          devmode: "gb28181",
          ip: "149.34.242.65",
          name: "",
          parentid: "11011400011121000001",
          passwd: "",
          port: 50517,
          publicid: "3778",
          username: "",
        },
        {
          alive: 0,
          corp: "",
          devmode: "gb28181",
          ip: "45.134.212.244",
          name: "",
          parentid: "11011400011121000001",
          passwd: "",
          port: 52108,
          publicid: "4382",
          username: "",
        },
        {
          alive: 0,
          corp: "",
          devmode: "gb28181",
          ip: "45.9.249.244",
          name: "",
          parentid: "11011400011121000001",
          passwd: "",
          port: 56708,
          publicid: "3427",
          username: "",
        },
        {
          alive: 0,
          corp: "GBT28181",
          devmode: "gb28181",
          ip: "192.168.5.56",
          name: "Camera 01",
          parentid: "11011400011121000001",
          passwd: "",
          port: 5060,
          publicid: "44122500041325000002",
          username: "",
        },
      ];
      let params = {};
      if (this.id.clusterId) {
        params = {
          clusterId: this.id.clusterId,
          devId: "",
        };
      } else {
        params = {
          clusterId: "",
          devId: this.id.devId,
        };
      }
      const res = await getAllSubServer(params);
      if (res && res.success) {
        this.subDevTable = res.data;
      }
    },
  },
};
@@ -638,6 +79,9 @@
<style lang="scss" scoped >
.TableArea {
  padding: 30px 0;
  .content {
    height: 500px;
  }
  .el-table ::v-deep {
    background-color: rgb(233, 235, 238);
    padding: 1px;

 src/views/GB28181/components/TreeArea.vue

@@ -1,6 +1,27 @@
<template>
  <div class="TreeArea">
    <div class="refresh">
      <span v-if="nodeList && nodeList.length > 0">配置规则</span>
      <el-switch
        v-model="ruleType"
        active-color="#0065FF"
        inactive-color="#ED7E2F"
        :width="52"
        v-if="nodeList && nodeList.length > 0"
      >
      </el-switch>
      <span
        class="des1"
        @click="ruleType = false"
        v-if="ruleType && nodeList && nodeList.length > 0"
        >自动</span
      >
      <span
        class="des2"
        @click="ruleType = true"
        v-if="!ruleType && nodeList && nodeList.length > 0"
        >手动</span
      >
      <div class="button" @click="updateCamerasFromVideosvr">刷新</div>
      单台设备最大支持配置500路摄像机，集群最大支持配置路数=集群内设备总量*500
    </div>
@@ -18,7 +39,10 @@
          :node="TreeDataPool.treeData"
          :height="600"
          :setting="treeSettings"
          :showDevArea="!ruleType"
          :nodeList="nodeList"
          @itemChecked="onItemCheck"
          @saveTree="tempSaveTree"
          search
          style="width: 450px; min-height: 600px"
        />
@@ -68,7 +92,7 @@
</template>

<script>
import { saveGb28181CamTree } from "@/api/Gb28181";
import { saveGb28181CamTree, saveTree } from "@/api/Gb28181";
import TreeMenu from "@/components/giantTree/index";
import ZTree from "@/components/giantTree/zTree/ztree";

@@ -76,6 +100,10 @@
  components: {
    TreeMenu,
    ZTree,
  },
  props: {
    id: {},
    nodeList: {},
  },
  data() {
    return {
@@ -91,7 +119,13 @@
      },
      dstTreeData: [],
      loading: null,
      ruleType: true,
      allTreeData: {},
    };
  },
  created() {
    this.TreeDataPool.clusterId = this.id.clusterId ? this.id.clusterId : "";
    this.TreeDataPool.devId = this.id.devId ? this.id.devId : "";
  },
  mounted() {
    this.TreeDataPool.multiple = true;
@@ -127,6 +161,13 @@
        this.TreeDataPool.activeTreeData
      );
    },
    tempSaveTree(tab) {
      console.log(1212);
      console.log(tab);
      this.allTreeData[tab.devId] = this.TreeDataPool.newTreeByChecked(
        this.TreeDataPool.activeTreeData
      );
    },
    saveChecked() {
      localStorage.setItem(
        "ztree_fold_list",
@@ -148,8 +189,12 @@
        this.TreeDataPool.activeTreeData
      );

      saveGb28181CamTree({ checkedMenus: treeData })
        .then((rsp) => {
      if (this.ruleType) {
        saveGb28181CamTree({
          clusterId: this.id.clusterId ? this.id.clusterId : "",
          devId: this.id.devId ? this.id.devId : "",
          checkedMenus: treeData,
        }).then((rsp) => {
          if (rsp && rsp.success) {
            this.$message({
              type: "success",
@@ -157,14 +202,30 @@
            });
          }
          this.loading = false;
        })
        .catch((err) => {
          this.$message({
            type: "error",
            message: "保存失败",
        });
      } else {
        let tab = this.$refs["ztree"].activeTabObj;
        this.allTreeData[tab.devId] = treeData;
        let params = [];
        for (const key in this.allTreeData) {
          params.push({
            devId: key,
            checkedMenus: this.allTreeData[key],
          });
        }

        saveTree({
          list: params,
        }).then((rsp) => {
          if (rsp && rsp.success) {
            this.$message({
              type: "success",
              message: "保存成功",
            });
          }
          this.loading = false;
        });
      }
    },
  },
};
@@ -181,6 +242,34 @@
    align-items: center;
    font-size: 12px;
    color: #666666;
    position: relative;

    span {
      font-size: 14px;
    }

    .el-switch {
      margin-left: 16px;
      margin-right: 32px;
    }

    .des1 {
      top: 7px;
      left: 78px;
      position: absolute;
      font-size: 12px;
      color: #fff;
      cursor: pointer;
    }

    .des2 {
      top: 7px;
      left: 92px;
      position: absolute;
      font-size: 12px;
      color: #fff;
      cursor: pointer;
    }

    .button {
      margin-right: 10px;

 src/views/connectUs/index.vue

@@ -38,7 +38,7 @@
        this.$router.push("/");
      }
      if (index == 2) {
        window.open("http://smartai.com/contact");
        window.open("http://smartai.com/about");
      }
      if (index == 4) {
        window.open("http://smartai.com/consult");

 src/views/equipmentManagement/algorithmDetail/components/Card.vue

@@ -35,7 +35,8 @@

      <li>
        <div class="label">激活码:</div>
        <div class="data">-</div>
        <div class="data" v-if="data.activateCode">{{ data.activateCode }}</div>
        <div class="data" v-else>-</div>
      </li>
    </ul>


 src/views/equipmentManagement/equipmentDetail/components/FormArea.vue

@@ -8,30 +8,30 @@
        >
      </div>
      <el-table :data="data.algos" stripe style="width: 100%">
        <el-table-column prop="name" label="名称" width="206" class-name="name">
        <el-table-column prop="name" label="名称" class-name="name">
        </el-table-column>
        <el-table-column label="CPU" width="206">
        <el-table-column label="CPU">
          <template slot-scope="scope">
            <span>{{ scope.row.cpu.toFixed(2) }} %</span>
          </template>
        </el-table-column>
        <el-table-column prop="mem" label="内存" width="206">
        <el-table-column prop="mem" label="内存">
          <template slot-scope="scope">
            <span>{{ scope.row.mem.toFixed(2) }} %</span>
          </template>
        </el-table-column>
        <el-table-column prop="dist" label="硬盘" width="206">
        </el-table-column>
        <el-table-column prop="gpu" label="算力" width="206">
        <!--  <el-table-column prop="dist" label="硬盘" width="206">
        </el-table-column> -->
        <el-table-column prop="gpu" label="算力">
          <template slot-scope="scope">
            <span>{{ scope.row.gpu.toFixed(2) }} Mbps</span>
          </template>
        </el-table-column>
        <el-table-column prop="net" label="网络">
        <!--   <el-table-column prop="net" label="网络">
          <template slot-scope="scope">
            <span>{{ scope.row.net.toFixed(2) }} %</span>
          </template>
        </el-table-column>
        </el-table-column> -->
      </el-table>
    </div>


 src/views/equipmentManagement/equipmentList/components/Content.vue

@@ -194,7 +194,7 @@
        box-sizing: border-box;
        display: none;
        position: absolute;
        padding: 20px;
        padding: 20px 10px;
        top: 40px;
        left: -100px;
        width: 247px;

 src/views/hashrate/CameraManage/CameraInfo/index.vue

@@ -204,6 +204,7 @@
            :rtspUrl="videoItem.rtsp"
            :isRunning="false"
            :showArea="false"
            :videoUrl="ip"
            v-if="
              videoItem !== '' &&
              videoItem !== undefined &&
@@ -261,6 +262,7 @@
      togglePlay: true,
      eventAudio: new Audio(),
      soundPath: "",
      ip: "",
      form: {},
      // 记录添加状态
      isAdd: false,
@@ -375,6 +377,8 @@
      if (node.type === "4") {
        getCameraInfo(node.id).then((res) => {
          if (res.success) {
            this.ip = "ws://" + res.data.ip + ":7009/ws";

            if (res.data.resolutions) {
              let list = res.data.resolutions.map((i) => {
                let obj = {};

 src/views/hashrate/CameraManage/CameraRules/components/SdkBox.vue

@@ -54,7 +54,7 @@
  height: 534px;
  background-color: #fff;
  box-shadow: 0px 2px 16px 0px rgba(0, 43, 106, 0.25);
  z-index: 2100;
  z-index: 2002;

  .title {
    box-sizing: border-box;

 src/views/hashrate/CameraManage/CameraRules/components/SdkSettingBox.vue

@@ -733,6 +733,8 @@

    setOptArgValueOptions(optArg) {
      let alias = optArg.alias;
      console.log(121212);
      console.log(alias);
      optArg.valueOptions = this.VideoManageData.Dictionary[alias].map((r) => {
        return {
          name: r.name,

 src/views/hashrate/CameraManage/CameraRules/components/TimeSlider.vue

@@ -451,7 +451,7 @@
      position: absolute;
      padding-bottom: 13px;
      padding-right: 18px;
      top: 16px;
      top: 12px;
      left: -34px;
      cursor: pointer;
      border-bottom: 1px solid #e9ebee;
@@ -464,7 +464,7 @@

    .swiper-next-border {
      position: absolute;
      top: 16px;
      top: 12px;
      right: -34px;
      padding-bottom: 13px;
      padding-left: 18px;

 src/views/hashrate/CameraManage/CameraRules/index.vue

@@ -129,9 +129,30 @@
    <div class="SeparateRules" @click="selectMultiple(false)">
      <div class="title">独立场景</div>
      <div class="control">
        <i class="iconfont" @click="openSdkBox($event)">&#xe650;</i>
        <i class="iconfont">&#xe64e;</i>
        <i class="iconfont">&#xe64f;</i>
        <el-tooltip
          class="item"
          effect="dark"
          content="算法事件"
          placement="top"
        >
          <i class="iconfont" @click="openSdkBox($event)">&#xe650;</i>
        </el-tooltip>
        <el-tooltip
          class="item"
          effect="dark"
          content="数据流传"
          placement="top"
        >
          <i class="iconfont">&#xe64e;</i>
        </el-tooltip>
        <el-tooltip
          class="item"
          effect="dark"
          content="模板助手"
          placement="top"
        >
          <i class="iconfont">&#xe64f;</i>
        </el-tooltip>
      </div>

      <div class="content">
@@ -171,9 +192,30 @@
    <div class="linkageRule" @click="selectMultiple(true)">
      <div class="title">联动场景</div>
      <div class="control">
        <i class="iconfont" @click="showSdkBox = true">&#xe650;</i>
        <i class="iconfont">&#xe64e;</i>
        <i class="iconfont">&#xe64f;</i>
        <el-tooltip
          class="item"
          effect="dark"
          content="算法事件"
          placement="top"
        >
          <i class="iconfont" @click="showSdkBox = true">&#xe650;</i>
        </el-tooltip>
        <el-tooltip
          class="item"
          effect="dark"
          content="数据流传"
          placement="top"
        >
          <i class="iconfont">&#xe64e;</i>
        </el-tooltip>
        <el-tooltip
          class="item"
          effect="dark"
          content="模板助手"
          placement="top"
        >
          <i class="iconfont">&#xe64f;</i>
        </el-tooltip>
      </div>
      <template v-if="linkageRule.length > 0">
        <div class="content" v-for="(item, index) in linkageRule" :key="index">

 src/views/manageCenter/index.vue

@@ -291,13 +291,13 @@
          permission: "statisticMng",
        },

        /*    {
        {
          name: "GB28181",
          icon: "/images/manageCenter/统计查询.png",
          icon: "/images/manageCenter/search.png",
          openPath: "/GB28181Open",
          path: "/GB28181Open",
          permission: "statisticMng",
        }, */
        },
      ],
      timeList: [
        { name: "20.103服务器", time: "9天12小时44分39秒" },

 src/views/search/Searching.vue

@@ -141,6 +141,16 @@
          <p class="p-clear">
            <b class="clear-searching" @click="clearSearch">重置</b>
          </p>
          <el-tooltip
            class="item"
            effect="dark"
            content="配置存储路径"
            placement="bottom"
          >
            <span @click="showSetBox = true" class="iconfont setIcon"
              >&#xe652;</span
            >
          </el-tooltip>
        </div>
        <div ref="mid" style="height: calc(100% - 50px)">
          <div class="left-selection" v-if="VideoPhotoData.uploadDiaplay">
@@ -272,6 +282,7 @@
        </div>
      </hsc-window>
    </hsc-window-style-metal>
    <SetBox v-if="showSetBox" @close="showSetBox = false"></SetBox>
  </div>
</template>

@@ -280,11 +291,13 @@
import UploadImg from "./components/UploadImg";
import bus from "@/main";
import { getUrlKey } from "@/api/utils.ts";
import SetBox from "@/views/search/components/SetBox";
export default {
  name: "RightSide",
  components: {
    Card,
    UploadImg,
    SetBox,
  },
  data() {
    return {
@@ -305,6 +318,7 @@
      ],
      searchText: "",
      currentPage: 1,
      showSetBox: false,
    };
  },
  computed: {
@@ -887,6 +901,12 @@
            color: #2249b4;
          }
        }
        .setIcon {
          margin-left: 10px;
          font-size: 18px;
          color: #1677ff;
          cursor: pointer;
        }
        .clear-searching {
          cursor: pointer;
          text-decoration: underline;

 src/views/search/components/CardWindow.vue

@@ -37,7 +37,7 @@
            ></model-card>
          </el-carousel-item>
        </el-carousel>
        <div class="model-bottom">
        <!-- <div class="model-bottom">
          <p class="model-bottom-left" @click="upPage(item.list, index)">
            <i class="el-icon-arrow-left"></i>
            上一个
@@ -46,7 +46,7 @@
            下一个
            <i class="el-icon-arrow-right"></i>
          </p>
        </div>
        </div> -->
      </hsc-window>
    </hsc-window-style-metal>
  </div>
@@ -251,6 +251,12 @@
  },
};
</script>






<style lang="scss">
.layout {
  min-width: 1350px;

 src/views/search/components/SetBox.vue

New file
@@ -0,0 +1,325 @@
<template>
  <div class="SetBox">
    <div class="title">配置存储路径</div>

    <!-- 创建集群表格 -->
    <el-form
      :model="formData"
      :rules="rules"
      ref="Form"
      label-position="left"
      label-width="150px"
    >
      <el-form-item class="h32" prop="enable" label="是否安装数据库">
        <el-radio-group v-model="formData.enable">
          <el-radio :label="true">是</el-radio>
          <el-radio :label="false">否</el-radio>
        </el-radio-group>
      </el-form-item>

      <el-form-item
        v-if="formData.enable"
        class="h32 ip"
        prop="alarmIp"
        label="数据库存储位置"
      >
        <el-input
          v-model="formData.alarmIp"
          placeholder="例：192.168.20.118：9200"
          class="h32"
        ></el-input>

        <el-input
          v-model="formData.alarmPort"
          placeholder="请输入端口"
          class="h32"
        ></el-input>
      </el-form-item>

      <el-form-item
        v-if="formData.enable"
        class="h32 ip"
        prop="webPicIp"
        label="文件存储位置"
      >
        <el-input
          v-model="formData.webPicIp"
          placeholder="请输入服务器信息"
          class="h32"
        ></el-input>

        <el-input
          v-model="formData.webPicPort"
          placeholder="请输入端口"
          class="h32"
        ></el-input>
      </el-form-item>

      <el-form-item
        v-if="formData.enable"
        class="h32"
        prop="esIsAuth"
        label="数据库验证方式"
      >
        <el-radio-group v-model="formData.esIsAuth">
          <el-radio :label="false">无</el-radio>
          <el-radio :label="true">账户密码验证</el-radio>
        </el-radio-group>
      </el-form-item>

      <el-form-item
        v-if="formData.enable && formData.esIsAuth"
        class="h32"
        prop="esUsername"
        label="数据库账号"
      >
        <el-input
          v-model="formData.esUsername"
          placeholder="请输入数据库账号"
          class="h32"
        ></el-input>
      </el-form-item>

      <el-form-item
        v-if="formData.enable && formData.esIsAuth"
        class="h32"
        prop="esPassword"
        label="数据库密码"
      >
        <el-input
          v-model="formData.esPassword"
          placeholder="请输入数据库密码"
          class="h32"
          type="password"
        ></el-input>
      </el-form-item>
    </el-form>

    <!-- 取消与提交 -->
    <div class="btns">
      <div class="cancel button" @click="close()">取消</div>
      <div class="quit button" @click="submit">确定</div>
    </div>

    <div class="close iconfont" @click="close()">&#xe60f;</div>
  </div>
</template>

<script>
import { config, saveEsConfig } from "@/api/search";

export default {
  created() {
    this.getData();
  },
  data() {
    return {
      formData: {
        id: "", //取get结果中的id   第一次保存传空
        alarmIp: "", //es的ip
        alarmPort: 9200, //es的port
        webPicIp: "", //weedfs的ip
        webPicPort: 6333, //weedfs的port
        enable: false, //启用存储传true,不启用传false
        esIsAuth: false, //es是否开启用户名密码鉴权
        esUsername: "", //开启鉴权，es用户名
        esPassword: "", //es密码
      },
      rules: {
        enable: [
          {
            required: true,
            message: "请选择是否安装数据库",
            trigger: "blur",
          },
        ],
        alarmIp: [
          {
            required: true,
            message: "请输入数据库存储位置",
            trigger: "blur",
          },
        ],
        webPicIp: [
          { required: true, message: "请输入文件存储位置", trigger: "blur" },
        ],
        esIsAuth: [
          {
            required: true,
            message: "请选择数据库验证方式",
            trigger: "blur",
          },
        ],
        esUsername: [
          { required: true, message: "请输入数据库账号", trigger: "blur" },
        ],
        esPassword: [
          { required: true, message: "请输入数据库密码", trigger: "blur" },
        ],
      },
    };
  },
  methods: {
    close() {
      this.$emit("close");
    },
    async getData() {
      const res = await config();
      if (res && res.success) {
        this.formData = res.data;
      }
    },
    submit() {
      this.$refs["Form"].validate(async (valid) => {
        if (valid) {
          const res = await saveEsConfig(this.formData);
          if (res && res.success) {
            this.$notify({
              type: "success",
              message: "保存成功",
            });
            this.close();
          }
        }
      });
    },
  },
};
</script>

<style lang="scss" scoped>
.SetBox {
  position: relative;
  box-sizing: border-box;
  padding: 20px;
  position: fixed;
  width: 520px;
  height: 490px;
  top: 50%;
  left: 50%;
  margin-top: -260px;
  margin-left: -245px;
  filter: drop-shadow(0px 2px 16px rgba(0, 43, 106, 0.25));
  z-index: 3000;
  background-color: #fff;

  .title {
    margin-bottom: 10px;
    padding-bottom: 20px;
    font-size: 18px;
    font-weight: 700;
    border-bottom: 1px solid #e9ebee;
  }

  .el-form-item ::v-deep {
    margin-bottom: 22px;

    label {
      color: #666;
    }

    .el-form-item__error {
      padding-top: 0;
    }

    .el-input {
      .el-input__inner {
        padding: 0 10px;
        color: #3d3d3d;
        border-radius: 0;
        border-color: #c0c5cc;
        &::-webkit-input-placeholder {
          color: #999999;
        }

        &:focus {
          border-color: #0065ff;
        }
      }
    }
  }

  .el-form-item.ip ::v-deep {
    .el-form-item__content {
      display: flex;

      .el-input {
        flex: 1;
      }

      .el-input:first-child {
        margin-right: 10px;
        flex: 2;
      }
    }
  }
  .el-form-item.password ::v-deep {
    .el-form-item__content {
      display: flex;
      justify-content: space-between;

      .el-input {
        margin-left: -4px;
        width: 250px;
      }

      .createPassword {
        font-size: 14px;
        color: #0065ff;
        cursor: pointer;
      }

      .search {
        margin-top: 8px;
        width: 64px;
        height: 24px;
        font-size: 12px;
        line-height: 24px;
        text-align: center;
        background-color: #0065ff;
        color: #fff;
        cursor: pointer;
      }
    }
  }

  .btns {
    padding: 20px 0;
    border-top: 1px solid #e9ebee;
    position: absolute;
    left: 20px;
    right: 20px;
    bottom: 0;
    display: flex;
    justify-content: flex-end;
    text-align: center;
    line-height: 32px;
    font-size: 14px;

    .cancel {
      margin-right: 10px;
      width: 60px;
      height: 32px;
      border: 1px solid #0065ff;
      color: #0065ff;
    }

    .quit {
      width: 60px;
      height: 32px;
      color: #fff;
      background-color: #0065ff;
      border: 1px solid #0065ff;
    }
  }

  .close {
    position: absolute;
    top: 20px;
    right: 20px;
    font-size: 12px;
    color: #666;
    cursor: pointer;
  }
}
</style>

 src/views/search/index.vue

@@ -61,6 +61,10 @@
      })();
    };
  },
  beforeDestroy() {
    sessionStorage.removeItem("clusterId");
    sessionStorage.removeItem("devId");
  },
  methods: {
    parseUrl() {},
    selectCluster(val) {
@@ -198,7 +202,7 @@
}

.search_cluster {
  top: 12px;
  top: 18px;
  left: 172px;
  position: fixed;
  width: 135px;

 vue.config.js

@@ -13,7 +13,7 @@
    // hotOnly: false, // 热更新
    proxy: {
      "/api": {
        // target: "http://192.168.20.10:7004",
        //  target: "http://192.168.20.10:7009",
        target: "http://192.168.20.115:7070",
        // target: "http://192.168.20.235:7070",
        //  target: "http://192.168.20.117:7080",
@@ -33,7 +33,7 @@
      },

      "/ws": {
        target: "http://192.168.20.235:7070",
        target: "http://192.168.20.115:7070",
        // ws: true,
        changeOrigin: true,
      },