index.vue
3.42 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
<template>
<div>
<div class="mt-8">
<div>
<Button @click="handleTest" type="primary"> 测试接口 </Button>
</div>
<div v-if="showTestEditCell" class="mt-8">
<a-row type="flex" justify="center">
<a-col :span="3"> 参数设置 </a-col>
<a-col :span="21">
<TestParamsCellTable ref="testEditCellTableRef" />
</a-col>
</a-row>
</div>
</div>
<div class="mt-8"> </div>
</div>
</template>
<script lang="ts" setup name="testRequest">
import { ref, nextTick } from 'vue';
import { Button } from 'ant-design-vue';
import TestParamsCellTable from './testEditParamsCellTable.vue';
import moment from 'moment';
import { useUtils } from '../../../hooks/useUtils';
const emits = defineEmits(['testParamsInterface']);
const props = defineProps({
data: {
type: Object,
},
});
const showTestEditCell = ref(false);
const excuteData = ref({});
const testEditCellTableRef = ref<InstanceType<typeof TestParamsCellTable>>();
const testResult = ref('');
const { getMultipleKeys } = useUtils();
const handleTest = () => {
showTestEditCell.value = true;
emits('testParamsInterface');
getValue();
};
const getValue = async () => {
await nextTick();
await nextTick(() => {
//拆分"xx,xx,xx"多个
const getSingleKey = props.data?.list;
const getMuteKey = props.data?.list?.filter((it: any) => it.key?.split(',').length > 1);
const getMuteKeys = getMultipleKeys(getMuteKey);
const mergeKeys = [...getSingleKey, ...getMuteKeys]?.filter(
(it: any) => it.key?.split(',').length === 1
);
testEditCellTableRef.value?.setTableArray(mergeKeys);
});
};
//测试表格里的数据转化为 key value 数组对象形式
//TODO:待优化这里的TS类型
const getTestTableKeyValue = () => {
//把日期拆分成多个
const keyValueList: any = [];
testEditCellTableRef.value?.getValue()?.forEach((item: any) => {
const splitDateKey = item?.key === 'date_range' ? item?.value?.split(',') : [];
const splitDateValue = item?.key === 'date_range' ? item?.dateValue : [];
for (let i in splitDateKey) {
const obj = {
key: splitDateKey[i],
value: moment(splitDateValue[i]).valueOf(),
};
keyValueList.push(obj);
}
});
return testEditCellTableRef.value
?.getValue()
.concat(keyValueList)
.filter((it) => it.key !== 'date_range')
.map((it: any) => {
const value =
it?.key === 'scope'
? it?.keyValue
: it?.key === 'fixed_date'
? moment(it?.fixed_date_value).valueOf()
: it?.value;
const key = it?.key === 'scope' || it?.key === 'fixed_date' ? it?.value : it?.key;
return {
key,
value,
};
});
};
//获取数据
const getTestValue = () => {
const getTable = getTestTableKeyValue();
const params: any = {};
getTable?.map((it) => (params[it.key!] = it.value!));
if (params['keys']) {
Reflect.set(params, 'keys', params['keys'].join(','));
}
excuteData.value = {
params,
};
return excuteData.value;
};
//设置数据
const setValue = () => {
showTestEditCell.value = false;
testResult.value = '';
};
defineExpose({
setValue,
handleTest,
getTestValue,
});
</script>
<style scoped lang="less"></style>