xxxxx

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

@@ -1,22 +1,29 @@
 <!-- 商品订单-交收 -->
 <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 #reqtime="{ value }">
             {{ formatDate(value) }}
         </template>
+         <!-- 展开行 -->
+         <template #expand="{ }">
+            <el-button type="primary">主要按钮</el-button>
+        </template>
     </app-table>
 </template>
 
 <script lang="ts" setup>
 import { shallowRef } from 'vue'
 import { useRequest } from '@/hooks/request'
+import { useComposeTable } from '@pc/components/base/table'
 import { queryMineTradeGoodsDeliveryOfflines } from '@/services/api/transfer'
 import AppTable from '@pc/components/base/table/index.vue'
 import { formatDate } from '@/filters'
 
 const { loading, dataList } = useRequest(queryMineTradeGoodsDeliveryOfflines, {})
 
+const { rowKey, expandKeys, rowClick } = useComposeTable<Model.MineTradeGoodsDeliveryOfflinesRsp>({ rowKey: 'deliveryorderid' })
+
 const tableColumns = shallowRef<Model.TableColumn[]>([
     { prop: 'goodsnamedisplay', label: '订单合约' },
     { prop: 'buyorselldisplay', label: '交收方向' },

src/packages/pc/views/footer/goods/order/cancel/index.vue

@@ -0,0 +1,49 @@
+<!-- 商品订单-委托-撤销 -->
+<template>
+    <app-drawer title="提示" v-model:show="show" :loading="loading" :refresh="refresh">
+        <div>确认要撤销吗？</div>
+        <template #footer>
+            <el-button type="primary" @click="onCancelSumit()">提交</el-button>
+            <el-button @click="onCancel(false)" plain>取消</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 { useCancelOrder } from '@/business/trade'
+
+const props = defineProps({
+    selectedRow: {
+        type: Object as PropType<Model.TradeOrderDetailRsp>,
+        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 { wrtradeorderid, buyorsell, marketid} = props.selectedRow
+    ///  参数信息
+    formData.Header = { MarketID: marketid }
+    formData.OldWRTradeOrderID = wrtradeorderid
+    formData.BuyOrSell = buyorsell
+    /// 提交
+    cancelSubmit().then(() => {
+        ElMessage.success('提交成功')
+        onCancel(true)
+    }).catch((err) => {
+        ElMessage.error('提交失败:' + err)
+    })
+}
+</script>

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

@@ -1,6 +1,6 @@
 <!-- 商品订单- 委托 -->
 <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 #buyorsell="{ value }">
             {{ getBuyOrSellName(value) }}
@@ -13,23 +13,45 @@
         <template #ordertime="{ value }">
             {{ formatDate(value) }}
         </template>
+        <!-- 展开行 -->
+        <template #expand >
+            <el-button type="danger" @click="openComponent('cancel')">撤销</el-button>
+        </template>
     </app-table>
+    <component ref="componentRef" v-bind="{ selectedRow }" :is="componentMap.get(componentId)" @closed="closeComponent"
+            v-if="componentId" />
 </template>
 
 <script lang="ts" setup>
-import { shallowRef } from 'vue'
+import { shallowRef, defineAsyncComponent } from 'vue'
 import { useRequest } from '@/hooks/request'
 import { getBuyOrSellName, getWRTradeOrderStatusName } from '@/constants/order'
 import { queryTradeOrderDetail } from '@/services/api/order'
 import AppTable from '@pc/components/base/table/index.vue'
 import { formatDate } from '@/filters'
+import { useComponent } from '@/hooks/component'
+import { useComposeTable } from '@pc/components/base/table'
+
+const componentMap = new Map<string, unknown>([
+    ['cancel', defineAsyncComponent(() => import('./cancel/index.vue'))],
+])
+
+defineProps({
+    code: String
+})
 
-const { loading, dataList } = useRequest(queryTradeOrderDetail, {
+const { loading, dataList, run } = useRequest(queryTradeOrderDetail, {
     params: {
         tradeMode: '50'
     },
 })
 
+const { componentRef, componentId, openComponent, closeComponent } = useComponent(() => {
+    run()
+})
+
+const { rowKey, expandKeys, selectedRow, rowClick } = useComposeTable<Model.TradeOrderDetailRsp>({ rowKey: 'orderid' })
+
 const tableColumns = shallowRef<Model.TableColumn[]>([
     { prop: 'goodsname', label: '订单合约' },
     { prop: 'buyorsell', label: '类型' },

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

@@ -1,26 +1,50 @@
 <!-- 商品订单-合约汇总 -->
 <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 #buyorsell="{ value }">
             {{ getBuyOrSellName(value) }}
         </template>
+         <!-- 展开行 -->
+         <template #expand>
+            <el-button type="primary" @click="openComponent('delivery')">交收</el-button>
+            <el-button type="primary" @click="openComponent('transfer')">转让</el-button>
+        </template>
     </app-table>
+    <component ref="componentRef" v-bind="{ selectedRow }" :is="componentMap.get(componentId)" @closed="closeComponent"
+            v-if="componentId" />
 </template>
 
 <script lang="ts" setup>
-import { shallowRef } from 'vue'
+import { shallowRef, defineAsyncComponent } from 'vue'
 import { useRequest } from '@/hooks/request'
 import { getBuyOrSellName } from '@/constants/order'
+import { useComponent } from '@/hooks/component'
+import { useComposeTable } from '@pc/components/base/table'
 import { queryTradePosition } from '@/services/api/order'
 import AppTable from '@pc/components/base/table/index.vue'
 
-const { loading, dataList } = useRequest(queryTradePosition, {
+const componentMap = new Map<string, unknown>([
+    ['delivery', defineAsyncComponent(() => import('./components/delivery/index.vue'))],
+    ['transfer', defineAsyncComponent(() => import('./components/transfer/index.vue'))],
+])
+
+const { componentRef, componentId, openComponent, closeComponent } = useComponent(() => {
+    run()
+})
+
+defineProps({
+    code: String
+})
+
+const { loading, dataList, run } = useRequest(queryTradePosition, {
     params: {
         tradeMode: '50'
     },
 })
 
+const { rowKey, expandKeys, selectedRow, rowClick } = useComposeTable<Model.TradePositionRsp>({ rowKey: 'accountid' })
+
 const tableColumns = shallowRef<Model.TableColumn[]>([
     { prop: 'goodsname', label: '订单合约' },
     { prop: 'buyorsell', label: '方向' },
@@ -34,4 +58,5 @@ const tableColumns = shallowRef<Model.TableColumn[]>([
     { prop: 'marketamount', label: '市值' },
     { prop: 'unknown', label: '浮动盈亏' },
 ])
+
 </script>

src/packages/pc/views/footer/spot/order/cancel/index.vue

@@ -0,0 +1,49 @@
+<!-- 现货仓单-挂单-撤销 -->
+<template>
+    <app-drawer title="提示" v-model:show="show" :loading="loading" :refresh="refresh">
+        <div>确认要撤销吗？</div>
+        <template #footer>
+            <el-button type="primary" @click="onCancelSumit()">提交</el-button>
+            <el-button @click="onCancel(false)" plain>取消</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 { useWrListingCancelOrder } from '@/business/trade'
+
+const props = defineProps({
+    selectedRow: {
+        type: Object as PropType<Model.WrOrderDetailRsp>,
+        required: true
+    }
+})
+
+const { cancelSubmit, formData, loading } = useWrListingCancelOrder()
+
+const show = ref(true)
+const refresh = ref(false)
+
+const onCancel = (isRefresh = false) => {
+    show.value = false
+    refresh.value = isRefresh
+}
+
+const onCancelSumit = () => {
+    const { wrtradeorderid, buyorsell} = props.selectedRow
+    ///  参数信息
+    formData.Header = { MarketID: 17201 }
+    formData.OldWRTradeOrderID = wrtradeorderid
+    formData.BuyOrSell = buyorsell
+    /// 提交
+    cancelSubmit().then(() => {
+        ElMessage.success('提交成功')
+        onCancel(true)
+    }).catch((err) => {
+        ElMessage.error('提交失败:' + err)
+    })
+}
+</script>

src/packages/pc/views/footer/spot/order/index.vue

@@ -1,6 +1,6 @@
 <!-- 现货仓单-挂单 -->
 <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 #wrtradetype="{ value }">
             {{ getWrTradeTypeName(value) }}
@@ -17,18 +17,34 @@
         <template #ordertime="{ value }">
             {{ formatDate(value) }}
         </template>
+        <!-- 展开行 -->
+        <template #expand >
+            <el-button type="danger" @click="openComponent('cancel')">撤销</el-button>
+        </template>
     </app-table>
+    <component ref="componentRef" v-bind="{ selectedRow }" :is="componentMap.get(componentId)" @closed="closeComponent"
+            v-if="componentId" />
 </template>
 
 <script lang="ts" setup>
-import { shallowRef } from 'vue'
+import { shallowRef, defineAsyncComponent } from 'vue'
 import { formatDate } from '@/filters'
 import { useRequest } from '@/hooks/request'
 import { queryWrOrderDetail } from '@/services/api/order'
+import { useComponent } from '@/hooks/component'
 import { getWrTradeTypeName, getWRTradeOrderStatusName, getWrPriceTypeName } from '@/constants/order'
+import { useComposeTable } from '@pc/components/base/table'
 import AppTable from '@pc/components/base/table/index.vue'
 
-const { loading, dataList } = useRequest(queryWrOrderDetail, {
+const componentMap = new Map<string, unknown>([
+    ['cancel', defineAsyncComponent(() => import('./cancel/index.vue'))],
+])
+
+defineProps({
+    code: String
+})
+
+const { loading, dataList, run } = useRequest(queryWrOrderDetail, {
     params: {
         wrtradetype: 1,
         marketid: 17201,
@@ -36,6 +52,12 @@ const { loading, dataList } = useRequest(queryWrOrderDetail, {
     },
 })
 
+const { componentRef, componentId, openComponent, closeComponent } = useComponent(() => {
+    run()
+})
+
+const { rowKey, expandKeys, selectedRow, rowClick } = useComposeTable<Model.WrOrderDetailRsp>({ rowKey: 'wrtradeorderid' })
+
 const tableColumns = shallowRef<Model.TableColumn[]>([
     { prop: 'wrtradeorderid', label: '挂牌单号' },
     { prop: 'wrtradetype', label: '挂牌类型' },
@@ -50,4 +72,5 @@ const tableColumns = shallowRef<Model.TableColumn[]>([
     { prop: 'tradeqty', label: '成交数量' },
     { prop: 'ordertime', label: '挂牌时间' }
 ])
+
 </script>

src/packages/pc/views/footer/spot/position/components/listing/index.vue

@@ -0,0 +1,71 @@
+<!-- 资金信息-资金汇总-充值 -->
+<template>
+    <app-drawer title="充值" v-model:show="show" :loading="loading" :refresh="refresh">
+        <el-form ref="formRef" class="el-form--vertical" label-width="100px" label-position="left" :model="formData"
+            :rules="formRules">
+            <el-form-item prop="Amount" label="充值金额">
+                <el-input-number placeholder="请输入" v-model="formData.Amount" />
+            </el-form-item>
+            <el-form-item label="凭证">
+                <app-upload :file-types="['image']" type-message="请选择正确的图片类型" @change="onUploadChange" />
+            </el-form-item>
+        </el-form>
+        <template #footer>
+            <el-button type="primary" @click="formSubmit">提交</el-button>
+            <el-button @click="onCancel(false)" plain>取消</el-button>
+        </template>
+    </app-drawer>
+</template>
+
+<script lang="ts" setup>
+import { ref, PropType } from 'vue'
+import { ElMessage, FormInstance, FormRules } from 'element-plus'
+import { useDoDeposit } from '@/business/bank'
+import AppDrawer from '@pc/components/base/drawer/index.vue'
+import AppUpload from '@pc/components/base/upload/index.vue'
+
+const props = defineProps({
+    selectedRow: {
+        type: Object as PropType<Model.TaAccountsRsp>,
+        required: true
+    }
+})
+
+console.log(props.selectedRow)
+
+const { formData, onSubmit, extendInfo, loading } = useDoDeposit(props.selectedRow.userid)
+const show = ref(true)
+const refresh = ref(false)
+const formRef = ref<FormInstance>()
+
+const formRules: FormRules = {
+    Amount: [{ required: true, message: '请输入充值金额' }],
+}
+
+const onUploadChange = (file: { filePath: string }) => {
+    console.log(file.filePath)
+    extendInfo.certificate_photo_url = file.filePath
+}
+
+const onCancel = (isRefresh = false) => {
+    show.value = false
+    refresh.value = isRefresh
+}
+
+const formSubmit = () => {
+    formRef.value?.validate((valid) => {
+        if (valid) {
+            if (formData.CusBankID) {
+                onSubmit().then(() => {
+                    ElMessage.success('提交成功')
+                    onCancel(true)
+                }).catch((err) => {
+                    ElMessage.error('提交失败:' + err)
+                })
+            } else {
+                ElMessage.error('未签约')
+            }
+        }
+    })
+}
+</script>

src/packages/pc/views/footer/spot/position/components/pickup/index.vue

@@ -0,0 +1,69 @@
+<!-- 资金信息-资金汇总-充值 -->
+<template>
+    <app-drawer title="充值" v-model:show="show" :loading="loading" :refresh="refresh">
+        <el-form ref="formRef" class="el-form--vertical" label-width="100px" label-position="left" :model="formData"
+            :rules="formRules">
+            <el-form-item prop="Amount" label="充值金额">
+                <el-input-number placeholder="请输入" v-model="formData.Amount" />
+            </el-form-item>
+            <el-form-item label="凭证">
+                <app-upload :file-types="['image']" type-message="请选择正确的图片类型" @change="onUploadChange" />
+            </el-form-item>
+        </el-form>
+        <template #footer>
+            <el-button type="primary" @click="formSubmit">提交</el-button>
+            <el-button @click="onCancel(false)" plain>取消</el-button>
+        </template>
+    </app-drawer>
+</template>
+
+<script lang="ts" setup>
+import { ref, PropType } from 'vue'
+import { ElMessage, FormInstance, FormRules } from 'element-plus'
+import { useDoDeposit } from '@/business/bank'
+import AppDrawer from '@pc/components/base/drawer/index.vue'
+import AppUpload from '@pc/components/base/upload/index.vue'
+
+const props = defineProps({
+    selectedRow: {
+        type: Object as PropType<Model.TaAccountsRsp>,
+        required: true
+    }
+})
+
+const { formData, onSubmit, extendInfo, loading } = useDoDeposit(props.selectedRow.userid)
+const show = ref(true)
+const refresh = ref(false)
+const formRef = ref<FormInstance>()
+
+const formRules: FormRules = {
+    Amount: [{ required: true, message: '请输入充值金额' }],
+}
+
+const onUploadChange = (file: { filePath: string }) => {
+    console.log(file.filePath)
+    extendInfo.certificate_photo_url = file.filePath
+}
+
+const onCancel = (isRefresh = false) => {
+    show.value = false
+    refresh.value = isRefresh
+}
+
+const formSubmit = () => {
+    formRef.value?.validate((valid) => {
+        if (valid) {
+            if (formData.CusBankID) {
+                onSubmit().then(() => {
+                    ElMessage.success('提交成功')
+                    onCancel(true)
+                }).catch((err) => {
+                    ElMessage.error('提交失败:' + err)
+                })
+            } else {
+                ElMessage.error('未签约')
+            }
+        }
+    })
+}
+</script>

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

@@ -1,21 +1,45 @@
 <!-- 现货仓单-现货明细 -->
 <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 #createtime="{ value }">
             {{ formatDate(value) }}
         </template>
+        <!-- 展开行 -->
+        <template #expand>
+            <el-button type="primary" @click="openComponent('listing')">挂牌</el-button>
+            <el-button type="danger" @click="openComponent('pickup')">提货</el-button>
+        </template>
     </app-table>
+    <component ref="componentRef" v-bind="{ selectedRow }" :is="componentMap.get(componentId)" @closed="closeComponent"
+            v-if="componentId" />
 </template>
 
 <script lang="ts" setup>
-import { shallowRef } from 'vue'
+import { shallowRef, defineAsyncComponent } from 'vue'
 import { formatDate } from '@/filters'
 import { useRequest } from '@/hooks/request'
+import { useComponent } from '@/hooks/component'
 import { queryHoldLB } from '@/services/api/order'
+import { useComposeTable } from '@pc/components/base/table'
 import AppTable from '@pc/components/base/table/index.vue'
 
-const { loading, dataList } = useRequest(queryHoldLB, {})
+const { loading, dataList, run } = useRequest(queryHoldLB, {})
+
+const componentMap = new Map<string, unknown>([
+    ['pickup', defineAsyncComponent(() => import('./components/pickup/index.vue'))],
+    ['listing', defineAsyncComponent(() => import('./components/listing/index.vue'))],
+])
+
+const { componentRef, componentId, openComponent, closeComponent } = useComponent(() => {
+    run()
+})
+
+defineProps({
+    code: String
+})
+
+const { rowKey, expandKeys, selectedRow, rowClick } = useComposeTable<Model.HoldLBRsp>({ rowKey: 'ladingbillid' })
 
 const tableColumns = shallowRef<Model.TableColumn[]>([
     { prop: 'wrholdeno', label: '仓单编号' },
@@ -28,4 +52,5 @@ const tableColumns = shallowRef<Model.TableColumn[]>([
     { prop: 'enableqty', label: '可用数量' },
     { prop: 'createtime', label: '过户时间' }
 ])
+
 </script>