yexuejc007/rubick
1
0
Fork 0
mirror of https://github.com/rubickCenter/rubick synced 2025-12-29 22:39:45 +08:00
Code Issues Packages Projects Releases Wiki Activity

🐛 fix #289,#291,#290

Browse Source
This commit is contained in:
muwoo
2023-11-10 14:35:37 +08:00
parent dfb8446cfd
commit f671b83b6a
17 changed files with 277 additions and 88 deletions
Download Patch File Download Diff File Expand all files Collapse all files

158
src/renderer/components/result.vue
View File

@@ -1,20 +1,25 @@
<template>
<div
v-show="!currentPlugin.name"
class="options"
ref="scrollDom"
>
<div class="history-plugins" v-if="!options.length || !(searchValue || !!clipboardFile.length)">
<div v-show="!currentPlugin.name" class="options">
<div
class="history-plugins"
v-if="!options.length || !(searchValue || !!clipboardFile.length)"
>
<a-row>
<a-col
@click="() => item.click()"
:class="currentSelect === index ? 'active history-item' : 'history-item'"
@click="() => openPlugin(item)"
@contextmenu.prevent="openMenu($event,item)"
:class="
currentSelect === index ? 'active history-item' : 'history-item'
"
:span="3"
v-for="(item, index) in pluginHistory"
:key="index"
>
<a-avatar style="width: 28px; height: 28px;" :src="item.icon" />
<div class="name ellpise">{{item.cmd || item.pluginName || item._name || item.name}}</div>
<a-avatar style="width: 28px; height: 28px" :src="item.icon" />
<div class="name ellpise">
{{ item.cmd || item.pluginName || item._name || item.name }}
</div>
<div class="badge" v-if="item.pin"></div>
</a-col>
</a-row>
</div>
@@ -39,16 +44,13 @@
</template>
<script lang="ts" setup>
import BScroll from '@better-scroll/core';
import { defineProps, onMounted, ref } from 'vue';
import {defineEmits, defineProps, reactive, toRaw, watch} from 'vue';
const path = window.require('path');
const remote = window.require('@electron/remote');
const scrollDom = ref(null);
declare const __static: string;
onMounted(() => {
new BScroll(scrollDom.value);
});
const props = defineProps({
const props: any = defineProps({
searchValue: {
type: [String, Number],
default: '',
@@ -66,14 +68,22 @@ const props = defineProps({
clipboardFile: (() => [])(),
});
const emit = defineEmits(['choosePlugin', 'setPluginHistory']);
const renderTitle = (title, match) => {
if (typeof title !== 'string') return;
if (!props.searchValue || !match) return title;
const result = title.substring(match[0], match[1] + 1);
return `<div>${title.substring(0, match[0])}<span style='color: var(--ant-error-color)'>${result}</span>${title.substring(match[1]+1, title.length)}</div>`;
return `<div>${title.substring(
0,
match[0]
)}<span style='color: var(--ant-error-color)'>${result}</span>${title.substring(
match[1] + 1,
title.length
)}</div>`;
};
const renderDesc = (desc) => {
const renderDesc = (desc = '') => {
if (desc.length > 80) {
return `${desc.substr(0, 63)}...${desc.substr(
desc.length - 14,
@@ -93,17 +103,97 @@ const sort = (options) => {
}
}
}
return options;
return options.slice(0, 20);
};
const openPlugin = (item) => {
emit('choosePlugin', item);
};
const menuState: any = reactive({
plugin: null,
});
let mainMenus;
const openMenu = (e, item) => {
const pinToMain = mainMenus.getMenuItemById('pinToMain');
const unpinFromMain = mainMenus.getMenuItemById('unpinFromMain');
pinToMain.visible = !item.pin;
unpinFromMain.visible = item.pin;
mainMenus.popup({
x: e.pageX,
y: e.pageY,
});
menuState.plugin = item;
};
const initMainCmdMenus = () => {
const menu = [
{
id: 'removeRecentCmd',
label: '从"使用记录"中删除',
icon: path.join(__static, 'icons', 'delete@2x.png'),
click: () => {
const history = props.pluginHistory.filter((item) => item.name !== menuState.plugin.name);
emit('setPluginHistory', toRaw(history));
},
},
{
id: 'pinToMain',
label: '固定到"搜索面板"',
icon: path.join(__static, 'icons', 'pin@2x.png'),
click: () => {
const history = props.pluginHistory.map((item) => {
if (item.name === menuState.plugin.name) {
item.pin = true;
}
return item;
});
emit('setPluginHistory', toRaw(history));
},
},
{
id: 'unpinFromMain',
label: '从"搜索面板"取消固定',
icon: path.join(__static, 'icons', 'unpin@2x.png'),
click: () => {
const history = props.pluginHistory.map((item) => {
if (item.name === menuState.plugin.name) {
item.pin = false;
}
return item;
});
emit('setPluginHistory', toRaw(history));
},
},
];
mainMenus = remote.Menu.buildFromTemplate(menu);
};
initMainCmdMenus();
</script>
<style lang="less">
.ellpise {
overflow:hidden;
text-overflow:ellipsis;
display:-webkit-box;
-webkit-line-clamp:1;
-webkit-box-orient:vertical;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;
}
.contextmenu {
margin: 0;
background: #fff;
z-index: 3000;
position: absolute;
list-style-type: none;
padding: 5px 0;
border-radius: 4px;
font-size: 12px;
font-weight: 400;
color: #333;
box-shadow: 2px 2px 3px 0 rgba(0, 0, 0, 0.3);
}
.options {
@@ -120,6 +210,7 @@ const sort = (options) => {
border-top: 1px dashed var(--color-border-light);
box-sizing: border-box;
.history-item {
cursor: pointer;
box-sizing: border-box;
height: 69px;
display: flex;
@@ -128,6 +219,19 @@ const sort = (options) => {
flex-direction: column;
color: var(--color-text-content);
border-right: 1px dashed var(--color-border-light);
position: relative;
.badge {
position: absolute;
top: 2px;
right: 2px;
width: 0;
height: 0;
border-radius: 4px;
border-top: 6px solid var(--ant-primary-4);
border-right: 6px solid var(--ant-primary-4);
border-left: 6px solid transparent;
border-bottom: 6px solid transparent;
}
&.active {
background: var(--color-list-hover);
}
@@ -141,7 +245,7 @@ const sort = (options) => {
}
.op-item {
padding: 0 10px;
height: 60px;
height: 70px;
line-height: 50px;
max-height: 500px;
overflow: auto;