7 changed files with 516 additions and 234 deletions
@ -1,70 +1,50 @@
|
||||
export const columnList = [ |
||||
{ |
||||
prop: 'checkbox', |
||||
label: '复选框', |
||||
type: 0, |
||||
width: 35, |
||||
fixed: true, |
||||
}, |
||||
{ |
||||
prop: 'xh', |
||||
label: '序号', |
||||
type: 12, |
||||
values: '', |
||||
width: 35, |
||||
fixed: true, |
||||
}, |
||||
{ |
||||
prop: 'a1', |
||||
label: '成本结算品类', |
||||
type: 2, |
||||
values: '', |
||||
width: '150', |
||||
checkarr: [], |
||||
fixed: false, |
||||
sortable: true, |
||||
head: false, |
||||
}, |
||||
{ |
||||
prop: 'a2', |
||||
label: '维护状态 ', |
||||
type: 3, |
||||
values: '', |
||||
width: '150', |
||||
checkarr: [ |
||||
{ |
||||
label: '已维护', |
||||
value: '已维护', |
||||
}, |
||||
{ |
||||
label: '未维护', |
||||
value: '未维护', |
||||
}, |
||||
], |
||||
fixed: false, |
||||
sortable: true, |
||||
head: false, |
||||
}, |
||||
{ |
||||
prop: 'a3', |
||||
label: '计价单位', |
||||
type: 1, |
||||
values: '', |
||||
width: '150', |
||||
checkarr: [], |
||||
fixed: false, |
||||
sortable: true, |
||||
head: false, |
||||
}, |
||||
{ |
||||
prop: 'createUserName', |
||||
label: '操作', |
||||
type: 6, |
||||
values: '', |
||||
width: '80', |
||||
checkarr: [], |
||||
fixed: 'right', |
||||
sortable: false, |
||||
}, |
||||
]; |
||||
|
||||
{ |
||||
prop: 'checkbox', |
||||
label: '复选框', |
||||
type: 0, |
||||
width: 35, |
||||
fixed: true, |
||||
}, |
||||
{ |
||||
prop: 'xh', |
||||
label: '序号', |
||||
type: 12, |
||||
values: '', |
||||
width: 35, |
||||
fixed: true, |
||||
}, |
||||
{ |
||||
prop: 'a1', |
||||
label: '成本结算品类', |
||||
type: 2, |
||||
values: '', |
||||
width: '150', |
||||
checkarr: [], |
||||
fixed: false, |
||||
sortable: true, |
||||
head: false, |
||||
}, |
||||
|
||||
{ |
||||
prop: 'a3', |
||||
label: '计价单位', |
||||
type: 1, |
||||
values: '', |
||||
width: '150', |
||||
checkarr: [], |
||||
fixed: false, |
||||
sortable: true, |
||||
head: false, |
||||
}, |
||||
{ |
||||
prop: 'createUserName', |
||||
label: '操作', |
||||
type: 6, |
||||
values: '', |
||||
width: '80', |
||||
checkarr: [], |
||||
fixed: 'right', |
||||
sortable: false, |
||||
}, |
||||
]; |
||||
|
@ -0,0 +1,55 @@
|
||||
<template> |
||||
<div class="content"> |
||||
<el-form :model="form" label-width="auto"> |
||||
<el-form-item label="仓库"> |
||||
<el-select v-model="form.value" placeholder="请选择"> |
||||
<el-option |
||||
v-for="item in options" |
||||
:key="item.value" |
||||
:label="item.label" |
||||
:value="item.value" |
||||
/> |
||||
</el-select> |
||||
</el-form-item> |
||||
|
||||
<el-form-item label="模板名称"> |
||||
<el-input v-model="form.name" placeholder="请输入模板名称"/> |
||||
</el-form-item> |
||||
</el-form> |
||||
</div> |
||||
</template> |
||||
|
||||
<script setup> |
||||
import { ref } from 'vue'; |
||||
const form = ref({}); |
||||
const options = ref([ |
||||
{ |
||||
value: '按件', |
||||
label: '按件', |
||||
}, |
||||
{ |
||||
value: '按方', |
||||
label: '按方', |
||||
}, |
||||
{ |
||||
value: '按重量', |
||||
label: '按重量', |
||||
}, |
||||
{ |
||||
value: '按吨', |
||||
label: '按吨', |
||||
}, |
||||
]); |
||||
</script> |
||||
|
||||
<style scoped lang="scss"> |
||||
.content { |
||||
width: 20%; |
||||
margin: 0 auto; |
||||
.el-form { |
||||
:deep(.el-select) { |
||||
width: 100%; |
||||
} |
||||
} |
||||
} |
||||
</style> |
@ -0,0 +1,314 @@
|
||||
<template> |
||||
<div style="padding: 0 10px"> |
||||
<!-- 配置计价规则 --> |
||||
<el-tabs v-model="activeName" class="demo-tabs" @tab-click="handleClick"> |
||||
<el-tab-pane label="商配" name="0"></el-tab-pane> |
||||
<el-tab-pane label="市配" name="1"></el-tab-pane> |
||||
</el-tabs> |
||||
<el-form :model="formLoad" class="el_pricing"> |
||||
<el-form-item label="是否有附加费"> |
||||
<el-radio-group v-model="formLoad.a" class="ml-4"> |
||||
<el-radio value="1" size="large">是</el-radio> |
||||
<el-radio value="0" size="large">否</el-radio> |
||||
</el-radio-group> |
||||
</el-form-item> |
||||
<el-form-item label="是否公里数计费"> |
||||
<el-radio-group v-model="formLoad.a" class="ml-4"> |
||||
<el-radio value="1" size="large">是</el-radio> |
||||
<el-radio value="0" size="large">否</el-radio> |
||||
</el-radio-group> |
||||
</el-form-item> |
||||
<el-form-item label="公里计算规则"> |
||||
<el-radio-group v-model="formLoad.a" class="ml-4"> |
||||
<el-radio value="1" size="large">总公里</el-radio> |
||||
<el-radio value="0" size="large">点位公里</el-radio> |
||||
<el-radio value="0" size="large">最远点位公里数</el-radio> |
||||
</el-radio-group> |
||||
</el-form-item> |
||||
<el-form-item label="是否计算返程"> |
||||
<el-radio-group v-model="formLoad.a" class="ml-4"> |
||||
<el-radio value="1" size="large">是</el-radio> |
||||
<el-radio value="0" size="large">否</el-radio> |
||||
</el-radio-group> |
||||
</el-form-item> |
||||
<el-form-item label="是否补贴起步公里数计费"> |
||||
<el-radio-group v-model="formLoad.a" class="ml-4"> |
||||
<el-radio value="1" size="large">是</el-radio> |
||||
<el-radio value="0" size="large">否</el-radio> |
||||
</el-radio-group> |
||||
</el-form-item> |
||||
<el-form-item label="补贴公里计算规则"> |
||||
<el-radio-group v-model="formLoad.a" class="ml-4"> |
||||
<el-radio value="1" size="large">总公里数</el-radio> |
||||
<el-radio value="0" size="large">点位公里数</el-radio> |
||||
<el-radio value="0" size="large">最远点位公里数</el-radio> |
||||
</el-radio-group> |
||||
</el-form-item> |
||||
<el-form-item label="是否计算返程"> |
||||
<el-radio-group v-model="formLoad.a" class="ml-4"> |
||||
<el-radio value="1" size="large">是</el-radio> |
||||
<el-radio value="0" size="large">否</el-radio> |
||||
</el-radio-group> |
||||
</el-form-item> |
||||
<el-form-item label="是否超区公里计费"> |
||||
<el-radio-group v-model="formLoad.a" class="ml-4"> |
||||
<el-radio value="1" size="large">是</el-radio> |
||||
<el-radio value="0" size="large">否</el-radio> |
||||
</el-radio-group> |
||||
</el-form-item> |
||||
<el-form-item label="超区公里数计算规则"> |
||||
<el-radio-group v-model="formLoad.a" class="ml-4"> |
||||
<el-radio value="1" size="large">总公里数</el-radio> |
||||
<el-radio value="0" size="large">点位公里数</el-radio> |
||||
<el-radio value="0" size="large">最远点位公里数</el-radio> |
||||
</el-radio-group> |
||||
</el-form-item> |
||||
<el-form-item label="超区点位计费模式"> |
||||
<el-radio-group v-model="formLoad.a" class="ml-4"> |
||||
<el-radio value="1" size="large">统一计费</el-radio> |
||||
<el-radio value="0" size="large">区域计费</el-radio> |
||||
</el-radio-group> |
||||
</el-form-item> |
||||
<el-form-item label="是否计算返程"> |
||||
<el-radio-group v-model="formLoad.a" class="ml-4"> |
||||
<el-radio value="1" size="large">是</el-radio> |
||||
<el-radio value="0" size="large">否</el-radio> |
||||
</el-radio-group> |
||||
</el-form-item> |
||||
<el-form-item label="是否点位补贴计费"> |
||||
<el-radio-group v-model="formLoad.a" class="ml-4"> |
||||
<el-radio value="1" size="large">是</el-radio> |
||||
<el-radio value="0" size="large">否</el-radio> |
||||
</el-radio-group> |
||||
</el-form-item> |
||||
<el-form-item label="是否保底费"> |
||||
<el-radio-group v-model="formLoad.a" class="ml-4"> |
||||
<el-radio value="1" size="large">是</el-radio> |
||||
<el-radio value="0" size="large">否</el-radio> |
||||
</el-radio-group> |
||||
</el-form-item> |
||||
<el-form-item label="是否补贴油费"> |
||||
<el-radio-group v-model="formLoad.a" class="ml-4"> |
||||
<el-radio value="1" size="large">是</el-radio> |
||||
<el-radio value="0" size="large">否</el-radio> |
||||
</el-radio-group> |
||||
</el-form-item> |
||||
<el-form-item label="补贴油费计算规则"> |
||||
<el-radio-group v-model="formLoad.a" class="ml-4"> |
||||
<el-radio value="1" size="large">总公里数</el-radio> |
||||
<el-radio value="0" size="large">点位公里数</el-radio> |
||||
<el-radio value="0" size="large">最远点位公里数</el-radio> |
||||
</el-radio-group> |
||||
</el-form-item> |
||||
<el-form-item label="是否计算返程"> |
||||
<el-radio-group v-model="formLoad.a" class="ml-4"> |
||||
<el-radio value="1" size="large">是</el-radio> |
||||
<el-radio value="0" size="large">否</el-radio> |
||||
</el-radio-group> |
||||
</el-form-item> |
||||
<el-form-item label="是否附加费"> |
||||
<el-radio-group v-model="formLoad.a" class="ml-4"> |
||||
<el-radio value="1" size="large">是</el-radio> |
||||
<el-radio value="0" size="large">否</el-radio> |
||||
</el-radio-group> |
||||
</el-form-item> |
||||
</el-form> |
||||
</div> |
||||
</template> |
||||
|
||||
<script setup> |
||||
import { ref } from 'vue'; |
||||
const formLoad = ref({}); |
||||
const activeName=ref('0') |
||||
const handleClick=()=>{ |
||||
console.log(activeName.value) |
||||
|
||||
} |
||||
</script> |
||||
|
||||
<style scoped lang="scss"> |
||||
.form { |
||||
width: 30%; |
||||
.top { |
||||
margin-bottom: 10px; |
||||
display: flex; |
||||
align-items: center; |
||||
} |
||||
.el_add { |
||||
display: flex; |
||||
align-items: center; |
||||
color: #656565; |
||||
cursor: pointer; |
||||
} |
||||
.title { |
||||
color: #6f6f6f; |
||||
margin-right: 20px; |
||||
} |
||||
} |
||||
.eml_btn { |
||||
display: flex; |
||||
justify-content: space-around; |
||||
align-items: center; |
||||
.el_btn_a { |
||||
display: flex; |
||||
align-items: center; |
||||
margin: 0 3px; |
||||
cursor: pointer; |
||||
} |
||||
} |
||||
.el_pricing { |
||||
display: flex; |
||||
flex-wrap: wrap; |
||||
:deep(.el-form-item) { |
||||
display: flex; |
||||
flex-direction: column; |
||||
width: 30%; |
||||
.el-form-item__content { |
||||
background-color: #f6f6f6; |
||||
padding: 0 10px; |
||||
.el-radio-group { |
||||
flex-wrap: nowrap; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
.el_content { |
||||
display: flex; |
||||
flex-wrap: wrap; |
||||
} |
||||
.el_category { |
||||
width: 43%; |
||||
margin-right: 6%; |
||||
margin-bottom: 2%; |
||||
.title { |
||||
padding: 0 10px; |
||||
position: relative; |
||||
margin-bottom: 10px; |
||||
display: block; |
||||
} |
||||
.title::after { |
||||
content: ''; |
||||
width: 4px; |
||||
height: 100%; |
||||
background-color: #172e60; |
||||
position: absolute; |
||||
left: 0; |
||||
left: 0; |
||||
} |
||||
} |
||||
.asurcharge { |
||||
.el_asurcharge { |
||||
display: flex; |
||||
flex-direction: column; |
||||
.title { |
||||
padding: 0 10px; |
||||
|
||||
position: relative; |
||||
} |
||||
.title::after { |
||||
content: ''; |
||||
width: 4px; |
||||
height: 100%; |
||||
background-color: #172e60; |
||||
position: absolute; |
||||
left: 0; |
||||
left: 0; |
||||
} |
||||
.el-radio-group { |
||||
margin-top: 10px; |
||||
width: 16%; |
||||
background-color: #f6f6f6; |
||||
padding: 0 8px; |
||||
} |
||||
} |
||||
} |
||||
.asurcharge_box { |
||||
width: 100%; |
||||
} |
||||
.el_Kilometers { |
||||
display: flex; |
||||
justify-content: space-between; |
||||
.el_Kilometers_box { |
||||
display: flex; |
||||
width: 32%; |
||||
flex-direction: column; |
||||
margin-right: 10px; |
||||
.el-input-number { |
||||
width: 100%; |
||||
} |
||||
.title { |
||||
position: relative; |
||||
padding: 0 10px; |
||||
display: block; |
||||
margin-bottom: 10px; |
||||
} |
||||
.title::after { |
||||
content: ''; |
||||
position: absolute; |
||||
left: 0; |
||||
top: 0; |
||||
width: 4px; |
||||
height: 100%; |
||||
background-color: #172e60; |
||||
} |
||||
} |
||||
} |
||||
.el_Oversizedbilling { |
||||
.title { |
||||
position: relative; |
||||
padding: 0 10px; |
||||
display: block; |
||||
margin-top: 20px; |
||||
margin-bottom: 10px; |
||||
} |
||||
.title::after { |
||||
content: ''; |
||||
position: absolute; |
||||
left: 0; |
||||
top: 0; |
||||
width: 4px; |
||||
height: 100%; |
||||
background-color: #172e60; |
||||
} |
||||
.el_text_del { |
||||
color: #ff5722; |
||||
cursor: pointer; |
||||
} |
||||
.el_text_add { |
||||
margin-left: 10px; |
||||
color: #0045c4; |
||||
cursor: pointer; |
||||
} |
||||
} |
||||
.el_Super { |
||||
display: flex; |
||||
justify-content: space-between; |
||||
.el_Super_box { |
||||
width: 18%; |
||||
display: flex; |
||||
flex-direction: column; |
||||
.el-input-number { |
||||
width: 100%; |
||||
} |
||||
.title { |
||||
position: relative; |
||||
padding: 0 10px; |
||||
display: block; |
||||
margin-top: 20px; |
||||
margin-bottom: 10px; |
||||
} |
||||
.title::after { |
||||
content: ''; |
||||
position: absolute; |
||||
left: 0; |
||||
top: 0; |
||||
width: 4px; |
||||
height: 100%; |
||||
background-color: #172e60; |
||||
} |
||||
} |
||||
} |
||||
.SuperAdd { |
||||
display: flex; |
||||
} |
||||
</style> |
Loading…
Reference in new issue