feat: 增加快捷键操作 #234

Merged
lizhong merged 1 commits from 20240420keydown into test 1 year ago

@ -26,6 +26,8 @@ const inputHandler = debounce((keyword) => {
// //
async function handlerSearch(value) { async function handlerSearch(value) {
//
if(value === '/') return
const res = await getSearchList({ const res = await getSearchList({
search: value, search: value,
}) })

@ -0,0 +1,14 @@
import { inject, onMounted, onUnmounted, ref } from "vue"
export const useKeydown = (key,handler) => {
const mousetrap = inject('mousetrap') as any
const event = ref()
onMounted(() => {
event.value = mousetrap.bind(key, handler)
})
onUnmounted(() => {
event.value.unbind(key, handler)
})
}

@ -76,7 +76,7 @@ defineExpose({
</tr> </tr>
<tr> <tr>
<td><div class="key" data-key="g a" /></td> <td><div class="key" data-key="g a" /></td>
<td>进入AI工单主页</td> <td>进入图检审批主页</td>
</tr> </tr>
<tr> <tr>
<td><div class="key" data-key="g e" /></td> <td><div class="key" data-key="g e" /></td>

@ -5,6 +5,18 @@ import { useUser } from "@/store/modules/user";
import { getImgUrl } from "@/utils/urlUtils"; import { getImgUrl } from "@/utils/urlUtils";
import defaultAvatar from "@/assets/icons/avatar.svg"; import defaultAvatar from "@/assets/icons/avatar.svg";
/**
* 用户权限菜单
*/
interface IUserMenu {
id: number,
name: string,
resKey: string,
resUrl: string
icon: string,
level: number,
parentId: number
}
const emit = defineEmits<{ const emit = defineEmits<{
(e: "logout"): void (e: "logout"): void
}>(); }>();
@ -16,7 +28,10 @@ const userStore = useUser();
const useInfo = userStore.getUserInfo; const useInfo = userStore.getUserInfo;
const aiDisabled = ref(false); const aiDisabled = ref(false);
const userMenus = computed<IUserMenu[]>(() => {
return userStore.getUserInfo.frontmenuTList
})
function handleSelect(row) { function handleSelect(row) {
userStore.updateTenantId(row.key); userStore.updateTenantId(row.key);
location.reload(); location.reload();
@ -25,24 +40,30 @@ function handleSelect(row) {
function logIt(e) { function logIt(e) {
return false; return false;
} }
function hasPerm(resKey) {
return userMenus.value.some(i => i.resKey === resKey)
}
// //
function goHome(e) { function goHome(e) {
if (!hasPerm('home_main')) return
router.push({ name: "home" }); router.push({ name: "home" });
} }
// //
function goTask(e) { function goTask(e) {
if (!hasPerm('task-main')) return
router.push({ name: "task-main" }); router.push({ name: "task-main" });
} }
// AI // AI
function goWorksheet(e) { function goWorksheet(e) {
if (!hasPerm('worksheet-main')) return
router.push({ name: "worksheet-main" }); router.push({ name: "worksheet-main" });
} }
// //
function goFinal(e) { function goFinal(e) {
if (!hasPerm('final-main')) return
router.push({ name: "final-main" }); router.push({ name: "final-main" });
} }

@ -170,7 +170,7 @@ export default defineComponent({
mousetrap.bind('n r', quillHandler) mousetrap.bind('n r', quillHandler)
mousetrap.bind('n t', quillHandler) mousetrap.bind('n t', quillHandler)
mousetrap.bind('n n', recycleHandler) mousetrap.bind('n n', recycleHandler)
mousetrap.bind('m m', searchHandler) mousetrap.bind('/', searchHandler)
}) })
const defaultAvatarSrc = ref(defaultAvatar) const defaultAvatarSrc = ref(defaultAvatar)

@ -24,6 +24,7 @@ import { asideMap } from '@/config/final'
import type { AsideConfig } from '/#/api' import type { AsideConfig } from '/#/api'
import emitter from '@/utils/mitt' import emitter from '@/utils/mitt'
import { getFilterList } from '@/api/home/main' import { getFilterList } from '@/api/home/main'
import { useKeydown } from '@/hooks/event/useKeydown'
const emit = defineEmits(['inputChange',]) const emit = defineEmits(['inputChange',])
const finalStore = useFinal() const finalStore = useFinal()
@ -336,6 +337,7 @@ function updateComponent(key, e) {
defineExpose({ defineExpose({
showSearch, showSearch,
}); });
useKeydown('s', () => setShowSearch(true))
</script> </script>
<template> <template>

@ -20,6 +20,7 @@ import { deleteCondition, getConditionList, sort } from '@/api/home/filter'
import type { FilterSearchParam } from '/#/api' import type { FilterSearchParam } from '/#/api'
import SvgIcon from '@/components/Icon/SvgIcon.vue' import SvgIcon from '@/components/Icon/SvgIcon.vue'
import { useKeydown } from '@/hooks/event/useKeydown'
defineOptions({ name: 'FilterModal' }) defineOptions({ name: 'FilterModal' })
@ -242,7 +243,7 @@ function handleClick() {
// show.value = false; // show.value = false;
closeModal() closeModal()
} }
useKeydown('n t', handleClick)
let sortTable: Sortable | null = null let sortTable: Sortable | null = null
const tableRef = ref<InstanceType<typeof NDataTable>>() const tableRef = ref<InstanceType<typeof NDataTable>>()
@ -391,7 +392,7 @@ function handleOk() {
<div v-else class="wrapper-form"> <div v-else class="wrapper-form">
<div class="del_btn"> <div class="del_btn">
<NButton icon-placement="left" size="medium" @click="deleteSelection"> <NButton icon-placement="left" size="medium" @click="deleteSelection()">
<template #icon> <template #icon>
<SvgIcon name="delete-history" size="16" /> <SvgIcon name="delete-history" size="16" />
</template> </template>

@ -193,6 +193,9 @@ watch(
function showModal() { function showModal() {
show.value = true show.value = true
setTimeout(() => {
formValue.name = ''
}, 300);
} }
function closeModal() { function closeModal() {

@ -25,6 +25,7 @@ import { asideMap } from '@/config/aside'
import type { AsideConfig } from '/#/api' import type { AsideConfig } from '/#/api'
import emitter from '@/utils/mitt' import emitter from '@/utils/mitt'
import { getFilterList } from '@/api/home/main' import { getFilterList } from '@/api/home/main'
import { useKeydown } from '@/hooks/event/useKeydown'
const configStore = useConfig() const configStore = useConfig()
@ -285,7 +286,7 @@ function handleOk(item: any) {
filterHandler('') filterHandler('')
} }
} }
useKeydown('s', () => setShowSearch(true))
// watch(asideValue, (newVal) => { // watch(asideValue, (newVal) => {
// console.log("asideValue", newVal); // console.log("asideValue", newVal);
// configStore.setAsideValue(newVal) // configStore.setAsideValue(newVal)

@ -18,6 +18,7 @@ import Action from '../Action.vue'
import { deleteCondition, getConditionList, sort } from '@/api/home/filter' import { deleteCondition, getConditionList, sort } from '@/api/home/filter'
import type { FilterSearchParam } from '/#/api' import type { FilterSearchParam } from '/#/api'
import SvgIcon from '@/components/Icon/SvgIcon.vue' import SvgIcon from '@/components/Icon/SvgIcon.vue'
import { useKeydown } from '@/hooks/event/useKeydown'
defineOptions({ name: 'FilterModal' }) defineOptions({ name: 'FilterModal' })
const props = defineProps({ const props = defineProps({
@ -26,6 +27,7 @@ const props = defineProps({
default: () => 0, default: () => 0,
}, },
}) })
const emit = defineEmits<{ const emit = defineEmits<{
(e: 'showNewFilter'): void (e: 'showNewFilter'): void
(e: 'editFilter', filter: any): void (e: 'editFilter', filter: any): void
@ -54,7 +56,7 @@ interface RowData {
updateby: string updateby: string
updatetime: string updatetime: string
} }
useKeydown('n t', handleClick)
function sortData(row) { function sortData(row) {
console.log('sortData', row) console.log('sortData', row)
if (row.order == 'descend') { if (row.order == 'descend') {
@ -438,7 +440,7 @@ function handleOk() {
<div v-else class="wrapper-form"> <div v-else class="wrapper-form">
<div class="del_btn"> <div class="del_btn">
<n-button icon-placement="left" size="medium" @click="deleteSelection"> <n-button icon-placement="left" size="medium" @click="deleteSelection()">
<template #icon> <template #icon>
<SvgIcon name="delete-history" size="16" /> <SvgIcon name="delete-history" size="16" />
</template> </template>

@ -216,6 +216,9 @@ function showModal() {
const list = generateAllData(configStore.systemConfig) const list = generateAllData(configStore.systemConfig)
typeOptions.value = list typeOptions.value = list
show.value = true show.value = true
setTimeout(() => {
formValue.name = ''
}, 300);
} }
function closeModal() { function closeModal() {

@ -34,6 +34,7 @@ import { isEmpty } from '@/utils'
import { formatToDateHMS } from '@/utils/dateUtil' import { formatToDateHMS } from '@/utils/dateUtil'
import { hideDownload } from '@/utils/image' import { hideDownload } from '@/utils/image'
import bgLoading from '@/assets/images/bg-loading.png' import bgLoading from '@/assets/images/bg-loading.png'
import { useKeydown } from '@/hooks/event/useKeydown'
const emit = defineEmits(['setAsideItemName']) const emit = defineEmits(['setAsideItemName'])
@ -492,6 +493,7 @@ function immersionHandler() {
// taskStore.updateImmersion() // taskStore.updateImmersion()
toggleFullScreen() toggleFullScreen()
} }
useKeydown('k k', immersionHandler)
// //
function toggleFullScreen() { function toggleFullScreen() {
isFullScreen.value = !isFullScreen.value isFullScreen.value = !isFullScreen.value
@ -728,13 +730,20 @@ function sortHandler(orderby: 'similarityScore' | 'createdate') {
style="cursor: pointer" style="cursor: pointer"
@click="immersionHandler" @click="immersionHandler"
/> />
<SvgIcon <n-tooltip
v-else v-else
size="20" placement="bottom"
name="immersion-model" >
style="cursor: pointer" <template #trigger>
@click="immersionHandler" <SvgIcon
/> size="20"
name="immersion-model"
style="cursor: pointer"
@click="immersionHandler"
/>
</template>
<span>沉浸模式</span>
</n-tooltip>
</div> </div>
</div> </div>
<div v-show="showActions" class="batch"> <div v-show="showActions" class="batch">

@ -193,6 +193,9 @@ watch(
function showModal() { function showModal() {
show.value = true show.value = true
setTimeout(() => {
formValue.name = ''
}, 300);
} }
function closeModal() { function closeModal() {

@ -27,6 +27,7 @@ import { hideDownload } from '@/utils/image'
import emitter from '@/utils/mitt' import emitter from '@/utils/mitt'
import type { ApprovalParam, SimilarityPictureSortParam } from '/#/api' import type { ApprovalParam, SimilarityPictureSortParam } from '/#/api'
import bgLoading from '@/assets/images/bg-loading.png' import bgLoading from '@/assets/images/bg-loading.png'
import { useKeydown } from '@/hooks/event/useKeydown'
const batch = ref(false) // const batch = ref(false) //
const selectItems = ref<any[]>([]) const selectItems = ref<any[]>([])
@ -338,7 +339,7 @@ function onEsc(event: KeyboardEvent) {
else keyXLastTime = currentKTime else keyXLastTime = currentKTime
} }
} }
useKeydown('k k', immersionHandler)
onUnmounted(() => { onUnmounted(() => {
workStore.reset() workStore.reset()
document.removeEventListener('keydown', onEsc) document.removeEventListener('keydown', onEsc)
@ -590,13 +591,20 @@ defineExpose({
style="cursor: pointer" style="cursor: pointer"
@click="immersionHandler" @click="immersionHandler"
/> />
<SvgIcon <n-tooltip
v-else v-else
size="20" placement="bottom"
name="immersion-model" >
style="cursor: pointer" <template #trigger>
@click="immersionHandler" <SvgIcon
/> size="20"
name="immersion-model"
style="cursor: pointer"
@click="immersionHandler"
/>
</template>
<span>沉浸模式</span>
</n-tooltip>
</div> </div>
</div> </div>

Loading…
Cancel
Save