update

src/common/constants/enumOrderComponents.ts

@@ -32,6 +32,7 @@ export enum enumOrderComponents {
 	pre_sale_warehouse_receipt_order_summary = 'pre_sale_warehouse_receipt_order_summary', // 订单汇总
 
 	pre_sale_warehouse_receipt_pending_order = 'pre_sale_warehouse_receipt_pending_order', // 挂单
+	pre_sale_warehouse_receipt_bargain = 'pre_sale_warehouse_receipt_bargain', // 议价单
 
 	pre_sale_warehouse_receipt_designated_deal = 'pre_sale_warehouse_receipt_designated_deal', // 指定成交
 

src/views/order/pre_sale_warehouse_receipt/components/pre_sale_warehouse_receipt_bargain/components/bargain_detail/index.vue

@@ -0,0 +1,210 @@
+<template>
+  <!-- 现货仓单 议价 议价单 -->
+  <Drawer :title="'议价单'"
+          :placement="'bottom'"
+          :visible="visible"
+          @cancel="cancel"
+          width="566px"
+          height="405px">
+    <a-table :columns="columns"
+             class="expandLeftTable"
+             :pagination="false"
+             :expandIcon="expandIcon"
+             :loading="loading"
+             :expandIconAsCell="false"
+             rowKey="applyprice"
+             :data-source="tableList">
+    </a-table>
+    <div>
+
+      <a-button class="ml10 cancelBtn"
+                v-if="isMy()"
+                @click="cacel">撤销</a-button>
+      <template v-else>
+        <a-button class="listedBtn"
+                  @click="submit">确认</a-button>
+        <a-button class="ml10 cancelBtn"
+                  @click="refuse">拒绝</a-button>
+      </template>
+
+    </div>
+  </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, QueryWrTradeBargainApplyReq, WrOrderDetail, 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';
+import { queryTableList } from '@/common/setup/table';
+import { queryQueryWrTradeBargainApply } from '@/services/go/wrtrade';
+import { getSpotWarrantBargainDetailColumns } from '../../setup';
+import { wrBargainNoAgree, wrBargainBack } from '@/services/proto/WrBargain';
+import { _closeModal } from '@/common/setup/modal/modal';
+import { WrBargainBackReq, WrBargainNoAgreeReq } from '@/services/proto/WrBargain/interface';
+import Long from 'long';
+
+export default defineComponent({
+    name: ModalEnum.spot_warrant_bargain_detail,
+    components: { Drawer },
+    emits: ['cancel', 'update'],
+    props: {
+        selectedRow: {
+            type: Object as PropType<WrOrderDetail>,
+            default: {},
+        },
+    },
+    setup(props, context) {
+        // 表格列表数据
+        const { loading, tableList, queryTable } = queryTableList<WrOrderDetail>();
+        const { visible, cancel } = _closeModal(context);
+        const { wrtradeorderid } = props.selectedRow;
+        const param: QueryWrTradeBargainApplyReq = {
+            haswr: 0,
+            wrtradeorderid: wrtradeorderid,
+        };
+        queryTable(queryQueryWrTradeBargainApply, param);
+        // 我对别人的 => 撤销
+        // 别人对我的 => 确认、拒绝
+        const { isMy, getColums } = getSpotWarrantBargainDetailColumns(props.selectedRow);
+        // 确认
+        function submit() {
+            const param: WrBargainNoAgreeReq = {
+                WrBargainID: Long.fromString(wrtradeorderid),
+                Status: 1,
+            };
+            requestResultLoadingAndInfo(wrBargainNoAgree, param, loading, ['确认成功', '确认失败:']).then(() => {
+                cancel(true);
+            });
+        }
+        // 拒绝
+        function refuse() {
+            const param: WrBargainNoAgreeReq = {
+                WrBargainID: Long.fromString(wrtradeorderid),
+                Status: 2,
+            };
+            requestResultLoadingAndInfo(wrBargainNoAgree, param, loading, ['拒绝成功', '拒绝失败:']).then(() => {
+                cancel(true);
+            });
+        }
+        // 撤销
+        function cacel() {
+            const param: WrBargainBackReq = {
+                WrBargainID: Long.fromString(wrtradeorderid),
+            };
+            requestResultLoadingAndInfo(wrBargainBack, param, loading, ['撤销成功', '撤销失败:']).then(() => {
+                cancel(true);
+            });
+        }
+        return {
+            visible: true,
+            columns: getColums(),
+            loading,
+            tableList,
+            isMy,
+            submit,
+            refuse,
+            cacel,
+        };
+    },
+});
+</script>
+
+<style lang="less" scoped>
+.listed {
+    width: 100%;
+    height: 100%;
+    .flex;
+    flex-direction: column;
+    overflow: hidden;
+    .condition {
+        width: 100%;
+        height: 48px;
+        padding: 10px 16px;
+        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;
+        }
+    }
+}
+
+::v-deep.formProgress {
+    width: 140px;
+    // height: 3px;
+    // .rounded-corners(2px);
+    margin-left: 70px;
+    .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-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%);
+    &: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/pre_sale_warehouse_receipt/components/pre_sale_warehouse_receipt_bargain/index.vue

