From 91f46cc6ad86339f77bc934383c68da6fb537061 Mon Sep 17 00:00:00 2001 From: baiqi Date: Fri, 19 Apr 2024 17:11:16 +0800 Subject: [PATCH] =?UTF-8?q?refactor(typescript):=20typescript=E5=8D=87?= =?UTF-8?q?=E7=BA=A7&=E6=8A=A5=E9=94=99=E4=BF=AE=E5=A4=8D?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- frontend/.eslintrc.js | 4 ++ frontend/package.json | 7 ++- frontend/src/api/modules/user/index.ts | 3 +- .../ms-assertion/comp/ResponseBodyTab.vue | 27 +++++---- .../ms-common-script/ms-script-menu.vue | 2 +- .../business/ms-common-script/utils.ts | 60 +++++++++---------- .../src/components/business/ms-menu/index.vue | 8 +-- .../ms-message/MessageCenterDrawer.vue | 3 +- .../components/tripartite.vue | 13 ++-- .../src/components/business/ms-tree/index.vue | 2 +- .../business/ms-user-group-comp/authTable.vue | 2 +- .../pure/ms-form-create/comp/jiraKey.vue | 2 +- .../pure/ms-jsonpath-picker/index.vue | 4 +- .../ms-rich-text/extensions/image/index.ts | 5 +- frontend/src/env.d.ts | 6 ++ .../src/models/caseManagement/caseReview.ts | 4 +- frontend/src/models/user.ts | 5 ++ frontend/src/utils/index.ts | 17 +++--- frontend/src/utils/recursion.ts | 2 +- .../caseAndScenarioReportDrawer.vue | 2 +- .../api-test/components/condition/list.vue | 4 +- .../components/fastExtraction/index.vue | 2 +- .../views/api-test/components/paramTable.vue | 2 +- .../components/requestAndResponse.vue | 4 +- .../components/requestComposition/index.vue | 22 +++---- .../requestComposition/response/index.vue | 2 +- .../api-test/components/responseTimeLine.vue | 2 +- .../components/management/api/apiBaseForm.vue | 8 +-- .../components/management/api/apiTable.vue | 3 +- .../management/api/preview/quote.vue | 4 +- .../components/management/case/caseDetail.vue | 2 +- .../case/createAndEditCaseDrawer.vue | 11 +++- .../case/tabContent/tabCaseDependency.vue | 4 +- .../case/tabContent/tabCaseExecuteHistory.vue | 2 +- .../management/components/moduleTree.vue | 2 +- .../components/recycle/api/apiTable.vue | 3 +- .../src/views/api-test/management/index.vue | 2 +- .../src/views/api-test/management/recycle.vue | 2 +- .../report/component/conditionStatus.vue | 6 +- .../api-test/report/component/reportList.vue | 4 +- .../report/component/reportStatus.vue | 5 +- .../report/component/step/stepStatus.vue | 5 +- .../components/common/customCaseDrawer.vue | 10 ++-- .../components/common/stepType/stepType.vue | 2 +- .../scenario/components/executeHistory.vue | 2 +- .../step/createAction/createStepActions.vue | 6 +- .../createAction/stepInsertStepTrigger.vue | 8 +-- .../scenario/components/step/index.vue | 6 +- .../views/api-test/scenario/create/index.vue | 2 +- .../views/api-test/scenario/detail/index.vue | 2 +- .../src/views/api-test/scenario/index.vue | 9 +-- .../components/bug-detail-drawer.vue | 12 ++-- .../components/bugDetailTab.vue | 2 +- frontend/src/views/bug-management/edit.vue | 14 ++--- frontend/src/views/bug-management/index.vue | 4 +- frontend/src/views/bug-management/recycle.vue | 4 +- .../tabContent/tabBug/tabDefect.vue | 2 +- .../components/tabContent/tabCaseReview.vue | 2 +- .../caseManagementFeature/components/utils.ts | 15 ++--- .../case-management/caseReview/caseDetail.vue | 6 +- .../components/detail/caseTable.vue | 22 ++++--- .../components/index/reviewTable.vue | 6 +- .../components/scriptDetailDrawer.vue | 4 +- .../project-management/commonScript/utils.ts | 60 +++++++++---------- .../environmental/components/EnvParamBox.vue | 4 +- .../components/envParams/PluginTab.vue | 2 +- .../components/envParams/popUp/apiTree.vue | 4 +- .../components/envParams/popUp/domain.vue | 4 +- .../components/fileDetailDrawer.vue | 2 +- .../components/messageList.vue | 10 ++-- .../menuManagement/components/defectSync.vue | 4 +- .../taskCenter/component/apiCase.vue | 14 ++--- .../taskCenter/component/executionStatus.vue | 12 ++-- .../taskCenter/component/scheduledTask.vue | 10 ++-- .../taskCenter/component/taskCom.vue | 4 +- .../taskCenter/component/utils.ts | 11 +++- .../template/components/addTemplate.vue | 10 ++-- .../testPlan/components/allTable.vue | 7 ++- frontend/tsconfig.json | 1 - frontend/types/global.d.ts | 8 +++ 80 files changed, 322 insertions(+), 264 deletions(-) diff --git a/frontend/.eslintrc.js b/frontend/.eslintrc.js index 85d87e6867..568a33b0d2 100644 --- a/frontend/.eslintrc.js +++ b/frontend/.eslintrc.js @@ -132,4 +132,8 @@ module.exports = { }, }, ], + globals: { + // 在这里添加全局变量 + NodeJS: 'readonly', + }, }; diff --git a/frontend/package.json b/frontend/package.json index b2961983ab..46444a751c 100644 --- a/frontend/package.json +++ b/frontend/package.json @@ -48,7 +48,7 @@ "@tiptap/suggestion": "^2.1.13", "@tiptap/vue-3": "^2.1.13", "@types/color": "^3.0.4", - "@types/node": "^20.11.16", + "@types/node": "^20.11.19", "@vueuse/core": "^10.9.0", "@xmldom/xmldom": "^0.8.10", "ace-builds": "^1.24.2", @@ -93,6 +93,9 @@ "@types/lodash": "^4.14.198", "@types/lodash-es": "^4.17.9", "@types/nprogress": "^0.2.0", + "@types/pretty": "^2.0.3", + "@types/react": "^18.2.79", + "@types/react-dom": "^18.2.25", "@types/sortablejs": "^1.15.2", "@typescript-eslint/eslint-plugin": "^7.1.1", "@typescript-eslint/parser": "^7.1.1", @@ -144,7 +147,7 @@ "stylelint-less": "^1.0.8", "stylelint-order": "^5.0.0", "tailwindcss": "^3.3.3", - "typescript": "^5.4.2", + "typescript": "^5.4.5", "unplugin-auto-import": "^0.16.7", "unplugin-vue-components": "^0.24.1", "vite": "^3.2.7", diff --git a/frontend/src/api/modules/user/index.ts b/frontend/src/api/modules/user/index.ts index 3c234c8799..f378b38ec4 100644 --- a/frontend/src/api/modules/user/index.ts +++ b/frontend/src/api/modules/user/index.ts @@ -36,6 +36,7 @@ import type { LocalConfig, LoginData, LoginRes, + OrgOptionItem, PersonalInfo, UpdateAPIKEYParams, UpdateBaseInfo, @@ -177,5 +178,5 @@ export function getPlatformAccount() { // 个人信息-获取第三方平台-组织下拉选项 export function getPlatformOrgOption() { - return MSR.get({ url: GetPlatformOrgOptionUrl }); + return MSR.get({ url: GetPlatformOrgOptionUrl }); } diff --git a/frontend/src/components/business/ms-assertion/comp/ResponseBodyTab.vue b/frontend/src/components/business/ms-assertion/comp/ResponseBodyTab.vue index 88889e36ad..82683618ca 100644 --- a/frontend/src/components/business/ms-assertion/comp/ResponseBodyTab.vue +++ b/frontend/src/components/business/ms-assertion/comp/ResponseBodyTab.vue @@ -399,6 +399,7 @@ const { t } = useI18n(); + // TODO: Param interface Param { [key: string]: any; } @@ -713,7 +714,7 @@ function applyMoreSetting(record: ExpressionConfig) { switch (condition.value.assertionBodyType) { case ResponseBodyAssertionType.JSON_PATH: - condition.value.jsonPathAssertion.assertions = condition.value.jsonPathAssertion.assertions?.map((e) => { + condition.value.jsonPathAssertion.assertions = condition.value.jsonPathAssertion.assertions?.map((e: Param) => { if (e.id === activeRecord.value.id) { record.moreSettingPopoverVisible = false; return { @@ -725,7 +726,7 @@ }); break; case ResponseBodyAssertionType.XPATH: - condition.value.xpathAssertion.assertions = condition.value.xpathAssertion.assertions?.map((e) => { + condition.value.xpathAssertion.assertions = condition.value.xpathAssertion.assertions?.map((e: Param) => { if (e.id === activeRecord.value.id) { record.moreSettingPopoverVisible = false; return { @@ -737,7 +738,7 @@ }); break; case ResponseBodyAssertionType.REGEX: - condition.value.regexAssertion.assertions = condition.value.regexAssertion.assertions?.map((e) => { + condition.value.regexAssertion.assertions = condition.value.regexAssertion.assertions?.map((e: Param) => { if (e.id === activeRecord.value.id) { record.moreSettingPopoverVisible = false; return { @@ -761,7 +762,7 @@ config: RegexExtract | JSONPathExtract | XPathExtract, matchResult: Record ) { - condition.value.jsonPathAssertion.assertions = condition.value.jsonPathAssertion.assertions?.map((e) => { + condition.value.jsonPathAssertion.assertions = condition.value.jsonPathAssertion.assertions?.map((e: Param) => { if (e.id === activeRecord.value.id) { return { ...e, @@ -771,7 +772,7 @@ } return e; }); - condition.value.xpathAssertion.assertions = condition.value.xpathAssertion.assertions?.map((e) => { + condition.value.xpathAssertion.assertions = condition.value.xpathAssertion.assertions?.map((e: Param) => { if (e.id === activeRecord.value.id) { return { ...e, @@ -780,7 +781,7 @@ } return e; }); - condition.value.regexAssertion.assertions = condition.value.regexAssertion.assertions?.map((e) => { + condition.value.regexAssertion.assertions = condition.value.regexAssertion.assertions?.map((e: Param) => { if (e.id === activeRecord.value.id) { return { ...e, @@ -794,17 +795,17 @@ nextTick(() => { if (condition.value.assertionBodyType === ResponseBodyAssertionType.JSON_PATH) { extractParamsTableRef.value?.addTableLine( - condition.value.jsonPathAssertion.assertions?.findIndex((e) => e.id === activeRecord.value.id) || 0 + condition.value.jsonPathAssertion.assertions?.findIndex((e: Param) => e.id === activeRecord.value.id) || 0 ); } if (condition.value.assertionBodyType === ResponseBodyAssertionType.XPATH) { extractParamsTableRef.value?.addTableLine( - condition.value.xpathAssertion.assertions?.findIndex((e) => e.id === activeRecord.value.id) || 0 + condition.value.xpathAssertion.assertions?.findIndex((e: Param) => e.id === activeRecord.value.id) || 0 ); } if (condition.value.assertionBodyType === ResponseBodyAssertionType.REGEX) { extractParamsTableRef.value?.addTableLine( - condition.value.xpathAssertion.regexAssertion?.findIndex((e) => e.id === activeRecord.value.id) || 0 + condition.value.xpathAssertion.regexAssertion?.findIndex((e: Param) => e.id === activeRecord.value.id) || 0 ); } }); @@ -814,7 +815,9 @@ function copyItem(record: Record) { switch (condition.value.assertionBodyType) { case ResponseBodyAssertionType.JSON_PATH: - const jsonIndex = condition.value.jsonPathAssertion.assertions.findIndex((item) => item.id === record.id); + const jsonIndex = condition.value.jsonPathAssertion.assertions.findIndex( + (item: Param) => item.id === record.id + ); if (jsonIndex > -1) { condition.value.jsonPathAssertion.assertions.splice(jsonIndex, 0, { ...record, @@ -826,7 +829,7 @@ } break; case ResponseBodyAssertionType.XPATH: - const xpathIndex = condition.value.xpathAssertion.assertions.findIndex((item) => item.id === record.id); + const xpathIndex = condition.value.xpathAssertion.assertions.findIndex((item: Param) => item.id === record.id); if (xpathIndex > -1) { condition.value.xpathAssertion.assertions.splice(xpathIndex, 0, { ...record, @@ -846,7 +849,7 @@ }); break; case ResponseBodyAssertionType.REGEX: - const regIndex = condition.value.regexAssertion.assertions.findIndex((item) => item.id === record.id); + const regIndex = condition.value.regexAssertion.assertions.findIndex((item: Param) => item.id === record.id); if (regIndex > -1) { condition.value.regexAssertion.assertions.splice(regIndex, 0, { ...record, diff --git a/frontend/src/components/business/ms-common-script/ms-script-menu.vue b/frontend/src/components/business/ms-common-script/ms-script-menu.vue index adca1e3305..3cf0f60b5a 100644 --- a/frontend/src/components/business/ms-common-script/ms-script-menu.vue +++ b/frontend/src/components/business/ms-common-script/ms-script-menu.vue @@ -95,7 +95,7 @@ emit('formApiImport'); } - function _handleCommand(command) { + function _handleCommand(command: string) { switch (command) { // 自定义代码片段 case 'custom_function': diff --git a/frontend/src/components/business/ms-common-script/utils.ts b/frontend/src/components/business/ms-common-script/utils.ts index 1129bcd73a..5186ffbd5a 100644 --- a/frontend/src/components/business/ms-common-script/utils.ts +++ b/frontend/src/components/business/ms-common-script/utils.ts @@ -66,10 +66,10 @@ export const SCRIPT_MENU: CommonScriptMenu[] = [ ]; // 处理groovyCode 请求头 -function getGroovyHeaders(requestHeaders) { +function getGroovyHeaders(requestHeaders: Record) { let headers = '['; let index = 1; - requestHeaders.forEach(([k, v]) => { + requestHeaders.forEach(([k, v]: any[]) => { if (index !== 1) { headers += ','; } @@ -80,11 +80,11 @@ function getGroovyHeaders(requestHeaders) { return headers; } // 解析请求url -function getRequestPath(requestArgs, requestPath) { +function getRequestPath(requestArgs: Record, requestPath: string) { if (requestArgs.size > 0) { requestPath += '?'; let index = 1; - requestArgs.forEach(([k, v]) => { + requestArgs.forEach(([k, v]: any[]) => { if (index !== 1) { requestPath += '&'; } @@ -95,7 +95,7 @@ function getRequestPath(requestArgs, requestPath) { return requestPath; } // 处理mockPath -function getMockPath(domain, port, socket) { +function getMockPath(domain: string, port: string, socket: string) { if (domain === socket || !port) { return ''; } @@ -105,11 +105,11 @@ function getMockPath(domain, port, socket) { } // 处理请求参数 -function replaceRestParams(path, restMap) { +function replaceRestParams(path: string, restMap: Record) { if (!path) { return path; } - let arr = path.match(/{([\w]+)}/g); + let arr: any[] | null = path.match(/{([\w]+)}/g); if (Array.isArray(arr) && arr.length > 0) { arr = Array.from(new Set(arr)); arr.forEach((str) => { @@ -128,7 +128,7 @@ function replaceRestParams(path, restMap) { } // 返回最终groovyCode 代码模板片段 -function _groovyCodeTemplate(obj) { +function _groovyCodeTemplate(obj: Record) { const { requestUrl, requestMethod, headers, body } = obj; const params = `[ 'url': '${requestUrl}', @@ -164,7 +164,7 @@ log.info(conn.content.text) } // 处理groovyCode语言 -function groovyCode(requestObj) { +function groovyCode(requestObj: Record) { const { requestHeaders = new Map(), requestBody = '', @@ -183,7 +183,7 @@ function groovyCode(requestObj) { let requestUrl = ''; if (requestMethod.toLowerCase() === 'get' && requestBodyKvs) { // 如果是get方法要将kv值加入argument中 - requestBodyKvs.forEach(([k, v]) => { + requestBodyKvs.forEach(([k, v]: any[]) => { requestArguments.set(k, v); }); } @@ -197,7 +197,7 @@ function groovyCode(requestObj) { if (requestMethod === 'POST' && bodyType === 'kvs') { body = '"'; - requestBodyKvs.forEach(([k, v]) => { + requestBodyKvs.forEach(([k, v]: any[]) => { if (body !== '"') { body += '&'; } @@ -215,10 +215,10 @@ function groovyCode(requestObj) { } // 获取请求头 -function getHeaders(requestHeaders) { +function getHeaders(requestHeaders: Record) { let headers = '{'; let index = 1; - requestHeaders.forEach(([k, v]) => { + requestHeaders.forEach(([k, v]: any[]) => { if (index !== 1) { headers += ','; } @@ -230,13 +230,13 @@ function getHeaders(requestHeaders) { return headers; } // 获取pythonCode 模板 -function _pythonCodeTemplate(obj) { +function _pythonCodeTemplate(obj: Record) { const { requestBody, requestBodyKvs, bodyType, requestPath, requestMethod, connType, domain, port } = obj; let { headers } = obj; let reqBody = obj.requestBody; if (requestMethod.toLowerCase() === 'post' && obj.bodyType === 'kvs' && obj.requestBodyKvs) { reqBody = 'urllib.urlencode({'; - requestBodyKvs.forEach(([k, v]) => { + requestBodyKvs.forEach(([k, v]: any[]) => { reqBody += `'${k}':'${v}'`; }); reqBody += `})`; @@ -266,7 +266,7 @@ log.info(data) } // 处理pythonCode语言 -function pythonCode(requestObj) { +function pythonCode(requestObj: Record) { const { requestHeaders = new Map(), requestMethod = '', @@ -287,7 +287,7 @@ function pythonCode(requestObj) { const headers = getHeaders(requestHeaders); requestBody = requestBody ? JSON.stringify(requestBody) : '{}'; if (requestMethod.toLowerCase() === 'get' && requestBodyKvs) { - requestBodyKvs.forEach(([k, v]) => { + requestBodyKvs.forEach(([k, v]: any[]) => { requestArguments.set(k, v); }); } @@ -299,7 +299,7 @@ function pythonCode(requestObj) { } // 获取javaBeanshell代码模板 -function _beanshellTemplate(obj) { +function _beanshellTemplate(obj: Record) { const { requestHeaders = new Map(), requestBodyKvs = new Map(), @@ -322,14 +322,14 @@ function _beanshellTemplate(obj) { .setPath("${requestPath}") `; // http 请求类型 - const method = requestMethod.toLowerCase().replace(/^\S/, (s) => s.toUpperCase()); + const method = requestMethod.toLowerCase().replace(/^\S/, (s: string) => s.toUpperCase()); const httpMethodCode = `Http${method} request = new Http${method}(uri);`; // 设置参数 - requestArguments.forEach(([k, v]) => { + requestArguments.forEach(([k, v]: any[]) => { uri += `.setParameter("${k}", "${v}")`; }); if (method === 'Get' && requestBodyKvs) { - requestBodyKvs.forEach(([k, v]) => { + requestBodyKvs.forEach(([k, v]: any[]) => { uri += `.setParameter("${k}", "${v}")`; }); } @@ -337,7 +337,7 @@ function _beanshellTemplate(obj) { let postKvsParam = ''; if (method === 'Post') { // 设置post参数 - requestBodyKvs.forEach(([k, v]) => { + requestBodyKvs.forEach(([k, v]: any[]) => { postKvsParam += `nameValueList.add(new BasicNameValuePair("${k}", "${v}"));\r\n`; }); if (postKvsParam !== '') { @@ -356,7 +356,7 @@ function _beanshellTemplate(obj) { } // 设置请求头 let setHeader = ''; - requestHeaders.forEach(([k, v]) => { + requestHeaders.forEach(([k, v]: any[]) => { setHeader = `${setHeader}request.setHeader("${k}", "${v}");\n`; }); try { @@ -414,12 +414,12 @@ if (response.getStatusLine().getStatusCode() == 200) { } // 处理java语言 -function javaCode(requestObj) { +function javaCode(requestObj: Record) { return _beanshellTemplate(requestObj); } // 获取js语言代码模板 -function _jsTemplate(obj) { +function _jsTemplate(obj: Record) { const { requestHeaders = new Map(), requestMethod = 'GET', @@ -444,7 +444,7 @@ function _jsTemplate(obj) { } if (requestMethod.toLowerCase() === 'get' && requestBodyKvs) { // 如果是get方法要将kv值加入argument中 - requestBodyKvs.forEach(([k, v]) => { + requestBodyKvs.forEach(([k, v]: any[]) => { requestArguments.set(k, v); }); } @@ -459,13 +459,13 @@ function _jsTemplate(obj) { if (bodyType && bodyType.toUpperCase() === 'RAW') { requestHeaders.set('Content-type', 'text/plain'); } - requestHeaders.forEach(([k, v]) => { + requestHeaders.forEach(([k, v]: any[]) => { connStr += `conn.setRequestProperty("${k}","${v}");\n`; }); if (requestMethod === 'POST' && bodyType === 'kvs') { requestBody = '"'; - requestBodyKvs.forEach(([k, v]) => { + requestBodyKvs.forEach(([k, v]: any[]) => { if (requestBody !== '"') { requestBody += '&'; } @@ -508,7 +508,7 @@ log.info(res); } // 处理js语言 -function jsCode(requestObj) { +function jsCode(requestObj: Record) { return _jsTemplate(requestObj); } @@ -532,5 +532,3 @@ export function getCodeTemplate(language: Language | RequestConditionScriptLangu return ''; } } - -export default {}; diff --git a/frontend/src/components/business/ms-menu/index.vue b/frontend/src/components/business/ms-menu/index.vue index 212a10ee33..3bcab67b22 100644 --- a/frontend/src/components/business/ms-menu/index.vue +++ b/frontend/src/components/business/ms-menu/index.vue @@ -259,7 +259,7 @@ }); // 组织切换的 trigger - const orgTrigger = (e, visible: Ref, slot: (item) => VNode) => ( + const orgTrigger = (e: Record, visible: Ref, slot: (item: Record) => VNode) => ( { + onUpdate:visible={(e: boolean) => { personalDrawerVisible.value = e; }} /> ); }; - let mouseEnterTimer; + let mouseEnterTimer: NodeJS.Timeout; // 渲染菜单项 - const renderMenuItem = (element: RouteRecordRaw | null, icon) => + const renderMenuItem = (element: RouteRecordRaw | null, icon: (() => any) | null) => element?.name === SettingRouteEnum.SETTING_ORGANIZATION ? ( goto(element)}>
diff --git a/frontend/src/components/business/ms-message/MessageCenterDrawer.vue b/frontend/src/components/business/ms-message/MessageCenterDrawer.vue index 696af7229f..5d41a87b4c 100644 --- a/frontend/src/components/business/ms-message/MessageCenterDrawer.vue +++ b/frontend/src/components/business/ms-message/MessageCenterDrawer.vue @@ -341,7 +341,8 @@ return count; } - const resourceTypeRouteMap = { + // TODO: MessageResourceType + const resourceTypeRouteMap: Record = { [MessageResourceType.BUG_TASK]: BugManagementRouteEnum.BUG_MANAGEMENT_DETAIL, [MessageResourceType.BUG_SYNC_TASK]: BugManagementRouteEnum.BUG_MANAGEMENT_DETAIL, [MessageResourceType.FUNCTIONAL_CASE_TASK]: CaseManagementRouteEnum.CASE_MANAGEMENT_CASE_DETAIL, diff --git a/frontend/src/components/business/ms-personal-drawer/components/tripartite.vue b/frontend/src/components/business/ms-personal-drawer/components/tripartite.vue index f1eac40385..8fac01d5ef 100644 --- a/frontend/src/components/business/ms-personal-drawer/components/tripartite.vue +++ b/frontend/src/components/business/ms-personal-drawer/components/tripartite.vue @@ -23,12 +23,12 @@ - {{ tagMap[config.status].text }} + {{ tagMap[config.status as Status].text }}
diff --git a/frontend/src/views/project-management/taskCenter/component/scheduledTask.vue b/frontend/src/views/project-management/taskCenter/component/scheduledTask.vue index 5f997ae3a5..00c8c768aa 100644 --- a/frontend/src/views/project-management/taskCenter/component/scheduledTask.vue +++ b/frontend/src/views/project-management/taskCenter/component/scheduledTask.vue @@ -46,7 +46,9 @@