update

src/packages/mobile/views/order/position/components/goods/delivery50/index.vue

@@ -16,7 +16,7 @@
                     <Cell title="持仓均价" :value="formatDecimal(selectedRow.averageprice)" />
                     <Cell title="参考损益">
                         <template #value>
-                            <span :class="closepl ? 'g-price-up' : 'g-price-down'">{{ formatDecimal(closepl) }}</span>
+                            <span :class="selectedRow.closeplColor">{{ formatDecimal(selectedRow.closepl) }}</span>
                         </template>
                     </Cell>
                 </CellGroup>
@@ -41,18 +41,20 @@
 </template>
 
 <script lang="ts" setup>
-import { shallowRef, PropType, computed } from 'vue'
+import { shallowRef, PropType } from 'vue'
 import AppModal from '@/components/base/modal/index.vue'
 import { CellGroup, Cell, Button, FieldRule, Form, Field, Stepper, FormInstance } from 'vant'
-import { getBuyOrSellName, BuyOrSell } from '@/constants/order'
+import { getBuyOrSellName } from '@/constants/order'
 import { formatDecimal } from '@/filters'
 import { useOfflineDelivery } from '@/business/trade'
 import { dialog, fullloading } from '@/utils/vant'
-import { useFuturesStore } from '@/stores'
 
 const props = defineProps({
     selectedRow: {
-        type: Object as PropType<Model.TradePositionRsp>,
+        type: Object as PropType<Model.TradePositionRsp & {
+            closepl: number; // 浮动盈亏
+            closeplColor: string; // 浮动盈亏颜色
+        }>,
         required: true,
     }
 })
@@ -62,15 +64,6 @@ const showModal = shallowRef(true)
 const refresh = shallowRef(false)
 const formRef = shallowRef<FormInstance>()
 const { formSubmit, formData } = useOfflineDelivery()
-const futuresStore = useFuturesStore()
-const quote = futuresStore.getGoodsQuote(props.selectedRow.goodscode)
-
-/// 计算参考损益
-const closepl = computed(() => {
-    const { last = 0 } = quote.value ?? {}
-    const { curpositionqty, curholderamount, agreeunit, buyorsell } = props.selectedRow
-    return (last * curpositionqty * agreeunit - curholderamount) * (buyorsell === BuyOrSell.Buy ? 1 : -1)
-})
 
 // 表单验证规则
 const formRules: { [key: string]: FieldRule[] } = {

src/packages/pc/components/layouts/header/components/setting/index.vue

@@ -13,6 +13,7 @@
                     <el-option label="现价" :value="1" />
                     <el-option label="对手价" :value="2" />
                     <el-option label="实时现价" :value="3" />
+                    <el-option label="实时对手价" :value="4" />
                 </el-select>
             </el-form-item>
         </el-form>

src/packages/pc/views/footer/goods/detail/components/transfer/index.vue

@@ -60,9 +60,13 @@ const futuresStore = useFuturesStore()
 const quote = futuresStore.getGoodsQuote(props.selectedRow.goodscode)
 // 损益
 const closepl = computed(() => {
-    const { last = 0 } = quote.value ?? {}
+    const { presettle = 0, last = 0 } = quote.value ?? {}
     const { holderqty, holderamount, agreeunit, buyorsell } = props.selectedRow
-    return (last * holderqty * agreeunit - holderamount) * (buyorsell === BuyOrSell.Buy ? 1 : -1)
+    const price = last || presettle // 没有最新价取昨结价
+    // 计算市值 = 现价 * 数量 * 合约单位
+    const marketValue = price ? price * holderqty * agreeunit : 0
+
+    return price ? (marketValue - holderamount) * (buyorsell === BuyOrSell.Buy ? 1 : -1) : 0
 })
 
 const { formSubmit, formData, loading } = useOrder()

src/packages/pc/views/footer/goods/position/components/delivery50/index.vue

@@ -27,7 +27,7 @@
                 <span>{{ selectedRow.matchname }}</span>
             </el-form-item>
             <el-form-item label="参考损益">
-                <span :class="handlePriceColor(closepl)">{{ formatDecimal(closepl) }}</span>
+                <span :class="selectedRow.closeplColor">{{ formatDecimal(selectedRow.closepl) }}</span>
             </el-form-item>
             <el-form-item prop="DeliveryLot" label="交收数量">
                 <el-input-number placeholder="请输入数量" v-model="formData.DeliveryLot" :precision="0"
@@ -45,17 +45,19 @@
 </template>
 
 <script lang="ts" setup>
-import { ref, PropType, computed } from 'vue'
+import { ref, PropType } from 'vue'
 import { ElMessage, FormInstance, FormRules } from 'element-plus'
 import { useOfflineDelivery } from '@/business/trade'
-import { useFuturesStore } from '@/stores'
-import { getBuyOrSellName, BuyOrSell } from '@/constants/order'
-import { formatDecimal, handlePriceColor } from '@/filters'
+import { getBuyOrSellName } from '@/constants/order'
+import { formatDecimal } from '@/filters'
 import AppDrawer from '@pc/components/base/drawer/index.vue'
 
 const props = defineProps({
     selectedRow: {
-        type: Object as PropType<Model.TradePositionRsp>,
+        type: Object as PropType<Model.TradePositionRsp & {
+            closepl: number; // 浮动盈亏
+            closeplColor: string; // 浮动盈亏颜色
+        }>,
         required: true,
     }
 })
@@ -64,15 +66,6 @@ const { formSubmit, formData, loading } = useOfflineDelivery()
 const show = ref(true)
 const refresh = ref(false)
 const formRef = ref<FormInstance>()
-const futuresStore = useFuturesStore()
-const quote = futuresStore.getGoodsQuote(props.selectedRow.goodscode)
-
-/// 计算参考损益
-const closepl = computed(() => {
-    const { last = 0 } = quote.value ?? {}
-    const { curpositionqty, curholderamount, agreeunit, buyorsell } = props.selectedRow
-    return (last * curpositionqty * agreeunit - curholderamount) * (buyorsell === BuyOrSell.Buy ? 1 : -1)
-})
 
 // 表单验证规则
 const formRules: FormRules = {
@@ -115,5 +108,4 @@ const onSubmit = () => {
     })
 
 }
