|
@@ -25,57 +25,36 @@
|
|
|
ref="singleTable"
|
|
|
:data="tableData"
|
|
|
size="mini"
|
|
|
- :header-cell-style="{color:'#000'}"
|
|
|
- highlight-current-row
|
|
|
+ :header-cell-style="{color:'#000',background:'#fafafa'}"
|
|
|
style="width: 100%">
|
|
|
<el-table-column
|
|
|
property="date"
|
|
|
align="center"
|
|
|
- width="40">
|
|
|
+ width="40"
|
|
|
+ :render-header="renderHeader">
|
|
|
<template slot-scope="scope">
|
|
|
- <el-tooltip class="item" effect="dark" content="增加途径地址" placement="top">
|
|
|
- <el-button type="primary" icon="el-icon-plus" size="mini" circle
|
|
|
- v-if="(scope.$index+1) === tableData.length" @click="addAddress"></el-button>
|
|
|
+ <el-tooltip class="item" effect="dark" content="删除" placement="right">
|
|
|
+ <el-button type="danger" icon="el-icon-delete" size="mini" circle @click="deleteAddress(scope)"></el-button>
|
|
|
</el-tooltip>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
<el-table-column
|
|
|
- property="date"
|
|
|
- label="省份"
|
|
|
+ type="index"
|
|
|
+ label="序号"
|
|
|
align="center"
|
|
|
- width="120">
|
|
|
- <template slot-scope="scope">
|
|
|
- <el-select v-model="scope.row.date" filterable size="small" placeholder="请选择">
|
|
|
- <el-option label="北京" value="1"></el-option>
|
|
|
- <el-option label="山东" value="2"></el-option>
|
|
|
- <el-option label="天津" value="3"></el-option>
|
|
|
- </el-select>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column
|
|
|
- property="name"
|
|
|
- label="城市"
|
|
|
- align="center"
|
|
|
- width="120">
|
|
|
- <template slot-scope="scope">
|
|
|
- <el-select v-model="scope.row.name" filterable size="small" placeholder="请选择">
|
|
|
- <el-option label="测试城市0" value="1"></el-option>
|
|
|
- <el-option label="测试城市1" value="2"></el-option>
|
|
|
- <el-option label="测试城市2" value="3"></el-option>
|
|
|
- </el-select>
|
|
|
- </template>
|
|
|
+ width="60">
|
|
|
</el-table-column>
|
|
|
<el-table-column
|
|
|
- property="address"
|
|
|
+ property="province"
|
|
|
+ label="省市区"
|
|
|
align="center"
|
|
|
- width="160"
|
|
|
- label="区/县">
|
|
|
+ width="280">
|
|
|
<template slot-scope="scope">
|
|
|
- <el-select v-model="scope.row.name" filterable size="small" placeholder="请选择">
|
|
|
- <el-option label="测试城市0" value="1"></el-option>
|
|
|
- <el-option label="测试城市1" value="2"></el-option>
|
|
|
- <el-option label="测试城市2" value="3"></el-option>
|
|
|
- </el-select>
|
|
|
+ <el-cascader
|
|
|
+ size="small"
|
|
|
+ style="width: 100%;"
|
|
|
+ v-model="scope.row.region"
|
|
|
+ :props="treeOption"></el-cascader>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
<el-table-column
|
|
@@ -94,78 +73,120 @@
|
|
|
</basic-container>
|
|
|
<containerTitle title="货物信息"></containerTitle>
|
|
|
<basic-container>
|
|
|
- <avue-form :option="goodsOptionForm" v-model="goodsForm"></avue-form>
|
|
|
- <avue-crud :data="goodsList" :option="goodsOptionCrud"></avue-crud>
|
|
|
+ <avue-form :option="goodsOptionForm" v-model="goodsForm">
|
|
|
+ <template slot-scope="scope" slot="corpId">
|
|
|
+ <crop-select
|
|
|
+ v-model="goodsForm.corpId"
|
|
|
+ ></crop-select>
|
|
|
+ </template>
|
|
|
+ </avue-form>
|
|
|
+ </basic-container>
|
|
|
+ <containerTitle title="收款信息"></containerTitle>
|
|
|
+ <basic-container>
|
|
|
+ <avue-crud :data="collectionList" :option="collectionOption"></avue-crud>
|
|
|
+ </basic-container>
|
|
|
+ <containerTitle title="付款信息"></containerTitle>
|
|
|
+ <basic-container>
|
|
|
+ <avue-crud :data="paymentList" :option="paymentOption"></avue-crud>
|
|
|
</basic-container>
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
+import {getLazyTree} from "@/api/base/region";
|
|
|
+let id = 0;
|
|
|
export default {
|
|
|
data() {
|
|
|
return {
|
|
|
- form: {},
|
|
|
+ provinceList:[],//省
|
|
|
goodsForm: {},
|
|
|
- tableData: [{
|
|
|
- date: '2016-05-02',
|
|
|
- name: '王小虎',
|
|
|
- address: '上海市普陀区金沙江路 1518 弄'
|
|
|
- }, {
|
|
|
- date: '2016-05-02',
|
|
|
- name: '王小虎',
|
|
|
- address: '上海市普陀区金沙江路 1518 弄'
|
|
|
- }],
|
|
|
+ treeOption: {
|
|
|
+ label: 'title',
|
|
|
+ value: 'id',
|
|
|
+ lazy: true,
|
|
|
+ lazyLoad (node, resolve) {
|
|
|
+ const parentId = node.level === 0 ? '00' : node.data.id;
|
|
|
+ getLazyTree(parentId).then(res => {
|
|
|
+ console.log(res)
|
|
|
+ resolve(
|
|
|
+ res.data.data.map(item => {
|
|
|
+ return {
|
|
|
+ ...item,
|
|
|
+ leaf: !item.hasChildren
|
|
|
+ };
|
|
|
+ })
|
|
|
+ );
|
|
|
+ });
|
|
|
+ }
|
|
|
+ },
|
|
|
+ tableData: [],
|
|
|
entrustList: [],
|
|
|
goodsOptionForm: {
|
|
|
menuBtn:false,
|
|
|
- column: [
|
|
|
- {
|
|
|
+ column: [{
|
|
|
+ label: '客户名称',
|
|
|
+ formslot:true,
|
|
|
+ prop: 'corpId'
|
|
|
+ },{
|
|
|
+ label: '订单号',
|
|
|
+ prop: 'id'
|
|
|
+ },{
|
|
|
label: '提单号',
|
|
|
- prop: 'name'
|
|
|
+ prop: 'billNo'
|
|
|
}, {
|
|
|
label: '场站',
|
|
|
- prop: 'sex'
|
|
|
+ prop: 'station'
|
|
|
}, {
|
|
|
label: '到厂时间',
|
|
|
- prop: 'sex'
|
|
|
+ prop: 'arrivalTime'
|
|
|
}, {
|
|
|
label: '工厂名称',
|
|
|
- prop: 'sex'
|
|
|
+ prop: 'factory'
|
|
|
}, {
|
|
|
label: '货物名称',
|
|
|
- prop: 'sex'
|
|
|
+ prop: 'goods'
|
|
|
}, {
|
|
|
label: '备注',
|
|
|
- prop: 'sex'
|
|
|
+ prop: 'remarks'
|
|
|
}
|
|
|
]
|
|
|
},
|
|
|
- goodsList:[],
|
|
|
- goodsOptionCrud: {
|
|
|
+ entrustOptionTwo: {
|
|
|
+ align: 'center',
|
|
|
+ menuAlign: 'center',
|
|
|
index:true,
|
|
|
cellBtn:true,
|
|
|
addBtn:false,
|
|
|
addRowBtn:true,
|
|
|
- column: [{
|
|
|
+ column: [ {
|
|
|
label: '尺寸箱型',
|
|
|
cell: true,
|
|
|
- prop: 'sex'
|
|
|
+ prop: 'ctnType'
|
|
|
}, {
|
|
|
label: '箱量',
|
|
|
cell: true,
|
|
|
- prop: 'sex'
|
|
|
+ prop: 'ctnQuantity'
|
|
|
+ }, {
|
|
|
+ label: '总重量(吨)',
|
|
|
+ cell: true,
|
|
|
+ prop: 'landWeight'
|
|
|
}, {
|
|
|
- label: '是否派箱',
|
|
|
+ label: '陆运费(C)',
|
|
|
cell: true,
|
|
|
- prop: 'sex'
|
|
|
+ prop: 'landAmountC'
|
|
|
}, {
|
|
|
- label: '车队是否受理',
|
|
|
+ label: '陆运费(D)',
|
|
|
cell: true,
|
|
|
- prop: 'sex'
|
|
|
+ prop: 'landAmountD'
|
|
|
+ }, {
|
|
|
+ label: '备注',
|
|
|
+ cell: true,
|
|
|
+ prop: 'remarks'
|
|
|
}
|
|
|
]
|
|
|
},
|
|
|
- entrustOptionTwo: {
|
|
|
+ collectionList:[],
|
|
|
+ collectionOption: {
|
|
|
align: 'center',
|
|
|
menuAlign: 'center',
|
|
|
index:true,
|
|
@@ -173,37 +194,116 @@ export default {
|
|
|
addBtn:false,
|
|
|
addRowBtn:true,
|
|
|
column: [ {
|
|
|
- label: '尺寸箱型',
|
|
|
- cell: true,
|
|
|
- prop: 'sex'
|
|
|
- }, {
|
|
|
- label: '箱量',
|
|
|
- cell: true,
|
|
|
- prop: 'sex'
|
|
|
- }, {
|
|
|
- label: '总重量(吨)',
|
|
|
- cell: true,
|
|
|
- prop: 'sex'
|
|
|
- }, {
|
|
|
- label: '陆运费',
|
|
|
- cell: true,
|
|
|
- prop: 'sex'
|
|
|
- }, {
|
|
|
- label: '备注',
|
|
|
- cell: true,
|
|
|
- prop: 'sex'
|
|
|
- }
|
|
|
+ label: '客户名称',
|
|
|
+ cell: true,
|
|
|
+ prop: 'sex'
|
|
|
+ }, {
|
|
|
+ label: '费用名称',
|
|
|
+ cell: true,
|
|
|
+ prop: 'sex'
|
|
|
+ }, {
|
|
|
+ label: '计价单位',
|
|
|
+ cell: true,
|
|
|
+ prop: 'sex'
|
|
|
+ }, {
|
|
|
+ label: '数量',
|
|
|
+ cell: true,
|
|
|
+ prop: 'sex'
|
|
|
+ }, {
|
|
|
+ label: '单价',
|
|
|
+ cell: true,
|
|
|
+ prop: 'sex'
|
|
|
+ }, {
|
|
|
+ label: '金额',
|
|
|
+ cell: true,
|
|
|
+ prop: 'sex'
|
|
|
+ }, {
|
|
|
+ label: '税率(默认6)',
|
|
|
+ cell: true,
|
|
|
+ prop: 'sex'
|
|
|
+ }, {
|
|
|
+ label: '币别(默认RMB)',
|
|
|
+ cell: true,
|
|
|
+ prop: 'sex'
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ },
|
|
|
+ paymentList:[],
|
|
|
+ paymentOption: {
|
|
|
+ align: 'center',
|
|
|
+ menuAlign: 'center',
|
|
|
+ index:true,
|
|
|
+ cellBtn:true,
|
|
|
+ addBtn:false,
|
|
|
+ addRowBtn:true,
|
|
|
+ column: [ {
|
|
|
+ label: '客户名称',
|
|
|
+ cell: true,
|
|
|
+ prop: 'sex'
|
|
|
+ }, {
|
|
|
+ label: '费用名称',
|
|
|
+ cell: true,
|
|
|
+ prop: 'sex'
|
|
|
+ }, {
|
|
|
+ label: '计价单位',
|
|
|
+ cell: true,
|
|
|
+ prop: 'sex'
|
|
|
+ }, {
|
|
|
+ label: '数量',
|
|
|
+ cell: true,
|
|
|
+ prop: 'sex'
|
|
|
+ }, {
|
|
|
+ label: '单价',
|
|
|
+ cell: true,
|
|
|
+ prop: 'sex'
|
|
|
+ }, {
|
|
|
+ label: '金额',
|
|
|
+ cell: true,
|
|
|
+ prop: 'sex'
|
|
|
+ }, {
|
|
|
+ label: '税率(默认6)',
|
|
|
+ cell: true,
|
|
|
+ prop: 'sex'
|
|
|
+ }, {
|
|
|
+ label: '币别(默认RMB)',
|
|
|
+ cell: true,
|
|
|
+ prop: 'sex'
|
|
|
+ }
|
|
|
]
|
|
|
}
|
|
|
};
|
|
|
},
|
|
|
+ created() {
|
|
|
+ this.queryAddress('00')
|
|
|
+ },
|
|
|
methods: {
|
|
|
+ //查询省市区
|
|
|
+ queryAddress(value,type){
|
|
|
+ getLazyTree().then(res=>{
|
|
|
+ this.provinceList = res.data.data
|
|
|
+ })
|
|
|
+ },
|
|
|
//地址新增
|
|
|
addAddress(){
|
|
|
this.tableData.push({})
|
|
|
},
|
|
|
+ //返回主列表
|
|
|
backToList() {
|
|
|
this.$emit('backToList')
|
|
|
+ },
|
|
|
+ //删除途径地址
|
|
|
+ deleteAddress(scope){
|
|
|
+ this.tableData.splice(scope.$index, 1);
|
|
|
+ },
|
|
|
+ //自定义表头
|
|
|
+ renderHeader(h) {
|
|
|
+ return(
|
|
|
+ <div>
|
|
|
+ <el-tooltip className="item" effect="dark" content="增加途径地址" placement="top">
|
|
|
+ <el-button type="primary" icon="el-icon-plus" size="mini" circle onClick={()=>this.addAddress()} style="margin-right: 1.25rem;"></el-button>
|
|
|
+ </el-tooltip>
|
|
|
+ </div>
|
|
|
+ )
|
|
|
}
|
|
|
}
|
|
|
}
|