朱兆平 / vue_cli · 提交

转到一个项目

作者 xudada
提交 7dafbf10d7b48399fd953193df19b99f5b929b6c 1 个父辈 cf70a4d6

新增出口订单申报，查询列表功能

内嵌 并排对比
正在显示 3 个修改的文件 包含 316 行增加 和 1 行删除
  1 +import axios from 'axios'
  2 +import http from "../http";
  3 +
  4 +let baseServiceURL = 'cross-border-service'
  5 +
  6 +
  7 +
  8 +//订单列表
  9 +export const selectLists = params => { return axios.get(`${baseServiceURL}/ExportOrderDeclaration/selectLists`, { params: params }); };
  10 +//订单申报
  11 +export const sendOrder = params => { return http.post(`${baseServiceURL}/ExportOrderDeclaration/sendOrder`, params); };
  12 +//上传EXCEL
  13 +export const UploadExcel = params => { return http.postExcelData(`${baseServiceURL}/ExportOrderDeclaration/upload`, params); };
@@ -193,7 +193,8 @@ import Dispatch from "./views/dispatch/Dispatch"; @@ -193,7 +193,8 @@ import Dispatch from "./views/dispatch/Dispatch";
193 import multiple from "./views/deploy/multiple"; 193 import multiple from "./views/deploy/multiple";
194 import satellite from "./views/deploy/satellite"; 194 import satellite from "./views/deploy/satellite";
195 195
196 - 196 +/*出口订单*/
  197 +import ExortOrder from './views/exportorder/Exportorder.vue'
