feature: 优化css

src/main.ts

@@ -13,10 +13,8 @@ import SvgIcon from '@/components/SvgIcon/index.vue' // svg component
 import ElementPlus from 'element-plus'
 import 'element-plus/dist/index.css'
 // 引入暗黑模式 element-plus 2.2 内置暗黑模式
-import 'element-plus/theme-chalk/dark/css-vars.css'
 // 自定义暗黑模式
-import '@/styles/element-dark.scss'
-import '@/styles/cwg_common.scss'
+import '@/styles/common.scss'
 // 引入阿里图标库
 import '@/assets/iconfont/iconfont.scss'
 import '@/assets/iconfont/iconfont.js'

src/routers/index.ts

@@ -5,7 +5,7 @@ import {
   createWebHashHistory,
   Router,
 } from 'vue-router'
-import Home from '@/views/home2/Home.vue'
+import Home from '@/views/home/Home.vue'
 // 扩展继承属性
 interface extendRoute {
   hidden?: boolean

src/routers/modules/system.ts

@@ -27,7 +27,7 @@ const systemRoute = {
         OnBreadCrumb: true,
       },
       path: 'test',
-      name: 'R-Refusal',
+      name: 'R-Refusal1',
       component: () => import('@/views/test/index.vue'),
     },
   ],

src/styles/common.scss