-
 </script>

src/packages/pc/views/footer/goods/position/components/transfer/index.vue

@@ -24,8 +24,8 @@
             <el-form-item label="持仓均价">
                 <span>{{ formatDecimal(selectedRow.averageprice, selectedRow.decimalplace) }}</span>
             </el-form-item>
-            <el-form-item label="浮动盈亏">
-                <span :class="handlePriceColor(closepl)">{{ formatDecimal(closepl) }}</span>
+            <el-form-item label="参考损益">
+                <span :class="selectedRow.closeplColor">{{ formatDecimal(selectedRow.closepl) }}</span>
             </el-form-item>
             <el-form-item prop="OrderQty" label="转让数量">
                 <div class="g-qty-group">
@@ -52,10 +52,10 @@
 </template>
 
 <script lang="ts" setup>
-import { ref, PropType, computed, onMounted } from 'vue'
+import { ref, PropType, onMounted } from 'vue'
 import { ElMessage, FormInstance, FormRules } from 'element-plus'
 import { useOrder } from '@/business/trade'
-import { formatDecimal, handlePriceColor, parsePercent } from '@/filters'
+import { formatDecimal, parsePercent } from '@/filters'
 import { getBuyOrSellName, BuyOrSell } from '@/constants/order'
 import { useFuturesStore } from '@/stores'
 import { EBuildType, EDelistingType, EListingSelectType, EOrderOperateType, EPriceMode, EValidType } from '@/constants/client'
@@ -63,19 +63,16 @@ import AppDrawer from '@pc/components/base/drawer/index.vue'
 
 const props = defineProps({
     selectedRow: {
-        type: Object as PropType<Model.TradePositionRsp>,
+        type: Object as PropType<Model.TradePositionRsp & {
+            closepl: number; // 浮动盈亏
+            closeplColor: string; // 浮动盈亏颜色
+        }>,
         required: true
     }
 })
 
 const futuresStore = useFuturesStore()
 const quote = futuresStore.getGoodsQuote(props.selectedRow.goodscode)
-// 损益
-const closepl = computed(() => {
-    const { last = 0 } = quote.value ?? {}
-    const { curpositionqty, curholderamount, agreeunit, buyorsell } = props.selectedRow
-    return (last * curpositionqty * agreeunit - curholderamount) * (buyorsell === BuyOrSell.Buy ? 1 : -1)
-})
 
 const { formSubmit, formData, loading } = useOrder()
 const show = ref(true)

src/packages/pc/views/footer/goods/position/index.vue

@@ -61,7 +61,7 @@ const tableColumns = shallowRef<Model.TableColumn[]>([
     { prop: 'lastprice', label: '现价' },
     { prop: 'curholderamount', label: '持仓金额' },
     { prop: 'marketValue', label: '市值' },
-    { prop: 'closepl', label: '浮动盈亏' },
+    { prop: 'closepl', label: '参考损益' },
     { prop: 'operate', label: '操作', fixed: 'right', width: 140 },
 ])
 

src/packages/pc/views/market/trade/goods/list/listing/index.vue

@@ -22,7 +22,7 @@
                 <el-form-item prop="OrderPrice" label="价格">
                     <div class="el-form-item--col">
                         <el-input-number ref="priceRef" placeholder="请输入" :min="0" :step="priceStep"
