lkddi/certd
1
0
Fork 0
mirror of https://github.com/certd/certd.git synced 2026-05-16 05:07:32 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix: 修复左侧菜单收起时无法展开子菜单的bug

Browse Source
This commit is contained in:
xiaojunnuo
2024-12-24 17:09:06 +08:00
parent 8ebf95a222
commit 005622307e
21 changed files with 367 additions and 172 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/ui/certd-client/src/views/certd/pipeline/crud.tsx
+1 -1
View File
@@ -501,7 +501,7 @@ export default function ({ crudExpose, context: { certdFormRef, groupDictRef, se
},
column: {
sorter: true,
width: 80,
width: 120,
align: "center"
}
},
packages/ui/certd-client/src/views/certd/pipeline/pipeline/utils/util.status.ts
+6
View File
@@ -57,6 +57,12 @@ const StatusEnum: StatusEnumType = {
label: "禁用",
color: "gray",
icon: "ant-design:stop-outlined"
},
no_deploy_count: {
value: "no_deploy_count",
label: "次数不足",
color: "gray",
icon: "ant-design:stop-outlined"
}
};
export const statusUtil = {
packages/ui/certd-client/src/views/certd/suite/buy.vue
+1 -5
View File
@@ -14,14 +14,10 @@
</a-card>
</a-col>
</a-row>
<h3>套餐</h3>
<a-row :gutter="8" class="mt-10">
<a-col v-for="item of suites" :key="item.id" class="mb-10 suite-card-col">
<product-info :product="item" @order="doOrder" />
</a-col>
</a-row>
<h3>加量包</h3>
<a-row :gutter="8" class="mt-10">
<a-col v-for="item of addons" :key="item.id" class="mb-10 suite-card-col">
<product-info :product="item" @order="doOrder" />
</a-col>
@@ -44,7 +40,7 @@ const addons = ref([]);
async function loadProducts() {
const list = await api.ProductList();
suites.value = list.filter((x: any) => x.type === "suite");
addons.value = list.filter((x: any) => x.type === "addone");
addons.value = list.filter((x: any) => x.type === "addon");
}
loadProducts();
packages/ui/certd-client/src/views/certd/suite/mine/crud.tsx
+13 -30
View File
@@ -1,10 +1,11 @@
import { AddReq, CreateCrudOptionsProps, CreateCrudOptionsRet, DelReq, dict, EditReq, UserPageQuery, UserPageRes } from "@fast-crud/fast-crud";
import { AddReq, compute, CreateCrudOptionsProps, CreateCrudOptionsRet, DelReq, dict, EditReq, UserPageQuery, UserPageRes } from "@fast-crud/fast-crud";
import api from "./api";
import { useRouter } from "vue-router";
import SuiteValueEdit from "/@/views/sys/suite/product/suite-value-edit.vue";
import SuiteValue from "/@/views/sys/suite/product/suite-value.vue";
import DurationValue from "/@/views/sys/suite/product/duration-value.vue";
import dayjs from "dayjs";
import UserSuiteStatus from "/@/views/certd/suite/mine/user-suite-status.vue";
export default function ({ crudExpose, context }: CreateCrudOptionsProps): CreateCrudOptionsRet {
const pageRequest = async (query: UserPageQuery): Promise<UserPageRes> => {
@@ -207,7 +208,10 @@ export default function ({ crudExpose, context }: CreateCrudOptionsProps): Creat
component: {
name: SuiteValue,
vModel: "modelValue",
unit: "次"
unit: "次",
used: compute(({ row }) => {
return row.deployCountUsed;
})
},
align: "center"
}
@@ -254,38 +258,17 @@ export default function ({ crudExpose, context }: CreateCrudOptionsProps): Creat
column: {
width: 100,
align: "center",
component: {
name: UserSuiteStatus,
userSuite: compute(({ row }) => {
return row;
}),
currentSuite: context.detail
},
conditionalRender: {
match() {
return false;
}
},
cellRender({ row }) {
if (row.activeTime == null) {
return <a-tag color="blue">未使用</a-tag>;
}
const now = dayjs().valueOf();
//已过期
const isExpired = row.expiresTime != -1 && now > row.expiresTime;
if (isExpired) {
return <a-tag color="error">已过期</a-tag>;
}
//如果在激活时间之前
if (now < row.activeTime) {
return <a-tag color="blue">待生效</a-tag>;
}
//是否是当前套餐
const suites = context.detail.value.suites;
if (suites && suites.length > 0) {
const suite = suites[0];
if (suite.productType === "suite" && suite.id === row.id) {
return <a-tag color="success">当前套餐</a-tag>;
}
}
// 是否在激活时间和过期时间之间
if (now > row.activeTime && (row.expiresTime == -1 || now < row.expiresTime)) {
return <a-tag color="success">生效中</a-tag>;
}
}
}
},
packages/ui/certd-client/src/views/certd/suite/mine/index.vue
+8 -3
View File
@@ -1,12 +1,16 @@
<template>
<fs-page>
<template #header>
<div class="title">
<div class="title flex-baseline">
我的套餐
<span class="sub">我的所有套餐</span>
<div class="sub">
<div class="flex-o">当前套餐：<suite-card></suite-card></div>
</div>
</div>
</template>
<fs-crud ref="crudRef" v-bind="crudBinding"> </fs-crud>
<fs-crud ref="crudRef" v-bind="crudBinding">
<template #actionbar-right> </template>
</fs-crud>
</fs-page>
</template>
@@ -15,6 +19,7 @@ import { onActivated, onMounted, ref } from "vue";
import { useFs } from "@fast-crud/fast-crud";
import createCrudOptions from "./crud";
import api, { SuiteDetail } from "/@/views/certd/suite/mine/api";
import SuiteCard from "/@/views/framework/home/dashboard/suite-card.vue";
defineOptions({
name: "MySuites"
packages/ui/certd-client/src/views/certd/suite/mine/user-suite-status.vue
+54
View File
@@ -0,0 +1,54 @@
<template>
<a-tag :color="binding.color">{{ binding.text }}</a-tag>
</template>
<script setup lang="ts">
import { ref, computed } from "vue";
import dayjs from "dayjs";
defineOptions({
name: "UserSuiteStatus"
});
const props = defineProps<{
userSuite: any;
currentSuite?: any;
}>();
const binding = computed(() => {
const userSuite = props.userSuite;
if (!userSuite) {
return {};
}
if (userSuite.activeTime == null) {
return { color: "blue", text: "未使用" };
}
const now = dayjs().valueOf();
//已过期
const isExpired = userSuite.expiresTime != -1 && now > userSuite.expiresTime;
if (isExpired) {
return { color: "error", text: "已过期" };
}
//如果在激活时间之前
if (now < userSuite.activeTime) {
return { color: "blue", text: "待生效" };
}
if (userSuite.isEmpty) {
return { color: "gray", text: "已用完" };
}
//是否是当前套餐
if (props.currentSuite && props.currentSuite.productType === "suite" && props.currentSuite.id === userSuite.id) {
return { color: "success", text: "当前套餐" };
}
// 是否在激活时间和过期时间之间
if (now > userSuite.activeTime && (userSuite.expiresTime == -1 || now < userSuite.expiresTime)) {
if (userSuite.productType === "suite") {
return { color: "success", text: "有效期内" };
}
return { color: "success", text: "生效中" };
}
return {};
});
</script>
packages/ui/certd-client/src/views/certd/suite/product-info.vue
+9 -3
View File
@@ -16,7 +16,13 @@
<suite-value :model-value="product.content.maxDomainCount" unit="个" />
</div>
<div class="flex-between mt-5">
<div class="flex-o"><fs-icon icon="ant-design:check-outlined" class="color-green mr-5" /> 部署次数：</div>
<div class="flex-o">
<fs-icon icon="ant-design:check-outlined" class="color-green mr-5" />
部署次数：
<a-tooltip title="只有运行成功才会扣除部署次数">
<fs-icon class="font-size-16 ml-5" icon="mingcute:question-line"></fs-icon>
</a-tooltip>
</div>
<suite-value :model-value="product.content.maxDeployCount" unit="次" />
</div>
<div class="flex-between mt-5">
@@ -43,7 +49,7 @@
<div class="price flex-between mt-5">
<div class="flex-o">价格</div>
<div class="flex-o price-text">
<price-input style="font-size: 18px; color: red" :model-value="selected?.price" :edit="false" />
<price-input style="color: red" :font-size="20" :model-value="selected?.price" :edit="false" />
<span class="ml-5" style="font-size: 12px"> / {{ durationDict.dataMap[selected.duration]?.label }}</span>
</div>
</div>
@@ -58,7 +64,7 @@ import { durationDict } from "/@/views/certd/suite/api";
import SuiteValue from "/@/views/sys/suite/product/suite-value.vue";
import PriceInput from "/@/views/sys/suite/product/price-input.vue";
import { ref } from "vue";
import { dict } from "@fast-crud/fast-crud";
import { dict, FsIcon } from "@fast-crud/fast-crud";
const props = defineProps<{
product: any;
packages/ui/certd-client/src/views/framework/home/dashboard/suite-card.vue
+9 -2
View File
@@ -9,11 +9,17 @@
<suite-value :model-value="detail.pipelineCount.max" :used="detail.pipelineCount.used" unit="条" />
</div>
<div class="flex-between mt-5">
<div class="flex-o"><fs-icon icon="ant-design:check-outlined" class="color-green mr-5" />域名数量：</div>
<div class="flex-o">
<fs-icon icon="ant-design:check-outlined" class="color-green mr-5" />
域名数量：
</div>
<suite-value :model-value="detail.domainCount.max" :used="detail.domainCount.used" unit="个" />
</div>
<div class="flex-between mt-5">
<div class="flex-o"><fs-icon icon="ant-design:check-outlined" class="color-green mr-5" /> 部署次数：</div>
<div class="flex-o">
<fs-icon icon="ant-design:check-outlined" class="color-green mr-5" />
部署次数：
</div>
<suite-value :model-value="detail.deployCount.max" :used="detail.deployCount.used" unit="次" />
</div>
<div class="flex-between mt-5">
@@ -41,6 +47,7 @@ import SuiteValue from "/@/views/sys/suite/product/suite-value.vue";
import { ref } from "vue";
import ExpiresTimeText from "/@/components/expires-time-text.vue";
import api, { SuiteDetail } from "/@/views/certd/suite/mine/api";
import { FsIcon } from "@fast-crud/fast-crud";
defineOptions({
name: "SuiteCard"
packages/ui/certd-client/src/views/sys/suite/user-suite/crud.tsx
+36 -21
View File
@@ -1,4 +1,4 @@
import { AddReq, CreateCrudOptionsProps, CreateCrudOptionsRet, DelReq, dict, EditReq, UserPageQuery, UserPageRes } from "@fast-crud/fast-crud";
import { AddReq, compute, CreateCrudOptionsProps, CreateCrudOptionsRet, DelReq, dict, EditReq, UserPageQuery, UserPageRes } from "@fast-crud/fast-crud";
import { pipelineGroupApi } from "./api";
import { useRouter } from "vue-router";
import SuiteValueEdit from "/@/views/sys/suite/product/suite-value-edit.vue";
@@ -6,6 +6,7 @@ import SuiteValue from "/@/views/sys/suite/product/suite-value.vue";
import DurationValue from "/@/views/sys/suite/product/duration-value.vue";
import dayjs from "dayjs";
import createCrudOptionsUser from "/@/views/sys/authority/user/crud";
import UserSuiteStatus from "/@/views/certd/suite/mine/user-suite-status.vue";
export default function ({ crudExpose, context }: CreateCrudOptionsProps): CreateCrudOptionsRet {
const api = pipelineGroupApi;
@@ -68,6 +69,7 @@ export default function ({ crudExpose, context }: CreateCrudOptionsProps): Creat
// }
}
},
toolbar: { show: false },
rowHandle: {
width: 200,
fixed: "right",
@@ -234,7 +236,10 @@ export default function ({ crudExpose, context }: CreateCrudOptionsProps): Creat
component: {
name: SuiteValue,
vModel: "modelValue",
unit: "次"
unit: "次",
used: compute(({ row }) => {
return row.deployCountUsed;
})
},
align: "center"
}
@@ -281,29 +286,16 @@ export default function ({ crudExpose, context }: CreateCrudOptionsProps): Creat
column: {
width: 100,
align: "center",
component: {
name: UserSuiteStatus,
userSuite: compute(({ row }) => {
return row;
})
},
conditionalRender: {
match() {
return false;
}
},
cellRender({ row }) {
if (row.activeTime == null) {
return <a-tag color="blue">未使用</a-tag>;
}
const now = dayjs().valueOf();
//已过期
const isExpired = row.expiresTime != -1 && now > row.expiresTime;
if (isExpired) {
return <a-tag color="error">已过期</a-tag>;
}
//如果在激活时间之前
if (now < row.activeTime) {
return <a-tag color="blue">待生效</a-tag>;
}
// 是否在激活时间和过期时间之间
if (now > row.activeTime && (row.expiresTime == -1 || now < row.expiresTime)) {
return <a-tag color="success">生效中</a-tag>;
}
}
}
},
@@ -342,6 +334,29 @@ export default function ({ crudExpose, context }: CreateCrudOptionsProps): Creat
width: 100,
align: "center"
}
},
createTime: {
title: "创建时间",
type: "datetime",
form: {
show: false
},
column: {
sorter: true,
width: 160,
align: "center"
}
},
updateTime: {
title: "更新时间",
type: "datetime",
form: {
show: false
},
column: {
show: true,
width: 160
}
}
}
}