22import type { ConfigItem } from " ~/types/index" ;
33
44// 批量导入所有图片资源
5- const imageModules = import .meta .glob <{ default: string }>(' @/assets/images/*.png' , { eager: true });
6-
7- // 辅助函数:从路径中获取文件名(不含扩展名)
8- const getImageByName = (filename : string ): string | undefined => {
9- for (const path in imageModules ) {
10- if (path .includes (` /${filename }.png ` )) {
11- return imageModules [path ]?.default ;
12- }
13- }
14- return undefined ;
15- };
5+ const imageModules = import .meta .glob <{ default: string }>(" @/assets/images/*.png" , { eager: true });
166
177const props = defineProps <{
188 item: ConfigItem ;
199 protocol? : string ;
2010 selected? : boolean ;
2111}>();
2212
23- // 创建图片映射表 - 映射应用名称到图片文件名
24- const imagesMap: Record <string , string | undefined > = {
25- iterm: getImageByName (' item2' ),
26- dbeaver: getImageByName (' dbeaver' ),
27- mstsc: getImageByName (' mstsc' ),
28- terminal: getImageByName (' terminal' ),
29- vncviewer: getImageByName (' realvnc' ),
30- tigervnc: getImageByName (' tigerVnc' ),
31- securefx: getImageByName (' securecrt' ),
32- securecrt: getImageByName (' securecrt' ),
33- another_redis: getImageByName (' another_redis' ),
34- mongo_compass: getImageByName (' mongodb' ),
35- xshell: getImageByName (' xshell' ),
36- mobaxterm: getImageByName (' mobaxterm' ),
37- putty: getImageByName (' putty' ),
38- winscp: getImageByName (' winscp' ),
39- xftp: getImageByName (' xftp' ),
40- xfreerdp: getImageByName (' xfreerdp' ),
41- remmina: getImageByName (' remmina' ),
42- plsql: getImageByName (' plsql' ),
43- ssms17: getImageByName (' ssms17' ),
44- resp: getImageByName (' resp' ),
45- navicat17: getImageByName (' navicat17' ),
46- royalts: getImageByName (' royalts' ),
47- windows_rdm: getImageByName (' windows_rdm' ),
48- };
49-
5013const emit = defineEmits <{ (e : " toggle" , value : boolean ): void }>();
5114
5215const { t, locale } = useI18n ();
5316const { isWindows } = usePlatform ();
5417const { language } = useSettingManager ();
55- const { setAppConfig } = useSettingManager ();
18+ const { setAppConfig } = useSettingManager ();\
19+
20+ const imagesMap: Record <string , string | undefined > = {
21+ iterm: getImageByName (" item2" ),
22+ dbeaver: getImageByName (" dbeaver" ),
23+ mstsc: getImageByName (" mstsc" ),
24+ terminal: getImageByName (" terminal" ),
25+ vncviewer: getImageByName (" realvnc" ),
26+ tigervnc: getImageByName (" tigerVnc" ),
27+ securefx: getImageByName (" securecrt" ),
28+ securecrt: getImageByName (" securecrt" ),
29+ another_redis: getImageByName (" another_redis" ),
30+ mongo_compass: getImageByName (" mongodb" ),
31+ xshell: getImageByName (" xshell" ),
32+ mobaxterm: getImageByName (" mobaxterm" ),
33+ putty: getImageByName (" putty" ),
34+ winscp: getImageByName (" winscp" ),
35+ xftp: getImageByName (" xftp" ),
36+ xfreerdp: getImageByName (" xfreerdp" ),
37+ remmina: getImageByName (" remmina" ),
38+ plsql: getImageByName (" plsql" ),
39+ ssms17: getImageByName (" ssms17" ),
40+ resp: getImageByName (" resp" ),
41+ navicat17: getImageByName (" navicat17" ),
42+ royalts: getImageByName (" royalts" ),
43+ windows_rdm: getImageByName (" windows_rdm" ),
44+ toad: getImageByName (" toadOracle" )
45+ };
46+
5647
5748const commentText = computed (() => {
5849 const lang = language .value || (locale ?.value as string ) || " en" ;
@@ -66,8 +57,16 @@ const isWindowsPathPickTarget = computed(() => {
6657 return props .item ?.is_internal === false && isWindows .value ;
6758});
6859
69- const canToggle = computed (() => !! (props .item ?.path && props .item .path .trim ()))
60+ const canToggle = computed (() => !! (props .item ?.path && props .item .path .trim ()));
7061
62+ function getImageByName (filename : string ): string | undefined {
63+ for (const path in imageModules ) {
64+ if (path .includes (` /${filename }.png ` )) {
65+ return imageModules [path ]?.default ;
66+ }
67+ }
68+ return undefined ;
69+ };
7170
7271const onSwitch = (v : boolean ) => {
7372 if (! canToggle .value ) return ;
@@ -101,6 +100,13 @@ const selectExecutablePath = async () => {
101100 console .error (" select executable failed" , e );
102101 }
103102};
103+
104+ // 在 Windows 下,已选择路径后仍允许点击展示区域以重新选择
105+ const onPathClick = () => {
106+ if (isWindowsPathPickTarget .value ) {
107+ selectExecutablePath ();
108+ }
109+ };
104110 </script >
105111
106112<template >
@@ -124,8 +130,10 @@ const selectExecutablePath = async () => {
124130 </template >
125131 <template v-else >
126132 <div
127- class =" inline-flex items-center text-xs text-gray-600 dark:text-gray-300 bg-gray-100/80 dark:bg-white/10 rounded px-2 py-1 max-w-[22rem] md:max-w-[28rem] truncate"
133+ class =" inline-flex items-center text-xs text-gray-600 dark:text-gray-300 bg-gray-100/80 dark:bg-white/10 rounded px-2 py-1 max-w-88 md:max-w-md truncate"
134+ :class =" { 'cursor-pointer hover:bg-gray-200/60 dark:hover:bg-white/15': isWindowsPathPickTarget }"
128135 :title =" props.item.path || '-'"
136+ @click =" onPathClick"
129137 >
130138 <span class =" truncate" >{{ props.item.path || "-" }}</span >
131139 </div >
0 commit comments