修改样式：课程目标>课程标题

teaching_integration_platform_admin_template/src/views/configurationPage/index.vue

@@ -51,10 +51,14 @@
 </template>
 
 <script lang="ts" setup>
-import { getSysSettingApi, proxPutSysSettingApi, uploadApi } from '@/api/configuration';
+import {
+  getSysSettingApi,
+  proxPutSysSettingApi,
+  uploadApi,
+} from '@/api/configuration'
 import { ref, reactive } from 'vue'
-import MyUpdate from './MyUpdate.vue';
-import useUserStore from '@/store/modules/user';
+import MyUpdate from './MyUpdate.vue'
+import useUserStore from '@/store/modules/user'
 const userStore = useUserStore()
 
 // do not use same name with ref
@@ -73,7 +77,7 @@ const form = reactive({
   title: '',
   mailbox: '',
   home: '',
-    recordInformation: ''
+  recordInformation: '',
 })
 
 const ran = ref(false)

teaching_integration_platform_template/src/views/course/index.vue

@@ -92,7 +92,9 @@
         </div>
         <div class="description">
           <div class="description-box">
-            {{ Route.query.name }}这个课程的简介：{{ learn.description }}
+            <!-- 课程简介： -->
+            <div class="title">{{ Route.query.name }}</div>
+            <div style="text-indent: 2em;">{{ learn.description }}</div>
             <!-- 《Vues 设计与实现》这本书的简介： 《Vues 设计与实现》是一本深入剖析
             Vues 框架核心原理的权威著作。
             本书首先会为读者搭建起一个坚实的知识基础，详细介绍 Vues
@@ -568,12 +570,39 @@ getCourseObjectivesListEvent()
           overflow-y: auto;
           height: 260px;
           padding: 10px 20px;
-          text-indent: 2em;
+          // text-indent: 2em;
           /* 2em 约等于两个汉字的宽度 */
           font-size: 18px;
           line-height: 40px;
+          position: relative;
 
-          .description-box {}
+          .description-box {
+            .title {
+              border-radius: 16px;
+              border: 1px solid #e8e9fb;
+              box-shadow: 0 0 10px #e8e9fb;
+              text-align: center;
+              color: #12a3f5;
+              width: fit-content;
+              min-width: 80px;
+              padding: 0 10px;
+              position: relative;
+              left: 50%;
+              translate: -50%;
+              margin-bottom: 6px;
+              &:before {
+                content: "";
+                width: 300%;
+                height: 2px;
+                background: #e8e9fb;
+                position: absolute;
+                bottom: -6px;
+                left: 50%;
+                translate: -50%;
+                background: linear-gradient(to right, rgba(255, 255, 255, 0) ,#e8e9fb,rgba(255, 255, 255, 0));
+              }
+            }
+          }
         }
 
         .hours {

teaching_integration_platform_template/src/views/knowledge/index.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="title">xxx知识点
+  <div class="title">{{ Route.query.title }}
     <div class="back" @click="router.go(-1)">返回</div>
   </div>
   <div class="container" v-if="loading">
@@ -99,7 +99,7 @@ import VueOfficeDocx from '@vue-office/docx'
 const Route = useRoute()
 const router = useRouter()
 // const courseId: string = Route.query.id as string
-console.log(Route.query.id)
+// console.log(Route.query.id)
 const loading = ref(false)
 const activeName = ref<string>('1')
 

teaching_integration_platform_template/src/views/roadbedRecommendation/components/mountNode.vue

@@ -8,7 +8,7 @@ import { getCoursePath } from '@/api/course'
 import { useRouter } from 'vue-router'
 import { proxrequest } from '@/api/configuration';
 const Router = useRouter()
-const props = defineProps(['corseId']);
+const props = defineProps(['corseId','options']);
 const nodeList = ref({ nodes: [], edges: [] })
 watch(() => props.corseId, () => getCoursePathEvent());
 let prOpt: any;
@@ -36,7 +36,39 @@ const getCoursePathEvent = async () => {
   console.log(nodeList.value)
   init()
 }
-
+var graph:any;
+onMounted(()=>{
+   graph = new G6.Graph({
+    container: 'mountNode',
+    width: window.innerWidth - 19,
+    height: 600,
+    layout: {
+      type: 'dagre',
+      rankdir: 'LR',
+      nodesep: 30,
+      ranksep: 100,
+    },
+    modes: {
+      default: ['drag-canvas'],
+    },
+    defaultNode: {
+      shape: 'round-rect',
+      labelCfg: {
+        style: {
+          fill: '#000000A6',
+          fontSize: 10,
+        },
+      },
+      style: {
+        stroke: '#72CC4A',
+        width: 150,
+      },
+    },
+    defaultEdge: {
+      shape: 'polyline',
+    },
+  })
+})
 const init = () => {
   var colorMap = {
     凭证开立: '#72CC4A',
@@ -46,6 +78,8 @@ const init = () => {
     第二阶段: '#1A91FF',
     第三阶段: '#FFAA15',
   }
+  
+  // #region
   // var data = {
   //   nodes: [
   //     {
@@ -186,6 +220,7 @@ const init = () => {
   //     },
   //   ],
   // }
+  // #endregion 
 
   G6.registerNode(
     'round-rect',
@@ -357,46 +392,14 @@ const init = () => {
     },
   })
 
-  var graph = new G6.Graph({
-    container: 'mountNode',
-    width: window.innerWidth - 19,
-    height: 600,
-    layout: {
-      type: 'dagre',
-      rankdir: 'LR',
-      nodesep: 30,
-      ranksep: 100,
-    },
-    modes: {
-      default: ['drag-canvas'],
-    },
-    defaultNode: {
-      shape: 'round-rect',
-      labelCfg: {
-        style: {
-          fill: '#000000A6',
-          fontSize: 10,
-        },
-      },
-      style: {
-        stroke: '#72CC4A',
-        width: 150,
-      },
-    },
-    defaultEdge: {
-      shape: 'polyline',
-    },
-  })
-
   graph.data(nodeList.value)
   graph.render()
   graph.on('node:click', ev => {
-    console.log(ev.item._cfg.id);
+    console.log(ev, ev.item._cfg.id);
     Router.push({
       path: '/knowledge',
-      query: { id: ev.item._cfg.id }
+      query: { id: ev.item._cfg.id,title:ev.item._cfg.model.label }
     })
-
   });
   var edges = graph.getEdges()
   edges.forEach(function (edge: any) {