feat:json查看
This commit is contained in:
1 parent
e60454b496
commit
997487c934
5 files changed
+123
-46
No files matched your search
@@ -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,
|
||||
})
|
||||
|
||||
@@ -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>
|
||||
@@ -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)
|
||||
|
||||
@@ -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
|
||||
|
||||
@@ -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 {
|
||||
|
||||
Reference in new issue
Block a user