order.vue 14.9 KB
<!--<template>-->
<!--    <div class="bg order">-->
<!--        <span class="air">空运服务-订舱确认</span>-->
<!--        <div class="px">-->
<!--&lt;!&ndash;            下单信息&ndash;&gt;-->
<!--            <h4 class="title">下单信息</h4>-->
<!--            <div class="r-table">-->
<!--                <table  class="tb">-->
<!--                    <tbody>-->
<!--                    <tr>-->
<!--                        <th width="10%">航空公司</th>-->
<!--                        <td width="10%">1</td>-->
<!--                        <th width="10%">起运机场</th>-->
<!--                        <td width="10%">1</td>-->
<!--                        <th width="10%">目的机场</th>-->
<!--                        <td width="10%">1</td>-->
<!--                        <th width="10%">下单重量(KG)</th>-->
<!--                        <td width="10%"><el-input v-model="weight" placeholder="" size="mini"></el-input></td>-->
<!--                        <th width="10%">运价单价</th>-->
<!--                        <td width="10%">1</td>-->
<!--                    </tr>-->
<!--                    <tr>-->
<!--                        <th>报关方式</th>-->
<!--                        <td colspan="4">-->
<!--                            <el-radio v-model="customsType" label="1">自理报关</el-radio>-->
<!--                            <el-radio v-model="customsCharges" label="2">委托报关</el-radio>-->
<!--                        </td>-->
<!--                        <th rowspan="4">附加费</th>-->
<!--                        <td colspan="3">操作费: CNY 0.00/票</td>-->
<!--                        <td><el-input-number v-model="" @change="handleChange" :min="1" :max="10" label="">-->
<!--                        </el-input-number></td>-->
<!--                    </tr>-->
<!--                    <tr>-->
<!--                        <th rowspan="3">门到门服务</th>-->
<!--                        <td colspan="4"><el-checkbox v-model="homeDelivery">上门提货</el-checkbox></td>-->
<!--                        <td colspan="3">制单费: CNY 50.00/票</td>-->
<!--                        <td><el-input-number v-model="" @change="handleChange" :min="1" :max="10" label="">-->
<!--                        </el-input-number></td>-->
<!--                    </tr>-->
<!--                    <tr>-->
<!--                        <td colspan="4" rowspan="2"><el-checkbox v-model="sendToHome">清关派送</el-checkbox></td>-->
<!--                        <td colspan="3">订舱预录费: CNY 30.00 /票</td>-->
<!--                        <td><el-input-number v-model="" @change="handleChange" :min="1" :max="10" label="">-->
<!--                        </el-input-number></td>-->
<!--                    </tr>-->
<!--                    <tr>-->
<!--                        <td colspan="4">地面操作费: CNY 0/KG</td>-->
<!--                    </tr>-->
<!--                    <tr>-->
<!--                        <th>预估费用</th>-->
<!--                        <td colspan="3">运费:CNY 23500.00 (最低100.00KG 起运)</td>-->
<!--                        <td colspan="3">附加费:CNY 230.00</td>-->
<!--                        <td colspan="3">总费用:</td>-->
<!--                    </tr>-->
<!--                    </tbody>-->
<!--                </table>-->
<!--            </div>-->
<!--&lt;!&ndash;            货物信息&ndash;&gt;-->
<!--            <h4 class="title">货物信息</h4>-->
<!--            <div class="r-table">-->
<!--                <table class="tb" width="100%">-->
<!--                    <tbody>-->
<!--                    <tr>-->
<!--                        <th width="35%">*是否有电池、液体、粉末、磁性及其它违禁物品</th>-->
<!--                        <td width="15%">-->
<!--                            <el-radio v-model="radio1" label="1">是</el-radio>-->
<!--                            <el-radio v-model="radio1" label="2">否</el-radio></td>-->
<!--                        <th width="35%">*是否购买保险</th>-->
<!--                        <td width="15%">-->
<!--                            <el-radio v-model="radio4" label="1">是</el-radio>-->
<!--                            <el-radio v-model="radio4" label="2">否</el-radio></td>-->
<!--                    </tr>-->
<!--                    <tr>-->
<!--                        <th width="35%">*是否超长托盘</th>-->
<!--                        <td width="15%">-->
<!--                            <el-radio v-model="radio1" label="1">是</el-radio>-->
<!--                            <el-radio v-model="radio1" label="2">否</el-radio></td>-->
<!--                        <th width="35%">*是否名牌</th>-->
<!--                        <td width="15%">-->
<!--                            <el-radio v-model="radio4" label="1">是</el-radio>-->
<!--                            <el-radio v-model="radio4" label="2">否</el-radio></td>-->
<!--                    </tr>-->
<!--                    </tbody>-->
<!--                </table>-->
<!--                <table class="tb" style="margin-top: 10px;width: 100%">-->
<!--                    <tbody>-->
<!--                    <tr>-->
<!--                        <th width="20%">中文品名</th>-->
<!--                        <th width="20%">英文品名</th>-->
<!--                        <th width="10%">*数量(件)</th>-->
<!--                        <th width="10%">*实重(KG)</th>-->
<!--                        <th width="10%">*总体积(CBM)</th>-->
<!--                        <th width="20%">最大尺寸(长x宽x高)</th>-->
<!--                        <th width="10%">操作</th>-->
<!--                    </tr>-->
<!--                    <tr>-->
<!--                        <td><el-input v-model="nameCn" placeholder="" size="mini"></el-input></td>-->
<!--                        <td><el-input v-model="name" placeholder="" size="mini"></el-input></td>-->
<!--                        <td><el-input v-model="billCount" placeholder="" size="mini"></el-input></td>-->
<!--                        <td><el-input v-model="weight" placeholder="" size="mini"></el-input></td>-->
<!--                        <td><el-input v-model="input" placeholder="" size="mini"></el-input></td>-->
<!--                        <td><el-input v-model="input" placeholder="" size="mini"></el-input></td>-->
<!--                        <td><el-button  icon="el-icon-plus" size="mini" circle></el-button>-->
<!--                            <el-button  icon="el-icon-minus" size="mini" circle></el-button></td>-->
<!--                    </tr>-->
<!--                    </tbody>-->
<!--                </table>-->
<!--            </div>-->
<!--&lt;!&ndash;            收发件通知人信息&ndash;&gt;-->
<!--            <div class="r-table" style="margin-top: 35px">-->
<!--                <el-collapse v-model="activeNames" @change="handleChange" class="col">-->
<!--                    <el-collapse-item title="发件人信息" name="1">-->
<!--                        <table class="tb" width="100%">-->
<!--                            <tbody>-->
<!--                            <tr>-->
<!--                                <th width="15%">姓名</th>-->
<!--                                <td width="35%"><el-input v-model="name" placeholder="" ></el-input></td>-->
<!--                                <th width="15%">联系电话</th>-->
<!--                                <td width="35%"><el-input v-model="tel" placeholder="" ></el-input></td>-->
<!--                            </tr>-->
<!--                            <tr>-->
<!--                                <th colspan="1">公司</th>-->
<!--                                <td colspan="3"><el-input v-model="company" placeholder="" ></el-input></td>-->
<!--                            </tr>-->
<!--                            <tr>-->
<!--                                <th colspan="1">详细地址	</th>-->
<!--                                <td colspan="3"><el-input v-model="address" placeholder="" ></el-input></td>-->
<!--                            </tr>-->
<!--                            </tbody>-->
<!--                        </table>-->
<!--                    </el-collapse-item>-->
<!--                    <el-collapse-item title="收件人信息" name="2" class="father">-->
<!--                        <div class="relative">-->
<!--                            <el-button type="text" @click="dialogTableVisible  = true">收件地址库</el-button>-->
<!--                            <el-checkbox v-model="checked1" style="margin-left: 20px">加入地址库</el-checkbox>-->
<!--                        </div>-->
<!--                        <table class="tb" width="100%">-->
<!--                            <tbody>-->
<!--                            <tr>-->
<!--                                <th width="15%">姓名</th>-->
<!--                                <td width="35"><el-input v-model="name" placeholder="" ></el-input></td>-->
<!--                                <th width="15%">联系电话</th>-->
<!--                                <td width="35%"><el-input v-model="tel" placeholder="" ></el-input></td>-->
<!--                            </tr>-->
<!--                            <tr>-->
<!--                                <th colspan="1">公司</th>-->
<!--                                <td colspan="3"><el-input v-model="company" placeholder="" ></el-input></td>-->
<!--                            </tr>-->
<!--                            <tr>-->
<!--                                <th colspan="1">详细地址</th>-->
<!--                                <td colspan="3"><el-input v-model="address" placeholder="" ></el-input></td>-->
<!--                            </tr>-->
<!--                            <tr>-->
<!--                                <th colspan="1">特殊信息</th>-->
<!--                                <td colspan="3"><el-input v-model="input" placeholder="" ></el-input></td>-->
<!--                            </tr>-->
<!--                            </tbody>-->
<!--                        </table>-->
<!--                    </el-collapse-item>-->
<!--                    <el-collapse-item title="通知人信息" name="3" class="father">-->
<!--                        <div class="relative"><el-checkbox v-model="checked">同收件人</el-checkbox></div>-->
<!--                        <table class="tb" width="100%">-->
<!--                            <tbody>-->
<!--                            <tr>-->
<!--                                <th width="15%">姓名</th>-->
<!--                                <td width="35%"><el-input v-model="name" placeholder="" ></el-input></td>-->
<!--                                <th width="15%">联系电话</th>-->
<!--                                <td width="35%"><el-input v-model="tel" placeholder="" ></el-input></td>-->
<!--                            </tr>-->
<!--                            <tr>-->
<!--                                <th colspan="1">公司</th>-->
<!--                                <td colspan="3"><el-input v-model="company" placeholder="" ></el-input></td>-->
<!--                            </tr>-->
<!--                            <tr>-->
<!--                                <th colspan="1">详细地址</th>-->
<!--                                <td colspan="3"><el-input v-model="address" placeholder="" ></el-input></td>-->
<!--                            </tr>-->
<!--                            <tr>-->
<!--                                <th colspan="1">特殊信息</th>-->
<!--                                <td colspan="3"><el-input v-model="input" placeholder="" ></el-input></td>-->
<!--                            </tr>-->
<!--                            </tbody>-->
<!--                        </table>-->
<!--                    </el-collapse-item>-->
<!--                </el-collapse>-->
<!--            </div>-->
<!--            <div style="text-align: center;margin-top: 30px">-->
<!--                <el-button type="danger"  style="width: 180px;height: 50px">确认下单</el-button>-->
<!--            </div>-->
<!--            <div style="margin-top: 50px;height: 80px"> </div>-->
<!--        </div>-->
<!--&lt;!&ndash;        收件地址库弹框&ndash;&gt;-->
<!--        <div>-->
<!--            <el-dialog title="请选择收件人" :visible.sync="dialogTableVisible">-->
<!--                <el-table :data="gridData">-->
<!--                    <el-table-column property="name" label="姓名" width="150"></el-table-column>-->
<!--                    <el-table-column property="tel" label="电话" width="200"></el-table-column>-->
<!--                    <el-table-column property="address" label="地址"></el-table-column>-->
<!--                </el-table>-->
<!--                <div style="margin-top: 10px;text-align: right">-->
<!--                    <el-button>取消</el-button>-->
<!--                    <el-button type="primary">请选择收件人</el-button>-->
<!--                </div>-->
<!--            </el-dialog>-->
<!--        </div>-->
<!--    </div>-->
<!--</template>-->

