pc-component-v5/packages/info/src/QueryPage.vue

<template>
  <div
    class="flex-container"
    :class="{'flex-container-modal': isSearchWidget == true, 'flex-container' : (isSearchWidget == null || isSearchWidget == false)}"
  >
    <div class="flex-header">
      <div
        class="panel panel-default"
        style="margin-bottom: 5px;"
      >
        <div
          class="panel-heading"
          style="padding: 0px;"
        >
          <InfoHeader
            :html-help-url="infoWindowDto.htmlHelpUrl"
            :info-grid-fields="infoGridFields"
            :header-name="infoWindowDto.name"
            :info-filter-fields="infoFilterFields"
            :info-window-no="infoWindowDto.no"
            @filter-field-property-changed="filterFieldPropertyChanged($event)"
            @grid-field-property-changed="gridFieldPropertyChanged($event)"
          />
        </div>
        <div
          class="panel-body"
          style="padding-bottom: 5px; padding-top: 8px;"
        >
          <QueryCondition
            ref="queryCondition"
            :info-filter-fields="infoFilterFields"
            :info-buttons="infoWindowDto.infoButtons"
            :is-search-widget="isSearchWidget"
            :show-button="true"
            :info-window-no="infoWindowDto.no"
            @simple-search="simpleSearch"
            @complex-search="complexSearch"
            @refresh-search="pageSearch"
            @execute-process="executeProcess($event)"
            @execute-export="executeExport"
          />
        </div>
      </div>
    </div>
    <div class="flex-content">
      <div
        :id="tableOutDivId"
        class="flex-main table-fix-head"
      >
        <table
          class="fixed-table table-striped table-bordered"
          :width="tableWidth"
          height="40px"
        >
          <thead>
            <tr height="40px">
              <th width="50px">{{ $t('lang.QueryPage.serialNumber') }}</th>
              <th
                width="30px"
                class="text-center"
                :class="{'mulitiple-select': multipleSelect}"
                @click.self="changeSelectMode"
              >
                <input
                  v-model="isSelectAll"
                  autocomplete="off"
                  type="checkbox"
                />
              </th>
              <th
                v-for="(infoGridField) in infoGridFields"
                v-show="infoGridField.isShow"
                :key="infoGridField.fieldName"
                :width="infoGridField.width + 'px'"
                @dragover="ondragover($event, infoGridField)"
                @click="onSort(infoGridField)"
              >
                <div
                  :id="'infoGridFieldId_' + infoGridField.fieldName"
                  class="rz-handle"
                  draggable="true"
                  @dragstart="ondragstart($event, infoGridField)"
                  @drag="ondrag($event, infoGridField)"
                  @dragend="ondragend($event, infoGridField)"
                />

                <div
                  v-tooltip.right="Language.getHelpTrl($i18n.locale, infoGridField)"
                  class="td-max"
                >
                  {{ Language.getNameTrl($i18n.locale, infoGridField) }}
                </div>
              </th>
            </tr>
          </thead>
          <tbody>
            <tr
              v-for="(item1,index) in infoWindowData.dataList"
              :key="'tr' + item1.id"
              height="40px"
              :class="{'warning':item1.select}"
              @dblclick="selectNode(item1)"
            >
              <td style="text-align: center;">{{ index+1+(pagination.current_page-1)*pagination.per_page }}</td>

              <td class="text-center">
                <input
                  autocomplete="off"
                  type="checkbox"
                  :checked="item1.select"
                  @click.self="selectNodeForSearch(item1)"
                />
              </td>
              <td
                v-for="item2 in infoGridFields"
                v-show="item2.isShow"
                id="item.id"
                :key="'td-' + item2.id"
              >
                <span v-if="item2.simpleDisplayType == 'Image'">
                  <QueryPageImage
                    v-if="item1.data[item2.fieldName] != undefined"
                    :class-name="item2.selectClause"
                    :image-names="item1.data[item2.fieldName].displayValue[0]"
                  />
                </span>
                <span v-else>
                  {{ item1.data[item2.fieldName] != undefined ? item1.data[item2.fieldName].displayValue[0] : "" }}
                </span>
              </td>
            </tr>
          </tbody>
        </table>
      </div>
    </div>
    <div
      class="flex-footer"
      style="margin-top: 10px;"
    >
      <div class="pull-left">
        <span>{{ $t('lang.QueryPage.the') }}
          {{ (pagination.current_page-1)*pagination.per_page+1 }}
          -
          {{ pagination.current_page*pagination.per_page }}
          {{ $t('lang.QueryPage.strip') }}
          ,
          {{ $t('lang.QueryPage.total') }}
          {{ pagination.total }}
          {{ $t('lang.QueryPage.strip') }}
          ,
          {{ $t('lang.QueryPage.displayOnEachPage') }}
        </span>
        <PageSizeSelect @page-size-changed="gridSizeSelect" />
        <span>{{ $t('lang.QueryPage.strip') }}</span>
      </div>
      <div class="pull-right">
        <Pagination
          :pagination="pagination"
          :callback="pageSearch"
        />
      </div>
    </div>
    <Loading v-if="loading" />
    <Modal v-model:show="modal">
      <template #default>
        <ProcessReportResult
          :process-report-result="processReportResult"
          :pdf-only="pdfOnly"
          :excel-only="excelOnly"
        />
      </template>
      <template #header>
        <div>{{ $t('lang.QueryPage.resultsOfEnforcement') }}</div>
      </template>
    </Modal>
  </div>
