封装好的table组件

<template>
  <div class="my-table">
    <bfe-table ref="table" stripe :border="data.border" :highlight-current-row="true" :data="data.tableData"
      :min-height="data.isAutoHeight== true? data.minHeight: ''"
      :height="data.isAutoHeight !== true ? tableHeight: data.showHeader||''"
      :show-header="showHeader" style="width: 100%" @select="handleSelectOne"
      @selection-change="handleSelectionChange" @current-change="handlecurrentChange" @row-dblclick="handleRowDblclick"
        @select-all="selectAll"
      @cell-dblclick="handleCellDblclick" :row-key='(row)=>{ return (row[data.rowKey] || row.id || row[data.rowId])}'
      :span-method="objectSpanMethod" :render-header="renderHeader"
      :show-summary="data.showSummary" :summary-method="getSummaries"
    >
      <bfe-table-column v-if="data.startTypeShow == 'reserve' && data.startType" :key="Math.random()"
        :type="data.startType" :reserve-selection="true" fixed width="55" :selectable="data.selectableIS"></bfe-table-column>
      <!-- v-if="data.startTypeShow !== 'reserve' && data.startType" -->
      <bfe-table-column v-if="data.startTypeShow !== 'definedIndex'" :key="Math.random()" type="index" label="序号" fixed width="70"></bfe-table-column>
      <bfe-table-column v-for="(item) in data.columnData" :key="item.id|| item[data.rowId]" :prop="item.prop"
      :header-align="item.headerAlign"
        :label="item.label" :fixed="item.fixed" :sortable="item.sortable"
        :min-width="item.minWidth" :width="item.width">
        <!-- 多级表头 -->
        <template v-if="item.type==='multistage'">
          <bfe-table-column v-for="child in item.children" :key="child.prop" :label="child.label"
          :header-align="item.headerAlign"
            :min-width="child.minWidth">
            <!-- 三级表头 -->
            <template v-if="child.type === 'multistage'">
              <bfe-table-column v-for="child2 in child.children" :key="child2.prop" :label="child2.label"
              :min-width="child2.minWidth">
                <template slot-scope="scope">
                <span v-if="child2.type==='text'">{{ scope.row[child2.prop]}}</span>
                 <bfe-input v-else-if="child2.type === 'input'" size="small" placeholder v-model="scope.row[child2.prop]"
                    :disabled="scope.row[child2.disabled]" :readonly="scope.row[child2.readonly]"></bfe-input>
                </template>
              </bfe-table-column>
            </template>
            <template slot-scope="scope">
              <!-- 二级表头 -->
              <span v-if="child.type==='text'">{{ scope.row[child.prop]}}</span>
              <bfe-input v-else-if="child.type === 'input'" size="small" placeholder v-model="scope.row[child.prop]"
                :disabled="scope.row[child.disabled]" :readonly="scope.row[child.readonly]"></bfe-input>
                  <!-- 跳转展示 -->
               <a style='cursor: pointer; text-decoration: none;' v-if="child.type==='jump'"
            @click='handleOperating(child.click, scope.$index, scope.row, child.prop)'>{{ scope.row[child.prop]}}</a>
            </template>
          </bfe-table-column>
        </template>
        <template slot-scope="scope">
          <!-- 跳转展示 -->
          <a style='cursor: pointer; text-decoration: none;' v-if="item.type==='jump'"
            @click='handleOperating(item.click, scope.$index, scope.row, item.prop)'>{{ scope.row[item.prop]}}</a>
          <!-- 附件 -->
          <a style='cursor: pointer;' v-if="item.type==='file'">{{ scope.row[item.prop]}}</a>
            <!-- 商品标题 -->
          <span v-if="item.type=='title'" style="padding:10px 0;display:block;">
            <p>{{ scope.row[item.prop]}}</p>
            <span>价格：</span>
            <span style="color:#e84141;">{{ scope.row[item.props]}}</span>
          </span>
          <!-- 文本 -->
          <span v-if="item.type==='text'"
            @click='handleOperating(item.click, scope.$index, scope.row)'>{{ scope.row[item.prop]}}</span>
          <span v-if="item.type==='measuretext'">
               <i style="color: rgb(255, 150, 50);position: absolute;transform: rotateZ(-37deg);top: 7px;left: 4px;font-size: 16px;" v-if="scope.row[item.prop+'Icon']" :class="scope.row[item.prop+'Icon']"/> {{ scope.row[item.prop]}}
           <span v-if="item.prop=='companyName' &&scope.row[item.measure]&& scope.row[item.measure].length">
             <span @click="dialogValue(scope.row[item.measure].map(textItem=>textItem.reason).join(','))" class="header-tip" style="margin-left: 15px;padding: 0px 10px;background: #facd91;border-radius: 5px;">
              {{scope.row[item.measure].map(textItem=>textItem.measure).join(',')}}
             </span>
           </span>
          </span>
              <!-- 单个复选框-->
          <span v-if="item.type==='oneCheckbox'">
              <bfe-checkbox v-model="scope.row[item.prop]"  true-label="0" false-label="1" :disabled="!item.bidAgent">通过</bfe-checkbox>
          </span>
          <!-- 展示两行,超出后省略号,鼠标悬浮 -->
          <bfe-popover trigger="hover" placement="top" width="300" v-if="item.type==='popover'">
            <p>{{ scope.row[item.prop]}}</p>
            <div slot="reference">
              <span class="ellipsis">{{ scope.row[item.prop]}}</span>
            </div>
            </bfe-popover>
          <!-- 日期 -->
          <span v-if="item.type==='getDate'">{{getDate(scope.row[item.prop])}}</span>
          <!-- 日期时间 -->
          <span v-if="item.type==='DateTime'">{{getDateTime(scope.row[item.prop])}}</span>
          <!-- 针对一些枚举 -->
          <span v-else-if="item.type==='enumerate'">
            <template v-for="(option, index) in item.options">
              <span :key="index" v-if="option.value==scope.row[item.prop]">{{option.label}}</span>
            </template>
          </span>
          <!-- 仅订单状态 -->
          <span v-else-if="item.type==='enumerateOS'">
            <template v-for="(option, index) in item.options">
              <span :key="index" v-if="option.value==scope.row[item.prop]">
                <template v-if="scope.row.status == 'SHIPPED' || scope.row.status == 'RECEIVED'">
                  {{ option.ifFlag ? option.ifFlag(scope.row.tstatus) : option.label }}
                </template>
                <template v-else-if="scope.row.status == 'REJECTED'">
                  {{ option.ifFlag ? option.ifFlag(scope.row.isAuto) : option.label }}
                </template>
                <template v-else> {{option.label}} </template>
              </span>
            </template>
          </span>
          <!-- 枚举事件 -->
          <span v-else-if="item.type==='jumpEnumerate'">
            <template v-for="(option, index) in item.options">
              <a style='cursor: pointer;' :key="index" v-if="option.value==scope.row[item.prop]"
                @click='handleOperating(item.click, scope.$index, scope.row)'>{{option.label}}</a>
            </template>
          </span>
          <!-- 金额输入框 -->
          <bfe-input-currency v-else-if="item.type === 'currency'" size="small" separator="," :precision="2"
            v-model="scope.row[item.prop]"></bfe-input-currency>
          <!-- 普通输入框 -->
          <bfe-input v-else-if="item.type === 'input'" size="small" placeholder v-model="scope.row[item.prop]"  @blur="handleOperating(item.click, scope.$index, scope.row)"
            :disabled="scope.row[item.disabled]" :readonly="scope.row[item.readonly]"  :maxlength="item.limit" @input.native="item.showNmber?scope.row[item.prop]=scope.row[item.prop].replace(/\D/g,''):''"></bfe-input>
          <!-- 参照输入框 -->
          <bfe-input v-else-if="item.type === 'dialog'" size="small" icon="navicon-round" v-model="scope.row[item.prop]"
            @click.native="dialogEvent(item.name, scope.$index, scope.row, item.prop)" readonly></bfe-input>
          <bfe-date-picker v-else-if="item.type === 'date'" v-model="scope.row[item.prop]" type="date"
            placeholder="选择日期" :picker-options="pickerOptions0"></bfe-date-picker>

          <!-- 可编辑Input -->
          <div v-else-if="item.type === 'ifinpuofspan'" style="width: 100%">
            <!-- 文本 -->
            <span v-if="scope.row.edit !== true">{{ scope.row[item.prop]}}</span>

            <!-- 针对一些枚举 -->
            <!-- 普通输入框 -->
            <bfe-input v-else-if="scope.row.edit === true" size="small" placeholder v-model="scope.row[item.prop]"
              :disabled="scope.row[item.disabled]" :readonly="scope.row[item.readonly]" @blur="handleOperating(item.click, scope.$index, scope.row)"></bfe-input>
          </div>
           <!-- 可编辑多文本框 -->
          <div v-else-if="item.type === 'iftextarea'">
            <!-- 文本 -->
            <span v-if="scope.row.edit !== true">{{ scope.row[item.prop]}}</span>

            <!-- 针对一些枚举 -->
            <!-- 普通输入框 -->
            <bfe-input v-else-if="scope.row.edit === true" size="small" placeholder v-model="scope.row[item.prop]" type="textarea" :rows="2"
              :disabled="scope.row[item.disabled]" :readonly="scope.row[item.readonly]"></bfe-input>
          </div>
          <!-- 可编辑number Input -->
          <div v-else-if="item.type === 'ifinpuofnumber'">
            <!-- 文本 -->
            <span v-if="scope.row.edit !== true">{{ scope.row[item.prop]}}</span>
            <!-- 针对一些枚举 -->
            <!-- 普通输入框 -->
            <bfe-input
              v-else-if="scope.row.edit === true"
              size="small"
              placeholder
              v-model="scope.row[item.prop]"
              type="number"
              :disabled="scope.row[item.disabled]" :readonly="scope.row[item.readonly]"></bfe-input>
          </div>
          <!-- 可编辑number -->
          <div v-else-if="item.type === 'ifnumberofspan'">
            <!-- 文本 -->
            <span v-if="scope.row.edit !== true">{{ scope.row[item.prop]}}</span>

            <!-- 针对一些枚举 -->
            <!-- 普通输入框 -->
            <bfe-input-number v-else-if="scope.row.edit === true" size="small" :min="item.min" :max="item.max"
              v-model="scope.row[item.prop]" :disabled="scope.row[item.disabled]" :readonly="scope.row[item.readonly]">
            </bfe-input-number>
          </div>
          <span v-if="item.type==='month'" >{{ scope.row[item.prop]+'月'}}</span>
           <!-- 普通选择框select -->
          <div v-else-if="item.type === 'select'">
            <bfe-select size="small" v-model="scope.row[item.prop]" :placeholder="'选择'+item.label" :key="tableNum" :disabled="scope.row.edit != true">
              <bfe-option @click.native='handleOperatings(item.click, scope.$index, scope.row)'
                v-for="option in item.options" :key="option.value" :label="option.label" :value="option.value">
              </bfe-option>
            </bfe-select>
          </div>
          <!-- 可编辑select -->
          <div v-else-if="item.type === 'ifselectofspan'">
            <!-- 文本 -->
            <!-- <span v-if="scope.row.edit !== true">{{ scope.row[item.prop]}}</span> -->

            <!-- 针对一些枚举 -->
            <span v-if="scope.row.edit !== true">
              <template v-for="(option, index) in item.options">
                <span :key="index" v-if="option.value==scope.row[item.prop]">{{option.label}}</span>
              </template>
            </span>
            <!-- 普通选择框 -->
            <bfe-select v-else-if="scope.row.edit === true" size="small" v-model="scope.row[item.prop]"
              :placeholder="'选择'+item.label">
              <bfe-option v-for="option in item.options" :key="option.value" :label="option.label" :value="option.value"
                @click.native='handleOperating(item.click, scope.$index, scope.row)'>
              </bfe-option>
            </bfe-select>
          </div>
          <!-- 可编辑日期 -->
          <div v-else-if="item.type === 'ifdateofspan'">
            <!-- 文本 -->
            <span v-if="scope.row.edit !== true">{{ scope.row[item.prop]}}</span>
            <!-- 日期选择框 -->
            <bfe-date-picker v-else-if="scope.row.edit === true" size="small" type="date" v-model="scope.row[item.prop]"
              placeholder>
            </bfe-date-picker>
          </div>
          <!-- 可编辑弹框 -->
          <div v-else-if="item.type === 'ifdialogofspan'" style="width: 100%">
            <!-- 文本 -->
            <span v-if="scope.row.edit !== true">{{ scope.row[item.prop]}}</span>
            <!-- 弹出框 -->
            <bfe-input v-else-if="scope.row.edit === true" size="small"
              v-model="scope.row[item.prop]"  icon="navicon-round"
                       @click.native="dialogEvent(item.name, scope.$index, scope.row,item.prop)"
              @mouseenter.native="mouseoverInput($event, item, scope.$index)"
              @mouseleave.native="mouseoutInput($event, item, scope.$index)" :readonly="true"></bfe-input>
          </div>
          <div v-else-if="item.type=='ifswidthspan'">
            <bfe-switch v-model="scope.row[item.prop]" on-color="#13ce66" off-color="#ff4949" on-text="on" off-text="off"
              :on-value="1" :off-value="0" :disabled="!scope.row.edit">
            </bfe-switch>
          </div>
          <div v-else-if="item.type==='switch'">
            <bfe-switch v-model="scope.row[item.prop]" on-color="#13ce66" off-color="#ff4949" on-text="" off-text=""
              on-value="1" off-value="0">
            </bfe-switch>
          </div>
          <div v-else-if="item.type=='switch2'">
            <bfe-switch v-model="scope.row[item.prop]" on-color="#13ce66" off-color="#ff4949" on-text="on" off-text="off"
              on-value="0" off-value="1">
            </bfe-switch>
          </div>
          <bfe-button v-else-if="item.type === 'button'" type="text"
            @click="handleOperating(item.click, scope.$index, scope.row)">{{item.text}}</bfe-button>
          <div v-else-if="item.type === 'fileList'">
            <p v-for="file in scope.row[item.prop]" :key="file.pkuuid">
              <a style='cursor: pointer;' v-if='item.downLoadFile' @click="DOWNFILEMIXINS(file)">{{file.fileName}}</a>
              <a style='cursor: pointer;' v-else :href="file.pageUri">{{file.fileName}}</a>
            </p>
          </div>
          <div v-else-if="item.type === 'ifcurrencyspan'">
            <template v-if="scope.row.edit === true">
              <bfe-input
                v-if="!scope.row[item.prop + 'Hidden']"
                type="number"
                size="small"
                :maxlength="15"
                v-model="scope.row[item.prop]"
                @blur="inputChange(scope.$index,scope.row, item.prop)"></bfe-input>
              <bfe-input-currency
                v-if="scope.row[item.prop + 'Hidden']"
                v-model="scope.row[item.prop]"
                :max="999999999999.99"
                :precision="2"
                separator=",">
              </bfe-input-currency>
            </template>
            <span v-if="scope.row.edit !== true">{{ Number(scope.row[item.prop]).toFixed(2)}}</span>
          </div>
          <span v-else-if="item.type==='jiami'">{{item.replaceStr || '-'}}</span>
          <span v-else-if="item.type==='qbjiami'">
            <span v-if="scope.row[item.secretFlag] !='0'">{{item.replaceStr || '-'}}</span>
            <span v-else>{{ scope.row[item.prop]}}</span>
          </span>
          <div v-else-if="item.type==='cashType'">
            <span>{{ scope.row[item.prop] && scope.row[item.prop].toFixed(2).replace(/(\d)(?=(\d{3})+\.)/g,'$1,') }}</span>
          </div>
          <div v-else-if="item.type==='taxrateType'">
            <span v-if="scope.row[item.prop]>=0">{{ scope.row[item.prop] * 100+ '%'}}</span>
          </div>
          <div v-else-if="item.type==='linkProp'">
            <span v-if="item.startProp">{{ scope.row[item.startProp] }}</span>
            <span v-if="item.linkStyle">{{ item.linkStyle }}</span>
            <span v-if="item.endProp">{{ scope.row[item.endProp] }}</span>
          </div>
          <div v-else-if="item.type === 'priceTrend'">
            <a>
              <bfe-icon name="arrow-graph-up-right" size="40"></bfe-icon>
            </a>
          </div>
          <div v-else-if="item.type === 'percent'">
            <span v-if="scope.row[item.prop] || scope.row[item.prop]==0 "> {{ scope.row[item.prop] + '%' }}</span>
          </div>
          <div v-else-if="item.type=== 'supplierText'">
            <span>{{ scope.row[item.prop] }}</span>
            <bfe-tag type="primary" v-if="scope.row[item.propTag1] == 2" style="margin-left: 5px">管理员</bfe-tag>
            <bfe-tag type="primary" v-if="scope.row[item.propTag1] != 2" style="margin-left: 5px">普通用户</bfe-tag>
            <bfe-tag type="danger" v-if="scope.row[item.propTag2] === '0'" style="margin-left: 5px">停用</bfe-tag>
            <bfe-tag type="success" v-if="scope.row[item.propTag2] === '00' || scope.row[item.propTag2] === '1'" style="margin-left: 5px">启用</bfe-tag>
          </div>
          <div v-else-if="item.type === 'jumpMoreOrder'">
            <span v-for="(code, idx) in scope.row[item.moreList]" :key="code">
              <span v-if="idx!==0">,</span>
              <a style="cursor: pointer;text-decoration:none;" @click="handleOperating(item.click, scope.$index, scope.row, code)">{{ code }}</a>
            </span>
          </div>
          <div v-else-if="item.type==='defineDisplay'">
            <span
              v-if="scope.row[item.display]"
              @click='handleOperating(item.click, scope.$index, scope.row)'>{{ scope.row[item.prop]}}</span>
          </div>

        </template>
        <!-- 加密 输出 -->
      </bfe-table-column>
      <bfe-table-column v-if="data.operatingData" label="操作" fixed="right" :width="data.operatingWidth"
        class="column-btn">
        <template slot-scope="scope">
          <span class="item" effect="dark" v-for="(item, index) in data.operatingData" :key="index"
            :content="item.title" placement="top">
            <bfe-button v-if="isShowButton(item.show,scope.row, data.status, item.display, item)" type="text"
              @click="handleOperating(item.name, scope.$index, scope.row)">{{item.title}}</bfe-button>
            <!-- <bfe-button
              v-if="isShowButton(item.show,scope.row, data.status, item.display)"
              size="mini"
              type="primary"
              :icon="item.icon"
            @click="handleOperating(item.name, scope.$index, scope.row)"/>-->
            <bfe-upload v-if="item.type=='file'">
              <bfe-button class="uppload-demo" :action="item.action" :limit="item.limit">{{item.title}}</bfe-button>
            </bfe-upload>
          </span>
        </template>
      </bfe-table-column>
    </bfe-table>
    <bfe-dialog
      title="原因"
      :visible.sync="dialogV"
      size="small"
    >
      <div >
        <span>{{textTip}}</span>
      </div>
    </bfe-dialog>
  </div>