@@ -1,90 +1,1074 @@
-html,
-body {
-  height: 100%;
+$--color-primary: #368FEC;
+
+html, body {
+  padding: 0;
+  margin: 0;
   width: 100%;
-  overflow: visible;
-  overflow-x: hidden;
+  height: 100%;
+}
+
+html, body, div, span, applet, object, iframe,
+h1, h2, h3, h4, h5, h6, p, blockquote, pre,
+a, abbr, acronym, address, big, cite, code,
+del, dfn, em, img, ins, kbd, q, s, samp,
+small, strike, strong, sub, sup, tt, var,
+b, u, i, center,
+dl, dt, dd, ol, ul, li,
+fieldset, form, label, legend,
+table, caption, tbody, tfoot, thead, tr, th, td,
+article, aside, canvas, details, embed,
+figure, figcaption, footer, header, hgroup,
+menu, nav, output, ruby, section, summary,
+time, mark, audio, video {
   margin: 0;
   padding: 0;
-  font-size: 14px;
+  border: 0;
+  vertical-align: baseline;
+  word-break: break-word !important;
 }
+
+/* HTML5 display-role reset for older browsers */
+article, aside, details, figcaption, figure,
+footer, header, hgroup, menu, nav, section {
+  display: block;
+}
+
 body {
-  background: #f0f2f5;
+  line-height: 1;
 }
 
-/* 常用 flex */
-.flex-center {
-  display: flex;
-  align-items: center;
-  justify-content: center;
+ol, ul {
+  list-style: none;
 }
-.flex-justify-between {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
+
+blockquote, q {
+  quotes: none;
+}
+
+blockquote:before, blockquote:after,
+q:before, q:after {
+  content: '';
+  content: none;
+}
+
+table {
+  border-collapse: collapse;
+  border-spacing: 0;
 }
-.flex-align-center {
+
+a {
+  text-decoration: none;
+}
+
+.iconfont {
+  font-weight: 500;
+}
+
+//去左边框
+.crm-border-left-no {
+  border-left: none !important;
+
+  .el-input__wrapper {
+    padding-top: 0;
+    padding-bottom: 0;
+    box-sizing: border-box;
+    border: 1px solid var(--el-border-color);
+    box-shadow: none !important;
+    border-left: none !important;
+  }
+
+  .el-input__inner, .el-button {
+    border-left: none;
+  }
+}
+
+//去圆角
+.crm-border-radius-no {
+  border-radius: 0 !important;
+
+  .el-input__inner, .el-button {
+    border-radius: 0;
+  }
+
+  .el-select__wrapper, .el-input__wrapper {
+    border-radius: 0;
+  }
+}
+
+.select-tag {
+  width: 140px;
+  min-width: 140px !important;
+}
+
+//下划线
+.crm-text-underline {
+  text-decoration: underline;
+  cursor: pointer;
+}
+
+//小手
+.crm-cursor {
+  cursor: pointer;
+  user-select: none;
+}
+
+//字体按钮
+.crm-font-btn {
+  cursor: pointer;
+  user-select: none;
+  color: rgba(64, 123, 158, 1);
+}
+
+.crm-font-btn:hover {
+  color: rgba(64, 123, 158, 0.8);
+}
+
+//一行，...
+.crm-one-font {
+  word-break: keep-all;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
+//2行，...(多行)
+.crm-tow-font {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  display: -webkit-box;
+  -webkit-line-clamp: 2;
+  -webkit-box-orient: vertical;
+}
+
+//滚动条
+::-webkit-scrollbar {
+  /*滚动条整体样式*/
+  width: 3px;
+  /*高宽分别对应横竖滚动条的尺寸*/
+  height: 6px;
+}
+
+::-webkit-scrollbar-thumb {
+  /*滚动条里面小方块*/
+  border-radius: 6px;
+  @include bg_main();
+  background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, .2) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .2) 50%, rgba(255, 255, 255, .2) 75%, transparent 75%, transparent);
+}
+
+::-webkit-scrollbar-track {
+  /*滚动条里面轨道*/
+  -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
+  /*border-radius: 10px;*/
+  background: #ededed;
+}
+
+//滑动
+.slide-right-enter-active,
+.slide-right-leave-active {
+  position: absolute;
+  top: 0;
+  left: 0;
+  transform: translate(0, 0);
+  transition: all .35s .1s linear;
+}
+
+.slide-right-enter {
+  position: absolute;
+  transform: translate(-100%, 0);
+}
+
+.slide-right-leave-active {
+  position: absolute;
+  transform: translate(100%, 0);
+}
+
+.slideinup-enter-active,
+.slideinup-leave-active {
+  opacity: .5;
+  position: absolute;
+  transform: translate(0, 0);
+  transition: all .35s .1s linear;
+}
+
+.slideinup-enter {
+  opacity: 0;
+  position: absolute;
+  transform: translate(0, -100%);
+}
+
+.slideinup-leave-active {
+  opacity: 0;
+  position: absolute;
+  transform: translate(0, 100%);
+}
+
+//dialog
+.el-dialog--center .el-dialog__body {
+  text-align: initial;
+  padding: 25px 25px 30px;
+}
+
+.dialog_header_w.el-dialog {
+  width: 650px;
+
+  .el-dialog__header {
+    border-bottom: 1px solid;
+    @include border_gray_3();
+    font-weight: bold;
+    font-size: 14px;
+  }
+
+  .dialog-footer {
+    margin-top: 20px;
+    text-align: center;
+  }
+}
+
+.dialog_header_b.el-dialog {
+  width: 500px;
+
+  .el-dialog__header {
+    @include bg_gray_6();
+    @include font_white();
+    font-weight: bold;
+    font-size: 14px;
+
+    .el-dialog__title {
+      @include font_white();
+    }
+  }
+
+  .dialog-footer {
+    margin-top: 20px;
+    text-align: center;
+  }
+}
+
+//消息提示框样式
+.el-message.crm_message {
+  padding: 0;
+  border: none;
+  height: 40px;
+  line-height: 40px;
+  transform: translate(10%);
+
+  .el-message__icon {
+    width: 40px;
+    height: 40px;
+    font-size: 24px;
+    line-height: 40px;
+    text-align: center;
+    color: #ffffff;
+  }
+
+  .el-message__content {
+    margin-right: 10px;
+    width: calc(100% - 40px);
+    text-align: center;
+  }
+}
+
+//成功
+.el-message.crm_message.crm_msg_suc {
+  .el-message__icon {
+    background-color: #45CE61;
+  }
+
+  .el-message__content {
+    color: #45CE61;
+  }
+}
+
+//失败
+.el-message.crm_message.crm_msg_err {
+  .el-message__icon {
+    background-color: #EB3F57;
+  }
+
+  .el-message__content {
+    color: #EB3F57;
+  }
+}
+
+//警告
+.el-message.crm_message.crm_msg_war {
+  .el-message__icon {
+    background-color: #EB3F57;
+  }
+
+  .el-message__content {
+    color: #EB3F57;
+  }
+}
+
+.el-message-box__message {
+  width: 100%;
+}
+
+.el-table th {
+  background-color: #f5f5f5;
+  color: #333333;
+  font-weight: 700;
+}
+
+.el-table--striped .el-table__body tr.el-table__row--striped td {
+  background-color: #f5f5f5;
+}
+
+@media only screen and (max-width: 767px) {
+  .hidden-xs-only {
+    display: none !important
+  }
+}
+
+@media only screen and (min-width: 768px) {
+  .hidden-sm-and-up {
+    display: none !important
+  }
+}
+
+@media only screen and (min-width: 768px) and (max-width: 991px) {
+  .hidden-sm-only {
+    display: none !important
+  }
+}
+
+@media only screen and (max-width: 991px) {
+  .hidden-sm-and-down {
+    display: none !important
+  }
+}
+
+@media only screen and (min-width: 992px) {
+  .hidden-md-and-up {
+    display: none !important
+  }
+}
+
+@media only screen and (min-width: 992px) and (max-width: 1199px) {
+  .hidden-md-only {
+    display: none !important
+  }
+}
+
+@media only screen and (max-width: 1199px) {
+  .hidden-md-and-down {
+    display: none !important
+  }
+}
+
+@media only screen and (min-width: 1200px) {
+  .hidden-lg-and-up {
+    display: none !important
+  }
+}
+
+@media only screen and (min-width: 1200px) and (max-width: 1919px) {
+  .hidden-lg-only {
+    display: none !important
+  }
+}
+
+@media only screen and (max-width: 1919px) {
+  .hidden-lg-and-down {
+    display: none !important
+  }
+}
+
+@media only screen and (min-width: 1920px) {
+  .hidden-xl-only {
+    display: none !important
+  }
+}
+
+.view {
+  padding: 10px;
+  border-radius: 8px;
+  background-color: #ffffff;
+  height: calc(100% - 20px);
+  position: relative;
+  overflow: hidden;
+  overflow-y: auto;
+}
+
+//选中时边框
+.el-input.is-active .el-input__inner,
+.el-input__inner:focus,
+.el-button:active,
+.el-range-editor.is-active,
+.el-range-editor.is-active:hover {
+  border-color: #DCDFE6 !important;
+}
+
+//分页
+.crm_pagination {
   display: flex;
+  justify-content: flex-end;
   align-items: center;
+  margin-top: 20px;
+
+  .crm_page_total {
+    line-height: 32px;
+
+    span {
+      margin: 0 3px;
+      font-size: 14px;
+      color: #929292;
+    }
+  }
 }
 
-/* 移动端的时候由于屏幕变小隐藏头部导航栏 */
-@media screen and (max-width: 540px) {
-  .app-breadcrumb {
-    display: none !important;
+//tab显示
+.crm-chooseTab {
+  text-align: left;
+  margin-bottom: 20px;
+  border-bottom: 1px solid #DCDFE6;
+
+  .chooseLang {
+    margin-top: 2px;
+    margin-right: 10px;
+
+    > span {
+      border: 1px solid #DCDFE6;
+      border-bottom: none;
+      padding: 0 8px;
+      min-width: 100px;
+      display: inline-block;
+      height: 32px;
+      line-height: 32px;
+      box-sizing: border-box;
+      text-align: center;
+      font-size: 14px;
+    }
+
+    span.active {
+      @include border_bottom_blue_1();
+      @include bg_main();
+      @include font_white();
+    }
   }
 }
 
+//搜索块
+.crm_search {
+  .el-form {
+    display: flex;
+
+    .el-row {
+      flex: 1;
+
+      .el-col {
+        display: flex;
+        flex-wrap: wrap;
+
+        .el-date-editor {
+          //top: 1px;
+        }
+      }
+    }
+
+    .el-select {
+      .el-select__wrapper {
+        min-width: 192px;
+      }
+    }
+
+    .crm_search_down {
+      width: 120px;
+
+      .el-select__wrapper {
+        background-color: #F5F5F5;
+        min-width: 0;
+      }
+    }
+
+    .crm_search_down_special {
+      width: 120px;
 
+      .el-select__wrapper {
+        background-color: #368FEC;
+        color: #ffffff;
+        border: transparent;
+      }
+    }
 
-/* nprogress样式 */
-#nprogress .bar {
-  background: $primaryColor !important;
+    .el-form-item {
+      margin-bottom: 10px;
+      //margin-right: 15px;
+      .search_action_btn > span {
+        margin-left: 20px;
+        font-weight: bold;
+        white-space: nowrap;
+        padding: 6px 10px;
+        background-color: #368FEC;
+        color: #FFFFFF;
+        border-radius: 2px;
+        min-width: 90px;
+        display: inline-block;
+        line-height: 20px;
+        box-sizing: border-box;
+
+        i {
+          margin-right: 4px;
+          font-weight: bold;
+        }
+      }
+    }
+  }
 }
-#nprogress .spinner-icon {
-  border-top-color: $primaryColor !important;
-  border-left-color: $primaryColor !important;
+
+//表格操作块
+.crm_table_btn {
+  white-space: nowrap;
+
+  > span {
+    margin: 4px 8px;
+    font-size: 16px;
+
+    i {
+      font-weight: bold;
+    }
+  }
 }
-#nprogress .peg {
-  box-shadow: 0 0 10px $primaryColor, 0 0 5px $primaryColor !important;
+
+//底部按钮
+.dialog-footer {
+  .el-button {
+    min-width: 100px;
+  }
 }
 
-.app-container {
-  height: 100%;
+//大图展示关闭
+.el-image {
+  .el-icon-circle-close {
+    @include font_white();
+  }
+}
+
+// 消息提示框
+.crm_message_box.el-message-box {
+  width: 480px;
+  height: 200px;
+  text-align: center;
+  box-shadow: 0 6px 20px 0 rgba(201, 193, 193, .5);
+  border-radius: 4px;
+
+  .el-message-box__header {
+    border-bottom: 1px solid rgba(226, 226, 226, 1);
+
+    .el-message-box__title {
+      line-height: 20px;
+      color: rgba(0, 0, 0, 1);
+      font-size: 16px;
+    }
+
+    .el-message-box__headerbtn {
+      display: none;
+    }
+  }
+
+  .el-message-box__content {
+    padding-top: 30px;
+    padding-bottom: 30px;
+    font-size: 18px;
+    color: rgba(102, 102, 102, 1);
+  }
+
+  .el-message-box__btns {
+    margin-bottom: 10px;
+    text-align: center;
+    justify-content: center;
+
+    .el-button {
+      width: 100px;
+      height: 36px;
+      font-size: 14px;
+    }
+  }
+}
+
+//遮罩
+.crm_verified_info_mask {
+  position: fixed;
+  left: 0;
+  top: 0;
   width: 100%;
-  padding: 10px 12px;
+  height: 100%;
+  background-color: rgba(43, 48, 67, 0.65);
+  z-index: 89;
+}
+
+//折叠
+.crm_collapse_info.el-collapse {
+  border: none;
+
+  .el-collapse-item__header, .el-collapse-item__wrap {
+    border: none;
+  }
+
+  .el-collapse-item__header {
+    background: #F5F5F5;
+    padding: 0 20px;
+    height: 40px;
+    line-height: 40px;
+    color: #2B3043;
+    font-weight: bold;
+
+    i {
+      color: #2B3043;
+      font-weight: bold;
+    }
+  }
+
+  .el-collapse-item__wrap {
+    padding: 0 20px;
+  }
+
+  .el-collapse-item__content {
+    padding-bottom: 5px;
+
+    .el-form-item {
+      margin-bottom: 0;
+
+      .el-form-item__content {
+        text-align: left;
+      }
+    }
+  }
+}
+
+//开关
+.crm_switch .el-switch__label {
+  position: absolute;
+  display: none;
+  max-width: 25px;
+  overflow: hidden;
+  color: #FFFFFF !important;
+}
+
+.crm_switch.crm_switch_width .el-switch__label {
+  position: absolute;
+  display: none;
+  max-width: 50px;
+  overflow: hidden;
+  color: #FFFFFF !important;
+}
+
+/*打开时文字位置设置*/
+.crm_switch .el-switch__label--right {
+  z-index: 1;
+  left: -3px;
+}
+
+/*关闭时文字位置设置*/
+.crm_switch .el-switch__label--left {
+  z-index: 1;
+  right: 0;
+}
+
+/*显示文字*/
+.crm_switch .el-switch__label.is-active {
+  display: block;
+}
+
+.crm_switch.el-switch .el-switch__core {
+  width: 50px !important;
+  overflow: hidden;
+}
+
+.crm_switch.crm_switch_width.el-switch .el-switch__core {
+  width: 75px !important;
+  overflow: hidden;
+}
+
+.crm_switch.el-switch.is-checked .el-switch__core::after {
+  z-index: 2;
+}
+.el-table .state {
+  display: block;
+  min-width: 80px;
   box-sizing: border-box;
+  line-height: 1.5;
+  border-radius: 2px;
+  padding: 2px 10px;
+  color: #ffffff;
+}
+
+//状态颜色
+.crm_state_blue {
+  text-align: center;
+  background-color: #368FEC;
+}
+
+.crm_state_green {
+  text-align: center;
+  background-color: #87D068;
+}
+
+.crm_state_gray {
+  text-align: center;
+  background-color: #A1A1A1;
+}
+
+.crm_state_red {
+  text-align: center;
+  background-color: #EB3F57;
+}
+
+.crm_state_yellow {
+  text-align: center;
+  background-color: rgb(231, 211, 31);
+}
+
+.crm_state_orange {
+  text-align: center;
+  background-color: #FF9800;
+}
+
+.crm_state_violet {
+  text-align: center;
+  background-color: #a492be;
+}
+
+//表格颜色
+.el-table th.is-leaf {
+  background-color: #F2F2F2;
+}
+
+//label样式
+#TradingDetailedInfo .el-form-item__label {
+  border-radius: 2px;
+  @include bg_gray_7();
+  font-weight: bold;
+  text-align: center !important;
+  min-height: 40px !important;
+  box-sizing: border-box;
+}
+
+#TradingDetailedInfo .el-form-item__content {
+  min-height: 40px !important;
+  line-height: 1.5;
+  box-sizing: border-box;
+  border: 1px solid;
   display: flex;
-  flex-direction: column;
+  align-content: center;
+  align-items: center;
+  justify-content: center;
+  @include border_gray_4();
+  @include bg_white();
+  text-align: center !important;
+
+  .el-input__inner, .el-input {
+    height: 34px;
+    border: none;
+    text-align: center;
+  }
+}
+
+#TradingDetailedInfo .el-form-item {
+  margin-bottom: 20px !important;
+}
+
+
+//input前置后置背景色
+.el-input-group__append, .el-input-group__prepend {
+  background-color: #F2F2F2 !important;
+}
+
+//富文本层级
+.tox-silver-sink {
+  z-index: 9999 !important;
+}
+
+//表格加载
+.el-loading-mask {
+  .el-icon-loading {
+    font-size: 28px;
+  }
+}
+
+//
+.el-popper.el-dropdown-menu {
+  width: max-content;
 }
-.app-container-inner {
+
+.el-popper.el-cascader__dropdown {
+  max-width: 1200px;
+  width: auto;
+
+  .el-cascader-panel {
+    width: 100%;
+    display: flex;
+    flex-wrap: wrap;
+  }
+
+  .el-cascader-menu, .el-cascader-menu__wrap {
+    width: 300px;
+    height: 300px;
+  }
+}
+
+//表头英文时按单词换行
+.el-table thead th > .cell {
+  word-break: break-word !important;
+}
+
+
+//新增弹出样式
+#TradingDetailedInfoAdd.InfoBox {
+  width: 450px;
   height: 100%;
-  width: 100%;
-  box-shadow: 0 2px 12px 0 rgb(0 0 0 / 10%);
-  background: white;
-  padding: 20px;
+  padding: 15px 0;
+  border-radius: 2px;
+  -webkit-box-sizing: border-box;
   box-sizing: border-box;
-}
+  box-shadow: 0px 3px 5px 0px rgba(49, 49, 49, 0.35);
+  position: fixed;
+  background-color: #FFFFFF;
+  z-index: 100;
+  overflow: hidden;
+  overflow-y: auto;
+  top: 0;
+  right: -455px;
+  -webkit-transition: all 0.6s;
+  -moz-transition: all 0.6s;
+  -o-transition: all 0.6s;
+  transition: all 0.6s;
+
+  .header {
+    text-align: left;
+    height: 25px;
+    line-height: 25px;
+    margin: 0 20px 10px;
+    font-size: 14px;
+    display: flex;
+    justify-content: space-between;
+
+    .title {
+      font-weight: bold;
+    }
+
+    i.el-icon-close {
+      text-align: right !important;
+      font-weight: bold;
+      margin-right: 7px;
+    }
+  }
+
+  .btn {
+    display: inline-block;
+    padding: 10px;
+    background-color: #368FEC;
+    color: #FFFFFF;
+    border-radius: 2px;
+    text-align: center;
+    min-width: 120px;
+    margin: 25px 0;
+  }
+
+  .deleteBtn {
+    display: inline-block;
+    min-width: 100px;
+    height: 30px;
+    line-height: 30px;
+    text-align: center;
+    background-color: #EB3F57;
+    color: #FFFFFF;
+  }
+
+  .avatar-uploader {
+    display: inline-block;
+
+    .updateBtn {
+      display: inline-block;
+      text-align: left;
+
+      i {
+        font-weight: bold;
+        font-size: 20px;
+        margin-right: 5px;
+      }
+    }
+  }
+
+  .channelBanks {
+    padding-top: 10px;
+    border-bottom: 1px solid #DCDFE6;
+  }
+
+  .channel {
+    text-align: left !important;
+
+    .btn {
+      display: inline;
+      padding: 10px;
+      background-color: #368FEC;
+      color: #FFFFFF;
+      border-radius: 2px;
+      text-align: center;
+      min-width: 120px;
+      margin: 25px 0;
+    }
+  }
+
+  .channel-tit {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    height: 40px;
+    background-color: #F2F2F2;
+    padding: 0 15px;
+    box-sizing: border-box;
+    margin-bottom: 10px;
 
-.layout-horizontal {
-  .header-icon {
-    color: #bfcbd9 !important;
+    .add {
+      border: 1px dashed #368FEC;
+      color: #368FEC;
+      line-height: 20px;
+      display: inline-block;
+      width: 20px;
+      height: 20px;
+      font-weight: bold;
+
+      i {
+        font-weight: bold;
+        font-size: 12px;
+        margin-left: 4px;
+      }
+    }
   }
-  .el-dropdown-link {
-    color: #bfcbd9 !important;
+
+  .custom-tree-node {
+    flex: 1;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    font-size: 14px;
+    padding-right: 4px;
+
+    i {
+      margin-left: 4px;
+      /*font-weight: bold;*/
+    }
+  }
+
+  .dialog_header_w {
+    width: 850px !important;
+
+    .code {
+      padding: 6px 12px;
+      background-color: #368FEC;
+      color: #FFFFFF;
+      border-radius: 2px;
+      margin-left: 10px;
+    }
+
+    .chooseLang {
+      > span {
+        border: 1px solid #DCDFE6;
+        padding: 0 8px;
+        min-width: 100px;
+        display: inline-block;
+        height: 40px;
+        line-height: 40px;
+        box-sizing: border-box;
+        text-align: center;
+      }
+
+      span.active {
+        @include border_red_1();
+        @include font_main();
+      }
+    }
+  }
+
+  .el-form {
+    border-top: 1px solid #E4E4E4;
+    padding: 10px 0;
+    text-align: left;
+    position: relative;
+
+    .el-form-item {
+      margin-bottom: 20px;
+      padding: 0 20px;
+    }
+
+    .authorityBox.el-form-item .el-form-item__content {
+      display: contents;
+    }
+  }
+
+  .el-select {
+    width: 100%;
+  }
+
+  .el-date-editor.el-input {
+    width: 100%;
+  }
+
+  .el-upload {
+    width: 100%;
+  }
+
+  .channel {
+    .el-input__inner {
+      text-align: left;
+    }
+  }
+
+  .online-editing.el-form-item {
+    .el-form-item__content-item {
+      border: none !important;
+    }
   }
 }
 
-.el-pager li:focus {
-  border: none;
+#TradingDetailedInfoAdd.InfoBox.active {
+  right: 0;
 }
-.el-dropdown:focus {
-  border: none;
-  outline: none !important;
+
+// 统一 select 和 input 的宽度
+.el-select,
+.el-input,
+.el-date-editor.el-input,
+.el-date-editor.el-input__inner {
+  width: 100%;
+  //min-width: 192px;
+}
+
+.el-select .el-input {
+  width: 100%;
+}
+
+.el-input__inner {
+  width: 100%;
+}
+.el-input-number{
+  width: 100%;
+  .el-input__inner{
+    text-align: left!important;
+    &::placeholder {
+      text-align: left;
+    }
+  }
+}
+input[type="number"]::-webkit-outer-spin-button,
+input[type="number"]::-webkit-inner-spin-button {
+  -webkit-appearance: none;
+  margin: 0;
+}
+
+/* Firefox */
+input[type="number"] {
+  -moz-appearance: textfield;
 }
-.svg-icon:focus {
-  border: none !important;
-  outline: none !important;
+.div-hidden{
+  display: none !important;
+}
+.el-input.el-input--default.el-input--suffix {
+  // 固定宽度
+
+  width: 192px !important;
 }
 
 .mb20{

src/styles/cwg_common.scss

@@ -1,1072 +0,0 @@
-$--color-primary: #368FEC;
-
-html, body {
-  padding: 0;
-  margin: 0;
-  width: 100%;
-  height: 100%;
-}
-
-html, body, div, span, applet, object, iframe,
-h1, h2, h3, h4, h5, h6, p, blockquote, pre,
-a, abbr, acronym, address, big, cite, code,
-del, dfn, em, img, ins, kbd, q, s, samp,
-small, strike, strong, sub, sup, tt, var,
-b, u, i, center,
-dl, dt, dd, ol, ul, li,
-fieldset, form, label, legend,
-table, caption, tbody, tfoot, thead, tr, th, td,
-article, aside, canvas, details, embed,
-figure, figcaption, footer, header, hgroup,
-menu, nav, output, ruby, section, summary,
-time, mark, audio, video {
-  margin: 0;
-  padding: 0;
-  border: 0;
-  vertical-align: baseline;
-  word-break: break-word !important;
-}
-
-/* HTML5 display-role reset for older browsers */
-article, aside, details, figcaption, figure,
-footer, header, hgroup, menu, nav, section {
-  display: block;
-}
-
-body {
-  line-height: 1;
-}
-
-ol, ul {
-  list-style: none;
-}
-
-blockquote, q {
-  quotes: none;
-}
-
-blockquote:before, blockquote:after,
-q:before, q:after {
-  content: '';
-  content: none;
-}
-
-table {
-  border-collapse: collapse;
-  border-spacing: 0;
-}
-
-a {
-  text-decoration: none;
-}
-
-.iconfont {
-  font-weight: 500;
-}
-
-//去左边框
-.crm-border-left-no {
-  border-left: none !important;
-
-  .el-input__wrapper {
-    padding-top: 0;
-    padding-bottom: 0;
-    box-sizing: border-box;
-    border: 1px solid var(--el-border-color);
-    box-shadow: none !important;
-    border-left: none !important;
-  }
-
-  .el-input__inner, .el-button {
-    border-left: none;
-  }
-}
-
-//去圆角
-.crm-border-radius-no {
-  border-radius: 0 !important;
-
-  .el-input__inner, .el-button {
-    border-radius: 0;
-  }
-
-  .el-select__wrapper, .el-input__wrapper {
-    border-radius: 0;
-  }
-}
-
-.select-tag {
-  width: 140px;
-  min-width: 140px !important;
-}
-
-//下划线
-.crm-text-underline {
-  text-decoration: underline;
-  cursor: pointer;
-}
-
-//小手
-.crm-cursor {
-  cursor: pointer;
-  user-select: none;
-}
-
-//字体按钮
-.crm-font-btn {
-  cursor: pointer;
-  user-select: none;
-  color: rgba(64, 123, 158, 1);
-}
-
-.crm-font-btn:hover {
-  color: rgba(64, 123, 158, 0.8);
-}
-
-//一行，...
-.crm-one-font {
-  word-break: keep-all;
-  white-space: nowrap;
-  overflow: hidden;
-  text-overflow: ellipsis;
-}
-
-//2行，...(多行)
-.crm-tow-font {
-  overflow: hidden;
-  text-overflow: ellipsis;
-  display: -webkit-box;
-  -webkit-line-clamp: 2;
-  -webkit-box-orient: vertical;
-}
-
-//滚动条
-::-webkit-scrollbar {
-  /*滚动条整体样式*/
-  width: 3px;
-  /*高宽分别对应横竖滚动条的尺寸*/
-  height: 6px;
-}
-
-::-webkit-scrollbar-thumb {
-  /*滚动条里面小方块*/
-  border-radius: 6px;
-  @include bg_main();
-  background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, .2) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .2) 50%, rgba(255, 255, 255, .2) 75%, transparent 75%, transparent);
-}
-
-::-webkit-scrollbar-track {
-  /*滚动条里面轨道*/
-  -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
-  /*border-radius: 10px;*/
-  background: #ededed;
-}
-
-//滑动
-.slide-right-enter-active,
-.slide-right-leave-active {
-  position: absolute;
-  top: 0;
-  left: 0;
-  transform: translate(0, 0);
-  transition: all .35s .1s linear;
-}
-
-.slide-right-enter {
-  position: absolute;
-  transform: translate(-100%, 0);
-}
-
-.slide-right-leave-active {
-  position: absolute;
-  transform: translate(100%, 0);
-}
-
-.slideinup-enter-active,
-.slideinup-leave-active {
-  opacity: .5;
-  position: absolute;
-  transform: translate(0, 0);
-  transition: all .35s .1s linear;
-}
-
-.slideinup-enter {
-  opacity: 0;
-  position: absolute;
-  transform: translate(0, -100%);
-}
-
-.slideinup-leave-active {
-  opacity: 0;
-  position: absolute;
-  transform: translate(0, 100%);
-}
-
-//dialog
-.el-dialog--center .el-dialog__body {
-  text-align: initial;
-  padding: 25px 25px 30px;
-}
-
-.dialog_header_w.el-dialog {
-  width: 650px;
-
-  .el-dialog__header {
-    border-bottom: 1px solid;
-    @include border_gray_3();
-    font-weight: bold;
-    font-size: 14px;
-  }
-
-  .dialog-footer {
-    margin-top: 20px;
-    text-align: center;
-  }
-}
-
-.dialog_header_b.el-dialog {
-  width: 500px;
-
-  .el-dialog__header {
-    @include bg_gray_6();
-    @include font_white();
-    font-weight: bold;
-    font-size: 14px;
-
-    .el-dialog__title {
-      @include font_white();
-    }
-  }
-
-  .dialog-footer {
-    margin-top: 20px;
-    text-align: center;
-  }
-}
-
-//消息提示框样式
-.el-message.crm_message {
-  padding: 0;
-  border: none;
-  height: 40px;
-  line-height: 40px;
-  transform: translate(10%);
-
-  .el-message__icon {
-    width: 40px;
-    height: 40px;
-    font-size: 24px;
-    line-height: 40px;
-    text-align: center;
-    color: #ffffff;
-  }
-
-  .el-message__content {
-    margin-right: 10px;
-    width: calc(100% - 40px);
-    text-align: center;
-  }
-}
-
-//成功
-.el-message.crm_message.crm_msg_suc {
-  .el-message__icon {
-    background-color: #45CE61;
-  }
-
-  .el-message__content {
-    color: #45CE61;
-  }
-}
-
-//失败
-.el-message.crm_message.crm_msg_err {
-  .el-message__icon {
-    background-color: #EB3F57;
-  }
-
-  .el-message__content {
-    color: #EB3F57;
-  }
-}
-
-//警告
-.el-message.crm_message.crm_msg_war {
-  .el-message__icon {
-    background-color: #EB3F57;
-  }
-
-  .el-message__content {
-    color: #EB3F57;
-  }
-}
-
-.el-message-box__message {
-  width: 100%;
-}
-
-.el-table th {
-  background-color: #f5f5f5;
-  color: #333333;
-  font-weight: 700;
-}
-
-.el-table--striped .el-table__body tr.el-table__row--striped td {
-  background-color: #f5f5f5;
-}
-
-@media only screen and (max-width: 767px) {
-  .hidden-xs-only {
-    display: none !important
-  }
-}
-
-@media only screen and (min-width: 768px) {
-  .hidden-sm-and-up {
-    display: none !important
-  }
-}
-
-@media only screen and (min-width: 768px) and (max-width: 991px) {
-  .hidden-sm-only {
-    display: none !important
-  }
-}
-
-@media only screen and (max-width: 991px) {
-  .hidden-sm-and-down {
-    display: none !important
-  }
-}
-
-@media only screen and (min-width: 992px) {
-  .hidden-md-and-up {
-    display: none !important
-  }
-}
-
-@media only screen and (min-width: 992px) and (max-width: 1199px) {
-  .hidden-md-only {
-    display: none !important
-  }
-}
-
-@media only screen and (max-width: 1199px) {
-  .hidden-md-and-down {
-    display: none !important
-  }
-}
-
-@media only screen and (min-width: 1200px) {
-  .hidden-lg-and-up {
-    display: none !important
-  }
-}
-
-@media only screen and (min-width: 1200px) and (max-width: 1919px) {
-  .hidden-lg-only {
-    display: none !important
-  }
-}
-
-@media only screen and (max-width: 1919px) {
-  .hidden-lg-and-down {
-    display: none !important
-  }
-}
-
-@media only screen and (min-width: 1920px) {
-  .hidden-xl-only {
-    display: none !important
-  }
-}
-
-.view {
-  padding: 10px;
-  border-radius: 8px;
-  background-color: #ffffff;
-  height: calc(100% - 20px);
-  position: relative;
-  overflow: hidden;
-  overflow-y: auto;
-}
-
-//选中时边框
-.el-input.is-active .el-input__inner,
-.el-input__inner:focus,
-.el-button:active,
-.el-range-editor.is-active,
-.el-range-editor.is-active:hover {
-  border-color: #DCDFE6 !important;
-}
-
-//分页
-.crm_pagination {
-  display: flex;
-  justify-content: flex-end;
-  align-items: center;
-  margin-top: 20px;
-
-  .crm_page_total {
-    line-height: 32px;
-
-    span {
-      margin: 0 3px;
-      font-size: 14px;
-      color: #929292;
-    }
-  }
-}
-
-//tab显示
-.crm-chooseTab {
-  text-align: left;
-  margin-bottom: 20px;
-  border-bottom: 1px solid #DCDFE6;
-
-  .chooseLang {
-    margin-top: 2px;
-    margin-right: 10px;
-
-    > span {
-      border: 1px solid #DCDFE6;
-      border-bottom: none;
-      padding: 0 8px;
-      min-width: 100px;
-      display: inline-block;
-      height: 32px;
-      line-height: 32px;
-      box-sizing: border-box;
-      text-align: center;
-      font-size: 14px;
-    }
-
-    span.active {
-      @include border_bottom_blue_1();
-      @include bg_main();
-      @include font_white();
-    }
-  }
-}
-
-//搜索块
-.crm_search {
-  .el-form {
-    display: flex;
-
-    .el-row {
-      flex: 1;
-
-      .el-col {
-        display: flex;
-        flex-wrap: wrap;
-
-        .el-date-editor {
-          //top: 1px;
-        }
-      }
-    }
-
-    .el-select {
-      .el-select__wrapper {
-        min-width: 192px;
-      }
-    }
-
-    .crm_search_down {
-      width: 120px;
-
-      .el-select__wrapper {
-        background-color: #F5F5F5;
-        min-width: 0;
-      }
-    }
-
-    .crm_search_down_special {
-      width: 120px;
-
-      .el-select__wrapper {
-        background-color: #368FEC;
-        color: #ffffff;
-        border: transparent;
-      }
-    }
-
-    .el-form-item {
-      margin-bottom: 10px;
-      //margin-right: 15px;
-      .search_action_btn > span {
-        margin-left: 20px;
-        font-weight: bold;
-        white-space: nowrap;
-        padding: 6px 10px;
-        background-color: #368FEC;
-        color: #FFFFFF;
-        border-radius: 2px;
-        min-width: 90px;
-        display: inline-block;
-        line-height: 20px;
-        box-sizing: border-box;
-
-        i {
-          margin-right: 4px;
-          font-weight: bold;
-        }
-      }
-    }
-  }
-}
-
-//表格操作块
-.crm_table_btn {
-  white-space: nowrap;
-
-  > span {
-    margin: 4px 8px;
-    font-size: 16px;
-
-    i {
-      font-weight: bold;
-    }
-  }
-}
-
-//底部按钮
-.dialog-footer {
-  .el-button {
-    min-width: 100px;
-  }
-}
-
-//大图展示关闭
-.el-image {
-  .el-icon-circle-close {
-    @include font_white();
-  }
-}
-
-// 消息提示框
-.crm_message_box.el-message-box {
-  width: 480px;
-  height: 200px;
-  text-align: center;
-  box-shadow: 0 6px 20px 0 rgba(201, 193, 193, .5);
-  border-radius: 4px;
-
-  .el-message-box__header {
-    border-bottom: 1px solid rgba(226, 226, 226, 1);
-
-    .el-message-box__title {
-      line-height: 20px;
-      color: rgba(0, 0, 0, 1);
-      font-size: 16px;
-    }
-
-    .el-message-box__headerbtn {
-      display: none;
-    }
-  }
-
-  .el-message-box__content {
-    padding-top: 30px;
-    padding-bottom: 30px;
-    font-size: 18px;
-    color: rgba(102, 102, 102, 1);
-  }
-
-  .el-message-box__btns {
-    margin-bottom: 10px;
-    text-align: center;
-    justify-content: center;
-
-    .el-button {
-      width: 100px;
-      height: 36px;
-      font-size: 14px;
-    }
-  }
-}
-
-//遮罩
-.crm_verified_info_mask {
-  position: fixed;
-  left: 0;
-  top: 0;
-  width: 100%;
-  height: 100%;
-  background-color: rgba(43, 48, 67, 0.65);
-  z-index: 89;
-}
-
-//折叠
-.crm_collapse_info.el-collapse {
-  border: none;
-
-  .el-collapse-item__header, .el-collapse-item__wrap {
-    border: none;
-  }
-
-  .el-collapse-item__header {
-    background: #F5F5F5;
-    padding: 0 20px;
-    height: 40px;
-    line-height: 40px;
-    color: #2B3043;
-    font-weight: bold;
-
-    i {
-      color: #2B3043;
-      font-weight: bold;
-    }
-  }
-
-  .el-collapse-item__wrap {
-    padding: 0 20px;
-  }
-
-  .el-collapse-item__content {
-    padding-bottom: 5px;
-
-    .el-form-item {
-      margin-bottom: 0;
-
-      .el-form-item__content {
-        text-align: left;
-      }
-    }
-  }
-}
-
-//开关
-.crm_switch .el-switch__label {
-  position: absolute;
-  display: none;
-  max-width: 25px;
-  overflow: hidden;
-  color: #FFFFFF !important;
-}
-
-.crm_switch.crm_switch_width .el-switch__label {
-  position: absolute;
-  display: none;
-  max-width: 50px;
-  overflow: hidden;
-  color: #FFFFFF !important;
-}
-
-/*打开时文字位置设置*/
-.crm_switch .el-switch__label--right {
-  z-index: 1;
-  left: -3px;
-}
-
-/*关闭时文字位置设置*/
-.crm_switch .el-switch__label--left {
-  z-index: 1;
-  right: 0;
-}
-
-/*显示文字*/
-.crm_switch .el-switch__label.is-active {
-  display: block;
-}
-
-.crm_switch.el-switch .el-switch__core {
-  width: 50px !important;
-  overflow: hidden;
-}
-
-.crm_switch.crm_switch_width.el-switch .el-switch__core {
-  width: 75px !important;
-  overflow: hidden;
-}
-
-.crm_switch.el-switch.is-checked .el-switch__core::after {
-  z-index: 2;
-}
-.el-table .state {
-  display: block;
-  min-width: 80px;
-  box-sizing: border-box;
-  line-height: 1.5;
-  border-radius: 2px;
-  padding: 2px 10px;
-  color: #ffffff;
-}
-
-//状态颜色
-.crm_state_blue {
-  text-align: center;
-  background-color: #368FEC;
-}
-
-.crm_state_green {
-  text-align: center;
-  background-color: #87D068;
-}
-
-.crm_state_gray {
-  text-align: center;
-  background-color: #A1A1A1;
-}
-
-.crm_state_red {
-  text-align: center;
-  background-color: #EB3F57;
-}
-
-.crm_state_yellow {
-  text-align: center;
-  background-color: rgb(231, 211, 31);
-}
-
-.crm_state_orange {
-  text-align: center;
-  background-color: #FF9800;
-}
-
-.crm_state_violet {
-  text-align: center;
-  background-color: #a492be;
-}
-
-//表格颜色
-.el-table th.is-leaf {
-  background-color: #F2F2F2;
-}
-
-//label样式
-#TradingDetailedInfo .el-form-item__label {
-  border-radius: 2px;
-  @include bg_gray_7();
-  font-weight: bold;
-  text-align: center !important;
-  min-height: 40px !important;
-  box-sizing: border-box;
-}
-
-#TradingDetailedInfo .el-form-item__content {
-  min-height: 40px !important;
-  line-height: 1.5;
-  box-sizing: border-box;
-  border: 1px solid;
-  display: flex;
-  align-content: center;
-  align-items: center;
-  justify-content: center;
-  @include border_gray_4();
-  @include bg_white();
-  text-align: center !important;
-
-  .el-input__inner, .el-input {
-    height: 34px;
-    border: none;
-    text-align: center;
-  }
-}
-
-#TradingDetailedInfo .el-form-item {
-  margin-bottom: 20px !important;
-}
-
-
-//input前置后置背景色
-.el-input-group__append, .el-input-group__prepend {
-  background-color: #F2F2F2 !important;
-}
-
-//富文本层级
-.tox-silver-sink {
-  z-index: 9999 !important;
-}
-
-//表格加载
-.el-loading-mask {
-  .el-icon-loading {
-    font-size: 28px;
-  }
-}
-
-//
-.el-popper.el-dropdown-menu {
-  width: max-content;
-}
-
-.el-popper.el-cascader__dropdown {
-  max-width: 1200px;
-  width: auto;
-
-  .el-cascader-panel {
-    width: 100%;
-    display: flex;
-    flex-wrap: wrap;
-  }
-
-  .el-cascader-menu, .el-cascader-menu__wrap {
-    width: 300px;
-    height: 300px;
-  }
-}
-
-//表头英文时按单词换行
-.el-table thead th > .cell {
-  word-break: break-word !important;
-}
-
-
-//新增弹出样式
-#TradingDetailedInfoAdd.InfoBox {
-  width: 450px;
-  height: 100%;
-  padding: 15px 0;
-  border-radius: 2px;
-  -webkit-box-sizing: border-box;
-  box-sizing: border-box;
-  box-shadow: 0px 3px 5px 0px rgba(49, 49, 49, 0.35);
-  position: fixed;
-  background-color: #FFFFFF;
-  z-index: 100;
-  overflow: hidden;
-  overflow-y: auto;
-  top: 0;
-  right: -455px;
-  -webkit-transition: all 0.6s;
-  -moz-transition: all 0.6s;
-  -o-transition: all 0.6s;
-  transition: all 0.6s;
-
-  .header {
-    text-align: left;
-    height: 25px;
-    line-height: 25px;
-    margin: 0 20px 10px;
-    font-size: 14px;
-    display: flex;
-    justify-content: space-between;
-
-    .title {
-      font-weight: bold;
-    }
-
-    i.el-icon-close {
-      text-align: right !important;
-      font-weight: bold;
-      margin-right: 7px;
-    }
-  }
-
-  .btn {
-    display: inline-block;
-    padding: 10px;
-    background-color: #368FEC;
-    color: #FFFFFF;
-    border-radius: 2px;
-    text-align: center;
-    min-width: 120px;
-    margin: 25px 0;
-  }
-
-  .deleteBtn {
-    display: inline-block;
-    min-width: 100px;
-    height: 30px;
-    line-height: 30px;
-    text-align: center;
-    background-color: #EB3F57;
-    color: #FFFFFF;
-  }
-
-  .avatar-uploader {
-    display: inline-block;
-
-    .updateBtn {
-      display: inline-block;
-      text-align: left;
-
-      i {
-        font-weight: bold;
-        font-size: 20px;
-        margin-right: 5px;
-      }
-    }
-  }
-
-  .channelBanks {
-    padding-top: 10px;
-    border-bottom: 1px solid #DCDFE6;
-  }
-
-  .channel {
-    text-align: left !important;
-
-    .btn {
-      display: inline;
-      padding: 10px;
-      background-color: #368FEC;
-      color: #FFFFFF;
-      border-radius: 2px;
-      text-align: center;
-      min-width: 120px;
-      margin: 25px 0;
-    }
-  }
-
-  .channel-tit {
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-    height: 40px;
-    background-color: #F2F2F2;
-    padding: 0 15px;
-    box-sizing: border-box;
-    margin-bottom: 10px;
-
-    .add {
-      border: 1px dashed #368FEC;
-      color: #368FEC;
-      line-height: 20px;
-      display: inline-block;
-      width: 20px;
-      height: 20px;
-      font-weight: bold;
-
-      i {
-        font-weight: bold;
-        font-size: 12px;
-        margin-left: 4px;
-      }
-    }
-  }
-
-  .custom-tree-node {
-    flex: 1;
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
-    font-size: 14px;
-    padding-right: 4px;
-
-    i {
-      margin-left: 4px;
-      /*font-weight: bold;*/
-    }
-  }
-
-  .dialog_header_w {
-    width: 850px !important;
-
-    .code {
-      padding: 6px 12px;
-      background-color: #368FEC;
-      color: #FFFFFF;
-      border-radius: 2px;
-      margin-left: 10px;
-    }
-
-    .chooseLang {
-      > span {
-        border: 1px solid #DCDFE6;
-        padding: 0 8px;
-        min-width: 100px;
-        display: inline-block;
-        height: 40px;
-        line-height: 40px;
-        box-sizing: border-box;
-        text-align: center;
-      }
-
-      span.active {
-        @include border_red_1();
-        @include font_main();
-      }
-    }
-  }
-
-  .el-form {
-    border-top: 1px solid #E4E4E4;
-    padding: 10px 0;
-    text-align: left;
-    position: relative;
-
-    .el-form-item {
-      margin-bottom: 20px;
-      padding: 0 20px;
-    }
-
-    .authorityBox.el-form-item .el-form-item__content {
-      display: contents;
-    }
-  }
-
-  .el-select {
-    width: 100%;
-  }
-
-  .el-date-editor.el-input {
-    width: 100%;
-  }
-
-  .el-upload {
-    width: 100%;
-  }
-
-  .channel {
-    .el-input__inner {
-      text-align: left;
-    }
-  }
-
-  .online-editing.el-form-item {
-    .el-form-item__content-item {
-      border: none !important;
-    }
-  }
-}
-
-#TradingDetailedInfoAdd.InfoBox.active {
-  right: 0;
-}
-
-// 统一 select 和 input 的宽度
-.el-select,
-.el-input,
-.el-date-editor.el-input,
-.el-date-editor.el-input__inner {
-  width: 100%;
-  //min-width: 192px;
-}
-
-.el-select .el-input {
-  width: 100%;
-}
-
-.el-input__inner {
-  width: 100%;
-}
-.el-input-number{
-  width: 100%;
-  .el-input__inner{
-    text-align: left!important;
-    &::placeholder {
-      text-align: left;
-    }
-  }
-}
-input[type="number"]::-webkit-outer-spin-button,
-input[type="number"]::-webkit-inner-spin-button {
-  -webkit-appearance: none;
-  margin: 0;
-}
-
-/* Firefox */
-input[type="number"] {
-  -moz-appearance: textfield;
-}
-.div-hidden{
-  display: none !important;
-}
-.el-input.el-input--default.el-input--suffix {
-  // 固定宽度
-
-  width: 192px !important;
-}

