Skip to content

B
bigDataSystem
Commit 720ef66d authored by LiXuyang's avatar LiXuyang
Browse files
Options

申请调用

parent 524471d5
Hide whitespace changes
Inline Side-by-side
Showing with 1152 additions and 7 deletions
src/views/mallResourceDevelopment/API/apiByApply/apiDetail/detail.data.ts 0 → 100644
View file @ 720ef66d
import {BasicColumn, FormSchema} from '@/components/Table';
export const configTableColumn: BasicColumn[] = [
{
title: '列名',
dataIndex: 'field',
},
{
title: '参数code',
dataIndex: 'code',
},
{
title: '参数类型',
dataIndex: 'type',
},
{
title: '注释',
dataIndex: 'remark',
},
{
title: '是否必填',
dataIndex: 'required',
},
{
title: '默认值',
dataIndex: 'value',
},
{
title: '示例值',
dataIndex: 'examValue',
},
];
export const backTableColumn: BasicColumn[] = [
{
title: '列名',
dataIndex: 'field',
},
{
title: '参数code',
dataIndex: 'code',
},
{
title: '参数类型',
dataIndex: 'type',
},
{
title: '注释',
dataIndex: 'remark',
},
];
export const powerTableColumn: BasicColumn[] = [
{
title: '权限类型',
dataIndex: 'type',
},
{
title: '目标域',
dataIndex: 'range',
},
{
title: '对应申请',
dataIndex: 'apply',
slots: { customRender: 'apply' },
},
{
title: '数据范围',
dataIndex: 'dataRange',
},
{
title: '权限状态',
dataIndex: 'powerStatus',
slots: { customRender: 'powerStatus' },
},
{
title: '无效原因',
dataIndex: 'remark',
},
];
src/views/mallResourceDevelopment/API/apiByApply/apiDetail/detailData.ts 0 → 100644
View file @ 720ef66d
export const infoList = [
{
label: '资源名称',
field: 'name',
},
{
label: '描述',
field: 'des',
},
{
label: '业务标签',
field: 'label',
},
{
label: '权属机构',
field: 'dept',
},
{
label: '敏感状态',
field: 'sensitive',
},
{
label: '开放权限',
field: 'power',
},
];
export const uploadConfigList = [
{
label: '自动下架日期',
field: 'time',
},
{
label: '可见范围',
field: 'range',
},
{
label: '共享类型',
field: 'type',
},
];
export const model = {
name: '',
des: null,
label: null,
dept: '三十五所',
sensitive: '非敏感',
power: 'API服务调用',
time: '2024-12-1200:00:00',
range: '所有人',
type: '有条件共享',
};
export const powerData = [
{
type: 'API调用',
range: null,
apply: '申请调用：测试SQL等1个API服务',
dataRange: null,
powerStatus: '有效',
remark: null,
},
];
src/views/mallResourceDevelopment/API/apiByApply/apiDetail/index.vue 0 → 100644
View file @ 720ef66d
<template>
<PageWrapper dense contentFullHeight fixedHeight contentClass="flex">
<!-- 审核配置 -->
<template #headerContent>
<div class="flex">
<div class="flex-1 header">
<LeftOutlined class="h-back" @click="handleBack" />
<ApiOutlined class="h-icon" />
<div class="h-txt">
<div class="h-des">{{ data.title }}</div>
<div class="h-path">{{ data.path }}</div>
</div>
</div>
<div class="h-bt-group">
<a-button type="link" @click="handleDoc">
<div>
<FileSearchOutlined class="h-bt-icon" />
</div>
查看API Doc
</a-button>
</div>
</div>
</template>
<template #footer>
<Tabs v-model:activeKey="activeKey">
<TabPane key="1" tab="资源信息">
<div class="title">基本信息</div>
<Row :gutter="[16, 30]">
<Col :span="12" v-for="info in infoList" :key="info">
<div class="col-item">
<div class="item-label">{{ info.label }}：</div>
<div class="item-des">{{ model[info.field] ? model[info.field] : '-' }}</div>
</div>
</Col>
</Row>
<div class="title">上架配置</div>
<Row :gutter="[16, 30]">
<Col :span="12" v-for="info in uploadConfigList" :key="info">
<div class="col-item">
<div class="item-label">{{ info.label }}：</div>
<div class="item-des">{{ model[info.field] ? model[info.field] : '-' }}</div>
</div>
</Col>
</Row>
<div class="title">原始API</div>
</TabPane>
<TabPane key="2" tab="API详情">
<div>
<BasicTable @register="configTable" />
<BasicTable @register="backTable" />
</div>
</TabPane>
</Tabs>
<Tabs v-model:activeKey="bottomKey">
<TabPane key="1" tab="我的权限">
<BasicTable @register="powerTable">
<template #headerTop>
<div class="flex">
<div class="power-table-form flex-1">
<Input
class="power-table-form-item"
v-model:value="queryParams.title"
placeholder="搜索申请标题"
>
<template #suffix>
<SearchOutlined />
</template>
</Input>
<Select
class="power-table-form-item"
v-model:value="queryParams.type"
placeholder="权限类型"
/>
<Select
class="power-table-form-item"
v-model:value="queryParams.status"
placeholder="权限状态"
/>
</div>
<div>
<a-button :disabled="getPowerSelectRows().length <= 0">批量取消权限</a-button>
</div>
</div>
</template>
<template #toolbar> </template>
<template #bodyCell="{ column, record }">
<template v-if="column.key === 'action'">
<TableAction
:actions="[
{
icon: 'ant-design:close-outlined',
popConfirm: {
title: '是否确认取消',
placement: 'left',
confirm: handleRemove.bind(null, record),
},
color: 'error',
},
]"
/>
</template>
</template>
<template #apply="{ text, record }">
<a @click="handleApply">{{ text }}</a>
</template>
<template #powerStatus="{ text, record }">
<div class="column-des" style="justify-content: center">
<CheckCircleFilled class="c-icon" style="color: #21a764" />
<div class="c-text">{{ text }}</div>
</div>
</template>
</BasicTable>
</TabPane>
<TabPane key="2" tab="我的申请记录" />
<TabPane key="3" tab="API监控" />
</Tabs>
</template>
</PageWrapper>
</template>
<script lang="ts" setup>
import { PageWrapper } from '@/components/Page';
import { Row, Col, Tabs, TabPane, Input, Select, TableProps } from 'ant-design-vue';
import {
ApiOutlined,
LeftOutlined,
CheckCircleFilled,
SearchOutlined,
FileSearchOutlined,
} from '@ant-design/icons-vue';
import { useRoute, useRouter } from 'vue-router';
import { onMounted, ref } from 'vue';
import { infoList, uploadConfigList, model, powerData } from './detailData';
import BasicTable from '@/components/Table/src/BasicTable.vue';
import { useTable } from '@/components/Table';
import { driveListData } from '@/views/dataSourceManage/driveManage/driveData';
import { columns, searchSchema } from '@/views/dataSourceManage/driveManage/drive.data';
import { apiDocColumnsData } from '@/views/dataService/serviceDevelopment/apiData';
import { apiDocColumns } from '@/views/dataService/serviceDevelopment/api.data';
import {
backTableColumn,
powerTableColumn,
} from '@/views/mallResourceDevelopment/API/publicAPI/apiDetail/detail.data';
import TableAction from '@/components/Table/src/components/TableAction.vue';
import { useMessage } from '@/hooks/web/useMessage';
import { searchFormSchema } from '@/views/auditLog/audi.data';
import { configTableColumn } from '@/views/mallResourceDevelopment/API/apiByApply/apiDetail/detail.data';
// 初始化
const router = useRouter();
const route = useRoute();
const { createMessage } = useMessage();
// 参数
const queryParams = ref({});
const activeKey = ref();
const bottomKey = ref();
const data = route.query;
/**
* 方法
*/
function handleBack() {
router.go(-1);
}
function handleDoc() {
router.push({
path: '/mallResourceDevelopment/API/apiByApply/apiDoc',
});
}
function handleRemove() {
createMessage.success('取消成功！');
}
/**
* table
*/
const [configTable] = useTable({
title: '请求参数',
api: async (params) => {
const response = {
pageNu: '1',
pageSize: '10',
pages: '1',
total: [].length,
code: '',
message: '',
data: [],
};
return { ...response };
},
columns: configTableColumn,
useSearchForm: false,
showTableSetting: false,
showIndexColumn: false,
bordered: true,
scroll: { y: 300 },
});
const [backTable] = useTable({
title: '返回参数',
api: async (params) => {
const response = {
pageNu: '1',
pageSize: '10',
pages: '1',
total: [].length,
code: '',
message: '',
data: [],
};
return { ...response };
},
columns: backTableColumn,
useSearchForm: false,
showTableSetting: false,
showIndexColumn: false,
bordered: true,
scroll: { y: 300 },
});
const [powerTable, { getSelectRows: getPowerSelectRows }] = useTable({
api: async (params) => {
const response = {
pageNu: '1',
pageSize: '10',
pages: '1',
total: powerData.length,
code: '',
message: '',
data: powerData,
};
return { ...response };
},
rowSelection: true,
columns: powerTableColumn,
showTableSetting: false,
showIndexColumn: false,
bordered: true,
scroll: { y: 300 },
actionColumn: {
width: 120,
title: '取消权限',
dataIndex: 'action',
fixed: undefined,
},
} as TableProps);
</script>
<style scoped>
.header {
display: flex;
flex-direction: row;
gap: 10px;
.h-back {
font-size: 20px;
}
.h-icon {
font-size: 30px;
color: #0a208a;
}
.h-txt {
display: flex;
flex-direction: column;
.h-des {
font-size: 20px;
font-weight: bolder;
}
.h-path {
color: #a4a8b6;
}
}
}
.h-bt-group {
display: flex;
gap: 10px;
.h-bt-icon {
font-size: 20px;
}
}
.title {
font-weight: bolder;
margin: 15px 0;
}
.col-item {
display: flex;
gap: 10px;
.item-label {
width: 100px;
}
}
.column-des {
display: flex;
gap: 10px;
.c-icon {
font-size: 16px;
}
.c-text {
}
}
.power-table-form {
display: flex;
gap: 10px;
.power-table-form-item {
width: 200px;
}
}
</style>
src/views/mallResourceDevelopment/API/apiByApply/apiDoc/doc.data.ts 0 → 100644
View file @ 720ef66d
import { BasicColumn } from '@/components/Table';
export const configTableColumn: BasicColumn[] = [
{
title: '列名',
dataIndex: 'field',
},
{
title: '参数code',
dataIndex: 'code',
},
{
title: '参数类型',
dataIndex: 'type',
},
{
title: '注释',
dataIndex: 'remark',
},
{
title: '是否必填',
dataIndex: 'required',
},
{
title: '参数值',
dataIndex: 'value',
slots: { customRender: 'value' },
},
];
src/views/mallResourceDevelopment/API/apiByApply/apiDoc/docData.ts 0 → 100644
View file @ 720ef66d
export const configData = [
{
field: 'iffinish_reset',
code: 'iffinish_reset',
type: 'object',
remark: '',
required: '是',
value: '1',
},
{
field: 'iffinish_reset',
code: 'iffinish_reset',
type: 'object',
remark: '',
required: '是',
value: '1',
},
{
field: 'maxRows',
code: 'maxRaws',
type: 'object',
remark: '',
required: '是',
value: '1',
},
];
src/views/mallResourceDevelopment/API/apiByApply/apiDoc/index.vue 0 → 100644
View file @ 720ef66d
<template>
<PageWrapper dense contentFullHeight fixedHeight contentClass="flex">
<!-- 审核配置 -->
<template #headerContent>
<div class="flex">
<div class="flex-1 header">
<LeftOutlined class="h-back" @click="handleBack" />
<FileSearchOutlined class="h-icon" />
<div class="h-txt">
<div class="h-des">API Doc</div>
</div>
</div>
<div class="h-bt-group">
<a-button type="link" @click="handleDown">
<div>
<DownloadOutlined class="h-bt-icon" />
</div>
下载
</a-button>
</div>
</div>
</template>
<template #footer>
<div class="cat-form">
<div class="cat-form-item">
<div class="cat-form-label"> 用户token </div>
<Textarea v-model:value="token" style="width: 50%; pointer-events: none" />
<div style="display: flex; align-items: end; margin: 0 0 10px -20px; z-index: 2">
<CopyOutlined @click="copyText" />
<div v-if="copySuccess" style="color: #40c397; margin-left: 10px">复制成功！</div>
</div>
</div>
</div>
<BasicTable @register="configTable">
<template #value="{ text, record }">
<Input v-model:value="record.value" />
</template>
</BasicTable>
<a-button type="primary">测试</a-button>
<Tabs v-model:activeKey="activeKey">
<TabPane key="1" tab="请求报文">
<div class="cat-form">
<div class="cat-form-item">
<div class="cat-form-label"> url </div>
<div class="flex-1">
<Input class="pointer-events-none" v-model:value="url" />
</div>
</div>
<div class="cat-form-item">
<Textarea :auto-size="{ minRow: 6 }" v-model:value="address" />
</div>
<div class="cat-form-item">
<div class="flex" style="margin: 25px 0 15px 0; width: 120px">
<div>返回结果源码</div>
<BasicHelp text="返回结果源码" />
</div>
<Textarea :auto-size="{ minRow: 6 }" v-model:value="resultTxt" />
</div>
</div>
</TabPane>
<TabPane key="2" tab="请求代码">
<div class="flex" style="margin: 15px 0">
<div style="width: 4px; margin: 4px 0; background-color: #128afa"></div>
<div style="margin-left: 6px"> 动态路由地址 </div>
</div>
<Textarea :auto-size="{ minRow: 6 }" v-model:value="address" />
<div class="flex" style="margin: 25px 0 15px 0">
<span>返回结果源码</span>
<BasicHelp text="返回结果源码" />
</div>
<Textarea :auto-size="{ minRow: 6 }" v-model:value="resultTxt" />
</TabPane>
</Tabs>
</template>
</PageWrapper>
</template>
<script lang="ts" setup>
import { PageWrapper } from '@/components/Page';
import BasicHelp from '@/components/Basic/src/BasicHelp.vue';
import { Row, Col, Tabs, TabPane, Input, Select, TableProps, Textarea } from 'ant-design-vue';
import {
ApiOutlined,
LeftOutlined,
CheckCircleFilled,
SearchOutlined,
FileSearchOutlined,
DownloadOutlined,
CopyOutlined,
} from '@ant-design/icons-vue';
import { useRoute, useRouter } from 'vue-router';
import { onMounted, ref } from 'vue';
import BasicTable from '@/components/Table/src/BasicTable.vue';
import { BasicTableProps, useTable } from '@/components/Table';
import { driveListData } from '@/views/dataSourceManage/driveManage/driveData';
import { columns, searchSchema } from '@/views/dataSourceManage/driveManage/drive.data';
import { apiDocColumnsData } from '@/views/dataService/serviceDevelopment/apiData';
import { apiDocColumns } from '@/views/dataService/serviceDevelopment/api.data';
import {
backTableColumn,
powerTableColumn,
} from '@/views/mallResourceDevelopment/API/publicAPI/apiDetail/detail.data';
import TableAction from '@/components/Table/src/components/TableAction.vue';
import { useMessage } from '@/hooks/web/useMessage';
import { searchFormSchema } from '@/views/auditLog/audi.data';
import { configTableColumn } from '@/views/mallResourceDevelopment/API/apiByApply/apiDoc/doc.data';
import { configData } from '@/views/mallResourceDevelopment/API/apiByApply/apiDoc/docData';
// 初始化
const router = useRouter();
const route = useRoute();
const { createMessage } = useMessage();
// 参数
const queryParams = ref({});
const activeKey = ref();
const bottomKey = ref();
const data = route.query;
const copySuccess = ref(false);
const token = `f8e4e97129c0fcc5f97953fed88fa2dabb6d35e4654cabaa835547f1c9555449893baa2d853db6a9d5c46026f7033e13db0486e650b770f1be4af2e8ac1fd7`;
const url = 'http://node322:28143/employee';
const address =
"curl -X POST‘http://node322:28143/employee′-H'token:\n" +
"7406056a00d65806200fe299d573a49b6bac08938e4ec73143d48caf110723bbc6d0e7efac9e01a2abbadada175b3c6ca3b251fd76cbbefed08f234998b5f7ac'-H'Content-Type:\n" +
'application/json\'-H\'Accept:*/*’-d\'("departmentID":"1")}"';
const resultTxt =
'{\n' +
'"success":true,\n' +
'"code":200，\n' +
'"message": "success"，\n' +
'“data":{\n' +
'"valueSize": 70,\n' +
'"columnNames":[\n' +
'"LastName"\n' +
'"FirstName"\n' +
'}\n' +
'}';
/**
* 方法
*/
function handleBack() {
router.go(-1);
}
function handleDown() {
createMessage.success('下载成功！');
}
// 复制文本的方法
const copyText = async () => {
try {
await navigator.clipboard.writeText(token);
copySuccess.value = true;
// 2秒后自动隐藏复制成功提示
setTimeout(() => {
copySuccess.value = false;
}, 2000);
} catch (err) {
console.error('复制失败', err);
}
};
/**
* table
*/
const [configTable] = useTable({
title: '请求参数',
api: async (params) => {
const response = {
pageNu: '1',
pageSize: '10',
pages: '1',
total: configData.length,
code: '',
message: '',
data: configData,
};
return { ...response };
},
columns: configTableColumn,
useSearchForm: false,
showTableSetting: false,
showIndexColumn: false,
bordered: true,
scroll: { y: 300 },
pagination: false,
} as BasicTableProps);
</script>
<style scoped>
.header {
display: flex;
flex-direction: row;
gap: 10px;
.h-back {
font-size: 20px;
}
.h-icon {
font-size: 30px;
color: #0a208a;
}
.h-txt {
display: flex;
flex-direction: column;
.h-des {
font-size: 20px;
font-weight: bolder;
}
.h-path {
color: #a4a8b6;
}
}
}
.h-bt-group {
display: flex;
gap: 10px;
.h-bt-icon {
font-size: 20px;
}
}
.title {
font-weight: bolder;
margin: 15px 0;
}
.col-item {
display: flex;
gap: 10px;
.item-label {
width: 100px;
}
}
.column-des {
display: flex;
gap: 10px;
.c-icon {
font-size: 16px;
}
.c-text {
}
}
.power-table-form {
display: flex;
gap: 10px;
.power-table-form-item {
width: 200px;
}
}
.cat-form {
padding: 10px 15px;
display: flex;
flex-direction: column;
gap: 15px;
.cat-form-item {
display: flex;
.cat-form-label {
width: 100px;
}
}
}
</style>
src/views/mallResourceDevelopment/API/apiByApply/data.ts
View file @ 720ef66d
......@@ -3,7 +3,7 @@ import { DescItem } from '@/components/Description';
export const applyColumns: BasicColumn[] = [
{
title: '数据集名称',
title: 'API名称',
dataIndex: 'name',
width: 120,
},
......
src/views/mallResourceDevelopment/API/apiByApply/index.vue
View file @ 720ef66d
......@@ -145,9 +145,10 @@
function handleDetail(record: Recordable) {
router.push({
path: '/dataset/datasetByApply/datasetByApplyDetail',
// path: '/dataset/datasetByApply/datasetByApplyDetail',
path: '/mallResourceDevelopment/API/apiByApply/apiDetail',
query: {
name: record.name,
title: record.name,
},
});
}
......
src/views/mallResourceDevelopment/API/publicAPI/apiDetail/detail.data.ts 0 → 100644
View file @ 720ef66d
import {BasicColumn, FormSchema} from '@/components/Table';
export const configTableColumn: BasicColumn[] = [
{
title: '列名',
dataIndex: 'field',
},
{
title: '参数code',
dataIndex: 'code',
},
{
title: '参数类型',
dataIndex: 'type',
},
{
title: '注释',
dataIndex: 'remark',
},
{
title: '是否必填',
dataIndex: 'required',
},
{
title: '默认值',
dataIndex: 'value',
},
{
title: '示例值',
dataIndex: 'examValue',
},
];
export const backTableColumn: BasicColumn[] = [
{
title: '列名',
dataIndex: 'field',
},
{
title: '参数code',
dataIndex: 'code',
},
{
title: '参数类型',
dataIndex: 'type',
},
{
title: '注释',
dataIndex: 'remark',
},
];
export const powerTableColumn: BasicColumn[] = [
{
title: '权限类型',
dataIndex: 'type',
},
{
title: '目标域',
dataIndex: 'range',
},
{
title: '对应申请',
dataIndex: 'apply',
slots: { customRender: 'apply' },
},
{
title: '数据范围',
dataIndex: 'dataRange',
},
{
title: '权限状态',
dataIndex: 'powerStatus',
slots: { customRender: 'powerStatus' },
},
{
title: '无效原因',
dataIndex: 'remark',
},
];
src/views/mallResourceDevelopment/API/publicAPI/apiDetail/detailData.ts 0 → 100644
View file @ 720ef66d
export const infoList = [
{
label: '资源名称',
field: 'name',
},
{
label: '描述',
field: 'des',
},
{
label: '业务标签',
field: 'label',
},
{
label: '权属机构',
field: 'dept',
},
{
label: '敏感状态',
field: 'sensitive',
},
{
label: '开放权限',
field: 'power',
},
];
export const uploadConfigList = [
{
label: '自动下架日期',
field: 'time',
},
{
label: '可见范围',
field: 'range',
},
{
label: '共享类型',
field: 'type',
},
];
export const model = {
name: '',
des: null,
label: null,
dept: '三十五所',
sensitive: '非敏感',
power: 'API服务调用',
time: '2024-12-1200:00:00',
range: '所有人',
type: '有条件共享',
};
export const powerData = [
{
type: 'API调用',
range: null,
apply: '申请调用：测试SQL等1个API服务',
dataRange: null,
powerStatus: '有效',
remark: null,
},
];
src/views/mallResourceDevelopment/API/publicAPI/apiDetail/index.vue 0 → 100644
View file @ 720ef66d
<template>
<PageWrapper dense contentFullHeight fixedHeight contentClass="flex">
<!-- 审核配置 -->
<template #headerContent>
<div class="flex">
<div class="flex-1 header">
<LeftOutlined class="h-back" @click="handleBack" />
<ApiOutlined class="h-icon" />
<div class="h-txt">
<div class="h-des">{{ data.title }}</div>
<div class="h-path">{{ data.path }}</div>
</div>
</div>
<div class="h-bt-group">
<a-button type="link" @click="handleApply">
<div>
<ApiOutlined class="h-bt-icon" />
</div>
申请调用
</a-button>
</div>
</div>
</template>
<template #footer>
<Tabs v-model:activeKey="activeKey">
<TabPane key="1" tab="资源信息">
<div class="title">基本信息</div>
<Row :gutter="[16, 30]">
<Col :span="12" v-for="info in infoList" :key="info">
<div class="col-item">
<div class="item-label">{{ info.label }}：</div>
<div class="item-des">{{ model[info.field] ? model[info.field] : '-' }}</div>
</div>
</Col>
</Row>
<div class="title">上架配置</div>
<Row :gutter="[16, 30]">
<Col :span="12" v-for="info in uploadConfigList" :key="info">
<div class="col-item">
<div class="item-label">{{ info.label }}：</div>
<div class="item-des">{{ model[info.field] ? model[info.field] : '-' }}</div>
</div>
</Col>
</Row>
<div class="title">原始API</div>
</TabPane>
<TabPane key="2" tab="API详情">
<div>
<BasicTable @register="configTable" />
<BasicTable @register="backTable" />
</div>
</TabPane>
</Tabs>
</template>
</PageWrapper>
</template>
<script lang="ts" setup>
import { PageWrapper } from '@/components/Page';
import {Row, Col, Tabs, TabPane, Input, Select, TableProps} from 'ant-design-vue';
import {
ApiOutlined,
LeftOutlined,
CheckCircleFilled,
SearchOutlined,
} from '@ant-design/icons-vue';
import { useRoute, useRouter } from 'vue-router';
import { onMounted, ref } from 'vue';
import { infoList, uploadConfigList, model, powerData } from './detailData';
import BasicTable from '@/components/Table/src/BasicTable.vue';
import { useTable } from '@/components/Table';
import { driveListData } from '@/views/dataSourceManage/driveManage/driveData';
import { columns, searchSchema } from '@/views/dataSourceManage/driveManage/drive.data';
import { apiDocColumnsData } from '@/views/dataService/serviceDevelopment/apiData';
import { apiDocColumns } from '@/views/dataService/serviceDevelopment/api.data';
import {
backTableColumn,
configTableColumn,
powerTableColumn,
} from '@/views/mallResourceDevelopment/API/publicAPI/apiDetail/detail.data';
import TableAction from '@/components/Table/src/components/TableAction.vue';
import { useMessage } from '@/hooks/web/useMessage';
import { searchFormSchema } from '@/views/auditLog/audi.data';
// 初始化
const router = useRouter();
const route = useRoute();
const { createMessage } = useMessage();
// 参数
const queryParams = ref({});
const activeKey = ref();
const bottomKey = ref();
const data = route.query;
/**
* 方法
*/
function handleBack() {
router.go(-1);
}
function handleApply() {
router.push({
path: '/mallResourceDevelopment/API/publicAPI/applyCall',
query: {
title: data.title + '等1个API服务',
},
});
}
function handleRemove() {
createMessage.success('取消成功！');
}
/**
* table
*/
const [configTable] = useTable({
title: '请求参数',
api: async (params) => {
const response = {
pageNu: '1',
pageSize: '10',
pages: '1',
total: [].length,
code: '',
message: '',
data: [],
};
return { ...response };
},
columns: configTableColumn,
useSearchForm: false,
showTableSetting: false,
showIndexColumn: false,
bordered: true,
scroll: { y: 300 },
});
const [backTable] = useTable({
title: '返回参数',
api: async (params) => {
const response = {
pageNu: '1',
pageSize: '10',
pages: '1',
total: [].length,
code: '',
message: '',
data: [],
};
return { ...response };
},
columns: backTableColumn,
useSearchForm: false,
showTableSetting: false,
showIndexColumn: false,
bordered: true,
scroll: { y: 300 },
});
const [powerTable, { getSelectRows: getPowerSelectRows }] = useTable({
api: async (params) => {
const response = {
pageNu: '1',
pageSize: '10',
pages: '1',
total: powerData.length,
code: '',
message: '',
data: powerData,
};
return { ...response };
},
rowSelection: true,
columns: powerTableColumn,
showTableSetting: false,
showIndexColumn: false,
bordered: true,
scroll: { y: 300 },
actionColumn: {
width: 120,
title: '取消权限',
dataIndex: 'action',
fixed: undefined,
},
} as TableProps);
</script>
<style scoped>
.header {
display: flex;
flex-direction: row;
gap: 10px;
.h-back {
font-size: 20px;
}
.h-icon {
font-size: 30px;
color: #0a208a;
}
.h-txt {
display: flex;
flex-direction: column;
.h-des {
font-weight: bolder;
}
.h-path {
color: #a4a8b6;
}
}
}
.h-bt-group {
display: flex;
gap: 10px;
.h-bt-icon {
font-size: 20px;
}
}
.title {
font-weight: bolder;
margin: 15px 0;
}
.col-item {
display: flex;
gap: 10px;
.item-label {
width: 100px;
}
}
.column-des {
display: flex;
gap: 10px;
.c-icon {
font-size: 16px;
}
.c-text {
}
}
.power-table-form {
display: flex;
gap: 10px;
.power-table-form-item {
width: 200px;
}
}
</style>
src/views/mallResourceDevelopment/API/publicAPI/index.vue
View file @ 720ef66d
......@@ -77,7 +77,11 @@
<template v-for="item in cardListData" :key="item.title">
<Col :span="6">
<ListItem>
<Card :hoverable="true" style="height: 250px; width: 300px; position: relative">
<Card
:hoverable="true"
style="height: 250px; width: 300px; position: relative"
@click="handleCard(item)"
>
<div style="display: flex; justify-content: space-between">
<div style="display: flex; align-items: center; gap: 5px">
<Checkbox
......@@ -170,7 +174,7 @@
Tag,
} from 'ant-design-vue';
import Icon from '@/components/Icon/Icon.vue';
import { onMounted, reactive, ref } from 'vue';
import { onMounted, reactive, ref, toRaw } from 'vue';
import { cardList } from './mock';
import { PageWrapper } from '@/components/Page';
import { useMessage } from '@/hooks/web/useMessage';
......@@ -273,7 +277,14 @@
onSearch();
}
}
function handleCard(item) {
console.log('item', toRaw(item));
router.push({
path: '/mallResourceDevelopment/API/publicAPI/apiDetail',
query: toRaw(item),
});
}
function handleSelectCard(item: any) {
if (selectedCard.includes(item)) {
selectedCard.splice(selectedCard.indexOf(item), 1);
......@@ -304,7 +315,7 @@
}
function information(item) {
openEditModal(true, item);
// openEditModal(true, item);
}
function handleBulkDownload() {
......@@ -313,7 +324,7 @@
/**批量推送推送*/
function pushNotifications(record) {
openApplyForPushNotificationsModal(true, record);
// openApplyForPushNotificationsModal(true, record);
// router.push({
// path: '/mallResourceDevelopment/dataSet/commonDataSet/applyForPushNotificationsModal',
// query: {},
......
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