导出schema

src/layout/homeParts/header-1.vue

@@ -17,7 +17,7 @@
 import { reactive } from 'vue';
 const data = reactive({
   name: '建表项目',
-  user: { name: '王泓璎' },
+  user: { name: 'dbInit' },
   imgUrl: new URL('@/assets/image/logo.png', import.meta.url).href,
 });
 function logout() {}

src/stores/counter.ts

@@ -100,6 +100,11 @@ export const useCounterStore = defineStore('counter', () => {
     const res = await axios.$delete(`${tableApi.url}/${payload}`);
     return res;
   };
+  const getSchema = async (payload: any): Promise<IQueryResult> => {
+    const id = _.get(payload, 'id', _.get(payload, '_id'));
+    const res = await axios.$post(`${tableApi.url}/schema/${id}`);
+    return res;
+  };
   // 导出
   const exportData = async (data: any): Promise<IQueryResult> => {
     const res = await axios.$post(`${tableApi.url}/export`, data);
@@ -133,5 +138,6 @@ export const useCounterStore = defineStore('counter', () => {
     dirCreate,
     dirUpdate,
     dirDelete,
+    getSchema,
   };
 });

src/views/index.vue

@@ -9,13 +9,15 @@
         <el-col v-if="data.id">
           <el-button class="button" type="primary" size="large" @click="toDer()">添加文件夹</el-button>
           <el-button class="button" type="success" size="large" @click="toAdd()">添加表</el-button>
+          <el-button class="button" type="success" size="large" @click="toGetSchema()">导出schema</el-button>
         </el-col>
         <el-col v-else>
           <el-button class="button" type="primary" size="large" disabled>添加文件夹</el-button>
           <el-button class="button" type="success" size="large" disabled>添加表</el-button>
+          <el-button class="button" type="success" size="large" disabled>导出schema</el-button>
         </el-col>
       </el-col>
-      <Table :id="data.id" @toEdit="toEdit" @toEditDir="toEditDir" @toAddDir="toAddDir" @toAddTab="toAddTab" ref="clear"></Table>
+      <Table :id="data.id" @toEdit="toEdit" @toEditDir="toEditDir" @toAddDir="toAddDir" @toAddTab="toAddTab" ref="clear"> </Table>
     </el-col>
     <el-col class="form" v-else-if="data.show == 'form'">
       <Form @toBack="toBack" :form="form"></Form>
@@ -42,6 +44,7 @@
 
 <script setup lang="ts">
 import _ from 'lodash';
+import { ElMessage } from 'element-plus';
 import { reactive, ref } from 'vue';
 import type { Ref } from 'vue';
 import { useCounterStore as useStore } from '@/stores/counter';
@@ -87,6 +90,22 @@ if (props.id) {
     search();
   }
 }
+
+let toGetSchema = async () => {
+  const result = await store.getSchema({ id: data.id });
+  if (!_.isObject(result)) {
+    ElMessage({ type: 'warning', message: '获取的数据格式错误,无法导出' });
+    return false;
+  }
+  let title = `${data.name}-schema.js`;
+  const val = JSON.stringify(result.data, null, 2);
+  let blob = new Blob([val]);
+  let a = document.createElement('a');
+  a.href = window.URL.createObjectURL(blob);
+  a.download = title;
+  a.click();
+};
+
 // #region 添加修改表
 let form: Ref<{}> = ref({});
 // 添加修改
@@ -177,15 +196,18 @@ const handleClose = () => {
   padding: 24px;
   height: 92vh;
 }
+
 .btn {
   height: 50px;
   margin: 10px 0;
   text-align: center;
   background: #000;
 }
+
 .button {
   margin: 0 10%;
 }
+
 .head {
   height: 10vh;
   background: #fff;
@@ -194,30 +216,37 @@ const handleClose = () => {
   font-size: 22px;
   padding: 25px 0;
 }
+
 .head span {
   color: rgb(13, 193, 64);
   font-weight: 700;
 }
+
 .btn {
   margin: 10px 0;
   text-align: right;
 }
+
 .table {
   background: #ccc;
   /* overflow-y: scroll; */
   color: #000;
 }
+
 .table::-webkit-scrollbar {
   width: 1px;
 }
+
 .table::-webkit-scrollbar-thumb {
   border-radius: 10px;
   background: rgba(108, 43, 43, 0.2);
 }
+
 .table::-webkit-scrollbar-track {
   border-radius: 0;
   background: rgba(0, 0, 0, 0.1);
 }
+
 .form {
   background: #fff;
   overflow-y: scroll;
@@ -226,13 +255,16 @@ const handleClose = () => {
   margin: 20px 0 0 0;
   padding: 10px;
 }
+
 .form::-webkit-scrollbar {
   width: 1px;
 }
+
 .form::-webkit-scrollbar-thumb {
   border-radius: 10px;
   background: rgba(108, 43, 43, 0.2);
 }
+
 .form::-webkit-scrollbar-track {
   border-radius: 0;
   background: rgba(0, 0, 0, 0.1);