diff --git a/src/assets/css/index.css b/src/assets/css/index.css
index bfc9d256b3504f25b907e842e3d68361c66b624c..43df1e4e6cef9e0366cc761979cfe3abe4dad24b 100644
--- a/src/assets/css/index.css
+++ b/src/assets/css/index.css
@@ -1478,23 +1478,25 @@ border-radius:8px;
 }
 
 .flex_left {
-  background-color: #fff;
   height: calc(100% - 20px);
   width: 320px;
-  box-shadow: 0px 1px 4px 0px 
-		rgba(0, 7, 101, 0.15);
-	border-radius: 6px;
   margin-right: 10px;
   overflow: hidden;
 }
 .flex_right {
-  background-color: #fff;
+  
   height: calc(100% - 20px);
   flex: 1;
+  
+  overflow: hidden;
+}
+
+.bgc_white {
   box-shadow: 0px 1px 4px 0px 
 		rgba(0, 7, 101, 0.15);
 	border-radius: 6px;
-  overflow: hidden;
+  background-color: #fff;
+ 
 }
 
 .tree::-webkit-scrollbar {
diff --git a/src/assets/imgs/img_data-complete.png b/src/assets/imgs/img_data-complete.png
index dd88a7c9829fdb257b3911209f9f24de026d0a70..d7ea38bcdded7c3dc47312fa29a7a7ac95a6f7ea 100644
Binary files a/src/assets/imgs/img_data-complete.png and b/src/assets/imgs/img_data-complete.png differ
diff --git a/src/assets/imgs/img_data-fail.png b/src/assets/imgs/img_data-fail.png
new file mode 100644
index 0000000000000000000000000000000000000000..29c2c887e34dfc4fff06208642d82d29d2b35583
Binary files /dev/null and b/src/assets/imgs/img_data-fail.png differ
diff --git a/src/page/main/develop/account/add/index.vue b/src/page/main/develop/account/add/index.vue
index 8655074357b20ef62830f8789c7f8940ce9532dd..5bcae62dd06d25b9e023707d3e426db32187ca7a 100644
--- a/src/page/main/develop/account/add/index.vue
+++ b/src/page/main/develop/account/add/index.vue
@@ -47,8 +47,12 @@
                     <systemForm v-show="step === 1" ref="systemFormRef" :data="tempFormData" @action="getSystemFormData"></systemForm>
                     <contactForm v-show="step === 2" ref="contactFormRef" :data="tempFormData" @action="getContactFormData"></contactForm>
                     <div class="process_end" v-show="step === 3">
+                        <div>
+                            <div><img src="@/assets/imgs/img_data-complete.png" alt=""></div>
                             <el-button  @click="cancel">返回列表</el-button>
                             <el-button type="primary" @click="continueCreate">继续创建</el-button>
+                        </div>
+                            
                     </div>
                 </div>
             </div>
@@ -81,7 +85,7 @@ const step = ref(1);
 const systemFormRef = ref(null);
 const contactFormRef = ref(null);
 const tempFormData = ref(null)
-const formData = ref({
+const formData = reactive({
   org: '',
   code: '',
   name: '',
@@ -99,37 +103,6 @@ const formData = ref({
   remark: '',
 }); //业务系统表单+联系人表单
 
-
-onBeforeUnmount(()=>{
-    
-})
-onMounted(() => {
-    if(route.query.type === "1") {
-        setTimeout(()=> {
-            systemFormRef.value.setForm({
-                org: 'a',
-                code: 'b',
-                name: 'b',
-                desc: 'b',
-                logo: ['b'],
-                role: 'b',
-                account: 'b',
-                password: 'b',
-                confirm_password: 'b',
-                url: 'b',
-                firm_name: 'b',
-                is_use: 'b',
-               
-            })
-            contactFormRef.value.setForm({
-                contact_user: 'c',
-                phone: 'c',
-                email: 'c',
-                remark: 'c',
-            })
-        },500)
-    }
-})
 // 下一步
 const nextStep = () => {
     systemFormRef.value.submitForm();
@@ -170,6 +143,37 @@ const cancel = () => {
     router.go(-1);
 }
 
+onBeforeUnmount(()=>{
+    
+})
+onMounted(() => {
+    if(route.query.type === "1") {
+        setTimeout(()=> {
+            systemFormRef.value.setForm({
+                org: 'a',
+                code: 'b',
+                name: 'b',
+                desc: 'b',
+                logo: ['b'],
+                role: 'b',
+                account: 'b',
+                password: 'b',
+                confirm_password: 'b',
+                url: 'b',
+                firm_name: 'b',
+                is_use: 'b',
+               
+            })
+            contactFormRef.value.setForm({
+                contact_user: 'c',
+                phone: 'c',
+                email: 'c',
+                remark: 'c',
+            })
+        },500)
+    }
+})
+
 </script>
 
 <style scoped>
@@ -228,10 +232,15 @@ const cancel = () => {
     vertical-align: middle;
 }
 .process_end {
-    text-align: center;
-    padding: 50px 0;
+    height: 100%;
+    display: flex;
+    justify-content: center;
+    align-items: center;
     
 }
+.process_end div {
+    text-align: center;
+}
 .step_icon {
     color: #fff;
     font-weight: 600;
@@ -260,13 +269,13 @@ const cancel = () => {
     border: 4px solid #e6e9ef;
     vertical-align: middle;
 }
-.content_process /deep/ .el-step.is-horizontal .el-step__line {
+.content_process :deep() .el-step.is-horizontal .el-step__line {
     height: 4px;
 }
-.content_process /deep/ .el-step__head.is-finish .el-step__line {
+.content_process :deep() .el-step__head.is-finish .el-step__line {
     background: linear-gradient(to right,#2b4695 50%,#e6e9ef 50%);
 }
-.process_complete /deep/ .el-step__head.is-finish .el-step__line {
+.process_complete :deep() .el-step__head.is-finish .el-step__line {
     background: linear-gradient(to right,#2b4695 100%,#e6e9ef 0%);
 }
 </style>
diff --git a/src/page/main/develop/account/add/system-form.vue b/src/page/main/develop/account/add/system-form.vue
index 953ecbee7456650d2efbe9164776b2b607960124..6980b6fc81a3b7e1345380defeef3324f7086ea5 100644
--- a/src/page/main/develop/account/add/system-form.vue
+++ b/src/page/main/develop/account/add/system-form.vue
@@ -115,6 +115,7 @@ const clearForm = () => {
   if (!systemRef) return
   systemRef.value.resetFields()
 } 
+
 const setForm = (data) => {
   systemForm.value = Object.assign(systemForm, data);
 }
diff --git a/src/page/main/develop/account/index.vue b/src/page/main/develop/account/index.vue
index edd8cb1a841cec0a1219afa556dcb8a41c83b368..f6c52af7437a4b05822d9b3094facd6f0b080c73 100644
--- a/src/page/main/develop/account/index.vue
+++ b/src/page/main/develop/account/index.vue
@@ -7,7 +7,7 @@
             </el-breadcrumb>
         </div>
          <div class="flex_row">
-           <div class="flex_left">
+           <div class="flex_left bgc_white">
              <div class="tree_header">
                  政务机构
              </div>
@@ -24,7 +24,7 @@
                </div>
              </div>
            </div>
-           <div class="flex_right">
+           <div class="flex_right bgc_white">
              <div class="main_container">
               <div class="apaas_button">
                 <el-button type="primary" @click="addAccount(0)">新建</el-button><el-button @click="addAccount(1)">编辑</el-button>
@@ -274,7 +274,7 @@ import { useRouter } from 'vue-router';
   height: calc(100% - 65px);
   padding: 5px;
 }
-.tree /deep/ .el-tree-node>.el-tree-node__children {
+.tree :deep() .el-tree-node>.el-tree-node__children {
   overflow: unset;
 }
 .main_container {
@@ -287,6 +287,7 @@ import { useRouter } from 'vue-router';
 }
 .pagination_box {
   position: sticky;
+  position: -webkit-sticky;
   margin-top: 16px;
   bottom: 0px;
   background-color: #fff;
diff --git a/src/page/main/system/organization/directory-form.vue b/src/page/main/system/organization/directory-form.vue
new file mode 100644
index 0000000000000000000000000000000000000000..372e841e2d0d931904d6179f3de09ffe76afe8d3
--- /dev/null
+++ b/src/page/main/system/organization/directory-form.vue
@@ -0,0 +1,62 @@
+<template>
+  <el-form
+    :label-position="'right'"
+    label-width="120px"
+    :model="directoryForm"
+    :rules="directoryFormRules"
+    ref="directoryRef"
+    style="max-width: 66%"
+  >
+    <el-form-item label="上级目录" prop="parent">
+      <el-input v-model="directoryForm.parent" />
+    </el-form-item>
+    <el-form-item label="名称" prop="name">
+      <el-input v-model="directoryForm.name" />
+    </el-form-item>
+  </el-form>
+</template>
+
+<script setup>
+import { reactive, ref, onMounted } from 'vue'
+
+const directoryForm = reactive({
+  parent: '',
+  name: '',
+})
+
+const directoryFormRules = reactive({
+  parent: [
+    { required: true, message: '请输入上级目录', trigger: 'blur' },
+  ],
+  name: [
+    { required: true, message: '请输入名称', trigger: 'blur' },
+  ],
+})
+const directoryRef = ref(null)
+const emit = defineEmits(['action'])
+
+const submitForm = async () => {
+  if (!directoryRef) return
+  await directoryRef.value.validate((valid, fields) => {
+    if (valid) {
+      emit('action', directoryForm)
+    } else {
+      emit('action',null)
+    }
+  })
+}
+const clearForm = () => {
+  if (!directoryRef) return
+  directoryRef.value.resetFields()
+} 
+
+const setForm = (data) => {
+  directoryForm.value = Object.assign(directoryForm, data);
+}
+
+onMounted(() => {
+   
+})
+
+defineExpose({ submitForm, clearForm, setForm })
+</script>
\ No newline at end of file
diff --git a/src/page/main/system/organization/index.vue b/src/page/main/system/organization/index.vue
index 2d4a69eb6b04991907877ce5591ec76a7025faf4..2f60cd5692810584da2f1edf5315ac3f4e024620 100644
--- a/src/page/main/system/organization/index.vue
+++ b/src/page/main/system/organization/index.vue
@@ -1,30 +1,532 @@
 <template>
-  <div class="detail_container">
-      组织管理
-  </div>
+    <div class="page_container">
+        <div class="bg-breadcrumb">
+            <el-breadcrumb separator="/">
+                <el-breadcrumb-item> 开发管理 </el-breadcrumb-item>
+                <el-breadcrumb-item > 系统账号管理 </el-breadcrumb-item>
+            </el-breadcrumb>
+        </div>
+         <div class="flex_row">
+           <div class="flex_left bgc_white">
+             <div class="tree_header">
+                 政务机构
+             </div>
+             <div class="tree_content">
+               <div class="search"> 
+                 <el-input
+                    v-model="search"
+                    placeholder="请输入组织名称搜索"
+                    :prefix-icon="Search"
+                  />
+               </div>
+               <div class="tree">
+                 <!-- <el-tree class="file-tree" :data="data" :props="defaultProps" @node-click="handleNodeClick" :default-expand-all="true">
+                  <template #default="{ node, data }">
+                    <div class="custom_tree_node">
+                      <span
+                        class="label-text "
+                        :class="{'is_active': treeSelected === data.dept}"
+                        :title="node.label"
+                        >{{ node.label }}
+                      </span>
+                      <span class="tree-action-box" :class="{'position_sticky': isSticky(data.label) }" @click.stop="showAction($event, data,node)">
+                        <bg-icon
+                          class="tree-more"
+                          icon="#bg-ic-s-more"
+                        ></bg-icon>
+                      </span>
+                    </div>
+                  </template>
+                 </el-tree>
+                 <Teleport to="body">
+                    <div
+                      class="tree-action"
+                      v-show="actionFlag"
+                      :style="{ top: acTop, left: acLeft }"
+                    >
+                     
+                      <div class="action" >
+                        上移
+                      </div>
+                      <div class="action" >
+                        下移
+                      </div>
+                    </div>
+                  </Teleport> -->
+                  <tree></tree>
+               </div>
+             </div>
+           </div>
+           <div class="flex_right">
+             <div class="info_container bgc_white">
+               <div class="title"><span  class="icon_box"><bg-icon class="step_icon" icon="#bg-ic-file"></bg-icon></span> 基本信息  <bg-icon style="font-size: 14px" class="step_icon" icon="#bg-ic-arrow-right"></bg-icon> </div>
+               <bg-info :data="baseInfo"></bg-info>
+             </div>
+             <div class="main_container bgc_white">
+              <div class="apaas_button">
+                <el-button type="primary" @click="addAccount(0)">新建</el-button><el-button @click="addAccount(1)">编辑</el-button>
+              </div>
+                <div class="table_container apaas_scroll">
+                  <bg-table ref="bgTable" :headers="headers" :rows="tableRows" :isIndex="true" :stripe="true">
+                    <template v-slot:action="{ row }">
+                      <bg-table-btn class="btn">
+                        编辑
+                      </bg-table-btn>
+                      <bg-table-btn class="btn">
+                        修改密码
+                      </bg-table-btn>
+                      <bg-table-btn class="btn">
+                        删除
+                      </bg-table-btn>
+                    </template>
+                  </bg-table>
+                  <div class="pagination_box">
+                     <bg-pagination
+                    :page="1"
+                    :size="10"
+                    :total="100"
+                    @change-page="changePage"
+                    @change-size="changeSize"
+                  >
+                  </bg-pagination>
+                  </div>       
+                </div>
+              </div>
+           </div>
+        </div>
+    </div>
 </template>
 
-<script >
+<script setup>
+import { Search } from '@element-plus/icons-vue'
 import { reactive, toRefs, ref, } from '@vue/reactivity'
 import { getCurrentInstance } from 'vue'
 import { computed, onBeforeMount } from '@vue/runtime-core'
 import { useRouter } from 'vue-router';
-export default {
-  components: {
-  },
-  setup() {
-  
-    onBeforeMount(() => {
-     
-    })
-    return {
-      ...toRefs(),
+import tree from './tree.vue';
+  const baseInfo = ref(
+    [
+    {
+      name: "能力名称",
+      value: "",
+      nameWidth: 112
+    },
+    {
+      name: "调用地址",
+      value: "",
+      nameWidth: 112
+    },
+    {
+      name: "是否TLS协议",
+      value: "",
+      full: true,
+      nameWidth: 112
+    },
+    {
+      name: "是否TLS协议",
+      value: "",
+      full: true,
+      nameWidth: 112
+    },
+  ]
+  )
+  const headers = ref([
+        {
+          label: "账号",
+          prop: "account",
+          width: 180
+        },
+        {
+          label: "手机号",
+          prop: "phone",
+          minWidth: 180
+        },
+        {
+          label: "角色",
+          prop: "role",
+          width: 150
+        },
+        {
+          label: "创建时间",
+          prop: "create_time",
+          width: 150
+        },
+        {
+          label: "是否启用",
+          prop: "is_use",
+          width: 80
+        },
+        {
+          label: "操作",
+          prop: "action",
+          width: 220,
+          fixed: "right",
+        },
+      ])
+ 
+  const tableRows = ref([
+    {account: "admin",phone: "15625364536",role: "管理员",create_time: "2022-01-01 00:00",is_use: "是"},
+    {account: "admin",phone: "15625364536",role: "管理员",create_time: "2022-01-01 00:00",is_use: "是"},
+    {account: "admin",phone: "15625364536",role: "管理员",create_time: "2022-01-01 00:00",is_use: "是"},
+    {account: "admin",phone: "15625364536",role: "管理员",create_time: "2022-01-01 00:00",is_use: "是"},
+    {account: "admin",phone: "15625364536",role: "管理员",create_time: "2022-01-01 00:00",is_use: "是"},
+    {account: "admin",phone: "15625364536",role: "管理员",create_time: "2022-01-01 00:00",is_use: "是"},
+    {account: "admin",phone: "15625364536",role: "管理员",create_time: "2022-01-01 00:00",is_use: "是"},
+    {account: "admin",phone: "15625364536",role: "管理员",create_time: "2022-01-01 00:00",is_use: "是"},
+    {account: "admin",phone: "15625364536",role: "管理员",create_time: "2022-01-01 00:00",is_use: "是"},
+    {account: "admin",phone: "15625364536",role: "管理员",create_time: "2022-01-01 00:00",is_use: "是"},
+    {account: "admin",phone: "15625364536",role: "管理员",create_time: "2022-01-01 00:00",is_use: "是"},
+    {account: "admin",phone: "15625364536",role: "管理员",create_time: "2022-01-01 00:00",is_use: "是"},
+    {account: "admin",phone: "15625364536",role: "管理员",create_time: "2022-01-01 00:00",is_use: "是"},
+    {account: "admin",phone: "15625364536",role: "管理员",create_time: "2022-01-01 00:00",is_use: "是"},
+    {account: "admin",phone: "15625364536",role: "管理员",create_time: "2022-01-01 00:00",is_use: "是"},
+    {account: "admin",phone: "15625364536",role: "管理员",create_time: "2022-01-01 00:00",is_use: "是"},
+    {account: "admin",phone: "15625364536",role: "管理员",create_time: "2022-01-01 00:00",is_use: "是"},
+  ])
+  const search=ref("");
+
+  const router = useRouter();
+  onBeforeMount(() => {
+   
+  })
+
+  const addAccount = (params) => {
+    router.push({
+        path: "/develop/account/add",
+        query: {
+          type: params
+        }
+      })
+  }
+  const treeSelected = ref(null);
+  const handleNodeClick = (data) => {
+    treeSelected.value = data.dept
+    console.log(treeSelected.value)
+  }
+
+  const data = [
+    {
+      label: '平台用户组织',
+      dept: 1
+    },
+    {
+      label: '湖北省efadsfasfdgsafgfdtrgsdfsfsd555',
+      dept: 4,
+      children: [
+        {
+          label: '武汉市啊实打实大苏打大阿斯顿发士大夫地',
+          children: [
+            {
+              label: '公安厅公安厅公安厅公安厅公安厅公安厅公安厅公安厅公安厅公安厅公安厅公安厅公安厅公安厅公安厅',
+              dept: 2
+            },
+            {
+              label: 'fddfsgdfgdfgdsfsffsdfsdfsdfwefadsgs',
+               dept: 3
+            },
+            {
+              label: '咯技术的卡洛斯达拉斯达拉斯昆德拉老师',
+              dept: 5,
+            },
+          ],
+        },
+        {
+          label: '荆州市',
+          dept: 6,
+          children: [
+            {
+              label: '公安局',
+              dept: 7,
+            },
+            {
+              label: '应急管理局',
+              dept: 8,
+            },
+          ],
+        }
+      ],
+    },
+    {
+      label: '四川省',
+      dept: 9,
+      children: [
+        {
+          label: '成都市',
+          dept: 10,
+          children: [
+            {
+              label: '天府新区',
+              dept: 11,
+            },
+          ],
+        },
+      ],
+    },
+    {
+      label: '比格大数据',
+      dept: 12,
+      children: [
+        {
+          label: '武汉研发中心',
+          dept: 13,
+          children: [
+            {
+              label: '研发部',
+              dept: 14,
+            },
+          ],
+        },
+        {
+          label: '西南大区',
+          dept: 15,
+          children: [
+            {
+              label: '事业部',
+              dept: 16,
+            },
+            {
+              label: '事业部',
+              dept: 17,
+            },
+            {
+              label: '事业部',
+              dept: 18,
+            },
+            {
+              label: '事业部',
+              dept: 19,
+            },
+            {
+              label: '事业部',
+              dept: 20,
+            },
+            {
+              label: '事业部',
+              dept: 21,
+            },
+            {
+              label: '事业部',
+              dept: 22,
+            },
+          ],
+        },
+      ],
+    },
+  ]
+
+  const defaultProps = {
+    children: 'children',
+    label: 'label',
+  }
+
+   const changeSize = (size) => {
+
     }
-  },
-}
+
+    const changePage = (size) => {
+
+    }
+  const acTop = ref(0);
+  const acLeft = ref(0);
+  const actionFlag = ref(false)
+  const showAction = (e, data,node) => {
+    const rect = e.target.getBoundingClientRect(); //获取点击的dom的位置
+    console.log(rect, data,node);
+    acTop.value = rect.y - 17 + "px";
+    acLeft.value = rect.x + 35 + "px";
+    actionFlag.value = true;
+    // state.selectData = data
+    // if(node.parent.data.children){
+    //   state.selectParentData = node.parent.data
+    // }else{
+    //   //没有children则是最上层元素
+    //   state.selectParentData = null
+    // }
+  };
+  const isSticky = (data) => {
+
+          const canvas = document.createElement("canvas");
+          const context = canvas.getContext("2d");
+          context.font = '14px MicrosoftYaHei';
+          const { width } = context.measureText(data);
+
+          console.log(data)
+           console.log(width)
+
+          return width > 252 ? true : false;
+  }
+
+
 </script>
 
-<style lang="scss" scoped>
+<style scoped>
+.tree_header {
+  height: 40px;
+  line-height: 40px;
+	background-color: #f7f7f9;
+	border-radius: 6px 6px 0px 0px;
+  font-size: 16px;
+	letter-spacing: 0px;
+	color: #202531;
+  padding-left: 16px;
+}
+.tree_content {
+  overflow: hidden;
+  height: calc(100% - 45px);
+}
+.search {
+  padding: 16px;
+}
+.tree {
+  overflow: auto;
+  height: calc(100% - 65px);
+  padding: 5px;
+}
+.tree :deep() .el-tree-node>.el-tree-node__children {
+  overflow: unset;
+}
+.flex_right {
+  display: flex;
+  flex-direction: column;
+}
+.info_container {
+  padding: 15px;
+  margin-bottom: 10px;
+}
+.title {
+  font-size: 18px;
+	color: #202531;
+  font-weight: bold;
+  margin-bottom: 10px;
+}
+.icon_box {
+    background-color: rgb(42, 74, 167);
+    color: rgb(255, 255, 255);
+    padding: 2px 4px;
+    border-radius: 4px;
+    font-size: 14px;
+}
+.main_container {
+  padding: 15px;
+  flex: 1;
+  overflow: hidden;
+}
+.table_container {
+  height: calc(100% - 20px);
+  overflow: auto;
+}
+.pagination_box {
+  position: sticky;
+  position: -webkit-sticky;
+  margin-top: 16px;
+  bottom: 1px;
+  background-color: #fff;
+  z-index: 1024;
+  height: 40px;
+  line-height: 40px;
+  padding-top: 5px;
+}
+.bg-pagination {
+  bottom: unset
+}
+
+.tree-action-box {
+    display: none;  
+    position: absolute;
+    right: -5px;
+    top: 0px;
+    width: 44px;
+    height: 36px;
+    line-height: 36px;
+    text-align: center;
+    background-color: #f2f3f7;
+    box-shadow: -3px 0px 8px -3px 
+		rgba(0, 7, 101, 0.15);
+}
+.position_sticky {
+  position: sticky;
+  position: -webkit-sticky;
+}
+.tree-more {
+  font-size: 12px;
+  color: #3759be;
+}
+
+.file-tree :deep() .el-tree-node__content:hover .tree-action-box {
+  display: inline-block;
+}
+.file-tree :deep() .el-tree-node > .el-tree-node__children {
+  overflow: visible;
+}
+.file-tree :deep() .el-tree-node__content {
+  position: relative;
+}
+.action-box:hover .tree-action {
+  display: block;
+}
+.label-text {
+  font-size: 14px;
+	color: #404a62;
+}
+.tree-action-box:hover + .label-text {
+  padding: 8px 0;
+  background-color: var(--el-tree-node-hover-bg-color);
+}
+.label-text:hover {
+  padding: 8px 0;
+  background-color: var(--el-tree-node-hover-bg-color);
+}
+.is_active {
+  padding: 8px 0;
+  background-color: var(--el-tree-node-hover-bg-color);
+}
+
+.custom_tree_node {
+  width: 100%;
+  font-size: 14px;
+  color: #202531;
+  padding-right: 16px;
+}
+.text_clip {
+      width: 100%;
+    display: inline-block;
+}
 
+.tree-action .action {
+  width: 100%;
+  height: 34px;
+  line-height: 34px;
+  padding-left: 16px;
+  font-size: 14px;
+  color: #202531;
+  cursor: pointer;
+}
+.tree-action :deep().el-upload {
+  width: 100%;
+}
+.tree-action .action:hover {
+  background-color: #eff2fa;
+  color: #3759be;
+}
+
+.tree-action .disable{
+  cursor: not-allowed;
+  color: #616f94;
+}
+.tree-action .disable:hover{
+  background-color: #fff;
+  color: #616f94;
+}
+
+.tree-action {
+  /* display: none; */
+  width: 144px;
+  background-color: #ffffff;
+  box-shadow: 0px 1px 4px 0px rgba(0, 7, 101, 0.15);
+  padding: 4px 0;
+  border-radius: 4px;
+  position: fixed;
+  z-index: 9;
+}
 
 </style>
\ No newline at end of file
diff --git a/src/page/main/system/organization/org-form.vue b/src/page/main/system/organization/org-form.vue
new file mode 100644
index 0000000000000000000000000000000000000000..53ea24e64019785e715f3932e287eaa5e8e1c070
--- /dev/null
+++ b/src/page/main/system/organization/org-form.vue
@@ -0,0 +1,82 @@
+<template>
+  <el-form
+    :label-position="'right'"
+    label-width="120px"
+    :model="orgForm"
+    :rules="formRules"
+    ref="orgRef"
+    style="max-width: 66%"
+  >
+    <el-form-item label="上级目录" prop="parent">
+      <el-input v-model="orgForm.parent" />
+    </el-form-item>
+    <el-form-item label="政务机构名称" prop="orgName">
+      <el-input v-model="orgForm.orgName" />
+    </el-form-item>
+    <el-form-item label="组织机构代码" prop="code">
+      <el-input v-model="orgForm.code" />
+    </el-form-item>
+    <el-form-item label="组织介绍" prop="desc">
+      <el-input type="textarea" :rows="3" v-model="orgForm.desc" />
+    </el-form-item>
+    <el-form-item label="组织附件" prop="logo">
+       <bg-upload v-model="orgForm.file" customTips>
+          <span>将文件拖到此处，或 点击上传</span>
+        </bg-upload>
+    </el-form-item>
+  </el-form>
+</template>
+
+<script setup>
+import { reactive, ref, onMounted } from 'vue'
+
+const orgForm = reactive({
+  parent: '',
+  orgName: '',
+  code: '',
+  desc: '',
+  desc: '',
+  file: ''
+})
+
+const formRules = reactive({
+  parent: [
+    { required: true, message: '输入上级目录', trigger: 'blur' },
+  ],
+  orgName: [
+    { required: true, message: '请输入机构名称', trigger: 'blur' },
+  ],
+  code: [
+    { required: true, message: '请输入组织机构代码', trigger: 'blur' },
+  ],
+})
+
+const orgRef = ref(null)
+const emit = defineEmits(['action'])
+
+const submitForm = async () => {
+  if (!orgRef) return
+  await orgRef.value.validate((valid, fields) => {
+    if (valid) {
+      emit('action', orgForm)
+    } else {
+      emit('action',null)
+    }
+  })
+}
+
+const clearForm = () => {
+  if (!orgRef) return
+  orgRef.value.resetFields()
+} 
+
+const setForm = (data) => {
+  orgForm.value = Object.assign(orgForm, data);
+}
+
+onMounted(() => {
+    
+})
+
+defineExpose({ submitForm, clearForm, setForm })
+</script>
\ No newline at end of file
diff --git a/src/page/main/system/organization/tree.vue b/src/page/main/system/organization/tree.vue
new file mode 100644
index 0000000000000000000000000000000000000000..23ab4acbc7de071249a7e34dd35fd51a57ace317
--- /dev/null
+++ b/src/page/main/system/organization/tree.vue
@@ -0,0 +1,311 @@
+<template>
+    <el-tree class="file-tree" :data="data" :props="defaultProps" @node-click="handleNodeClick" :default-expand-all="true">
+         <template #default="{ node, data }">
+           <div class="custom_tree_node">
+             <span
+               class="label-text "
+               :class="{'is_active': treeSelected === data.dept}"
+               :title="node.label"
+               >{{ node.label }}
+             </span>
+             <span class="tree-action-box" :class="{'position_sticky': isSticky(data.label) }" @click.stop="showAction($event, data,node)">
+               <bg-icon
+                 class="tree-more"
+                 icon="#bg-ic-s-more"
+               ></bg-icon>
+             </span>
+           </div>
+         </template>
+    </el-tree>
+    <Teleport to="body">
+       <div
+         class="tree-action"
+         v-show="actionFlag"
+         :style="{ top: acTop, left: acLeft }"
+       >
+        
+         <div class="action" >新建本级目录</div>
+         <div class="action" >新建下级目录</div>
+         <div class="action" >新建本级组织</div>
+         <div class="action" >新建下级组织</div>
+         <div class="action" >编辑目录</div>
+         <div class="action" >删除</div>
+         <div class="action" >上移</div>
+         <div class="action" >下移</div>
+       </div>
+    </Teleport>
+</template>
+
+<script setup>
+import { reactive, toRefs, ref, } from '@vue/reactivity'
+import { getCurrentInstance } from 'vue'
+import { computed, onBeforeMount, onBeforeUnmount } from '@vue/runtime-core'
+import { useRouter } from 'vue-router';
+ const treeSelected = ref(null);
+  
+
+  const data = [
+    {
+      label: '平台用户组织',
+      dept: 1
+    },
+    {
+      label: '湖北省efadsfasfdgsafgfdtrgsdfsfsd555',
+      dept: 4,
+      children: [
+        {
+          label: '武汉市啊实打实大苏打大阿斯顿发士大夫地',
+          children: [
+            {
+              label: '公安厅公安厅公安厅公安厅公安厅公安厅公安厅公安厅公安厅公安厅公安厅公安厅公安厅公安厅公安厅',
+              dept: 2
+            },
+            {
+              label: 'fddfsgdfgdfgdsfsffsdfsdfsdfwefadsgs',
+               dept: 3
+            },
+            {
+              label: '咯技术的卡洛斯达拉斯达拉斯昆德拉老师',
+              dept: 5,
+            },
+          ],
+        },
+        {
+          label: '荆州市',
+          dept: 6,
+          children: [
+            {
+              label: '公安局',
+              dept: 7,
+            },
+            {
+              label: '应急管理局',
+              dept: 8,
+            },
+          ],
+        }
+      ],
+    },
+    {
+      label: '四川省',
+      dept: 9,
+      children: [
+        {
+          label: '成都市',
+          dept: 10,
+          children: [
+            {
+              label: '天府新区',
+              dept: 11,
+            },
+          ],
+        },
+      ],
+    },
+    {
+      label: '比格大数据',
+      dept: 12,
+      children: [
+        {
+          label: '武汉研发中心',
+          dept: 13,
+          children: [
+            {
+              label: '研发部',
+              dept: 14,
+            },
+          ],
+        },
+        {
+          label: '西南大区',
+          dept: 15,
+          children: [
+            {
+              label: '事业部',
+              dept: 16,
+            },
+            {
+              label: '事业部',
+              dept: 17,
+            },
+            {
+              label: '事业部',
+              dept: 18,
+            },
+            {
+              label: '事业部',
+              dept: 19,
+            },
+            {
+              label: '事业部',
+              dept: 20,
+            },
+            {
+              label: '事业部',
+              dept: 21,
+            },
+            {
+              label: '事业部',
+              dept: 22,
+            },
+          ],
+        },
+      ],
+    },
+  ]
+
+  const defaultProps = {
+    children: 'children',
+    label: 'label',
+  }
+
+  const acTop = ref(0);
+  const acLeft = ref(0);
+  const actionFlag = ref(false)
+  const showAction = (e, data,node) => {
+    const rect = e.target.getBoundingClientRect(); //获取点击的dom的位置
+    console.log(rect, data,node);
+    acTop.value = rect.y - 17 + "px";
+    acLeft.value = rect.x + 35 + "px";
+    actionFlag.value = true;
+  };
+  const isSticky = (data) => {
+
+    const canvas = document.createElement("canvas");
+    const context = canvas.getContext("2d");
+    context.font = '14px MicrosoftYaHei';
+    const { width } = context.measureText(data);
+    return width > 255 ? true : false;
+  }
+
+  const closeAction = ()=>{
+    actionFlag.value = false;
+  }
+  
+//   const nodeClick = (node,nodeAttr,treeNode,event)=>{
+    
+//   }
+  const emit = defineEmits(['action'])
+  const handleNodeClick = (node,nodeAttr,treeNode,event) => {
+    treeSelected.value = data.dept
+    console.log(treeSelected.value)
+    emit('select',{node,nodeAttr,treeNode,event})
+    //只读则无操作事件
+      closeAction()
+  }
+  
+  onBeforeMount(()=>{
+    //只读则无操作事件
+      window.addEventListener("click", closeAction)
+      window.addEventListener("scroll", closeAction,true)
+  })
+  
+  onBeforeUnmount(()=>{
+    //只读则无操作事件
+      window.removeEventListener('click', closeAction);
+      window.removeEventListener('scroll', closeAction);
+  })
+
+</script>
+
+<style scoped>
+.tree-action-box {
+    display: none;  
+    position: absolute;
+    right: -5px;
+    top: 0px;
+    width: 44px;
+    height: 36px;
+    line-height: 36px;
+    text-align: center;
+    background-color: #f2f3f7;
+    box-shadow: -3px 0px 8px -3px 
+		rgba(0, 7, 101, 0.15);
+}
+.position_sticky {
+  position: sticky;
+  position: -webkit-sticky;
+}
+.tree-more {
+  font-size: 12px;
+  color: #3759be;
+}
+
+.file-tree :deep() .el-tree-node__content:hover .tree-action-box {
+  display: inline-block;
+}
+.file-tree :deep() .el-tree-node > .el-tree-node__children {
+  overflow: visible;
+}
+.file-tree :deep() .el-tree-node__content {
+  position: relative;
+}
+.action-box:hover .tree-action {
+  display: block;
+}
+.label-text {
+  font-size: 14px;
+	color: #404a62;
+}
+.tree-action-box:hover + .label-text {
+  padding: 8px 0;
+  background-color: var(--el-tree-node-hover-bg-color);
+}
+.label-text:hover {
+  padding: 8px 0;
+  background-color: var(--el-tree-node-hover-bg-color);
+}
+.is_active {
+  padding: 8px 0;
+  background-color: var(--el-tree-node-hover-bg-color);
+}
+
+.custom_tree_node {
+  width: 100%;
+  font-size: 14px;
+  color: #202531;
+  padding-right: 16px;
+}
+.text_clip {
+      width: 100%;
+    display: inline-block;
+}
+
+.tree-action .action {
+  width: 100%;
+  height: 34px;
+  line-height: 34px;
+  padding-left: 16px;
+  font-size: 14px;
+  color: #202531;
+  cursor: pointer;
+}
+.tree-action :deep().el-upload {
+  width: 100%;
+}
+.tree-action .action:hover {
+  background-color: #eff2fa;
+  color: #3759be;
+}
+
+.tree-action .disable{
+  cursor: not-allowed;
+  color: #616f94;
+}
+.tree-action .disable:hover{
+  background-color: #fff;
+  color: #616f94;
+}
+
+.tree-action {
+  /* display: none; */
+  width: 144px;
+  background-color: #ffffff;
+  box-shadow: 0px 1px 4px 0px rgba(0, 7, 101, 0.15);
+  padding: 4px 0;
+  border-radius: 4px;
+  position: fixed;
+  z-index: 9;
+}
+
+</style>
\ No newline at end of file
diff --git a/vite.config.js b/vite.config.js
index 7da572b9785df7f8e40a59b26547723be6650f9b..0daefe5eb3ab9965e209b95c01c9a75aa0e31108 100644
--- a/vite.config.js
+++ b/vite.config.js
@@ -14,7 +14,7 @@ export default {
     vue()
   ],
   //本地运行基础路径，如：http://localhost:5173/apaas/ui/
-  base: "/apaas/manage/ui",
+  base: "/apaas/manage/ui/",
   clearScreen:false,
   resolve:{
     //别名，代码引入时方便引入