| 1 | <template> | 1 | <template> | 
|  |  | 2 | +    <div> | 
|  |  | 3 | +        <el-row :gutter="10"> | 
|  |  | 4 | +            <el-col :span="4"> | 
|  |  | 5 | +                <el-input | 
|  |  | 6 | +                        placeholder="航空器注册编号" | 
|  |  | 7 | +                        v-model="query.aircraftno" | 
|  |  | 8 | +                        size="medium" | 
|  |  | 9 | +                        clearable> | 
|  |  | 10 | +                </el-input> | 
|  |  | 11 | +            </el-col> | 
|  |  | 12 | +            <el-col :span="4"> | 
|  |  | 13 | +                <el-input | 
|  |  | 14 | +                        placeholder="进境(港)航班号" | 
|  |  | 15 | +                        v-model="query.flightno" | 
|  |  | 16 | +                        size="medium" | 
|  |  | 17 | +                        clearable> | 
|  |  | 18 | +                </el-input> | 
|  |  | 19 | +            </el-col> | 
|  |  | 20 | +            <el-col :span="8"> | 
|  |  | 21 | +                <div class="block"> | 
|  |  | 22 | +                    <el-date-picker | 
|  |  | 23 | +                            v-model="query.flightdate" | 
|  |  | 24 | +                            type="daterange" | 
|  |  | 25 | +                            :picker-options="pickerOptions" | 
|  |  | 26 | +                            range-separator="至" | 
|  |  | 27 | +                            start-placeholder="开始日期" | 
|  |  | 28 | +                            end-placeholder="结束日期" | 
|  |  | 29 | +                            size="medium" | 
|  |  | 30 | +                            align="right"> | 
|  |  | 31 | +                    </el-date-picker> | 
|  |  | 32 | +                </div> | 
|  |  | 33 | +            </el-col> | 
|  |  | 34 | +            <el-col :span="2"> | 
|  |  | 35 | +                <el-button size="medium" type="primary" plain>查询</el-button> | 
|  |  | 36 | +            </el-col> | 
|  |  | 37 | +            <el-col :span="2"> | 
|  |  | 38 | +                <el-button size="medium" type="success" @click="addForm()" plain>新增</el-button> | 
|  |  | 39 | +            </el-col> | 
|  |  | 40 | +        </el-row> | 
|  |  | 41 | +        <el-row :gutter="10"> | 
|  |  | 42 | +            <el-table | 
|  |  | 43 | +                    :data="tableData" | 
|  |  | 44 | +                    border | 
|  |  | 45 | +                    style="width: 100%"> | 
|  |  | 46 | +                <el-table-column | 
|  |  | 47 | +                        fixed | 
|  |  | 48 | +                        prop="messageid" | 
|  |  | 49 | +                        label="编号" | 
|  |  | 50 | +                        width="320"> | 
|  |  | 51 | +                </el-table-column> | 
|  |  | 52 | +                <el-table-column | 
|  |  | 53 | +                        prop="aircraftno" | 
|  |  | 54 | +                        label="航空器注册编号" | 
|  |  | 55 | +                        width="120"> | 
|  |  | 56 | +                </el-table-column> | 
|  |  | 57 | +                <el-table-column | 
|  |  | 58 | +                        prop="flightno" | 
|  |  | 59 | +                        label="进境(港)航班号" | 
|  |  | 60 | +                        width="120"> | 
|  |  | 61 | +                </el-table-column> | 
|  |  | 62 | +                <el-table-column | 
|  |  | 63 | +                        prop="callport" | 
|  |  | 64 | +                        label="停靠港" | 
|  |  | 65 | +                        width="120"> | 
|  |  | 66 | +                </el-table-column> | 
|  |  | 67 | +                <el-table-column | 
|  |  | 68 | +                        prop="flightdate" | 
|  |  | 69 | +                        label="航班日期" | 
|  |  | 70 | +                        width="200"> | 
|  |  | 71 | +                </el-table-column> | 
|  |  | 72 | +                <el-table-column | 
|  |  | 73 | +                        prop="status" | 
|  |  | 74 | +                        label="海关状态" | 
|  |  | 75 | +                        width="120"> | 
|  |  | 76 | +                </el-table-column> | 
|  |  | 77 | +                <el-table-column | 
|  |  | 78 | +                        fixed="right" | 
|  |  | 79 | +                        label="操作" | 
|  |  | 80 | +                        width="140"> | 
|  |  | 81 | +                    <template slot-scope="scope"> | 
|  |  | 82 | +                        <el-button @click="handleClick(scope.row)" type="text" size="small">查看</el-button> | 
|  |  | 83 | +                        <el-button type="text" size="small">编辑</el-button> | 
|  |  | 84 | +                        <el-button type="text" size="small">删除</el-button> | 
|  |  | 85 | +                    </template> | 
|  |  | 86 | +                </el-table-column> | 
|  |  | 87 | +            </el-table> | 
|  |  | 88 | +        </el-row> | 
|  |  | 89 | +        <el-row :gutter="10"> | 
|  |  | 90 | +            <div class="block"> | 
|  |  | 91 | +                <el-pagination | 
|  |  | 92 | +                        @size-change="handleSizeChange" | 
|  |  | 93 | +                        @current-change="handleCurrentChange" | 
|  |  | 94 | +                        :current-page="currentPage4" | 
|  |  | 95 | +                        :page-sizes="[100, 200, 300, 400]" | 
|  |  | 96 | +                        :page-size="100" | 
|  |  | 97 | +                        layout="total, sizes, prev, pager, next, jumper" | 
|  |  | 98 | +                        :total="400"> | 
|  |  | 99 | +                </el-pagination> | 
|  |  | 100 | +            </div> | 
|  |  | 101 | +        </el-row> | 
|  |  | 102 | +            <el-dialog | 
|  |  | 103 | +                    :title="'在港信息'+textMap[dialogStatus]" | 
|  |  | 104 | +                    :visible.sync="dialogVisible" | 
|  |  | 105 | +                    width="80%" | 
|  |  | 106 | +                    center> | 
|  |  | 107 | +                <el-form :model="form" label-width="130px"> | 
|  |  | 108 | +                    <el-divider content-position="left">报给单位</el-divider> | 
|  |  | 109 | +                    <el-row :gutter="20"> | 
|  |  | 110 | +                        <el-col :span="6"> | 
|  |  | 111 | +                            <el-form-item label="海关关区"> | 
|  |  | 112 | +                                <el-select v-model="form.customcode" | 
|  |  | 113 | +                                           filterable | 
|  |  | 114 | +                                           allow-create | 
|  |  | 115 | +                                           default-first-option | 
|  |  | 116 | +                                           remote | 
|  |  | 117 | +                                           :remote-method="getCustomCode" | 
|  |  | 118 | +                                           :loading="loading" placeholder="请选择"> | 
|  |  | 119 | +                                    <el-option | 
|  |  | 120 | +                                            v-for="item in customcodes" | 
|  |  | 121 | +                                            :key="item.customcode" | 
|  |  | 122 | +                                            :label="item.customcode" | 
|  |  | 123 | +                                            :value="item.customcode"> | 
|  |  | 124 | +                                        <span style="float: left">{{ item.customcode }}</span> | 
|  |  | 125 | +                                        <span style="float: right; color: #8492a6; font-size: 13px">-{{ item.customname }}</span> | 
|  |  | 126 | +                                    </el-option> | 
|  |  | 127 | +                                </el-select> | 
|  |  | 128 | +                            </el-form-item> | 
|  |  | 129 | +                        </el-col> | 
|  |  | 130 | +                    </el-row> | 
|  |  | 131 | +                    <el-divider content-position="left">航空器信息</el-divider> | 
|  |  | 132 | +                    <el-row :gutter="20"> | 
|  |  | 133 | +                        <el-col :span="6"> | 
|  |  | 134 | +                            <el-form-item label="航空器注册编号"> | 
|  |  | 135 | +                                <el-input v-model="form.aircraftno"></el-input> | 
|  |  | 136 | +                            </el-form-item> | 
|  |  | 137 | +                        </el-col> | 
|  |  | 138 | +                        <el-col :span="6"> | 
|  |  | 139 | +                            <el-form-item label="注册海关关区"> | 
|  |  | 140 | +                                <el-input v-model="form.registeredcustom"></el-input> | 
|  |  | 141 | +                            </el-form-item> | 
|  |  | 142 | +                        </el-col> | 
|  |  | 143 | +                        <el-col :span="6"> | 
|  |  | 144 | +                            <el-form-item label="航空器备案类型"> | 
|  |  | 145 | +                                <el-input v-model="form.aircrafttype"></el-input> | 
|  |  | 146 | +                            </el-form-item> | 
|  |  | 147 | +                        </el-col> | 
|  |  | 148 | +                    </el-row> | 
|  |  | 149 | +                    <el-divider content-position="left">在港申报信息</el-divider> | 
| 2 | <el-row :gutter="20"> | 150 | <el-row :gutter="20"> | 
| 3 | -        <el-col :span="6"><div class="grid-content bg-purple"></div></el-col> |  |  | 
| 4 | -        <el-col :span="6"><div class="grid-content bg-purple"></div></el-col> |  |  | 
| 5 | -        <el-col :span="6"><div class="grid-content bg-purple"></div></el-col> |  |  | 
| 6 | -        <el-col :span="6"><div class="grid-content bg-purple"></div></el-col> | 151 | +                        <el-col :span="6"> | 
|  |  | 152 | +                            <el-form-item label="进境(港)航班号"> | 
|  |  | 153 | +                                <el-input v-model="form.flightno"></el-input> | 
|  |  | 154 | +                            </el-form-item> | 
|  |  | 155 | +                        </el-col> | 
|  |  | 156 | +                        <el-col :span="6"> | 
|  |  | 157 | +                            <el-form-item label="航班日期"> | 
|  |  | 158 | +                                <el-input v-model="form.flightdate"></el-input> | 
|  |  | 159 | +                            </el-form-item> | 
|  |  | 160 | +                        </el-col> | 
|  |  | 161 | +                        <el-col :span="6"> | 
|  |  | 162 | +                            <el-form-item label="停靠港"> | 
|  |  | 163 | +                                <el-input v-model="form.callport"></el-input> | 
|  |  | 164 | +                            </el-form-item> | 
|  |  | 165 | +                        </el-col> | 
|  |  | 166 | +                        <el-col :span="6"> | 
|  |  | 167 | +                            <el-form-item label="停机位"> | 
|  |  | 168 | +                                <el-input v-model="form.callarea"></el-input> | 
|  |  | 169 | +                            </el-form-item> | 
|  |  | 170 | +                        </el-col> | 
| 7 | </el-row> | 171 | </el-row> | 
|  |  | 172 | +                    <el-divider content-position="left">备注信息</el-divider> | 
|  |  | 173 | +                    <el-row :gutter="20"> | 
|  |  | 174 | +                        <el-col :span="6"> | 
|  |  | 175 | +                            <el-form-item label="滞留原因"> | 
|  |  | 176 | +                                <el-input v-model="form.reasons"></el-input> | 
|  |  | 177 | +                            </el-form-item> | 
|  |  | 178 | +                        </el-col> | 
|  |  | 179 | +                        <el-col :span="6"> | 
|  |  | 180 | +                            <el-form-item label="海关备注"> | 
|  |  | 181 | +                                <el-input v-model="form.remark"></el-input> | 
|  |  | 182 | +                            </el-form-item> | 
|  |  | 183 | +                        </el-col> | 
|  |  | 184 | +                    </el-row> | 
|  |  | 185 | +                    <el-divider></el-divider> | 
|  |  | 186 | +                    <el-row :gutter="20"> | 
|  |  | 187 | +                        <el-col :span="12" :offset="6"> | 
|  |  | 188 | +                            <el-form-item> | 
|  |  | 189 | +                                <el-button @click="dialogVisible=false">取消</el-button> | 
|  |  | 190 | +                                <el-button type="primary">暂存</el-button> | 
|  |  | 191 | +                            </el-form-item> | 
|  |  | 192 | +                        </el-col> | 
|  |  | 193 | +                    </el-row> | 
|  |  | 194 | +                </el-form> | 
|  |  | 195 | +            </el-dialog> | 
|  |  | 196 | +    </div> | 
| 8 | </template> | 197 | </template> | 
| 9 | <script> | 198 | <script> | 
|  |  | 199 | +    import {selectBycustomcode} from "../../api/transport/transport2.0"; | 
|  |  | 200 | + | 
| 10 | export default { | 201 | export default { | 
| 11 | data(){ | 202 | data(){ | 
| 12 | return{ | 203 | return{ | 
| 13 | - | 204 | +                query:{ | 
|  |  | 205 | +                    aircraftno:'', | 
|  |  | 206 | +                    flightno:'', | 
|  |  | 207 | +                    flightdate:'' | 
|  |  | 208 | +                }, | 
|  |  | 209 | +                customcodes:[], | 
|  |  | 210 | +                form:{ | 
|  |  | 211 | +                    uuid:'', | 
|  |  | 212 | +                    customcode:'', | 
|  |  | 213 | +                    aircraftno:'', | 
|  |  | 214 | +                    registeredcustom:'', | 
|  |  | 215 | +                    aircrafttype:'', | 
|  |  | 216 | +                    flightno:'', | 
|  |  | 217 | +                    flightdate:'', | 
|  |  | 218 | +                    callport:'', | 
|  |  | 219 | +                    callarea:'', | 
|  |  | 220 | +                    reasons:'', | 
|  |  | 221 | +                    remark:'', | 
|  |  | 222 | +                    userid:'', | 
|  |  | 223 | +                    status:'', | 
|  |  | 224 | +                    statusmsg:'', | 
|  |  | 225 | +                    messageid:'' | 
|  |  | 226 | +                }, | 
|  |  | 227 | +                dialogVisible: false, | 
|  |  | 228 | +                currentPage4: 4, | 
|  |  | 229 | +                textMap:{ | 
|  |  | 230 | +                    update: '编辑', | 
|  |  | 231 | +                    create: '新增' | 
|  |  | 232 | +                }, | 
|  |  | 233 | +                dialogStatus:'', | 
|  |  | 234 | +                pickerOptions: { | 
|  |  | 235 | +                    shortcuts: [{ | 
|  |  | 236 | +                        text: '最近一周', | 
|  |  | 237 | +                        onClick(picker) { | 
|  |  | 238 | +                            const end = new Date(); | 
|  |  | 239 | +                            const start = new Date(); | 
|  |  | 240 | +                            start.setTime(start.getTime() - 3600 * 1000 * 24 * 7); | 
|  |  | 241 | +                            picker.$emit('pick', [start, end]); | 
|  |  | 242 | +                        } | 
|  |  | 243 | +                    }, { | 
|  |  | 244 | +                        text: '最近一个月', | 
|  |  | 245 | +                        onClick(picker) { | 
|  |  | 246 | +                            const end = new Date(); | 
|  |  | 247 | +                            const start = new Date(); | 
|  |  | 248 | +                            start.setTime(start.getTime() - 3600 * 1000 * 24 * 30); | 
|  |  | 249 | +                            picker.$emit('pick', [start, end]); | 
|  |  | 250 | +                        } | 
|  |  | 251 | +                    }, { | 
|  |  | 252 | +                        text: '最近三个月', | 
|  |  | 253 | +                        onClick(picker) { | 
|  |  | 254 | +                            const end = new Date(); | 
|  |  | 255 | +                            const start = new Date(); | 
|  |  | 256 | +                            start.setTime(start.getTime() - 3600 * 1000 * 24 * 90); | 
|  |  | 257 | +                            picker.$emit('pick', [start, end]); | 
|  |  | 258 | +                        } | 
|  |  | 259 | +                    }] | 
|  |  | 260 | +                }, | 
|  |  | 261 | +                tableData: [{ | 
|  |  | 262 | +                    messageid: 'CN_CAM006_1P2_460470678920X20211028075151', | 
|  |  | 263 | +                    aircraftno: 'N345UP', | 
|  |  | 264 | +                    flightno: '5X174', | 
|  |  | 265 | +                    callport: 'CGO', | 
|  |  | 266 | +                    flightdate: '2024-11-15', | 
|  |  | 267 | +                    status: '01' | 
|  |  | 268 | +                }] | 
| 14 | } | 269 | } | 
| 15 | }, | 270 | }, | 
| 16 | methods:{ | 271 | methods:{ | 
|  |  | 272 | +            //获取关区代码 | 
|  |  | 273 | +            getCustomCode:function(query){ | 
|  |  | 274 | +                this.customcodes=[]; | 
|  |  | 275 | +                let params={customcode:query}; | 
|  |  | 276 | +                this.loading = true; | 
|  |  | 277 | +                selectBycustomcode(params).then(res =>{ | 
|  |  | 278 | +                    if (res !== '') { | 
|  |  | 279 | +                        setTimeout(() => { | 
|  |  | 280 | +                            this.loading = false; | 
|  |  | 281 | +                            this.customcodes=res.data.data; | 
|  |  | 282 | +                        }, 200); | 
|  |  | 283 | +                    } else { | 
|  |  | 284 | +                        this.customcodes = []; | 
|  |  | 285 | +                    } | 
| 17 |  | 286 |  | 
|  |  | 287 | +                }); | 
|  |  | 288 | +            }, | 
|  |  | 289 | +            //新增 | 
|  |  | 290 | +            addForm(){ | 
|  |  | 291 | +                this.dialogVisible=true; | 
|  |  | 292 | +                this.dialogStatus='create'; | 
|  |  | 293 | +            }, | 
|  |  | 294 | +            handleClick(row) { | 
|  |  | 295 | +                console.log(row); | 
|  |  | 296 | +            }, | 
|  |  | 297 | +            //分页 | 
|  |  | 298 | +            handleSizeChange(val) { | 
|  |  | 299 | +                console.log(`每页 ${val} 条`); | 
|  |  | 300 | +            }, | 
|  |  | 301 | +            handleCurrentChange(val) { | 
|  |  | 302 | +                console.log(`当前页: ${val}`); | 
|  |  | 303 | +            } | 
| 18 | } | 304 | } | 
| 19 | } | 305 | } | 
| 20 | </script> | 306 | </script> |