feat: 用户管理样式调整

lib/component/tree/props.ts

@@ -38,6 +38,7 @@ export const treeProps = {
   blockNode: PropTypes.bool.def(true),
   defaultExpandAll: PropTypes.bool.def(true),
   resultField: PropTypes.string.def('data'),
+  header: PropTypes.object,
   transform: {
     type: Function,
     default: (data: any) => data,

lib/component/tree/tree-api.vue

@@ -1,13 +1,19 @@
 <template>
   <a-spin :spinning="treeState.loading">
+    <div v-if="header" class="ns-tree-title">
+      <ns-icon :name="header.icon" size="14" />
+      <span>{{ header.title }}</span>
+    </div>
     <div v-if="!formConfig?.schema">
       <ns-form ref="formElRef" v-bind="formConfig" :model="formModel" @finish="formFinish" />
     </div>
-    <ns-tree v-if="treeData?.length" v-bind="getBindValue" v-model:selectedKeys="selectedKeys">
-      <template #[item]="data" v-for="(item, index) in Object.keys($slots)" :key="index">
-        <slot :name="item" v-bind="data || {}"></slot>
-      </template>
-    </ns-tree>
+    <div>
+      <ns-tree v-if="treeData?.length" v-bind="getBindValue" v-model:selectedKeys="selectedKeys">
+        <template #[item]="data" v-for="(item, index) in Object.keys($slots)" :key="index">
+          <slot :name="item" v-bind="data || {}"></slot>
+        </template>
+      </ns-tree>
+    </div>
   </a-spin>
 </template>
 <script lang="ts" setup>
@@ -17,13 +23,14 @@
   import { AxiosRequestConfig } from 'axios';
   import { get } from 'lodash-es';
   import { useRoute } from 'vue-router';
-  import { isEmpty } from 'lodash-es';
+  import { debounce } from 'lodash-es';
   import { treeProps, treeFormProps } from '/nerv-lib/component/tree/props';
   const formElRef = ref();
   defineOptions({
     name: 'NsTreeApi',
   });
   const props = defineProps(treeProps);
+
   const treeData = ref<TreeDataItem[]>([]);
   const selectedKeys = ref(props.defaultSelectedKeys || []);
   const { httpRequest } = useApi();
@@ -32,7 +39,7 @@
   const attrs = useAttrs();
   const formModel = reactive({});
   const treeState = reactive({
-    loading: true,
+    loading: false,
   });
   const formConfig = computed(() => {
     return {
@@ -40,9 +47,9 @@
       ...props.formConfig,
     };
   });
-  const formFinish = () => {
-    getData();
-  };
+  const formFinish = debounce((data: object) => {
+    getData(data);
+  }, 200);
   const getBindValue = computed(() => ({
     ...attrs,
     ...props,
@@ -55,19 +62,20 @@
     return { ...route.params, ...route.query, ...props.defaultParams };
   });
 
-  const getData = () => {
+  const getData = (params = {}) => {
     const { api, transform, resultField } = props;
     treeData.value = [];
     if (!api) return;
     setLoading(true);
     httpRequest({
       api,
-      params: httpPrams,
-      pathParams: { ...route.params, ...route.query },
-      requestConfig,
+      params: { ...httpPrams.value, ...params },
+      pathParams: { ...route.params, ...route.query, ...params },
+      requestConfig: { ...requestConfig, data: { ...httpPrams.value, ...params } },
     })
       .then((res) => {
         treeData.value = transform(get(res, resultField));
+        console.log(treeData.value, 'treeData.value');
       })
       .finally(() => {
         setLoading(false);
@@ -76,4 +84,27 @@
 
   getData();
 </script>
-<style lang="less" scoped></style>
+<style lang="less" scoped>
+  :deep(.ant-form-item) {
+    margin-bottom: 16px;
+  }
+
+  :deep(.ns-form::after) {
+    display: none;
+  }
+
+  .ns-tree-title {
+    font-weight: bold;
+    user-select: text;
+    padding: 16px;
+    margin-bottom: 16px;
+    padding-bottom: 10px;
+    border-bottom: 1px solid #e9e9e9;
+    > span {
+      padding-left: 6px;
+    }
+    & ~ div {
+      padding: 0 16px !important;
+    }
+  }
+</style>

lib/saas/view/service/error-403.vue

@@ -3,7 +3,7 @@
     <a-layout class="ns-application" style="height: 100%">
       <ns-header class="ns-header-menu" />
       <a-layout>
-        <ns-sider class="ns-left-menu" />
+        <!-- <ns-sider class="ns-left-menu" /> -->
         <a-layout>
           <a-layout-content class="content" :style="{ minHeight: '400px', overflow: 'auto' }">
             <div>
@@ -43,6 +43,7 @@
     display: flex;
     align-items: center;
     justify-content: center;
+    padding-top: 200px;
     img {
       width: 240px;
       height: 240px;

lib/util/http/axios.ts

@@ -78,6 +78,7 @@ export class NSAxios {
     const errCodeMap = new Map<number, any>([
       [13, ''],
       [1, ''],
+      [3005, ''],
       [10086, () => routerConfig.logout()],
     ]);