5.0

sop-website/sop-website-frontend/src/views/doc/api/index.vue

@@ -12,15 +12,45 @@ import {
   responseParamsExample,
   dataNodeType,
   resultData,
-  onMenuClick
+  onMenuClick,
+  handleChangeDocApp,
+  docAppId,
+  docAppList,
+  docTree,
+  handleNodeClick
 } from "./index";
 import { ApiParamTable } from "@/components/ApiParamTable";
 import MavonEditor from "mavon-editor";
+const defaultProps = {
+  children: "children",
+  label: "docTitle"
+};
 </script>
 <template>
   <el-container>
-    <el-aside width="300px">left</el-aside>
-    <el-main>
+    <el-aside width="300px">
+      <el-select
+        v-show="docAppId > 0"
+        v-model="docAppId"
+        placeholder="Select"
+        size="large"
+        @change="handleChangeDocApp"
+      >
+        <el-option
+          v-for="item in docAppList"
+          :key="item.id"
+          :label="item.appName"
+          :value="item.id"
+        />
+      </el-select>
+      <el-tree
+        :data="docTree"
+        :props="defaultProps"
+        style="margin-top: 20px"
+        @node-click="handleNodeClick"
+      />
+    </el-aside>
+    <el-main style="padding-top: 0">
       <div v-show="contentShow">
         <MavonEditor
           v-model="content"