From 771cd1ede21113e906697731c135a8a11428b83f Mon Sep 17 00:00:00 2001
From: yuanteng <1876787513@qq.com>
Date: Wed, 6 Nov 2024 01:12:38 +0800
Subject: [PATCH] =?UTF-8?q?=E8=A7=A3=E5=86=B3=E5=89=8D=E9=9D=A2=E7=9A=84bu?=
=?UTF-8?q?g?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
src/views/Orders/orderOperations.vue | 367 +++++++++++++++------------
1 file changed, 201 insertions(+), 166 deletions(-)
diff --git a/src/views/Orders/orderOperations.vue b/src/views/Orders/orderOperations.vue
index 5f8d2eb..87f4e9c 100644
--- a/src/views/Orders/orderOperations.vue
+++ b/src/views/Orders/orderOperations.vue
@@ -1,167 +1,202 @@
- <template>
-<div>
- <el-input style="width: 200px; height: 30px; margin-right: 10px;" suffix-icon="Search" placeholder="请输入商品名称"
- v-model="id"></el-input>
- <el-button class="ml-5" type="primary" @click="load" style="height: 25px;">搜索</el-button>
- <el-button type="warning" @click="reset" style="height:25px">重置</el-button>
-</div>
- <div style="margin: 15px 0">
- <el-popconfirm class="ml-5" confirm-button-text='确定' cancel-button-text='取消' icon="InfoFilled" icon-color="red"
- title="您确定批量删除这些数据吗？" @confirm="delBatch" width=180>
- <template #reference>
- <el-button style="height: 25px" class="ml-5" type="danger">批量删除 <el-icon style="margin-left: 5px;">
- <Remove />
- </el-icon></el-button>
- </template>
- </el-popconfirm>
+<template>
+ <div>
+ <el-input style="width: 200px; height: 30px; margin-right: 10px;" suffix-icon="Search" placeholder="请输入商品名称"
+ v-model="id"></el-input>
+ <el-button class="ml-5" type="primary" @click="load" style="height: 25px;">搜索</el-button>
+ <el-button type="warning" @click="reset" style="height:25px">重置</el-button>
</div>
- <el-table :data="tableData" border stripe header-cell-class-name="headerBg"
- :cell-style="{ 'text-align': 'center', 'font-size': '16px' }" @selection-change="handleSelectionChange"
- :header-cell-style="{ 'text-align': 'center' }">
- <el-table-column type="selection" width="55"></el-table-column>
- <el-table-column prop="id" label="订单id" width="80"></el-table-column>
- <el-table-column prop="goodSnapshot.name" label="商品名称"></el-table-column>
- <el-table-column prop="quantity" label="购买数量" width="180"></el-table-column>
- <el-table-column prop="totalAmount" label="订单总金额"></el-table-column>
- <el-table-column prop="createTime" label="下单时间"></el-table-column>
- <el-table-column prop="orderNumber" label="快递单号"></el-table-column>
- <el-table-column prop="orderStatus" label="订单状态"></el-table-column>
- <el-table-column label="操作" width="250px">
- <template #default="scope">
- <el-button size="small" @click="ReviseOrView(scope.$index, scope.row , 0)">
- 编辑
- </el-button>
- <el-button plain @click="dialogFormVisible = true">
- 发货
- </el-button>
- <el-popconfirm class="ml-5" confirm-button-text='确定' cancel-button-text='取消' icon="InfoFilled" icon-color="red"
- title="是否确认删除" @confirm="deleteProduct(scope.row.id)" width=180>
- <template #reference>
- <el-button class="ml-5" type="danger">取消订单</el-button>
- </template>
- </el-popconfirm>
- <el-popconfirm confirm-button-text='确定' cancel-button-text='取消' icon="el-icon-info" icon-color="red"
- title="您确定删除吗？">
- </el-popconfirm>
- </template>
- </el-table-column>
- </el-table>
- <div style="padding: 10px 0">
- <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange"
- :current-page="searchParams.current" :page-size="searchParams.pageSize" :page-sizes="[5, 10, 15, 20]"
- :small="null" :disabled="null" :background="null" layout="total, sizes, prev, pager, next, jumper"
- :total="total" />
- </div>
-<!-- <el-dialog v-model="dialogFormVisible" title="Shipping address" width="500">-->
-<!-- <el-form :model="">-->
-<!-- <el-form-item label="快递单号" :label-width="formLabelWidth">-->
-<!-- <el-input v-model=" " autocomplete="off" />-->
-<!-- </el-form-item>-->
-<!-- </el-form>-->
-<!-- <template #footer>-->
-<!-- <div class="dialog-footer">-->
-<!-- <el-button @click="dialogFormVisible = false">取消</el-button>-->
-<!-- <el-button type="primary" @click="dialogFormVisible = false">-->
-<!-- 确定-->
-<!-- </el-button>-->
-<!-- </div>-->
-<!-- </template>-->
-<!-- </el-dialog>-->
-<!--</template>-->
-
-<!--<script lang="ts" setup>-->
-<!--import {ref} from "vue";-->
-<!--import myAxios from "@/api/myAxios";-->
-<!--import {ElMessage} from "element-plus";-->
-<!--const tableData : any= ref([]);-->
-<!--const total = ref(0);-->
-<!--// const title = ref('')-->
-<!--// const editForm : any = ref({});-->
-<!--// const DialogVisible = ref(true);-->
-<!--const dialogFormVisible = ref(false)-->
-<!--const formLabelWidth = '140px'-->
-<!--const searchParams: any = ref({ //封装分页-->
-<!-- current: 1, //当前页码-->
-<!-- pageSize: 5 //每页显示条数-->
-<!--})-->
-<!--const handleSizeChange = (newSize: any) => {-->
-<!-- searchParams.value.pageSize = newSize //新的页面数-->
-<!-- getOrderList()-->
-<!--}-->
-<!--const handleCurrentChange = (Current: any) => {-->
-<!-- searchParams.value.current = Current-->
-<!-- getOrderList()-->
-<!--}-->
-<!--const handleSelectionChange = (row: any) => {-->
-<!-- id.value = JSON.parse(JSON.stringify(row));-->
-<!--}-->
-<!--const getOrderList = async () => {-->
-<!-- try {-->
-<!-- const res = await myAxios.post('', { ...searchParams.value });-->
-<!-- if (res.data.code === 1) {-->
-<!-- tableData.value = res.data.data.records;-->
-<!-- total.value = parseInt(res.data.data.total)-->
-<!-- } else {-->
-<!-- ElMessage({-->
-<!-- message: '获取数据失败',-->
-<!-- });-->
-<!-- }-->
-<!-- } catch (error) {-->
-<!-- ElMessage({-->
-<!-- message: '发生错误',-->
-<!-- });-->
-<!-- }-->
-<!--}-->
-<!--const orderList = ref({-->
-<!--id:'',-->
-<!--userId:'',-->
-<!--addressSnapshot:{-->
-<!--name:'',-->
-<!--phone:'',-->
-<!--region:'',-->
-<!--detailAddress:''-->
-<!--},-->
-<!--couponSnapshot:{-->
-<!--name:'',-->
-<!--conditionAmount:''-->
-<!--},-->
-<!--totalAmount:'',-->
-<!--orderStatus:'',-->
-<!--createTime:'',-->
-<!--updateTime:'',-->
-<!--isDelete:'',-->
-<!--orderNumber:''-->
-<!--})-->
-<!--const delBatch =()=>{-->
-<!-- //批量取消-->
-<!--}-->
-<!--//发货-->
-<!--const shipments = (index: number, row: any , flag : number) => {-->
-
-<!--};-->
-<!--//编辑-->
-<!--const ReviseOrView = (index: number, row: any , flag : number) => {-->
-
-<!--};-->
-<!--const deleteProduct = async (index: number) => {-->
-<!-- console.log(typeof index)-->
-<!-- const res = await myAxios.post('/goods/delete', { id: index })-->
-<!-- console.log(res)-->
-<!-- if (res.data.code === 1) {-->
-<!-- ElMessage({-->
-<!-- type: 'success',-->
-<!-- message: '删除成功',-->
-<!-- })-->
-<!-- getOrderList()-->
-<!-- }-->
-<!--}-->
-<!--const reset = () => {-->
-<!-- id.value = '';-->
-
-<!--};-->
-<!--const load =()=>{}-->
-<!--</script>-->
-
-<!--<style lang="scss" scoped>-->
-
-<!--</style> -->
+ <div style="margin: 15px 0">
+ <el-popconfirm class="ml-5" confirm-button-text='确定' cancel-button-text='取消' icon="InfoFilled" icon-color="red"
+ title="您确定批量删除这些数据吗？" @confirm="delBatch" width=180>
+ <template #reference>
+ <el-button style="height: 25px" class="ml-5" type="danger">批量删除 <el-icon style="margin-left: 5px;">
+ <Remove />
+ </el-icon></el-button>
+ </template>
+ </el-popconfirm>
+ </div>
+ <el-table :data="tableData" border stripe header-cell-class-name="headerBg"
+ :cell-style="{ 'text-align': 'center', 'font-size': '16px' }" @selection-change="handleSelectionChange"
+ :header-cell-style="{ 'text-align': 'center' }">
+ <el-table-column type="selection" width="55"></el-table-column>
+ <el-table-column prop="id" label="订单id" width="80"></el-table-column>
+ <el-table-column prop="goodSnapshot.name" label="商品名称"></el-table-column>
+ <el-table-column prop="quantity" label="购买数量" width="180"></el-table-column>
+ <el-table-column prop="totalAmount" label="订单总金额"></el-table-column>
+ <el-table-column prop="createTime" label="下单时间"></el-table-column>
+ <el-table-column prop="orderNumber" label="快递单号"></el-table-column>
+ <el-table-column prop="orderStatus" label="订单状态"></el-table-column>
+ <el-table-column label="操作" width="250px">
+ <template #default="scope">
+ <el-button size="small" @click="ReviseOrView(scope.$index, scope.row , 0)">
+ 编辑
+ </el-button>
+ <el-button plain @click="dialogFormVisible = true">
+ 发货
+ </el-button>
+ <el-popconfirm class="ml-5" confirm-button-text='确定' cancel-button-text='取消' icon="InfoFilled" icon-color="red"
+ title="是否确认删除" @confirm="deleteProduct(scope.row.id)" width=180>
+ <template #reference>
+ <el-button class="ml-5" type="danger">取消订单</el-button>
+ </template>
+ </el-popconfirm>
+ <el-popconfirm confirm-button-text='确定' cancel-button-text='取消' icon="el-icon-info" icon-color="red"
+ title="您确定删除吗？">
+ </el-popconfirm>
+ </template>
+ </el-table-column>
+ </el-table>
+ <div style="padding: 10px 0">
+ <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange"
+ :current-page="searchParams.current" :page-size="searchParams.pageSize" :page-sizes="[5, 10, 15, 20]"
+ :small="null" :disabled="null" :background="null" layout="total, sizes, prev, pager, next, jumper"
+ :total="total" />
+ </div>
+ <!-- <el-dialog v-model="dialogFormVisible" title="Shipping address" width="500">-->
+ <!-- <el-form :model="">-->
+ <!-- <el-form-item label="快递单号" :label-width="formLabelWidth">-->
+ <!-- <el-input v-model=" " autocomplete="off" />-->
+ <!-- </el-form-item>-->
+ <!-- </el-form>-->
+ <!-- <template #footer>-->
+ <!-- <div class="dialog-footer">-->
+ <!-- <el-button @click="dialogFormVisible = false">取消</el-button>-->
+ <!-- <el-button type="primary" @click="dialogFormVisible = false">-->
+ <!-- 确定-->
+ <!-- </el-button>-->
+ <!-- </div>-->
+ <!-- </template>-->
+ <!-- </el-dialog>-->
+ </template>
+
+ <script lang="ts" setup>
+ import {ref,onMounted} from "vue";
+ import myAxios from "@/api/myAxios";
+ import {ElMessage} from "element-plus";
+ const tableData : any= ref([]);
+ const total = ref(0);
+ const num = ref(0)
+ const dialogFormVisible = ref(false)
+ const formLabelWidth = '140px'
+ onMounted(()=>{
+ getOrderList()
+ })
+
+ const searchParams: any = ref({ //封装分页
+ current: 1, //当前页码
+ pageSize: 5 //每页显示条数
+ })
+ const handleSizeChange = (newSize: any) => {
+ searchParams.value.pageSize = newSize //新的页面数
+ getOrderList()
+ }
+ const handleCurrentChange = (Current: any) => {
+ searchParams.value.current = Current
+ getOrderList()
+ }
+ const handleSelectionChange = (row: any) => {
+ // id.value = JSON.parse(JSON.stringify(row));
+ }
+ const getOrderList = async () => {
+ try {
+ const res = await myAxios.post('/order/list/page', { ...searchParams.value });
+ // console.log(res)
+ if (res.data.code === 1) {
+ tableData.value = res.data.data.records
+ total.value = parseInt(res.data.data.total)
+ for(let key in tableData.value) {
+ num.value = parseInt(key)
+ const resOrderDetail = await myAxios.post('/order/list/item',{id:tableData.value[key].id})
+ if( resOrderDetail.data.code === 1 ) {
+ tableData.value.goodSnapshot= resOrderDetail.data.data[key].goodSnapshot
+ tableData.value.quantity = resOrderDetail.data.data[key].quality
+ // console.log(resOrderDetail.data.data[0].goodSnapshot.name)
+ console.log( tableData.value.goodSnapshot.name)
+ console.log( resOrderDetail.data.data[key].quantity)
+ }
+ }
+ } else {
+ ElMessage({
+ message: '获取数据失败',
+ });
+ }
+ } catch (error) {
+ ElMessage({
+ message: '发生错误',
+ });
+ }
+ }
+
+
+ // const getItemList = async (id: number) => {
+ // try {
+ // const res = await myAxios.post('/order/list/item', { id:tableData.value[key].id});
+ // console.log(res)
+ // if (res.data.code === 1) {
+ // tableData.value = res.data.data.records;
+ // total.value = parseInt(res.data.data.total)
+ // } else {
+ // ElMessage({
+ // message: '获取数据失败',
+ // });
+ // }
+ // } catch (error) {
+ // ElMessage({
+ // message: '发生错误',
+ // });
+ // }
+ // }
+
+ // const orderList = ref({
+ // id:'',
+ // userId:'',
+ // addressSnapshot:{
+ // name:'',
+ // phone:'',
+ // region:'',
+ // detailAddress:''
+ // },
+ // couponSnapshot:{
+ // name:'',
+ // conditionAmount:''
+ // },
+ // totalAmount:'',
+ // orderStatus:'',
+ // createTime:'',
+ // updateTime:'',
+ // isDelete:'',
+ // orderNumber:''
+ // })
+ const delBatch =()=>{
+ //批量取消
+ }
+ //发货
+ const shipments = (index: number, row: any , flag : number) => {
+
+ };
+ //编辑
+ const ReviseOrView = (index: number, row: any , flag : number) => {
+
+ };
+ const deleteProduct = async (index: number) => {
+ console.log(typeof index)
+ const res = await myAxios.post('/goods/delete', { id: index })
+ console.log(res)
+ if (res.data.code === 1) {
+ ElMessage({
+ type: 'success',
+ message: '删除成功',
+ })
+ getOrderList()
+ }
+ }
+ const reset = () => {
+ id.value = '';
+
+ };
+ const load =()=>{}
+ </script>
+
+ <style lang="scss" scoped>
+
+ </style>
\ No newline at end of file