diff --git a/components.d.ts b/components.d.ts
index 1683e72..f1e6c46 100644
--- a/components.d.ts
+++ b/components.d.ts
@@ -20,6 +20,7 @@ declare module 'vue' {
     NDialogProvider: typeof import('naive-ui')['NDialogProvider']
     NDivider: typeof import('naive-ui')['NDivider']
     NDropdown: typeof import('naive-ui')['NDropdown']
+    NDynamicInput: typeof import('naive-ui')['NDynamicInput']
     NForm: typeof import('naive-ui')['NForm']
     NFormItem: typeof import('naive-ui')['NFormItem']
     NGi: typeof import('naive-ui')['NGi']
@@ -47,6 +48,7 @@ declare module 'vue' {
     Quill: typeof import('./src/components/RichEditor/Quill.vue')['default']
     RouterLink: typeof import('vue-router')['RouterLink']
     RouterView: typeof import('vue-router')['RouterView']
+    Search: typeof import('./src/components/Search/Search.vue')['default']
     SvgIcon: typeof import('./src/components/Icon/SvgIcon.vue')['default']
   }
 }
diff --git a/src/assets/icons/cut-down.svg b/src/assets/icons/cut-down.svg
new file mode 100644
index 0000000..598ee42
--- /dev/null
+++ b/src/assets/icons/cut-down.svg
@@ -0,0 +1,22 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="28px" height="28px" viewBox="0 0 28 28" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <title>失败</title>
+    <defs>
+        <rect id="path-1" x="0" y="0" width="28" height="28"></rect>
+    </defs>
+    <g id="任务审批" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="1.0备份-8" transform="translate(-995.000000, -199.000000)">
+            <g id="编组-8" transform="translate(484.720905, 182.572383)">
+                <g id="失败" transform="translate(510.279095, 16.427617)">
+                    <g transform="translate(0.000000, 0.000000)">
+                        <mask id="mask-2" fill="white">
+                            <use xlink:href="#path-1"></use>
+                        </mask>
+                        <g id="蒙版"></g>
+                        <path d="M14,1.75 C20.7654882,1.75 26.25,7.23451181 26.25,14 C26.25,20.7654882 20.7654882,26.25 14,26.25 C7.23451181,26.25 1.75,20.7654882 1.75,14 C1.75,7.23451181 7.23451181,1.75 14,1.75 Z M14,3.9375 C8.44263471,3.9375 3.9375,8.44263471 3.9375,14 C3.9375,19.5573653 8.44263471,24.0625 14,24.0625 C19.5573653,24.0625 24.0625,19.5573653 24.0625,14 C24.0625,8.44263471 19.5573653,3.9375 14,3.9375 Z M18.317447,8.91076112 L18.3862477,8.96661573 L18.3862477,8.96661573 L19.0068311,9.5834638 C19.1782001,9.7538018 19.1790364,10.03081 19.0086989,10.2021796 L15.2337382,14.000005 L19.0086839,17.7978145 C19.1577296,17.9477627 19.1757199,18.1785908 19.0630846,18.3480678 L19.0068157,18.41653 L19.0068157,18.41653 L18.3862314,19.0333775 C18.2148618,19.203715 17.9378535,19.2028786 17.7675156,19.0315093 L14.00002,15.241195 L10.232526,19.0315093 C10.0834806,19.1814577 9.85276538,19.2008416 9.68261124,19.0892317 L9.61381053,19.0333773 L9.61381053,19.0333773 L8.99322583,18.4165285 C8.84327757,18.267483 8.82389374,18.0367677 8.93550373,17.8666136 L8.9913579,17.7978129 L8.9913579,17.7978129 L12.7663035,14.000005 L8.99134235,10.2021788 C8.84229682,10.0522305 8.82430649,9.82140245 8.9369419,9.65192539 L8.99321049,9.58346322 L8.99321049,9.58346322 L9.61379457,8.96661547 C9.76374284,8.81756995 9.99457094,8.79957963 10.164048,8.91221504 L10.2325102,8.96848364 L10.2325102,8.96848364 L14.0000209,12.7588151 L17.7675324,8.96848361 C17.9165777,8.81853511 18.1472929,8.79915119 18.317447,8.91076112 Z" id="形状结合" fill="#507AFD" mask="url(#mask-2)"></path>
+                    </g>
+                </g>
+            </g>
+        </g>
+    </g>
+</svg>
\ No newline at end of file
diff --git a/src/assets/icons/task-icon.svg b/src/assets/icons/task-icon.svg
new file mode 100644
index 0000000..5420008
--- /dev/null
+++ b/src/assets/icons/task-icon.svg
@@ -0,0 +1,38 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="16px" height="16px" viewBox="0 0 16 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <title>任务审批</title>
+    <defs>
+        <rect id="path-1" x="0" y="0" width="16" height="16"></rect>
+        <path d="M1.23062252,0.07675 C0.311122521,0.3595 -0.205377479,1.33425 0.0773725213,2.254 L0.0773725213,2.254 L0.814122521,4.65125 L2.65962252,4.65125 L3.40287252,2.25225 C3.45437252,2.08575 3.48037252,1.9125 3.48037252,1.738 L3.48037252,1.738 C3.48037252,0.778 2.70237252,0 1.74262252,0 L1.74262252,0 C1.56912252,0 1.39637252,0.026 1.23062252,0.07675 L1.23062252,0.07675 Z" id="path-3"></path>
+    </defs>
+    <g id="搜索/首次登录弹框" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="index_1.0搜索_默认" transform="translate(-336.000000, -285.000000)">
+            <g id="编组-19" transform="translate(320.000000, 130.000000)">
+                <g id="编组-29" transform="translate(0.000000, 147.000000)">
+                    <g id="任务审批" transform="translate(16.000000, 8.000000)">
+                        <mask id="mask-2" fill="white">
+                            <use xlink:href="#path-1"></use>
+                        </mask>
+                        <g id="蒙版"></g>
+                        <g id="编组-2" mask="url(#mask-2)">
+                            <g transform="translate(2.504695, 1.728956)">
+                                <path d="M10.98479,12.0210444 C10.98479,12.2971868 10.7609324,12.5210444 10.48479,12.5210444 L0.532401515,12.5210444 L0.522,12.52 L0.510215659,12.5201602 C0.234073284,12.5201602 0.0102156588,12.2963026 0.0102156588,12.0201602 L0.00941441329,0.847060864 C0.00323761107,0.815662374 4.06696373e-18,0.783209279 0,0.75 L0,0.5 C-3.38176876e-17,0.223857625 0.223857625,5.07265313e-17 0.5,0 L4.75,0 C4.88807119,-2.53632657e-17 5,0.111928813 5,0.25 L5,1 C5,1.13807119 4.88807119,1.25 4.75,1.25 L1.26,1.25 L1.26,11.271 L9.734,11.271 L9.73449602,7.26969488 C9.73449602,7.13162369 9.84642483,7.01969488 9.98449602,7.01969488 L10.734496,7.01969488 C10.8725672,7.01969488 10.984496,7.13162369 10.984496,7.26969488 L10.98479,12.0210444 Z" id="形状结合" fill="#666666" transform="translate(5.492395, 6.260522) scale(1, -1) translate(-5.492395, -6.260522) "></path>
+                                <path d="M7.84134673,4.52104444 C7.97941791,4.52104444 8.09134673,4.63297325 8.09134673,4.77104444 L8.09134673,5.52104444 C8.09134673,5.65911562 7.97941791,5.77104444 7.84134673,5.77104444 L2.24530486,5.77104444 C2.10723367,5.77104444 1.99530486,5.65911562 1.99530486,5.52104444 L1.99530486,4.77104444 C1.99530486,4.63297325 2.10723367,4.52104444 2.24530486,4.52104444 L7.84134673,4.52104444 Z M7.86057251,2.27715875 C7.99864369,2.27715875 8.11057251,2.38908757 8.11057251,2.52715875 L8.11057251,3.27715875 C8.11057251,3.41522994 7.99864369,3.52715875 7.86057251,3.52715875 L4.07979829,3.52715875 C3.9417271,3.52715875 3.82979829,3.41522994 3.82979829,3.27715875 L3.82979829,2.52715875 C3.82979829,2.38908757 3.9417271,2.27715875 4.07979829,2.27715875 L7.86057251,2.27715875 Z" id="形状结合" fill="#666666" transform="translate(5.052939, 4.024102) rotate(-180.000000) translate(-5.052939, -4.024102) "></path>
+                                <g id="印章" stroke-width="1" fill="none" transform="translate(5.673315, 5.970411)">
+                                    <path d="M5.57,3.67563355 C5.84614237,3.67563355 6.07,3.89949117 6.07,4.17563355 L6.06594752,4.23229356 C6.06900137,4.25463739 6.07057905,4.27745123 6.07057905,4.30063355 L6.07057905,6.00221104 L6.06955159,6.03460166 C6.06984953,6.04168763 6.07,6.04881174 6.07,6.05597098 C6.07,6.33211336 5.84614237,6.55597098 5.57,6.55597098 L0.5,6.55597098 C0.223857625,6.55597098 3.38176876e-17,6.33211336 0,6.05597098 L0.000739837533,6.02964465 C0.000248730695,6.02056244 1.12725625e-18,6.01141579 0,6.00221104 L0,4.30063355 L0.00394400362,4.23873718 C0.00134118979,4.21806893 2.61759879e-18,4.19700786 0,4.17563355 C-3.38176876e-17,3.89949117 0.223857625,3.67563355 0.5,3.67563355 L5.57,3.67563355 Z M1,5.55563355 L5.07,5.55563355 L5.07,4.67563355 L1,4.67563355 L1,5.55563355 Z" id="形状结合" fill="#666666"></path>
+                                    <g id="编组" transform="translate(1.295103, 0.000000)">
+                                        <mask id="mask-4" fill="white">
+                                            <use xlink:href="#path-3"></use>
+                                        </mask>
+                                        <g id="Clip-2"></g>
+                                        <path d="M1.55297252,3.65125 L1.92247252,3.65125 L2.44747252,1.9565 C2.46947252,1.88575 2.48047252,1.81225 2.48047252,1.738 C2.48047252,1.331 2.14947252,1 1.74247252,1 C1.66847252,1 1.59497252,1.011 1.52397252,1.033 C1.13347252,1.153 0.912972521,1.569 1.03322252,1.96025 L1.55297252,3.65125 Z M3.39672252,5.65125 L0.0754725213,5.65125 L-0.878527479,2.54775 C-1.32252748,1.1025 -0.508277479,-0.43475 0.936722521,-0.879 C1.19872252,-0.95925 1.46972252,-1 1.74247252,-1 C3.25222252,-1 4.48047252,0.22825 4.48047252,1.738 C4.48047252,2.01275 4.43922252,2.28525 4.35797252,2.54775 L3.39672252,5.65125 Z" id="Fill-1" fill="#666666" mask="url(#mask-4)"></path>
+                                    </g>
+                                </g>
+                            </g>
+                        </g>
+                    </g>
+                </g>
+            </g>
+        </g>
+    </g>
+</svg>
\ No newline at end of file
diff --git a/src/assets/images/IP.png b/src/assets/images/IP.png
new file mode 100644
index 0000000..aa4ab0c
Binary files /dev/null and b/src/assets/images/IP.png differ
diff --git a/src/assets/images/approval_modal_bg.png b/src/assets/images/approval_modal_bg.png
new file mode 100644
index 0000000..689cc8d
Binary files /dev/null and b/src/assets/images/approval_modal_bg.png differ
diff --git a/src/components/Search/Search.vue b/src/components/Search/Search.vue
new file mode 100644
index 0000000..9a620cc
--- /dev/null
+++ b/src/components/Search/Search.vue
@@ -0,0 +1,129 @@
+<script setup lang="ts">
+import { ref } from "vue";
+
+const value = ref("");
+const showList = ref(false);
+const handlerShowList = () => (showList.value = true);
+const mock_list = [
+  {
+    title: "任务审批管理",
+    data: [
+      {
+        title: "某某企业名称占位-1月拜访计划计划",
+      },
+      {
+        title: "某某企业名称占位符占位占位-12月拜访计划计划",
+      },
+      {
+        title: "某某企业-某某事业部-第四季度拜访计划计划",
+      },
+    ],
+  },
+  {
+    title: "任务终审管理",
+    data: [
+      {
+        title: "某某企业名称占位-1月拜访计划计划",
+      },
+      {
+        title: "某某企业名称占位符占位占位-12月拜访计划计划",
+      },
+      {
+        title: "某某企业名称占位符占位占位-12月拜访计划计划",
+      },
+    ],
+  },
+];
+</script>
+
+
+<template>
+  <div class="input_wrap">
+    <div class="ip_box">
+        <img src="../../assets/images/IP.png" alt="">
+      </div>
+    <div class="input_box">
+      <n-input
+        v-model:value="value"
+        placeholder="搜索任务ID、任务名称、提报人、拜访终端"
+        type="text"
+        @mousedown="handlerShowList"
+      >
+        <template #prefix>
+          <SvgIcon name="magnifying-1" size="18"></SvgIcon>
+        </template>
+      </n-input>
+    </div>
+    <div class="list_box" v-show="showList">
+      <div
+        class="list_classfiy_item"
+        v-for="(item, index) in mock_list"
+        :key="index"
+        :style="(index == mock_list.length-1)?'':'border-bottom:1px solid #e4e4e4'"
+      >
+        <div class="list_title">{{ item.title }}</div>
+        <div class="list_item" v-for="(sitem,sindex) in item.data" :key="sindex">
+          <SvgIcon name="task-icon" size="16"></SvgIcon>
+          <a style="margin-left: 5px">{{ sitem.title }}</a>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<style lang="less" scoped>
+.input_wrap {
+  width: 60%;
+  position: absolute;
+  top: 20%;
+  left: 20%;
+  .ip_box{
+    z-index: 0;
+    position: relative;
+    left: calc(50% - 40px);
+    top: 30px;
+    img{
+      width: 80px;
+      height: 80px;
+    }
+  }
+
+  .input_box {
+    z-index: 1;
+    background: #ffffff;
+    border: 1px solid #507afd;
+    border-radius: 8px;
+    overflow: hidden;
+    box-shadow: 0px 12px 12px 0px rgba(80, 122, 253, 0.15),
+      0px 0px 0px 0.5px #d4e3fc;
+  }
+  .list_box {
+    opacity: 0.8;
+    background: #fefefe;
+    border: 1px dashed #f4f4f4;
+    border-radius: 8px;
+    box-shadow: 0px 12px 12px 0px rgba(80, 122, 253, 0.15);
+    margin-top: 15px;
+    padding: 8px 16px;
+    .list_classfiy_item {
+      .list_title {
+        font-size: 12px;
+        font-family: PingFang SC, PingFang SC-Regular;
+        font-weight: Regular;
+        color: #999999;
+        line-height: 17px;
+        margin: 10px 0 10px 5px;
+      }
+      .list_item {
+        display: flex;
+        flex-flow: row nowrap;
+        align-items: center;
+        margin-bottom: 10px;
+      }
+    }
+  }
+}
+:deep(.n-input .n-input-wrapper) {
+  margin: 8px;
+}
+</style>
\ No newline at end of file
diff --git a/src/layout/components/Header/SearchModal.vue b/src/layout/components/Header/SearchModal.vue
new file mode 100644
index 0000000..2be630f
--- /dev/null
+++ b/src/layout/components/Header/SearchModal.vue
@@ -0,0 +1,22 @@
+<template>
+  <div>
+    <n-modal v-model:show="show" :mask="false" transform-origin="center">
+      <Search />
+    </n-modal>
+  </div>
+</template>
+<script setup>
+import Search from "@/components/Search/Search.vue";
+import { ref } from "vue";
+const show = ref(false);
+function showModal() {
+  show.value = true;
+}
+
+defineExpose({
+  showModal,
+});
+</script>
+
+<style scoped lang="less">
+</style>
\ No newline at end of file
diff --git a/src/layout/components/Header/index.vue b/src/layout/components/Header/index.vue
index fa850ff..8797ee5 100644
--- a/src/layout/components/Header/index.vue
+++ b/src/layout/components/Header/index.vue
@@ -1,17 +1,24 @@
 <script lang="ts">
