<script>
export default {
    components: {},
    data() {
        return{
            operate: [
                {id: 'project1', label: '项目1', icon: 'create', disabled: true, errorMsg: '禁用中'},
                {id: 'project2', label: '项目2', icon: 'create'},
                {id: 'project3', label: '项目3', icon: 'create'},
                {id: 'project4', label: '项目4', icon: 'create'},
                {id: 'project5', label: '项目5', icon: 'prev', data: [
                    {id: 'children-project1', label: '子项目1', icon: 'create', disabled: true, errorMsg: '禁用中'},
                    {id: 'children-project2', label: '子项目2', icon: 'create'},
                    {id: 'children-project3', label: '子项目3', icon: 'create'},
                    {id: 'children-project4', label: '子项目4', icon: 'create'},
                    {id: 'children-project5', label: '子项目5', icon: 'create'},
                ], top: '-103px', left: '-120px'},
                {id: 'project6', label: '项目6', icon: 'prev', data: [
                    {id: 'children-project6', label: '子项目6', icon: 'create'},
                    {id: 'children-project7', label: '子项目7', icon: 'create'},
                    {id: 'children-project8', label: '子项目8', icon: 'create'},
                    {id: 'children-project9', label: '子项目9', icon: 'create'},
                    {id: 'children-project10', label: '子项目10', icon: 'create'},
                ], top: '-137px', left: '-120px'},
            ],
            select:function($event) {

            }
        }
    }
}
</script>
# MoreOperate 更多操作
通过事件触发显示的更多操作栏目

## 基础用法
:::demo 使用`f-icon`嵌入图标
````html
<efly-more-operate @select="select($event)">
    <efly-button>操作</efly-button>
    <efly-more-operate-group slot="group" top="40px" left="-40px">
        <efly-more-operate-item :disabled="true" msg="项目一已禁用">
            <i class="icon icon-create"></i>
            <span>项目一</span>
        </efly-more-operate-item>
        <efly-more-operate-item :disabled="true" msg="禁用">
            <i class="icon icon-create"></i>
            <span>项目二</span>
        </efly-more-operate-item>
        <efly-more-operate-item>
            <i class="icon icon-create"></i>
            <span>项目三</span>
            <efly-more-operate-group slot="group" left="-120px" top="-1px">
                <efly-more-operate-item :disabled="true" msg="子项目一已禁用">
                    <i class="icon icon-create"></i>
                    <span>子项目一</span>
                </efly-more-operate-item>
               <efly-more-operate-item operate="son2">
                    <i class="icon icon-create"></i>
                    <span>子项目二</span>
                </efly-more-operate-item>
            </efly-more-operate-group>
        </efly-more-operate-item>
    </efly-more-operate-group>
</efly-more-operate>
<script>
export default {
    components: {},
    data() {
        return{
            select:function($event) {
               console.log($event)
            }
        }
    }
}
</script>

````
:::

## 盒子用法
:::demo 使用`f-icon`嵌入图标
````html
<efly-more-operate @select="select($event)" type="box">
    <efly-button>操作</efly-button>
    <efly-more-operate-group slot="group" top="40px" left="-40px">
        <efly-more-operate-item>
            <i class="icon icon-add"></i>
            <span>项目一</span>
            <efly-more-operate-group slot="group">
                <efly-more-operate-item>
                    <i class="icon icon-create"></i>
                    <span>子项目一</span>
                </efly-more-operate-item>
               <efly-more-operate-item operate="son2">
                    <i class="icon icon-create"></i>
                    <span>子项目二</span>
                </efly-more-operate-item>
               <efly-more-operate-item operate="son2">
                    <i class="icon icon-create"></i>
                    <span>子项目二</span>
                </efly-more-operate-item>
               <efly-more-operate-item operate="son2">
                    <i class="icon icon-create"></i>
                    <span>子项目二</span>
                </efly-more-operate-item>
                <efly-more-operate-item>
                    <i class="icon icon-create"></i>
                    <span>子项目一</span>
                </efly-more-operate-item>
               <efly-more-operate-item operate="son2">
                    <i class="icon icon-create"></i>
                    <span>子项目二</span>
                </efly-more-operate-item>
               <efly-more-operate-item operate="son2">
                    <i class="icon icon-create"></i>
                    <span>子项目二</span>
                </efly-more-operate-item>
               <efly-more-operate-item operate="son2">
                    <i class="icon icon-create"></i>
                    <span>子项目二</span>
                </efly-more-operate-item>
            </efly-more-operate-group>
        </efly-more-operate-item>
        <efly-more-operate-item>
            <i class="icon icon-add"></i>
            <span>项目一</span>
            <efly-more-operate-group slot="group" >
                <efly-more-operate-item :disabled="true" msg="项目一已禁用">
                    <i class="icon icon-create"></i>
                    <span>子项目一</span>
                </efly-more-operate-item>
               <efly-more-operate-item operate="son2">
                    <i class="icon icon-create"></i>
                    <span>子项目二</span>
                </efly-more-operate-item>
               <efly-more-operate-item operate="son2">
                    <i class="icon icon-create"></i>
                    <span>子项目二</span>
                </efly-more-operate-item>
               <efly-more-operate-item operate="son2">
                    <i class="icon icon-create"></i>
                    <span>子项目二</span>
                </efly-more-operate-item>
                <efly-more-operate-item>
                    <i class="icon icon-create"></i>
                    <span>子项目一</span>
                </efly-more-operate-item>
               <efly-more-operate-item operate="son2">
                    <i class="icon icon-create"></i>
                    <span>子项目二</span>
                </efly-more-operate-item>
               <efly-more-operate-item operate="son2">
                    <i class="icon icon-create"></i>
                    <span>子项目二</span>
                </efly-more-operate-item>
               <efly-more-operate-item operate="son2">
                    <i class="icon icon-create"></i>
                    <span>子项目二</span>
                </efly-more-operate-item>
            </efly-more-operate-group>
        </efly-more-operate-item>
    </efly-more-operate-group>

</efly-more-operate>
<script>
export default {
    components: {},
    data() {
        return{
            select:function($event) {
               console.log($event)
            }
        }
    }
}
</script>

````
:::

## more-operate参数说明
| 参数      | 说明    | 类型      | 可选值       | 默认值   |
|---------- |-------- |---------- |-------------  |-------- |
| trigger   | 触发条件   | String  |     hover / click      |    hover     |
| type   | 触发条件   | String  |     - / box      |    -     |
| left      | 左定位   | String  |     —       |    —      |
| top       | 上定位   | String  |     —       |    —      |
| disabled  | 禁用状态  | Boolean  |     true/false       |    false      |

## more-operate事件
| 事件名称      | 说明    | 回调参数   
|---------- |-------- |---------- |
| select     | 点击事件   | 对应操作对象  |

## more-operate-group参数说明
| 参数      | 说明    | 类型      | 可选值       | 默认值   |
|---------- |-------- |---------- |-------------  |-------- |
| left      | 左定位   | String  |     —       |    —      |
| top       | 上定位   | String  |     —       |    —      |

## more-operate-item参数说明
| 参数      | 说明    | 类型      | 可选值       | 默认值   |
|---------- |-------- |---------- |-------------  |-------- |
| disabled  | 禁用状态  | Boolean  |     true / false       |    false      |
| msg       | 提示信息  | String  |     —       |    —      |
| operate   | 操作id   | String  |     —       |    —      |
