From 84c8f6f8052f18b3100fb1e2978d7c2f13a53bc0 Mon Sep 17 00:00:00 2001
From: xy <2115269706@qq.com>
Date: Thu, 13 Jun 2024 17:22:13 +0800
Subject: [PATCH 1/3] =?UTF-8?q?=E5=88=87=E6=8D=A2=E5=88=86=E6=94=AF?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 ....timestamp-1718268044772-4deaaf3aeef01.mjs | 40 +++++++++++++++++++
 1 file changed, 40 insertions(+)
 create mode 100644 vite.config.ts.timestamp-1718268044772-4deaaf3aeef01.mjs

diff --git a/vite.config.ts.timestamp-1718268044772-4deaaf3aeef01.mjs b/vite.config.ts.timestamp-1718268044772-4deaaf3aeef01.mjs
new file mode 100644
index 0000000..91a14a7
--- /dev/null
+++ b/vite.config.ts.timestamp-1718268044772-4deaaf3aeef01.mjs
@@ -0,0 +1,40 @@
+// vite.config.ts
+import vue from "file:///D:/aaa/teaching/Teaching_integration_platform_admin_template/node_modules/.pnpm/@vitejs+plugin-vue@5.0.4_vite@5.1.4_vue@3.4.19/node_modules/@vitejs/plugin-vue/dist/index.mjs";
+import path from "path";
+import { viteMockServe } from "file:///D:/aaa/teaching/Teaching_integration_platform_admin_template/node_modules/.pnpm/vite-plugin-mock@3.0.1_esbuild@0.19.12_mockjs@1.1.0_vite@5.1.4/node_modules/vite-plugin-mock/dist/index.mjs";
+import { createSvgIconsPlugin } from "file:///D:/aaa/teaching/Teaching_integration_platform_admin_template/node_modules/.pnpm/vite-plugin-svg-icons@2.0.1_vite@5.1.4/node_modules/vite-plugin-svg-icons/dist/index.mjs";
+var vite_config_default = ({ command }) => {
+  return {
+    plugins: [
+      vue(),
+      viteMockServe({
+        enable: command === "serve"
+      }),
+      createSvgIconsPlugin({
+        // Specify the icon folder to be cached
+        iconDirs: [path.resolve(process.cwd(), "src/assets/icons")],
+        // Specify symbolId format
+        symbolId: "icon-[dir]-[name]"
+      })
+    ],
+    resolve: {
+      alias: {
+        "@": path.resolve("./src")
+        // 相对路径别名配置，使用 @ 代替 src
+      }
+    },
+    // 配置scss
+    css: {
+      preprocessorOptions: {
+        scss: {
+          javascriptEnabled: true,
+          additionalData: '@import "./src/styles/variable.scss";'
+        }
+      }
+    }
+  };
+};
+export {
+  vite_config_default as default
+};
+//# sourceMappingURL=data:application/json;base64,ewogICJ2ZXJzaW9uIjogMywKICAic291cmNlcyI6IFsidml0ZS5jb25maWcudHMiXSwKICAic291cmNlc0NvbnRlbnQiOiBbImNvbnN0IF9fdml0ZV9pbmplY3RlZF9vcmlnaW5hbF9kaXJuYW1lID0gXCJEOlxcXFxhYWFcXFxcdGVhY2hpbmdcXFxcVGVhY2hpbmdfaW50ZWdyYXRpb25fcGxhdGZvcm1fYWRtaW5fdGVtcGxhdGVcIjtjb25zdCBfX3ZpdGVfaW5qZWN0ZWRfb3JpZ2luYWxfZmlsZW5hbWUgPSBcIkQ6XFxcXGFhYVxcXFx0ZWFjaGluZ1xcXFxUZWFjaGluZ19pbnRlZ3JhdGlvbl9wbGF0Zm9ybV9hZG1pbl90ZW1wbGF0ZVxcXFx2aXRlLmNvbmZpZy50c1wiO2NvbnN0IF9fdml0ZV9pbmplY3RlZF9vcmlnaW5hbF9pbXBvcnRfbWV0YV91cmwgPSBcImZpbGU6Ly8vRDovYWFhL3RlYWNoaW5nL1RlYWNoaW5nX2ludGVncmF0aW9uX3BsYXRmb3JtX2FkbWluX3RlbXBsYXRlL3ZpdGUuY29uZmlnLnRzXCI7aW1wb3J0IHsgZGVmaW5lQ29uZmlnIH0gZnJvbSAndml0ZSdcclxuaW1wb3J0IHZ1ZSBmcm9tICdAdml0ZWpzL3BsdWdpbi12dWUnXHJcbmltcG9ydCBwYXRoIGZyb20gJ3BhdGgnXHJcbi8vIFx1NUJGQ1x1NTE2NW1vY2tcdTYzRDJcdTRFRjZcclxuaW1wb3J0IHsgdml0ZU1vY2tTZXJ2ZSB9IGZyb20gJ3ZpdGUtcGx1Z2luLW1vY2snXHJcbi8vIFx1NUJGQ1x1NTE2NXN2Z1x1OTE0RFx1N0Y2RVx1NjNEMlx1NEVGNlxyXG5pbXBvcnQgeyBjcmVhdGVTdmdJY29uc1BsdWdpbiB9IGZyb20gJ3ZpdGUtcGx1Z2luLXN2Zy1pY29ucydcclxuLy8gaHR0cHM6Ly92aXRlanMuZGV2L2NvbmZpZy9cclxuZXhwb3J0IGRlZmF1bHQgKHsgY29tbWFuZCB9OiBhbnkpID0+IHtcclxuICByZXR1cm4ge1xyXG4gICAgcGx1Z2luczogW1xyXG4gICAgICB2dWUoKSxcclxuICAgICAgdml0ZU1vY2tTZXJ2ZSh7XHJcbiAgICAgICAgZW5hYmxlOiBjb21tYW5kID09PSAnc2VydmUnLFxyXG4gICAgICB9KSxcclxuICAgICAgY3JlYXRlU3ZnSWNvbnNQbHVnaW4oe1xyXG4gICAgICAgIC8vIFNwZWNpZnkgdGhlIGljb24gZm9sZGVyIHRvIGJlIGNhY2hlZFxyXG4gICAgICAgIGljb25EaXJzOiBbcGF0aC5yZXNvbHZlKHByb2Nlc3MuY3dkKCksICdzcmMvYXNzZXRzL2ljb25zJyldLFxyXG4gICAgICAgIC8vIFNwZWNpZnkgc3ltYm9sSWQgZm9ybWF0XHJcbiAgICAgICAgc3ltYm9sSWQ6ICdpY29uLVtkaXJdLVtuYW1lXScsXHJcbiAgICAgIH0pLFxyXG4gICAgXSxcclxuICAgIHJlc29sdmU6IHtcclxuICAgICAgYWxpYXM6IHtcclxuICAgICAgICAnQCc6IHBhdGgucmVzb2x2ZSgnLi9zcmMnKSwgLy8gXHU3NkY4XHU1QkY5XHU4REVGXHU1Rjg0XHU1MjJCXHU1NDBEXHU5MTREXHU3RjZFXHVGRjBDXHU0RjdGXHU3NTI4IEAgXHU0RUUzXHU2NkZGIHNyY1xyXG4gICAgICB9LFxyXG4gICAgfSxcclxuICAgIC8vIFx1OTE0RFx1N0Y2RXNjc3NcclxuICAgIGNzczoge1xyXG4gICAgICBwcmVwcm9jZXNzb3JPcHRpb25zOiB7XHJcbiAgICAgICAgc2Nzczoge1xyXG4gICAgICAgICAgamF2YXNjcmlwdEVuYWJsZWQ6IHRydWUsXHJcbiAgICAgICAgICBhZGRpdGlvbmFsRGF0YTogJ0BpbXBvcnQgXCIuL3NyYy9zdHlsZXMvdmFyaWFibGUuc2Nzc1wiOycsXHJcbiAgICAgICAgfSxcclxuICAgICAgfSxcclxuICAgIH0sXHJcbiAgfVxyXG59XHJcbiJdLAogICJtYXBwaW5ncyI6ICI7QUFDQSxPQUFPLFNBQVM7QUFDaEIsT0FBTyxVQUFVO0FBRWpCLFNBQVMscUJBQXFCO0FBRTlCLFNBQVMsNEJBQTRCO0FBRXJDLElBQU8sc0JBQVEsQ0FBQyxFQUFFLFFBQVEsTUFBVztBQUNuQyxTQUFPO0FBQUEsSUFDTCxTQUFTO0FBQUEsTUFDUCxJQUFJO0FBQUEsTUFDSixjQUFjO0FBQUEsUUFDWixRQUFRLFlBQVk7QUFBQSxNQUN0QixDQUFDO0FBQUEsTUFDRCxxQkFBcUI7QUFBQTtBQUFBLFFBRW5CLFVBQVUsQ0FBQyxLQUFLLFFBQVEsUUFBUSxJQUFJLEdBQUcsa0JBQWtCLENBQUM7QUFBQTtBQUFBLFFBRTFELFVBQVU7QUFBQSxNQUNaLENBQUM7QUFBQSxJQUNIO0FBQUEsSUFDQSxTQUFTO0FBQUEsTUFDUCxPQUFPO0FBQUEsUUFDTCxLQUFLLEtBQUssUUFBUSxPQUFPO0FBQUE7QUFBQSxNQUMzQjtBQUFBLElBQ0Y7QUFBQTtBQUFBLElBRUEsS0FBSztBQUFBLE1BQ0gscUJBQXFCO0FBQUEsUUFDbkIsTUFBTTtBQUFBLFVBQ0osbUJBQW1CO0FBQUEsVUFDbkIsZ0JBQWdCO0FBQUEsUUFDbEI7QUFBQSxNQUNGO0FBQUEsSUFDRjtBQUFBLEVBQ0Y7QUFDRjsiLAogICJuYW1lcyI6IFtdCn0K

From d13383b4d88ae2e48901cec82ca30e9a2fce28f2 Mon Sep 17 00:00:00 2001
From: xy <2115269706@qq.com>
Date: Thu, 13 Jun 2024 17:48:52 +0800
Subject: [PATCH 2/3] 123

---
 src/views/course/CourseObjectives.vue | 489 +++++++++++++++++++++++++-
 1 file changed, 484 insertions(+), 5 deletions(-)

diff --git a/src/views/course/CourseObjectives.vue b/src/views/course/CourseObjectives.vue
index 87b0412..1110776 100644
--- a/src/views/course/CourseObjectives.vue
+++ b/src/views/course/CourseObjectives.vue
@@ -1,9 +1,488 @@
+<script setup>
+import { ref, onMounted } from 'vue'
+import { ElMessage, ElMessageBox } from 'element-plus'
+import { id } from 'element-plus/es/locales.mjs'
+import * as echarts from 'echarts'
+// id ： 分目标id
+// targetId ： 选中的分类
+const booksList = ref([
+  { id: 1, targetId: 1, introduce: '内容111111' },
+  // { id: 3, introduce: '内容333333' },
+  // { id: 4, introduce: '内容333333' },
+])
+
+const courseList = ref([
+  { id: 1, specific: '思政目标' },
+  { id: 2, specific: '知识目标' },
+  { id: 3, specific: '能力目标' },
+  { id: 4, specific: '素质目标' },
+])
+const targetList = ref([
+  {
+    label: '课程目标一',
+    id: 1,
+    disabled: false,
+  },
+  {
+    label: '课程目标二',
+    disabled: false,
+    id: 2,
+  },
+  {
+    label: '课程目标三',
+    id: 3,
+    disabled: false,
+  },
+])
+const formData = ref({
+  id: null,
+  target: '',
+  description: '',
+})
+const addBook = () => {
+  dialogVisible.value = true
+  updateDisabledStatus()
+}
+const text = ref('我是后台获取的值')
+const textChange = (val) => {
+  console.log(text.value)
+}
+// 弹窗
+const dialogVisible = ref(false)
+// 关闭弹窗
+const handleClose = () => {
+  dialogVisible.value = false
+}
+// 弹窗提交事件
+const submit = () => {
+  // 判断当前点击的是新增还是修改
+  if (flog.value) {
+    console.log('编辑', formData.value.target)
+    // 找到新增的一项
+    const index = booksList.value.findIndex(
+      (item) => formData.value.id == item.id,
+    )
+    console.log(index, 'index')
+    console.log(booksList.value[index])
+    booksList.value[index].id = formData.value.id
+    booksList.value[index].targetId = formData.value.target
+    booksList.value[index].introduce = formData.value.description
+    close()
+  } else {
+    booksList.value.push({
+      id: booksList.value.length + 1,
+      targetId: formData.value.target,
+      introduce: formData.value.description,
+    })
+    close()
+    flog.value = false
+  }
+}
+const close = () => {
+  formData.value = {
+    id: null,
+    target: '',
+    description: '',
+  }
+  dialogVisible.value = false
+}
+// 筛选目标
+const filterTarger = (target) => {
+  const res = targetList.value.find((item) => {
+    if (item.id === target) {
+      console.log(item)
+      return item
+    }
+  })
+  return res.label
+}
+
+// 编辑事件
+const flog = ref(false)
+const editBook = (item) => {
+  updateDisabledStatus()
+  flog.value = true
+  console.log(item)
+  formData.value.id = item.id
+  formData.value.target = item.targetId
+  formData.value.description = item.introduce
+  dialogVisible.value = true
+}
+const del = (id) => {
+  // console.log(id);
+  booksList.value = booksList.value.filter((item) => item.id !== id)
+}
+
+// const disableChange = (id) => {
+//   const index = booksList.value.findIndex((item,index) => item.id === id)
+//   console.log(index);
+//   if(index){
+//     targetList.value[index].disabled = false
+//   }
+// }
+// 定义一个方法来更新 targetList 中的 disabled 属性
+const updateDisabledStatus = () => {
+  // 遍历 targetList
+  targetList.value.forEach((targetItem) => {
+    // 检查 booksList 中是否有相同的 id
+    const hasIdInBooks = booksList.value.some(
+      (bookItem) => bookItem.id === targetItem.id,
+    )
+    // 如果存在，则设置 disabled 为 true
+    if (hasIdInBooks) {
+      targetItem.disabled = true
+    }
+  })
+}
+onMounted(() => {
+  let chartDom = document.getElementById('main')
+  let myChart = echarts.init(chartDom)
+  let option
+  option = {
+    title: {
+      text: '分目标',
+    },
+    legend: {
+      data: ['Allocated Budget', 'Actual Spending'],
+    },
+    radar: {
+      // shape: 'circle',
+      indicator: [
+        { name: 'Sales', max: 6500 },
+        { name: 'Administration', max: 16000 },
+        { name: 'Information Technology', max: 30000 },
+        { name: 'Customer Support', max: 38000 },
+        { name: 'Development', max: 52000 },
+        { name: 'Marketing', max: 25000 },
+      ],
+    },
+    series: [
+      {
+        name: 'Budget vs spending',
+        type: 'radar',
+        data: [
+          {
+            value: [4200, 3000, 20000, 35000, 50000, 18000],
+            name: 'Allocated Budget',
+          },
+          {
+            value: [5000, 14000, 28000, 26000, 42000, 21000],
+            name: 'Actual Spending',
+          },
+        ],
+      },
+    ],
+  }
+
+  option && myChart.setOption(option)
+})
+</script>
+
 <template>
-  <div>课程目标</div>
+  <div class="container">
+    <div class="leftContent">
+      <div class="topContent">
+        <div class="title">| 课程总目标</div>
+        <div class="content1">
+          <textarea class="textarea" @change="textChange" v-model="text">
+文本内容</textarea
+          >
+        </div>
+      </div>
+      <div class="footContent">
+        <div class="title">| 分目标雷达图</div>
+        <div class="content3">
+          <div id="main"></div>
+        </div>
+      </div>
+    </div>
+    <div class="rightContent">
+      <div
+        class="title"
+        style="
+          width: 100%;
+          display: flex;
+          align-items: center;
+          justify-content: space-between;
+          padding: 0 20px;
+          height: 60px;
+        "
+      >
+        <div class="left2">| 课程分目标</div>
+        <div class="right2">
+          <!-- <el-button type="primary" @click="addBook">新增</el-button> -->
+        </div>
+      </div>
+      <div class="content2">
+        <el-scrollbar height="600px">
+          <ul class="objectLi">
+            <li v-for="(item, index) in courseList" :key="item.id">
+              <div class="courseObject">
+                <!-- {{ filterTarger(item.targetId) }} -->
+                <div class="courseObject1">{{ item.specific }}</div>
+                <div class="courseObject2">
+                  <!-- <el-button class="edit" type="text" @click="editBook(item)">
+                    编辑
+                  </el-button> -->
+                  <el-button type="primary" @click="addBook">新增</el-button>
+                </div>
+              </div>
+              <div class="smallContent">
+                <el-scrollbar height="250px">
+                  <ul class="small">
+                    <li v-for="(item, index) in booksList" :key="item.id">
+                      <div class="partObject">
+                        <div class="partObject1">
+                          {{ filterTarger(item.targetId) }}
+                        </div>
+                        <div class="partObject2">
+                          <el-button
+                            class="edit"
+                            type="text"
+                            @click="editBook(item)"
+                          >
+                            编辑
+                          </el-button>
+                          <el-button
+                            class="destroy"
+                            type="text"
+                            @click="del(item.id)"
+                          >
+                            删除
+                          </el-button>
+                        </div>
+                      </div>
+                      <div class="partObjectIntroduce">
+                        {{ item.introduce }}
+                      </div>
+                    </li>
+                  </ul>
+                </el-scrollbar>
+              </div>
+            </li>
+          </ul>
+        </el-scrollbar>
+      </div>
+    </div>
+  </div>
+  <el-dialog
+    v-if="dialogVisible"
+    v-model="dialogVisible"
+    title="新增目标"
+    width="500"
+    :before-close="handleClose"
+  >
+    <el-form :model="formData" label-width="auto" style="max-width: 600px">
+      <el-form-item label="目标" prop="target">
+        <el-select
+          v-model="formData.target"
+          placeholder="Select"
+          size="large"
+          style="width: 240px"
+        >
+          <el-option
+            v-for="item in targetList"
+            :key="item.id"
+            :label="item.label"
+            :value="item.id"
+            :disabled="item.disabled"
+          />
+        </el-select>
+      </el-form-item>
+      <el-form-item label="内容" prop="description">
+        <el-input
+          v-model="formData.description"
+          placeholder="请输入内容"
+        ></el-input>
+      </el-form-item>
+    </el-form>
+    <template #footer>
+      <div class="dialog-footer">
+        <el-button @click="close">取消</el-button>
+        <el-button type="primary" @click="submit">确定</el-button>
+      </div>
+    </template>
+  </el-dialog>
 </template>