-                            :precision="selectedGoods?.decimalplace" :disabled="orderPriceType === 3" v-model="orderPrice"
+                            :precision="selectedGoods?.decimalplace" :disabled="isDisabled" v-model="formData.OrderPrice"
                             @keyup.enter="qtyInputFocus" />
                         <div v-if="selectedGoods">
                             <div class="row-price g-price-up">
@@ -116,28 +116,8 @@ const sellQty = computed(() => getOrderQty(BuyOrSell.Sell, selectedGoodsId.value
 // 价格类型
 const orderPriceType = computed(() => settingStore.getSettingValue('orderPriceType'))
 
-// 订单价格
-const orderPrice = computed({
-    get: () => {
-        const { last, bid, ask, presettle = 0 } = selectedGoods.value ?? {}
-        // 1=现价，2=对手价，3=实时价
-        switch (orderPriceType.value) {
-            case 2:
-                if (formData.BuyOrSell === BuyOrSell.Buy) {
-                    return ask || last || presettle
-                } else {
-                    return bid || last || presettle
-                }
-            case 3:
-                return last || presettle
-            default:
-                return formData.OrderPrice
-        }
-    },
-    set: (val) => {
-        formData.OrderPrice = val
-    }
-})
+// 是否禁用价格输入
+const isDisabled = computed(() => [3, 4].includes(orderPriceType.value))
 
 const formRules: FormRules = {
     OrderPrice: [{
@@ -185,7 +165,7 @@ const onRadioChange = (value: number) => {
 
 const onPriceClick = (buyorsell: BuyOrSell, value: number) => {
     formData.BuyOrSell = buyorsell === BuyOrSell.Sell ? BuyOrSell.Buy : BuyOrSell.Sell
-    if (orderPriceType.value === 3) {
+    if (isDisabled.value) {
         qtyInputFocus()
     } else {
         formData.OrderPrice = value
@@ -218,7 +198,7 @@ const onSubmit = (buildType: number) => {
                     ElMessage.error('挂牌失败：' + err)
                 }).finally(() => {
                     const focusType = settingStore.getSettingValue('orderFocusType')
-                    if (focusType === 2 || orderPriceType.value === 3) {
+                    if (focusType === 2 || isDisabled.value) {
                         qtyInputFocus()
                     } else {
                         priceInputFocus()
@@ -229,14 +209,40 @@ const onSubmit = (buildType: number) => {
     })
 }
 
-const goodsChange = () => {
-    const { last = 0, presettle = 0 } = selectedGoods.value ?? {}
-    formData.OrderPrice = last || presettle
-    formData.OrderQty = qtyStep.value
+const getOrderPrice = () => {
+    const { last, bid, ask, presettle = 0 } = selectedGoods.value ?? {}
+    const price = last || presettle
+    // 1=现价，2=对手价，3=实时价，4=实时对手价
+    switch (orderPriceType.value) {
+        case 1:
+        case 3:
+            return price
+        case 2:
+        case 4:
+            if (formData.BuyOrSell === BuyOrSell.Buy) {
+                return ask || price
+            } else {
+                return bid || price
+            }
+        default:
+            return 0
+    }
 }
 
-watch(selectedGoodsId, () => goodsChange())
-onMounted(() => goodsChange())
+watch([() => selectedGoodsId, () => orderPriceType.value], () => {
+    formData.OrderPrice = getOrderPrice()
+})
+
+watch([() => formData.BuyOrSell, () => selectedGoods.value?.last, () => selectedGoods.value?.bid, () => selectedGoods.value?.ask], () => {
+    if (isDisabled.value) {
+        formData.OrderPrice = getOrderPrice()
+    }
+})
+
+onMounted(() => {
+    formData.OrderPrice = getOrderPrice()
+    formData.OrderQty = qtyStep.value
+})
 </script>
 
 <style lang="less">

src/stores/modules/setting.ts

@@ -22,7 +22,7 @@ export const useSettingStore = defineStore(() => {
     }))
 
     // 获取设置项值
-    const getSettingValue = (key: keyof Omit<Model.LocalSetting, 'loginId'>) => {
+    const getSettingValue = <K extends keyof Omit<Model.LocalSetting, 'loginId'>>(key: K) => {
         return userSetting.value[key]
     }
 

src/types/model/common.d.ts

@@ -331,7 +331,7 @@ declare global {
             showOrderSuccessDialog: boolean; // 挂/摘牌成功使用对话框提示
             showOrderFailDialog: boolean; // 挂/摘牌失败使用对话框提示
             orderFocusType: number; // 下单后默认焦点对象，1=价格，2=数量
-            orderPriceType: number; // 下单默认价格类型，1=现价，2=对手价，3=实时价
+            orderPriceType: number; // 下单默认价格类型，1=现价，2=对手价，3=实时价，4=实时对手价
         }
     }
 }