From ef02ac66de3566e8c45bbd839ca759b31dce55f7 Mon Sep 17 00:00:00 2001
From: dongwug <guoys@dongwu-inc.com>
Date: Tue, 18 Oct 2022 18:32:15 +0800
Subject: [PATCH] =?UTF-8?q?feat=EF=BC=9A=E6=96=B0=E5=A2=9E=E6=B7=BB?=
 =?UTF-8?q?=E5=8A=A0=E9=9D=A2=E6=8E=88=E5=BC=B9=E7=AA=97?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/drawers/AddFaceteach.vue | 498 ++++++++------
 src/components/drawers/AddOnline.vue    | 837 +++++++++++------------
 src/components/drawers/EditOnline.vue   | 842 ++++++++++++------------
 src/views/projectcenter/TaskAdd.vue     |  19 +-
 4 files changed, 1148 insertions(+), 1048 deletions(-)

diff --git a/src/components/drawers/AddFaceteach.vue b/src/components/drawers/AddFaceteach.vue
index 26e1769e..a7aeb56c 100644
--- a/src/components/drawers/AddFaceteach.vue
+++ b/src/components/drawers/AddFaceteach.vue
@@ -1,15 +1,15 @@
 <template>
-    <a-drawer
+  <a-drawer
     :visible="addfaceteachVisible"
     class="drawerStyle"
     width="80%"
-    title="添加在线"
+    title="添加面授"
     placement="right"
     @after-visible-change="afterVisibleChange"
   >
     <div class="drawerMain">
       <div class="header">
-        <div class="headerTitle">添加在线</div>
+        <div class="headerTitle">添加面授</div>
         <img
           style="width: 29px; height: 29px; cursor: pointer"
           src="../../assets/images/basicinfo/close.png"
@@ -17,92 +17,192 @@
         />
       </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="value1"
-                  style="width: 240px; height: 40px; border-radius: 8px"
-                  placeholder="请输入项目名称"
+        <div class="main_left">
+          <div class="main_item">
+            <div class="signbox">
+              <div class="sign">
+                <img
+                  src="@/assets/images/coursewareManage/asterisk.png"
+                  alt=""
                 />
               </div>
+              <span style="margin-right: 3px">课程名称：</span>
             </div>
-            <div class="mii_ipt">
-              <div class="ipt_name">内容分类：</div>
-              <div class="select">
-                <a-select
-                  dropdownClassName="dropdown-style"
-                  style="width: 240px"
-                  placeholder="请选择"
-                  :options="options1"
-                  allowClear
-                  showSearch
+            <div class="btnbox">
+              <a-input
+                v-model:value="value2"
+                style="width: 384px; height: 32px"
+                placeholder="请输入小组名称"
+              />
+            </div>
+          </div>
+          <div class="main_item">
+            <div class="signbox">
+              <div class="sign">
+                <img
+                  src="@/assets/images/coursewareManage/asterisk.png"
+                  alt=""
                 />
               </div>
+              <span style="margin-right: 3px">选择课程：</span>
+            </div>
+            <div class="btnbox">
+              <button class="xkbtn">选择课程</button>
+            </div>
+          </div>
+          <div class="main_item2">
+            <div class="signbox">
+              <span style="margin-right: 3px">项目说明：</span>
+            </div>
+            <div class="textarea">
+              <a-textarea
+                v-model:value="textareavalue"
+                placeholder="请输入说明"
+                allow-clear
+              />
+            </div>
+          </div>
+          <div class="main_item">
+            <div class="signbox">
+              <div class="sign">
+                <img
+                  src="@/assets/images/coursewareManage/asterisk.png"
+                  alt=""
+                />
+              </div>
+              <span style="margin-right: 3px">授课教师：</span>
+            </div>
+            <div class="btnbox">
+              <a-input
+                v-model:value="value2"
+                style="width: 384px; height: 32px"
+                placeholder="请输入授课教师"
+              />
+            </div>
+          </div>
+          <div class="main_item">
+            <div class="signbox">
+              <div class="sign">
+                <img
+                  src="@/assets/images/coursewareManage/asterisk.png"
+                  alt=""
+                />
+              </div>
+              <span style="margin-right: 3px">面授时间：</span>
+            </div>
+            <div class="btnbox">
+              <a-range-picker
+                :placeholder="['      开始时间', '        结束时间']"
+              />
+            </div>
+          </div>
+          <div class="main_item">
+            <div class="signbox">
+              <div class="sign">
+                <img
+                  src="@/assets/images/coursewareManage/asterisk.png"
+                  alt=""
+                />
+              </div>
+              <span style="margin-right: 3px">面授时长：</span>
+            </div>
+            <div class="btnbox">
+              <a-input
+                v-model:value="value2"
+                style="width: 384px; height: 32px"
+              />
+              <span style="margin-left: 5px">分钟</span>
+            </div>
+          </div>
+          <div class="main_item">
+            <div class="signbox">
+              <div class="sign">
+                <img
+                  src="@/assets/images/coursewareManage/asterisk.png"
+                  alt=""
+                />
+              </div>
+              <span style="margin-right: 3px">上课地址：</span>
+            </div>
+            <div class="btnbox">
+              <a-input
+                v-model:value="value2"
+                style="width: 384px; height: 32px"
+                placeholder="请输入上课地址"
+              />
+            </div>
+          </div>
+          <div class="main_item2">
+            <div class="signbox">
+              <span style="margin-right: 3px">考勤设置：</span>
+            </div>
+            <div class="kqszbox">
+              <div class="qdqtbox"><span>签到</span></div>
+              <div class="setbox">
+                <div class="timerbox">
+                  <span>开始前：</span>
+                  <a-input style="width: 88px; height: 32px"></a-input>
+                  <span style="color: #999999; margin-left: 8px">分钟</span>
+                </div>
+                <div class="timerbox">
+                  <span>开始后：</span>
+                  <a-input style="width: 88px; height: 32px"></a-input>
+                  <span style="color: #999999; margin-left: 8px">分钟</span>
+                </div>
+              </div>
+              <div class="qdqtbox"><span>签退</span></div>
+              <div class="setbox">
+                <div class="timerbox">
+                  <span>结束前：</span>
+                  <a-input style="width: 88px; height: 32px"></a-input>
+                  <span style="color: #999999; margin-left: 8px"
+                    >分钟（提前签退则记为早退）</span
+                  >
+                </div>
+              </div>
             </div>
           </div>
