我们发布啦

This commit is contained in:
张乐
2020-08-13 16:12:57 +08:00
parent ec2ddb4e10
commit acd9b0cb1a
1884 changed files with 344865 additions and 2 deletions

View File

@@ -0,0 +1,472 @@
<template>
<el-dialog
v-if="dialogVisible"
title="运费模板"
:visible.sync="dialogVisible"
width="1000px"
:before-close="handleClose"
>
<el-form ref="ruleForm" :model="ruleForm" label-width="120px" size="mini" v-if="dialogVisible" :rules="rules">
<el-form-item label="模板名称" prop="name">
<el-input v-model="ruleForm.name" class="withs" placeholder="请输入模板名称" />
</el-form-item>
<el-form-item label="计费方式" prop="type">
<el-radio-group v-model="ruleForm.type" @change="changeRadio(ruleForm.type)">
<el-radio :label="1">按件数</el-radio>
<el-radio :label="2">按重量</el-radio>
<el-radio :label="3">按体积</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="配送区域及运费" prop="region">
<el-table v-loading="listLoading" :data="ruleForm.region" border fit highlight-current-row style="width: 100%" size="mini" class="tempBox">
<el-table-column align="center" label="可配送区域" min-width="260">
<template slot-scope="scope">
<span v-if="scope.$index === 0">默认全国</span>
<el-cascader
v-else
v-model="scope.row.city_ids"
style="width: 98%"
:options="cityList"
:props="props"
collapse-tags
clearable
filterable
@change="changeRegion"
/>
</template>
</el-table-column>
<el-table-column min-width="130px" align="center" :label="columns.title">
<template slot-scope="{row}">
<el-input-number v-model="row.first" controls-position="right" :min="1" />
</template>
</el-table-column>
<el-table-column min-width="120px" align="center" label="运费(元)">
<template slot-scope="{row}">
<el-input-number v-model="row.firstPrice" controls-position="right" />
</template>
</el-table-column>
<el-table-column min-width="120px" align="center" :label="columns.title2">
<template slot-scope="{row}">
<el-input-number v-model="row.renewal" controls-position="right" />
</template>
</el-table-column>
<el-table-column class-name="status-col" align="center" label="续费(元)" min-width="120">
<template slot-scope="{row}">
<el-input-number v-model="row.renewalPrice" controls-position="right" />
</template>
</el-table-column>
<el-table-column align="center" label="操作" min-width="80">
<template slot-scope="scope">
<el-button
v-if="scope.$index > 0"
type="text"
size="small"
@click="confirmEdit(ruleForm.region,scope.$index)"
>
删除
</el-button>
</template>
</el-table-column>
</el-table>
</el-form-item>
<el-form-item>
<el-button type="primary" size="mini" icon="el-icon-edit" @click="addRegion(ruleForm.region)">
添加配送区域
</el-button>
</el-form-item>
<el-form-item label="指定包邮" prop="appoint">
<el-radio-group v-model="ruleForm.appoint">
<el-radio :label="true">开启</el-radio>
<el-radio :label="false">关闭</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item v-if="ruleForm.appoint === true" prop="free">
<el-table v-loading="listLoading" :data="ruleForm.free" border fit highlight-current-row style="width: 100%" size="mini">
<el-table-column align="center" label="选择地区" min-width="220">
<template slot-scope="{row}">
<el-cascader
v-model="row.city_ids"
style="width: 95%"
:options="cityList"
:props="props"
collapse-tags
clearable
/>
</template>
</el-table-column>
<el-table-column min-width="180px" align="center" :label="columns.title3">
<template slot-scope="{row}">
<el-input-number v-model="row.number" controls-position="right" />
</template>
</el-table-column>
<el-table-column min-width="120px" align="center" label="包邮金额(元)">
<template slot-scope="{row}">
<el-input-number v-model="row.price" controls-position="right" />
</template>
</el-table-column>
<el-table-column align="center" label="操作" min-width="120">
<template slot-scope="scope">
<el-button
type="text"
size="small"
@click="confirmEdit(ruleForm.free,scope.$index)"
>
删除
</el-button>
</template>
</el-table-column>
</el-table>
</el-form-item>
<el-form-item v-if="ruleForm.appoint === true">
<el-button type="primary" size="mini" icon="el-icon-edit" @click="addFree(ruleForm.free)">
添加指定包邮区域
</el-button>
</el-form-item>
<!--<el-row :gutter="20">-->
<!--<el-col :span="7">-->
<!--<el-form-item label="指定区域不配送" prop="undelivery">-->
<!--<el-radio-group v-model="ruleForm.undelivery">-->
<!--<el-radio :label="1">开启</el-radio>-->
<!--<el-radio :label="0">关闭</el-radio>-->
<!--</el-radio-group>-->
<!--</el-form-item>-->
<!--</el-col>-->
<!--<el-col :span="14">-->
<!--<el-form-item v-if="ruleForm.undelivery === 1" class="noBox" prop="city_id3">-->
<!--<el-cascader-->
<!--v-model="ruleForm.city_id3"-->
<!--placeholder="请选择不配送区域"-->
<!--:options="cityList"-->
<!--:props="props"-->
<!--collapse-tags-->
<!--clearable-->
<!--style="width: 46%"-->
<!--/>-->
<!--</el-form-item>-->
<!--</el-col>-->
<!--</el-row>-->
<el-form-item label="排序">
<el-input v-model="ruleForm.sort" class="withs" placeholder="请输入排序" />
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="onClose('ruleForm')"> </el-button>
<el-button type="primary" @click="onsubmit('ruleForm')"> </el-button>
</span>
</el-dialog>
</template>
<script>
import * as logistics from '@/api/logistics'
import { Loading } from 'element-ui'
const defaultRole = {
name: '',
type: 1,
appoint: false,
sort: 0,
region: [{
first: 1,
firstPrice: 1,
renewal: 1,
renewalPrice: 1,
city_id: [],
city_ids: []
}],
undelivery: 0,
free: [],
undelives: {},
city_id3: []
}
const kg = '重量kg'
const m = '体积'
const statusMap = [
{
title: '首件',
title2: '续件',
title3: '包邮件数'
},
{
title: `首件${kg}`,
title2: `续件${kg}`,
title3: `包邮${kg}`
},
{
title: `首件${m}`,
title2: `续件${m}`,
title3: `包邮${m}`
}
]
export default {
name: 'CreatTemplates',
components: {
},
data() {
return {
rules: {
name: [
{ required: true, message: '请输入模板名称', trigger: 'blur' }
],
free: [
{ type: 'array', required: true, message: '请至少添加一个地区', trigger: 'change' }
],
appoint: [
{ required: true, message: '请选择是否指定包邮', trigger: 'change' }
],
undelivery: [
{ required: true, message: '请选择是否指定区域不配送', trigger: 'change' }
],
type: [
{ required: true, message: '请选择计费方式', trigger: 'change' }
],
region: [
{ required: true, message: '请选择活动区域', trigger: 'change' }
],
city_id3: [
{ type: 'array', required: true, message: '请至少选择一个地区', trigger: 'change' }
]
},
nodeKey: 'city_id',
props: {
children: 'child',
label: 'name',
value: 'cityId',
multiple: true
},
dialogVisible: false,
ruleForm: Object.assign({}, defaultRole),
listLoading: false,
cityList: [],
columns: {
title: '首件',
title2: '续件',
title3: '包邮件数'
},
tempId: 0,
type: 0 // 0添加 1编辑
}
},
mounted() {
},
methods: {
changType(type) {
this.type = type
},
onClose(formName) {
this.dialogVisible = false
this.$refs[formName].resetFields()
},
confirmEdit(row, index) {
row.splice(index, 1)
},
popoverHide() {},
handleClose() {
this.dialogVisible = false
this.$refs['ruleForm'].resetFields()
},
changeRegion(value) {
// console.log(value)
},
changeRadio(num) {
this.columns = Object.assign({}, statusMap[num - 1])
},
// 添加配送区域
addRegion(region) {
region.push(Object.assign({}, {
first: 1,
firstPrice: 1,
renewal: 1,
renewalPrice: 1,
city_id: [],
city_ids: []
}))
},
addFree(Free) {
Free.push(Object.assign({}, {
city_id: [],
number: 1,
price: 1,
city_ids: []
}))
},
/**
* 详情
* id 模板id
* appoint true包邮 false不包邮
**/
getInfo(id, appoint) {
this.tempId = id
const loadingInstance = Loading.service({ fullscreen: true })
logistics.templateDetailApi({ id }).then(res => {
this.dialogVisible = true
const info = res
this.ruleForm = Object.assign(this.ruleForm, {
name: info.name,
type: info.type,
appoint: info.appoint,
sort: info.sort
})
this.$nextTick(() => {
loadingInstance.close()
})
// 不包邮地区
this.shippingRegion()
// 包邮地区
if (info.appoint) {
this.shippingFree()
}
}).catch(res => {
// console.log(res)
this.$message.error(res.message)
this.$nextTick(() => {
loadingInstance.close()
})
})
},
// 不包邮
shippingRegion() {
logistics.shippingRegion({ tempId: this.tempId }).then(res => {
res.forEach((item, index) => {
item.title = JSON.parse(item.title)
item.city_id = item.title
item.city_ids = item.title
})
this.ruleForm.region = res
})
},
// 包邮
shippingFree() {
logistics.shippingFree({ tempId: this.tempId }).then(res => {
res.forEach((item, index) => {
item.title = JSON.parse(item.title)
item.city_id = item.title
item.city_ids = item.title
})
this.ruleForm.free = res
})
},
// 列表
getCityList() {
logistics.cityListTree().then(res => {
// console.log(res, 'getCityList')
res.forEach((el, index) => {
el.child.forEach((cel, j) => {
delete cel.child
})
})
this.cityList = res
}).catch(res => {
this.$message.error(res.message)
})
},
change(idBox) {
idBox.map(item => {
const ids = []
item.city_ids.map(j => {
j.splice(0, 1)
ids.push(j[0])
})
item.city_id = ids
})
return idBox
},
changeOne(idBox) {
const city_ids = []
idBox.map(item => {
item.splice(0, 1)
city_ids.push(item[0])
})
return city_ids
},
onsubmit(formName) {
this.$refs[formName].validate((valid) => {
if (valid) {
const param = {
appoint: this.ruleForm.appoint,
name: this.ruleForm.name,
sort: this.ruleForm.sort,
type: this.ruleForm.type,
// 配送区域及运费
shippingTemplatesRegionRequestList: [],
// 指定包邮设置
shippingTemplatesFreeRequestList: []
}
console.log(this.ruleForm.region)
this.ruleForm.region.forEach((el, index) => {
console.log(el)
el.title = el.city_ids.length > 0 ? JSON.stringify(el.city_ids) : JSON.stringify([[0, 0]])
for (var i = 0; i < el.city_ids.length; i++) {
el.city_ids[i].shift()
}
el.cityId = el.city_ids.length > 0 ? el.city_ids.join(',') : 'all'
})
param.shippingTemplatesRegionRequestList = this.ruleForm.region
param.shippingTemplatesRegionRequestList.forEach((el, index) => {
// delete el.city_ids
// delete el.city_id
})
if (this.ruleForm.appoint) {
this.ruleForm.free.forEach((el, index) => {
el.title = el.city_ids.length > 0 ? JSON.stringify(el.city_ids) : JSON.stringify([[0, 0]])
for (var i = 0; i < el.city_ids.length; i++) {
el.city_ids[i].shift()
}
el.cityId = el.city_ids.length > 0 ? el.city_ids.join(',') : 'all'
})
param.shippingTemplatesFreeRequestList = this.ruleForm.free
param.shippingTemplatesFreeRequestList.forEach((el, index) => {
// delete el.city_ids
// delete el.city_id
})
}
if (this.type === 0) {
logistics.shippingSave(param).then(res => {
this.$message.success('操作成功')
this.$nextTick(() => {
this.dialogVisible = false
this.$refs[formName].resetFields()
})
setTimeout(() => {
this.$emit('getList')
console.log(this.$refs, 'this.$refs[formName]')
}, 600)
})
} else {
logistics.shippingUpdate(param, { id: this.tempId }).then(res => {
this.$message.success('操作成功')
setTimeout(() => {
this.$emit('getList')
// this.$refs[formName].resetFields()
// this.clear()
}, 600)
this.$nextTick(() => {
this.dialogVisible = false
this.$refs[formName].resetFields()
})
})
}
} else {
return false
}
})
}
}
}
</script>
<style scoped lang="scss">
.withs{
width: 50%;
}
.noBox{
/deep/.el-form-item__content{
margin-left: 0 !important;
}
}
.tempBox{
/deep/.el-input-number--mini{
width: 100px !important;
}
}
</style>