@@ -0,0 +1,120 @@
+<template>
+  <!-- 现货仓单 挂单 -->
+  <section>
+    <a-table :columns="columns"
+             class="srcollYTable expandLeftTable"
+             :scroll="{ x: '100%', y: '190px' }"
+             :pagination="false"
+             :loading="loading"
+             :expandedRowKeys="expandedRowKeys"
+             :customRow="Rowclick"
+             :expandIcon="expandIcon"
+             :expandIconAsCell="false"
+             rowKey="key"
+             :data-source="tableList">
+      <!-- 额外的展开行 -->
+      <template #expandedRowRender="{ record }">
+        <BtnList :btnList="btnList"
+                 :record="record"
+                 class="btn-list-sticky"
+                 @click="openComponent" />
+      </template>
+      <!-- 挂牌有效期 -->
+      <template #validtime="{ text }">
+        <span>{{ formatTime(text, 'd') }}</span>
+      </template>
+      <!-- 挂牌类型 -->
+      <template #buyorsell="{ text }">
+        <span>{{ text ? '买' : '卖' }}</span>
+      </template>
+      <!--  委托状态-->
+      <!-- <template #wrtradeorderstatus="{ record }">
+        <a>{{ getWrTradeOrderStatusName(record.wrtradeorderstatus) }}</a>
+      </template> -->
+      <!-- 挂牌类型 -->
+      <template #wrtradetype="{ record }">
+        <a>{{ getWrOrderTypeName(record.buyorsell, record.wrtradetype) }}</a>
+      </template>
+      <!-- 挂牌价格 -->
+    </a-table>
+    <component :is="componentId"
+               v-if="componentId"
+               :selectedRow="selectedRow"
+               @cancel="closeComponent"></component>
+  </section>
+</template>
+
+<script lang="ts">
+import { enumOrderComponents } from '@/common/constants/enumOrderComponents';
+import { queryTableList, BtnList, defineAsyncComponent, defineComponent, ModalEnum } from '@/common/export/commonTable';
+import { queryQueryWrTradeBargainApply, queryWrOrderDetail } from '@/services/go/wrtrade';
+import { QueryWrOrderDetailReq, QueryWrTradeBargainApplyReq, WrOrderDetail } 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';
+import { getWrOrderTypeName, getWrTradeOrderStatusName } from '@/common/constants/enumsName';
+import { BtnListType } from '@/common/components/btnList/interface';
+import { expandIcon } from '@/common/setup/table/clolumn';
+import { getSpotWarrantBargainColumns } from './setup';
+import { formatTime } from '@/common/methods';
+
+export default defineComponent({
+    name: enumOrderComponents.pre_sale_warehouse_receipt_bargain,
+    components: {
+        BtnList,
+        pre_sale_warehouse_receipt_bargain_detail: defineAsyncComponent(() => import('./components/bargain_detail/index.vue')),
+    },
+    setup() {
+        // 表格列表数据
+        const { loading, tableList, queryTable } = queryTableList<WrOrderDetail>();
+        // 获取列表数据
+        const queryTableAction = () => {
+            const param: QueryWrTradeBargainApplyReq = {
+                haswr: 0,
+            };
+            queryTable(queryQueryWrTradeBargainApply, param);
+        };
+        // 表格通用逻辑
+        const param: ComposeOrderTableParam = {
+            queryFn: queryTableAction,
+            tableName: 'table_pcweb_spot_trade_bottom_spot_warrant_pending_order',
+            recordList: getRecordItemTab(),
+        };
+        const {
+            contextMenu,
+            openContext,
+            closeContext, // 右键
+            expandedRowKeys,
+            selectedRow,
+            Rowclick, // 表格折腾面板数据与单击、双击事件
+            componentId,
+            closeComponent,
+            openComponent, // 控制异步组件
+            btnList, // 表格按钮
+        } = handleComposeOrderTable<WrOrderDetail>(param);
+
+        return {
+            contextMenu,
+            openContext,
+            closeContext, // 右键
+            expandedRowKeys,
+            selectedRow,
+            Rowclick, // 表格折腾面板数据与单击、双击事件
+            componentId,
+            closeComponent,
+            openComponent, // 控制异步组件
+            btnList, // 表格按钮
+            columns: getSpotWarrantBargainColumns(),
+            loading,
+            tableList,
+            getWrTradeOrderStatusName,
+            getWrOrderTypeName,
+            expandIcon,
+            formatTime,
+        };
+    },
+});
+</script>
+
+<style lang="less">
+</style>;

