w-vue-middle/components/winModelDesign/modelPreview/service.js

统一公共服务组件

/*
 * @Author: Jason Liu
 * @Date: 2023-01-06 15:08:26
 * @Desc:
 */

export default {
  name: 'modelPreview',
  props: {
    value: {
      type: Array,
      default: () => {
        return [];
      },
    },
    dataList: {
      type: Array,
      default: () => {
        return [];
      },
    },
    loading: {
      type: Boolean,
      default: false,
    },
  },
  data() {
    return {
      table: this.value,
      gridOptions: {
        data: [],
        columns: [],
      }, //表头信息
    };
  },
  created() {
    this.parseColumns();
  },
  methods: {
    /**
     * @Author: Jason Liu
     * @description: 解析表头信息
     */
    parseColumns() {
      this.gridOptions.columns = [];
      let columns = [{ title: $t('序号'), width: 50, type: 'seq' }];
      this.table.forEach((table) => {
        table.columns.forEach((column) => {
          if (column.visible) {
            let width = column.name.length * 20;
            if (width < 100) {
              width = 100;
            }

            columns.push({
              field: column.columnName.toLocaleLowerCase(),
              title: column.name,
              id: column.id,
              sortNumber: column.sortNumber,
              width: `${width}px`,
            });
          }
        });
      });

      this.gridOptions.columns = columns.sort((o, l) => {
        return o.sortNumber - l.sortNumber;
      });
      this.parseData();

      // const loadColumn = () => {
      //     if (this.$refs.xGrid) {
      //         this.$refs.xGrid.loadColumn(columns);

      //     } else {
      //         setTimeout(() => {
      //             loadColumn()
      //         }, 100);
      //     }
      // }
      // loadColumn();
    },
    /**
     * @Author: Jason Liu
     * @description: 重新解析表信息
     */
    resetColumn() {
      this.parseColumns();
    },
    /**
     * @Author: Jason Liu
     * @description: 解析表格
     */
    parseData() {
      let dataList = [...this.dataList];
      if (dataList.length < 10) {
        let length = 10 - dataList.length;
        for (let index = 0; index < length; index++) {
          dataList.push({ id: index });
        }
      }
      this.gridOptions.data = dataList;
      const loadData = () => {
        if (this.$refs.xGrid) {
          this.$refs.xGrid.loadData(dataList);
        }
      };

      //loadData();
    },
  },
  watch: {
    value(val) {
      this.table = this.value;
      //this.parseColumns();
    },
    dataList() {
      this.parseData();
    },
  },
};