refactor: 请求参数修改
This commit is contained in:
Captain.B
parent
a8671ca4f3
commit
e512957cd6
|
|
@ -39,13 +39,88 @@
|
|||
:visible.sync="itemValueVisible"
|
||||
class="advanced-item-value"
|
||||
width="50%">
|
||||
<el-form>
|
||||
<el-form-item>
|
||||
<el-input :autosize="{ minRows: 2, maxRows: 4}" type="textarea" :placeholder="valueText"
|
||||
v-model="itemValue"/>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div>
|
||||
<!-- <el-form>
|
||||
<el-form-item>
|
||||
<el-input :autosize="{ minRows: 2, maxRows: 4}" type="textarea" :placeholder="valueText"
|
||||
v-model="itemValue"/>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div>
|
||||
<el-row type="flex" align="middle">
|
||||
<el-col :span="6">
|
||||
<el-button size="small" type="primary" plain @click="saveAdvanced()">
|
||||
{{ $t('commons.save') }}
|
||||
</el-button>
|
||||
<el-button size="small" type="success" plain @click="showPreview(itemValue)">
|
||||
{{ $t('api_test.request.parameters_preview') }}
|
||||
</el-button>
|
||||
</el-col>
|
||||
<el-col>
|
||||
<div> {{ itemValuePreview }}</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
|
||||
<div class="format-tip">
|
||||
<div>
|
||||
<p>{{ $t('api_test.request.parameters_filter') }}：
|
||||
<el-tag size="mini" v-for="func in funcs" :key="func" @click="appendFunc(func)"
|
||||
style="margin-left: 2px;cursor: pointer;">
|
||||
<span>{{ func }}</span>
|
||||
</el-tag>
|
||||
</p>
|
||||
</div>
|
||||
<div>
|
||||
<span>{{ $t('api_test.request.parameters_filter_desc') }}：
|
||||
<el-link href="http://mockjs.com/examples.html" target="_blank">http://mockjs.com/examples.html</el-link>
|
||||
</span>
|
||||
<p>{{ $t('api_test.request.parameters_filter_example') }}：@string(10) | md5 | substr: 1, 3</p>
|
||||
<p>{{ $t('api_test.request.parameters_filter_example') }}：@integer(1, 5) | concat:_metersphere</p>
|
||||
<p><strong>{{ $t('api_test.request.parameters_filter_tips') }}</strong></p>
|
||||
</div>
|
||||
</div>-->
|
||||
<el-tabs tab-position="left" style="height: 60vh;">
|
||||
<el-tab-pane label="Mock 数据">
|
||||
<el-row type="flex" :gutter="20" style="overflow-x: auto;">
|
||||
<el-col :span="6">
|
||||
<el-autocomplete
|
||||
:disabled="isReadOnly"
|
||||
size="small"
|
||||
class="input-with-autocomplete"
|
||||
v-model="itemValue"
|
||||
:fetch-suggestions="funcSearch"
|
||||
:placeholder="valueText"
|
||||
value-key="name"
|
||||
highlight-first-item
|
||||
@select="change">
|
||||
</el-autocomplete>
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
<el-row v-for="(func, index) in funcs" :key="index">
|
||||
<div @click="addFunc(func)" style="padding-top: 5px;">
|
||||
<el-col :span="12">
|
||||
<el-radio v-model="currentFunc" :label="func.name">{{ func.name }}</el-radio>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-input size="mini" :placeholder="param.name" v-model="param.value"
|
||||
v-for="(param, index) in func.params" :key="index"/>
|
||||
</el-col>
|
||||
</div>
|
||||
</el-row>
|
||||
</el-col>
|
||||
<!--<el-col v-for="(f, index) in itemFuncs" :key="index">
|
||||
<el-menu>
|
||||
<el-menu-item v-for="(func, index) in funcs.slice(0, 5)" :key="index" @click="addFunc(func)">
|
||||
{{ func.func }}
|
||||
</el-menu-item>
|
||||
</el-menu>
|
||||
</el-col>-->
|
||||
</el-row>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="变量"></el-tab-pane>
|
||||
</el-tabs>
|
||||
|
||||
<div style="padding-top: 10px;">
|
||||
<el-row type="flex" align="middle">
|
||||
<el-col :span="6">
|
||||
<el-button size="small" type="primary" plain @click="saveAdvanced()">
|
||||
|
|
@ -60,32 +135,13 @@
|
|||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
|
||||
<div class="format-tip">
|
||||
<div>
|
||||
<p>{{ $t('api_test.request.parameters_filter') }}：
|
||||
<el-tag size="mini" v-for="func in funcs" :key="func" @click="appendFunc(func)"
|
||||
style="margin-left: 2px;cursor: pointer;">
|
||||
<span>{{ func }}</span>
|
||||
</el-tag>
|
||||
</p>
|
||||
</div>
|
||||
<div>
|
||||
<span>{{ $t('api_test.request.parameters_filter_desc') }}：
|
||||
<el-link href="http://mockjs.com/examples.html" target="_blank">http://mockjs.com/examples.html</el-link>
|
||||
</span>
|
||||
<p>{{ $t('api_test.request.parameters_filter_example') }}：@string(10) | md5 | substr: 1, 3</p>
|
||||
<p>{{ $t('api_test.request.parameters_filter_example') }}：@integer(1, 5) | concat:_metersphere</p>
|
||||
<p><strong>{{ $t('api_test.request.parameters_filter_tips') }}</strong></p>
|
||||
</div>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {KeyValue} from "../model/ScenarioModel";
|
||||
import {JMETER_FUNC, MOCKJS_FUNC} from "@/common/js/constants";
|
||||
import {MOCKJS_FUNC} from "@/common/js/constants";
|
||||
import {calculate} from "@/business/components/api/test/model/ScenarioModel";
|
||||
|
||||
export default {
|
||||
|
|
@ -107,9 +163,32 @@ export default {
|
|||
return {
|
||||
itemValueVisible: false,
|
||||
itemValue: null,
|
||||
funcs: ["md5", "sha1", "sha224", "sha256", "sha384", "sha512", "base64",
|
||||
"unbase64", "substr", "concat", "lconcat", "lower", "upper", "length", "number"],
|
||||
itemValuePreview: null
|
||||
funcs: [
|
||||
{name: "md5"},
|
||||
{name: "base64"},
|
||||
{name: "unbase64"},
|
||||
{
|
||||
name: "substr",
|
||||
params: [{name: "start"}, {name: "end"}]
|
||||
},
|
||||
{
|
||||
name: "concat",
|
||||
params: [{name: "suffix"}]
|
||||
},
|
||||
{name: "lconcat", params: [{name: "prefix"}]},
|
||||
{name: "sha1"},
|
||||
{name: "sha224"},
|
||||
{name: "sha256"},
|
||||
{name: "sha384"},
|
||||
{name: "sha512"},
|
||||
{name: "lower"},
|
||||
{name: "upper"},
|
||||
{name: "length"},
|
||||
{name: "number"}
|
||||
],
|
||||
itemValuePreview: null,
|
||||
itemFuncs: [],
|
||||
currentFunc: ""
|
||||
}
|
||||
},
|
||||
|
||||
|
|
@ -160,7 +239,7 @@ export default {
|
|||
};
|
||||
},
|
||||
funcSearch(queryString, cb) {
|
||||
let funcs = MOCKJS_FUNC.concat(JMETER_FUNC);
|
||||
let funcs = MOCKJS_FUNC;
|
||||
let results = queryString ? funcs.filter(this.funcFilter(queryString)) : funcs;
|
||||
// 调用 callback 返回建议列表的数据
|
||||
cb(results);
|
||||
|
|
@ -173,6 +252,9 @@ export default {
|
|||
showPreview(itemValue) {
|
||||
this.itemValuePreview = calculate(itemValue);
|
||||
},
|
||||
addFunc(func) {
|
||||
this.itemFuncs.push(func);
|
||||
},
|
||||
appendFunc(func) {
|
||||
if (this.itemValue) {
|
||||
this.itemValue += " | " + func;
|
||||
|
|
@ -230,4 +312,9 @@ export default {
|
|||
padding: 10px;
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
.func-background {
|
||||
background: #2395f1;
|
||||
}
|
||||
|
||||
</style>
|
||||
|
|
|
|||
Loading…
Reference in New Issue