fix(项目管理): 调整插件图片查看方式

--bug=1043603 --user=宋昌昌 [项目管理]github #31876项目管理中的缺陷配置,提示图片无法看清 https://www.tapd.cn/55049933/s/1549644
This commit is contained in:
song-cc-rock 2024-07-17 13:40:02 +08:00 committed by 刘瑞斌
parent 2ebb114cba
commit 2cb323a7ba
3 changed files with 16 additions and 12 deletions

View File

@ -8,17 +8,8 @@
/> />
<div class="flex flex-row items-center gap-[10px] text-[12px] leading-[16px]"> <div class="flex flex-row items-center gap-[10px] text-[12px] leading-[16px]">
<span class="mt-2 text-[var(--color-text-4)]">{{ attrs.subDesc }}</span> <span class="mt-2 text-[var(--color-text-4)]">{{ attrs.subDesc }}</span>
<a-popover position="rt"> <a v-if="previewIcon" class="show-sub" @click="showPreviewImg">{{ t('project.menu.show') }}</a>
<template #title> <a-image-preview v-model:visible="imgVisible" :default-scale="0.75" :src="previewIcon" />
{{ null }}
</template>
<template #content>
<div class="max-w-[300px]">
<img class="w-full" :src="previewIcon" />
</div>
</template>
<span class="mt-2 cursor-pointer text-[rgb(var(--primary-5))]">{{ t('project.menu.preview') }}</span>
</a-popover>
</div> </div>
</template> </template>
@ -33,6 +24,7 @@
const attrs = useAttrs(); const attrs = useAttrs();
const { formCreateInject } = attrs; const { formCreateInject } = attrs;
const imgVisible = ref(false);
const props = defineProps<{ const props = defineProps<{
instructionsIcon: string; instructionsIcon: string;
@ -71,6 +63,9 @@
} }
} }
}; };
const showPreviewImg = () => {
imgVisible.value = true;
};
watchEffect(() => { watchEffect(() => {
if (props.value) { if (props.value) {
inputValue.value = props.value; inputValue.value = props.value;
@ -78,4 +73,11 @@
}); });
</script> </script>
<style scoped></style> <style scoped>
.show-sub {
font-size: 12px;
padding-top: 0.6rem;
color: rgb(var(--primary-5)) !important;
cursor: pointer;
}
</style>

View File

@ -65,6 +65,7 @@ export default {
'project.menu.demandType': 'Requirement Type', 'project.menu.demandType': 'Requirement Type',
'project.menu.howGetJiraKey': 'How to Get JIRA Project Key', 'project.menu.howGetJiraKey': 'How to Get JIRA Project Key',
'project.menu.preview': 'Preview', 'project.menu.preview': 'Preview',
'project.menu.show': 'Show',
'project.menu.pleaseInputJiraKey': 'Please enter JIRA project key', 'project.menu.pleaseInputJiraKey': 'Please enter JIRA project key',
'project.menu.addFalseAlertRules': 'Add False Alert Rule', 'project.menu.addFalseAlertRules': 'Add False Alert Rule',
'project.menu.updateFalseAlertRules': 'Update False Alert Rule', 'project.menu.updateFalseAlertRules': 'Update False Alert Rule',

View File

@ -60,6 +60,7 @@ export default {
'project.menu.demandType': '需求类型', 'project.menu.demandType': '需求类型',
'project.menu.howGetJiraKey': '如何获取JIRA 项目 key ', 'project.menu.howGetJiraKey': '如何获取JIRA 项目 key ',
'project.menu.preview': '预览', 'project.menu.preview': '预览',
'project.menu.show': '查看',
'project.menu.pleaseInputJiraKey': '请输入 JIRA 项目 key', 'project.menu.pleaseInputJiraKey': '请输入 JIRA 项目 key',
'project.menu.addFalseAlertRules': '新增误报规则', 'project.menu.addFalseAlertRules': '新增误报规则',
'project.menu.updateFalseAlertRules': '更新误报规则', 'project.menu.updateFalseAlertRules': '更新误报规则',