Skip to content

S
shop-new
提交 113449c9 authored 作者: 郑伟娜's avatar 郑伟娜
浏览文件
操作

地区选择逻辑处理

上级 0e103014
显示空白字符变更
内嵌 并排
正在显示 包含 152 行增加 和 23 行删除
src/views/system/freight/freight_list/templateFreight.vue
浏览文件 @ 113449c9
......@@ -28,8 +28,8 @@
</el-form-item>
<el-form-item label="计费方式">
<el-radio-group v-model="ruleForm.charge_type">
<el-radio :label="1">按重量</el-radio>
<el-radio :label="2">按数量</el-radio>
<el-radio :label="1">按数量</el-radio>
<el-radio :label="2">按重量</el-radio>
<el-radio :label="3">按体积</el-radio>
</el-radio-group>
</el-form-item>
......@@ -38,8 +38,8 @@
<div style="display: flex; justify-content: space-between; margin-bottom: 5px;">
<span style="font-size: 12px; color: #85878A;">除指定地区外，其余地区运费采用：“全国默认运费”</span>
<div>
<el-button plain size="mini">删除</el-button>
<el-button type="primary" plain size="mini">添加地区</el-button>
<el-button plain size="mini" @click="delDelivery('2')">删除</el-button>
<el-button type="primary" plain size="mini" @click="addDelivery">添加地区</el-button>
</div>
</div>
<div style="background: #F9F9FA; padding: 20px;">
......@@ -58,8 +58,9 @@
label="配送区域"
>
<template slot-scope="scope">
<span>【默认】</span>
<span>【指定】</span>
<span v-if="scope.row.a.length && scope.row.a[0] == 0">【默认】全国</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>
</el-table-column>
<el-table-column
......@@ -67,8 +68,13 @@
label="首件（个）"
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">
<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>
</el-table-column>
<el-table-column
......@@ -77,7 +83,7 @@
width="150"
>
<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>
</el-table-column>
<el-table-column
......@@ -85,8 +91,13 @@
label="续件（个）"
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">
<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>
</el-table-column>
<el-table-column
......@@ -95,16 +106,16 @@
width="150"
>
<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>
</el-table-column>
<el-table-column
label="操作"
width="120"
>
<template slot-scope="scope">
<el-button type="text" size="small">删除</el-button>
<el-button type="text" size="small">修改地区</el-button>
<template slot-scope="scope" v-if="scope.row.a[0] != 0">
<el-button type="text" size="small" @click="delDelivery('1', scope.$index)">删除</el-button>
<el-button type="text" size="small" @click="editAddress(scope.row, scope.$index)">修改地区</el-button>
</template>
</el-table-column>
</el-table>
......@@ -116,7 +127,7 @@
<div style="display: flex; justify-content: space-between; margin-bottom: 5px;">
<span style="font-size: 12px; color: #85878A;">收货地址在限制下单区域内的用户将无法完成下单</span>
<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 style="background: #F9F9FA; padding: 20px;">
......@@ -166,10 +177,25 @@
</el-form-item>
</el-form>
<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>
</div>
</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>
</template>
......@@ -181,7 +207,7 @@
sort: 0,
name: '',
is_default: 0,
charge_type: 0,
charge_type: 1,
publish: 0
},
// 表单校验
......@@ -193,28 +219,128 @@
{required: true, message: "模板名称不能为空", trigger: "blur"}
],
},
deliveryTableData: [{
date: '2016-05-03',
name: '王小虎',
address: '上海市普陀区金沙江路 1518 弄'
}],
deliveryTableData: [
{
a: [0],
f: '',
fp: '',
n: '',
np: ''
}
],
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: {
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() {
this.$emit('closeDialog', false)
this.$emit('closeIndexbtn', false)
},
// 多选数据
handleSelectionChange(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>
<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 {
font-size: 16px;
margin-top: 10px;
......@@ -229,4 +355,7 @@
.inputWidth ::v-deep .el-input__inner {
width: 100px;
}
::v-deep .el-cascader-menu__wrap {
height: 100%;
}
</style>
\ No newline at end of file
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论