</template>

<script>
import Common from '../../common/Common.js';
import Modal from '../../modal/src/Modal.vue';

import PageSizeSelect from '../../page-size-select/src/PageSizeSelect.vue';
import Pagination from '../../vue-bootstrap-pagination/src/vue-bootstrap-pagination.vue';

import QueryCondition from './QueryCondition.vue';
import InfoHeader from './InfoHeader.vue';
import InfoUtil from './InfoUtil.js';
import Notify from '../../common/Notify.js';

import Loading from '../../loading/src/Loading.vue';
import ProcessReportResult from '../../process/src/ProcessReportResult.vue';
import Uuid from '../../common/Uuid.js';
import QueryPageImage from './QueryPageImage.vue';

import DownloadService from '../../common/DownloadService.js';
import HtmlWindowResource from '../../html-window/src/api/HtmlWindowResource.js';
import CustomerWindowResource from '../../customer-window/src/api/CustomerWindowResource.js';
import ProcessReportResource from '../../process/src/api/ProcessReportResource.js';

import UserStorageResource from '../../common/UserStorageResource.js';

import Language from '../../common/Language.js';

import moment from 'moment';

export default {

  name: 'QueryPage',

  components: {
    Pagination,
    QueryCondition,
    Modal,
    InfoHeader,
    Loading,
    ProcessReportResult,
    PageSizeSelect,
    QueryPageImage,
  },

  
  props: {
    'whereClauseSource':{
      type: Object,
      default(){
        return null;
      },
    },  
    'isSearchWidget':{
      type: Boolean,
      default: false,
    }, 
    'parentModelData': {
      type: Object,
      default(){
        return null;
      },
    },
    'modelData': {
      type: Object,
      default(){
        return null;
      },
    },
    'fieldValue': {
      type: Object,
      default(){
        return null;
      },
    },
    /**
     * 是否多选
     */
    'multiple': {
      type: Boolean,
      default: false,
    },
  },

  emits: ['dataSelected'],

  data: function () {
    this.Language = Language;
    return {
      infoWindowDto: {},
      queryResult: {},
      infoWindowData: {},
      pagination: {
        total: 0,
        per_page: Common.pageSize,    // required
        current_page: 1, // required
        last_page: 10,    // required
      },
      isSelectAll: false,
      infoQueryParam: [],
      processReportResult: [],
      multipleSelect: false,
      uuid: Uuid.createUUID(),
      sortStr: '',// 排序
      sortStyle: ' ASC',
      currentIsSimpleSearch: true,
      startX: '',
      startWidth: '',
      processReportDto: '',
      pdfOnly: '',
      excelOnly: '',
      infoGridFields: [],
      infoFilterFields: [],
      // 表格外面的DIV的id
      tableOutDivId: Uuid.createUUID(),
      loading: false,
      modal: false,
    };
  },
  computed: {
    tableWidth: function () {
      var totalWidth = 50;
      if (this.infoWindowDto != undefined && this.infoGridFields != undefined) {
        this.infoGridFields.forEach(function (item) {
          if (item.isShow) {
            totalWidth += Number(item.width);
          }
        });
      }
      return totalWidth + 'px';
    },
  },
  watch: {

    /**
         * 是否选择了全部的数据
         */
    isSelectAll: function (val) {
      var _self = this;
      if (_self.multipleSelect) {
        if (_self.isSelectAll) {
          if (val) {
            _self.infoWindowData.dataList.forEach(function (item) {
              item.select = true;
            });
          }
        } else {
          _self.infoWindowData.dataList.forEach(function (item) {
            item.select = false;
          });
        }
      } else {
        _self.isSelectAll = false;
      }
    },

    // /**
    //  * 路由发生改变
    //  */
    // $route: function (to, from) {
    //   var _self = this;
    //   _self.infoWindowData = {};
    // },



    multiple: {
      handler: function(newValue, oldValue){
        this.multipleSelect = newValue;
      },
      immediate: true,
    },
  },

  methods: {
    // 页码数量改变
    gridSizeSelect: function (newPageSize) {
      this.pagination.per_page = newPageSize;
      this.pagination.current_page = 1;
    },

    ondragstart: function (event, gridFieldItem) {
      var _self = this;
      _self.startX = event.pageX;
      _self.startWidth = Number(gridFieldItem.width);
      event.dataTransfer.setDragImage(event.target, 0, 20);
      event.dataTransfer.effectAllowed = 'move';
    },

    ondrag: function (event, gridFieldItem) {
      var _self = this;
      gridFieldItem.width = _self.startWidth + (event.pageX - _self.startX);
    },

    ondragend: function (event, gridFieldItem, index) {
      var _self = this;
      let newWidth = _self.startWidth + (event.pageX - _self.startX);
      if (newWidth < 50) {
        newWidth = 50;
      }
      gridFieldItem.width = newWidth;

      InfoUtil.saveInfoGridFields(_self.infoWindowDto.no, _self.infoGridFields);

    },


    ondragover: function (event, gridFieldItem) {
      event.preventDefault();
      event.dataTransfer.dropEffect = 'move';
    },


    // 初始化数据
    initWidget: function (data) {
      var _self = this;
      if (data == undefined) {
        return;
      }

      _self.infoWindowDto = data;
      _self.infoFilterFields = data.infoFilterFields;
      _self.infoGridFields = data.infoGridFields;
      // var sortNo = 10;
      _self.infoGridFields.forEach(function (item) {
        item.width = 150;
      });
      _self.infoFilterFields.forEach(function (item) {
        item.value = {
          'infoFilterFieldId': item.id,
          'value1': '',
          'value2': '',
        };
      });
      InfoUtil.restoreInfoFilterFields(_self.infoWindowDto.no, _self.infoFilterFields);
      InfoUtil.restoreInfoGridFields(_self.infoWindowDto.no, _self.infoGridFields);


      _self.simpleSearch();
    },

    complexSearch: function () {
      var _self = this;
      _self.pagination.current_page = 1;
      var infoQueryParam = {
        infoWindowNo: _self.infoWindowDto.no,
        start: (_self.pagination.current_page - 1) * _self.pagination.per_page,
        length: _self.pagination.per_page,
        sortClause: '',
        infoFilterFieldValues: _self.$refs.queryCondition.getQueryCondition(),
        whereClauseSource: _self.whereClauseSource,
        parentModelData: _self.parentModelData,
        modelData: _self.modelData,
        isSearchWidget: _self.isSearchWidget,
      };
      _self.infoQueryParam = infoQueryParam;
      _self.currentIsSimpleSearch = false;
      _self.queryInfoWindowDataComplex();
    },

    pageSearch: function () {
      var _self = this;
      _self.infoQueryParam.start = (_self.pagination.current_page - 1) * _self.pagination.per_page;
      _self.infoQueryParam.length = _self.pagination.per_page;
      var isSimpleQuery = _self.$refs.queryCondition.isSimpleQuery();
      if (isSimpleQuery) {
        _self.queryInfoWindowDataSimple();
      } else {
        _self.queryInfoWindowDataComplex();
      }
    },

    /**
       * 简单查询
       * @return {void} 
       */
    simpleSearch: function () {
      var _self = this;
      _self.pagination.current_page = 1;
      var infoQueryParam = {
        infoWindowNo: _self.infoWindowDto.no,
        start: (_self.pagination.current_page - 1) * _self.pagination.per_page,
        length: _self.pagination.per_page,
        sortClause: '',
        infoFilterFieldValues: _self.$refs.queryCondition.getQueryCondition(),
        whereClauseSource: _self.whereClauseSource,
        parentModelData: _self.parentModelData,
        modelData: _self.modelData,
        isSearchWidget: _self.isSearchWidget,
      };
      _self.infoQueryParam = infoQueryParam;
      _self.currentIsSimpleSearch = true;
      _self.queryInfoWindowDataSimple();
    },

    queryInfoWindowDataComplex: function () {
      var _self = this;
      _self.loading=true;
      $.ajax({
        url: Common.getApiURL('InfoWindowResource/queryInfoWindowDataComplex'),
        type: 'post',
        dataType: 'json',
        beforeSend: function (request) {
          Common.addTokenToRequest(request);
        },
        contentType: 'application/json',
        data: JSON.stringify(_self.infoQueryParam),
        success: function (data) {
          _self.loading=false;
          
          _self.setSelectedFlag(data);
          _self.infoWindowData = data;

          _self.pagination.total = data.totalSize;
          _self.pagination.last_page = Math.ceil(data.totalSize / data.range.length);

          _self.fixedTableHeader();
        },
        error: function (XMLHttpRequest, textStatus, errorThrown) {
          _self.loading=false;
          Common.processException(XMLHttpRequest, textStatus, errorThrown);
        },
      });
    },

    /**
     * 设置数据是否被已经被选中。
     */
    setSelectedFlag: function(data){
      let _self = this;
      let selectedIds = null;
      let selectedId =null;

      if(_self.fieldValue != null){
        selectedIds = _self.fieldValue.ids;
        selectedId = _self.fieldValue.id;
      }

      data.dataList.forEach(function (item) {
        if(selectedIds != null && selectedIds.indexOf(item.id) >= 0){
          item.select = true;
        }else if(selectedId != null && selectedId == item.id){
          item.select = true;
        }else{
          item.select = false;
        }
      });
    },

    queryInfoWindowDataSimple: function () {
      var _self = this;
      if (_self.$refs.loading) {
        _self.loading=true;
      }

      _self.infoQueryParam.whereClauseSource = _self.whereClauseSource;
      $.ajax({
        url: Common.getApiURL('InfoWindowResource/queryInfoWindowDataSimple'),
        type: 'post',
        dataType: 'json',
        beforeSend: function (request) {
          Common.addTokenToRequest(request);
        },
        contentType: 'application/json',
        data: JSON.stringify(_self.infoQueryParam),
        success: function (data) {
          if (_self.$refs.loading) {
            _self.loading=false;
          }
          _self.setSelectedFlag(data);
          _self.infoWindowData = data;

          _self.pagination.total = data.totalSize;
          _self.pagination.last_page = Math.ceil(data.totalSize / data.range.length);

          _self.fixedTableHeader();
        },
        error: function (XMLHttpRequest, textStatus, errorThrown) {
          if (_self.$refs.loading) {
            _self.loading=false;
          }
          Common.processException(XMLHttpRequest, textStatus, errorThrown);
        },
      });
    },

    /**
         * 双击表格行事件
         */
    selectNode: function (modelData) {
      this.$emit('dataSelected', modelData);
    },

    /**
     * 选择/取消选择表格行中的复选框事件
     */
    selectNodeForSearch: function (modelData) {
      var _self = this;
      
      var currentStatus = modelData.select;
      if (!_self.multipleSelect) {
        _self.infoWindowData.dataList.forEach(function (item) {
          item.select = false;
        });
      }

      modelData.select = !currentStatus;

      if (modelData.select === true) {
        _self.$emit('dataSelected', modelData);
      } else {
        _self.$emit('deleteSelected', modelData);
      }
    },

    /**
     * 获取选择的数据
     */
    getSelectedModelDatas: function (data) {
      var _self = this;
      var tempSelectedModelDatas = [];
      
      if(_self.infoWindowData != null && _self.infoWindowData.dataList != null){
        _self.infoWindowData.dataList.forEach(function (item) {
          if(item.select == true){
            tempSelectedModelDatas.push(item);
          }
        });
      }

      return tempSelectedModelDatas;
    },

    /**
         * 条件字段属性发生改变
         */
    filterFieldPropertyChanged: function (infoFilterFieldsClone) {
      let _self = this;
      InfoUtil.saveInfoFilterFields(_self.infoWindowDto.no, infoFilterFieldsClone).then(successData => {
        InfoUtil.restoreInfoFilterFields(_self.infoWindowDto.no, _self.infoFilterFields);
      }, errorData => {
        console.log(errorData);
      });
    },

    /**
         * 表格字段属性发生改变
         */
    gridFieldPropertyChanged: function (infoGridFieldsClone) {
      let _self = this;
      InfoUtil.saveInfoGridFields(_self.infoWindowDto.no, infoGridFieldsClone).then(successData => {
        InfoUtil.restoreInfoGridFields(_self.infoWindowDto.no, _self.infoGridFields);
      }, errorData => {
        console.log(errorData);
      });
    },

    /**
         * 执行流程
         * @param  {Object} infoButton 
         * @return {void}             
         */
    executeProcess: function (infoButton) {
      var _self = this;

      if (infoButton == null) {
        return;
      }

      let tempSelectedModelDatas = _self.getSelectedModelDatas();
      if (infoButton.htmlWindowNo != null && infoButton.htmlWindowNo.length > 0) {
        HtmlWindowResource.uniqueByNo(infoButton.htmlWindowNo).then(htmlWindowDto => {
          if (htmlWindowDto != undefined) {
            var htmlWindowUrl = htmlWindowDto.htmlFileName;
            var autoCloseInterval = htmlWindowDto.autoCloseInterval;
            var regExp = new RegExp('[{].*?[}]', 'g');
            var result = htmlWindowUrl.match(regExp);
            if (htmlWindowUrl != undefined && htmlWindowUrl != '') {
              for (var index = 0, len = result.length; index < len; index++) {
                var tempResult = result[index];
                console.log('{' + tempResult + '}匹配');
                if (tempResult == '{URL}') {
                  htmlWindowUrl = htmlWindowUrl.replace('{URL}', Common.getRedirectUrl(''));
                  console.log('{' + htmlWindowUrl + '}地址');
                } else if (tempResult == '{RecordId}') {
                  if (tempSelectedModelDatas.length == 0) {
                    Notify.error('错误', '未选择可操作的数据', true);
                    return;
                  }
                  htmlWindowUrl = htmlWindowUrl.replace('{RecordId}', _self.getFirstSelectRecordId());
                } else if (tempResult == '{RecordIds}') {
                  if (tempSelectedModelDatas.length == 0) {
                    Notify.error('错误', '未选择可操作的数据', true);
                    return;
                  }
                  htmlWindowUrl = htmlWindowUrl.replace('{RecordIds}', _self.getSelectedRecordIds());
                } else if (tempResult == '{Token}') {
                  htmlWindowUrl = htmlWindowUrl.replace('{Token}', Common.getToken());
                } else if (tempResult == '{infoWindowNo}') {
                  htmlWindowUrl = htmlWindowUrl.replace('{infoWindowNo}', _self.infoWindowDto.no);
                } else {
                  if (tempSelectedModelDatas.length == 0) {
                    Notify.error('错误', '未选择可操作的数据', true);
                    return;
                  } else if (tempSelectedModelDatas.length > 1) {
                    Notify.error('错误', '请选择一条数据', true);
                    return;
                  }
                  var tempResult1 = tempResult.replace('{', '').replace('}', '');
                  htmlWindowUrl = htmlWindowUrl.replace(tempResult, _self.getFirstSelectModelDataFieldValue(tempResult1));
                }
              }

              var openWindow = window.open(htmlWindowUrl);

              // 自动关闭
              if (autoCloseInterval != undefined) {
                setTimeout(function () {
                  openWindow.close();
                  openWindow = undefined;
                }, autoCloseInterval * 1000);
              }
            }
          }
        }, errorData => {
          Common.processException(errorData);
        });
      } else if (infoButton.customerWindowNo != null && infoButton.customerWindowNo.length > 0) {
        CustomerWindowResource.uniqueByNo(infoButton.customerWindowNo).then(customerWindowDto => {
          var customerWindowRouteUrl = customerWindowDto.routeUrl;
          if (customerWindowRouteUrl != undefined && customerWindowRouteUrl != '') {
            if (customerWindowRouteUrl == 'exportInfoData') {
              var downloadUrl = Common.getApiURL('exportResource/exportInfoDataComplex') + '?infoWindowNo=' + _self.infoWindowDto.no
                                + '&recordIds=' + _self.getSelectedRecordIds().join(',')
                                + '&token=' + Common.getToken();
              window.open(downloadUrl);
            } else {
              if (tempSelectedModelDatas.length > 0) {
                let userStorageDtos = [
                  {
                    key: _self.uuid,
                    value: JSON.stringify(tempSelectedModelDatas),
                  },
                ];

                // 组装查询条件，然后放到后台数据库当中
                UserStorageResource.uploadUserStorage(userStorageDtos).then(successData => {
                  _self.$router.push({
                    path: customerWindowRouteUrl,
                    query: {
                      'uuid': _self.uuid,
                    },
                  });
                }, errorData => {
                  Common.processException(errorData);
                });
              }else{
                _self.$router.push({
                  path: customerWindowRouteUrl,
                  query: {
                    'uuid': _self.uuid,
                  },
                });
              }
            }
          }
        }, errorData => {
          Common.processException(errorData);
        });
      } else if (infoButton.processReportNo != null && infoButton.processReportNo.length > 0) {

        var processReportNo = infoButton.processReportNo;
        if (processReportNo != undefined && processReportNo != '') {
          var ids = _self.getSelectedRecordIds();
          if (ids.length < 1) {
            Notify.error('错误', '未选择可操作的数据', true);
            return;
          }

          _self.loading=true;
          ProcessReportResource.uniqueByNo(infoButton.processReportNo).then(successData => {
            _self.processReportDto = successData;
            if (successData) {
              _self.pdfOnly = successData.pdfOnly;
              _self.excelOnly = successData.excelOnly;
            }
            ProcessReportResource.runProcessByIds(infoButton.processReportNo, ids).then(successData => {
              _self.modal = true;
              _self.loading=false;
              _self.processReportResult = successData;
              _self.$emit('processExecuteFinish');
            }, errorData => {
              _self.loading=false;
              Common.processException(errorData);
            });
          }, errorData => {
            _self.loading=false;
            Common.processException(errorData);
          });
        }
      }else if (infoButton.curdWindowNo != null && infoButton.curdWindowNo.length > 0){
        _self.$router.push(
          '/desktop/window/' + infoButton.curdWindowNo + '?uuid=' + _self.uuid,
        );
      }
    },

    /**
         * 执行导出
         * @return {void} 
         */
    executeExport: function () {
      var _self = this;

      var isSimpleQuery = _self.$refs.queryCondition.isSimpleQuery();
      if(isSimpleQuery){
        let condition = _self.$refs.queryCondition.getQueryCondition();
        let downloadUrl = Common.getApiURL('exportResource/exportInfoDataSimple') + '?infoWindowNo=' + _self.infoWindowDto.no
                + '&recordIds=' + _self.getSelectedRecordIds().join(',')
                + '&infoFilterFieldValues=' + _self.uuid
                + '&condition=' + condition;
        let timeStr = moment().format('_YYYYMMDD_hhmmss');
        let fileName = (_self.infoWindowDto == null ? '导出数据' + timeStr + '.xls' : _self.infoWindowDto.name + timeStr + '.xls');
        DownloadService.downloadFile(downloadUrl, fileName);
      }else{
        let infoFilterFieldValues = _self.$refs.queryCondition.getQueryCondition();
        let infoFilterFieldValueStrs = JSON.stringify(infoFilterFieldValues);
        let downloadUrl = Common.getApiURL('exportResource/exportInfoDataComplex') + '?infoWindowNo=' + _self.infoWindowDto.no
                + '&recordIds=' + _self.getSelectedRecordIds().join(',')
                + '&infoFilterFieldValues=' + _self.uuid;


        let timeStr = moment().format('_YYYYMMDD_hhmmss');
        let fileName = (_self.infoWindowDto == null ? '导出数据' + timeStr + '.xls' : _self.infoWindowDto.name + timeStr + '.xls');
        let userStorageDtos = [
          {
            key: _self.uuid,
            value: infoFilterFieldValueStrs,
          },
        ];
        // 组装查询条件，然后放到后台数据库当中
        UserStorageResource.uploadUserStorage(userStorageDtos).then(successData => {
          DownloadService.downloadFile(downloadUrl, fileName);
        }, errorData => {
          Common.processException(errorData);
        });
      }      
    },


    /**
     * 获取选择数据的Id集合
     */
    getSelectedRecordIds: function () {
      var _self = this;
      var recordIds = [];
      
      if(_self.infoWindowData != null && _self.infoWindowData.dataList != null){
        _self.infoWindowData.dataList.forEach(function (item) {
          if(item.select == true){
            recordIds.push(item.id);
          }
        });
      }

      return recordIds;
    },

    /**
     * 获取选中的第一个数据的Id
     */
    getFirstSelectRecordId: function () {
      var _self = this;
      let recordIds = _self.getSelectedRecordIds();
      if (recordIds.length > 0) {
        return recordIds[0];
      }
      return undefined;
    },

    /**
         * 获取选中的第一个数据的FieldValue
         */
    getFirstSelectModelDataFieldValue: function (name) {
      var _self = this;

      if(_self.infoWindowData != null && _self.infoWindowData.dataList != null){
        for(let i = 0; i < _self.infoWindowData.dataList.length; i ++){
          let item = _self.infoWindowData.dataList[i];
          if(item.select == true){
            return item.data[name].displayValue[0];
          }
        }
      }

      return undefined;
    },

    /**
         * 切换全选/单选
         */
    changeSelectMode: function () {
      this.multipleSelect = !this.multipleSelect;
    },

    /**
         * 排序
         */
    onSort: function (infoGridField) {
      var _self = this;
      var fieldName = null;
      if (infoGridField.sortFieldName != undefined && infoGridField.sortFieldName != '') {
        fieldName = infoGridField.sortFieldName;
      } else {
        fieldName = infoGridField.fieldName;
      }
      var sortStr = fieldName + _self.sortStyle;

      _self.infoQueryParam.sortClause = sortStr;
      if (_self.currentIsSimpleSearch) {
        _self.queryInfoWindowDataSimple();
      } else {
        _self.queryInfoWindowDataComplex();
      }

      _self.sortStyle = _self.sortStyle == ' ASC' ? ' DESC' : ' ASC';
    },




    /**
         * 冻结表头
         */
    fixedTableHeader: function () {
      let _self = this;
      _self.$nextTick(function () {
        var $th = $('#' + _self.tableOutDivId).find('thead');
        $('#' + _self.tableOutDivId).on('scroll', function () {
          $th.css('transform', 'translateY(' + this.scrollTop + 'px)');
        });
      });
    },

  },
};
</script>

