admin1/jiangchengfeiyi-Web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Changes

Browse Source
This commit is contained in:
chen-xin-zhi 2025-02-20 14:31:23 +08:00
parent 8b1160eed4
commit 7573b01ab4
6 changed files with 452 additions and 86 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
src/layout/components/Aside.vue
View File

@ -98,6 +98,11 @@
<el-icon><Menu /></el-icon> <el-icon><Menu /></el-icon>
<span slot="title">实体商品订单列表</span> <span slot="title">实体商品订单列表</span>
</el-menu-item> </el-menu-item>
<el-menu-item index="/ServiceOrderList">
<el-icon><Menu /></el-icon>
<span slot="title">服务类商品订单列表</span>
</el-menu-item>
</el-sub-menu> </el-sub-menu>
<el-sub-menu index="6"> <el-sub-menu index="6">
<template #title> <template #title>

42
src/layout/components/calendarUtil.vue
View File

@ -8,7 +8,6 @@
]" ]"
@click="handleDateClick(data.day)" @click="handleDateClick(data.day)"
class="calendar-date-cell" class="calendar-date-cell"
> >
{{ data.day.split('-').slice(1).join('-') }} {{ data.day.split('-').slice(1).join('-') }}
{{ data.isSelected ? '✔️' : '' }} {{ data.isSelected ? '✔️' : '' }}
@ -18,7 +17,7 @@
</el-calendar> </el-calendar>
<el-drawer v-model="drawer" :title="'当前选择的日期是：' + periodObj.specificDate" :with-header="true" @open="drawerOpen" @closed="drawerClean"> <el-drawer v-model="drawer" :title="'当前选择的日期是：' + periodObj.specificDate" :with-header="true" @open="drawerOpen" @closed="drawerClean">
<div style="margin-bottom: 20px;">选择当天时间段和人数</div> <div style="margin-bottom: 20px;">选择当天时间段和人数</div>
<div class="timebox" v-for="(item,index) in periodObj.timePeriodAddRequestList"> <div class="timebox" v-for="(item,index) in periodObj.timePeriodAddRequestList" style="margin-bottom: 40px">
<span>选择时间段</span> <span>选择时间段</span>
<el-time-picker <el-time-picker
v-model="timePickArr[index]" v-model="timePickArr[index]"
@ -28,18 +27,23 @@
start-placeholder="开始" start-placeholder="开始"
end-placeholder="结束" end-placeholder="结束"
value-format="HH:mm" value-format="HH:mm"
:style="{ width: '236px' }" :style="{ width: '236px' , marginLeft: '20px'}"
@change="saveTime(index)" @change="saveTime(index)"
/> />
<div> <div style="margin-top: 15px;">
<span>最小人数:</span> <div style="display: flex; align-items: center">
<el-select v-model="periodObj.timePeriodAddRequestList[index].minNumber" style="width: 100px" @change="minNum(index)"> <div style="margin-bottom: 15px"><span>最小人数:</span></div>
<el-option v-for="item in minArr" :label="item" :value="item" /> <el-select v-model="periodObj.timePeriodAddRequestList[index].minNumber" style="width: 100px; margin: 0 0 15px 30px" @change="minNum(index)">
</el-select> <el-option v-for="item in minArr" :label="item" :value="item" />
<span>最大人数:</span> </el-select><br>
<el-select v-model="periodObj.timePeriodAddRequestList[index].maxNumber" style="width: 100px" @change="maxNum(index)"> </div>
<el-option v-for="item in maxArr" :label="item" :value="item" />
</el-select> <div style="display: flex; align-items: center; margin-bottom: 15px;">
<div><span>最大人数:</span></div>
<el-select v-model="periodObj.timePeriodAddRequestList[index].maxNumber" style="width: 100px; margin: 0 15px 0 30px" @change="maxNum(index)">
<el-option v-for="item in maxArr" :label="item" :value="item" />
</el-select>
</div>
<el-button circle @click="addList(index)"><el-icon> <el-button circle @click="addList(index)"><el-icon>
<Plus /> <Plus />
</el-icon></el-button> </el-icon></el-button>
@ -48,10 +52,12 @@
</el-icon></el-button> </el-icon></el-button>
</div> </div>
</div> </div>
<el-checkbox v-model="isBook" label="这天可预约" style="margin-left: 10px;"/> <div style="display: flex; align-items: center">
<el-button type="success" round @click="saveInfo">保存</el-button> <el-checkbox v-model="isBook" label="可否预约" size="large" style="margin-right: 15px"/>
<el-button type="danger" round @click="closeForm">取消</el-button> <el-button type="success" round @click="saveInfo">保存</el-button>
<el-button type="primary" round @click="resetForm">重置</el-button> <el-button type="danger" round @click="closeForm">取消</el-button>
<el-button type="primary" round @click="resetForm">重置</el-button>
</div>
</el-drawer> </el-drawer>
<el-button type="success" round @click="emittValue" style="margin-left: 100px;">保存</el-button> <el-button type="success" round @click="emittValue" style="margin-left: 100px;">保存</el-button>
</template> </template>
@ -59,6 +65,7 @@
<script setup lang="ts"> <script setup lang="ts">
import { ref , onMounted , defineEmits} from 'vue' import { ref , onMounted , defineEmits} from 'vue'
import { ElMessage } from 'element-plus'; import { ElMessage } from 'element-plus';
import emitter from "@/utils/emitter";
const Selectdate = ref('') const Selectdate = ref('')
//日期1.20 //日期1.20
const selectedDates = ref<string[]>([]) //选中的日期 const selectedDates = ref<string[]>([]) //选中的日期
@ -187,6 +194,9 @@ const emittValue =()=>{ //点击保存后将值传给父组件
appointmentDateAddRequestList.value.splice(0,appointmentDateAddRequestList.value.length) //防止用户狂点 appointmentDateAddRequestList.value.splice(0,appointmentDateAddRequestList.value.length) //防止用户狂点
periodMap.forEach(mapFun) periodMap.forEach(mapFun)
emit('calendar-Info',appointmentDateAddRequestList.value) emit('calendar-Info',appointmentDateAddRequestList.value)
emitter.on('clear', () => {
periodMap.clear()
})
} }
const mapFun =(value:any ,key:any ,map:any)=>{ //遍历map的统一函数 const mapFun =(value:any ,key:any ,map:any)=>{ //遍历map的统一函数
if(periodMap.has(key)) { if(periodMap.has(key)) {

5
src/router/routes.ts
View File

@ -50,6 +50,11 @@ export const routes = [
name: '订单列表', name: '订单列表',
component: ()=> import("../views/Orders/OrderList.vue") component: ()=> import("../views/Orders/OrderList.vue")
}, },
{
path: '/ServiceOrderList',
name: '服务类订单列表',
component: ()=> import("../views/Orders/ServiceOrderList.vue")
},
{ {
path: '/AddCoupons', path: '/AddCoupons',
name:'添加优惠券', name:'添加优惠券',

101
src/views/Orders/OrderList.vue
View File

@ -15,37 +15,37 @@
{{ $index + 1 }} {{ $index + 1 }}
</template> </template>
</el-table-column> </el-table-column>
<el-table-column prop="orderNumber" label="订单编号" width="180"></el-table-column> <el-table-column prop="orderNumber" label="订单编号" width="300"></el-table-column>
<el-table-column prop="createTime" label="下单时间" width="180"></el-table-column> <el-table-column prop="createTime" label="下单时间" width="180"></el-table-column>
<el-table-column prop="userName" label="用户名" width="80"></el-table-column> <el-table-column prop="userName" label="用户名" width="120"></el-table-column>
<el-table-column label="所购买的商品" width="100"> <el-table-column label="所购买的商品" width="100">
<el-table-column label="展开所有商品" type="expand" width="100"> <el-table-column label="展开所有商品" type="expand" width="100">
<template #default="props"> <template #default="props">
<el-table :data="props.row.orderItemList"> <el-table :data="props.row.orderItemList">
<el-table-column label="商品名称" prop="goodSnapshot.name" /> <el-table-column label="商品名称" prop="goodSnapshot.name" width="200"/>
<el-table-column label="商品图片" prop="goodSnapshot.goodImg"> <el-table-column label="商品图片" prop="goodSnapshot.goodImg" width="200">
<template #default="scope"> <template #default="scope">
<div> <div>
<img :src="scope.row.goodSnapshot.goodImg.split(';')[0]" alt="" style="height: 50px;"> <img :src="scope.row.goodSnapshot.goodImg.split(';')[0]" alt="" style="height: 50px;">
</div> </div>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="类别" prop="goodSnapshot.type" /> <el-table-column label="类别" prop="goodSnapshot.type" width="200"/>
<el-table-column label="商品单价" prop="goodSnapshot.price" /> <el-table-column label="商品单价" prop="goodSnapshot.price" width="200" />
<el-table-column label="是否是限定商品" prop="goodSnapshot.festivalOrder" /> <!-- <el-table-column label="是否是限定商品" prop="goodSnapshot.festivalOrder" width="150"/>-->
<el-table-column label="数量" prop="quantity" /> <el-table-column label="数量" prop="quantity" width="200"/>
<el-table-column label="总价" prop="itemTotalAmount" /> <el-table-column label="总价" prop="itemTotalAmount" width="200"/>
</el-table> </el-table>
</template> </template>
</el-table-column> </el-table-column>
</el-table-column> </el-table-column>
<el-table-column label="地址信息快照" width="180"> <el-table-column label="地址信息" width="180">
<el-table-column prop="addressSnapshot.name" label="收货人" /> <el-table-column prop="addressSnapshot.name" label="收货人" />
<el-table-column prop="addressSnapshot.phone" label="手机号" width="180"/> <el-table-column prop="addressSnapshot.phone" label="手机号" width="180"/>
<el-table-column prop="addressSnapshot.region" label="地区" width="180"/> <el-table-column prop="addressSnapshot.region" label="地区" width="180"/>
<el-table-column prop="addressSnapshot.detailAddress" label="详细地址" width="180"/> <el-table-column prop="addressSnapshot.detailAddress" label="详细地址" width="180"/>
</el-table-column> </el-table-column>
<el-table-column label="优惠卷信息快照" width="50"> <el-table-column label="优惠卷信息" width="50">
<el-table-column prop="couponSnapshot.name" label="优惠卷名称" /> <el-table-column prop="couponSnapshot.name" label="优惠卷名称" />
<el-table-column prop="couponSnapshot.conditionAmount" label="优惠金额" /> <el-table-column prop="couponSnapshot.conditionAmount" label="优惠金额" />
</el-table-column> </el-table-column>
@ -57,7 +57,7 @@
<el-button size="small" @click="showDetail(scope.$index, scope.row)"> <el-button size="small" @click="showDetail(scope.$index, scope.row)">
详情 详情
</el-button> </el-button>
<el-button :disabled="!['待发货'].includes(scope.row.orderStatus)" size="small" @click="openShipmentDialog(scope.row.id)" > <!-- @click="deliverGoods(scope.row)"--> <el-button :disabled="!['待发货'].includes(scope.row.orderStatus)" size="small" @click="openShipmentDialog(scope.row.id)" > <!-- @click="deliverGoods(scope.row)"-->
发货 发货
</el-button> </el-button>
<el-button :disabled="!['待支付'].includes(scope.row.orderStatus)" size="small" @click="cancelOrder(scope.row)" type="warning" plain> <el-button :disabled="!['待支付'].includes(scope.row.orderStatus)" size="small" @click="cancelOrder(scope.row)" type="warning" plain>
@ -80,43 +80,61 @@
<el-dialog title="订单详情信息" v-model="DialogVisible" width="60%"> <el-dialog title="订单详情信息" v-model="DialogVisible" width="60%">
<el-form label-width="100px" size="default" :model="editForm" :disabled="disabled"> <el-form label-width="100px" size="default" :model="editForm" :disabled="disabled">
<div style="display: flex"> <div style="display: flex">
<el-form-item label="订单编号" style="width: 200px"> <el-form-item label="订单编号" style="width: 400px">
<el-input v-model="editForm.addressSnapshot" autocomplete="off"></el-input> <el-input v-model="editForm.orderNumber" autocomplete="off"></el-input>
</el-form-item> </el-form-item>
<el-form-item label="用户名称" style="width: 300px"> </div>
<div style="display: flex">
<el-form-item label="收货人姓名" style="width: 300px">
<el-input v-model="editForm.addressSnapshot.name" autocomplete="off"></el-input> <el-input v-model="editForm.addressSnapshot.name" autocomplete="off"></el-input>
</el-form-item> </el-form-item>
</div>
<div style="display: flex"> <el-form-item label="手机号" style="width: 300px">
<el-form-item label="收货手机" style="width: 200px">
<el-input v-model="editForm.addressSnapshot.phone" autocomplete="off"></el-input> <el-input v-model="editForm.addressSnapshot.phone" autocomplete="off"></el-input>
</el-form-item> </el-form-item>
<el-form-item label="收货地址" style="width: 400px"> </div>
<div style="display: flex">
<el-form-item label="收货地址" style="width: 300px">
<el-input v-model="editForm.addressSnapshot.region" autocomplete="off"></el-input> <el-input v-model="editForm.addressSnapshot.region" autocomplete="off"></el-input>
</el-form-item> </el-form-item>
</div>
<!-- 这里的商品明细就不放图片了 --> <el-form-item label="详细地址">
<div style="display: flex">
<el-form-item label="商品明细">
<el-input v-model="editForm.addressSnapshot.detailAddress" autocomplete="off"></el-input> <el-input v-model="editForm.addressSnapshot.detailAddress" autocomplete="off"></el-input>
</el-form-item> </el-form-item>
<el-form-item label="订单总金额" style="width: 250px"> </div>
<el-input v-model="editForm.totalAmount" autocomplete="off"></el-input>
</el-form-item> <!-- 这里的商品明细就不放图片了 -->
<div style="display: flex"></div>
<el-form-item label="订单状态" style="width: 250px"> <el-form-item label="订单状态" style="width: 250px">
<el-input v-model="editForm.orderStatus" autocomplete="off"></el-input> <el-input v-model="editForm.orderStatus" autocomplete="off"></el-input>
</el-form-item> </el-form-item>
</div>
<el-form-item label="快递单号" style="width: 300px">
<el-input v-model="editForm.trackingNumber" autocomplete="off"></el-input>
</el-form-item>
<div style="display: flex"> <div style="display: flex">
<el-form-item label="创建时间" style="width: 300px;"> <el-form-item label="订单总金额" style="width: 250px">
<el-input v-model="totalAmount" autocomplete="off"></el-input>
</el-form-item>
<el-form-item label="优惠价格" style="width: 250px">
<el-input v-model="couponAmount" autocomplete="off"></el-input>
</el-form-item>
</div>
<el-form-item label="订单实付金额" style="width: 250px">
<el-input v-model="editForm.totalAmount" autocomplete="off"></el-input>
</el-form-item>
<el-form-item label="快递单号" style="width: 300px">
<el-input v-model="editForm.trackingNumber" autocomplete="off"></el-input>
</el-form-item>
<div style="display: flex">
<el-form-item label="下单时间" style="width: 300px;">
<el-input v-model="editForm.createTime" autocomplete="off"></el-input> <el-input v-model="editForm.createTime" autocomplete="off"></el-input>
</el-form-item> </el-form-item>
<el-form-item label="更新时间" style="width: 300px;"> <!-- <el-form-item label="更新时间" style="width: 300px;">-->
<el-input v-model="editForm.updateTime" autocomplete="off"></el-input> <!-- <el-input v-model="editForm.updateTime" autocomplete="off"></el-input>-->
</el-form-item> <!-- </el-form-item>-->
</div> </div>
</el-form> </el-form>
<template #footer> <template #footer>
@ -126,7 +144,7 @@
</div> </div>
</template> </template>
</el-dialog> </el-dialog>
<!-- 发货弹窗--> <!-- 发货弹窗-->
<el-dialog title="发货" v-model="shipments" width="60%"> <el-dialog title="发货" v-model="shipments" width="60%">
<el-form label-width="100px" size="default" > <el-form label-width="100px" size="default" >
<el-form-item label="快递单号" style="width: 300px;"> <el-form-item label="快递单号" style="width: 300px;">
@ -136,7 +154,7 @@
<template #footer> <template #footer>
<div class="dialog-footer"> <div class="dialog-footer">
<el-button style="height: 30px;" @click=" shipments = false">取消</el-button> <el-button style="height: 30px;" @click=" shipments = false">取消</el-button>
<el-button style="height: 30px" type="primary" @click="deliverGoods ">确认</el-button> <el-button style="height: 30px" type="primary" @click="deliverGoods">确认</el-button>
</div> </div>
</template> </template>
</el-dialog> </el-dialog>
@ -162,7 +180,8 @@ const searchParams: any = ref({ //封装分页
current: 1, //当前页码 current: 1, //当前页码
pageSize: 5, //每页显示条数 pageSize: 5, //每页显示条数
sortField: "id", //根据ID分类 sortField: "id", //根据ID分类
sortOrder: "descend" //降序 sortOrder: "descend", //降序
orderType: "product"
}) })
const loading = ref(false) const loading = ref(false)
onMounted(() => { onMounted(() => {
@ -200,11 +219,17 @@ const getOrderList = async () => {
} }
} }
//查看订单详情 //查看订单详情
const totalAmount = ref(0)
const couponAmount = ref(0)
const showDetail = (index: number, row: any) => { const showDetail = (index: number, row: any) => {
title.value = "订单详情" title.value = "订单详情"
DialogVisible.value = true; DialogVisible.value = true;
if (row.couponSnapshot !== null) {
couponAmount.value = row.couponSnapshot.conditionAmount;
}
totalAmount.value = row.totalAmount + couponAmount.value;
console.log('editForm--->',editForm.value);
editForm.value = row; editForm.value = row;
console.log('editForm--->',editForm.value);
}; };
//发货方法 //发货方法
const currentId = ref<number | null>(null); const currentId = ref<number | null>(null);

271
src/views/Orders/ServiceOrderList.vue Normal file
View File

@ -0,0 +1,271 @@
<template>
<div>
<el-input style="width: 200px; height: 30px; margin-right: 10px;" suffix-icon="Search" placeholder="请输入订单编号"
v-model="name"></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 v-loading="loading" :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" fixed="left"></el-table-column>
<el-table-column prop="id" label="订单序号" width="80">
<template #default="{ $index }">
{{ $index + 1 }}
</template>
</el-table-column>
<el-table-column prop="orderNumber" label="订单编号" width="300"></el-table-column>
<el-table-column prop="createTime" label="下单时间" width="180"></el-table-column>
<el-table-column prop="userName" label="用户名" width="120"></el-table-column>
<el-table-column label="所购买的商品" width="100">
<el-table-column label="展开所有商品" type="expand" width="100">
<template #default="props">
<el-table :data="props.row.orderItemList">
<el-table-column label="商品名称" prop="goodSnapshot.name" width="200"/>
<el-table-column label="商品图片" prop="goodSnapshot.goodImg" width="200">
<template #default="scope">
<div>
<img :src="scope.row.goodSnapshot.goodImg.split(';')[0]" alt="" style="height: 50px;">
</div>
</template>
</el-table-column>
<el-table-column label="类别" prop="goodSnapshot.type" width="200"/>
<el-table-column label="商品单价" prop="goodSnapshot.price" width="200" />
<!-- <el-table-column label="是否是限定商品" prop="goodSnapshot.festivalOrder" width="150"/>-->
<el-table-column label="数量" prop="quantity" width="200"/>
<el-table-column label="总价" prop="itemTotalAmount" width="200"/>
<el-table-column label="预约日期" prop="reservationDate" width="200"></el-table-column>
<el-table-column label="预约时间段" prop="timeSlot" width="200"></el-table-column>
</el-table>
</template>
</el-table-column>
</el-table-column>
<el-table-column label="联系人信息" width="180">
<el-table-column prop="contactsSnapshot.name" label="姓名" />
<el-table-column prop="contactsSnapshot.phone" label="手机号" width="180"/>
</el-table-column>
<el-table-column label="优惠卷信息" width="50">
<el-table-column prop="couponSnapshot.name" label="优惠卷名称" />
<el-table-column prop="couponSnapshot.conditionAmount" 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="220px" fixed="right">
<template #default="scope">
<el-button size="small" @click="showDetail(scope.$index, scope.row)">
详情
</el-button>
<el-button :disabled="!['待发货'].includes(scope.row.orderStatus)" size="small" @click="openShipmentDialog(scope.row.id)" > <!-- @click="deliverGoods(scope.row)"-->
发货
</el-button>
<el-button :disabled="!['待支付'].includes(scope.row.orderStatus)" size="small" @click="cancelOrder(scope.row)" type="warning" plain>
取消订单
</el-button>
<el-button :disabled="!['待发货'].includes(scope.row.orderStatus)" size="small" @click="deleteOrder(scope.row)" type="danger" plain>
退款
</el-button>
</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="DialogVisible" width="60%">
<el-form label-width="100px" size="default" :model="editForm" :disabled="disabled">
<div style="display: flex">
<el-form-item label="订单编号" style="width: 400px">
<el-input v-model="editForm.orderNumber" autocomplete="off"></el-input>
</el-form-item>
</div>
<div style="display: flex">
<el-form-item label="联系人姓名" style="width: 300px">
<el-input v-model="editForm.contactsSnapshot.name" autocomplete="off"></el-input>
</el-form-item>
<el-form-item label="手机号" style="width: 300px">
<el-input v-model="editForm.contactsSnapshot.phone" autocomplete="off"></el-input>
</el-form-item>
</div>
<!-- 这里的商品明细就不放图片了 -->
<div style="display: flex">
<el-form-item label="订单总金额" style="width: 250px">
<el-input v-model="totalAmount" autocomplete="off"></el-input>
</el-form-item>
<el-form-item label="优惠价格" style="width: 250px">
<el-input v-model="editForm.couponSnapshot.conditionAmount" autocomplete="off"></el-input>
</el-form-item>
</div>
<el-form-item label="订单实付金额" style="width: 250px">
<el-input v-model="editForm.totalAmount" autocomplete="off"></el-input>
</el-form-item>
<el-form-item label="订单状态" style="width: 250px">
<el-input v-model="editForm.orderStatus" autocomplete="off"></el-input>
</el-form-item>
<div style="display: flex">
<el-form-item label="下单时间" style="width: 300px;">
<el-input v-model="editForm.createTime" autocomplete="off"></el-input>
</el-form-item>
<!-- <el-form-item label="更新时间" style="width: 300px;">-->
<!-- <el-input v-model="editForm.updateTime" autocomplete="off"></el-input>-->
<!-- </el-form-item>-->
</div>
</el-form>
<template #footer>
<div class="dialog-footer">
<el-button style="height: 30px;" @click="DialogVisible = false">取消</el-button>
<el-button style="height: 30px" type="primary" @click="DialogVisible = false" >确认</el-button>
</div>
</template>
</el-dialog>
<!-- 发货弹窗-->
<el-dialog title="发货" v-model="shipments" width="60%">
<el-form label-width="100px" size="default" >
<el-form-item label="快递单号" style="width: 300px;">
<el-input v-model="shipment.trackingNumber"></el-input>
</el-form-item>
</el-form>
<template #footer>
<div class="dialog-footer">
<el-button style="height: 30px;" @click=" shipments = false">取消</el-button>
<el-button style="height: 30px" type="primary" @click="deliverGoods ">确认</el-button>
</div>
</template>
</el-dialog>
</template>
<script lang="ts" setup>
import { onMounted, ref } from "vue";
import myAxios from "@/api/myAxios";
import { ElMessage } from "element-plus";
import { SuccessInfo , ErrorInfo } from "@/utils/messageInfo";
const tableData: any = ref([]); //表单展示数据
const total = ref(0);
const title = ref('')
const disabled = ref(true)
const editForm: any = ref({});//编辑表单
const shipment:any = ref({
trackingNumber: null
})//物流单号
const DialogVisible = ref(false); //详情展示
const shipments = ref(false)
const name = ref('')
const searchParams: any = ref({ //封装分页
current: 1, //当前页码
pageSize: 5, //每页显示条数
sortField: "id", //根据ID分类
sortOrder: "descend", //降序
orderType: 'service'
})
const loading = ref(false)
onMounted(() => {
getOrderList() //页面加载获取订单列表
})
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.data.data);
if (res.data.code === 1) {
tableData.value = res.data.data.records;
total.value = parseInt(res.data.data.total)
console.log('表单信息--->', tableData.value);
} else {
ElMessage({
message: '获取数据失败',
});
}
} catch (error) {
ElMessage({
message: '发生错误',
});
}
}
const totalAmount = ref(0)
const couponAmount = ref(0)
//查看订单详情
const showDetail = (index: number, row: any) => {
title.value = "订单详情"
DialogVisible.value = true;
if (row.couponSnapshot !== null) {
couponAmount.value = row.couponSnapshot.conditionAmount;
}
totalAmount.value = row.totalAmount + couponAmount.value;
editForm.value = row;
console.log('editForm--->',editForm.value);
};
//发货方法
const currentId = ref<number | null>(null);
const openShipmentDialog = (id: number) => {
shipments.value = true;
currentId.value = id;
}
const deliverGoods = async () => { //发货方法
if (currentId.value) {
const res = await myAxios.post('/order/update', {
id: currentId.value,
trackingNumber: shipment.value.trackingNumber
})
if (res.data.code === 1) {
ElMessage({
type: 'success',
message: '发货成功'
})
getOrderList();
}
} else {
ElMessage.error('更新失败，请检查字段')
}
shipments.value = false;
}
const deleteOrder = async (row : any) => { //微信退款
loading.value = true
console.log('row-->',row)
const res = await myAxios.post('/wechat/refund/create', { id: row.id }) //传入订单号取消订单并退款
console.log(res)
setTimeout(()=>{
if(res.data.code === 1) {
SuccessInfo('退款成功')
getOrderList()
loading.value = false
}
},10000)
}
const reset = () => { //重置搜索框
name.value = '';
};
const load = () => { } //搜索的方法
const cancelOrder = async (row:any)=>{ //取消订单的方法(未支付能取消)
console.log('点击的这一行--->',row);
const res = await myAxios.post('/order/cancel/id',{ id: row.id })
if(res.data.code === 1) {
getOrderList()
SuccessInfo('取消订单成功')
} else {
ErrorInfo('请求错误')
}
}
</script>
<style lang="scss" scoped></style>

