update

src/assets/styles/index.css

@@ -33,6 +33,9 @@
   text-overflow: ellipsis;
   overflow: hidden;
 }
+.ant-input::placeholder {
+  color: #394753;
+}
 .commonInput {
   background: #15202B;
   border: 1px solid #2B3F52;
@@ -43,12 +46,13 @@
   color: #E5E5E5;
   background: transparent;
 }
-.commonInput .ant-input::placeholder {
-  color: #394753;
-}
 .commonInput .ant-input-suffix {
   color: #E5E5E5;
 }
+.commonInput:hover,
+.commonInput:focus {
+  border-color: #0C95FF;
+}
 .tableConditionInput {
   width: 140px;
   height: 30px;
@@ -62,9 +66,6 @@
   color: #E5E5E5;
   font-size: 14px;
 }
-.tableConditionInput::placeholder {
-  color: #394753;
-}
 .tableConditionInput + .tableConditionInput {
   margin-left: 10px;
 }
@@ -99,12 +100,68 @@
   padding-bottom: 0;
   color: #556772;
   font-size: 14px;
-  border-color: #161A1C;
+  border-right: 1px solid #161A1C;
+  border-bottom: 1px solid #161A1C;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  overflow: hidden;
+}
+.topTable .ant-table .ant-table-tbody tr td {
+  height: 34px;
+  line-height: 34px;
+  padding: 0 8px;
+  border-right: 1px solid #161A1C;
+  border-bottom: 1px solid #161A1C;
+  font-size: 16px;
+  color: #E5E5E5;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  overflow: hidden;
 }
 .topTable .ant-table .ant-table-placeholder {
   border: 0;
   background: #0E0E0F;
 }
+.dialogTable .ant-table {
+  width: 100%;
+}
+.dialogTable .ant-table table {
+  border: 1px solid #1B2A38;
+  border-radius: 0;
+}
+.dialogTable .ant-table .ant-table-thead tr {
+  box-shadow: 0px 1px 0px 0px #2E3539;
+}
+.dialogTable .ant-table .ant-table-thead tr th {
+  line-height: 36px;
+  background: #0F1A25;
+  padding-top: 0;
+  padding-bottom: 0;
+  color: #88a0ae;
+  font-size: 16px;
+  border-right: 1px solid #1B2A38;
+  border-bottom: 1px solid #1B2A38;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  overflow: hidden;
+}
+.dialogTable .ant-table .ant-table-tbody tr td {
+  height: 36px;
+  line-height: 36px;
+  padding: 0 8px;
+  border-right: 1px solid #1B2A38;
+  border-bottom: 1px solid #1B2A38;
+  font-size: 14px;
+  color: #E5E5E5;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  overflow: hidden;
+  background: #0F1A25;
+}
+.dialogTable .ant-table .ant-table-placeholder {
+  border: 0;
+  background: #0F1A25;
+}
 .ant-empty-normal {
   color: #556772;
 }
@@ -115,19 +172,23 @@
 .ant-empty-img-simple-g {
   stroke: #556772;
 }
