仓单预售 贸易圈挂牌 配置路由

src/common/constants/enumRouterName.ts

@@ -324,4 +324,5 @@ export enum EnumRouterName {
 
 	spot_trade_warehouse_sell_hall = 'spot_trade_warehouse_sell_hall', // 卖大厅
 	warehouse_receipt_trade_blocs = 'warehouse_receipt_trade_blocs', //  仓单贸易 贸易圈挂牌
+	warehouse_pre_sale_blocs = 'warehouse_pre_sale_blocs', //  仓单预售 贸易圈挂牌
 }

src/router/index.ts

@@ -1366,6 +1366,14 @@ const routes: Array<RouteRecordRaw> = [
                                     requireAuth: true,
                                 },
                             },
+                            {
+                                path: '/spot_trade/warehouse_pre_sale/warehouse_pre_sale_blocs',
+                                name: EnumRouterName.warehouse_pre_sale_blocs,
+                                component: () => import('@/views/market/spot_trade/warehouse_pre_sale/warehouse_pre_sale_blocs/index.vue'),
+                                meta: {
+                                    requireAuth: true,
+                                },
+                            },
                         ]
                     },
                     {

src/views/market/spot_trade/components/buy-sell-market/setup.ts

@@ -84,7 +84,7 @@ export function handleIs(enumName: EnumRouterName, buyOrSell: BuyOrSell) {
      * @returns 1 => 仓单贸易; 0 => 仓单预售
      */
     function isWR(): 0 | 1 {
-        if (enumName === EnumRouterName.warehouse_receipt_trade_price || enumName === EnumRouterName.warehouse_receipt_trade_floating_price || EnumRouterName.warehouse_receipt_trade_blocs) {
+        if (enumName === EnumRouterName.warehouse_receipt_trade_price || enumName === EnumRouterName.warehouse_receipt_trade_floating_price || enumName === EnumRouterName.warehouse_receipt_trade_blocs) {
             return 1
         } else {
             return 0

src/views/market/spot_trade/warehouse_pre_sale/warehouse_pre_sale_blocs/components/buy/index.vue

@@ -0,0 +1,129 @@
+<template>
+  <!-- 仓单贸易 贸易圈挂牌 买-->
+  <div>
+    <a-table :columns="columns"
+             :class="['srcollYTable', isBottom ? 'condSecondTabTable' : 'condSecondTabTableNoBottom']"
+             :scroll="{ x: '100%', y: isBottom ? 'calc(100vh- 443px)' : 'calc(100vh - 196px)' }"
+             :pagination="false"
+             :loading="loading"
+             :expandedRowKeys="expandedRowKeys"
+             :customRow="Rowclick"
+             rowKey="key"
+             :data-source="tableList">
+      <template #index="{ index }">
+        <span>{{ index + 1  }}</span>
+      </template>
+      <!-- 议价 -->
+      <template #canbargain="{ text }">
+        <span>{{ text ? '是' : '否' }}</span>
+      </template>
+      <!-- 整单 -->
+      <template #canpart="{ text }">
+        <span>{{ text ? '是' : '否' }}</span>
+      </template>
+      <!-- 挂牌有效期 -->
+      <template #validtime="{ text }">
+        <span>{{ formatTime(text, 'd') }}</span>
+      </template>
+    </a-table>
+    <!-- 右键 -->
+    <contextMenu :contextMenu="contextMenu"
+                 @cancel="closeContext"
+                 :list="filterBtn(firstBtn)"></contextMenu>
+    <component :is="componentId"
+               v-if="componentId"
+               :enumName="name"
+               :selectedRow="selectedRow"
+               @cancel="closeComponent"></component>
+  </div>
+</template>
+
+<script lang="ts">
+import { EnumRouterName } from '@/common/constants/enumRouterName';
+import { queryTableList, contextMenu, defineAsyncComponent, defineComponent, ModalEnum, ComposeTableParam } from '@/common/export/commonTable';
+import { QueryOrderQuoteMyqQsp, QueryOrderQuoteMyqQsq, QueryOrderQuoteReq, WrOrderQuote } from '@/services/go/wrtrade/interface';
+import { queryOrderQuote, queryQueryOrderQuoteMyq } from '@/services/go/wrtrade';
+import { handleComposeTable } from '@/common/setup/table/compose';
+import Filter from '../../components/filter/index.vue';
+import { Goods } from '@/services/go/ermcp/goodsInfo/interface';
+import { getShowBottomValue } from '@/common/config/constrolBottom';
+import { handleColumns, filterBtn } from '../../setup';
+import { BuyOrSell } from '@/common/constants/enumCommon';
+import { formatTime } from '@/common/methods';
+
+export default defineComponent({
+    name: EnumRouterName.warehouse_receipt_trade_floating_price,
+    components: {
+        contextMenu,
+    },
+    setup() {
+        const isBottom = getShowBottomValue();
+        // 表头
+        const { getBuyOrSellColumns } = handleColumns();
+        const columns = getBuyOrSellColumns(BuyOrSell.buy).map((el) => {
+            const slots = { customRender: el.key };
+            return { ...el, slots, dataIndex: el.key };
+        });
+
+        // 表格列表数据
+        const { loading, tableList, queryTable } = queryTableList<QueryOrderQuoteMyqQsp>();
+        // 获取列表数据
+        const queryTableAction = () => {
+            const param: QueryOrderQuoteMyqQsq = {
+                buyorsell: BuyOrSell.buy,
+                haswr: 0,
+            };
+            queryTable(queryQueryOrderQuoteMyq, param);
+        };
+        // 表格通用逻辑
+        const param: ComposeTableParam = {
+            queryFn: queryTableAction,
+            menuType: EnumRouterName.warehouse_receipt_trade_blocs,
+            tableFilterKey: [],
+            isDetail: false,
+        };
+        const {
+            contextMenu,
+            openContext,
+            closeContext, // 右键
+            expandedRowKeys,
+            selectedRow,
+            Rowclick, // 表格折腾面板数据与单击、双击事件
+            componentId,
+            closeComponent,
+            openComponent, // 控制异步组件
+            firstBtn,
+            secondBtn, // 表格按钮
+        } = handleComposeTable<QueryOrderQuoteMyqQsp>(param);
+        function search(value: Object) {
+            // const param: QueryOrderQuoteReq = {
+            //     wrpricetype: 2,
+            //     haswr: 1,
+            // };
+            // Object.assign(param, value);
+            // queryTable(queryOrderQuote, param);
+        }
+
+        return {
+            isBottom,
+            contextMenu,
+            openContext,
+            closeContext, // 右键
+            columns,
+            expandedRowKeys,
+            selectedRow,
+            Rowclick, // 表格折腾面板数据与单击、双击事件
+            componentId,
+            closeComponent, // 控制异步组件
+            firstBtn, // 表格按钮
+            loading,
+            tableList,
+            search,
+            formatTime,
+            filterBtn,
+        };
+    },
+});
+</script>
+<style lang="less">
+</style>

src/views/market/spot_trade/warehouse_pre_sale/warehouse_pre_sale_blocs/components/post-buying/index.vue

@@ -0,0 +1,391 @@
+<template>
+  <!--仓单贸易 贸易圈挂牌 挂牌求购 -->
+  <Drawer :title="'挂牌求购'"
+          :placement="'right'"
+          :visible="visible"
+          @cancel="cancel"
+          class="top">
+    <div class="post_buying">
+      <a-form class="inlineForm dialogForm"
+              ref="formRef"
+              :model="formState"
+              :rules="rules">
+        <div class="formBar">
+          <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>
+              </a-form-item>
+            </a-col>
+            <a-col :span="24">
+              <a-form-item label="挂牌价格"
+                           name="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">
+              <a-form-item label="挂牌数量"
+                           name="OrderQty">
+                <a-input-number class="commonInput"
+                                style="width: 260px"
+                                :min="0"
+                                v-model:value="formState.OrderQty" />
+                <span class="input-enumdicname">{{selectedRow.enumdicname}}</span>
+              </a-form-item>
+            </a-col>
+
+            <a-col :span="24">
+              <a-form-item label="起摘数量"
+                           class="relative">
+                <a-input class="commonInput"
+                         :suffix="selectedRow.enumdicname"
+                         :min="selectedRow.minivalue"
+                         style="width: 260px" />
+                <span class="input-enumdicname">{{selectedRow.enumdicname}}</span>
+              </a-form-item>
+            </a-col>
+            <a-col :span="24">
+              <a-form-item label="履约保证金"
+                           class="relative">
+                <a-input class="commonInput"
+                         :suffix="selectedRow.enumdicname"
+                         :min="selectedRow.minivalue"
+                         style="width: 260px" />
+                <span class="input-enumdicname">%</span>
+              </a-form-item>
+            </a-col>
+            <a-col :span="24">
+              <a-form-item label="挂牌有效期"
+                           name="DeliveryMonth">
+                <a-date-picke style="width: 260px"
+                              v-model:value="formState.DeliveryMonth"
+                              :allowClear="false"
+                              class="commonDatePicker dialogDatePicker" />
+              </a-form-item>
+            </a-col>
+
+            <a-col :span="24">
+              <a-form-item label="履约方式">
+                <span class="white ml8">选择履约模板</span>
+              </a-form-item>
+            </a-col>
+            <a-col :span="24">
+              <a-form-item label="指定朋友">
+                <span class="white ml8">选择朋友</span>
+              </a-form-item>
+            </a-col>
+            <a-col :span="24">
+              <a-form-item label="指定朋友">
+                <span class="white ml8">选择朋友</span>
+              </a-form-item>
+            </a-col>
+            <a-col :span="24">
+              <a-form-item label="挂牌金额">
+                <span class="white ml8">55555</span>
+              </a-form-item>
+            </a-col>
+            <a-col :span="24">
+              <a-form-item label="履约保证金">
+                <span class="white ml8">55555</span>
+              </a-form-item>
+            </a-col>
+            <a-col :span="24">
+              <a-form-item label="可用资金">
+                <span class="white ml8">55555</span>
+              </a-form-item>
+            </a-col>
+          </a-row>
+        </div>
+        <a-row :gutter="24">
+          <a-col :span="24"
+                 class="fixedBtns">
+            <a-form-item class="btnCenter">
+              <a-button class="listedBtn"
+                        @click="submit">买入</a-button>
+              <a-button class="ml10 cancelBtn"
+                        @click="cancel">取消</a-button>
+            </a-form-item>
+          </a-col>
+        </a-row>
+      </a-form>
+    </div>
+  </Drawer>
+</template>
+
+<script lang="ts">
+import { defineComponent, PropType, ref } from 'vue';
+import { Des } from '@/common/components/commonDes';
+import { _closeModal } from '@/common/setup/modal/modal';
+import { ModalEnum } from '@/common/constants/modalNameEnum';
+import Drawer from '@/common/components/drawer/index.vue';
+import { PlusOutlined, MinusOutlined } from '@ant-design/icons-vue';
+import { hdWROrder } from '@/services/proto/warehousetrade';
+import { requestResultLoadingAndInfo } from '@/common/methods/request/resultInfo';
+import { DGFactoryItems, WRGoodsInfo } from '@/services/proto/warehousetrade/interface';
+import { getAccountTypeList, getUserId } from '@/services/bus/account';
+import { v4 as uuidv4 } from 'uuid';
+import moment, { Moment } from 'moment';
+import { getMarketRunByTradeMode } from '@/services/bus/market';
+import { QueryOrderQuoteMyqQsp, WrOrderQuote } from '@/services/go/wrtrade/interface';
+import { handleForm } from './setup';
+import { validateAction } from '@/common/setup/form';
+import { FormParam } from './interface';
+import { EnumRouterName } from '@/common/constants/enumRouterName';
+
+import { BuyOrSell } from '@/common/constants/enumCommon';
+import { getCanUseMoney } from '@/services/bus/account';
+import { TempWrOrderQuoteDetail } from '@/views/market/spot_trade/components/post_buying/interface';
+
+export default defineComponent({
+    emits: ['cancel', 'update'],
+    name: ModalEnum.spot_trade_warehouse_post_buying,
+    components: { Des, Drawer, PlusOutlined, MinusOutlined },
+    props: {
+        selectedRow: {
+            type: Object as PropType<TempWrOrderQuoteDetail>,
+            default: {},
+        },
+    },
+    setup(props, context) {
+        const { visible, cancel } = _closeModal(context);
+        const { rules, formState, formRef } = handleForm();
+        const loading = ref<boolean>(false);
+        const accountList = getAccountTypeList([2]);
+        if (accountList.length) {
+            formState.accountid = accountList[0].accountid;
+        }
+        function getSelectedAccount() {
+            return accountList.find((e) => e.accountid === formState.accountid);
+        }
+
+        function submit() {
+            // const marketInfo = getMarketRunByTradeMode(17);
+            // if (marketInfo) {
+            //     validateAction<FormParam>(formRef, formState).then((res) => {
+            //         // 现在增加一种挂牌求购的情况
+            //         // 这种求购模式会生成一种仓单贸易商品
+            //         const wrGoodsInfo: WRGoodsInfo = {
+            //             GoodsID: props.selectedRow.goodsid, // uint32 配置商品ID
+            //             GoodsCode: props.selectedRow.goodscode, // string 配置商品代码
+            //             PriceFactor: 1, // double 商品价格系数
+            //             PriceMove: 0, // double 商品升贴水值
+            //             WeightRatio: 1, // double 商品重量系数
+            //         };
+            //         const param = {
+            //             AccountID: res.accountid, // 默认内部资金账号第一个
+            //             ClientSerialNo: uuidv4(), // 客户端流水号
+            //             // OperateSrc: 2,
+            //             ClientType: 4,
+            //             // MarketID: marketInfo.marketid,
+            //             LadingBillId: 0, // 提单id(wrholdlb的LadingBillId字段),卖的时候填写 uint64
+            //             // LadingBillId: 'uint642081626946446000001', // 提单id(wrholdlb的LadingBillId字段),卖的时候填写 uint64
+            //             TradeDate: moment(marketInfo.tradedate).format('YYYYMMDD'), // 交易日 string
+            //             // SubNum: '0', // 提单子单号
+            //             SubNum: 0,
+            //             // WRFactorTypeId: '2121626946446000001', // 仓单要素ID(wrholdlb的WRFactorTypeId字段),卖的时候填写 uint64
+            //             WRFactorTypeId: props.selectedRow.wrfactortypeid ? props.selectedRow.wrfactortypeid : 0, // 仓单要素ID(wrholdlb的WRFactorTypeId字段),卖的时候填写 uint64
+            //             IsSpecified: 0, // 是否指定对手 0：不指定 1：指定 uint32
+            //             // MatchUserIDs: 0, // 仓单贸易对手资金账号ID集合(指定对手时填写) uint32
+            //             OrderQty: res.OrderQty, // 委托数量(可挂部分数据量) ======
+            //             DeliveryGoodsID: props.selectedRow.deliverygoodsid, // 交割商品商品ID  // 有仓单求购
+            //             WRPriceType: isFloat() ? 2 : 1, // 价格方式 1：固定价 2：浮动价
+            //             FixedPrice: res.FixedPrice, // 固定价格
+            //             PriceFactor: 1, // 价格系数(浮动价时填写)
+            //             PriceMove: res.PriceMove, // 升贴水(浮动价时填写)
+            //             TimevalidType: 4, // 时间有效类型 1：当日有效 2：本周有效 3：指定时间有效 4：一直有效
+            //             // ValidTime: moment('2021-08-25 00:00:00').format('YYYY-MM-DD HH:mm:ss'), // 有效期限
+            //             ClientOrderTime: moment().format('YYYY-MM-DD HH:mm:ss'),
+            //             FirstRatio: 0, // 首付比例
+            //             PerformanceTemplateID: 0, // 履约计划模板ID
+            //             UserID: getUserId(),
+            //             OperatorID: getUserId(), // 操作员账号ID
+            //             BuyOrSell: 0, // 买卖方向 0买1卖
+            //             PriceDisplayMode: 1, // 浮动价显示方式 1：合并显示 2：分开显示
+            //             CanBargain: 0, // 挂牌是否可议价0:不可1:可-摘牌是否议价
+            //             Attachment1: '', // 附件1
+            //             Attachment2: '', // 附件2
+            //             Remark: '', // 备注
+            //             ApplyID: 0, // 申请ID
+            //             WRTradeGoods: isFloat() ? [wrGoodsInfo] : [],
+            //             CanPart: 1, // 是否允许部份摘牌0:不允许;1:允许
+            //             WRStandardID: props.selectedRow.wrstandardid,
+            //             HasWr: isWR(), // 无仓单挂牌  是否有无仓单
+            //             DeliveryMonth: isWR() ? '' : moment(res.DeliveryMonth).format('YYYY-MM'),
+            //             FactoryItems: props.selectedRow.wrResult != undefined ? props.selectedRow.wrResult.flatMap((it) => {
+            //                 return {
+            //                     DGFactoryItemTypeID: it.dgfactoryitemtypeid, // uint64 要素项类型ID
+            //                     DGFactoryItemID: it.dgfactoryitemid, // uint64 预约要素项类型值
+            //                     ItemTypeMode: 1, // uint32 要素项类型模式
+            //                 };
+            //             }): [], // DGFactoryItems 要素类型明细集合(没有仓单要素ID填写)
+            //         };
+            //         requestResultLoadingAndInfo(hdWROrder, param, loading, ['求购成功', '求购失败:']).then(() => {
+            //             cancel(true);
+            //         });
+            //     });
+            // }
+        }
+        return {
+            submit,
+            cancel,
+            visible,
+            accountList,
+            rules,
+            formState,
+            formRef,
+            getSelectedAccount,
+            getCanUseMoney,
+        };
+    },
+});
+</script>
+
+<style lang="less">
+.post_buying {
+    width: 100%;
+    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;
+            }
+        }
+        .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;
+}
+.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%) !important;
+    &:hover {
+        background: linear-gradient(0deg, @m-grey12-hover 0%, @m-grey13-hover 100%) !important;
+        color: @m-white0-hover;
+    }
+}
+.ml10 {
+    margin-left: 10px;
+}
+.ant-form.dialogForm .ant-row.ant-form-item {
+    margin-bottom: 14px;
+}
+.mt20 {
+    margin-top: 20px;
+}
+.mt-10 {
+    margin-top: -10px;
+}
+.ant-input-suffix {
+    position: absolute;
+    right: -25px;
+}
+.minusBtn,
+.plusBtn {
+    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;
+}
+.plusBtn {
+    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;
+}
+.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;
+    }
+}
+</style>

