WMS系统功能添加

src/style/base.styl

@@ -0,0 +1,145 @@
+@import 'reset'
+@import "variables.styl"
+.icon
+  width 1em
+  height 1em
+  vertical-align -0.15em
+  fill currentColor
+  overflow hidden
+
+@keyframes spin {
+  0% {
+    transform rotate(0deg)
+  }
+  100% {
+    transform rotate(360deg)
+  }
+}
+.tc
+  text-align center
+.tl
+  text-align left
+.tr
+  text-align right
+.spin
+  animation spin .6s infinite linear
+  display inline-block
+.lineov2
+  overflow hidden
+  text-overflow ellipsis
+  display -webkit-box
+  -webkit-line-clamp 2
+  -webkit-box-orient vertical
+
+.lineov1
+  text-overflow ellipsis
+  overflow hidden
+  white-space nowrap
+
+.flex-container
+  display flex
+
+.align-center
+  align-items center
+
+.flex-center
+  display flex
+  align-items center
+
+.flex-top
+  display flex
+  align-items flex-start
+
+.justify-end
+  justify-content flex-end
+
+.flex-one
+  flex 1 1 0
+
+.flex-two
+  flex 2
+
+.mouse-pointer
+  cursor pointer
+
+.no-break
+  word-break keep-all
+  white-space nowrap
+
+.break-all
+  word-break break-all
+  white-space normal
+
+/* ---- Chrome ----*/
+.scroll::-webkit-scrollbar
+  width: 5px;
+
+/*滚动条粗细*/
+
+.scroll::-webkit-scrollbar-track
+  -webkit-box-shadow: none;
+  background: #f8f8f9; /*滑道颜色*/
+  border-radius: 5px;
+
+/*滑道的圆滑度*/
+
+.scroll::-webkit-scrollbar-thumb
+  background: #c1c1c1; /*滑块颜色*/
+  border-radius: 5px
+
+/*滑块圆滑度*/
+
+.scroll::-webkit-scrollbar-thumb:hover
+  background: gray;
+
+/*滑块上浮*/
+
+/*--- FirFox ---*/
+.scroll
+  scrollbar-width: thin;
+  scrollbar-color: orange green;
+
+/*滚动条的基本颜色*/
+
+.common-table
+  width 100%
+  border-collapse: collapse;
+  tr > td, tr > th
+    border 1px solid $border-color
+    padding 5px 8px
+  tr > th
+    font-weight bolder
+    white-space nowrap
+
+.inline-div
+  display inline-block
+
+[class~=flex].gutter-span
+  > * + *
+    margin-left .75rem
+
+.warning
+  color $yellow
+.active
+  color $active-color
+.white
+  color white
+.gold
+  color $gold-color
+.gray
+  color $gray-color
+.red
+  color $red
+.blue
+  color $blue
+.green
+  color green
+.bg-white
+  background #fff
+.pct100
+  width 100%
+.bolder-font
+  font-weight bolder
+
+.large-tip
+  font-size 16px

src/style/reset.styl

@@ -0,0 +1,51 @@
+
+// @for num from 1 through 10
+for num in (1..20)
+  .mt{num * 5}
+    margin-top: 5px * num
+  .mr{num * 5}
+    margin-right: 5px * num
+  .mb{num * 5}
+    margin-bottom: 5px * num
+  .ml{num * 5}
+    margin-left: 5px * num
+  .m{num * 5}
+    margin: 5px * num
+  .pt{num * 5}
+    padding-top: 5px * num
+  .pr{num * 5}
+    padding-right: 5px * num
+  .pb{num * 5}
+    padding-bottom: 5px * num
+  .pl{num * 5}
+    padding-left: 5px * num
+  .p{num * 5}
+    padding: 5px * num
+// @for num from 1 through 10
+for num in (1..5)
+  .mt{num * 8}
+    margin-top: 8px * num
+  .mr{num * 8}
+    margin-right: 8px * num
+  .mb{num * 8}
+    margin-bottom: 8px * num
+  .ml{num * 8}
+    margin-left: 8px * num
+  .m{num * 8}
+    margin: 8px * num
+  .pt{num * 8}
+    padding-top: 8px * num
+  .pr{num * 8}
+    padding-right: 8px * num
+  .pb{num * 8}
+    padding-bottom: 8px * num
+  .pl{num * 8}
+    padding-left: 8px * num
+  .p{num * 8}
+    padding: 8px * num
+for num in (1..20)
+  .pct{num * 5}
+    width 5% * num
+for num in (1..30)
+  .w{num * 10}
+    width 10px * num

src/style/variables.styl

@@ -0,0 +1,29 @@
+body
+  --active #409EFF
+  --success #67C23A
+  --warning #E6A23C
+  --red #F56C6C
+  --info var(--gray-6)
+  --gray-1 #F2F6FC
+  --gray-2 #EBEEF5
+  --gray-3 #E4E7ED
+  --gray-4 #DCDFE6
+  --gray-5 #C0C4CC
+  --gray-6 #909399
+  --gray-7 #606266
+  --gray-8 #303133
+  --white #FFFFFF
+  --black #000000
+  --transparent transparent
+
+$gray-1 = var(--gray-1)
+$gray-2 = var(--gray-2)
+$gray-3 = var(--gray-3)
+$gray-4 = var(--gray-4)
+$gray-5 = var(--gray-5)
+$gray-6 = var(--gray-6)
+$gray-7 = var(--gray-7)
+$gray-8 = var(--gray-8)
+$active-color = var(--active)
+$red = var(--red)
+$border-color = var(--gray-4)