fix(接口测试): 优化接口测试文档中,表格头的一键展开按钮交互
--bug=1015907 --user=宋天阳 【接口测试】API文档,一键展开后,按钮没有默认变成一键收起 https://www.tapd.cn/55049933/s/1225615
This commit is contained in:
parent
c824ae45ab
commit
07ea672ff9
|
@ -47,7 +47,9 @@
|
||||||
width="80px">
|
width="80px">
|
||||||
<template slot="header">
|
<template slot="header">
|
||||||
<el-button type="text" size="mini" @click="expandAllRows">
|
<el-button type="text" size="mini" @click="expandAllRows">
|
||||||
{{ expandAllRow ? $t("commons.close_all") : $t("commons.expand_all") }}
|
<span :id="tableExpandButtonId">
|
||||||
|
{{ expandTitle }}
|
||||||
|
</span>
|
||||||
</el-button>
|
</el-button>
|
||||||
</template>
|
</template>
|
||||||
<template v-slot:default="scope">
|
<template v-slot:default="scope">
|
||||||
|
@ -81,6 +83,7 @@ export default {
|
||||||
expandAllRow: false,
|
expandAllRow: false,
|
||||||
language: "zh_CN",
|
language: "zh_CN",
|
||||||
tableData: [],
|
tableData: [],
|
||||||
|
tableExpandButtonId: "docTableExpandBtn" + getUUID(),
|
||||||
expandTitle: this.$t("commons.expand_all"),
|
expandTitle: this.$t("commons.expand_all"),
|
||||||
tableColoumArr: [
|
tableColoumArr: [
|
||||||
{id: 1, prop: "name", label: this.$t('api_test.definition.document.table_coloum.name')},
|
{id: 1, prop: "name", label: this.$t('api_test.definition.document.table_coloum.name')},
|
||||||
|
@ -111,6 +114,12 @@ export default {
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
activated() {
|
activated() {
|
||||||
|
//获取language,用于改变表格的展开、收起文字 zh_CN/zh_TW/en_US
|
||||||
|
let user = getCurrentUser();
|
||||||
|
if (user) {
|
||||||
|
this.language = user.language;
|
||||||
|
}
|
||||||
|
this.tableData = this.getJsonArr(this.stringData);
|
||||||
},
|
},
|
||||||
created: function () {
|
created: function () {
|
||||||
//获取language,用于改变表格的展开、收起文字 zh_CN/zh_TW/en_US
|
//获取language,用于改变表格的展开、收起文字 zh_CN/zh_TW/en_US
|
||||||
|
@ -118,8 +127,15 @@ export default {
|
||||||
if (user) {
|
if (user) {
|
||||||
this.language = user.language;
|
this.language = user.language;
|
||||||
}
|
}
|
||||||
|
this.tableData = this.getJsonArr(this.stringData);
|
||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
|
//获取language,用于改变表格的展开、收起文字 zh_CN/zh_TW/en_US
|
||||||
|
let user = getCurrentUser();
|
||||||
|
if (user) {
|
||||||
|
this.language = user.language;
|
||||||
|
}
|
||||||
|
this.tableData = this.getJsonArr(this.stringData);
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
showSlotCompnent() {
|
showSlotCompnent() {
|
||||||
|
@ -145,6 +161,9 @@ export default {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
this.expandTitle = this.expandAllRow ? this.$t("commons.close_all") : this.$t("commons.expand_all");
|
this.expandTitle = this.expandAllRow ? this.$t("commons.close_all") : this.$t("commons.expand_all");
|
||||||
|
let tableHeaderDom = document.getElementById(this.tableExpandButtonId);
|
||||||
|
tableHeaderDom.innerText = this.expandTitle;
|
||||||
|
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
|
|
|
@ -29,7 +29,9 @@
|
||||||
<el-table-column type="expand" :label="getCollapseOption()" width="80px">
|
<el-table-column type="expand" :label="getCollapseOption()" width="80px">
|
||||||
<template slot="header">
|
<template slot="header">
|
||||||
<el-button type="text" size="mini" @click="expandAllRows">
|
<el-button type="text" size="mini" @click="expandAllRows">
|
||||||
{{ expandAllRow ? $t("commons.close_all") : $t("commons.expand_all") }}
|
<span :id="tableExpandButtonId">
|
||||||
|
{{ expandTitle }}
|
||||||
|
</span>
|
||||||
</el-button>
|
</el-button>
|
||||||
</template>
|
</template>
|
||||||
<template v-slot:default="scope">
|
<template v-slot:default="scope">
|
||||||
|
@ -82,8 +84,10 @@ export default {
|
||||||
return {
|
return {
|
||||||
tableData: [],
|
tableData: [],
|
||||||
language: "zh_CN",
|
language: "zh_CN",
|
||||||
|
tableExpandButtonId: "docTableExpandBtn" + getUUID(),
|
||||||
active: true,
|
active: true,
|
||||||
expandAllRow: false,
|
expandAllRow: false,
|
||||||
|
expandTitle: this.$t("commons.expand_all"),
|
||||||
formParamTypes: ['form-data', 'x-www-from-urlencoded', 'BINARY'],
|
formParamTypes: ['form-data', 'x-www-from-urlencoded', 'BINARY'],
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
|
@ -91,6 +95,14 @@ export default {
|
||||||
apiInfo: Object,
|
apiInfo: Object,
|
||||||
},
|
},
|
||||||
activated() {
|
activated() {
|
||||||
|
if (this.apiInfo && this.apiInfo.requestBodyFormData) {
|
||||||
|
this.tableData = this.getJsonArr(this.apiInfo.requestBodyFormData);
|
||||||
|
}
|
||||||
|
//获取language,用于改变表格的展开、收起文字 zh_CN/zh_TW/en_US
|
||||||
|
let user = getCurrentUser();
|
||||||
|
if (user) {
|
||||||
|
this.language = user.language;
|
||||||
|
}
|
||||||
},
|
},
|
||||||
created: function () {
|
created: function () {
|
||||||
if (this.apiInfo && this.apiInfo.requestBodyFormData) {
|
if (this.apiInfo && this.apiInfo.requestBodyFormData) {
|
||||||
|
@ -103,6 +115,14 @@ export default {
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
|
if (this.apiInfo && this.apiInfo.requestBodyFormData) {
|
||||||
|
this.tableData = this.getJsonArr(this.apiInfo.requestBodyFormData);
|
||||||
|
}
|
||||||
|
//获取language,用于改变表格的展开、收起文字 zh_CN/zh_TW/en_US
|
||||||
|
let user = getCurrentUser();
|
||||||
|
if (user) {
|
||||||
|
this.language = user.language;
|
||||||
|
}
|
||||||
},
|
},
|
||||||
computed: {},
|
computed: {},
|
||||||
watch: {
|
watch: {
|
||||||
|
@ -127,6 +147,8 @@ export default {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
this.expandTitle = this.expandAllRow ? this.$t("commons.close_all") : this.$t("commons.expand_all");
|
this.expandTitle = this.expandAllRow ? this.$t("commons.close_all") : this.$t("commons.expand_all");
|
||||||
|
let tableHeaderDom = document.getElementById(this.tableExpandButtonId);
|
||||||
|
tableHeaderDom.innerText = this.expandTitle;
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
|
|
|
@ -4,7 +4,9 @@
|
||||||
<el-form label-position="left" v-model="advancedValue">
|
<el-form label-position="left" v-model="advancedValue">
|
||||||
<div :span="8" v-for="(item, key) in advancedValue" :key="key">
|
<div :span="8" v-for="(item, key) in advancedValue" :key="key">
|
||||||
<el-form-item :label="$t(key) + ' : '" style="margin: 0">
|
<el-form-item :label="$t(key) + ' : '" style="margin: 0">
|
||||||
|
<span style="display: inline-block;overflow-wrap: break-word;text-align: left;max-width: 100%;">
|
||||||
{{ advancedValue[key] }}
|
{{ advancedValue[key] }}
|
||||||
|
</span>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</div>
|
</div>
|
||||||
</el-form>
|
</el-form>
|
||||||
|
|
Loading…
Reference in New Issue