dzhh-frontend/.svn/pristine/61/61ae9219b44df43e8c377de4acf19354ec74d600.svn-base

<template>
  <a-dropdown :trigger="['click']">
    <div class="j-vxe-ds-icons">
      <a-icon type="align-left"/>
      <a-icon type="align-right"/>
    </div>

    <!--    <div class="j-vxe-ds-btns">-->
    <!--      <a-button icon="caret-up" size="small" :disabled="disabledMoveUp" @click="handleRowMoveUp"/>-->
    <!--      <a-button icon="caret-down" size="small" :disabled="disabledMoveDown" @click="handleRowMoveDown"/>-->
    <!--    </div>-->

    <a-menu slot="overlay">
      <a-menu-item key="0" :disabled="disabledMoveUp" @click="handleRowMoveUp">向上移</a-menu-item>
      <a-menu-item key="1" :disabled="disabledMoveDown" @click="handleRowMoveDown">向下移</a-menu-item>
      <a-menu-divider/>
      <a-menu-item key="3" @click="handleRowInsertDown">插入一行</a-menu-item>
    </a-menu>
  </a-dropdown>
</template>

<script>
  import JVxeCellMixins from '@/components/jeecg/JVxeTable/mixins/JVxeCellMixins'

  export default {
    name: 'JVxeDragSortCell',
    mixins: [JVxeCellMixins],
    computed: {
      // 排序结果保存字段
      dragSortKey() {
        return this.renderOptions.dragSortKey || 'orderNum'
      },
      disabledMoveUp() {
        return this.rowIndex === 0
      },
      disabledMoveDown() {
        return this.rowIndex === (this.fullDataLength - 1)
      },
    },
    methods: {
      /** 向上移 */
      handleRowMoveUp(event) {
        // event.target.blur()
        if (!this.disabledMoveUp) {
          this.trigger('rowMoveUp', this.rowIndex)
        }
      },
      /** 向下移 */
      handleRowMoveDown(event) {
        // event.target.blur()
        if (!this.disabledMoveDown) {
          this.trigger('rowMoveDown', this.rowIndex)
        }
      },
      /** 插入一行 */
      handleRowInsertDown() {
        this.trigger('rowInsertDown', this.rowIndex)
      },
    },
    // 【组件增强】注释详见：JVxeCellMixins.js
    enhanced: {
      // 【功能开关】
      switches: {
        editRender: false
      },
    },
  }
</script>

<style lang="less">
  .j-vxe-ds-icons {
    position: relative;
    /*cursor: move;*/
    cursor: pointer;
    width: 14px;
    height: 100%;
    display: inline-block;

    .anticon-align-left,
    .anticon-align-right {
      position: absolute;
      top: 30%;
    }

    .anticon-align-left {
      left: 0;
    }

    .anticon-align-right {
      right: 0;
    }
  }

  .j-vxe-ds-btns {
    position: relative;
    cursor: pointer;
    width: 24px;
    height: 100%;
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-content: center;

    .ant-btn {
      border: none;

      z-index: 0;
      padding: 0;
      width: 100%;
      /*height: 30%;*/
      height: 40%;
      display: block;
      border-radius: 0;

      &:hover {
        z-index: 1;
        /*  height: 40%;*/

        /*  & .anticon-caret-up,*/
        /*  & .anticon-caret-down {*/
        /*    top: 2px;*/
        /*  }*/
      }

      &:last-child {
        margin-top: -1px;
      }

      & .anticon-caret-up,
      & .anticon-caret-down {
        vertical-align: top;
        position: relative;
        top: 0;
        transition: top 0.3s;
      }
    }
  }
</style>