|
@@ -3,83 +3,89 @@
|
|
|
<template #header>
|
|
<template #header>
|
|
|
<app-navbar title="我的订单" />
|
|
<app-navbar title="我的订单" />
|
|
|
</template>
|
|
</template>
|
|
|
- <div class="g-order-list">
|
|
|
|
|
- <div class="g-order-list__box" v-for="(item, index) in dataList" :key="index">
|
|
|
|
|
- <div class="g-order-list__titlebar">
|
|
|
|
|
- <div class="left">
|
|
|
|
|
- <h5> {{ item.tHDetailEx.buyOrSell === BuyOrSell.Buy ? '买料订单:' : '卖料订单:' }}{{ item.tHDetailEx.tradeID
|
|
|
|
|
- }} </h5>
|
|
|
|
|
|
|
+ <app-pull-refresh ref="pullRefreshRef" v-model:loading="loading" v-model:error="error" v-model:pageIndex="pageIndex"
|
|
|
|
|
+ :page-count="pageCount" @refresh="run">
|
|
|
|
|
+ <div class="g-order-list">
|
|
|
|
|
+ <div class="g-order-list__box" v-for="(item, index) in dataList" :key="index">
|
|
|
|
|
+ <div class="g-order-list__titlebar">
|
|
|
|
|
+ <div class="left">
|
|
|
|
|
+ <h4>
|
|
|
|
|
+ {{ item.tHDetailEx.buyOrSell === BuyOrSell.Buy ? '买料:' : '卖料:' }}
|
|
|
|
|
+ {{ item.goodsCode + '/' + item.goodsName }}
|
|
|
|
|
+ </h4>
|
|
|
|
|
+ </div>
|
|
|
|
|
+ <div class="right">
|
|
|
|
|
+ <span :class="item.tHDetailEx.depositRate >= 0.4 ? 'g-price-up' : ''">
|
|
|
|
|
+ {{ parsePercent(item.tHDetailEx.depositRate) }}
|
|
|
|
|
+ </span>
|
|
|
|
|
+ </div>
|
|
|
</div>
|
|
</div>
|
|
|
- <div class="right">
|
|
|
|
|
- <span :class="item.tHDetailEx.depositRate >= 0.4 ? 'g-price-up' : ''">{{
|
|
|
|
|
- parsePercent(item.tHDetailEx.depositRate) }}</span>
|
|
|
|
|
|
|
+ <div class="g-order-list__content">
|
|
|
|
|
+ <ul>
|
|
|
|
|
+ <li>
|
|
|
|
|
+ <span>订单重量</span>
|
|
|
|
|
+ <span>
|
|
|
|
|
+ {{ item.tHDetailEx.holderQty * item.agreeUnit }}
|
|
|
|
|
+ {{ getGoodsUnitName(item.goodsUnitID) }}
|
|
|
|
|
+ </span>
|
|
|
|
|
+ </li>
|
|
|
|
|
+ <li>
|
|
|
|
|
+ <span>可用重量</span>
|
|
|
|
|
+ <span>
|
|
|
|
|
+ {{ (item.tHDetailEx.holderQty - item.tHDetailEx.freezeQty) * item.agreeUnit }}
|
|
|
|
|
+ {{ getGoodsUnitName(item.goodsUnitID) }}
|
|
|
|
|
+ </span>
|
|
|
|
|
+ </li>
|
|
|
|
|
+ <li>
|
|
|
|
|
+ <span>订单金额</span>
|
|
|
|
|
+ <span>{{ item.tHDetailEx.holderAmount }}</span>
|
|
|
|
|
+ </li>
|
|
|
|
|
+ <li>
|
|
|
|
|
+ <span>订单价格</span>
|
|
|
|
|
+ <span>{{ formatDecimal(item.tHDetailEx.holderPrice) }}</span>
|
|
|
|
|
+ </li>
|
|
|
|
|
+ <li>
|
|
|
|
|
+ <span>已付定金</span>
|
|
|
|
|
+ <span>{{ item.tHDetailEx.payedDeposit }}</span>
|
|
|
|
|
+ </li>
|
|
|
|
|
+ <li>
|
|
|
|
|
+ <span>已补定金</span>
|
|
|
|
|
+ <span>{{ handleNumberValue(item.tHDetailEx.restockDeposit) }}</span>
|
|
|
|
|
+ </li>
|
|
|
|
|
+ <li>
|
|
|
|
|
+ <span>订单天数</span>
|
|
|
|
|
+ <span>{{ item.tHDetailEx.holdDays }}天</span>
|
|
|
|
|
+ </li>
|
|
|
|
|
+ <li>
|
|
|
|
|
+ <span>滞纳金</span>
|
|
|
|
|
+ <span>{{ handleNumberValue(item.tHDetailEx.callAteFee) }}</span>
|
|
|
|
|
+ </li>
|
|
|
|
|
+ </ul>
|
|
|
|
|
+ </div>
|
|
|
|
|
+ <div class="g-order-list__btnbar">
|
|
|
|
|
+ <Button size="small" @click="showComponent('detail', item)" round>详情</Button>
|
|
|
|
|
+ <Button size="small" @click="showComponent('supplement', item)" round>补充</Button>
|
|
|
|
|
+ <Button size="small" @click="showComponent('delivery', item)" round>交收</Button>
|
|
|
|
|
+ <Button size="small" @click="showComponent('closeholder', item)" round>转让</Button>
|
|
|
</div>
|
|
</div>
|
|
|
- </div>
|
|
|
|
|
- <div class="g-order-list__content">
|
|
|
|
|
- <ul>
|
|
|
|
|
- <li>
|
|
|
|
|
- <span>订单重量:</span>
|
|
|
|
|
- <span>{{ item.tHDetailEx.holderQty * item.agreeUnit }}{{ getGoodsUnitName(item.goodsUnitID)
|
|
|
|
|
- }}</span>
|
|
|
|
|
- </li>
|
|
|
|
|
- <li>
|
|
|
|
|
- <span>可用重量:</span>
|
|
|
|
|
- <span>{{ (item.tHDetailEx.holderQty - item.tHDetailEx.freezeQty) * item.agreeUnit }}{{
|
|
|
|
|
- getGoodsUnitName(item.goodsUnitID) }}</span>
|
|
|
|
|
- </li>
|
|
|
|
|
- <li>
|
|
|
|
|
- <span>订单金额:</span>
|
|
|
|
|
- <span>{{ item.tHDetailEx.holderAmount }}</span>
|
|
|
|
|
- </li>
|
|
|
|
|
- <li>
|
|
|
|
|
- <span>订单价格:</span>
|
|
|
|
|
- <span>{{ formatDecimal(item.tHDetailEx.holderPrice) }}</span>
|
|
|
|
|
- </li>
|
|
|
|
|
- <li>
|
|
|
|
|
- <span>已付定金:</span>
|
|
|
|
|
- <span>{{ item.tHDetailEx.payedDeposit }}</span>
|
|
|
|
|
- </li>
|
|
|
|
|
- <li>
|
|
|
|
|
- <span>已补定金:</span>
|
|
|
|
|
- <span>{{ handleNumberValue(item.tHDetailEx.restockDeposit) }}</span>
|
|
|
|
|
- </li>
|
|
|
|
|
- <li>
|
|
|
|
|
- <span>订单天数:</span>
|
|
|
|
|
- <span>{{ item.tHDetailEx.holdDays }}天</span>
|
|
|
|
|
- </li>
|
|
|
|
|
- <li>
|
|
|
|
|
- <span>滞纳金:</span>
|
|
|
|
|
- <span>{{ handleNumberValue(item.tHDetailEx.callAteFee) }}</span>
|
|
|
|
|
- </li>
|
|
|
|
|
- </ul>
|
|
|
|
|
- </div>
|
|
|
|
|
- <div class="g-order-list__btnbar">
|
|
|
|
|
- <Button size="small" @click="showComponent('detail', item)" round>详情</Button>
|
|
|
|
|
- <Button size="small" @click="showComponent('supplement', item)" round>补充</Button>
|
|
|
|
|
- <Button size="small" @click="showComponent('delivery', item)" round>交收</Button>
|
|
|
|
|
- <Button size="small" @click="showComponent('closeholder', item)" round>转让</Button>
|
|
|
|
|
</div>
|
|
</div>
|
|
|
</div>
|
|
</div>
|
|
|
- </div>
|
|
|
|
|
|
|
+ </app-pull-refresh>
|
|
|
<component ref="componentRef" v-bind="{ selectedRow }" :is="componentMap.get(componentId)" @closed="closeComponent"
|
|
<component ref="componentRef" v-bind="{ selectedRow }" :is="componentMap.get(componentId)" @closed="closeComponent"
|
|
|
v-if="componentId" />
|
|
v-if="componentId" />
|
|
|
</app-view>
|
|
</app-view>
|
|
|
</template>
|
|
</template>
|
|
|
|
|
|
|
|
<script lang="ts" setup>
|
|
<script lang="ts" setup>
|
|
|
-
|
|
|
|
|
-import { shallowRef, onMounted, onUnmounted, computed, defineAsyncComponent } from 'vue'
|
|
|
|
|
|
|
+import { shallowRef, defineAsyncComponent } from 'vue'
|
|
|
import { BuyOrSell } from '@/constants/order'
|
|
import { BuyOrSell } from '@/constants/order'
|
|
|
-import { formatDate, formatDecimal, parsePercent, handleNumberValue } from '@/filters'
|
|
|
|
|
|
|
+import { formatDecimal, parsePercent, handleNumberValue } from '@/filters'
|
|
|
import { getGoodsUnitName } from '@/constants/unit'
|
|
import { getGoodsUnitName } from '@/constants/unit'
|
|
|
import { useComponent } from '@/hooks/component'
|
|
import { useComponent } from '@/hooks/component'
|
|
|
import { useRequest } from '@/hooks/request'
|
|
import { useRequest } from '@/hooks/request'
|
|
|
import { querySBYJMyOrders } from '@/services/api/order'
|
|
import { querySBYJMyOrders } from '@/services/api/order'
|
|
|
import { Button } from 'vant'
|
|
import { Button } from 'vant'
|
|
|
-
|
|
|
|
|
-const dataList = shallowRef<Model.SBYJMyOrderRsp[]>([])
|
|
|
|
|
-const selectedRow = shallowRef<Model.SBYJMyOrderRsp>()
|
|
|
|
|
-const error = shallowRef(false)
|
|
|
|
|
|
|
+import AppPullRefresh from '../../../components/base/pull-refresh/index.vue'
|
|
|
|
|
|
|
|
const componentMap = new Map<string, unknown>([
|
|
const componentMap = new Map<string, unknown>([
|
|
|
['detail', defineAsyncComponent(() => import('../detail/index.vue'))], // 详情
|
|
['detail', defineAsyncComponent(() => import('../detail/index.vue'))], // 详情
|
|
@@ -87,15 +93,13 @@ const componentMap = new Map<string, unknown>([
|
|
|
['delivery', defineAsyncComponent(() => import('./components/market-order-delivery/index.vue'))], // 交收
|
|
['delivery', defineAsyncComponent(() => import('./components/market-order-delivery/index.vue'))], // 交收
|
|
|
['closeholder', defineAsyncComponent(() => import('./components/close-holder/index.vue'))], // 转让
|
|
['closeholder', defineAsyncComponent(() => import('./components/close-holder/index.vue'))], // 转让
|
|
|
])
|
|
])
|
|
|
|
|
+
|
|
|
|
|
+const error = shallowRef(false)
|
|
|
|
|
+const selectedRow = shallowRef<Model.SBYJMyOrderRsp>()
|
|
|
|
|
+
|
|
|
const { componentRef, componentId, openComponent, closeComponent } = useComponent()
|
|
const { componentRef, componentId, openComponent, closeComponent } = useComponent()
|
|
|
|
|
|
|
|
-const { loading, pageIndex, pageCount, run } = useRequest(querySBYJMyOrders, {
|
|
|
|
|
- onSuccess: (res) => {
|
|
|
|
|
- if (pageIndex.value === 1) {
|
|
|
|
|
- dataList.value = []
|
|
|
|
|
- }
|
|
|
|
|
- dataList.value.push(...res.data)
|
|
|
|
|
- },
|
|
|
|
|
|
|
+const { dataList, loading, pageIndex, pageCount, run } = useRequest(querySBYJMyOrders, {
|
|
|
onError: () => {
|
|
onError: () => {
|
|
|
error.value = true
|
|
error.value = true
|
|
|
}
|
|
}
|
|
@@ -105,5 +109,4 @@ const showComponent = (componentName: string, row: Model.SBYJMyOrderRsp) => {
|
|
|
selectedRow.value = row
|
|
selectedRow.value = row
|
|
|
openComponent(componentName)
|
|
openComponent(componentName)
|
|
|
}
|
|
}
|
|
|
-
|
|
|
|
|
</script>
|
|
</script>
|