w-vue-middle/dataSourceService/sourceSelection/service.js

统一公共服务组件

/*
 * @Author: Jason Liu
 * @Date: 2023-07-17 16:10:28
 * @Desc:
 */

//数据源服务
const $dataSource = require("../../api/appService/dataSource.js");
export default {
  props: {
    value: {
      type: Object,
      default: () => {
        return {
          clusterId: undefined,
          dbId: undefined, //数据源ID
          dbSchema: undefined //SchemaName
        };
      }
    }
  },
  data() {
    return {
      loading: false,
      viewDetail: false,
      dataSource: [], //数据源信息
      viewSourceList: [], //显示的数据源
      sourceRoute: [],
      dataKey: 0,
      expandAll: false,
      sourceInfo: {
        dbId: undefined, //数据源ID,
        dbName: undefined,
        schemaId: undefined,
        schemaName: undefined
      }
    };
  },
  created() {
    this.getDatasourceList();
  },
  methods: {
    getPopupContainer() {
      return this.$refs.main;
    },
    /**
         * @Author: Jason Liu
         * @description: 获取查看的数据源
         */
    getViewSourceList(value = undefined) {
      if (value) {
        let str = value.toLocaleLowerCase();
        let parentIds = [];
        // let tempViewSourceList = this.dataSource
        //   .filter(item => {
        //     let has =
        //       item.allName &&
        //       item.allName.toLocaleLowerCase().indexOf(str) > -1;
        //     if (has) {
        //       parentIds.push(item.parentId);
        //     }
        //     return has;
        //   })
        //   .map(item => {
        //     return item;
        //   });
        let dbList = [];
        this.dataSource.filter(item => {
          let has =
            item.name && item.name.toLocaleLowerCase().indexOf(str) > -1;
          if (has) {
            dbList.push(item.id);
            if (item.parentId) {
              dbList.push(item.parentId);
            } else if (item.children) {
              item.children.forEach(child => {
                dbList.push(child.id);
              });
            }
          }
          return has;
        });
        let mapIds = [...new Set(dbList)];
        this.viewSourceList = this.dataSource.filter(item => {
          return mapIds.indexOf(item.id) > -1;
        });
        this.expandAll = true;
      } else {
        this.viewSourceList = this.dataSource;
      }
      this.dataKey++;
    },
    /**
         * @Author: Jason Liu
         * @description: 转换数据源信息
         */
    parseDbData(
      value = {
        dbId: undefined,
        schemaId: undefined,
        dbSchema: undefined,
        schema: undefined
      }
    ) {
      if (value && value.dbId) {
        this.sourceRoute = [
          value.dbId,
          value.dbSchema || value.schemaId || value.schema
        ];
        const schemaId = value.schemaId || value.dbSchema || value.schema;
        const inData = this.dataSource.find(item => {
          return item.parentId == value.dbId && item.schemaId == schemaId;
        });

        this.sourceInfo = {
          dbId: inData ? inData.parentId : value.dbId, //数据源ID,
          dbName: inData ? inData.parentName : value.dbId,
          schemaId: schemaId,
          schemaName: inData ? inData.name : schemaId
        };
      } else {
        this.sourceInfo = {
          dbId: undefined, //数据源ID,
          dbName: undefined,
          schemaId: undefined,
          schemaName: undefined
        };
      }
      this.getViewSourceList();
    },
    /**
         * @Author: Jason Liu
         * @description: 采集数据表信息
         */
    getDatasourceList() {
      this.loading = true;
      $dataSource
        .getDatasourceList()
        .then(req => {
          let dataList = [];
          req.data.forEach(item => {
            if (!!item.schemas) {
              dataList.push({
                clusterId: item.clusterId,
                orgId: item.orgId,
                port: item.port,
                type: item.type,
                dbName: item.dbName,
                ip: item.ip,
                id: item.datasourceId,
                dataType: "source",
                name: item.name
              });
              item.schemas.forEach(schema => {
                dataList.push({
                  schemaId: schema.schemaCode,
                  id: `${item.datasourceId}.${schema.schemaCode}`,
                  parentId: item.datasourceId,
                  parentName: item.name,
                  allName: `${item.name}.${schema.schemaCode}`,
                  dataType: "schema",
                  name: schema.schemaCode
                });
              });
            }
          });
          this.dataSource = dataList;
        })
        .finally(() => {
          this.loading = false;
          this.parseDbData(this.value);
        });
    },
    /**
         * @Author: Jason Liu
         * @description: 选择数据源信息
         */
    clickSource({ schemaId, parentId }) {
      this.parseDbData({ dbId: parentId, schemaId: schemaId });
      this.changeDataSource();
      setTimeout(() => {
        this.viewDetail = false;
      }, 300);
    },
    /**
         * @Author: Jason Liu
         * @description: 修改数据源事件
         */
    changeDataSource() {
      const { dbId, schemaId } = this.sourceInfo;
      const { clusterId, orgId, port, type, dbName, ip } =
        this.dataSource.find(source => {
          return source.id == dbId;
        }) || {};

      this.$emit("input", {
        ...this.value,
        clusterId,
        orgId,
        port,
        dbName,
        ip,
        dbType: type,
        dbId: dbId, //数据源ID
        schema: schemaId,
        dbSchema: schemaId, //SchemaName
        schemaId: schemaId //SchemaName
      });

      this.$emit("change");
    },
    /**
         * @Author: Jason Liu
         * @description: 是否选择
         */
    hasActive(row) {
      const { dbId, schemaId } = this.sourceInfo;
      return row.id == `${dbId}.${schemaId}` ? "active" : "";
    }
  },
  watch: {
    value(val) {
      this.parseDbData(val);
    },
    viewDetail(val) {
      if (val) {
        setTimeout(() => {
          if (this.$refs.searchInput) {
            this.$refs.searchInput.focus();
          }
        }, 100);
        this.getViewSourceList();
      }
    }
  }
};