diff --git a/src/packages/components/Informations/Texts/TextCommon/config.ts b/src/packages/components/Informations/Texts/TextCommon/config.ts index b20c318e..e71a8158 100644 --- a/src/packages/components/Informations/Texts/TextCommon/config.ts +++ b/src/packages/components/Informations/Texts/TextCommon/config.ts @@ -14,6 +14,8 @@ export const WritingModeObject = { } export const option = { + link:'', + linkHead:'http://', dataset: '我是文本', fontSize: 20, fontColor: '#ffffff', diff --git a/src/packages/components/Informations/Texts/TextCommon/config.vue b/src/packages/components/Informations/Texts/TextCommon/config.vue index 4988e9c4..2592f35a 100644 --- a/src/packages/components/Informations/Texts/TextCommon/config.vue +++ b/src/packages/components/Informations/Texts/TextCommon/config.vue @@ -5,6 +5,11 @@ <n-input v-model:value="optionData.dataset" size="small"></n-input> </setting-item> </setting-item-box> + <setting-item-box name="链接" :alone="true"> + <setting-item> + <n-input-group><n-select v-model:value="optionData.linkHead" size="small" :style="{ width: '33%' }" :options="linkHeadOptions" /><n-input v-model:value="optionData.link" size="small"></n-input><n-button :disabled="!optionData.link" secondary size="small" @click="handleLinkClick" >跳转</n-button></n-input-group> + </setting-item> + </setting-item-box> </collapse-item> <collapse-item name="样式" :expanded="true"> @@ -69,7 +74,6 @@ import { SettingItemBox, SettingItem } from '@/components/Pages/ChartItemSetting' - const props = defineProps({ optionData: { type: Object as PropType<typeof option>, @@ -84,4 +88,15 @@ const verticalOptions = [{ label: WritingModeEnum.VERTICAL, value: WritingModeObject[WritingModeEnum.VERTICAL] }] +const handleLinkClick = ()=>{ + window.open(props.optionData.linkHead+props.optionData.link) +} +const linkHeadOptions = [{ + label: 'http://', + value: 'http://' + }, + { + label: 'https://', + value: 'https://' + }] </script> diff --git a/src/packages/components/Informations/Texts/TextCommon/index.vue b/src/packages/components/Informations/Texts/TextCommon/index.vue index 1701fae9..18990c70 100644 --- a/src/packages/components/Informations/Texts/TextCommon/index.vue +++ b/src/packages/components/Informations/Texts/TextCommon/index.vue @@ -15,7 +15,10 @@ background-color:${backgroundColor}`" > - {{ option.dataset }} + <n-button v-if="link" @click="click" text> + {{ dataset }} + </n-button> + <span v-else>{{ dataset }}</span> </div> </div> </template> @@ -35,6 +38,8 @@ const props = defineProps({ const { w, h } = toRefs(props.chartConfig.attr) const { + linkHead, + link, dataset, fontColor, fontSize, @@ -68,6 +73,11 @@ watch( useChartDataFetch(props.chartConfig, useChartEditStore, (newData: string) => { option.dataset = newData }) + +//打开链接 +const click = () => { + window.open(linkHead.value+link.value) +} </script> <style lang="scss" scoped>