src/views/order/pre_sale_warehouse_receipt/components/pre_sale_warehouse_receipt_bargain/setup.ts

@@ -0,0 +1,38 @@
+import { getUserId } from "@/services/bus/account";
+import { WrOrderDetail } from "@/services/go/wrtrade/interface";
+
+export function getSpotWarrantBargainColumns() {
+    const columns = [
+        { title: '挂牌方', key: 'matchusername', align: 'center', width: 120 },
+        { title: '挂牌类型', key: 'buyorsell', align: 'center', width: 100 },
+        { title: '品种', key: 'deliverygoodsname', align: 'center', width: 200 },
+        { title: '商品', key: 'wrtypename', align: 'center', width: 400 },
+        { title: '仓库', key: 'warehousename', align: 'center', width: 140 },
+        { title: '价格', key: 'fixedprice', align: 'center' },
+        { title: '数量', key: 'orderqty', align: 'center', width: 120 },
+        // { 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: 160 },
+    ];
+    return columns.map(el => {
+        const slots = { customRender: el.key };
+        return { ...el, slots, dataIndex: el.key };
+    })
+}
+
+export function getSpotWarrantBargainDetailColumns(selectedRow: WrOrderDetail) {
+    const columns = [
+        { title: '数量', key: 'applyqty', dataIndex: 'applyqty', align: 'center' },
+        { title: '价格', key: 'applyprice', dataIndex: 'applyprice', align: 'center' },
+        { title: '时间', key: 'applytime', dataIndex: 'applytime', align: 'center', slots: { customRender: 'applytime' } },
+        { title: '状态', key: 'applystatus', dataIndex: 'applystatus', align: 'center' },
+    ];
+    function isMy() {
+        return selectedRow.userid === getUserId();
+    }
+    function getColums() {
+        return isMy() ? columns : [...columns, { title: '议价人', key: 'username', dataIndex: 'username', align: 'center' }]
+    }
+    return { isMy, getColums }
+}

src/views/order/pre_sale_warehouse_receipt/index.vue

@@ -23,6 +23,7 @@ export default defineComponent({
         [enumOrderComponents.pre_sale_warehouse_receipt_designated_deal]: defineAsyncComponent(() => import('./components/pre_sale_warehouse_receipt_designated_deal/index.vue')),
         [enumOrderComponents.pre_sale_warehouse_receipt_order_summary]: defineAsyncComponent(() => import('./components/pre_sale_warehouse_receipt_order_summary/index.vue')),
         [enumOrderComponents.pre_sale_warehouse_receipt_pending_order]: defineAsyncComponent(() => import('./components/pre_sale_warehouse_receipt_pending_order/index.vue')),
+        [enumOrderComponents.pre_sale_warehouse_receipt_bargain]: defineAsyncComponent(() => import('./components/pre_sale_warehouse_receipt_bargain/index.vue')),
     },
     setup() {
         return { ...handleOrderDetailList(enumOrderComponents.pre_sale_warehouse_receipt) };