@open-data-v/data/lib/websocket/WebsocketView.vue.umd2.cjs.map

OpenDataV 数据处理基础组件包

{"version":3,"file":"WebsocketView.vue.umd2.cjs","sources":["../../src/websocket/WebsocketView.vue"],"sourcesContent":["<template>\n  <o-card>\n    <div class=\"flex flex-col flex-nowrap\">\n      <slot name=\"data-select\"></slot>\n    </div>\n    <div class=\"flex flex-row flex-nowrap\">\n      <o-input v-model:value=\"formData['url']\" class=\"flex-1\" @update-value=\"formChange\" />\n      <div>\n        <o-button-group>\n          <o-button type=\"primary\" @click=\"connect\">链接</o-button>\n          <o-button @click=\"send\">发送</o-button>\n        </o-button-group>\n      </div>\n    </div>\n    <o-card name=\"query\" title=\"消息\">\n      <OCodeEditor v-model:value=\"formData.message\" height=\"100px\" />\n    </o-card>\n    <o-card name=\"origin\" title=\"原始数据结果\">\n      <OCodeEditor :value=\"response.data\" />\n    </o-card>\n  </o-card>\n</template>\n<script setup lang=\"ts\">\nimport { OButton, OButtonGroup, OCard, OInput } from '@open-data-v/ui'\nimport { onUnmounted, reactive, ref } from 'vue'\n\nimport { useWebsocket } from '../hooks/ws'\nimport type WebsocketData from './handler'\nimport type { WebsocketOption } from './type'\n\nconst props = withDefaults(\n  defineProps<{\n    options?: WebsocketOption\n    mode?: 'debug' | 'use'\n    index?: number\n    dataInstance?: WebsocketData\n  }>(),\n  {\n    options: () => {\n      return {\n        url: '',\n        message: '',\n        timeout: 3000,\n        isRetry: false,\n        maxRetryCount: 0\n      }\n    },\n    handler: () => {\n      return useWebsocket()\n    },\n    mode: 'use'\n  }\n)\n\nconst emits = defineEmits<{\n  (e: 'update:options', value: WebsocketOption): void\n  (e: 'change', value: WebsocketOption): void\n}>()\nconst formData = reactive<WebsocketOption>(props.options)\nconst response = ref({\n  data: ''\n})\nlet wsInstance: WebsocketData\n\nconst close = () => {\n  if (wsInstance) {\n    wsInstance.close()\n  }\n}\n\nconst connect = () => {\n  if (!props.dataInstance) {\n    return\n  }\n  wsInstance = props.dataInstance\n  const acceptor = (message) => {\n    response.value.data = message.data\n  }\n  wsInstance.debug(acceptor)\n}\nconst send = () => {\n  wsInstance.send(formData.message)\n}\nconst formChange = () => {\n  emits('change', formData)\n  emits('update:options', formData)\n}\n\ndefineExpose({ close })\n\nonUnmounted(() => {\n  if (!wsInstance) {\n    return\n  }\n  wsInstance.cancelDebug()\n})\n</script>\n"],"names":["props","__props","emits","__emit","formData","reactive","response","ref","wsInstance","close","connect","acceptor","message","send","formChange","__expose","onUnmounted"],"mappings":"8dA8BA,MAAMA,EAAQC,EAwBRC,EAAQC,EAIRC,EAAWC,EAAAA,SAA0BL,EAAM,OAAO,EAClDM,EAAWC,EAAAA,IAAI,CACnB,KAAM,EAAA,CACP,EACG,IAAAC,EAEJ,MAAMC,EAAQ,IAAM,CACdD,GACFA,EAAW,MAAM,CAErB,EAEME,EAAU,IAAM,CAChB,GAAA,CAACV,EAAM,aACT,OAEFQ,EAAaR,EAAM,aACb,MAAAW,EAAYC,GAAY,CACnBN,EAAA,MAAM,KAAOM,EAAQ,IAChC,EACAJ,EAAW,MAAMG,CAAQ,CAC3B,EACME,EAAO,IAAM,CACNL,EAAA,KAAKJ,EAAS,OAAO,CAClC,EACMU,EAAa,IAAM,CACvBZ,EAAM,SAAUE,CAAQ,EACxBF,EAAM,iBAAkBE,CAAQ,CAClC,EAEa,OAAAW,EAAA,CAAE,MAAAN,EAAO,EAEtBO,EAAAA,YAAY,IAAM,CACXR,GAGLA,EAAW,YAAY,CAAA,CACxB"}