-import { defineComponent, reactive, ref, toRefs, unref, watch } from 'vue'
-import { useRoute, useRouter } from 'vue-router'
-import { useDialog, useMessage } from 'naive-ui'
-import UserSettings from './UserSettings.vue'
-import QuillModal from './QuillModal.vue'
-import ShortcutModal from './ShortcutModal.vue'
-import RecycleModal from './RecycleModal.vue'
-import { useUser } from '@/store/modules/user'
-import { getImgUrl } from '@/utils/urlUtils'
+import { useUser } from "@/store/modules/user";
+import { getImgUrl } from "@/utils/urlUtils";
+import { useDialog, useMessage } from "naive-ui";
+import { defineComponent, reactive, ref, toRefs, unref, watch } from "vue";
+import { useRoute, useRouter } from "vue-router";
+import QuillModal from "./QuillModal.vue";
+import RecycleModal from "./RecycleModal.vue";
+import SearchModal from "./SearchModal.vue";
+import ShortcutModal from "./ShortcutModal.vue";
+import UserSettings from "./UserSettings.vue";
 
 export default defineComponent({
-  name: 'PageHeader',
-  components: { UserSettings, QuillModal, ShortcutModal, RecycleModal },
+  name: "PageHeader",
+  components: {
+    UserSettings,
+    QuillModal,
+    ShortcutModal,
+    RecycleModal,
+    SearchModal,
+  },
   props: {
     collapsed: {
       type: Boolean,
@@ -20,102 +27,108 @@ export default defineComponent({
       type: Boolean,
     },
   },
-  emits: ['update:collapsed'],
+  emits: ["update:collapsed"],
   setup() {
-    const message = useMessage()
-    const dialog = useDialog()
+    const message = useMessage();
+    const dialog = useDialog();
 
-    const userStore = useUser()
-    const useInfo = userStore.getUserInfo
+    const userStore = useUser();
+    const useInfo = userStore.getUserInfo;
 
-    const name = ''
+    const name = "";
 
     const state = reactive({
-      username: name ?? '',
-      fullscreenIcon: 'FullscreenOutlined',
-    })
+      username: name ?? "",
+      fullscreenIcon: "FullscreenOutlined",
+    });
 
-    const router = useRouter()
-    const route = useRoute()
-    const routename = ref(route.meta.title)
+    const router = useRouter();
+    const route = useRoute();
+    const routename = ref(route.meta.title);
 
     watch(
       () => route.fullPath,
       () => {
-        routename.value = route.meta.title
-      },
-    )
+        routename.value = route.meta.title;
+      }
+    );
 
     const dropdownSelect = (key) => {
-      router.push({ name: key })
-    }
+      router.push({ name: key });
+    };
 
     // 退出登录
     const doLogout = () => {
       dialog.info({
-        title: '提示',
-        content: '您确定要退出登录吗',
-        positiveText: '确定',
-        negativeText: '取消',
+        title: "提示",
+        content: "您确定要退出登录吗",
+        positiveText: "确定",
+        negativeText: "取消",
         onPositiveClick: () => {
           userStore.logout().then(() => {
-            message.success('成功退出登录')
+            message.success("成功退出登录");
             router
               .replace({
-                name: 'Login',
+                name: "Login",
                 query: {
                   redirect: route.fullPath,
                 },
               })
-              .finally(() => location.reload())
-          })
+              .finally(() => location.reload());
+          });
         },
-        onNegativeClick: () => { },
-      })
-    }
+        onNegativeClick: () => {},
+      });
+    };
 
