混合器agGridCommon-YES开发框架网

// import debounce from 'throttle-debounce/debounce';
import { debounce } from 'throttle-debounce'
import { deepCopy } from '../utils/deepCopy'
import utils from '../utils/utils'

export default {
  data() {
    return {
      gz_____dataSourceChanged: null,
      gz___agGridCommon: {
        scrolls: [],
      },
      ag_defaultColDef: {
        sortable: false,
        resizable: true,
        filter: false,
        suppressMenu: true,
        filterParams: {
          buttons: ['reset'],
          debounceMs: 200,
        },
      },
    }
  },
  directives: {
    // 异步查询时自动显示等待操作
    loading: {
      update(el, binding, vnode) {
        if (binding.value === true) {
          vnode.context.$nextTick(() => {
            vnode.componentInstance.gridOptions.api.showLoadingOverlay()
          })
        } else {
          vnode.context.$nextTick(() => {
            vnode.componentInstance.gridOptions.api.hideOverlay()
          })
        }
      },
    },
    // 多语言指令
    lang: {
      //在绑定指令的时候添加多语言处理
      bind(el, binding, vnode) {
        // vnode.componentInstance.gridOptions.localeTextFunc = vnode.context.loadAGText;
      },
      unbind(el, binding, vnode) {
        // vnode.componentInstance.gridOptions.localeTextFunc = null;
      },
    },
    initContextMenuItems: {
      //在绑定指令的时候添加多语言处理
      bind(el, binding, vnode) {
        vnode.componentInstance.gridOptions.getContextMenuItems =
          vnode.context.getContextMenuItems
      },
      unbind(el, binding, vnode) {
        vnode.componentInstance.gridOptions.getContextMenuItems = null
      },
    },
    // // 数据源改变时，自动调整列宽指令
    // autoResize: {

    //   bind(el, binding, vnode) {
    //     console.log('autoResize bind') // eslint-disable-line
    //
    //     // vnode.context.$nextTick(() => {
    //     //   var v=vnode.componentInstance.gridOptions.api;
    //     //   // vnode.componentInstance.gridOptions.api.showLoadingOverlay();
    //     // });

    //     // vnode.componentInstance.modelUpdated
    //     // vnode.context.gz_____dataSourceChanged = vnode.context.$watch(
    //     //   function () {
    //     //     return vnode.componentInstance.rowData;
    //     //   },
    //     //   function (newVal, oldVal) { // eslint-disable-line
    //     //     console.log('event auto resize') // eslint-disable-line
    //     //     vnode.context.$nextTick(() => {
    //     //       vnode.context.autoSizeColumns(vnode.componentInstance.gridOptions);
    //     //     });

    //     //   }
    //     // );
    //   },
    //   unbind(el, binding, vnode) {
    //     // console.log('autoResize unbind') // eslint-disable-line
    //     vnode.context.gz_____dataSourceChanged = null;
    //     vnode.context.$watch(
    //       function () {
    //         return vnode.componentInstance.rowData;
    //       }, null);
    //   }
    // },
    agScroll: {
      bind(el, binding, vnode) {
        // console.log('ag Scroll bind')
        vnode.context.$nextTick(() => {
          var v = el.getElementsByClassName('ag-body-viewport')[0]
          // console.log('指令：agScroll bind') // eslint-disable-line
          if (v) {
            var obj = {
              _source: el,
              _el: v,
              _scrollTop: 0,
              _scrollLeft: 0,
            }
            vnode.context.gz___agGridCommon.scrolls.push(obj)
            // v.onscroll = function () {
            //     obj._scrollTop = this.scrollTop;
            //     obj._scrollLeft = this.scrollLeft;
            //     // console.log(vnode.context._scrollTop)
            // };
            v.onscroll = debounce(200, () => {
              vnode.context.saveScroll()
            })
          }
        })
      },
      unbind(el, binding, vnode) {
        // console.log('指令：agScroll unbind') // eslint-disable-line
        // var length = vnode.context.gz___agGridCommon.scrolls.length;
        // for (var i = 0; i < length; i++) {
        //     if (vnode.context.gz___agGridCommon.scrolls[i]._source === el) {
        //         console.log('删除前：' + vnode.context.gz___agGridCommon.scrolls.length)
        //         vnode.context.gz___agGridCommon.scrolls.splice(i, 1);
        //         console.log('删除后：' + vnode.context.gz___agGridCommon.scrolls.length)
        //         return
        //     }
        // }
      },
    },
  },
  computed: {},
  deactivated() {
    // this.saveScroll();
  },
  activated() {
    this.loadScroll()
  },
  mounted() {},
  beforeDestroy() {
    this.gz___agGridCommon.scrolls.forEach((item) => {
      item._el.onscroll = null
    })
    this.gz___agGridCommon.scrolls = []
    // var length = vnode.context.gz___agGridCommon.scrolls.length;
    // for (var i = 0; i < length; i++) {

    //     // if (vnode.context.gz___agGridCommon.scrolls[i]._source === el) {
    //     //     console.log('删除前：' + vnode.context.gz___agGridCommon.scrolls.length)

    //     //     vnode.context.gz___agGridCommon.scrolls.splice(i, 1);
    //     //     console.log('删除后：' + vnode.context.gz___agGridCommon.scrolls.length)
    //     //     return
    //     // }
    // }
  },
  methods: {
    getDataSource(callback) {
      var me = this
      return {
        rowCount: null,
        getRows: function (params) {
          // console.log('asking for ' + params.startRow + ' to ' + params.endRow);
          // requestEngsysSupplier
          //   .search(me, options)
          //   .then(res => {
          //     params.successCallback(res.data.data, res.data.total);
          //   })
          //   .catch(() => {
          //
          //     params.failCallback();
          //   });

          var options = me.getSearchOptions(params)
          callback(params, options)
        },
      }
    },
    getSearchOptions(params) {
      var options = {
        startRow: params.request.startRow,
        endRow: params.request.endRow,
        sortModel: [],
        filterModel: {},
      }
      if (params.request.sortModel) {
        params.request.sortModel.forEach((item) => {
          options.sortModel.push({
            colId: item.colId,
            sort: item.sort,
          })
        })
      }
      var me = this
      if (params.request.filterModel) {
        Object.keys(params.request.filterModel).forEach((key) => {
          var obj = params.request.filterModel[key]
          var filter = deepCopy(obj)
          if (!!obj.isCustomer == false) {
            if (!!filter.operator == true) {
              filter.conditions = [filter.condition1, filter.condition2]
              delete filter.condition1
              delete filter.condition2
            }
          }
          options.filterModel[key] = filter
          // {
          //   filterType: obj.filterType,
          //   isMultiple: !!obj.operator,
          //   filterSource: JSON.stringify(obj),
          // }
        })
      }
      return options
    },
    saveScroll() {
      // console.log('save scroll')
      var me = this
      me.gz___agGridCommon.scrolls.forEach((item) => {
        item._scrollLeft = item._el.scrollLeft
        item._scrollTop = item._el.scrollTop
      })
    },
    loadScroll() {
      var me = this
      me.gz___agGridCommon.scrolls.forEach((item) => {
        item._el.scrollLeft = item._scrollLeft
        // console.log('agGridCommon.agScroll _el.scrollTop：' + item._el.scrollTop) // eslint-disable-line
        item._el.scrollTop = item._scrollTop + 10
        this.$nextTick(() => {
          item._el.scrollTop = item._scrollTop - 10
        })
      })
    },
    getDataPath(data) {
      // console.log('fds')
      var id = ''
      if (utils.isNULL(data.parentFullID)) id = data.rowID
      else id = data.parentFullID + '//' + data.rowID
      var v = id.split('/')
      for (var i = v.length; i > 0; i--) {
        if (utils.isNULL(v[i - 1])) v.splice(i - 1, 1)
      }
      // console.log(v);
      return v
    },
    getContextMenuItems(params) {
      var v = []
      if (params.column && params.column.colDef) {
        v.push(this.cmiCopyCurrentCell(params))
        v.push('separator')
      }
      if (params.defaultItems) {
        params.defaultItems.forEach((item) => {
          v.push(item)
        })
      }
      return v
    },
    cmiCopyCurrentCell(params) {
      var me = this
      return {
        name: '复制 [' + params.column.colDef.headerName + ']',
        action: function () {
          // console.log('复制'); // eslint-disable-line
          // console.log(params)
          // console.log(params.column.colDef.cellRendererParams.innerRenderer)
          // console.log(params.column.colDef.cellRendererParams.innerRenderer.eGui)
          utils.copyText(params.value)
        },
      }
    },
    autoSizeColumns(params) {
      var me = this
      if (me._inactive) return
      if (params.columnApi) {
        var allColumnIds = []
        params.columnApi.getAllColumns().forEach(function (column) {
          if (!column.colDef.suppressSizeToFit) {
            allColumnIds.push(column.colId)
          }
        })
        setTimeout(() => {
          params.columnApi.autoSizeColumns(allColumnIds, false)
          // params.columnApi.columnController.bodyWidth
          // params.api.gridPanel.centerWidth
          // if (e.clientWidth >= e.columnApi.columnController.bodyWidth) {
          //   this.gridOptions.columnApi.setColumnPinned("options", null)
          // } else {
          //   this.gridOptions.columnApi.setColumnPinned("options", "right")
          // }

          this.gridSizeChanged({
            clientWidth: params.api.gridPanel.centerWidth,
            columnApi: params.columnApi,
          })
        }, 300)
      }
    },
    gridSizeChanged(e) {},
    doGetSelect(params) {
      var selectedRows = params.api.getSelectedRows()
      var v = selectedRows[0]
      return v
    },
    loadAGText(key, defaultValue) {
      var v = this.$t('agGrid.' + key)
      if (!v || v === 'agGrid.' + key) v = defaultValue
      return v
    },
  },
}