diff --git a/src/dashboard-front-new/package.json b/src/dashboard-front-new/package.json index ed412f572..4368f6910 100644 --- a/src/dashboard-front-new/package.json +++ b/src/dashboard-front-new/package.json @@ -23,7 +23,7 @@ "license": "ISC", "dependencies": { "art-template": "^4.13.2", - "bkui-vue": "0.0.2-beta.97", + "bkui-vue": "0.0.2-beta.109", "connect-history-api-fallback": "^2.0.0", "cookie": "^0.5.0", "cookie-parser": "^1.4.5", diff --git a/src/dashboard-front-new/src/components/version-diff/index.vue b/src/dashboard-front-new/src/components/version-diff/index.vue index 0670778f3..1d731ef0d 100644 --- a/src/dashboard-front-new/src/components/version-diff/index.vue +++ b/src/dashboard-front-new/src/components/version-diff/index.vue @@ -589,7 +589,7 @@ const getApigwVersions = async () => { try { const res = await getResourceVersionsList(apigwId.value, pageParams); res.results.forEach((item: any) => { - item.resource_version_display = `${item.version}(${item.comment})`; + item.resource_version_display = item.comment ? `${item.version}(${item.comment})` : item.version; item.stage_text = item.released_stages.map((item: any) => { return item.name; }); diff --git a/src/dashboard-front-new/src/hooks/use-getapi-data.ts b/src/dashboard-front-new/src/hooks/use-getapi-data.ts index 2d9d11376..0122f5843 100644 --- a/src/dashboard-front-new/src/hooks/use-getapi-data.ts +++ b/src/dashboard-front-new/src/hooks/use-getapi-data.ts @@ -9,6 +9,7 @@ const initPagination: IPagination = { count: 0, }; const pagination = ref(initPagination); +const dataList = ref([]); export const useGetApiList = (filter: any) => { const getGatewaysListData = async () => { @@ -19,7 +20,8 @@ export const useGetApiList = (filter: any) => { ...filter.value, }; const res = await getGatewaysList(parmas); - return res.results; + dataList.value = res.results; + return dataList.value; } catch (error) {} }; @@ -34,5 +36,6 @@ export const useGetApiList = (filter: any) => { return { getGatewaysListData, + dataList, }; }; diff --git a/src/dashboard-front-new/src/hooks/use-query-list.ts b/src/dashboard-front-new/src/hooks/use-query-list.ts index 158d886bc..129f8cdda 100644 --- a/src/dashboard-front-new/src/hooks/use-query-list.ts +++ b/src/dashboard-front-new/src/hooks/use-query-list.ts @@ -19,6 +19,7 @@ export function useQueryList(apiMethod: Function, filterData?: any, id?: number) offset: 0, limit: 10, count: 0, + small: false, }; const pagination = ref({ ...initPagination }); diff --git a/src/dashboard-front-new/src/http/gateway.ts b/src/dashboard-front-new/src/http/gateway.ts index 9799f55de..711a9c538 100644 --- a/src/dashboard-front-new/src/http/gateway.ts +++ b/src/dashboard-front-new/src/http/gateway.ts @@ -6,6 +6,9 @@ const { BK_DASHBOARD_URL, CREATE_CHAT_API, SEND_CHAT_API } = window; // 获取网关列表 export const getGatewaysList = (data: any) => fetch.get(`${BK_DASHBOARD_URL}/gateways/?${json2Query(data)}`); +// 获取网关详情 +export const getGatewaysDetail = (apigwId: number) => fetch.get(`${BK_DASHBOARD_URL}/gateways/${apigwId}/`); + // 新建网关 export const createGateway = (data: any) => fetch.post(`${BK_DASHBOARD_URL}/gateways/`, data); diff --git a/src/dashboard-front-new/src/store/common.ts b/src/dashboard-front-new/src/store/common.ts index 3f4a18e74..d62996024 100644 --- a/src/dashboard-front-new/src/store/common.ts +++ b/src/dashboard-front-new/src/store/common.ts @@ -40,6 +40,7 @@ export const useCommon = defineStore('common', { name: 'ANY', }, ], + curApigwData: { allow_update_gateway_auth: false }, }), actions: { setApigwId(apigwId: number) { @@ -48,5 +49,9 @@ export const useCommon = defineStore('common', { setApigwName(name: string) { this.apigwName = name; }, + setCurApigwData(data: any) { + this.curApigwData = data; + console.log('this.curApigwData', this.curApigwData); + }, }, }); diff --git a/src/dashboard-front-new/src/types/common.ts b/src/dashboard-front-new/src/types/common.ts index a7f530f64..bc15a5a30 100644 --- a/src/dashboard-front-new/src/types/common.ts +++ b/src/dashboard-front-new/src/types/common.ts @@ -1,5 +1,6 @@ // 分页interface export interface IPagination { + small?: boolean offset: number limit: number count: number diff --git a/src/dashboard-front-new/src/views/home.vue b/src/dashboard-front-new/src/views/home.vue index 08f3a9b1a..04d23e510 100644 --- a/src/dashboard-front-new/src/views/home.vue +++ b/src/dashboard-front-new/src/views/home.vue @@ -9,7 +9,7 @@ > {{ t('新建网关') }} - +
-
-
{{ t('网关名') }}
-
{{ t('创建者') }}
-
{{ t('环境列表') }}
-
{{ t('资源数量') }}
-
{{ t('操作') }}
-
-
-
-
- - - {{ item.name }} - - {{ t('官方') }} - {{ t('已停用') }} -
-
{{ item.created_by }}
-
-
+
+
+
{{ t('网关名') }}
+
{{ t('创建者') }}
+
{{ t('环境列表') }}
+
{{ t('资源数量') }}
+
{{ t('操作') }}
+
+
+
+
+ - - - {{ envItem.name }} - + class="name mr10" :class="item.status ? '' : 'deact-name'" + @click="handleGoPage('apigwResource', item.id)"> + {{ item.name }} - - +{{ item.stages.length - item.tagOrder }} - - + {{ t('官方') }} + {{ t('已停用') }} +
+
{{ item.created_by }}
+
+
+ + + + {{ envItem.name }} + + + + +{{ item.stages.length - item.tagOrder }} + + +
+
+
+ {{ item.resource_count }}
+
+ + 环境概览 + + + 资源配置 + + + 流水日志 +
-
-
{{ item.resource_count }}
-
- - 环境概览 - - - 资源配置 - - - 流水日志 -
+
+
+
+ {{ t('暂无数据') }} +
+
+ +
- - + 公开,则用户可查看资源文档、申请资源权限;不公开,则网关对用户隐藏 @@ -180,15 +189,15 @@ import { useGetApiList } from '@/hooks'; import { is24HoursAgo } from '@/common/util'; import { ref, + watch, } from 'vue'; const { t } = useI18n(); const user = useUser(); const router = useRouter(); - const formRef = ref(null); -const filterKey = ref('created_time'); -const filterNameData = ref({ name: '' }); +const filterKey = ref('updated_time'); +const filterNameData = ref({ keyword: '' }); // 弹窗 const dialogData = ref({ isShow: false, @@ -251,16 +260,22 @@ const gatewaysList = ref([]); const curYear = (new Date()).getFullYear(); const filterData = ref([ - { value: 'created_time', label: t('创建时间') }, { value: 'updated_time', label: t('更新时间') }, + { value: 'created_time', label: t('创建时间') }, { value: 'name', label: t('字母 A-Z') }, ]); // 获取网关数据方法 const { getGatewaysListData, + dataList, } = useGetApiList(filterNameData); +// 赋值给列表 +watch(() => dataList.value, (val: any[]) => { + gatewaysList.value = val; +}); + // 页面初始化 const init = async () => { @@ -321,6 +336,7 @@ const resetDialogData = () => { initDialogData.is_public = true; }; +// 列表排序 const handleChange = (v: string) => { switch (v) { case 'created_time': @@ -387,7 +403,6 @@ init(); border-radius: 2px; padding: 0 16px; margin: 12px 0px; - cursor: pointer; .name-logo{ width: 48px; height: 48px; @@ -398,10 +413,12 @@ init(); color: #3A84FF; font-size: 26px; font-weight: 700; + cursor: pointer; } .name{ font-weight: 700; color: #313238; + cursor: pointer; &:hover{ color: #3a84ff; } diff --git a/src/dashboard-front-new/src/views/main.vue b/src/dashboard-front-new/src/views/main.vue index eb2acfbd7..698843fc0 100644 --- a/src/dashboard-front-new/src/views/main.vue +++ b/src/dashboard-front-new/src/views/main.vue @@ -86,7 +86,7 @@ import { useRoute, useRouter } from 'vue-router'; import { menuData } from '@/common/menu'; import { useGetApiList } from '@/hooks'; import { useCommon, usePermission } from '@/store'; -import { getPermissionApplyList } from '@/http'; +import { getPermissionApplyList, getGatewaysDetail } from '@/http'; const route = useRoute(); const router = useRouter(); @@ -123,6 +123,12 @@ const handleSetApigwName = () => { common.setApigwName(apigwName); }; +// 将当前的网关详情存到全局pinia中 +const handleSetApigwDeatail = async () => { + const curApigwDataDetail = await getGatewaysDetail(apigwId.value); + common.setCurApigwData(curApigwDataDetail); +}; + // 监听当前路由 watch( () => route, @@ -134,6 +140,8 @@ watch( common.setApigwId(apigwId.value); // 设置全局网关名称 handleSetApigwName(); + // 设置当前网关详情 + handleSetApigwDeatail(); }, { immediate: true, deep: true }, ); diff --git a/src/dashboard-front-new/src/views/permission/app/index.vue b/src/dashboard-front-new/src/views/permission/app/index.vue index 8fa5ef82c..d825c626e 100644 --- a/src/dashboard-front-new/src/views/permission/app/index.vue +++ b/src/dashboard-front-new/src/views/permission/app/index.vue @@ -2,8 +2,8 @@
- - + + {{ t('批量续期') }} @@ -31,8 +31,11 @@ + remote-pagination + @page-limit-change="handlePageSizeChange" + @page-value-change="handlePageChange" + @selection-change="handleSelectionChange" + @select-all="handleSelecAllChange"> @@ -276,7 +279,6 @@ const resourceList = ref([]); const isVisible = ref(false); const isBatchApplyLoaading = ref(false); const tableIndex = ref(0); -const applySumCount = ref(-1); const curPermission = ref({ bk_app_code: '', detail: [], id: -1 }); const dimension = ref('resource'); const searchQuery = ref(''); @@ -366,6 +368,7 @@ const { const { selections, handleSelectionChange, + handleSelecAllChange, resetSelections, } = useSelection(); @@ -406,14 +409,6 @@ watch( } }, ); -// 监听选择的变化 -watch( - () => selections.value, - (v: number[]) => { - applySumCount.value = v.length; - }, - { immediate: true, deep: true }, -); watch( () => selections.value, (v: number[]) => { diff --git a/src/dashboard-front-new/src/views/permission/apply/index.vue b/src/dashboard-front-new/src/views/permission/apply/index.vue index 6d5ebaef0..3fa64483d 100644 --- a/src/dashboard-front-new/src/views/permission/apply/index.vue +++ b/src/dashboard-front-new/src/views/permission/apply/index.vue @@ -1,8 +1,8 @@