-    const quillModalRef = ref(null)
-    const shortcutModal = ref(null)
-    const recycleModalRef = ref(null)
+    const quillModalRef = ref(null);
+    const shortcutModal = ref(null);
+    const recycleModalRef = ref(null);
+    const SearchModalRef = ref(null);
 
     function quillHandler() {
-      const modal = unref(quillModalRef)! as any
-      modal.showModal()
+      const modal = unref(quillModalRef)! as any;
+      modal.showModal();
     }
 
     function shortcutHandler() {
-      const modal = unref(shortcutModal)! as any
-      modal.showModal()
+      const modal = unref(shortcutModal)! as any;
+      modal.showModal();
     }
 
     function recycleHandler() {
-      const modal = unref(recycleModalRef)! as any
-      modal.showModal()
+      const modal = unref(recycleModalRef)! as any;
+      modal.showModal();
+    }
+
+    function searchHandler() {
+      const modal = unref(SearchModalRef)! as any;
+      modal.showModal();
     }
 
     // 图标列表
     const iconList = [
       {
-        icon: 'magnifying-1',
-        handle: quillHandler,
+        icon: "magnifying-1",
+        handle: searchHandler,
       },
       {
-        icon: 'shortcut-keys',
+        icon: "shortcut-keys",
         handle: shortcutHandler,
       },
       {
-        icon: 'suspicious-folder',
+        icon: "suspicious-folder",
         handle: recycleHandler,
       },
       {
-        icon: 'memo',
+        icon: "memo",
         handle: quillHandler,
       },
       {
-        icon: 'newmessage',
+        icon: "newmessage",
         handle: shortcutHandler,
       },
-    ]
+    ];
 
     return {
       ...toRefs(state),
@@ -126,14 +139,16 @@ export default defineComponent({
       quillModalRef,
       shortcutModal,
       recycleModalRef,
+      SearchModalRef,
+      searchHandler,
       quillHandler,
       shortcutHandler,
       recycleHandler,
       useInfo,
       getImgUrl,
-    }
+    };
   },