<!--<script>-->
<!--    export default {-->
<!--        data() {-->
<!--            return{-->
<!--                gridData:[],-->
<!--                num: 1,-->
<!--                dialogTableVisible:false,-->

<!--            }-->
<!--        }-->
<!--    }-->
<!--</script>-->

<!--<style scoped>-->
<!--    .bg{-->
<!--        background-color: #F2F2F2;-->
<!--    }-->
<!--    .air{-->
<!--        font-size: 20px;-->
<!--        color: #308aee;-->
<!--        margin-top: 20px;-->
<!--        display: block;-->
<!--    }-->
<!--    .r-table{-->
<!--        text-align: center;-->
<!--    }-->

<!--    /*line-height: 100px;*/-->
<!--    .tb{-->
<!--        font-size: 14px;-->
<!--        box-sizing: border-box;-->
<!--        display: table;-->
<!--        border-spacing: 0;-->
<!--        border-collapse: collapse;-->
<!--    }-->
<!--    .px{-->
<!--        background-color: #FFFFFF;-->
<!--        width: 100%;-->
<!--        height: 500px;-->
<!--    }-->
<!--    .title{-->
<!--        color: #127ef2;-->
<!--        font-size: 16px;-->
<!--        font-weight: bold;-->
<!--        margin: 20px 30px;-->
<!--        text-align: left;-->
<!--    }-->
<!--    .r-table .tb > tbody > tr > th {-->
<!--        background-color: #d8ecff;-->
<!--        padding: 10px 5px;-->
<!--        text-align: center;-->
<!--        border: 1px solid #ddd;-->
<!--    }-->
<!--    .r-table .tb > tbody > tr > td {-->
<!--        padding: 8px;-->
<!--        border: 1px solid #ddd;-->
<!--        display: table-cell;-->
<!--    }-->
<!--    .col .tb > tbody > tr > th {-->
<!--        border: 0px;-->
<!--    }-->
<!--    .col .tb > tbody > tr > td {-->
<!--        border: 0px;-->
<!--    }-->
<!--    .father{-->
<!--        position: relative;-->
<!--    }-->
<!--    .relative{-->
<!--        position: absolute;-->
<!--        top:11px;-->
<!--        right: 100px;-->
<!--    }-->
<!--</style>-->
<!--<style>-->
<!--    .order .el-collapse-item__header{-->
<!--        color: #127ef2;-->
<!--        font-size: 16px;-->
<!--        font-weight: bold;-->
<!--        margin: 20px 30px;-->
<!--        text-align: left;-->
<!--    }-->
<!--</style>-->