src/views/market/spot_trade/warehouse_pre_sale/warehouse_pre_sale_blocs/components/post-buying/interface.ts

@@ -0,0 +1,10 @@
+import { Moment } from "moment";
+
+export interface FormParam {
+    accountid: undefined | number,
+    FixedPrice: number,
+    OrderQty: number,
+    PriceMove: number,
+    DeliveryMonth: Moment,
+}
+

src/views/market/spot_trade/warehouse_pre_sale/warehouse_pre_sale_blocs/components/post-buying/setup.ts

@@ -0,0 +1,22 @@
+import moment from "moment";
+import { reactive, ref, UnwrapRef } from "vue";
+import { FormParam } from "./interface";
+
+const formState: UnwrapRef<FormParam> = reactive({
+    accountid: undefined,
+    FixedPrice: 0,
+    OrderQty: 0,
+    PriceMove: 0,
+    DeliveryMonth: moment()
+})
+export function handleForm() {
+    const formRef = ref();
+    const rules = {
+        FixedPrice: [{ required: true, message: '请输入挂牌价格', trigger: 'blur', type: 'number', }],
+        OrderQty: [{ required: true, message: '请输入挂牌数量', trigger: 'blur', type: 'number', min: 1 }],
+        PriceMove: [{ required: true, message: '请输入基差', trigger: 'blur', type: 'number' }],
+        accountid: [{ required: true, message: '请输入交易账号' }],
+    }
+    return { rules, formState, formRef }
+}
+