-          <div class="mi_btns">
-            <div class="btn btn1">
-              <div class="search"></div>
-              <div class="btnText">搜索</div>
+          <div class="main_item">
+            <div class="signbox">
+              <span style="margin-right: 3px">完成标准设置：</span>
             </div>
-            <div class="btn btn2">
-              <div class="search"></div>
-              <div class="btnText">重置</div>
+            <div class="btnbox">
+              <a-checkbox v-model:checked="checked">Checkbox</a-checkbox>
+              <a-checkbox v-model:checked="checked">Checkbox</a-checkbox>
+            </div>
+          </div>
+          <div class="main_item">
+            <div class="signbox">
+              <span style="margin-right: 3px">其他设置：</span>
+            </div>
+            <div class="btnbox">
+              <a-checkbox v-model:checked="checked">Checkbox</a-checkbox>
+            </div>
+          </div>
+          <div class="main_item2">
+            <div class="signbox">
+              <span style="margin-right: 3px">现场参与：</span>
+            </div>
+            <div class="btnbox2">
+              <a-checkbox v-model:checked="checked">Checkbox</a-checkbox>
+              <a-checkbox v-model:checked="checked">Checkbox</a-checkbox>
+            </div>
+          </div>
+          <div class="main_item2">
+            <div class="signbox">
+              <span style="margin-right: 3px">评估：</span>
+            </div>
+            <div class="btnbox2">
+              <a-checkbox v-model:checked="checked">需要评估</a-checkbox>
+              <button class="xkbtn">选择课程</button>
             </div>
           </div>
         </div>
-        <div class="main_notice">
-          <div class="mntc_left">
-            <div class="notice_icon"></div>
-            <span style="color: rgba(0, 0, 0, 0.65); margin-right: 17px"
-              >已选择 <span style="color: #388be1">4</span> 项</span
-            >
-            <span style="color: rgba(0, 0, 0, 0.65)"
-              >列表选项总计：<span>14</span> 条</span
-            >
-          </div>
-          <div class="mntc_right">
-            <span style="color: #387df7; margin-right: 24px">清空</span>
-          </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 class="main_btns">
-          <button class="btn1">取消</button>
-          <button class="btn2">确定</button>
-        </div>
+        <div class="main_right"></div>
+      </div>
+      <div class="main_btns">
+        <button class="btn1">取消</button>
+        <button class="btn2">确定</button>
       </div>
     </div>
   </a-drawer>
