xxxx

src/packages/pc/views/footer/presell/presellposition/deposit/index.vue

@@ -0,0 +1,49 @@
+<!-- 预售转让-预售持仓-补足定金 -->
+<template>
+    <app-drawer title="提示" v-model:show="show" :refresh="refresh">
+        <div>是否补足转让定金？</div>
+        <template #footer>
+            <el-button type="info" @click="onCancel(false)">取消</el-button>
+            <el-button type="primary" @click="onMakeUpDeposit">确认</el-button>
+        </template>
+    </app-drawer>
+</template>
+
+<script lang="ts" setup>
+import { ref, PropType } from 'vue'
+import { ElMessage } from 'element-plus'
+import AppDrawer from '@pc/components/base/drawer/index.vue'
+import { makeUpDeposit } from '@/services/api/trade'
+
+const props = defineProps({
+    selectedRow: {
+        type: Object as PropType<Model.MineCpTradePreSaleResultsRsp>,
+        required: true
+    }
+})
+
+const show = ref(true)
+const refresh = ref(false)
+
+const onCancel = (isRefresh = false) => {
+    show.value = false
+    refresh.value = isRefresh
+}
+
+const onMakeUpDeposit = () => {
+    /// 提交
+    makeUpDeposit({
+        data: {
+            Header: {
+                MarketID: props.selectedRow.marketid
+            },
+            TradeID: props.selectedRow.tradeid
+        }
+    }).then(() => {
+        ElMessage.success('提交成功')
+        onCancel(true)
+    }).catch((err) => {
+        ElMessage.error('提交失败:' + err)
+    })
+}
+</script>

src/packages/pc/views/footer/presell/presellposition/index.vue

@@ -1,6 +1,7 @@
 <!-- 预售转让-预售认购 -->
 <template>
-    <app-table :data="dataList" v-model:columns="tableColumns" :loading="loading">
+    <app-table :data="dataList" v-model:columns="tableColumns" :loading="loading" :row-key="rowKey"
+            :expand-row-keys="expandKeys" @row-click="rowClick">
         <!-- 商品代码/名称 -->
         <template #goodsname="{ row }">
             {{ row.goodscode }}/{{ row.goodsname }}
@@ -21,20 +22,42 @@
         <template #paystatus="{ value }">
             {{ getPayStatusName(value) }}
         </template>
+        <!-- 展开行 -->
+        <template #expand="{ row }">
+            <div class="buttonbar">
+                <el-button type="danger" v-if="row.paystatus === PayStatus.UnPay" size="small" @click="showComponent('deposit', row)">补足定金</el-button>
+            </div>
+        </template>
+        <template #footer>
+            <component ref="componentRef" v-bind="{ selectedRow }" :is="componentMap.get(componentId)"
+                @closed="closeComponent" v-if="componentId" />
+        </template>
     </app-table>
 </template>
 
 <script lang="ts" setup>
-import { shallowRef } from 'vue'
+import { ref, defineAsyncComponent } from 'vue'
 import { formatDate, parsePercent} from '@/filters'
 import { useRequest } from '@/hooks/request'
 import { queryMineCpTradePreSaleResults } from '@/services/api/presale'
-import { getPayStatusName } from '@/constants/order'
+import { getPayStatusName, PayStatus } from '@/constants/order'
+import { useComponent } from '@/hooks/component'
+import { useComposeTable } from '@pc/components/base/table'
 import AppTable from '@pc/components/base/table/index.vue'
 
-const { loading, dataList } = useRequest(queryMineCpTradePreSaleResults, {})
+const componentMap = new Map<string, unknown>([
+    ['deposit', defineAsyncComponent(() => import('./deposit/index.vue'))], // 补足定金
+])
+
+const { loading, dataList, run } = useRequest(queryMineCpTradePreSaleResults, {})
 
