diff --git a/packages/ui/certd-client/package.json b/packages/ui/certd-client/package.json
index 5c8e2287..407d03b4 100644
--- a/packages/ui/certd-client/package.json
+++ b/packages/ui/certd-client/package.json
@@ -28,11 +28,11 @@
     "@aws-sdk/s3-request-presigner": "^3.383.0",
     "@fast-crud/fast-crud": "^1.20.1",
     "@fast-crud/fast-extends": "^1.20.1",
-    "@fast-crud/ui-antdv": "^1.20.1",
+    "@fast-crud/ui-antdv4": "^1.20.1",
     "@fast-crud/ui-interface": "^1.20.1",
     "@iconify/vue": "^4.1.1",
     "@soerenmartius/vue3-clipboard": "^0.1.2",
-    "ant-design-vue": "3.2.20",
+    "ant-design-vue": "^4.1.2",
     "axios": "^1.3.4",
     "axios-mock-adapter": "^1.21.2",
     "base64-js": "^1.5.1",
@@ -52,7 +52,7 @@
     "pinia": "2.1.6",
     "qiniu-js": "^3.4.1",
     "sortablejs": "^1.15.0",
-    "vue": "^3.3.4",
+    "vue": "^3.4.0",
     "vue-cropperjs": "^5.0.0",
     "vue-i18n": "^9.2.2",
     "vue-router": "^4.2.4",
@@ -101,7 +101,6 @@
     "stylelint": "^15.10.2",
     "stylelint-config-prettier": "^9.0.5",
     "stylelint-order": "^6.0.3",
-    "tailwindcss": "^3.3.5",
     "terser": "^5.19.2",
     "ts-node": "^10.9.1",
     "typescript": "5.1.6",
@@ -114,8 +113,7 @@
     "vite-plugin-theme": "^0.8.6",
     "vite-plugin-windicss": "^1.9.0",
     "vue-eslint-parser": "^9.3.1",