src/views/market/spot_trade/warehouse_pre_sale/warehouse_pre_sale_blocs/components/sell/index.vue

@@ -0,0 +1,129 @@
+<template>
+  <!-- 仓单贸易 贸易圈挂牌 买-->
+  <div>
+    <a-table :columns="columns"
+             :class="['srcollYTable', isBottom ? 'condSecondTabTable' : 'condSecondTabTableNoBottom']"
+             :scroll="{ x: '100%', y: isBottom ? 'calc(100vh- 443px)' : 'calc(100vh - 196px)' }"
+             :pagination="false"
+             :loading="loading"
+             :expandedRowKeys="expandedRowKeys"
+             :customRow="Rowclick"
+             rowKey="key"
+             :data-source="tableList">
+      <template #index="{ index }">
+        <span>{{ index + 1  }}</span>
+      </template>
+      <!-- 议价 -->
+      <template #canbargain="{ text }">
+        <span>{{ text ? '是' : '否' }}</span>
+      </template>
+      <!-- 整单 -->
+      <template #canpart="{ text }">
+        <span>{{ text ? '是' : '否' }}</span>
+      </template>
+      <!-- 挂牌有效期 -->
+      <template #validtime="{ text }">
+        <span>{{ formatTime(text, 'd') }}</span>
+      </template>
+    </a-table>
+    <!-- 右键 -->
+    <contextMenu :contextMenu="contextMenu"
+                 @cancel="closeContext"
+                 :list="filterBtn(firstBtn)"></contextMenu>
+    <component :is="componentId"
+               v-if="componentId"
+               :enumName="name"
+               :selectedRow="selectedRow"
+               @cancel="closeComponent"></component>
+  </div>
+</template>
+
+<script lang="ts">
+import { EnumRouterName } from '@/common/constants/enumRouterName';
+import { queryTableList, contextMenu, defineAsyncComponent, defineComponent, ModalEnum, ComposeTableParam } from '@/common/export/commonTable';
+import { QueryOrderQuoteMyqQsp, QueryOrderQuoteMyqQsq, QueryOrderQuoteReq, WrOrderQuote } from '@/services/go/wrtrade/interface';
+import { queryOrderQuote, queryQueryOrderQuoteMyq } from '@/services/go/wrtrade';
+import { handleComposeTable } from '@/common/setup/table/compose';
+import Filter from '../../components/filter/index.vue';
+import { Goods } from '@/services/go/ermcp/goodsInfo/interface';
+import { getShowBottomValue } from '@/common/config/constrolBottom';
+import { handleColumns, filterBtn } from '../../setup';
+import { BuyOrSell } from '@/common/constants/enumCommon';
+import { formatTime } from '@/common/methods';
+
+export default defineComponent({
+    name: EnumRouterName.warehouse_receipt_trade_floating_price,
+    components: {
+        contextMenu,
+    },
+    setup() {
+        const isBottom = getShowBottomValue();
+        // 表头
+        const { getBuyOrSellColumns } = handleColumns();
+        const columns = getBuyOrSellColumns(BuyOrSell.sell).map((el) => {
+            const slots = { customRender: el.key };
+            return { ...el, slots, dataIndex: el.key };
+        });
+
+        // 表格列表数据
+        const { loading, tableList, queryTable } = queryTableList<QueryOrderQuoteMyqQsp>();
+        // 获取列表数据
+        const queryTableAction = () => {
+            const param: QueryOrderQuoteMyqQsq = {
+                buyorsell: BuyOrSell.sell,
+                haswr: 0,
+            };
+            queryTable(queryQueryOrderQuoteMyq, param);
+        };
+        // 表格通用逻辑
+        const param: ComposeTableParam = {
+            queryFn: queryTableAction,
+            menuType: EnumRouterName.warehouse_receipt_trade_blocs,
+            tableFilterKey: [],
+            isDetail: false,
+        };
+        const {
+            contextMenu,
+            openContext,
+            closeContext, // 右键
+            expandedRowKeys,
+            selectedRow,
+            Rowclick, // 表格折腾面板数据与单击、双击事件
+            componentId,
+            closeComponent,
+            openComponent, // 控制异步组件
+            firstBtn,
+            secondBtn, // 表格按钮
+        } = handleComposeTable<QueryOrderQuoteMyqQsp>(param);
+        function search(value: Object) {
+            // const param: QueryOrderQuoteReq = {
+            //     wrpricetype: 2,
+            //     haswr: 1,
+            // };
+            // Object.assign(param, value);
+            // queryTable(queryOrderQuote, param);
+        }
+
+        return {
+            isBottom,
+            contextMenu,
+            openContext,
+            closeContext, // 右键
+            columns,
+            expandedRowKeys,
+            selectedRow,
+            Rowclick, // 表格折腾面板数据与单击、双击事件
+            componentId,
+            closeComponent, // 控制异步组件
+            firstBtn, // 表格按钮
+            loading,
+            tableList,
+            search,
+            formatTime,
+            filterBtn,
+        };
+    },
+});
+</script>
+<style lang="less">
+</style>