-})
+});
 </script>
 
 <template>
@@ -151,7 +166,11 @@ export default defineComponent({
       <div>当前位置：{{ routename }}</div>
     </div>
     <div class="layout-header-right">
-      <div v-for="item in iconList" :key="item.icon" class="layout-header-trigger layout-header-trigger-min">
+      <div
+        v-for="item in iconList"
+        :key="item.icon"
+        class="layout-header-trigger layout-header-trigger-min"
+      >
         <div class="back" @click="item.handle">
           <SvgIcon :name="item.icon" size="18" />
         </div>
@@ -167,6 +186,7 @@ export default defineComponent({
   <RecycleModal ref="recycleModalRef" />
   <QuillModal ref="quillModalRef" />
   <ShortcutModal ref="shortcutModal" />
+  <SearchModal ref="SearchModalRef" />
 </template>
 
 <style lang="less" scoped>
@@ -228,7 +248,7 @@ export default defineComponent({
       height: 64px;
     }
 
-    >* {
+    > * {
       cursor: pointer;
     }
   }
@@ -267,7 +287,9 @@ export default defineComponent({
   }
 
   .layout-header-left {
-    ::v-deep(.n-breadcrumb .n-breadcrumb-item:last-child .n-breadcrumb-item__link) {
+    ::v-deep(
+        .n-breadcrumb .n-breadcrumb-item:last-child .n-breadcrumb-item__link
+      ) {
       color: #515a6e;
     }
   }
diff --git a/src/views/worksheet/modal/ApprovalModal.vue b/src/views/worksheet/modal/ApprovalModal.vue
new file mode 100644
index 0000000..8e8a336
--- /dev/null
+++ b/src/views/worksheet/modal/ApprovalModal.vue
@@ -0,0 +1,191 @@
+<script lang="ts" setup>
+import { ref } from "vue";
+
+const emit = defineEmits<{
+  (e: "reject", params: any);
+  (e: "viewrepeat");
+}>();
+
+const cardStyle = {
+  width: "450px",
+  "--n-padding-bottom": "10px",
+  "--n-padding-left": "0px",
+};
+
+const show = ref(false);
+
+function showModal() {
+  show.value = true;
+}
+
+function closeModal() {
+  show.value = false;
+}
+
+async function reject() {
+  emit("reject", { a: "todo" });
+  closeModal();
+}
+
+async function viewRepeat(e: MouseEvent) {
+  emit("viewrepeat");
+  e.preventDefault();
+  closeModal();
+}
+
+defineExpose({
+  showModal,
+});
+</script>
+
+<template>
+  <n-modal v-model:show="show" transform-origin="center" class="modal_wrap">
+    <div class="wrapper">
+      <!-- <div class="closed"></div> -->
+      <div class="wrapper-hearder">
+        <div class="wrapper-title">智能AI审批工具</div>
+        <div class="wrapper-mark">某某有限公司-某某事业部-张小凡</div>
+      </div>
+      <div class="wrapper-content">
+        <n-scrollbar style="height: 200px">
+          <div v-for="i in 1" :key="i" class="item">
+            <div class="imgwrapper" />
+            <div class="content">
+              <div class="task_id">任务ID：YPW34567890-2995</div>
+              <div class="tag_box">
+                <div class="tag_item">基线任务</div>
+                <div class="tag_item">中日友好医院</div>
+              </div>
+              <div class="time_box">2023-09-17 13:09:10</div>
+            </div>
+          </div>
+        </n-scrollbar>
+        <div class="mark_text">
+          智能识别：图片与拜访终端名称不相符，建议审批不通过，或
+          移至可疑收藏夹！
+        </div>
+        <div class="footer">
+          <SvgIcon
+            style="cursor: pointer"
+            name="r1"
+            width="162"
+            height="54"
+            @click="reject"
+          />
+          <SvgIcon
+            style="cursor: pointer"
+            name="r4"
+            width="162"
+            height="54"
+            @click="viewRepeat"
+          />
+        </div>
+      </div>
+    </div>
+  </n-modal>
+</template>
+
+<style lang="less" scoped>
+.modal_wrap {
+  background-image: url(../../../assets/images/approval_modal_bg.png);
+  background-repeat: no-repeat;
+  background-size: 100%;
+  width: 700px;
+  height: 500px;
+}
+.wrapper {
+  position: absolute;
+  left: calc(50% - 350px);
+  .wrapper-hearder {
+    margin-top: 110px;
+    .wrapper-title {
+      text-align: center;
+      font-size: 16px;
+      font-family: PingFang SC, PingFang SC-Semibold;
+      font-weight: Semibold;
+      text-align: center;
+      color: #333333;
+      line-height: 32px;
+    }
+    .wrapper-mark {
+      text-align: center;
+      font-size: 13px;
+      font-family: HarmonyOS Sans SC, HarmonyOS Sans SC-Regular;
+      font-weight: Regular;
+      text-align: center;
+      color: #666666;
+      line-height: 18px;
+    }
+  }
+  .wrapper-content {
+    flex: 1;
+    border-radius: 8px;
+    margin: 35px 60px 35px 120px;
+    .item{
+      display: flex;
+      flex-flow: row nowrap;
+      align-items: center;
+      margin: 20px 0;
+    }
+
+    .imgwrapper {
+      width: 200px;
+      height: 120px;
+      margin-right: 20px;
+      border-radius: 8px;
+      background-image: url("../../../assets/images/test.png");
+      background-repeat: no-repeat;
+      background-size: cover;
+    }
+    .content {
+      .task_id {
+        font-size: 14px;
+        font-family: PingFang SC, PingFang SC-Regular;
+        font-weight: Regular;
+        text-align: left;
+        color: #333333;
+        line-height: 20px;
+      }
+      .tag_box {
+        display: flex;
+        flex-flow: row nowrap;
+        margin: 8px 0;
+        .tag_item {
+          background: rgba(80, 122, 253, 0.1);
+          border-radius: 2px;
+          font-size: 12px;
+          font-family: PingFang SC, PingFang SC-Regular;
+          font-weight: Regular;
+          text-align: left;
+          color: #507afd;
+          line-height: 16px;
+          margin-right: 10px;
+        }
+      }
+      .time_box {
+        font-size: 14px;
+        font-family: PingFang SC, PingFang SC-Regular;
+        font-weight: Regular;
+        text-align: left;
+        color: #333333;
+        line-height: 20px;
+      }
+    }
+    .mark_text {
+      font-size: 13px;
+      font-family: PingFang SC, PingFang SC-Regular;
+      font-weight: Regular;
+      text-align: left;
+      color: #666666;
+      line-height: 16px;
+    }
+    .footer{
+      display: flex;
+      flex-flow: row nowrap;
+      align-items: center;
+      justify-content: center;
+      margin: 20px 30px 0 0;
+    }
+  }
+}
+</style>