From 8dd90f700e2b22ca2697496de8c0790b08b30957 Mon Sep 17 00:00:00 2001 From: sa_10_0 <2492740167@qq.com> Date: Mon, 4 Nov 2024 18:30:18 +0800 Subject: [PATCH] =?UTF-8?q?=E5=8F=98=E6=9B=B4?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/layout/components/Aside.vue | 8 +- src/router/routes.ts | 5 + src/views/Coupons/CouponCenter.vue | 3 +- src/views/Orders/OrderList.vue | 178 ++++++++++++++++++++++++++++- 4 files changed, 185 insertions(+), 9 deletions(-) diff --git a/src/layout/components/Aside.vue b/src/layout/components/Aside.vue index 33c5164..18a2638 100644 --- a/src/layout/components/Aside.vue +++ b/src/layout/components/Aside.vue @@ -72,12 +72,16 @@ <el-sub-menu index="3"> <template #title> <el-icon><HomeFilled /></el-icon> - <span>订单管理</span> + <span>商品订单管理</span> </template> <el-menu-item index="/OrderList"> <el-icon><Menu /></el-icon> - <span slot="title">订单列表</span> + <span slot="title">商品订单列表</span> + </el-menu-item> + <el-menu-item index="/orderOperations"> + <el-icon><Menu /></el-icon> + <span slot="title">商品订单操作</span> </el-menu-item> </el-sub-menu> </el-menu> diff --git a/src/router/routes.ts b/src/router/routes.ts index c435562..9c67fee 100644 --- a/src/router/routes.ts +++ b/src/router/routes.ts @@ -52,6 +52,11 @@ export const routes = [ path: '/CouponCenter', name:'优惠券中心', component: ()=> import("../views/Coupons/CouponCenter.vue") + }, + { + path: '/orderOperations', + name:'商品订单操作', + component: ()=> import("../views/Orders/orderOperations.vue") } ] }, diff --git a/src/views/Coupons/CouponCenter.vue b/src/views/Coupons/CouponCenter.vue index 21e09ae..d051057 100644 --- a/src/views/Coupons/CouponCenter.vue +++ b/src/views/Coupons/CouponCenter.vue @@ -1,7 +1,7 @@ <template> <!-- 搜索--> <div> - <el-input style="width: 200px; height: 30px; margin-right: 10px;" suffix-icon="Search" placeholder="请输入商品名称" + <el-input style="width: 200px; height: 30px; margin-right: 10px;" suffix-icon="Search" placeholder="请输入优惠券名称" v-model="Couponsname"></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> @@ -188,7 +188,6 @@ const saveEdit = async () => { //编辑商品 } } const ReviseOrView = (index: number, row: any , flag : number) => { - //flag值不同显示不同内容 disabled开启和关闭 flag ? (title.value = "编辑商品" , disabled.value = false) : (title.value = "商品详情" , disabled.value = true) DialogVisible.value = true; editForm.value = row; diff --git a/src/views/Orders/OrderList.vue b/src/views/Orders/OrderList.vue index b75cfc8..3a58661 100644 --- a/src/views/Orders/OrderList.vue +++ b/src/views/Orders/OrderList.vue @@ -1,13 +1,181 @@ <template> - <div> - - </div> +<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> + </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="userId" label="用户id"></el-table-column> + <el-table-column prop="orderNumber" label="订单编号" width="180"></el-table-column> +<!-- <el-table-column prop="addressSnapshot" label="地址信息快照"></el-table-column>--> +<!-- <el-table-column prop="contactsSnapshot" label="联系人信息快照"></el-table-column>--> +<!-- <el-table-column prop="couponSnapshot" label="优惠券信息快照"></el-table-column>--> + <el-table-column prop="totalAmount" 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-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 title="订单详情信息" v-model="" width="30%"> + <el-form label-width="100px" size="default"> + <el-form-item label="订单id"> + <el-input v-model="" autocomplete="off"></el-input> + </el-form-item> + <el-form-item label="用户id"> + <el-input v-model="" autocomplete="off"></el-input> + </el-form-item> + <el-form-item label="用户名称"> + <el-input v-model="" autocomplete="off"></el-input> + </el-form-item> + <el-form-item label="订单编号"> + <el-input v-model="" autocomplete="off"></el-input> + </el-form-item> + <el-form-item label="收货地址"> + <el-input v-model="" autocomplete="off"></el-input> + </el-form-item> + <el-form-item label="详细地址"> + <el-input v-model="" autocomplete="off"></el-input> + </el-form-item> + <el-form-item label="电话"> + <el-input v-model="" autocomplete="off"></el-input> + </el-form-item> + <el-form-item label="优惠券名称"> + <el-input v-model="" autocomplete="off"></el-input> + </el-form-item> + <el-form-item label="优惠券名称"> + <el-input v-model="" autocomplete="off"></el-input> + </el-form-item> + <el-form-item label="满减金额"> + <el-input v-model="" autocomplete="off"></el-input> + </el-form-item> + <el-form-item label="订单总金额"> + <el-input v-model="" autocomplete="off"></el-input> + </el-form-item> + <el-form-item label="订单状态"> + <el-input v-model="" autocomplete="off"></el-input> + </el-form-item> + </el-form> + <template #footer> + <div class="dialog-footer"> + <el-button style="height: 30px;" @click="dialogFormVisible = false">取消</el-button> + <el-button style="height: 30px" type="primary" @click=save>确认</el-button> + </div> + </template> --> + <!-- </el-dialog> </template> -<script setup> +<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 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 delBatch =()=>{ + //批量删除 +} +const ReviseOrView = (index: number, row: any , flag : number) => { +title.value = "编辑商品" + DialogVisible.value = true; + editForm.value = row; +}; +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 +</style> +<script setup lang="ts"> +</script> +<script setup lang="ts"> +</script> +<script setup lang="ts"> +</script> +<script setup lang="ts"> +</script> +<script setup lang="ts"> +</script> \ No newline at end of file