src/styles/element-dark.scss

@@ -1,168 +0,0 @@
-// 暗黑模式自定义样式
-html.dark {
-  /* 自定义深色背景颜色 */
-
-  //--el-bg-color: #141414;
-  //--el-bg-color-overlay: #1d1e1f;
-
-  --zb-border-light: 1px solid #4c4d4f;
-
-  body {
-    background: none;
-  }
-
-  // 编辑器
-  .w-e-toolbar,
-  .w-e-text-container,
-  .w-e-menu-panel {
-    background: none !important;
-  }
-  // 富文本
-  .md {
-    background: none !important;
-  }
-
-  #app {
-    .sidebar-container {
-      background: var(--el-bg-color) !important;
-      & .el-menu .el-sub-menu > .el-sub-menu__title,
-      & .el-sub-menu .el-menu-item {
-        background-color: var(--el-bg-color) !important;
-
-        &:hover {
-          background-color: var(--el-bg-color) !important;
-        }
-        &.is-active {
-          background-color: #060708 !important;
-        }
-      }
-      .el-sub-menu__title {
-        &:hover {
-          background-color: var(--el-bg-color) !important;
-        }
-      }
-    }
-  }
-
-  .sidebar-logo-container {
-    background: none;
-    box-sizing: border-box;
-    border: var(--zb-border-light);
-  }
-  .el-drawer__header {
-    span {
-      color: var(--el-text-color-primary) !important;
-    }
-  }
-  .theme-item {
-    color: var(--el-text-color-primary) !important;
-  }
-
-  .el-table__header th {
-    font-weight: bold;
-    color: white;
-  }
-  .footer-layout {
-    background: none;
-    color: white;
-  }
-
-  .zb-pro-table {
-    .header {
-      background: none !important;
-      border: var(--zb-border-light);
-    }
-    .footer {
-      background: none !important;
-      border: var(--zb-border-light);
-    }
-    .el-table__header th {
-      color: white !important;
-    }
-  }
-
-  // header
-  .m-layout-header {
-    color: var(--el-text-color-primary) !important;
-    .header-inner {
-      background-color: var(--el-bg-color) !important;
-      border-bottom: var(--zb-border-light);
-      .header-icon {
-        color: #bfcbd9 !important;
-      }
-    }
-    // tagviews
-    .m-tags-view {
-      background: var(--el-bg-color) !important;
-      border: var(--zb-border-light);
-      border-top: none;
-      border-left: none;
-      box-sizing: border-box;
-      .el-tabs--card > .el-tabs__header {
-        border-bottom: none !important;
-      }
-    }
-  }
-
-  // 内容区
-  .app-main {
-    .echarts-map {
-      background: var(--el-bg-color) !important;
-    }
-    .app-echarts {
-      background: none;
-    }
-
-    .app-container {
-      .header {
-        background: none;
-      }
-      .footer {
-        background: none;
-      }
-    }
-    .m-container-layout {
-      .m-container-layout-inner {
-        background: none;
-        color: var(--el-text-color-primary) !important;
-      }
-    }
-
-    .item-group-item {
-      background: none !important;
-      border: var(--zb-border-light);
-      color: #cccccc;
-    }
-
-    .app-container-inner {
-      background: none;
-    }
-  }
-
-  // 底部
-  .footer-layout {
-    border-top: var(--zb-border-light);
-  }
-
-  // 登录
-  .login-container {
-    background-color: #191919 !important;
-    .login-box {
-      background-color: #000000cc !important;
-      .login-form {
-        background-color: #141414 !important;
-        .title {
-          color: var(--el-text-color-primary) !important;
-        }
-      }
-    }
-    .info-qrcode {
-      background: white;
-    }
-  }
-
-  .el-scrollbar {
-    border: var(--zb-border-light);
-    border-top: none;
-  }
-}

