挂牌点价增加商品显示

src/packages/mobile/views/pricing/trade/Index.vue

@@ -137,9 +137,9 @@
             </template>
         </div>
         <Tabs class="van-tabs--list" v-model:active="active">
-            <template v-for="(item, index) in components" :key="index">
+            <template v-for="(item, index) in components.filter(e => e.show === true)" :key="index">
                 <Tab :title="item.title" :name="item.name">
-                    <component :is="item.component" v-bind="{ goodsCode, goodsid, fromTrade }" @callBack="itemBack"/>
+                    <component :is="item.component" v-bind="{ goodsCode, goodsid, fromTrade, pictureurl }" @callBack="itemBack"/>
                 </Tab>
             </template>
         </Tabs>
@@ -174,6 +174,7 @@ const buildType = getQueryStringToNumber('buildType')
 const orderQty = getQueryStringToNumber('orderQty')
 const futuresStore = useFuturesStore()
 const quote = futuresStore.getGoodsQuote(goodsCode)
+const { pictureurl } = futuresStore.getGoods(goodsCode) ?? {}
 // 小数位以及步进值
 const { decimalplace = 0.0 } = quote.value ?? {}
 const quoteminunit = quote.value?.quoteminunit ?? 1.0
@@ -215,17 +216,26 @@ const itemBack = (isPosition: number, buyorsell: BuyOrSell, tradeId: string, ite
 
 const { componentRef, componentId, openComponent, closeComponent } = useComponent()
 
-const active = shallowRef('position')
+const active = shallowRef(pictureurl != '' ? 'images' : 'cancel')
 
-const components = [{
+const components = [
+{
+    name: 'images',
+    title: t('operation.details'),
+    component: defineAsyncComponent(() => import('./images/Index.vue')),
+    show: pictureurl != ''
+},
+{
     name: 'cancel',
     title: t('quote.pricing.ordercancel'),
     component: defineAsyncComponent(() => import('../trade/components/cancel/Index.vue')),
+    show: true
 },
 {
     name: 'position',
     title: t('quote.pricing.position'),
     component: defineAsyncComponent(() => import('@mobile/views/order/position/components/pricing/list/Index.vue')),
+    show: true
 },
 // {
 //     name: 'holdlb',
@@ -237,6 +247,7 @@ const components = [{
     title: t('pcroute.bottom.bottom_pricing_detail2'),
     component: defineAsyncComponent(() => import('../trade/holdlb2/Index.vue')),
     detail: defineAsyncComponent(() => import('@mobile/views/order/position/components/pricing/detail2/Index.vue')),
+    show: true
 }]
     
 const componentMap = new Map<string, unknown>([

src/packages/mobile/views/pricing/trade/images/Index.vue

@@ -0,0 +1,19 @@
+<template>
+    <app-view class="g-detail">
+        <div class="g-detail__desc" v-if="pictureurl != ''">
+            <img :src="getFileUrl(pictureurl)" alt="" />
+        </div>
+    </app-view>
+</template>
+
+<script lang="ts" setup>
+
+import { getFileUrl } from '@/filters';
+
+defineProps({
+    pictureurl: {
+        type: String,
+        required: true
+    }
+})
+</script>