src/views/market/spot_trade/warehouse_pre_sale/warehouse_pre_sale_blocs/index.vue

@@ -0,0 +1,61 @@
+<template>
+  <!-- 仓单贸易 贸易圈挂牌-->
+  <div class="topTableHeight">
+    <Filter :enumName="name"
+            @search="search"
+            @buy="buyOpen" />
+    <div>
+      <Sell />
+      <Buy />
+    </div>
+    <component :is="componentId"
+               v-if="componentId"
+               :selectedRow="selectedRow"
+               @cancel="closeComponent"></component>
+  </div>
+</template>
+
+<script lang="ts">
+import { EnumRouterName } from '@/common/constants/enumRouterName';
+import { defineComponent, defineAsyncComponent, ModalEnum } from '@/common/export/commonTable';
+import Filter from '../../components/filter/index.vue';
+import { getShowBottomValue } from '@/common/config/constrolBottom';
+import Buy from './components/buy/index.vue';
+import Sell from './components/sell/index.vue';
+import { handleModalComponent } from '@/common/setup/asyncComponent';
+import { ref } from 'vue';
+
+export default defineComponent({
+    name: EnumRouterName.warehouse_pre_sale_blocs,
+    components: {
+        Filter,
+        Buy,
+        Sell,
+        postBuying: defineAsyncComponent(() => import('./components/post-buying/index.vue')),
+    },
+    setup() {
+        const isBottom = getShowBottomValue();
+        const selectedRow = ref();
+        function queryFn() {}
+        // 控制异步组件
+        const { componentId, closeComponent } = handleModalComponent(queryFn, selectedRow);
+        function search() {}
+        function buyOpen(value: any) {
+            componentId.value = 'postBuying';
+            selectedRow.value = value;
+            console.log(value);
+        }
+        return {
+            isBottom,
+            search,
+            buyOpen,
+            componentId,
+            closeComponent,
+            selectedRow,
+            name: EnumRouterName.warehouse_pre_sale_blocs,
+        };
+    },
+});
+</script>
+<style lang="less">
+</style>

