458 lines
24 KiB
PHP
458 lines
24 KiB
PHP
@extends('layouts.base')
|
|
@section('title', '编辑配送模板')
|
|
@section('content')
|
|
<link rel="stylesheet" type="text/css" href="{{static_url('yunshop/goods/vue-goods1.css')}}"/>
|
|
<div class="all">
|
|
<div id="app" v-cloak>
|
|
<div class="vue-crumbs">
|
|
<a @click="goParent">配送模板</a> > 配送方式设置
|
|
</div>
|
|
<div class="vue-main">
|
|
<div class="vue-main-title">
|
|
<div class="vue-main-title-left"></div>
|
|
<div class="vue-main-title-content">配送方式设置</div>
|
|
</div>
|
|
<div class="vue-main-form">
|
|
<el-form ref="form" :model="form" :rules="rules" label-width="15%">
|
|
<el-form-item label="排序" prop="display_order">
|
|
<el-input v-model="form.display_order" style="width:70%;"></el-input>
|
|
</el-form-item>
|
|
<el-form-item label="配送方式名称" prop="dispatch_name">
|
|
<el-input v-model="form.dispatch_name" style="width:70%;"></el-input>
|
|
</el-form-item>
|
|
<el-form-item label="计算方式" prop="calculate_type">
|
|
<el-radio v-model.number="form.calculate_type" :label="0">按重量计费</el-radio>
|
|
<el-radio v-model.number="form.calculate_type" :label="1">按件计费</el-radio>
|
|
</el-form-item>
|
|
<el-form-item label="配送区域" prop="explain_content">
|
|
<table class="el-table" style="width:90%">
|
|
<tr style="border-bottom:1px solid #EBEEF5">
|
|
<th style="width:40%">运送到</th>
|
|
<th>[[form.calculate_type==1?'首件(个)':'首重(克)']]</th>
|
|
<th>[[form.calculate_type==1?'运费(元)':'首费(元)']]</th>
|
|
<th>[[form.calculate_type==1?'续件(个)':'续重(克)']]</th>
|
|
<th>续费(元)</th>
|
|
<th style="width:80px">操作</th>
|
|
</tr>
|
|
<tr v-if="form.calculate_type==1">
|
|
<td>
|
|
全国【默认运费】
|
|
</td>
|
|
<td>
|
|
<el-input v-model="form.first_piece" style="width:80%"></el-input>
|
|
</td>
|
|
<td>
|
|
<el-input v-model="form.first_piece_price" style="width:80%"></el-input>
|
|
</td>
|
|
<td>
|
|
<el-input v-model="form.another_piece" style="width:80%"></el-input>
|
|
</td>
|
|
<td>
|
|
<el-input v-model="form.another_piece_price" style="width:80%"></el-input>
|
|
</td>
|
|
<td>
|
|
|
|
</td>
|
|
</tr>
|
|
<tr v-else>
|
|
<td>
|
|
全国【默认运费】
|
|
</td>
|
|
<td>
|
|
<el-input v-model="form.first_weight" style="width:80%"></el-input>
|
|
</td>
|
|
<td>
|
|
<el-input v-model="form.first_weight_price" style="width:80%"></el-input>
|
|
</td>
|
|
<td>
|
|
<el-input v-model="form.another_weight" style="width:80%"></el-input>
|
|
</td>
|
|
<td>
|
|
<el-input v-model="form.another_weight_price" style="width:80%"></el-input>
|
|
</td>
|
|
<td>
|
|
|
|
</td>
|
|
</tr>
|
|
<tr v-if="form.calculate_type==1" v-for="(item,index) in piece" :key="index">
|
|
<td>
|
|
<!-- <div style="font-size:12px;font-weight:600;line-height:18px;margin-right: 15px">
|
|
<span v-for="(item1,index1) in item.areas" :key="index1">[[item1]];</span>
|
|
</div> -->
|
|
<div style="font-size:12px;font-weight:600;line-height:18px;margin-right: 15px">
|
|
[[item.areas]]
|
|
</div>
|
|
<el-button size="small" @click="openVisible('piece',index)">选择区域</el-button>
|
|
</td>
|
|
<td>
|
|
<el-input v-model="item.first_piece" style="width:80%"></el-input>
|
|
</td>
|
|
<td>
|
|
<el-input v-model="item.first_piece_price" style="width:80%"></el-input>
|
|
</td>
|
|
<td>
|
|
<el-input v-model="item.another_piece" style="width:80%"></el-input>
|
|
</td>
|
|
<td>
|
|
<el-input v-model="item.another_piece_price" style="width:80%"></el-input>
|
|
</td>
|
|
<td>
|
|
<el-link :underline="false" @click="delList('piece',index)" class="vue-assist-color"> 删除</el-link>
|
|
</td>
|
|
</tr>
|
|
<tr v-if="!form.calculate_type || form.calculate_type==0" v-for="(item,index) in weight" :key="index">
|
|
<td>
|
|
<!-- <div style="font-size:12px;font-weight:600;line-height:18px;margin-right: 15px">
|
|
<span v-for="(item1,index1) in item.areas" :key="index1">[[item1]];</span>
|
|
</div> -->
|
|
<div style="font-size:12px;font-weight:600;line-height:18px;margin-right: 15px">
|
|
[[item.areas]]
|
|
</div>
|
|
|
|
<el-button size="small" @click="openVisible('weight',index)">选择区域</el-button>
|
|
</td>
|
|
<td>
|
|
<el-input v-model="item.first_weight" style="width:80%"></el-input>
|
|
</td>
|
|
<td>
|
|
<el-input v-model="item.first_weight_price" style="width:80%"></el-input>
|
|
</td>
|
|
<td>
|
|
<el-input v-model="item.another_weight" style="width:80%"></el-input>
|
|
</td>
|
|
<td>
|
|
<el-input v-model="item.another_weight_price" style="width:80%"></el-input>
|
|
</td>
|
|
<td>
|
|
<el-link :underline="false" @click="delList('weight',index)" class="vue-assist-color"> 删除</el-link>
|
|
</td>
|
|
</tr>
|
|
|
|
</table>
|
|
<el-button type="primary" plain icon="el-icon-plus" size="small" @click="addList">新增配送区域</el-button>
|
|
<div class="tip" v-if="form.calculate_type==1">根据件数来计算运费，当物品不足《首件数量》时，按照《首件费用》计算，超过部分按照《续件数量》和《续件费用》乘积来计算</div>
|
|
<div class="tip" v-else>根据重量来计算运费，当物品不足《首重重量》时，按照《首重费用》计算，超过部分按照《续重重量》和《续重费用》乘积来计算</div>
|
|
</el-form-item>
|
|
<el-form-item label="是否为默认快递模板" prop="is_default">
|
|
<el-switch v-model="form.is_default" :active-value="1" :inactive-value="0"></el-switch>
|
|
</el-form-item>
|
|
<el-form-item label="是否显示" prop="enabled">
|
|
<el-switch v-model="form.enabled" :active-value="1" :inactive-value="0"></el-switch>
|
|
</el-form-item>
|
|
</el-form>
|
|
</div>
|
|
</div>
|
|
<!-- 分页 -->
|
|
<div class="vue-page">
|
|
<div class="vue-center">
|
|
<el-button type="primary" @click="submitForm('form')">保存设置</el-button>
|
|
<el-button @click="goBack">返回</el-button>
|
|
</div>
|
|
</div>
|
|
<el-dialog title="请选择地区" :visible.sync="centerDialogVisible" center v-if="chooseIndex!=-1&&showVisible" :before-close="beforeClose">
|
|
<el-tree
|
|
v-loading="loading"
|
|
:props="props"
|
|
node-key="id"
|
|
:default-checked-keys="chooseItem.area_ids"
|
|
:default-expanded-keys="chooseItem.province_ids"
|
|
show-checkbox
|
|
lazy
|
|
@check-change="checkAreas"
|
|
ref="addressTree"
|
|
:data="treeData"
|
|
:load="loadNode"
|
|
style="height:500px;overflow:auto"
|
|
>
|
|
</el-tree>
|
|
|
|
<span slot="footer" class="dialog-footer">
|
|
<el-button @click="beforeClose">取 消</el-button>
|
|
<el-button type="primary" @click="saveAreas">确 定</el-button>
|
|
</span>
|
|
|
|
</el-dialog>
|
|
</div>
|
|
</div>
|
|
|
|
<script>
|
|
var app = new Vue({
|
|
el:"#app",
|
|
delimiters: ['[[', ']]'],
|
|
name: 'test',
|
|
data() {
|
|
let id = {!! $id?:0 !!};
|
|
console.log(id);
|
|
return{
|
|
id:id,
|
|
submit_link:'',
|
|
piece:[],//按件计费-区域数据
|
|
weight:[],//按重量计费-区域数据
|
|
form:{
|
|
areas:'全国 [默认运费]',
|
|
first_weight:'0',
|
|
first_weight_price:'0',
|
|
another_weight:'0',
|
|
another_weight_price:'0',
|
|
|
|
|
|
},
|
|
chooseIndex:-1,
|
|
chooseName:'weight',
|
|
chooseItem:{},
|
|
chooseAreas:[],
|
|
chooseAreaIds:[],
|
|
chooseProvinceIds:[],
|
|
centerDialogVisible:false,
|
|
showVisible:false,
|
|
props: {
|
|
label: 'areaname',
|
|
children: 'children',
|
|
isLeaf: 'isLeaf'
|
|
},
|
|
loading: false,
|
|
treeData: [],
|
|
rules:{
|
|
dispatch_name:{ required: true, message: '请输入配送方式名称'}
|
|
},
|
|
}
|
|
},
|
|
created() {
|
|
|
|
|
|
},
|
|
mounted() {
|
|
let json = {};
|
|
if(!this.id) {
|
|
this.submit_link = '{!! yzWebFullUrl('goods.dispatch.add') !!}';
|
|
}
|
|
else {
|
|
this.submit_link = '{!! yzWebFullUrl('goods.dispatch.edit') !!}';
|
|
json.id = this.id;
|
|
}
|
|
|
|
|
|
this.getData(json);
|
|
},
|
|
methods: {
|
|
getData(json) {
|
|
let loading = this.$loading({target:document.querySelector(".content"),background: 'rgba(0, 0, 0, 0)'});
|
|
this.$http.post(this.submit_link,json).then(function (response) {
|
|
if (response.data.result){
|
|
this.form = {
|
|
...response.data.data.dispatch,
|
|
enabled:response.data.data.dispatch.enabled || 0,
|
|
calculate_type:response.data.data.dispatch.calculate_type || 0,
|
|
is_default:response.data.data.dispatch.is_default || 0,
|
|
areas:response.data.data.dispatch.areas || '全国 [默认运费]',
|
|
};
|
|
// 兼容旧的数据格式
|
|
if(response.data.data.dispatch.weight_data instanceof Object == true) {
|
|
for(var i in response.data.data.dispatch.weight_data) {
|
|
console.log(response.data.data.dispatch.weight_data[i])
|
|
this.weight.push(response.data.data.dispatch.weight_data[i])
|
|
}
|
|
}
|
|
else {
|
|
this.weight = response.data.data.dispatch.weight_data || [];
|
|
}
|
|
if(response.data.data.dispatch.piece_data instanceof Object == true) {
|
|
for(var i in response.data.data.dispatch.piece_data) {
|
|
console.log(response.data.data.dispatch.piece_data[i])
|
|
this.piece.push(response.data.data.dispatch.piece_data[i])
|
|
}
|
|
}
|
|
else {
|
|
this.piece = response.data.data.dispatch.piece_data || [];
|
|
}
|
|
|
|
// this.form.enabled = 1;
|
|
console.log(this.piece_data)
|
|
// console.log(this.form)
|
|
}
|
|
else {
|
|
this.$message({message: response.data.msg,type: 'error'});
|
|
}
|
|
loading.close();
|
|
},function (response) {
|
|
this.$message({message: response.data.msg,type: 'error'});
|
|
loading.close();
|
|
}
|
|
);
|
|
},
|
|
goParent() {
|
|
window.location.href = `{!! yzWebFullUrl('goods.dispatch.index') !!}`;
|
|
},
|
|
submitForm(formName) {
|
|
let that = this;
|
|
let json = this.form;
|
|
json.weight = this.weight;
|
|
json.piece = this.piece;
|
|
let json1 = {
|
|
dispatch:json
|
|
}
|
|
if(this.id) {
|
|
json1.id = this.id
|
|
}
|
|
this.$refs[formName].validate((valid) => {
|
|
if (valid) {
|
|
let loading = this.$loading({target:document.querySelector(".content"),background: 'rgba(0, 0, 0, 0)'});
|
|
this.$http.post(this.submit_link,json1).then(response => {
|
|
if (response.data.result) {
|
|
this.$message({type: 'success',message: '操作成功!'});
|
|
this.goBack();
|
|
} else {
|
|
this.$message({message: response.data.msg,type: 'error'});
|
|
}
|
|
loading.close();
|
|
},response => {
|
|
loading.close();
|
|
});
|
|
}
|
|
else {
|
|
console.log('error submit!!');
|
|
return false;
|
|
}
|
|
});
|
|
},
|
|
addList() {
|
|
if(this.form.calculate_type==1) {
|
|
this.piece.push(
|
|
{areas:"",area_ids:"",province_ids:[],first_piece:this.form.first_piece,first_piece_price:this.form.first_piece_price,another_piece:this.form.another_piece,another_piece_price:this.form.another_piece_price}
|
|
)
|
|
}
|
|
else {
|
|
console.log(this.weight)
|
|
this.weight.push(
|
|
{areas:"",area_ids:"",province_ids:[],first_weight:this.form.first_weight,first_weight_price:this.form.first_weight_price,another_weight:this.form.another_weight,another_weight_price:this.form.another_weight_price}
|
|
)
|
|
}
|
|
},
|
|
delList(name,index) {
|
|
if(name == "weight") {
|
|
this.weight.splice(index,1);
|
|
}
|
|
else if(name == 'piece') {
|
|
this.piece.splice(index,1);
|
|
}
|
|
},
|
|
handleClose(area) {
|
|
this.form.areas.splice(this.form.areas.indexOf(area), 1);
|
|
},
|
|
openVisible(name,index) {
|
|
this.centerDialogVisible = true;
|
|
this.showVisible = true;
|
|
this.chooseName = name;
|
|
this.chooseIndex = index;
|
|
this.chooseItem = {};
|
|
if(name == "weight") {
|
|
this.chooseItem = JSON.parse(JSON.stringify(this.weight[index]));
|
|
this.chooseItem.area_ids = this.weight[index].area_ids.split(";");
|
|
this.chooseItem.area_ids.forEach((item,index) => {
|
|
this.chooseItem.area_ids[index] = Number(item)
|
|
});
|
|
this.chooseItem.areas = this.weight[index].areas.split(";");
|
|
}
|
|
else if(name == "piece") {
|
|
this.chooseItem = JSON.parse(JSON.stringify(this.piece[index]));
|
|
this.chooseItem.area_ids = this.piece[index].area_ids.split(";");
|
|
this.chooseItem.area_ids.forEach((item,index) => {
|
|
this.chooseItem.area_ids[index] = Number(item)
|
|
});
|
|
// this.chooseItem.area_ids = this.piece[index].area_ids.split(";");
|
|
this.chooseItem.areas = this.piece[index].areas.split(";");
|
|
}
|
|
console.log(this.chooseItem)
|
|
},
|
|
loadNode(node, resolve) {
|
|
this.loading = true;
|
|
if (!node.data.id) {
|
|
//省份
|
|
node.data.id = 0;
|
|
this.$http.get("{!! yzWebUrl('area.list', ['parent_id'=> 0]) !!}").then(response => {
|
|
response.data.data.forEach(function (province) {
|
|
province.isLeaf = false;
|
|
});
|
|
resolve(response.data.data);
|
|
|
|
this.loading = false;
|
|
}, response => {
|
|
console.log(response);
|
|
});
|
|
} else {
|
|
//城市
|
|
this.$http.get("{!! yzWebUrl('area.list', ['parent_id'=> '']) !!}" + node.data.id).then(response => {
|
|
//城市没有子节点
|
|
response.data.data.forEach(function (city) {
|
|
city.isLeaf = true;
|
|
})
|
|
resolve(response.data.data);
|
|
// 载入数据后,刷新已选中
|
|
this.loading = false;
|
|
}, response => {
|
|
console.log(response);
|
|
});
|
|
}
|
|
},
|
|
checkAreas(node,checked,children) {
|
|
if(node.isLeaf){
|
|
return;
|
|
}
|
|
if(checked){
|
|
if(!this.chooseItem.province_ids) {
|
|
this.chooseItem.province_ids = [];
|
|
}
|
|
this.chooseItem.province_ids.push(node.id)
|
|
}
|
|
},
|
|
saveAreas() {
|
|
let areas = [];
|
|
let area_ids = [];
|
|
let province_ids = [];
|
|
this.$refs.addressTree.getCheckedNodes().forEach(function (node) {
|
|
if (node.level == 1) {
|
|
province_ids.push(node.id);
|
|
} else if (node.level == 2) {
|
|
area_ids.push(node.id);
|
|
areas.push(node.areaname)
|
|
}
|
|
});
|
|
this.$refs.addressTree.getHalfCheckedNodes().forEach(function (node) {
|
|
if (node.level == 1) {
|
|
province_ids.push(node.id);
|
|
}
|
|
|
|
});
|
|
if(this.chooseName == "weight") {
|
|
this.weight[this.chooseIndex].area_ids = area_ids.join(";");
|
|
this.weight[this.chooseIndex].areas = areas.join(";");
|
|
this.weight[this.chooseIndex].province_ids = province_ids;
|
|
}
|
|
else if(this.chooseName == "piece") {
|
|
this.piece[this.chooseIndex].area_ids = area_ids.join(";");
|
|
this.piece[this.chooseIndex].areas = areas.join(";");
|
|
this.piece[this.chooseIndex].province_ids = province_ids;
|
|
}
|
|
|
|
console.log(this.weight)
|
|
console.log(this.piece)
|
|
this.centerDialogVisible = false
|
|
this.showVisible = false;
|
|
|
|
|
|
},
|
|
beforeClose() {
|
|
this.centerDialogVisible = false;
|
|
this.showVisible = false;
|
|
},
|
|
goBack() {
|
|
history.go(-1)
|
|
}
|
|
},
|
|
})
|
|
|
|
</script>
|
|
@endsection
|
|
|
|
|