From f551d40f679b087e673c8285d30cb36accc95d3a Mon Sep 17 00:00:00 2001
From: MomoPoppy <125256456+MomoPoppy@users.noreply.github.com>
Date: Sun, 19 Mar 2023 18:16:32 -0700
Subject: [PATCH] =?UTF-8?q?feat(action-menu):=20=E4=BF=AE=E5=A4=8D=20Actio?=
 =?UTF-8?q?nMenu=20=E4=B8=8B=E6=8B=89=E5=90=8E=E7=AE=AD=E5=A4=B4=E6=97=8B?=
 =?UTF-8?q?=E8=BD=AC=E5=90=91=E4=B8=8A=20(#70)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* chore: checkout release branch

* feat(action-menu): 修复 ActionMenu 下拉后箭头旋转向上

---------

Co-authored-by: Kagol <kagol@sina.com>
---
 .github/workflows/auto-publish.yml            |  2 +
 .../src/demo/pc/action-menu/more-click.vue    |  2 +-
 .../demo/pc/action-menu/visible-change.vue    | 44 +++++++++++++++++++
 .../docs/zh-CN/action-menu/visible-change.md  | 20 +++++++++
 example/src/nav.config.comp.json              |  4 ++
 example/src/route.config.comp2.js             |  5 +++
 packages/action-menu/src/index.vue            | 16 +++----
 7 files changed, 83 insertions(+), 10 deletions(-)
 create mode 100644 example/src/demo/pc/action-menu/visible-change.vue
 create mode 100644 example/src/docs/zh-CN/action-menu/visible-change.md

diff --git a/.github/workflows/auto-publish.yml b/.github/workflows/auto-publish.yml
index 39e98efb6..e4e11a22b 100644
--- a/.github/workflows/auto-publish.yml
+++ b/.github/workflows/auto-publish.yml
@@ -11,6 +11,8 @@ jobs:
     steps:
       - name: CheckOut Code
         uses: actions/checkout@master
+        with:
+          ref: release
 
       - name: Setup Node
         uses: actions/setup-node@v3
diff --git a/example/src/demo/pc/action-menu/more-click.vue b/example/src/demo/pc/action-menu/more-click.vue
index 4875c2a81..9d443f59d 100644
--- a/example/src/demo/pc/action-menu/more-click.vue
+++ b/example/src/demo/pc/action-menu/more-click.vue
@@ -1,5 +1,5 @@
 <template>
-  <tiny-action-menu :options="options" @more-click="moreClick"> </tiny-action-menu>
+  <tiny-action-menu :options="options" trigger="click" @more-click="moreClick"> </tiny-action-menu>
 </template>
 
 <script>
diff --git a/example/src/demo/pc/action-menu/visible-change.vue b/example/src/demo/pc/action-menu/visible-change.vue
new file mode 100644
index 000000000..be5f77258
--- /dev/null
+++ b/example/src/demo/pc/action-menu/visible-change.vue
@@ -0,0 +1,44 @@
+<template>
+  <tiny-action-menu :options="options" @visible-change="visibleChange"> </tiny-action-menu>
+</template>
+
+<script>
+import { ActionMenu, Notify } from '@opentiny/vue'
+
+export default {
+  components: {
+    TinyActionMenu: ActionMenu
+  },
+  data() {
+    return {
+      options: [
+        {
+          label: '远程登陆'
+        },
+        {
+          label: '开机'
+        },
+        {
+          label: '关机'
+        },
+        {
+          label: '重启'
+        },
+        {
+          label: '网络设置',
+          children: [{ label: '更改安全组' }, { label: '切换VPC', divided: true }]
+        }
+      ]
+    }
+  },
+  methods: {
+    visibleChange(status) {
+      Notify({
+        message: `触发 visible-change 事件,下拉状态为 ${status}`,
+        position: 'top-right',
+        duration: 2000
+      })
+    }
+  }
+}
+</script>
diff --git a/example/src/docs/zh-CN/action-menu/visible-change.md b/example/src/docs/zh-CN/action-menu/visible-change.md
new file mode 100644
index 000000000..0d9dfa717
--- /dev/null
+++ b/example/src/docs/zh-CN/action-menu/visible-change.md
@@ -0,0 +1,20 @@
+<div class="demo-header">
+<p class="overviewicon">
+  <span class="wapi-business-action-menu"/>
+</p>
+
+## ActionMenu 菜单按钮
+
+<nova-uxlink widget-name="ActionMenu"></nova-uxlink>
+
+提供一组操作按钮的组件，当按钮数量太多导致预留空间大小无法显示所有按钮时，自动将超出部分的按钮放置在一个 menu 组件下拉中。
+
+</div>
+
+### 菜单显示或隐藏改变时触发的事件
+
+<nova-demo-view link="action-menu/visible-change"></nova-demo-view>
+
+<br>
+
+<nova-attributes link="action-menu"></nova-attributes>
diff --git a/example/src/nav.config.comp.json b/example/src/nav.config.comp.json
index 8555773e4..5ec9c5458 100644
--- a/example/src/nav.config.comp.json
+++ b/example/src/nav.config.comp.json
@@ -562,6 +562,10 @@
               "path": "/action-menu/more-click",
               "name": "更多按钮点击事件"
             },