src/views/market/spot_trade/warehouse_pre_sale/warehouse_pre_sale_blocs/setup.ts

@@ -0,0 +1,31 @@
+import { BtnListType } from '@/common/components/btnList/interface';
+import { BuyOrSell } from '@/common/constants/enumCommon';
+
+
+export function handleColumns() {
+    const columns = [
+        { title: '品种', key: 'deliverygoodsname', align: 'center', width: 140 },
+        { title: '商品', key: 'wrtypename', align: 'center', width: 400 },
+        { title: '仓库', key: 'warehousename', align: 'center', width: 200 },
+        { title: '价格', key: 'fixedprice', align: 'center', width: 120 },
+        { title: '议价', key: 'canbargain', align: 'center', width: 80 },
+        { title: '数量', key: 'orderqty', align: 'center' },
+        { title: '整单', key: 'canpart', align: 'center', width: 80 },
+        { title: '挂牌有效期', key: 'validtime', align: 'center', width: 120 },
+        { title: '履约保证金', key: 'marginvalue', align: 'center', width: 120 },
+        { title: '履约方式', key: 'templatename', align: 'center', width: 120 },
+        { title: '挂牌方', key: 'username', align: 'center', width: 120 },
+    ];
+    function getBuyOrSellColumns(type: BuyOrSell) {
+        const title = type === BuyOrSell.buy ? '买' : '卖'
+        return [
+            { title, dataIndex: 'index', key: 'index', width: 80, align: 'center' },
+            ...columns
+        ]
+    }
+    return { getBuyOrSellColumns }
+}
+
+export function filterBtn(btnList: BtnListType[]) {
+    return btnList.filter(e => e.code !== 'warehouse_receipt_trade_blocs_post_buying')
+}

