修改 贸易圈挂牌求购

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

@@ -1,156 +1,166 @@
 <template>
-    <!--仓单贸易 贸易圈挂牌 挂牌求购 -->
-    <Drawer :title="'挂牌求购'" :placement="'right'" :visible="visible" @cancel="cancel" class="top486">
-        <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" class="inputIconBox">
-                                <a-input-number
-                                    class="commonInput"
-                                    style="width: 260px"
-                                    :min="0"
-                                    v-model:value="formState.FixedPrice"
-                                />
-                                <MinusOutlined />
-                                <PlusOutlined />
-                                <a-checkbox class="commonCheckbox" v-model:checked="priceCheck">可议价</a-checkbox>
-                            </a-form-item>
-                            <!-- <a-form-item label="挂牌价格" name="FixedPrice" class="inputIconBox">
+  <!--仓单贸易 贸易圈挂牌 挂牌求购 -->
+  <Drawer :title="'挂牌求购'"
+          :placement="'right'"
+          :visible="visible"
+          @cancel="cancel"
+          class="top486">
+    <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"
+                           class="inputIconBox">
+                <a-input-number class="commonInput"
+                                style="width: 260px"
+                                :min="0"
+                                v-model:value="formState.FixedPrice" />
+                <MinusOutlined @click="decreasePrice" />
+                <PlusOutlined @click="increasePrice" />
+                <a-checkbox class="commonCheckbox"
+                            v-model:checked="priceCheck">可议价</a-checkbox>
+              </a-form-item>
+              <!-- <a-form-item label="挂牌价格" name="FixedPrice" class="inputIconBox">
                                 <a-input-number class="commonInput" style="width: 260px" :min="0" v-model:value="formState.FixedPrice" />
                                 <MinusOutlined />
                                 <PlusOutlined  />
                                 <a-checkbox v-model:checked="priceCheck" class="commonCheckbox">可议价</a-checkbox>
                             </a-form-item>-->
-                        </a-col>
-                        <a-col :span="24">
-                            <a-form-item label="挂牌数量" name="OrderQty" class="inputIconBox">
-                                <a-input-number
-                                    class="commonInput"
-                                    style="width: 260px"
-                                    :min="0"
-                                    v-model:value="formState.OrderQty"
-                                />
-                                <MinusOutlined />
-                                <PlusOutlined />
-                                <span class="input-enumdicname">{{selectedRow.enumdicname}}</span>
-                                <a-checkbox v-model:checked="numCheck" class="commonCheckbox">整单</a-checkbox>
-                            </a-form-item>
-                        </a-col>
+            </a-col>
+            <a-col :span="24">
+              <a-form-item label="挂牌数量"
+                           name="OrderQty"
+                           class="inputIconBox">
+                <a-input-number class="commonInput"
+                                style="width: 260px"
+                                :min="0"
+                                v-model:value="formState.OrderQty" />
+                <MinusOutlined @click="decreaseNumber" />
+                <PlusOutlined @click="increaseNumber" />
+                <span class="input-enumdicname">{{selectedRow.enumdicname}}</span>
+                <a-checkbox v-model:checked="numCheck"
+                            class="commonCheckbox">整单</a-checkbox>
+              </a-form-item>
+            </a-col>
 
