Merge branch 'master' of http://47.101.159.18:3000/Muchinfo/MTP20_WEB_GLOBAL

src/business/trade/index.ts

@@ -1,6 +1,6 @@
 import { reactive, ref, shallowRef, computed } from 'vue'
 import { v4 } from 'uuid'
-import { ClientType, EBuildType, EDelistingType, EListingSelectType, EOperateType, EOrderDirection, EOrderOperateType, EPriceMode, ETradeMode, EValidType, OrderSrc } from '@/constants/client'
+import { ClientType, EBuildType, EDelistingType, EListingSelectType, EOperateType, EOrderDirection, EOrderOperateType, EPriceMode, EValidType, OrderSrc } from '@/constants/client'
 import { useLoginStore, useAccountStore, useUserStore } from '@/stores'
 import {
     spotPresaleDestingOrder,
@@ -572,6 +572,7 @@ export function useOrder() {
     const formSubmit = async () => {
         try {
             loading.value = true
+
             return await order({
                 data: formData
             })

src/packages/mobile/views/swap/detail/Index.vue

@@ -40,7 +40,7 @@ import { queryTjmdTradeOrderDetail } from '@/services/api/swap'
 
 const componentMap = new Map<string, unknown>([
     ['delisting', defineAsyncComponent(() => import('./components/delisting/Index.vue'))],
-    ['listing', defineAsyncComponent(() => import('./components/listing/Index.vue'))],
+    ['listing', defineAsyncComponent(() => import('./components/delisting/Index.vue'))],
 ])
 
 const { getQueryStringToNumber } = useNavigation()

src/packages/mobile/views/swap/detail/components/delisting/Index.less

@@ -0,0 +1,13 @@
+.swap-delisting {
+  &__form {
+      .van-stepper {
+          display: flex;
+          align-items: center;
+          width: 100%;
+
+          &__input {
+              flex: 1;
+          }
+      }
+  }
+}

src/packages/mobile/views/swap/detail/components/delisting/Index.vue

@@ -1,13 +1,91 @@
 <template>
     <app-popup :title="'摘牌'" v-model:show="showModal" :refresh="refresh">
+        <Form class="swap-delisting__form" ref="formRef" @submit="onSubmit">
+            <Field label="交易账户">
+                <template #input>
+                    <span>{{ accountStore.accountId }}</span>
+                </template>
+            </Field>
+            <Field label="挂牌方">
+                <template #input>
+                    <span>{{ '******' }}</span>
+                </template>
+            </Field>
+            <Field label="价格类型">
+                <template #input>
+                    <RadioGroup v-model="priceMove" direction='horizontal'>
+                        <Radio :name="2">固定价</Radio>
+                        <Radio :name="3">浮动价</Radio>
+                    </RadioGroup>
+                </template>
+            </Field>
+            <Field label="当前价格" v-if="priceMove === 2">
+                <template #input>
+                    <span>{{ '******' }}</span>
+                </template>
+            </Field>
+            <Field label="浮动价格" v-if="priceMove === 3">
+                <template #input>
+                    <span>{{ '******' }}</span>
+                </template>
+            </Field>
+            <Field label="可摘数量">
+                <template #input>
+                    <span>{{ '******' }}</span>
+                </template>
+            </Field>
+            <Field name="OrderQty" :rules="formRules.OrderQty" label="挂牌数量">
+                <template #input>
+                    <Stepper v-model="formData.OrderQty" theme="round" button-size="22" :auto-fixed="false" integer />
+                </template>
+            </Field>
+            <Field label="挂牌金额" v-if="priceMove === 2">
+                <template #input>
+                    <span>{{ amount.toFixed(2) }}</span>
+                </template>
+            </Field>
+            <Field label="估算金额" v-if="priceMove === 3">
+                <template #input>
+                    <span>{{ amount.toFixed(2) }}</span>
+                </template>
+            </Field>
+            <Field label="履约保证金">
+                <template #input>
+                    <span>{{ permargin.toFixed(2) }}</span>
+                </template>
+            </Field>
+            <Field label="可用资金">
+                <template #input>
+                    <span>{{ accountStore.avaiableMoney.toFixed(2) }}</span>
+                </template>
+            </Field>
+        </Form>
+        <template #footer>
+            <Button type="primary" block round @click="formRef?.submit">摘牌</Button>
+        </template>
     </app-popup>
 </template>
 
 <script lang="ts" setup>
 import { shallowRef } from 'vue'
-import { Form, FormInstance } from 'vant'
+import { Form, FormInstance, Button, Field, RadioGroup, Radio, FieldRule, Stepper} from 'vant'
+import { useAccountStore } from '@/stores'
+import { EPriceMode } from '@/constants/client'
+import { useOrder } from '@/business/trade'
+import { fullloading, dialog } from '@/utils/vant'
+
 import AppPopup from '@mobile/components/base/popup/index.vue'
 
+const accountStore = useAccountStore()
+const { formData, formSubmit} = useOrder()
+
+/// 挂牌金额
+const amount = shallowRef(0.0)
+/// 履约保证金
+const permargin = shallowRef(0.0)
+/// 价格类型
+const priceMove = shallowRef(EPriceMode.PRICEMODE_LIMIT)
+
 const props = defineProps({
     selectedRow: {
         type: Object,
@@ -19,6 +97,60 @@ const formRef = shallowRef<FormInstance>()
 const showModal = shallowRef(true)
 const refresh = shallowRef(false) // 是否刷新父组件数据
 
+
+// 表单验证规则
+const formRules: { [key in keyof Proto.OrderReq]?: FieldRule[] } = {
+    OrderPrice: [{
+        message: '请输入价格',
+        validator: (val) => {
+            if (val) {
+                if (priceMove.value === EPriceMode.PRICEMODE_LIMIT) {
+                    return true
+                }
+                return '请输入挂牌价格'
+            }
+            return false
+        }
+    }],
+    OrderQty: [{
+        message: '请输入挂牌数量',
+        validator: () => {
+            return !!formData.OrderQty
+        }
+    }],
+    MarketMaxSub: [{
+        message: '请输入基差',
+        validator: (val) => {
+            if (val) {
+                if (priceMove.value === EPriceMode.PRICEMODE_FLOAT) {
+                    return !!formData.MarketMaxSub
+                }
+                return '请输入挂牌基差'
+            }
+            return false
+        }
+    }],
+}
+
+// 提交挂牌
+const onSubmit = () => {
+    // GoodsID: goodsid,
+                    // MarketID: marketid,
+                    // BuyOrSell: buyOrSell === EOrderDirection.BUY ? EOrderDirection.SELL : EOrderDirection.BUY,
+                    // RelatedID: orderid,
+                    // PriceMode: priceMode,
+                    // OrderPrice: priceMode === EPriceMode.PRICEMODE_LIMIT ? orderPrice : maxSub,
+                    // OrderQty: orderQty,  
+    fullloading((hideLoading) => {
+        formSubmit().then(() => {
+            hideLoading()
+            dialog('挂牌提交成功。').then(() => closed(true))
+        }).catch((err) => {
+            hideLoading(err, 'fail')
+        })
+    })
+}
+
 // 关闭弹窗
 const closed = (isRefresh = false) => {
     refresh.value = isRefresh

src/packages/mobile/views/swap/detail/components/listing/Index.vue

@@ -1,6 +1,68 @@
 <template>
     <app-popup class="swap-listing" :title="'挂牌'" v-model:show="showModal" :refresh="refresh">
         <Form class="swap-listing__form" ref="formRef" @submit="onSubmit">
+            <Tabs class="van-tabs--list" v-model:active="buyOrSell" :swipe-threshold="2">
+                <Tab title="买挂牌" />
+                <Tab title="卖挂牌" />
+            </Tabs>
+            <Field label="交易账户">
+                <template #input>
+                    <span>{{ accountStore.accountId }}</span>
+                </template>
+            </Field>
+            <Field label="价格类型">
+                <template #input>
+                    <RadioGroup v-model="priceMove" direction='horizontal'>
+                        <Radio :name="2">固定价</Radio>
+                        <Radio :name="3">浮动价</Radio>
+                    </RadioGroup>
+                </template>
+            </Field>
+            <Field name="OrderPrice" :rules="formRules.OrderPrice" label="挂牌价格" v-if="priceMove === 2">
+                <template #input>
+                    <Stepper v-model="formData.OrderPrice" theme="round" button-size="22" :auto-fixed="false" integer />
+                </template>
+            </Field>
+            <Field name="OrderPrice" :rules="formRules.MarketMaxSub" label="点差" v-if="priceMove === 3">
+                <template #input>
+                    <Stepper v-model="formData.OrderQty" theme="round" button-size="22" :auto-fixed="false" integer />
+                </template>
+            </Field>
+            <Field label="估算价格" v-if="priceMove === 3">
+                <template #input>
+                    <span>0.0</span>
+                </template>
+            </Field>
+            <Field label="参考价格" v-if="priceMove === 2">
+                <template #input>
+                    <span>0.0</span>
+                </template>
+            </Field>
+            <Field name="OrderQty" :rules="formRules.OrderQty" label="挂牌数量">
+                <template #input>
+                    <Stepper v-model="formData.OrderQty" theme="round" button-size="22" :auto-fixed="false" integer />
+                </template>
+            </Field>
+            <Field label="挂牌金额" v-if="priceMove === 2">
+                <template #input>
+                    <span>{{ amount.toFixed(2) }}</span>
+                </template>
+            </Field>
+            <Field label="估算金额" v-if="priceMove === 3">
+                <template #input>
+                    <span>{{ amount.toFixed(2) }}</span>
+                </template>
+            </Field>
+            <Field label="履约保证金">
+                <template #input>
+                    <span>{{ permargin.toFixed(2) }}</span>
+                </template>
+            </Field>
+            <Field label="可用资金">
+                <template #input>
+                    <span>{{ accountStore.avaiableMoney.toFixed(2) }}</span>
+                </template>
+            </Field>
         </Form>
         <template #footer>
             <Button type="primary" block round @click="formRef?.submit">确定</Button>
@@ -9,17 +71,90 @@
 </template>
 
 <script lang="ts" setup>
-import { shallowRef } from 'vue'
-import { Form, FormInstance, Button } from 'vant'
+import { shallowRef, PropType } from 'vue'
+import { Form, FormInstance, Button, FieldRule, Field, Tab, Tabs, Stepper, Radio, RadioGroup } from 'vant'
+import { useOrder } from '@/business/trade'
+import { fullloading, dialog } from '@/utils/vant'
+import { useAccountStore } from '@/stores'
+import { EOrderDirection, EPriceMode } from '@/constants/client'
+
 import AppPopup from '@mobile/components/base/popup/index.vue'
 
+const accountStore = useAccountStore()
 const formRef = shallowRef<FormInstance>()
 const showModal = shallowRef(true)
 const refresh = shallowRef(false) // 是否刷新父组件数据
+/// 履约保证金
+const permargin = shallowRef(0.0)
+/// 买卖方向
+const buyOrSell = shallowRef(0)
+/// 挂牌金额
+const amount = shallowRef(0.0)
+/// 价格类型
+const priceMove = shallowRef(EPriceMode.PRICEMODE_LIMIT)
+
+const { formData, formSubmit } = useOrder()
+
+const props = defineProps({
+    selectedRow: {
+        type: Object as PropType<Model.TjmdTradeOrderDetailRsp>,
+        required: true,
+    }
+})
 
 // 提交挂牌
 const onSubmit = () => {
-    console.log()
+    /// 买卖方向
+    const { goodsid = 0 } = props.selectedRow ?? {}
+
+    formData.BuyOrSell = buyOrSell.value === 0 ? EOrderDirection.SELL : EOrderDirection.BUY,
+    formData.OrderPrice = priceMove.value === EPriceMode.PRICEMODE_LIMIT ? formData.OrderPrice : 0.0
+    formData.PriceMode = priceMove.value
+    formData.MarketMaxSub = priceMove.value === EPriceMode.PRICEMODE_LIMIT ? 0.0 : formData.MarketMaxSub
+    formData.GoodsID = goodsid
+
+    fullloading((hideLoading) => {
+        formSubmit().then(() => {
+            hideLoading()
+            dialog('挂牌提交成功。').then(() => closed(true))
+        }).catch((err) => {
+            hideLoading(err, 'fail')
+        })
+    })
+}
+
+// 表单验证规则
+const formRules: { [key in keyof Proto.OrderReq]?: FieldRule[] } = {
+    OrderPrice: [{
+        message: '请输入价格',
+        validator: (val) => {
+            if (val) {
+                if (priceMove.value === EPriceMode.PRICEMODE_LIMIT) {
+                    return true
+                }
+                return '请输入挂牌价格'
+            }
+            return false
+        }
+    }],
+    OrderQty: [{
+        message: '请输入挂牌数量',
+        validator: () => {
+            return !!formData.OrderQty
+        }
+    }],
+    MarketMaxSub: [{
+        message: '请输入基差',
+        validator: (val) => {
+            if (val) {
+                if (priceMove.value === EPriceMode.PRICEMODE_FLOAT) {
+                    return !!formData.MarketMaxSub
+                }
+                return '请输入挂牌基差'
+            }
+            return false
+        }
+    }],
 }
 
 // 关闭弹窗