</template>

<script>

  import downFileMixins from "@/mixins/downFile.js";
  export default {
    mixins: [downFileMixins()],
    name: "MyTable",
    components: {},
    props: {
      data: {
        type: Object,
        default: () => {
          return {};
        }
      },
      showHeader: {
        type: Boolean,
        default: true
      }
    },

    data() {
      return {
        pickerOptions0: {
          disabledDate(time) {
            return time.getTime() < Date.now() - 8.64e7;
          }
        },
        tableHeight: 0,
        dialogV:false,
        textTip:'',
        tableNum: new Date().getTime(),
      };
    },

    computed: {},

    watch: {
      data: {
        // 深度监听, 可监听到对象 数组的变化
        handler(newV) {
          this.data = newV;
          this.getHeight()
        },
        deep: true
      }
    },


    mounted() {
      this.getHeight()
      let that = this
      window.addEventListener("resize", () => {
        that.getHeight()
      })

    },

    destroyed() {},

    methods: {
      renderHeader(h, { column, $index }){
        if(column.property&&column.property.includes('revwResult')&&this.data.dynRenderHeader){
          let text=this.data.columnData[$index].tip.map(item=>item.measure).join(',')
          let textTip=this.data.columnData[$index].tip.map(item=>item.reason).join(',')
          return h('div',
            {
              class:"header-container",
              style:"display: flex;align-items: center;"
            },
            [
              h('span',column.label),
              h('div',{
                class:"header-tip",
                style:"margin-left: 15px;padding: 0px 10px;background: #facd91;border-radius: 5px;",
                on:{
                  click:(e)=>{ return this.dialogValue(textTip)}
                }
              }, text),
            ])
        }else{
          return h('span',column.label)
        }

      },
    getSummaries(param){
     if(this.data.getSummaries){
       return this.data.getSummaries(param,this)
     }else{
       return []
     }
    },
      getBasicInfo(params){

      },
      dialogValue(textTip){
        this.dialogV=true
        this.textTip=textTip
      },
      getHeight () {
        // this.$nextTick(() => {
        let mainH = 0
        if (document.getElementsByClassName('main-style')[0]) {
          mainH = document.getElementsByClassName('main-style')[0].clientHeight
        }
        let operatebtnH = 0
        if (document.getElementsByClassName('operate-btn')[0]) {
          operatebtnH = document.getElementsByClassName('operate-btn')[0].clientHeight
        }
        let queryBlockH = 0
        if (document.getElementsByClassName('queryBlock')[0]) {
          queryBlockH = document.getElementsByClassName('queryBlock')[0].clientHeight
        }
        let examinetopH = 0
        if (document.getElementsByClassName('examine-top')[0]) {
          examinetopH = document.getElementsByClassName('examine-top')[0].clientHeight
        }
        let btnH = 0
        if (document.getElementsByClassName('btn')[0]) {
          btnH = document.getElementsByClassName('btn')[0].clientHeight
        }
// console.log( mainH , operatebtnH , queryBlockH , examinetopH , btnH , 80)
        let tabH = mainH - operatebtnH - queryBlockH - examinetopH - btnH - 80
        if (tabH <= 0) {
          tabH = 350
        }
        // console.log(tabH)
          this.tableHeight = tabH
        // })
      },

      handleSelectOne(selection, row) {
        this.$emit("handleSelectOne", selection, row);
      },
      selectAll(val){
         this.$emit("selectAll", val);
      },
      // 多选操作
      handleSelectionChange(val) {
        this.$emit("handleSelectionChange", val);
      },
      // 单选操作
      handlecurrentChange(val) {
        this.$emit("handlecurrentChange", val);
      },
      // 双击某一行 触发事件
      handleRowDblclick(val) {
        this.$emit("handleRowDblclick", val);
      },
      // 双击某一单元格 触发事件
      handleCellDblclick(val) {
        this.$emit("handleCellDblclick", val);
      },
      // 控制操作按钮的显示和隐藏
      isShowButton(show, row, status, display, item) {
        if (display) {
          return row[display].toString() === show.toString();
        } else if(row[status] instanceof Array && show) {
          return row[status].indexOf(show[0]) > -1
        }else if(item.cancleBtn) {
          return show instanceof Array && show.indexOf(row[item.cancleBtn]) > -1
        } else {
          if (show) {
             if (item.title === '编辑') {
              if (row.edit !== true) {
                if (row.edit === undefined) {
                  return show.some(item => {
                    return item === row[status];
                  });
                }
                return true;
              } else {
                return false
              }
            }
            if (item.title === '保存') {
              if (row.edit === true) {
                return true;
              } else {
                return false
              }
            }
            return show.some(item => {
              return item === row[status];
            });
          }
          if (item.title === '编辑' || item.title === '变更') {
            if (row.edit !== true) {
              return true;
            } else {
              return false
            }
          }
          if (item.title === '保存') {
            if (row.edit === true) {
              return true;
            } else {
              return false
            }
          }
          return true;
        }
      },
      toggleSelection(rows) {
        if (rows) {
          const startTime = new Date().getTime();
          rows.forEach(row => {
            this.$refs.table.toggleRowSelection(row);
          });
          const endTime = new Date().getTime();
          console.log("全选耗时:" + (endTime - startTime));
        } else {
          this.$refs.table.clearSelection();
        }
      },
      // 操作事件
      handleOperating(name, index, row, prop) {
        // this.tableNum = new Date().getTime() + 1
        if (name) {
          this.$emit(name, index, row, prop);
        }

      },
      handleOperatings(name, index, row, prop) {
        this.tableNum = new Date().getTime() + 1
        if (name) {
          this.$emit(name, index, row, prop);
        }

      },
      // 参照弹框
      dialogEvent(name, index, row, prop) {
        // debugger
        console.log('dialogEvent',prop)
        this.$emit(name, index, row, prop)
      },
      mouseoverInput(e, item, index) {
        console.log(e)
        // if(this.searchFormInline[index]) {
        //   item.icon = "circle-close"
        // } else {
        //   item.icon = 'navicon-round'
        // }
      },
      mouseoutInput(e, item) {
        item.icon = 'navicon-round'
      },
    toggleSelection(rows) {
      if (rows) {
        const startTime = new Date().getTime();
        rows.forEach(row => {
          this.$refs.table.toggleRowSelection(row);
        });
        const endTime = new Date().getTime();
        console.log("全选耗时:" + (endTime - startTime));
      } else {
        this.$refs.table.clearSelection();
      }
    },
    setCurrentRow(row) {
      if(row) {
        this.$refs.table.setCurrentRow(row)
      } else {
        this.$refs.table.setCurrentRow()
      }
    },
    getDateTime (now) {
        let y = new Date(now).getFullYear() //年
        let m = new Date(now).getMonth() + 1 //月
        let d = new Date(now).getDate() //日
        let hours = new Date(now).getHours() //时
        let minutes = new Date(now).getMinutes() //分
        let seconds = new Date(now).getSeconds() //秒
        m = m < 10 ? "0" + m : m
        d = d < 10 ? "0" + d : d
        hours = hours < 10 ? "0" + hours : hours
        minutes = minutes < 10 ? "0" + minutes : minutes
        seconds = seconds < 10 ? "0" + seconds : seconds
        return y + "-" + m + "-" + d + " " + hours + ":" + minutes + ":" + seconds
    },
    getDate (now) {
        let y = new Date(now).getFullYear() //年
        let m = new Date(now).getMonth() + 1 //月
        let d = new Date(now).getDate() //日
        m = m < 10 ? "0" + m : m
        d = d < 10 ? "0" + d : d
        return y + "-" + m + "-" + d
    },
    objectSpanMethod({ row, column, rowIndex, columnIndex }) {
      this.$emit('objectSpanMethod',{ row, column, rowIndex, columnIndex })
    },
    filterData(arr) {
        let spanOneArr = []
        let concatOne = 0
        let mergeSpanProp = this.data.mergeSpanProp
        arr.forEach((item,index)=> {
          if(index ===0 ){
            spanOneArr.push (1)
          } else {
            if(item[mergeSpanProp]== arr[index-1][mergeSpanProp] ){
              spanOneArr[concatOne] += 1
              spanOneArr.push(0)
            } else{
              spanOneArr.push(1)
              concatOne = index
            }
          }
        })
        // console.log(spanOneArr)
        return {
          one: spanOneArr
        }

      },
      objectSpanMethod({row, column, rowIndex, columnIndex}) {
          if(columnIndex === this.data.mergeSpanIndex && this.data.mergeSpanProp){
          const _row = (this.filterData(this.data.tableData).one)[rowIndex]
          const _col = _row >0 ? 1 : 0
          return {
            rowspan: _row,
            colspan: _col
          }
        }
      },
      clearSelection() {
         this.$refs.table.clearSelection();
      },
    inputChange(index,row,prop) {
      this.$emit('currencyChange',index,row,prop)
    },
    // selectable(row, index) {
    //   return this.$emit('selectableIS', row,index)
    // }
  }
};
</script>

<style lang="postcss" scoped>
.ellipsis{
  display:-webkit-box;
  text-overflow: ellipsis;
  overflow: hidden;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
}
.el-popover{
  height: auto;
  color:#fff;
  background-color: rgba(0, 0, 0, 0.8)

}

</style>
<style scoped>
.item button {
  margin-right: 10px;
  display: flex;
}

.bfe-table .cell {
  display: flex;
}
::v-deep .bfe-table .cell {
    display: flex;
}
</style>