-    "vue-tsc": "^1.8.8",
-    "windicss": "^3.5.6"
+    "vue-tsc": "^1.8.8"
   },
   "husky": {
     "hooks": {
diff --git a/packages/ui/certd-client/src/layout/components/tabs/index.vue b/packages/ui/certd-client/src/layout/components/tabs/index.vue
index 6f289abc..5b5bbfcf 100644
--- a/packages/ui/certd-client/src/layout/components/tabs/index.vue
+++ b/packages/ui/certd-client/src/layout/components/tabs/index.vue
@@ -5,7 +5,7 @@
         <a-tabs class="fs-multiple-page-control fs-multiple-page-sort" :active-key="page.getCurrent" type="editable-card" hide-add @tabClick="handleClick" @edit="handleTabEdit">
           <a-tab-pane v-for="item in page.getOpened" :key="item.fullPath" :tab="item.meta?.title || '未命名'" :name="item.fullPath" :closable="isTabClosable(item)" />
         </a-tabs>
-        <!--        <fs-contextmenu v-model:visible="contextmenuFlag" :x="contentmenuX" :y="contentmenuY">-->
+        <!--        <fs-contextmenu v-model:open="contextmenuFlag" :x="contentmenuX" :y="contentmenuY">-->
         <!--          <fs-contextmenu-list-->
         <!--            :menulist="tagName === '/index' ? contextmenuListIndex : contextmenuList"-->
         <!--            @rowClick="contextmenuClick"-->
diff --git a/packages/ui/certd-client/src/layout/components/theme/index.vue b/packages/ui/certd-client/src/layout/components/theme/index.vue
index 4f0e6e34..10f45787 100644
--- a/packages/ui/certd-client/src/layout/components/theme/index.vue
+++ b/packages/ui/certd-client/src/layout/components/theme/index.vue
@@ -1,7 +1,7 @@
 <template>
   <div class="fs-theme" @click="show()">
     <fs-iconify icon="ion:sparkles-outline" />
-    <a-drawer v-model:visible="visible" title="主题设置" placement="right" width="350px" :closable="false" @after-visible-change="afterVisibleChange">
+    <a-drawer v-model:open="visible" title="主题设置" placement="right" width="350px" :closable="false" @after-open-change="afterVisibleChange">
       <fs-theme-color-picker :primary-color="setting.getTheme.primaryColor" @change="setting.setPrimaryColor"></fs-theme-color-picker>
     </a-drawer>
   </div>
diff --git a/packages/ui/certd-client/src/main.ts b/packages/ui/certd-client/src/main.ts
index f472005b..bb839f35 100644
--- a/packages/ui/certd-client/src/main.ts
+++ b/packages/ui/certd-client/src/main.ts
@@ -2,7 +2,7 @@ import { createApp } from "vue";
 import App from "./App.vue";
 import router from "./router";
 import Antd from "ant-design-vue";
-import "ant-design-vue/dist/antd.less";
+import 'ant-design-vue/dist/reset.css';
 import "./style/common.less";
 
 import i18n from "./i18n";
diff --git a/packages/ui/certd-client/src/plugin/fast-crud/index.tsx b/packages/ui/certd-client/src/plugin/fast-crud/index.tsx
index ed9d021c..7351f758 100644
--- a/packages/ui/certd-client/src/plugin/fast-crud/index.tsx
+++ b/packages/ui/certd-client/src/plugin/fast-crud/index.tsx
@@ -3,7 +3,7 @@ import { ColumnCompositionProps, CrudOptions, FastCrud, PageQuery, PageRes, setL
 import "@fast-crud/fast-crud/dist/style.css";
 import { FsExtendsCopyable, FsExtendsEditor, FsExtendsJson, FsExtendsTime, FsExtendsUploader, FsUploaderS3SignedUrlType } from "@fast-crud/fast-extends";
 import "@fast-crud/fast-extends/dist/style.css";
-import UiAntdv from "@fast-crud/ui-antdv";
+import UiAntdv from "@fast-crud/ui-antdv4";
 import _ from "lodash-es";
 import { useCrudPermission } from "../permission";
 import { App } from "vue";
diff --git a/packages/ui/certd-client/src/style/antdv4.less b/packages/ui/certd-client/src/style/antdv4.less
new file mode 100644
index 00000000..6acf779b
--- /dev/null
+++ b/packages/ui/certd-client/src/style/antdv4.less
@@ -0,0 +1,28 @@
+.ant-layout .ant-layout-sider{
+    background-color: #ebf1f6;
+}
+
+.ant-layout .ant-layout-header{
+  background-color: #ebf1f6;
+}
+
+.fs-multiple-page-control-group .fs-multiple-page-control-content{
+  overflow-y: hidden;
+}
+
+.fs-multiple-page-control-group .fs-multiple-page-control-btn .ant-btn{
+  border-bottom-left-radius:0;
+  border-bottom-right-radius:0;
+}
+.ant-menu-horizontal{
+  border-bottom: 0;
+}
+
+.fs-framework .header-menu{
+  overflow-y: hidden;
+}
+
+.ant-btn.ant-btn-icon-only{
+  padding-inline:revert;
+}
+
diff --git a/packages/ui/certd-client/src/style/certd.less b/packages/ui/certd-client/src/style/certd.less
new file mode 100644
index 00000000..e69de29b
diff --git a/packages/ui/certd-client/src/style/common.less b/packages/ui/certd-client/src/style/common.less
index 670d686b..a62a22f5 100644
--- a/packages/ui/certd-client/src/style/common.less
+++ b/packages/ui/certd-client/src/style/common.less
@@ -1,13 +1,10 @@
-@import './tailwind.less';
-@import "ant-design-vue/dist/antd.less";
 @import './theme/index.less';
 @import './theme/default.less';
 @import './scroll.less';
 @import './transition.less';
 @import './fix-windicss.less';
-
-
-svg { vertical-align: baseline; }
+@import './antdv4.less';
+@import './certd.less';
 
 html, body {
   margin: 0;
@@ -66,64 +63,6 @@ h1, h2, h3, h4, h5, h6 {
   margin:10px;
 }
 
-
-.text-center{
-  text-align: center;
-}
-
-
-
-.font12{
-  font-size: 12px;
-}
-
-.bg-gray{
-  background-color: #eee;
-}
-
-.bg-white{
-  background-color: #fff;
-}
-
-.fs-page-header{
-  background-color: #fff;
-}
-
-
-.ant-btn{
-  .fs-iconify{
-    font-size:16px;
-    margin-right:3px
-  }
-
-  display: inline-flex;
-  justify-content: center;
-  align-items: center;
-
-}
-
-.ant-timeline{
-  .fs-iconify{
-    font-size: 16px;
-  }
-}
-
-.gray{
-  color:gray;
-}
-.green{
-  color:green;
-}
-.blue{
-  color:blue;
-}
-.red{
-  color:red
-}
-.yellow{
-  color:yellow;
-}
-
-.font-20{
-  font-size:20px
-}
+.p-5{
+  padding:5px;
+}
\ No newline at end of file
diff --git a/packages/ui/certd-client/src/style/fix-windicss.less b/packages/ui/certd-client/src/style/fix-windicss.less
index 68ed760c..c4e284ec 100644
--- a/packages/ui/certd-client/src/style/fix-windicss.less
+++ b/packages/ui/certd-client/src/style/fix-windicss.less
@@ -1,4 +1,3 @@
 img.ant-image-preview-img{
   display: initial;
 }
-
diff --git a/packages/ui/certd-client/src/views/certd/access/access-selector/index.vue b/packages/ui/certd-client/src/views/certd/access/access-selector/index.vue
index b5eec938..98f7c5e4 100644
--- a/packages/ui/certd-client/src/views/certd/access/access-selector/index.vue
+++ b/packages/ui/certd-client/src/views/certd/access/access-selector/index.vue
@@ -4,7 +4,7 @@
     <span v-else class="mlr-5 gray">请选择</span>
     <a-button @click="chooseForm.open">选择</a-button>
     <a-form-item-rest v-if="chooseForm.show">
-      <a-modal v-model:visible="chooseForm.show" title="选择授权提供者" width="700px" @ok="chooseForm.ok">
+      <a-modal v-model:open="chooseForm.show" title="选择授权提供者" width="700px" @ok="chooseForm.ok">
         <div style="height: 400px; position: relative">
           <cert-access-modal v-model="selectedId" :type="type"></cert-access-modal>
         </div>
diff --git a/packages/ui/certd-client/src/views/certd/pipeline/pipeline/component/notification-form/index.vue b/packages/ui/certd-client/src/views/certd/pipeline/pipeline/component/notification-form/index.vue
index e5623fdd..3f089dc7 100644
--- a/packages/ui/certd-client/src/views/certd/pipeline/pipeline/component/notification-form/index.vue
+++ b/packages/ui/certd-client/src/views/certd/pipeline/pipeline/component/notification-form/index.vue
@@ -1,5 +1,5 @@
 <template>
-  <a-drawer v-model:visible="notificationDrawerVisible" placement="right" :closable="true" width="600px" class="pi-notification-form" @after-visible-change="notificationDrawerOnAfterVisibleChange">
+  <a-drawer v-model:open="notificationDrawerVisible" placement="right" :closable="true" width="600px" class="pi-notification-form" @after-open-change="notificationDrawerOnAfterVisibleChange">
     <template #title>
       编辑触发器
       <a-button v-if="mode === 'edit'" @click="notificationDelete()">
diff --git a/packages/ui/certd-client/src/views/certd/pipeline/pipeline/component/step-form/index.vue b/packages/ui/certd-client/src/views/certd/pipeline/pipeline/component/step-form/index.vue
index 91f6c9dc..08e76dda 100644
--- a/packages/ui/certd-client/src/views/certd/pipeline/pipeline/component/step-form/index.vue
+++ b/packages/ui/certd-client/src/views/certd/pipeline/pipeline/component/step-form/index.vue
@@ -1,5 +1,5 @@
 <template>
-  <a-drawer v-model:visible="stepDrawerVisible" placement="right" :closable="true" width="600px" @after-visible-change="stepDrawerOnAfterVisibleChange">
+  <a-drawer v-model:open="stepDrawerVisible" placement="right" :closable="true" width="600px" @after-open-change="stepDrawerOnAfterVisibleChange">
     <template #title>
       编辑任务
       <a-button v-if="editMode" @click="stepDelete()">
diff --git a/packages/ui/certd-client/src/views/certd/pipeline/pipeline/component/task-form/index.vue b/packages/ui/certd-client/src/views/certd/pipeline/pipeline/component/task-form/index.vue
index 2a7c2605..93b6237b 100644
--- a/packages/ui/certd-client/src/views/certd/pipeline/pipeline/component/task-form/index.vue
+++ b/packages/ui/certd-client/src/views/certd/pipeline/pipeline/component/task-form/index.vue
@@ -1,5 +1,5 @@
 <template>
-  <a-drawer v-model:visible="taskDrawerVisible" placement="right" :closable="true" width="600px" class="pi-task-form" @after-visible-change="taskDrawerOnAfterVisibleChange">
+  <a-drawer v-model:open="taskDrawerVisible" placement="right" :closable="true" width="600px" class="pi-task-form" @after-open-change="taskDrawerOnAfterVisibleChange">
     <template #title>
       编辑任务
       <a-button v-if="editMode" @click="taskDelete()">
diff --git a/packages/ui/certd-client/src/views/certd/pipeline/pipeline/component/task-view/index.vue b/packages/ui/certd-client/src/views/certd/pipeline/pipeline/component/task-view/index.vue
index deb82cfd..fe960dff 100644
--- a/packages/ui/certd-client/src/views/certd/pipeline/pipeline/component/task-view/index.vue
+++ b/packages/ui/certd-client/src/views/certd/pipeline/pipeline/component/task-view/index.vue
@@ -1,5 +1,5 @@
 <template>
-  <a-modal v-model:visible="taskModal.visible" class="pi-task-view" title="任务日志" style="width: 80%" v-bind="taskModal">
+  <a-modal v-model:open="taskModal.open" class="pi-task-view" title="任务日志" style="width: 80%" v-bind="taskModal">
     <a-tabs v-model:activeKey="activeKey" tab-position="left" animated>
       <a-tab-pane v-for="item of detail.nodes" :key="item.node.id">
         <template #tab>
@@ -25,7 +25,7 @@ export default {
   props: {},
   setup(props: any, ctx: any) {
     const taskModal = ref({
-      visible: false,
+      open: false,
       onOk() {
         taskViewClose();
       },
@@ -36,7 +36,7 @@ export default {
     const activeKey = ref();
     const currentHistory: Ref<RunHistory> | undefined = inject("currentHistory");
     const taskViewOpen = (task: any) => {
-      taskModal.value.visible = true;
+      taskModal.value.open = true;
       const nodes: any = [];
       // nodes.push({
       //   node: task,
@@ -71,7 +71,7 @@ export default {
     };
 
     const taskViewClose = () => {
-      taskModal.value.visible = false;
+      taskModal.value.open = false;
     };
 
     return {
diff --git a/packages/ui/certd-client/src/views/certd/pipeline/pipeline/component/trigger-form/index.vue b/packages/ui/certd-client/src/views/certd/pipeline/pipeline/component/trigger-form/index.vue
index c4c5e279..eba102b3 100644
--- a/packages/ui/certd-client/src/views/certd/pipeline/pipeline/component/trigger-form/index.vue
+++ b/packages/ui/certd-client/src/views/certd/pipeline/pipeline/component/trigger-form/index.vue
@@ -1,11 +1,11 @@
 <template>
   <a-drawer
-    v-model:visible="triggerDrawerVisible"
+    v-model:open="triggerDrawerVisible"
     placement="right"
     :closable="true"
     width="600px"
     class="pi-trigger-form"
-    @after-visible-change="triggerDrawerOnAfterVisibleChange"
+    @after-open-change="triggerDrawerOnAfterVisibleChange"
   >
     <template #title>
       编辑触发器
diff --git a/packages/ui/certd-client/src/views/crud/advanced/in-dialog/index.vue b/packages/ui/certd-client/src/views/crud/advanced/in-dialog/index.vue
index a85b208d..0629101e 100644
--- a/packages/ui/certd-client/src/views/crud/advanced/in-dialog/index.vue
+++ b/packages/ui/certd-client/src/views/crud/advanced/in-dialog/index.vue
@@ -7,7 +7,7 @@
       <a-button type="primary" @click="openDialog">打开对话框</a-button>
     </div>
 
-    <a-modal v-model:visible="dialogShow" width="80%" title="fs-crud in dialog">
+    <a-modal v-model:open="dialogShow" width="80%" title="fs-crud in dialog">
       <div style="height: 400px; position: relative">
         <!-- 在此处显示fs-crud页面 -->
         <fs-in-dialog></fs-in-dialog>
diff --git a/packages/ui/certd-client/src/views/sys/authority/role/index.vue b/packages/ui/certd-client/src/views/sys/authority/role/index.vue
index 3d3686b0..170eb489 100644
--- a/packages/ui/certd-client/src/views/sys/authority/role/index.vue
+++ b/packages/ui/certd-client/src/views/sys/authority/role/index.vue
@@ -4,7 +4,7 @@
       <div class="title">角色管理</div>
     </template>
     <fs-crud ref="crudRef" v-bind="crudBinding" />
-    <a-modal v-model:visible="authzDialogVisible" width="860px" title="分配权限" @ok="updatePermission">
+    <a-modal v-model:open="authzDialogVisible" width="860px" title="分配权限" @ok="updatePermission">
       <fs-permission-tree ref="permissionTreeRef" v-model:checkedKeys="checkedKeys" :tree="permissionTreeData" :editable="false" checkable :replace-fields="{ key: 'id', label: 'title' }"> </fs-permission-tree>
     </a-modal>
   </fs-page>