diff --git a/src/components/drawers/AddCase.vue b/src/components/drawers/AddCase.vue
new file mode 100644
index 00000000..339358e1
--- /dev/null
+++ b/src/components/drawers/AddCase.vue
@@ -0,0 +1,357 @@
+<template>
+    <a-drawer
+      :visible="addcaseVisible"
+      class="drawerStyle addcaseDrawer"
+      width="80%"
+      title="添加在线"
+      placement="right"
+      @after-visible-change="afterVisibleChange"
+    >
+      <div class="drawerMain">
+        <div class="header">
+          <div class="headerTitle">添加案例</div>
+          <img
+            style="width: 29px; height: 29px; cursor: pointer"
+            src="../../assets/images/basicinfo/close.png"
+            @click="closeDrawer"
+          />
+        </div>
+        <div class="contentMain">
+          <div class="main_items">
+            <div class="mi_ipts">
+              <div class="mii_ipt">
+                <div class="ipt_name">案例标题：</div>
+                <div class="fi_input">
+                  <a-input
+                    v-model:value="value"
+                    style="width: 240px; height: 40px; border-radius: 8px"
+                    placeholder="请输入项目名称"
+                  />
+                </div>
+              </div>
+            </div>
+            <div class="mi_btns">
+              <div class="btn btn1">
+                <div class="search"></div>
+                <div class="btnText">搜索</div>
+              </div>
+              <div class="btn btn2">
+                <div class="search"></div>
+                <div class="btnText">重置</div>
+              </div>
+            </div>
+          </div>
+  
+          <div class="main_table">
+            <a-table
+              class="ant-table-striped"
+              :row-class-name="
+                (_record, index) => (index % 2 === 1 ? 'table-striped' : null)
+              "
+              :row-selection="rowSelection"
+              :columns="columns1"
+              :data-source="tableData1"
+              :loading="tableDataTotal === -1 ? true : false"
+              :pagination="{
+                showSizeChanger: true,
+                showQuickJumper: true,
+                hideOnSinglePage: true,
+                pageSizeOptions: [],
+                pageSize: pageSize,
+                current: currentPage,
+                total: tableDataTotal,
+                onChange: (page, pageSize) => {
+                  currentPage = page;
+                  // console.log('page', page)
+                  // 加翻页查找代码
+                  // 	this.setState({
+                  // 		currentPage: page,
+                  // 	}, () => {
+                  // 		this.getMilitaryDeployment()
+                  // 	})
+                },
+              }"
+            />
+          </div>
+        </div>
+        <div class="main_btns">
+          <button class="btn1">取消</button>
+          <button class="btn2">确定</button>
+        </div>
+      </div>
+    </a-drawer>
+  </template>
+  <script>
+  import { reactive, toRefs, ref } from "vue";
+  const columns1 = [
+    {
+      title: "案例标题",
+      width: "35%",
+      dataIndex: "title",
+      key: "num",
+      align: "center",
+    ellipsis: true,
+    },
+    {
+      title: "作者",
+      width: "25%",
+      dataIndex: "name",
+      key: "name",
+      align: "center",
+    },
+    {
+      title: "导入时间",
+      width: "40%",
+      dataIndex: "time",
+      key: "time",
+      align: "center",
+    },
+  ];
+  const rowSelection = ref({
+    checkStrictly: false,
+    onChange: (selectedRowKeys, selectedRows) => {
+      console.log(
+        `selectedRowKeys: ${selectedRowKeys}`,
+        "selectedRows: ",
+        selectedRows
+      );
+    },
+    onSelect: (record, selected, selectedRows) => {
+      console.log(record, selected, selectedRows);
+    },
+    onSelectAll: (selected, selectedRows, changeRows) => {
+      console.log(selected, selectedRows, changeRows);
+    },
+  });
+  export default {
+    name: "AddCase",
+    props: {
+      addcaseVisible: {
+        type: Boolean,
+        default: false,
+      },
+    },
+    setup(props, ctx) {
+      const state = reactive({
+        tableData1: [
+          {
+            key: "1",
+            title: "基于BOE显示PNL工厂的工序平1111111111111111111122222333335555",
+            name: "李玉冰",
+            time: "2022-10-31  23:12:00",
+          },
+          {
+            key: "2",
+            title: "OEM 企业一线用工之路探索",
+            name: "李玉冰",
+            time: "2022-10-31  23:12:00",
+          },
+          {
+            key: "3",
+            title: " 销售数字化转型的痛苦与探索",
+            name: "李玉冰",
+            time: "2022-10-31  23:12:00",
+          },
+          {
+            key: "4",
+            title: "疫情突发，技能人才招聘的相关…",
+            name: "李玉冰",
+            time: "2022-10-31  23:12:00",
+          },
+          {
+            key: "5",
+            title: "设计效率提升之工具化",
+            name: "李玉冰",
+            time: "2022-10-31  23:12:00",
+          },
+          {
+            key: "6",
+            title: "疫情突发，技能人才招聘的相关…",
+            name: "李玉冰",
+            time: "2022-10-31  23:12:00",
+          },
+          {
+            key: "7",
+            title: "基于BOE显示PNL工厂的工序平…",
+            name: "李玉冰",
+            time: "2022-10-31  23:12:00",
+          },
+          {
+            key: "8",
+            title: "基于BOE显示PNL工厂的工序平…",
+            name: "李玉冰",
+            time: "2022-10-31  23:12:00",
+          },
+          {
+            key: "9",
+            title: "基于BOE显示PNL工厂的工序平…",
+            name: "李玉冰",
+            time: "2022-10-31  23:12:00",
+          },
+        ],
+        currentPage: 1,
+        tableDataTotal: 100,
+        pageSize: 10,
+        value:'',
+      });
+      const closeDrawer = () => {
+        ctx.emit("update:addcaseVisible", false);
+      };
+      const afterVisibleChange = (bool) => {
+        console.log("state", bool);
+      };
+      const showDrawerSelFacet = () => {
+        state.addcasevisible = true;
+      };
+      return {
+        ...toRefs(state),
+        showDrawerSelFacet,
+        afterVisibleChange,
+        closeDrawer,
+        columns1,
+        rowSelection,
+        // change,
+      };
+    },
+  };
+  </script>
+  <style lang="scss">
+  .ant-table-striped :deep(.table-striped) td {
+    background-color: #fafafa !important;
+  }
+  
+  .addcaseDrawer {
+    .drawerMain {
+      .header {
+        height: 73px;
+        border-bottom: 1px solid #e8e8e8;
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        .headerTitle {
+          font-size: 18px;
+          font-weight: 600;
+          color: #333333;
+          line-height: 25px;
+          margin-left: 24px;
+        }
+      }
+      .contentMain {
+        .main_items {
+          display: flex;
+          justify-content: space-between;
+          margin-bottom: 12px;
+          flex-wrap: wrap;
+          .mi_ipts {
+            display: flex;
+            margin-bottom: 20px;
+            .mii_ipt {
+              display: flex;
+              align-items: center;
+              margin-right: 24px;
+              .ipt_name {
+                white-space: nowrap;
+              }
+            }
+          }
+          .mi_btns {
+            display: flex;
+            margin-left: 38px;
+            margin-bottom: 20px;
+            cursor: pointer;
+            .btn {
+              padding: 0px 26px 0px 26px;
+              height: 38px;
+              border-radius: 8px;
+              border: 1px solid rgba(64, 158, 255, 1);
+              display: flex;
+              align-items: center;
+              justify-content: center;
+              margin-left: 14px;
+              flex-shrink: 0;
+              .search {
+                background-size: 100%;
+              }
+              .btnText {
+                font-size: 14px;
+                font-weight: 400;
+                line-height: 36px;
+                margin-left: 5px;
+              }
+            }
+            .btn1 {
+              background: rgb(64, 158, 255);
+              .search {
+                width: 15px;
+                height: 17px;
+                background-image: url("@/assets/images/coursewareManage/search0.png");
+              }
+              .btnText {
+                color: rgb(255, 255, 255);
+              }
+            }
+            .btn2 {
+              background: rgb(255, 255, 255);
+              .search {
+                width: 15px;
+                height: 17px;
+                background-image: url("@/assets/images/coursewareManage/reset1.png");
+              }
+              .btnText {
+                color: rgb(64, 158, 255);
+              }
+            }
+            .btn1:hover {
+              background: rgb(255, 255, 255);
+              .search {
+                background-image: url("@/assets/images/courseManage/search1.png");
+              }
+              .btnText {
+                color: #388be1;
+              }
+            }
+            .btn2:hover {
+              background: rgba(64, 158, 255, 1);
+              .search {
+                background-image: url("@/assets/images/courseManage/reset0.png");
+              }
+              .btnText {
+                color: #ffffff;
+              }
+            }
+          }
+        }
+      }
+  
+      .main_btns {
+        height: 72px;
+        width: 100%;
+        bottom: 0;
+        left: 0;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        box-shadow: 0px 1px 35px 0px rgba(118, 136, 166, 0.16);
+        .btn1 {
+          width: 100px;
+          height: 40px;
+          border: 1px solid #4ea6ff;
+          border-radius: 8px;
+          color: #4ea6ff;
+          background-color: #fff;
+          cursor: pointer;
+        }
+        .btn2 {
+          cursor: pointer;
+          width: 100px;
+          height: 40px;
+          background: #4ea6ff;
+          border-radius: 8px;
+          border: 0;
+          margin-left: 15px;
+          color: #fff;
+        }
+      }
+    }
+  }
+  </style>
\ No newline at end of file
diff --git a/src/components/drawers/SelFacet.vue b/src/components/drawers/SelFacet.vue
index e3953cac..d6d6799f 100644
--- a/src/components/drawers/SelFacet.vue
+++ b/src/components/drawers/SelFacet.vue
@@ -23,7 +23,7 @@
               <div class="ipt_name">课程编号：</div>
               <div class="fi_input">
                 <a-input