src/styles/element.scss

@@ -1,9 +0,0 @@
-.el-table__header th {
-  font-weight: bold;
-  color: #252525;
-  background: #fafafa;
-}
-
-.el-table .el-table__header th {
-  background: var(--el-fill-color-light) !important;
-}

src/styles/index.scss

@@ -1,9 +1,3 @@
-@import './variables.scss';
 @import './color.scss';
 @import './mixin.scss';
-@import './sidebar.scss';
-@import './transition.scss';
-@import './common.scss';
-//@import './cwg_common.scss';
 @import './default.scss';
-@import './element.scss';

src/styles/sidebar.scss

@@ -1,226 +0,0 @@
-.layout-vertical {
-  .main-container {
-    min-height: 100%;
-    transition: margin-left 0.28s;
-    margin-left: $sideBarWidth;
-    position: relative;
-  }
-
-  .hideSliderLayout {
-    margin-left: 0;
-    .el-menu--horizontal {
-      border-bottom: none;
-    }
-  }
-  .sidebar-container {
-    transition: width 0.28s;
-    width: $sideBarWidth !important;
-    background-color: $menuBg;
-    height: 100%;
-    position: fixed;
-    font-size: 0px;
-    top: 0;
-    bottom: 0;
-    left: 0;
-    z-index: 98;
-    overflow: hidden;
-    // reset element-ui css
-    .horizontal-collapse-transition {
-      transition: 0s width ease-in-out, 0s padding-left ease-in-out, 0s padding-right ease-in-out;
-    }
-
-    .scrollbar-wrapper {
-      overflow-x: hidden !important;
-    }
-
-    .el-scrollbar__bar.is-vertical {
-      right: 0px;
-    }
-
-    .el-scrollbar {
-      height: 100%;
-    }
-
-    &.has-logo {
-      .el-scrollbar {
-        height: calc(100% - 50px);
-      }
-    }
-
-    .is-horizontal {
-      display: none;
-    }
-
-    a {
-      //display: inline-block;
-      width: 100%;
-      overflow: hidden;
-    }
-
-    .sub-el-icon {
-      margin-right: 12px;
-      margin-left: -2px;
-    }
-
-    .el-menu {
-      border: none;
-      height: 100%;
-      width: 100% !important;
-      background: none;
-    }
-
-    // menu hover
-    .sub-menu-title-noDropdown,
-    .el-sub-menu__title {
-      &:hover {
-        background-color: $menuHover !important;
-      }
-    }
-
-    .is-active > .el-sub-menu__title {
-      color: $subMenuActiveText !important;
-    }
-
-    & .nest-menu .el-sub-menu > .el-sub-menu__title,
-    & .el-sub-menu .el-menu-item {
-      min-width: $sideBarWidth !important;
-      background-color: $subMenuBg !important;
-
-      &:hover {
-        background-color: $subMenuHover !important;
-      }
-    }
-  }
-
-  .hideSidebar {
-    .sidebar-container {
-      width: 60px !important;
-    }
-
-    .main-container {
-      margin-left: 60px;
-    }
-
-    .sub-menu-title-noDropdown {
-      padding: 0 !important;
-      position: relative;
-
-      .el-tooltip {
-        padding: 0 !important;
-
-        .svg-icon {
-          margin-left: 20px;
-        }
-
-        .sub-el-icon {
-          margin-left: 19px;
-        }
-      }
-    }
-
-    .el-submenu {
-      overflow: hidden;
-
-      & > .el-submenu__title {
-        padding: 0 !important;
-
-        .svg-icon {
-          margin-left: 20px;
-        }
-
-        .sub-el-icon {
-          margin-left: 19px;
-        }
-
-        .el-sub-menu__icon-arrow {
-          display: none;
-        }
-      }
-    }
-
-    .el-menu--collapse {
-      .el-sub-menu {
-        & > .el-sub-menu__title {
-          & > span {
-            height: 0;
-            width: 0;
-            overflow: hidden;
-            visibility: hidden;
-            display: inline-block;
-          }
-        }
-      }
-    }
-  }
-
-  .el-menu--collapse .el-menu .el-sub-menu {
-    min-width: $sideBarWidth !important;
-  }
-
-  // mobile responsive
-  .mobile {
-    .main-container {
-      margin-left: 0px;
-    }
-
-    .sidebar-container {
-      transition: transform 0.28s;
-      width: $sideBarWidth !important;
-    }
-
-    &.hideSidebar {
-      .sidebar-container {
-        pointer-events: none;
-        transition-duration: 0.3s;
-        transform: translate3d(-$sideBarWidth, 0, 0);
-      }
-    }
-  }
-
-  .withoutAnimation {
-    .main-container,
-    .sidebar-container {
-      transition: none;
-    }
-  }
-
-  // when menu collapsed
-  .el-menu--vertical {
-    & > .el-menu {
-      .svg-icon {
-        margin-right: 16px;
-      }
-      .sub-el-icon {
-        margin-right: 12px;
-        margin-left: -2px;
-      }
-    }
-
-    .nest-menu .el-sub-menu > .el-sub-menu__title,
-    .el-menu-item {
-      &:hover {
-        // you can use $subMenuHover
-        background-color: $menuHover !important;
-      }
-    }
-
-    // the scroll bar appears when the subMenu is too long
-    > .el-menu--popup {
-      max-height: 100vh;
-      overflow-y: auto;
-
-      &::-webkit-scrollbar-track-piece {
-        background: #d3dce6;
-      }
-
-      &::-webkit-scrollbar {
-        width: 6px;
-      }
-
-      &::-webkit-scrollbar-thumb {
-        background: #99a9bf;
-        border-radius: 20px;
-      }
-    }
-  }
-}