@@ -278,13 +378,13 @@ export default {
     const afterVisibleChange = (bool) => {
       console.log("state", bool);
     };
-    const showDrawerFaceteach = () => {
-      state.visible3 = true;
-    };
+    // const showDrawerFaceteach = () => {
+    //   state.addfaceteachvisible = true;
+    // };
     return {
       ...toRefs(state),
       afterVisibleChange,
-      showDrawerFaceteach,
+      // showDrawerFaceteach,
       closeDrawer,
       options1,
       columns1,
@@ -315,142 +415,116 @@ export default {
       }
     }
     .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_notice {
-        display: flex;
-        justify-content: space-between;
-        align-items: center;
-        margin-bottom: 32px;
-        height: 40px;
-        background-color: #e9f6fe;
-        .mntc_left {
+      display: flex;
+      justify-content: space-between;
+      .main_left {
+        margin-right: 30px;
+        .main_item {
           display: flex;
           align-items: center;
-          .notice_icon {
-            width: 14px;
-            height: 14px;
-            margin-right: 9px;
-            margin-left: 9px;
-            background-image: url(@/assets/images/coursewareManage/gan.png);
-            background-size: 100% 100%;
+          margin-bottom: 32px;
+          .signbox {
+            width: 120px;
+            display: flex;
+            justify-content: end;
+            align-items: center;
+            .sign {
+              margin-right: 5px;
+            }
+          }
+          .btnbox {
+            display: flex;
+            flex: 1;
+            align-items: center;
+            .xkbtn {
+              cursor: pointer;
+              width: 130px;
+              height: 40px;
+              background: #388be1;
+              border-radius: 8px;
+              border: 0;
+              margin-right: 8px;
+              color: #fff;
+            }
           }
         }
-        .mntc_right {
-          cursor: pointer;
+        .main_item2 {
+          display: flex;
+          align-items: flex-start;
+          margin-bottom: 32px;
+          .signbox {
+            width: 120px;
+            display: flex;
+            justify-content: end;
+            align-items: center;
+          }
+          .kqszbox {
+            .qdqtbox {
+              margin-left: 56px;
+            }
+            .setbox {
+              display: flex;
+              flex-wrap: wrap;
+              margin-top: 10px;
+              margin-bottom: 24px;
+              .timerbox {
+                margin-top: 6px;
+                margin-right: 32px;
+                display: flex;
+                align-items: center;
+                flex-wrap: nowrap;
+              }
+            }
+          }
+          .btnbox2{
+            display: flex;
+            flex-direction: column;
+            justify-content: flex-start;
+            .xkbtn {
+              cursor: pointer;
+              width: 130px;
+              height: 40px;
+              background: #388be1;
+              border-radius: 8px;
+              border: 0;
+              margin-right:  16px 8px 32px 0;
+              color: #fff;
+            }
+          }
         }
       }
-      .main_btns {
-        height: 72px;
-        width: 100%;
-        position: absolute;
-        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;
-        }
+      .main_right {
+        width: 337px;
+        border-left: 1px solid #e8e8e8;
+      }
+    }
+    .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;
       }
     }
   }
diff --git a/src/components/drawers/AddOnline.vue b/src/components/drawers/AddOnline.vue
index dee80d18..04fd69e1 100644
--- a/src/components/drawers/AddOnline.vue
+++ b/src/components/drawers/AddOnline.vue
@@ -1,286 +1,297 @@
 <template>
-    <a-drawer
-        :visible="addonlineVisible"
-        class="drawerStyle"
-        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"
+  <a-drawer
+    :visible="addonlineVisible"
+    class="drawerStyle"
+    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="value1"
+                  style="width: 240px; height: 40px; border-radius: 8px"
+                  placeholder="请输入项目名称"
                 />
+              </div>
             </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="value1"
-                                    style="width: 240px; height: 40px; border-radius: 8px"
-                                    placeholder="请输入项目名称"
-                                />
-                            </div>
-                        </div>
-                        <div class="mii_ipt">
-                            <div class="ipt_name">内容分类：</div>
-                            <div class="select">
-                                <a-select
-                                dropdownClassName="dropdown-style"
-                                style="width: 240px"
-                                placeholder="请选择"
-                                :options="options1"
-                                allowClear
-                                showSearch
-                            />
-                            </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_notice">
-                    <div class="mntc_left">
-                        <div class="notice_icon"></div>
-                        <span style="color:rgba(0, 0, 0, .65); margin-right:17px;">已选择 <span style="color:#388BE1;">4</span> 项</span>
-                        <span style="color:rgba(0, 0, 0, .65)">列表选项总计：<span>14</span> 条</span>
-                    </div>
-                    <div class="mntc_right">
-                        <span style="color:#387DF7; margin-right:24px;">清空</span>
-                    </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 class="main_btns">
-                    <button class="btn1">取消</button>
-                    <button class="btn2">确定</button>
-                </div>
+            <div class="mii_ipt">
+              <div class="ipt_name">内容分类：</div>
+              <div class="select">
+                <a-select
+                  dropdownClassName="dropdown-style"
+                  style="width: 240px"
+                  placeholder="请选择"
+                  :options="options1"
+                  allowClear
+                  showSearch
+                />
+              </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>
-    </a-drawer>
+        <div class="main_notice">
+          <div class="mntc_left">
+            <div class="notice_icon"></div>
+            <span style="color: rgba(0, 0, 0, 0.65); margin-right: 17px"
+              >已选择 <span style="color: #388be1">4</span> 项</span
+            >
+            <span style="color: rgba(0, 0, 0, 0.65)"
+              >列表选项总计：<span>14</span> 条</span
+            >
+          </div>
+          <div class="mntc_right">
+            <span style="color: #387df7; margin-right: 24px">清空</span>
+          </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 options1 = ref([
-            {
-                value: "value1",
-                label: "请选择状态",
-            },
-    ]);
-    const columns1 = [
+const options1 = ref([
+  {
+    value: "value1",
+    label: "请选择状态",
+  },
+]);
+const columns1 = [
+  {
+    title: "课程编号",
+    width: "20%",
+    dataIndex: "num",
+    key: "num",
+    align: "center",
+  },
+  {
+    title: "名称",
+    width: "20%",
+    dataIndex: "name",
+    key: "name",
+    align: "center",
+  },
+  {
+    title: "内容分类",
+    width: "13%",
+    dataIndex: "content",
+    key: "content",
+    align: "center",
+  },
+  {
+    title: "授课教师",
+    width: "13%",
+    dataIndex: "teacher",
+    key: "teacher",
+    align: "center",
+  },
+  {
+    title: "创建人",
+    width: "13%",
+    dataIndex: "creator",
+    key: "creator",
+    align: "center",
+  },
+  {
+    title: "完成时间",
+    width: "20%",
+    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: "AddOnline",
+  props: {
+    addonlineVisible: {
+      type: Boolean,
+      default: false,
+    },
+  },
+  setup(props, ctx) {
+    const state = reactive({
+      tableData1: [
         {
-            title: "课程编号",
-            width: '20%',
-            dataIndex: "num",
-            key: "num",
-            align: "center",
+          key: "1",
+          num: "JDF2022071100001",
+          name: "时间管理课程",
+          content: "通用力",
+          teacher: "BOE教师",
+          creator: "管理员",
+          time: "2022-10-31 23:12:00",
         },
         {
-            title: "名称",
-            width: '20%',
-            dataIndex: "name",
-            key: "name",
-            align: "center",
+          key: "2",
+          num: "JDF2022071100001",
+          name: "管理能力课程",
+          content: "领导力",
+          teacher: "BOE教师",
+          creator: "管理员",
+          time: "2022-10-31 23:12:00",
         },
         {
-            title: "内容分类",
-            width: '13%',
-            dataIndex: "content",
-            key: "content",
-            align: "center",
+          key: "3",
+          num: "JDF2022071100001",
+          name: "快速换模SMED",
+          content: "通用力",
+          teacher: "BOE教师",
+          creator: "管理员",
+          time: "2022-10-31 23:12:00",
         },
         {
-            title: "授课教师",
-            width: '13%',
-            dataIndex: "teacher",
-            key: "teacher",
-            align: "center",
+          key: "4",
+          num: "JDF2022071100001",
+          name: "巧妙对话人见人夸",
+          content: "领导力",
+          teacher: "BOE教师",
+          creator: "管理员",
+          time: "2022-10-31 23:12:00",
         },
         {
-            title: "创建人",
-            width: '13%',
-            dataIndex: "creator",
-            key: "creator",
-            align: "center",
+          key: "5",
+          num: "JDF2022071100001",
+          name: "管理能力课程",
+          content: "领导力",
+          teacher: "BOE教师",
+          creator: "管理员",
+          time: "2022-10-31 23:12:00",
         },
         {
-            title: "完成时间",
-            width: '20%',
-            dataIndex: "time",
-            key: "time",
-            align: "center",
+          key: "6",
+          num: "JDF2022071100001",
+          name: "时间管理课程",
+          content: "领导力",
+          teacher: "BOE教师",
+          creator: "管理员",
+          time: "2022-10-31 23:12:00",
         },
-    ]
-    const rowSelection = ref({
-        checkStrictly: false,
-        onChange: (selectedRowKeys, selectedRows) => {
-            console.log(`selectedRowKeys: ${selectedRowKeys}`, 'selectedRows: ', selectedRows);
+        {
+          key: "7",
+          num: "JDF2022071100001",
+          name: "时间管理课程",
+          content: "领导力",
+          teacher: "BOE教师",
+          creator: "管理员",
+          time: "2022-10-31 23:12:00",
         },
-        onSelect: (record, selected, selectedRows) => {
-            console.log(record, selected, selectedRows);
+        {
+          key: "8",
+          num: "JDF2022071100001",
+          name: "时间管理课程",
+          content: "领导力",
+          teacher: "BOE教师",
+          creator: "管理员",
+          time: "2022-10-31 23:12:00",
         },
-        onSelectAll: (selected, selectedRows, changeRows) => {
-            console.log(selected, selectedRows, changeRows);
+        {
+          key: "9",
+          num: "JDF2022071100001",
+          name: "时间管理课程",
+          content: "领导力",
+          teacher: "BOE教师",
+          creator: "管理员",
+          time: "2022-10-31 23:12:00",
         },
+      ],
+      currentPage: 1,
+      tableDataTotal: 100,
+      pageSize: 10,
     });
-    export default {
-        name: "AddOnline",
-        props: {
-        addonlineVisible: {
-            type: Boolean,
-            default: false,
-        },
-    },
-    setup(props, ctx) {
-        const state = reactive({
-            tableData1: [
-                {
-                    key: "1",
-                    num: 'JDF2022071100001',
-                    name:'时间管理课程',
-                    content:'通用力',
-                    teacher:'BOE教师',
-                    creator:'管理员',
-                    time:'2022-10-31 23:12:00',
-                },
-                {
-                    key: "2",
-                    num: 'JDF2022071100001',
-                    name:'管理能力课程',
-                    content:'领导力',
-                    teacher:'BOE教师',
-                    creator:'管理员',
-                    time:'2022-10-31 23:12:00',
-                },
-                {
-                    key: "3",
-                    num: 'JDF2022071100001',
-                    name:'快速换模SMED',
-                    content:'通用力',
-                    teacher:'BOE教师',
-                    creator:'管理员',
-                    time:'2022-10-31 23:12:00',
-                },
-                {
-                    key: "4",
-                    num: 'JDF2022071100001',
-                    name:'巧妙对话人见人夸',
-                    content:'领导力',
-                    teacher:'BOE教师',
-                    creator:'管理员',
-                    time:'2022-10-31 23:12:00',
-                },
-                {
-                    key: "5",
-                    num: 'JDF2022071100001',
-                    name:'管理能力课程',
-                    content:'领导力',
-                    teacher:'BOE教师',
-                    creator:'管理员',
-                    time:'2022-10-31 23:12:00',
-                },
-                {
-                    key: "6",
-                    num: 'JDF2022071100001',
-                    name:'时间管理课程',
-                    content:'领导力',
-                    teacher:'BOE教师',
-                    creator:'管理员',
-                    time:'2022-10-31 23:12:00',
-                },
-                {
-                    key: "7",
-                    num: 'JDF2022071100001',
-                    name:'时间管理课程',
-                    content:'领导力',
-                    teacher:'BOE教师',
-                    creator:'管理员',
-                    time:'2022-10-31 23:12:00',
-                },
-                {
-                    key: "8",
-                    num: 'JDF2022071100001',
-                    name:'时间管理课程',
-                    content:'领导力',
-                    teacher:'BOE教师',
-                    creator:'管理员',
-                    time:'2022-10-31 23:12:00',
-                },
-                {
-                    key: "9",
-                    num: 'JDF2022071100001',
-                    name:'时间管理课程',
-                    content:'领导力',
-                    teacher:'BOE教师',
-                    creator:'管理员',
-                    time:'2022-10-31 23:12:00',
-                },
-            ],
-            currentPage: 1,
-            tableDataTotal: 100,
-            pageSize: 10,
-        });
-        const closeDrawer = () => {
-            ctx.emit("update:addonlineVisible", false);
-        };
-        const afterVisibleChange = (bool) => {
-            console.log("state", bool);
-        };
-        const showDrawerOnline = () => {
-            state.visible = true;
-        };
-        return {
-            ...toRefs(state),
-            afterVisibleChange,
-            showDrawerOnline,
-            closeDrawer,
-            options1,
-            columns1,
-            rowSelection,
-            // change,
-        };
-    },
+    const closeDrawer = () => {
+      ctx.emit("update:addonlineVisible", false);
+    };
+    const afterVisibleChange = (bool) => {
+      console.log("state", bool);
+    };
+    const showDrawerOnline = () => {
+      state.visible = true;
+    };
+    return {
+      ...toRefs(state),
+      afterVisibleChange,
+      showDrawerOnline,
+      closeDrawer,
+      options1,
+      columns1,
+      rowSelection,
+      // change,
+    };
+  },
 };
 </script>
 <style lang="scss" scoped>
@@ -288,160 +299,160 @@ import { reactive, toRefs, ref } from "vue";
   background-color: #fafafa !important;
 }
 .drawerStyle {
-    .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_notice{
-                display: flex;
-                justify-content: space-between;
-                align-items: center;
-                margin-bottom: 32px;
-                height: 40px;
-                background-color: #E9F6FE;
-                .mntc_left{
-                    display: flex;
-                    align-items: center;    
-                    .notice_icon{
-                        width: 14px;
-                        height: 14px;
-                        margin-right: 9px;
-                        margin-left: 9px;
-                        background-image: url(@/assets/images/coursewareManage/gan.png);
-                        background-size: 100% 100%;
-                    }
-                }
-                .mntc_right{
-                    cursor: pointer;
-                }
-            }
-            .main_btns{
-                height: 72px;
-                width: 100%;
-                position: absolute;
-                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;
-                }
-            }
-        }
+  .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_notice {
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        margin-bottom: 32px;
+        height: 40px;
+        background-color: #e9f6fe;
+        .mntc_left {
+          display: flex;
+          align-items: center;
+          .notice_icon {
+            width: 14px;
+            height: 14px;
+            margin-right: 9px;
+            margin-left: 9px;
+            background-image: url(@/assets/images/coursewareManage/gan.png);
+            background-size: 100% 100%;
+          }
+        }
+        .mntc_right {
+          cursor: pointer;
+        }
+      }
+    }
+
+    .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/EditOnline.vue b/src/components/drawers/EditOnline.vue
index feaec1d1..320cf968 100644
--- a/src/components/drawers/EditOnline.vue
+++ b/src/components/drawers/EditOnline.vue
@@ -1,277 +1,294 @@
 <template>
-    <a-drawer
-        :visible="editonlineVisible"
-        class="drawerStyle"
-        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_item">
-                    <div class="signbox">
-                        <div class="sign"><img src="@/assets/images/coursewareManage/asterisk.png" alt=""></div>
-                        <span style="margin-right: 3px">课程名称：</span>
-                    </div>
-                    <div class="fi_input">
-                        <a-input
-                        v-model:value="value2"
-                        style="width: 384px; height: 40px; border-radius: 8px"
-                        placeholder="请输入小组名称"
-                        />
-                    </div>
-                </div>
-                <div class="main_item">
-                    <div class="signbox">
-                        <div class="sign"><img src="@/assets/images/coursewareManage/asterisk.png" alt=""></div>
-                        <span style="margin-right: 3px">选择课程：</span>
-                    </div>
-                    <div class="btnbox">
-                        <button class="xkbtn">选择课程</button>
-                        <a-tag closable @close="log" color='#F0FFFF' style="background-color: #388BE1;">时间管理</a-tag>
-                    </div>
-                </div>
-                <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="value1"
-                                    style="width: 240px; height: 40px; border-radius: 8px"
-                                    placeholder="请输入项目名称"
-                                />
-                            </div>
-                        </div>
-                        <div class="mii_ipt">
-                            <div class="ipt_name">内容分类：</div>
-                            <div class="select">
-                                <a-select
-                                dropdownClassName="dropdown-style"
-                                style="width: 240px"
-                                placeholder="请选择"
-                                :options="options1"
-                                allowClear
-                                showSearch
-                            />
-                            </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 class="main_btns">
-                    <button class="btn1">取消</button>
-                    <button class="btn2">确定</button>
-                </div>
+  <a-drawer
+    :visible="editonlineVisible"
+    class="drawerStyle"
+    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_item">
+          <div class="signbox">
+            <div class="sign">
+              <img src="@/assets/images/coursewareManage/asterisk.png" alt="" />
             </div>
+            <span style="margin-right: 3px">课程名称：</span>
+          </div>
+          <div class="fi_input">
+            <a-input
+              v-model:value="value2"
+              style="width: 384px; height: 40px; border-radius: 8px"
+              placeholder="请输入小组名称"
+            />
+          </div>
         </div>
-    </a-drawer>
+        <div class="main_item">
+          <div class="signbox">
+            <div class="sign">
+              <img src="@/assets/images/coursewareManage/asterisk.png" alt="" />
+            </div>
+            <span style="margin-right: 3px">选择课程：</span>
+          </div>
+          <div class="btnbox">
+            <button class="xkbtn">选择课程</button>
+            <a-tag
+              closable
+              @close="log"
+              color="#F0FFFF"
+              style="background-color: #388be1"
+              >时间管理</a-tag
+            >
+          </div>
+        </div>
+        <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="value1"
+                  style="width: 240px; height: 40px; border-radius: 8px"
+                  placeholder="请输入项目名称"
+                />
+              </div>
+            </div>
+            <div class="mii_ipt">
+              <div class="ipt_name">内容分类：</div>
+              <div class="select">
+                <a-select
+                  dropdownClassName="dropdown-style"
+                  style="width: 240px"
+                  placeholder="请选择"
+                  :options="options1"
+                  allowClear
+                  showSearch
+                />
+              </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 options1 = ref([
-            {
-                value: "value1",
-                label: "请选择状态",
-            },
-    ]);
-    const columns1 = [
+const options1 = ref([
+  {
+    value: "value1",
+    label: "请选择状态",
+  },
+]);
+const columns1 = [
+  {
+    title: "课程编号",
+    width: "20%",
+    dataIndex: "num",
+    key: "num",
+    align: "center",
+  },
+  {
+    title: "名称",
+    width: "20%",
+    dataIndex: "name",
+    key: "name",
+    align: "center",
+  },
+  {
+    title: "内容分类",
+    width: "13%",
+    dataIndex: "content",
+    key: "content",
+    align: "center",
+  },
+  {
+    title: "授课教师",
+    width: "13%",
+    dataIndex: "teacher",
+    key: "teacher",
+    align: "center",
+  },
+  {
+    title: "创建人",
+    width: "13%",
+    dataIndex: "creator",
+    key: "creator",
+    align: "center",
+  },
+  {
+    title: "完成时间",
+    width: "20%",
+    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: "EditOnline",
+  props: {
+    editonlineVisible: {
+      type: Boolean,
+      default: false,
+    },
+  },
+  setup(props, ctx) {
+    const state = reactive({
+      tableData1: [
         {
-            title: "课程编号",
-            width: '20%',
-            dataIndex: "num",
-            key: "num",
-            align: "center",
+          key: "1",
+          num: "JDF2022071100001",
+          name: "时间管理课程",
+          content: "通用力",
+          teacher: "BOE教师",
+          creator: "管理员",
+          time: "2022-10-31 23:12:00",
         },
         {
-            title: "名称",
-            width: '20%',
-            dataIndex: "name",
-            key: "name",
-            align: "center",
+          key: "2",
+          num: "JDF2022071100001",
+          name: "管理能力课程",
+          content: "领导力",
+          teacher: "BOE教师",
+          creator: "管理员",
+          time: "2022-10-31 23:12:00",
         },
         {
-            title: "内容分类",
-            width: '13%',
-            dataIndex: "content",
-            key: "content",
-            align: "center",
+          key: "3",
+          num: "JDF2022071100001",
+          name: "快速换模SMED",
+          content: "通用力",
+          teacher: "BOE教师",
+          creator: "管理员",
+          time: "2022-10-31 23:12:00",
         },
         {
-            title: "授课教师",
-            width: '13%',
-            dataIndex: "teacher",
-            key: "teacher",
-            align: "center",
+          key: "4",
+          num: "JDF2022071100001",
+          name: "巧妙对话人见人夸",
+          content: "领导力",
+          teacher: "BOE教师",
+          creator: "管理员",
+          time: "2022-10-31 23:12:00",
         },
         {
-            title: "创建人",
-            width: '13%',
-            dataIndex: "creator",
-            key: "creator",
-            align: "center",
+          key: "5",
+          num: "JDF2022071100001",
+          name: "管理能力课程",
+          content: "领导力",
+          teacher: "BOE教师",
+          creator: "管理员",
+          time: "2022-10-31 23:12:00",
         },
         {
-            title: "完成时间",
-            width: '20%',
-            dataIndex: "time",
-            key: "time",
-            align: "center",
+          key: "6",
+          num: "JDF2022071100001",
+          name: "时间管理课程",
+          content: "领导力",
+          teacher: "BOE教师",
+          creator: "管理员",
+          time: "2022-10-31 23:12:00",
         },
-    ]
-    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);
+        {
+          key: "7",
+          num: "JDF2022071100001",
+          name: "时间管理课程",
+          content: "领导力",
+          teacher: "BOE教师",
+          creator: "管理员",
+          time: "2022-10-31 23:12:00",
         },
+      ],
+      currentPage: 1,
+      tableDataTotal: 100,
+      pageSize: 10,
     });
-    export default {
-        name: "EditOnline",
-        props: {
-        editonlineVisible: {
-            type: Boolean,
-            default: false,
-        },
-    },
-    setup( props,ctx) {
-        const state = reactive({
-            tableData1: [
-                {
-                    key: "1",
-                    num: 'JDF2022071100001',
-                    name:'时间管理课程',
-                    content:'通用力',
-                    teacher:'BOE教师',
-                    creator:'管理员',
-                    time:'2022-10-31 23:12:00',
-                },
-                {
-                    key: "2",
-                    num: 'JDF2022071100001',
-                    name:'管理能力课程',
-                    content:'领导力',
-                    teacher:'BOE教师',
-                    creator:'管理员',
-                    time:'2022-10-31 23:12:00',
-                },
-                {
-                    key: "3",
-                    num: 'JDF2022071100001',
-                    name:'快速换模SMED',
-                    content:'通用力',
-                    teacher:'BOE教师',
-                    creator:'管理员',
-                    time:'2022-10-31 23:12:00',
-                },
-                {
-                    key: "4",
-                    num: 'JDF2022071100001',
-                    name:'巧妙对话人见人夸',
-                    content:'领导力',
-                    teacher:'BOE教师',
-                    creator:'管理员',
-                    time:'2022-10-31 23:12:00',
-                },
-                {
-                    key: "5",
-                    num: 'JDF2022071100001',
-                    name:'管理能力课程',
-                    content:'领导力',
-                    teacher:'BOE教师',
-                    creator:'管理员',
-                    time:'2022-10-31 23:12:00',
-                },
-                {
-                    key: "6",
-                    num: 'JDF2022071100001',
-                    name:'时间管理课程',
-                    content:'领导力',
-                    teacher:'BOE教师',
-                    creator:'管理员',
-                    time:'2022-10-31 23:12:00',
-                },
-                {
-                    key: "7",
-                    num: 'JDF2022071100001',
-                    name:'时间管理课程',
-                    content:'领导力',
-                    teacher:'BOE教师',
-                    creator:'管理员',
-                    time:'2022-10-31 23:12:00',
-                },
-            ],
-            currentPage: 1,
-            tableDataTotal: 100,
-            pageSize: 10,
-        });
-        const closeDrawer = () => {
-            ctx.emit("update:editonlineVisible", false);
-        };
-        const afterVisibleChange = (bool) => {
-            console.log("state", bool);
-        };
-        return {
-            ...toRefs(state),
-            afterVisibleChange,
-            closeDrawer,
-            options1,
-            columns1,
-            rowSelection,
-            // change,
-        };
-    },
+    const closeDrawer = () => {
+      ctx.emit("update:editonlineVisible", false);
+    };
+    const afterVisibleChange = (bool) => {
+      console.log("state", bool);
+    };
+    return {
+      ...toRefs(state),
+      afterVisibleChange,
+      closeDrawer,
+      options1,
+      columns1,
+      rowSelection,
+      // change,
+    };
+  },
 };
 </script>
 <style lang="scss" scoped>
@@ -279,165 +296,164 @@ import { reactive, toRefs, ref } from "vue";
   background-color: #fafafa !important;
 }
 .drawerStyle {
-    .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_item{
-                display: flex;
-                align-items: center;
-                margin-bottom: 32px;
-                .signbox{
-                    display: flex;
-                    align-items: center;
-                    .sign{
-                        margin-right: 5px;
-                    }
-                }
-                .btnbox{
-                    display: flex;
-                    align-items: center;
-                    .xkbtn {
-                        cursor: pointer;
-                        width: 130px;
-                        height: 40px;
-                        background: #388BE1;
-                        border-radius: 8px;
-                        border: 0;
-                        margin-right: 8px;
-                        color: #fff;
-                    }
-                }
-            }
-            .main_items{
-                display: flex;
-                justify-content: space-between;
-                flex-wrap:wrap;
-                margin-bottom: 12px;
-                .mi_ipts{
-                    display: flex;
-                    margin-bottom: 20px;
-                    flex-wrap: wrap;
-                    .mii_ipt{
-                        display: flex;
-                        align-items: center;
-                        margin-right: 24px;
-                        margin-bottom: 10px;
-                        .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%;
-                position: absolute;
-                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;
-                }
-            }
-        }
+  .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_item {
+        display: flex;
+        align-items: center;
+        margin-bottom: 32px;
+        .signbox {
+          display: flex;
+          align-items: center;
+          .sign {
+            margin-right: 5px;
+          }
+        }
+        .btnbox {
+          display: flex;
+          align-items: center;
+          .xkbtn {
+            cursor: pointer;
+            width: 130px;
+            height: 40px;
+            background: #388be1;
+            border-radius: 8px;
+            border: 0;
+            margin-right: 8px;
+            color: #fff;
+          }
+        }
+      }
+      .main_items {
+        display: flex;
+        justify-content: space-between;
+        flex-wrap: wrap;
+        margin-bottom: 12px;
+        .mi_ipts {
+          display: flex;
+          margin-bottom: 20px;
+          flex-wrap: wrap;
+          .mii_ipt {
+            display: flex;
+            align-items: center;
+            margin-right: 24px;
+            margin-bottom: 10px;
+            .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/views/projectcenter/TaskAdd.vue b/src/views/projectcenter/TaskAdd.vue
index 90823948..a638449b 100644
--- a/src/views/projectcenter/TaskAdd.vue
+++ b/src/views/projectcenter/TaskAdd.vue
@@ -78,7 +78,7 @@
           </div>
           <!-- 添加在线侧弹窗 -->
           <div>
-            <add-online v-model:addonlineVisible="visible" />
+            <add-online v-model:addonlineVisible="addonlinevisible" />
           </div>
           <!-- 添加在线侧弹窗 -->
           <div class="lin"></div>
@@ -92,7 +92,7 @@
           </div>
           <!-- 添加面授侧弹窗 -->
           <div>
-            <add-faceteach v-model:addfaceteachVisible="visible3" />
+            <add-faceteach v-model:addfaceteachVisible="addfaceteachvisible" />
           </div>
           <!-- 添加面授侧弹窗 -->
           <div class="lin"></div>
@@ -243,7 +243,7 @@
           </div>
           <!-- 编辑在线侧弹窗 -->
           <div>
-            <edit-online v-model:editonlineVisible="visible2" />
+            <edit-online v-model:editonlineVisible="editonlinevisible" />
           </div>
           <!-- 编辑在线侧弹窗 -->
         </div>
@@ -644,9 +644,9 @@ export default {
       currentPage: 1,
       tableDataTotal: 100,
       pageSize: 10,
-      visible: false,
-      visible2: false,
-      visible3: false,
+      addonlinevisible: false,
+      addfaceteachvisible: false,
+      editonlinevisible: false,
       stage: false,
       selectedRowKeys: [],
     });
@@ -763,7 +763,7 @@ export default {
                 <div class="opacation">
                   <span
                     onClick={() => {
-                      state.visible2 = true;
+                      state.editonlinevisible = true;
                     }}
                     style="color:#4EA6FF;margin-right:25px;cursor:pointer"
                   >
@@ -807,11 +807,10 @@ export default {
         "0px 1px 35px 0px rgba(118, 136, 166, 0.07)";
     });
     const showDrawerOnline = () => {
-      state.visible = true;
+      state.addonlinevisible = true;
     };
     const showDrawerFaceteach = () => {
-      state.visible3 = true;
-      console.log(state.visible3);
+      state.addfaceteachvisible = true;
     };
     return {
       ...toRefs(state),