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

统一公共服务组件

/*
 * @Author: Jason Liu
 * @Date: 2023-11-02 15:02:23
 * @Desc:
 */
const $dataSource = require('../../api/appService/dataSource.js');

export default {
  props: {
    value: {
      type: String,
      default: undefined,
    },
    //配置信息
    option: {
      type: Object,
      default: () => {
        return {
          clusterId: undefined,
          dbId: undefined, //数据源ID
          dbSchema: undefined, //SchemaName
          tableCode: undefined, //数据表
          columnName: undefined, //字段名
        };
      },
    },
    title: {
      type: String,
      default: $t('字段'),
    },
    filter: {
      type: Array,
    },
    datas: {
      type: Array,
      default: () => {
        return [];
      },
    },
  },
  watch: {
    value(val) {
      this.columnInfo = val;
    },
    columnInfo(val) {
      this.$emit('input', val);
    },
    option: {
      deep: true,
      immediate: true,
      handler(newValue, oldValue) {
        this.getColumns();
      },
    },
    datas() {
      this.setColumns();
    },
  },
  data() {
    return {
      loading: false,
      columnInfo: this.value,
      columnList: [],
    };
  },
  created() {
    this.getColumns();
  },
  methods: {
    /**
     * @Author: Jason Liu
     * @description: 设置列数据内容
     */
    setColumns() {
      if (this.datas.length > 0) {
        this.columnList = this.datas;
      } else {
        this.getColumns();
      }
    },
    getColumns() {
      this.columnList = [];
      if (this.option.tableCode) {
        this.loading = true;
        $dataSource
          .collectionDataInfo({
            clusterId: this.option.clusterId, //集群ID
            collectType: 'column', // 采集类型：schema、table、column
            dsId: this.option.dbId,
            schema: this.option.dbSchema,
            tableName: this.option.tableCode,
          })
          .then((req) => {
            let info = req.data;
            if (this.filter && this.filter.length > 0) {
              info = req.data.filter((item) => {
                return this.filter.indexOf(item.columnType) > -1;
              });
            }
            this.columnList = info.map((item) => {
              return {
                label: item.columnName,
                value: item.columnName,
              };
            });

            this.$emit('column', info);
          })
          .finally(() => {
            this.loading = false;
          });
      }
    },
    changeColumn() {
      this.$emit('input', this.columnInfo);
      this.$emit('change', this.columnInfo);
    },
  },
};