mirror of
https://github.com/woodpecker-ci/woodpecker.git
synced 2024-11-29 21:31:02 +00:00
close sidebar on outside click (#2325)
[record.webm](https://github.com/woodpecker-ci/woodpecker/assets/3391958/f797be2c-09a9-4699-be85-7d5925e146ed) --------- Co-authored-by: qwerty287 <80460567+qwerty287@users.noreply.github.com>
This commit is contained in:
parent
4c55a7c509
commit
718ec6141c
4 changed files with 53 additions and 1 deletions
|
@ -19,6 +19,7 @@
|
|||
"dependencies": {
|
||||
"@intlify/unplugin-vue-i18n": "^0.10.1",
|
||||
"@kyvg/vue3-notification": "^2.9.1",
|
||||
"@vueuse/components": "^10.4.0",
|
||||
"@vueuse/core": "^9.13.0",
|
||||
"ansi_up": "^5.2.1",
|
||||
"dayjs": "^1.11.9",
|
||||
|
|
|
@ -14,6 +14,9 @@ dependencies:
|
|||
'@kyvg/vue3-notification':
|
||||
specifier: ^2.9.1
|
||||
version: 2.9.1(vue@3.3.4)
|
||||
'@vueuse/components':
|
||||
specifier: ^10.4.0
|
||||
version: 10.4.0(vue@3.3.4)
|
||||
'@vueuse/core':
|
||||
specifier: ^9.13.0
|
||||
version: 9.13.0(vue@3.3.4)
|
||||
|
@ -879,6 +882,10 @@ packages:
|
|||
resolution: {integrity: sha512-oh8q2Zc32S6gd/j50GowEjKLoOVOwHP/bWVjKJInBwQqdOYMdPrf1oVlelTlyfFK3CKxL1uahMDAr+vy8T7yMQ==}
|
||||
dev: false
|
||||
|
||||
/@types/web-bluetooth@0.0.17:
|
||||
resolution: {integrity: sha512-4p9vcSmxAayx72yn70joFoL44c9MO/0+iVEBIQXe3v2h2SiAsEIo/G5v6ObFWvNKRFjbrVadNf9LqEEZeQPzdA==}
|
||||
dev: false
|
||||
|
||||
/@typescript-eslint/eslint-plugin@5.60.1(@typescript-eslint/parser@5.60.1)(eslint@8.44.0)(typescript@5.0.3):
|
||||
resolution: {integrity: sha512-KSWsVvsJsLJv3c4e73y/Bzt7OpqMCADUO846bHcuWYSYM19bldbAeDv7dYyV0jwkbMfJ2XdlzwjhXtuD7OY6bw==}
|
||||
engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
|
||||
|
@ -1143,6 +1150,29 @@ packages:
|
|||
- typescript
|
||||
dev: true
|
||||
|
||||
/@vueuse/components@10.4.0(vue@3.3.4):
|
||||
resolution: {integrity: sha512-+ECAD4NcY6Rf/lLSQEyZapbjX9SE/QeEwINMVStvbMXusqPOB9Wpz9tv8i0QDtUKaFxdJ92X9uns4i6PqrtlRw==}
|
||||
dependencies:
|
||||
'@vueuse/core': 10.4.0(vue@3.3.4)
|
||||
'@vueuse/shared': 10.4.0(vue@3.3.4)
|
||||
vue-demi: 0.14.5(vue@3.3.4)
|
||||
transitivePeerDependencies:
|
||||
- '@vue/composition-api'
|
||||
- vue
|
||||
dev: false
|
||||
|
||||
/@vueuse/core@10.4.0(vue@3.3.4):
|
||||
resolution: {integrity: sha512-8JnnTwiuzUqfiYIW8H4FKG/g5ZMKSE+9auoFUwUAkzhqUjy24VbMkNlDBWetQCimiptx7RAO6u1IS55H6+p1Tg==}
|
||||
dependencies:
|
||||
'@types/web-bluetooth': 0.0.17
|
||||
'@vueuse/metadata': 10.4.0
|
||||
'@vueuse/shared': 10.4.0(vue@3.3.4)
|
||||
vue-demi: 0.14.5(vue@3.3.4)
|
||||
transitivePeerDependencies:
|
||||
- '@vue/composition-api'
|
||||
- vue
|
||||
dev: false
|
||||
|
||||
/@vueuse/core@9.13.0(vue@3.3.4):
|
||||
resolution: {integrity: sha512-pujnclbeHWxxPRqXWmdkKV5OX4Wk4YeK7wusHqRwU0Q7EFusHoqNA/aPhB6KCh9hEqJkLAJo7bb0Lh9b+OIVzw==}
|
||||
dependencies:
|
||||
|
@ -1155,10 +1185,23 @@ packages:
|
|||
- vue
|
||||
dev: false
|
||||
|
||||
/@vueuse/metadata@10.4.0:
|
||||
resolution: {integrity: sha512-JNf9IR7ZBTDxWPfQlHhqBOv1VLO6ReTZi9HGY7RABjYHVpaEpjlHU7HpZDVOJGDa0gKITAbA2zMkNSBjKMcdaw==}
|
||||
dev: false
|
||||
|
||||
/@vueuse/metadata@9.13.0:
|
||||
resolution: {integrity: sha512-gdU7TKNAUVlXXLbaF+ZCfte8BjRJQWPCa2J55+7/h+yDtzw3vOoGQDRXzI6pyKyo6bXFT5/QoPE4hAknExjRLQ==}
|
||||
dev: false
|
||||
|
||||
/@vueuse/shared@10.4.0(vue@3.3.4):
|
||||
resolution: {integrity: sha512-52asvLf5cbAS/h6xWjqoY4MgjxmFjnVNf/nA8BP7RbeIrIGcf+BZbeOcVo+92byqArXEJiBxptXpufQvbwJL/w==}
|
||||
dependencies:
|
||||
vue-demi: 0.14.5(vue@3.3.4)
|
||||
transitivePeerDependencies:
|
||||
- '@vue/composition-api'
|
||||
- vue
|
||||
dev: false
|
||||
|
||||
/@vueuse/shared@9.13.0(vue@3.3.4):
|
||||
resolution: {integrity: sha512-UrnhU+Cnufu4S6JLCPZnkWh0WwZGUp72ktOF2DFptMlOs3TOdVv8xJN53zhHGARmVOsz5KqOls09+J1NR6sBKw==}
|
||||
dependencies:
|
||||
|
|
|
@ -1,6 +1,7 @@
|
|||
<template>
|
||||
<aside
|
||||
v-if="isOpen"
|
||||
v-on-click-outside="close"
|
||||
class="flex flex-col z-50 overflow-y-auto items-center bg-wp-background-100 dark:bg-wp-background-200 border-wp-background-400"
|
||||
:aria-label="$t('pipeline_feed')"
|
||||
>
|
||||
|
@ -21,9 +22,11 @@
|
|||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { vOnClickOutside } from '@vueuse/components';
|
||||
|
||||
import PipelineFeedItem from '~/components/pipeline-feed/PipelineFeedItem.vue';
|
||||
import usePipelineFeed from '~/compositions/usePipelineFeed';
|
||||
|
||||
const pipelineFeed = usePipelineFeed();
|
||||
const { isOpen, sortedPipelines } = pipelineFeed;
|
||||
const { close, isOpen, sortedPipelines } = pipelineFeed;
|
||||
</script>
|
||||
|
|
|
@ -17,11 +17,16 @@ export default () => {
|
|||
setUserConfig('isPipelineFeedOpen', !userConfig.value.isPipelineFeedOpen);
|
||||
}
|
||||
|
||||
function close() {
|
||||
setUserConfig('isPipelineFeedOpen', false);
|
||||
}
|
||||
|
||||
const sortedPipelines = toRef(pipelineStore, 'pipelineFeed');
|
||||
const activePipelines = toRef(pipelineStore, 'activePipelines');
|
||||
|
||||
return {
|
||||
toggle,
|
||||
close,
|
||||
isOpen,
|
||||
sortedPipelines,
|
||||
activePipelines,
|
||||
|
|
Loading…
Reference in a new issue