114
src/views/ServiceType/ProductCenter.vue
View File

@ -47,7 +47,11 @@
<!-- 放后端传来的预约时间 --> <!-- 放后端传来的预约时间 -->
<el-table :data="appointmentDateArr[$index]" :header-cell-style="{ 'text-align': 'center' }" <el-table :data="appointmentDateArr[$index]" :header-cell-style="{ 'text-align': 'center' }"
:cell-style="{ 'text-align': 'center' }"> :cell-style="{ 'text-align': 'center' }">
<el-table-column label="是否可预约" prop="isAvailable" /> <el-table-column label="是否可预约" prop="isAvailable">
<template #default="{ row }">
{{ row.isAvailable == 1 ? "是" : "否" }}
</template>
</el-table-column>
<el-table-column label="日期" prop="specificDate" /> <el-table-column label="日期" prop="specificDate" />
<el-table-column label="操作"> <el-table-column label="操作">
<template v-slot="scope"> <template v-slot="scope">
@ -164,32 +168,39 @@
:title="'当前日期：'+drawerDate.specificDate + '&emsp;课程名称：' + className" :title="'当前日期：'+drawerDate.specificDate + '&emsp;课程名称：' + className"
direction="ltr" direction="ltr"
@closed="closedDrawer"> @closed="closedDrawer">
<div style="margin-bottom: 20px;">选择当天时间段和人数</div> <div style="margin-bottom: 20px">选择当天时间段和人数</div>
<div v-for="(item,index) in drawerDate.timePeriodVOList"> <div v-for="(item,index) in drawerDate.timePeriodVOList" style="margin-bottom: 40px">
<span>选择时间段</span> <div style="margin-bottom: 15px"><span>时间段</span></div>
<el-time-picker <el-time-picker
v-model="timePickArr[index]" v-model="timePickArr[index]"
format='HH:mm' format='HH:mm'
is-range="true" is-range="true"
range-separator="到" range-separator="到"
start-placeholder="开始" start-placeholder="开始"
end-placeholder="结束" end-placeholder="结束"
value-format="HH:mm" value-format="HH:mm"
:style="{ width: '236px' }" :style="{ width: '236px', marginBottom: '15px' }"
@change="saveTime(index)" @change="saveTime(index)"
:disabled="timeAbleArr[index]" :disabled="timeAbleArr[index]"
/> />
<div>
<span>最小人数:</span> <div style="margin-bottom:15px">
<el-select v-model="InfoArr[index].minNumber" style="width: 50px" @change="minNum(index)" :disabled="numAbleArr[index]"> <div style="display: flex; align-items: center; margin-bottom: 15px">
<el-option v-for="item in minArr" :label="item" :value="item" /> <div style="margin-right: 15px"><span>最小人数:</span></div>
</el-select> <el-select v-model="InfoArr[index].minNumber" style="width: 50px" @change="minNum(index)" :disabled="numAbleArr[index]">
<span>最大人数:</span> <el-option v-for="item in minArr" :label="item" :value="item" />
<el-select v-model="InfoArr[index].maxNumber" style="width: 50px" @change="maxNum(index)" :disabled="numAbleArr[index]"> </el-select>
<el-option v-for="item in maxArr" :label="item" :value="item" /> </div>
</el-select>
<div style="display: flex; align-items: center; margin-bottom: 15px">
<div style="margin-right: 15px"><span>最大人数:</span></div>
<el-select v-model="InfoArr[index].maxNumber" style="width: 50px" @change="maxNum(index)" :disabled="numAbleArr[index]">
<el-option v-for="item in maxArr" :label="item" :value="item" />
</el-select>
</div>
<el-button type="primary" @click="UpdateNum(item,index)" v-if="timeAbleArr[index]">{{ btnText[index] }}</el-button> <el-button type="primary" @click="UpdateNum(item,index)" v-if="timeAbleArr[index]">{{ btnText[index] }}</el-button>
<el-button type="danger" @click="subList(index)" v-if="index > 0">删除</el-button> <el-button type="danger" @click="subList(item, index)" v-if="index > 0">删除</el-button>
</div> </div>
</div> </div>
<el-button type="success" @click="addList">{{ addbtnText }}</el-button> <el-button type="success" @click="addList">{{ addbtnText }}</el-button>
@ -200,7 +211,7 @@
title="添加日期" title="添加日期"
width="800" width="800"
> >
<calendarUtil></calendarUtil> <calendarUtil @calendar-info="handleCalendarInfo"></calendarUtil>
<template #footer> <template #footer>
<div class="dialog-footer"> <div class="dialog-footer">
<el-button @click="addDateVisible = false">取消</el-button> <el-button @click="addDateVisible = false">取消</el-button>
@ -214,9 +225,10 @@
<script setup lang="ts"> <script setup lang="ts">
import { ElMessage , type UploadProps , genFileId ,type UploadRawFile } from 'element-plus'; import { ElMessage , type UploadProps , genFileId ,type UploadRawFile } from 'element-plus';
import { ref, onMounted, inject } from 'vue'; import {ref, onMounted, inject, toRaw} from 'vue';
import myAxios from "@/api/myAxios"; import myAxios from "@/api/myAxios";
import calendarUtil from '@/layout/components/calendarUtil.vue'; import calendarUtil from '@/layout/components/calendarUtil.vue';
import emitter from "@/utils/emitter";
const total = ref(0); //总页数 const total = ref(0); //总页数
const idList = ref([]); //用于批量删除 const idList = ref([]); //用于批量删除
const searchParams: any = ref({ //封装分页 const searchParams: any = ref({ //封装分页
@ -262,6 +274,14 @@ onMounted(() => { //页面加载时获取商品列表和分类页表
maxArr.value[i] = 6+i maxArr.value[i] = 6+i
} }
}) })
const appointmentDateAddRequestList = ref({})
const handleCalendarInfo = (data:any) => {
appointmentDateAddRequestList.value = data
console.log(data)
}
const getProductList = async () => { const getProductList = async () => {
try { try {
const res = await myAxios.post('/goods/service/list/page', { ...searchParams.value }); const res = await myAxios.post('/goods/service/list/page', { ...searchParams.value });
@ -485,7 +505,27 @@ const addList = async ()=>{
console.log(res.data); console.log(res.data);
addbtnText.value = '添加时间段' addbtnText.value = '添加时间段'
} }
const subList =(index: number)=>{} const subList = async (item:any, index: number)=> {
console.log(index, '->', item)
if (item.id !== 0) {
const res = await myAxios.post('/appointmentDate/del/time/id', {
id: item.id,
})
if (res.data.code === 1) {
ElMessage({
type: 'success',
message: '删除成功'
})
} else {
ElMessage({
type: 'error',
message: '删除失败'
})
}
}
drawerDate.value.timePeriodVOList.pop()
addbtnText.value = '添加时间段'
}
const UpdateNum = async (item: any,index:number)=>{ //修改具体日期某时间段的人数 const UpdateNum = async (item: any,index:number)=>{ //修改具体日期某时间段的人数
btnText.value[index] === '修改' ? btnText.value[index] = '保存' : btnText.value[index] = '修改' btnText.value[index] === '修改' ? btnText.value[index] = '保存' : btnText.value[index] = '修改'
btnText.value[index] === '保存' ? numAbleArr.value[index] = false : numAbleArr.value[index] = true btnText.value[index] === '保存' ? numAbleArr.value[index] = false : numAbleArr.value[index] = true
@ -516,7 +556,7 @@ const updateDay = async (row:any)=>{ //修改今天是否可以预约
message: '修改成功' message: '修改成功'
}); });
} }
getProductList() await getProductList()
} }
const judgeNull =(List : any)=>{ //时间段和人数统一判空方法 const judgeNull =(List : any)=>{ //时间段和人数统一判空方法
console.log('List--->',List); console.log('List--->',List);
@ -555,12 +595,22 @@ const deleteDate = async (id: number)=>{ //删除当前日期方法
}) })
} }
} }
let goodId = 0
const addDate = ( obj : any ) => { //添加日期方法 const addDate = ( obj : any ) => { //添加日期方法
console.log('obj--->',obj); console.log('obj--->',obj);
addDateVisible.value = true addDateVisible.value = true
goodId = obj.goodId
} }
const submitDate =()=> { //提交日期方法 const submitDate = async ()=> { //提交日期方法
appointmentDateAddRequestList.value.forEach((item:any,index:number)=>{
Object.assign(item, {goodId:goodId})
})
const res = await myAxios.post("/appointmentDate/addBatch", appointmentDateAddRequestList.value)
console.log(res)
await getProductList();
addDateVisible.value = false
appointmentDateAddRequestList.value = []
emitter.emit('clear')
} }
</script> </script>