+            {
+              "path": "/action-menu/visible-change",
+              "name": "菜单显示隐藏变化事件"
+            },
             {
               "path": "/action-menu/slot-item",
               "name": "菜单项插槽"
diff --git a/example/src/route.config.comp2.js b/example/src/route.config.comp2.js
index 2c5466248..5c223bf91 100644
--- a/example/src/route.config.comp2.js
+++ b/example/src/route.config.comp2.js
@@ -1466,6 +1466,11 @@ export default [
     meta: { title: '导航组件-ActionMenu 下拉菜单', lang: 'zh-CN', sign: 'component' },
     component: () => import(/* webpackChunkName: 'v3-dropdown' */ './docs/zh-CN/action-menu/more-click.md')
   },
+  {
+    path: 'action-menu/visible-change',
+    meta: { title: '导航组件-ActionMenu 下拉菜单', lang: 'zh-CN', sign: 'component' },
+    component: () => import(/* webpackChunkName: 'v3-dropdown' */ './docs/zh-CN/action-menu/visible-change.md')
+  },
   {
     path: 'action-menu/more-text',
     meta: { title: '导航组件-ActionMenu 下拉菜单', lang: 'zh-CN', sign: 'component' },
diff --git a/packages/action-menu/src/index.vue b/packages/action-menu/src/index.vue
index f4802bc6c..717bf960e 100644
--- a/packages/action-menu/src/index.vue
+++ b/packages/action-menu/src/index.vue
@@ -15,11 +15,7 @@
       </li>
 
       <li v-if="state.moreOptions.length" class="tiny-action-menu__item">
-        <tiny-dropdown @item-click="handleItemClick">
-          <span @click="handleMoreClick">
-            <span>{{ moreText }} </span>
-            <icon-chevron-down></icon-chevron-down>
-          </span>
+        <tiny-dropdown :title="moreText" :trigger="trigger" @item-click="handleItemClick" @handle-click="handleMoreClick" @visible-change="visibleChange">
           <template #dropdown>
             <tiny-dropdown-menu :textField="textField" :popperClass="popperClass">
               <tiny-dropdown-item v-for="(item, index) in state.moreOptions" :key="index" :itemData="item" :label="item[textField]">
@@ -42,7 +38,6 @@ import '@opentiny/vue-theme/action-menu/index.css'
 import Dropdown from '@opentiny/vue-dropdown'
 import DropdownMenu from '@opentiny/vue-dropdown-menu'
 import DropdownItem from '@opentiny/vue-dropdown-item'
-import { iconChevronDown } from '@opentiny/vue-icon'
 import { t } from '@opentiny/vue-locale'
 
 export default {
@@ -50,10 +45,9 @@ export default {
   components: {
     TinyDropdown: Dropdown,
     TinyDropdownMenu: DropdownMenu,
-    TinyDropdownItem: DropdownItem,
-    IconChevronDown: iconChevronDown()
+    TinyDropdownItem: DropdownItem
   },
-  emits: ['more-click', 'item-click'],
+  emits: ['more-click', 'item-click', 'visible-change'],
   props: {
     options: {
       type: Array,
@@ -82,6 +76,10 @@ export default {
     popperAppendToBody: {
       type: Boolean,
       default: false
+    },
+    trigger: {
+      type: String,
+      default: 'hover'
     }
   },
   setup(props, context) {