JinZHouXiYiJi_DaPin2/resource/Text/SubText/SubText.vue

76 lines
1.8 KiB
Vue

<template>
<span v-resize="resizeHandler">
{{ propValue.base.label ? `${propValue.base.label}:` : '' }}
{{ customeText }}
{{ propValue.base.unit }}
</span>
</template>
<script setup lang="ts">
import { useData, useEventBus, useProp } from 'open-data-v/base'
import { onMounted, ref } from 'vue'
import { http } from '@/utils/http'
import type SubTextComponent from './config'
import type { SubTextType } from './type'
const props = defineProps<{
component: SubTextComponent
}>()
const { propValue } = useProp<SubTextType>(props.component)
const customeText = ref<string>('0')
const lineHeight = ref<string>('20px')
const resizeHandler = (entry: ResizeObserverEntry) => {
const { height } = entry.contentRect
lineHeight.value = `${height}px`
}
const dataHandler = (event) => {
console.log(event)
customeText.value = event
}
onMounted(async () => {
console.log(propValue)
try {
const queryParems = { tag: propValue.base.tag }
const res = await http.get({ url: propValue.base.url, params: queryParems })
if (res.status === 200 && Object.keys(res.data).includes(propValue.base.tag)) {
dataHandler(res.data)
}
} catch (error: any) {
console.log(error?.message)
}
})
const dataChange = (resp: any, _?: string) => {
console.log(resp)
if (!resp ||( !resp.afterData && !resp.data.data)) {
console.log("数据失败-----")
}
if(resp.afterData && resp.status === 'SUCCESS'){
console.log("数据-----afterData")
dataHandler(resp.afterData)
}else if(resp.data.data && resp.status === 'SUCCESS'){
console.log("数据-----data.data")
dataHandler(resp.data.data)
}
}
useData(props.component, dataChange)
</script>
<style lang="less" scoped>
span {
pointer-events: none;
display: inline-block;
width: 100%;
text-align: center;
line-height: v-bind(lineHeight);
}
</style>