-const tableColumns = shallowRef<Model.TableColumn[]>([
+const { componentRef, componentId, openComponent, closeComponent } = useComponent(() => {
+    run()
+})
+
+const { rowKey, expandKeys, selectedRow, rowClick } = useComposeTable<Model.MineCpTradePreSaleResultsRsp>({ rowKey: 'applyid' })
+
+const tableColumns = ref<Model.TableColumn[]>([
     { prop: 'goodsname', label: '商品代码/名称' },
     { prop: 'sellname', label: '发售方' },
     { prop: 'starttime', label: '开始日期' },
@@ -48,4 +71,9 @@ const tableColumns = shallowRef<Model.TableColumn[]>([
     { prop: 'paystatus', label: '支付状态' },
     { prop: 'tradeid', label: '成交单号' }
 ])
+
+const showComponent = (componentName: string, row?: Model.MineCpTradePreSaleResultsRsp) => {
+    selectedRow.value = row
+    openComponent(componentName)
+}
 </script>

src/packages/pc/views/footer/presell/transferorder/cancel/index.vue

@@ -0,0 +1,50 @@
+<!-- 预售转让-预售委托-撤销 -->
+<template>
+    <app-drawer title="提示" v-model:show="show" :loading="loading" :refresh="refresh">
+        <div>是否撤销该委托单？</div>
+        <template #footer>
+            <el-button type="info" @click="onCancel(false)">取消</el-button>
+            <el-button type="primary" @click="onCancelSumit()">提交</el-button>
+        </template>
+    </app-drawer>
+</template>
+
+<script lang="ts" setup>
+import { ref, PropType } from 'vue'
+import { ElMessage } from 'element-plus'
+import AppDrawer from '@pc/components/base/drawer/index.vue'
+import { EOperateType } from '@/constants/client'
+import { useCancelOrder } from '@/business/trade'
+
+const props = defineProps({
+    selectedRow: {
+        type: Object as PropType<Model.MineTradeOrdersRsp>,
+        required: true
+    }
+})
+
+const { cancelSubmit, formData, loading } = useCancelOrder()
+
+const show = ref(true)
+const refresh = ref(false)
+
+const onCancel = (isRefresh = false) => {
+    show.value = false
+    refresh.value = isRefresh
+}
+
+const onCancelSumit = () => {
+    const { orderid, marketid, goodsid } = props.selectedRow
+    ///  参数信息
+    formData.Header = { MarketID: marketid, GoodsID: goodsid }
+    formData.OldOrderId = orderid
+    formData.OperateType = EOperateType.OPERATETYPE_ORDERCANCEL
+    /// 提交
+    cancelSubmit().then(() => {
+        ElMessage.success('撤销成功')
+        onCancel(true)
+    }).catch((err) => {
+        ElMessage.error('撤销失败:' + err)
+    })
+}
+</script>

src/packages/pc/views/footer/presell/transferorder/index.vue

@@ -1,6 +1,7 @@
 <!-- 预售转让-转让委托 -->
 <template>
-    <app-table :data="dataList" v-model:columns="tableColumns" :loading="loading">
+    <app-table :data="dataList" v-model:columns="tableColumns" :loading="loading" :row-key="rowKey"
+            :expand-row-keys="expandKeys" @row-click="rowClick">
         <!-- 商品代码/名称 -->
         <template #goodsname="{ row }">
             {{ row.goodscode }}/{{ row.goodsname }}
@@ -13,20 +14,48 @@
         <template #ordertime="{ value }">
             {{ formatDate(value) }}
         </template>
+        <!-- 展开行 -->
+        <template #expand="{ row }">
+            <div class="buttonbar">
+                <el-button type="danger" v-if="[3, 7].includes(row.orderstatus)" size="small" @click="showComponent('cancel', row)">撤销</el-button>
+            </div>
+        </template>
+        <template #footer>
+            <component ref="componentRef" v-bind="{ selectedRow }" :is="componentMap.get(componentId)"
+                @closed="closeComponent" v-if="componentId" />
+        </template>
     </app-table>
 </template>
 
 <script lang="ts" setup>
-import { shallowRef } from 'vue'
+import { ref, defineAsyncComponent } from 'vue'
 import { formatDate } from '@/filters'
 import { useRequest } from '@/hooks/request'
 import { queryMineTradeOrders } from '@/services/api/transfer'
 import { getOrderStatusName } from '@/constants/order'
+import { useComponent } from '@/hooks/component'
+import { useComposeTable } from '@pc/components/base/table'
 import AppTable from '@pc/components/base/table/index.vue'
 
-const { loading, dataList } = useRequest(queryMineTradeOrders, {})
+const componentMap = new Map<string, unknown>([
+    ['cancel', defineAsyncComponent(() => import('./cancel/index.vue'))], // 撤单
+])
+
+const { loading, run, dataList } = useRequest(queryMineTradeOrders, {})
+
+const { componentRef, componentId, openComponent, closeComponent } = useComponent(() => {
+    run()
+})
+
+const { rowKey, expandKeys, selectedRow, rowClick } = useComposeTable<Model.MineTradeOrdersRsp>({ rowKey: 'orderid' })
+
+
+const showComponent = (componentName: string, row?: Model.MineTradeOrdersRsp) => {
+    selectedRow.value = row
+    openComponent(componentName)
+}
 
-const tableColumns = shallowRef<Model.TableColumn[]>([
+const tableColumns = ref<Model.TableColumn[]>([
     { prop: 'goodsname', label: '商品代码/名称' },
     { prop: 'orderqty', label: '转让数量' },
     { prop: 'orderprice', label: '转让价' },

src/packages/pc/views/footer/presell/transferposition/append/index.vue

@@ -0,0 +1,46 @@
+<!-- 预售转让-预售持仓-补足定金 -->
+<template>
+    <app-drawer title="提示" v-model:show="show" :refresh="refresh">
+        <div>是否追加未付转让定金？</div>
+        <template #footer>
+            <el-button type="info" @click="onCancel(false)">取消</el-button>
+            <el-button type="primary" @click="onMakeUpDeposit">确认</el-button>
+        </template>
+    </app-drawer>
+</template>
+
+<script lang="ts" setup>
+import { ref, PropType } from 'vue'
+import { ElMessage } from 'element-plus'
+import AppDrawer from '@pc/components/base/drawer/index.vue'
+import { holdAppendDeposit } from '@/services/api/trade'
+
+const props = defineProps({
+    selectedRow: {
+        type: Object as PropType<Model.MineTradePositionExsRsp>,
+        required: true
+    }
+})
+
+const show = ref(true)
+const refresh = ref(false)
+
+const onCancel = (isRefresh = false) => {
+    show.value = false
+    refresh.value = isRefresh
+}
+
+const onMakeUpDeposit = () => {
+    /// 提交
+    holdAppendDeposit({
+        data: {
+            GoodsID: props.selectedRow.goodsid
+        }
+    }).then(() => {
+        ElMessage.success('提交成功')
+        onCancel(true)
+    }).catch((err) => {
+        ElMessage.error('提交失败:' + err)
+    })
+}
+</script>

src/packages/pc/views/footer/presell/transferposition/index.vue

@@ -1,6 +1,7 @@
 <!-- 预售转让-转让持仓 -->
 <template>
-    <app-table :data="dataList" v-model:columns="tableColumns" :loading="loading">
+    <app-table :data="dataList" v-model:columns="tableColumns" :loading="loading" :row-key="rowKey"
+            :expand-row-keys="expandKeys" @row-click="rowClick">
         <!-- 商品代码/名称 -->
         <template #goodsname="{ row }">
             {{ row.goodscode }}/{{ row.goodsname }}
@@ -21,20 +22,46 @@
         <template #paystatus="{ value }">
             {{ getPayStatusName(value) }}
         </template>
+        <!-- 展开行 -->
+        <template #expand="{ row }">
+            <div class="buttonbar">
+                <el-button type="danger" v-if="row.paystatus === PayStatus.UnPay" size="small" @click="showComponent('append', row)">追加定金</el-button>
+                <el-button type="success" v-if="row.paystatus === 2" size="small" @click="showComponent('listing', row)">转让</el-button>
+                <el-button type="primary" v-if="row.paystatus === 2" size="small" @click="showComponent('delivery', row)">交收</el-button>
+            </div>
+        </template>
+        <template #footer>
+            <component ref="componentRef" v-bind="{ selectedRow }" :is="componentMap.get(componentId)"
+                @closed="closeComponent" v-if="componentId" />
+        </template>
     </app-table>
 </template>
 
 <script lang="ts" setup>
-import { shallowRef } from 'vue'
+import { ref, defineAsyncComponent } from 'vue'
 import { parsePercent } from '@/filters'
 import { useRequest } from '@/hooks/request'
 import { queryMineTradePositionExs } from '@/services/api/transfer'
-import { getPayStatusName } from '@/constants/order'
+import { getPayStatusName, PayStatus } from '@/constants/order'
+import { useComponent } from '@/hooks/component'
+import { useComposeTable } from '@pc/components/base/table'
 import AppTable from '@pc/components/base/table/index.vue'
 
-const { loading, dataList } = useRequest(queryMineTradePositionExs, {})
+const componentMap = new Map<string, unknown>([
+    ['append', defineAsyncComponent(() => import('./append/index.vue'))], // 追加定金
+    ['delivery', defineAsyncComponent(() => import('./delivery/index.vue'))], // 交收
+    ['listing', defineAsyncComponent(() => import('./listing/index.vue'))], // 转让
+])
+
+const { loading, dataList, run } = useRequest(queryMineTradePositionExs, {})
 
-const tableColumns = shallowRef<Model.TableColumn[]>([
+const { componentRef, componentId, openComponent, closeComponent } = useComponent(() => {
+    run()
+})
+
+const { rowKey, expandKeys, selectedRow, rowClick } = useComposeTable<Model.MineTradePositionExsRsp>({ rowKey: 'goodsid' })
+
+const tableColumns = ref<Model.TableColumn[]>([
     { prop: 'goodsname', label: '商品代码/名称' },
     { prop: 'buycurholderamount', label: '持仓金额' },
     { prop: 'buycurpositionqty', label: '持仓数量' },
@@ -49,4 +76,9 @@ const tableColumns = shallowRef<Model.TableColumn[]>([
     { prop: 'paystatus', label: '支付状态' },
     { prop: 'lasttradedate', label: '最后交易日' }
 ])
+
+const showComponent = (componentName: string, row?: Model.MineTradePositionExsRsp) => {
+    selectedRow.value = row
+    openComponent(componentName)
+}
 </script>