审查视图

src/views/airtransport/queryRoute.vue 8.6 KB
xudada authored
1 2 3 4 5 6 7 8 9
<template>
    <el-container>
        <el-main>
            <el-row class="row-bg">
                <el-col :span="24">
                    <div class="grid-content content">航线查询</div>
                </el-col>
            </el-row>
            <el-row>
xudada authored
10
                <el-form :model="queryRoute" ref="serialNo" label-width="130px" >
小范 authored
11 12 13 14 15 16 17 18 19
                    <el-col :span="6">
                        <el-form-item label="航线序号" prop="serialNo" label-width="130px">
                            <el-input v-model="queryRoute.serialNo" placeholder="请输入"></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="3">   <el-button type="primary" @click="submitForm()">查 询</el-button></el-col>

                </el-form>
xudada authored
20 21
            </el-row>
            <el-row>
xudada authored
22
                <el-col :span="24">
xudada authored
23 24 25
                    <el-table
                            :data="tableData"
                            border
xudada authored
26 27
                            v-loading="tableloading"
                            style="width:100%;margin-bottom: 10px">
xudada authored
28 29 30 31 32 33 34 35
                        <el-table-column
                                fixed="left"
                                label="操作"
                                width="100">
                            <template slot-scope="scope">
                                <el-button
                                        size="mini"
                                        type="primary"
xudada authored
36
                                        @click="handleEdit(scope.$index, scope.row)">编辑</el-button>
xudada authored
37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91
                            </template>
                        </el-table-column>
                        <el-table-column
                                prop="serialNo"
                                label="航线序号"
                                width="80">
                        </el-table-column>
                        <el-table-column
                                prop="departurePort"
                                label="出发港"
                                width="80">
                        </el-table-column>
                        <el-table-column
                                prop="departureCustomNo"
                                label="出发港关区代码"
                                width="150">
                        </el-table-column>
                        <el-table-column
                                prop="arrivalPort"
                                label="目的港"
                                width="80">
                        </el-table-column>
                        <el-table-column
                                prop="arrivalCustomNo"
                                label="目的港关区代码"
                                width="150">
                        </el-table-column>
                        <el-table-column
                                prop="std"
                                label="长期离港时间"
                                width="150">
                        </el-table-column>
                        <el-table-column
                                prop="sta"
                                label="长期抵港时间"
                                width="150">
                        </el-table-column>
                        <el-table-column
                                prop="effStartdate"
                                label="有效期起始时间"
                                width="150">
                        </el-table-column>
                        <el-table-column
                                prop="effEnddate"
                                label="有效期结束时间"
                                width="150">
                        </el-table-column>
                        <el-table-column
                                prop="plan"
                                label="每周执行情况"
                                width="150">
                        </el-table-column>
                        <el-table-column
                                prop="remark"
                                label="报文操作"
xudada authored
92
                                width="250">
xudada authored
93 94 95 96
                            <template slot-scope="scope">
                                <el-button
                                        size="mini"
                                        type="primary"
xudada authored
97 98 99 100 101
                                        @click="handleDetail(scope.$index, scope.row)">查看明细</el-button>
                                <el-button
                                        size="mini"
                                        type="primary"
                                        @click="handleDelete(scope.$index, scope.row)">删除</el-button>
xudada authored
102 103 104
                            </template>
                        </el-table-column>
                    </el-table>
xudada authored
105
                </el-col>
xudada authored
106
            </el-row>
小范 authored
107 108 109 110 111 112
            <el-row>
                <div class="block">
                    <el-pagination
                            @size-change="handleSizeChange"
                            @current-change="handleCurrentChange"
                            :current-page="currentPage"
xudada authored
113 114
                            :page-sizes="[10, 20, 30, 40]"
                            :page-size="pageSize"
小范 authored
115
                            layout="total, sizes, prev, pager, next, jumper"
xudada authored
116
                            :total="total">
小范 authored
117 118 119
                    </el-pagination>
                </div>
            </el-row>
xudada authored
120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140
        </el-main>
    </el-container>
</template>
<style scoped>
    .grid-content {
        height: 36px;
        line-height: 36px;
    }
    .el-dialog__body{text-align: center}
    .content {
        border-left: 4px #409EFF solid;
        padding-left: 10px;
        background-color: #f9fafc;
        margin-bottom: 2px
    }

    .row-bg{
        background-color: white;
    }
</style>
<script>
xudada authored
141 142
    import {editRoute, selectRoute} from "../../api/transport";
xudada authored
143 144 145
    export default {
        data(){
            return{
小范 authored
146 147 148
                queryRoute:{
                    serialNo:undefined,
                },
小范 authored
149
                labelPosition:'left',
xudada authored
150 151 152 153
                currentPage: 1,
                pageSize:10,
                total:0,
                tableData:[],
小范 authored
154
                tableloading:false,
小范 authored
155 156 157
            }
        },
        methods: {
xudada authored
158
            //分页方法
小范 authored
159
            handleSizeChange(val) {
xudada authored
160
                this.pageSize=val;
小范 authored
161 162
            },
            handleCurrentChange(val) {
xudada authored
163
                this.currentPage=val;
xudada authored
164
                this.submitForm();
xudada authored
165 166 167
            },
            //获取航线列表
            submitForm(){
xudada authored
168
                let params={currentPage:this.currentPage,pageSize:this.pageSize,serialNo:this.queryRoute.serialNo};
xudada authored
169 170 171 172 173 174 175 176 177 178
                this.tableloading=true;
                selectRoute(params).then(res=>{
                    let response=res.data.data;
                    this.tableData=response.list;
                    this.tableloading=false;
                    this.total=response.total;
                     });
                },
            //编辑航线功能
            handleEdit(index,row){
xudada authored
179
                this.$router.push({path:'/route',query:row})
xudada authored
180 181 182
            },
            //获取默认值
            defaultData(){
xudada authored
183 184
                let ob=Object.assign(this.queryRoute, this.$route.query);
xudada authored
185 186 187 188 189 190 191 192 193 194 195 196 197 198 199 200 201 202 203 204 205 206 207 208 209 210 211 212
            },
            //列表删除功能
            handleDelete(index,row){
                    this.$confirm('此操作将永久删除该文件, 是否继续?', '提示', {
                        confirmButtonText: '确定',
                        cancelButtonText: '取消',
                        type: 'warning'
                    }).then(() => {
                        editRoute(row).then(res=>{
                            let response=res.data;
                            if(response.code=='200'){
                                this.$message({
                                    type: 'info',
                                    message: '删除成功'
                                });
                                this.submitForm();
                            }else{
                                this.$message({
                                    type: 'info',
                                    message: '删除失败'
                                });                            }
                        });
                    }).catch(() => {
                        this.$message({
                            type: 'info',
                            message: '已取消删除'
                        });
                    });
xudada authored
213 214
            }
        },
xudada authored
215 216 217 218 219
        //渲染方法
        mounted(){
            this.defaultData();
            this.submitForm();
        }
xudada authored
220 221
    }
</script>