fix(接口测试): 优化接口测试文档中,表格头的一键展开按钮交互

--bug=1015907 --user=宋天阳 【接口测试】API文档,一键展开后,按钮没有默认变成一键收起
https://www.tapd.cn/55049933/s/1225615
This commit is contained in:
song-tianyang 2022-08-17 18:01:00 +08:00 committed by 建国
parent c824ae45ab
commit 07ea672ff9
3 changed files with 46 additions and 3 deletions

View File

@ -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: {

View File

@ -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: {

View File

@ -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">
{{ advancedValue[key] }} <span style="display: inline-block;overflow-wrap: break-word;text-align: left;max-width: 100%;">
{{ advancedValue[key] }}
</span>
</el-form-item> </el-form-item>
</div> </div>
</el-form> </el-form>