feat: support view as hex/binary for the key with type string

This commit is contained in:
tiny-craft 2023-09-08 11:39:00 +08:00
parent dbb5969e34
commit b7e9d974cb
3 changed files with 89 additions and 52 deletions

View File

@ -11,8 +11,9 @@ import Edit from '@/components/icons/Edit.vue'
import { IsJson } from '@/utils/check_string_format.js'
import { types as redisTypes } from '@/consts/support_redis_type.js'
import { ClipboardSetText } from 'wailsjs/runtime/runtime.js'
import { toLower } from 'lodash'
import { map, toLower } from 'lodash'
import useConnectionStore from 'stores/connections.js'
import { fromBase64, fromBase64Json, toBinary, toHex, toJsonText } from '@/utils/string_convert.js'
const i18n = useI18n()
const themeVars = useThemeVars()
@ -28,53 +29,16 @@ const props = defineProps({
value: String,
})
const viewOption = [
{
value: types.PLAIN_TEXT,
label: types.PLAIN_TEXT,
},
{
value: types.JSON,
label: types.JSON,
},
{
value: types.BASE64_TO_TEXT,
label: types.BASE64_TO_TEXT,
},
{
value: types.BASE64_TO_JSON,
label: types.BASE64_TO_JSON,
},
]
const viewOption = computed(() =>
map(types, (t) => {
return {
value: t,
label: t,
}
}),
)
const viewAs = ref(types.PLAIN_TEXT)
const getJsonValue = () => {
try {
const jsonObj = JSON.parse(props.value)
return JSON.stringify(jsonObj, null, 2)
} catch (e) {
return props.value
}
}
const getBase64Value = () => {
try {
return atob(props.value)
} catch (e) {
return props.value
}
}
const getBase64JsonValue = () => {
try {
const text = atob(props.value)
const jsonObj = JSON.parse(text)
return JSON.stringify(jsonObj, null, 2)
} catch (e) {
return props.value
}
}
const autoDetectFormat = () => {
// auto check format when loaded
if (IsJson(props.value)) {
@ -104,11 +68,15 @@ const viewValue = computed(() => {
case types.PLAIN_TEXT:
return props.value
case types.JSON:
return getJsonValue()
return toJsonText(props.value)
case types.BASE64_TO_TEXT:
return getBase64Value()
return fromBase64(props.value)
case types.BASE64_TO_JSON:
return getBase64JsonValue()
return fromBase64Json(props.value)
case types.HEX:
return toHex(props.value)
case types.BINARY:
return toBinary(props.value)
default:
return props.value
}
@ -116,9 +84,6 @@ const viewValue = computed(() => {
const viewLanguage = computed(() => {
switch (viewAs.value) {
case types.PLAIN_TEXT:
case types.BASE64_TO_TEXT:
return 'plaintext'
case types.JSON:
case types.BASE64_TO_JSON:
return 'json'

View File

@ -3,4 +3,6 @@ export const types = {
JSON: 'JSON',
BASE64_TO_TEXT: 'Base64 To Text',
BASE64_TO_JSON: 'Base64 To JSON',
HEX: 'Hex',
BINARY: 'Binary',
}

View File

@ -0,0 +1,70 @@
import { map, padStart } from 'lodash'
/**
* convert string to json
* @param str
* @return {string}
*/
export const toJsonText = (str) => {
try {
const jsonObj = JSON.parse(str)
return JSON.stringify(jsonObj, null, 2)
} catch (e) {
return str
}
}
/**
* convert string from base64
* @param str
* @return {string}
*/
export const fromBase64 = (str) => {
try {
return atob(str)
} catch (e) {
return str
}
}
/**
* convert string from base64 to json
* @param str
* @return {string}
*/
export const fromBase64Json = (str) => {
try {
const text = atob(str)
const jsonObj = JSON.parse(text)
return JSON.stringify(jsonObj, null, 2)
} catch (e) {
return str
}
}
/**
* convert string to hex string
* @param str
* @return {string}
*/
export const toHex = (str) => {
const hexArr = map(str, (char) => {
const charCode = char.charCodeAt(0)
return charCode.toString(16)
})
return hexArr.join(' ')
}
/**
* convert string to binary string
* @param str
* @return {string}
*/
export const toBinary = (str) => {
const codeUnits = map(str, (char) => {
let code = char.charCodeAt(0).toString(2)
code = padStart(code, 8, '0')
return code
})
return codeUnits.join(' ')
}