|
@@ -42,13 +42,17 @@ userId: 17
|
|
userName: "微信用户q0zj95zuo4pv" -->
|
|
userName: "微信用户q0zj95zuo4pv" -->
|
|
<template>
|
|
<template>
|
|
<div class="p-4">
|
|
<div class="p-4">
|
|
- <BasicTable
|
|
|
|
- @register="registerTable"
|
|
|
|
- :rowSelection="{ type: 'checkbox', onChange: onSelectChange }"
|
|
|
|
- >
|
|
|
|
|
|
+ <BasicTable @register="registerTable" :rowSelection="{ type: 'checkbox' }">
|
|
<template #toolbar>
|
|
<template #toolbar>
|
|
- <a-button type="primary" @click="sendPackage"> 发货</a-button>
|
|
|
|
- <!-- dashed link text-->
|
|
|
|
|
|
+ <!-- <a-button type="primary" @click="sendPackage"> 发货</a-button> -->
|
|
|
|
+ <PopConfirmButton
|
|
|
|
+ title="是否确定收货?"
|
|
|
|
+ primary
|
|
|
|
+ color="error"
|
|
|
|
+ @confirm="handleConfirmReceive"
|
|
|
|
+ >
|
|
|
|
+ 确定收货</PopConfirmButton
|
|
|
|
+ >
|
|
</template>
|
|
</template>
|
|
<template #cover="{ record }">
|
|
<template #cover="{ record }">
|
|
<TableImg :size="150" :simpleShow="true" :imgList="[record.cover]" />
|
|
<TableImg :size="150" :simpleShow="true" :imgList="[record.cover]" />
|
|
@@ -70,6 +74,12 @@ userName: "微信用户q0zj95zuo4pv" -->
|
|
<TableAction
|
|
<TableAction
|
|
:actions="[
|
|
:actions="[
|
|
{
|
|
{
|
|
|
|
+ icon: 'mdi:truck-delivery',
|
|
|
|
+ label: '发货',
|
|
|
|
+ color: 'warning',
|
|
|
|
+ onClick: sendPackage.bind(null, record),
|
|
|
|
+ },
|
|
|
|
+ {
|
|
icon: 'mdi:information-outline',
|
|
icon: 'mdi:information-outline',
|
|
label: '详情',
|
|
label: '详情',
|
|
onClick: () => {
|
|
onClick: () => {
|
|
@@ -88,6 +98,7 @@ userName: "微信用户q0zj95zuo4pv" -->
|
|
/>
|
|
/>
|
|
</template>
|
|
</template>
|
|
</BasicTable>
|
|
</BasicTable>
|
|
|
|
+ <ConfirmModal @register="registerConfirmModal" />
|
|
</div>
|
|
</div>
|
|
</template>
|
|
</template>
|
|
<script lang="ts">
|
|
<script lang="ts">
|
|
@@ -101,17 +112,19 @@ userName: "微信用户q0zj95zuo4pv" -->
|
|
TableImg,
|
|
TableImg,
|
|
} from '/@/components/Table';
|
|
} from '/@/components/Table';
|
|
import { useMessage } from '/@/hooks/web/useMessage';
|
|
import { useMessage } from '/@/hooks/web/useMessage';
|
|
- import { uploadApi } from '/@/api/sys/upload';
|
|
|
|
// import { Switch } from 'ant-design-vue';
|
|
// import { Switch } from 'ant-design-vue';
|
|
// import { h } from 'vue';
|
|
// import { h } from 'vue';
|
|
- import { ListApi } from '/@/api/order/list';
|
|
|
|
|
|
+ import { ListApi, BrandListApi } from '/@/api/order/list';
|
|
import { useI18n } from '/@/hooks/web/useI18n';
|
|
import { useI18n } from '/@/hooks/web/useI18n';
|
|
// import { useCopyToClipboard } from '/@/hooks/web/useCopyToClipboard';
|
|
// import { useCopyToClipboard } from '/@/hooks/web/useCopyToClipboard';
|
|
import { useGo } from '/@/hooks/web/usePage';
|
|
import { useGo } from '/@/hooks/web/usePage';
|
|
import { Time } from '/@/components/Time';
|
|
import { Time } from '/@/components/Time';
|
|
|
|
+ import { PopConfirmButton } from '/@/components/Button';
|
|
|
|
|
|
|
|
+ import { useModal } from '/@/components/Modal';
|
|
|
|
+ import ConfirmModal from './confirmModal.vue';
|
|
export default defineComponent({
|
|
export default defineComponent({
|
|
- components: { BasicTable, TableAction, TableImg, Time },
|
|
|
|
|
|
+ components: { BasicTable, TableAction, TableImg, Time, PopConfirmButton, ConfirmModal },
|
|
setup() {
|
|
setup() {
|
|
const { createMessage } = useMessage();
|
|
const { createMessage } = useMessage();
|
|
const go = useGo();
|
|
const go = useGo();
|
|
@@ -126,8 +139,8 @@ userName: "微信用户q0zj95zuo4pv" -->
|
|
{
|
|
{
|
|
title: '订单号',
|
|
title: '订单号',
|
|
dataIndex: 'orderSn',
|
|
dataIndex: 'orderSn',
|
|
-
|
|
|
|
- width: 160,
|
|
|
|
|
|
+ ellipsis: false,
|
|
|
|
+ width: 180,
|
|
},
|
|
},
|
|
{
|
|
{
|
|
title: '会员昵称',
|
|
title: '会员昵称',
|
|
@@ -192,7 +205,8 @@ userName: "微信用户q0zj95zuo4pv" -->
|
|
dataIndex: '',
|
|
dataIndex: '',
|
|
slots: { customRender: 'action' },
|
|
slots: { customRender: 'action' },
|
|
fixed: 'right',
|
|
fixed: 'right',
|
|
- width: 140,
|
|
|
|
|
|
+ align: 'center',
|
|
|
|
+ width: 230,
|
|
},
|
|
},
|
|
];
|
|
];
|
|
|
|
|
|
@@ -200,7 +214,7 @@ userName: "微信用户q0zj95zuo4pv" -->
|
|
labelWidth: 100,
|
|
labelWidth: 100,
|
|
schemas: [
|
|
schemas: [
|
|
{
|
|
{
|
|
- field: 'orderNo',
|
|
|
|
|
|
+ field: 'orderSn',
|
|
label: '订单号',
|
|
label: '订单号',
|
|
component: 'Input',
|
|
component: 'Input',
|
|
colProps: {
|
|
colProps: {
|
|
@@ -208,15 +222,87 @@ userName: "微信用户q0zj95zuo4pv" -->
|
|
xxl: 5,
|
|
xxl: 5,
|
|
},
|
|
},
|
|
},
|
|
},
|
|
|
|
+ {
|
|
|
|
+ field: 'orderStatus',
|
|
|
|
+ label: '订单状态',
|
|
|
|
+ component: 'Select',
|
|
|
|
+ colProps: {
|
|
|
|
+ xl: 5,
|
|
|
|
+ xxl: 5,
|
|
|
|
+ },
|
|
|
|
+ componentProps: {
|
|
|
|
+ options: [
|
|
|
|
+ {
|
|
|
|
+ label: '全部订单',
|
|
|
|
+ value: '',
|
|
|
|
+ key: '1',
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ label: '待付款',
|
|
|
|
+ value: '0',
|
|
|
|
+ key: '2',
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ label: '订单已取消',
|
|
|
|
+ value: '101',
|
|
|
|
+ key: '3',
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ label: '订单已付款',
|
|
|
|
+ value: '201',
|
|
|
|
+ key: '4',
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ label: '订单已发货',
|
|
|
|
+ value: '1',
|
|
|
|
+ key: '5',
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ label: '订单已收货',
|
|
|
|
+ value: '2',
|
|
|
|
+ key: '6',
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ label: '完成',
|
|
|
|
+ value: '501',
|
|
|
|
+ key: '7',
|
|
|
|
+ },
|
|
|
|
+ ],
|
|
|
|
+ },
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ field: 'brandId',
|
|
|
|
+ label: 'VR场景',
|
|
|
|
+ component: 'ApiSelect',
|
|
|
|
+ componentProps: {
|
|
|
|
+ api: BrandListApi,
|
|
|
|
+ // resultField: 'list',
|
|
|
|
+ numberToString: true,
|
|
|
|
+ labelField: 'name',
|
|
|
|
+ valueField: 'id',
|
|
|
|
+ immediate: true,
|
|
|
|
+ params: {
|
|
|
|
+ page: 1,
|
|
|
|
+ limit: 1000,
|
|
|
|
+ },
|
|
|
|
+ },
|
|
|
|
+ colProps: {
|
|
|
|
+ xl: 5,
|
|
|
|
+ xxl: 5,
|
|
|
|
+ },
|
|
|
|
+ },
|
|
],
|
|
],
|
|
};
|
|
};
|
|
|
|
|
|
- const [registerTable] = useTable({
|
|
|
|
|
|
+ const [registerConfirmModal, { openModal: openConfirmModal }] = useModal();
|
|
|
|
+
|
|
|
|
+ const [registerTable, { getSelectRowKeys }] = useTable({
|
|
title: '订单列表',
|
|
title: '订单列表',
|
|
api: ListApi,
|
|
api: ListApi,
|
|
columns: columns,
|
|
columns: columns,
|
|
useSearchForm: true,
|
|
useSearchForm: true,
|
|
formConfig: searchForm,
|
|
formConfig: searchForm,
|
|
|
|
+ clickToRowSelect: false,
|
|
showTableSetting: true,
|
|
showTableSetting: true,
|
|
tableSetting: { fullScreen: true },
|
|
tableSetting: { fullScreen: true },
|
|
showIndexColumn: false,
|
|
showIndexColumn: false,
|
|
@@ -279,13 +365,20 @@ userName: "微信用户q0zj95zuo4pv" -->
|
|
return '';
|
|
return '';
|
|
}
|
|
}
|
|
}
|
|
}
|
|
-
|
|
|
|
- function sendPackage() {
|
|
|
|
- console.log('sendPackage');
|
|
|
|
|
|
+ // function onSelectChange(selectedRowKeys: (string | number)[]) {
|
|
|
|
+ // console.log(selectedRowKeys);
|
|
|
|
+ // // checkedKeys.value = selectedRowKeys;
|
|
|
|
+ // }
|
|
|
|
+ function sendPackage(record: Recordable) {
|
|
|
|
+ openConfirmModal(true, record);
|
|
}
|
|
}
|
|
- function onSelectChange(selectedRowKeys: (string | number)[]) {
|
|
|
|
- console.log(selectedRowKeys);
|
|
|
|
- // checkedKeys.value = selectedRowKeys;
|
|
|
|
|
|
+
|
|
|
|
+ function handleConfirmReceive() {
|
|
|
|
+ const keys = getSelectRowKeys();
|
|
|
|
+ if (keys.length === 0) {
|
|
|
|
+ createMessage.info(t('modal.atLeastOne'));
|
|
|
|
+ return;
|
|
|
|
+ }
|
|
}
|
|
}
|
|
|
|
|
|
return {
|
|
return {
|
|
@@ -298,8 +391,9 @@ userName: "微信用户q0zj95zuo4pv" -->
|
|
rendershippingStatusLabel,
|
|
rendershippingStatusLabel,
|
|
renderpayStatusLabel,
|
|
renderpayStatusLabel,
|
|
sendPackage,
|
|
sendPackage,
|
|
- onSelectChange,
|
|
|
|
- uploadApi: uploadApi as any,
|
|
|
|
|
|
+ // onSelectChange,
|
|
|
|
+ handleConfirmReceive,
|
|
|
|
+ registerConfirmModal,
|
|
};
|
|
};
|
|
},
|
|
},
|
|
});
|
|
});
|