-                        <a-col :span="24" v-if="!numCheck">
-                            <a-form-item label="起摘数量" name="delistingQty">
-                                <a-input-number
-                                    class="commonInput"
-                                    v-model:value="formState.delistingQty"
-                                    :min="0"
-                                    style="width: 260px"
-                                />
-                                <span class="input-enumdicname">{{selectedRow.enumdicname}}</span>
-                            </a-form-item>
-                        </a-col>
-                        <a-col :span="24">
-                            <a-form-item label="履约保证金" name="margin">
-                                <a-input-number
-                                    class="commonInput"
-                                    v-model:value="formState.margin"
-                                    :min="0"
-                                    style="width: 260px"
-                                />
-                                <span class="input-enumdicname">%</span>
-                            </a-form-item>
-                        </a-col>
-                        <a-col :span="24">
-                            <a-form-item label="挂牌有效期" name="DeliveryMonth" class="inputIconBox">
-                                <a-date-picker
-                                    style="width: 260px"
-                                    v-model:value="formState.DeliveryMonth"
-                                    :allowClear="false"
-                                    class="commonDatePicker dialogDatePicker"
-                                />
-                            </a-form-item>
-                        </a-col>
+            <a-col :span="24"
+                   v-if="!numCheck">
+              <a-form-item label="起摘数量"
+                           name="delistingQty">
+                <a-input-number class="commonInput"
+                                v-model:value="formState.delistingQty"
+                                :min="0"
+                                style="width: 260px" />
+                <span class="input-enumdicname">{{selectedRow.enumdicname}}</span>
+              </a-form-item>
+            </a-col>
+            <a-col :span="24">
+              <a-form-item label="履约保证金"
+                           name="margin">
+                <a-input-number class="commonInput"
+                                v-model:value="formState.margin"
+                                :min="0"
+                                style="width: 260px" />
+                <span class="input-enumdicname">%</span>
+              </a-form-item>
+            </a-col>
+            <a-col :span="24">
+              <a-form-item label="挂牌有效期"
+                           name="DeliveryMonth"
+                           class="inputIconBox">
+                <a-date-picker 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="履约方式" class="inputIconBox">
-                                <span
-                                    class="clickBox"
-                                    @click="openPermance"
-                                >{{selectedPermance ? selectedPermance.templatename : '选择履约模板'}}</span>
-                                <svg
-                                    class="icon svg-icon"
-                                    aria-hidden="true"
-                                    @click="openPermance"
-                                >
-                                    <use xlink:href="#icon-moban" />
-                                </svg>
-                            </a-form-item>
-                        </a-col>
-                        <a-col :span="24">
-                            <a-form-item label="指定朋友" class="inputIconBox">
-                                <span
-                                    class="clickBox"
-                                    @click="openFriend"
-                                >{{frineds ? `已选${frineds.length}人` : '选择朋友'}}</span>
-                                <svg class="icon svg-icon" aria-hidden="true" @click="openFriend">
-                                    <use xlink:href="#icon-pengyou1" />
-                                </svg>
-                                <a-checkbox class="commonCheckbox">不限</a-checkbox>
-                            </a-form-item>
-                        </a-col>
-                        <a-col :span="24">
-                            <a-form-item label="挂牌金额">
-                                <span class="white ml8">{{getMoney()}}</span>
-                            </a-form-item>
-                        </a-col>
-                        <a-col :span="24">
-                            <a-form-item label="履约保证金">
-                                <span class="white ml8">{{getMargin()}}</span>
-                            </a-form-item>
-                        </a-col>
-                        <a-col :span="24">
-                            <a-form-item label="可用资金">
-                                <span class="white ml8">{{getCanUseMoney(getSelectedAccount())}}</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>
+            <a-col :span="24">
+              <a-form-item label="履约方式"
+                           class="inputIconBox">
+                <span class="clickBox"
+                      @click="openPermance">{{formState.permanceTempName ? formState.permanceTempName  : '选择履约模板'}}</span>
+                <svg class="icon svg-icon"
+                     aria-hidden="true"
+                     @click="openPermance">
+                  <use xlink:href="#icon-moban" />
+                </svg>
+              </a-form-item>
+            </a-col>
+            <a-col :span="24">
+              <a-form-item label="指定朋友"
+                           class="inputIconBox">
+                <span class="clickBox"
+                      @click="openFriend">{{frineds ? `已选${frineds.length}人` : '选择朋友'}}</span>
+                <svg class="icon svg-icon"
+                     aria-hidden="true"
+                     @click="openFriend">
+                  <use xlink:href="#icon-pengyou1" />
+                </svg>
+                <a-checkbox class="commonCheckbox">不限</a-checkbox>
+              </a-form-item>
+            </a-col>
+            <a-col :span="24">
+              <a-form-item label="挂牌金额">
+                <span class="white ml8">{{getMoney()}}</span>
+              </a-form-item>
+            </a-col>
+            <a-col :span="24">
+              <a-form-item label="履约保证金">
+                <span class="white ml8">{{getMargin()}}</span>
+              </a-form-item>
+            </a-col>
+            <a-col :span="24">
+              <a-form-item label="可用资金">
+                <span class="white ml8">{{getCanUseMoney(getSelectedAccount())}}</span>
+              </a-form-item>
+            </a-col>
+          </a-row>
         </div>
-    </Drawer>
-    <!-- 选择朋友 -->
-    <Friend v-if="showFriend" @cancel="chooseFriend" @update="chooseFriend" />
-    <!-- 选择履约模板 -->
-    <Permance v-if="showPermance" @cancel="choosePermance" @update="choosePermance" />
+        <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>
+  <!-- 选择朋友 -->
+  <Friend v-if="showFriend"
+          @cancel="chooseFriend"
+          @update="chooseFriend" />
+  <!-- 选择履约模板 -->
+  <Permance v-if="showPermance"
+            @cancel="choosePermance"
+            @update="choosePermance" />
 </template>
 
 <script lang="ts">
-import { defineComponent, PropType, ref } from 'vue';
+import { defineComponent, PropType, ref, UnwrapRef } from 'vue';
 import { Des } from '@/common/components/commonDes';
 import { _closeModal } from '@/common/setup/modal/modal';
 import { ModalEnum } from '@/common/constants/modalNameEnum';
