From 64cfd47d50af4995c598d8588dade1faac94afc5 Mon Sep 17 00:00:00 2001
From: 28723 <2822784518@qq.com>
Date: Mon, 8 Jul 2024 10:05:22 +0800
Subject: [PATCH] Merge branch 'temp' of
 http://123.60.103.97:3000/xuziqiang/SaaS-lib into temp

---
 hx-ai-intelligent/index.html                  |   2 +-
 hx-ai-intelligent/public/projectIcon.svg      |  10 ++
 hx-ai-intelligent/src/api/deviceManage.ts     |  11 +-
 hx-ai-intelligent/src/api/index.ts            |   3 +
 hx-ai-intelligent/src/api/origanizemanage.ts  |   3 +-
 .../src/components/ns-modal-form.vue          |  88 ++++++++++++
 .../src/router/organizationManage.ts          |   1 -
 .../src/view/equipmentManage/group/config.ts  | 132 +++++++++++++-----
 .../src/view/equipmentManage/group/index.vue  | 107 +++++++++++++-
 .../departmentManage/config.ts                |   1 +
 .../departmentManage/index.vue                |  93 ++++++------
 .../organizationManage/usermanage/config.ts   |   1 +
 .../organizationManage/usermanage/index.vue   |  71 ++++------
 lib/component/form/form/form.vue              |  10 +-
 lib/component/tree/props.ts                   |   1 +
 lib/component/tree/tree-api.vue               |  23 ++-
 lib/saas/config/form.config.ts                |  11 ++
 lib/saas/view/system/login.vue                | 123 ++++++++++------
 18 files changed, 500 insertions(+), 191 deletions(-)
 create mode 100644 hx-ai-intelligent/public/projectIcon.svg
 create mode 100644 hx-ai-intelligent/src/components/ns-modal-form.vue
diff --git a/hx-ai-intelligent/index.html b/hx-ai-intelligent/index.html
index 420aa9c..5c8b60a 100644
--- a/hx-ai-intelligent/index.html
+++ b/hx-ai-intelligent/index.html
@@ -2,7 +2,7 @@
 <html lang="en">
   <head>
     <meta charset="UTF-8" />
-    <link rel="icon" href="/favicon.ico" />
+    <link rel="icon" href="/projectIcon.svg" />
     <meta name="referrer" content="never" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <!-- <script type="text/javascript">
diff --git a/hx-ai-intelligent/public/projectIcon.svg b/hx-ai-intelligent/public/projectIcon.svg
new file mode 100644
index 0000000..3ad2419
--- /dev/null
+++ b/hx-ai-intelligent/public/projectIcon.svg
@@ -0,0 +1,10 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="36" height="36" viewBox="0 0 36 36">
+  <g id="组_23402" data-name="组 23402" transform="translate(-959.12 -738.12)">
+    <rect id="矩形_16530" data-name="矩形 16530" width="36" height="36" transform="translate(959.12 738.12)" fill="none"/>
+    <g id="组_23400" data-name="组 23400" transform="translate(960.956 739.956)">
+      <path id="路径_30576" data-name="路径 30576" d="M207.674,163.872v-9.284a2.553,2.553,0,0,0-1.179-2.063l-8.056-4.634a2.417,2.417,0,0,0-2.358,0l-8.023,4.65a2.38,2.38,0,0,0-1.179,2.063v9.333A2.553,2.553,0,0,0,188.059,166l8.056,4.585a2.417,2.417,0,0,0,2.358,0l8.056-4.634A2.331,2.331,0,0,0,207.674,163.872Z" transform="translate(-181.117 -142.881)" fill="#4388fb" opacity="0.2"/>
+      <path id="路径_30577" data-name="路径 30577" d="M265.893,314.283h-2.718l-.884-2.653h-4.224l-.884,2.653h-2.718l4.224-11.625h2.9Zm-4.093-4.617-1.326-4.044a9.365,9.365,0,0,1-.2-1.015h-.065a5.831,5.831,0,0,1-.2,1.015l-1.326,4.044Zm8.072-7.073v11.625h-2.456V302.592Z" transform="translate(-246.539 -292.932)" fill="#4388fb"/>
+      <path id="路径_30578" data-name="路径 30578" d="M36.685,20.095a.9.9,0,0,0-.884.884v2.472a1.535,1.535,0,0,1-.77,1.294L23.7,31.262a1.422,1.422,0,0,1-1.523,0l-11.33-6.517a1.456,1.456,0,0,1-.77-1.294V20.177a2.409,2.409,0,0,0-1-4.6,2.425,2.425,0,0,0-2.423,2.407,2.391,2.391,0,0,0,1.637,2.276v3.176a3.268,3.268,0,0,0,1.637,2.816l11.33,6.582a3.244,3.244,0,0,0,1.637.409,3.471,3.471,0,0,0,1.637-.475l11.281-6.517a3.268,3.268,0,0,0,1.637-2.816V20.963A.76.76,0,0,0,36.685,20.095Zm.884-6.942V10.287a3.268,3.268,0,0,0-1.637-2.816L24.585.954a3.284,3.284,0,0,0-3.291,0L9.947,7.471A3.268,3.268,0,0,0,8.31,10.287v2.227a.884.884,0,1,0,1.768,0V10.287a1.535,1.535,0,0,1,.77-1.294l11.33-6.517a1.422,1.422,0,0,1,1.523,0L34.982,9.059a1.456,1.456,0,0,1,.77,1.294v2.734a2.4,2.4,0,1,0,1.817.065Z" transform="translate(-6.656 -0.512)" fill="#4388fb"/>
+    </g>
+  </g>
+</svg>
diff --git a/hx-ai-intelligent/src/api/deviceManage.ts b/hx-ai-intelligent/src/api/deviceManage.ts
index b044e78..ea91ef7 100644
--- a/hx-ai-intelligent/src/api/deviceManage.ts
+++ b/hx-ai-intelligent/src/api/deviceManage.ts
@@ -1,10 +1,11 @@
-const BASE_URL = '/carbon-smart';
+import { BASE_URL } from './index';
 export enum device {
-  queryDeviceTree = `${BASE_URL}/deviceInfo/queryDeviceTree`,
-  queryDevicePage = `${BASE_URL}/deviceInfo/queryDevicePage`,
-  dropArea = `${BASE_URL}/deviceInfo/dropArea`,
+  queryDeviceTree = `${BASE_URL}/deviceInfo/queryDeviceTree`, // 左侧树
+  queryDevicePage = `${BASE_URL}/deviceInfo/queryDevicePage`, // 列表
+  dropArea = `${BASE_URL}/deviceInfo/dropArea`, // 查询下拉区域
 }
 
 export enum group {
-  queryDeviceGroupTree = `${BASE_URL}/deviceGroup/queryDeviceGroupTree`,
+  queryDeviceGroupTree = `${BASE_URL}/deviceGroup/queryDeviceGroupTree`, // 左侧树
+  creatOrUpdate = `${BASE_URL}/deviceGroup/creatOrUpdate`, // 左侧树节点新增编辑
 }