src/styles/transition.scss

@@ -1,49 +0,0 @@
-// global transition css
-
-/* fade */
-.fade-enter-active,
-.fade-leave-active {
-  transition: opacity 0.28s;
-}
-
-.fade-enter,
-.fade-leave-active {
-  opacity: 0;
-}
-
-/* 路由 */
-.fade-slide-leave-active,
-.fade-slide-enter-active {
-  transition: all 0.3s;
-}
-
-.fade-slide-enter-from {
-  opacity: 0;
-  transform: translateX(-30px);
-}
-
-.fade-slide-leave-to {
-  opacity: 0;
-  transform: translateX(30px);
-}
-
-// logo动画
-.sidebarLogoFade-enter-active {
-  transition: opacity 1.5s;
-}
-.sidebarLogoFade-enter-from {
-  opacity: 0;
-}
-.sidebarLogoFade-leave-to {
-  opacity: 0;
-}
-
-// 面包屑动画 方案1
-.breadcrumb-enter-active {
-  transition: all 0.25s;
-}
-.breadcrumb-enter-from,
-.breadcrumb-leave-active {
-  opacity: 0;
-  transform: translateX(10px) skewX(-10deg);
-}

src/styles/variables.scss

@@ -1,25 +0,0 @@
-// base color
-$blue: #324157;
-$light-blue: #3a71a8;
-$red: #c03639;
-$pink: #e65d6e;
-$green: #30b08f;
-$tiffany: #4ab7bd;
-$yellow: #fec171;
-$panGreen: #30b08f;
-
-/* 全局 css 变量 */
-$primaryColor: #409eff;
-
-// sidebar
-$menuText: #bfcbd9;
-$menuActiveText: #409eff;
-$subMenuActiveText: #f4f4f5;
-
-$menuBg: #304156;
-$menuHover: #263445;
-
-$subMenuBg: #1f2d3d;
-$subMenuHover: #001528;
-
-$sideBarWidth: 210px;

