diff --git a/src/assets/styles/archives-manage.scss b/src/assets/styles/archives-manage.scss
new file mode 100644
index 0000000..936f4e8
--- /dev/null
+++ b/src/assets/styles/archives-manage.scss
@@ -0,0 +1,121 @@
+@import "~@/assets/styles/variables.scss";
+// archives color
+$arcPurple:#563BE1;
+$arcYellow:#FD8042;
+$arcRed:#F65163;
+$arcGreen: #1AAE93;
+
+.container-main{
+  .left-tree-item{
+    margin-bottom: 20px;
+    height: calc(100vh/2 - 105px);
+    &:last-child{
+      margin-bottom: 0;
+    }
+  }
+
+  .tree-title{
+    height: 40px;
+    line-height: 40px;
+    text-align: center;
+    color: $subMenuActiveText;
+    background-color: #02255F;
+  }
+}
+
+.head-archives-top{
+  display: flex;
+  justify-content: space-between;
+  .head-search{
+    flex: 1;
+  }
+  ::v-deep .el-checkbox .el-checkbox__label{
+    color: #fff;
+  }
+}
+
+.crud-opts{
+  justify-content: space-between;
+}
+
+.archives-handler-btn{
+  .el-button{
+    padding: 0 13px;
+    ::v-deep span{
+      margin-left: 10px;
+    }
+    &.packing-btn{
+      border-color: $arcPurple;
+      background-color: $arcPurple;
+    }
+    &.warehousing-btn{
+      border-color: $arcYellow;
+      background-color: $arcYellow;
+    }
+    &.lending-btn{
+      border-color: $arcRed;
+      background-color: $arcRed;
+    }
+    &.binding-btn{
+      border-color: $arcGreen;
+      background-color: $arcGreen;
+    }
+  }
+  .iconfont{
+    line-height: 30px;
+  }
+}
+
+.archives-table{
+  ::v-deep td.el-table__cell .row-state{
+    display: block;
+    height: 32px;
+    line-height: 30px;
+    padding: 0 16px;
+    margin: 0 6px;
+    border-width: 1px;
+    border-style: solid;
+    border-radius: 30px;
+  }
+  .row-packing{
+    color: $arcPurple;
+    border-color: $arcPurple;
+    &.state-active{
+      color: #fff;
+      background-color: $arcPurple;
+    }
+  }
+  .row-warehousing{
+    color: $arcYellow;
+    border-color: $arcYellow;
+    &.state-active{
+      color: #fff;
+      background-color: $arcYellow;
+    }
+  }
+  .row-lending{
+    color: $arcRed;
+    border-color: $arcRed;
+    &.state-active{
+      color: #fff;
+      background-color: $arcRed;
+    }
+  }
+  .row-binding{
+    color: $arcGreen;
+    border-color: $arcGreen;
+    &.state-active{
+      color: #fff;
+      background-color: $arcGreen;
+    }
+  }
+  ::v-deep .is-scrolling-left,
+  ::v-deep .is-scrolling-middle,
+  ::v-deep .is-scrolling-right{
+    height: calc(100vh - 430px) !important;
+  }
+}
+::v-deep .archives-table.el-table .el-table__fixed-right{
+  background-color: #031435 !important;
+  box-shadow: -5px 5px 10px 1px rgba(15,164,222,0.16);
+}
\ No newline at end of file