现货汇总

src/views/order/spot_warran/components/spot_warrant_inventory_summary/index.vue

@@ -26,7 +26,6 @@
 
 <script lang="ts">
 import { enumOrderComponents } from '@/common/constants/enumOrderComponents';
-import { EnumRouterName } from '@/common/constants/enumRouterName';
 import { queryTableList, BtnList, contextMenu, defineAsyncComponent, defineComponent, ModalEnum, ComposeTableParam, handleComposeTable } from '@/common/export/commonTable';
 import { queryWrOrderDetail, queryWrPosition } from '@/services/go/wrtrade';
 import { QueryWrOrderDetailReq, QueryWrPositionReq, WrOrderDetail, WrPosition } from '@/services/go/wrtrade/interface';

src/views/order/spot_warran/components/spot_warrant_spot_summary/components/index.vue

@@ -0,0 +1,142 @@
+<template>
+  <!-- 现货仓单 现货明细 提货 -->
+  <Drawer :title="'提货'"
+          :placement="'bottom'"
+          :visible="visible">
+    <!-- 挂牌 -->
+    提货
+  </Drawer>
+</template>
+
+<script lang="ts">
+import { defineComponent, PropType, ref } from 'vue';
+import { enumOrderComponents } from '@/common/constants/enumOrderComponents';
+import Drawer from '@/common/components/drawer/index.vue';
+import { QueryWrPositionReq, WrPosition } from '@/services/go/wrtrade/interface';
+import { getUserId } from '@/services/bus/account';
+import { requestResultLoadingAndInfo } from '@/common/methods/request/resultInfo';
+import { hdWROrder } from '@/services/proto/warehousetrade';
+import { v4 as uuidv4 } from 'uuid';
+import moment from 'moment';
+import { ModalEnum } from '@/common/constants/modalNameEnum';
+
+export default defineComponent({
+    name: ModalEnum.spot_warrant_spot_details_pick_up,
+    components: { Drawer },
+    props: {
+        selectedRow: {
+            type: Object as PropType<WrPosition>,
+            default: {},
+        },
+    },
+    setup(props) {
+        const data = props.selectedRow;
+        const loading = ref<boolean>(false);
+
+        // console.log(param);
+        // requestResultLoadingAndInfo(hdWROrder, param, loading, ['挂牌成功', '挂牌失败:']).then(() => {
+        //     // cancel(true);
+        // });
+        return {
+            visible: true,
+        };
+    },
+});
+</script>
+
+<style lang="less" scoped>
+.listed {
+    width: 100%;
+    height: 100%;
+    .flex;
+    flex-direction: column;
+    .condition {
+        width: 100%;
+        height: 48px;
+        padding: 10px 16px;
+        border-bottom: 1px solid @m-black6;
+        .inlineflex;
+        .conditionBtn {
+            align-self: center;
+            align-items: center;
+            border: 0;
+            width: 80px;
+            height: 28px;
+            line-height: 28px;
+            background: @m-black7;
+            .rounded-corners(3px);
+            font-size: 14px;
+            color: @m-blue0;
+            &:hover {
+                background: rgba(@m-black7, 0.8);
+                color: rgba(@m-blue0, 0.8);
+            }
+        }
+        .conditionBtn + .conditionBtn {
+            margin-left: 10px;
+        }
+    }
+    .formBar {
+        width: 100%;
+        flex: 1;
+        padding: 28px 16px 7px;
+    }
+}
+
+::v-deep.formProgress {
+    width: 140px;
+    // height: 3px;
+    // .rounded-corners(2px);
+    margin-left: 80px;
+    .ant-progress-outer {
+        margin-right: 0;
+        padding-right: 0;
+        .ant-progress-inner {
+            background: @m-grey14;
+            .rounded-corners(2px);
+            .ant-progress-bg {
+                height: 3px !important;
+                border-radius: 2px !important;
+                background-color: @m-blue0;
+            }
+        }
+    }
+    .ant-progress-text {
+        display: none;
+    }
+}
+.unit {
+    margin-left: 80px;
+    .flex;
+    justify-content: space-between;
+    font-size: 14px;
+    color: @m-grey1;
+    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 {
+        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%);
+    &:hover {
+        background: linear-gradient(0deg, @m-grey12-hover 0%, @m-grey13-hover 100%);
+        color: @m-white0-hover;
+    }
+}
+.ml10 {
+    margin-left: 10px;
+}
+</style>;

src/views/order/spot_warran/components/spot_warrant_spot_summary/index.vue

@@ -1,18 +1,63 @@
 <template>
   <!-- 现货汇总 -->
-  <section class="spot_warrant_spot_summary">
-    现货汇总
+  <section>
+    <a-table :columns="columns"
+             class="srcollYTable"
+             :scroll="{ x: '100%', y: 'calc(100vh - 163px)' }"
+             :pagination="false"
+             :loading="loading"
+             :expandedRowKeys="expandedRowKeys"
+             :customRow="Rowclick"
+             rowKey="key"
+             :data-source="tableList">
+      <!-- 额外的展开行 -->
+      <template #expandedRowRender="{ record }">
+        <BtnList :btnList="btnList"
+                 :record="record"
+                 @click="openComponent" />
+      </template>
+    </a-table>
+    <component :is="componentId"
+               v-if="componentId"
+               :selectedRow="selectedRow"
+               @cancel="closeComponent"></component>
   </section>
 </template>
 
 <script lang="ts">
-import { defineComponent } from 'vue';
 import { enumOrderComponents } from '@/common/constants/enumOrderComponents';
+import { queryTableList, BtnList, defineAsyncComponent, defineComponent } from '@/common/export/commonTable';
+import { queryWrPosition } from '@/services/go/wrtrade';
+import { QueryWrPositionReq, WrPosition } from '@/services/go/wrtrade/interface';
+import { getRecordItemTab } from '@/common/setup/order/orderData';
+import { handleComposeOrderTable } from '@/common/setup/table/compose';
+import { ComposeOrderTableParam } from '@/common/setup/table/interface';
 export default defineComponent({
     name: enumOrderComponents.spot_warrant_spot_summary,
-    components: {},
+    components: {
+        BtnList,
+    },
     setup() {
-        return {};
+        // 表格列表数据
+        const { loading, tableList, queryTable } = queryTableList<WrPosition>();
+        // 获取列表数据
+        const queryTableAction = () => {
+            const param: QueryWrPositionReq = {
+                querytype: 1,
+            };
+            queryTable(queryWrPosition, param);
+        };
+        // 表格通用逻辑
+        const param: ComposeOrderTableParam = {
+            queryFn: queryTableAction,
+            tableName: 'table_pcweb_spot_trade_bottom_spot_warrant_spot_summary',
+            recordList: getRecordItemTab(),
+        };
+        return {
+            ...handleComposeOrderTable<WrPosition>(param),
+            loading,
+            tableList,
+        };
     },
 });
 </script>