update

src/common/components/btnList/interface.ts

@@ -1,7 +1,7 @@
 export type BtnClassName = 'btnDeafault' | 'btnPrimary' | 'btnDanger' | 'operBtn'
 export interface BtnListType {
-    lable: string;  // 按钮名字
+    lable?: string;  // 按钮名字
     code: string;   //
     callback?: Function;
-    className: BtnClassName    // 按钮 class 名字
+    className?: BtnClassName    // 按钮 class 名字
 }

src/common/setup/asyncComponent/index.ts

@@ -19,7 +19,7 @@ export function handleModalComponent<T>(callback: Function, selectedRow: Ref<T>)
      * @param item
      * @param record
      */
-    function openComponent(item: BtnListType, record: T) {
+    function openComponent(item: BtnListType, record?: T) {
         console.log('打开组件: ', item.code)
         // 更新点击的数据，处理例如，修改之后，再次打开页面是之前的数据的问题
         if (record && selectedRow) {

src/views/market/spot_trade/components/buy-sell-market/index.vue

@@ -2,7 +2,7 @@
   <!-- 买卖大厅 -->
   <div class="buy-sell-market">
     <div class="buy-sell-market-title">
-      <a class="backIcon" @click="cancel">
+      <a class="backIcon" @click="() => cancel()">
         <LeftOutlined />
       </a>
       <div class="titleBtn">
@@ -19,10 +19,11 @@
         <div class="name">{{ selectedRow.warehousename }}</div>
         <div class="arrowRightIcon"></div>
       </div>
-      <div class="titleBtn titleBtn3" v-if="!isWR(enumName)">
+      <div class="titleBtn titleBtn3" v-if="!isWR()">
         <div class="arrowLeftIcon"></div>
         <div class="name">
-          <a-month-picker :allowClear="false" v-model:value="time" @change="timeChange" class="commonDatePicker conditionPicker" />
+          <a-month-picker :allowClear="false" v-model:value="time" @change="timeChange"
+            class="commonDatePicker conditionPicker" />
         </div>
         <DownOutlined />
       </div>
@@ -71,13 +72,16 @@
     </div>
     <a-row class="buySellHall">
       <a-col :span="12" v-if="sellMarket.isMarket">
-        <Sell :enumName="enumName" ref="sellRef" :parantSelectedRow="selectedRow" :time="time" :btnList="handleBtnList(sellMarket.btnList)" />
+        <Sell :enumName="enumName" ref="sellRef" :parantSelectedRow="selectedRow" :time="time"
+          :btnList="handleBtnList(sellMarket.btnList)" />
       </a-col>
       <a-col :span="12" v-if="buyMarket.isMarket">
-        <Buy :enumName="enumName" ref="buyRef" :time="time" :parantSelectedRow="selectedRow" :btnList="handleBtnList(buyMarket.btnList)" />
+        <Buy :enumName="enumName" ref="buyRef" :time="time" :parantSelectedRow="selectedRow"
+          :btnList="handleBtnList(buyMarket.btnList)" />
       </a-col>
     </a-row>
-    <component :is="componentId" v-if="componentId" :selectedRow="getSelectedRow()" :enumName="enumName" :time="time" @cancel="closeComponent"> </component>
+    <component :is="componentId" v-if="componentId" :selectedRow="getSelectedRow()" :enumName="enumName" :time="time"
+      @cancel="closeComponent"> </component>
   </div>
 </template>
 
@@ -250,13 +254,14 @@ export default defineComponent({
 </script>
 <style lang="less" scoped>
 .priceBar {
-    .flex;
-    flex-direction: column;
-    height: 32px;
-    .greenBar,
-    .redBar {
-        height: 16px;
-        line-height: 16px;
-    }
+  .flex;
+  flex-direction: column;
+  height: 32px;
+
+  .greenBar,
+  .redBar {
+    height: 16px;
+    line-height: 16px;
+  }
 }
 </style>

src/views/market/spot_trade/components/post_buying/index.vue

@@ -17,14 +17,18 @@
           <a-row :gutter="24">
             <a-col :span="24">
               <a-form-item label="交易账户" name="accountid">
-                <a-select class="inlineFormSelect" style="width: 260px" v-model:value="formState.accountid" placeholder="请选择">
-                  <a-select-option v-for="item in accountList" :value="item.accountid" :key="item.accountid">{{ item.accountid }}</a-select-option>
+                <a-select class="inlineFormSelect" style="width: 260px" v-model:value="formState.accountid"
+                  placeholder="请选择">
+                  <a-select-option v-for="item in accountList" :value="item.accountid" :key="item.accountid">{{
+                      item.accountid
+                  }}</a-select-option>
                 </a-select>
               </a-form-item>
             </a-col>
             <a-col :span="24" v-if="!isFloat()">
               <a-form-item label="挂牌价格" name="FixedPrice">
-                <a-input-number class="commonInput" style="width: 260px" :min="0" v-model:value="formState.FixedPrice" />
+                <a-input-number class="commonInput" style="width: 260px" :min="0"
+                  v-model:value="formState.FixedPrice" />
               </a-form-item>
             </a-col>
             <a-col :span="24" v-else>
@@ -40,37 +44,44 @@
 
             <a-col :span="24">
               <a-form-item label="挂牌数量" name="OrderQty">
-                <a-input-number class="commonInput" style="width: 260px" :min="0" :max="listingType === 'buy' ? getMaxNum() : wrPosition.creditenableqty" v-model:value="formState.OrderQty" />
+                <a-input-number class="commonInput" style="width: 260px" :min="0"
+                  :max="listingType === 'buy' ? getMaxNum() : wrPosition?.creditenableqty"
+                  v-model:value="formState.OrderQty" />
                 <span class="input-enumdicname">{{ selectedRow.enumdicname }}</span>
               </a-form-item>
             </a-col>
             <a-col :span="24" v-if="!isWR()">
               <a-form-item label="交收月" name="DeliveryMonth">
-                <a-month-picker style="width: 260px" v-model:value="formState.DeliveryMonth" :allowClear="false" class="commonDatePicker dialogDatePicker" />
+                <a-month-picker style="width: 260px" v-model:value="formState.DeliveryMonth" :allowClear="false"
+                  class="commonDatePicker dialogDatePicker" />
               </a-form-item>
             </a-col>
             <a-col :span="24" class="mt-10">
               <a-form-item>
-                <a-slider :min="0" v-model:value="formState.OrderQty" :max="listingType === 'buy' ? getMaxNum() : wrPosition.creditenableqty" class="formSlider" />
+                <a-slider :min="0" v-model:value="formState.OrderQty"
+                  :max="listingType === 'buy' ? getMaxNum() : wrPosition?.creditenableqty" class="formSlider" />
                 <div class="unit" v-if="listingType === 'buy'">
                   <span>{{ getMaxNum() ? selectedRow.minivalue : 0 }}</span>
                   <span>{{ getMaxNum() }}{{ selectedRow.enumdicname }}</span>
                 </div>
                 <div class="unit" v-else>
-                  <span>{{ wrPosition.creditenableqty ? selectedRow.minivalue : 0 }}</span>
-                  <span>{{ wrPosition.creditenableqty }}{{ selectedRow.enumdicname }}</span>
+                  <span>{{ wrPosition?.creditenableqty ? selectedRow.minivalue : 0 }}</span>
+                  <span>{{ wrPosition?.creditenableqty }}{{ selectedRow.enumdicname }}</span>
                 </div>
               </a-form-item>
             </a-col>
             <a-col :span="24">
               <a-form-item label="起摘数量" name="DelistMinQty" class="relative">
-                <a-input-number class="commonInput" :suffix="selectedRow.enumdicname" v-model:value="formState.DelistMinQty" :min="0" style="width: 260px !important" />
+                <a-input-number class="commonInput" :suffix="selectedRow.enumdicname"
+                  v-model:value="formState.DelistMinQty" :min="0" style="width: 260px !important" />
                 <div class="tip-listing"> 最小单位：{{ selectedRow.minivalue }}{{ selectedRow.enumdicname }}</div>
               </a-form-item>
             </a-col>
             <a-col :span="24">
               <a-form-item label="履约方式" class="inputIconBox">
-                <span :class="['clickBox', formState.permanceTempName ? 'white' : '']" style="width: 260px" @click="handlePermance">{{ formState.permanceTempName ? formState.permanceTempName : '选择履约模板' }}</span>
+                <span :class="['clickBox', formState.permanceTempName ? 'white' : '']" style="width: 260px"
+                  @click="handlePermance">{{ formState.permanceTempName ? formState.permanceTempName : '选择履约模板'
+                  }}</span>
                 <svg class="icon svg-icon" aria-hidden="true" @click="handlePermance">
                   <use xlink:href="#icon-moban" />
                 </svg>
@@ -108,7 +119,8 @@
         <a-row :gutter="24">
           <a-col :span="24" class="fixedBtns">
             <a-form-item class="btnCenter">
-              <a-button class="listedBtn" @click="submit" :loading="loading">{{ listingType === 'buy' ? '买入' : '卖出' }}</a-button>
+              <a-button class="listedBtn" @click="submit" :loading="loading">{{ listingType === 'buy' ? '买入' : '卖出' }}
+              </a-button>
               <a-button class="ml10 cancelBtn" @click="cancel(false)" :disabled="loading">取消</a-button>
             </a-form-item>
           </a-col>
@@ -358,141 +370,164 @@ export default defineComponent({
 
 <style lang="less" scoped>
 .post_buying {
-    width: 100%;
+  width: 100%;
+  height: 100%;
+  .flex;
+  flex-direction: column;
+  position: relative;
+  overflow: hidden;
+
+  .ant-form {
     height: 100%;
-    .flex;
-    flex-direction: column;
-    position: relative;
-    overflow: hidden;
-    .ant-form {
-        height: 100%;
+  }
+
+  .condition {
+    width: 100%;
+    height: 48px;
+    margin: 0 16px;
+    padding: 10px 0;
+    border-bottom: 1px solid @m-black6;
+    .inlineflex;
+
+    .conditionBtn {
+      align-self: center;
+      align-items: center;
+      border: 0;
+      min-width: 80px;
+      height: 28px;
+      line-height: 28px;
+      background: @m-black7;
+      .rounded-corners(3px);
+      font-size: 14px;
+      color: @m-blue0;
+
+      &:hover {
+        background: @m-black7-hover;
+        color: @m-blue0-hover;
+      }
     }
-    .condition {
-        width: 100%;
-        height: 48px;
-        margin: 0 16px;
-        padding: 10px 0;
-        border-bottom: 1px solid @m-black6;
-        .inlineflex;
-        .conditionBtn {
-            align-self: center;
-            align-items: center;
-            border: 0;
-            min-width: 80px;
-            height: 28px;
-            line-height: 28px;
-            background: @m-black7;
-            .rounded-corners(3px);
-            font-size: 14px;
-            color: @m-blue0;
-            &:hover {
-                background: @m-black7-hover;
-                color: @m-blue0-hover;
-            }
-        }
-        .conditionBtn + .conditionBtn {
-            margin-left: 10px;
-        }
+
+    .conditionBtn+.conditionBtn {
+      margin-left: 10px;
     }
+  }
 }
 
 .unit {
-    margin-left: 70px;
-    width: 260px;
-    .flex;
-    justify-content: space-between;
-    font-size: 14px;
-    color: @m-grey41;
-    height: 14px;
-    line-height: 14px;
+  margin-left: 70px;
+  width: 260px;
+  .flex;
+  justify-content: space-between;
+  font-size: 14px;
+  color: @m-grey41;
+  height: 14px;
+  line-height: 14px;
 }
+
 .listedBtn {
-    width: 120px;
-    height: 30px;
-    line-height: 30px;
-    background: linear-gradient(0deg, @m-blue2 0%, @m-blue0 100%);
-    border-radius: 3px;
-    color: @m-white0;
-    font-size: 14px;
-    text-align: center;
-    border: 0;
-    &:hover,
-    &:active,
-    &:focus {
-        background: linear-gradient(0deg, @m-blue0-hover 0%, @m-blue2-hover 100%);
-        color: @m-white0-hover;
-    }
+  width: 120px;
+  height: 30px;
+  line-height: 30px;
+  background: linear-gradient(0deg, @m-blue2 0%, @m-blue0 100%);
+  border-radius: 3px;
+  color: @m-white0;
+  font-size: 14px;
+  text-align: center;
+  border: 0;
+
+  &:hover,
+  &:active,
+  &:focus {
+    background: linear-gradient(0deg, @m-blue0-hover 0%, @m-blue2-hover 100%);
+    color: @m-white0-hover;
+  }
 }
+
 .cancelBtn:extend(.listedBtn) {
-    background: linear-gradient(0deg, @m-grey12 0%, @m-grey13 100%) !important;
-    &:hover {
-        background: linear-gradient(0deg, @m-grey12-hover 0%, @m-grey13-hover 100%) !important;
-        color: @m-white0-hover;
-    }
+  background: linear-gradient(0deg, @m-grey12 0%, @m-grey13 100%) !important;
+
+  &:hover {
+    background: linear-gradient(0deg, @m-grey12-hover 0%, @m-grey13-hover 100%) !important;
+    color: @m-white0-hover;
+  }
 }
+
 .ml10 {
-    margin-left: 10px;
+  margin-left: 10px;
 }
+
 .ant-form.dialogForm .ant-row.ant-form-item {
-    margin-bottom: 14px;
+  margin-bottom: 14px;
 }
+
 .mt20 {
-    margin-top: 20px;
+  margin-top: 20px;
 }
+
 .mt-10 {
-    margin-top: -10px;
+  margin-top: -10px;
 }
+
 .ant-input-suffix {
-    position: absolute;
-    right: -25px;
+  position: absolute;
+  right: -25px;
 }
+
 .minusBtn,
 .plusBtn {
-    width: 15px;
-    height: 32px;
-    line-height: 32px;
-    font-size: 15px;
-    color: @m-blue15;
-    cursor: pointer;
+  width: 15px;
+  height: 32px;
+  line-height: 32px;
+  font-size: 15px;
+  color: @m-blue15;
+  cursor: pointer;
 }
+
 .minusBtn {
-    position: absolute;
-    top: -6px;
-    left: 14px;
-    z-index: 1;
+  position: absolute;
+  top: -6px;
+  left: 14px;
+  z-index: 1;
 }
+
 .plusBtn {
-    position: absolute;
-    top: -6px;
-    right: 14px;
-    z-index: 1;
+  position: absolute;
+  top: -6px;
+  right: 14px;
+  z-index: 1;
 }
+
 .stepper {
-    padding-left: 30px;
-    padding-right: 30px;
-    text-align: center;
-    color: @m-yellow1;
-    font-size: 16px;
+  padding-left: 30px;
+  padding-right: 30px;
+  text-align: center;
+  color: @m-yellow1;
+  font-size: 16px;
 }
+
 .ant-slider.formSlider {
-    width: 260px !important;
-    margin-left: 70px;
-    .ant-slider-rail {
-        margin-right: 0;
-        padding-right: 0;
-        height: 3px !important;
-        border-radius: 2px !important;
-        background-color: @m-blue14;
-    }
-    .ant-slider-track {
-        height: 3px;
-        background-color: @m-blue0;
-    }
-    .ant-slider-step {
-        height: 3px;
-    }
-    .ant-progress-text {
-        display: none;
-    }
+  width: 260px !important;
+  margin-left: 70px;
+
+  .ant-slider-rail {
+    margin-right: 0;
+    padding-right: 0;
+    height: 3px !important;
+    border-radius: 2px !important;
+    background-color: @m-blue14;
+  }
+
+  .ant-slider-track {
+    height: 3px;
+    background-color: @m-blue0;
+  }
+
+  .ant-slider-step {
+    height: 3px;
+  }
+
+  .ant-progress-text {
+    display: none;
+  }
 }
 </style>