mirror of
https://github.com/fofolee/uTools-quickcommand.git
synced 2025-06-07 21:46:12 +08:00
用树状图展示对象
This commit is contained in:
fofolee
parent
77bd51acdb
commit
715b4bc296
@ -8,7 +8,6 @@ const axios = require('axios');
|
||||
const http = require('http');
|
||||
const url = require('url')
|
||||
const kill = require('tree-kill')
|
||||
const beautifyLog = require('./lib/beautifyLog')
|
||||
require('ses')
|
||||
|
||||
window._ = require("lodash")
|
||||
@ -414,8 +413,6 @@ window.convertFilePathToUtoolsPayload = files => files.map(file => {
|
||||
}
|
||||
})
|
||||
|
||||
let parseStdout = stdout => stdout.map(x => beautifyLog(x)).join("\n")
|
||||
|
||||
let getSandboxFuns = () => {
|
||||
var sandbox = {
|
||||
fetch: fetch.bind(window),
|
||||
@ -466,7 +463,7 @@ window.runCodeInSandbox = (code, callback, addVars = {}) => {
|
||||
callback(stdout, null)
|
||||
},
|
||||
error: (...stderr) => {
|
||||
callback(null, parseStdout(stderr))
|
||||
callback(null, stderr)
|
||||
}
|
||||
}
|
||||
let sandboxWithAD = Object.assign(addVars, sandbox)
|
||||
|
||||
@ -128,7 +128,9 @@ export default {
|
||||
? alert(stderr)
|
||||
: this.showRunResult(stderr, false, action);
|
||||
}
|
||||
!outPlugin && this.showRunResult(stdout, true, action);
|
||||
outPlugin
|
||||
? action(stdout.toString())
|
||||
: this.showRunResult(stdout, true);
|
||||
},
|
||||
{ enterData: this.$root.enterData }
|
||||
);
|
||||
@ -151,7 +153,9 @@ export default {
|
||||
? alert(stderr)
|
||||
: this.showRunResult(stderr, false, action);
|
||||
}
|
||||
!outPlugin && this.showRunResult(stdout, true, action);
|
||||
outPlugin
|
||||
? action(stdout.toString())
|
||||
: this.showRunResult(stdout, true);
|
||||
}
|
||||
);
|
||||
}
|
||||
@ -228,20 +232,11 @@ export default {
|
||||
};
|
||||
},
|
||||
// 显示运行结果
|
||||
showRunResult(content, isSuccess, action) {
|
||||
showRunResult(content, isSuccess) {
|
||||
this.isResultShow = true;
|
||||
this.timeStamp = new Date().getTime();
|
||||
this.runResultStatus = isSuccess;
|
||||
// let contlength = content?.length || 0;
|
||||
// if (contlength > this.resultMaxLength)
|
||||
// content =
|
||||
// content.slice(0, this.resultMaxLength - 100) +
|
||||
// `\n\n...\n${
|
||||
// contlength - this.resultMaxLength - 100
|
||||
// } 字省略\n...\n\n` +
|
||||
// content.slice(contlength - 100);
|
||||
// let pretreatment = action(content);
|
||||
// pretreatment && (this.runResult += pretreatment);
|
||||
if (!_.isArray(content)) content = [content];
|
||||
this.runResult = this.runResult.concat(content);
|
||||
this.outputAutoHeight(this.fromUtools);
|
||||
},
|
||||
|
||||
@ -9,14 +9,19 @@
|
||||
@load="frameLoad"
|
||||
v-if="showFrame"
|
||||
></iframe>
|
||||
<div v-else v-show="!!runResult" :class="{ 'text-red': !runResultStatus }">
|
||||
<div
|
||||
v-else
|
||||
v-show="!!runResult"
|
||||
:class="{ 'text-red': !runResultStatus }"
|
||||
class="text q-pa-md"
|
||||
>
|
||||
<div v-for="item in runResult" :key="item">
|
||||
<ObjectTree
|
||||
:obj="item"
|
||||
v-if="typeof item === 'object'"
|
||||
@expandTrees="$emit('expandTrees')"
|
||||
/>
|
||||
<pre class="q-pa-md result" v-text="item" v-else></pre>
|
||||
<pre class="result" v-text="item" v-else></pre>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -103,12 +108,14 @@ export default {
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.text {
|
||||
font-family: Consolas, Monaco, "Courier New";
|
||||
}
|
||||
.result {
|
||||
white-space: pre-wrap;
|
||||
word-wrap: break-word;
|
||||
max-width: 100%;
|
||||
margin: 0;
|
||||
font-family: Consolas, Monaco, "Courier New";
|
||||
}
|
||||
iframe {
|
||||
width: 100%;
|
||||
|
||||
@ -1,20 +1,40 @@
|
||||
<template>
|
||||
<div class="q-pa-xs q-gutter-sm">
|
||||
<q-tree :nodes="trees" node-key="label" @lazy-load="showChildren" />
|
||||
<div class="q-gutter-sm">
|
||||
<q-tree
|
||||
:nodes="trees"
|
||||
no-connectors
|
||||
node-key="id"
|
||||
@lazy-load="showChildren"
|
||||
>
|
||||
<template v-slot:default-header="prop">
|
||||
<div class="text-primary">{{ prop.node.key }}</div>
|
||||
<div v-show="!!prop.node.key" v-text="':'" style="margin-right: 5px" />
|
||||
<div class="text-italic">{{ prop.node.summary }}</div>
|
||||
</template></q-tree
|
||||
>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { toRaw } from "vue";
|
||||
|
||||
const maxSize = {
|
||||
txt: 80,
|
||||
obj: 3,
|
||||
ary: 3,
|
||||
buff: 50,
|
||||
};
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
trees: [
|
||||
{
|
||||
label: "object",
|
||||
key: "",
|
||||
summary: this.liteItem(this.obj),
|
||||
lazy: true,
|
||||
item: this.obj,
|
||||
value: this.obj,
|
||||
id: "root",
|
||||
},
|
||||
],
|
||||
};
|
||||
@ -24,39 +44,92 @@ export default {
|
||||
},
|
||||
methods: {
|
||||
liteItem(item) {
|
||||
if (item === null) return "null";
|
||||
if (typeof item === "undefined") return "undefined";
|
||||
if (typeof item === "string")
|
||||
return _.truncate(item, { length: maxSize.txt });
|
||||
if (typeof item === "number") return item;
|
||||
if (typeof item === "function")
|
||||
return `[Function: ${item.name ? item.name : "(anonymous)"}]`;
|
||||
return `f ${item.name ? item.name + "()" : "anonymous()"}`;
|
||||
if (typeof item !== "object") return item.toString();
|
||||
if (_.isBuffer(item)) {
|
||||
var bufferString = `[Buffer ${item
|
||||
.slice(0, 50)
|
||||
.slice(0, maxSize.buff)
|
||||
.toString("hex")
|
||||
.match(/\w{1,2}/g)
|
||||
.map((x) => parseInt(x, 16))
|
||||
.join(" ")}`;
|
||||
if (item.length > 50)
|
||||
if (item.length > maxSize.buff)
|
||||
bufferString += `...${(item.length / 1000).toFixed(2)} kb `;
|
||||
return bufferString + "]";
|
||||
}
|
||||
if (item instanceof ArrayBuffer) return `ArrayBuffer(${item.byteLength})`;
|
||||
if (item instanceof Blob)
|
||||
return `Blob { size: ${item.size}, type: "${item.type}" }`;
|
||||
return "object";
|
||||
if (item instanceof Array) {
|
||||
return (
|
||||
"[" +
|
||||
item
|
||||
.map((i) => {
|
||||
if (typeof i === "function") return `f`;
|
||||
if (i instanceof Array) return `Array(${i.length})`;
|
||||
if (i instanceof Object) return `{...}`;
|
||||
return i;
|
||||
})
|
||||
.slice(0, maxSize.ary)
|
||||
.join(", ") +
|
||||
(item.length > maxSize.ary ? "..." : "") +
|
||||
"]"
|
||||
);
|
||||
}
|
||||
let keys = this.getObjKeys(item);
|
||||
if (keys.length === 0 && item.toString() !== "[object Object]")
|
||||
return item.toString();
|
||||
return (
|
||||
"{" +
|
||||
keys.slice(0, maxSize.obj).join(", ") +
|
||||
(keys.length > maxSize.obj ? "..." : "") +
|
||||
"}"
|
||||
);
|
||||
},
|
||||
getObjKeys(item) {
|
||||
// 一些特殊对象用 Object.keys() 无法获取
|
||||
let keys = [];
|
||||
for (const key in item) {
|
||||
keys.push(key);
|
||||
}
|
||||
return keys;
|
||||
},
|
||||
showChildren({ node, key, done, fail }) {
|
||||
let children = [];
|
||||
for (let key in node.item) {
|
||||
let value = toRaw(node.item)[key];
|
||||
if (typeof node.value === "string") {
|
||||
children.push({
|
||||
label: `${key}: ${this.liteItem(value)}`,
|
||||
lazy: typeof value === "object",
|
||||
item: value,
|
||||
summary: node.value,
|
||||
id: node.id + "." + key,
|
||||
});
|
||||
} else {
|
||||
for (let key in node.value) {
|
||||
let value = toRaw(node.value)[key];
|
||||
children.push({
|
||||
key: key,
|
||||
summary: this.liteItem(value),
|
||||
lazy: this.hasChildren(value),
|
||||
value: value,
|
||||
id: node.id + "." + key,
|
||||
});
|
||||
}
|
||||
}
|
||||
done(children);
|
||||
this.$emit("expandTrees");
|
||||
},
|
||||
hasChildren(item) {
|
||||
if (typeof item === "object")
|
||||
return item !== null && this.getObjKeys(item).length > 0;
|
||||
if (typeof item === "string") {
|
||||
return item.length > maxSize.txt;
|
||||
}
|
||||
return false;
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user