提交 113449c9 authored 作者: 郑伟娜's avatar 郑伟娜

地区选择逻辑处理

上级 0e103014
...@@ -28,8 +28,8 @@ ...@@ -28,8 +28,8 @@
</el-form-item> </el-form-item>
<el-form-item label="计费方式"> <el-form-item label="计费方式">
<el-radio-group v-model="ruleForm.charge_type"> <el-radio-group v-model="ruleForm.charge_type">
<el-radio :label="1"></el-radio> <el-radio :label="1"></el-radio>
<el-radio :label="2"></el-radio> <el-radio :label="2"></el-radio>
<el-radio :label="3">按体积</el-radio> <el-radio :label="3">按体积</el-radio>
</el-radio-group> </el-radio-group>
</el-form-item> </el-form-item>
...@@ -38,8 +38,8 @@ ...@@ -38,8 +38,8 @@
<div style="display: flex; justify-content: space-between; margin-bottom: 5px;"> <div style="display: flex; justify-content: space-between; margin-bottom: 5px;">
<span style="font-size: 12px; color: #85878A;">除指定地区外,其余地区运费采用:“全国默认运费”</span> <span style="font-size: 12px; color: #85878A;">除指定地区外,其余地区运费采用:“全国默认运费”</span>
<div> <div>
<el-button plain size="mini">删除</el-button> <el-button plain size="mini" @click="delDelivery('2')">删除</el-button>
<el-button type="primary" plain size="mini">添加地区</el-button> <el-button type="primary" plain size="mini" @click="addDelivery">添加地区</el-button>
</div> </div>
</div> </div>
<div style="background: #F9F9FA; padding: 20px;"> <div style="background: #F9F9FA; padding: 20px;">
...@@ -58,8 +58,9 @@ ...@@ -58,8 +58,9 @@
label="配送区域" label="配送区域"
> >
<template slot-scope="scope"> <template slot-scope="scope">
<span>【默认】</span> <span v-if="scope.row.a.length && scope.row.a[0] == 0">【默认】全国</span>
<span>【指定】</span> <span v-if="scope.row.a.length && scope.row.a[0] != 0">【指定】{{ scope.row.a }}</span>
<span v-if="!scope.row.a.length" style="color: #1890ff; cursor: pointer;" @click="editAddress(scope.row, scope.$index)">【点击选择配送地区】</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column <el-table-column
...@@ -67,8 +68,13 @@ ...@@ -67,8 +68,13 @@
label="首件(个)" label="首件(个)"
width="150" width="150"
> >
<template slot="header" slot-scope="scope">
<span v-if="ruleForm.charge_type == 1">首件(个)</span>
<span v-if="ruleForm.charge_type == 2">首重(克)</span>
<span v-if="ruleForm.charge_type == 3">首件(立方米)</span>
</template>
<template slot-scope="scope"> <template slot-scope="scope">
<el-input v-model="scope.row.f" class="inputWidth"></el-input> <el-input v-model="scope.row.f" class="inputWidth" @input="onClickInputKeyBoard2('deliveryTableData', scope.$index, 'f')"></el-input>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column <el-table-column
...@@ -77,7 +83,7 @@ ...@@ -77,7 +83,7 @@
width="150" width="150"
> >
<template slot-scope="scope"> <template slot-scope="scope">
<el-input v-model="scope.row.fp" class="inputWidth"></el-input> <el-input v-model="scope.row.fp" class="inputWidth" @input="onClickInputKeyBoard('deliveryTableData', scope.$index, 'fp')"></el-input>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column <el-table-column
...@@ -85,8 +91,13 @@ ...@@ -85,8 +91,13 @@
label="续件(个)" label="续件(个)"
width="150" width="150"
> >
<template slot="header" slot-scope="scope">
<span v-if="ruleForm.charge_type == 1">续件(个)</span>
<span v-if="ruleForm.charge_type == 2">续重(克)</span>
<span v-if="ruleForm.charge_type == 3">续件(立方米)</span>
</template>
<template slot-scope="scope"> <template slot-scope="scope">
<el-input v-model="scope.row.n" class="inputWidth"></el-input> <el-input v-model="scope.row.n" class="inputWidth" @input="onClickInputKeyBoard2('deliveryTableData', scope.$index, 'n')"></el-input>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column <el-table-column
...@@ -95,16 +106,16 @@ ...@@ -95,16 +106,16 @@
width="150" width="150"
> >
<template slot-scope="scope"> <template slot-scope="scope">
<el-input v-model="scope.row.np" class="inputWidth"></el-input> <el-input v-model="scope.row.np" class="inputWidth" @input="onClickInputKeyBoard('deliveryTableData', scope.$index, 'np')"></el-input>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column <el-table-column
label="操作" label="操作"
width="120" width="120"
> >
<template slot-scope="scope"> <template slot-scope="scope" v-if="scope.row.a[0] != 0">
<el-button type="text" size="small">删除</el-button> <el-button type="text" size="small" @click="delDelivery('1', scope.$index)">删除</el-button>
<el-button type="text" size="small">修改地区</el-button> <el-button type="text" size="small" @click="editAddress(scope.row, scope.$index)">修改地区</el-button>
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
...@@ -116,7 +127,7 @@ ...@@ -116,7 +127,7 @@
<div style="display: flex; justify-content: space-between; margin-bottom: 5px;"> <div style="display: flex; justify-content: space-between; margin-bottom: 5px;">
<span style="font-size: 12px; color: #85878A;">收货地址在限制下单区域内的用户将无法完成下单</span> <span style="font-size: 12px; color: #85878A;">收货地址在限制下单区域内的用户将无法完成下单</span>
<div> <div>
<el-button type="primary" plain size="mini">添加地区</el-button> <el-button type="primary" plain size="mini" @click="dialogAddress = true">添加地区</el-button>
</div> </div>
</div> </div>
<div style="background: #F9F9FA; padding: 20px;"> <div style="background: #F9F9FA; padding: 20px;">
...@@ -166,10 +177,25 @@ ...@@ -166,10 +177,25 @@
</el-form-item> </el-form-item>
</el-form> </el-form>
<div style="text-align: center;"> <div style="text-align: center;">
<el-button size="mini">取消</el-button> <el-button size="mini" @click="closeDialog">取消</el-button>
<el-button type="primary" size="mini">提交</el-button> <el-button type="primary" size="mini">提交</el-button>
</div> </div>
</el-card> </el-card>
<el-dialog
title="选择地区"
:visible.sync="dialogAddress"
v-if="dialogAddress"
width="40%"
:close-on-click-modal="false"
:append-to-body="true">
<div style="height: 500px;">
<el-cascader-panel v-model="selectAddress" :options="options" :props="props" style="height: 100%;"></el-cascader-panel>
</div>
<span slot="footer" class="dialog-footer">
<el-button @click="dialogAddress = false" size="mini">取消</el-button>
<el-button type="primary" @click="saveAddress" size="mini">提交</el-button>
</span>
</el-dialog>
</div> </div>
</template> </template>
...@@ -181,7 +207,7 @@ ...@@ -181,7 +207,7 @@
sort: 0, sort: 0,
name: '', name: '',
is_default: 0, is_default: 0,
charge_type: 0, charge_type: 1,
publish: 0 publish: 0
}, },
// 表单校验 // 表单校验
...@@ -193,28 +219,128 @@ ...@@ -193,28 +219,128 @@
{required: true, message: "模板名称不能为空", trigger: "blur"} {required: true, message: "模板名称不能为空", trigger: "blur"}
], ],
}, },
deliveryTableData: [{ deliveryTableData: [
date: '2016-05-03', {
name: '王小虎', a: [0],
address: '上海市普陀区金沙江路 1518 弄' f: '',
}], fp: '',
n: '',
np: ''
}
],
noDeliveryTableData: [], noDeliveryTableData: [],
multipleSelection: [] multipleSelection: [],
dialogAddress: false,
props: { multiple: true },
options: [{
value: 1,
label: '东南',
children: [{
value: 2,
label: '上海',
children: [
{ value: 3, label: '普陀' },
{ value: 4, label: '黄埔' },
{ value: 5, label: '徐汇' }
]
}, {
value: 7,
label: '江苏',
children: [
{ value: 8, label: '南京' },
{ value: 9, label: '苏州' },
{ value: 10, label: '无锡' }
]
}, {
value: 12,
label: '浙江',
children: [
{ value: 13, label: '杭州' },
{ value: 14, label: '宁波' },
{ value: 15, label: '嘉兴' }
]
}]
}, {
value: 17,
label: '西北',
children: [{
value: 18,
label: '陕西',
children: [
{ value: 19, label: '西安' },
{ value: 20, label: '延安' }
]
}, {
value: 21,
label: '新疆维吾尔族自治区',
children: [
{ value: 22, label: '乌鲁木齐' },
{ value: 23, label: '克拉玛依' }
]
}]
},],
rowItem: null,
selectAddress: []
} }
}, },
methods: { methods: {
onClickInputKeyBoard(str, index, from) {
this[str][index][from] = this[str][index][from].toString().match(/^\d*(\.?\d{0,2})/g)[0]
},
onClickInputKeyBoard2(str, index, from) {
this[str][index][from] = this[str][index][from].toString().match(/^\d*/g)[0]
},
closeDialog() { closeDialog() {
this.$emit('closeDialog', false) this.$emit('closeIndexbtn', false)
}, },
// 多选数据 // 多选数据
handleSelectionChange(val) { handleSelectionChange(val) {
this.multipleSelection = val; this.multipleSelection = val;
console.log(this.multipleSelection)
},
// 添加配送地区
addDelivery() {
this.deliveryTableData.push(
{
a: [],
f: '',
fp: '',
n: '',
np: '',
}
)
},
// 删除配送地区
delDelivery(type, index) {
if (type == 1) {
this.deliveryTableData.splice(index, 1);
} else {
}
},
// 修改地区
editAddress(row, index) {
this.selectAddress = row.a
this.rowItem = row
this.dialogAddress = true
},
// 选择的地区赋值
saveAddress() {
this.rowItem.a = this.selectAddress
this.dialogAddress = false
} }
} }
} }
</script> </script>
<style scoped> <style scoped>
::v-deep .el-dialog__header {
background: #F5F7FA;
padding: 10px 20px !important;
border-bottom: 1px solid #DCDEE1;
margin-bottom: 0;
font-size: 16px;
}
.tipTitle { .tipTitle {
font-size: 16px; font-size: 16px;
margin-top: 10px; margin-top: 10px;
...@@ -229,4 +355,7 @@ ...@@ -229,4 +355,7 @@
.inputWidth ::v-deep .el-input__inner { .inputWidth ::v-deep .el-input__inner {
width: 100px; width: 100px;
} }
::v-deep .el-cascader-menu__wrap {
height: 100%;
}
</style> </style>
\ No newline at end of file
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论