View File

@@ -0,0 +1,190 @@
<template>
<div class="divBox">
<el-card class="box-card">
<div slot="header" class="clearfix">
<div class="container">
<el-form ref="form" inline :model="form">
<el-form-item label="搜索:">
<el-input v-model="form.name" placeholder="请输入内容" class="selWidth" size="small">
<el-button slot="append" icon="el-icon-search" @click="handleSearch" />
</el-input>
</el-form-item>
</el-form>
</div>
<el-button type="primary" size="mini" @click="handleSubmit()">添加运费模板</el-button>
</div>
<el-table
v-loading="loading"
:data="tableData.list"
style="width: 100%"
size="mini"
>
<el-table-column
prop="id"
label="ID"
min-width="60"
/>
<el-table-column
label="模板名称"
min-width="150"
prop="name"
/>
<el-table-column
min-width="100"
label="计费方式"
prop="type"
>
<template slot-scope="{row}">
<p>{{ row.type | typeFilter }}</p>
</template>
</el-table-column>
<el-table-column
min-width="100"
label="指定包邮"
prop="appoint"
>
<template slot-scope="{row}">
<p>{{ row.appoint | statusFilter }}</p>
</template>
</el-table-column>
<el-table-column
min-width="120"
label="指定区域不配送"
prop="type"
/>
<el-table-column
label="排序"
min-width="100"
prop="sort"
/>
<el-table-column
label="添加时间"
min-width="150"
prop="createTime"
/>
<el-table-column
prop="address"
fixed="right"
width="120"
label="操作"
>
<template slot-scope="scope">
<el-button type="text" size="small" @click="bindEdit(scope.row)">修改</el-button>
<el-button type="text" size="small" @click="bindDelete(scope.row)">删除</el-button>
</template>
</el-table-column>
</el-table>
<div class="block-pagination">
<el-pagination
:page-sizes="[12, 20, 40, 60]"
:page-size="tableData.limit"
:current-page="tableData.page"
layout="total, sizes, prev, pager, next, jumper"
:total="tableData.total"
@current-change="pageChange"
@size-change="handleSizeChange"
/>
</div>
</el-card>
<CreatTemplates ref="addTemplates" @getList="getList" />
</div>
</template>
<script>
import CreatTemplates from './creatTemplates'
import * as logistics from '@/api/logistics.js'
export default {
name: 'ShippingTemplates',
filters: {
statusFilter(status) {
const statusMap = {
true: '开启',
false: '关闭'
}
return statusMap[status]
},
typeFilter(status) {
const statusMap = {
1: '按件数',
2: '按重量',
3: '按体积'
}
return statusMap[status]
}
},
components: { CreatTemplates },
data() {
return {
dialogVisible: false,
form: {
name: ''
},
tableData: '',
page: 1,
limit: 12,
loading: false
}
},
created() {
this.getDataList()
},
methods: {
// 添加
handleSubmit() {
this.$refs.addTemplates.dialogVisible = true
this.$refs.addTemplates.getCityList()
this.$refs.addTemplates.changType(0, this.te)
},
handleSearch() {
this.getDataList()
},
// 分页
pageChange(e) {
this.page = e
this.getDataList()
},
handleSizeChange(e) {
this.limit = e
this.getDataList()
},
// 数据列表
getDataList() {
this.loading = true
logistics.shippingTemplatesList({
name: this.form.name,
page: this.page,
limit: this.limit
}).then(res => {
this.loading = false
this.tableData = res
})
},
// 编辑
bindEdit(item) {
// this.$refs.addTemplates.dialogVisible = true
this.$refs.addTemplates.getCityList()
this.$refs.addTemplates.getInfo(item.id, item.appoint)
this.$refs.addTemplates.changType(1)
},
// 删除
bindDelete(item) {
this.$modalSure().then(() => {
logistics.shippingDetete({ id: item.id }).then(res => {
this.$message.success('删除成功')
this.getDataList()
})
})
// logistics.shippingDetete()
},
getList() {
this.getDataList()
}
}
}
</script>
<style scoped lang="scss">
.selWidth{
width: 350px;
}
</style>