src/views/home2/Home.vue → src/views/home/Home.vue

@@ -190,13 +190,13 @@
   import Config from '@/config/index'
   import { safeGetUser, safeGetDisplay } from '@/utils/safeJson'
   import { filterByShowTrue } from '@/utils/utils'
-  import pigeon from '@/lib/pigeon'
 
   const { Code } = Config
   const { t, locale } = useI18n()
   // 引入注入的全局
   const session = inject('session')
   const reload = inject('reload')
+  const pigeon = inject('pigeon')
 
   // Vue 相关
   const router = useRouter()

src/views/home/index.scss

@@ -1,78 +0,0 @@
-.personal {
-  .name {
-    margin-top: 15px;
-    font-size: 24px;
-    font-weight: 500;
-    color: rgb(38, 38, 38);
-  }
-  .description {
-    margin-top: 8px;
-  }
-  .list {
-    margin-top: 18px;
-    line-height: 30px;
-    text-align: left;
-  }
-}
-.card-header {
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-}
-
-.text {
-  font-size: 14px;
-}
-.grid-content {
-  display: flex;
-  .left {
-    width: 40%;
-    height: 100px;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    background: #2d8cf0;
-  }
-  .right {
-    display: flex;
-    flex-direction: column;
-    padding-left: 20px;
-    justify-content: center;
-    .h2 {
-      font-size: 24px;
-      margin-bottom: 10px;
-    }
-  }
-}
-.custom {
-  :deep(.el-card__body) {
-    padding: 0;
-  }
-}
-.item {
-  margin-bottom: 18px;
-}
-
-.box-card {
-  //height: 100%;
-  position: relative;
-  margin-bottom: 10px;
-  width: 100%;
-  .wechat {
-    position: absolute;
-    width: 150px;
-    right: 0;
-    top: 0;
-  }
-}
-.card-item {
-  background: linear-gradient(50deg, #1890ff, #77e19d);
-}
-.home-container {
-  width: 100%;
-  height: 100%;
-  display: flex;
-  padding: 16px;
-  box-sizing: border-box;
-  font-size: 14px;
-}

src/views/home/index.vue

@@ -1,20 +0,0 @@
-<template>
-  <div class="home-container">
-    <el-row class="row-bg" :gutter="10"> </el-row>
-  </div>
-</template>
-<script setup lang="ts">
-  import { User } from '@element-plus/icons-vue'
-  import { ref } from 'vue'
-  import AvatarLogo from '@/assets/image/avatar.png'
-  import weLogo from '@/assets/image/we.png'
-  import CountTo from '@/components/CountTo/index.vue'
-
-  const goTo = (url) => {
-    window.open(url, '_blank')
-  }
-</script>
-
-<style scoped lang="scss">
-  @import './index';
-</style>

src/views/system/Refusal/components/Add.vue

@@ -1,15 +1,11 @@
 <template>
-  <div id="TradingDetailedInfoAdd" class="InfoBox" :class="{ active: dialogInfoTradingAdd }">
-    <div class="header">
-      <div>
-        <span v-if="editor" class="title">{{ $t('Label.RefusalEditor') }}</span>
-        <span v-else class="title">{{ $t('Label.AddRefusal') }}</span>
-      </div>
-      <span class="close crm-cursor" @click="close">
-        <el-icon><Close /></el-icon>
-      </span>
-    </div>
-    <el-form ref="formRef" :rules="rules" :model="form" label-width="150PX">
+  <el-drawer
+    v-model="visible"
+    :title="editor ? t('Label.RefusalEditor') : t('Label.AddRefusal')"
+    size="400"
+    @close="close"
+  >
+    <el-form ref="formRef" :rules="rules" :model="form" label-width="80px">
       <el-form-item prop="content" :label="$t('Label.CN') + '：'">
         <el-input v-model="form.content" :placeholder="$t('Placeholder.Input')"></el-input>
       </el-form-item>
@@ -20,10 +16,10 @@
         <el-input v-model.trim="form.subIndex" :placeholder="$t('Placeholder.Input')"></el-input>
       </el-form-item>
     </el-form>
-    <span class="btn crm-cursor" @click="confirm"
-      ><span>{{ $t('Btn.Confirm') }}</span></span
-    >
-  </div>
+    <template #footer>
+      <el-button type="primary" @click="confirm">{{ $t('Btn.Confirm') }}</el-button>
+    </template>
+  </el-drawer>
 </template>
 
 <script setup lang="ts">
@@ -32,7 +28,6 @@
   import { FormInstance, FormRules } from 'element-plus'
   import ServiceSystem from '@/service/system'
   import Config from '@/config/index'
-  import { Close } from '@element-plus/icons-vue'
 
   const { Code } = Config
   const { t } = useI18n()
@@ -52,6 +47,7 @@
     myInfo: null,
     formList: null,
   })
