|
@@ -18,13 +18,15 @@ const commentDialogVisible = ref(false)
|
|
|
const userId = ref(0)
|
|
const userId = ref(0)
|
|
|
const productId = ref(0)
|
|
const productId = ref(0)
|
|
|
const productName = ref('')
|
|
const productName = ref('')
|
|
|
|
|
+const price = ref(0)
|
|
|
|
|
+const totalPrice = ref(0)
|
|
|
const amount = ref(0)
|
|
const amount = ref(0)
|
|
|
const paid = ref(0)
|
|
const paid = ref(0)
|
|
|
const type = ref('')
|
|
const type = ref('')
|
|
|
const content = ref('')
|
|
const content = ref('')
|
|
|
const rating = ref(0)
|
|
const rating = ref(0)
|
|
|
const status = ref('')
|
|
const status = ref('')
|
|
|
-const createTime= ref('')
|
|
|
|
|
|
|
+const createTime = ref('')
|
|
|
const finishTime = ref('')
|
|
const finishTime = ref('')
|
|
|
const storeId = ref(0)
|
|
const storeId = ref(0)
|
|
|
|
|
|
|
@@ -38,6 +40,7 @@ function getOrderDetail() {
|
|
|
productId.value = res.result.productId
|
|
productId.value = res.result.productId
|
|
|
productName.value = res.result.productName
|
|
productName.value = res.result.productName
|
|
|
amount.value = res.result.amount
|
|
amount.value = res.result.amount
|
|
|
|
|
+ price.value = res.result.price
|
|
|
paid.value = res.result.paid
|
|
paid.value = res.result.paid
|
|
|
type.value = res.result.type
|
|
type.value = res.result.type
|
|
|
content.value = res.result.content
|
|
content.value = res.result.content
|
|
@@ -46,28 +49,41 @@ function getOrderDetail() {
|
|
|
createTime.value = res.result.createTime
|
|
createTime.value = res.result.createTime
|
|
|
finishTime.value = res.result.finishTime
|
|
finishTime.value = res.result.finishTime
|
|
|
storeId.value = res.result.storeId
|
|
storeId.value = res.result.storeId
|
|
|
|
|
+
|
|
|
|
|
+ totalPrice.value = amount.value * price.value
|
|
|
})
|
|
})
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
// 对于变化的内容使用计算属性返回响应式结果
|
|
// 对于变化的内容使用计算属性返回响应式结果
|
|
|
const statusText = computed(() => {
|
|
const statusText = computed(() => {
|
|
|
switch (status.value) {
|
|
switch (status.value) {
|
|
|
- case 'UNPAID': return "待支付"
|
|
|
|
|
- case 'UNSEND': return "待发货"
|
|
|
|
|
- case 'UNGET': return "待收货"
|
|
|
|
|
- case 'UNCOMMENT': return "待评价"
|
|
|
|
|
- case 'DONE':return "已完成"
|
|
|
|
|
- default: return "状态标签"
|
|
|
|
|
|
|
+ case 'UNPAID':
|
|
|
|
|
+ return "待支付"
|
|
|
|
|
+ case 'UNSEND':
|
|
|
|
|
+ return "待发货"
|
|
|
|
|
+ case 'UNGET':
|
|
|
|
|
+ return "待收货"
|
|
|
|
|
+ case 'UNCOMMENT':
|
|
|
|
|
+ return "待评价"
|
|
|
|
|
+ case 'DONE':
|
|
|
|
|
+ return "已完成"
|
|
|
|
|
+ default:
|
|
|
|
|
+ return "状态标签"
|
|
|
}
|
|
}
|
|
|
})
|
|
})
|
|
|
|
|
|
|
|
const buttonText = computed(() => {
|
|
const buttonText = computed(() => {
|
|
|
switch (status.value) {
|
|
switch (status.value) {
|
|
|
- case 'UNPAID': return "去支付"
|
|
|
|
|
- case 'UNSEND': return "去发货"
|
|
|
|
|
- case 'UNGET': return "去收货"
|
|
|
|
|
- case 'UNCOMMENT': return "去评价"
|
|
|
|
|
- default: return "按钮"
|
|
|
|
|
|
|
+ case 'UNPAID':
|
|
|
|
|
+ return "去支付"
|
|
|
|
|
+ case 'UNSEND':
|
|
|
|
|
+ return "去发货"
|
|
|
|
|
+ case 'UNGET':
|
|
|
|
|
+ return "去收货"
|
|
|
|
|
+ case 'UNCOMMENT':
|
|
|
|
|
+ return "去评价"
|
|
|
|
|
+ default:
|
|
|
|
|
+ return "按钮"
|
|
|
}
|
|
}
|
|
|
})
|
|
})
|
|
|
|
|
|
|
@@ -165,13 +181,13 @@ function handleSendComment() {
|
|
|
|
|
|
|
|
commentOrder(payload).then(res => {
|
|
commentOrder(payload).then(res => {
|
|
|
if (res.code === '000') {
|
|
if (res.code === '000') {
|
|
|
- ElMessage({
|
|
|
|
|
- message: '评价成功!',
|
|
|
|
|
- type: 'success',
|
|
|
|
|
- center: true,
|
|
|
|
|
- })
|
|
|
|
|
- getOrderDetail()
|
|
|
|
|
- commentDialogVisible.value = false
|
|
|
|
|
|
|
+ ElMessage({
|
|
|
|
|
+ message: '评价成功!',
|
|
|
|
|
+ type: 'success',
|
|
|
|
|
+ center: true,
|
|
|
|
|
+ })
|
|
|
|
|
+ getOrderDetail()
|
|
|
|
|
+ commentDialogVisible.value = false
|
|
|
} else {
|
|
} else {
|
|
|
ElMessage({
|
|
ElMessage({
|
|
|
message: res.msg,
|
|
message: res.msg,
|
|
@@ -183,13 +199,22 @@ function handleSendComment() {
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
function switchButtonFunction() {
|
|
function switchButtonFunction() {
|
|
|
- switch (status.value) {
|
|
|
|
|
- case 'UNPAID': handlePay(); break;
|
|
|
|
|
- case 'UNSEND': handleDeliver(); break;
|
|
|
|
|
- case 'UNGET': handleGet(); break;
|
|
|
|
|
- case 'UNCOMMENT': handleComment(); break;
|
|
|
|
|
- default: break;
|
|
|
|
|
- }
|
|
|
|
|
|
|
+ switch (status.value) {
|
|
|
|
|
+ case 'UNPAID':
|
|
|
|
|
+ handlePay();
|
|
|
|
|
+ break;
|
|
|
|
|
+ case 'UNSEND':
|
|
|
|
|
+ handleDeliver();
|
|
|
|
|
+ break;
|
|
|
|
|
+ case 'UNGET':
|
|
|
|
|
+ handleGet();
|
|
|
|
|
+ break;
|
|
|
|
|
+ case 'UNCOMMENT':
|
|
|
|
|
+ handleComment();
|
|
|
|
|
+ break;
|
|
|
|
|
+ default:
|
|
|
|
|
+ break;
|
|
|
|
|
+ }
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
// 处理优惠券
|
|
// 处理优惠券
|
|
@@ -224,132 +249,152 @@ const setCurrent = (row?: User) => {
|
|
|
singleTableRef.value!.setCurrentRow(row)
|
|
singleTableRef.value!.setCurrentRow(row)
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
-function handleCouponType(type) {
|
|
|
|
|
|
|
+function parsePaid() {
|
|
|
|
|
+ if (paid.value === null) {
|
|
|
|
|
+ return "暂未支付"
|
|
|
|
|
+ } else {
|
|
|
|
|
+ return paid.value + " 元"
|
|
|
|
|
+ }
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
|
|
+function parseCouponType(type) {
|
|
|
if (type === "FULL_REDUCTION") {
|
|
if (type === "FULL_REDUCTION") {
|
|
|
return "满减"
|
|
return "满减"
|
|
|
} else if (type === "SPECIAL") {
|
|
} else if (type === "SPECIAL") {
|
|
|
return "折扣"
|
|
return "折扣"
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
|
|
+
|
|
|
|
|
+function parseOrderType(type) {
|
|
|
|
|
+ if (type === "PICKUP") {
|
|
|
|
|
+ return "到店自提"
|
|
|
|
|
+ } else if (type === "DELIVERY") {
|
|
|
|
|
+ return "快递到家"
|
|
|
|
|
+ }
|
|
|
|
|
+}
|
|
|
</script>
|
|
</script>
|
|
|
|
|
|
|
|
<template>
|
|
<template>
|
|
|
- <el-card class="order-item-card" shadow="hover">
|
|
|
|
|
-
|
|
|
|
|
- <template #header>
|
|
|
|
|
- <div class="card-header">
|
|
|
|
|
- <div>
|
|
|
|
|
- <span> 订单号 {{props.orderId}}</span>
|
|
|
|
|
- <el-tag style="margin-left: 8px" v-if="status!=='DONE'"> {{statusText}} </el-tag>
|
|
|
|
|
- <el-tag style="margin-left: 8px" v-if="status==='DONE'" type="success"> {{statusText}} </el-tag>
|
|
|
|
|
- </div>
|
|
|
|
|
- <el-button @click="switchButtonFunction" v-if="!(status==='DONE')" class="status-change-button" size="small" type="primary">
|
|
|
|
|
- {{ buttonText }}
|
|
|
|
|
- </el-button>
|
|
|
|
|
|
|
+ <el-card class="order-item-card" shadow="hover">
|
|
|
|
|
+
|
|
|
|
|
+ <template #header>
|
|
|
|
|
+ <div class="card-header">
|
|
|
|
|
+ <div>
|
|
|
|
|
+ <span> 订单号 {{ props.orderId }}</span>
|
|
|
|
|
+ <el-tag style="margin-left: 8px" v-if="status!=='DONE'"> {{ statusText }}</el-tag>
|
|
|
|
|
+ <el-tag style="margin-left: 8px" v-if="status==='DONE'" type="success"> {{ statusText }}</el-tag>
|
|
|
</div>
|
|
</div>
|
|
|
- </template>
|
|
|
|
|
-
|
|
|
|
|
- <el-descriptions
|
|
|
|
|
- :column="1"
|
|
|
|
|
- >
|
|
|
|
|
- <el-descriptions-item style="font-size: 15px" label="商品">
|
|
|
|
|
- {{ productName }}
|
|
|
|
|
- </el-descriptions-item>
|
|
|
|
|
- <el-descriptions-item style="font-size: 15px" label="数量">
|
|
|
|
|
- {{ amount }} 件
|
|
|
|
|
- </el-descriptions-item>
|
|
|
|
|
- <el-descriptions-item style="font-size: 15px" label="支付金额">
|
|
|
|
|
- {{ paid }} 元
|
|
|
|
|
- </el-descriptions-item>
|
|
|
|
|
- <el-descriptions-item style="font-size: 15px" label="取货类型">
|
|
|
|
|
- <el-tag> {{ parseType() }}</el-tag>
|
|
|
|
|
- </el-descriptions-item>
|
|
|
|
|
- <el-descriptions-item style="font-size: 15px" label="创建时间">
|
|
|
|
|
- {{ parseTime(createTime) }}
|
|
|
|
|
- </el-descriptions-item>
|
|
|
|
|
- <el-descriptions-item style="font-size: 15px" label="完成时间">
|
|
|
|
|
- {{ parseTime(finishTime) }}
|
|
|
|
|
- </el-descriptions-item>
|
|
|
|
|
- <el-descriptions-item style="font-size: 15px" label="评分" v-if="status==='DONE'">
|
|
|
|
|
- <el-rate
|
|
|
|
|
- v-model="rating"
|
|
|
|
|
- disabled
|
|
|
|
|
- show-score
|
|
|
|
|
- text-color="#ff9900"
|
|
|
|
|
- score-template="{value} 分"
|
|
|
|
|
- size="small"
|
|
|
|
|
- />
|
|
|
|
|
- </el-descriptions-item>
|
|
|
|
|
- <el-descriptions-item style="font-size: 15px" label="评价内容" v-if="status==='DONE'">
|
|
|
|
|
- {{ content }}
|
|
|
|
|
- </el-descriptions-item >
|
|
|
|
|
- </el-descriptions>
|
|
|
|
|
- </el-card>
|
|
|
|
|
-
|
|
|
|
|
- <el-dialog v-model="orderDialogVisible">
|
|
|
|
|
- <el-form>
|
|
|
|
|
- <el-form-item>
|
|
|
|
|
- <label for="amount">购买数量:</label>
|
|
|
|
|
- {{ amount }} 件
|
|
|
|
|
- </el-form-item>
|
|
|
|
|
- <el-form-item>
|
|
|
|
|
- <label for="discountPrice">总价:</label>
|
|
|
|
|
- {{ paid }} 元
|
|
|
|
|
- </el-form-item>
|
|
|
|
|
- <el-form-item>
|
|
|
|
|
- <label for="type">提货方式:</label>
|
|
|
|
|
- {{ parseType() }}
|
|
|
|
|
- </el-form-item>
|
|
|
|
|
- <el-form-item>
|
|
|
|
|
- <label for="type">优惠券:</label> <el-button @click="setCurrent()">不使用优惠券</el-button>
|
|
|
|
|
- <el-table
|
|
|
|
|
- ref="singleTableRef"
|
|
|
|
|
- :data="availableCouponList"
|
|
|
|
|
- highlight-current-row
|
|
|
|
|
- style="width: 100%"
|
|
|
|
|
- @current-change="handleCurrentChange"
|
|
|
|
|
- >
|
|
|
|
|
- <el-table-column type="index" width="50"/>
|
|
|
|
|
- <el-table-column prop="type" label="类型" width="180">
|
|
|
|
|
- <template #default="scope">
|
|
|
|
|
- {{ handleCouponType(scope.row.type) }}
|
|
|
|
|
- </template>
|
|
|
|
|
- </el-table-column>
|
|
|
|
|
- <el-table-column prop="satisfaction" label="满(元)" width="180"/>
|
|
|
|
|
- <el-table-column prop="minus" label="减(元)" width="180"/>
|
|
|
|
|
- </el-table>
|
|
|
|
|
- </el-form-item>
|
|
|
|
|
- </el-form>
|
|
|
|
|
- <el-button @click="handleConfirmOrder">确认支付</el-button>
|
|
|
|
|
- </el-dialog>
|
|
|
|
|
-
|
|
|
|
|
-
|
|
|
|
|
- <el-dialog
|
|
|
|
|
- v-model="commentDialogVisible"
|
|
|
|
|
- title="发起评价"
|
|
|
|
|
|
|
+ <el-button @click="switchButtonFunction" v-if="!(status==='DONE')" class="status-change-button" size="small"
|
|
|
|
|
+ type="primary">
|
|
|
|
|
+ {{ buttonText }}
|
|
|
|
|
+ </el-button>
|
|
|
|
|
+ </div>
|
|
|
|
|
+ </template>
|
|
|
|
|
+
|
|
|
|
|
+ <el-descriptions
|
|
|
|
|
+ :column="1"
|
|
|
>
|
|
>
|
|
|
- <el-form>
|
|
|
|
|
-
|
|
|
|
|
- <el-form-item >
|
|
|
|
|
- <span style="margin-right: 30px">商品满意度</span>
|
|
|
|
|
- <el-rate v-model="rating" clearable
|
|
|
|
|
- :texts="['非常差', '差', '普通', '好', '非常好']"
|
|
|
|
|
- show-text/>
|
|
|
|
|
- </el-form-item>
|
|
|
|
|
-
|
|
|
|
|
- <el-form-item>
|
|
|
|
|
- <label>文字评价</label>
|
|
|
|
|
- <el-input v-model="content" type="textarea" rows="10" placeholder="说点什么吧">
|
|
|
|
|
-
|
|
|
|
|
- </el-input>
|
|
|
|
|
- </el-form-item>
|
|
|
|
|
-
|
|
|
|
|
- <el-form-item>
|
|
|
|
|
- <el-button type="primary" @click="handleSendComment">评价</el-button>
|
|
|
|
|
- <el-button @click="commentDialogVisible = false">取消</el-button>
|
|
|
|
|
- </el-form-item>
|
|
|
|
|
- </el-form>
|
|
|
|
|
- </el-dialog>
|
|
|
|
|
|
|
+ <el-descriptions-item style="font-size: 15px" label="商品">
|
|
|
|
|
+ {{ productName }}
|
|
|
|
|
+ </el-descriptions-item>
|
|
|
|
|
+ <el-descriptions-item style="font-size: 15px" label="数量">
|
|
|
|
|
+ {{ amount }} 件
|
|
|
|
|
+ </el-descriptions-item>
|
|
|
|
|
+ <el-descriptions-item style="font-size: 15px" label="订单原价">
|
|
|
|
|
+ {{ totalPrice }} 元
|
|
|
|
|
+ </el-descriptions-item>
|
|
|
|
|
+ <el-descriptions-item style="font-size: 15px" label="实付金额">
|
|
|
|
|
+ {{ parsePaid() }}
|
|
|
|
|
+ </el-descriptions-item>
|
|
|
|
|
+ <el-descriptions-item style="font-size: 15px" label="取货类型">
|
|
|
|
|
+ <el-tag> {{ parseType() }}</el-tag>
|
|
|
|
|
+ </el-descriptions-item>
|
|
|
|
|
+ <el-descriptions-item style="font-size: 15px" label="创建时间">
|
|
|
|
|
+ {{ parseTime(createTime) }}
|
|
|
|
|
+ </el-descriptions-item>
|
|
|
|
|
+ <el-descriptions-item style="font-size: 15px" label="完成时间">
|
|
|
|
|
+ {{ parseTime(finishTime) }}
|
|
|
|
|
+ </el-descriptions-item>
|
|
|
|
|
+ <el-descriptions-item style="font-size: 15px" label="评分" v-if="status==='DONE'">
|
|
|
|
|
+ <el-rate
|
|
|
|
|
+ v-model="rating"
|
|
|
|
|
+ disabled
|
|
|
|
|
+ show-score
|
|
|
|
|
+ text-color="#ff9900"
|
|
|
|
|
+ score-template="{value} 分"
|
|
|
|
|
+ size="small"
|
|
|
|
|
+ />
|
|
|
|
|
+ </el-descriptions-item>
|
|
|
|
|
+ <el-descriptions-item style="font-size: 15px" label="评价内容" v-if="status==='DONE'">
|
|
|
|
|
+ {{ content }}
|
|
|
|
|
+ </el-descriptions-item>
|
|
|
|
|
+ </el-descriptions>
|
|
|
|
|
+ </el-card>
|
|
|
|
|
+
|
|
|
|
|
+ <el-dialog v-model="orderDialogVisible" title="订单详情">
|
|
|
|
|
+ <el-form>
|
|
|
|
|
+ <el-form-item>
|
|
|
|
|
+ <label for="amount">购买数量:</label>
|
|
|
|
|
+ {{ amount }} 件
|
|
|
|
|
+ </el-form-item>
|
|
|
|
|
+ <el-form-item>
|
|
|
|
|
+ <label for="discountPrice">折扣前总价:</label>
|
|
|
|
|
+ {{ totalPrice }} 元
|
|
|
|
|
+ </el-form-item>
|
|
|
|
|
+ <el-form-item>
|
|
|
|
|
+ <label for="type">提货方式:</label>
|
|
|
|
|
+ {{ parseOrderType(type) }}
|
|
|
|
|
+ </el-form-item>
|
|
|
|
|
+ <el-form-item>
|
|
|
|
|
+ <label for="type">优惠券:</label>
|
|
|
|
|
+ <el-button @click="setCurrent()">不使用优惠券</el-button>
|
|
|
|
|
+ <el-table
|
|
|
|
|
+ ref="singleTableRef"
|
|
|
|
|
+ :data="availableCouponList"
|
|
|
|
|
+ highlight-current-row
|
|
|
|
|
+ style="width: 100%"
|
|
|
|
|
+ @current-change="handleCurrentChange"
|
|
|
|
|
+ >
|
|
|
|
|
+ <el-table-column type="index" width="50"/>
|
|
|
|
|
+ <el-table-column prop="type" label="类型" width="180">
|
|
|
|
|
+ <template #default="scope">
|
|
|
|
|
+ {{ parseCouponType(scope.row.type) }}
|
|
|
|
|
+ </template>
|
|
|
|
|
+ </el-table-column>
|
|
|
|
|
+ <el-table-column prop="satisfaction" label="满(元)" width="180"/>
|
|
|
|
|
+ <el-table-column prop="minus" label="减(元)" width="180"/>
|
|
|
|
|
+ </el-table>
|
|
|
|
|
+ </el-form-item>
|
|
|
|
|
+ </el-form>
|
|
|
|
|
+ <el-button @click="handleConfirmOrder" type="primary" plain>确认支付</el-button>
|
|
|
|
|
+ </el-dialog>
|
|
|
|
|
+
|
|
|
|
|
+ <el-dialog
|
|
|
|
|
+ v-model="commentDialogVisible"
|
|
|
|
|
+ title="发起评价"
|
|
|
|
|
+ >
|
|
|
|
|
+ <el-form>
|
|
|
|
|
+
|
|
|
|
|
+ <el-form-item>
|
|
|
|
|
+ <span style="margin-right: 30px">商品满意度</span>
|
|
|
|
|
+ <el-rate v-model="rating" clearable
|
|
|
|
|
+ :texts="['非常差', '差', '普通', '好', '非常好']"
|
|
|
|
|
+ show-text/>
|
|
|
|
|
+ </el-form-item>
|
|
|
|
|
+
|
|
|
|
|
+ <el-form-item>
|
|
|
|
|
+ <label>文字评价</label>
|
|
|
|
|
+ <el-input v-model="content" type="textarea" rows="10" placeholder="说点什么吧">
|
|
|
|
|
+
|
|
|
|
|
+ </el-input>
|
|
|
|
|
+ </el-form-item>
|
|
|
|
|
+
|
|
|
|
|
+ <el-form-item>
|
|
|
|
|
+ <el-button type="primary" @click="handleSendComment">评价</el-button>
|
|
|
|
|
+ <el-button @click="commentDialogVisible = false">取消</el-button>
|
|
|
|
|
+ </el-form-item>
|
|
|
|
|
+ </el-form>
|
|
|
|
|
+ </el-dialog>
|
|
|
|
|
|
|
|
</template>
|
|
</template>
|
|
|
|
|
|