<style scoped>
.sort-button {
    float: left;
}

.fixed-table {
    table-layout: fixed;
}
table.fixed-table tr th {
    text-align: center;
}
table.fixed-table td {
    text-align: center;
    word-wrap: break-word;
    word-break: normal;
}
.btn-process {
    float: right;
    margin-left: 15px;
}
.mulitiple-select {
    background-color: #6699cc !important;
}

table.fixed-table th {
    position: relative;
    min-width: 25px;
}

table.fixed-table th,
table.fixed-table td {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    border-right: 1px solid rgba(0, 0, 0, 0.05);
}

table.fixed-table th {
    min-width: 10px;
    background-color: #f8f8f8;
}

table.fixed-table th .rz-handle {
    width: 10px;
    height: 100%;
    position: absolute;
    top: 0;
    right: 0;
    background: repeating-linear-gradient(
        45deg,
        transparent,
        transparent 2px,
        rgba(0, 0, 0, 0.05) 2px,
        rgba(0, 0, 0, 0.05) 4px
    );
    cursor: ew-resize !important;
}

table.fixed-table th .rz-handle.rz-handle-active {
    border-right: 2px solid #000;
    transform: scaleX(100);
    background: rgba(0, 0, 0, 0.05) 2px;
}

.rz-handle:hover {
    background: rgba(0, 0, 0, 0.2) 4px;
}

.flex-container {
    display: flex;
    /* 垂直*/
    flex-direction: column;
    width: 100%;
    /*视口被均分为100单位的vh 占据整个窗口*/
    height: calc(100vh - 75px);
}

.flex-container-modal {
    display: flex;
    /* 垂直*/
    flex-direction: column;
    width: 100%;
    /*视口被均分为100单位的vh 占据整个窗口*/
    height: calc(100vh - 215px);
}

.flex-header {
    /*放大缩小比例为0 占据垂直方向80px*/
    height: 400px;
    flex: 0 0 100px;
}

.flex-footer {
    height: 40px;
    flex: 0 0 40px;
}

.flex-content {
    display: flex;
    flex: 1;
    height: 0;
}

.flex-main {
    overflow: scroll;
    flex: 1;
    margin-bottom: 0px;
}
</style>


<style scoped>
/** 修复分页的样式 By YangZhiJie 2021-07-06 11:23 */
nav >>> ul.pagination {
    margin: 0 !important;
}
</style>

<style scoped>
.warning {
    background-color: #fcf8e3 !important;
}

.text-center {
    text-align: center !important;
}
</style>