+<!-- <script setup>
+import {ref} 'vue'
+const li
+</script> -->
 
-<script lang="ts" setup>
-import {} from 'vue'
-</script>
+<style lang="scss" scoped>
+#main {
+  padding: 15px;
+  width: 100%;
+  height: 100%;
+}
+
+.container {
+  display: flex;
+  flex-direction: row;
+  flex-wrap: nowrap;
+  width: 100%;
+
+  padding: 0 10px 0 10px;
+  justify-content: space-around;
+}
+
+.leftContent {
+  width: 450px;
+  height: 730px;
+  margin: 10px;
+
+  .topContent {
+    border-radius: 20px 20px 0 0px;
+    height: 280px;
+    background-color: #74deff;
+    margin-button: 5px;
+    background-image: linear-gradient(to right, #4984ff, #74deff);
+  }
+
+  .footContent {
+    border-radius: 20px;
+    margin-top: 20px;
+    height: 430px;
+    background-color: #ffa674;
+    background-image: linear-gradient(to right, #f9e397, #ffa674);
+  }
+}
+
+.rightContent {
+  margin: 10px;
+  width: 950px;
+  height: 730px;
+  background-image: linear-gradient(to right, #4984ff, #74deff);
+  border-radius: 20px;
+}
+
+.title {
+  padding-left: 30px;
+  font-size: 24px;
+  font-weight: 600;
+  color: #fff;
+  height: 40px;
+  line-height: 40px;
+  padding-top: 10px;
+}
+
+.content1 {
+  border-radius: 20px 20px 0 0px;
+  margin-top: 20px;
+  width: 100%;
+  height: 220px;
+  background-color: #fff;
+  background-image: linear-gradient(#c7e3ff, #ffffff);
+
+  .textarea {
+    width: 100%;
+    border: none;
+    background: transparent;
+    padding: 20px;
+    height: 215px;
+  }
+
+  p {
+    padding: 30px;
+    font-size: 16px;
+  }
+}
+
+.content2 {
+  border-radius: 20px;
+  padding: 10px;
+  width: 100%;
+  height: 670px;
+  background-color: #fff;
+  background-image: linear-gradient(#c7e3ff, #ffffff);
+
+  .objectLi > li {
+    width: 845px;
+    height: 250px;
+    // margin: 40px;
+    // background-color: #ffffff;
+    border-radius: 5px;
+    margin: 20px;
+    .courseObject {
+      height: 45px;
+      line-height: 40px;
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      padding: 0 20px;
+      border-bottom: 1px solid #e7e7e7;
+
+      .courseObject1 {
+        height: 30px;
+        line-height: 30px;
+        font-size: 14px;
+        background-color: #6093ff;
+        padding: 0px 16px;
+        color: #fff;
+      }
+
+      .courseObject2 {
+        font-size: 14px;
+        color: #0052d9;
+      }
+    }
+  }
+  // overflow-y: auto
+  .smallContent {
+    //  border-radius: 20px;
+    padding: 10px;
+    width: 100%;
+    height: 200px;
+    background-color: #fff;
+    background-image: linear-gradient(#c7e3ff, #ffffff);
+  }
+  .small > li {
+    // display: inline-flex;
+    width: 650px;
+    height: 150px;
+    // margin: 40px;
+    background-color: #ffffff;
+    border-radius: 5px;
+    margin: 20px;
+
+    .partObject {
+      height: 45px;
+      line-height: 40px;
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      padding: 0 20px;
+      border-bottom: 1px solid #e7e7e7;
+
+      .partObject1 {
+        height: 30px;
+        line-height: 30px;
+        font-size: 14px;
+        background-color: #6093ff;
+        padding: 0px 16px;
+        color: #fff;
+      }
+
+      .partObject2 {
+        font-size: 14px;
+        color: #0052d9;
+      }
+    }
+
+    .partObjectIntroduce {
+      height: 149px;
+      font-size: 16px;
+      padding: 15px;
+    }
+  }
+}
 
-<style lang="scss" scoped></style>
+.content3 {
+  border-radius: 20px;
+  margin-top: 20px;
+  width: 100%;
+  height: 370px;
+  background-color: #fff;
+  background-image: linear-gradient(#ffe9c7, #ffffff);
+}
+</style>

From 2fe4c667fdfab6df0212aaa8e03585ecb215f84a Mon Sep 17 00:00:00 2001
From: xy <2115269706@qq.com>
Date: Wed, 19 Jun 2024 17:24:16 +0800
Subject: [PATCH 3/3] =?UTF-8?q?2024-6-19=E6=8F=90=E4=BA=A4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 package.json                                |   2 +
 pnpm-lock.yaml                              | 426 +++++++++++++++--
 src/api/courseChaptersApi.ts                |  40 +-
 src/api/user/crouse.js                      |  45 +-
 src/utils/alioss.js                         |  31 ++
 src/views/course/CourseObjectives.vue       | 206 ++++-----
 src/views/course/CourseObjectives111.vue    | 476 +++++++++++++++++++
 src/views/course/basicCourseInformation.vue | 479 ++++++++++++--------
 src/views/course/components/courseEdit.vue  | 321 +++++++++++--
 9 files changed, 1641 insertions(+), 385 deletions(-)
 create mode 100644 src/utils/alioss.js
 create mode 100644 src/views/course/CourseObjectives111.vue

diff --git a/package.json b/package.json
index a924365..1457b10 100644
--- a/package.json
+++ b/package.json
@@ -20,12 +20,14 @@
     "3d-force-graph": "^1.73.3",
     "@element-plus/icons-vue": "^2.3.1",
     "@vueuse/core": "^10.9.0",
+    "ali-oss": "^6.20.0",
     "axios": "^1.6.8",
     "echarts": "^5.5.0",
     "echarts-liquidfill": "^3.1.0",
     "element-plus": "^2.6.0",
     "form-data": "^4.0.0",
     "jquery": "^3.7.1",
+    "nanoid": "^5.0.7",
     "nprogress": "^0.2.0",
     "pinia": "^2.1.7",
     "three": "^0.163.0",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index ba06896..ee8071a 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -1,9 +1,5 @@
 lockfileVersion: '6.0'
 
-settings:
-  autoInstallPeers: true
-  excludeLinksFromLockfile: false
-
 dependencies:
   3d-force-graph:
     specifier: ^1.73.3
@@ -14,6 +10,9 @@ dependencies:
   '@vueuse/core':
     specifier: ^10.9.0
     version: 10.10.0(vue@3.4.27)
+  ali-oss:
+    specifier: ^6.20.0
+    version: 6.20.0
   axios:
     specifier: ^1.6.8
     version: 1.7.2
@@ -32,6 +31,9 @@ dependencies:
   jquery:
     specifier: ^3.7.1
     version: 3.7.1
+  nanoid:
+    specifier: ^5.0.7
+    version: 5.0.7
   nprogress:
     specifier: ^0.2.0
     version: 0.2.0
@@ -1489,6 +1491,18 @@ packages:
     hasBin: true
     dev: true
 
+  /address@1.2.2:
+    resolution: {integrity: sha512-4B/qKCfeE/ODUaAUpSwfzazo5x29WD4r3vXiWsB7I2mSDAihwEqKO+g8GELZUQSSAo5e1XTYh3ZVfLyxBc12nA==}
+    engines: {node: '>= 10.0.0'}
+    dev: false
+
+  /agentkeepalive@3.5.3:
+    resolution: {integrity: sha512-yqXL+k5rr8+ZRpOAntkaaRgWgE5o8ESAj5DyRmVTCSoZxXmqemb9Dd7T4i5UzwuERdLAJUy6XzR9zFVuf0kzkw==}
+    engines: {node: '>= 4.0.0'}
+    dependencies:
+      humanize-ms: 1.2.1
+    dev: false
+
   /ajv@6.12.6:
     resolution: {integrity: sha512-j3fVLgvTo527anyYyJOGTYJbG+vnnQYvE0m5mmkc1TK+nxAppkCLMIL0aZ4dblVCNoGShhm+kzE4ZUykBoMg4g==}
     dependencies:
@@ -1507,6 +1521,40 @@ packages:
       uri-js: 4.4.1
     dev: true
 
+  /ali-oss@6.20.0:
+    resolution: {integrity: sha512-TzFXgGlw81sy2JvcCveSYsa2b2+6kv+HA6WTc+cXg6bu8nUAmVPfncRGbn3x2getSOniOFA+TyGy3V4l3Fks+Q==}
+    engines: {node: '>=8'}
+    dependencies:
+      address: 1.2.2
+      agentkeepalive: 3.5.3
+      bowser: 1.9.4
+      copy-to: 2.0.1
+      dateformat: 2.2.0
+      debug: 4.3.5
+      destroy: 1.2.0
+      end-or-error: 1.0.1
+      get-ready: 1.0.0
+      humanize-ms: 1.2.1
+      is-type-of: 1.4.0
+      js-base64: 2.6.4
+      jstoxml: 2.2.9
+      lodash: 4.17.21
+      merge-descriptors: 1.0.3
+      mime: 2.6.0
+      platform: 1.3.6
+      pump: 3.0.0
+      qs: 6.12.1
+      sdk-base: 2.0.1
+      stream-http: 2.8.2
+      stream-wormhole: 1.1.0
+      urllib: 2.41.0
+      utility: 1.18.0
+      xml2js: 0.6.2
+    transitivePeerDependencies:
+      - proxy-agent
+      - supports-color
+    dev: false
+
   /ansi-regex@2.1.1:
     resolution: {integrity: sha512-TIGnTpdo+E3+pCyAluZvtED5p5wCqLdezCyhPZzKPcxvFplEt4i+W7OONCKgeZFT3+y5NZZfOOS/Bdcanm1MYA==}
     engines: {node: '>=0.10.0'}
@@ -1541,6 +1589,10 @@ packages:
       color-convert: 2.0.1
     dev: true
 
+  /any-promise@1.3.0:
+    resolution: {integrity: sha512-7UvmKalWRt1wgjL1RrGxoSJW/0QZFIegpeGvZG9kjp8vrRu55XTHbwnqq2GpXm9uLbcuhxm3IqX9OB4MZR1b2A==}
+    dev: false
+
   /anymatch@3.1.3:
     resolution: {integrity: sha512-KMReFUr0B4t+D+OBkjR3KYqvocp2XaSzO55UcB6mgQMd3KbcE+mWTyvVV7D/zsdEbNnV6acZUutkiHQXvTr1Rw==}
     engines: {node: '>= 8'}
@@ -1723,6 +1775,10 @@ packages:
     resolution: {integrity: sha512-JZOSA7Mo9sNGB8+UjSgzdLtokWAky1zbztM3WRLCbZ70/3cTANmQmOdR7y2g+J0e2WXywy1yS468tY+IruqEww==}
     dev: true
 
+  /bowser@1.9.4:
+    resolution: {integrity: sha512-9IdMmj2KjigRq6oWhmwv1W36pDuA4STQZ8q6YO9um+x07xgYNCD3Oou+WP/3L1HNz7iqythGet3/p4wvc8AAwQ==}
+    dev: false
+
   /brace-expansion@1.1.11:
     resolution: {integrity: sha512-iCuPHDFgrHX7H2vEI/5xpz07zSHB00TpugqhmYtVmMO6518mCuRMoOYFldEBl0g187ufozdaHgWKcYFb61qGiA==}
     dependencies:
@@ -1772,6 +1828,10 @@ packages:
       update-browserslist-db: 1.0.16(browserslist@4.23.1)
     dev: true
 
+  /builtin-status-codes@3.0.0:
+    resolution: {integrity: sha512-HpGFw18DgFWlncDfjTa2rcQ4W88O1mC8e8yZ2AvQY5KDaktSTwo+KRf6nHK6FRI5FyRyb/5T6+TSxfP7QyGsmQ==}
+    dev: false
+
   /bundle-require@4.2.1(esbuild@0.21.5):
     resolution: {integrity: sha512-7Q/6vkyYAwOmQNRw75x+4yRtZCZJXUDmHHlFdkiV0wgv/reNjtJwpu1jPJ0w2kbEpIM0uoKI3S4/f39dU7AjSA==}
     engines: {node: ^12.20.0 || ^14.13.1 || >=16.0.0}
@@ -1806,7 +1866,6 @@ packages:
       function-bind: 1.1.2
       get-intrinsic: 1.2.4
       set-function-length: 1.2.2
-    dev: true
 
   /callsites@3.1.0:
     resolution: {integrity: sha512-P8BjAsXvZS+VIDUI11hHCQEv74YT67YUi5JJFNWIqL235sBmjX4+qx9Muvls5ivyNENctx46xQLQ3aTuE7ssaQ==}
@@ -1949,6 +2008,11 @@ packages:
       - supports-color
     dev: true
 
+  /content-type@1.0.5:
+    resolution: {integrity: sha512-nTjqfcBFEipKdXCv4YDQWCfmcLZKm81ldF0pAopTvyrFGVbcR6P/VAAd5G7N+0tTr8QqiU0tFadD6FK4NtJwOA==}
+    engines: {node: '>= 0.6'}
+    dev: false
+
   /convert-source-map@2.0.0:
     resolution: {integrity: sha512-Kvp459HrV2FEJ1CAsi1Ku+MY3kasH19TFykTz2xWmMeq6bk2NU3XXvfJ+Q61m0xktWwt+1HSYf3JZsTms3aRJg==}
     dev: true
@@ -1958,6 +2022,14 @@ packages:
     engines: {node: '>=0.10.0'}
     dev: true
 
+  /copy-to@2.0.1:
+    resolution: {integrity: sha512-3DdaFaU/Zf1AnpLiFDeNCD4TOWe3Zl2RZaTzUvWiIk5ERzcCodOE20Vqq4fzCbNoHURFHT4/us/Lfq+S2zyY4w==}
+    dev: false
+
+  /core-util-is@1.0.3:
+    resolution: {integrity: sha512-ZQBvi1DcpJ4GDqanjucZ2Hj3wEO5pZDS89BWbkcrvdxksJorwUDDZamX9ldFkp9aw2lmBDLgkObEA4DWNJ9FYQ==}
+    dev: false
+
   /cors@2.8.5:
     resolution: {integrity: sha512-KIHbLJqu73RGr/hnbrO9uBeixNGuvSQjul/jdFvS/KFSIH1hWVd1ng7zOHx+YrEfInLG7q4n6GHQ9cDtxv/P6g==}
     engines: {node: '>= 0.10'}
@@ -2168,6 +2240,10 @@ packages:
       is-data-view: 1.0.1
     dev: true
 
+  /dateformat@2.2.0:
+    resolution: {integrity: sha512-GODcnWq3YGoTnygPfi02ygEiRxqUxpJwuRHjdhJYuxpcZmDq4rjBiXYmbCCzStxo176ixfLT6i4NPwQooRySnw==}
+    dev: false
+
   /dayjs@1.11.11:
     resolution: {integrity: sha512-okzr3f11N6WuqYtZSvm+F776mB41wRZMhKP+hc34YdW+KmtYYK9iqvHSwo2k9FEH3fhGXvOPV6yz2IcSrfRUDg==}
     dev: false
@@ -2185,7 +2261,6 @@ packages:
         optional: true
     dependencies:
       ms: 2.0.0
-    dev: true
 
   /debug@3.2.7:
     resolution: {integrity: sha512-CFjzYYAi4ThfiQvizrFQevTTXHtnCqWfe7x1AhgEscTz6ZbLbfoLRLPugTQyBth6f8ZERVUSyWHFD/7Wu4t1XQ==}
@@ -2208,7 +2283,6 @@ packages:
         optional: true
     dependencies:
       ms: 2.1.2
-    dev: true
 
   /decode-uri-component@0.2.2:
     resolution: {integrity: sha512-FqUYQ+8o158GyGTrMFJms9qh3CqTKvAqgqsTnkLI8sKu0028orqBhxNMFkFen0zGyg6epACD32pjVk58ngIErQ==}
@@ -2219,6 +2293,13 @@ packages:
     resolution: {integrity: sha512-oIPzksmTg4/MriiaYGO+okXDT7ztn/w3Eptv/+gSIdMdKsJo0u4CfYNFJPy+4SKMuCqGw2wxnA+URMg3t8a/bQ==}
     dev: true
 
+  /default-user-agent@1.0.0:
+    resolution: {integrity: sha512-bDF7bg6OSNcSwFWPu4zYKpVkJZQYVrAANMYB8bc9Szem1D0yKdm4sa/rOCs2aC9+2GMqQ7KnwtZRvDhmLF0dXw==}
+    engines: {node: '>= 0.10.0'}
+    dependencies:
+      os-name: 1.0.3
+    dev: false
+
   /define-data-property@1.1.4:
     resolution: {integrity: sha512-rBMvIzlpA8v6E+SJZoo++HAYqsLrkg7MSfIinMPFhmkorw7X+dOXVJQs+QT69zGkzMyfDnIMN2Wid1+NbL3T+A==}
     engines: {node: '>= 0.4'}
@@ -2226,7 +2307,6 @@ packages:
       es-define-property: 1.0.0
       es-errors: 1.3.0
       gopd: 1.0.1
-    dev: true
 
   /define-properties@1.2.1:
     resolution: {integrity: sha512-8QmQKqEASLd5nx0U1B1okLElbUuuttJ/AnYmRXbbbGDWh6uS208EjD4Xqq/I9wK7u0v6O08XhTWnt5XtEbR6Dg==}
@@ -2264,6 +2344,16 @@ packages:
     engines: {node: '>=0.4.0'}
     dev: false
 
+  /destroy@1.2.0:
+    resolution: {integrity: sha512-2sJGJTaXIIaR1w4iJSNoN0hnMY7Gpc/n8D4qSCJw8QqFWXf7cuAgnEHxBpweaVcPevC2l3KpjYCx3NypQQgaJg==}
+    engines: {node: '>= 0.8', npm: 1.2.8000 || >= 1.4.16}
+    dev: false
+
+  /digest-header@1.1.0:
+    resolution: {integrity: sha512-glXVh42vz40yZb9Cq2oMOt70FIoWiv+vxNvdKdU8CwjLad25qHM3trLxhl9bVjdr6WaslIXhWpn0NO8T/67Qjg==}
+    engines: {node: '>= 8.0.0'}
+    dev: false
+
   /dir-glob@3.0.1:
     resolution: {integrity: sha512-WkrWp9GR4KXfKGYzOLmTuGVi1UWFfws377n9cc55/tb6DuqyF6pcQ5AbiHEshaDpY9v6oaSr2XCDidGmMwdzIA==}
     engines: {node: '>=8'}
@@ -2376,7 +2466,6 @@ packages:
 
   /ee-first@1.1.1:
     resolution: {integrity: sha512-WMwm9LhRUo+WUaRN+vRuETqG89IgZphVSNkdFgeb6sS/E4OrDIN7t48CAewSHXc6C8lefD8KKfr5vY61brQlow==}
-    dev: true
 
   /electron-to-chromium@1.4.798:
     resolution: {integrity: sha512-by9J2CiM9KPGj9qfp5U4FcPSbXJG7FNzqnYaY4WLzX+v2PHieVGmnsA4dxfpGE3QEC7JofpPZmn7Vn1B9NR2+Q==}
@@ -2421,6 +2510,17 @@ packages:
     engines: {node: '>= 0.8'}
     dev: true
 
+  /end-of-stream@1.4.4:
+    resolution: {integrity: sha512-+uw1inIHVPQoaVuHzRyXd21icM+cnt4CzD5rW+NC1wjOUSTOs+Te7FOv7AhN7vS9x/oIyhLP5PR1H+phQAHu5Q==}
+    dependencies:
+      once: 1.4.0
+    dev: false
+
+  /end-or-error@1.0.1:
+    resolution: {integrity: sha512-OclLMSug+k2A0JKuf494im25ANRBVW8qsjmwbgX7lQ8P82H21PQ1PWkoYwb9y5yMBS69BPlwtzdIFClo3+7kOQ==}
+    engines: {node: '>= 0.11.14'}
+    dev: false
+
   /entities@1.1.2:
     resolution: {integrity: sha512-f2LZMYl1Fzu7YSBKg+RoROelpOaNrcGmE9AZubeDfrCEia483oW4MI4VyFd5VNHIgQ/7qm1I0wUHK1eJnn2y2w==}
     dev: true
@@ -2501,12 +2601,10 @@ packages:
     engines: {node: '>= 0.4'}
     dependencies:
       get-intrinsic: 1.2.4
-    dev: true
 
   /es-errors@1.3.0:
     resolution: {integrity: sha512-Zf5H2Kxt2xjTvbJvP2ZWLEICxA6j+hAmMzIlypy4xcBg1vKVnx89Wy0GbS+kf5cwCVFFzdCFh2XSCFNULS6csw==}
     engines: {node: '>= 0.4'}
-    dev: true
 
   /es-object-atoms@1.0.0:
     resolution: {integrity: sha512-MZ4iQ6JwHOBQjahnjwaC1ZtIBH+2ohjamzAO3oaHcXYup7qxjF2fixyH+Q71voWHeOkI2q/TnJao/KfXYIZWbw==}
@@ -2919,7 +3017,6 @@ packages:
     engines: {node: '>=0.10.0'}
     dependencies:
       is-extendable: 0.1.1
-    dev: true
 
   /extend-shallow@3.0.2:
     resolution: {integrity: sha512-BwY5b5Ql4+qZoefgMj2NUmx+tehVTH/Kf4k1ZEtOHNFcm2wSxMRo992l6X3TIgni2eZVTZ85xMOjF31fwZAj6Q==}
@@ -3088,6 +3185,15 @@ packages:
       mime-types: 2.1.35
     dev: false
 
+  /formstream@1.5.1:
+    resolution: {integrity: sha512-q7ORzFqotpwn3Y/GBK2lK7PjtZZwJHz9QE9Phv8zb5IrL9ftGLyi2zjGURON3voK8TaZ+mqJKERYN4lrHYTkUQ==}
+    dependencies:
+      destroy: 1.2.0
+      mime: 2.6.0
+      node-hex: 1.0.1
+      pause-stream: 0.0.11
+    dev: false
+
   /fragment-cache@0.2.1:
     resolution: {integrity: sha512-GMBAbW9antB8iZRHLoGw0b3HANt57diZYFO/HL1JGIC1MjKrdmhxvrJbupnVvpys0zsz7yBApXdQyfepKly2kA==}
     engines: {node: '>=0.10.0'}
@@ -3118,7 +3224,6 @@ packages:
 
   /function-bind@1.1.2:
     resolution: {integrity: sha512-7XHNxH7qX9xG5mIwxkhumTox/MIRNcOgDrxWsMt2pAr23WHp6MrRlN7FBSFpCpr+oVO0F744iUgR82nJMfG2SA==}
-    dev: true
 
   /function.prototype.name@1.1.6:
     resolution: {integrity: sha512-Z5kx79swU5P27WEayXM1tBi5Ze/lbIyiNgU3qyXUOf9b2rgXYyF9Dy9Cx+IQv/Lc8WCG6L82zwUPpSS9hGehIg==}
@@ -3148,7 +3253,10 @@ packages:
       has-proto: 1.0.3
       has-symbols: 1.0.3
       hasown: 2.0.2
-    dev: true
+
+  /get-ready@1.0.0:
+    resolution: {integrity: sha512-mFXCZPJIlcYcth+N8267+mghfYN9h3EhsDa6JSnbA3Wrhh/XFpuowviFcsDeYZtKspQyWyJqfs4O6P8CHeTwzw==}
+    dev: false
 
   /get-symbol-description@1.0.2:
     resolution: {integrity: sha512-g0QYk1dZBxGwk+Ngc+ltRH2IBp2f7zBkBMBJZCDerh6EhlhSR6+9irMCuT/09zD6qkarHUSn529sK/yL4S27mg==}
@@ -3246,7 +3354,6 @@ packages:
     resolution: {integrity: sha512-d65bNlIadxvpb/A2abVdlqKqV563juRnZ1Wtk6s1sIR8uNsXR70xqIzVqxVf1eTqDunwT2MkczEeaezCKTZhwA==}
     dependencies:
       get-intrinsic: 1.2.4
-    dev: true
 
   /graceful-fs@4.2.11:
     resolution: {integrity: sha512-RbJ5/jmFcNNCcDV5o9eTnBLJ/HszWV0P73bc+Ff4nS/rJj+YaS6IGyiOL0VoBYX+l1Wrl3k63h/KrH+nhJ0XvQ==}
@@ -3286,17 +3393,14 @@ packages:
     resolution: {integrity: sha512-55JNKuIW+vq4Ke1BjOTjM2YctQIvCT7GFzHwmfZPGo5wnrgkid0YQtnAleFSqumZm4az3n2BS+erby5ipJdgrg==}
     dependencies:
       es-define-property: 1.0.0
-    dev: true
 
   /has-proto@1.0.3:
     resolution: {integrity: sha512-SJ1amZAJUiZS+PhsVLf5tGydlaVB8EdFpaSO4gmiUKUOxk8qzn5AIy4ZeJUmh22znIdk/uMAUT2pl3FxzVUH+Q==}
     engines: {node: '>= 0.4'}
-    dev: true
 
   /has-symbols@1.0.3:
     resolution: {integrity: sha512-l3LCuF6MgDNwTDKkdYGEihYjt5pRPbEg46rtlmnSPlUbgmB8LOIrKJbYYFBSbnPaJexMKtiPO8hmeRjRz2Td+A==}
     engines: {node: '>= 0.4'}
-    dev: true
 
   /has-tostringtag@1.0.2:
     resolution: {integrity: sha512-NqADB8VjPFLM2V0VvHUewwwsw0ZWBaIdgo+ieHtK3hasLz4qeCRjYcqfB6AQrBggRKppKF8L52/VqdVsO47Dlw==}
@@ -3341,7 +3445,6 @@ packages:
     engines: {node: '>= 0.4'}
     dependencies:
       function-bind: 1.1.2
-    dev: true
 
   /he@1.2.0:
     resolution: {integrity: sha512-F/1DnUGPopORZi0ni+CvrCgHQ5FyEAHRLSApuYWMmrbSwoN2Mn/7k+Gl38gJnR7yyDZk6WLXwiGod1JOWNDKGw==}
@@ -3373,6 +3476,19 @@ packages:
       entities: 4.5.0
     dev: true
 
+  /humanize-ms@1.2.1:
+    resolution: {integrity: sha512-Fl70vYtsAFb/C06PTS9dZBo7ihau+Tu/DNCk/OyHhea07S+aeMWpFFkUaXRa8fI+ScZbEI8dfSxwY7gxZ9SAVQ==}
+    dependencies:
+      ms: 2.1.3
+    dev: false
+
+  /iconv-lite@0.4.24:
+    resolution: {integrity: sha512-v3MXnZAcvnywkTUEZomIActle7RXXeedOR31wwl7VlyoXO4Qi9arvSenNQWne1TcRwhCL1HwLI21bEqdpj8/rA==}
+    engines: {node: '>=0.10.0'}
+    dependencies:
+      safer-buffer: 2.1.2
+    dev: false
+
   /ignore@5.3.1:
     resolution: {integrity: sha512-5Fytz/IraMjqpwfd34ke28PTVMjZjJG2MPn5t7OE4eUCUNf8BAa7b5WUS9/Qvr6mwOQS7Mk6vdsMno5he+T8Xw==}
     engines: {node: '>= 4'}
@@ -3416,7 +3532,6 @@ packages:
 
   /inherits@2.0.4:
     resolution: {integrity: sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ==}
-    dev: true
 
   /ini@1.3.8:
     resolution: {integrity: sha512-JV/yugV2uzW5iMRSiZAyDtQd+nxtUnjeLt0acNdw98kKLrvuRVyB80tsREOE7yvGVgalhZ6RNXCmEHkUKBKxew==}
@@ -3436,6 +3551,10 @@ packages:
     engines: {node: '>=12'}
     dev: false
 
+  /ip@1.1.9:
+    resolution: {integrity: sha512-cyRxvOEpNHNtchU3Ln9KC/auJgup87llfQpQ+t5ghoC/UhL16SWzbueiCsdTnWmqAWl7LadfuwhlqmtOaqMHdQ==}
+    dev: false
+
   /is-accessor-descriptor@1.0.1:
     resolution: {integrity: sha512-YBUanLI8Yoihw923YeFUS5fs0fF2f5TSFTNiYAAzhhDscDa3lEqYuz1pDOEP5KvX94I9ey3vsqjJcLVFVU+3QA==}
     engines: {node: '>= 0.10'}
@@ -3485,6 +3604,10 @@ packages:
     engines: {node: '>= 0.4'}
     dev: true
 
+  /is-class-hotfix@0.0.6:
+    resolution: {integrity: sha512-0n+pzCC6ICtVr/WXnN2f03TK/3BfXY7me4cjCAqT8TYXEl0+JBRoqBo94JJHXcyDSLUeWbNX8Fvy5g5RJdAstQ==}
+    dev: false
+
   /is-core-module@2.13.1:
     resolution: {integrity: sha512-hHrIjvZsftOsvKSn2TRYl63zvxsgE0K+0mYMoH6gD4omR5IWB2KynivBQczo3+wF1cCkjzvptnI9Q0sPU66ilw==}
     dependencies:
@@ -3531,7 +3654,6 @@ packages:
   /is-extendable@0.1.1:
     resolution: {integrity: sha512-5BMULNob1vgFX6EjQw5izWDxrecWK9AM72rugNr0TFldMOi0fj6Jk+zeKIt0xGj4cEfQIJth4w3OKWOJ4f+AFw==}
     engines: {node: '>=0.10.0'}
-    dev: true
 
   /is-extendable@1.0.1:
     resolution: {integrity: sha512-arnXMxT1hhoKo9k1LZdmlNyJdDDfy2v0fXjFlmok4+i8ul/6WlbVge9bhM74OpNPQPMGUToDtz+KXa1PneJxOA==}
@@ -3632,6 +3754,14 @@ packages:
       has-symbols: 1.0.3
     dev: true
 
+  /is-type-of@1.4.0:
+    resolution: {integrity: sha512-EddYllaovi5ysMLMEN7yzHEKh8A850cZ7pykrY1aNRQGn/CDjRDE9qEWbIdt7xGEVJmjBXzU/fNnC4ABTm8tEQ==}
+    dependencies:
+      core-util-is: 1.0.3
+      is-class-hotfix: 0.0.6
+      isstream: 0.1.2
+    dev: false
+
   /is-typed-array@1.1.13:
     resolution: {integrity: sha512-uZ25/bUAlUY5fR4OKT4rZQEBrzQWYV9ZJYGGsUmEJ6thodVJ1HX64ePQ6Z0qPWP+m+Uq6e9UugrE38jeYsDSMw==}
     engines: {node: '>= 0.4'}
@@ -3652,7 +3782,6 @@ packages:
 
   /isarray@1.0.0:
     resolution: {integrity: sha512-VLghIWNM6ELQzo7zwmcg0NmTVyWKYjvIeM83yjp0wRDTmUnrM678fQbcKBo6n2CJEF0szoG//ytg+TKla89ALQ==}
-    dev: true
 
   /isarray@2.0.5:
     resolution: {integrity: sha512-xHjhDr3cNBK0BzdUJSPXZntQUx/mwMS5Rw4A7lPJ90XGAO6ISP/ePDNuo0vhqOZU+UD5JoodwCAAoZQd3FeAKw==}
@@ -3674,13 +3803,16 @@ packages:
     engines: {node: '>=0.10.0'}
     dev: true
 
+  /isstream@0.1.2:
+    resolution: {integrity: sha512-Yljz7ffyPbrLpLngrMtZ7NduUgVvi6wG9RJ9IUcyCd59YQ911PBJphODUcbOVbqYfxe1wuYf/LJ8PauMRwsM/g==}
+    dev: false
+
   /jquery@3.7.1:
     resolution: {integrity: sha512-m4avr8yL8kmFN8psrbFFFmB/If14iN5o9nw/NgnnM+kybDJpRsAynV2BsfpTYrTRysYUdADVD7CkUUizgkpLfg==}
     dev: false
 
   /js-base64@2.6.4:
     resolution: {integrity: sha512-pZe//GGmwJndub7ZghVHz7vjb2LgC1m8B07Au3eYqeqv9emhESByMXxaEgkUkEqJe87oBbSniGYoQNIBklc7IQ==}
-    dev: true
 
   /js-tokens@4.0.0:
     resolution: {integrity: sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ==}
@@ -3744,6 +3876,10 @@ packages:
       graceful-fs: 4.2.11
     dev: true
 
+  /jstoxml@2.2.9:
+    resolution: {integrity: sha512-OYWlK0j+roh+eyaMROlNbS5cd5R25Y+IUpdl7cNdB8HNrkgwQzIS7L9MegxOiWNBj9dQhA/yAxiMwCC5mwNoBw==}
+    dev: false
+
   /kapsule@1.14.5:
     resolution: {integrity: sha512-H0iSpTynUzZw3tgraDmReprpFRmH5oP5GPmaNsurSwLx2H5iCpOMIkp5q+sfhB4Tz/UJd1E1IbEE9Z6ksnJ6RA==}
     engines: {node: '>=12'}
@@ -3889,6 +4025,10 @@ packages:
     engines: {node: '>=18'}
     dev: true
 
+  /merge-descriptors@1.0.3:
+    resolution: {integrity: sha512-gaNvAS7TZ897/rVaZ0nMtAyxNyi/pdbjbAwUpFQpN70GqnVfOiXpeUUMKRBmzXaSQ8DdTX4/0ms62r2K+hE6mQ==}
+    dev: false
+
   /merge-options@1.0.1:
     resolution: {integrity: sha512-iuPV41VWKWBIOpBsjoxjDZw8/GbSfZ2mk7N1453bwMrfzdrIk7EzBd+8UVR6rkw67th7xnk9Dytl3J+lHPdxvg==}
     engines: {node: '>=4'}
@@ -3942,6 +4082,12 @@ packages:
       mime-db: 1.52.0
     dev: false
 
+  /mime@2.6.0:
+    resolution: {integrity: sha512-USPkMeET31rOMiarsBNIHZKLGgvKc/LrjofAnBlOttf5ajRvqiRA8QsenbcooctK6d6Ts6aqZXBA+XbkKthiQg==}
+    engines: {node: '>=4.0.0'}
+    hasBin: true
+    dev: false
+
   /minimatch@3.1.2:
     resolution: {integrity: sha512-J7p63hRiAjw1NDEww1W7i37+ByIrOWO5XQQAzZ3VOcL0PNybwpfmV/N05zFAzwQ9USyEcX6t3UO+K5aqBQOIHw==}
     dependencies:
@@ -3957,7 +4103,6 @@ packages:
 
   /minimist@1.2.8:
     resolution: {integrity: sha512-2yyAR8qBkN3YuheJanUpWC5U3bb5osDywNB8RzDVlDwDHbocAJveqqj1u8+SVD7jkWT4yvsHCpWqqWqAxb0zCA==}
-    dev: true
 
   /mixin-deep@1.3.2:
     resolution: {integrity: sha512-WRoDn//mXBiJ1H40rqa3vH0toePwSsGb45iInWlTySa+Uu4k3tYUSxa2v1KqAiLtvlrSzaExqS1gtk96A9zvEA==}
@@ -3967,6 +4112,13 @@ packages:
       is-extendable: 1.0.1
     dev: true
 
+  /mkdirp@0.5.6:
+    resolution: {integrity: sha512-FP+p8RB8OWpF3YZBCrP5gtADmtXApB5AMLn+vdyA+PyxCjrCs00mjyUozssO33cwDeT3wNGdLxJ5M//YqtHAJw==}
+    hasBin: true
+    dependencies:
+      minimist: 1.2.8
+    dev: false
+
   /mockjs@1.1.0:
     resolution: {integrity: sha512-eQsKcWzIaZzEZ07NuEyO4Nw65g0hdWAyurVol1IPl1gahRwY+svqzfgfey8U8dahLwG44d6/RwEzuK52rSa/JQ==}
     hasBin: true
@@ -3976,25 +4128,36 @@ packages:
 
   /ms@2.0.0:
     resolution: {integrity: sha512-Tpp60P6IUJDTuOq/5Z8cdskzJujfwqfOTkrwIwj7IRISpnkJnT6SyJ4PCPnGMoFjC9ddhal5KVIYtAt97ix05A==}
-    dev: true
 
   /ms@2.1.2:
     resolution: {integrity: sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w==}
-    dev: true
 
   /ms@2.1.3:
     resolution: {integrity: sha512-6FlzubTLZG3J2a/NVCAleEhjzq5oxgHyaCU9yYXvcLsvoVaHJq/s5xXI6/XXP6tz7R9xAOtHnSO/tXtF3WRTlA==}
-    dev: true
 
   /muggle-string@0.3.1:
     resolution: {integrity: sha512-ckmWDJjphvd/FvZawgygcUeQCxzvohjFO5RxTjj4eq8kw359gFF3E1brjfI+viLMxss5JrHTDRHZvu2/tuy0Qg==}
     dev: true
 
+  /mz@2.7.0:
+    resolution: {integrity: sha512-z81GNO7nnYMEhrGh9LeymoE4+Yr0Wn5McHIZMK5cfQCl+NDX08sCZgUc9/6MHni9IWuFLm1Z3HTCXu2z9fN62Q==}
+    dependencies:
+      any-promise: 1.3.0
+      object-assign: 4.1.1
+      thenify-all: 1.6.0
+    dev: false
+
   /nanoid@3.3.7:
     resolution: {integrity: sha512-eSRppjcPIatRIMC1U6UngP8XFcz8MQWGQdt1MTBQ7NaAmvXDfvNxbvWV3x2y6CdEUciCSsDHDQZbhYaB8QEo2g==}
     engines: {node: ^10 || ^12 || ^13.7 || ^14 || >=15.0.1}
     hasBin: true
 
+  /nanoid@5.0.7:
+    resolution: {integrity: sha512-oLxFY2gd2IqnjcYyOXD8XGCftpGtZP2AbHbOkthDkvRywH5ayNtPVy9YlOPcHckXzbLTCHpkb7FB+yuxKV13pQ==}
+    engines: {node: ^18 || >=20}
+    hasBin: true
+    dev: false
+
   /nanomatch@1.2.13:
     resolution: {integrity: sha512-fpoe2T0RbHwBTBUOftAfBPaDEi06ufaUai0mE6Yn1kacc3SnTErfb/h+X94VXzI64rKFHYImXSvdwGGCmwOqCA==}
     engines: {node: '>=0.10.0'}
@@ -4048,6 +4211,11 @@ packages:
     resolution: {integrity: sha512-h25UdUN/g8U7y29TzQtRm/GvGr70lK37yQPvPKXXuVfs7gCm82WipYFZcksQfeKumtOemAzBIcT7lzzyK/edLw==}
     dev: false
 
+  /node-hex@1.0.1:
+    resolution: {integrity: sha512-iwpZdvW6Umz12ICmu9IYPRxg0tOLGmU3Tq2tKetejCj3oZd7b2nUXwP3a7QA5M9glWy8wlPS1G3RwM/CdsUbdQ==}
+    engines: {node: '>=8.0.0'}
+    dev: false
+
   /node-releases@2.0.14:
     resolution: {integrity: sha512-y10wOWt8yZpqXmOgRo77WaHEmhYQYGNA6y421PKsKYWEK8aW+cqAphborZDhqfyKrbZEN92CN1X2KbafY2s7Yw==}
     dev: true
@@ -4074,7 +4242,6 @@ packages:
   /object-assign@4.1.1:
     resolution: {integrity: sha512-rJgTQnkUnH1sFw8yT6VSU3zD3sWmu6sZhIseY8VX+GRu3P6F7Fu+JNDoXfklElbLJSnc3FUQHVe4cU5hj+BcUg==}
     engines: {node: '>=0.10.0'}
-    dev: true
 
   /object-copy@0.1.0:
     resolution: {integrity: sha512-79LYn6VAb63zgtmAteVOWo9Vdj71ZVBy3Pbse+VqxDpEP83XuujMrGqHIwAXJ5I/aM0zU7dIyIAhifVTPrNItQ==}
@@ -4087,7 +4254,6 @@ packages:
 
   /object-inspect@1.13.1:
     resolution: {integrity: sha512-5qoj1RUiKOMsCCNLV1CBiPYE10sziTsnmNxkAI/rZhiD63CF7IqdFGC/XzjWjpSgLf0LxXX3bDFIh0E18f6UhQ==}
-    dev: true
 
   /object-keys@1.1.1:
     resolution: {integrity: sha512-NuAESUOUMrlIXOfHKzD6bpPu3tYt3xvjNdRIQ+FeT0lNb4K8WR70CaDxhuNguS2XG+GjkyMwOzsN5ZktImfhLA==}
@@ -4157,7 +4323,6 @@ packages:
     resolution: {integrity: sha512-lNaJgI+2Q5URQBkccEKHTQOPaXdUxnZZElQTZY0MFUAuaEqe1E+Nyvgdz/aIyNi6Z9MzO5dv1H8n58/GELp3+w==}
     dependencies:
       wrappy: 1.0.2
-    dev: true
 
   /optionator@0.9.4:
     resolution: {integrity: sha512-6IpQ7mKUxRcZNLIObR0hz7lxsapSSIYNZJwXPGeF0mTVqGKFIXj1DQcMoT22S3ROcLyY/rz0PWaWZ9ayWmad9g==}
@@ -4171,6 +4336,23 @@ packages:
       word-wrap: 1.2.5
     dev: true
 
+  /os-name@1.0.3:
+    resolution: {integrity: sha512-f5estLO2KN8vgtTRaILIgEGBoBrMnZ3JQ7W9TMZCnOIGwHe8TRGSpcagnWDo+Dfhd/z08k9Xe75hvciJJ8Qaew==}
+    engines: {node: '>=0.10.0'}
+    hasBin: true
+    dependencies:
+      osx-release: 1.1.0
+      win-release: 1.1.1
+    dev: false
+
+  /osx-release@1.1.0:
+    resolution: {integrity: sha512-ixCMMwnVxyHFQLQnINhmIpWqXIfS2YOXchwQrk+OFzmo6nDjQ0E4KXAyyUh0T0MZgV4bUhkRrAbVqlE4yLVq4A==}
+    engines: {node: '>=0.10.0'}
+    hasBin: true
+    dependencies:
+      minimist: 1.2.8
+    dev: false
+
   /p-limit@3.1.0:
     resolution: {integrity: sha512-TYOanM3wGwNGsZN2cVTYPArw454xnXj5qmWF1bEoAc4+cU/ol7GVh7odevjp1FNHduHc3KZMcFduxU5Xc6uJRQ==}
     engines: {node: '>=10'}
@@ -4248,6 +4430,12 @@ packages:
     resolution: {integrity: sha512-sTitTPYnn23esFR3RlqYBWn4c45WGeLcsKzQiUpXJAyfcWkolvlYpV8FLo7JishK946oQwMFUCHXQ9AjGPKExw==}
     dev: true
 
+  /pause-stream@0.0.11:
+    resolution: {integrity: sha512-e3FBlXLmN/D1S+zHzanP4E/4Z60oFAa3O051qt1pxa7DEJWKAyil6upYVXCWadEnuoqa4Pkc9oUx9zsxYeRv8A==}
+    dependencies:
+      through: 2.3.8
+    dev: false
+
   /picocolors@1.0.1:
     resolution: {integrity: sha512-anP1Z8qwhkbmu7MFP5iTt+wQKXgwzf7zTyGlcdzabySa9vd0Xt392U0rVmz9poOaBj0uHJKyyo9/upk0HrEQew==}
 
@@ -4274,6 +4462,10 @@ packages:
       vue-demi: 0.14.8(vue@3.4.27)
     dev: false
 
+  /platform@1.3.6:
+    resolution: {integrity: sha512-fnWVljUchTro6RiCFvCXBbNhJc2NijN7oIQxbwsyL0buWJPG85v81ehlHI9fXrJsMNgTofEoWIQeClKpgxFLrg==}
+    dev: false
+
   /polished@4.3.1:
     resolution: {integrity: sha512-OBatVyC/N7SCW/FaDHrSd+vn0o5cS855TOmYi4OkdWUMSJCET/xip//ch8xGUvtr3i44X9LVyWwQlRMTN3pwSA==}
     engines: {node: '>=10'}
@@ -4435,15 +4627,33 @@ packages:
     hasBin: true
     dev: true
 
+  /process-nextick-args@2.0.1:
+    resolution: {integrity: sha512-3ouUOpQhtgrbOa17J7+uxOTpITYWaGP7/AhoR3+A+/1e9skrzelGi/dXzEYyvbxubEF6Wn2ypscTKiKJFFn1ag==}
+    dev: false
+
   /proxy-from-env@1.1.0:
     resolution: {integrity: sha512-D+zkORCbA9f1tdWRK0RaCR3GPv50cMxcrz4X8k5LTSUD1Dkw47mKJEZQNunItRTkWwgtaUSo1RVFRIG9ZXiFYg==}
     dev: false
 
+  /pump@3.0.0:
+    resolution: {integrity: sha512-LwZy+p3SFs1Pytd/jYct4wpv49HiYCqd9Rlc5ZVdk0V+8Yzv6jR5Blk3TRmPL1ft69TxP0IMZGJ+WPFU2BFhww==}
+    dependencies:
+      end-of-stream: 1.4.4
+      once: 1.4.0
+    dev: false
+
   /punycode@2.3.1:
     resolution: {integrity: sha512-vYt7UD1U9Wg6138shLtLOvdAu+8DsC/ilFtEVHcH+wydcSpNE20AfSOduf6MkRFahL5FY7X1oU7nKVZFtfq8Fg==}
     engines: {node: '>=6'}
     dev: true
 
+  /qs@6.12.1:
+    resolution: {integrity: sha512-zWmv4RSuB9r2mYQw3zxQuHWeU+42aKi1wWig/j4ele4ygELZ7PEO6MM7rim9oAQH2A5MWfsAVf/jPvTPgCbvUQ==}
+    engines: {node: '>=0.6'}
+    dependencies:
+      side-channel: 1.0.6
+    dev: false
+
   /query-string@4.3.4:
     resolution: {integrity: sha512-O2XLNDBIg1DnTOa+2XrIwSiXEV8h2KImXUnjhhn2+UsvZ+Es2uyd5CCRTNQlDGbzUQOW3aYCBx9rVA6dzsiY7Q==}
     engines: {node: '>=0.10.0'}
@@ -4456,6 +4666,18 @@ packages:
     resolution: {integrity: sha512-NuaNSa6flKT5JaSYQzJok04JzTL1CA6aGhv5rfLW3PgqA+M2ChpZQnAC8h8i4ZFkBS8X5RqkDBHA7r4hej3K9A==}
     dev: true
 
+  /readable-stream@2.3.8:
+    resolution: {integrity: sha512-8p0AUk4XODgIewSi0l8Epjs+EVnWiK7NoDIEGU0HhE7+ZyY8D1IMY7odu5lRrFXGg71L15KG8QrPmum45RTtdA==}
+    dependencies:
+      core-util-is: 1.0.3
+      inherits: 2.0.4
+      isarray: 1.0.0
+      process-nextick-args: 2.0.1
+      safe-buffer: 5.1.2
+      string_decoder: 1.1.1
+      util-deprecate: 1.0.2
+    dev: false
+
   /readable-stream@3.6.2:
     resolution: {integrity: sha512-9u/sniCrY3D5WdsERHzHE4G2YCXqoG5FTHUiCC4SIbr6XcLZBY05ya9EKjYek9O5xOAwjGq+1JdGBAS7Q9ScoA==}
     engines: {node: '>= 6'}
@@ -4602,6 +4824,10 @@ packages:
       isarray: 2.0.5
     dev: true
 
+  /safe-buffer@5.1.2:
+    resolution: {integrity: sha512-Gd2UZBJDkXlY7GbJxfsE8/nvKkUEU1G38c1siN6QP6a9PT9MmHB8GnpscSmMJSoF8LOIrt8ud/wPtojys4G6+g==}
+    dev: false
+
   /safe-buffer@5.2.1:
     resolution: {integrity: sha512-rp3So07KcdmmKbGvgaNxQSJr7bGVSVk5S9Eq1F+ppbRo70+YeaDxkw5Dd8NPN+GD6bjnYm2VuPuCXmpuYvmCXQ==}
     dev: true
@@ -4621,6 +4847,10 @@ packages:
       ret: 0.1.15
     dev: true
 
+  /safer-buffer@2.1.2:
+    resolution: {integrity: sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg==}
+    dev: false
+
   /sass-loader@14.2.1(sass@1.77.4):
     resolution: {integrity: sha512-G0VcnMYU18a4N7VoNDegg2OuMjYtxnqzQWARVWCIVSZwJeiL9kg8QMsuIZOplsJgTzZLF6jGxI3AClj8I9nRdQ==}
     engines: {node: '>= 18.12.0'}
@@ -4656,6 +4886,21 @@ packages:
       source-map-js: 1.2.0
     dev: true
 
+  /sax@1.4.1:
+    resolution: {integrity: sha512-+aWOz7yVScEGoKNd4PA10LZ8sk0A/z5+nXQG5giUO5rprX9jgYsTdov9qCchZiPIZezbZH+jRut8nPodFAX4Jg==}
+    dev: false
+
+  /sdk-base@2.0.1:
+    resolution: {integrity: sha512-eeG26wRwhtwYuKGCDM3LixCaxY27Pa/5lK4rLKhQa7HBjJ3U3Y+f81MMZQRsDw/8SC2Dao/83yJTXJ8aULuN8Q==}
+    dependencies:
+      get-ready: 1.0.0
+    dev: false
+
+  /semver@5.7.2:
+    resolution: {integrity: sha512-cBznnQ9KjJqU67B52RMC65CMarK2600WFnbkcaiwWq3xy/5haFJlshgnpjovMVJ+Hff49d8GEn0b87C5pDQ10g==}
+    hasBin: true
+    dev: false
+
   /semver@6.3.1:
     resolution: {integrity: sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==}
     hasBin: true
@@ -4677,7 +4922,6 @@ packages:
       get-intrinsic: 1.2.4
       gopd: 1.0.1
       has-property-descriptors: 1.0.2
-    dev: true
 
   /set-function-name@2.0.2:
     resolution: {integrity: sha512-7PGFlmtwsEADb0WYyvCMa1t+yke6daIG4Wirafur5kcf+MhUnPms1UeR0CKQdTZD81yESwMHbtn+TR+dMviakQ==}
@@ -4719,7 +4963,6 @@ packages:
       es-errors: 1.3.0
       get-intrinsic: 1.2.4
       object-inspect: 1.13.1
-    dev: true
 
   /signal-exit@4.1.0:
     resolution: {integrity: sha512-bzyZ1e88w9O1iNJbKnOlvYTrWPDl46O1bG0D3XInv+9tkPrxrN8jUUTiFlDkkmKWgn1M6CfIA13SuGqOa9Korw==}
@@ -4825,7 +5068,21 @@ packages:
   /statuses@1.5.0:
     resolution: {integrity: sha512-OpZ3zP+jT1PI7I8nemJX4AKmAX070ZkYPVWV/AaKTJl+tXCTGyVdC1a4SL8RUQYEwk/f34ZX8UTykN68FwrqAA==}
     engines: {node: '>= 0.6'}
-    dev: true
+
+  /stream-http@2.8.2:
+    resolution: {integrity: sha512-QllfrBhqF1DPcz46WxKTs6Mz1Bpc+8Qm6vbqOpVav5odAXwbyzwnEczoWqtxrsmlO+cJqtPrp/8gWKWjaKLLlA==}
+    dependencies:
+      builtin-status-codes: 3.0.0
+      inherits: 2.0.4
+      readable-stream: 2.3.8
+      to-arraybuffer: 1.0.1
+      xtend: 4.0.2
+    dev: false
+
+  /stream-wormhole@1.1.0:
+    resolution: {integrity: sha512-gHFfL3px0Kctd6Po0M8TzEvt3De/xu6cnRrjlfYNhwbhLPLwigI2t1nc6jrzNuaYg5C4YF78PPFuQPzRiqn9ew==}
+    engines: {node: '>=4.0.0'}
+    dev: false
 
   /strict-uri-encode@1.1.0:
     resolution: {integrity: sha512-R3f198pcvnB+5IpnBlRkphuE9n46WyVl8I39W/ZUTZLz4nqSP/oLYUrcnJrw462Ds8he4YKMov2efsTIw1BDGQ==}
@@ -4868,6 +5125,12 @@ packages:
       es-object-atoms: 1.0.0
     dev: true
 
+  /string_decoder@1.1.1:
+    resolution: {integrity: sha512-n/ShnvDi6FHbbVfviro+WojiFzv+s8MPMHBczVePfUpDJLwoLT0ht1l4YwBCbi8pJAveEEdnkHyPyTP/mzRfwg==}
+    dependencies:
+      safe-buffer: 5.1.2
+    dev: false
+
   /string_decoder@1.3.0:
     resolution: {integrity: sha512-hkRX8U1WjJFd8LsDJ2yQ/wWWxaopEsABU1XfkM8A+j0+85JAGppt16cr1Whg6KIbb4okU6Mql6BOj+uup/wKeA==}
     dependencies:
@@ -5188,6 +5451,19 @@ packages:
     resolution: {integrity: sha512-N+8UisAXDGk8PFXP4HAzVR9nbfmVJ3zYLAWiTIoqC5v5isinhr+r5uaO8+7r3BMfuNIufIsA7RdpVgacC2cSpw==}
     dev: true
 
+  /thenify-all@1.6.0:
+    resolution: {integrity: sha512-RNxQH/qI8/t3thXJDwcstUO4zeqo64+Uy/+sNVRBx4Xn2OX+OZ9oP+iJnNFqplFra2ZUVeKCSa2oVWi3T4uVmA==}
+    engines: {node: '>=0.8'}
+    dependencies:
+      thenify: 3.3.1
+    dev: false
+
+  /thenify@3.3.1:
+    resolution: {integrity: sha512-RVZSIV5IG10Hk3enotrhvz0T9em6cyHBLkH/YAZuKqd8hRkKhSfCGIcP2KUY0EPxndzANBmNllzWPwak+bheSw==}
+    dependencies:
+      any-promise: 1.3.0
+    dev: false
+
   /three-forcegraph@1.41.14(three@0.163.0):
     resolution: {integrity: sha512-W/cZElLXO0l6ffdMmDakh4bUGSYuSv/YxInOHMN9KAQgDwJ8904SOBh8qkTnGu7UPsi0mAsrUgkfViW8heloTA==}
     engines: {node: '>=12'}
@@ -5224,10 +5500,18 @@ packages:
     resolution: {integrity: sha512-HlMgCb2TF/dTLRtknBnjUTsR8FsDqBY43itYop2+Zg822I+Kd0Ua2vs8CvfBVefXkBdNDrLMoRTGCIIpfCuDew==}
     dev: false
 
+  /through@2.3.8:
+    resolution: {integrity: sha512-w89qg7PI8wAdvX60bMDP+bFoD5Dvhm9oLheFp5O4a2QF0cSBGsBX4qZmadPMvVqlLJBBci+WqGGOAPvcDeNSVg==}
+    dev: false
+
   /tinycolor2@1.6.0:
     resolution: {integrity: sha512-XPaBkWQJdsf3pLKJV9p4qN/S+fm2Oj8AIPo1BTUhg5oxkvm9+SVEGFdhyOz7tTdUTfvxMiAs4sp6/eZO2Ew+pw==}
     dev: false
 
+  /to-arraybuffer@1.0.1:
+    resolution: {integrity: sha512-okFlQcoGTi4LQBG/PgSYblw9VOyptsz2KJZqc6qtgGdes8VktzUQkj4BI2blit072iS8VODNcMA+tvnS9dnuMA==}
+    dev: false
+
   /to-fast-properties@2.0.0:
     resolution: {integrity: sha512-/OaKK0xYrs3DmxRYqL/yDc+FxFUVYhDlXMhRmv3z915w2HF1tnN1omB354j8VUGO/hbRzyD6Y3sA7v7GS/ceog==}
     engines: {node: '>=4'}
@@ -5385,6 +5669,13 @@ packages:
     resolution: {integrity: sha512-JlCMO+ehdEIKqlFxk6IfVoAUVmgz7cU7zD/h9XZ0qzeosSHmUJVOzSQvvYSYWXkFXC+IfLKSIffhv0sVZup6pA==}
     dev: true
 
+  /unescape@1.0.1:
+    resolution: {integrity: sha512-O0+af1Gs50lyH1nUu3ZyYS1cRh01Q/kUKatTOkSs7jukXE6/NebucDVxyiDsA9AQ4JC1V1jUH9EO8JX2nMDgGQ==}
+    engines: {node: '>=0.10.0'}
+    dependencies:
+      extend-shallow: 2.0.1
+    dev: false
+
   /union-value@1.0.1:
     resolution: {integrity: sha512-tJfXmxMeWYnczCVs7XAEvIV7ieppALdyepWMkHkwciRpZraG/xwT+s2JN8+pr1+8jCRf80FFzvr+MpQeeoF4Xg==}
     engines: {node: '>=0.10.0'}
@@ -5435,6 +5726,33 @@ packages:
     deprecated: Please see https://github.com/lydell/urix#deprecated
     dev: true
 
+  /urllib@2.41.0:
+    resolution: {integrity: sha512-pNXdxEv52L67jahLT+/7QE+Fup1y2Gc6EdmrAhQ6OpQIC2rl14oWwv9hvk1GXOZqEnJNwRXHABuwgPOs1CtL7g==}
+    engines: {node: '>= 0.10.0'}
+    peerDependencies:
+      proxy-agent: ^5.0.0
+    peerDependenciesMeta:
+      proxy-agent:
+        optional: true
+    dependencies:
+      any-promise: 1.3.0
+      content-type: 1.0.5
+      debug: 2.6.9
+      default-user-agent: 1.0.0
+      digest-header: 1.1.0
+      ee-first: 1.1.1
+      formstream: 1.5.1
+      humanize-ms: 1.2.1
+      iconv-lite: 0.4.24
+      ip: 1.1.9
+      pump: 3.0.0
+      qs: 6.12.1
+      statuses: 1.5.0
+      utility: 1.18.0
+    transitivePeerDependencies:
+      - supports-color
+    dev: false
+
   /use@3.1.1:
     resolution: {integrity: sha512-cwESVXlO3url9YWlFW/TA9cshCEhtu7IKJ/p5soJ/gGpj7vbvFrAY/eIioQ6Dw23KjZhYgiIo8HOs1nQ2vr/oQ==}
     engines: {node: '>=0.10.0'}
@@ -5442,7 +5760,17 @@ packages:
 
   /util-deprecate@1.0.2:
     resolution: {integrity: sha512-EPD5q1uXyFxJpCrLnCc1nHnq3gOa6DZBocAIiI2TaSCA7VCJ1UJDMagCzIkXNsUYfD1daK//LTEQ8xiIbrHtcw==}
-    dev: true
+
+  /utility@1.18.0:
+    resolution: {integrity: sha512-PYxZDA+6QtvRvm//++aGdmKG/cI07jNwbROz0Ql+VzFV1+Z0Dy55NI4zZ7RHc9KKpBePNFwoErqIuqQv/cjiTA==}
+    engines: {node: '>= 0.12.0'}
+    dependencies:
+      copy-to: 2.0.1
+      escape-html: 1.0.3
+      mkdirp: 0.5.6
+      mz: 2.7.0
+      unescape: 1.0.1
+    dev: false
 
   /utils-merge@1.0.1:
     resolution: {integrity: sha512-pMZTvIkT1d+TFGvDOqodOclx0QWkkgi6Tdoa8gC8ffGAAqz9pzPTZWAybbsHHoED/ztMtkv/VoYTYyShUn81hA==}
@@ -5677,6 +6005,13 @@ packages:
       isexe: 2.0.0
     dev: true
 
+  /win-release@1.1.1:
+    resolution: {integrity: sha512-iCRnKVvGxOQdsKhcQId2PXV1vV3J/sDPXKA4Oe9+Eti2nb2ESEsYHRYls/UjoUW3bIc5ZDO8dTH50A/5iVN+bw==}
+    engines: {node: '>=0.10.0'}
+    dependencies:
+      semver: 5.7.2
+    dev: false
+
   /word-wrap@1.2.5:
     resolution: {integrity: sha512-BN22B5eaMMI9UMtjrGd5g5eCYPpCPDUy0FJXbYsaT5zYxjFOckS53SQDE3pWkVoWpHXVb3BrYcEN4Twa55B5cA==}
     engines: {node: '>=0.10.0'}
@@ -5684,7 +6019,6 @@ packages:
 
   /wrappy@1.0.2:
     resolution: {integrity: sha512-l4Sp/DRseor9wL6EvV2+TuQn63dMkPjZ/sp9XkghTEbV9KlPS1xUsZ3u7/IQO4wxtcFB4bgpQPRcR3QCvezPcQ==}
-    dev: true
 
   /write-file-atomic@5.0.1:
     resolution: {integrity: sha512-+QU2zd6OTD8XWIJCbffaiQeH9U73qIqafo1x6V1snCWYGJf6cVE0cDR4D8xRzcEnfI21IFrUPzPGtcPf8AC+Rw==}
@@ -5699,6 +6033,24 @@ packages:
     engines: {node: '>=12'}
     dev: true
 
+  /xml2js@0.6.2:
+    resolution: {integrity: sha512-T4rieHaC1EXcES0Kxxj4JWgaUQHDk+qwHcYOCFHfiwKz7tOVPLq7Hjq9dM1WCMhylqMEfP7hMcOIChvotiZegA==}
+    engines: {node: '>=4.0.0'}
+    dependencies:
+      sax: 1.4.1
+      xmlbuilder: 11.0.1
+    dev: false
+
+  /xmlbuilder@11.0.1:
+    resolution: {integrity: sha512-fDlsI/kFEx7gLvbecc0/ohLG50fugQp8ryHzMTuW9vSa1GJ0XYWKnhsUx7oie3G98+r56aTQIUB4kht42R3JvA==}
+    engines: {node: '>=4.0'}
+    dev: false
+
+  /xtend@4.0.2:
+    resolution: {integrity: sha512-LKYU1iAXJXUgAXn9URjiu+MWhyUXHsvfp7mcuYm9dSUKK0/CjtrUwFAxD82/mCWbtLsGjFIad0wIsod4zrTAEQ==}
+    engines: {node: '>=0.4'}
+    dev: false
+
   /yallist@3.1.1:
     resolution: {integrity: sha512-a4UGQaWPH59mOXUYnAG2ewncQS4i4F43Tv3JoAM+s2VDAmS9NsK8GpDMLrCHPksFT7h3K6TOoUNn2pb7RoXx4g==}
     dev: true
@@ -5713,3 +6065,7 @@ packages:
     dependencies:
       tslib: 2.3.0
     dev: false
+
+settings:
+  autoInstallPeers: true
+  excludeLinksFromLockfile: false
diff --git a/src/api/courseChaptersApi.ts b/src/api/courseChaptersApi.ts
index 10135cd..fc1c162 100644
--- a/src/api/courseChaptersApi.ts
+++ b/src/api/courseChaptersApi.ts
@@ -50,4 +50,42 @@ export function getOrogramObjectiveApi() {
     setTimeout(() => resolve(data), 500 * Math.random())
   })
 }
-
+// 获取课程列表
+export const getCourseList = (params:any) => {
+  return request({
+    url: '/course_objectives/list/' + params.id,
+    params
+  })
+}
+// 添加分目标
+export const addCourse = (data:any) => {
+  return request({
+    url:'/objective_contents/addcontent',
+    method:"POST",
+    data
+  })
+}
+// 编辑目标
+export const editCourse = (data: any) => {
+  return request({
+    url: '/objective_contents/update',
+    method: "PUT",
+    data
+  })
+}
+//删除课程目标
+export const deleteCourse = (params: any) => {
+  return request({
+    url: '/objective_contents/' + params.id,
+    method: "DELETE",
+  })
+}
+// /objective_contents/
+// 获取详情
+export const getCourseInfo = (params: any) => {
+  return request({
+    url: '/objective_contents/' + params.id,
+    method: "get",
+    params
+  })
+}
\ No newline at end of file
diff --git a/src/api/user/crouse.js b/src/api/user/crouse.js
index b2f245d..581e336 100644
--- a/src/api/user/crouse.js
+++ b/src/api/user/crouse.js
@@ -1,28 +1,33 @@
 import request from '@/utils/request'
-export const getCourseListApi = () => {
-  return request.get('/coursesteacher/page?teacherId=2140110334')
+// 获取课程列表
+export const getCourseListApi = (params) => {
+  return request.get('/coursesteacher/page', {
+    params,
+  })
 }
-export const editCourseApi = () => {
-  return request.put('/coursesTeacher')
+// 编辑课程
+export const editCourseApi = (params) => {
+  return request.put('/coursesteacher', params)
 }
+// 添加课程
 export const addCourseApi = (data) => {
-  return request.post('/courseTeacher/addCourse', data)
+  return request.post(`/coursesteacher/addcourse`, data)
 }
 
-export const fnName = (data) => {
-  return request({
-    url: 'xxxxx',
-    method: 'POST',
-    data
-  })
+// 获取课程详情
+export const getCourseDetailApi = (id) => {
+  return request.get(`/coursesteacher/${id}`)
 }
-export const fnNameGet = (params) => {
-  return request({
-    url: 'xxxxx',
-    method: 'get',
-    params
-  })
+
+// 删除课程
+export const deleteCourseApi = (id) => {
+  return request.delete(`/coursesteacher/${id}`)
+}
+// 获取课程id
+export const getCourseObjectApi = (id) => {
+  return request.get(`/course_objectives/list/${id}`)
+}
+// 获取教师列表
+export const getTeacherListApi = () => {
+  return request.get('/user/get_teacherinf_list')
 }
-// {id:1}
-// http://127.0.0.1/getlist?id=1
-// http://127.0.0.1/setuser  载荷 body
\ No newline at end of file
diff --git a/src/utils/alioss.js b/src/utils/alioss.js
new file mode 100644
index 0000000..bd49467
--- /dev/null
+++ b/src/utils/alioss.js
@@ -0,0 +1,31 @@
+import OSS from 'ali-oss'
+import { nanoid } from 'nanoid'
+export const client = new OSS({
+  region: 'oss-cn-beijing', //创建的时候，bucket所在的区域，华北2->oss-cn-beijing ；其他的可以去百度
+  accessKeyId: 'LTAI5tPutTqQcDZjPXTVmuLy', // 阿里云控制台创建的AccessKey
+  accessKeySecret: '3PmB75969OJt6uOMkRJTZjpSbVI4iL', //阿里云控制台创建的AccessSecret
+  bucket: 'teaching-edu123', //创建的bucket的名称
+  endpoint: 'oss-cn-beijing.aliyuncs.com', //地域节点
+  secure: false, //http:false,https:ture
+})
+export const tool = {
+  oss: {
+    async upload(file) {
+      // // console.log(11, file, client)
+
+      // 文件名
+      const uuid = nanoid()
+      // 文件后缀名
+      const index = file.name.lastIndexOf('.')
+      const suffix = file.name.substring(index + 1)
+      let fileName = uuid + '.' + suffix
+      console.log(uuid, file, suffix)
+      // return await client.multipartUpload(fileName, file, {
+      //   progress: function (p) {
+      //     console.log('进度', p)
+      //   },
+      // })
+      return await client.put(fileName, file)
+    },
+  },
+}
diff --git a/src/views/course/CourseObjectives.vue b/src/views/course/CourseObjectives.vue
index 1110776..c855cb3 100644
--- a/src/views/course/CourseObjectives.vue
+++ b/src/views/course/CourseObjectives.vue
@@ -3,20 +3,12 @@ import { ref, onMounted } from 'vue'
 import { ElMessage, ElMessageBox } from 'element-plus'
 import { id } from 'element-plus/es/locales.mjs'
 import * as echarts from 'echarts'
+import { useRoute } from 'vue-router'
+import { getCourseList, addCourse, editCourse, deleteCourse, getCourseInfo } from '@/api/courseChaptersApi'
+const route = useRoute()
 // id ： 分目标id
 // targetId ： 选中的分类
-const booksList = ref([
-  { id: 1, targetId: 1, introduce: '内容111111' },
-  // { id: 3, introduce: '内容333333' },
-  // { id: 4, introduce: '内容333333' },
-])
 
-const courseList = ref([
-  { id: 1, specific: '思政目标' },
-  { id: 2, specific: '知识目标' },
-  { id: 3, specific: '能力目标' },
-  { id: 4, specific: '素质目标' },
-])
 const targetList = ref([
   {
     label: '课程目标一',
@@ -35,13 +27,14 @@ const targetList = ref([
   },
 ])
 const formData = ref({
-  id: null,
-  target: '',
   description: '',
 })
-const addBook = () => {
+const activeIndex = ref(0)
+const addBook = (id) => {
+  activeIndex.value = id
   dialogVisible.value = true
-  updateDisabledStatus()
+  flog.value = false
+  // updateDisabledStatus()
 }
 const text = ref('我是后台获取的值')
 const textChange = (val) => {
@@ -54,29 +47,39 @@ const handleClose = () => {
   dialogVisible.value = false
 }
 // 弹窗提交事件
-const submit = () => {
-  // 判断当前点击的是新增还是修改
+const submit = async () => {
   if (flog.value) {
-    console.log('编辑', formData.value.target)
-    // 找到新增的一项
-    const index = booksList.value.findIndex(
-      (item) => formData.value.id == item.id,
-    )
-    console.log(index, 'index')
-    console.log(booksList.value[index])
-    booksList.value[index].id = formData.value.id
-    booksList.value[index].targetId = formData.value.target
-    booksList.value[index].introduce = formData.value.description
-    close()
-  } else {
-    booksList.value.push({
-      id: booksList.value.length + 1,
-      targetId: formData.value.target,
-      introduce: formData.value.description,
-    })
-    close()
-    flog.value = false
+    await editCourse({ id: activeIndex.value, content: formData.value.description })
+  }else{
+    await addCourse({ objectiveId: activeIndex.value, content: formData.value.description })
   }
+
+  getList()
+  dialogVisible.value = false
+  formData.value.description = ''
+  activeIndex.value = ''
+  // // 判断当前点击的是新增还是修改
+  // if (flog.value) {
+  //   console.log('编辑', formData.value.target)
+  //   // 找到新增的一项
+  //   const index = booksList.value.findIndex(
+  //     (item) => formData.value.id == item.id,
+  //   )
+  //   console.log(index, 'index')
+  //   console.log(booksList.value[index])
+  //   booksList.value[index].id = formData.value.id
+  //   booksList.value[index].targetId = formData.value.target
+  //   booksList.value[index].introduce = formData.value.description
+  //   close()
+  // } else {
+  //   courseList.value[activeIndex.value].booklist.push({
+  //     id: booksList.value.length + 1,
+  //     targetId: formData.value.target,
+  //     introduce: formData.value.description,
+  //   })
+  //   close()
+  //   flog.value = false
+
 }
 const close = () => {
   formData.value = {
@@ -99,18 +102,29 @@ const filterTarger = (target) => {
 
 // 编辑事件
 const flog = ref(false)
-const editBook = (item) => {
-  updateDisabledStatus()
+const editBook = async (obj) => {
+  const res = await getCourseInfo({id:obj.id})
+
   flog.value = true
-  console.log(item)
-  formData.value.id = item.id
-  formData.value.target = item.targetId
-  formData.value.description = item.introduce
+  console.log(obj)
+  activeIndex.value = res.data.id
+  // formData.value.id = obj.id
+  // formData.value.target = obj.targetId
+  formData.value.description = res.data.content
   dialogVisible.value = true
 }
-const del = (id) => {
+const del = async(obj) => {
+  await ElMessageBox.confirm('你确认要删除该课程目标吗','温馨提示',{
+    type:'warning',
+    confirmButtonText:'确认',
+    cancelButtonText:'取消'
+  })
+  await deleteCourse({ id: obj.id })
+  ElMessage.success('删除成功')
+  getList()
   // console.log(id);
-  booksList.value = booksList.value.filter((item) => item.id !== id)
+  // activeIndex.value = id
+  // courseList.booksList.value = booksList.value.filter((item) => item.id !== id)
 }
 
 // const disableChange = (id) => {
@@ -121,20 +135,19 @@ const del = (id) => {
 //   }
 // }
 // 定义一个方法来更新 targetList 中的 disabled 属性
-const updateDisabledStatus = () => {
-  // 遍历 targetList
-  targetList.value.forEach((targetItem) => {
-    // 检查 booksList 中是否有相同的 id
-    const hasIdInBooks = booksList.value.some(
-      (bookItem) => bookItem.id === targetItem.id,
-    )
-    // 如果存在，则设置 disabled 为 true
-    if (hasIdInBooks) {
-      targetItem.disabled = true
-    }
-  })
+
+const getList = async () => {
+  const res = await getCourseList({ id: courseId.value })
+  data.value = res.data[0]
+  text.value = res.data[0].name
 }
-onMounted(() => {
+const data = ref({})
+const courseId = ref(0)
+onMounted(async () => {
+  courseId.value = route.query.id
+  console.log(courseId.value);
+  getList()
+  console.log(data.value);
   let chartDom = document.getElementById('main')
   let myChart = echarts.init(chartDom)
   let option
@@ -184,9 +197,7 @@ onMounted(() => {
       <div class="topContent">
         <div class="title">| 课程总目标</div>
         <div class="content1">
-          <textarea class="textarea" @change="textChange" v-model="text">
-文本内容</textarea
-          >
+          <textarea class="textarea" @change="textChange" v-model="text">文本内容</textarea>
         </div>
       </div>
       <div class="footContent">
@@ -197,17 +208,13 @@ onMounted(() => {
       </div>
     </div>
     <div class="rightContent">
-      <div
-        class="title"
-        style="
+      <div class="title" style="
           width: 100%;
           display: flex;
           align-items: center;
           justify-content: space-between;
           padding: 0 20px;
-          height: 60px;
-        "
-      >
+          height: 60px;">
         <div class="left2">| 课程分目标</div>
         <div class="right2">
           <!-- <el-button type="primary" @click="addBook">新增</el-button> -->
@@ -216,44 +223,39 @@ onMounted(() => {
       <div class="content2">
         <el-scrollbar height="600px">
           <ul class="objectLi">
-            <li v-for="(item, index) in courseList" :key="item.id">
+            <li v-for="(item, index) in data.courseObjectivesTrees" :key="item.id">
               <div class="courseObject">
                 <!-- {{ filterTarger(item.targetId) }} -->
-                <div class="courseObject1">{{ item.specific }}</div>
+                <div class="courseObject1">{{ item.name }}</div>
                 <div class="courseObject2">
                   <!-- <el-button class="edit" type="text" @click="editBook(item)">
                     编辑
                   </el-button> -->
-                  <el-button type="primary" @click="addBook">新增</el-button>
+                  <el-button type="primary" @click="addBook(item.id)">新增</el-button>
                 </div>
               </div>
               <div class="smallContent">
                 <el-scrollbar height="250px">
                   <ul class="small">
-                    <li v-for="(item, index) in booksList" :key="item.id">
+                    <li v-for="(obj, i) in item.contents" :key="obj.id">
                       <div class="partObject">
                         <div class="partObject1">
-                          {{ filterTarger(item.targetId) }}
+                          <!-- {{ item.content }} -->
+                          <!-- {{ item.introduce }} -->
+                          课程目标{{ i + 1 }}
+                          <!-- {{ filterTarger(obj.targetId) }} -->
                         </div>
                         <div class="partObject2">
-                          <el-button
-                            class="edit"
-                            type="text"
-                            @click="editBook(item)"
-                          >
+                          <el-button class="edit" type="text" @click="editBook(obj)">
                             编辑
                           </el-button>
-                          <el-button
-                            class="destroy"
-                            type="text"
-                            @click="del(item.id)"
-                          >
+                          <el-button class="destroy" type="text" @click="del(obj)">
                             删除
                           </el-button>
                         </div>
                       </div>
                       <div class="partObjectIntroduce">
-                        {{ item.introduce }}
+                        {{ obj.content }}
                       </div>
                     </li>
                   </ul>
@@ -265,35 +267,16 @@ onMounted(() => {
       </div>
     </div>
   </div>
-  <el-dialog
-    v-if="dialogVisible"
-    v-model="dialogVisible"
-    title="新增目标"
-    width="500"
-    :before-close="handleClose"
-  >
+  <el-dialog v-if="dialogVisible" v-model="dialogVisible" :title="flog ? '编辑' : '新增'" width="500" :before-close="handleClose">
     <el-form :model="formData" label-width="auto" style="max-width: 600px">
-      <el-form-item label="目标" prop="target">
-        <el-select
-          v-model="formData.target"
-          placeholder="Select"
-          size="large"
-          style="width: 240px"
-        >
-          <el-option
-            v-for="item in targetList"
-            :key="item.id"
-            :label="item.label"
-            :value="item.id"
-            :disabled="item.disabled"
-          />
+      <!-- <el-form-item label="目标" prop="target">
+        <el-select v-model="formData.target" placeholder="Select" size="large" style="width: 240px">
+          <el-option v-for="item in targetList" :key="item.id" :label="item.label" :value="item.id"
+            :disabled="item.disabled" />
         </el-select>
-      </el-form-item>
+      </el-form-item> -->
       <el-form-item label="内容" prop="description">
-        <el-input
-          v-model="formData.description"
-          placeholder="请输入内容"
-        ></el-input>
+        <el-input v-model="formData.description" placeholder="请输入内容"></el-input>
       </el-form-item>
     </el-form>
     <template #footer>
@@ -396,13 +379,14 @@ const li
   background-color: #fff;
   background-image: linear-gradient(#c7e3ff, #ffffff);
 
-  .objectLi > li {
+  .objectLi>li {
     width: 845px;
     height: 250px;
     // margin: 40px;
     // background-color: #ffffff;
     border-radius: 5px;
     margin: 20px;
+
     .courseObject {
       height: 45px;
       line-height: 40px;
@@ -427,6 +411,7 @@ const li
       }
     }
   }
+
   // overflow-y: auto
   .smallContent {
     //  border-radius: 20px;
@@ -436,7 +421,8 @@ const li
     background-color: #fff;
     background-image: linear-gradient(#c7e3ff, #ffffff);
   }
-  .small > li {
+
+  .small>li {
     // display: inline-flex;
     width: 650px;
     height: 150px;
diff --git a/src/views/course/CourseObjectives111.vue b/src/views/course/CourseObjectives111.vue
new file mode 100644
index 0000000..8d3b391
--- /dev/null
+++ b/src/views/course/CourseObjectives111.vue
@@ -0,0 +1,476 @@
+<script setup>
+import { ref, onMounted } from 'vue'
+import { ElMessage, ElMessageBox } from 'element-plus'
+import { id } from 'element-plus/es/locales.mjs'
+import * as echarts from 'echarts'
+import {useRoute } from 'vue-router'
+import { getCourseList } from '@/api/courseChaptersApi'
+const route = useRoute()
+// id ： 分目标id
+// targetId ： 选中的分类
+const booksList = ref([
+  { id: 1, targetId: 1, introduce: '内容111111' },
+  // { id: 3, introduce: '内容333333' },
+  // { id: 4, introduce: '内容333333' },
+])
+
+const courseList = ref([
+  { id: 1, specific: '思政目标', booklist: [{ id: 1, targetId: 1, introduce: '内容111111' }] },
+  { id: 2, specific: '知识目标', booklist: [{ id: 1, targetId: 1, introduce: '内容222222' }] },
+  { id: 3, specific: '能力目标', booklist: [{ id: 1, targetId: 1, introduce: '内容333333' }] },
+  { id: 4, specific: '素质目标', booklist: [{ id: 1, targetId: 1, introduce: '内容444444' }] },
+])
+const targetList = ref([
+  {
+    label: '课程目标一',
+    id: 1,
+    disabled: false,
+  },
+  {
+    label: '课程目标二',
+    disabled: false,
+    id: 2,
+  },
+  {
+    label: '课程目标三',
+    id: 3,
+    disabled: false,
+  },
+])
+const formData = ref({
+  id: null,
+  target: '',
+  description: '',
+})
+const activeIndex = ref(0)
+const addBook = (index) => {
+  activeIndex.value = index
+  dialogVisible.value = true
+  updateDisabledStatus()
+}
+const text = ref('我是后台获取的值')
+const textChange = (val) => {
+  console.log(text.value)
+}
+// 弹窗
+const dialogVisible = ref(false)
+// 关闭弹窗
+const handleClose = () => {
+  dialogVisible.value = false
+}
+// 弹窗提交事件
+const submit = () => {
+  // 判断当前点击的是新增还是修改
+  if (flog.value) {
+    console.log('编辑', formData.value.target)
+    // 找到新增的一项
+    const index = booksList.value.findIndex(
+      (item) => formData.value.id == item.id,
+    )
+    console.log(index, 'index')
+    console.log(booksList.value[index])
+    booksList.value[index].id = formData.value.id
+    booksList.value[index].targetId = formData.value.target
+    booksList.value[index].introduce = formData.value.description
+    close()
+  } else {
+    courseList.value[activeIndex.value].booklist.push({
+      id: booksList.value.length + 1,
+      targetId: formData.value.target,
+      introduce: formData.value.description,
+    })
+    close()
+    flog.value = false
+  }
+}
+const close = () => {
+  formData.value = {
+    id: null,
+    target: '',
+    description: '',
+  }
+  dialogVisible.value = false
+}
+// 筛选目标
+const filterTarger = (target) => {
+  const res = targetList.value.find((item) => {
+    if (item.id === target) {
+      console.log(item)
+      return item
+    }
+  })
+  return res.label
+}
+
+// 编辑事件
+const flog = ref(false)
+const editBook = (obj) => {
+  updateDisabledStatus()
+  flog.value = true
+  console.log(obj)
+  formData.value.id = obj.id
+  formData.value.target = obj.targetId
+  formData.value.description = obj.introduce
+  dialogVisible.value = true
+}
+const del = (id) => {
+  // console.log(id);
+  courseList.booksList.value = booksList.value.filter((item) => item.id !== id)
+}
+
+// const disableChange = (id) => {
+//   const index = booksList.value.findIndex((item,index) => item.id === id)
+//   console.log(index);
+//   if(index){
+//     targetList.value[index].disabled = false
+//   }
+// }
+// 定义一个方法来更新 targetList 中的 disabled 属性
+const updateDisabledStatus = () => {
+  // 遍历 targetList
+  targetList.value.forEach((targetItem) => {
+    // 检查 booksList 中是否有相同的 id
+    const hasIdInBooks = booksList.value.some(
+      (bookItem) => bookItem.id === targetItem.id,
+    )
+    // 如果存在，则设置 disabled 为 true
+    if (hasIdInBooks) {
+      targetItem.disabled = true
+    }
+  })
+}
+const list=ref([])
+const content88=ref()
+const courseId = ref(0)
+onMounted(async() => {
+  courseId.value = route.query.id
+  console.log(courseId.value);
+  const res = await getCourseList({ id: courseId.value })
+  console.log(res);
+  list.value=res.data
+  console.log(list.value);
+  content88.value = list.value[0].contents[0].content
+  console.log(list.value[0].contents[0].content);
+  console.log(content88.value);
+  
+
+  let chartDom = document.getElementById('main')
+  let myChart = echarts.init(chartDom)
+  let option
+  option = {
+    title: {
+      text: '分目标',
+    },
+    legend: {
+      data: ['Allocated Budget', 'Actual Spending'],
+    },
+    radar: {
+      // shape: 'circle',
+      indicator: [
+        { name: 'Sales', max: 6500 },
+        { name: 'Administration', max: 16000 },
+        { name: 'Information Technology', max: 30000 },
+        { name: 'Customer Support', max: 38000 },
+        { name: 'Development', max: 52000 },
+        { name: 'Marketing', max: 25000 },
+      ],
+    },
+    series: [
+      {
+        name: 'Budget vs spending',
+        type: 'radar',
+        data: [
+          {
+            value: [4200, 3000, 20000, 35000, 50000, 18000],
+            name: 'Allocated Budget',
+          },
+          {
+            value: [5000, 14000, 28000, 26000, 42000, 21000],
+            name: 'Actual Spending',
+          },
+        ],
+      },
+    ],
+  }
+
+  option && myChart.setOption(option)
+})
+</script>
+<!-- v-model="text" -->
+<template>
+  <div class="container">
+    <div class="leftContent">
+      <div class="topContent">
+        <div class="title">| 课程总目标</div>
+        <div class="content1">
+          <textarea class="textarea" @change="textChange">{{ content88 }}</textarea>
+        </div>
+      </div>
+      <div class="footContent">
+        <div class="title">| 分目标雷达图</div>
+        <div class="content3">
+          <div id="main"></div>
+        </div>
+      </div>
+    </div>
+    <div class="rightContent">
+      <div class="title" style="
+          width: 100%;
+          display: flex;
+          align-items: center;
+          justify-content: space-between;
+          padding: 0 20px;
+          height: 60px;">
+        <div class="left2">| 课程分目标</div>
+        <div class="right2">
+          <!-- <el-button type="primary" @click="addBook">新增</el-button> -->
+        </div>
+      </div>
+      <div class="content2">
+        <el-scrollbar height="600px">
+          <ul class="objectLi">
+            <li v-for="(item, index) in courseList" :key="item.id">
+              <div class="courseObject">
+                <!-- {{ filterTarger(item.targetId) }} -->
+                <div class="courseObject1">{{ item.specific }}</div>
+                <div class="courseObject2">
+                  <!-- <el-button class="edit" type="text" @click="editBook(item)">
+                    编辑
+                  </el-button> -->
+                  <el-button type="primary" @click="addBook(index)">新增</el-button>
+                </div>
+              </div>
+              <div class="smallContent">
+                <el-scrollbar height="250px">
+                  <ul class="small">
+                    <li v-for="(obj, i) in item.booklist" :key="obj.id">
+                      <div class="partObject">
+                        <div class="partObject1">
+                          <!-- {{ item.introduce }} -->
+                          课程目标{{ i+1 }}
+                          <!-- {{ filterTarger(obj.targetId) }} -->
+                        </div>
+                        <div class="partObject2">
+                          <el-button class="edit" type="text" @click="editBook(obj)">
+                            编辑
+                          </el-button>
+                          <el-button class="destroy" type="text" @click="del(obj.id)">
+                            删除
+                          </el-button>
+                        </div>
+                      </div>
+                      <div class="partObjectIntroduce">
+                        {{ obj.introduce }}
+                      </div>
+                    </li>
+                  </ul>
+                </el-scrollbar>
+              </div>
+            </li>
+          </ul>
+        </el-scrollbar>
+      </div>
+    </div>
+  </div>
+  <el-dialog v-if="dialogVisible" v-model="dialogVisible" title="新增目标" width="500" :before-close="handleClose">
+    <el-form :model="formData" label-width="auto" style="max-width: 600px">
+      <!-- <el-form-item label="目标" prop="target">
+        <el-select v-model="formData.target" placeholder="Select" size="large" style="width: 240px">
+          <el-option v-for="item in targetList" :key="item.id" :label="item.label" :value="item.id"
+            :disabled="item.disabled" />
+        </el-select>
+      </el-form-item> -->
+      <el-form-item label="内容" prop="description">
+        <el-input v-model="formData.description" placeholder="请输入内容"></el-input>
+      </el-form-item>
+    </el-form>
+    <template #footer>
+      <div class="dialog-footer">
+        <el-button @click="close">取消</el-button>
+        <el-button type="primary" @click="submit">确定</el-button>
+      </div>
+    </template>
+  </el-dialog>
+</template>
+<!-- <script setup>
+import {ref} 'vue'
+const li
+</script> -->
+
+<style lang="scss" scoped>
+#main {
+  padding: 15px;
+  width: 100%;
+  height: 100%;
+}
+
+.container {
+  display: flex;
+  flex-direction: row;
+  flex-wrap: nowrap;
+  width: 100%;
+
+  padding: 0 10px 0 10px;
+  justify-content: space-around;
+}
+
+.leftContent {
+  width: 450px;
+  height: 730px;
+  margin: 10px;
+
+  .topContent {
+    border-radius: 20px 20px 0 0px;
+    height: 280px;
+    background-color: #74deff;
+    margin-button: 5px;
+    background-image: linear-gradient(to right, #4984ff, #74deff);
+  }
+
+  .footContent {
+    border-radius: 20px;
+    margin-top: 20px;
+    height: 430px;
+    background-color: #ffa674;
+    background-image: linear-gradient(to right, #f9e397, #ffa674);
+  }
+}
+
+.rightContent {
+  margin: 10px;
+  width: 950px;
+  height: 730px;
+  background-image: linear-gradient(to right, #4984ff, #74deff);
+  border-radius: 20px;
+}
+
+.title {
+  padding-left: 30px;
+  font-size: 24px;
+  font-weight: 600;
+  color: #fff;
+  height: 40px;
+  line-height: 40px;
+  padding-top: 10px;
+}
+
+.content1 {
+  border-radius: 20px 20px 0 0px;
+  margin-top: 20px;
+  width: 100%;
+  height: 220px;
+  background-color: #fff;
+  background-image: linear-gradient(#c7e3ff, #ffffff);
+
+  .textarea {
+    width: 100%;
+    border: none;
+    background: transparent;
+    padding: 20px;
+    height: 215px;
+  }
+
+  p {
+    padding: 30px;
+    font-size: 16px;
+  }
+}
+
+.content2 {
+  border-radius: 20px;
+  padding: 10px;
+  width: 100%;
+  height: 670px;
+  background-color: #fff;
+  background-image: linear-gradient(#c7e3ff, #ffffff);
+
+  .objectLi > li {
+    width: 845px;
+    height: 250px;
+    // margin: 40px;
+    // background-color: #ffffff;
+    border-radius: 5px;
+    margin: 20px;
+    .courseObject {
+      height: 45px;
+      line-height: 40px;
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      padding: 0 20px;
+      border-bottom: 1px solid #e7e7e7;
+
+      .courseObject1 {
+        height: 30px;
+        line-height: 30px;
+        font-size: 14px;
+        background-color: #6093ff;
+        padding: 0px 16px;
+        color: #fff;
+      }
+
+      .courseObject2 {
+        font-size: 14px;
+        color: #0052d9;
+      }
+    }
+  }
+  // overflow-y: auto
+  .smallContent {
+    //  border-radius: 20px;
+    padding: 10px;
+    width: 100%;
+    height: 200px;
+    background-color: #fff;
+    background-image: linear-gradient(#c7e3ff, #ffffff);
+  }
+  .small > li {
+    // display: inline-flex;
+    width: 750px;
+    height: 150px;
+    // margin: 40px;
+    background-color: #ffffff;
+    border-radius: 5px;
+    margin: 20px;
+
+    .partObject {
+      height: 45px;
+      line-height: 40px;
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      padding: 0 20px;
+      border-bottom: 1px solid #e7e7e7;
+
+      .partObject1 {
+        height: 30px;
+        line-height: 30px;
+        font-size: 14px;
+        background-color: #6093ff;
+        padding: 0px 16px;
+        color: #fff;
+      }
+
+      .partObject2 {
+        font-size: 14px;
+        color: #0052d9;
+      }
+    }
+
+    .partObjectIntroduce {
+      height: 149px;
+      font-size: 16px;
+      padding: 15px;
+    }
+  }
+}
+
+.content3 {
+  border-radius: 20px;
+  margin-top: 20px;
+  width: 100%;
+  height: 370px;
+  background-color: #fff;
+  background-image: linear-gradient(#ffe9c7, #ffffff);
+}
+</style>
diff --git a/src/views/course/basicCourseInformation.vue b/src/views/course/basicCourseInformation.vue
index ce4e6de..9a849ae 100644
--- a/src/views/course/basicCourseInformation.vue
+++ b/src/views/course/basicCourseInformation.vue
@@ -1,194 +1,285 @@
 <script lang="ts" setup>
 import { ref, onMounted } from 'vue'
-import axios from 'axios'
+// import axios from 'axios'
 import courseEdit from './components/courseEdit.vue'
-import { getCourseListApi } from '../../api/user/crouse.js'
-const courseList = ref([
-  // id: 1,
-  //     category: '',
-  //     nature: '',
-  //     code: '',
-  //     assessmenttype: '',
-  //     assessmentway: '',
-  //     teachermethod: '',
-  //     teacherway: '',
-  //     description: '',
-  //     name: '',
-  //     credit: '',
-  //     classhours: '',
-])
+import { Plus, Search } from '@element-plus/icons-vue'
+import {
+  getCourseListApi,
+  deleteCourseApi,
+  getCourseObjectApi,
+  getTeacherListApi,
+} from '../../api/user/crouse'
+import { ElMessageBox, ElMessage } from 'element-plus'
+// import router from '@/router'
+import { useRouter, useRoute } from 'vue-router'
+const router = useRouter()
+// const route = useRoute()
+// console.log(route)
+
+// import { client } from '@/utils/alioss.js'
+// 课程列表
+const courseList = ref([])
+// 教师列表
+const teacherList = ref([])
+const getTeacherList = async () => {
+  const res = await getTeacherListApi()
+  console.log(res)
+  teacherList.value = res.data
+  console.log(teacherList.value)
+}
+const total = ref(0)
+const params = ref({
+  pageNo: 1,
+  pageSize: 7,
+  username: 'qiu',
+  assessmenttype: '',
+  category: '',
+  nature: '',
+  teacher: '',
+})
+const loading = ref(false)
+// 获取课程列表
 const getCourseList = async () => {
-  const res = await getCourseListApi()
-  courseList.value = res.result.list
+  loading.value = true
+  const res = await getCourseListApi(params.value)
+  // console.log(res)
+  courseList.value = res.data.list
+  total.value = res.data.total
+  console.log(res.data.list)
+  loading.value = false
 }
-
+// 渲染
 onMounted(() => {
   getCourseList()
+  getTeacherList()
 })
+// 搜索
+const onSearch = () => {
+  params.value.pageNo = 1
+  getCourseList()
+}
+const onReset = () => {
+  params.value.pageNo = 1
+  params.value.assessmenttype = ''
+  params.value.teacher = ''
+  params.value.category = ''
+  params.value.nature = ''
+  getCourseList()
+}
+// 分页
+const handleSizeChange = (size: any) => {
+  // loading.value = true
+  // console.log(size)
+  params.value.pageNo = 1
+  params.value.pageSize = size
+  // 基于每页条数重新渲染
+  getCourseList()
+}
+const handleCurrentChange = (page: any) => {
+  console.log(page)
+  params.value.pageNo = page
+  // 基于当前页渲染数据
+  getCourseList()
+}
 
-// const courseList = ref([
-//   {
-//     id: 1,
-//     category: '1',
-//     nature: '1',
-//     code: '1',
-//     assessmenttype: '1',
-//     assessmentway: '1',
-//     teachermethod: '',
-//     teacherway: '',
-//     description: '',
-//     name: '课程名称',
-//     credit: '课程学分',
-//     classhours: '课程学时',
-//   },
-//   {
-//     id: 2,
-//     category: '1',
-//     nature: '1',
-//     code: '1',
-//     assessmenttype: '1',
-//     assessmentway: '1',
-//     teachermethod: '',
-//     teacherway: '',
-//     description: '',
-//     name: '课程名称',
-//     credit: '课程学分',
-//     classhours: '课程学时',
-//   },
-//   {
-//     id: 3,
-//     category: '1',
-//     nature: '1',
-//     code: '1',
-//     assessmenttype: '1',
-//     assessmentway: '1',
-//     teachermethod: '',
-//     teacherway: '',
-//     description: '',
-//     name: '课程名称',
-//     credit: '课程学分',
-//     classhours: '课程学时',
-//   },
-//   {
-//     id: 4,
-//     category: '1',
-//     nature: '1',
-//     code: '1',
-//     assessmenttype: '1',
-//     assessmentway: '1',
-//     teachermethod: '',
-//     teacherway: '',
-//     description: '',
-//     name: '课程名称',
-//     credit: '课程学分',
-//     classhours: '课程学时',
-//   },
-//   {
-//     id: 5,
-//     category: '1',
-//     nature: '1',
-//     code: '1',
-//     assessmenttype: '1',
-//     assessmentway: '1',
-//     teachermethod: '',
-//     teacherway: '',
-//     description: '',
-//     name: '课程名称',
-//     credit: '课程学分',
-//     classhours: '课程学时',
-//   },
-//   {
-//     id: 6,
-//     category: '1',
-//     nature: '1',
-//     code: '1',
-//     assessmenttype: '1',
-//     assessmentway: '1',
-//     teachermethod: '',
-//     teacherway: '',
-//     description: '',
-//     name: '课程名称',
-//     credit: '课程学分',
-//     classhours: '课程学时',
-//   },
-//   {
-//     id: 7,
-//     category: '1',
-//     nature: '1',
-//     code: '1',
-//     assessmenttype: '1',
-//     assessmentway: '1',
-//     teachermethod: '',
-//     teacherway: '',
-//     description: '',
-//     name: '课程名称',
-//     credit: '课程学分',
-//     classhours: '课程学时',
-//   },
-// ])
-
+// 弹框
 const drawer = ref()
+// 添加时传递空对象给子组件
 const onAddCourse = () => {
+  flog.value = false
   drawer.value.open({})
 }
-const onEditCourse = (item) => {
+const flog = ref(false)
+// 编辑时传递数据给子组件
+const onEditCourse = (item: any) => {
+  flog.value = true
+  console.log(item)
   drawer.value.open(item)
 }
+//
 const onSuccess = () => {
+  // loading.value = true
+  getCourseList()
+  // loading.value = false
+}
+//
+const onDeleteCourse = async (id: any) => {
+  await ElMessageBox.confirm('您确定删除这条课程信息吗', '温馨提示', {
+    confirmButtonText: '确认',
+    cancelButtonText: '取消',
+    type: 'warning',
+  })
+  await deleteCourseApi(id)
+    .then(() => {
+      ElMessage.success('删除成功')
+      // console.log(res)
+    })
+    .catch((err: any) => {
+      ElMessage.error(err.response.data.message)
+    })
+
   getCourseList()
 }
+// 点击查看课程目标，把课程id传过去
+const onGetCourseObject = async (id: any) => {
+  // const res = await getCourseObjectApi(id)
+  router.push({
+    path: '/curriculumCenter/CourseObjectives',
+    query: {
+      id: id,
+    },
+  })
+  // console.log(res)
+}
+const course_name = ref('点击添加课程')
+// const credit_name = ref('32')
+// const classhours_name = ref('2.0')
+// const creditChangeEvent = (credit: any) => {
+//   credit_name.value = credit
+// }
+// const ClosecreditChangeEvent = () => {
+//   credit_name.value = '32'
+// }
+const couresNameChangeEvent = (name: any) => {
+  // console.log(name, 'name')
+  course_name.value = name
+}
+const CloseCouresNameChangeEvent = () => {
+  course_name.value = '点击添加课程'
+}
+// const classhoursChangeEvent = (classhours: any) => {
+//   classhours_name.value = classhours
+// }
+// const CloseclasshoursChangeEvent = () => {
+//   classhours_name.value = '2.0'
+// }
+// const goToObject = () => {
+//   this.$route.push('/curriculumCenter/CourseObjectives')
+// }
 </script>
 <template>
-<<<<<<< HEAD
-  <div>课程基本信息</div>
-</template>
+  <div class="main-content" v-loading="loading">
+    <div class="header">
+      <div class="btn">
+        <!-- <el-button type="primary" round size="large">全部课程</el-button>
+      <el-button type="primary" round plain size="large">我的文件夹</el-button> -->
 
-<script lang="ts" setup>
-import {} from 'vue'
-</script>
+        <el-form inline>
+          <el-form-item label="课程教师：" class="short-form-item">
+            <el-select v-model="params.teacher">
+              <el-option
+                v-for="teachers in teacherList"
+                :key="teachers.username"
+                :value="teachers.username"
+                :label="teachers.name"
+              ></el-option>
+            </el-select>
+          </el-form-item>
+          <el-form-item label="课程类别：" class="short-form-item">
+            <el-select v-model="params.category">
+              <el-option label="专业教育" value="1"></el-option>
+              <el-option label="通识教育" value="2"></el-option>
+            </el-select>
+          </el-form-item>
+          <el-form-item label="课程性质" class="short-form-item">
+            <el-select v-model="params.nature">
+              <el-option label="必修" value="1"></el-option>
+              <el-option label="选修" value="2"></el-option>
+              <el-option label="任修" value="3"></el-option>
+            </el-select>
+          </el-form-item>
+          <el-form-item label="考核类型：" class="short-form-item">
+            <el-select v-model="params.assessmenttype">
+              <el-option label="考试" value="1"></el-option>
+              <el-option label="考察" value="2"></el-option>
+            </el-select>
+          </el-form-item>
 
-<style lang="scss" scoped></style>
-=======
-  <div class="header">
-    <div class="btn">
-      <el-button type="primary" round size="large">全部课程</el-button>
-      <el-button type="primary" round plain size="large">我的文件夹</el-button>
-    </div>
-    <div class="search">
-      <input type="text" placeholder="搜索课程" />
-      <i class="el-icon-search"></i>
+          <el-form-item>
+            <el-button type="primary" @click="onSearch">搜索</el-button>
+            <el-button type="primary" plain @click="onReset">重置</el-button>
+          </el-form-item>
+        </el-form>
+
+        <div class="course">
+          <ul class="course_list">
+            <li @click="onAddCourse()">
+              <div class="plus">
+                <el-icon class="avatar-uploader-icon">
+                  <Plus />
+                </el-icon>
+              </div>
+
+              <h2 class="course_name">{{ course_name }}</h2>
+              <!-- <p class="teacher_name">讲师：{{ courseList.teacher }}</p>
+              <p class="credit">
+                <span>{{ credit_name }}</span>
+                学时|
+                <span>{{ classhours_name }}</span>
+                学分
+              </p> -->
+            </li>
+            <li v-for="item in courseList" :key="item.id">
+              <img :src="item.img" alt="" />
+              <h2 class="course_name" @click="onEditCourse(item)">
+                {{ item.name }}
+              </h2>
+
+              <p class="teacher_name">讲师：{{ item.teacher }}</p>
+              <p class="credit">
+                <span>{{ item.classhours }}</span>
+                学时|
+                <span>{{ item.credit }}</span>
+                学分
+              </p>
+              <el-icon class="del" @click="onDeleteCourse(item.id)">
+                <Delete />
+              </el-icon>
+
+              <el-button
+                class="object"
+                round
+                plain
+                @click="onGetCourseObject(item.id)"
+              >
+                查看课程目标
+              </el-button>
+            </li>
+          </ul>
+        </div>
+        <el-pagination
+          v-model:current-page="params.pageNo"
+          v-model:page-size="params.pageSize"
+          :page-sizes="[2, 5, 7, 10]"
+          :background="true"
+          layout="jumper,total, sizes, prev, pager, next "
+          :total="total"
+          @size-change="handleSizeChange"
+          @current-change="handleCurrentChange"
+          style="margin-top: 10px; justify-content: center"
+        />
+      </div>
+      <course-edit
+        ref="drawer"
+        @success="onSuccess"
+        @couresNameChange="couresNameChangeEvent"
+        @CloseCouresNameChange="CloseCouresNameChangeEvent"
+        @creditChange="creditChangeEvent"
+        @classhoursChange="classhoursChangeEvent"
+        @ClosecreditChange="ClosecreditChangeEvent"
+        @CloseclasshoursChange="CloseclasshoursChangeEvent"
+        :flog="flog"
+      ></course-edit>
     </div>
   </div>
-  <div class="course">
-    <ul class="course_list">
-      <li @click="onAddCourse()">
-        <img src="" alt="" />
-        <h2 class="course_name">点击添加课程</h2>
-        <p class="teacher_name">讲师：王兴</p>
-        <p class="credit">
-          <span>32</span>
-          学时|
-          <span>2.0</span>
-          学分
-        </p>
-      </li>
-      <li v-for="item in courseList" :key="item.id" @click="onEditCourse(item)">
-        <img src="" alt="" />
-        <h2 class="course_name">{{ item.name }}</h2>
-        <p class="teacher_name">讲师：王兴</p>
-        <p class="credit">
-          <span>{{ item.classhours }}</span>
-          学时|
-          <span>{{ item.credit }}</span>
-          学分
-        </p>
-      </li>
-    </ul>
-  </div>
-  <course-edit ref="drawer" @success="onSuccess"></course-edit>
 </template>
 
 <style lang="scss" scoped>
+.main-content {
+  width: 1440px;
+  margin: 0 auto;
+}
+
 .header {
   width: 100%;
   // height: 100px;
@@ -196,22 +287,22 @@ import {} from 'vue'
   flex-direction: row;
 }
 
-.btn {
-  // display: flex;
-  width: 50%;
-  height: 100%;
-  padding: 10px 45px;
-  // display: inline;
-  // height: 40px;
-  // margin: 20px;
-  // padding-left: 50px;
-}
+// .btn {
+//   // display: flex;
+//   width: 50%;
+//   height: 100%;
+//   padding: 10px 0;
+//   // display: inline;
+//   // height: 40px;
+//   // margin: 20px;
+//   // padding-left: 50px;
+// }
 
 .search {
   width: 50%;
   display: flex;
   height: 100%;
-  padding: 10px 0 0 630px;
+  justify-content: flex-end;
 
   // flex-direction: row-reverse;
   // padding: 0 40px 0;
@@ -244,15 +335,15 @@ import {} from 'vue'
     width: 349px;
     width: 100%;
     height: 297px;
-    background: white;
+    background: rgb(255, 255, 255);
     transition: all 0.5s;
     border-radius: 6px;
+    position: relative;
 
     // flex: 1; /* 子元素按比例伸缩 */
     &:hover {
       transform: translate3d(0, -3px, 0);
       box-shadow: 0 3px 8px rgb(0 0 0 / 20%);
-      cursor: pointer;
     }
 
     .course_name {
@@ -292,8 +383,40 @@ import {} from 'vue'
       margin-left: 30px;
       margin-top: 10px;
       font-weight: bold;
+
+      &:hover {
+        cursor: pointer;
+      }
     }
   }
+
+  .del {
+    position: absolute;
+    margin-left: 302px;
+    margin-top: -90px;
+    color: #0052ff;
+    cursor: pointer;
+  }
+  .object {
+    position: absolute;
+    margin-left: 204px;
+    margin-top: -24px;
+  }
+}
+.plus {
+  width: 100%;
+  height: 178px;
+  // background-position: center center;
+  .el-icon.avatar-uploader-icon {
+    font-size: 28px;
+    color: #8c939d;
+    width: 100%;
+    height: 178px;
+    text-align: center;
+  }
+}
+.short-form-item {
+  width: 250px;
+  margin-right: 65px;
 }
 </style>
->>>>>>> 4fe89b0398cd428950ca36bfe5d25f813217eec4
diff --git a/src/views/course/components/courseEdit.vue b/src/views/course/components/courseEdit.vue
index 2d1f213..f7e2c34 100644
--- a/src/views/course/components/courseEdit.vue
+++ b/src/views/course/components/courseEdit.vue
@@ -1,30 +1,64 @@
-<script setup>
+<script setup lang="ts">
 import { ElMessage } from 'element-plus'
 import { requiredNumber } from 'element-plus/es/components/table-v2/src/common.mjs'
-import { ref } from 'vue'
+import { ref, watch, onMounted } from 'vue'
 import { editCourseApi } from '../../../api/user/crouse'
 import { addCourseApi } from '../../../api/user/crouse'
-const formModel = ref({
-  id: '',
+import { getCourseListApi, getCourseDetailApi } from '../../../api/user/crouse'
+import request from '../../../utils/request'
+import { tool, client } from '../../../utils/alioss.js'
+// 绑定弹框
+const visibleDrawer = ref(false)
+// 绑定图片
+const imgUrl = ref('')
+// 绑定表单
+const formRef = ref()
+// const uploadUrl = ref('')
+// const fileList = ref([])
+// const handleAvatarSuccess = (res: any) => {
+//   console.log(res)
+//   formModel.value.img = res.data.url
+// }
+// const beforeAvatarUpload = (file: any) => {}
+const defaultForm = {
+  teacher: '2140110334',
+  img: '',
   name: '',
-  category: '',
-  nature: '',
+  category: ref(''),
+  nature: ref(''),
   code: '',
   credit: '',
   classhours: '',
-  assessmenttype: '',
-  assessmentway: '',
+  assessmenttype: ref(''),
+  assessmentway: ref(''),
   teachermethod: '',
   teacherway: '',
   description: '',
+  file: null,
+}
+const formModel = ref({
+  ...defaultForm,
 })
 const rules = {
+  img: [
+    {
+      required: true,
+      message: '请上传课程封面',
+      trigger: 'change',
+    },
+  ],
   name: [
     {
       required: true,
       message: '请输入课程名称',
       trigger: 'blur',
     },
+    {
+      pattern: /^[a-zA-Z\u4e00-\u9fa5A-Z0-9]*$/,
+      message: '只能输入汉字或字母',
+      trigger: 'blur',
+    },
+    { max: 10, message: '不能超过10个字符', trigger: 'blur' },
   ],
   category: [
     {
@@ -46,6 +80,12 @@ const rules = {
       message: '请输入课程编码',
       trigger: 'blur',
     },
+    {
+      pattern: /^[A-Z0-9]*$/,
+      message: '只能输入数字或大写字母',
+      trigger: 'blur',
+    },
+    { max: 10, message: '不能超过10个字符', trigger: 'blur' },
   ],
   credit: [
     {
@@ -53,11 +93,7 @@ const rules = {
       message: '请输入课程学分',
       trigger: 'blur',
     },
-    {
-      validator: requiredNumber,
-      message: '请输入数字',
-      trigger: 'blur',
-    },
+    { pattern: /^\d*$/, message: '只能输入数字', trigger: 'blur' },
   ],
   classhours: [
     {
@@ -65,11 +101,8 @@ const rules = {
       message: '请输入课程学时',
       trigger: 'blur',
     },
-    {
-      validator: requiredNumber,
-      message: '请输入数字',
-      trigger: 'blur',
-    },
+    { pattern: /^\d*$/, message: '只能输入数字', trigger: 'blur' },
+    { max: 2, message: '不能超过2个字符', trigger: 'blur' },
   ],
   assessmenttype: [
     {
@@ -86,78 +119,255 @@ const rules = {
     },
   ],
 }
-const formRef = ref()
-const visibleDrawer = ref(false)
 
-const open = async (item) => {
-  formModel.value = { ...item }
+// 图片上传
+// const onSelectFile = (uploadFile) => {
+//   // console.log(uploadFile)
+//   imgUrl.value = URL.createObjectURL(uploadFile.raw)
+//   formModel.value.img = uploadFile.raw
+// }
+// 按钮禁用
+const nameDisabled = ref(false)
+const codeDisabled = ref(false)
+const open = async (item: any) => {
   visibleDrawer.value = true
+  if (item.id) {
+    // 编辑回显
+    // formModel.value = { ...item }
+    // 获取课程详情
+    const res = await getCourseDetailApi(item.id)
+    console.log(res)
+    formModel.value = res.data
+    imgUrl.value = formModel.value.img
+    nameDisabled.value = true
+    codeDisabled.value = true
+  } else {
+    nameDisabled.value = false
+    codeDisabled.value = false
+    // 重置表单
+    formModel.value = { ...defaultForm }
+    formModel.value.category = ''
+    formModel.value.nature = ''
+    formModel.value.assessmenttype = ''
+    formModel.value.assessmentway = ''
+    imgUrl.value = ''
+  }
+  // 重置图片
 }
 // 组件对外暴露一个open,基于open传过来的参数判断是添加还是编辑
 defineExpose({ open })
-// 新增数据子传父
-const emit = defineEmits(['success'])
+
+const props = defineProps(['flog'])
 const onSubmit = async () => {
+  console.log(formModel.value, 'formModel.value')
+  formModel.value.classhours = formModel.value.classhours.toString()
+
   await formRef.value.validate()
   const isEdit = formModel.value.id
   if (isEdit) {
     await editCourseApi(formModel.value)
-    ElMessage.success('编辑成功')
+    ElMessage.success('修改成功')
+    emit('CloseCouresNameChange')
+    emit('success')
   } else {
+    // console.log(formModel.value)
     await addCourseApi(formModel.value)
     ElMessage.success('添加成功')
+    // 传递关闭抽屉事件
+    emit('CloseCouresNameChange')
+    emit('ClosecreditChange')
+    emit('CloseclasshoursChange')
   }
-  visibleDrawer.value = false
+  formModel.value = { ...defaultForm }
+  imgUrl.value = ''
   emit('success')
+  visibleDrawer.value = false
+}
+
+// const fileList: any = ref([])
+// function updHandle() {
+//   updFile()
+// }
+// function updFile() {
+//   const fileName = fileList.value[0]?.name
+//   const file = fileList.value[0]?.raw
+
+//   try {
+//     client()
+//       .multipartUpload(fileName, file)
+//       .then((res) => {
+//         console.log(res, '拿到图片url')
+//       })
+//   } catch (error) {
+//     console.log(error, 'error')
+//   }
+// }
+// 新增数据子传父
+const emit = defineEmits([
+  'success',
+  // 课程名称改变
+  'couresNameChange',
+  // 关闭课程名称改变
+  'CloseCouresNameChange',
+  // // 学分改变
+  // 'creditChange',
+  // // 学时改变
+  // 'classhoursChange',
+  // 关闭
+  'closecreditChange',
+  'closeclasshoursChange',
+])
+// 新增时数据同步
+const courseNameInput = () => {
+  if (!props.flog) {
+    emit('couresNameChange', formModel.value.name)
+  }
+}
+// const creditInput = () => {
+//   if (!props.flog) {
+//     emit('creditChange', formModel.value.credit)
+//   }
+// }
+// const classhoursInput = () => {
+//   if (!props.flog) {
+//     emit('classhoursChange', formModel.value.classhours)
+//   }
+// }
+// watch(
+//   () => props.flog,
+//   (newVal) => {
+//     console.log(newVal)
+//   },
+// )
+onMounted(() => {
+  console.log(props.flog)
+})
+const handleClose = () => {
+  console.log('关闭')
+  visibleDrawer.value = false
+  emit('CloseCouresNameChange')
+  // emit('ClosecreditChange')
+  // emit('CloseclasshoursChange')
 }
+const upload = async (option: any) => {
+  // console.log(option,)
+  const res = await tool.oss.upload(option.file)
+  // console.log(res.url)
+  formModel.value.img = res.url
+  imgUrl.value = formModel.value.img
+  console.log(formModel.value.img)
+}
+// const uploadChange = (file: any) => {
+//   console.log(file)
+//   defaultForm.file = file
+// }
 </script>
 
 <template>
   <el-drawer
+    :before-close="handleClose"
     v-model="visibleDrawer"
     direction="rtl"
     :title="formModel.id ? '编辑课程' : '添加课程'"
   >
     <el-form :model="formModel" :rules="rules" ref="formRef">
+      <el-form-item label="课程封面" prop="img">
+        <el-upload
+          v-model="formModel.img"
+          class="avatar-uploader"
+          :http-request="upload"
+          :show-file-list="false"
+        >
+          <img v-if="imgUrl" :src="imgUrl" class="avatar" />
+          <el-icon v-else class="avatar-uploader-icon">
+            <Plus />
+          </el-icon>
+          <template #tip>
+            <div class="el-upload__tip">图片文件要为jpg/png格式，小于500kb</div>
+          </template>
+        </el-upload>
+        <!-- <el-upload
+          class="avatar-uploader"
+          action="#"
+          :show-file-list="false"
+          v-model="defaultForm.file"
+          @change="uploadChange"
+        >
+          <img v-if="imgUrl" :src="imgUrl" class="avatar" />
+          <el-icon v-else class="avatar-uploader-icon">
+            <Plus />
+          </el-icon>
+        </el-upload> -->
+        <!-- 关闭自动上传，无需在提交前上传，本地预览即可s
+        URL.createObjectURL(...)创建本地预览的地址-->
+        <!-- <el-upload
+          v-model:flie-list="formModel.img"
+          class="avatar-uploader"
+          :show-file-list="false"
+          :auto-upload="false"
+          :http-request="upload"
+        >
+          <el-button>
+            <img v-if="imgUrl" :src="imgUrl" class="avatar" />
+            <el-icon v-else class="avatar-uploader-icon">
+              <Plus />
+            </el-icon>
+          </el-button>
+        </el-upload> -->
+      </el-form-item>
       <el-form-item label="课程名称" prop="name">
-        <el-input style="width: 200px" v-model="formModel.name"></el-input>
+        <el-input
+          :disabled="nameDisabled"
+          style="width: 200px"
+          v-model="formModel.name"
+          @input="courseNameInput"
+        ></el-input>
       </el-form-item>
       <el-form-item label="课程类别" prop="category">
         <el-radio-group v-model="formModel.category">
-          <el-radio value="major">专业教育</el-radio>
-          <el-radio value="common">通识教育</el-radio>
+          <el-radio value="1">专业教育</el-radio>
+          <el-radio value="2">通识教育</el-radio>
         </el-radio-group>
       </el-form-item>
       <el-form-item label="课程性质" prop="nature">
         <el-radio-group v-model="formModel.nature">
-          <el-radio value="required">必修</el-radio>
-          <el-radio value="elective">选修</el-radio>
-          <el-radio value="optional">任修</el-radio>
+          <el-radio value="1">必修</el-radio>
+          <el-radio value="2">选修</el-radio>
+          <el-radio value="3">任修</el-radio>
         </el-radio-group>
       </el-form-item>
       <el-form-item label="课程编码" prop="code">
-        <el-input style="width: 200px" v-model="formModel.code"></el-input>
+        <el-input
+          style="width: 200px"
+          v-model="formModel.code"
+          :disabled="codeDisabled"
+        ></el-input>
       </el-form-item>
       <el-form-item label="课程学分" prop="credit">
-        <el-input style="width: 200px" v-model="formModel.credit"></el-input>
+        <el-input
+          style="width: 200px"
+          v-model="formModel.credit"
+          @input="creditInput"
+        ></el-input>
       </el-form-item>
       <el-form-item label="课程学时" prop="classhours">
         <el-input
           style="width: 200px"
           v-model="formModel.classhours"
+          @input="classhoursInput"
         ></el-input>
       </el-form-item>
       <el-form-item label="考核类型" prop="assessmenttype">
         <el-radio-group v-model="formModel.assessmenttype">
-          <el-radio value="exam">考试</el-radio>
-          <el-radio value="assessment">考察</el-radio>
+          <el-radio value="1">考试</el-radio>
+          <el-radio value="2">考察</el-radio>
         </el-radio-group>
       </el-form-item>
       <el-form-item label="考核方式" prop="assessmentway">
         <el-radio-group v-model="formModel.assessmentway">
-          <el-radio value="open">开卷</el-radio>
-          <el-radio value="close">闭卷</el-radio>
-          <el-radio value="other">其他</el-radio>
+          <el-radio value="1">开卷</el-radio>
+          <el-radio value="2">闭卷</el-radio>
+          <el-radio value="3">其他</el-radio>
         </el-radio-group>
       </el-form-item>
       <el-form-item label="教学方法" prop="teachermethod">
@@ -173,12 +383,41 @@ const onSubmit = async () => {
 
     <template #footer>
       <span class="dialog-footer">
-        <el-button @click="visibleDrawer = false" size="large">取消</el-button>
+        <el-button @click="handleClose" size="large">取消</el-button>
         <el-button type="primary" size="large" @click="onSubmit()">
           确认
         </el-button>
+        <!-- <el-button @click="updHandle">上传</el-button> -->
       </span>
     </template>
   </el-drawer>
 </template>
-<style scoped></style>
+<style lang="scss" scoped>
+.avatar-uploader {
+  :deep() {
+    .avatar {
+      width: 178px;
+      height: 178px;
+      display: block;
+    }
+    .el-upload {
+      border: 1px dashed var(--el-border-color);
+      border-radius: 6px;
+      cursor: pointer;
+      position: relative;
+      overflow: hidden;
+      transition: var(--el-transition-duration-fast);
+    }
+    .el-upload:hover {
+      border-color: var(--el-color-primary);
+    }
+    .el-icon.avatar-uploader-icon {
+      font-size: 28px;
+      color: #8c939d;
+      width: 178px;
+      height: 178px;
+      text-align: center;
+    }
+  }
+}
+</style>