临时提交
parent
4e25be0d50
commit
e75d0e1fb1
@ -0,0 +1,285 @@
|
|||||||
|
<template>
|
||||||
|
<a-collapse class="collapse-box" :bordered="false" expandIconPosition="right">
|
||||||
|
<a-collapse-panel>
|
||||||
|
<template slot="header">
|
||||||
|
<div class="base-tit"><i class="iconfont icon-a-fahuodaifahuo"></i>签单信息</div>
|
||||||
|
</template>
|
||||||
|
<div class="container bill-info">
|
||||||
|
<a-form :form="form">
|
||||||
|
<a-row :gutter="10">
|
||||||
|
<a-col :xs="12" :sm="12" :md="12" :lg="8" :xl="6">
|
||||||
|
<a-form-item class="from-label" label="签单方式" :labelCol="labelCol" :wrapperCol="wrapperCol" has-feedback>
|
||||||
|
<auto-complete
|
||||||
|
v-decorator="['name', { rules: [{ required: true, message: '请输入签单方式！' }] }]"
|
||||||
|
:data-source="dataSource"
|
||||||
|
option-label-prop="title"
|
||||||
|
placeholder="请输入签单方式"
|
||||||
|
:filter-option="filterOption"
|
||||||
|
/>
|
||||||
|
</a-form-item>
|
||||||
|
</a-col>
|
||||||
|
<a-col :xs="12" :sm="12" :md="12" :lg="8" :xl="6">
|
||||||
|
<a-form-item class="from-label" label="签单日期" :labelCol="labelCol" :wrapperCol="wrapperCol" has-feedback>
|
||||||
|
<a-date-picker
|
||||||
|
format="YYYY-MM-DD HH:mm:ss"
|
||||||
|
placeholder="签单日期"
|
||||||
|
v-decorator="['createdTime', { rules: [{ required: false }] }]"
|
||||||
|
/>
|
||||||
|
</a-form-item>
|
||||||
|
</a-col>
|
||||||
|
<a-col :xs="12" :sm="12" :md="12" :lg="8" :xl="6">
|
||||||
|
<a-form-item
|
||||||
|
class="from-label"
|
||||||
|
label="签单地点"
|
||||||
|
:labelCol="labelCol"
|
||||||
|
:wrapperCol="wrapperCol"
|
||||||
|
has-feedback
|
||||||
|
>
|
||||||
|
<auto-complete
|
||||||
|
v-decorator="['name', { rules: [{ required: true, message: '请输入签单地点！' }] }]"
|
||||||
|
:data-source="dataSource"
|
||||||
|
option-label-prop="title"
|
||||||
|
placeholder="请输入签单地点"
|
||||||
|
:filter-option="filterOption"
|
||||||
|
/>
|
||||||
|
</a-form-item>
|
||||||
|
</a-col>
|
||||||
|
<a-col :xs="12" :sm="12" :md="12" :lg="8" :xl="6">
|
||||||
|
<a-form-item class="from-label" label="签单代码" :labelCol="labelCol" :wrapperCol="wrapperCol" has-feedback>
|
||||||
|
<a-input
|
||||||
|
placeholder="请输入签单代码！"
|
||||||
|
v-decorator="['code', { rules: [{ required: true, message: '请输入签单代码！' }] }]"
|
||||||
|
/>
|
||||||
|
</a-form-item>
|
||||||
|
</a-col>
|
||||||
|
<a-col :xs="12" :sm="12" :md="12" :lg="8" :xl="6">
|
||||||
|
<a-form-item class="from-label" label="提单份数" :labelCol="labelCol" :wrapperCol="wrapperCol" has-feedback>
|
||||||
|
<a-select default-value="ONE" style="width: 120px" @change="handleChange">
|
||||||
|
<a-select-option value="ONE">
|
||||||
|
ONE
|
||||||
|
</a-select-option>
|
||||||
|
<a-select-option value="TWO">
|
||||||
|
TWO
|
||||||
|
</a-select-option>
|
||||||
|
<a-select-option value="THREE">
|
||||||
|
THREE
|
||||||
|
</a-select-option>
|
||||||
|
</a-select>
|
||||||
|
</a-form-item>
|
||||||
|
</a-col>
|
||||||
|
<a-col :xs="12" :sm="12" :md="12" :lg="8" :xl="6">
|
||||||
|
<a-form-item class="from-label" label="副本份数" :labelCol="labelCol" :wrapperCol="wrapperCol" has-feedback>
|
||||||
|
<a-select default-value="ONE" style="width: 120px" @change="handleChange">
|
||||||
|
<a-select-option value="ONE">
|
||||||
|
ONE
|
||||||
|
</a-select-option>
|
||||||
|
<a-select-option value="TWO">
|
||||||
|
TWO
|
||||||
|
</a-select-option>
|
||||||
|
<a-select-option value="THREE">
|
||||||
|
THREE
|
||||||
|
</a-select-option>
|
||||||
|
</a-select>
|
||||||
|
</a-form-item>
|
||||||
|
</a-col>
|
||||||
|
<a-col :xs="12" :sm="12" :md="12" :lg="8" :xl="6">
|
||||||
|
<a-form-item
|
||||||
|
class="from-label"
|
||||||
|
label="预付地点"
|
||||||
|
:labelCol="labelCol"
|
||||||
|
:wrapperCol="wrapperCol"
|
||||||
|
has-feedback
|
||||||
|
>
|
||||||
|
<auto-complete
|
||||||
|
v-decorator="['name', { rules: [{ required: true, message: '请输入预付地点！' }] }]"
|
||||||
|
:data-source="dataSource"
|
||||||
|
option-label-prop="title"
|
||||||
|
placeholder="请输入预付地点"
|
||||||
|
:filter-option="filterOption"
|
||||||
|
/>
|
||||||
|
</a-form-item>
|
||||||
|
</a-col>
|
||||||
|
<a-col :xs="12" :sm="12" :md="12" :lg="8" :xl="6">
|
||||||
|
<a-form-item
|
||||||
|
class="from-label"
|
||||||
|
label="到付地点"
|
||||||
|
:labelCol="labelCol"
|
||||||
|
:wrapperCol="wrapperCol"
|
||||||
|
has-feedback
|
||||||
|
>
|
||||||
|
<auto-complete
|
||||||
|
v-decorator="['name', { rules: [{ required: true, message: '请输入到付地点！' }] }]"
|
||||||
|
:data-source="dataSource"
|
||||||
|
option-label-prop="title"
|
||||||
|
placeholder="请输入到付地点"
|
||||||
|
:filter-option="filterOption"
|
||||||
|
/>
|
||||||
|
</a-form-item>
|
||||||
|
</a-col>
|
||||||
|
<a-col :xs="12" :sm="12" :md="12" :lg="8" :xl="6">
|
||||||
|
<a-form-item
|
||||||
|
class="from-label"
|
||||||
|
label="付费方式"
|
||||||
|
:labelCol="labelCol"
|
||||||
|
:wrapperCol="wrapperCol"
|
||||||
|
has-feedback
|
||||||
|
>
|
||||||
|
<auto-complete
|
||||||
|
v-decorator="['name', { rules: [{ required: true, message: '请输入付费方式！' }] }]"
|
||||||
|
:data-source="dataSource"
|
||||||
|
option-label-prop="title"
|
||||||
|
placeholder="请输入付费方式"
|
||||||
|
:filter-option="filterOption"
|
||||||
|
/>
|
||||||
|
</a-form-item>
|
||||||
|
</a-col>
|
||||||
|
<a-col :xs="12" :sm="12" :md="12" :lg="8" :xl="6">
|
||||||
|
<a-form-item
|
||||||
|
class="from-label"
|
||||||
|
label="第三付款地"
|
||||||
|
:labelCol="labelCol"
|
||||||
|
:wrapperCol="wrapperCol"
|
||||||
|
has-feedback
|
||||||
|
>
|
||||||
|
<a-input
|
||||||
|
placeholder="请输入第三付款地！"
|
||||||
|
v-decorator="['code', { rules: [{ required: true, message: '请输入第三付款地！' }] }]"
|
||||||
|
/>
|
||||||
|
</a-form-item>
|
||||||
|
</a-col>
|
||||||
|
<a-col :xs="12" :sm="12" :md="12" :lg="8" :xl="6">
|
||||||
|
<a-form-item
|
||||||
|
class="from-label"
|
||||||
|
label="运输条款"
|
||||||
|
:labelCol="labelCol"
|
||||||
|
:wrapperCol="wrapperCol"
|
||||||
|
has-feedback
|
||||||
|
>
|
||||||
|
<auto-complete
|
||||||
|
v-decorator="['name', { rules: [{ required: true, message: '请输入运输条款！' }] }]"
|
||||||
|
:data-source="dataSource"
|
||||||
|
option-label-prop="title"
|
||||||
|
placeholder="请输入运输条款"
|
||||||
|
:filter-option="filterOption"
|
||||||
|
/>
|
||||||
|
</a-form-item>
|
||||||
|
</a-col>
|
||||||
|
<a-col :xs="12" :sm="12" :md="12" :lg="8" :xl="6">
|
||||||
|
<a-form-item
|
||||||
|
class="from-label"
|
||||||
|
label="冷藏通风量"
|
||||||
|
:labelCol="labelCol"
|
||||||
|
:wrapperCol="wrapperCol"
|
||||||
|
has-feedback
|
||||||
|
>
|
||||||
|
<a-input
|
||||||
|
placeholder="请输入冷藏通风量！"
|
||||||
|
v-decorator="['code', { rules: [{ required: true, message: '请输入冷藏通风量！' }] }]"
|
||||||
|
/>
|
||||||
|
</a-form-item>
|
||||||
|
</a-col>
|
||||||
|
<a-col :xs="12" :sm="12" :md="12" :lg="8" :xl="6">
|
||||||
|
<a-form-item class="from-label" label="设置温度" :labelCol="labelCol" :wrapperCol="wrapperCol" has-feedback>
|
||||||
|
<a-input
|
||||||
|
placeholder="请输入设置温度！"
|
||||||
|
v-decorator="['code', { rules: [{ required: true, message: '请输入设置温度！' }] }]"
|
||||||
|
/>
|
||||||
|
</a-form-item>
|
||||||
|
</a-col>
|
||||||
|
<a-col :xs="12" :sm="12" :md="12" :lg="8" :xl="6">
|
||||||
|
<a-form-item class="from-label" label="温度单位" :labelCol="labelCol" :wrapperCol="wrapperCol" has-feedback>
|
||||||
|
<a-input
|
||||||
|
placeholder="请输入温度单位！"
|
||||||
|
v-decorator="['code', { rules: [{ required: true, message: '请输入温度单位！' }] }]"
|
||||||
|
/>
|
||||||
|
</a-form-item>
|
||||||
|
</a-col>
|
||||||
|
<a-col :xs="12" :sm="12" :md="12" :lg="8" :xl="6">
|
||||||
|
<a-form-item class="from-label" label="最低温度" :labelCol="labelCol" :wrapperCol="wrapperCol" has-feedback>
|
||||||
|
<a-input
|
||||||
|
placeholder="请输入最低温度！"
|
||||||
|
v-decorator="['code', { rules: [{ required: true, message: '请输入最低温度！' }] }]"
|
||||||
|
/>
|
||||||
|
</a-form-item>
|
||||||
|
</a-col>
|
||||||
|
<a-col :xs="12" :sm="12" :md="12" :lg="8" :xl="6">
|
||||||
|
<a-form-item class="from-label" label="最高温度" :labelCol="labelCol" :wrapperCol="wrapperCol" has-feedback>
|
||||||
|
<a-input
|
||||||
|
placeholder="请输入最高温度！"
|
||||||
|
v-decorator="['code', { rules: [{ required: true, message: '请输入最高温度！' }] }]"
|
||||||
|
/>
|
||||||
|
</a-form-item>
|
||||||
|
</a-col>
|
||||||
|
<a-col :xs="12" :sm="12" :md="12" :lg="8" :xl="6">
|
||||||
|
<a-form-item class="from-label" label="湿度" :labelCol="labelCol" :wrapperCol="wrapperCol" has-feedback>
|
||||||
|
<a-input
|
||||||
|
placeholder="请输入湿度！"
|
||||||
|
v-decorator="['code', { rules: [{ required: true, message: '请输入湿度！' }] }]"
|
||||||
|
/>
|
||||||
|
</a-form-item>
|
||||||
|
</a-col>
|
||||||
|
</a-row>
|
||||||
|
</a-form>
|
||||||
|
</div>
|
||||||
|
</a-collapse-panel>
|
||||||
|
</a-collapse>
|
||||||
|
</template>
|
||||||
|
<script>
|
||||||
|
import { AutoComplete } from 'ant-design-vue'
|
||||||
|
export default {
|
||||||
|
name: '',
|
||||||
|
components: {
|
||||||
|
AutoComplete
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
labelCol: {
|
||||||
|
xs: { span: 24 },
|
||||||
|
sm: { span: 8 },
|
||||||
|
md: { span: 10 },
|
||||||
|
},
|
||||||
|
wrapperCol: {
|
||||||
|
xs: { span: 24 },
|
||||||
|
sm: { span: 15 },
|
||||||
|
md: { span: 13 },
|
||||||
|
},
|
||||||
|
form: this.$form.createForm(this),
|
||||||
|
dataSource: ['Burns Bay Road', 'Downing Street', 'Wall Street'],
|
||||||
|
}
|
||||||
|
},
|
||||||
|
created() {},
|
||||||
|
methods: {
|
||||||
|
filterOption(input, option) {
|
||||||
|
return option.componentOptions.children[0].text.toUpperCase().indexOf(input.toUpperCase()) >= 0
|
||||||
|
},
|
||||||
|
},
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
<style lang="less" scoped>
|
||||||
|
.collapse-box{
|
||||||
|
margin-bottom: 10px;
|
||||||
|
background: #fff;
|
||||||
|
}
|
||||||
|
.base-tit {
|
||||||
|
font-size: 14px;
|
||||||
|
font-weight: 600;
|
||||||
|
color: #666;
|
||||||
|
position: relative;
|
||||||
|
height: 40px;
|
||||||
|
line-height: 40px;
|
||||||
|
&::before {
|
||||||
|
content: '';
|
||||||
|
position: absolute;
|
||||||
|
width: 4px;
|
||||||
|
height: 30px;
|
||||||
|
background: #1ebcd5;
|
||||||
|
top: 6px;
|
||||||
|
left: -10px;
|
||||||
|
}
|
||||||
|
i {
|
||||||
|
margin-right: 10px;
|
||||||
|
font-weight: 500;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
</style>
|
||||||
@ -0,0 +1,139 @@
|
|||||||
|
<template>
|
||||||
|
<a-collapse class="collapse-box" :bordered="false" expandIconPosition="right">
|
||||||
|
<a-collapse-panel>
|
||||||
|
<template slot="header">
|
||||||
|
<div class="base-tit"><i class="iconfont icon-a-fahuodaifahuo"></i>货物信息</div>
|
||||||
|
</template>
|
||||||
|
<div class="container cargo-info">
|
||||||
|
<a-row :gutter="20">
|
||||||
|
<a-col :span="8">
|
||||||
|
<div class="tit">
|
||||||
|
<div>Seal No.(封志号)</div>
|
||||||
|
<div>Marks & Nos.(标记与号码)</div>
|
||||||
|
</div>
|
||||||
|
<div class="bottom">
|
||||||
|
<a-textarea class="input-box" placeholder="请输入内容" v-model="sealNo" />
|
||||||
|
</div>
|
||||||
|
</a-col>
|
||||||
|
<a-col :span="16">
|
||||||
|
<div class="line">
|
||||||
|
<div class="left">
|
||||||
|
<div>Description of Goods</div>
|
||||||
|
<div>(包装种类与货名)</div>
|
||||||
|
</div>
|
||||||
|
<div class="input">
|
||||||
|
<div>货物标志</div>
|
||||||
|
<a-select default-value="R" style="width: 120px">
|
||||||
|
<a-select-option value="S"> S 普通货 </a-select-option>
|
||||||
|
<a-select-option value="R"> R 冻柜 </a-select-option>
|
||||||
|
<a-select-option value="D"> D 危险品 </a-select-option>
|
||||||
|
</a-select>
|
||||||
|
</div>
|
||||||
|
<div class="input">
|
||||||
|
<div>HS编码</div>
|
||||||
|
<a-input placeholder="请输入HS编码" v-model="HSinput" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="bottom">
|
||||||
|
<a-textarea class="input-box" placeholder="请输入内容" v-model="sealNo" />
|
||||||
|
</div>
|
||||||
|
</a-col>
|
||||||
|
<a-col class="num-box" :span="24">
|
||||||
|
<span class="label">件数大写: </span>
|
||||||
|
<a-input class="input-val" placeholder="请输入件数大写" v-model="HSinput" />
|
||||||
|
</a-col>
|
||||||
|
</a-row>
|
||||||
|
</div>
|
||||||
|
</a-collapse-panel>
|
||||||
|
</a-collapse>
|
||||||
|
</template>
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
name: '',
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
sealNo: '',
|
||||||
|
HSinput: '',
|
||||||
|
}
|
||||||
|
},
|
||||||
|
created() {},
|
||||||
|
methods: {},
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
<style lang="less" scoped>
|
||||||
|
.collapse-box{
|
||||||
|
margin-bottom: 10px;
|
||||||
|
background: #fff;
|
||||||
|
}
|
||||||
|
.base-tit {
|
||||||
|
font-size: 14px;
|
||||||
|
font-weight: 600;
|
||||||
|
color: #666;
|
||||||
|
position: relative;
|
||||||
|
height: 40px;
|
||||||
|
line-height: 40px;
|
||||||
|
&::before {
|
||||||
|
content: '';
|
||||||
|
position: absolute;
|
||||||
|
width: 4px;
|
||||||
|
height: 30px;
|
||||||
|
background: #1ebcd5;
|
||||||
|
top: 6px;
|
||||||
|
left: -10px;
|
||||||
|
}
|
||||||
|
i {
|
||||||
|
margin-right: 10px;
|
||||||
|
font-weight: 500;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.cargo-info {
|
||||||
|
box-shadow: none;
|
||||||
|
font-size: 14px;
|
||||||
|
color: #666;
|
||||||
|
.tit {
|
||||||
|
text-align: left;
|
||||||
|
width: 100%;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
height: 54px;
|
||||||
|
padding-top: 4px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
|
||||||
|
.line {
|
||||||
|
text-align: left;
|
||||||
|
width: 100%;
|
||||||
|
display: flex;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
height: 54px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.left {
|
||||||
|
text-align: left;
|
||||||
|
display: inline-block;
|
||||||
|
width: 170px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.input {
|
||||||
|
text-align: left;
|
||||||
|
display: inline-block;
|
||||||
|
flex: 1;
|
||||||
|
}
|
||||||
|
.input-box {
|
||||||
|
height: 200px;
|
||||||
|
}
|
||||||
|
.num-box{
|
||||||
|
display: flex;
|
||||||
|
height: 30px;
|
||||||
|
margin-top: 15px;
|
||||||
|
}
|
||||||
|
.label{
|
||||||
|
width: 80px;
|
||||||
|
height: 30px;
|
||||||
|
line-height: 30px;
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
.input-val{
|
||||||
|
flex:1;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -0,0 +1,276 @@
|
|||||||
|
<template>
|
||||||
|
<div class="goods-table">
|
||||||
|
<x-card>
|
||||||
|
<div slot="content">
|
||||||
|
<div class="from-line">
|
||||||
|
<div class="left">
|
||||||
|
<a-button class="btn" type="primary" @click="addboxLine">添加</a-button>
|
||||||
|
<a-button class="btn" type="primary">删除</a-button>
|
||||||
|
<a-button class="btn" type="primary" @click="openDialog">多品名</a-button>
|
||||||
|
<a-button class="btn" type="primary">引入场站数据</a-button>
|
||||||
|
<a-button class="btn" type="primary">引入箱皮重</a-button>
|
||||||
|
</div>
|
||||||
|
<div class="table-right">
|
||||||
|
<span>合计: 123</span>
|
||||||
|
<span>重量: 123</span>
|
||||||
|
<span>件数: 123</span>
|
||||||
|
<span>尺码: 123</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<ve-table
|
||||||
|
rowKeyFieldName="rowKey"
|
||||||
|
:fixed-header="true"
|
||||||
|
:columns="editColumnsData"
|
||||||
|
:table-data="tableData"
|
||||||
|
:editOption="editOption"
|
||||||
|
:rowStyleOption="rowStyleOption"
|
||||||
|
border-y
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</x-card>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<script>
|
||||||
|
import { XCard } from '@/components'
|
||||||
|
export default {
|
||||||
|
name: '',
|
||||||
|
components: {
|
||||||
|
XCard,
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
editColumnsData: [
|
||||||
|
// {
|
||||||
|
// field: '',
|
||||||
|
// key: 'checkbox',
|
||||||
|
// type: 'checkbox',
|
||||||
|
// title: '序号',
|
||||||
|
// width: 50,
|
||||||
|
// operationColumn: true,
|
||||||
|
// align: 'center',
|
||||||
|
// },
|
||||||
|
{
|
||||||
|
field: '',
|
||||||
|
key: 'a',
|
||||||
|
title: '',
|
||||||
|
width: 50,
|
||||||
|
align: 'center',
|
||||||
|
operationColumn: true,
|
||||||
|
renderBodyCell: ({ row, column, rowIndex }, h) => {
|
||||||
|
return ++rowIndex
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
field: 'boxType',
|
||||||
|
key: 'boxType',
|
||||||
|
title: '箱型',
|
||||||
|
align: 'left',
|
||||||
|
width: '8%',
|
||||||
|
edit: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
field: 'case',
|
||||||
|
key: 'case ',
|
||||||
|
title: '箱量',
|
||||||
|
align: 'left',
|
||||||
|
width: '8%',
|
||||||
|
edit: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
field: 'boxNum',
|
||||||
|
key: 'boxNum',
|
||||||
|
title: '箱号',
|
||||||
|
align: 'right',
|
||||||
|
width: '8%',
|
||||||
|
edit: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
field: 'title',
|
||||||
|
key: 'title',
|
||||||
|
title: '封号',
|
||||||
|
align: 'left',
|
||||||
|
width: '8%',
|
||||||
|
edit: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
field: 'number',
|
||||||
|
key: 'number',
|
||||||
|
title: '件数',
|
||||||
|
align: 'left',
|
||||||
|
width: '8%',
|
||||||
|
edit: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
field: 'packing',
|
||||||
|
key: 'packing',
|
||||||
|
title: '包装',
|
||||||
|
align: 'left',
|
||||||
|
width: '8%',
|
||||||
|
edit: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
field: 'weight',
|
||||||
|
key: 'weight',
|
||||||
|
title: '重量',
|
||||||
|
align: 'left',
|
||||||
|
width: '8%',
|
||||||
|
edit: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
field: 'size',
|
||||||
|
key: 'size',
|
||||||
|
title: '尺码',
|
||||||
|
align: 'left',
|
||||||
|
width: '8%',
|
||||||
|
edit: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
field: 'tareWeight',
|
||||||
|
key: 'tareWeight',
|
||||||
|
title: '箱皮重',
|
||||||
|
align: 'left',
|
||||||
|
width: '8%',
|
||||||
|
edit: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
field: 'weighType',
|
||||||
|
key: 'weighType',
|
||||||
|
title: '称重方式',
|
||||||
|
align: 'left',
|
||||||
|
edit: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
field: 'weighingWeight',
|
||||||
|
key: 'weighingWeight',
|
||||||
|
title: '称重重量',
|
||||||
|
align: 'left',
|
||||||
|
edit: true,
|
||||||
|
},
|
||||||
|
],
|
||||||
|
tableData: [
|
||||||
|
{
|
||||||
|
boxType: '40GP',
|
||||||
|
case: '40Lp',
|
||||||
|
boxNum: '32',
|
||||||
|
title: '封号',
|
||||||
|
number: 1,
|
||||||
|
packing: '包装',
|
||||||
|
weight: '60KG',
|
||||||
|
size: 'L',
|
||||||
|
tareWeight: '2KG',
|
||||||
|
weighType: '称重方式',
|
||||||
|
weighingWeight: '称重重量',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
boxType: '40GP',
|
||||||
|
case: '40Lp',
|
||||||
|
boxNum: '32',
|
||||||
|
title: '封号',
|
||||||
|
number: 1,
|
||||||
|
packing: '包装',
|
||||||
|
weight: '60KG',
|
||||||
|
size: 'L',
|
||||||
|
tareWeight: '2KG',
|
||||||
|
weighType: '称重方式',
|
||||||
|
weighingWeight: '称重重量',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
boxType: '40GP',
|
||||||
|
case: '40Lp',
|
||||||
|
boxNum: '32',
|
||||||
|
title: '封号',
|
||||||
|
number: 1,
|
||||||
|
packing: '包装',
|
||||||
|
weight: '60KG',
|
||||||
|
size: 'L',
|
||||||
|
tareWeight: '2KG',
|
||||||
|
weighType: '称重方式',
|
||||||
|
weighingWeight: '称重重量',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
boxType: '40GP',
|
||||||
|
case: '40Lp',
|
||||||
|
boxNum: '32',
|
||||||
|
title: '封号',
|
||||||
|
number: 1,
|
||||||
|
packing: '包装',
|
||||||
|
weight: '60KG',
|
||||||
|
size: 'L',
|
||||||
|
tareWeight: '2KG',
|
||||||
|
weighType: '称重方式',
|
||||||
|
weighingWeight: '称重重量',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
boxType: '40GP',
|
||||||
|
case: '40Lp',
|
||||||
|
boxNum: '32',
|
||||||
|
title: '封号',
|
||||||
|
number: 1,
|
||||||
|
packing: '包装',
|
||||||
|
weight: '60KG',
|
||||||
|
size: 'L',
|
||||||
|
tareWeight: '2KG',
|
||||||
|
weighType: '称重方式',
|
||||||
|
weighingWeight: '称重重量',
|
||||||
|
},
|
||||||
|
],
|
||||||
|
editOption: {
|
||||||
|
beforeCellValueChange: ({ row, column, changeValue }) => {
|
||||||
|
console.log('beforeCellValueChange')
|
||||||
|
console.log('row::', row)
|
||||||
|
console.log('column::', column)
|
||||||
|
console.log('changeValue::', changeValue)
|
||||||
|
|
||||||
|
console.log('---')
|
||||||
|
|
||||||
|
if (column.field === 'number' && !/^\d+$/.test(changeValue)) {
|
||||||
|
alert('请输入数字')
|
||||||
|
return false
|
||||||
|
}
|
||||||
|
},
|
||||||
|
afterCellValueChange: ({ row, column, changeValue }) => {
|
||||||
|
console.log('afterCellValueChange')
|
||||||
|
console.log('row::', row)
|
||||||
|
console.log('column::', column)
|
||||||
|
console.log('changeValue::', changeValue)
|
||||||
|
console.log('---')
|
||||||
|
},
|
||||||
|
},
|
||||||
|
// 可控单元格编辑
|
||||||
|
rowStyleOption: {
|
||||||
|
clickHighlight: false,
|
||||||
|
hoverHighlight: false,
|
||||||
|
},
|
||||||
|
}
|
||||||
|
},
|
||||||
|
created() {},
|
||||||
|
methods: {
|
||||||
|
addboxLine() {},
|
||||||
|
openDialog() {},
|
||||||
|
},
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
<style lang="less">
|
||||||
|
.from-line {
|
||||||
|
display: flex;
|
||||||
|
margin: 20px 0;
|
||||||
|
.left {
|
||||||
|
flex: 1;
|
||||||
|
text-align: left;
|
||||||
|
.btn {
|
||||||
|
margin-right: 10px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.table-right {
|
||||||
|
line-height: 28px;
|
||||||
|
font-size: 14px;
|
||||||
|
span {
|
||||||
|
margin-left: 10px;
|
||||||
|
color: #666;
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -0,0 +1,47 @@
|
|||||||
|
<template>
|
||||||
|
<x-card class="ramark-box">
|
||||||
|
<div slot="content">
|
||||||
|
<a-row :gutter="24">
|
||||||
|
<a-col :span="12">
|
||||||
|
<div class="tit"><span class="iconfont icon-bianji"></span>订舱备注</div>
|
||||||
|
<a-textarea class="input-box" placeholder="请输入内容" v-model="remarks" />
|
||||||
|
</a-col>
|
||||||
|
<a-col :span="12">
|
||||||
|
<div class="tit"><span class="iconfont icon-bianji"></span>截单备注</div>
|
||||||
|
<a-textarea class="input-box" placeholder="请输入内容" v-model="remarks" />
|
||||||
|
</a-col>
|
||||||
|
</a-row>
|
||||||
|
</div>
|
||||||
|
</x-card>
|
||||||
|
</template>
|
||||||
|
<script>
|
||||||
|
import { XCard } from '@/components'
|
||||||
|
export default {
|
||||||
|
name: '',
|
||||||
|
components: {
|
||||||
|
XCard,
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
remarks: '',
|
||||||
|
}
|
||||||
|
},
|
||||||
|
created() {},
|
||||||
|
methods: {},
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
<style lang="less">
|
||||||
|
.tit {
|
||||||
|
margin-bottom: 10px;
|
||||||
|
font-size: 14px;
|
||||||
|
color: #666;
|
||||||
|
.iconfont {
|
||||||
|
margin-right: 4px;
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.ramark-box{
|
||||||
|
margin-bottom: 20px;
|
||||||
|
padding-bottom: 10px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -0,0 +1,17 @@
|
|||||||
|
<template>
|
||||||
|
<div class="right-box">
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
name: '',
|
||||||
|
data() {
|
||||||
|
return {}
|
||||||
|
},
|
||||||
|
created() {},
|
||||||
|
methods: {},
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
<style lang="less">
|
||||||
|
</style>
|
||||||
Loading…
Reference in New Issue