src/views/market/spot_trade/warehouse_receipt_trade/warehouse_receipt_trade_blocs/components/post-buying/index.vue

@@ -145,6 +145,7 @@ import { EnumRouterName } from '@/common/constants/enumRouterName';
 
 import { BuyOrSell } from '@/common/constants/enumCommon';
 import { getCanUseMoney } from '@/services/bus/account';
+import { TempWrOrderQuoteDetail } from '@/views/market/spot_trade/components/post_buying/interface';
 
 export default defineComponent({
     emits: ['cancel', 'update'],
@@ -152,7 +153,7 @@ export default defineComponent({
     components: { Des, Drawer, PlusOutlined, MinusOutlined },
     props: {
         selectedRow: {
-            type: Object as PropType<QueryOrderQuoteMyqQsp>,
+            type: Object as PropType<TempWrOrderQuoteDetail>,
             default: {},
         },
     },

src/views/market/spot_trade/warehouse_receipt_trade/warehouse_receipt_trade_blocs/index.vue

@@ -26,7 +26,7 @@ import { handleModalComponent } from '@/common/setup/asyncComponent';
 import { ref } from 'vue';
 
 export default defineComponent({
-    name: 'warehouse_receipt_trade_blocs',
+    name: EnumRouterName.warehouse_receipt_trade_blocs,
     components: {
         Filter,
         Buy,
@@ -42,6 +42,7 @@ export default defineComponent({
         function search() {}
         function buyOpen(value: any) {
             componentId.value = 'postBuying';
+            selectedRow.value = value;
             console.log(value);
         }
         return {