update

src/views/market/spot_trade/components/goods-chart/index.vue

@@ -1,89 +1,66 @@
 <template>
-    <!-- 买卖大厅 -->
-    <div class="buy-sell-market">
-        <div class="buy-sell-market-title">
-            <a class="backIcon" @click="cancelAction">
-                <LeftOutlined />
-            </a>
-            <div class="titleBtn">
-                <div class="name">{{ selectedRow.goodscode }} {{ selectedRow.goodsname }}</div>
-                <div class="arrowRightIcon"></div>
+  <!-- 买卖大厅 -->
+  <div class="buy-sell-market">
+    <div class="buy-sell-market-title">
+      <a class="backIcon" @click="cancelAction">
+        <LeftOutlined />
+      </a>
+      <div class="titleBtn">
+        <div class="name">{{ selectedRow.goodscode }} {{ selectedRow.goodsname }}</div>
+        <div class="arrowRightIcon"></div>
+      </div>
+      <div class="inlineBar">
+        <div class="valNums bdf1 ml10">
+          <!-- 最新价 -->
+          <div class="firstNum start" :class="handleQuotePriceColor(selectedRow.last, selectedRow.presettle)">{{ selectedRow.last }}</div>
+          <div class="lastNum start">
+            <!-- 涨跌值 -->
+            <div :class="handleQuotePriceColor(selectedRow.last, selectedRow.presettle)">{{ quoteChange(selectedRow, selectedRow.decimalplace) }}</div>
+            <!-- 涨跌幅 -->
+            <div class="ml20" :class="handleQuotePriceColor(selectedRow.last, selectedRow.presettle)">{{ quoteAmplitude(selectedRow, selectedRow.decimalplace) }}</div>
+          </div>
+        </div>
+        <div class="priceBar ml20">
+          <div class="inlineBar start">
+            <div class="greenBar">
+              <div class="numBlock ml15">
+                <div class="first grey">卖价</div>
+                <div class="last" :class="handleQuotePriceColor(selectedRow.ask, selectedRow.presettle)">{{ selectedRow.ask }}</div>
+              </div>
+              <div class="numBlock">
+                <div class="first grey">卖量</div>
+                <div class="last" :class="handleQuotePriceColor(selectedRow.ask, selectedRow.presettle)">{{ selectedRow.askvolume }}</div>
+              </div>
             </div>
-            <div class="inlineBar">
-                <div class="valNums bdf1 ml10">
-                    <!-- 最新价 -->
-                    <div
-                        class="firstNum start"
-                        :class="handleQuotePriceColor(selectedRow.last, selectedRow.presettle)"
-                    >{{ selectedRow.last }}</div>
-                    <div class="lastNum start">
-                        <!-- 涨跌值 -->
-                        <div
-                            :class="handleQuotePriceColor(selectedRow.last, selectedRow.presettle)"
-                        >{{ quoteChange(selectedRow, selectedRow.decimalplace) }}</div>
-                        <!-- 涨跌幅 -->
-                        <div
-                            class="ml20"
-                            :class="handleQuotePriceColor(selectedRow.last, selectedRow.presettle)"
-                        >{{ quoteAmplitude(selectedRow, selectedRow.decimalplace) }}</div>
-                    </div>
-                </div>
-                <div class="priceBar ml20">
-                    <div class="inlineBar start">
-                        <div class="greenBar">
-                            <div class="numBlock ml15">
-                                <div class="first grey">卖价</div>
-                                <div
-                                    class="last"
-                                    :class="handleQuotePriceColor(selectedRow.ask, selectedRow.presettle)"
-                                >{{ selectedRow.ask }}</div>
-                            </div>
-                            <div class="numBlock">
-                                <div class="first grey">卖量</div>
-                                <div
-                                    class="last"
-                                    :class="handleQuotePriceColor(selectedRow.ask, selectedRow.presettle)"
-                                >{{ selectedRow.askvolume }}</div>
-                            </div>
-                        </div>
-                    </div>
-                    <div class="inlineBar start">
-                        <div class="redBar">
-                            <div class="numBlock">
-                                <div class="first grey">买价</div>
-                                <div
-                                    class="last"
-                                    :class="handleQuotePriceColor(selectedRow.bid, selectedRow.presettle)"
-                                >{{ selectedRow.bid }}</div>
-                            </div>
-                            <div class="numBlock">
-                                <div class="first grey">买量</div>
-                                <div
-                                    class="last"
-                                    :class="handleQuotePriceColor(selectedRow.bid, selectedRow.presettle)"
-                                >{{ selectedRow.bidvolume }}</div>
-                            </div>
-                        </div>
-                    </div>
-                </div>
+          </div>
+          <div class="inlineBar start">
+            <div class="redBar">
+              <div class="numBlock">
+                <div class="first grey">买价</div>
+                <div class="last" :class="handleQuotePriceColor(selectedRow.bid, selectedRow.presettle)">{{ selectedRow.bid }}</div>
+              </div>
+              <div class="numBlock">
+                <div class="first grey">买量</div>
+                <div class="last" :class="handleQuotePriceColor(selectedRow.bid, selectedRow.presettle)">{{ selectedRow.bidvolume }}</div>
+              </div>
             </div>