-.add-custom .ant-modal-content {
+.add-custom .ant-modal-content,
+.commonModal .ant-modal-content {
   background: #0F1A25;
   border-radius: 5px;
 }
-.add-custom .ant-modal-content .ant-modal-close .ant-modal-close-x {
+.add-custom .ant-modal-content .ant-modal-close .ant-modal-close-x,
+.commonModal .ant-modal-content .ant-modal-close .ant-modal-close-x {
   width: 40px;
   height: 40px;
   line-height: 40px;
 }
-.add-custom .ant-modal-content .ant-modal-close .ant-modal-close-x .ant-modal-close-icon {
+.add-custom .ant-modal-content .ant-modal-close .ant-modal-close-x .ant-modal-close-icon,
+.commonModal .ant-modal-content .ant-modal-close .ant-modal-close-x .ant-modal-close-icon {
   color: #1271BA;
 }
-.add-custom .ant-modal-content .ant-modal-header {
+.add-custom .ant-modal-content .ant-modal-header,
+.commonModal .ant-modal-content .ant-modal-header {
   height: 40px;
   background: linear-gradient(0deg, #112C43, #084258);
   border-radius: 5px;
@@ -135,17 +196,24 @@
   text-align: center;
   border-bottom: 0;
 }
-.add-custom .ant-modal-content .ant-modal-header .ant-modal-title {
+.add-custom .ant-modal-content .ant-modal-header .ant-modal-title,
+.commonModal .ant-modal-content .ant-modal-header .ant-modal-title {
   line-height: 40px;
   font-size: 16px;
   color: #ffffff;
 }
-.add-custom .ant-modal-content .ant-modal-footer {
+.add-custom .ant-modal-content .ant-modal-body,
+.commonModal .ant-modal-content .ant-modal-body {
+  min-height: 380px;
+}
+.add-custom .ant-modal-content .ant-modal-footer,
+.commonModal .ant-modal-content .ant-modal-footer {
   border-top: 0;
   text-align: center;
   padding-bottom: 31px;
 }
-.add-custom .ant-modal-content .ant-modal-footer .ant-btn-primary {
+.add-custom .ant-modal-content .ant-modal-footer .ant-btn-primary,
+.commonModal .ant-modal-content .ant-modal-footer .ant-btn-primary {
   width: 200px;
   height: 34px;
   line-height: 34px;
@@ -155,15 +223,32 @@
   font-size: 16px;
   color: #ffffff;
 }
-.add-custom .ant-modal-content .ant-modal-footer .ant-btn-primary:hover {
+.add-custom .ant-modal-content .ant-modal-footer .ant-btn-primary:hover,
+.commonModal .ant-modal-content .ant-modal-footer .ant-btn-primary:hover {
   background: linear-gradient(0deg, rgba(49, 99, 186, 0.8) 0%, rgba(65, 121, 219, 0.8) 100%);
   color: rgba(255, 255, 255, 0.8);
 }
+.add-custom .ant-modal-content .ant-modal-footer .ant-btn.cancelBtn,
+.commonModal .ant-modal-content .ant-modal-footer .ant-btn.cancelBtn {
+  width: 200px;
+  height: 34px;
+  line-height: 34px;
+  border: 1px solid #0C95FF;
+  border-radius: 3px;
+  background: transparent;
+  font-size: 16px;
+  color: #0C95FF;
+  margin-right: 20px;
+}
+.add-custom .ant-modal-content .ant-modal-footer .ant-btn.cancelBtn:hover,
+.commonModal .ant-modal-content .ant-modal-footer .ant-btn.cancelBtn:hover {
+  border-color: rgba(12, 149, 255, 0.8);
+}
 .ant-form.inlineForm .ant-row.ant-form-item {
   margin-bottom: 21px;
 }
 .ant-form.inlineForm .ant-row.ant-form-item .ant-form-item-label {
-  width: 80px;
+  width: 130px;
   line-height: 30px;
   text-align: left;
 }
@@ -200,18 +285,22 @@
   color: #3A87F7;
 }
 .inlineFormSelect.ant-select-single,
-.typeSelect.ant-select-single {
+.shortSelect.ant-select-single {
   /*圆角兼容性*/
   -moz-border-radius: 3px 3px 3px 3px;
   -webkit-border-radius: 3px 3px 3px 3px;
   border-radius: 3px 3px 3px 3px;
+  border: 1px solid #2B3F52;
+}
+.inlineFormSelect.ant-select-single:hover,
+.inlineFormSelect.ant-select-single:focus {
+  border-color: #0C95FF;
 }
 .inlineFormSelect.ant-select-single .ant-select-selector {
   height: 30px;
   padding: 0 8px;
   background: #15202B;
-  border: 1px solid #0C95FF;
-  border-radius: 3px;
+  border: 0;
   color: #E5E5E5;
 }
 .inlineFormSelect.ant-select-single .ant-select-selector .ant-select-selection-placeholder {
@@ -219,24 +308,68 @@
 }
 .inlineFormSelect.ant-select-single .ant-select-arrow {
   right: 8px;
-  color: #3A87F7;
+  color: #3A87F7 !important;
+}
+.shortSelect.ant-select-single {
+  margin-right: 0;
+}
+.shortSelect.ant-select-single .ant-select-selector {
+  padding: 0 5px;
+}
+.shortSelect.ant-select-single .ant-select-selector .ant-select-selection-item {
+  padding-right: 14px;
 }
 .typeSelect.ant-select-single {
-  border: 1px solid #0C95FF;
+  /*圆角兼容性*/
+  -moz-border-radius: 3px 3px 3px 3px;
+  -webkit-border-radius: 3px 3px 3px 3px;
+  border-radius: 3px 3px 3px 3px;
+  border: 1px solid #2B3F52;
 }
-.commonInput {
+.typeSelect.ant-select-single:hover,
+.typeSelect.ant-select-single:focus {
+  border-color: #0C95FF;
+}
+.typeSelect.ant-select-single .ant-select-selector {
+  height: 30px;
+  padding: 0 8px;
+  background: #15202B;
+  border: 0;
+  color: #E5E5E5;
+}
+.typeSelect.ant-select-single .ant-select-selector .ant-select-selection-placeholder {
+  color: #394753;
+}
+.typeSelect.ant-select-single .ant-select-arrow {
+  right: 8px;
+  color: #3a87f7;
+}
+.dialogInput {
   background: #15202B;
   border: 1px solid #2B3F52;
   border-radius: 3px;
   color: #E5E5E5;
 }
-.commonInput .ant-input {
+.dialogInput .ant-input {
   color: #E5E5E5;
   background: transparent;
 }
-.commonInput .ant-input-suffix {
+.dialogInput .ant-input-suffix {
   color: #E5E5E5;
 }
+.dialogInput:hover,
+.dialogInput:focus {
+  border-color: #0C95FF;
+}
+.white {
+  color: #ffffff;
+}
+.blue {
+  color: #3a87f7;
+}
+.green {
+  color: #1FF195;
+}
 /*滚动条样式*/
 ::-webkit-scrollbar {
   width: 10px;
@@ -491,3 +624,6 @@ body {
   border-top-color: #0e0e0f !important;
   border-left-color: #161a1c !important;
 }
+.table-height {
+  height: calc(100% - 40px);
+}

src/assets/styles/index.less

@@ -288,3 +288,7 @@ body {
         border-left-color: #161a1c !important;
     }
 }
+
+.table-height {
+    height: calc(100% - 40px);
+}

src/views/business/exposure/list/realTime/index.vue

@@ -1,17 +1,21 @@
 <template>
   <!-- 实时敞口-->
-  <div class="purchase-real-time">
+  <div class="purchase-real-time table-height">
     <filterCustomTable @search="search">
       <BtnList :btnList="commonBtn" />
     </filterCustomTable>
-    <contextMenu :contextMenuList="forDataBtn"
-                 :tableList="tableList">
+    <contextMenu :contextMenuList="forDataBtn">
       <a-table :columns="columns"
                class="topTable"
+               :expandedRowKeys="expandedRowKeys"
                :customRow="Rowclick"
                :pagination="false"
                rowKey="key"
                :data-source="tableList">
+        <!-- 额外的展开行 -->
+        <!-- <template #expandedRowRender="{  }">
+          <BtnList :btnList="forDataBtn" />
+        </template> -->
         <!-- <template #warehousetype="{ text }">
           <span>{{ getWareHouseType(text) }}</span>
         </template>
@@ -33,6 +37,8 @@ import { getColumsAndSearch } from '../setup';
 import { QueryActualExposure } from '@/services/go/ermcp/exposure/index';
 import { ErmcpRealExposureModel } from '@/services/go/ermcp/exposure/interface';
 import { message } from 'ant-design-vue';
+import { handleTableEvent } from '@/common/setup/event/index';
+import BtnList from '@/common/components/buttonList/index.vue';
 
 // 获取表格数据
 function getExposure() {
@@ -56,14 +62,6 @@ function getExposure() {
     return { loading, tableList, queryList };
 }
 
-function Rowclick(record: any, index: number) {
-    return {
-        click: () => {
-            console.log('click');
-        },
-    };
-}
-
 export default defineComponent({
     name: 'purchase-real-time',
     components: {
@@ -75,15 +73,11 @@ export default defineComponent({
         const { loading, tableList, queryList } = getExposure();
         const { commonBtn, forDataBtn } = getBtnList('exposure_realtime', false);
 
-        function tableClick(e: Event) {
-            console.log(e);
-        }
-
         initData(() => {
             queryList();
             getColumns();
         });
-        return { commonBtn, forDataBtn, loading, tableList, columns, search, Rowclick };
+        return { commonBtn, forDataBtn, loading, tableList, columns, search, ...handleTableEvent() };
     },
 });
 </script>

src/views/information/goods/components/rightSpot/setup.ts

@@ -1,6 +1,6 @@
 import { QueryDeliveryGoods } from '@/services/go/ermcp/goodsInfo';
 import { ErmcpDeliveryGoodsReq, ErmcpDeliveryGoodsRsp } from '@/services/go/ermcp/goodsInfo/interface';
-import { reactive, ref } from '@vue/reactivity';
+import { ref } from '@vue/reactivity';
 
 export function queryDeliveryGoods(req: ErmcpDeliveryGoodsReq) {
     let goodsList = ref<ErmcpDeliveryGoodsRsp[] | []>([]);