feat:json查看

This commit is contained in:
dzc committed 2025-04-17 14:23:40 +08:00
1 parent e60454b496
commit 997487c934
5 files changed
+123 -46

No files matched your search

+2 -2
View File
@@ -1,8 +1,8 @@
import request from "/@/utils/request"
export function fetchList(query?: Object) {
export function pageJoin(query?: Object) {
return request({
url: "/hard/hard-door-flow/page",
url: "/hard/hard-door-flow/page-join",
method: "get",
params: query,
})
+55
View File
@@ -0,0 +1,55 @@
<template>
<div>
<el-button :style="jsonViewStyle" type="text" link @click="jsonViewVisible = true">
<div :style="jsonViewStyle" class="json-view">{{ jsonView }}</div>
</el-button>
<el-dialog append-to-body v-model="jsonViewVisible">
<vue-json-pretty :data="jsonData" showLength showLineNumber showIcon :collapsedOnClickBrackets="false" />
<template #footer>
<el-button @click="jsonViewVisible = false">关闭</el-button>
</template>
</el-dialog>
</div>
</template>
<script lang="ts" setup name="preview-json">
import VueJsonPretty from "vue-json-pretty"
import "vue-json-pretty/lib/styles.css"
type Props = {
width?: number
json?: string
}
const props = withDefaults(defineProps<Props>(), {
width: 0,
json: "",
})
const jsonViewVisible = ref<boolean>(false)
const jsonData = computed(() => {
if (!props.json) return ""
if (typeof props.json == "string") return JSON.parse(props.json)
return props.json
})
const jsonView = computed(() => {
if (!props.json) return ""
if (typeof props.json != "string") return JSON.stringify(props.json)
return props.json
})
const jsonViewStyle = computed(() => {
if (!props.width) return { width: "160px !important" }
return { width: `${props.width}px !important` }
})
</script>
<style lang="scss" scoped>
.json-view {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
</style>
+2
View File
@@ -12,6 +12,7 @@ import Tip from "/@/components/Tip/index.vue"
import TagList from "/@/components/TagList/index.vue"
import SvgIcon from "/@/components/SvgIcon/index.vue"
import PreviewImage from "/@/components/PreviewImage/index.vue"
import PreviewJson from "/@/components/PreviewJson/index.vue"
import DraggableDepTree from "/@/components/DraggableDepTree/index.vue"
// 业务组件
@@ -66,6 +67,7 @@ export default {
app.component("TagList", TagList)
app.component("SvgIcon", SvgIcon)
app.component("PreviewImage", PreviewImage)
app.component("PreviewJson", PreviewJson)
app.component("DraggableDepTree", DraggableDepTree)
app.component("TreeMultipleSelect", TreeMultipleSelect)
app.component("SelectHard", SelectHard)
+56 -17
View File
@@ -23,21 +23,60 @@
@sort-change="sortChangeHandle"
>
<el-table-column type="selection" width="40" align="center" />
<el-table-column type="index" label="#" width="40" />
<el-table-column prop="orderId" label="订单编号" show-overflow-tooltip />
<el-table-column prop="authId" label="授权编号" show-overflow-tooltip />
<el-table-column prop="openEventId" label="开门事件编号" show-overflow-tooltip />
<el-table-column prop="openOutOpenNo" label="商户自定义开门请求号" show-overflow-tooltip />
<el-table-column prop="openCallbackRes" label="开门回调结果" show-overflow-tooltip />
<el-table-column prop="openCallbackTime" label="开门回调时间" show-overflow-tooltip />
<el-table-column prop="videoCallbackRes" label="视频回调结果" show-overflow-tooltip />
<el-table-column prop="videoCallbackTime" label="视频回调时间" show-overflow-tooltip />
<el-table-column prop="skuKsRecogId" label="识别任务唯一ID,用于结果获取,重新发起售后识别" show-overflow-tooltip />
<el-table-column prop="skuSubmitTime" label="sku识别提交时间" show-overflow-tooltip />
<el-table-column prop="skuCallbackRes" label="sku识别回调结果" show-overflow-tooltip />
<el-table-column prop="skuCallbackTime" label="sku识别回调时间" show-overflow-tooltip />
<el-table-column prop="skuDrivingRes" label="sku识别主动获取结果" show-overflow-tooltip />
<el-table-column prop="skuDrivingTime" label="sku识别主动获取时间" show-overflow-tooltip />
<el-table-column type="index" label="#" width="80" />
<el-table-column label="购买用户">
<el-table-column prop="username" label="姓名" width="120" />
<el-table-column prop="userMobile" label="手机号" width="120" />
</el-table-column>
<el-table-column label="开门流程">
<el-table-column prop="requestOpenDto" label="请求开门参数" width="180">
<template #default="{ row }">
<preview-json :json="row.requestOpenDto" />
</template>
</el-table-column>
<el-table-column prop="requestOpenVo" label="请求开门返回" width="180">
<template #default="{ row }">
<preview-json :json="row.requestOpenVo" />
</template>
</el-table-column>
<el-table-column prop="isOpen" label="是否开门" width="100">
<template #default="{ row }">
<dict-tag :options="yes_no_type" :value="row.isOpen" />
</template>
</el-table-column>
<el-table-column prop="requestOpenTime" label="请求开门时间" width="160" />
<el-table-column prop="openCallbackVo" label="开门回调返回" width="180">
<template #default="{ row }">
<preview-json :json="row.requestOpenVo" />
</template>
</el-table-column>
<el-table-column prop="openCallbackTime" label="开门回调时间" width="160" />
</el-table-column>
<el-table-column label="识别流程">
<el-table-column prop="videoCallbackTime" label="视频回调时间" width="160" />
<el-table-column prop="videoCallbackVo" label="视频回调结果" width="180">
<template #default="{ row }">
<preview-json :json="row.videoCallbackVo" />
</template>
</el-table-column>
<el-table-column prop="skuSubmitTime" label="商品识别提交时间" width="160" />
<el-table-column prop="skuSubmitDto" label="商品识别提交参数" width="180">
<template #default="{ row }">
<preview-json :json="row.skuSubmitDto" />
</template>
</el-table-column>
<el-table-column prop="skuSubmitVo" label="商品识别提交返回" width="180">
<template #default="{ row }">
<preview-json :json="row.skuSubmitVo" />
</template>
</el-table-column>
<el-table-column prop="skuCallbackTime" label="商品识别回调时间" width="180" />
<el-table-column prop="skuCallbackVo" label="商品识别回调返回" width="180">
<template #default="{ row }">
<preview-json :json="row.skuCallbackVo" />
</template>
</el-table-column>
</el-table-column>
<el-table-column label="操作" width="150"> </el-table-column>
</el-table>
<pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" v-bind="state.pagination" />
@@ -53,7 +92,7 @@ import { useDict } from "/@/hooks/dict"
// 引入组件
// 定义查询字典
const { yes_no_type } = useDict("yes_no_type")
// 定义变量内容
// 搜索变量
const queryRef = ref()
@@ -64,7 +103,7 @@ const multiple = ref(true)
const state: BasicTableProps = reactive<BasicTableProps>({
queryForm: {},
pageList: hardDoorFlow.fetchList,
pageList: hardDoorFlow.pageJoin,
})
// table hook
+8 -27
View File
@@ -39,20 +39,18 @@
<dict-tag :options="third_biz_type" :value="row.bizType" />
</template>
</el-table-column>
<el-table-column prop="apiUrl" label="api url" show-overflow-tooltip />
<el-table-column prop="res" label="res" show-overflow-tooltip>
<el-table-column prop="apiUrl" label="api url" />
<el-table-column prop="res" label="res">
<template #default="{ row }">
<el-button v-if="row.res" text type="primary" @click="row.res && handleClickJsonView(row.res)">查看</el-button>
<div v-else class="color-danger">null</div>
<preview-json :json="row.res" />
</template>
</el-table-column>
<el-table-column prop="req" label="req" show-overflow-tooltip>
<el-table-column prop="req" label="req">
<template #default="{ row }">
<el-button v-if="row.req" text type="primary" @click="row.req && handleClickJsonView(row.req)">查看</el-button>
<div v-else class="color-danger">null</div>
<preview-json :json="row.req" />
</template>
</el-table-column>
<el-table-column prop="error" label="调用错误" show-overflow-tooltip>
<el-table-column prop="error" label="调用错误">
<template #default="{ row }">
<el-button
v-if="row.error"
@@ -67,8 +65,8 @@
<div v-else class="color-danger">null</div>
</template>
</el-table-column>
<el-table-column prop="timeConsuming" label="耗时(毫秒)" show-overflow-tooltip />
<el-table-column prop="createTime" label="创建时间" show-overflow-tooltip />
<el-table-column prop="timeConsuming" label="耗时(毫秒)" />
<el-table-column prop="createTime" label="创建时间" />
</el-table>
<pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" v-bind="state.pagination" />
</div>
@@ -76,14 +74,6 @@
<!-- 编辑、新增 -->
<form-dialog ref="formDialogRef" @refresh="getDataList(false)" />
<!-- json查看 -->
<el-dialog v-model="jsonViewVisible">
<vue-json-pretty :data="jsonData" showLength showLineNumber showIcon :collapsedOnClickBrackets="false" />
<template #footer>
<el-button @click="jsonViewVisible = false">关闭</el-button>
</template>
</el-dialog>
<!-- 调用错误 -->
<log-detail ref="logDetailRef" />
</div>
@@ -94,8 +84,6 @@ import { BasicTableProps, useTable } from "/@/hooks/table"
import * as thirdDoorLog from "/@/api/thirdparty/third-door-log"
import { useMessage, useMessageBox } from "/@/hooks/message"
import { useDict } from "/@/hooks/dict"
import VueJsonPretty from "vue-json-pretty"
import "vue-json-pretty/lib/styles.css"
const FormDialog = defineAsyncComponent(() => import("./form.vue"))
const LogDetail = defineAsyncComponent(() => import("./detail.vue"))
@@ -108,7 +96,6 @@ const queryRef = ref()
// 多选变量
const selectObjs = ref([]) as any
const multiple = ref(true)
const jsonViewVisible = ref<boolean>()
const jsonData = ref()
const logDetailRef = ref()
@@ -140,12 +127,6 @@ const selectionChangHandle = (objs: { id: string }[]) => {
multiple.value = !objs.length
}
// 点击查看json
const handleClickJsonView = (json: any) => {
jsonViewVisible.value = true
jsonData.value = JSON.parse(json)
}
// 删除操作
const handleDelete = async (ids: string[]) => {
try {