Browse Source

refactor:将深度选择器重置为推荐形式
feat:初始化教师端课程详情页面

茫茫燃 4 years ago
parent
commit
f59119fc5a

+ 6 - 0
src/router/manager.js

@@ -4,4 +4,10 @@ export default [
     name: "ManagerHome",
     component: () => import("../views/ManagePage/ManagerHome/ManagerHome"),
   },
+  {
+    path: "/managerCourseDetail",
+    name: "ManagerCourseDetail",
+    component: () =>
+      import("../views/ManagePage/ManagerCourseDetail/ManagerCourseDetail"),
+  },
 ];

+ 25 - 0
src/views/ManagePage/ManagerCourseDetail/ManagerCourseDetail.vue

@@ -0,0 +1,25 @@
+<template>
+  <div class="course-detail-page">
+    <GlobalHeader/>
+    <div class="course-detail-container">
+      <div class="header">
+        <div class="course-img">
+
+        </div>
+        <div class="course-info"></div>
+      </div>
+
+
+    </div>
+
+
+  </div>
+</template>
+
+<script setup>
+import GlobalHeader from "../../../components/GlobalHeader";
+</script>
+
+<style scoped>
+@import "style/ManagerCourseDetail.css";
+</style>

+ 30 - 0
src/views/ManagePage/ManagerCourseDetail/style/ManagerCourseDetail.css

@@ -0,0 +1,30 @@
+.course-detail-page {
+    min-height: 100vh;
+}
+
+.course-detail-container {
+    box-sizing: border-box;
+    width: 1500px;
+    min-width: 1500px;
+    margin-top: 32px;
+}
+
+
+.flex-center {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+}
+
+.header {
+
+}
+
+.course-img {
+
+}
+
+.course-img > img {
+    width: 100%;
+    height: 100%;
+}

+ 5 - 7
src/views/ManagePage/ManagerHome/ManagerHome.vue

@@ -96,9 +96,7 @@
               type="textarea"
           />
         </div>
-
       </div>
-
     </div>
     <div class="flex-center">
       <div class="saveNewCourse">
@@ -141,12 +139,12 @@ let courseInfo = reactive({
   width: 200px;
 }
 
-.flex-around >>> .el-date-editor.el-input {
+.flex-around :deep(.el-date-editor.el-input) {
   width: 200px;
 }
 
 
-.upLoad >>> .avatar-uploader .el-upload {
+.upLoad :deep(.avatar-uploader .el-upload) {
   border: 1px dashed #d9d9d9;
   border-radius: 6px;
   cursor: pointer;
@@ -156,11 +154,11 @@ let courseInfo = reactive({
   background-color: whitesmoke;
 }
 
-.upLoad >>> .avatar-uploader .el-upload:hover {
+.upLoad :deep(.avatar-uploader .el-upload:hover) {
   border-color: #409eff;
 }
 
-.upLoad >>> .avatar-uploader-icon {
+.upLoad :deep(.avatar-uploader-icon ) {
   font-size: 28px;
   color: #8c939d;
   width: 178px;
@@ -169,7 +167,7 @@ let courseInfo = reactive({
   line-height: 178px;
 }
 
-.upLoad >>> .avatar {
+.upLoad :deep(.avatar) {
   width: 178px;
   height: 178px;
   display: block;