+          </div>
         </div>
-        <!-- 交易图表 -->
-        <Chart
-            v-if="showComponentsId === ComponentType.chart"
-            @update="changeComponent"
-            :selectedRow="selectedRow"
-        />
-        <!-- 成交明细 -->
-        <StockExchange
-            :selectedRow="selectedRow"
-            v-if="showComponentsId === ComponentType.tradeDetail"
-        />
+      </div>
+      <div class="btn-list">
+        <a-button class="operBtn" @click="openComponent({ code: 'trade' })">交易</a-button>
+      </div>
     </div>
+    <!-- 交易图表 -->
+    <Chart v-if="showComponentsId === ComponentType.chart" @update="changeComponent" :selectedRow="selectedRow" />
+    <!-- 成交明细 -->
+    <StockExchange :selectedRow="selectedRow" v-if="showComponentsId === ComponentType.tradeDetail" />
+    <component :is="componentId" v-if="componentId" :selectedRow="selectedRow" @cancel="closeComponent"></component>
+  </div>
 </template>
 
 <script lang="ts">
-import { defineComponent } from '@/common/export/commonTable';
+import { defineComponent, defineAsyncComponent } from '@/common/export/commonTable';
 import { _closeModal } from '@/common/setup/modal/modal';
 import { handleQuotePriceColor, handleSubcriteOnDemandQuote, quoteAmplitude, quoteAmplituOfVibration, quoteChange } from '@/common/setup/table/tableQuote';
 import { QueryQuoteDayRsp } from '@/services/go/quote/interface';
@@ -92,54 +69,60 @@ import { PropType, ref } from 'vue';
 import Chart from './chart/index.vue';
 import { ComponentType } from './setup';
 import StockExchange from './stock-exchange/index.vue';