-                  v-model:value="value1"
+                  v-model:value="value"
                   style="width: 240px; height: 40px; border-radius: 8px"
                   placeholder="请输入项目名称"
                 />
@@ -258,6 +258,7 @@ export default {
       currentPage: 1,
       tableDataTotal: 100,
       pageSize: 10,
+      value:'',
     });
     const closeDrawer = () => {
       ctx.emit("update:selfacetVisible", false);
diff --git a/src/views/projectcenter/TaskAdd.vue b/src/views/projectcenter/TaskAdd.vue
index 1b16db1f..a3fb7a8b 100644
--- a/src/views/projectcenter/TaskAdd.vue
+++ b/src/views/projectcenter/TaskAdd.vue
@@ -69,8 +69,8 @@
         </div>
       </div>
       <div class="mid">
-        <div class="item">
-          <div class="itcon" @click="showDrawerOnline">
+        <div class="item" @click="showDrawerOnline">
+          <div class="itcon" >
             <div class="img">
               <img src="../../assets/images/leveladd/zai.png" />
             </div>
@@ -83,8 +83,8 @@
           <!-- 添加在线侧弹窗 -->
           <div class="lin"></div>
         </div>
-        <div class="item">
-          <div class="itcon" @click="showDrawerFaceteach">
+        <div class="item" @click="showDrawerFaceteach">
+          <div class="itcon" >
             <div class="img">
               <img src="../../assets/images/leveladd/mian.png" />
             </div>
@@ -97,13 +97,18 @@
           <!-- 添加面授侧弹窗 -->
           <div class="lin"></div>
         </div>
-        <div class="item">
+        <div class="item" @click="showDrawerAddCase">
           <div class="itcon">
             <div class="img">
               <img src="../../assets/images/leveladd/an.png" />
             </div>
             <div class="text">案例</div>
           </div>
+          <!-- 添加案例侧弹窗 -->
+          <div>
+            <add-case v-model:addcaseVisible="addcasevisible" />
+          </div>
+          <!-- 添加案例侧弹窗 -->
           <div class="lin"></div>
         </div>
         <div class="item">
@@ -363,6 +368,7 @@ import { reactive, toRefs, onMounted, onUnmounted } from "vue";
 import AddOnline from "../../components/drawers/AddOnline.vue";
 import EditOnline from "../../components/drawers/EditOnline.vue";
 import AddFaceteach from "../../components/drawers/AddFaceteach.vue";
+import AddCase from "../../components/drawers/AddCase.vue";
 const drawercolumns = [
   {
     title: "项目名称",
@@ -407,6 +413,7 @@ export default {
     AddOnline,
     EditOnline,
     AddFaceteach,
+    AddCase,
   },
   setup() {
     const state = reactive({
@@ -646,6 +653,7 @@ export default {
       pageSize: 10,
       addonlinevisible: false,
       addfaceteachvisible: false,
+      addcasevisible:false,
       editonlinevisible: false,
       stage: false,
       selectedRowKeys: [],
@@ -812,6 +820,9 @@ export default {
     const showDrawerFaceteach = () => {
       state.addfaceteachvisible = true;
     };
+    const showDrawerAddCase = () => {
+      state.addcasevisible = true;
+    };
     return {
       ...toRefs(state),
       selectProjectName,
@@ -825,6 +836,7 @@ export default {
       onSelectChange,
       showDrawerOnline,
       showDrawerFaceteach,
+      showDrawerAddCase,
     };
   },
 };