diff --git a/hx-ai-intelligent/src/api/index.ts b/hx-ai-intelligent/src/api/index.ts
index 6ae56cc..a2e9325 100644
--- a/hx-ai-intelligent/src/api/index.ts
+++ b/hx-ai-intelligent/src/api/index.ts
@@ -4,3 +4,6 @@
 export const apiModule = {
   parking: ['User', 'CurrentUser', 'Organizational'],
 };
+
+export const BASE_URL = '/carbon-smart';
+export const dict = `${BASE_URL}/client/dict/listByKey`;
diff --git a/hx-ai-intelligent/src/api/origanizemanage.ts b/hx-ai-intelligent/src/api/origanizemanage.ts
index 17ce885..de7e06d 100644
--- a/hx-ai-intelligent/src/api/origanizemanage.ts
+++ b/hx-ai-intelligent/src/api/origanizemanage.ts
@@ -1,4 +1,5 @@
-const BASE_URL = '/carbon-smart';
+import { BASE_URL } from './index';
+
 export enum permission {
   add = `${BASE_URL}/admin/permission/save`,
   queryOrgPermission = `${BASE_URL}/api/dept/queryOrgPermission`,
diff --git a/hx-ai-intelligent/src/components/ns-modal-form.vue b/hx-ai-intelligent/src/components/ns-modal-form.vue
new file mode 100644
index 0000000..24af74c
--- /dev/null
+++ b/hx-ai-intelligent/src/components/ns-modal-form.vue
@@ -0,0 +1,88 @@
+<template>
+  <ns-modal
+    ref="modalRef"
+    v-bind="extraModalConfig"
+    destroyOnClose
+    v-model:visible="visible"
+    :title="title"
+    :okButtonProps="buttonProps"
+    @ok="handleOk">
+    <ns-form ref="formRef" :schemas="schemas" :model="formData" formLayout="formVertical" />
+  </ns-modal>
+</template>
+
+<script lang="ts" setup>
+  import { computed, ref, toRefs, watch } from 'vue';
+  import { HttpRequestConfig, NsMessage, useApi } from '/nerv-lib/saas';
+  import { useRoute } from 'vue-router';
+  type Props = {
+    title?: string;
+    schemas: Array<any>;
+    api: string | object | Function;
+    data?: object;
+    extraModalConfig?: object;
+  };
+  const route = useRoute();
+  const { httpRequest } = useApi();
+
+  const props = withDefaults(defineProps<Props>(), {
+    title: '新增',
+  });
+  const { schemas } = toRefs(props);
+  const formData = ref();
+  watch(
+    () => props?.data,
+    (val) => {
+      formData.value = val;
+    },
+    {
+      immediate: true,
+      deep: true,
+    },
+  );
+  const modalRef = ref();
+  const formRef = ref();
+  const visible = ref(false);
+  const validateResult = computed(() => {
+    return !formRef.value?.validateResult;
+  });
+  const toggle = () => {
+    visible.value = !visible.value;
+  };
+
+  const setLoading = (loading = true) => {
+    buttonProps.value.loading = loading;
+  };
+
+  const handleOk = () => {
+    setLoading(true);
+    formRef.value
+      .triggerSubmit()
+      .then((data: any) => {
+        const { api } = props;
+        const requestConfig: HttpRequestConfig = { method: 'POST' };
+        const { params } = route;
+
+        httpRequest({ api, params: data, pathParams: params, requestConfig })
+          .then(() => {
+            NsMessage.success('操作成功', 1, () => {
+              toggle();
+            });
+          })
+          .finally(() => {
+            setLoading(false);
+          });
+      })
+      .catch(() => {});
+  };
+
+  const buttonProps = ref({
+    disabled: validateResult,
+    loading: false,
+  });
+
+  defineExpose({
+    toggle,
+  });
+</script>
+<style lang="less"></style>
diff --git a/hx-ai-intelligent/src/router/organizationManage.ts b/hx-ai-intelligent/src/router/organizationManage.ts
index eb97190..e02f7c4 100644
--- a/hx-ai-intelligent/src/router/organizationManage.ts
+++ b/hx-ai-intelligent/src/router/organizationManage.ts
@@ -19,7 +19,6 @@ const organizationManage = {
           meta: {
             title: '用户管理',
             keepAlive: true,
-            isCheck: false,
             operates: [
               { title: '新增', code: 'userAdd' },
               { title: '导入', code: 'userImport' },
diff --git a/hx-ai-intelligent/src/view/equipmentManage/group/config.ts b/hx-ai-intelligent/src/view/equipmentManage/group/config.ts
index c45b566..83a911a 100644
--- a/hx-ai-intelligent/src/view/equipmentManage/group/config.ts
+++ b/hx-ai-intelligent/src/view/equipmentManage/group/config.ts
@@ -2,6 +2,8 @@ import { dateUtil } from '/nerv-lib/util/date-util';
 import data from './mock.json';
 import { http } from '/nerv-lib/util';
 import { ref } from 'vue';
+import { group } from '/@/api/deviceManage';
+import { dict } from '/@/api';
 const tableKeyMap = [
   {
     title: '来源企业',
@@ -57,49 +59,105 @@ const doWnload = (url) => {
 };
 
 const mockData = ref(data.listData);
-export const treeConfig = {
-  defaultExpandAll: true,
-  header: {
-    icon: 'orgLink',
-    title: '能耗分组',
+export const formSchema = [
+  {
+    field: 'isCreate',
+    component: 'NsInput',
+    show: false,
   },
-
-  api: () => {
-    return new Promise((resolve) => {
-      setTimeout(() => {
-        resolve(data);
-      }, 100);
-    });
+  {
+    field: 'orgId',
+    component: 'NsInput',
+    show: false,
   },
-  formConfig: {
-    schemas: [
+  {
+    field: 'isCreatSon',
+    component: 'NsInput',
+    show: false,
+  },
+  {
+    label: '节点名称',
+    field: 'pointName',
+    component: 'NsInput',
+    componentProps: {
+      placeholder: '请输入节点名称(必填)',
+    },
+    rules: [
       {
-        field: 'type',
-        label: '',
-        component: 'NsSelect',
-        autoSubmit: true,
-        defaultValue: 1,
-        componentProps: {
-          options: [
-            { label: '碳排', value: 1 },
-            { label: '用电量', value: 2 },
-            { label: '用水量', value: 3 },
-            { label: '燃气量', value: 4 },
-            { label: '供热量', value: 5 },
-          ],
-        },
-      },
-      {
-        field: 'name',
-        label: '',
-        component: 'NsInput',
-        autoSubmit: true,
-        componentProps: {
-          placeholder: '请输入',
-        },
+        required: true,
+        message: '请输入节点名称',
       },
     ],
   },
+  {
+    label: '节点类型',
+    field: 'pointType',
+    component: 'NsSelectApi',
+    componentProps: {
+      placeholder: '请选择节点类型(必填)',
+      api: dict,
+      params: { dicKey: 'COUNT_POINT' },
+      immediate: true,
+      resultField: 'data.COUNT_POINT',
+      labelField: 'cnValue',
+      valueField: 'cnValue',
+    },
+    rules: [
+      {
+        required: true,
+        message: '请输入节点类型',
+      },
+    ],
+  },
+];
+export const treeConfig = (orgId) => {
+  return {
+    defaultExpandAll: true,
+    header: {
+      icon: 'orgLink',
+      title: '能耗分组',
+    },
+    params: { orgId },
+    api: group.queryDeviceGroupTree,
+    // api: () => {
+    //   return new Promise((resolve) => {
+    //     setTimeout(() => {
+    //       resolve({ data: [{ title: '全部', key: 'all', children: data.data }] });
+    //     }, 100);
+    //   });
+    // },
+    transform: (data) => {
+      return [{ title: '全部', key: 'all', selectable: false, children: data }];
+    },
+    formConfig: {
+      schemas: [
+        {
+          field: 'energyType',
+          label: '',
+          component: 'NsSelectApi',
+          autoSubmit: true,
+          componentProps: {
+            api: dict,
+            params: { dicKey: 'ENERGY_TYPE' },
+            immediate: true,
+            resultField: 'data.ENERGY_TYPE',
+            labelField: 'cnValue',
+            valueField: 'cnValue',
+            placeholder: '请选择能耗种类',
+          },
+        },
+        {
+          field: 'pointName',
+          label: '',
+          component: 'NsInput',
+          autoSubmit: true,
+          componentProps: {
+            placeholder: '请输入节点名称',
+          },
+        },
+      ],
+    },
+  };
 };
 export const tableConfig = (el, elGroup, elFormula) => {
   return {
diff --git a/hx-ai-intelligent/src/view/equipmentManage/group/index.vue b/hx-ai-intelligent/src/view/equipmentManage/group/index.vue
index d88f11e..997394e 100644
--- a/hx-ai-intelligent/src/view/equipmentManage/group/index.vue
+++ b/hx-ai-intelligent/src/view/equipmentManage/group/index.vue
@@ -2,29 +2,113 @@
   <editDrawer ref="editDrawerRef" />
   <editGroup ref="editGroupRef" />
   <editFormula ref="editFormulaRef" />
+
+  <!-- <ns-modal ref="modalRef" title="新增" v-model:visible="visible">
+    <ns-form ref="formRef" :schemas="formSchema" :model="formData" formLayout="formVertical" />
+  </ns-modal> -->
+
+  <NsModalFrom ref="modalFormRef" v-bind="nsModalFormConfig" />
   <div class="groupContainer">
     <div class="tree">
-      <ns-tree-api v-bind="treeConfig" @select="handleSelect" />
+      <ns-tree-api v-bind="tConfig" @select="handleSelect">
+        <template #title="data">
+          <div class="treeRow">
+            <span>{{ data.title }}</span>
+            <a-dropdown>
+              <ns-icon name="actionMore" size="14" class="actionMore" />
+              <template #overlay>
+                <a-menu>
+                  <a-menu-item
+                    v-for="(item, index) in actionList"
+                    :key="index"
+                    @click="item.func(data)">
+                    <span>{{ item.title }}</span>
+                  </a-menu-item>
+                </a-menu>
+              </template>
+            </a-dropdown>
+          </div>
+        </template>
+      </ns-tree-api>
     </div>
     <ns-view-list-table v-show="defaultType" class="table" v-bind="config" />
     <ns-view-list-table v-show="!defaultType" class="table" v-bind="configCal" />
   </div>
 </template>
 <script lang="ts" setup>
-  import { createVNode, onMounted, ref } from 'vue';
-  import { tableConfig, treeConfig, tableConfigCal } from './config';
+  import { createVNode, nextTick, onMounted, ref } from 'vue';
+  import { tableConfig, treeConfig, tableConfigCal, formSchema } from './config';
   import { useParams } from '/nerv-lib/use';
   import editDrawer from './edit.vue';
   import editGroup from './editGroup.vue';
   import editFormula from './editFormula.vue';
+  import { NsMessage, NsModal } from '/nerv-lib/component';
+  import NsModalFrom from '/@/components/ns-modal-form.vue';
+  import { group } from '/@/api/deviceManage';
 
+  type opType = 'up' | 'down';
   const { getParams } = useParams();
+  const modalFormRef = ref();
   const editDrawerRef = ref();
   const editGroupRef = ref();
   const editFormulaRef = ref();
   const defaultType = ref(true);
+  const result = JSON.parse(sessionStorage.getItem('ORGID')!);
   const config = tableConfig(editDrawerRef, editGroupRef, editFormulaRef);
   const configCal = tableConfigCal(editDrawerRef, editGroupRef, editFormulaRef);
+  const tConfig = treeConfig(result);
+  const nsModalFormConfig = ref({
+    api: group.creatOrUpdate,
+    data: {},
+    title: '新增',
+    schemas: formSchema,
+    extraModalConfig: {
+      bodyStyle: { paddingBottom: 0 },
+    },
+  });
+  nextTick(() => {
+    console.log(modalFormRef.value, 'modal');
+  });
+
+  const addNodeSon = (data) => {
+    console.log(data);
+    nsModalFormConfig.value.title = '新增';
+    nsModalFormConfig.value.data = {
+      pointName: '新增',
+      isCreate: true,
+      isCreatSon: false,
+      orgId: result,
+    };
+    modalFormRef.value?.toggle();
+  };
+  const editNode = (data) => {
+    console.log(data);
+    nsModalFormConfig.value.title = '编辑';
+    nsModalFormConfig.value.data = { pointName: 123 };
+    modalFormRef.value?.toggle();
+
+    data.value = { pointName: 'qwe' };
+  };
+  const moveNode = (data, type: opType) => {
+    console.log(data);
+  };
+
+  const deleteNode = (a) => {
+    NsModal.confirm({
+      content: '确定删除吗?',
+      onOk: () => {
+        console.log(a);
+      },
+    });
+  };
+  const filterAction = (data) => {};
+  const actionList = [
+    { title: '新增子节点', key: 'addNodeSon', func: (data) => addNodeSon(data) },
+    { title: '编辑', key: 'editNode', func: (data) => editNode(data) },
+    { title: '上移', key: 'moveUp', func: (data) => moveNode(data, 'up') },
+    { title: '下移', key: 'moveDown', func: (data) => moveNode(data, 'down') },
+    { title: '删除', key: 'deleteNode', func: (data) => deleteNode(data) },
+  ];
   const handleSelect = () => {
     defaultType.value = !defaultType.value;
   };
@@ -55,4 +139,21 @@
       min-width: 0;
     }
   }
+
+  .actionMore {
+    display: none;
+  }
+  :deep(.ant-tree-node-content-wrapper) {
+    &:hover {
+      .actionMore {
+        display: block;
+      }
+    }
+  }
+
+  .treeRow {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+  }
 </style>
diff --git a/hx-ai-intelligent/src/view/organizationManage/departmentManage/config.ts b/hx-ai-intelligent/src/view/organizationManage/departmentManage/config.ts
index 5431020..50da653 100644
--- a/hx-ai-intelligent/src/view/organizationManage/departmentManage/config.ts
+++ b/hx-ai-intelligent/src/view/organizationManage/departmentManage/config.ts
@@ -131,6 +131,7 @@ export const formConfig2 = (disabled2: Boolean) => {
       label: '是否部门领导',
       field: 'isLeader',
       component: 'NsRadioGroup',
+      defaultValue: 1,
       componentProps: {
         disabled: disabled2,
         radioType: 'radio',
diff --git a/hx-ai-intelligent/src/view/organizationManage/departmentManage/index.vue b/hx-ai-intelligent/src/view/organizationManage/departmentManage/index.vue
index b4c198a..e9bbadf 100644
--- a/hx-ai-intelligent/src/view/organizationManage/departmentManage/index.vue
+++ b/hx-ai-intelligent/src/view/organizationManage/departmentManage/index.vue
@@ -65,10 +65,10 @@
             </a-tabs>
             <a-space v-if="activeKey === 1 || deptPermissionTreeData?.length">
               <ns-button type="primary" @click="CancelApartment">取消 </ns-button>
-              <ns-button v-show="disabled" type="primary" @click="pipe(deptEdit, true, false)">
+              <ns-button v-if="disabled" type="primary" @click="pipe(deptEdit, true, false)">
                 编辑
               </ns-button>
-              <ns-button v-show="!disabled" type="primary" @click="deptSure">确定</ns-button>
+              <ns-button v-else type="primary" @click="deptSure">确定</ns-button>
             </a-space>
           </div>
         </a-col>
@@ -79,11 +79,11 @@
       <a-row>
         <a-col :span="8" class="tree">
           <a-space wrap style="margin-bottom: 16px; justify-content: flex-start">
-            <ns-button v-auth="'userAdd'" type="primary" @click="rolePipe(addUser, true)">
+            <!-- <ns-button v-auth="'userAdd'" type="primary" @click="rolePipe(addUser, true)">
               新增角色
             </ns-button>
             <ns-button type="primary" @click="rolePipe(addUserSon)">新增子角色</ns-button>
-            <ns-button type="primary" @click="rolePipe(deleteUser)"> 删除 </ns-button>
+            <ns-button type="primary" @click="rolePipe(deleteUser)"> 删除 </ns-button> -->
           </a-space>
           <a-tree
             v-if="roleTreeData.length"
@@ -95,19 +95,19 @@
             <template #title="data">
               <div style="display: flex; justify-content: space-between; align-items: center">
                 <span> {{ data.zhName }}</span>
-                <!-- <a-dropdown>
+                <a-dropdown>
                   <ns-icon name="actionMore" size="14" class="actionMore" />
                   <template #overlay>
                     <a-menu>
                       <a-menu-item
-                        v-for="(action, index) in dropRoleActions"
+                        v-for="(action, index) in filterAction(data, dropRoleActions, 'addUser')"
                         :key="index"
                         @click="action.func(data)">
                         <span>{{ action.title }}</span>
                       </a-menu-item>
                     </a-menu>
                   </template>
-                </a-dropdown> -->
+                </a-dropdown>
               </div>
             </template>
           </a-tree>
@@ -139,20 +139,16 @@
                 <a-empty style="margin-top: 120px" v-else />
               </a-tab-pane>
             </a-tabs>
-            <a-space>
+            <a-space v-if="roleActiveKey === 1 || rolePermissionTreeData?.length">
               <ns-button type="primary" @click="CancelUser">取消</ns-button>
               <ns-button
-                v-show="roleDisabled"
+                v-if="roleDisabled"
                 :disabled="!roleTreeData?.length"
                 type="primary"
                 @click="rolePipe(roleEdit, false, false)">
                 编辑
               </ns-button>
-              <ns-button
-                v-show="!roleDisabled"
-                :disabled="!roleTreeData?.length"
-                type="primary"
-                @click="roleSure">
+              <ns-button v-else :disabled="!roleTreeData?.length" type="primary" @click="roleSure">
                 确定
               </ns-button>
             </a-space>
@@ -167,7 +163,7 @@
   import { Modal } from 'ant-design-vue';
   import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
   import { http } from '/nerv-lib/util/http';
-  import { cloneDeep, get } from 'lodash-es';
+  import { cloneDeep, get, isEmpty } from 'lodash-es';
   import { formConfig, formConfig2 } from './config';
   import { department } from '/@/api/origanizemanage';
   import { permission } from '/@/api/origanizemanage';
@@ -180,7 +176,7 @@
   const formRef = ref();
   const formRoleRef = ref();
   let formData = ref({});
-  let roleFormData = ref({});
+  let roleFormData = ref({ isLeader: 1 });
   const activeKey = ref(1);
   const roleActiveKey = ref(1);
   const disabled = ref(true);
@@ -224,7 +220,7 @@
 
   /**操作拦截 */
   const pipe = (func: Function, flag = false, toggle = true) => {
-    if (toggle) activeKey.value = 1;
+    // if (toggle) activeKey.value = 1;
     if (flag) {
       // 只有部门的操作
       if (selectRef.value?.hasOwnProperty('orgInfo') || !selectRef.value?.deptInfo) {
@@ -243,13 +239,15 @@
 
   const rolePipe = (func: Function, linkDept = false, toggle = true) => {
     console.log(selectRoleRef.value);
-    if (toggle) roleActiveKey.value = 1;
+    // if (toggle) roleActiveKey.value = 1;
     // 需要先选择部门
     if ((linkDept && !selectRef.value?.deptInfo) || selectRef.value?.hasOwnProperty('own')) {
       NsMessage.error('请先选择相关部门');
       return;
     }
-    if (!linkDept && !selectRoleRef.value) {
+    console.log(123);
+
+    if (!linkDept && isEmpty(selectRoleRef.value)) {
       NsMessage.error('请先选择相关角色');
       return;
     }
@@ -302,6 +300,7 @@
         item['deptInfo'] = item.orgInfo;
         item['deptInfo']['deptName'] = item?.orgInfo?.orgName;
         item['own'] = !index;
+        item['selectable'] = false;
         item['children'] = item.deptTrees;
         return item;
       });
@@ -325,7 +324,7 @@
   // 获取角色树
   const getUserTree = (params = { deptId: selectRef.value?.deptInfo?.deptId }) => {
     return http.post(department.queryRoleTree, params).then((res) => {
-      roleTreeData.value = res.data;
+      roleTreeData.value = [{ zhName: '全部', selectable: false, orgInfo: {}, children: res.data }];
     });
   };
   // 根据依赖刷新角色树
@@ -334,12 +333,12 @@
       getUserTree().then(() => {
         if (!roleTreeData.value?.length) {
           selectRoleRef.value = {};
-          roleFormData.value = {};
+          roleFormData.value = { isLeader: 1 };
         }
         const info = {
-          node: { key: '0-0', dataRef: { ...roleTreeData.value[0] } },
+          node: { key: '0-0-0', dataRef: { ...roleTreeData.value[0].children[0] } },
         };
-        SelectUserTree(['0-0'], info);
+        SelectUserTree([''], info);
       });
     }
   });
@@ -351,8 +350,10 @@
     callback: null,
   };
 
+  // 添加部门
   const addApartment = (data) => {
     const { deptInfo } = data;
+    activeKey.value = 1;
 
     disabled.value = false;
     opMap.type = 'addDept';
@@ -369,23 +370,17 @@
           orgId: deptInfo?.orgId,
           sourceOrgId,
           projectId,
+          pdeptId: deptInfo.pdeptId || '',
           orgName,
         });
       });
     };
   };
 
-  const getParent = (data) => {
-    if (data?.parent) {
-      getParent(data.parent);
-    } else {
-      data;
-    }
-  };
-
+  // 添加子部门
   const addApartmentSon = (data) => {
     const { deptInfo } = data;
-
+    activeKey.value = 1;
     disabled.value = false;
     opMap.type = 'addson';
     formData.value = {};
@@ -407,10 +402,11 @@
     };
   };
 
-  const addUser = () => {
+  const addUser = (data) => {
     roleDisabled.value = false;
     opMap.type = 'addUser';
-    roleFormData.value = {};
+    roleFormData.value = { isLeader: 1 };
+    roleActiveKey.value = 1;
     opMap.fuc = (params) => {
       delete params.roleId;
       return formRoleRef.value.triggerSubmit().then(() => {
@@ -418,6 +414,7 @@
           ...params,
           orgId,
           projectId,
+          proleId: data.proleId || '',
           deptId: selectRef.value.deptInfo.deptId,
           deptName: selectRef.value.deptInfo.deptName,
         });
@@ -425,10 +422,11 @@
     };
   };
 
-  const addUserSon = () => {
+  const addUserSon = (data) => {
     roleDisabled.value = false;
     opMap.type = 'addUserSon';
-    roleFormData.value = {};
+    roleActiveKey.value = 1;
+    roleFormData.value = { isLeader: 1 };
     opMap.fuc = (params) => {
       delete params.roleId;
       return formRoleRef.value.triggerSubmit().then(() => {
@@ -436,7 +434,7 @@
           ...params,
           orgId,
           projectId,
-          proleId: selectRoleRef.value.roleId,
+          proleId: data.roleId,
           deptId: selectRef.value.deptInfo.deptId,
           deptName: selectRef.value.deptInfo.deptName,
         });
@@ -444,8 +442,6 @@
     };
   };
   const deleteDept = (data) => {
-    console.log(data);
-
     // 删除逻辑
     Modal.confirm({
       title: '是否确认删除',
@@ -458,6 +454,7 @@
             // 删除选中的数据需要清空
             deptTreeSelectedKeys.value = [];
             selectRef.value = '';
+            roleTreeData.value = [{ zhName: '全部', selectable: false, orgInfo: {}, children: [] }];
           }
         });
       },
@@ -467,16 +464,20 @@
     });
   };
 
-  const deleteUser = () => {
+  const deleteUser = (data) => {
     Modal.confirm({
       title: '是否确认删除',
       onOk() {
-        http.post(department.delRole, { roleId: selectRoleRef.value.roleId }).then(() => {
+        http.post(department.delRole, { roleId: data.roleId }).then(() => {
           getUserTree({ deptId: selectRef.value.deptInfo.deptId });
           clearRoleData();
           // 清空select树
-          roleTreeSelectedKeys.value = [];
-          selectRoleRef.value = '';
+          if (data.selected) {
+            // 删除选中的数据需要清空
+            roleTreeSelectedKeys.value = [];
+            selectRoleRef.value = '';
+          }
+
           NsMessage.success('操作成功');
         });
       },
@@ -554,6 +555,7 @@
   };
   // 保存角色权限
   const rolePermission = () => {
+    if (!roleTotalCheckedKeys.value?.length) return;
     http
       .post(department.addRolePermission, {
         // deptId: selectRef.value?.deptInfo.deptId,
@@ -645,6 +647,7 @@
     rolePermissionTreeData.value = [];
     roleCheckedKeys.value = [];
     roleTreeSelectedKeys.value = [];
+    roleDisabled.value = true;
   };
 
   /**
@@ -739,10 +742,10 @@
     // { title: '新增角色', func: addUser, key: 'addUser' },
   ]);
 
-  const filterAction = (data, actions) => {
+  const filterAction = (data, actions, keyV = 'addDept') => {
     if (data.hasOwnProperty('orgInfo')) {
       // 企业节点
-      return actions.filter(({ key }) => key === 'addDept');
+      return actions.filter(({ key }) => key === keyV);
     }
     return actions;
   };
diff --git a/hx-ai-intelligent/src/view/organizationManage/usermanage/config.ts b/hx-ai-intelligent/src/view/organizationManage/usermanage/config.ts
index 61ade5d..3b7e580 100644
--- a/hx-ai-intelligent/src/view/organizationManage/usermanage/config.ts
+++ b/hx-ai-intelligent/src/view/organizationManage/usermanage/config.ts
@@ -44,6 +44,7 @@ export const formConfig = (disabled) => {
             label: '性别',
             field: 'sex',
             component: 'NsRadioGroup',
+            defaultValue: '男',
             componentProps: {
               radioType: 'radio',
               options: [
diff --git a/hx-ai-intelligent/src/view/organizationManage/usermanage/index.vue b/hx-ai-intelligent/src/view/organizationManage/usermanage/index.vue
index a6ce9d3..e93785d 100644
--- a/hx-ai-intelligent/src/view/organizationManage/usermanage/index.vue
+++ b/hx-ai-intelligent/src/view/organizationManage/usermanage/index.vue
@@ -4,30 +4,17 @@
   <div class="main">
     <div class="left">
       <div class="top">
-        <ns-tree-api v-bind="orgTreeConfig" @select="handleSelect">
+        <ns-tree-api v-bind="orgTreeConfig" @select="handleSelect" v-model:treeData="treeData">
           <template #title="data">
             {{ data.orgInfo?.orgName }}
           </template>
         </ns-tree-api>
       </div>
       <div class="top">
-        <!-- <div class="ns-table-title">关联部门</div>
-
-        <a-input-search
-          v-model:value="searchValue2"
-          style="margin-bottom: 8px"
-          placeholder="请输入关联部门"
-          @search="onSearch2" />
-        <a-tree
-          v-if="treeData2?.length"
-          :tree-data="treeData2"
-          defaultExpandAll
-          @select="handleSelect2">
-          <template #title="data">
-            {{ data.deptInfo?.deptName }}
-          </template>
-        </a-tree> -->
-        <ns-tree-api v-bind="deptTreeConfig" @select="handleSelect2">
+        <ns-tree-api
+          v-bind="deptTreeConfig"
+          @select="handleSelect2"
+          v-model:treeData="treeDataDept">
           <template #title="data">
             {{ data.deptInfo?.deptName }}
           </template>
@@ -87,7 +74,7 @@
   import { formConfig, formConfig2 } from './config';
   import { origanizemanage } from '/@/api/origanizemanage';
 
-  defineOptions({ name: 'OrderListIndex' });
+  defineOptions({ name: 'UserManageIndex' });
 
   const mainRef = ref();
   const data = reactive({});
@@ -113,19 +100,21 @@
   const casData = ref([]);
   const formSchema2 = formConfig2(casData);
   const treeData = ref([]);
+  const treeDataDept = ref([]);
   const treeData2 = ref([]);
   const userAuthList = ref([]);
-  const orgId = JSON.parse(sessionStorage.getItem('userInfo')).orgId;
+  // const orgId = JSON.parse(sessionStorage.getItem('userInfo')).orgId;
+  const orgId = JSON.parse(sessionStorage.getItem('ORGID')!);
   const orgTreeConfig = ref({
     selectedKeys: ['0-0'],
     defaultExpandAll: true,
     api: origanizemanage.queryOrgTree,
-    defaultParams: { orgId },
+    params: { orgId },
     transform: (data) => {
-      const otherOrg = data[0].listOrg;
+      const otherOrg = data[0]?.listOrg;
       let treeData = [];
       // 特殊处理
-      if (data[0].orgInfo) {
+      if (data[0]?.orgInfo) {
         treeData = data;
       }
       otherOrg?.map((item) => {
@@ -153,7 +142,7 @@
   const deptTreeConfig = ref({
     defaultExpandAll: true,
     api: origanizemanage.queryDeptTree,
-    defaultParams: { orgId },
+    params: { orgId },
 
     header: {
       title: '关联部门',
@@ -192,11 +181,11 @@
       });
     });
   };
-  getOrgTree();
+  // getOrgTree();
   // 部门树
-  fetch(origanizemanage.queryDeptTree).then((res) => {
-    treeData2.value = res.data;
-  });
+  // fetch(origanizemanage.queryDeptTree).then((res) => {
+  //   treeData2.value = res.data;
+  // });
 
   const onSearch = () => {
     console.log(searchValue.value);
@@ -225,8 +214,10 @@
   };
 
   const handleSelect = (selectedKeys: any, info: any) => {
+    console.log(info);
+
     fetch(origanizemanage.queryDeptTree, { orgId: info.node?.orgInfo.orgId }).then((res) => {
-      treeData2.value = res.data;
+      treeDataDept.value = res.data;
     });
     tableFetch({ orgId: info.node?.orgInfo.orgId });
   };
@@ -298,6 +289,7 @@
           opMap.value.type = 'add';
           setTimeout(() => {
             formData.value = {
+              sex: '男',
               orgName: JSON.parse(sessionStorage.getItem('userInfo')).orgName,
             };
             userAuthList.value.splice(0);
@@ -350,30 +342,23 @@
         customRender: (text: any) => {
           return text.index + 1;
         },
-        sorter: {
-          compare: (a, b) => a.address - b.address,
-        },
+        sorter: true,
       },
       {
         title: '账号',
         dataIndex: 'accountNo',
-        sorter: {
-          compare: (a, b) => a.accountNo - b.accountNo,
-        },
+        sorter: true,
       },
       {
         title: '姓名',
         dataIndex: 'realName',
-        sorter: {
-          compare: (a, b) => a.realName - b.realName,
-        },
+        sorter: true,
       },
       {
         title: '性别',
         dataIndex: 'sex',
-        sorter: {
-          compare: (a, b) => a.name - b.name,
-        },
+        sorter: true,
+        textNumber: 4,
       },
       {
         title: '手机号',
@@ -381,11 +366,15 @@
       },
       {
         title: '邮箱',
+        textNumber: 5,
+        textEllipsis: true,
         dataIndex: 'email',
       },
       {
         title: '组织关系',
         dataIndex: 'orgName',
+        // textNumber: 9,
+        // textEllipsis: true,
       },
       {
         title: '部门/角色',
diff --git a/lib/component/form/form/form.vue b/lib/component/form/form/form.vue
index ac5e173..7dd6cde 100644
--- a/lib/component/form/form/form.vue
+++ b/lib/component/form/form/form.vue
@@ -121,14 +121,8 @@
       provide('addChildForm', addChildForm);
 
       const getFormClass = computed(() => {
-        if (props.formLayout === 'flexVertical') {
-          return formConfig.formLayout.flexVertical;
-        }
-        if (props.formLayout === 'flex') {
-          return formConfig.formLayout.flex;
-        }
-        if (props.formLayout === 'flexv2') {
-          return formConfig.formLayout.flexv2;
+        if (props.formLayout) {
+          return formConfig.formLayout[props.formLayout as keyof typeof formConfig.formLayout];
         }
         return formConfig.formLayout.vertical;
       });
diff --git a/lib/component/tree/props.ts b/lib/component/tree/props.ts
index 3b73358..a040b37 100644
--- a/lib/component/tree/props.ts
+++ b/lib/component/tree/props.ts
@@ -14,6 +14,7 @@ export const treeProps = {
     type: [String, Object, Function] as PropType<string | Function | AxiosRequestConfig>,
     default: undefined,
   },
+  treeData: PropTypes.array.def([]),
   params: PropTypes.object.def(() => ({})),
   dynamicParams: PropTypes.oneOfType([
     PropTypes.string,
diff --git a/lib/component/tree/tree-api.vue b/lib/component/tree/tree-api.vue
index 946de7a..4226722 100644
--- a/lib/component/tree/tree-api.vue
+++ b/lib/component/tree/tree-api.vue
@@ -10,10 +10,10 @@
       </div>
     </div>
 
-    <div style="min-height: 300px">
+    <div style="min-height: 300px; overflow-y: scroll">
       <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>
+          <slot :name="item" v-bind="{ ...data, formModel } || {}"></slot>
         </template>
       </ns-tree>
       <!-- <a-empty v-if="!treeData?.length" /> -->
@@ -21,7 +21,7 @@
   </a-spin>
 </template>
 <script lang="ts" setup>
-  import { computed, nextTick, reactive, ref, unref, useAttrs } from 'vue';
+  import { computed, nextTick, reactive, ref, unref, useAttrs, watch } from 'vue';
   import { TreeDataItem } from 'ant-design-vue/es/tree/Tree';
   import { useApi } from '/nerv-lib/use/use-api';
   import { AxiosRequestConfig } from 'axios';
@@ -33,16 +33,28 @@
   defineOptions({
     name: 'NsTreeApi',
   });
+  const emit = defineEmits(['update:treeData']);
+  // const model = defineModel('treeData');
 
   const formElRef = ref();
   const props = defineProps(treeProps);
-  const treeData = ref<TreeDataItem[]>([]);
+
+  const treeData = ref(props.treeData);
   const selectedKeys = ref(props.selectedKeys || []);
   const { httpRequest } = useApi();
   const requestConfig: AxiosRequestConfig = { method: 'get' };
   const route = useRoute();
   const attrs = useAttrs();
   const formModel = reactive({});
+  watch(
+    () => props.treeData,
+    (val) => {
+      treeData.value = val;
+    },
+    {
+      deep: true,
+    },
+  );
   const treeState = reactive({
     loading: false,
   });
@@ -56,6 +68,7 @@
     return props.isSticky ? 'sticky' : 'static';
   });
   const formFinish = debounce((data: object) => {
+    selectedKeys.value = [];
     getData(data);
   }, 200);
   const getBindValue = computed(() => ({
@@ -83,6 +96,8 @@
     })
       .then((res) => {
         treeData.value = transform(get(res, resultField));
+        emit('update:treeData', treeData.value);
+        // model.value = treeData.value;
       })
       .finally(() => {
         setLoading(false);
diff --git a/lib/saas/config/form.config.ts b/lib/saas/config/form.config.ts
index 1ea887f..4429588 100644
--- a/lib/saas/config/form.config.ts
+++ b/lib/saas/config/form.config.ts
@@ -11,6 +11,17 @@ export const formConfig = {
       gutter: [0, 0],
       justify: 'space-around',
     },
+    formVertical: {
+      layout: 'horizontal',
+      class: 'ns-vertical-form',
+      wrapperCol: { span: 24 },
+      labelCol: { span: 0 },
+      span: 24,
+      sm: null, //≥576px <=768
+      lg: null, //>= 768
+      gutter: [0, 0],
+      justify: 'space-around',
+    },
     flex: {
       // layout: 'horizontal',
       class: 'ns-flex-form ns-flex-form-horizontal',
diff --git a/lib/saas/view/system/login.vue b/lib/saas/view/system/login.vue
index 11be149..70f4393 100644
--- a/lib/saas/view/system/login.vue
+++ b/lib/saas/view/system/login.vue
@@ -19,33 +19,51 @@
           <h1 class="lg_card_title">{{ configStore.projectName }}</h1>
           <p v-show="!errorShow" style="height: 8px"></p>
           <p v-show="errorShow" class="lg_card_error">{{ errorMsg }}</p>
-          <!-- <p class="lg_card_tip">用户名/手机号</p> -->
-          <a-input class="loginInfo" placeholder="用户名" v-model:value="userName">
-            <template #prefix>
-              <ns-icon class="loginIcon" name="userName" size="19" style="margin-right: 20px" />
-            </template>
-          </a-input>
-          <!-- <p class="lg_card_tip">密码</p> -->
-          <a-input-password class="loginInfo" placeholder="密码" v-model:value="password">
-            <template #prefix>
-              <ns-icon class="loginIcon" name="passWord" size="19" style="margin-right: 20px" />
-            </template>
-          </a-input-password>
-          <!-- 验证码 -->
+          <a-form name="basic" :model="formState" @finish="submit">
+            <a-form-item name="userName" :rules="[{ required: true, message: '请输入用户名' }]">
+              <!-- <p class="lg_card_tip">用户名/手机号</p> -->
+              <a-input class="loginInfo" placeholder="用户名" v-model:value="userName">
+                <template #prefix>
+                  <ns-icon class="loginIcon" name="userName" size="19" style="margin-right: 20px" />
+                </template>
+              </a-input>
+            </a-form-item>
 
-          <a-input v-model:value="code" placeholder="验证码" class="loginInfo">
-            <template #prefix>
-              <ns-icon class="loginIcon" name="verifyIcon" size="19" style="margin-right: 20px" />
-            </template>
-            <template #addonAfter>
-              <ns-verify @get-code="onGetCode" />
-            </template>
-          </a-input>
-          <!-- 记住密码 -->
-          <a-checkbox v-model:checked="isRemember" class="loginInfo">记住密码</a-checkbox>
-          <a-button @click="submit" :loading="loading" type="primary" class="loginInfo"
-            >登录</a-button
-          >
+            <a-form-item name="password" :rules="[{ required: true, message: '请输入密码' }]">
+              <!-- <p class="lg_card_tip">密码</p> -->
+              <a-input-password class="loginInfo" placeholder="密码" v-model:value="password">
+                <template #prefix>
+                  <ns-icon class="loginIcon" name="passWord" size="19" style="margin-right: 20px" />
+                </template>
+              </a-input-password>
+            </a-form-item>
+
+            <a-form-item name="code" :rules="[{ validator }]">
+              <!-- 验证码 -->
+              <a-input v-model:value="code" placeholder="验证码" class="loginInfo">
+                <template #prefix>
+                  <ns-icon
+                    class="loginIcon"
+                    name="verifyIcon"
+                    size="19"
+                    style="margin-right: 20px" />
+                </template>
+                <template #addonAfter>
+                  <ns-verify @get-code="onGetCode" />
+                </template>
+              </a-input>
+            </a-form-item>
+            <!-- <a-form-item name="remember"> -->
+            <!-- 记住密码 -->
+            <a-checkbox v-model:checked="isRemember" class="loginInfo">记住密码</a-checkbox>
+            <!-- </a-form-item> -->
+
+            <a-form-item>
+              <a-button html-type="submit" :loading="loading" type="primary" class="loginInfo">
+                登录
+              </a-button>
+            </a-form-item>
+          </a-form>
         </div>
       </a-layout-content>
       <!-- <a-layout-footer>Copyright 2021 xu科技 All Rights Reserved</a-layout-footer> -->
@@ -54,7 +72,7 @@
 </template>
 
 <script lang="ts">
-  import { defineComponent, onMounted, ref } from 'vue';
+  import { defineComponent, onMounted, reactive, ref } from 'vue';
   import { useRouter } from 'vue-router';
   import { appConfigStore } from '/nerv-lib/saas/store/modules/app-config';
   import { authorizationService } from '/nerv-base/store/modules/authorization-service';
@@ -81,11 +99,12 @@
       // title.value = appConfig.title ? appConfig.title : '账号登录';
       const loading = ref<boolean>(false);
       const configStore = appConfigStore();
-      console.log(configStore);
+      const formState = reactive({ userName, password, code });
 
       const { getThemeConfig: themeConfig, projectName } = storeToRefs(configStore);
 
       const useAuthorization = authorizationService();
+
       const rememberFunc = (data) => {
         console.log(isRemember.value);
         if (!isRemember.value) return;
@@ -97,24 +116,28 @@
           const { accountNo, password: pwd } = JSON.parse(data);
           userName.value = accountNo;
           password.value = pwd;
+          formState.userName = userName.value;
+          formState.password = password.value;
         }
       });
-      const submit = (): void => {
-        if (password.value === '') {
-          errorMsg.value = '请输入密码';
-          errorShow.value = true;
-          return;
-        }
-        if (userName.value === '') {
-          errorMsg.value = '请输入账号';
-          errorShow.value = true;
-          return;
-        }
-        // if (!code.value) {
-        //   errorMsg.value = '请输入验证码';
+      const submit = (value): void => {
+        console.log(value);
+
+        // if (password.value === '') {
+        //   errorMsg.value = '请输入密码';
         //   errorShow.value = true;
         //   return;
         // }
+        // if (userName.value === '') {
+        //   errorMsg.value = '请输入账号';
+        //   errorShow.value = true;
+        //   return;
+        // }
+        // if (!code.value) {
+        //   // errorMsg.value = '请输入验证码';
+        //   // errorShow.value = true;
+        //   return;
+        // }
         // if (code.value.toLocaleLowerCase() !== verifyCode.value.toLocaleLowerCase()) {
         //   errorMsg.value = '请输入正确的验证码';
         //   errorShow.value = true;
@@ -208,7 +231,15 @@
       const onGetCode = (res) => {
         verifyCode.value = res;
       };
+
+      const validator = async (rule, value) => {
+        if (!value) return Promise.reject('请输入验证码');
+        if (value?.toLocaleLowerCase() !== verifyCode.value.toLocaleLowerCase())
+          return Promise.reject('请输入正确的验证码');
+      };
       return {
+        validator,
+        formState,
         projectName,
         onGetCode,
         code,
@@ -323,7 +354,7 @@
     .loginInfo {
       height: 48px;
       width: 100%;
-      margin-bottom: 24px;
+      // margin-bottom: 24px;
       font-size: 16px !important;
 
       :deep(.ant-input) {
@@ -340,10 +371,12 @@
       }
     }
     .loginInfo:last-child {
-      margin-bottom: 16px;
+      // margin-bottom: 16px;
     }
-    .loginInfo:nth-child(5n + 2) {
-      margin-bottom: 0px;
+    .loginInfo:nth-child(4) {
+      width: fit-content;
+      // margin-bottom: 0px;
+      // height: 20px !important;
     }
   }
 
