订单列表:列表重构 添加门店、物流检索条件

This commit is contained in:
puhui999 2023-08-22 18:47:31 +08:00
parent 83e780da06
commit 5dceda614a
4 changed files with 97 additions and 63 deletions

View File

@ -19,7 +19,7 @@ export const getDeliveryExpress = async (id: number) => {
return await request.get({ url: '/trade/delivery/express/get?id=' + id }) return await request.get({ url: '/trade/delivery/express/get?id=' + id })
} }
// 获得商品品牌精简信息列表 // 获得快递公司精简信息列表
export const getSimpleDeliveryExpressList = () => { export const getSimpleDeliveryExpressList = () => {
return request.get({ url: '/trade/delivery/express/list-all-simple' }) return request.get({ url: '/trade/delivery/express/list-all-simple' })
} }

View File

@ -16,7 +16,7 @@ export interface DeliveryPickUpStoreVO {
} }
// 查询自提门店列表 // 查询自提门店列表
export const getDeliveryPickUpStorePage = async (params: DeliveryPickUpStorePageReqVO) => { export const getDeliveryPickUpStorePage = async (params) => {
return await request.get({ url: '/trade/delivery/pick-up-store/page', params }) return await request.get({ url: '/trade/delivery/pick-up-store/page', params })
} }
@ -25,6 +25,11 @@ export const getDeliveryPickUpStore = async (id: number) => {
return await request.get({ url: '/trade/delivery/pick-up-store/get?id=' + id }) return await request.get({ url: '/trade/delivery/pick-up-store/get?id=' + id })
} }
// 查询自提门店精简列表
export const getListAllSimple = async () => {
return await request.get({ url: '/trade/delivery/pick-up-store/list-all-simple' })
}
// 新增自提门店 // 新增自提门店
export const createDeliveryPickUpStore = async (data: DeliveryPickUpStoreVO) => { export const createDeliveryPickUpStore = async (data: DeliveryPickUpStoreVO) => {
return await request.post({ url: '/trade/delivery/pick-up-store/create', data }) return await request.post({ url: '/trade/delivery/pick-up-store/create', data })
@ -39,8 +44,3 @@ export const updateDeliveryPickUpStore = async (data: DeliveryPickUpStoreVO) =>
export const deleteDeliveryPickUpStore = async (id: number) => { export const deleteDeliveryPickUpStore = async (id: number) => {
return await request.delete({ url: '/trade/delivery/pick-up-store/delete?id=' + id }) return await request.delete({ url: '/trade/delivery/pick-up-store/delete?id=' + id })
} }
// 导出自提门店 Excel
export const exportDeliveryPickUpStoreApi = async (params) => {
return await request.download({ url: '/trade/delivery/pick-up-store/export-excel', params })
}

View File

@ -1,27 +1,27 @@
<template> <template>
<!-- 搜索工作栏 --> <!-- 搜索工作栏 -->
<ContentWrap> <ContentWrap>
<el-form class="-mb-15px" :model="queryParams" ref="queryFormRef" :inline="true"> <el-form ref="queryFormRef" :inline="true" :model="queryParams" class="-mb-15px">
<el-form-item label="门店手机" prop="phone"> <el-form-item label="门店手机" prop="phone">
<el-input <el-input
v-model="queryParams.phone" v-model="queryParams.phone"
placeholder="请输门店手机"
clearable
@keyup.enter="handleQuery"
class="!w-240px" class="!w-240px"
clearable
placeholder="请输门店手机"
@keyup.enter="handleQuery"
/> />
</el-form-item> </el-form-item>
<el-form-item label="门店名称" prop="name"> <el-form-item label="门店名称" prop="name">
<el-input <el-input
v-model="queryParams.name" v-model="queryParams.name"
placeholder="请输门店名称"
clearable
@keyup.enter="handleQuery"
class="!w-240px" class="!w-240px"
clearable
placeholder="请输门店名称"
@keyup.enter="handleQuery"
/> />
</el-form-item> </el-form-item>
<el-form-item label="门店状态" prop="status"> <el-form-item label="门店状态" prop="status">
<el-select v-model="queryParams.status" placeholder="门店状态" clearable class="!w-240px"> <el-select v-model="queryParams.status" class="!w-240px" clearable placeholder="门店状态">
<el-option <el-option
v-for="dict in getIntDictOptions(DICT_TYPE.COMMON_STATUS)" v-for="dict in getIntDictOptions(DICT_TYPE.COMMON_STATUS)"
:key="dict.value" :key="dict.value"
@ -33,32 +33,30 @@
<el-form-item label="创建时间" prop="createTime"> <el-form-item label="创建时间" prop="createTime">
<el-date-picker <el-date-picker
v-model="queryParams.createTime" v-model="queryParams.createTime"
value-format="YYYY-MM-DD HH:mm:ss"
type="datetimerange"
start-placeholder="开始日期"
end-placeholder="结束日期"
class="!w-240px" class="!w-240px"
end-placeholder="结束日期"
start-placeholder="开始日期"
type="datetimerange"
value-format="YYYY-MM-DD HH:mm:ss"
/> />
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-button @click="handleQuery"><Icon icon="ep:search" class="mr-5px" /> 搜索</el-button> <el-button @click="handleQuery">
<el-button @click="resetQuery"><Icon icon="ep:refresh" class="mr-5px" /> 重置</el-button> <Icon class="mr-5px" icon="ep:search" />
<el-button 搜索
type="primary" </el-button>
plain <el-button @click="resetQuery">
@click="openForm('create')" <Icon class="mr-5px" icon="ep:refresh" />
v-hasPermi="['trade:delivery:pick-up-store:create']" 重置
>
<Icon icon="ep:plus" class="mr-5px" /> 新增
</el-button> </el-button>
<el-button <el-button
type="success" v-hasPermi="['trade:delivery:pick-up-store:create']"
plain plain
@click="handleExport" type="primary"
:loading="exportLoading" @click="openForm('create')"
v-hasPermi="['trade:delivery:pick-up-store:export']"
> >
<Icon icon="ep:download" class="mr-5px" /> 导出 <Icon class="mr-5px" icon="ep:plus" />
新增
</el-button> </el-button>
</el-form-item> </el-form-item>
</el-form> </el-form>
@ -75,34 +73,34 @@
</el-table-column> </el-table-column>
<el-table-column label="门店名称" prop="name" /> <el-table-column label="门店名称" prop="name" />
<el-table-column label="门店手机" prop="phone" /> <el-table-column label="门店手机" prop="phone" />
<el-table-column label="门店详细地址" align="center" prop="detailAddress" /> <el-table-column align="center" label="门店详细地址" prop="detailAddress" />
<el-table-column label="开启状态" align="center" prop="status"> <el-table-column align="center" label="开启状态" prop="status">
<template #default="scope"> <template #default="scope">
<dict-tag :type="DICT_TYPE.COMMON_STATUS" :value="scope.row.status" /> <dict-tag :type="DICT_TYPE.COMMON_STATUS" :value="scope.row.status" />
</template> </template>
</el-table-column> </el-table-column>
<el-table-column <el-table-column
label="创建时间" :formatter="dateFormatter"
align="center" align="center"
label="创建时间"
prop="createTime" prop="createTime"
width="180" width="180"
:formatter="dateFormatter"
/> />
<el-table-column label="操作" align="center"> <el-table-column align="center" label="操作">
<template #default="scope"> <template #default="scope">
<el-button <el-button
v-hasPermi="['trade:delivery:pick-up-store:update']"
link link
type="primary" type="primary"
@click="openForm('update', scope.row.id)" @click="openForm('update', scope.row.id)"
v-hasPermi="['trade:delivery:pick-up-store:update']"
> >
编辑 编辑
</el-button> </el-button>
<el-button <el-button
v-hasPermi="['trade:delivery:pick-up-store:delete']"
link link
type="danger" type="danger"
@click="handleDelete(scope.row.id)" @click="handleDelete(scope.row.id)"
v-hasPermi="['trade:delivery:pick-up-store:delete']"
> >
删除 删除
</el-button> </el-button>
@ -113,18 +111,17 @@
<!-- 表单弹窗添加/修改 --> <!-- 表单弹窗添加/修改 -->
<DeliveryPickUpStoreForm ref="formRef" @success="getList" /> <DeliveryPickUpStoreForm ref="formRef" @success="getList" />
</template> </template>
<script setup lang="ts" name="DeliveryPickUpStore"> <script lang="ts" name="DeliveryPickUpStore" setup>
import * as DeliveryPickUpStoreApi from '@/api/mall/trade/delivery/pickUpStore' import * as DeliveryPickUpStoreApi from '@/api/mall/trade/delivery/pickUpStore'
import DeliveryPickUpStoreForm from './PickUpStoreForm.vue' import DeliveryPickUpStoreForm from './PickUpStoreForm.vue'
import { DICT_TYPE, getIntDictOptions } from '@/utils/dict' import { DICT_TYPE, getIntDictOptions } from '@/utils/dict'
import { dateFormatter } from '@/utils/formatTime' import { dateFormatter } from '@/utils/formatTime'
import download from '@/utils/download'
const message = useMessage() // const message = useMessage() //
const { t } = useI18n() // const { t } = useI18n() //
const total = ref(0) // const total = ref(0) //
const loading = ref(true) // const loading = ref(true) //
const exportLoading = ref(false) //
const list = ref<any[]>([]) // const list = ref<any[]>([]) //
const queryParams = reactive({ const queryParams = reactive({
pageNo: 1, pageNo: 1,
@ -179,21 +176,6 @@ const resetQuery = () => {
handleQuery() handleQuery()
} }
/** 导出按钮操作 */
const handleExport = async () => {
try {
//
await message.exportConfirm()
//
exportLoading.value = true
const data = await DeliveryPickUpStoreApi.exportDeliveryPickUpStoreApi(queryParams)
download.excel(data, '自提门店.xls')
} catch {
} finally {
exportLoading.value = false
}
}
/** 初始化 **/ /** 初始化 **/
onMounted(() => { onMounted(() => {
getList() getList()

View File

@ -64,8 +64,34 @@
/> />
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="快递公司" prop="type">
<el-form-item label="订单搜索"> <el-select v-model="queryParams.logisticsId" class="!w-280px" clearable placeholder="全部">
<el-option
v-for="item in deliveryExpressList"
:key="item.id as string"
:label="item.name"
:value="item.id"
/>
</el-select>
</el-form-item>
<el-form-item label="自提门店" prop="type">
<el-select
v-model="queryParams.pickUpStoreId"
class="!w-280px"
clearable
multiple
placeholder="全部"
>
<el-option
v-for="item in pickUpStoreList"
:key="item.id as string"
:label="item.name"
:value="item.id"
/>
</el-select>
</el-form-item>
<!-- TODO 考虑是否移除或重构-->
<el-form-item label="聚合搜索">
<el-input <el-input
v-show="true" v-show="true"
v-model="queryType.v" v-model="queryType.v"
@ -86,7 +112,6 @@
</el-input> </el-input>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<!-- TODO 订单按钮相关权限等订单完善后补齐 -->
<el-button @click="handleQuery"> <el-button @click="handleQuery">
<Icon class="mr-5px" icon="ep:search" /> <Icon class="mr-5px" icon="ep:search" />
搜索 搜索
@ -153,13 +178,31 @@
</el-table-column> </el-table-column>
<el-table-column label="买家/收货人" min-width="160"> <el-table-column label="买家/收货人" min-width="160">
<template #default> <template #default>
<div class="flex flex-col"> <!-- 快递发货 -->
<div v-if="scope.row.deliveryType === 1" class="flex flex-col">
<span>买家{{ scope.row.user.nickname }}</span> <span>买家{{ scope.row.user.nickname }}</span>
<span> <span>
收货人{{ scope.row.receiverName }} {{ scope.row.receiverMobile }} 收货人{{ scope.row.receiverName }} {{ scope.row.receiverMobile }}
{{ scope.row.receiverAreaName }} {{ scope.row.receiverDetailAddress }} {{ scope.row.receiverAreaName }} {{ scope.row.receiverDetailAddress }}
</span> </span>
</div> </div>
<!-- 自提 -->
<div v-if="scope.row.deliveryType === 2" class="flex flex-col">
<span>
门店名称
{{ pickUpStoreList.find((p) => p.id === scope.row.pickUpStoreId)?.name }}
</span>
<span>
门店手机
{{ pickUpStoreList.find((p) => p.id === scope.row.pickUpStoreId)?.phone }}
</span>
<span>
自提门店:
{{
pickUpStoreList.find((p) => p.id === scope.row.pickUpStoreId)?.detailAddress
}}
</span>
</div>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column align="center" label="配送方式" width="120"> <el-table-column align="center" label="配送方式" width="120">
@ -169,6 +212,7 @@
</el-table-column> </el-table-column>
<el-table-column align="center" fixed="right" label="操作" width="160"> <el-table-column align="center" fixed="right" label="操作" width="160">
<template #default> <template #default>
<!-- TODO 权限后续补齐 -->
<div class="flex justify-center items-center"> <div class="flex justify-center items-center">
<el-button link type="primary" @click="openForm(scope.row.id)"> <el-button link type="primary" @click="openForm(scope.row.id)">
<Icon icon="ep:notification" /> <Icon icon="ep:notification" />
@ -263,9 +307,11 @@ import OrderRemarksForm from './components/OrderRemarksForm.vue'
import { dateFormatter } from '@/utils/formatTime' import { dateFormatter } from '@/utils/formatTime'
import * as TradeOrderApi from '@/api/mall/trade/order' import * as TradeOrderApi from '@/api/mall/trade/order'
import { OrderItemRespVO, OrderVO } from '@/api/mall/trade/order' import { OrderItemRespVO, OrderVO } from '@/api/mall/trade/order'
import { getListAllSimple } from '@/api/mall/trade/delivery/pickUpStore'
import { DICT_TYPE, getStrDictOptions } from '@/utils/dict' import { DICT_TYPE, getStrDictOptions } from '@/utils/dict'
import { formatToFraction } from '@/utils' import { formatToFraction } from '@/utils'
import { createImageViewer } from '@/components/ImageViewer' import { createImageViewer } from '@/components/ImageViewer'
import * as DeliveryExpressApi from '@/api/mall/trade/delivery/express'
const { currentRoute, push } = useRouter() // const { currentRoute, push } = useRouter() //
@ -320,7 +366,7 @@ const handleCommand = (command: string, row: OrderVO) => {
} }
} }
const queryFormRef = ref<FormInstance>() // const queryFormRef = ref<FormInstance>() //
// TODO //
const queryParams = reactive({ const queryParams = reactive({
pageNo: 1, // pageNo: 1, //
pageSize: 10, // pageSize: 10, //
@ -337,6 +383,8 @@ const queryParams = reactive({
createTime: [], createTime: [],
spuName: '', spuName: '',
itemCount: '', itemCount: '',
pickUpStoreId: [],
logisticsId: null,
all: '' all: ''
}) })
@ -383,8 +431,12 @@ watch(
} }
) )
const pickUpStoreList = ref([]) //
const deliveryExpressList = ref([]) //
/** 初始化 **/ /** 初始化 **/
onMounted(async () => { onMounted(async () => {
await getList() await getList()
pickUpStoreList.value = await getListAllSimple()
deliveryExpressList.value = await DeliveryExpressApi.getSimpleDeliveryExpressList()
}) })
</script> </script>