-
+import { handleModalComponent } from '@/common/setup/asyncComponent';
 
 export default defineComponent({
-    emits: ['cancel', 'update'],
-    name: 'buy-sell-market',
-    props: {
-        selectedRow: {
-            type: Object as PropType<QueryQuoteDayRsp>,
-            default: {},
-        },
+  emits: ['cancel', 'update'],
+  name: 'buy-sell-market',
+  props: {
+    selectedRow: {
+      type: Object as PropType<QueryQuoteDayRsp>,
+      default: () => ({}),
     },
-    components: {
-        Chart,
-        LeftOutlined,
-        StockExchange,
-    },
-    setup(props, context) {
-        const loading = ref<boolean>(false);
-        const { visible, cancel } = _closeModal(context);
+  },
+  components: {
+    Chart,
+    LeftOutlined,
+    StockExchange,
+    trade: defineAsyncComponent(() => import('@/views/market/futures/compoments/futures-trade/index.vue')), // 期货交易
+  },
+  setup(props, context) {
+    const loading = ref<boolean>(false);
+    const { visible, cancel } = _closeModal(context);
 
-        const showComponentsId = ref<ComponentType>(ComponentType.chart);
+    const showComponentsId = ref<ComponentType>(ComponentType.chart);
 
-        // 切换组件
-        function changeComponent(type: ComponentType) {
-            showComponentsId.value = type;
-        }
-        // 返回上层组件
-        function cancelAction() {
-            if (showComponentsId.value === ComponentType.chart) {
-                cancel();
-            } else {
-                showComponentsId.value = ComponentType.chart;
-            }
-        }
-        return {
-            cancel,
-            visible,
-            changeComponent,
-            ComponentType,
-            showComponentsId,
-            cancelAction,
-            handleSubcriteOnDemandQuote,
-            handleQuotePriceColor,
-            quoteChange,
-            quoteAmplitude,
-            quoteAmplituOfVibration,
-        };
-    },
+    const { componentId, closeComponent, openComponent } = handleModalComponent(() => { }, ref({}));
+
+    // 切换组件
+    function changeComponent(type: ComponentType) {
+      showComponentsId.value = type;
+    }
+    // 返回上层组件
+    function cancelAction() {
+      if (showComponentsId.value === ComponentType.chart) {
+        cancel();
+      } else {
+        showComponentsId.value = ComponentType.chart;
+      }
+    }
+    return {
+      cancel,
+      visible,
+      changeComponent,
+      ComponentType,
+      showComponentsId,
+      cancelAction,
+      handleSubcriteOnDemandQuote,
+      handleQuotePriceColor,
+      quoteChange,
+      quoteAmplitude,
+      quoteAmplituOfVibration,
+      componentId,
+      closeComponent,
+      openComponent,
+    };
+  },
 });
 </script>
 <style lang="less">

src/views/order/funding_information/components/funding_information_funding_summary/setup.ts

@@ -6,7 +6,7 @@ import { Taaccount } from '@/services/go/TaAccount/interface';
 import { Systemparam } from '@/services/go/useInfo/interface';
 import { Ref } from 'vue';
 import { getCanUseMoney, getFreeze } from '@/services/bus/account';
-import { getTaacountStatus } from '@/common/constants/enumsName';
+import { getTaacountStatus, getPayCurrencyTypeEnumItemName } from '@/common/constants/enumsName';
 
 export function getColumns() {
     const columns = [
@@ -18,7 +18,7 @@ export function getColumns() {
             title: '币种',
             key: 'currencyid',
             customRender: ({ record }: { record: Taaccount }) => {
-                return record.currencyid
+                return getPayCurrencyTypeEnumItemName(record.currencyid)
             }
         },
         {

src/views/order/funding_information/index.vue

@@ -1,8 +1,7 @@
 <template>
   <!-- 资金信息 -->
   <section class="funding_information">
-    <component :is="componentId" v-if="componentId">
-    </component>
+    <component :is="componentId"></component>
     <thirdMenu :list="tabList" @selectMenu="changeTab" :value="'title'"></thirdMenu>
   </section>
 </template>
@@ -12,14 +11,14 @@ import { defineAsyncComponent, defineComponent } from 'vue';
 import thirdMenu from '@/common/components/thirdMenu/index.vue';
 import { handleOrderDetailList } from '@/common/setup/order/orderData';
 export default defineComponent({
-    components: {
-        thirdMenu,
-        funding_information_summary: defineAsyncComponent(() => import('./components/funding_information_funding_summary/index.vue')), // 资金汇总
-        funding_information_log: defineAsyncComponent(() => import('./components/funding_information_funding_log/index.vue')), // 资金流水
-    },
-    setup() {
-        return { ...handleOrderDetailList('funding_information') };
-    },
+  components: {
+    thirdMenu,
+    funding_information_summary: defineAsyncComponent(() => import('./components/funding_information_funding_summary/index.vue')), // 资金汇总
+    funding_information_log: defineAsyncComponent(() => import('./components/funding_information_funding_log/index.vue')), // 资金流水
+  },
+  setup() {
+    return { ...handleOrderDetailList('funding_information') };
+  },
 });
 </script>