197 198
198 let routes = [ 199 let routes = [
199 { 200 {
@@ -219,6 +220,15 @@ let routes = [ @@ -219,6 +220,15 @@ let routes = [
219 ] 220 ]
220 }, 221 },
221 { 222 {
  223 + path: '/order',
  224 + component: HomeNew,
  225 + name: '出口订单管理',
  226 + iconCls: 'el-icon-collection',
  227 + children: [
  228 + {path: '/ExortOrder', component: ExortOrder, name: '出口订单'}
  229 + ]
  230 + },
  231 + {
222 path: '/', 232 path: '/',
223 component: HomeNew, 233 component: HomeNew,
224 name: 'Charts', 234 name: 'Charts',
@@ -421,6 +431,7 @@ let routes = [ @@ -421,6 +431,7 @@ let routes = [
421 ] 431 ]
422 }, 432 },
423 433
  434 +
424 { 435 {
425 path: '/nmms2', 436 path: '/nmms2',
426 component: HomeNew, 437 component: HomeNew,
  1 +<template>
  2 + <div class="table-container">
  3 + <div>
  4 + <el-form :inline="true" :model="queryInfo" class="demo-form-inline">
  5 + <el-form-item label="订单号">
  6 + <el-input v-model="queryInfo.orderno" placeholder="订单号"></el-input>
  7 + </el-form-item>
  8 + <el-form-item label="订单类型">
  9 + <el-select v-model="queryInfo.ordertype" placeholder="请选择">
  10 + <el-option
  11 + v-for="item in ordertypes"
  12 + :key="item.value"
  13 + :label="item.label"
  14 + :value="item.value">
  15 + </el-option>
  16 + </el-select>
  17 + </el-form-item>
  18 + <el-form-item label="报送类型">
  19 + <el-select v-model="queryInfo.apptype" placeholder="请选择">
  20 + <el-option
  21 + v-for="item in apptypes"
  22 + :key="item.value"
  23 + :label="item.label"
  24 + :value="item.value">
  25 + </el-option>
  26 + </el-select>
  27 + </el-form-item>
  28 + <el-form-item label="报关状态">
  29 + <el-select v-model="queryInfo.appstatus" placeholder="请选择">
  30 + <el-option
  31 + v-for="item in appstatuss"
  32 + :key="item.value"
  33 + :label="item.label"
  34 + :value="item.value">
  35 + </el-option>
  36 + </el-select>
  37 + </el-form-item>
  38 + <el-form-item>
  39 + <el-button type="primary" @click="getList">查询</el-button>
  40 + </el-form-item>
  41 + <el-form-item>
  42 + <el-upload
  43 + class="upload-demo"
  44 + action=""
  45 + :before-upload="beforeUpload"
  46 + :http-request="uploadFile"
  47 + :show-file-list="false">
  48 + <el-button size="small" type="success">导入订单</el-button>
  49 + </el-upload>
  50 + </el-form-item>
  51 + </el-form>
  52 + </div>
  53 +
  54 + <el-table
  55 + :data="tableData"
  56 + style="width: 100%"
  57 + row-key="guid"
  58 + :expand-row-keys="expandedRowKeys"
  59 + @selection-change="handleSelectionChange"
  60 + border
  61 + stripe
  62 + >
  63 + <el-table-column type="expand" label="详细信息">
  64 + <template v-slot:default="{ row }">
  65 + <el-table
  66 + :data="row.exportOrderDeclarationBodyList"
  67 + style="width: 100%"
  68 + row-key="id"
  69 + stripe
  70 + >
  71 + <el-table-column prop="itemno" label="企业商品货号" />
  72 + <el-table-column prop="itemname" label="企业商品名称" />
  73 + <el-table-column prop="itemdescribe" label="企业商品描述" />
  74 + <el-table-column prop="barcode" label="条形码" />
  75 + <el-table-column prop="unit" label="计量单位" />
  76 + <el-table-column prop="currency" label="币制" />
  77 + <el-table-column prop="qty" label="数量" />
  78 + <el-table-column prop="price" label="单价" />
  79 + <el-table-column prop="totalprice" label="总价" />
  80 + <el-table-column prop="note" label="备注" />
  81 + <el-table-column
  82 + fixed="right"
  83 + label=""
  84 + width="120">
  85 + </el-table-column>
  86 + </el-table>
  87 + </template>
  88 + </el-table-column>
  89 + <el-table-column type="selection" width="55"></el-table-column>
  90 + <el-table-column prop="guid" label="GUID" width="180"></el-table-column>
  91 + <el-table-column prop="apptype" label="报送类型" width="120">
  92 + <template slot-scope="scope">
  93 + <span v-if="scope.row.apptype==='1'">
  94 + 新增
  95 + </span>
  96 + <span v-else>
  97 + 变更
  98 + </span>
  99 + </template>
  100 + </el-table-column>
  101 + <el-table-column prop="apptime" label="报送时间" width="180"></el-table-column>
  102 + <el-table-column prop="appstatus" label="报送状态" width="120">
  103 + <template slot-scope="scope">
  104 + <span v-if="scope.row.appstatus==='1'">
  105 + 暂存
  106 + </span>
  107 + <span v-else>
  108 + 申报
  109 + </span>
  110 + </template>
  111 + </el-table-column>
  112 + <el-table-column prop="ordertype" label="订单类型" width="120">
  113 + <template slot-scope="scope">
  114 + <span v-if="scope.row.ordertype==='E'">
  115 + B2C
  116 + </span>
  117 + <span v-else-if="scope.row.ordertype==='B'">
  118 + B2B
  119 + </span>
  120 + <span v-else>
  121 + 海外仓
  122 + </span>
  123 + </template>
  124 + </el-table-column>
  125 + <el-table-column prop="orderno" label="订单编号" width="180"></el-table-column>
  126 + <el-table-column prop="ebpname" label="电商平台" width="180"></el-table-column>
  127 + <el-table-column prop="goodsvalue" label="商品金额" width="120"></el-table-column>
  128 + <el-table-column prop="freight" label="运杂费" width="120"></el-table-column>
  129 + <el-table-column prop="note" label="备注" width="180"></el-table-column>
  130 + <el-table-column
  131 + fixed="right"
  132 + label="操作"
  133 + width="120"
  134 + show-overflow-tooltip>
  135 + <template slot-scope="scope">
  136 + <el-button type="success" @click="sendorder(scope.row)">申报</el-button>
  137 + </template>
  138 + </el-table-column>
  139 + </el-table>
  140 + <div class="block">
  141 + <el-pagination
  142 + @size-change="handleSizeChange"
  143 + @current-change="handleCurrentChange"
  144 + :current-page="queryInfo.pageNum"
  145 + :page-sizes="[20, 30, 40, 100]"
  146 + :page-size="queryInfo.pageSize"
  147 + layout="total, sizes, prev, pager, next, jumper"
  148 + :total="total">
  149 + </el-pagination>
  150 + </div>
  151 + </div>
  152 +</template>
  153 +
  154 +<script>
  155 + import {sendOrder,selectLists} from '../../api/consigner/exportOrder'
  156 + export default {
  157 + data() {
  158 + return {
  159 + apptypes: [
  160 + {
  161 + value: '1',
  162 + label: '新增'
  163 + }, {
  164 + value: '2',
  165 + label: '变更'
  166 + }
  167 + ],
  168 + appstatuss: [
  169 + {
  170 + value: '1',
  171 + label: '暂存'
  172 + }, {
  173 + value: '2',
  174 + label: '申报'
  175 + }
  176 + ],
  177 + ordertypes: [
  178 + {
  179 + value: 'E',
  180 + label: 'B2C出口订单'
  181 + }, {
  182 + value: 'B',
  183 + label: 'B2B出口订单'
  184 + }, {
  185 + value: 'W',
  186 + label: '海外仓订仓单'
  187 + }
  188 + ],
  189 + tableData: [],
  190 + selectedRows: [],
  191 + expandedRowKeys: [],
  192 + queryInfo:{
  193 + appstatus:'',
  194 + apptype:'',
  195 + orderno:'',
  196 + ordertype:'',
  197 + pageNum:1,
  198 + pageSize:20
  199 + },
  200 + total:0
  201 + };
  202 + },
  203 + mounted() {
  204 + // this.expandedRowKeys = this.tableData.map(item => item.guid);
  205 + this.getList();
  206 + },
  207 + methods: {
  208 + //导入订单excel
  209 + beforeUpload(file) {
  210 + // 检查文件类型
  211 + const isExcel = file.type === 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' || file.type === 'application/vnd.ms-excel';
  212 + if (!isExcel) {
  213 + this.$message.error('上传文件只能是 Excel 格式!');
  214 + return false; // 取消文件上传
  215 + }
  216 + return true; // 允许上传
  217 +
  218 + },
  219 + uploadFile({ file, onSuccess, onError }){
  220 + // 生成 FormData 对象
  221 + const formData = new FormData();
  222 + formData.append('file', file);
  223 + },
  224 + //订单申报
  225 + sendorder(row){
  226 + sendOrder(row).then((response)=>{
  227 + const res=response.data;
  228 + if (res.code !== '200') {
  229 + return this.$message.error('订单申报失败！')
  230 + }
  231 + this.$message.success('订单申报成功！');
  232 + this.getList();
  233 + }).catch(error=>{
  234 + this.$message.error(error.toString())
  235 + })
  236 + },
  237 + //订单列表查询
  238 + getList(){
  239 + selectLists(this.queryInfo).then((response) => {
  240 + const res = response.data
  241 + if (res.code !== '200') {
  242 + return this.$message.error('获取消息收发记录，失败！')
  243 + }
  244 + // 获取列表数据
  245 + this.tableData = res.data.list
  246 + // 获取列表的总记录数
  247 + this.total = res.data.total
  248 + this.$message.success('获取消息收发记录，成功！');
  249 + }).catch(error => {
  250 + // 关闭加载
  251 + this.$message.error(error.toString())
  252 + })
  253 + },
  254 + //分页
  255 + handleSizeChange(val) {
  256 + this.queryInfo.pageSize=val;
  257 + this.getList();
  258 + },
  259 + //分页
  260 + handleCurrentChange(val) {
  261 + this.queryInfo.pageNum=val;
  262 + this.getList();
  263 + },
  264 + //多选
  265 + handleSelectionChange(selection) {
  266 + this.selectedRows = selection;
  267 + }
  268 + }
  269 + };
  270 +</script>
  271 +
  272 +<style scoped>
  273 +
  274 +
  275 + .el-table {
  276 + border: 1px solid #ddd;
  277 + }
  278 +
  279 + .el-table th {
  280 + background-color: #f0f0f0;
  281 + }
  282 +
  283 + .el-table tr.el-table__row--striped > td {
  284 + background-color: #f8f8f8;
  285 + }
  286 +
  287 + .el-table td, .el-table th {
  288 + border: 1px solid #ddd;
  289 + padding: 8px;
  290 + }
  291 +</style>