Merge branch 'main' of http://123.60.103.97:3000/xuziqiang/SaaS-lib

lib/component/table/table.vue

@@ -15,7 +15,7 @@
     </div>
     <div class="ns-table-container">
       <div class="ns-part-tree" v-if="!isEmpty(treeConfig)">
-        <ns-tree v-if="getTreeData.length" v-bind="getTreeBindValue" @select="treeSelect" />
+        <ns-tree-api v-bind="getTreeBindValue" @select="treeSelect" />
       </div>
       <div class="ns-part-table">
         <a-spin :spinning="tableState.loading">

lib/component/tree/tree-api.vue

@@ -1,72 +1,64 @@
 <template>
-  <ns-tree v-bind="getBindValue">
+  <ns-tree v-if="treeData.length" v-bind="getBindValue">
     <template #[item]="data" v-for="item in Object.keys($slots)" :key="item">
       <slot :name="item" v-bind="data || {}"></slot>
     </template>
   </ns-tree>
 </template>
-<script lang="ts">
-  import { computed, defineComponent, ref, unref } from 'vue';
+<script lang="ts" setup>
+  import { computed, ref, unref, useAttrs } from 'vue';
   import { TreeDataItem } from 'ant-design-vue/es/tree/Tree';
-  import { http } from '/nerv-lib/util/http';
+  import { useApi } from '/nerv-lib/use/use-api';
+  import { AxiosRequestConfig } from 'axios';
   import { get } from 'lodash-es';
-
-  export default defineComponent({
+  import { useRoute } from 'vue-router';
+  interface Props {
+    api: string | Function | object;
+    params?: object;
+    defaultParams?: object;
+    transform?: Function;
+    resultField?: string;
+    defaultExpandAll?: boolean;
+    blockNode?: boolean;
+  }
+  defineOptions({
     name: 'NsTreeApi',
-    props: {
-      api: {
-        type: String,
-        required: true,
-      },
-      params: {
-        type: Object,
-      },
-      transform: {
-        type: Function,
-        default: null,
-      },
-      resultField: {
-        type: String,
-        default: 'data.data',
-      },
-      defaultExpandAll: {
-        type: Boolean,
-        default: true,
-      },
-      blockNode: {
-        type: Boolean,
-        default: true,
-      },
-    },
-    setup(props, { attrs }) {
-      const treeData = ref<TreeDataItem[]>([]);
-      const getBindValue = computed(() => ({
-        ...attrs,
-        ...props,
-        treeData: treeData.value,
-      }));
-
-      const getData = () => {
-        const { params, transform, resultField } = props;
-        treeData.value = [];
-        http.get(props.api, unref(params)).then((res) => {
-          let data = [];
-          if (resultField) {
-            data = get(res, resultField);
-          }
-          if (transform) {
-            treeData.value = transform(data);
-          }
-        });
-      };
-
-      getData();
-
-      return {
-        treeData,
-        getBindValue,
-      };
-    },
   });
+  const props = withDefaults(defineProps<Props>(), {
+    resultField: 'data',
+    blockNode: true,
+    defaultExpandAll: true,
+    transform: (data) => data,
+  });
+  const treeData = ref<TreeDataItem[]>([]);
+  const { httpRequest } = useApi();
+  const requestConfig: AxiosRequestConfig = { method: 'get' };
+  const route = useRoute();
+  const attrs = useAttrs();
+
+  const getBindValue = computed(() => ({
+    ...attrs,
+    ...props,
+    treeData: treeData.value,
+  }));
+
+  const getData = () => {
+    const { api, defaultParams, transform, resultField } = props;
+
+    treeData.value = [];
+    if (!api) return;
+    httpRequest({
+      api,
+      params: { ...route.params, ...route.query, ...defaultParams },
+      pathParams: { ...route.params, ...route.query },
+      requestConfig,
+    }).then((res) => {
+      let data = [];
+      data = get(res, resultField);
+      treeData.value = transform(data);
+    });
+  };
+
+  getData();
 </script>
 <style lang="less" scoped></style>