|
|
|
|
@ -1,4 +1,5 @@
|
|
|
|
|
<template>
|
|
|
|
|
<!-- 使用Element Plus的el-dialog组件创建一个对话框 -->
|
|
|
|
|
<el-dialog
|
|
|
|
|
v-model="visible"
|
|
|
|
|
:title="!dataForm.transportId ? '新增' : '修改'"
|
|
|
|
|
@ -6,321 +7,136 @@
|
|
|
|
|
width="1400px"
|
|
|
|
|
class="transport-dialog"
|
|
|
|
|
>
|
|
|
|
|
<!-- 表单元素，包含多个表单项和一个表格 -->
|
|
|
|
|
<el-form
|
|
|
|
|
ref="dataFormRef"
|
|
|
|
|
:model="dataForm"
|
|
|
|
|
label-width="80px"
|
|
|
|
|
@keyup.enter="onSubmit()"
|
|
|
|
|
>
|
|
|
|
|
<!-- 模板名称输入框 -->
|
|
|
|
|
<el-form-item
|
|
|
|
|
label="模板名称"
|
|
|
|
|
prop="transName"
|
|
|
|
|
:rules="[
|
|
|
|
|
{ required: true, message: '模板名称不能为空'},
|
|
|
|
|
{ pattern: /\s\S+|S+\s|\S/, message: '请输入正确的模板名称', trigger: 'blur' }
|
|
|
|
|
]"
|
|
|
|
|
{ pattern: /\s\S+|S+\s|\S/, message: '请输入正确的模板名称', trigger: 'blur' }]"
|
|
|
|
|
>
|
|
|
|
|
<el-input
|
|
|
|
|
v-model="dataForm.transName"
|
|
|
|
|
placeholder="模板名称"
|
|
|
|
|
/>
|
|
|
|
|
<el-input v-model="dataForm.transName" placeholder="模板名称" />
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item
|
|
|
|
|
label="模板类型"
|
|
|
|
|
prop="isFreeFee"
|
|
|
|
|
required="required"
|
|
|
|
|
>
|
|
|
|
|
<el-radio-group
|
|
|
|
|
v-model="dataForm.isFreeFee"
|
|
|
|
|
@change="changeFreeFee"
|
|
|
|
|
>
|
|
|
|
|
<el-radio :label="0">
|
|
|
|
|
买家承担运费
|
|
|
|
|
</el-radio>
|
|
|
|
|
<el-radio :label="1">
|
|
|
|
|
卖家包邮
|
|
|
|
|
</el-radio>
|
|
|
|
|
|
|
|
|
|
<!-- 模板类型选择器 -->
|
|
|
|
|
<el-form-item label="模板类型" prop="isFreeFee" required>
|
|
|
|
|
<el-radio-group v-model="dataForm.isFreeFee" @change="changeFreeFee">
|
|
|
|
|
<el-radio :label="0">买家承担运费</el-radio>
|
|
|
|
|
<el-radio :label="1">卖家包邮</el-radio>
|
|
|
|
|
</el-radio-group>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item
|
|
|
|
|
label="收费方式"
|
|
|
|
|
prop="chargeType"
|
|
|
|
|
>
|
|
|
|
|
<el-radio-group
|
|
|
|
|
v-model="dataForm.chargeType"
|
|
|
|
|
:disabled="dataForm.isFreeFee == 1"
|
|
|
|
|
>
|
|
|
|
|
<el-radio :label="0">
|
|
|
|
|
按件数
|
|
|
|
|
</el-radio>
|
|
|
|
|
<el-radio :label="1">
|
|
|
|
|
按重量
|
|
|
|
|
</el-radio>
|
|
|
|
|
<el-radio :label="2">
|
|
|
|
|
按体积
|
|
|
|
|
</el-radio>
|
|
|
|
|
|
|
|
|
|
<!-- 收费方式选择器 -->
|
|
|
|
|
<el-form-item label="收费方式" prop="chargeType">
|
|
|
|
|
<el-radio-group v-model="dataForm.chargeType" :disabled="dataForm.isFreeFee == 1">
|
|
|
|
|
<el-radio :label="0">按件数</el-radio>
|
|
|
|
|
<el-radio :label="1">按重量</el-radio>
|
|
|
|
|
<el-radio :label="2">按体积</el-radio>
|
|
|
|
|
</el-radio-group>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
|
|
|
|
|
<!-- 运费项表格 -->
|
|
|
|
|
<el-table
|
|
|
|
|
:data="dataForm.transfees"
|
|
|
|
|
border
|
|
|
|
|
style="width: 100%;"
|
|
|
|
|
class="table-con"
|
|
|
|
|
>
|
|
|
|
|
<el-table-column
|
|
|
|
|
header-align="center"
|
|
|
|
|
align="center"
|
|
|
|
|
width="450"
|
|
|
|
|
label="可配送区域"
|
|
|
|
|
>
|
|
|
|
|
<!-- 可配送区域列 -->
|
|
|
|
|
<el-table-column header-align="center" align="center" width="450" label="可配送区域">
|
|
|
|
|
<template #default="scope">
|
|
|
|
|
<span v-if="scope.$index == 0">所有地区</span>
|
|
|
|
|
<span v-if="(!scope.row.cityList || !scope.row.cityList.length) && scope.$index > 0">请选择可配送区域</span>
|
|
|
|
|
<span v-if="scope.$index > 0">
|
|
|
|
|
<el-tag
|
|
|
|
|
v-for="city in scope.row.cityList"
|
|
|
|
|
:key="city.areaId"
|
|
|
|
|
>{{ city.areaName }}</el-tag>
|
|
|
|
|
<el-tag v-for="city in scope.row.cityList" :key="city.areaId">{{ city.areaName }}</el-tag>
|
|
|
|
|
</span>
|
|
|
|
|
<el-button
|
|
|
|
|
v-if="isAuth('shop:transfee:update') && scope.$index > 0"
|
|
|
|
|
type="text"
|
|
|
|
|
|
|
|
|
|
@click="onAddOrUpdate(`${scope.$index}`)"
|
|
|
|
|
>
|
|
|
|
|
编辑
|
|
|
|
|
</el-button>
|
|
|
|
|
<el-button
|
|
|
|
|
v-if="isAuth('shop:transfee:delete') && scope.$index > 0"
|
|
|
|
|
type="text"
|
|
|
|
|
|
|
|
|
|
@click="onDelete(`${scope.$index}`)"
|
|
|
|
|
>
|
|
|
|
|
删除
|
|
|
|
|
</el-button>
|
|
|
|
|
</template>
|
|
|
|
|
</el-table-column>
|
|
|
|
|
<el-table-column
|
|
|
|
|
header-align="center"
|
|
|
|
|
align="center"
|
|
|
|
|
width="180"
|
|
|
|
|
:label="tableTitle[0]"
|
|
|
|
|
>
|
|
|
|
|
<template #default="scope">
|
|
|
|
|
<el-form-item
|
|
|
|
|
:prop="`transfees.${scope.$index}.firstPiece`"
|
|
|
|
|
label-width="0px"
|
|
|
|
|
:rules="[{ required: true, message: `${tableTitle[0]}不能为空`}]"
|
|
|
|
|
>
|
|
|
|
|
<el-input
|
|
|
|
|
v-model="scope.row.firstPiece"
|
|
|
|
|
type="number"
|
|
|
|
|
:disabled="!scope.row.status && scope.$index === 0"
|
|
|
|
|
@change="checkNumber(scope.row, 1)"
|
|
|
|
|
/>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-button v-if="isAuth('shop:transfee:update') && scope.$index > 0" type="text" @click="onAddOrUpdate(`${scope.$index}`)">编辑</el-button>
|
|
|
|
|
<el-button v-if="isAuth('shop:transfee:delete') && scope.$index > 0" type="text" @click="onDelete(`${scope.$index}`)">删除</el-button>
|
|
|
|
|
</template>
|
|
|
|
|
</el-table-column>
|
|
|
|
|
<el-table-column
|
|
|
|
|
header-align="center"
|
|
|
|
|
align="center"
|
|
|
|
|
:label="tableTitle[1]"
|
|
|
|
|
>
|
|
|
|
|
<template #default="scope">
|
|
|
|
|
<el-form-item
|
|
|
|
|
:prop="`transfees.${scope.$index}.firstFee`"
|
|
|
|
|
label-width="0px"
|
|
|
|
|
:rules="[{ required: true, message: `${tableTitle[1]}不能为空`}]"
|
|
|
|
|
>
|
|
|
|
|
<el-input
|
|
|
|
|
v-model="scope.row.firstFee"
|
|
|
|
|
type="number"
|
|
|
|
|
:min="0"
|
|
|
|
|
:disabled="!scope.row.status && scope.$index === 0"
|
|
|
|
|
/>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
</template>
|
|
|
|
|
</el-table-column>
|
|
|
|
|
<el-table-column
|
|
|
|
|
header-align="center"
|
|
|
|
|
align="center"
|
|
|
|
|
:label="tableTitle[2]"
|
|
|
|
|
>
|
|
|
|
|
<template #default="scope">
|
|
|
|
|
<el-form-item
|
|
|
|
|
:prop="`transfees.${scope.$index}.continuousPiece`"
|
|
|
|
|
label-width="0px"
|
|
|
|
|
:rules="[{ required: true, message: `${tableTitle[2]}不能为空`}]"
|
|
|
|
|
>
|
|
|
|
|
<el-input
|
|
|
|
|
v-model="scope.row.continuousPiece"
|
|
|
|
|
type="number"
|
|
|
|
|
:disabled="!scope.row.status && scope.$index === 0"
|
|
|
|
|
@change="checkNumber(scope.row, 3)"
|
|
|
|
|
/>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
</template>
|
|
|
|
|
</el-table-column>
|
|
|
|
|
<el-table-column
|
|
|
|
|
header-align="center"
|
|
|
|
|
align="center"
|
|
|
|
|
:label="tableTitle[3]"
|
|
|
|
|
>
|
|
|
|
|
|
|
|
|
|
<!-- 动态生成的列，根据chargeType显示不同的标题 -->
|
|
|
|
|
<el-table-column v-for="(item, index) in tableTitle" :key="index" header-align="center" align="center" :label="item">
|
|
|
|
|
<template #default="scope">
|
|
|
|
|
<el-form-item
|
|
|
|
|
:prop="`transfees.${scope.$index}.continuousFee`"
|
|
|
|
|
label-width="0px"
|
|
|
|
|
:rules="[{ required: true, message: `${tableTitle[3]}不能为空`}]"
|
|
|
|
|
>
|
|
|
|
|
<el-input
|
|
|
|
|
v-model="scope.row.continuousFee"
|
|
|
|
|
type="number"
|
|
|
|
|
:min="0"
|
|
|
|
|
:disabled="!scope.row.status && scope.$index === 0"
|
|
|
|
|
/>
|
|
|
|
|
<el-form-item :prop="`transfees.${scope.$index}.[${index}]`" label-width="0px" :rules="[{ required: true, message: `${item}不能为空`}]">
|
|
|
|
|
<el-input v-model="scope.row[index]" type="number" :min="0" :disabled="!scope.row.status && scope.$index === 0" @change="checkNumber(scope.row, index + 1)" />
|
|
|
|
|
</el-form-item>
|
|
|
|
|
</template>
|
|
|
|
|
</el-table-column>
|
|
|
|
|
</el-table>
|
|
|
|
|
<div
|
|
|
|
|
v-if="dataForm.isFreeFee == 0"
|
|
|
|
|
style="margin-top: 20px"
|
|
|
|
|
>
|
|
|
|
|
<el-button
|
|
|
|
|
type="primary"
|
|
|
|
|
icon="el-icon-location-outline"
|
|
|
|
|
@click="addTransfee()"
|
|
|
|
|
>
|
|
|
|
|
点击添加可配送的区域和运费
|
|
|
|
|
</el-button>
|
|
|
|
|
|
|
|
|
|
<!-- 添加新的运费项按钮 -->
|
|
|
|
|
<div v-if="dataForm.isFreeFee == 0" style="margin-top: 20px">
|
|
|
|
|
<el-button type="primary" icon="el-icon-location-outline" @click="addTransfee()">点击添加可配送的区域和运费</el-button>
|
|
|
|
|
</div>
|
|
|
|
|
<el-checkbox
|
|
|
|
|
v-if="!dataForm.isFreeFee"
|
|
|
|
|
v-model="dataForm.hasFreeCondition"
|
|
|
|
|
style="margin-top:10px;font-size:50px"
|
|
|
|
|
>
|
|
|
|
|
指定条件包邮
|
|
|
|
|
</el-checkbox>
|
|
|
|
|
|
|
|
|
|
<!-- 指定条件包邮复选框 -->
|
|
|
|
|
<el-checkbox v-if="!dataForm.isFreeFee" v-model="dataForm.hasFreeCondition" style="margin-top:10px;font-size:50px">指定条件包邮</el-checkbox>
|
|
|
|
|
|
|
|
|
|
<!-- 包邮条件表格 -->
|
|
|
|
|
<el-table
|
|
|
|
|
v-if="dataForm.hasFreeCondition && !dataForm.isFreeFee"
|
|
|
|
|
:data="dataForm.transfeeFrees"
|
|
|
|
|
border
|
|
|
|
|
style="width: 100%;"
|
|
|
|
|
>
|
|
|
|
|
<el-table-column
|
|
|
|
|
header-align="center"
|
|
|
|
|
align="center"
|
|
|
|
|
width="350"
|
|
|
|
|
label="指定区域"
|
|
|
|
|
>
|
|
|
|
|
<!-- 指定区域列 -->
|
|
|
|
|
<el-table-column header-align="center" align="center" width="350" label="指定区域">
|
|
|
|
|
<template #default="scope">
|
|
|
|
|
<span v-if="!scope.row.freeCityList || !scope.row.freeCityList.length">请选择指定包邮城市</span>
|
|
|
|
|
<el-tag
|
|
|
|
|
v-for="city in scope.row.freeCityList"
|
|
|
|
|
:key="city.areaId"
|
|
|
|
|
>
|
|
|
|
|
{{ city.areaName }}
|
|
|
|
|
</el-tag>
|
|
|
|
|
<el-button
|
|
|
|
|
v-if="isAuth('shop:transfee:update')"
|
|
|
|
|
type="text"
|
|
|
|
|
|
|
|
|
|
@click="addOrUpdateTransfeeFree(`${scope.$index}`)"
|
|
|
|
|
>
|
|
|
|
|
编辑
|
|
|
|
|
</el-button>
|
|
|
|
|
<el-button
|
|
|
|
|
v-if="isAuth('shop:transfee:delete')"
|
|
|
|
|
type="text"
|
|
|
|
|
|
|
|
|
|
@click="deleteTransfeeFree(`${scope.$index}`)"
|
|
|
|
|
>
|
|
|
|
|
删除
|
|
|
|
|
</el-button>
|
|
|
|
|
<el-tag v-for="city in scope.row.freeCityList" :key="city.areaId">{{ city.areaName }}</el-tag>
|
|
|
|
|
<el-button v-if="isAuth('shop:transfee:update')" type="text" @click="addOrUpdateTransfeeFree(`${scope.$index}`)">编辑</el-button>
|
|
|
|
|
<el-button v-if="isAuth('shop:transfee:delete')" type="text" @click="deleteTransfeeFree(`${scope.$index}`)">删除</el-button>
|
|
|
|
|
</template>
|
|
|
|
|
</el-table-column>
|
|
|
|
|
<el-table-column
|
|
|
|
|
header-align="center"
|
|
|
|
|
align="center"
|
|
|
|
|
width="600"
|
|
|
|
|
label="设置包邮条件"
|
|
|
|
|
>
|
|
|
|
|
|
|
|
|
|
<!-- 设置包邮条件列 -->
|
|
|
|
|
<el-table-column header-align="center" align="center" width="600" label="设置包邮条件">
|
|
|
|
|
<template #default="scope">
|
|
|
|
|
<el-radio-group v-model="scope.row.freeType">
|
|
|
|
|
<el-radio :label="0">
|
|
|
|
|
满件/重量/体积包邮
|
|
|
|
|
</el-radio>
|
|
|
|
|
<el-radio :label="1">
|
|
|
|
|
满金额包邮
|
|
|
|
|
</el-radio>
|
|
|
|
|
<el-radio :label="2">
|
|
|
|
|
满件/重量/体积且满金额包邮
|
|
|
|
|
</el-radio>
|
|
|
|
|
<el-radio :label="0">满件/重量/体积包邮</el-radio>
|
|
|
|
|
<el-radio :label="1">满金额包邮</el-radio>
|
|
|
|
|
<el-radio :label="2">满件/重量/体积且满金额包邮</el-radio>
|
|
|
|
|
</el-radio-group>
|
|
|
|
|
</template>
|
|
|
|
|
</el-table-column>
|
|
|
|
|
<el-table-column
|
|
|
|
|
header-align="center"
|
|
|
|
|
align="left"
|
|
|
|
|
>
|
|
|
|
|
|
|
|
|
|
<!-- 包邮条件详情列 -->
|
|
|
|
|
<el-table-column header-align="center" align="left">
|
|
|
|
|
<template #default="scope">
|
|
|
|
|
<el-form-item
|
|
|
|
|
v-if="scope.row.freeType == 1 || scope.row.freeType == 2"
|
|
|
|
|
:prop="`transfeeFrees.${scope.$index}.amount`"
|
|
|
|
|
label-width="0px"
|
|
|
|
|
:rules="[{ required: true, message: `不能为空`}]"
|
|
|
|
|
>
|
|
|
|
|
满 <el-input
|
|
|
|
|
v-model="scope.row.amount"
|
|
|
|
|
style="width:100px"
|
|
|
|
|
/> 元包邮
|
|
|
|
|
<el-form-item v-if="scope.row.freeType == 1 || scope.row.freeType == 2" :prop="`transfeeFrees.${scope.$index}.amount`" label-width="0px" :rules="[{ required: true, message: `不能为空`}]">
|
|
|
|
|
满 <el-input v-model="scope.row.amount" style="width:100px" /> 元包邮
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item
|
|
|
|
|
v-if="scope.row.freeType == 0 || scope.row.freeType == 2"
|
|
|
|
|
:prop="`transfeeFrees.${scope.$index}.piece`"
|
|
|
|
|
label-width="0px"
|
|
|
|
|
:rules="[{ required: true, message: `不能为空`}]"
|
|
|
|
|
>
|
|
|
|
|
满 <el-input
|
|
|
|
|
v-model="scope.row.piece"
|
|
|
|
|
style="width:100px"
|
|
|
|
|
/> 件/重量/体积包邮
|
|
|
|
|
<el-form-item v-if="scope.row.freeType == 0 || scope.row.freeType == 2" :prop="`transfeeFrees.${scope.$index}.piece`" label-width="0px" :rules="[{ required: true, message: `不能为空`}]">
|
|
|
|
|
满 <el-input v-model="scope.row.piece" style="width:100px" /> 件/重量/体积包邮
|
|
|
|
|
</el-form-item>
|
|
|
|
|
</template>
|
|
|
|
|
</el-table-column>
|
|
|
|
|
</el-table>
|
|
|
|
|
<div
|
|
|
|
|
v-if="dataForm.isFreeFee == 0"
|
|
|
|
|
style="margin-top: 20px"
|
|
|
|
|
>
|
|
|
|
|
<el-button
|
|
|
|
|
type="primary"
|
|
|
|
|
icon="el-icon-location-outline"
|
|
|
|
|
@click="addTransfeeFree()"
|
|
|
|
|
>
|
|
|
|
|
点击添加指定包邮条件
|
|
|
|
|
</el-button>
|
|
|
|
|
|
|
|
|
|
<!-- 添加新的包邮条件按钮 -->
|
|
|
|
|
<div v-if="dataForm.isFreeFee == 0" style="margin-top: 20px">
|
|
|
|
|
<el-button type="primary" icon="el-icon-location-outline" @click="addTransfeeFree()">点击添加指定包邮条件</el-button>
|
|
|
|
|
</div>
|
|
|
|
|
</el-form>
|
|
|
|
|
|
|
|
|
|
<!-- 对话框底部按钮 -->
|
|
|
|
|
<template #footer>
|
|
|
|
|
<div class="dialog-footer">
|
|
|
|
|
<el-button @click="visible = false">
|
|
|
|
|
取消
|
|
|
|
|
</el-button>
|
|
|
|
|
<el-button
|
|
|
|
|
type="primary"
|
|
|
|
|
@click="onSubmit()"
|
|
|
|
|
>
|
|
|
|
|
确定
|
|
|
|
|
</el-button>
|
|
|
|
|
<el-button @click="visible = false">取消</el-button>
|
|
|
|
|
<el-button type="primary" @click="onSubmit()">确定</el-button>
|
|
|
|
|
</div>
|
|
|
|
|
</template>
|
|
|
|
|
<!-- 弹窗, 新增 / 修改 -->
|
|
|
|
|
<add-or-update
|
|
|
|
|
v-if="addOrUpdateVisible"
|
|
|
|
|
ref="addOrUpdateRef"
|
|
|
|
|
@refresh-data-list="getDataList"
|
|
|
|
|
/>
|
|
|
|
|
|
|
|
|
|
<!-- 子组件，用于添加或更新城市选择 -->
|
|
|
|
|
<add-or-update v-if="addOrUpdateVisible" ref="addOrUpdateRef" @refresh-data-list="getDataList" />
|
|
|
|
|
</el-dialog>
|
|
|
|
|
</template>
|
|
|
|
|
|
|
|
|
|
@ -329,10 +145,18 @@ import { isAuth } from '@/utils'
|
|
|
|
|
import { ElMessage } from 'element-plus'
|
|
|
|
|
import { Debounce } from '@/utils/debounce'
|
|
|
|
|
import AddOrUpdate from './add-or-update.vue'
|
|
|
|
|
import { ref, reactive, computed, watch, nextTick } from 'vue'
|
|
|
|
|
|
|
|
|
|
// 定义一个事件发射器，允许子组件向父组件发送消息
|
|
|
|
|
const emit = defineEmits(['refreshDataList'])
|
|
|
|
|
|
|
|
|
|
// 是否有免费条件的标志
|
|
|
|
|
const hasFreeCondition = ref(0)
|
|
|
|
|
|
|
|
|
|
// 控制对话框的可见性
|
|
|
|
|
const visible = ref(false)
|
|
|
|
|
|
|
|
|
|
// 表单数据对象，包含运输模板的各项信息
|
|
|
|
|
const dataForm = ref({
|
|
|
|
|
hasFreeCondition: false,
|
|
|
|
|
transName: '',
|
|
|
|
|
@ -343,20 +167,28 @@ const dataForm = ref({
|
|
|
|
|
transfees: [{ cityList: [], status: 1 }],
|
|
|
|
|
transfeeFrees: [{ freeCityList: [], freeType: 0 }]
|
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
// 分页配置
|
|
|
|
|
const page = reactive({
|
|
|
|
|
total: 0, // 总页数
|
|
|
|
|
currentPage: 1, // 当前页数
|
|
|
|
|
pageSize: 10 // 每页显示多少条
|
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
// 根据chargeType计算表格标题
|
|
|
|
|
const tableTitle = computed(() => {
|
|
|
|
|
const titles = [['首件(个)', '运费(元)', '续件(个)', '续费(元)'], ['首重(kg)', '运费(元)', '续重(kg)', '续费(元)'], ['首体积(m³)', '运费(元)', '续体积(m³)', '续费(元)']]
|
|
|
|
|
const titles = [
|
|
|
|
|
['首件(个)', '运费(元)', '续件(个)', '续费(元)'],
|
|
|
|
|
['首重(kg)', '运费(元)', '续重(kg)', '续费(元)'],
|
|
|
|
|
['首体积(m³)', '运费(元)', '续体积(m³)', '续费(元)']
|
|
|
|
|
]
|
|
|
|
|
if (dataForm.value.chargeType) {
|
|
|
|
|
return titles[dataForm.value.chargeType]
|
|
|
|
|
}
|
|
|
|
|
return titles[0]
|
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
// 如果当前对话框不可见，则关闭选择城市的对话框
|
|
|
|
|
// 监听visible值的变化，如果对话框不可见则关闭选择城市的对话框
|
|
|
|
|
watch(
|
|
|
|
|
() => visible.value,
|
|
|
|
|
(val) => {
|
|
|
|
|
@ -366,11 +198,19 @@ watch(
|
|
|
|
|
}
|
|
|
|
|
)
|
|
|
|
|
|
|
|
|
|
// 控制添加或更新对话框的可见性
|
|
|
|
|
const addOrUpdateVisible = ref(false)
|
|
|
|
|
const dataFormRef = ref(null)
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
|
* 初始化方法，根据ID加载或创建新的运输模板
|
|
|
|
|
* @param id - 运输模板ID，若不存在则为创建模式
|
|
|
|
|
*/
|
|
|
|
|
const init = (id) => {
|
|
|
|
|
visible.value = true
|
|
|
|
|
dataForm.value.transportId = id || 0
|
|
|
|
|
|
|
|
|
|
// 确保在DOM更新后重置表单字段
|
|
|
|
|
nextTick(() => {
|
|
|
|
|
dataFormRef.value?.resetFields()
|
|
|
|
|
dataForm.value = {
|
|
|
|
|
@ -384,9 +224,10 @@ const init = (id) => {
|
|
|
|
|
transfeeFrees: [{ freeCityList: [], freeType: 0 }]
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
// 如果存在ID，则加载现有运输模板的数据
|
|
|
|
|
if (dataForm.value.transportId) {
|
|
|
|
|
http({
|
|
|
|
|
// 获取运费模板数据
|
|
|
|
|
url: http.adornUrl(`/shop/transport/info/${dataForm.value.transportId}`),
|
|
|
|
|
method: 'get'
|
|
|
|
|
})
|
|
|
|
|
@ -401,8 +242,16 @@ const init = (id) => {
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
// 将init方法暴露给父组件调用
|
|
|
|
|
defineExpose({ init })
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
|
* 获取城市列表并填充到对应的运费项或包邮条件中
|
|
|
|
|
* @param row - 当前行索引
|
|
|
|
|
* @param cityList - 城市列表
|
|
|
|
|
* @param type - 类型标识符，0为普通运费项，1为包邮条件
|
|
|
|
|
*/
|
|
|
|
|
const getDataList = (row, cityList, type) => {
|
|
|
|
|
if (type === 0) {
|
|
|
|
|
dataForm.value.transfees[row].cityList = cityList
|
|
|
|
|
@ -413,22 +262,25 @@ const getDataList = (row, cityList, type) => {
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
|
* 添加运费项
|
|
|
|
|
* 添加一个新的运费项
|
|
|
|
|
*/
|
|
|
|
|
const addTransfee = () => {
|
|
|
|
|
dataForm.value.transfees.push({ cityList: [], status: 1 })
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
|
* 删除运费项
|
|
|
|
|
* 删除指定的运费项
|
|
|
|
|
* @param rowIndex - 要删除的行索引
|
|
|
|
|
*/
|
|
|
|
|
const onDelete = (rowIndex) => {
|
|
|
|
|
dataForm.value.transfees.splice(rowIndex, 1)
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
// 引用添加或更新子组件实例
|
|
|
|
|
const addOrUpdateRef = ref(null)
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
|
* 可配送区域和运费编辑
|
|
|
|
|
* 可配送区域和运费编辑（当前功能未实现）
|
|
|
|
|
*/
|
|
|
|
|
const onAddOrUpdate = () => {
|
|
|
|
|
ElMessage({
|
|
|
|
|
@ -448,14 +300,16 @@ const addTransfeeFree = () => {
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
|
* 删除指定包邮条件
|
|
|
|
|
* 删除指定的包邮条件
|
|
|
|
|
* @param rowIndex - 要删除的行索引
|
|
|
|
|
*/
|
|
|
|
|
const deleteTransfeeFree = (rowIndex) => {
|
|
|
|
|
dataForm.value.transfeeFrees?.splice(rowIndex, 1)
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
|
* 指定包邮条件编辑
|
|
|
|
|
* 编辑指定的包邮条件
|
|
|
|
|
* @param rowIndex - 要编辑的行索引
|
|
|
|
|
*/
|
|
|
|
|
const addOrUpdateTransfeeFree = (rowIndex) => {
|
|
|
|
|
addOrUpdateVisible.value = true
|
|
|
|
|
@ -470,8 +324,8 @@ const addOrUpdateTransfeeFree = (rowIndex) => {
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
|
* 改变模板类型， 0 买家承担运费 1 卖家包邮
|
|
|
|
|
* @param val
|
|
|
|
|
* 改变模板类型，0表示买家承担运费，1表示卖家包邮
|
|
|
|
|
* @param val - 新的选择值
|
|
|
|
|
*/
|
|
|
|
|
const changeFreeFee = (val) => {
|
|
|
|
|
dataForm.value.hasFreeCondition = false
|
|
|
|
|
@ -484,7 +338,9 @@ const changeFreeFee = (val) => {
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
|
* 校验输入的数字
|
|
|
|
|
* 校验输入的数字，确保其为正整数且不小于零
|
|
|
|
|
* @param row - 当前行对象
|
|
|
|
|
* @param type - 需要校验的字段类型
|
|
|
|
|
*/
|
|
|
|
|
const checkNumber = (row, type) => {
|
|
|
|
|
if (type === 1) {
|
|
|
|
|
@ -497,7 +353,9 @@ const checkNumber = (row, type) => {
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
|
* 保留整数并小于零的数设为0
|
|
|
|
|
* 保留整数并处理小于零的情况
|
|
|
|
|
* @param num - 输入的数字
|
|
|
|
|
* @returns 处理后的数字
|
|
|
|
|
*/
|
|
|
|
|
const getNumber = (num) => {
|
|
|
|
|
num = Math.round(num)
|
|
|
|
|
@ -505,11 +363,12 @@ const getNumber = (num) => {
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
|
* 表单提交
|
|
|
|
|
* 提交表单，保存运输模板信息
|
|
|
|
|
*/
|
|
|
|
|
const onSubmit = Debounce(() => {
|
|
|
|
|
dataFormRef.value?.validate((valid) => {
|
|
|
|
|
if (valid) {
|
|
|
|
|
// 检查每个运费项是否选择了可配送区域
|
|
|
|
|
for (let i = 1; i < dataForm.value.transfees.length; i++) {
|
|
|
|
|
const transfee = dataForm.value.transfees[i]
|
|
|
|
|
if (transfee.cityList.length === 0) {
|
|
|
|
|
@ -521,12 +380,18 @@ const onSubmit = Debounce(() => {
|
|
|
|
|
return
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
// 设置是否有免费条件
|
|
|
|
|
if (dataForm.value.hasFreeCondition) {
|
|
|
|
|
hasFreeCondition.value = 1
|
|
|
|
|
} else {
|
|
|
|
|
hasFreeCondition.value = 0
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
// 清空默认运费项的城市列表，因为它是全局性的
|
|
|
|
|
dataForm.value.transfees[0].cityList = []
|
|
|
|
|
|
|
|
|
|
// 发起HTTP请求保存运输模板信息
|
|
|
|
|
http({
|
|
|
|
|
url: http.adornUrl('/shop/transport'),
|
|
|
|
|
method: dataForm.value.transportId ? 'put' : 'post',
|
|
|
|
|
|