@@ -160,7 +170,7 @@ 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 { v3, v4 as uuidv4 } from 'uuid';
 import moment, { Moment } from 'moment';
 import { getMarketRunByTradeMode } from '@/services/bus/market';
 import { QueryOrderQuoteMyqQsp, QueryPermancePlanTmpRsp, WrOrderQuote } from '@/services/go/wrtrade/interface';
@@ -175,6 +185,103 @@ import { TempWrOrderQuoteDetail } from '@/views/market/spot_trade/components/pos
 import Friend from './friend.vue';
 import Permance from './permancePlanTmp.vue';
 import { message } from 'ant-design-vue';
+import { computed } from '@vue/runtime-core';
+
+// 价格
+const usePrice = (formState: UnwrapRef<FormParam>) => {
+    const priceCheck = ref<boolean>(false); // 是否可议价
+    function increasePrice() {
+        formState.FixedPrice++;
+    }
+    function decreasePrice() {
+        if (formState.FixedPrice) {
+            formState.FixedPrice--;
+        }
+    }
+    return { priceCheck, increasePrice, decreasePrice };
+};
+
+// 数量
+const useNumber = (formState: UnwrapRef<FormParam>) => {
+    const numCheck = ref<boolean>(false); // 是否整单
+    function increaseNumber() {
+        formState.OrderQty++;
+    }
+    function decreaseNumber() {
+        if (formState.OrderQty) {
+            formState.OrderQty--;
+        }
+    }
+    return { numCheck, increaseNumber, decreaseNumber };
+};
+
+// 交易账号
+const useAccount = (formState: UnwrapRef<FormParam>) => {
+    // 资金账号
+    const accountList = getAccountTypeList([2]);
+    if (accountList.length) {
+        formState.accountid = accountList[0].accountid;
+    }
+    function getSelectedAccount() {
+        return accountList.find((e) => e.accountid === formState.accountid);
+    }
+    return { getSelectedAccount };
+};
+
+// 金额
+const useMoney = (formState: UnwrapRef<FormParam>) => {
+    // 挂牌金额
+    function getMoney() {
+        let result = 0;
+        const { FixedPrice, OrderQty } = formState;
+        if (FixedPrice && OrderQty) {
+            result = FixedPrice * OrderQty;
+        }
+        return result ? result.toFixed(2) : '--';
+    }
+    // 履约保证金
+    function getMargin() {
+        let result = 0;
+        const { FixedPrice, OrderQty, margin } = formState;
+        if (FixedPrice && OrderQty && margin) {
+            result = (FixedPrice * OrderQty * margin) / 100;
+        }
+        return result ? result.toFixed(2) : '--';
+    }
+    return { getMoney, getMargin };
+};
+
+// 选择朋友
+const useFriends = (formState: UnwrapRef<FormParam>) => {
+    const friendCheck = ref<boolean>(false); // 是否不限好友
+    const showFriend = ref<boolean>(false);
+    function chooseFriend(value: number[] | false) {
+        if (value) {
+            formState.friends = value;
+        }
+        showFriend.value = false;
+    }
+    function openFriend() {
+        showFriend.value = true;
+    }
+    return { friendCheck, showFriend, chooseFriend, openFriend };
+};
+
+// 履约模板
+const usePermaceTemp = (formState: UnwrapRef<FormParam>) => {
+    const showPermance = ref<boolean>(false);
+    function choosePermance(value: QueryPermancePlanTmpRsp | false) {
+        if (value) {
+            formState.permanceTempName = value.templatename;
+            formState.permaceTempId = value.autoid;
+        }
+        showPermance.value = false;
+    }
+    function openPermance() {
+        showPermance.value = true;
+    }
+    return { showPermance, choosePermance, openPermance };
+};
 
 export default defineComponent({
     emits: ['cancel', 'update'],
@@ -188,63 +295,30 @@ export default defineComponent({
     },
     setup(props, context) {
         const { visible, cancel } = _closeModal(context);
+        // 表单
         const { rules, formState, formRef } = handleForm();
         // 选择朋友
-        const { show: showFriend, selected: frineds, close: chooseFriend, open: openFriend } = hanldeOpenAndCloseComponent<number[]>();
+        const { friendCheck, showFriend, chooseFriend, openFriend } = useFriends(formState);
         // 履约模板
-        const { show: showPermance, selected: selectedPermance, close: choosePermance, open: openPermance } = hanldeOpenAndCloseComponent<QueryPermancePlanTmpRsp>();
+        const { showPermance, choosePermance, openPermance } = usePermaceTemp(formState);
         const loading = ref<boolean>(false);
-        // 资金账号
-        const accountList = getAccountTypeList([2]);
-        if (accountList.length) {
-            formState.accountid = accountList[0].accountid;
-        }
-        //
-        const priceCheck = ref<boolean>(false); // 是否可议价
-        const numCheck = ref<boolean>(false); // 是否整单
-        const friendCheck = ref<boolean>(false); // 是否不限好友
-        function getSelectedAccount() {
-            return accountList.find((e) => e.accountid === formState.accountid);
-        }
-        // 挂牌金额
-        function getMoney() {
-            let result = 0;
-            const { FixedPrice, OrderQty } = formState;
-            if (FixedPrice && OrderQty) {
-                result = FixedPrice * OrderQty;
-            }
-            return result ? result.toFixed(2) : '--';
-        }
-        // 履约保证金
-        function getMargin() {
-            let result = 0;
-            const { FixedPrice, OrderQty, margin } = formState;
-            if (FixedPrice && OrderQty && margin) {
-                result = (FixedPrice * OrderQty * margin) / 100;
-            }
-            return result ? result.toFixed(2) : '--';
-        }
+        // 摘牌数量
+        const { numCheck, increaseNumber, decreaseNumber } = useNumber(formState);
         function submit() {
-            if (!selectedPermance) {
+            if (!formState.permanceTempName) {
                 message.error('请选择履约模板');
                 return;
             }
-            if (!frineds) {
-                message.error('请选择朋友');
-                return;
+            if (!friendCheck.value) {
+                if (formState.friends.length === 0) {
+                    message.error('请选择朋友');
+                    return;
+                }
             }
+
             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(), // 客户端流水号
@@ -259,7 +333,7 @@ export default defineComponent({
                         // WRFactorTypeId: '2121626946446000001', // 仓单要素ID(wrholdlb的WRFactorTypeId字段),卖的时候填写 uint64
                         WRFactorTypeId: props.selectedRow.wrfactortypeid ? props.selectedRow.wrfactortypeid : 0, // 仓单要素ID(wrholdlb的WRFactorTypeId字段),卖的时候填写 uint64
                         IsSpecified: 1, // 是否指定对手 0：不指定 1：指定 uint32
-                        MatchUserIDs: frineds.value, // 仓单贸易对手资金账号ID集合(指定对手时填写) uint32
+                        MatchUserIDs: friendCheck.value ? [] : res.friends, // 仓单贸易对手资金账号ID集合(指定对手时填写) uint32
                         OrderQty: res.OrderQty, // 委托数量(可挂部分数据量) ======
                         DeliveryGoodsID: props.selectedRow.deliverygoodsid, // 交割商品商品ID  // 有仓单求购
                         WRPriceType: 1, // 价格方式 1：固定价 2：浮动价
@@ -270,7 +344,7 @@ export default defineComponent({
                         ValidTime: moment(formState.vidaliteTime).format('YYYY-MM-DD HH:mm:ss'), // 有效期限
                         ClientOrderTime: moment().format('YYYY-MM-DD HH:mm:ss'),
                         FirstRatio: 0, // 首付比例
-                        PerformanceTemplateID: selectedPermance.value?.autoid, // 履约计划模板ID
+                        PerformanceTemplateID: res.permaceTempId, // 履约计划模板ID
                         UserID: getUserId(),
                         OperatorID: getUserId(), // 操作员账号ID
                         BuyOrSell: 0, // 买卖方向 0买1卖
@@ -311,28 +385,22 @@ export default defineComponent({
             submit,
             cancel,
             visible,
-            accountList,
             rules,
             formState,
             formRef,
-            getSelectedAccount,
             getCanUseMoney,
-
-            showFriend,
-            chooseFriend,
-            openFriend,
-            frineds,
-
+            ...usePrice(formState),
+            ...useAccount(formState),
+            ...useMoney(formState),
             showPermance,
             choosePermance,
             openPermance,
-            selectedPermance,
-
-            priceCheck,
             numCheck,
-
-            getMoney,
-            getMargin,
+            increaseNumber,
+            decreaseNumber,
+            showFriend,
+            chooseFriend,
+            openFriend,
         };
     },
 });

src/views/market/spot_trade/warehouse_receipt_trade/warehouse_receipt_trade_blocs/components/post-buying/interface.ts

@@ -8,6 +8,9 @@ export interface FormParam {
     margin: number,
     DeliveryMonth: Moment,
     vidaliteTime: Moment,
+    friends: number[],
+    permanceTempName: string,
+    permaceTempId: number,
 }
 
 export interface PermanceTemp {

src/views/market/spot_trade/warehouse_receipt_trade/warehouse_receipt_trade_blocs/components/post-buying/setup.ts

@@ -10,6 +10,9 @@ const formState: UnwrapRef<FormParam> = reactive({
     margin: 0,
     DeliveryMonth: moment(),
     vidaliteTime: moment(),
+    friends: [],
+    permanceTempName: '',
+    permaceTempId: 0,
 })
 export function handleForm() {
     function validateMargin(value: any, errInfo: string) {