Skip to content

B
bigDataSystem
Commit 5c4d77cb authored by liwei's avatar liwei
Browse files
Options

新增了服务开发页面

parent 0bcbb326
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 1281 additions and 179 deletions
src/views/dataService/serviceDevelopment/DebugModal.vue 0 → 100644
View file @ 5c4d77cb
<template>
<BasicModal width="50%" v-bind="$attrs" @register="registerModal" :title="getTitle" @ok="handleSubmit">
<div class="div3">
调试模式&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<Select
class="selectCss"
v-model:value="optionValue"
show-search
placeholder="input search text"
:options="options"
@search="handleSearch"
/>
</div>
<div style="display: flex;margin-top: 10px;margin-bottom: 10px" v-if="optionValue === 'curl调试'">
curl&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<Textarea rows="6" style="width: 80%" :value="curl"/>
</div>
<div style="display: flex;margin-top: 10px;margin-bottom: 10px" v-if="optionValue === '参数化调试'">
<BasicTable @register="registerTable">
<template #toolbar>
<a-button type="primary" @click="addButton">添加</a-button>
</template>
</BasicTable>
</div>
<a-button type="primary" style="margin-top: 10px;margin-bottom: 10px" @click="typeManageButton">调试</a-button>
<div style="display: flex;margin-top: 10px;margin-bottom: 10px">
响应头&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<Textarea rows="6" style="width: 80%" :value="hearder"/>
</div>
<div style="display: flex;margin-top: 10px;margin-bottom: 10px">
响应报文&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<Textarea rows="6" style="width: 80%" :value="hearderText"/>
</div>
</BasicModal>
</template>
<script lang="ts" setup>
import {ref, computed, unref, reactive} from 'vue';
import { BasicModal, useModalInner } from '@/components/Modal';
import { BasicForm, useForm } from '@/components/Form';
import { trusteeshipTableColumns4 } from './api.data';
import {trusteeshipTableData4} from './apiData'
import { useMessage } from '@/hooks/web/useMessage';
import { Select,Textarea } from 'ant-design-vue';
import { BasicTable, useTable, TableAction } from '@/components/Table';
defineOptions({ name: 'AccountModal' });
const emit = defineEmits(['success', 'register']);
const { createMessage } = useMessage();
const getTitle = computed(() => ('原始出参调试'));
const curl = ref('http://172.26.2.22:28180/studio/api/workflow/v1/executor-\n' +
'manage/query/all-executor-info?page=1&size=1 -H Accept:\n' +
'application/json, text/plain, / -H Accept-Language: zh-CN\n' +
',zh;q=0.9,en;q=0.8 -H Connection: keep-alive -H Conten\n' +
't-Type: application/json;charset=UTF-8 -H Cookie\n' +
': SESSION=0061390c-241e-4681-8162-lbaffefec8daccc')
const hearder = ref('HTTP/1.1 200 OK\n' +
'transfer-encoding: chunked\n' +
'X-Content-Type-Options: nosniff\n' +
'X-XSS-Protection: 1; mode=block\n' +
'Cache-Control: no-cache, no-store, max-age=0, must-revalidate\n' +
'Pragma: no-cache')
const hearderText = ref('{"pagination": { "page": 1,"total": 5, "size": 10 },"data": [{"@Clazz": "io.transwarp.studio.foundation.navigator.entity.dto.DataApiNodeWithPath", "relatedCategory": null "workspaceUuid": "2","nodeType": "FILE","category": "SERVICE","description": "","owner": "admin","tenant": null,"size": "","readOnly": false,"createTime": "2022-12-01T05:47:04.000+00:00","updateTime": "2022-12-02T03:36:04.000+00:00","used": null,"relatedUuid": "","remark": null,"path": {"relatedCategory": "WORKSPACE","workspaceUuid": "2","nodeType": "DIR","category": "SERVICE","uuid": "B9D"}}]}')
const options = ref([
{
label: 'curl调试',
value: 'curl调试'
},
{
label: '参数化调试',
value: '参数化调试'
},
])
const optionValue = ref('curl调试')
//初始化弹框
const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
setModalProps({ confirmLoading: false,okText: '解析' });
});
const [registerTable] = useTable({
title: '',
api: async (params) => {
var data = [];
const response = {
pageNu: "1",
pageSize: "10",
pages: "1",
total: trusteeshipTableData4.length,
code:'',
message:'',
data: [],
};
//过滤data中的数据，取出等于params.deptId的数据
return { ...response,data: trusteeshipTableData4 };
},
columns:trusteeshipTableColumns4,
useSearchForm: false,
showTableSetting: false,
showIndexColumn:false,
pagination: false,
bordered: true,
scroll: { y: 300 },
});
/**确定按钮*/
async function handleSubmit() {
}
</script>
<style scoped lang="scss">
.selectCss{
::v-deep(.ant-select-selector){
width:200px!important;
}
}
</style>
src/views/dataService/serviceDevelopment/apiData.ts
View file @ 5c4d77cb
...@@ -272,7 +272,7 @@ export const typeManageTableData: any[] = [ ...@@ -272,7 +272,7 @@ export const typeManageTableData: any[] = [
typeName:'API类别3' typeName:'API类别3'
}, },
]; ];
/**步骤1 sql数据*/ /**SQL模式-步骤1 sql数据*/
export const step1SQLData: any[] = [ export const step1SQLData: any[] = [
{ {
sql: sql:
...@@ -280,7 +280,7 @@ export const step1SQLData: any[] = [ ...@@ -280,7 +280,7 @@ export const step1SQLData: any[] = [
'SELECT name,birthday from yl_test.yl_table_01 WHERE id<#{id} GROUP BY name,birthday,id HAVING weight_total > #{weight_total} ORDER BY id limit #{offset},#{maxRows}', 'SELECT name,birthday from yl_test.yl_table_01 WHERE id<#{id} GROUP BY name,birthday,id HAVING weight_total > #{weight_total} ORDER BY id limit #{offset},#{maxRows}',
} }
]; ];
/**步骤1 列表数据1*/ /**SQL模式-步骤1 列表数据1*/
export const step1TableData1: any[] = [ export const step1TableData1: any[] = [
{ {
parameter:'id', parameter:'id',
...@@ -310,7 +310,7 @@ export const step1TableData1: any[] = [ ...@@ -310,7 +310,7 @@ export const step1TableData1: any[] = [
defaultValue:'默认值' defaultValue:'默认值'
} }
]; ];
/**步骤1 列表数据2*/ /**SQL模式-步骤1 列表数据2*/
export const step1TableData2: any[] = [ export const step1TableData2: any[] = [
{ {
parameter:'id', parameter:'id',
...@@ -321,7 +321,7 @@ export const step1TableData2: any[] = [ ...@@ -321,7 +321,7 @@ export const step1TableData2: any[] = [
parameterMappingFields:'1' parameterMappingFields:'1'
}, },
]; ];
/**步骤1 列表数据3*/ /**SQL模式-步骤1 列表数据3*/
export const step1TableData3: any[] = [ export const step1TableData3: any[] = [
{ {
column:'name', column:'name',
...@@ -338,7 +338,23 @@ export const step1TableData3: any[] = [ ...@@ -338,7 +338,23 @@ export const step1TableData3: any[] = [
comment:'', comment:'',
}, },
]; ];
/**步骤2 列表数据1*/ /**SQL模式-步骤1 列表数据4*/
export const step1TableData4: any[] = [
{
sql:'SELECT name,birthday,sum(weight) as weight_total from yi_test.yiu_table_01 WHERE id< #{id} GROUP BY name,birthday,id HAVING weight_total > #{weight_total} ORDER BY id limit #{offset},#{maxRows} SELECT name,birthday from yi_test.yiu_table_01 WHERE id<${id} GROUP BY name,birthday,id HAVING weight_total > #{weight_total} ORDER BY id limit',
alias:'S1',
sqlType:'1',
returnRecordCount:'100'
},
{
sql:'SELECT name,birthday,sum(weight) as weight_total from yi_test.yiu_table_01 WHERE id< #{id} GROUP BY name,birthday,id HAVING weight_total > #{weight_total} ORDER BY id limit #{offset},#{maxRows} SELECT name,birthday from yi_test.yiu_table_01 WHERE id<${id} GROUP BY name,birthday,id HAVING weight_total > #{weight_total} ORDER BY id limit',
alias:'S2',
sqlType:'1',
returnRecordCount:'-'
},
];
/**SQL模式-步骤2 列表数据1*/
export const step2TableData1: any[] = [ export const step2TableData1: any[] = [
{ {
parameterCode:'size', parameterCode:'size',
...@@ -402,7 +418,7 @@ export const step2TableData1: any[] = [ ...@@ -402,7 +418,7 @@ export const step2TableData1: any[] = [
}, },
]; ];
/**步骤2 列表数据2*/ /**SQL模式-步骤2 列表数据2*/
export const step2TableData2: any[] = [ export const step2TableData2: any[] = [
{ {
originalInput:'S1.size', originalInput:'S1.size',
...@@ -435,7 +451,7 @@ export const step2TableData2: any[] = [ ...@@ -435,7 +451,7 @@ export const step2TableData2: any[] = [
mappingExpression:'6', mappingExpression:'6',
}, },
]; ];
/**步骤3 列表数据1*/ /**SQL模式-步骤3 列表数据1*/
export const step3TableData1: any[] = [ export const step3TableData1: any[] = [
{ {
parameterCode:'size', parameterCode:'size',
...@@ -499,7 +515,7 @@ export const step3TableData1: any[] = [ ...@@ -499,7 +515,7 @@ export const step3TableData1: any[] = [
}, },
]; ];
/**步骤3 列表数据2*/ /**SQL模式-步骤3 列表数据2*/
export const step3TableData2: any[] = [ export const step3TableData2: any[] = [
{ {
originalOutput:'size', originalOutput:'size',
...@@ -532,130 +548,174 @@ export const step3TableData2: any[] = [ ...@@ -532,130 +548,174 @@ export const step3TableData2: any[] = [
mappingObject:'6', mappingObject:'6',
}, },
]; ];
/**托管模式 列表数据1*/
export const trusteeshipTableData1: any[] = [
{
parameterCode:'Basic Input',
parameterLocation:'1',
Xpath:'root/a.b/value[0,a]',
dataType:'1',
},
{
parameterCode:'Basic Input',
parameterLocation:'2',
Xpath:'root/a.b/value[0,a]',
dataType:'2',
},
{
parameterCode:'Basic Input',
parameterLocation:'1',
Xpath:'root/a.b/value[0,a]',
dataType:'3',
},
{
parameterCode:'Basic Input',
parameterLocation:'2',
Xpath:'root/a.b/value[0,a]',
dataType:'4',
},
];
export const fileData: any[] = [ /**托管模式 列表数据2*/
{ export const trusteeshipTableData2: any[] = [
"delFlag" : "0", {
"flag" : "1", parameterCode:'size',
"businessId" : 300, parameterLocation:'1',
"username" : "file1", Xpath:'^.size',
"nickName" : "测试文件流1", dataType:'1',
"name" : "测试文件流1", comment:'',
"fileSize": 1024, isNeed:'2',
"holder":"admin", defaultValue:'',
"createDate": "2024-10-24 10:04:04", exampleValue:''
"updateDate": "2024-10-24 10:04:04", },
"institutionId" : 105, {
"institutionName" : "财务部门", parameterCode:'sortRules',
"menuList" : [ ] parameterLocation:'1',
}, Xpath:'^.sortRules[]',
{ dataType:'2',
"delFlag" : "0", comment:'',
"flag" : "1", isNeed:'2',
"businessId" : 301, defaultValue:'',
"username" : "file2", exampleValue:''
"nickName" : "测试文件流2", },
"name" : "测试文件流2", {
"fileSize": 1024, parameterCode:'category',
"holder":"admin", parameterLocation:'1',
"createDate": "2024-10-24 10:04:04", Xpath:'^.category',
"updateDate": "2024-10-24 10:04:04", dataType:'4',
"institutionId" : 105, comment:'',
"institutionName" : "财务部门", isNeed:'2',
"menuList" : [ ] defaultValue:'',
}, exampleValue:''
{ },
"delFlag" : "0", {
"flag" : "1", parameterCode:'filterRules',
"businessId" : 302, parameterLocation:'1',
"username" : "file3", Xpath:'^.filterRules[]',
"nickName" : "测试文件流3", dataType:'2',
"name" : "测试文件流3", comment:'',
"fileSize": 1024, isNeed:'2',
"holder":"admin", defaultValue:'',
"createDate": "2024-10-24 10:04:04", exampleValue:''
"updateDate": "2024-10-24 10:04:04", },
"institutionId" : 105, {
"institutionName" : "财务部门", parameterCode:'page',
"menuList" : [ ] parameterLocation:'1',
}, Xpath:'^.page',
{ dataType:'1',
"delFlag" : "0", comment:'',
"flag" : "1", isNeed:'2',
"businessId" : 303, defaultValue:'',
"username" : "file4", exampleValue:''
"nickName" : "测试文件流4", },
"name" : "测试文件流4", {
"fileSize": 1024, parameterCode:'childrenRequest',
"holder":"admin", parameterLocation:'1',
"createDate": "2024-10-24 10:04:04", Xpath:'^.childrenRequest',
"updateDate": "2024-10-24 10:04:04", dataType:'3',
"institutionId" : 105, comment:'',
"institutionName" : "财务部门", isNeed:'2',
"menuList" : [ ] defaultValue:'',
}, exampleValue:''
},
]; ];
/**编辑页 选择字典树 数据*/ /**托管模式 列表数据3*/
export const chooseDictoryTreeData = [ export const trusteeshipTableData3: any[] = [
{ {
"delFlag" : "0", originalInput:'S1.size',
"flag" : "1", mappingType:'1',
"businessId" : 100, mappingExpression:'1',
"basicStandardName" : "所有命名字典",
"anotherName":"所有命名字典",
"parentId" : 0,
"ancestors" : "0",
"orderNum" : 0,
"children" : [ ],
icon: 'ion:settings-outline',
},
{
"delFlag" : "0",
"flag" : "1",
"businessId" : 101,
"basicStandardName" : "共享工作区",
"anotherName":"共享工作区",
"parentId" : 100,
"ancestors" : "0,100",
"children" : [ ],
icon: 'ion:settings-outline',
},
{
"delFlag" : "0",
"flag" : "1",
"businessId" : 102,
"basicStandardName" : "关联域",
"anotherName":"关联域",
"parentId" : 101,
"ancestors" : "0,100,101",
"children" : [ ],
icon: 'ion:settings-outline',
},
{
"delFlag" : "0",
"flag" : "1",
"businessId" : 103,
"basicStandardName" : "日期",
"anotherName":"日期",
"parentId" : 102,
"ancestors" : "0,100,101,102",
"children" : [ ],
icon: 'ion:settings-outline',
},
{
"delFlag" : "0",
"flag" : "1",
"businessId" : 104,
"basicStandardName" : "创建日期",
"anotherName":"创建日期",
"parentId" : 102,
"ancestors" : "0,100,101,102",
"children" : [ ],
icon: 'ion:settings-outline',
}, },
] {
originalInput:'S1.sortRules',
mappingType:'1',
mappingExpression:'2',
},
{
originalInput:'S1.category',
mappingType:'1',
mappingExpression:'3',
},
{
originalInput:'S1.filterRules',
mappingType:'1',
mappingExpression:'4',
},
{
originalInput:'S1.page',
mappingType:'1',
mappingExpression:'5',
},
{
originalInput:'S1.childrenRequest',
mappingType:'1',
mappingExpression:'6',
},
];
/**托管模式 列表数据4*/
export const trusteeshipTableData4: any[] = [
{
parameterCode:'Basic Input',
parameterLocation:'QUERY',
Xpath:'root/a.b/value[0,a]',
dataType:'string',
parameterValue:''
},
{
parameterCode:'Basic Input',
parameterLocation:'BODY',
Xpath:'root/a.b/value[0,a]',
dataType:'number',
parameterValue:''
},
{
parameterCode:'Basic Input',
parameterLocation:'QUERY',
Xpath:'root/a.b/value[0,a]',
dataType:'string',
parameterValue:''
},
{
parameterCode:'Basic Input',
parameterLocation:'BODY',
Xpath:'root/a.b/value[0,a]',
dataType:'number',
parameterValue:''
},
{
parameterCode:'Basic Input',
parameterLocation:'HEAD',
Xpath:'root/a.b/value[0,a]',
dataType:'boolean',
parameterValue:''
},
];
/**对比左侧列表 数据1*/ /**对比左侧列表 数据1*/
export const leftContrastTableData1 = [ export const leftContrastTableData1 = [
{ {
......
src/views/dataService/serviceDevelopment/sqlModeStep1.vue
View file @ 5c4d77cb
...@@ -23,7 +23,7 @@ ...@@ -23,7 +23,7 @@
</div> </div>
<div style="display: flex; justify-content: flex-start;"> <div style="display: flex; justify-content: flex-start;">
<a-button type="primary" @click="" style="margin-right: 10px">解析</a-button> <a-button type="primary" @click="" style="margin-right: 10px">解析</a-button>
<a-button type="primary" @click="" style="margin-right: 10px">SQL设置</a-button> <a-button type="primary" @click="settingSQLButton" style="margin-right: 10px">SQL设置</a-button>
<a-button type="primary" @click="" style="margin-right: 10px">从SQL文件获取SQL</a-button> <a-button type="primary" @click="" style="margin-right: 10px">从SQL文件获取SQL</a-button>
</div> </div>
<div class="w-full"> <div class="w-full">
...@@ -46,6 +46,8 @@ ...@@ -46,6 +46,8 @@
<div style="display:flex;justify-content: flex-end"> <div style="display:flex;justify-content: flex-end">
<a-button style="margin-top: 20px" type="primary" @click="customSubmitFunc">下一步</a-button> <a-button style="margin-top: 20px" type="primary" @click="customSubmitFunc">下一步</a-button>
</div> </div>
<!-- SQL设置 弹窗-->
<SqlSettingModal @register="registerSqlSettingModal" @success="handleSuccess" />
</PageWrapper> </PageWrapper>
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
...@@ -62,8 +64,10 @@ ...@@ -62,8 +64,10 @@
import {step1SQLData,step1TableData1,step1TableData2,step1TableData3} from './apiData' import {step1SQLData,step1TableData1,step1TableData2,step1TableData3} from './apiData'
import { Alert, Space } from 'ant-design-vue'; import { Alert, Space } from 'ant-design-vue';
import { Select } from 'ant-design-vue'; import { Select } from 'ant-design-vue';
import SqlSettingModal from './sqlSettingModal.vue'
const [registerRunModal, { openModal: openRunModal }] = useModal(); const [registerRunModal, { openModal: openRunModal }] = useModal();
const [registerSqlSettingModal, { openModal: openSqlSettingModal }] = useModal();
const [registerSelectDatasourceModal, { openModal: openSelectDatasourceModal }] = useModal(); const [registerSelectDatasourceModal, { openModal: openSelectDatasourceModal }] = useModal();
const businessId = ref(); const businessId = ref();
const emit = defineEmits(['next']); const emit = defineEmits(['next']);
...@@ -150,6 +154,13 @@ ...@@ -150,6 +154,13 @@
} }
} }
/**SQL设置*/
function settingSQLButton() {
openSqlSettingModal(true,{
})
}
/**初始化*/ /**初始化*/
onMounted(() => { onMounted(() => {
optionValue.value = '1' optionValue.value = '1'
......
src/views/dataService/serviceDevelopment/sqlModeStep2.vue
View file @ 5c4d77cb
<template> <template>
<div class="step1"> <div class="step2">
<div style="margin-top: 20px;margin-bottom: 20px;margin-left: 10px;display: flex"> <div style="margin-top: 20px;margin-bottom: 20px;margin-left: 10px;display: flex">
配置模式&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<Select 配置模式&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<Select
class="selectCss" class="selectCss"
......
src/views/dataService/serviceDevelopment/sqlSettingModal.vue 0 → 100644
View file @ 5c4d77cb
<template>
<BasicModal width="50%" v-bind="$attrs" @register="registerModal" :title="getTitle" @ok="handleSubmit">
<Alert
type="info"
show-icon
message="每次SQL解析后都需要重新设置SQL别名"
style="margin-bottom: 20px"
/>
<BasicTable @register="registerTable"/>
</BasicModal>
</template>
<script lang="ts" setup>
import { BasicModal, useModalInner } from '@/components/Modal';
import { BasicForm, useForm } from '@/components/Form';
import { reactive,unref,onDeactivated,onMounted,ref } from 'vue';
import { BasicTable, useTable, TableAction } from '@/components/Table';
import { useMessage } from '@/hooks/web/useMessage';
import { useModal } from '@/components/Modal';
import { useGo } from '@/hooks/web/usePage';
import { useRoute,onBeforeRouteLeave } from 'vue-router';
import {step1TableData4} from './apiData'
import {step1TableColumns4} from './api.data'
import { Alert } from 'ant-design-vue';
defineOptions({ name: 'AccountManagement' });
const { createMessage } = useMessage();
const route = useRoute();
const go = useGo();
const [registerMoveUser, { openModal: openMoveUserModal }] = useModal();
const searchInfo = reactive<Recordable>({});
const emit = defineEmits(['success', 'register']);
const tableData = ref([])
const isAdd = ref(true)
const getTitle = ref('SQL设置')
const [registerTable, { reload, updateTableDataRecord, getSearchInfo,getForm,getRowSelection }] = useTable({
title: '',
api: async (params) => {
const response = {
pageNu: "1",
pageSize: "10",
pages: "1",
total: step1TableData4.length,
code:'',
message:'',
data: [],
};
return { ...response, data: step1TableData4 };
},
columns:step1TableColumns4,
useSearchForm: false,
showTableSetting: false,
showIndexColumn: false,
bordered: true,
});
//初始化弹框
const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
setModalProps({ confirmLoading: false });
});
/** 设置成功*/
function handleSubmit() {
createMessage.success('设置成功！')
closeModal()
}
onMounted(() => {
});
</script>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment