feat: 预售订单接口对接

This commit is contained in:
lzhizhao 2025-06-05 16:10:10 +08:00
parent 63dc65eafb
commit 1314bdb200
2 changed files with 486 additions and 346 deletions

View File

@ -81,7 +81,7 @@
v-for="item in [
{ label: '全部', value: '0' },
{ label: '快递', value: '1' },
{ label: '自提', value: '2' },
{ label: '自提', value: '2' }
]"
:key="item.marketId"
:label="item.marketName"
@ -121,389 +121,260 @@
</template>
<script>
import { mapState } from "vuex";
import viewDetails from "./popup/view-details.vue";
import { mapState } from 'vuex'
import viewDetails from './popup/view-details.vue'
export default {
components: { viewDetails },
data() {
return {
value1: "",
activeName: "5",
advanceSellStatus: "",
value1: '',
activeName: '5',
advanceSellStatus: '',
dataList: [],
formInline: {
name: "",
marketId: "",
shopId: "",
name: '',
marketId: '',
shopId: ''
},
tableProp: {
"auto-resize": true,
'auto-resize': true,
border: true,
height: "auto",
"row-id": "id",
"show-overflow": false,
height: 'auto',
'row-id': 'advanceSellId',
'show-overflow': false
},
statusList: [
{
label: "全部",
value: "5",
label: '全部',
value: '5'
},
{
label: "代付定金",
value: "0",
label: '代付定金',
value: '0'
},
{
label: "代付尾款",
value: "1",
label: '代付尾款',
value: '1'
},
{
label: "待发货",
value: "2",
label: '待发货',
value: '2'
},
{
label: "待收货",
value: "3",
label: '待收货',
value: '3'
},
{
label: "待评价",
value: "4",
label: '待评价',
value: '4'
},
{
label: "已完成",
value: "6",
label: '已完成',
value: '6'
},
{
label: "已取消",
value: "7",
label: '已取消',
value: '7'
},
{
label: "交易关闭",
value: "8",
},
label: '交易关闭',
value: '8'
}
],
productFilterType: "SALE",
selectList: [],
};
productFilterType: 'SALE',
selectList: []
}
},
created() {
this.formInline = {
marketId: this.marketId,
shopId: this.shopId,
};
shopId: this.shopId
}
this.$nextTick(() => {
this.$refs.oTable.reload();
});
this.$refs.oTable.reload()
})
},
methods: {
addProduct() {
this.$refs.addOrUpdate.toggle().add();
this.$refs.addOrUpdate.toggle().add()
},
queryList(pageNo, pageSize) {
let res = {
data: [
{
advanceSellId: "1870015398464876544",
advanceSellStatus: 1,
balancePaymentEndTime: "2024-12-28 00:00:00",
balancePaymentStartTime: "2024-12-25 00:00:00",
brandId: null,
collectionNum: null,
description: "好吃的苹果",
discountActivity: null,
endTime: "2024-12-25 00:00:00",
estimatedEndDeliveryTime: "2025-01-03 00:00:00",
estimatedStartDeliveryTime: "2024-12-31 00:00:00",
favoriteNum: null,
id: "1869660245152923648",
isAdvanceSell: 1,
isDiscount: null,
isRefundEarnestMoney: 1,
keywords: null,
marketId: "1844393110392221696",
maxCostPrice: 10,
maxMarketPrice: 20,
maxSalePrice: 20,
merchantId: "1844397348581253120",
minCostPrice: 5,
minMarketPrice: 10,
minSalePrice: 10,
name: "苹果",
otherAttribute: "[]",
productAttributeList: [
{
attributeName: "重量",
attributeValue: "10斤,20斤",
id: "1869660245454913536",
productId: "1869660245152923648",
},
],
productCategoryId: "31",
productIntroducePhoto: "",
productPhotoList: [
{
id: "1869660245391998976",
isMain: 1,
productId: "1869660245152923648",
sort: null,
url: "https://dmjs.obs.cn-east-3.myhuaweicloud.com/hhsh/20241219/90cb416e636b4e1f99f47e458d0a0fc8.jpg",
},
],
productPlace: "山西省-太原市-小店区",
productSpecificationList: [
{
advanceSellStockNum: 40,
attributeJson:
'[{"attributeName":"重量","attributeValue":"10斤"}]',
attributeList: [
{
attributeName: "重量",
attributeValue: "10斤",
},
],
attributeValue: "10斤",
balancePayment: 3,
costPrice: 5,
earnestMoney: 6,
id: "1869660245517828096",
isAdvanceSell: 1,
isDiscount: null,
isRecommend: 0,
isRecommendIndex: null,
limitCount: 2147483647,
marketPrice: 10,
presalePrice: 9,
productId: "1869660245152923648",
saleNum: 0,
salePrice: 10,
stockNum: 234,
virtualSaleNum: null,
volume: 2,
warnAdvanceSellStockNum: null,
warnStockNum: 50,
weight: 5,
},
{
advanceSellStockNum: 40,
attributeJson:
'[{"attributeName":"重量","attributeValue":"20斤"}]',
attributeList: [
{
attributeName: "重量",
attributeValue: "20斤",
},
],
attributeValue: "20斤",
balancePayment: 7,
costPrice: 10,
earnestMoney: 8,
id: "1869660245517828097",
isAdvanceSell: 1,
isDiscount: null,
isRecommend: 0,
isRecommendIndex: null,
limitCount: 2147483647,
marketPrice: 20,
presalePrice: 15,
productId: "1869660245152923648",
saleNum: 0,
salePrice: 20,
stockNum: 324,
virtualSaleNum: null,
volume: 4,
warnAdvanceSellStockNum: null,
warnStockNum: 50,
weight: 10,
},
],
productUnit: "盒",
productVideo: "",
saleNum: 0,
salePrice: 10,
shelfLife: 60,
shopId: "1844397348614807552",
sort: 999,
specType: 1,
startTime: "2024-12-20 00:00:00",
status: "UP",
stockNum: 558,
tags: null,
volume: 3,
weight: 7.5,
},
],
total: "1",
};
setTimeout(() => {
this.$refs.oTable.complete(res.data, Number(res.total));
}, 1000);
// this.$api.preSale
// .preSaleProducts({
// pageNumber: pageNo,
// pageSize: pageSize,
// ...this.formInline,
// advanceSellStatus: this.advanceSellStatus,
// merchantId: JSON.parse(sessionStorage.getItem("userInfo")).merchantId,
// productQuerySortParam: [],
// })
// .then((res) => {
// console.log(res);
// this.$refs.oTable.complete(
// res.data.data.data,
// Number(res.data.data.total)
// );
// })
// .catch((err) => {
// this.$refs.oTable.complete(false);
// });
// let res = {
// data: [],
// total: 0
// }
// setTimeout(() => {
// this.$refs.oTable.complete(res.data, Number(res.total))
// }, 1000)
this.$api.preSale
.preSaleProducts({
pageNumber: pageNo,
pageSize: pageSize,
...this.formInline,
advanceSellStatus: this.advanceSellStatus,
merchantId: JSON.parse(sessionStorage.getItem('userInfo')).merchantId,
productQuerySortParam: []
})
.then(res => {
console.log(res)
this.$refs.oTable.complete(
res.data.data.data,
Number(res.data.data.total)
)
})
.catch(err => {
this.$refs.oTable.complete(false)
})
},
Reset() {
this.formInline = {
name: "",
name: '',
marketId: this.marketId,
shopId: this.shopId,
};
this.$refs.oTable.reload();
shopId: this.shopId
}
this.$refs.oTable.reload()
},
handleClick(e) {
console.log(e.name);
if (e.name == "5") {
this.advanceSellStatus = "";
console.log(e.name)
if (e.name == '5') {
this.advanceSellStatus = ''
} else {
this.advanceSellStatus = e.name;
this.advanceSellStatus = e.name
}
this.$refs.oTable.reload()
}
this.$refs.oTable.reload();
},
},
computed: {
tableCols() {
return [
// { type: "checkbox", width: "60px", fixed: "left" },
{
type: "seq",
fixed: "left",
width: "60px",
align: "center",
title: "序号",
type: 'seq',
fixed: 'left',
width: '60px',
align: 'center',
title: '序号'
},
{
title: "订单号",
align: "center",
field: "id",
title: '订单号',
align: 'center',
field: 'id'
},
{
title: "订单商品",
field: "productPhotoList",
align: "center",
width: "80px",
type: "jsx",
title: '订单商品',
field: 'productPhotoList',
align: 'center',
width: '80px',
type: 'jsx',
render: ({ row }) => {
if (row.productPhotoList.length > 0) {
return (
<el-image
preview-src-list={row.productPhotoList.map((item) => {
return item.url;
preview-src-list={row.productPhotoList.map(item => {
return item.url
})}
src={row.productPhotoList[0].url}
></el-image>
);
)
} else {
return <span>暂无商品图</span>;
return <span>暂无商品图</span>
}
}
},
{
title: '商品名称',
align: 'center',
field: 'name'
},
{
title: "商品名称",
align: "center",
field: "name",
title: '规格/数量',
align: 'center',
field: 'name'
},
{
title: "规格/数量",
align: "center",
field: "name",
},
{
title: "定金支付时间",
align: "center",
field: "startTime",
type: "jsx",
title: '定金支付时间',
align: 'center',
field: 'startTime',
type: 'jsx',
render: ({ row }) => {
return (
<span>
{row.startTime}{row.endTime}
</span>
);
},
)
}
},
{
title: "尾款支付时间",
align: "center",
field: "minSalePrice",
type: "jsx",
title: '尾款支付时间',
align: 'center',
field: 'minSalePrice',
type: 'jsx',
render: ({ row }) => {
return (
<span>
{row.balancePaymentStartTime}{row.balancePaymentEndTime}
</span>
);
},
},
{
title: "状态",
align: "center",
field: "status",
type: "jsx",
render: ({ row }) => {
if (row.advanceSellStatus == "0") {
return <span>未开始</span>;
} else if (row.advanceSellStatus == "1") {
return <span>进行中</span>;
} else if (row.advanceSellStatus == "2") {
return <span>已结束</span>;
} else if (row.advanceSellStatus == "3") {
return <span>已关闭</span>;
)
}
},
{
title: '状态',
align: 'center',
field: 'status',
type: 'jsx',
render: ({ row }) => {
if (row.advanceSellStatus == '0') {
return <span>未开始</span>
} else if (row.advanceSellStatus == '1') {
return <span>进行中</span>
} else if (row.advanceSellStatus == '2') {
return <span>已结束</span>
} else if (row.advanceSellStatus == '3') {
return <span>已关闭</span>
}
}
},
{
title: "操作",
fixed: "right",
type: "jsx",
align: "center",
width: "100px",
title: '操作',
fixed: 'right',
type: 'jsx',
align: 'center',
width: '100px',
render: ({ row }) => {
let details = () => {
this.$refs.viewDetails.toggle(row).update();
};
this.$refs.viewDetails.toggle(row).update()
}
return (
<div>
<el-button size="mini" type="primary" onClick={details}>
查看
</el-button>
</div>
);
},
},
];
)
}
}
]
},
tableEvent() {
return {
"checkbox-all": ({ records, reserves }) => {
this.selectList = [...records, ...reserves];
'checkbox-all': ({ records, reserves }) => {
this.selectList = [...records, ...reserves]
},
"checkbox-change": ({ records, reserves }) => {
this.selectList = [...records, ...reserves];
'checkbox-change': ({ records, reserves }) => {
this.selectList = [...records, ...reserves]
}
}
},
};
},
...mapState("userData", [
"isMerchant",
"marketList",
"storeList",
"marketId",
"shopId",
]),
},
};
...mapState('userData', [
'isMerchant',
'marketList',
'storeList',
'marketId',
'shopId'
])
}
}
</script>
<style lang="scss" scoped></style>

View File

@ -10,114 +10,383 @@
<div slot="dialog__content">
<el-form
:model="ruleForm"
:rules="rules"
ref="ruleForm"
label-width="150px"
class="demo-ruleForm"
>
<!-- <el-form-item label="预售剩余库存:" prop="name">
<span style="font-size: 20px; margin-right: 20px"></span>
<el-input-number
v-model="ruleForm.name"
:min="1"
:max="9999"
:precision="0"
:step="1"
label="请输入数量"
></el-input-number>
<span style="font-size: 20px; margin-left: 14px">时通知我</span>
<el-row>
<el-col :span="12">
<el-form-item label="订金支付时间:" prop="startTime">
<el-date-picker
@change="getOrderTime"
format="yyyy-MM-dd HH:mm"
data-format="yyyy-MM-dd HH:mm"
:disabled="true"
value-format="yyyy-MM-dd HH:mm:ss"
v-model="orderTime"
type="datetimerange"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期"
:editable="false"
>
</el-date-picker> </el-form-item
></el-col>
<el-col :span="12">
<el-form-item
label="尾款支付时间:"
prop="balancePaymentStartTime"
>
<el-date-picker
@change="getArrearsTime"
format="yyyy-MM-dd HH:mm"
data-format="yyyy-MM-dd HH:mm"
:disabled="true"
value-format="yyyy-MM-dd HH:mm:ss"
v-model="arrears"
type="datetimerange"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期"
:picker-options="pickerOptions"
>
</el-date-picker> </el-form-item
></el-col>
</el-row>
<el-form-item
label="预计发货时间:"
prop="estimatedStartDeliveryTime"
>
<el-date-picker
format="yyyy-MM-dd HH:mm"
data-format="yyyy-MM-dd HH:mm"
:disabled="true"
value-format="yyyy-MM-dd HH:mm:ss"
@change="deliveryTime"
v-model="delivery"
type="datetimerange"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期"
:picker-options="pickerOptions"
>
</el-date-picker>
</el-form-item>
<el-form-item label="通知方式:" prop="value">
<el-radio v-model="ruleForm.value" label="1">系统通知</el-radio>
<el-radio v-model="ruleForm.value" label="2">短信通知</el-radio>
</el-form-item> -->
<el-form-item label="定金可退:" prop="isRefundEarnestMoney">
<el-radio
v-model="ruleForm.isRefundEarnestMoney"
:label="1"
:disabled="true"
></el-radio
>
<el-radio
v-model="ruleForm.isRefundEarnestMoney"
:label="0"
:disabled="true"
></el-radio
>
<span>
选择是用户可在付尾款前申请退定金申请后自动退无需审核或付尾款时间结束后系统自动退定金
</span>
</el-form-item>
<div style="padding: 0 0 0 20px; font-size: 16px; font-weight: 600">
已选择商品
</div>
<div style="padding: 20px">
<div style="border-top: 1px solid #ccc; padding: 10px 0 0 0">
<div style="font-size: 16px; margin-bottom: 20px">
<span>商品ID:{{ ruleForm.productId }}</span>
<span style="margin-left: 20px"
>商品名称:{{ ruleForm.name }}</span
>
</div>
<el-table
border
ref="multipleTable"
:data="ruleForm.productSpecificationList"
tooltip-effect="dark"
style="width: 100%"
@selection-change="handleSelectionChange"
>
<el-table-column align="center" label="是否预售" width="80">
<template slot-scope="scope">
<span>{{
scope.row.isAdvanceSell == 1 ? '是' : '否'
}}</span>
<!-- <el-checkbox
:true-label="1"
:false-label="0"
v-model="scope.row.isAdvanceSell"
></el-checkbox> -->
</template>
</el-table-column>
<el-table-column align="center" label="SKU-ID" prop="id" />
<el-table-column
align="center"
label="规格"
prop="attributeList"
>
<template slot-scope="scope">
<span>{{ scope.row.attributeValue }}</span>
</template>
</el-table-column>
<el-table-column align="center" label="属性" prop="address">
<template slot-scope="scope">
<span>{{
scope.row.attributeList
? scope.row.attributeList[0].attributeName
: '无'
}}</span>
</template>
</el-table-column>
<el-table-column
align="center"
label="销售价"
prop="marketPrice"
width="120"
/>
<el-table-column
prop="presalePrice"
align="center"
label="*预售价"
width="200"
>
<template slot-scope="scope">
<span v-if="scope.row.isAdvanceSell">{{
scope.row.presalePrice
}}</span>
</template>
</el-table-column>
<el-table-column
prop="earnestMoney"
align="center"
label="*定金"
width="200"
>
<template slot-scope="scope">
<span v-if="scope.row.isAdvanceSell">{{
scope.row.earnestMoney
}}</span>
</template>
</el-table-column>
<el-table-column align="center" label="尾款" width="200">
<template slot-scope="scope">
<span v-if="scope.row.isAdvanceSell">{{
scope.row.presalePrice
? scope.row.presalePrice - scope.row.earnestMoney
: ''
}}</span>
</template>
</el-table-column>
<el-table-column align="center" label="*预售库存" width="200">
<template slot-scope="scope">
<span v-if="scope.row.isAdvanceSell">{{
scope.row.advanceSellStockNum
}}</span>
</template>
</el-table-column>
</el-table>
</div>
<el-empty
v-show="ruleForm.productList?.length == 0"
description="请选择商品"
></el-empty>
</div>
</el-form>
</div>
<!-- 选择商品 -->
</obj-modal>
</div>
</template>
<script>
import { debounce, cloneDeep } from "lodash";
import { debounce, cloneDeep } from 'lodash'
export default {
components: {},
props: {
marketId: {
type: String,
default: ''
},
shopId: {
type: String,
default: ''
}
},
data() {
return {
isAdd: true,
//
modalConfig: {
title: "订单详情",
title: '查看预售',
show: false,
width: "800px",
width: '1200px',
fullscreen: true
},
modalData: {},
ruleForm: {
name: "",
value: "1",
productList: [],
isRefundEarnestMoney: 1 //退 1 0
},
rules: {
name: [{ required: true, message: "请输入属性名称", trigger: "blur" }],
value: [
{
required: true,
message: "请输入属性内容",
trigger: "blur",
pickerOptions: {
disabledDate(time) {
return time.getTime() < Date.now()
}
},
],
orderTime: [], //
arrears: [], //
delivery: [], //
tableData: []
}
},
};
watch: {
'modalConfig.show'(newVal) {
if (newVal) {
//
setTimeout(() => {
this.$refs.ruleForm.resetFields()
})
}
}
},
methods: {
queryTableData(pageNo, pageSize) {},
toggle(e) {
if (this.modalConfig.show == false) {
this.modalConfig.show = true;
this.modalConfig.show = true
} else {
this.modalConfig.show = false;
this.modalConfig.show = false
}
if (e) {
this.init(cloneDeep(e.row));
this.init(cloneDeep(e))
}
return {
add: (data) => {
this.modalConfig.title = "订单详情";
this.isAdd = true;
add: () => {
this.orderTime = []
this.arrears = []
this.delivery = []
this.ruleForm = {
startTime: '',
endTime: '',
balancePaymentStartTime: '',
balancePaymentEndTime: '',
estimatedStartDeliveryTime: '',
estimatedEndDeliveryTime: '',
productList: [],
isRefundEarnestMoney: 1 //退 1 0
}
this.modalConfig.title = '新增预售'
this.isAdd = true
},
update: () => {
this.isAdd = false;
},
};
this.modalConfig.title = '查看预售'
this.isAdd = false
}
}
},
init(row) {
this.modalData = row;
console.log(row.startTime, row.endTime)
this.orderTime = [row.startTime, row.endTime]
this.arrears = [row.balancePaymentStartTime, row.balancePaymentEndTime]
this.delivery = [
row.estimatedStartDeliveryTime,
row.estimatedEndDeliveryTime
]
;(this.ruleForm = {
productId: row.id,
advanceSellId: row.advanceSellId,
startTime: row.startTime,
name: row.name,
endTime: row.endTime,
balancePaymentStartTime: row.balancePaymentStartTime,
balancePaymentEndTime: row.balancePaymentEndTime,
estimatedStartDeliveryTime: row.estimatedStartDeliveryTime,
estimatedEndDeliveryTime: row.estimatedEndDeliveryTime,
isRefundEarnestMoney: Number(row.isRefundEarnestMoney),
productSpecificationList: row.productSpecificationList
}),
console.log(this.orderTime, this.arrears, this.delivery)
// this.ruleForm = row;
},
//
getOrderTime(e) {
if (e) {
console.log(e)
this.ruleForm.startTime = e[0]
this.ruleForm.endTime = e[1]
} else {
this.ruleForm.startTime = ''
this.ruleForm.endTime = ''
}
},
//
getArrearsTime(e) {
if (e) {
console.log(e)
this.ruleForm.balancePaymentStartTime = e[0]
this.ruleForm.balancePaymentEndTime = e[1]
} else {
this.ruleForm.balancePaymentStartTime = ''
this.ruleForm.balancePaymentEndTime = ''
}
},
//
deliveryTime(e) {
if (e) {
console.log(e)
this.ruleForm.estimatedStartDeliveryTime = e[0]
this.ruleForm.estimatedEndDeliveryTime = e[1]
} else {
this.ruleForm.estimatedStartDeliveryTime = ''
this.ruleForm.estimatedEndDeliveryTime = ''
}
},
selectProduct() {
console.log('选择商品', this.marketId, this.shopId)
this.$nextTick(() => {
this.$refs.commodity.toggle().add({
marketId: this.marketId,
shopId: this.shopId
})
})
},
handleSelectionChange(e) {
console.log(e)
},
getProduct(row) {
this.ruleForm.productList = row.map(item => {
return {
productId: item.id,
name: item.name,
productSpecificationList: item.productSpecificationList
}
})
console.log(this.ruleForm.productList, this.ruleForm.productList.length)
console.log('获取商品')
}
},
computed: {
modalHandles() {
return [
{
label: "取消",
label: '关闭',
handle: () => {
this.toggle();
},
},
{
label: "确认",
type: "primary",
// submit: true,
handle: () => {
this.$refs.ruleForm.validate((valid) => {
if (valid) {
this.$emit("getAttribute", this.ruleForm);
this.toggle();
this.toggle()
}
}
// {
// label: "",
// type: "primary",
// // submit: true,
// handle: () => {
// },
// },
]
}
});
},
},
];
},
},
asyncComputed: {},
};
asyncComputed: {}
}
</script>
<style lang="scss" scoped>
</style>
<style lang="scss" scoped></style>