+  const visible = ref(props.dialogInfoTradingAdd)
 
   const emit = defineEmits<{
     (e: 'update:dialogInfoTradingAdd', value: boolean): void
@@ -186,9 +182,10 @@
   watch(
     () => props.dialogInfoTradingAdd,
     (newVal) => {
+      visible.value = newVal
       if (!newVal && formRef.value) {
         formRef.value?.resetFields()
-        Object.assign(form, {})
+        Object.keys(form).forEach((key) => (form[key] = ''))
       }
       if (newVal) {
         refusalType.value = props.myInfo.type

src/views/system/Refusal/index.vue

@@ -44,22 +44,22 @@
       </el-form>
     </div>
     <el-table :data="mock_tableData" stripe style="width: 100%">
-      <el-table-column prop="" align="left" :label="t('Label.SubIndex')">
+      <el-table-column prop="subIndex" align="left" :label="t('Label.SubIndex')">
         <template #default="{ row }">
           {{ row.subIndex || '--' }}
         </template>
       </el-table-column>
-      <el-table-column prop="" align="left" :label="t('Label.CN')">
+      <el-table-column prop="content" align="left" :label="t('Label.CN')">
         <template #default="{ row }">
           {{ row.content || '--' }}
         </template>
       </el-table-column>
-      <el-table-column prop="" align="left" :label="t('Label.EN')">
+      <el-table-column prop="enContent" align="left" :label="t('Label.EN')">
         <template #default="{ row }">
           {{ row.enContent || '--' }}
         </template>
       </el-table-column>
-      <el-table-column prop="" align="center" :label="t('Label.Action')">
+      <el-table-column prop="ctrl" align="center" :label="t('Label.Action')">
         <template #default="{ row }">
           <el-dropdown trigger="click" @command="handleCommand">
             <span class="el-dropdown-link crm-cursor">
@@ -114,9 +114,8 @@
       :my-info="myInfo"
       :form-list="formList"
       @confirm-to-reload="confirmToReload"
-      @close-add="closeAdd"
+      @close="closeAdd"
     ></Add>
-    <div v-if="dialogInfoTradingAdd" class="crm_verified_info_mask" @click="closeDiaAdd"></div>
   </div>
 </template>